/* Church Chairs Direct – design system (concept v2) */
:root{
  --amber:#ffb800;--amber-600:#e5a500;--amber-100:#fff4d1;
  --ink:#1c1d21;--ink-2:#4a4d57;--ink-3:#7b7f8b;
  --char:#222;--char-2:#2e2f34;--grey:#4f4f4f;
  --soft:#f0f1f7;--paper:#fafaf8;--line:#e4e5ec;--white:#fff;
  --ok:#1f8a4c;--err:#c8372d;
  --r-sm:8px;--r:14px;--r-lg:22px;--pill:999px;
  --sh-1:0 1px 2px rgba(20,20,30,.06),0 2px 8px rgba(20,20,30,.05);
  --sh-2:0 6px 24px rgba(20,20,30,.10);--sh-3:0 18px 50px rgba(20,20,30,.18);
  --f-head:"Oxanium",system-ui,sans-serif;--f-body:"Poppins",system-ui,sans-serif;
  --ease:cubic-bezier(.2,.7,.2,1);--hh:76px;
}
*,*:before,*:after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;font:400 16px/1.65 var(--f-body);color:var(--ink);background:var(--white);-webkit-font-smoothing:antialiased}
img,svg,video{max-width:100%;height:auto;display:block}
a{color:inherit}button{font:inherit;cursor:pointer}
h1,h2,h3,h4{font-family:var(--f-head);color:var(--char);line-height:1.15;margin:0 0 .5em;font-weight:600;letter-spacing:-.01em}
h1{font-size:clamp(2.1rem,4.6vw,3.6rem)}h2{font-size:clamp(1.6rem,3vw,2.4rem)}h3{font-size:1.25rem}
p{margin:0 0 1em}.lead{font-size:1.15rem;color:var(--ink-2);max-width:62ch}
.wrap{width:min(1240px,100% - 40px);margin-inline:auto}.narrow{width:min(860px,100% - 40px);margin-inline:auto}
.sec{padding:clamp(48px,7vw,96px) 0}.sec-soft{background:var(--soft)}.sec-dark{background:var(--char);color:#dcdde3}.sec-dark h2,.sec-dark h3{color:var(--amber)}
.eyebrow{font:600 .8rem/1 var(--f-head);letter-spacing:.16em;text-transform:uppercase;color:var(--amber-600);margin-bottom:12px;display:block}
.sec-dark .eyebrow{color:var(--amber)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.skip{position:absolute;left:12px;top:-60px;background:var(--amber);color:#111;padding:10px 16px;border-radius:var(--r-sm);z-index:200;font-weight:600}.skip:focus{top:12px}
:focus-visible{outline:3px solid var(--amber);outline-offset:3px;border-radius:4px}
.muted{color:var(--ink-3)}
/* buttons */
.btn{display:inline-flex;align-items:center;gap:.5em;justify-content:center;background:var(--amber);color:#1a1a1a;border:2px solid var(--amber);padding:12px 24px;border-radius:var(--pill);font:600 .95rem/1 var(--f-head);letter-spacing:.02em;text-decoration:none;transition:.2s var(--ease);white-space:nowrap}
.btn:hover{background:var(--amber-600);border-color:var(--amber-600);transform:translateY(-1px);box-shadow:var(--sh-2)}
.btn-dark{background:var(--char);border-color:var(--char);color:var(--amber)}.btn-dark:hover{background:#000;border-color:#000}
.btn-line{background:transparent;color:var(--char);border-color:var(--char)}.btn-line:hover{background:var(--char);color:var(--amber);border-color:var(--char)}
.btn-line.on-dark{color:#fff;border-color:#fff}.btn-line.on-dark:hover{background:#fff;color:#111}
.btn-sm{padding:8px 16px;font-size:.85rem}.btn-lg{padding:16px 30px;font-size:1.05rem}.btn-block{display:flex;width:100%}
.btn[disabled]{opacity:.5;pointer-events:none}
.link-arrow{font:600 .95rem var(--f-head);text-decoration:none;color:var(--char);border-bottom:2px solid var(--amber);padding-bottom:2px}.link-arrow:hover{color:var(--amber-600)}
.chip{display:inline-flex;align-items:center;gap:6px;border:1.5px solid var(--line);background:#fff;border-radius:var(--pill);padding:7px 15px;font:500 .88rem var(--f-body);transition:.15s;color:var(--ink)}
.chip:hover{border-color:var(--char)}.chip[aria-pressed=true],.chip.on{background:var(--char);border-color:var(--char);color:var(--amber)}
.tag{display:inline-block;font:500 .72rem/1 var(--f-body);background:var(--soft);color:var(--ink-2);padding:5px 9px;border-radius:6px}
.tag-amber{background:var(--amber-100);color:#7a5600}
/* top bar + header */
.topbar{background:var(--grey);color:#fff;font-size:.82rem}.topbar .wrap{display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:38px}
.topbar a{text-decoration:none;color:var(--amber);font-weight:500}.topbar .tb-r{display:flex;gap:18px;align-items:center}.topbar .tb-msg{color:#e9e9ee}
.hdr{position:sticky;top:0;z-index:100;background:rgba(34,34,34,.94);backdrop-filter:saturate(1.4) blur(12px);border-bottom:1px solid rgba(255,255,255,.06);transition:box-shadow .2s}
.hdr.scrolled{box-shadow:0 8px 30px rgba(0,0,0,.25)}
.hdr .wrap{display:flex;align-items:center;gap:28px;height:var(--hh)}
.logo img{height:52px;width:auto}
.nav{display:flex;gap:4px;align-items:center;margin-left:8px;flex:1}
.nav>li{list-style:none;position:relative}.nav ul{margin:0;padding:0}
.nav a.nl,.nav button.nl{display:flex;align-items:center;gap:6px;background:none;border:0;color:var(--amber);font:500 .95rem var(--f-head);padding:10px 12px;border-radius:8px;text-decoration:none}
.nav a.nl:hover,.nav button.nl:hover,.nav .open>button{color:#fff;background:rgba(255,255,255,.07)}
.nav a[aria-current=page]{color:#fff}
.hdr-actions{display:flex;gap:10px;align-items:center}
.icon-btn{position:relative;width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,.08);border:0;color:var(--amber);display:grid;place-items:center;transition:.2s}
.icon-btn:hover{background:rgba(255,255,255,.16)}.icon-btn svg{width:20px;height:20px}
.count{position:absolute;top:-2px;right:-2px;min-width:20px;height:20px;border-radius:10px;background:var(--amber);color:#111;font:700 .72rem/20px var(--f-body);text-align:center;padding:0 5px;transform:scale(0);transition:.25s var(--ease)}.count.on{transform:scale(1)}
.burger{display:none}
.mega{position:absolute;left:-120px;top:100%;width:min(920px,92vw);background:#fff;border-radius:var(--r-lg);box-shadow:var(--sh-3);padding:22px;display:none;grid-template-columns:repeat(3,1fr);gap:8px;z-index:50}
.nav .open .mega{display:grid;animation:pop .22s var(--ease)}
.mega a{display:flex;gap:12px;align-items:center;padding:8px;border-radius:12px;text-decoration:none;color:var(--ink)}.mega a:hover{background:var(--soft)}
.mega img{width:52px;height:52px;object-fit:contain;background:#fff;border:1px solid var(--line);border-radius:10px}
.mega b{font:600 .95rem var(--f-head);display:block;color:var(--char)}.mega small{color:var(--ink-3);font-size:.78rem}
.mega .mega-foot{grid-column:1/-1;display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);margin-top:6px;padding:14px 8px 0}
@keyframes pop{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
/* search overlay */
.ovl{position:fixed;inset:0;background:rgba(15,15,18,.6);backdrop-filter:blur(4px);z-index:300;display:none;align-items:flex-start;justify-content:center;padding:8vh 16px}
.ovl.open{display:flex;animation:fade .2s}
@keyframes fade{from{opacity:0}to{opacity:1}}
.search-box{width:min(720px,100%);background:#fff;border-radius:var(--r-lg);box-shadow:var(--sh-3);overflow:hidden}
.search-box input{width:100%;border:0;padding:22px 26px;font:500 1.15rem var(--f-body);outline:0;border-bottom:1px solid var(--line)}
.search-res{max-height:60vh;overflow:auto;padding:8px}
.sr-item{display:flex;gap:14px;align-items:center;padding:10px;border-radius:12px;text-decoration:none}.sr-item:hover,.sr-item.act{background:var(--soft)}
.sr-item img{width:56px;height:56px;object-fit:contain;border-radius:10px;background:#fff;border:1px solid var(--line)}
.sr-item b{font-family:var(--f-head);display:block}.sr-item small{color:var(--ink-3)}
.search-hint{padding:14px 22px;color:var(--ink-3);font-size:.85rem;display:flex;gap:8px;flex-wrap:wrap;align-items:center}
mark{background:var(--amber-100);color:inherit;border-radius:3px}
/* drawer */
.drawer-bg{position:fixed;inset:0;background:rgba(15,15,18,.55);z-index:310;opacity:0;pointer-events:none;transition:.25s}
.drawer-bg.open{opacity:1;pointer-events:auto}
.drawer{position:fixed;top:0;right:0;height:100%;width:min(440px,100%);background:#fff;z-index:320;transform:translateX(105%);transition:transform .35s var(--ease);display:flex;flex-direction:column;box-shadow:var(--sh-3)}
.drawer.open{transform:none}
.drawer-h{padding:20px 24px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center}.drawer-h h2{font-size:1.3rem;margin:0}
.drawer-b{flex:1;overflow:auto;padding:16px 24px}.drawer-f{padding:18px 24px;border-top:1px solid var(--line);background:var(--paper)}
.q-line{display:grid;grid-template-columns:64px 1fr auto;gap:14px;padding:14px 0;border-bottom:1px solid var(--line);align-items:start}
.q-line img{width:64px;height:64px;object-fit:contain;border:1px solid var(--line);border-radius:10px;background:#fff}
.q-line b{font-family:var(--f-head);display:block;line-height:1.2}.q-line small{color:var(--ink-3);display:block;line-height:1.4}
.x{background:none;border:0;color:var(--ink-3);font-size:1.3rem;line-height:1;padding:4px 8px;border-radius:6px}.x:hover{color:var(--err);background:var(--soft)}
.stepper{display:inline-flex;border:1.5px solid var(--line);border-radius:var(--pill);overflow:hidden;background:#fff}
.stepper button{width:34px;height:34px;border:0;background:none;font-size:1.1rem}.stepper button:hover{background:var(--soft)}
.stepper input{width:52px;text-align:center;border:0;font:600 .95rem var(--f-body);-moz-appearance:textfield;background:none}
.stepper input::-webkit-outer-spin-button,.stepper input::-webkit-inner-spin-button{-webkit-appearance:none}
.empty{text-align:center;padding:40px 10px;color:var(--ink-3)}
.toast{position:fixed;left:50%;bottom:26px;transform:translate(-50%,120px);background:var(--char);color:#fff;padding:14px 20px;border-radius:var(--pill);box-shadow:var(--sh-3);z-index:400;display:flex;gap:14px;align-items:center;transition:transform .4s var(--ease);font-size:.92rem}
.toast.on{transform:translate(-50%,0)}.toast a{color:var(--amber);font-weight:600;text-decoration:none}
/* mobile nav */
.mnav{position:fixed;inset:0;background:var(--char);z-index:330;padding:22px;transform:translateX(-105%);transition:transform .35s var(--ease);overflow:auto}
.mnav.open{transform:none}.mnav a{display:block;color:#fff;font:500 1.25rem var(--f-head);padding:14px 0;border-bottom:1px solid rgba(255,255,255,.08);text-decoration:none}
.mnav .mn-h{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}.mnav small{display:block;color:var(--amber);margin:18px 0 4px;font:600 .75rem var(--f-head);letter-spacing:.14em;text-transform:uppercase}
/* hero */
.hero{position:relative;color:#fff;background:#222;overflow:hidden;isolation:isolate}
.hero:before{content:"";position:absolute;inset:0;background:var(--bg) center/cover;z-index:-2;transform:scale(1.04);animation:kb 26s ease-out both}
.hero:after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,rgba(24,24,26,.94) 8%,rgba(24,24,26,.6) 52%,rgba(24,24,26,.25));z-index:-1}
@keyframes kb{to{transform:scale(1.12)}}
.hero-in{display:grid;grid-template-columns:1.15fr .85fr;gap:48px;align-items:center;padding:clamp(56px,9vw,120px) 0}
.hero h1{color:#fff}.hero h1 em{font-style:normal;color:var(--amber)}
.hero .lead{color:#e2e3e8;margin-bottom:28px}
.hero-cta{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:34px}
.trust{display:flex;gap:26px;flex-wrap:wrap;font-size:.88rem;color:#d5d6dc}.trust span{display:flex;gap:8px;align-items:center}.trust svg{width:20px;height:20px;color:var(--amber)}
.finder{background:rgba(255,255,255,.96);color:var(--ink);border-radius:var(--r-lg);padding:26px;box-shadow:var(--sh-3)}
.finder h2{font-size:1.35rem;margin-bottom:4px}.finder .step-lbl{font:600 .75rem var(--f-head);letter-spacing:.14em;color:var(--amber-600);text-transform:uppercase}
.finder .bar{height:4px;background:var(--soft);border-radius:2px;margin:12px 0 18px;overflow:hidden}.finder .bar i{display:block;height:100%;background:var(--amber);transition:width .35s var(--ease)}
.opts{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.opt{border:1.5px solid var(--line);background:#fff;border-radius:14px;padding:14px;text-align:left;transition:.15s;font:500 .92rem var(--f-body)}.opt:hover{border-color:var(--char);transform:translateY(-2px);box-shadow:var(--sh-1)}
.opt b{display:block;font-family:var(--f-head);font-size:1rem;color:var(--char)}.opt small{color:var(--ink-3);font-size:.78rem}
/* generic cards/grids */
.grid{display:grid;gap:22px}.g2{grid-template-columns:repeat(2,1fr)}.g3{grid-template-columns:repeat(3,1fr)}.g4{grid-template-columns:repeat(4,1fr)}.g5{grid-template-columns:repeat(5,1fr)}
.sec-h{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap;margin-bottom:34px}.sec-h h2{margin:0}
.cat-card{position:relative;display:block;border-radius:var(--r);overflow:hidden;background:var(--char);color:#fff;text-decoration:none;aspect-ratio:4/5;isolation:isolate;box-shadow:var(--sh-1);transition:.3s var(--ease)}
.cat-card:hover{transform:translateY(-4px);box-shadow:var(--sh-3)}
.cat-card .im{position:absolute;inset:0;background:#fff;display:grid;place-items:center;z-index:-1}
.cat-card .im img{width:100%;height:100%;object-fit:contain;padding:12px 12px 90px;transition:transform .5s var(--ease)}
.cat-card:hover .im img{transform:scale(1.06)}
.cat-card .tx{position:absolute;left:0;right:0;bottom:0;padding:18px;background:linear-gradient(0deg,rgba(28,28,30,.96) 62%,rgba(28,28,30,0))}
.cat-card b{display:block;font:600 1.15rem var(--f-head);color:var(--amber)}.cat-card small{color:#cfd0d6}
.pcard{position:relative;background:#fff;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;display:flex;flex-direction:column;transition:.25s var(--ease)}
.pcard:hover{box-shadow:var(--sh-2);transform:translateY(-3px);border-color:transparent}
.pcard .pim{position:relative;display:block;aspect-ratio:1;background:#fff}
.pcard .pim img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:10px;transition:opacity .35s}
.pcard .pim img+img{opacity:0}.pcard:hover .pim img+img{opacity:1}
.pcard .pb{padding:14px 16px 16px;display:flex;flex-direction:column;gap:6px;flex:1}
.pcard h3{font-size:1.05rem;margin:0}.pcard h3 a{text-decoration:none}.pcard h3 a:after{content:"";position:absolute;inset:0}
.pcard .pr{font-weight:600;color:var(--char);font-size:.92rem}.pcard .pr small{font-weight:400;color:var(--ink-3)}
.pcard .acts{display:flex;gap:8px;margin-top:auto;padding-top:10px;position:relative;z-index:2}
.pcard .badges{position:absolute;top:10px;left:10px;display:flex;gap:6px;z-index:2}
.cmp{position:absolute;top:10px;right:10px;z-index:3;background:rgba(255,255,255,.95);border:1px solid var(--line);border-radius:var(--pill);padding:4px 10px;font-size:.75rem;display:flex;gap:6px;align-items:center;cursor:pointer}
.cmp input{accent-color:var(--char)}
.hscroll{display:flex;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;padding:6px 2px 20px;scrollbar-width:none}.hscroll::-webkit-scrollbar{display:none}
.hscroll>*{flex:0 0 min(290px,78%);scroll-snap-align:start}
.arrows{display:flex;gap:8px}.arrows button{width:44px;height:44px;border-radius:50%;border:1.5px solid var(--char);background:#fff;font-size:1.1rem}.arrows button:hover{background:var(--char);color:var(--amber)}
.steps{counter-reset:s;display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.step{position:relative;padding:26px;border-radius:var(--r);background:#fff;border:1px solid var(--line)}
.step:before{counter-increment:s;content:"0" counter(s);font:700 2.6rem/1 var(--f-head);color:var(--amber);display:block;margin-bottom:12px}
.step h3{margin-bottom:6px}.step p{color:var(--ink-2);font-size:.92rem;margin:0}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;text-align:center}
.stats b{display:block;font:700 clamp(2.2rem,4vw,3.4rem)/1 var(--f-head);color:var(--amber)}.stats span{color:#cfd0d6;font-size:.92rem}
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,72px);align-items:center}
.frame{border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--sh-2);background:var(--soft)}.frame img{width:100%;height:100%;object-fit:cover}
.proj{position:relative;display:block;border-radius:var(--r);overflow:hidden;aspect-ratio:4/3;background:#ddd;border:0;padding:0;width:100%;text-align:left;color:#fff}
.proj img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}.proj:hover img{transform:scale(1.06)}
.proj .cap{position:absolute;left:0;right:0;bottom:0;padding:34px 16px 14px;background:linear-gradient(0deg,rgba(0,0,0,.78),transparent);font:500 .95rem var(--f-head)}.proj .cap small{display:block;font:400 .78rem var(--f-body);opacity:.85}
.quote-card{background:#fff;border-radius:var(--r-lg);padding:34px;box-shadow:var(--sh-1);position:relative}
.quote-card:before{content:"“";position:absolute;top:6px;left:22px;font:700 5rem/1 var(--f-head);color:var(--amber)}
.quote-card blockquote{margin:22px 0 18px;font-size:1.1rem;color:var(--ink)}.quote-card cite{font:600 .92rem var(--f-head);font-style:normal;color:var(--char)}.quote-card cite small{display:block;font:400 .82rem var(--f-body);color:var(--ink-3)}
.tslider{position:relative}.tslide{display:none}.tslide.on{display:block;animation:fade .5s}
.dots{display:flex;gap:8px;margin-top:18px}.dots button{width:10px;height:10px;border-radius:50%;border:0;background:#cfd1da;padding:0}.dots button.on{background:var(--amber);width:28px;border-radius:5px}
/* faq */
.faq details{border-bottom:1px solid var(--line);padding:4px 0}.faq summary{cursor:pointer;list-style:none;padding:18px 40px 18px 0;font:600 1.05rem var(--f-head);position:relative;color:var(--char)}
.faq summary::-webkit-details-marker{display:none}.faq summary:after{content:"+";position:absolute;right:6px;top:14px;font-size:1.6rem;color:var(--amber-600);transition:.2s}.faq details[open] summary:after{transform:rotate(45deg)}
.faq details p{color:var(--ink-2);padding:0 40px 18px 0;margin:0}
.cta-band{background:linear-gradient(120deg,var(--amber),#ffcf47);border-radius:var(--r-lg);padding:clamp(28px,5vw,56px);display:flex;justify-content:space-between;gap:24px;align-items:center;flex-wrap:wrap}
.cta-band h2{margin:0;color:#1a1a1a}.cta-band p{margin:6px 0 0;color:#3d3300}
/* page head, crumbs */
.phead{background:var(--char);color:#fff;padding:40px 0 44px;position:relative;overflow:hidden}
.phead h1{color:var(--amber);margin:6px 0 10px;font-size:clamp(1.9rem,4vw,3rem)}.phead p{color:#d5d6dc;max-width:70ch;margin:0}
.crumbs{font-size:.82rem;color:var(--ink-3);padding:16px 0;display:flex;flex-wrap:wrap;gap:6px}.crumbs a{text-decoration:none}.crumbs a:hover{color:var(--char);text-decoration:underline}.crumbs span[aria-hidden]{opacity:.5}
.phead .crumbs{padding:0 0 14px;color:#a9abb4}.phead .crumbs a:hover{color:#fff}
/* listing */
.tools{position:sticky;top:var(--hh);z-index:40;background:rgba(255,255,255,.96);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.tools .wrap{display:flex;gap:10px;align-items:center;flex-wrap:wrap;padding:12px 0}
.tools select,.field select{appearance:none;border:1.5px solid var(--line);border-radius:var(--pill);padding:8px 34px 8px 14px;font:500 .88rem var(--f-body);background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23222' stroke-width='2'/%3E%3C/svg%3E") right 13px center no-repeat}
.tools .grow{flex:1}.range{display:flex;align-items:center;gap:8px;font-size:.85rem}.range input{accent-color:var(--amber-600);width:120px}
.viewt button{border:1.5px solid var(--line);background:#fff;width:38px;height:38px;border-radius:10px}.viewt button.on{background:var(--char);color:var(--amber);border-color:var(--char)}
.list-view .pcard{flex-direction:row}.list-view .pcard .pim{width:180px;aspect-ratio:1;flex:none}.list-view.grid{grid-template-columns:1fr}
.result-note{padding:60px 20px;text-align:center;color:var(--ink-3);grid-column:1/-1}
.seo-copy{max-width:78ch}.seo-copy h2{font-size:1.6rem;margin-top:1.4em}.seo-copy p,.seo-copy li{color:var(--ink-2)}
.cmpbar{position:fixed;left:50%;bottom:18px;transform:translate(-50%,140px);background:var(--char);color:#fff;padding:12px 14px 12px 22px;border-radius:var(--pill);box-shadow:var(--sh-3);z-index:250;display:flex;gap:16px;align-items:center;transition:transform .35s var(--ease);max-width:96vw}
.cmpbar.on{transform:translate(-50%,0)}
.modal{position:fixed;inset:0;z-index:340;background:rgba(15,15,18,.6);backdrop-filter:blur(3px);display:none;align-items:center;justify-content:center;padding:20px}
.modal.open{display:flex;animation:fade .2s}.modal-in{background:#fff;border-radius:var(--r-lg);width:min(980px,100%);max-height:92vh;overflow:auto;position:relative;box-shadow:var(--sh-3)}
.modal-x{position:absolute;right:14px;top:14px;z-index:5;width:40px;height:40px;border-radius:50%;background:#fff;border:1px solid var(--line);font-size:1.2rem}
/* product page */
.pdp{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(24px,4vw,56px);align-items:start;padding-bottom:40px}
.gal{position:sticky;top:calc(var(--hh) + 20px)}
.gal-main{position:relative;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);aspect-ratio:1;overflow:hidden;cursor:zoom-in}
.gal-main img{width:100%;height:100%;object-fit:contain;padding:14px;transition:transform .25s var(--ease);transform-origin:var(--zx,50%) var(--zy,50%)}
.gal-main.zoom img{transform:scale(2.1)}
.gal-thumbs{display:flex;gap:10px;margin-top:12px;overflow:auto}.gal-thumbs button{flex:0 0 76px;height:76px;border:2px solid var(--line);border-radius:12px;background:#fff;padding:0;overflow:hidden}.gal-thumbs button.on{border-color:var(--amber)}
.gal-thumbs img{width:100%;height:100%;object-fit:contain}
.gal-tag{position:absolute;left:14px;top:14px;z-index:2}
.pdp h1{font-size:clamp(1.8rem,3.4vw,2.7rem);margin-bottom:8px}
.pfrom{font:600 1.4rem var(--f-head);color:var(--char)}.pfrom small{font:400 .85rem var(--f-body);color:var(--ink-3)}
.bul{list-style:none;padding:0;margin:18px 0;display:grid;gap:8px;font-size:.92rem}.bul li{display:flex;gap:10px;align-items:flex-start}.bul svg{width:18px;height:18px;flex:none;color:var(--ok);margin-top:4px}
.cfg{border:1px solid var(--line);border-radius:var(--r-lg);background:#fff;margin-top:22px;overflow:hidden}
.cfg-s{padding:20px 22px;border-bottom:1px solid var(--line)}.cfg-s:last-child{border:0}
.cfg-s>h3{display:flex;justify-content:space-between;align-items:baseline;font:600 1rem var(--f-head);margin:0 0 12px}.cfg-s>h3 span{font:500 .85rem var(--f-body);color:var(--ink-3)}
.cfg-s>h3 i{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--char);color:var(--amber);font:600 .8rem var(--f-head);margin-right:8px;font-style:normal}
.stains{display:flex;flex-wrap:wrap;gap:12px}.stain{width:64px;text-align:center;background:none;border:0;padding:0;font-size:.7rem;color:var(--ink-2);line-height:1.2}
.stain img{width:64px;height:64px;border-radius:12px;object-fit:cover;border:2px solid transparent;box-shadow:0 0 0 1px var(--line);transition:.15s;margin-bottom:5px}.stain:hover img{transform:scale(1.05)}.stain[aria-pressed=true] img{box-shadow:0 0 0 3px var(--char)}
.swatches{display:flex;flex-wrap:wrap;gap:8px}.sw{width:38px;height:38px;border-radius:50%;border:0;box-shadow:inset 0 0 0 1px rgba(0,0,0,.15);position:relative;transition:.15s;padding:0}.sw:hover{transform:scale(1.12)}.sw[aria-pressed=true]{box-shadow:0 0 0 2px #fff,0 0 0 4px var(--char)}
.sw-sq{border-radius:10px;width:54px;height:54px}
.tabs{display:flex;gap:4px;overflow:auto;border-bottom:1px solid var(--line);margin-bottom:14px}.tabs button{background:none;border:0;padding:10px 14px;font:500 .9rem var(--f-head);color:var(--ink-3);border-bottom:3px solid transparent;white-space:nowrap}.tabs button[aria-selected=true]{color:var(--char);border-color:var(--amber)}
.fab-ranges{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0}.fab-ranges .chip{padding:5px 12px;font-size:.82rem}
.finput{width:100%;border:1.5px solid var(--line);border-radius:12px;padding:10px 14px;font:400 .95rem var(--f-body);background:#fff}.finput:focus{outline:0;border-color:var(--char)}
.chk{display:flex;gap:12px;align-items:center;border:1.5px solid var(--line);border-radius:12px;padding:10px 14px;margin-bottom:8px;cursor:pointer;transition:.15s;font-size:.92rem}.chk:hover{border-color:var(--ink-3)}.chk:has(input:checked){border-color:var(--char);background:var(--amber-100)}
.chk input{accent-color:var(--char);width:18px;height:18px}
.summary{background:var(--char);color:#dcdde3;border-radius:var(--r-lg);padding:22px;margin-top:22px}
.summary h3{color:var(--amber);margin-bottom:12px}.summary dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:6px 16px;font-size:.88rem}.summary dt{color:#a9abb4}.summary dd{margin:0;text-align:right;color:#fff}
.summary .tot{display:flex;justify-content:space-between;align-items:baseline;border-top:1px solid rgba(255,255,255,.14);margin-top:14px;padding-top:14px}.summary .tot b{font:700 1.7rem var(--f-head);color:var(--amber)}
.summary .row-b{display:flex;gap:10px;margin-top:16px;flex-wrap:wrap}.summary .btn{flex:1}
table.spec{width:100%;border-collapse:collapse;font-size:.92rem}.spec th,.spec td{padding:11px 14px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}.spec th{width:38%;background:var(--soft);font:600 .85rem var(--f-head)}
.prose p{color:var(--ink-2)}.prose h2{font-size:1.5rem;margin-top:1.4em}.prose h3{margin-top:1.2em}.prose ul{color:var(--ink-2)}.prose a{color:#8a5f00}
.stickybar{position:fixed;left:0;right:0;bottom:0;background:#fff;border-top:1px solid var(--line);box-shadow:0 -8px 30px rgba(0,0,0,.1);padding:10px 16px;z-index:90;display:none;gap:12px;align-items:center;transform:translateY(100%);transition:.3s var(--ease)}
.stickybar.on{transform:none}.stickybar b{font-family:var(--f-head);line-height:1.1}.stickybar small{display:block;color:var(--ink-3)}
.lightbox{position:fixed;inset:0;background:rgba(10,10,12,.92);z-index:360;display:none;align-items:center;justify-content:center;padding:30px}.lightbox.open{display:flex;animation:fade .2s}
.lightbox img{max-height:86vh;max-width:92vw;object-fit:contain;border-radius:10px}.lightbox .lb-cap{position:absolute;bottom:20px;left:0;right:0;text-align:center;color:#ddd;font-size:.9rem}
.lb-b{position:absolute;top:50%;transform:translateY(-50%);width:52px;height:52px;border-radius:50%;background:rgba(255,255,255,.14);border:0;color:#fff;font-size:1.5rem}.lb-b:hover{background:rgba(255,255,255,.28)}.lb-p{left:20px}.lb-n{right:20px}.lb-x{position:absolute;right:20px;top:20px;width:46px;height:46px;border-radius:50%;background:rgba(255,255,255,.14);border:0;color:#fff;font-size:1.3rem}
/* forms */
.form{display:grid;gap:16px}.form .row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.field label{display:block;font:600 .85rem var(--f-head);margin-bottom:6px;color:var(--char)}
.field input,.field textarea,.field select{width:100%;border:1.5px solid var(--line);border-radius:12px;padding:12px 14px;font:400 .95rem var(--f-body);background:#fff}
.field input:focus,.field textarea:focus,.field select:focus{outline:0;border-color:var(--char);box-shadow:0 0 0 4px var(--amber-100)}
.field .err{color:var(--err);font-size:.8rem;margin-top:4px;display:none}.field.bad input,.field.bad textarea{border-color:var(--err)}.field.bad .err{display:block}
.okbox{background:#e8f6ee;border:1px solid #b6e0c6;border-radius:var(--r);padding:22px;color:#14532d;display:none}.okbox.on{display:block;animation:pop .3s}
.qtable{width:100%;border-collapse:collapse}.qtable th{font:600 .8rem var(--f-head);text-align:left;color:var(--ink-3);text-transform:uppercase;letter-spacing:.08em;padding:10px 8px;border-bottom:2px solid var(--char)}.qtable td{padding:14px 8px;border-bottom:1px solid var(--line);vertical-align:middle}
.qtable img{width:64px;height:64px;object-fit:contain;border:1px solid var(--line);border-radius:10px}
.qtable input.unit{width:96px;border:1.5px solid var(--line);border-radius:10px;padding:7px 9px;font:500 .9rem var(--f-body)}
.totals{background:var(--soft);border-radius:var(--r);padding:22px}.totals div{display:flex;justify-content:space-between;padding:6px 0}.totals .t{border-top:2px solid var(--char);margin-top:8px;padding-top:12px;font:700 1.4rem var(--f-head)}
.switch{display:flex;gap:10px;align-items:center;font-size:.9rem;cursor:pointer}.switch input{accent-color:var(--char);width:18px;height:18px}
.note{background:var(--amber-100);border:1px dashed var(--amber-600);border-radius:12px;padding:12px 16px;font-size:.86rem;color:#5b4300}
/* fabrics */
.rng{background:#fff;border:1.5px solid var(--line);border-radius:var(--r);padding:14px;text-align:left;transition:.2s;width:100%}.rng:hover,.rng[aria-pressed=true]{border-color:var(--char);box-shadow:var(--sh-1)}
.rng .strip{display:flex;height:34px;border-radius:8px;overflow:hidden;margin-bottom:10px}.rng .strip i{flex:1}
.rng b{font:600 1rem var(--f-head);display:block;color:var(--char)}.rng small{color:var(--ink-3)}
.drop{border:2px dashed #bfc2cd;border-radius:var(--r-lg);padding:36px;text-align:center;background:#fff;transition:.2s}.drop.hot{border-color:var(--amber-600);background:var(--amber-100)}
.pal{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;margin-top:20px}.pal>div{background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden}.pal i{display:block;height:64px}.pal input{border:0;width:100%;padding:8px 10px;font:500 .82rem var(--f-body)}.pal small{padding:0 10px 8px;display:block;color:var(--ink-3);font-size:.72rem}
/* catalogues */
.book{perspective:900px}.book .cv{aspect-ratio:3/4;border-radius:6px 14px 14px 6px;background:var(--char);color:#fff;padding:22px;display:flex;flex-direction:column;justify-content:flex-end;box-shadow:-6px 6px 0 rgba(0,0,0,.12),var(--sh-2);transform:rotateY(-14deg);transform-origin:left center;transition:transform .5s var(--ease);border-left:8px solid var(--amber);cursor:pointer;background-size:cover;background-position:center;position:relative;overflow:hidden}
.book .cv:before{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(20,20,22,.92),rgba(20,20,22,.2))}.book .cv>*{position:relative}
.book:hover .cv{transform:rotateY(-2deg) translateY(-6px)}.book b{font:600 1.25rem var(--f-head);color:var(--amber)}
.pages{display:grid;grid-template-columns:1fr 1fr;gap:4px;background:#ddd;padding:4px;border-radius:8px;aspect-ratio:3/2;perspective:1400px}.pages>div{background:#fff;display:grid;place-items:center;color:var(--ink-3);font:600 1.1rem var(--f-head);background-size:cover;background-position:center}
.pages .turn{animation:turn .6s var(--ease)}@keyframes turn{from{transform:rotateY(-80deg);opacity:.2}to{transform:none;opacity:1}}
/* footer */
.ftr{background:#17181b;color:#b9bbc4;padding:64px 0 26px;font-size:.92rem}.ftr h4{color:var(--amber);font:600 .9rem var(--f-head);letter-spacing:.12em;text-transform:uppercase;margin-bottom:14px}
.ftr a{display:block;text-decoration:none;color:#b9bbc4;padding:4px 0}.ftr a:hover{color:#fff}.ftr .cols{display:grid;grid-template-columns:1.3fr 1fr 1fr 1.3fr;gap:36px;margin-bottom:36px}
.ftr .legal{border-top:1px solid #2b2c31;padding-top:22px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:.82rem}
.ftr img{height:54px;width:auto;margin-bottom:16px}
.nl{display:flex;gap:8px;margin-top:10px}.nl input{flex:1;border-radius:var(--pill);border:0;padding:12px 16px;font:400 .92rem var(--f-body);min-width:0}
/* reveal */
.rv{opacity:0;transform:translateY(22px);transition:opacity .7s var(--ease),transform .7s var(--ease)}.rv.in{opacity:1;transform:none}
.blog-card{display:block;text-decoration:none;background:#fff;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;transition:.25s}.blog-card:hover{box-shadow:var(--sh-2);transform:translateY(-3px)}
.blog-card .im{aspect-ratio:16/10;background:var(--soft) center/cover}.blog-card .bd{padding:18px}.blog-card h3{font-size:1.1rem;margin:8px 0}.blog-card p{font-size:.9rem;color:var(--ink-2);margin:0}
.toc{background:var(--soft);border-radius:var(--r);padding:18px 22px;font-size:.92rem}.toc a{display:block;padding:4px 0;text-decoration:none;color:var(--ink-2)}.toc a:hover{color:var(--char)}
.contact-card{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:24px}
.tl{display:grid;gap:14px}.tl-i{display:grid;grid-template-columns:110px 1fr;gap:16px;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:16px 18px}.tl-i b{font:700 .8rem var(--f-head);letter-spacing:.1em;text-transform:uppercase;color:var(--amber-600)}
.tbl{width:100%;border-collapse:collapse;background:#fff;border-radius:var(--r);overflow:hidden;border:1px solid var(--line)}.tbl th,.tbl td{padding:12px 14px;border-bottom:1px solid var(--line);text-align:left;font-size:.9rem;vertical-align:top}.tbl th{background:var(--soft);font:600 .8rem var(--f-head);text-transform:uppercase;letter-spacing:.06em}
@media(max-width:1020px){
  .nav,.hdr-actions .btn{display:none}.burger{display:grid}.hdr .wrap{gap:12px}.hdr-actions{margin-left:auto}
  .hero-in,.pdp,.split{grid-template-columns:1fr}.gal{position:static}.g4,.g5{grid-template-columns:repeat(2,1fr)}.g3{grid-template-columns:repeat(2,1fr)}.steps,.stats{grid-template-columns:repeat(2,1fr)}
  .ftr .cols{grid-template-columns:1fr 1fr}.stickybar{display:flex}.topbar .tb-msg{display:none}
}
@media(max-width:620px){
  .g2,.g3,.g4,.g5,.steps{grid-template-columns:1fr}.g4.keep2,.g3.keep2{grid-template-columns:repeat(2,1fr)}.form .row{grid-template-columns:1fr}
  .opts{grid-template-columns:1fr}.ftr .cols{grid-template-columns:1fr}.tl-i{grid-template-columns:1fr}.tools{top:var(--hh)}.list-view .pcard{flex-direction:column}.list-view .pcard .pim{width:auto}
  .qtable thead{display:none}.qtable tr{display:grid;grid-template-columns:64px 1fr;gap:6px 12px;padding:14px 0;border-bottom:1px solid var(--line)}.qtable td{border:0;padding:2px 0}
  .logo img{height:44px}.pcard h3{font-size:.95rem}.pcard .acts .btn{padding:8px 12px;font-size:.78rem}
}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.rv{opacity:1;transform:none}}
@media print{.topbar,.hdr,.ftr,.drawer,.toast,.stickybar,.no-print{display:none!important}body{font-size:12px}}
.nav a.nl,.nav button.nl{white-space:nowrap}
@media(max-width:1180px){.nav a.nl,.nav button.nl{padding:10px 8px;font-size:.9rem}.hdr .wrap{gap:14px}.hdr-actions .btn{display:none}}
