/* ==========================================================================
   آسانسور نوروزی — site.css
   Design language: «Night & Champagne» — quiet, modern luxury.
   Neutral night + soft champagne + warm stone paper; the photographs of the
   cabins carry the colour, the interface stays calm around them.
   Token names keep "gold" (components name a role, never a colour).

   Rules this file keeps (see docs/README):
   · no letter-spacing on Persian text — tracking lives only on .en/.code/.num
   · every font is self-hosted (no CDN — Iran network)
   · sections declare data-theme="dark|light"; the header repaints to match
   ========================================================================== */

/* ---------- fonts ----------
   One variable file (111 KB) instead of five static weights (5 × 51 KB). It carries the Latin
   glyphs too, so English labels are Vazirmatn as well — no serif fallback on phones. */
@font-face{font-family:"Vazirmatn";src:url(../fonts/Vazirmatn-wght.woff2) format("woff2-variations"),url(../fonts/Vazirmatn-wght.woff2) format("woff2");font-weight:100 900;font-style:normal;font-display:swap}

/* ---------- tokens ---------- */
:root{
  /* brand colours as triplets, so every translucent use follows the palette */
  --gold-rgb:200,169,126; --gold-deep-rgb:118,90,60; --gold-soft-rgb:230,211,179; --on-dark-rgb:241,239,235;
  --night-rgb:12,12,13; --shade-rgb:7,7,8; --ink-rgb:22,22,22; --paper-rgb:245,243,239; --white-rgb:252,251,249; --shadow-rgb:28,24,20;
  --on-gold:#17130f;          /* text on gold buttons and chips */
  --gold-tint:#f7f3ed;        /* a whisper of gold on paper (selected options) */
  --night-0:#070708;          /* the footer, darker than the darkest section */

  /* night */
  --night:#0c0c0d;
  --night-2:#141416;
  --night-3:#1c1c1f;
  --night-4:#26262a;
  /* stone paper */
  --paper:#f5f3ef;
  --paper-2:#ece8e1;
  --paper-3:#ddd6ca;
  --white:#fcfbf9;
  /* ink */
  --ink:#161616;
  --ink-2:#3a3834;
  --muted:#655f57;           /* body-muted on paper — 5.7:1, 5.2:1 on paper-2 */
  --on-dark:#f1efeb;
  --on-dark-2:rgba(var(--on-dark-rgb),.68);
  --on-dark-3:rgba(var(--on-dark-rgb),.52);   /* captions on night and night-2 — ≥5:1 */
  /* champagne */
  --gold:#c8a97e;
  --gold-soft:#e6d3b3;
  --gold-hi:#f1e4cc;
  --gold-deep:#765a3c;       /* champagne as TEXT on paper — 5.7:1 paper, 5.2:1 paper-2 */
  --gold-ink:#654b30;        /* small champagne text on paper — ≥6.6:1 */
  --gold-grad:linear-gradient(105deg,#765a3c 0%,#e6d3b3 38%,#c8a97e 62%,#f1e4cc 85%,#c8a97e 100%);
  --gold-btn:linear-gradient(180deg,#e6d2b0 0%,#c3a376 100%);
  /* lines */
  --line-dark:rgba(var(--gold-rgb),.24);
  --line-dark-2:rgba(var(--on-dark-rgb),.10);
  --line-light:rgba(var(--gold-deep-rgb),.22);
  --line-light-2:rgba(var(--ink-rgb),.09);
  /* brand utility */
  --wa:#25d366;
  /* type */
  --ff:"Vazirmatn",Tahoma,"Segoe UI",system-ui,sans-serif;
  --ff-mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  /* type — ONE scale; never write a raw font-size in a component.
     Fixed steps for UI text, fluid steps only for headings. 12px is for Latin codes, tags and
     counters — never Persian running text. Nothing a visitor types into is below 16px. */
  --t-2xs:12px;                        /* codes, tags, counters */
  --t-xs:13px;                         /* captions, meta, hints, errors */
  --t-sm:14px;                         /* secondary text, chips, compact labels */
  --t-base:16px;                       /* body, inputs, buttons */
  --t-md:18px;                         /* card titles */
  --t-lg:20px;                         /* small fixed headings */
  --t-title:clamp(16px,1.3vw,18px);    /* titles that grow with the screen */
  --t-h4:clamp(22px,2.2vw,30px);
  --t-h3:clamp(18px,1.55vw,24px);
  --t-h2:clamp(29px,3.6vw,52px);
  --t-h1:clamp(34px,4.6vw,66px);
  --t-display:clamp(38px,5.6vw,84px);
  --t-num:clamp(36px,3.6vw,54px);      /* big figures */
  --t-lead:clamp(16px,1.3vw,20px);
  --t-body:16px;
  --t-prose:clamp(16px,1.15vw,18px);   /* long-form article text */
  /* space */
  --gutter:clamp(18px,4.6vw,56px);
  --maxw:1320px;
  --sec-y:clamp(76px,10.5vw,152px);
  --hdr-h:76px;
  /* shape — soft, never sharp: one radius per kind of surface */
  --r:12px;                            /* inputs, small controls */
  --r-lg:22px;                         /* cards and panels */
  --r-img:18px;                        /* photographs */
  --r-btn:999px;                       /* buttons, chips, badges */
  --ease:cubic-bezier(.22,.7,.2,1);
  --ease-io:cubic-bezier(.65,0,.35,1);
  --shadow-1:0 1px 2px rgba(var(--shadow-rgb),.05),0 14px 36px -18px rgba(var(--shadow-rgb),.28);
  --shadow-2:0 40px 90px -40px rgba(0,0,0,.6);
}
@media (max-width:1099px){ :root{ --hdr-h:64px } }

/* ---------- reset / base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--hdr-h) + 16px);-webkit-tap-highlight-color:transparent}
/* kill the mobile-Chrome tap flash everywhere; our own :active states give the feedback instead */
*,a,button,input,select,textarea,label,summary,[role=button]{-webkit-tap-highlight-color:transparent}
a,button,summary,label,.dcard,.ptile,.chip,.pill,.opt{touch-action:manipulation}
body{margin:0;font-family:var(--ff);font-size:var(--t-body);line-height:1.9;color:var(--ink);background:var(--paper);direction:rtl;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:clip}
img,video,svg{display:block;max-width:100%}
img{height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
input,select,textarea{font:inherit;color:inherit}
h1,h2,h3,h4,p,ul,ol,figure,blockquote,dl,dd{margin:0}
ul[role=list],ol[role=list]{list-style:none;padding:0}
::selection{background:rgba(var(--gold-rgb),.35);color:inherit}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:2px}
[hidden]{display:none!important}
[data-off]{display:none!important}   /* a section the client hid (content/layout.json) */
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:fixed;top:10px;right:10px;z-index:200;background:var(--gold);color:var(--ink);padding:10px 16px;font-weight:600;transform:translateY(-160%);transition:transform .2s}
.skip-link:focus{transform:none}

/* ---------- type ---------- */
.display{font-size:var(--t-display);font-weight:300;line-height:1.22;letter-spacing:normal}
.h1{font-size:var(--t-h1);font-weight:300;line-height:1.26}
.h2{font-size:var(--t-h2);font-weight:300;line-height:1.32}
.h3{font-size:var(--t-h3);font-weight:600;line-height:1.5}
.display b,.h1 b,.h2 b{font-weight:600}
.lead{font-size:var(--t-lead);line-height:1.95;color:var(--muted)}
[data-theme=dark] .lead{color:var(--on-dark-2)}
.muted{color:var(--muted)}
[data-theme=dark] .muted{color:var(--on-dark-2)}
.gold-text{background:var(--gold-grad);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-box-decoration-break:clone;box-decoration-break:clone}
[data-theme=light] .gold-text{background:linear-gradient(105deg,#654b30 0%,#9c7c52 50%,#765a3c 100%);-webkit-background-clip:text;background-clip:text}
.kicker{display:inline-flex;align-items:center;gap:14px;font-size:var(--t-sm);font-weight:500;color:var(--gold-deep);line-height:1.6}
.kicker::before{content:"";width:34px;height:1px;background:currentColor;opacity:.7;flex:none}
[data-theme=dark] .kicker{color:var(--gold)}
.kicker .floor{font-family:var(--ff);font-weight:600;font-feature-settings:"tnum"}
/* Latin-only runs — the ONLY place tracking is allowed */
.en{letter-spacing:.2em;text-transform:uppercase;direction:ltr;unicode-bidi:isolate}
.code{font-family:var(--ff);font-weight:600;letter-spacing:.12em;direction:ltr;unicode-bidi:isolate;font-size:.78em}
.num{direction:ltr;unicode-bidi:isolate;font-feature-settings:"tnum"}
.ltr{direction:ltr;unicode-bidi:isolate}

/* ---------- layout ---------- */
.container{width:min(100% - 2*var(--gutter),var(--maxw));margin-inline:auto}
.container--narrow{width:min(100% - 2*var(--gutter),960px);margin-inline:auto}
.section{position:relative;padding-block:var(--sec-y)}
.section--tight{padding-block:clamp(56px,7vw,96px)}
.section--first{padding-top:calc(var(--hdr-h) + clamp(48px,7vw,104px))}   /* page builder: the first section sits under the header */
[data-theme=dark]{background:var(--night);color:var(--on-dark)}
[data-theme=light]{background:var(--paper);color:var(--ink)}
.bg-paper-2{background:var(--paper-2)!important}
.bg-white{background:var(--white)!important}
.bg-night-2{background:var(--night-2)!important}
/* brushed-metal grain for dark grounds */
.grain::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.55;
  background:repeating-linear-gradient(90deg,rgba(255,255,255,.014) 0 1px,transparent 1px 3px),
             radial-gradient(1200px 500px at 85% -10%,rgba(var(--gold-rgb),.10),transparent 60%);}
.grain>*{position:relative}
.sec-head{display:grid;gap:18px;margin-bottom:clamp(36px,5vw,64px);max-width:760px}
.sec-head--center{margin-inline:auto;text-align:center;justify-items:center}
.sec-head--split{max-width:none;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);align-items:end;gap:28px 64px}
.sec-head--split .lead{padding-bottom:6px}
@media (max-width:959px){.sec-head--split{grid-template-columns:1fr}}
.hr{height:1px;background:var(--line-light-2);border:0;margin:0}
[data-theme=dark] .hr{background:var(--line-dark-2)}

/* ---------- buttons ---------- */
.btn{--bh:52px;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:var(--bh);padding:0 26px;border-radius:var(--r);font-weight:600;font-size:var(--t-base);line-height:1.2;white-space:nowrap;position:relative;isolation:isolate;overflow:hidden;transition:transform .25s var(--ease),box-shadow .25s var(--ease),background-color .25s,color .25s,border-color .25s}
.btn svg{width:19px;height:19px;flex:none}
.btn--gold{background:var(--gold-btn);color:var(--on-gold);box-shadow:inset 0 1px 0 rgba(255,255,255,.45),0 10px 30px -12px rgba(var(--gold-rgb),.65)}
.btn--gold::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.55) 48%,transparent 66%);transform:translateX(120%);transition:transform .8s var(--ease)}
.btn--gold:hover::after{transform:translateX(-120%)}
.btn--gold:hover{transform:translateY(-1px);box-shadow:inset 0 1px 0 rgba(255,255,255,.5),0 16px 36px -14px rgba(var(--gold-rgb),.8)}
.btn--ghost{border:1px solid currentColor;border-color:var(--line-light);color:var(--ink)}
.btn--ghost:hover{border-color:var(--gold-deep);background:rgba(var(--gold-rgb),.08)}
[data-theme=dark] .btn--ghost{color:var(--on-dark);border-color:rgba(var(--on-dark-rgb),.28)}
[data-theme=dark] .btn--ghost:hover{border-color:var(--gold);background:rgba(var(--gold-rgb),.10)}
.btn--dark{background:var(--night);color:var(--on-dark)}
.btn--dark:hover{background:var(--night-3)}
.btn--wa{background:#1a7d44;color:#fff}             /* white on it: 5.2:1 (was #1f8f4e = 4.1:1) */
.btn--wa:hover{background:#166b3a}
.btn--sm{--bh:44px;padding:0 18px;font-size:var(--t-sm)}
.btn--lg{--bh:58px;padding:0 32px;font-size:var(--t-base)}
.btn--block{width:100%}
.link-arrow{display:inline-flex;align-items:center;gap:10px;font-weight:600;color:var(--gold-deep);border-bottom:1px solid transparent;padding-bottom:2px;transition:gap .25s var(--ease),border-color .25s}
.link-arrow svg{width:18px;height:18px}
.link-arrow:hover{gap:14px;border-color:currentColor}
[data-theme=dark] .link-arrow{color:var(--gold-soft)}
.btn-row{display:flex;flex-wrap:wrap;gap:12px}

/* ---------- icons ---------- */
.i{width:22px;height:22px;flex:none;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.i--fill{fill:currentColor;stroke:none}

/* ---------- header ---------- */
.site-header{position:fixed;inset-inline:0;top:0;z-index:60;height:var(--hdr-h);color:var(--on-dark);transition:background-color .35s ease,border-color .35s ease,color .35s ease,transform .45s var(--ease),box-shadow .35s;border-bottom:1px solid transparent}
.site-header .container{height:100%;display:flex;align-items:center;gap:28px}
.site-header.is-solid{background:rgba(var(--night-rgb),.84);-webkit-backdrop-filter:blur(18px) saturate(1.5);backdrop-filter:blur(18px) saturate(1.5);border-bottom-color:var(--line-dark)}
.site-header.is-light{color:var(--ink)}
.site-header.is-solid.is-light{background:rgba(var(--paper-rgb),.88);border-bottom-color:var(--line-light-2);box-shadow:0 8px 30px -22px rgba(0,0,0,.35)}
.site-header.is-hidden{transform:translateY(calc(-100% - 2px))}
body.menu-open .site-header{transform:none;background:var(--night);color:var(--on-dark)}

.brand{display:inline-flex;align-items:center;gap:12px;flex:none}
.brand__mark{width:42px;height:42px;display:grid;place-items:center;position:relative;border:1px solid currentColor;border-color:rgba(var(--gold-rgb),.75);border-radius:10px;color:var(--gold)}
.brand__mark::after{content:"";position:absolute;inset:3px;border:1px solid rgba(var(--gold-rgb),.35);border-radius:7px}
.brand__mark b{font-weight:600;font-size:var(--t-lg);line-height:1;transform:translateY(-2px)}
.brand__t{display:grid;line-height:1.15}
.brand__fa{font-weight:700;font-size:var(--t-md)}
/* part of the logo lockup, not reading text — the one size allowed off the scale */
.brand__en{font-size:10px;font-weight:500;letter-spacing:.3em;opacity:.72;direction:ltr;text-align:right;margin-top:3px}
.is-light .brand__mark,.brand--ink .brand__mark{color:var(--gold-deep);border-color:rgba(var(--gold-deep-rgb),.6)}
.is-light .brand__mark::after{border-color:rgba(var(--gold-deep-rgb),.3)}

.nav{margin-inline:auto;display:flex;align-items:center;gap:4px;height:100%}
.nav__link{position:relative;display:inline-flex;align-items:center;gap:6px;height:100%;padding:0 13px;font-size:var(--t-base);font-weight:500;opacity:.88;transition:opacity .2s,color .2s}
.nav__link:hover,.nav__link[aria-expanded=true]{opacity:1;color:var(--gold-soft)}
.is-light .nav__link:hover,.is-light .nav__link[aria-expanded=true]{color:var(--gold-deep)}
.nav__link::after{content:"";position:absolute;bottom:calc(50% - 20px);inset-inline:13px;height:1px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .3s var(--ease)}
.nav__link:hover::after,.nav__link.is-active::after{transform:scaleX(1)}
.nav__link.is-active{opacity:1}
.nav__link .i{width:15px;height:15px;transition:transform .3s}
.nav__link[aria-expanded=true] .i{transform:rotate(180deg)}
.hdr-actions{display:flex;align-items:center;gap:10px;flex:none}
.hdr-phone{display:inline-flex;align-items:center;gap:8px;font-weight:600;font-size:var(--t-base);padding:0 6px;opacity:.92}
.hdr-phone .i{width:18px;height:18px;color:var(--gold)}
.is-light .hdr-phone .i{color:var(--gold-deep)}
.hdr-burger{display:none;width:46px;height:46px;place-items:center;border:1px solid var(--line-dark);border-radius:var(--r)}
.is-light .hdr-burger{border-color:var(--line-light)}
.hdr-burger .i{width:22px;height:22px}
.hdr-call{display:none;width:46px;height:46px;place-items:center;border-radius:var(--r);color:var(--gold)}
@media (max-width:1219px){.hdr-phone{display:none}}
@media (max-width:1099px){
  .nav,.hdr-actions .btn{display:none}
  .hdr-burger,.hdr-call{display:grid}
  .site-header .container{gap:8px}
  .brand{margin-inline-end:auto}
}

/* mega menu */
.mega{position:absolute;inset-inline:0;top:100%;background:var(--night-2);color:var(--on-dark);border-top:1px solid var(--line-dark);border-bottom:1px solid var(--line-dark);box-shadow:0 40px 80px -40px rgba(0,0,0,.8);opacity:0;visibility:hidden;transform:translateY(-8px);transition:opacity .28s ease,transform .35s var(--ease),visibility 0s linear .35s}
.mega.is-open{opacity:1;visibility:visible;transform:none;transition:opacity .28s ease,transform .35s var(--ease),visibility 0s}
.mega .container{display:grid;grid-template-columns:repeat(6,minmax(0,1fr)) minmax(0,1.35fr);gap:14px;padding-block:26px 30px;height:auto;align-items:stretch}
.mega__card{display:grid;grid-template-rows:auto auto;gap:10px;padding:8px;border:1px solid transparent;transition:border-color .25s,background .25s}
.mega__card:hover{border-color:var(--line-dark);background:rgba(255,255,255,.02)}
.mega__img{display:block;aspect-ratio:3/4;overflow:hidden;background:var(--night-3)}
.mega__img img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.mega__card:hover .mega__img img{transform:scale(1.05)}
.mega__t{display:block;font-weight:600;font-size:var(--t-sm);line-height:1.5}
.mega__t small{display:block;font-weight:400;font-size:var(--t-xs);color:var(--on-dark-3)}
.mega__promo{display:flex;flex-direction:column;justify-content:space-between;gap:16px;padding:22px;border:1px solid var(--line-dark);background:linear-gradient(160deg,rgba(var(--gold-rgb),.12),rgba(var(--gold-rgb),.02))}
.mega__promo p{font-size:var(--t-sm);color:var(--on-dark-2);line-height:1.8}
.mega__promo strong{display:block;font-size:var(--t-md);color:var(--on-dark);margin-bottom:6px;font-weight:600}

/* mobile menu */
.m-menu{position:fixed;inset:0;z-index:55;background:var(--night);color:var(--on-dark);padding:calc(var(--hdr-h) + 12px) var(--gutter) 28px;display:flex;flex-direction:column;overflow-y:auto;opacity:0;visibility:hidden;transition:opacity .3s ease,visibility 0s linear .3s}
body.menu-open{overflow:hidden}
body.menu-open .m-menu{opacity:1;visibility:visible;transition:opacity .3s ease}
.m-menu__list{list-style:none;margin:0;padding:0;border-top:1px solid var(--line-dark-2)}
.m-menu__list>li{border-bottom:1px solid var(--line-dark-2)}
.m-menu__link{display:flex;align-items:center;justify-content:space-between;width:100%;padding:17px 2px;font-size:var(--t-lg);font-weight:500}
.m-menu__link .i{width:18px;height:18px;color:var(--gold);transition:transform .3s}
.m-menu__link[aria-expanded=true] .i{transform:rotate(180deg)}
.m-menu__sub{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:0 0 18px}
.m-menu__sub a{display:flex;align-items:center;gap:10px;padding:8px;border:1px solid var(--line-dark-2);font-size:var(--t-sm);line-height:1.5}
.m-menu__sub img{width:40px;height:52px;object-fit:cover;flex:none}
.m-menu__foot{margin-top:auto;padding-top:26px;display:grid;gap:10px}
.m-menu__foot .btn{width:100%}
.m-menu__meta{display:flex;justify-content:space-between;gap:10px;font-size:var(--t-xs);color:var(--on-dark-3);padding-top:6px}

/* ---------- floor rail (desktop scroll-spy, home) ---------- */
.floor-rail{position:fixed;left:clamp(14px,2vw,30px);top:50%;transform:translateY(-50%);z-index:40;display:none;opacity:0;transition:opacity .4s ease}
body.rail-on .floor-rail{opacity:1}
@media (min-width:1400px){.floor-rail{display:block}}
.floor-rail__shaft{position:relative;display:grid;gap:14px;padding:12px 0}
.floor-rail__shaft::before{content:"";position:absolute;left:5px;top:0;bottom:0;width:1px;background:currentColor;opacity:.22}
.floor-rail a{position:relative;display:flex;align-items:center;gap:12px;height:18px;font-size:var(--t-2xs);font-weight:600;opacity:.55;transition:opacity .25s;direction:ltr}
.floor-rail a::before{content:"";width:11px;height:1px;background:currentColor}
.floor-rail a span{font-feature-settings:"tnum"}
.floor-rail a em{font-style:normal;font-weight:500;white-space:nowrap;opacity:0;transform:translateX(-6px);transition:opacity .25s,transform .25s;direction:rtl}
.floor-rail a:hover{opacity:1}
.floor-rail a:hover em,.floor-rail a:focus-visible em{opacity:1;transform:none}
.floor-rail a em{position:absolute;left:44px;background:var(--night-2);color:var(--on-dark);padding:2px 8px;border:1px solid var(--line-dark);font-size:var(--t-xs)}
.floor-rail a.is-active{opacity:1;color:var(--gold)}
.floor-rail__car{position:absolute;left:1px;width:9px;height:22px;border:1px solid var(--gold);background:rgba(var(--gold-rgb),.18);top:12px;transition:transform .6s var(--ease)}
.floor-rail{color:var(--on-dark)}
body.rail-light .floor-rail{color:var(--ink)}
body.rail-light .floor-rail a.is-active{color:var(--gold-deep)}

/* ---------- media frames ---------- */
.frame{position:relative;box-shadow:var(--shadow-2)}
.ph{display:block;position:relative;overflow:hidden;background:var(--night-3)}
[data-theme=light] .ph{background:var(--paper-3)}
.ph img{width:100%;height:100%;object-fit:cover}
.ratio-34{aspect-ratio:3/4}
.ratio-45{aspect-ratio:4/5}
.ratio-23{aspect-ratio:2/3}
.ratio-916{aspect-ratio:9/16}
.ratio-169{aspect-ratio:16/9}

/* ---------- chips / tags ---------- */
.chip{position:relative;display:inline-flex;align-items:center;gap:8px;height:34px;padding:0 14px;border:1px solid var(--line-light);border-radius:999px;font-size:var(--t-sm);font-weight:500;color:var(--ink-2);background:transparent;transition:all .25s}
[data-theme=dark] .chip{border-color:rgba(var(--on-dark-rgb),.18);color:var(--on-dark-2)}
.chip:hover{border-color:var(--gold-deep);color:var(--ink)}
[data-theme=dark] .chip:hover{border-color:var(--gold);color:var(--on-dark)}
.chip.is-on,.chip[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:var(--paper)}
[data-theme=dark] .chip.is-on,[data-theme=dark] .chip[aria-pressed=true]{background:var(--gold);border-color:var(--gold);color:var(--on-gold)}
.chip .count{font-size:var(--t-2xs);opacity:.6}
.tag-code{display:inline-flex;align-items:center;height:24px;padding:0 9px;border:1px solid var(--line-dark);color:var(--gold-soft);font-size:var(--t-2xs);font-weight:600;letter-spacing:.14em;direction:ltr;unicode-bidi:isolate;background:rgba(var(--night-rgb),.55);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
[data-theme=light] .tag-code{color:var(--gold-ink);border-color:var(--line-light);background:rgba(var(--white-rgb),.8)}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip-scroller{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding-bottom:4px;margin-inline:calc(-1*var(--gutter));padding-inline:var(--gutter)}
.chip-scroller::-webkit-scrollbar{display:none}
.chip-scroller .chip{flex:none}

/* ---------- design card (collection) ---------- */
.dcard{position:relative;display:block;text-align:right;width:100%}
.dcard__media{display:block;position:relative;aspect-ratio:3/4.3;overflow:hidden;background:var(--night-3)}
[data-theme=light] .dcard__media{background:var(--paper-3)}
.dcard__media img{width:100%;height:100%;object-fit:cover;transition:transform 1.1s var(--ease),filter .6s}
.dcard__media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(var(--shade-rgb),.55));opacity:.9;transition:opacity .4s}
.dcard:hover .dcard__media img{transform:scale(1.045)}
.dcard .tag-code{position:absolute;top:12px;right:12px;z-index:2}
.dcard__zoom{position:absolute;bottom:12px;left:12px;z-index:2;width:40px;height:40px;display:grid;place-items:center;border:1px solid rgba(var(--on-dark-rgb),.35);color:#fff;background:rgba(var(--night-rgb),.35);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);opacity:0;transform:translateY(6px);transition:all .35s var(--ease)}
.dcard:hover .dcard__zoom,.dcard:focus-visible .dcard__zoom{opacity:1;transform:none}
.dcard__zoom .i{width:18px;height:18px}
.dcard__body{padding:16px 2px 0;display:grid;gap:4px}
.dcard__t{display:block;font-size:var(--t-md);font-weight:600;line-height:1.5}
.dcard__d{display:block;font-size:var(--t-sm);line-height:1.75;color:var(--muted)}
[data-theme=dark] .dcard__d{color:var(--on-dark-3)}
.dgrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(18px,2.2vw,32px) clamp(14px,1.8vw,26px)}
@media (max-width:1099px){.dgrid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:759px){.dgrid{grid-template-columns:repeat(2,minmax(0,1fr))}.dcard__t{font-size:var(--t-base)}.dcard__d{font-size:var(--t-xs)}}
.dcard.is-hidden{display:none}

/* horizontal rail */
.rail{display:grid;grid-auto-flow:column;grid-auto-columns:clamp(230px,24vw,330px);gap:clamp(16px,2vw,28px);overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding-bottom:6px;margin-inline:calc(-1*var(--gutter));padding-inline:var(--gutter);scroll-padding-inline:var(--gutter)}
.rail::-webkit-scrollbar{display:none}
.rail>*{scroll-snap-align:start}
.rail-nav{display:flex;gap:8px}
.rail-nav button{width:48px;height:48px;display:grid;place-items:center;border:1px solid rgba(var(--on-dark-rgb),.22);transition:all .25s}
.rail-nav button:hover{border-color:var(--gold);color:var(--gold-soft)}
.rail-nav button:disabled{opacity:.3;cursor:default}
[data-theme=light] .rail-nav button{border-color:var(--line-light)}

/* ---------- product family tile ---------- */
.ptile{position:relative;display:flex;flex-direction:column;justify-content:flex-end;min-height:100%;overflow:hidden;color:#fff;isolation:isolate;background:var(--night-3)}
.ptile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform 1.2s var(--ease)}
.ptile::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(var(--shade-rgb),0) 30%,rgba(var(--shade-rgb),.35) 55%,rgba(var(--shade-rgb),.88) 100%)}
.ptile:hover img{transform:scale(1.05)}
.ptile__body{padding:clamp(18px,2vw,28px);display:grid;gap:6px}
.ptile__idx{font-size:var(--t-2xs);font-weight:600;color:var(--gold-soft);font-feature-settings:"tnum"}
.ptile__t{font-size:var(--t-h3);font-weight:600;line-height:1.4}
.ptile__d{font-size:var(--t-sm);line-height:1.75;color:rgba(255,255,255,.74);max-width:36ch}
.ptile__go{display:inline-flex;align-items:center;gap:8px;margin-top:8px;font-size:var(--t-sm);font-weight:600;color:var(--gold-soft)}
.ptile__go .i{width:17px;height:17px;transition:transform .3s var(--ease)}
.ptile:hover .ptile__go .i{transform:translateX(-5px)}

