/* ==== FABRIC SWATCH ==== */
.swatch{aspect-ratio:4/3;border-radius:var(--r2);background-color:var(--sw);background-image:repeating-linear-gradient(0deg,var(--sw-d) 0 1px,transparent 1px 4px),repeating-linear-gradient(90deg,var(--sw-l) 0 1px,transparent 1px 4px)}
.swatch-lg{aspect-ratio:3/4;border-radius:var(--r1);box-shadow:10px 10px 0 var(--n4)}

/* ==== BUTTONS (extra) ==== */
.btn-lg{padding:16px 34px;font-size:1.08rem}
.obtn{margin-top:18px}
.btn-o{background:transparent;color:var(--a1);border:1px solid var(--a1)}
.btn-o:hover{background:var(--a2)}
.add-btn{display:none}
html.with-js .add-btn{display:inline-block}
[data-cc-reset]{display:none}
html.with-js [data-cc-reset]{display:inline-block}

/* ==== CATALOG ==== */
.cat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin-top:30px}
.pcard{background:var(--n3);border-radius:var(--r1);padding:16px;box-shadow:8px 8px 0 var(--n4)}
.pcard-media{margin-bottom:14px}
.pcard-b{padding:2px}
.pcard-h{font-size:1.2rem;margin:0 0 6px}
.pcard-lnk{text-decoration:none;color:var(--n6)}
.pcard-lnk:hover{color:var(--a1)}
.pcard-col{margin:0 0 8px;color:var(--n8);font-size:.92rem}
.pcard-price{margin:0 0 6px;font-family:'Oswald','Oswald Fallback',Arial,sans-serif;font-size:1.25rem;color:var(--a1)}
.pcard-tax{display:block;font-family:'Source Serif 4','Source Serif 4 Fallback',Georgia,serif;font-size:.82rem;color:var(--n8)}
.cat-note{margin-top:32px;color:var(--n8);font-size:.94rem}

/* ==== PRODUCT ==== */
.crumb{color:var(--n8);font-size:.9rem;margin-bottom:22px}
.crumb a{color:var(--a1);text-decoration:none}
.crumb span{padding-inline:6px}

.prod-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:44px;align-items:start}
.prod-media{position:sticky;top:160px}
.swatch-cap{margin-top:24px;color:var(--n8);font-size:.9rem}

.prod-h{font-size:clamp(1.8rem,3.6vw,2.6rem);margin-bottom:10px}
.prod-price{font-family:'Oswald','Oswald Fallback',Arial,sans-serif;font-size:2rem;color:var(--a1);margin:0 0 4px}
.prod-tax{font-size:.9rem;color:var(--n8);margin:0 0 16px}
.prod-tax a,.pcard-tax a{color:var(--a1)}
.prod-col{margin:0 0 6px}
.prod-mass{color:var(--n8);margin:0 0 14px}