/* ---------- stat ---------- */
.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--line-dark)}
.stat{padding:clamp(24px,3vw,40px) clamp(14px,2vw,30px);border-inline-start:1px solid var(--line-dark-2);display:grid;gap:4px;align-content:start}
.stat:first-child{border-inline-start:0}
.stat__n{font-size:var(--t-num);font-weight:300;line-height:1.1;color:var(--gold-soft);font-feature-settings:"tnum"}
.stat__l{font-size:var(--t-sm);color:var(--on-dark-2);line-height:1.6}
[data-theme=light] .stats{border-top-color:var(--line-light)}
[data-theme=light] .stat{border-inline-start-color:var(--line-light-2)}
[data-theme=light] .stat__n{color:var(--gold-deep)}
[data-theme=light] .stat__l{color:var(--muted)}
@media (max-width:759px){.stats{grid-template-columns:repeat(2,minmax(0,1fr))}.stat:nth-child(3){border-inline-start:0}.stat:nth-child(n+3){border-top:1px solid var(--line-dark-2)}[data-theme=light] .stat:nth-child(n+3){border-top-color:var(--line-light-2)}}

/* ---------- feature list ---------- */
.flist{list-style:none;margin:0;padding:0;display:grid;gap:0}
.flist li{display:grid;grid-template-columns:28px 1fr;gap:12px;padding:14px 0;border-bottom:1px solid var(--line-light-2);line-height:1.8}
[data-theme=dark] .flist li{border-bottom-color:var(--line-dark-2)}
.flist li:first-child{border-top:1px solid var(--line-light-2)}
[data-theme=dark] .flist li:first-child{border-top-color:var(--line-dark-2)}
.flist .i{width:20px;height:20px;color:var(--gold-deep);margin-top:4px}
[data-theme=dark] .flist .i{color:var(--gold)}
.flist b{font-weight:600}
.flist span{color:var(--muted)}
[data-theme=dark] .flist span{color:var(--on-dark-2)}

/* ---------- cards ---------- */
.card{background:var(--white);border:1px solid var(--line-light-2);padding:clamp(22px,2.4vw,34px);transition:border-color .3s,transform .4s var(--ease),box-shadow .4s}
.card:hover{border-color:var(--line-light)}
[data-theme=dark] .card,.card[data-theme=dark]{background:var(--night-2);border-color:var(--line-dark-2)}
[data-theme=dark] .card:hover,.card[data-theme=dark]:hover{border-color:var(--line-dark)}
.icon-badge{width:52px;height:52px;display:grid;place-items:center;border:1px solid var(--line-light);border-radius:var(--r);color:var(--gold-deep);position:relative}
[data-theme=dark] .icon-badge{border-color:var(--line-dark);color:var(--gold)}
.icon-badge .i{width:24px;height:24px}

/* ---------- steps (process) ---------- */
.steps{list-style:none;margin:0;padding:0;counter-reset:st;display:grid}
.step{position:relative;display:grid;grid-template-columns:64px 1fr;gap:18px;padding:20px 0}
.step+.step{border-top:1px solid var(--line-dark-2)}
[data-theme=light] .step+.step{border-top-color:var(--line-light-2)}
.step__n{counter-increment:st;font-size:var(--t-xs);font-weight:600;color:var(--gold);display:grid;place-items:center;width:52px;height:52px;border:1px solid var(--line-dark);position:relative}
[data-theme=light] .step__n{color:var(--gold-deep);border-color:var(--line-light)}
.step__n .i{width:24px;height:24px}
.step__t{font-weight:600;font-size:var(--t-md);line-height:1.6}
.step__d{font-size:var(--t-sm);line-height:1.85;color:var(--on-dark-2)}
[data-theme=light] .step__d{color:var(--muted)}

/* ---------- video slot (placeholder-ready) ---------- */
.vslot{position:relative;display:block;width:100%;overflow:hidden;background:var(--night-3);color:#fff;isolation:isolate;text-align:right}
.vslot>img,.vslot>video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.vslot>img{object-position:50% 42%}
.vslot--still{cursor:auto}   /* tall posters in a 16:9 slot: keep the cabin, not the ceiling */
.vslot::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(var(--shade-rgb),.15),rgba(var(--shade-rgb),.1) 40%,rgba(var(--shade-rgb),.78));transition:background .4s}
button.vslot:hover::before{background:linear-gradient(180deg,rgba(var(--shade-rgb),.1),rgba(var(--shade-rgb),.05) 40%,rgba(var(--shade-rgb),.7))}
.vslot__play{position:absolute;top:50%;left:50%;width:clamp(58px,6vw,82px);height:clamp(58px,6vw,82px);margin:calc(clamp(58px,6vw,82px)/-2) 0 0 calc(clamp(58px,6vw,82px)/-2);border-radius:50%;display:grid;place-items:center;background:rgba(var(--night-rgb),.45);border:1px solid rgba(var(--gold-soft-rgb),.7);color:var(--gold-soft);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:transform .45s var(--ease),background .3s}
.vslot__play::after{content:"";position:absolute;inset:-9px;border-radius:50%;border:1px solid rgba(var(--gold-soft-rgb),.28);animation:pulse 2.6s var(--ease) infinite}
.vslot__play .i{width:38%;height:38%;margin-left:6%}
.vslot:hover .vslot__play{transform:scale(1.07);background:rgba(var(--gold-rgb),.3)}
.vslot__cap{position:absolute;inset-inline:0;bottom:0;padding:clamp(14px,2vw,24px);display:grid;gap:4px}
.vslot__t{font-weight:600;font-size:var(--t-title);line-height:1.5}
.vslot__m{font-size:var(--t-xs);color:rgba(255,255,255,.7);display:flex;flex-wrap:wrap;gap:6px 12px;align-items:center}
@keyframes pulse{0%{transform:scale(.92);opacity:.9}70%{transform:scale(1.18);opacity:0}100%{opacity:0}}