.buy{margin:20px 0;background:var(--n3);border-radius:var(--r1);padding:22px}
.size-fs{border:0;margin:0 0 18px;padding:0;display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.size-lg{font-family:'Oswald','Oswald Fallback',Arial,sans-serif;width:100%;margin-bottom:6px;padding:0}
.size-opt{display:inline-flex;align-items:center;gap:7px;min-height:44px;padding:0 14px;border:1px solid var(--n4);border-radius:999px;background:var(--n2);cursor:pointer}
.size-rd{margin:0}
.size-lbl{font-family:'Oswald','Oswald Fallback',Arial,sans-serif}
.size-off{opacity:.9;background:transparent;cursor:not-allowed}
.size-off .size-lbl{text-decoration:line-through;color:var(--n8)}
.size-x{font-size:.74rem;color:hsl(2 58% 42%)}

.qty{display:flex;align-items:center;gap:12px;margin-bottom:16px}
.qty-l{font-family:'Oswald','Oswald Fallback',Arial,sans-serif}
.qty-in{width:84px;min-height:44px;padding:8px 12px;border:1px solid var(--n4);border-radius:var(--r2);font-size:1rem;background:var(--n2)}
.add-note{margin:12px 0 0;color:var(--a1);font-family:'Oswald','Oswald Fallback',Arial,sans-serif}
.prod-ship{color:var(--n8);font-size:.92rem}
.prod-ship a{color:var(--a1)}

.prod-more{margin-top:40px;max-width:760px}
.acc{border-top:1px solid var(--n4);padding:8px 0}
.acc-h{font-family:'Oswald','Oswald Fallback',Arial,sans-serif;font-size:1.15rem;cursor:pointer;padding:12px 0;list-style:none}
.acc-h::-webkit-details-marker{display:none}
.acc-h::after{content:' +';color:var(--a1)}
.acc[open] .acc-h::after{content:' \2212'}
.acc-p{padding:4px 0 16px;color:var(--n6)}
.acc-p a{color:var(--a1)}

/* ==== CART ==== */
.cart{margin:10px 0 30px}
.cart-fallback,.cart-empty{background:var(--n3);border-radius:var(--r1);padding:24px}
.cart-msg{background:var(--a2);color:var(--n5);border-radius:var(--r2);padding:12px 16px;margin-bottom:16px}
.cart-list{list-style:none;margin:0 0 24px;padding:0}
.ci{display:grid;grid-template-columns:84px 1fr auto;gap:18px;align-items:center;padding:18px 0;border-bottom:1px solid var(--n4)}
.ci-media{width:84px}
.ci-media .swatch{aspect-ratio:1/1}
.ci-h{margin:0 0 4px;font-family:'Oswald','Oswald Fallback',Arial,sans-serif;font-size:1.1rem}
.ci-vars{margin:0 0 8px;color:var(--n8);font-size:.9rem}
.ci-qty{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.ci-step{width:44px;height:44px;border-radius:999px;border:1px solid var(--n4);background:var(--n2);font-size:1.2rem;cursor:pointer}
.ci-qn{min-width:24px;text-align:center;font-family:'Oswald','Oswald Fallback',Arial,sans-serif}
.ci-rm{background:transparent;border:0;color:var(--a1);cursor:pointer;min-height:44px;padding:0 8px;text-decoration:underline}
.ci-price{font-family:'Oswald','Oswald Fallback',Arial,sans-serif;font-size:1.15rem;white-space:nowrap}

.sumbox{background:var(--n3);border-radius:var(--r1);padding:22px;max-width:420px;margin-left:auto}
.sum-row{display:flex;justify-content:space-between;padding:6px 0}
.sum-l{color:var(--n8)}
.sum-v{font-family:'Oswald','Oswald Fallback',Arial,sans-serif}
.sum-total{border-top:1px solid var(--n4);margin-top:8px;padding-top:12px;font-size:1.2rem}
.sum-total .sum-l{color:var(--n6)}
.sum-tax{margin:12px 0 0;color:var(--n8);font-size:.85rem}

/* ==== CHECKOUT FORM ==== */
.co-form{max-width:640px;margin-top:10px}
.co-step{font-size:1.4rem;margin:28px 0 14px}
.co-geo{background:var(--a2);color:var(--n5);border-radius:var(--r2);padding:12px 16px;font-size:.92rem}
.fld{margin-bottom:10px;display:flex;flex-direction:column}
.fld-l{font-family:'Oswald','Oswald Fallback',Arial,sans-serif;margin-bottom:4px}
.fld-in{min-height:46px;padding:10px 14px;border:1px solid var(--n4);border-radius:var(--r2);background:var(--n2);font-family:inherit;font-size:1rem}
textarea.fld-in{min-height:70px}
.fld-err{color:hsl(2 58% 42%);font-size:.86rem;margin-top:6px;min-height:0}
.fld-row{flex-direction:row;gap:16px}
.fld-col{display:flex;flex-direction:column;flex:1}
.opt{color:var(--n8);font-weight:400;font-size:.85rem}

.pay-box{background:var(--n3);border-radius:var(--r1);padding:18px;margin-bottom:18px}
.pay-opt{display:flex;gap:10px;align-items:flex-start}
.order-sum{margin:18px 0}
.agree{display:flex;gap:10px;align-items:flex-start;margin:6px 0}
.agree a,.co-ds a{color:var(--a1)}
.co-ds{color:var(--n8);font-size:.9rem}
.co-msg{background:var(--n3);border-radius:var(--r2);padding:14px 16px;margin-top:16px}

/* ==== CONTACT ==== */
.contact-grid{display:grid;grid-template-columns:1.3fr 1fr;gap:32px;align-items:start;margin-top:18px}
.contact-form-box{background:var(--n3);border-radius:var(--r1);padding:22px}
.cform .btn{margin-top:4px}
.contact-info{background:var(--n5);color:var(--n7);border-radius:var(--r1);padding:22px}
.cinfo-h{font-family:'Oswald','Oswald Fallback',Arial,sans-serif;font-size:1.1rem;margin:0 0 8px;color:var(--n7)}
.cinfo-addr{font-style:normal;margin:0 0 12px}
.cinfo-line{margin:0 0 6px;line-height:1.5}
.cinfo-addr a{color:hsl(218 70% 74%)}
.contact-intro{max-width:64ch}
.contact-more{margin-top:40px}
.contact-sec{padding-top:20px}
.contact-sec .sec-t{max-width:none;font-size:clamp(1.7rem,3vw,2.2rem);margin-bottom:14px}
.contact-lead{font-size:1.18rem;color:var(--n8);margin:0 0 16px;max-width:60ch}
.cinfo-hours{margin:0 0 12px;color:hsl(220 20% 80%)}
.cinfo-note{color:hsl(220 20% 80%);font-size:.92rem;margin:0}
.cinfo-note a{color:hsl(218 70% 74%)}

/* ==== CONFIRMATION ==== */
.conf{min-height:40vh}
.conf-neutral{background:var(--n3);border-radius:var(--r1);padding:28px}
.conf-no{font-family:'Oswald','Oswald Fallback',Arial,sans-serif;font-size:1.4rem;color:var(--a1)}
.conf-mail{color:var(--n8)}
.conf-list{list-style:none;margin:0 0 20px;padding:0}
.conf-line{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid var(--n4)}
.cl-name{flex:1}
.cl-q{color:var(--n8)}
.cl-price{font-family:'Oswald','Oswald Fallback',Arial,sans-serif;white-space:nowrap}
.conf-addr{background:var(--n3);border-radius:var(--r1);padding:20px;margin:20px 0}
.conf-next{color:var(--n8)}
.conf-next a{color:var(--a1)}

/* ==== LEGAL ==== */
.legal-stand{color:var(--n8);font-size:.9rem;margin-bottom:22px}
.toc{background:var(--n3);border-radius:var(--r1);padding:20px 24px;margin-bottom:32px}
.toc-list{margin:0;padding-left:20px;columns:2;gap:20px}
.toc-list li{margin-bottom:6px}
.toc-list a{color:var(--a1);text-decoration:none}
.legal-card{background:var(--n2);border:1px solid var(--n4);border-radius:var(--r1);padding:26px;margin-bottom:22px}
.legal-h{font-size:1.4rem;margin:0 0 14px}
.legal-h3{font-size:1.1rem;margin:18px 0 8px}
.card-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:22px}
.purpose-card{background:var(--n2);border:1px solid var(--n4);border-radius:var(--r1);padding:22px}
.rt{width:100%;border-collapse:collapse;overflow-wrap:anywhere}
.rt-cap{text-align:left;font-family:'Oswald','Oswald Fallback',Arial,sans-serif;color:var(--n8);margin-bottom:10px}
.rt th,.rt td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--n4);vertical-align:top}
.rt th{width:38%;font-weight:500;font-family:'Oswald','Oswald Fallback',Arial,sans-serif}
.rt a{color:var(--a1)}
.muster-hint{color:var(--n8);font-style:italic}
.muster{background:var(--n3);border-radius:var(--r1);padding:22px}
.muster p{margin:0 0 10px}
.muster-star{color:var(--n8);font-size:.88rem}
.cc-reset-msg{margin-top:12px;color:var(--a1)}

/* ==== THANKS / 404 ==== */
.thanks-card{background:var(--n3);border-radius:var(--r1);padding:36px}
.nf-list{margin:10px 0 0;padding-left:20px}
.nf-list li{margin-bottom:8px}
.nf-list a{color:var(--a1)}

@media(max-width:900px){
    .cat-grid{grid-template-columns:1fr 1fr}
    .prod-grid{grid-template-columns:1fr;gap:28px}
    .prod-media{position:static}
    .swatch-lg{aspect-ratio:4/3;max-width:420px}
    .contact-grid{grid-template-columns:1fr;gap:26px}
    .card-grid{grid-template-columns:1fr}
}

@media(max-width:560px){
    .cat-grid{grid-template-columns:1fr}
    .fld-row{flex-direction:column;gap:16px}
    .toc-list{columns:1}
    .ci{grid-template-columns:64px 1fr;grid-template-areas:'m i' 'p p'}
    .ci-media{grid-area:m}
    .ci-info{grid-area:i}
    .ci-price{grid-area:p}
    .sumbox{margin-left:0}
}