/* ---------- lightbox / modal ---------- */
.lb{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:clamp(10px,3vw,40px);background:rgba(var(--shade-rgb),.9);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);opacity:0;visibility:hidden;transition:opacity .3s ease,visibility 0s linear .3s}
.lb.is-open{opacity:1;visibility:visible;transition:opacity .3s ease}
body.lb-open{overflow:hidden}
.lb__close{position:absolute;top:14px;left:14px;width:48px;height:48px;display:grid;place-items:center;border:1px solid rgba(var(--on-dark-rgb),.25);color:var(--on-dark);z-index:3;background:rgba(var(--night-rgb),.6)}
.lb__close:hover{border-color:var(--gold);color:var(--gold-soft)}
.lb__nav{position:absolute;top:50%;width:48px;height:48px;margin-top:-24px;display:grid;place-items:center;border:1px solid rgba(var(--on-dark-rgb),.25);color:var(--on-dark);z-index:3;background:rgba(var(--night-rgb),.6)}
.lb__nav:hover{border-color:var(--gold);color:var(--gold-soft)}
.lb__nav--prev{right:14px}.lb__nav--next{left:14px}
.lb__panel{position:relative;width:min(1080px,100%);max-height:calc(100dvh - 40px);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);background:var(--night-2);color:var(--on-dark);border:1px solid var(--line-dark);overflow:hidden;transform:translateY(14px) scale(.985);transition:transform .45s var(--ease)}
.lb.is-open .lb__panel{transform:none}
.lb__media{position:relative;background:#000;min-height:0}
.lb__media img{width:100%;height:100%;max-height:calc(100dvh - 42px);object-fit:contain}
.lb__info{padding:clamp(22px,3vw,44px);display:flex;flex-direction:column;gap:16px;overflow-y:auto}
.lb__fam{font-size:var(--t-xs);color:var(--gold);font-weight:500}
.lb__t{font-size:var(--t-h4);font-weight:300;line-height:1.35}
.lb__d{color:var(--on-dark-2);line-height:1.9}
.lb__actions{display:grid;gap:10px;margin-top:auto;padding-top:8px}
.lb__note{font-size:var(--t-xs);color:var(--on-dark-3);line-height:1.8}
@media (max-width:759px){
  .lb{padding:0;place-items:end stretch}
  .lb__panel{grid-template-columns:1fr;max-height:100dvh;height:100dvh;overflow-y:auto;border:0;display:block}
  .lb__media{height:58vh}
  .lb__media img{max-height:none;height:100%}
  .lb__nav{top:29vh}
}
.lb--video .lb__panel{grid-template-columns:1fr;width:min(1100px,100%);background:#000}
.lb--video .lb__stage{position:relative;display:grid;place-items:center;max-height:calc(100dvh - 40px)}
.lb--video video{width:100%;max-height:calc(100dvh - 40px)}
.lb--video.is-vertical .lb__panel{width:min(440px,100%)}
.lb--video .lb__panel{display:block}
@media (max-width:759px){.lb--video .lb__panel{height:auto;max-height:100dvh}.lb--video{place-items:center}}
.lb__pending{padding:clamp(28px,5vw,56px);display:grid;gap:14px;text-align:center;justify-items:center;background:var(--night-2)}
.lb__pending .i{width:40px;height:40px;color:var(--gold)}
.lb__pending h3{font-weight:500;font-size:var(--t-lg)}
.lb__pending p{color:var(--on-dark-2);max-width:46ch;font-size:var(--t-sm)}
.lb__pending dl{display:grid;grid-template-columns:auto 1fr;gap:6px 16px;text-align:right;font-size:var(--t-sm);border-top:1px solid var(--line-dark-2);padding-top:14px;margin-top:4px}
.lb__pending dt{color:var(--on-dark-3)}
.lb__pending dd{color:var(--on-dark)}

/* ---------- forms ---------- */
.field{display:grid;gap:8px}
.field__l{font-size:var(--t-sm);font-weight:600;color:var(--ink-2)}
.field__l i{font-style:normal;color:var(--gold-deep);margin-inline-start:2px}
.field__h{font-size:var(--t-xs);color:var(--muted);line-height:1.7}
.input,.select,.textarea{width:100%;min-height:52px;padding:12px 16px;background:var(--white);border:1px solid var(--line-light-2);border-radius:var(--r);transition:border-color .2s,box-shadow .2s;font-size:var(--t-base);line-height:1.6}
.textarea{min-height:120px;resize:vertical}
.input:focus,.select:focus,.textarea:focus{outline:none;border-color:var(--gold-deep);box-shadow:0 0 0 3px rgba(var(--gold-rgb),.18)}
.input::placeholder,.textarea::placeholder{color:#7a7264}   /* 4.7:1 on white (was 2.7:1) */
.input.is-invalid{border-color:#b2412e;box-shadow:0 0 0 3px rgba(178,65,46,.12)}
.field__err{font-size:var(--t-xs);color:#a33a28;display:none}
.field.has-err .field__err{display:block}
[data-theme=dark] .field__l{color:var(--on-dark)}
[data-theme=dark] .input,[data-theme=dark] .select,[data-theme=dark] .textarea{background-color:rgba(255,255,255,.04);border-color:rgba(var(--on-dark-rgb),.16);color:var(--on-dark)}
[data-theme=dark] .input::placeholder,[data-theme=dark] .textarea::placeholder{color:rgba(var(--on-dark-rgb),.5)}
.select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238b6a26' stroke-width='1.8' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:left 14px center;background-size:18px;padding-left:42px}
[data-theme=dark] .select{color-scheme:dark;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c9a24b' stroke-width='1.8' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E")}
[data-theme=dark] .select option{background:var(--night-2);color:var(--on-dark)}
/* option cards (checkbox/radio as tiles) */
.opt-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.opt{position:relative;display:block;cursor:pointer}
.opt input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.opt__box{display:grid;gap:8px;align-content:start;height:100%;padding:16px;border:1px solid var(--line-light-2);background:var(--white);transition:border-color .2s,box-shadow .2s,background .2s}
.opt__box .i{width:26px;height:26px;color:var(--gold-deep)}
.opt__t{font-weight:600;font-size:var(--t-base);line-height:1.5}
.opt__d{font-size:var(--t-xs);color:var(--muted);line-height:1.6}
.opt:hover .opt__box{border-color:var(--line-light)}
.opt input:checked+.opt__box{border-color:var(--gold-deep);background:var(--gold-tint);box-shadow:inset 0 0 0 1px var(--gold-deep)}
.opt input:focus-visible+.opt__box{outline:2px solid var(--gold);outline-offset:2px}
.opt__tick{position:absolute;top:10px;left:10px;width:20px;height:20px;border-radius:50%;border:1px solid var(--line-light);display:grid;place-items:center;color:transparent;transition:all .2s}
.opt__tick .i{width:13px;height:13px;stroke-width:2.4}
.opt input:checked+.opt__box .opt__tick{background:var(--gold-deep);border-color:var(--gold-deep);color:#fff}
/* pill radios */
.pills{display:flex;flex-wrap:wrap;gap:8px}
.pill{position:relative}
.pill input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.pill span{display:inline-flex;align-items:center;justify-content:center;min-width:52px;height:44px;padding:0 16px;border:1px solid var(--line-light-2);background:var(--white);font-size:var(--t-sm);font-weight:500;transition:all .2s;border-radius:var(--r)}
.pill:hover span{border-color:var(--line-light)}
.pill input:checked+span{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.pill input:focus-visible+span{outline:2px solid var(--gold);outline-offset:2px}
.stepper{display:inline-flex;align-items:center;border:1px solid var(--line-light-2);background:var(--white);height:48px}
.stepper button{width:46px;height:100%;display:grid;place-items:center;color:var(--gold-deep)}
.stepper button:hover{background:var(--paper-2)}
.stepper input{width:64px;height:100%;border:0;border-inline:1px solid var(--line-light-2);text-align:center;font-weight:600;font-size:var(--t-base);background:transparent;-moz-appearance:textfield;appearance:textfield}
.stepper input::-webkit-outer-spin-button,.stepper input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}

/* ---------- accordion (FAQ) ---------- */
.faq{border-top:1px solid var(--line-light-2)}
[data-theme=dark] .faq{border-top-color:var(--line-dark-2)}
.faq details{border-bottom:1px solid var(--line-light-2)}
[data-theme=dark] .faq details{border-bottom-color:var(--line-dark-2)}
.faq summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:22px 0;font-weight:600;font-size:var(--t-title);line-height:1.6}
.faq summary::-webkit-details-marker{display:none}
.faq summary .pm{position:relative;flex:none;width:34px;height:34px;border:1px solid var(--line-light);border-radius:50%;transition:all .3s}
[data-theme=dark] .faq summary .pm{border-color:var(--line-dark)}
.faq summary .pm::before,.faq summary .pm::after{content:"";position:absolute;top:50%;left:50%;width:12px;height:1.5px;margin:-.75px 0 0 -6px;background:var(--gold-deep);transition:transform .3s var(--ease)}
[data-theme=dark] .faq summary .pm::before,[data-theme=dark] .faq summary .pm::after{background:var(--gold)}
.faq summary .pm::after{transform:rotate(90deg)}
.faq details[open] summary .pm{background:var(--ink);border-color:var(--ink)}
.faq details[open] summary .pm::before,.faq details[open] summary .pm::after{background:var(--paper)}
.faq details[open] summary .pm::after{transform:rotate(0)}
[data-theme=dark] .faq details[open] summary .pm{background:var(--gold);border-color:var(--gold)}
[data-theme=dark] .faq details[open] summary .pm::before,[data-theme=dark] .faq details[open] summary .pm::after{background:var(--night)}
.faq .faq__a{padding:0 0 24px;max-width:72ch;color:var(--muted);line-height:1.95}
[data-theme=dark] .faq .faq__a{color:var(--on-dark-2)}

/* ---------- page hero (inner pages) ---------- */
.phero{position:relative;padding:calc(var(--hdr-h) + clamp(48px,7vw,104px)) 0 clamp(56px,7vw,100px);overflow:hidden}
.phero__grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(32px,6vw,96px);align-items:center}
.phero__txt{display:grid;gap:22px;align-content:center}
.phero__media{position:relative}
.crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:var(--t-xs);color:var(--on-dark-3)}
[data-theme=light] .crumbs{color:var(--muted)}
.crumbs a:hover{color:var(--gold-soft)}
[data-theme=light] .crumbs a:hover{color:var(--gold-deep)}
.crumbs .i{width:13px;height:13px;opacity:.6}
@media (max-width:959px){.phero__grid{grid-template-columns:1fr}.phero__media{order:-1}}

/* ---------- CTA band ---------- */
.cta-band{position:relative;overflow:hidden;isolation:isolate}
.cta-band__bg{position:absolute;inset:0;z-index:-1}
.cta-band__bg img{width:100%;height:100%;object-fit:cover;opacity:.28;filter:saturate(.8)}
.cta-band__bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(var(--night-rgb),.96) 20%,rgba(var(--night-rgb),.72) 60%,rgba(var(--night-rgb),.55))}
.cta-band__grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:clamp(28px,5vw,80px);align-items:center}
.cta-band__side{display:grid;gap:12px}
.contact-line{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 18px;border:1px solid var(--line-dark);background:rgba(var(--night-rgb),.5);transition:border-color .25s,background .25s}
.contact-line:hover{border-color:var(--gold);background:rgba(var(--gold-rgb),.08)}
.contact-line small{display:block;font-size:var(--t-xs);color:var(--on-dark-3)}
.contact-line b{font-weight:600;font-size:var(--t-md)}
.contact-line .i{color:var(--gold);width:22px;height:22px}
@media (max-width:959px){.cta-band__grid{grid-template-columns:1fr}}

/* ---------- footer ---------- */
.site-footer{background:var(--night-0);color:var(--on-dark-2);padding-top:clamp(64px,8vw,110px);font-size:var(--t-sm)}
.foot-grid{display:grid;grid-template-columns:minmax(0,1.5fr) repeat(3,minmax(0,1fr));gap:clamp(28px,4vw,64px)}
.foot-brand p{margin-top:18px;line-height:1.95;max-width:38ch}
.foot-h{font-size:var(--t-sm);font-weight:600;color:var(--on-dark);margin-bottom:16px}
.foot-links{list-style:none;margin:0;padding:0;display:grid;gap:9px}
.foot-links a{transition:color .2s}
.foot-links a:hover{color:var(--gold-soft)}
.foot-contact{display:grid;gap:12px}
.foot-contact a,.foot-contact div{display:flex;gap:10px;align-items:flex-start;line-height:1.7}
.foot-contact .i{width:18px;height:18px;color:var(--gold);margin-top:3px}
.foot-social{display:flex;gap:8px;margin-top:22px}
.foot-social a{width:44px;height:44px;display:grid;place-items:center;border:1px solid var(--line-dark-2);transition:all .25s}
.foot-social a:hover{border-color:var(--gold);color:var(--gold-soft)}
.foot-social .i{width:19px;height:19px}
.foot-bottom{margin-top:clamp(48px,6vw,80px);border-top:1px solid var(--line-dark-2);padding:22px 0 26px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;font-size:var(--t-xs);color:var(--on-dark-3)}
.foot-bottom .en{font-size:var(--t-2xs)}
@media (max-width:959px){.foot-grid{grid-template-columns:1fr 1fr}.foot-brand{grid-column:1/-1}}
@media (max-width:559px){.foot-grid{grid-template-columns:1fr}}
body.has-dock .site-footer{padding-bottom:84px}
@media (min-width:1100px){body.has-dock .site-footer{padding-bottom:0}}

/* ---------- mobile action dock ---------- */
.dock{position:fixed;inset-inline:0;bottom:0;z-index:45;display:grid;grid-template-columns:1fr 1fr 1.4fr;gap:8px;padding:10px 12px calc(10px + env(safe-area-inset-bottom));background:rgba(var(--night-rgb),.92);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-top:1px solid var(--line-dark);transform:translateY(110%);transition:transform .4s var(--ease)}
body.dock-on .dock{transform:none}
body.menu-open .dock,body.lb-open .dock{transform:translateY(110%)}
.dock a{display:flex;align-items:center;justify-content:center;gap:8px;height:48px;border:1px solid rgba(var(--on-dark-rgb),.18);color:var(--on-dark);font-weight:600;font-size:var(--t-sm);border-radius:var(--r)}
.dock a .i{width:19px;height:19px}
.dock a.is-wa .i{color:var(--wa)}
.dock a.is-call .i{color:var(--gold)}
.dock a.is-quote{background:var(--gold-btn);color:var(--on-gold);border:0}
.dock--2{grid-template-columns:1fr 1fr}
@media (min-width:1100px){.dock{display:none}}

/* ---------- reveal ---------- */
.js .rv{opacity:0;transform:translateY(26px);transition:opacity .9s var(--ease),transform 1s var(--ease);transition-delay:var(--d,0s)}
.js .rv.in{opacity:1;transform:none}
/* image curtain: an overlay slides away (never clip the element itself — a fully clipped
   element never "intersects", so its lazy images would never load) */
.rv-img{position:relative}
.js .rv-img::after{content:"";position:absolute;inset:0;z-index:4;background:var(--night);transform-origin:50% 0;transition:transform 1.15s var(--ease-io);transition-delay:var(--d,0s);pointer-events:none}
.js [data-theme=light] .rv-img::after{background:var(--paper)}
.js .bg-white .rv-img::after{background:var(--white)}
.js .rv-img.in::after{transform:scaleY(0)}

/* ---------- toast ---------- */
.toast{position:fixed;left:50%;bottom:calc(88px + env(safe-area-inset-bottom));z-index:120;transform:translate(-50%,20px);opacity:0;pointer-events:none;background:var(--night-3);color:var(--on-dark);border:1px solid var(--line-dark);padding:12px 18px;font-size:var(--t-sm);transition:all .35s var(--ease);max-width:calc(100% - 32px)}
.toast.is-on{opacity:1;transform:translate(-50%,0)}
.toast.has-action{display:flex;align-items:center;gap:14px;padding-block:2px;padding-inline-end:10px}
.toast.is-on.has-action{pointer-events:auto}
.toast__undo{min-height:44px;padding:0 8px;color:var(--gold-soft);font-weight:600;white-space:nowrap}
.toast__undo:active{opacity:.7}
@media (min-width:1100px){.toast{bottom:32px}}

/* ---------- reduced motion ---------- */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  .js .rv{opacity:1;transform:none}
  .js .rv-img::after{display:none}
}

/* ==========================================================================
   COMPONENTS — used across pages
   ========================================================================== */

/* spec list (lightbox, studio summary, product pages) */
.specs{display:grid;gap:0;margin:0;border-top:1px solid var(--line-dark-2)}
.specs>div{display:grid;grid-template-columns:minmax(96px,34%) 1fr;gap:14px;padding:11px 0;border-bottom:1px solid var(--line-dark-2);font-size:var(--t-sm);line-height:1.7}
.specs dt{color:var(--on-dark-3)}
.specs dd{margin:0;color:var(--on-dark)}
.specs--light,[data-theme=light] .specs{border-top-color:var(--line-light-2)}
.specs--light>div,[data-theme=light] .specs>div{border-bottom-color:var(--line-light-2)}
.specs--light dt,[data-theme=light] .specs dt{color:var(--muted)}
.specs--light dd,[data-theme=light] .specs dd{color:var(--ink)}
.lb__mini{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.lb__mini .btn{padding:0 10px}

/* image zoom anchors */
.zoomable{position:relative;display:block;cursor:zoom-in}
.lb--image .lb__panel{display:grid;place-items:center;background:transparent;border:0;grid-template-columns:1fr;width:auto;max-width:min(1000px,100%)}
.lb--image img{max-height:calc(100dvh - 60px);width:auto;max-width:100%;box-shadow:var(--shadow-2)}

/* ==========================================================================
   HOME — hero with the elevator-door portal
   ========================================================================== */
.hero{position:relative;min-height:100svh;padding-top:calc(var(--hdr-h) + clamp(20px,4vw,48px));display:flex;flex-direction:column;overflow:hidden;isolation:isolate}
.hero__bg{position:absolute;inset:0;z-index:-1;pointer-events:none}
.hero__bg::before{content:"";position:absolute;inset:0;background:
  radial-gradient(640px 520px at 27% 44%,rgba(var(--gold-rgb),.16),transparent 70%),
  radial-gradient(900px 600px at 90% 110%,rgba(var(--gold-rgb),.06),transparent 70%),
  repeating-linear-gradient(90deg,rgba(255,255,255,.013) 0 1px,transparent 1px 4px)}
.hero__rails{position:absolute;top:0;bottom:0;left:50%;width:min(560px,44vw);transform:translateX(-4%);display:none}
.hero__grid{flex:1;display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);gap:clamp(36px,6vw,110px);align-items:center;padding-bottom:clamp(36px,5vw,64px)}
.hero__txt{display:grid;gap:clamp(20px,2.4vw,30px);align-content:center}
.hero__txt .display{max-width:15.5ch;font-size:clamp(38px,5.1vw,78px)}
.hero__sub{max-width:52ch}
.hero__trust{list-style:none;margin:6px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:10px 22px;font-size:var(--t-sm);color:var(--on-dark-2)}
.hero__trust li{display:inline-flex;align-items:center;gap:8px}
.hero__trust .i{width:17px;height:17px;color:var(--gold)}
.hero .stats{margin-top:auto}

.portal{position:relative;width:min(100%,468px);margin-inline:auto}
.portal__display{display:flex;align-items:center;justify-content:center;gap:10px;width:118px;height:40px;margin:0 auto 20px;background:#060606;border:1px solid rgba(var(--gold-rgb),.35);box-shadow:inset 0 0 14px rgba(0,0,0,.9),0 0 0 4px rgba(var(--gold-rgb),.05);color:#ffb54a;font-weight:600;font-size:var(--t-lg);line-height:1;text-shadow:0 0 10px rgba(255,170,60,.75)}
.portal__display .i{width:15px;height:15px;stroke-width:2.6;animation:floorArrow 1.6s ease-in-out infinite}
@keyframes floorArrow{0%,100%{transform:translateY(1px);opacity:.6}50%{transform:translateY(-2px);opacity:1}}
.portal__frame{position:relative;aspect-ratio:3/4.05;padding:14px;background:linear-gradient(180deg,var(--night-4),var(--night));border-radius:var(--r-img);box-shadow:0 60px 90px -50px rgba(0,0,0,.9),0 0 0 1px rgba(var(--gold-rgb),.35),inset 0 0 0 1px rgba(255,255,255,.04)}
.portal__frame::after{content:"";position:absolute;inset:-30px -30px auto;height:1px;background:linear-gradient(90deg,transparent,rgba(var(--gold-rgb),.5),transparent);top:-30px}
.portal__media{position:absolute;inset:14px;overflow:hidden;background:#000}
.portal__slide,.portal__video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.portal__slide{opacity:0;transform:scale(1.07);transition:opacity 1.6s ease,transform 8s linear}
.portal__slide.is-on{opacity:1;transform:scale(1)}
.portal.has-video .portal__slide{display:none}
.portal__media::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(0,0,0,.08),transparent 30%,transparent 70%,rgba(0,0,0,.35));z-index:1}
.portal__door{position:absolute;top:0;bottom:0;width:50%;z-index:3;transition:transform 1.9s cubic-bezier(.75,0,.22,1);
  background:
    linear-gradient(90deg,rgba(255,255,255,.05),transparent 20%,rgba(255,255,255,.22) 46%,transparent 60%,rgba(0,0,0,.18)),
    repeating-linear-gradient(90deg,rgba(255,255,255,.05) 0 1px,transparent 1px 3px),
    linear-gradient(180deg,var(--gold-soft),var(--gold) 45%,var(--gold-deep) 100%)}
.portal__door--l{left:0;box-shadow:inset -1px 0 0 rgba(0,0,0,.45)}
.portal__door--r{right:0;box-shadow:inset 1px 0 0 rgba(255,255,255,.25)}
.portal__door::after{content:"";position:absolute;top:50%;width:3px;height:64px;margin-top:-32px;background:linear-gradient(180deg,var(--gold-hi),var(--gold-deep));border-radius:2px}
.portal__door--l::after{right:18px}.portal__door--r::after{left:18px}
.portal.is-open .portal__door--l{transform:translateX(-101%)}
.portal.is-open .portal__door--r{transform:translateX(101%)}
.portal.no-anim .portal__door{display:none}
.portal__cap{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:22px;font-size:var(--t-sm);color:var(--on-dark-3);transition:color .25s}
.portal__cap b{font-weight:600;color:var(--on-dark)}
.portal__cap:hover{color:var(--gold-soft)}
.portal__cap .code{color:var(--gold);font-size:var(--t-2xs)}
.hero__scroll{position:absolute;bottom:18px;left:50%;transform:translateX(-50%);display:none}
@media (max-width:959px){
  .hero{min-height:auto;padding-top:calc(var(--hdr-h) + 14px)}
  .hero__grid{grid-template-columns:1fr;gap:26px}
  .hero__stage{order:-1}
  .portal{width:100%}
  .portal__frame{aspect-ratio:4/3.3;padding:10px}
  .portal__media{inset:10px}
  .portal__display{height:30px;width:88px;margin-bottom:12px;font-size:var(--t-base)}
  .portal__cap{margin-top:12px;font-size:var(--t-xs)}
  .hero__txt{display:flex;flex-direction:column;gap:18px}
  .hero__txt .kicker{order:1;font-size:var(--t-xs)}
  .hero__txt .display{order:2;max-width:none;font-size:clamp(33px,9vw,46px)}
  .hero__txt .btn-row{order:3}
  .hero__txt .hero__sub{order:4;font-size:var(--t-base)}
  .hero__txt .hero__trust{order:5}
  .hero__txt .btn-row .btn{flex:1 1 220px}
}
@media (max-width:559px){.hero__txt .kicker::before{width:22px}}

/* ---------- product bento ---------- */
.bento{display:grid;grid-template-columns:1.22fr 1fr 1fr;grid-template-rows:repeat(2,clamp(300px,27vw,410px));gap:clamp(12px,1.4vw,20px)}
.bento>.ptile:first-child{grid-row:1/3}
.bento__more{grid-column:1/-1;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:clamp(18px,3vw,44px);padding:clamp(22px,2.6vw,34px);background:var(--white);border:1px solid var(--line-light-2)}
.bento__more .ph{width:clamp(88px,9vw,120px);aspect-ratio:3/4}
.bento__more h3{font-size:var(--t-h3);font-weight:600;margin-bottom:6px}
.bento__more p{color:var(--muted);font-size:var(--t-base);line-height:1.85}
.svc-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}
.svc-chips span{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 14px;border:1px solid var(--line-light-2);font-size:var(--t-sm);color:var(--ink-2);background:var(--white)}
.svc-chips .i{width:16px;height:16px;color:var(--gold-deep)}
@media (max-width:959px){
  .bento{grid-template-columns:1fr 1fr;grid-template-rows:none}
  .bento>.ptile{aspect-ratio:3/3.7}
  .bento>.ptile:first-child{grid-row:auto;grid-column:1/-1;aspect-ratio:4/4.2}
  .bento__more{grid-template-columns:auto 1fr}
  .bento__more .btn{grid-column:1/-1}
}
@media (max-width:559px){.ptile__d{display:none}.ptile__body{padding:14px}.ptile__t{font-size:var(--t-base)}}

/* ---------- collection head ---------- */
.coll-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:20px 40px;margin-bottom:28px}
.coll-tools{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:28px}
.coll-tools .chip-scroller{flex:1;margin-inline:0;padding-inline:0}
@media (max-width:759px){.coll-tools .rail-nav{display:none}.coll-tools .chip-scroller{margin-inline:calc(-1*var(--gutter));padding-inline:var(--gutter)}}

/* ---------- audience ---------- */
.aud{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,1.6vw,22px)}
.aud__card{display:flex;flex-direction:column;gap:18px;position:relative}
.aud__card h3{font-size:var(--t-h3);font-weight:600;line-height:1.5}
.aud__card .flist li{padding:10px 0;font-size:var(--t-sm)}
.aud__card .flist li:first-child{border-top:0}
.aud__card .flist li:last-child{border-bottom:0}
.aud__card .link-arrow{margin-top:auto}
.aud__tag{font-size:var(--t-xs);color:var(--muted)}
@media (max-width:959px){.aud{grid-template-columns:1fr}}

/* ---------- studio (full + mini) ---------- */
.studio{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(28px,4.5vw,72px);align-items:start}
.studio>*{min-width:0}
.studio__side{grid-template-columns:minmax(0,1fr)}
.studio__side>*{min-width:0}
.studio__stage-wrap{position:sticky;top:calc(var(--hdr-h) + 20px)}
.studio__stage{position:relative;aspect-ratio:600/900;width:min(100%,520px);margin-inline:auto;background:var(--night-0);border-radius:var(--r-img);overflow:hidden;box-shadow:var(--shadow-2)}
.studio__stage svg{width:100%;height:100%}
.studio__note{margin-top:22px;text-align:center;font-size:var(--t-xs);line-height:1.8;color:var(--muted);max-width:52ch;margin-inline:auto}
[data-theme=dark] .studio__note{color:var(--on-dark-3)}
.studio__panel{display:grid;gap:26px}
.sg{border:0;margin:0;padding:0;min-width:0}
.sg__head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:12px}
.sg__t{font-weight:600;font-size:var(--t-base)}
.sg__v{font-size:var(--t-sm);color:var(--gold-deep);font-weight:500}
[data-theme=dark] .sg__v{color:var(--gold)}
.sg__opts{display:flex;flex-wrap:wrap;gap:10px}
.sg__opt{transition:all .2s}
.sg__opt--swatch{width:46px;height:46px;border-radius:50%;padding:3px;border:1px solid var(--line-light-2);background:var(--white)}
[data-theme=dark] .sg__opt--swatch{border-color:rgba(var(--on-dark-rgb),.18);background:transparent}
.sg__opt--swatch .sw{display:block;width:100%;height:100%;border-radius:50%;box-shadow:inset 0 1px 2px rgba(0,0,0,.25)}
.sg__opt--swatch[aria-pressed=true]{border-color:var(--gold-deep);box-shadow:0 0 0 2px var(--gold-deep)}
[data-theme=dark] .sg__opt--swatch[aria-pressed=true]{border-color:var(--gold);box-shadow:0 0 0 2px var(--gold)}
.sg__opt--seg{height:44px;padding:0 18px;border:1px solid var(--line-light-2);background:var(--white);font-size:var(--t-sm);font-weight:500}
[data-theme=dark] .sg__opt--seg{border-color:rgba(var(--on-dark-rgb),.16);background:rgba(255,255,255,.03)}
.sg__opt--seg[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:var(--paper)}
[data-theme=dark] .sg__opt--seg[aria-pressed=true]{background:var(--gold);border-color:var(--gold);color:var(--on-gold)}
.sg__opt--tile{display:grid;gap:6px;width:92px;padding:6px 6px 8px;border:1px solid var(--line-light-2);background:var(--white);text-align:center}
[data-theme=dark] .sg__opt--tile{border-color:rgba(var(--on-dark-rgb),.16);background:rgba(255,255,255,.03)}
.sg__opt--tile .tl svg{width:100%;height:auto;aspect-ratio:3/2}
.sg__opt--tile .tl__t{font-size:var(--t-xs);font-weight:500;line-height:1.4}
.sg__opt--tile[aria-pressed=true]{border-color:var(--gold-deep);box-shadow:inset 0 0 0 1px var(--gold-deep)}
[data-theme=dark] .sg__opt--tile[aria-pressed=true]{border-color:var(--gold);box-shadow:inset 0 0 0 1px var(--gold)}
.sg__opt:hover{border-color:var(--gold-deep)}
.presets{display:flex;gap:10px;overflow-x:auto;scrollbar-width:thin;padding-bottom:6px;max-width:100%;overscroll-behavior-x:contain}
.preset{flex:none;display:flex;align-items:center;gap:10px;padding:6px 12px 6px 6px;border:1px solid var(--line-light-2);background:var(--white);text-align:right;transition:border-color .2s}
.preset img{width:40px;height:54px;object-fit:cover}
.preset b{display:block;font-size:var(--t-sm);font-weight:600;white-space:nowrap}
.preset small{font-size:var(--t-2xs);color:var(--gold-ink)}
.preset:hover,.preset.is-on{border-color:var(--gold-deep)}
.preset.is-on{box-shadow:inset 0 0 0 1px var(--gold-deep)}
.st-sum{background:var(--white);border:1px solid var(--line-light-2);padding:clamp(20px,2.4vw,30px);display:grid;gap:16px}
.st-sum__head{display:flex;align-items:center;justify-content:space-between;font-weight:600;font-size:var(--t-md)}
.st-sum__from{font-size:var(--t-sm);color:var(--muted)}
.st-sum__actions{display:grid;gap:10px}
.st-sum__row{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.st-sum__row .btn{padding:0 8px;font-size:var(--t-sm)}
.st-sum__sim{display:flex;flex-wrap:wrap;align-items:center;gap:10px;border-top:1px solid var(--line-light-2);padding-top:14px;font-size:var(--t-xs);color:var(--muted)}
.st-sum__sim span{flex-basis:100%}
.st-sum__sim a{display:grid;gap:4px;width:64px;text-align:center}
.st-sum__sim img{width:64px;height:84px;object-fit:cover}
.st-sum__sim small{font-size:var(--t-xs);line-height:1.4;color:var(--ink-2)}
@media (max-width:959px){
  .studio{grid-template-columns:1fr}
  .studio__stage-wrap{position:relative;top:auto}
  .studio__stage{width:min(100%,380px)}
}
@media (max-width:559px){.st-sum__row{grid-template-columns:1fr 1fr}.st-sum__row .btn:last-child{grid-column:1/-1}}
.studio-mini{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);grid-template-areas:"txt stage" "ctrl stage";column-gap:clamp(28px,5vw,90px);row-gap:30px;align-items:start}
.studio-mini__txt{grid-area:txt;align-self:end}
.studio-mini__stage{grid-area:stage;align-self:center}
.studio-mini__ctrl{grid-area:ctrl}
.studio-mini .studio__stage{width:min(100%,400px)}
.studio-mini .studio__panel{gap:22px}
@media (max-width:959px){
  .studio-mini{grid-template-columns:1fr;grid-template-areas:"txt" "stage" "ctrl";row-gap:26px}
  .studio-mini .studio__stage{width:min(100%,300px)}
}

/* ---------- workshop ---------- */
.work{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(32px,5vw,88px);align-items:start}
.work__media{display:grid;gap:clamp(12px,1.4vw,18px)}
.work__strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,1.4vw,18px)}
.work__strip figure{display:grid;gap:8px}
.work__strip .ph{aspect-ratio:4/5}
.work__strip figcaption{font-size:var(--t-xs);color:var(--muted)}
[data-theme=dark] .work__strip figcaption{color:var(--on-dark-3)}   /* the strip sits on dark (home) and on paper (about) */
@media (max-width:959px){.work{grid-template-columns:1fr}}

/* ---------- reels ---------- */
.reels{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(12px,1.4vw,20px)}
@media (max-width:959px){.reels{grid-auto-flow:column;grid-template-columns:none;grid-auto-columns:minmax(62%,1fr);overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin-inline:calc(-1*var(--gutter));padding-inline:var(--gutter)}.reels>*{scroll-snap-align:start}.reels::-webkit-scrollbar{display:none}}
@media (min-width:560px) and (max-width:959px){.reels{grid-auto-columns:40%}}

/* ---------- credentials / founder ---------- */
.creds{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,5vw,88px);align-items:start}
.founder{position:relative;padding:clamp(28px,3.4vw,48px);background:var(--night);color:var(--on-dark);overflow:hidden;isolation:isolate}
.founder__mark{display:block;width:40px;height:40px;color:var(--gold);opacity:.8;margin-bottom:14px}
.founder blockquote{font-size:var(--t-h4);font-weight:300;line-height:1.7}
.founder blockquote b{font-weight:600;color:var(--gold-soft)}
.founder__who{display:flex;align-items:center;gap:16px;margin-top:28px;padding-top:24px;border-top:1px solid var(--line-dark-2)}
.founder__who img{width:64px;height:64px;border-radius:50%;object-fit:cover;box-shadow:0 0 0 1px rgba(var(--gold-rgb),.6),0 0 0 5px rgba(var(--gold-rgb),.12)}
.founder__who b{display:block;font-weight:600}
.founder__who small{color:var(--on-dark-3);font-size:var(--t-xs)}
.certs{display:grid;grid-template-columns:.62fr 1fr;gap:16px;align-items:end;margin-top:26px}
.cert{display:grid;gap:10px}
.cert .zoomable{background:var(--white);padding:10px;border:1px solid var(--line-light-2);box-shadow:var(--shadow-1)}
.cert img{width:100%;height:auto}
.cert figcaption{font-size:var(--t-xs);line-height:1.7;color:var(--muted)}
.promises{display:grid;grid-template-columns:1fr 1fr;gap:0;margin-top:clamp(28px,3vw,40px);border-top:1px solid var(--line-light-2)}
.promise{display:grid;grid-template-columns:auto 1fr;gap:14px;padding:20px 0;border-bottom:1px solid var(--line-light-2)}
.promise:nth-child(odd){padding-inline-end:22px;border-inline-end:1px solid var(--line-light-2)}
.promise:nth-child(even){padding-inline-start:22px}
.promise b{display:block;font-weight:600;margin-bottom:2px}
.promise span{font-size:var(--t-sm);color:var(--muted);line-height:1.8}
.promise .i{width:24px;height:24px;color:var(--gold-deep);margin-top:2px}
@media (max-width:959px){.creds{grid-template-columns:1fr}}
@media (max-width:559px){.promises{grid-template-columns:1fr}.promise:nth-child(odd){padding-inline-end:0;border-inline-end:0}.promise:nth-child(even){padding-inline-start:0}}

/* ---------- FAQ + guide aside ---------- */
.faq-wrap{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:clamp(32px,5vw,88px);align-items:start}
.guide-aside{display:grid;gap:12px;position:sticky;top:calc(var(--hdr-h) + 24px)}
.guide-aside h3{font-size:var(--t-base);font-weight:600;margin-bottom:4px}
.gcard{display:grid;grid-template-columns:72px 1fr;gap:14px;align-items:center;padding:12px;border:1px solid var(--line-light-2);background:var(--white);transition:border-color .25s}
.gcard:hover{border-color:var(--gold-deep)}
.gcard .ph{aspect-ratio:3/4}
.gcard b{display:block;font-weight:600;font-size:var(--t-sm);line-height:1.6}
.gcard small{font-size:var(--t-xs);color:var(--muted)}
.gcard.is-soon{opacity:.7;pointer-events:none}
.gcard.is-soon small::after{content:" · به‌زودی";color:var(--gold-deep)}
@media (max-width:959px){.faq-wrap{grid-template-columns:1fr}.guide-aside{position:static}}

/* ---------- callback mini-form (CTA band) ---------- */
.callback{display:grid;gap:12px;padding:18px;border:1px solid var(--line-dark);background:rgba(var(--gold-rgb),.06);margin-bottom:6px}
.callback__t{font-size:var(--t-base);color:var(--on-dark-2)}
.callback__t b{color:var(--on-dark);font-weight:600}
.callback__row{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.callback__row .input{grid-column:1/-1;direction:ltr;text-align:right}
.callback__row .input::placeholder{direction:rtl}
.callback__row .btn{min-height:52px}
.callback__err{font-size:var(--t-xs);color:#f0a58f}
.callback__ok{display:grid;gap:10px;font-size:var(--t-sm);color:var(--on-dark-2);line-height:1.8}
.callback__ok b{color:var(--on-dark)}
/* honeypot: clipped in place — never park it at left:-9999px (in RTL, leftward overflow is scrollable) */
.hp{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;clip-path:inset(50%)!important;border:0!important;opacity:0!important;pointer-events:none!important}
form{position:relative}
@media (max-width:559px){.callback__row{grid-template-columns:1fr}}

/* ==========================================================================
   INNER PAGES
   ========================================================================== */
.phero .h1{max-width:18ch}
.phero .lead{max-width:58ch}
.facts{list-style:none;margin:10px 0 0;padding:18px 0 0;display:flex;flex-wrap:wrap;gap:0;border-top:1px solid var(--line-dark-2)}
.facts li{display:grid;gap:2px;padding-inline-end:26px;margin-inline-end:26px;border-inline-end:1px solid var(--line-dark-2)}
.facts li:last-child{border:0;margin:0;padding:0}
.facts b{font-size:var(--t-h4);font-weight:300;color:var(--gold-soft);line-height:1.2}
.facts span{font-size:var(--t-xs);color:var(--on-dark-3)}
[data-theme=light] .facts{border-top-color:var(--line-light-2)}
[data-theme=light] .facts li{border-inline-end-color:var(--line-light-2)}
[data-theme=light] .facts b{color:var(--gold-deep)}
[data-theme=light] .facts span{color:var(--muted)}
/* phones: equal columns in one row — wrapping left the last fact alone on a second line */
@media (max-width:559px){.facts{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr)}.facts li{padding-inline-end:10px;margin-inline-end:10px}.facts b{font-size:var(--t-lg)}}

/* two-photo composition */
.duo{position:relative;padding:0 0 clamp(40px,6vw,80px) clamp(40px,7vw,110px)}
.duo__a{aspect-ratio:3/3.9;box-shadow:var(--shadow-2)}
.duo__b{position:absolute;left:0;bottom:0;width:44%;aspect-ratio:3/4;border:6px solid var(--night);box-shadow:var(--shadow-2)}
[data-theme=light] .duo__b{border-color:var(--paper)}
@media (max-width:959px){.duo{padding:0 0 34px 60px;max-width:520px;margin-inline:auto}.duo__a{aspect-ratio:4/5}}
/* phones: one clear photo instead of two overlapping ones */
@media (max-width:559px){.duo{padding:0;max-width:none}.duo__b{display:none}}

/* sub-section head inside a section */
.sub-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:14px 40px;margin:clamp(56px,7vw,96px) 0 26px;padding-top:28px;border-top:1px solid var(--line-dark-2)}
[data-theme=light] .sub-head{border-top-color:var(--line-light-2)}
.sub-head h3{font-size:var(--t-h4);font-weight:300;line-height:1.4}
.sub-head p{max-width:56ch;color:var(--on-dark-2);font-size:var(--t-base)}
[data-theme=light] .sub-head p{color:var(--muted)}

/* anatomy */
.anat{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(32px,5vw,90px);align-items:center}
.anat__stage{position:relative;width:min(100%,460px);margin-inline:auto}
.anat__stage .studio__stage{width:100%}
.anat__pin{position:absolute;width:30px;height:30px;margin:-15px 0 0 -15px;border-radius:50%;display:grid;place-items:center;background:var(--gold);color:var(--on-gold);font-size:var(--t-xs);font-weight:700;box-shadow:0 0 0 5px rgba(var(--gold-rgb),.28),0 6px 16px rgba(0,0,0,.4);z-index:3;transition:transform .25s var(--ease)}
.anat__pin::after{content:"";position:absolute;inset:-9px;border-radius:50%;border:1px solid rgba(var(--gold-rgb),.5);animation:pulse 2.8s var(--ease) infinite}
.anat__pin:hover,.anat__pin.is-on{transform:scale(1.18)}
.anat__list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:0 28px}
.anat__list li{display:grid;grid-template-columns:34px 1fr;gap:12px;padding:15px 0;border-bottom:1px solid var(--line-light-2);transition:background .25s}
.anat__list li.is-on{background:linear-gradient(90deg,transparent,rgba(var(--gold-rgb),.10))}
.anat__n{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--gold-deep);color:var(--gold-deep);font-size:var(--t-2xs);font-weight:700;margin-top:2px}
.anat__list b{display:block;font-weight:600;font-size:var(--t-base)}
.anat__list span{font-size:var(--t-sm);color:var(--muted);line-height:1.8}
@media (max-width:959px){.anat{grid-template-columns:1fr}.anat__list{grid-template-columns:1fr}}

/* finishes library */
.finishes{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(12px,1.4vw,20px)}
.finish{display:grid;gap:10px}
.finish__sw{display:block;aspect-ratio:16/10;position:relative;overflow:hidden;box-shadow:inset 0 0 0 1px rgba(0,0,0,.08)}
.finish__sw::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,rgba(255,255,255,.06) 0 1px,transparent 1px 3px)}
.finish b{font-weight:600;font-size:var(--t-base)}
.finish span{font-size:var(--t-xs);color:var(--muted);line-height:1.75}
[data-theme=dark] .finish span{color:var(--on-dark-3)}
.opt-cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,1.6vw,22px);margin-top:clamp(28px,3vw,40px)}
.opt-col{background:var(--white);border:1px solid var(--line-light-2);padding:clamp(18px,2vw,26px);display:grid;gap:14px;align-content:start}
.opt-col h4{font-size:var(--t-base);font-weight:600;display:flex;align-items:center;gap:10px}
.opt-col h4 .i{color:var(--gold-deep)}
.opt-col ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.opt-col li{display:grid;grid-template-columns:56px 1fr;gap:12px;align-items:center;font-size:var(--t-sm);line-height:1.6}
.opt-col li svg{width:56px;height:auto;aspect-ratio:3/2;border:1px solid var(--line-light-2)}
.opt-col li small{display:block;color:var(--muted);font-size:var(--t-xs)}
.disclaimer{display:flex;gap:10px;align-items:flex-start;margin-top:22px;font-size:var(--t-xs);color:var(--muted);line-height:1.8}
.disclaimer .i{width:18px;height:18px;color:var(--gold-deep);margin-top:3px}
[data-theme=dark] .disclaimer{color:var(--on-dark-3)}
@media (max-width:959px){.finishes{grid-template-columns:repeat(2,minmax(0,1fr))}.opt-cols{grid-template-columns:1fr}}

/* order timeline */
.tline{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));counter-reset:tl;position:relative}
@media (min-width:960px){.tline--custom{grid-template-columns:repeat(var(--n),minmax(0,1fr))}}   /* page builder: any number of steps */
.tline::before{content:"";position:absolute;top:26px;inset-inline:10%;height:1px;background:var(--line-light)}
[data-theme=dark] .tline::before{background:var(--line-dark)}
.tline li{position:relative;display:grid;justify-items:center;text-align:center;gap:10px;padding:0 10px}
.tline li::before{counter-increment:tl;content:counter(tl,persian);width:52px;height:52px;display:grid;place-items:center;border-radius:50%;background:var(--paper);border:1px solid var(--gold-deep);color:var(--gold-deep);font-weight:600;font-size:var(--t-md);position:relative;z-index:1}
[data-theme=dark] .tline li::before{background:var(--night);border-color:var(--gold);color:var(--gold)}
.bg-white .tline li::before{background:var(--white)}
.tline b{font-weight:600;font-size:var(--t-base)}
.tline span{font-size:var(--t-sm);color:var(--muted);line-height:1.75}
[data-theme=dark] .tline span{color:var(--on-dark-3)}
@media (max-width:959px){.tline{grid-template-columns:1fr;gap:6px}.tline::before{top:10px;bottom:10px;inset-inline:auto;right:25px;width:1px;height:auto}.tline li{grid-template-columns:52px 1fr;justify-items:start;text-align:right;gap:4px 16px;padding:6px 0}.tline li::before{grid-row:1/3}}

/* band (small cross-sell strip) */
.band{display:grid;grid-template-columns:auto 1fr auto;gap:clamp(18px,3vw,40px);align-items:center;padding:clamp(22px,3vw,36px);border:1px solid var(--line-dark);background:linear-gradient(120deg,rgba(var(--gold-rgb),.12),rgba(var(--gold-rgb),.02))}
.band .ph{width:clamp(80px,9vw,120px);aspect-ratio:3/4}
.band h3{font-size:var(--t-h3);font-weight:600;margin-bottom:6px}
.band p{color:var(--on-dark-2);font-size:var(--t-base)}
@media (max-width:759px){.band{grid-template-columns:auto 1fr}.band .btn{grid-column:1/-1}}

/* matched set + shortlist in the lightbox */
.lb__pair{display:grid;gap:10px;border-top:1px solid var(--line-dark-2);padding-top:14px}
.lb__pair>span{font-size:var(--t-xs);color:var(--on-dark-3)}
.lb__pair div{display:flex;gap:10px}
.lb__pair a{display:grid;grid-template-columns:44px 1fr;gap:10px;align-items:center;padding:6px;border:1px solid var(--line-dark-2);flex:1;min-width:0;transition:border-color .2s}
.lb__pair a:hover{border-color:var(--gold)}
.lb__pair img{width:44px;height:58px;object-fit:cover}
.lb__pair b{display:block;font-size:var(--t-sm);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lb__pair small{font-size:var(--t-2xs);color:var(--gold)}
.btn[aria-pressed=true]{background:rgba(var(--gold-rgb),.16);border-color:var(--gold);color:var(--gold-soft)}
.btn[aria-pressed=true] .i{fill:currentColor}

/* shortlist tray */
.slist-fab{visibility:hidden;position:fixed;left:clamp(14px,2vw,28px);bottom:calc(24px + env(safe-area-inset-bottom));z-index:44;display:inline-flex;align-items:center;gap:10px;height:50px;padding:0 18px;background:var(--night-2);color:var(--on-dark);border:1px solid var(--gold);box-shadow:0 14px 30px -12px rgba(0,0,0,.6);font-weight:600;font-size:var(--t-sm);transform:translateY(160%);transition:transform .45s var(--ease)}
.slist-fab.is-on{transform:none;visibility:visible}
.slist-fab .i{color:var(--gold)}
.slist-fab .n{min-width:24px;height:24px;border-radius:12px;display:grid;place-items:center;background:var(--gold);color:var(--on-gold);font-size:var(--t-2xs);padding:0 6px}
@media (max-width:1099px){.slist-fab{bottom:calc(84px + env(safe-area-inset-bottom))}}
body.menu-open .slist-fab,body.lb-open .slist-fab{transform:translateY(260%)}
.slist{position:fixed;inset:0;z-index:101;display:flex;justify-content:flex-end;flex-direction:column;background:rgba(var(--shade-rgb),.6);opacity:0;visibility:hidden;transition:opacity .3s,visibility 0s linear .3s}
.slist.is-open{opacity:1;visibility:visible;transition:opacity .3s}
.slist__panel{align-self:flex-end;width:min(440px,100%);height:100%;background:var(--night-2);color:var(--on-dark);display:flex;flex-direction:column;border-inline-start:1px solid var(--line-dark);transform:translateX(-100%);transition:transform .45s var(--ease);margin-inline-end:auto}
.slist.is-open .slist__panel{transform:none}
.slist__head{display:flex;align-items:center;justify-content:space-between;padding:20px 22px;border-bottom:1px solid var(--line-dark-2)}
.slist__head b{font-size:var(--t-md);font-weight:600}
.slist__head button{width:44px;height:44px;display:grid;place-items:center;border:1px solid var(--line-dark-2)}
.slist__items{flex:1;overflow-y:auto;padding:14px 22px;display:grid;gap:10px;align-content:start}
.slist__item{display:grid;grid-template-columns:56px 1fr auto;gap:12px;align-items:center;padding:8px;border:1px solid var(--line-dark-2)}
.slist__item img{width:56px;height:74px;object-fit:cover}
.slist__item b{display:block;font-weight:600;font-size:var(--t-sm)}
.slist__item small{font-size:var(--t-2xs);color:var(--gold)}
.slist__item button{width:44px;height:44px;display:grid;place-items:center;color:var(--on-dark-3)}
.slist__item button:hover{color:#f0a58f}
.slist__empty{color:var(--on-dark-3);font-size:var(--t-sm);line-height:1.9;padding:18px 0}
.slist__foot{padding:18px 22px calc(18px + env(safe-area-inset-bottom));border-top:1px solid var(--line-dark-2);display:grid;gap:8px}
.slist__foot .row{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.dcard__save{position:absolute;top:12px;left:12px;z-index:2;width:30px;height:30px;display:none;place-items:center;background:var(--gold);color:var(--on-gold)}
.dcard__save .i{width:16px;height:16px;fill:currentColor}
.dcard.is-saved .dcard__save{display:grid}
.is-disabled{opacity:.4;pointer-events:none}

/* ---------- generic grids ---------- */
.g4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(12px,1.4vw,20px)}
.g3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,1.4vw,20px)}
.g2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(20px,3vw,48px)}
@media (max-width:959px){.g4{grid-template-columns:repeat(2,minmax(0,1fr))}.g3{grid-template-columns:1fr}}
@media (max-width:759px){.g2{grid-template-columns:1fr}}
@media (max-width:559px){.g4{grid-template-columns:1fr}}
.tcard{display:grid;gap:14px;align-content:start}
.tcard h3{font-size:var(--t-md);font-weight:600;line-height:1.5}
.tcard p{font-size:var(--t-sm);color:var(--muted);line-height:1.85}
[data-theme=dark] .tcard p{color:var(--on-dark-2)}
.tcard .link-arrow{margin-top:4px;font-size:var(--t-sm)}

/* split feature */
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,6vw,100px);align-items:center}
.split--media-narrow{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)}
.split__media{position:relative}
.split__txt{display:grid;gap:20px;align-content:center}
@media (max-width:959px){.split,.split--media-narrow{grid-template-columns:1fr}}

/* spec table */
.spec-table{width:100%;border-collapse:collapse;font-size:var(--t-base)}
.spec-table th,.spec-table td{padding:14px 12px;border-bottom:1px solid var(--line-light-2);text-align:right;vertical-align:top;line-height:1.8}
.spec-table th{width:30%;font-weight:600;color:var(--ink-2)}
.spec-table td{color:var(--ink)}
.spec-table td small{display:block;color:var(--muted);font-size:var(--t-xs)}
.spec-table tr:first-child th,.spec-table tr:first-child td{border-top:1px solid var(--line-light-2)}
.spec-table .pillset{display:flex;flex-wrap:wrap;gap:6px}
.spec-table .pillset span{padding:2px 10px;border:1px solid var(--line-light);font-size:var(--t-xs);background:var(--white)}
@media (max-width:559px){.spec-table th,.spec-table td{display:block;width:auto;padding:6px 0}.spec-table th{padding-top:14px;border-bottom:0}.spec-table tr:first-child td{border-top:0}}

/* matched pairs */
.pairs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,1.6vw,24px)}
.pair{display:grid;gap:14px}
.pair__imgs{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.pair__imgs .ph{aspect-ratio:3/4.2}
.pair__plus{position:absolute}
.pair b{font-weight:600;font-size:var(--t-base)}
.pair small{display:block;color:var(--on-dark-3);font-size:var(--t-xs)}
@media (max-width:959px){.pairs{grid-template-columns:1fr;max-width:520px}}

/* estimator (auto-door cladding) */
.est{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);gap:clamp(24px,4vw,64px);align-items:start}
.est__form{display:grid;gap:26px}
.est__q{display:grid;gap:12px}
.est__q>span{font-weight:600;font-size:var(--t-base)}
.est__sum{position:sticky;top:calc(var(--hdr-h) + 20px)}
.swatch-pills{display:flex;flex-wrap:wrap;gap:10px}
.swatch-pill{position:relative}
.swatch-pill input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.swatch-pill span{display:inline-flex;align-items:center;gap:10px;height:46px;padding:0 16px 0 8px;border:1px solid var(--line-light-2);background:var(--white);font-size:var(--t-sm);font-weight:500}
.swatch-pill i{width:30px;height:30px;border-radius:50%;box-shadow:inset 0 1px 2px rgba(0,0,0,.25)}
.swatch-pill input:checked+span{border-color:var(--gold-deep);box-shadow:inset 0 0 0 1px var(--gold-deep)}
.swatch-pill input:focus-visible+span{outline:2px solid var(--gold);outline-offset:2px}
@media (max-width:959px){.est{grid-template-columns:1fr}.est__sum{position:static}}

/* before / after slider */
.ba{position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--night-3);user-select:none;touch-action:pan-y;--pos:50%}
.ba__side{position:absolute;inset:0;display:grid;place-items:center}
.ba__side img{width:100%;height:100%;object-fit:cover}
.ba__after{clip-path:inset(0 calc(100% - var(--pos)) 0 0)}
.ba__tag{position:absolute;top:14px;padding:4px 12px;font-size:var(--t-xs);font-weight:600;background:rgba(var(--night-rgb),.7);color:var(--on-dark);border:1px solid var(--line-dark);z-index:2}
.ba__before .ba__tag{right:14px}.ba__after .ba__tag{left:14px}
.ba__handle{position:absolute;top:0;bottom:0;left:var(--pos);width:2px;margin-left:-1px;background:var(--gold);z-index:3;pointer-events:none}
.ba__handle::after{content:"";position:absolute;top:50%;left:50%;width:46px;height:46px;margin:-23px 0 0 -23px;border-radius:50%;background:var(--night) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23e8d195' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 7-5 5 5 5M15 7l5 5-5 5'/%3E%3C/svg%3E") center/24px no-repeat;border:1px solid var(--gold)}
.ba input[type=range]{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:ew-resize;z-index:4;margin:0;direction:ltr}
.ba__ph{display:grid;justify-items:center;gap:10px;color:var(--on-dark-3);font-size:var(--t-sm);text-align:center;padding:20px}
.ba__ph .i{width:34px;height:34px;color:var(--gold)}
.ba__before{background:repeating-linear-gradient(135deg,#131315 0 14px,#18181a 14px 28px)}
.ba__after{background:repeating-linear-gradient(135deg,#1c1c1f 0 14px,#212124 14px 28px)}

/* gallery */
.gal{columns:4 260px;column-gap:clamp(12px,1.4vw,18px)}
.gal figure{break-inside:avoid;margin-bottom:clamp(12px,1.4vw,18px);display:grid;gap:8px}
.gal figure.is-hidden{display:none}
.gal .zoomable{overflow:hidden;background:var(--paper-3)}
.gal img{width:100%;height:auto;transition:transform 1s var(--ease)}
.gal .zoomable:hover img{transform:scale(1.04)}
.gal figcaption{display:flex;justify-content:space-between;gap:10px;font-size:var(--t-xs);color:var(--muted)}
.gal figcaption b{font-weight:600;color:var(--ink)}
.gal figcaption .code{color:var(--gold-ink)}
/* phones: two columns (one column made the projects page ~30 screens long) */
@media (max-width:559px){.gal{columns:2;column-gap:10px}.gal figure{margin-bottom:10px;gap:6px}.gal figcaption{flex-wrap:wrap;gap:0 8px}}

/* case (project) card */
.case{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);background:var(--white);border:1px solid var(--line-light-2)}
.case .ph{aspect-ratio:auto;min-height:100%}
.case__body{padding:clamp(20px,2.4vw,32px);display:grid;gap:14px;align-content:start}
.case__body h3{font-size:var(--t-md);font-weight:600;line-height:1.5}
@media (max-width:559px){.case{grid-template-columns:1fr}.case .ph{aspect-ratio:4/5}}   /* project photos are tall doors and cabins */

/* ---------- quote page ---------- */
.q-wrap{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,.75fr);gap:clamp(24px,4vw,64px);align-items:start}
.q-card{background:var(--white);border:1px solid var(--line-light-2);box-shadow:var(--shadow-1)}
.q-top{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px clamp(18px,2.6vw,34px);border-bottom:1px solid var(--line-light-2)}
.q-floor{display:flex;align-items:center;gap:12px;font-size:var(--t-sm);color:var(--muted)}
.q-led{display:inline-flex;align-items:center;gap:6px;min-width:64px;height:34px;justify-content:center;background:#060606;color:#ffb54a;font-weight:600;font-size:var(--t-base);text-shadow:0 0 8px rgba(255,170,60,.7);border:1px solid rgba(var(--gold-rgb),.35)}
.q-led .i{width:14px;height:14px;stroke-width:2.6}
.q-bar{display:flex;gap:4px;flex:1;max-width:260px}
.q-bar i{flex:1;height:4px;background:var(--paper-3);transition:background .3s}
.q-bar i.on{background:var(--gold-deep)}
.q-body{padding:clamp(20px,3vw,40px) clamp(18px,2.6vw,34px)}
.q-step{display:grid;gap:26px}
.q-step[hidden]{display:none}
.q-step h2{font-size:var(--t-h4);font-weight:300;line-height:1.4}
.q-step h2 small{display:block;font-size:var(--t-sm);color:var(--muted);margin-top:6px;font-weight:400}
.q-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.q-row--3{grid-template-columns:repeat(3,1fr)}
@media (max-width:759px){.q-row,.q-row--3{grid-template-columns:1fr}}
.q-sub{display:grid;gap:18px;padding:18px;border:1px solid var(--line-light-2);background:var(--paper)}
.q-sub[hidden]{display:none}
.q-sub>b{font-size:var(--t-sm);display:flex;align-items:center;gap:8px}
.q-sub>b .i{color:var(--gold-deep);width:20px;height:20px}
.q-nav{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px clamp(18px,2.6vw,34px);border-top:1px solid var(--line-light-2);background:var(--paper)}
.q-nav .btn[hidden]{display:none}
.q-pref{display:flex;align-items:center;gap:12px;padding:14px 16px;background:var(--gold-tint);border:1px solid var(--line-light);font-size:var(--t-sm)}
.q-pref .i{color:var(--gold-deep);flex:none}
.q-pref b{font-weight:600}
.q-review{display:grid;gap:0;border-top:1px solid var(--line-light-2)}
.q-review>div{display:grid;grid-template-columns:minmax(110px,32%) 1fr;gap:12px;padding:10px 0;border-bottom:1px solid var(--line-light-2);font-size:var(--t-sm)}
.q-review dt{color:var(--muted)}
.q-review dd{margin:0}
.q-done{display:grid;gap:16px;justify-items:center;text-align:center;padding:clamp(20px,4vw,48px) 0}
.q-done .i{width:54px;height:54px;color:var(--gold-deep)}
.q-done h2{font-weight:300}
.q-done p{color:var(--muted);max-width:52ch}
.q-side{display:grid;gap:16px;position:sticky;top:calc(var(--hdr-h) + 20px)}
.q-side .card h3{font-size:var(--t-base);font-weight:600;margin-bottom:10px}
.q-side ul{margin:0;padding:0 18px 0 0;display:grid;gap:6px;font-size:var(--t-sm);color:var(--muted);line-height:1.8}
@media (max-width:959px){.q-wrap{grid-template-columns:1fr}.q-side{position:static}}

/* ---------- contact ---------- */
.ccards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(12px,1.4vw,18px)}
.ccard{display:grid;gap:10px;padding:clamp(18px,2vw,26px);background:var(--white);border:1px solid var(--line-light-2);transition:border-color .25s,transform .35s var(--ease)}
a.ccard:hover{border-color:var(--gold-deep);transform:translateY(-2px)}
.ccard .i{width:26px;height:26px;color:var(--gold-deep)}
.ccard small{font-size:var(--t-xs);color:var(--muted)}
.ccard b{font-size:var(--t-md);font-weight:600}
@media (max-width:959px){.ccards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:559px){.ccards{grid-template-columns:1fr}}
.mapph{position:relative;aspect-ratio:16/10;overflow:clip;padding:clamp(18px,3vw,32px) 16px;background:var(--night-2);display:grid;place-items:center;isolation:isolate}
.mapph svg.map-art{position:absolute;inset:0;width:100%;height:100%;z-index:-1}
.mapph__card{display:grid;gap:10px;justify-items:center;text-align:center;padding:24px 28px;background:rgba(var(--night-rgb),.85);border:1px solid var(--line-dark);color:var(--on-dark);max-width:360px}
.mapph__card .i{width:30px;height:30px;color:var(--gold)}
.mapph__card small{color:var(--on-dark-3);font-size:var(--t-xs)}

/* ---------- article ---------- */
.prose{font-size:var(--t-prose);line-height:2.05;color:var(--ink-2)}
.prose>*+*{margin-top:1.1em}
.prose h2{font-size:var(--t-h4);font-weight:600;line-height:1.5;color:var(--ink);margin-top:2.2em;scroll-margin-top:calc(var(--hdr-h) + 20px)}
.prose h3{font-size:var(--t-lg);font-weight:600;color:var(--ink);margin-top:1.6em}
.prose ul,.prose ol{padding-inline-start:1.3em}
.prose li+li{margin-top:.4em}
.prose strong{color:var(--ink);font-weight:600}
.prose a{color:var(--gold-deep);border-bottom:1px solid var(--line-light)}
.prose blockquote{border-inline-start:3px solid var(--gold);padding:6px 20px;background:var(--gold-tint);color:var(--ink)}
.prose table{width:100%;border-collapse:collapse;font-size:var(--t-base);line-height:1.7}
.prose th,.prose td{border:1px solid var(--line-light-2);padding:10px 12px;text-align:center}
.prose th{background:var(--paper-2);font-weight:600}
.prose figure img{width:100%}
@media (max-width:559px){
  /* each row becomes a card; every cell carries its column label (data-label) */
  .prose table,.prose tbody,.prose tr,.prose td{display:block;width:100%}
  .prose thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
  .prose tr{border:1px solid var(--line-light-2);background:var(--white);padding:2px 14px}
  .prose tr+tr{margin-top:10px}
  .prose td{display:flex;justify-content:space-between;align-items:baseline;gap:14px;border:0;padding:10px 0;text-align:left}
  .prose td+td{border-top:1px solid var(--line-light-2)}
  .prose td::before{content:attr(data-label);flex:none;color:var(--muted);font-size:var(--t-sm);font-weight:600;text-align:right}
}
.prose figcaption{font-size:var(--t-xs);color:var(--muted);margin-top:8px}
.art-wrap{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:clamp(32px,5vw,80px);align-items:start}
.toc{position:sticky;top:calc(var(--hdr-h) + 24px);display:grid;gap:4px;padding:20px;border:1px solid var(--line-light-2);background:var(--white);font-size:var(--t-sm)}
.toc b{font-size:var(--t-sm);margin-bottom:6px}
.toc a{padding:5px 0;color:var(--muted);border-bottom:1px solid var(--line-light-2)}
.toc a:hover{color:var(--gold-deep)}
.art-meta{display:flex;flex-wrap:wrap;gap:8px 18px;font-size:var(--t-sm);color:var(--on-dark-3)}
.art-meta span{display:inline-flex;align-items:center;gap:6px}
.art-meta .i{width:16px;height:16px;color:var(--gold)}
@media (max-width:959px){.art-wrap{grid-template-columns:1fr}.toc{position:static;order:-1}}

/* guide list */
.guides{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,1.6vw,24px)}
.guide{display:grid;gap:14px;align-content:start}
.guide .ph{aspect-ratio:4/5}   /* cabin photos are tall: 4:3 kept a third of them */
.guide h3{font-size:var(--t-md);font-weight:600;line-height:1.6}
.guide p{font-size:var(--t-sm);color:var(--muted);line-height:1.85}
.guide__meta{font-size:var(--t-xs);color:var(--gold-ink);display:flex;gap:10px}
.guide.is-soon{opacity:.72}
.guide.is-soon .guide__meta::after{content:"به‌زودی";padding:0 8px;border:1px dashed var(--line-light)}
@media (max-width:959px){.guides{grid-template-columns:1fr 1fr}}
@media (max-width:559px){.guides{grid-template-columns:1fr}}

/* 404 */
.nf{min-height:100svh;display:grid;place-items:center;text-align:center;padding:calc(var(--hdr-h) + 40px) var(--gutter) 60px}
.nf__led{display:inline-flex;align-items:center;gap:14px;height:88px;padding:0 30px;background:#050505;border:1px solid rgba(var(--gold-rgb),.35);color:#ffb54a;font-size:56px;font-weight:600;text-shadow:0 0 18px rgba(255,170,60,.7);margin-bottom:30px}
.nf__led .i{width:34px;height:34px;stroke-width:2.4}
.dgrid--3{grid-template-columns:repeat(3,minmax(0,1fr));max-width:1040px}
.dgrid--3 .vslot{aspect-ratio:3/4.3}
@media (max-width:759px){.dgrid--3{grid-template-columns:repeat(2,minmax(0,1fr))}.dgrid--3>div:last-child{grid-column:1/-1;max-width:320px}}

/* ---------- touch targets: ≥44px on touch screens (mobile checklist) ----------
   Grown only where the pointer is coarse, so the desktop look stays as designed. */
@media (pointer:coarse){
  .chip{height:40px}
  .chip::after{content:"";position:absolute;inset:-2px 0}
  .chips,.chip-scroller{padding-top:2px}
  .crumbs a,.link-arrow,.m-menu__meta a{display:inline-flex;align-items:center;min-height:44px}
  .toc a{padding:12px 0}
  .foot-links{gap:0}
  .foot-links a{display:inline-flex;align-items:center;min-height:44px}
}

/* ---------- overlays own the screen ----------
   site.js locks the page behind an open overlay (position-fixed + scroll restore, so iOS holds
   too). The gutter stays reserved so nothing shifts sideways, and it is painted dark to sit
   under the scrim. Scrollable overlays never chain their scroll into the page. */
html.is-locked{scrollbar-gutter:stable;background:var(--night-0)}
.m-menu,.lb__panel,.lb__info,.slist__items{overscroll-behavior:contain}

/* ---------- typing: fixed bottom chrome steps aside (PAIN-004) ----------
   While the soft keyboard is up the dock and the shortlist button would sit on top of the
   form; the keyboard's own next/done key does their job. They return when it closes. */
body.is-typing .dock{transform:translateY(110%)}
body.is-typing .slist-fab{transform:translateY(260%)}

/* ---------- press feedback (replaces the browser tap highlight) ---------- */
.btn:active{transform:translateY(1px) scale(.985);transition-duration:.08s}
.chip:active,.pill:active span,.sg__opt:active,.preset:active,.swatch-pill:active span{transform:scale(.97);transition-duration:.08s}
.dcard:active .dcard__media img,.ptile:active img{transform:scale(1.02);transition-duration:.25s}
.vslot:active .vslot__play{transform:scale(.94)}
.nav__link:active,.m-menu__link:active,.foot-links a:active,.link-arrow:active{opacity:.7}
.contact-line:active,.ccard:active,.gcard:active,.opt:active .opt__box{background:rgba(var(--gold-rgb),.10)}
.faq summary:active{opacity:.75}
.hdr-burger:active,.hdr-call:active,.rail-nav button:active,.lb__close:active,.lb__nav:active{transform:scale(.94)}

/* ---------- credentials: every document gets the SAME square museum mount ---------- */
.creds-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(14px,1.8vw,26px);margin-top:clamp(24px,3vw,36px)}
.creds-grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.cred{display:grid;gap:16px;margin:0;align-content:start}
.cred__mount{position:relative;display:block;aspect-ratio:1/1;overflow:hidden;cursor:zoom-in;isolation:isolate;
  background:radial-gradient(120% 95% at 50% 0%,var(--white) 0%,#f3f0eb 62%,#e9e4dc 100%);
  box-shadow:0 1px 0 rgba(255,255,255,.6) inset,0 22px 44px -30px rgba(var(--shadow-rgb),.55),0 0 0 1px rgba(var(--gold-deep-rgb),.22);
  transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
.cred__mount::before{content:"";position:absolute;inset:14px;border:1px solid rgba(var(--gold-deep-rgb),.38);pointer-events:none;z-index:1}
.cred__mount::after{content:"";position:absolute;inset:19px;border:1px solid rgba(var(--gold-deep-rgb),.16);pointer-events:none;z-index:1}
.cred__doc{position:absolute;inset:13%;display:flex;align-items:center;justify-content:center}
.cred__doc img{max-width:100%;max-height:100%;width:auto;height:auto;background:#fff;
  box-shadow:0 1px 2px rgba(0,0,0,.16),0 14px 26px -12px rgba(var(--shadow-rgb),.45);transition:transform .7s var(--ease)}
.cred__seal{position:absolute;top:26px;right:26px;z-index:2;width:34px;height:34px;display:grid;place-items:center;border-radius:50%;
  background:var(--gold-btn);color:var(--on-gold);box-shadow:0 4px 12px -4px rgba(0,0,0,.35)}
.cred__seal .i{width:18px;height:18px}
.cred__zoom{position:absolute;bottom:26px;left:26px;z-index:2;display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 12px;
  background:var(--night);color:var(--gold-soft);font-size:var(--t-xs);font-weight:600;opacity:0;transform:translateY(6px);transition:opacity .3s,transform .35s var(--ease)}
.cred__zoom .i{width:15px;height:15px}
.cred__mount:hover{transform:translateY(-3px);box-shadow:0 1px 0 rgba(255,255,255,.6) inset,0 30px 54px -30px rgba(var(--shadow-rgb),.6),0 0 0 1px rgba(var(--gold-deep-rgb),.4)}
.cred__mount:hover .cred__doc img{transform:scale(1.03)}
.cred__mount:hover .cred__zoom,.cred__mount:focus-visible .cred__zoom{opacity:1;transform:none}
@media (hover:none){.cred__zoom{opacity:1;transform:none}}
.cred__meta{display:grid;gap:3px;padding-inline:2px}
.cred__type{font-size:var(--t-xs);font-weight:600;color:var(--gold-deep)}
.cred__t{font-size:var(--t-base);font-weight:600;line-height:1.55;color:var(--ink)}
.cred__by{font-size:var(--t-sm);color:var(--muted);line-height:1.7}
[data-theme=dark] .cred__mount{background:radial-gradient(120% 95% at 50% 0%,var(--night-4) 0%,var(--night-2) 70%,var(--night) 100%);box-shadow:0 22px 44px -26px rgba(0,0,0,.8),0 0 0 1px var(--line-dark)}
[data-theme=dark] .cred__mount::before{border-color:rgba(var(--gold-rgb),.4)}
[data-theme=dark] .cred__mount::after{border-color:rgba(var(--gold-rgb),.16)}
[data-theme=dark] .cred__type{color:var(--gold)}
[data-theme=dark] .cred__t{color:var(--on-dark)}
[data-theme=dark] .cred__by{color:var(--on-dark-3)}
.cred--card .cred__doc img{border-radius:4.2% / 6.4%}
@media (max-width:959px){.creds-grid--3{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:559px){
  .creds-grid,.creds-grid--3{gap:12px}
  .cred{gap:10px}
  .cred__mount::before{inset:8px}
  .cred__mount::after{inset:11px}
  .cred__doc{inset:12%}
  .cred__seal{top:14px;right:14px;width:24px;height:24px}
  .cred__seal .i{width:13px;height:13px}
  .cred__zoom{display:none}
  .cred__t{font-size:var(--t-sm)}
  .cred__by{font-size:var(--t-xs)}
}

/* projects page */
.films{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:clamp(12px,1.4vw,20px)}
.films__side{display:grid;gap:clamp(12px,1.4vw,20px)}
@media (max-width:959px){.films{grid-template-columns:1fr}}
.reels--6{grid-template-columns:repeat(6,minmax(0,1fr))}
@media (max-width:1099px){.reels--6{grid-template-columns:none}}
.cases{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(14px,1.6vw,24px)}
@media (max-width:959px){.cases{grid-template-columns:1fr}}

/* safety net: decorative offsets (gold frames) must never create sideways scroll — in RTL,
   leftward overflow is scrollable. clip ≠ hidden: no scroll container, so sticky still works */
main{overflow-x:clip}
/* the real input always stays on top of its visual label, even while :active scales the label */
.pill input,.swatch-pill input{z-index:2}
.opt input{z-index:3}
fieldset{border:0;padding:0;margin:0;min-width:0}
body[data-page=quote] .h1,body[data-page=contact] .h1{font-size:var(--t-h2)}

/* studio on phones: the preview stays pinned under the header while the options scroll */
@media (max-width:959px){
  body[data-keep-header] .studio__stage-wrap{position:sticky;top:var(--hdr-h);z-index:4;margin-inline:calc(-1*var(--gutter));padding:10px var(--gutter) 12px;background:var(--paper);box-shadow:0 14px 22px -20px rgba(0,0,0,.55)}
  body[data-keep-header] .studio__stage{width:auto;height:min(40vh,380px);aspect-ratio:600/900}
  body[data-keep-header] .studio__note{display:none}
}

/* ---------- shape — every surface's corner in one place ----------
   The values live in the tokens (--r, --r-lg, --r-img, --r-btn); this section only says which
   surface is which kind. A new component joins a list here instead of inventing a radius. */

/* buttons and small badges: pill-shaped */
.btn,.chip,.pill span,.swatch-pill span,.sg__opt--seg,.tag-code,.rail-nav button,
.lb__close,.lb__nav,.slist-fab,.dcard__save,.dock a,.svc-chips span,.guide.is-soon .guide__meta::after,.spec-table .pillset span{border-radius:var(--r-btn)}
.btn--gold{box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 12px 30px -16px rgba(var(--gold-rgb),.8)}
.btn--gold::after{background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.35) 50%,transparent 65%)}

/* inputs, option tiles, small controls */
.input,.select,.textarea,.stepper,.opt__box,.sg__opt--tile,.preset,.q-pref,.q-sub,.hdr-burger,.hdr-call,.step__n,.q-led,.portal__display,.nf__led,
.foot-social a,.dcard__zoom,.slist__head button{border-radius:var(--r)}
.stepper{overflow:hidden}

/* cards and panels: rounded, and on paper lifted by shadow rather than outlined */
.card,.q-card,.ccard,.callback,.contact-line,.band,.bento__more,.case,.founder,.toc,.st-sum,.opt-col,.gcard,
.mapph__card,.lb__pending,.mega__card,.mega__promo,.m-menu__sub a,.toast,.slist__item,.lb__pair a,.aud__card{border-radius:var(--r-lg)}
.case,.founder,.bento__more,.band{overflow:hidden}
.card,.q-card,.ccard,.gcard,.opt-col,.st-sum,.bento__more,.case{border-color:transparent;box-shadow:var(--shadow-1)}
[data-theme=dark] .card,.card[data-theme=dark]{border-color:var(--line-dark-2);box-shadow:none}
.mega{border-radius:0 0 var(--r-lg) var(--r-lg)}

/* photographs */
.ph,.dcard__media,.ptile,.vslot,.duo__a,.duo__b,.portal__media,.cred__mount,.finish__sw,
.gal .zoomable,.mega__img,.cert .zoomable,.ba,.mapph{border-radius:var(--r-img);overflow:hidden}
.portal__media{border-radius:calc(var(--r-img) - 8px)}
.cred__mount::before,.cred__mount::after{border-radius:calc(var(--r-img) - 8px)}
.case .ph{border-radius:0}
.preset img,.slist__item img,.lb__pair img,.m-menu__sub img,.st-sum__sim img{border-radius:8px}
