/* ══════════════════════════════════════════════════════════════
   MAISON SIMAR & GUNISHA — design system & motion
   Colours and fonts are set from the admin panel (Theme).
   ══════════════════════════════════════════════════════════════ */
:root{
  --ivory:#F8F3EA;--ivory-warm:#F0E8D9;--mocha:#2B1D13;--espresso:#1C140D;
  --gold:#B08D57;--gold-soft:#CDB183;--emerald:#134E3E;--oxblood:#6B1F2A;
  --serif:'Fraunces',Georgia,serif;--sans:'Archivo','Helvetica Neue',sans-serif;
  --ease:cubic-bezier(.2,.7,.1,1);--ease-io:cubic-bezier(.76,0,.24,1);
  --line:rgba(176,141,87,.28);--muted:#7a6a55;--pad:clamp(1.1rem,4vw,3rem);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:var(--sans);font-weight:300;font-size:.95rem;line-height:1.7;color:var(--espresso);background:var(--ivory);-webkit-font-smoothing:antialiased;overflow-x:hidden}
body.lock{overflow:hidden}
h1,h2,h3,h4{font-family:var(--serif);font-weight:300;line-height:1.1;letter-spacing:.005em}
h1 i,h2 i,h3 i,h4 i,.serif i{font-style:italic}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer;background:none;border:none}
::selection{background:var(--gold);color:var(--ivory)}
.wrap{max-width:1380px;margin:0 auto;padding:0 var(--pad)}
.eyebrow{display:inline-block;font-size:.66rem;font-weight:500;letter-spacing:.34em;text-transform:uppercase;color:var(--gold)}
.muted{color:var(--muted)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* grain texture for editorial depth */
body:after{content:'';position:fixed;inset:-50%;z-index:900;pointer-events:none;opacity:.045;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  animation:grain 1.2s steps(6) infinite}
@keyframes grain{0%{transform:translate(0,0)}20%{transform:translate(-3%,2%)}40%{transform:translate(2%,-3%)}60%{transform:translate(-2%,-1%)}80%{transform:translate(3%,3%)}100%{transform:translate(0,0)}}

/* ─── buttons ─── */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:.6rem;overflow:hidden;font-size:.74rem;font-weight:500;letter-spacing:.22em;text-transform:uppercase;padding:1.1rem 2.6rem;transition:color .5s var(--ease),border-color .5s,transform .4s var(--ease);isolation:isolate;white-space:nowrap}
.btn:before{content:'';position:absolute;inset:0;z-index:-1;transform:scaleY(0);transform-origin:bottom;transition:transform .55s var(--ease-io)}
.btn:hover:before{transform:scaleY(1);transform-origin:top}
.btn-em{background:var(--emerald);color:var(--ivory)}
.btn-em:before{background:var(--espresso)}
.btn-ghost{border:1px solid rgba(248,243,234,.6);color:var(--ivory)}
.btn-ghost:before{background:var(--ivory)}
.btn-ghost:hover{color:var(--espresso)}
.btn-line{border:1px solid rgba(28,20,13,.55);color:var(--espresso)}
.btn-line:before{background:var(--espresso)}
.btn-line:hover{color:var(--ivory)}
.btn-gold{background:var(--gold);color:var(--espresso)}
.btn-gold:before{background:var(--ivory)}
.btn-sm{padding:.75rem 1.4rem;font-size:.66rem}
.btn[disabled]{opacity:.5;pointer-events:none}
.link{border-bottom:1px solid var(--gold);padding-bottom:2px;font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;transition:color .3s}
.link:hover{color:var(--emerald)}

/* ─── preloader ─── */
#loader{position:fixed;inset:0;z-index:1000;background:var(--mocha);display:flex;align-items:center;justify-content:center;flex-direction:column;gap:1.4rem;transition:clip-path 1.1s var(--ease-io);clip-path:inset(0 0 0 0)}
#loader.out{clip-path:inset(0 0 100% 0)}
#loader svg{width:min(62vw,300px);overflow:visible}
#loader text{font-family:var(--serif);font-size:88px;font-style:italic;fill:transparent;stroke:var(--gold-soft);stroke-width:.8;stroke-dasharray:420;stroke-dashoffset:420;animation:draw 2s var(--ease) forwards}
@keyframes draw{70%{fill:transparent}to{stroke-dashoffset:0;fill:var(--gold-soft)}}
#loader .bar{width:120px;height:1px;background:rgba(205,177,131,.25);position:relative;overflow:hidden}
#loader .bar i{position:absolute;inset:0;background:var(--gold);transform:scaleX(0);transform-origin:left;animation:bar 1.8s var(--ease) forwards}
@keyframes bar{to{transform:scaleX(1)}}
#loader .ln{color:var(--gold-soft);font-size:.6rem;letter-spacing:.6em;text-transform:uppercase;padding-left:.6em}

/* ─── page transition curtain ─── */
#curtain{position:fixed;inset:0;z-index:950;pointer-events:none;display:flex;flex-direction:column}
#curtain span{flex:1;background:var(--mocha);transform:scaleY(0);transform-origin:bottom}
#curtain.in span{animation:cin .55s var(--ease-io) forwards}
#curtain.out span{transform:scaleY(1);transform-origin:top;animation:cout .6s var(--ease-io) forwards}
#curtain span:nth-child(2){animation-delay:.05s!important}#curtain span:nth-child(3){animation-delay:.1s!important}#curtain span:nth-child(4){animation-delay:.15s!important}
@keyframes cin{to{transform:scaleY(1)}}
@keyframes cout{to{transform:scaleY(0)}}
#curtain b{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:var(--serif);font-style:italic;font-weight:300;font-size:2.4rem;color:var(--gold-soft);opacity:0;transition:opacity .25s}
#curtain.in b{opacity:1;transition-delay:.3s}
.view{animation:viewin .9s var(--ease) both}
@keyframes viewin{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:none}}

/* ─── custom cursor ─── */
#cur,#cur-ring{position:fixed;top:0;left:0;pointer-events:none;z-index:980;border-radius:50%;opacity:0;transition:opacity .3s}
#cur{width:6px;height:6px;background:var(--gold);margin:-3px 0 0 -3px}
#cur-ring{width:38px;height:38px;margin:-19px 0 0 -19px;border:1px solid rgba(176,141,87,.65);display:flex;align-items:center;justify-content:center;transition:width .35s var(--ease),height .35s var(--ease),margin .35s var(--ease),background .35s,opacity .3s}
#cur-ring span{font-size:.55rem;letter-spacing:.2em;text-transform:uppercase;color:var(--ivory);opacity:0;transition:opacity .2s}
body.cur-on #cur,body.cur-on #cur-ring{opacity:1}
body.cur-view #cur-ring{width:86px;height:86px;margin:-43px 0 0 -43px;background:rgba(28,20,13,.78);border-color:transparent}
body.cur-view #cur-ring span{opacity:1}
body.cur-view #cur{opacity:0}
body.cur-link #cur-ring{width:58px;height:58px;margin:-29px 0 0 -29px;background:rgba(176,141,87,.12)}
@media (hover:none),(pointer:coarse){#cur,#cur-ring{display:none}}

/* ─── reveal primitives ─── */
.rv{opacity:0;transform:translateY(42px);transition:opacity 1.1s var(--ease),transform 1.1s var(--ease)}
.rv.in{opacity:1;transform:none}
.d1{transition-delay:.1s!important}.d2{transition-delay:.2s!important}.d3{transition-delay:.3s!important}.d4{transition-delay:.4s!important}
.split .w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.08em;margin-bottom:-.08em}
.split .w>span{display:inline-block;transform:translateY(105%);transition:transform 1.1s var(--ease)}
.split.in .w>span{transform:none}
.clip{clip-path:inset(100% 0 0 0);transition:clip-path 1.4s var(--ease-io)}
.clip img{transform:scale(1.25);transition:transform 1.8s var(--ease)}
.clip.in{clip-path:inset(0 0 0 0)}
.clip.in img{transform:scale(1)}
.rule{width:56px;height:1px;background:var(--gold);margin:1.3rem auto 0;transform:scaleX(0);transition:transform 1.2s .3s var(--ease)}
.in .rule,.rule.in{transform:scaleX(1)}
@media (prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important}.rv,.split .w>span,.clip{opacity:1;transform:none;clip-path:none}}

/* ─── announcement ─── */
.announce{background:var(--espresso);color:var(--gold-soft);font-size:.64rem;letter-spacing:.26em;text-transform:uppercase;height:34px;overflow:hidden;position:relative;text-align:center}
.announce div{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;opacity:0;transform:translateY(100%);transition:.8s var(--ease)}
.announce div.on{opacity:1;transform:none}
.announce div.off{opacity:0;transform:translateY(-100%)}

/* ─── header ─── */
#hdr{position:sticky;top:0;z-index:200;transition:transform .6s var(--ease),background .5s,box-shadow .5s,color .5s}
#hdr .bg{position:absolute;inset:0;background:rgba(248,243,234,.94);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line);transition:opacity .5s}
#hdr.hide{transform:translateY(-100%)}
body.home #hdr{position:fixed;left:0;right:0}
#hdr.overlay{color:var(--ivory)}
#hdr.overlay .bg{opacity:0}
#hdr.overlay svg{stroke:var(--ivory)}
#hdr.overlay .brand .m{color:var(--gold-soft)}
#hdr.scrolled{box-shadow:0 10px 40px rgba(28,20,13,.07)}
.mast{position:relative;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:1.05rem var(--pad) .5rem;max-width:1440px;margin:0 auto}
.mast-l,.mast-r{display:flex;align-items:center;gap:1.3rem}
.mast-r{justify-content:flex-end}
.ico{position:relative;display:flex;padding:.2rem}
.ico svg{width:20px;height:20px;fill:none;stroke:var(--espresso);stroke-width:1.3;transition:stroke .5s,transform .4s var(--ease)}
.ico:hover svg{transform:translateY(-2px)}
.badge{position:absolute;top:-6px;right:-8px;min-width:16px;height:16px;padding:0 4px;border-radius:9px;background:var(--emerald);color:var(--ivory);font-size:.56rem;font-weight:600;display:flex;align-items:center;justify-content:center}
.badge.bump{animation:bump .6s var(--ease)}
@keyframes bump{40%{transform:scale(1.6)}}
.brand{text-align:center;line-height:1}
.brand .m{display:block;font-size:.58rem;font-weight:500;letter-spacing:.64em;text-transform:uppercase;color:var(--gold);margin-bottom:.45rem;padding-left:.64em;transition:color .5s}
.brand .n{font-family:var(--serif);font-weight:400;font-size:clamp(1.35rem,3.1vw,2.15rem);letter-spacing:.045em;white-space:nowrap}
.brand .n i{font-style:italic;font-weight:300}
.brand img{max-height:54px;margin:0 auto}
.burger{display:none;flex-direction:column;gap:5px;padding:.4rem}
.burger span{width:22px;height:1.3px;background:currentColor}
.nav{position:relative;border-top:1px solid var(--line)}
#hdr.overlay .nav{border-color:rgba(248,243,234,.18)}
.nav>ul{display:flex;justify-content:center;gap:clamp(1.2rem,3vw,2.8rem);list-style:none}
.nav>ul>li>a{display:block;font-size:.68rem;font-weight:500;letter-spacing:.24em;text-transform:uppercase;padding:.9rem 0;position:relative}
.nav>ul>li>a:after{content:'';position:absolute;left:0;right:0;bottom:.6rem;height:1px;background:var(--gold);transform:scaleX(0);transition:transform .45s var(--ease);transform-origin:right}
.nav>ul>li:hover>a:after{transform:scaleX(1);transform-origin:left}
.nav .sale>a{color:var(--oxblood)}
#hdr.overlay .nav .sale>a{color:#e9b7bd}
.mega{position:absolute;left:0;right:0;top:100%;background:var(--ivory);color:var(--espresso);border-bottom:1px solid var(--line);box-shadow:0 40px 60px rgba(28,20,13,.12);opacity:0;visibility:hidden;transform:translateY(-8px);transition:all .45s var(--ease)}
.nav li:hover .mega{opacity:1;visibility:visible;transform:none}
.mega-in{max-width:1180px;margin:0 auto;padding:2.4rem var(--pad);display:grid;grid-template-columns:220px 1fr;gap:3rem}
.mega h5{font-size:.6rem;font-weight:600;letter-spacing:.3em;text-transform:uppercase;color:var(--gold);margin-bottom:1rem}
.mega ul{list-style:none}
.mega ul a{display:inline-block;font-family:var(--serif);font-size:1.15rem;padding:.22rem 0;transition:color .25s,transform .35s var(--ease)}
.mega ul a:hover{color:var(--emerald);transform:translateX(6px)}
.mega-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.mega-cards a{position:relative;aspect-ratio:3/4;overflow:hidden;color:var(--ivory)}
.mega-cards img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.mega-cards a:hover img{transform:scale(1.08)}
.mega-cards a:after{content:'';position:absolute;inset:0;background:linear-gradient(to top,rgba(28,20,13,.75),transparent 55%)}
.mega-cards span{position:absolute;left:1rem;bottom:.9rem;z-index:2;font-family:var(--serif);font-size:1.05rem}

/* mobile drawer */
.drawer{position:fixed;inset:0;z-index:600;visibility:hidden}
.drawer.open{visibility:visible}
.drawer .scrim{position:absolute;inset:0;background:rgba(28,20,13,.55);opacity:0;transition:opacity .45s}
.drawer.open .scrim{opacity:1}
.drawer .panel{position:absolute;top:0;bottom:0;width:min(92vw,440px);background:var(--ivory);display:flex;flex-direction:column;transition:transform .6s var(--ease-io)}
.drawer.left .panel{left:0;transform:translateX(-100%)}
.drawer.right .panel{right:0;transform:translateX(100%)}
.drawer.open .panel{transform:none}
.panel-h{display:flex;justify-content:space-between;align-items:center;padding:1.3rem 1.6rem;border-bottom:1px solid var(--line)}
.panel-h h3{font-size:1.35rem}
.x{font-size:1.6rem;line-height:1;padding:.2rem .4rem;transition:transform .4s var(--ease)}
.x:hover{transform:rotate(90deg)}
.panel-b{flex:1;overflow-y:auto;padding:1.2rem 1.6rem}
.panel-f{border-top:1px solid var(--line);padding:1.2rem 1.6rem 1.5rem}
.mnav h5{font-size:.6rem;font-weight:600;letter-spacing:.3em;text-transform:uppercase;color:var(--gold);margin:1.4rem 0 .6rem}
.mnav a{display:block;font-family:var(--serif);font-size:1.3rem;padding:.2rem 0}
.drawer.open .mnav a{animation:slidein .7s var(--ease) both}
@keyframes slidein{from{opacity:0;transform:translateX(-20px)}}

/* ─── hero ─── */
.hero{position:relative;height:100svh;min-height:620px;max-height:1100px;overflow:hidden;background:var(--mocha);color:var(--ivory)}
.hero .sl{position:absolute;inset:0;opacity:0;transition:opacity 2s ease}
.hero .sl.on{opacity:1;z-index:1}
.hero .sl img{width:100%;height:100%;object-fit:cover;transform:scale(1.02)}
.hero .sl.on img{animation:kb 8s linear forwards}
@keyframes kb{from{transform:scale(1.02)}to{transform:scale(1.12)}}
.hero .veil{position:absolute;inset:0;z-index:2;background:linear-gradient(to top,rgba(28,20,13,.78),rgba(28,20,13,.05) 45%,rgba(28,20,13,.35))}
.hero .copy{position:absolute;inset:0;z-index:3;display:flex;flex-direction:column;justify-content:flex-end;padding:0 var(--pad) clamp(3rem,8vw,6.5rem);max-width:1440px;margin:0 auto}
.hero .eyebrow{color:var(--gold-soft)}
.hero h1{font-size:clamp(2.8rem,7.6vw,6.4rem);max-width:12ch;margin:1rem 0 1.3rem}
.hero p{max-width:46ch;color:rgba(248,243,234,.85);margin-bottom:2.1rem;font-size:clamp(.92rem,1.3vw,1.05rem)}
.hero .ctas{display:flex;gap:1rem;flex-wrap:wrap}
.hero .meta{position:absolute;z-index:4;right:var(--pad);bottom:clamp(3rem,8vw,6.5rem);display:flex;gap:1rem;align-items:center;font-family:var(--serif);letter-spacing:.14em}
.hero .meta .bar{width:120px;height:1px;background:rgba(248,243,234,.3);position:relative;overflow:hidden}
.hero .meta .bar i{position:absolute;inset:0;background:var(--gold);transform:scaleX(0);transform-origin:left}
.hero .meta .bar i.run{animation:heroBar 7s linear forwards}
@keyframes heroBar{to{transform:scaleX(1)}}
.hero .cue{position:absolute;z-index:4;left:50%;bottom:1.4rem;transform:translateX(-50%);font-size:.58rem;letter-spacing:.4em;text-transform:uppercase;display:flex;flex-direction:column;align-items:center;gap:.5rem;color:rgba(248,243,234,.7)}
.hero .cue:after{content:'';width:1px;height:36px;background:linear-gradient(var(--gold),transparent);animation:cue 2.2s infinite}
@keyframes cue{0%{transform:scaleY(0);transform-origin:top}45%{transform:scaleY(1);transform-origin:top}55%{transform:scaleY(1);transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}

/* ─── marquee ─── */
.marq{background:var(--mocha);color:rgba(248,243,234,.78);overflow:hidden;padding:1.1rem 0;border-bottom:1px solid rgba(176,141,87,.2)}
.marq-t{display:flex;width:max-content;animation:marq 38s linear infinite}
.marq:hover .marq-t{animation-play-state:paused}
.marq span{font-family:var(--serif);font-style:italic;font-size:1rem;padding:0 2.2rem;display:flex;align-items:center;gap:2.2rem;white-space:nowrap}
.marq span:after{content:'✦';font-style:normal;color:var(--gold);font-size:.7rem}
@keyframes marq{to{transform:translateX(-50%)}}

/* ─── sections ─── */
.sec{padding:clamp(4.5rem,9vw,8.5rem) 0}
.sh{text-align:center;max-width:680px;margin:0 auto clamp(2.6rem,5vw,4.5rem)}
.sh h2{font-size:clamp(2rem,4.4vw,3.4rem);margin-top:.9rem}
.sh p{color:var(--muted);margin-top:1rem}

/* image card */
.card{position:relative;display:block;overflow:hidden;color:var(--ivory);background:var(--mocha)}
.card img{width:100%;height:100%;object-fit:cover;transition:transform 1.4s var(--ease),filter .8s}
.card:hover img{transform:scale(1.07)}
.card:after{content:'';position:absolute;inset:0;background:linear-gradient(to top,rgba(28,20,13,.75),transparent 55%);transition:opacity .6s}
.card .ci{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:1.5rem}
.card .ci small{font-size:.58rem;letter-spacing:.3em;text-transform:uppercase;color:var(--gold-soft)}
.card .ci h3{font-size:clamp(1.15rem,1.9vw,1.55rem);margin:.35rem 0 .4rem}
.card .ci em{display:inline-block;font-style:normal;font-size:.66rem;letter-spacing:.22em;text-transform:uppercase;border-bottom:1px solid var(--gold);opacity:0;transform:translateY(8px);transition:.5s var(--ease)}
.card:hover .ci em{opacity:1;transform:none}
.occ-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.1rem}
.occ-grid .card{aspect-ratio:3/4.3}
.occ-grid .card:nth-child(even){margin-top:3.5rem}
.cat-grid{display:grid;grid-template-columns:repeat(12,1fr);grid-auto-rows:118px;gap:1.1rem}
.cat-grid .card:nth-child(1){grid-column:span 5;grid-row:span 4}
.cat-grid .card:nth-child(2){grid-column:span 4;grid-row:span 3}
.cat-grid .card:nth-child(3){grid-column:span 3;grid-row:span 3}
.cat-grid .card:nth-child(4){grid-column:span 3;grid-row:span 3}
.cat-grid .card:nth-child(5){grid-column:span 7;grid-row:span 2}
.cat-grid .card:nth-child(n+6){grid-column:span 4;grid-row:span 3}

/* collections (sticky stacking cards) */
.colls{position:relative}
.coll{position:sticky;top:0;height:100svh;min-height:560px;overflow:hidden;display:flex;align-items:center;color:var(--ivory)}
.coll .cb{position:absolute;inset:-10% 0;z-index:0}
.coll .cb img{width:100%;height:100%;object-fit:cover}
.coll:before{content:'';position:absolute;inset:0;z-index:1;background:linear-gradient(100deg,rgba(28,20,13,.82) 12%,rgba(28,20,13,.1) 68%)}
.coll.flip:before{background:linear-gradient(-100deg,rgba(28,20,13,.82) 12%,rgba(28,20,13,.1) 68%)}
.coll .cc{position:relative;z-index:2;max-width:560px;padding:0 clamp(1.5rem,7vw,6.5rem)}
.coll.flip .cc{margin-left:auto;text-align:right}
.coll .eyebrow{color:var(--gold-soft)}
.coll h2{font-size:clamp(2.2rem,5.2vw,4.4rem);margin:1rem 0 1.2rem}
.coll p{color:rgba(248,243,234,.85);margin-bottom:2rem}
.coll .num{position:absolute;z-index:2;top:clamp(5rem,9vw,8rem);right:var(--pad);font-family:var(--serif);font-style:italic;font-size:clamp(4rem,11vw,9rem);color:rgba(248,243,234,.12);line-height:1}
.coll.flip .num{right:auto;left:var(--pad)}

/* split feature (drop, planner, consult) */
.feat{display:grid;grid-template-columns:1fr 1fr;min-height:82vh}
.feat.rev .fi{order:2}
.feat .fi{position:relative;overflow:hidden;background:var(--mocha)}
.feat .fi img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.feat .fc{display:flex;flex-direction:column;justify-content:center;padding:clamp(2.5rem,7vw,6.5rem)}
.feat .fc h2{font-size:clamp(2rem,4.2vw,3.4rem);margin:1rem 0 1.2rem}
.feat .fc p{color:var(--muted);max-width:44ch;margin-bottom:2rem}
.feat.dark{background:var(--mocha);color:var(--ivory)}
.feat.dark .fc p{color:rgba(248,243,234,.78)}
.feat.dark .eyebrow{color:var(--gold-soft)}
.count{display:flex;gap:clamp(.8rem,2.4vw,1.8rem);margin:.4rem 0 2.2rem}
.count div{text-align:center;min-width:64px}
.count b{display:block;font-family:var(--serif);font-weight:300;font-size:clamp(2.2rem,4.6vw,3.6rem);line-height:1;font-variant-numeric:tabular-nums}
.count b.tick{animation:tick .5s var(--ease)}
@keyframes tick{0%{transform:translateY(-30%);opacity:0}100%{transform:none;opacity:1}}
.count span{font-size:.58rem;letter-spacing:.3em;text-transform:uppercase;color:var(--gold-soft)}
.inline-form{display:flex;gap:.6rem;flex-wrap:wrap;max-width:520px}
.inline-form input{flex:1;min-width:160px;background:transparent;border:none;border-bottom:1px solid currentColor;padding:.8rem .1rem;outline:none}
.inline-form input::placeholder{color:inherit;opacity:.5}

/* sale banner */
.salebn{position:relative;overflow:hidden;background:var(--oxblood);color:var(--ivory);text-align:center;padding:clamp(4rem,8vw,7rem) 1.4rem}
.salebn:before{content:'';position:absolute;inset:-40%;background:conic-gradient(from 0deg,transparent,rgba(205,177,131,.18),transparent 30%);animation:spin 14s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.salebn>*{position:relative}
.salebn .eyebrow{color:var(--gold-soft)}
.salebn h2{font-size:clamp(2.2rem,5vw,3.8rem);margin:.9rem 0 .8rem}
.salebn p{color:rgba(248,243,234,.8);margin-bottom:2rem}
.salebn .btn-ghost:hover{color:var(--oxblood)}

/* atelier */
.atel{background:var(--ivory-warm)}
.atel-g{display:grid;grid-template-columns:.92fr 1.08fr;gap:clamp(2.5rem,6vw,6.5rem);align-items:center}
.portrait{position:relative;aspect-ratio:3/3.8;overflow:hidden}
.portrait img{width:100%;height:100%;object-fit:cover}
.portrait:before{content:'';position:absolute;inset:16px;z-index:2;border:1px solid rgba(248,243,234,.6);pointer-events:none}
.portrait figcaption{position:absolute;z-index:2;left:0;right:0;bottom:1.8rem;text-align:center;color:var(--ivory);font-size:.6rem;letter-spacing:.34em;text-transform:uppercase;text-shadow:0 1px 10px rgba(0,0,0,.5)}
.atel h2{font-size:clamp(2rem,4vw,3.1rem);margin:1rem 0 1.5rem}
.atel p{max-width:54ch;margin-bottom:1.1rem;color:#4d4032}
.stats{display:flex;gap:2.8rem;margin:2.2rem 0;flex-wrap:wrap}
.stats b{display:block;font-family:var(--serif);font-weight:300;font-size:2.4rem;line-height:1}
.stats span{font-size:.62rem;letter-spacing:.24em;text-transform:uppercase;color:var(--muted)}
.sig{font-family:var(--serif);font-style:italic;font-size:1.5rem;color:var(--mocha)}
.sig small{display:block;font-family:var(--sans);font-style:normal;font-size:.6rem;letter-spacing:.3em;text-transform:uppercase;color:var(--gold);margin-top:.4rem}

/* worn-at & insta */
.hscroll{display:flex;gap:1rem;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 var(--pad) 1rem;scrollbar-width:none}
.hscroll::-webkit-scrollbar{display:none}
.hscroll .card{flex:0 0 clamp(220px,24vw,320px);aspect-ratio:3/4;scroll-snap-align:start}
.hscroll .card .ci h3{font-family:var(--sans);font-size:.74rem;letter-spacing:.12em;font-weight:400}
.insta{display:grid;grid-template-columns:repeat(6,1fr);gap:.6rem}
.insta a{position:relative;aspect-ratio:1;overflow:hidden;background:var(--mocha)}
.insta img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease),filter .6s}
.insta a:hover img{transform:scale(1.08);filter:brightness(.55)}
.insta span{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:var(--ivory);font-size:.62rem;letter-spacing:.24em;text-transform:uppercase;opacity:0;transform:translateY(10px);transition:.5s var(--ease)}
.insta a:hover span{opacity:1;transform:none}

/* trust */
.trust{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:2.6rem 0}
.trust-g{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem;text-align:center}
.trust svg{width:26px;height:26px;fill:none;stroke:var(--gold);stroke-width:1.2;margin:0 auto .7rem}
.trust h4{font-family:var(--sans);font-size:.68rem;font-weight:600;letter-spacing:.24em;text-transform:uppercase}
.trust p{font-size:.78rem;color:var(--muted);margin-top:.2rem}

/* ─── product grid ─── */
.shop-h{text-align:center;padding:clamp(3rem,6vw,5rem) 0 1rem}
.shop-h h1{font-size:clamp(2.2rem,5vw,3.8rem);margin-top:.8rem}
.filters{display:flex;justify-content:center;gap:.5rem;flex-wrap:wrap;margin:1.6rem 0 0}
.chip{border:1px solid var(--line);padding:.5rem 1.1rem;font-size:.64rem;letter-spacing:.2em;text-transform:uppercase;transition:.35s var(--ease)}
.chip:hover,.chip.on{background:var(--espresso);color:var(--ivory);border-color:var(--espresso)}
.sortbar{display:flex;justify-content:space-between;align-items:center;font-size:.72rem;color:var(--muted);padding:1.6rem 0 0;letter-spacing:.1em}
.sortbar select{border:none;background:none;border-bottom:1px solid var(--line);padding:.3rem;font-size:.72rem}
.grid{display:grid;grid-template-columns:repeat(4,1fr);gap:2.4rem 1.1rem;padding:2rem 0 clamp(4rem,7vw,6rem)}
.pc{position:relative}
.pc .pi{position:relative;aspect-ratio:3/4;overflow:hidden;background:var(--ivory-warm);display:block}
.pc .pi img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:opacity .9s var(--ease),transform 1.4s var(--ease)}
.pc .pi img.b{opacity:0}
.pc:hover .pi img.a{opacity:0;transform:scale(1.05)}
.pc:hover .pi img.b{opacity:1;transform:scale(1.04)}
.pc .tag{position:absolute;z-index:2;top:.8rem;left:.8rem;background:var(--ivory);color:var(--espresso);font-size:.54rem;letter-spacing:.22em;text-transform:uppercase;padding:.35rem .7rem}
.pc .tag.sale{background:var(--oxblood);color:var(--ivory)}
.pc .tag.low{top:auto;bottom:.8rem;background:var(--espresso);color:var(--gold-soft)}
.heart{position:absolute;z-index:3;top:.7rem;right:.7rem;width:36px;height:36px;border-radius:50%;background:rgba(248,243,234,.92);display:flex;align-items:center;justify-content:center;transition:transform .4s var(--ease)}
.heart svg{width:16px;height:16px;fill:none;stroke:var(--espresso);stroke-width:1.5;transition:fill .3s,stroke .3s}
.heart.on svg{fill:var(--oxblood);stroke:var(--oxblood)}
.heart.pop{animation:pop .5s var(--ease)}
@keyframes pop{40%{transform:scale(1.35)}}
.pc .qa{position:absolute;z-index:3;left:.8rem;right:.8rem;bottom:.8rem;background:rgba(248,243,234,.95);padding:.8rem;font-size:.64rem;letter-spacing:.22em;text-transform:uppercase;text-align:center;transform:translateY(130%);transition:transform .55s var(--ease)}
.pc:hover .qa{transform:none}
.pc:hover .tag.low{opacity:0}
.pc .pn{padding:1rem .2rem 0;text-align:center}
.pc .pn h3{font-size:1.06rem}
.pc .pn small{display:block;font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);margin:.25rem 0 .35rem}
.price{font-family:var(--serif)}
.price s{color:#a39380;font-size:.85em;margin-left:.5rem}
.empty{text-align:center;padding:5rem 1rem;color:var(--muted)}

/* ─── PDP ─── */
.crumbs{font-size:.64rem;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);padding:1.5rem 0}
.crumbs a:hover{color:var(--espresso)}
.pdp{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(2rem,5vw,5rem);align-items:start;padding-bottom:4rem}
.gal{display:grid;grid-template-columns:78px 1fr;gap:.7rem;position:sticky;top:130px}
.thumbs{display:flex;flex-direction:column;gap:.6rem}
.thumbs button{aspect-ratio:3/4;overflow:hidden;opacity:.55;transition:opacity .3s;outline:1px solid transparent;outline-offset:2px}
.thumbs button.on{opacity:1;outline-color:var(--gold)}
.thumbs img{width:100%;height:100%;object-fit:cover}
.stage{position:relative;aspect-ratio:4/5;overflow:hidden;background:var(--ivory-warm);cursor:zoom-in}
.stage img{width:100%;height:100%;object-fit:cover;transition:opacity .5s,transform .2s linear}
.stage.zoom img{transform:scale(2.2)}
.stage .hint{position:absolute;right:1rem;bottom:1rem;background:rgba(248,243,234,.92);font-size:.58rem;letter-spacing:.2em;text-transform:uppercase;padding:.5rem .9rem}
.buy h1{font-size:clamp(1.9rem,3.6vw,2.9rem);margin:.6rem 0 .6rem}
.buy .sub{color:var(--muted);margin-bottom:1.3rem}
.buy .pr{display:flex;align-items:baseline;gap:.9rem;flex-wrap:wrap}
.buy .pr .price{font-size:1.8rem}
.save{background:var(--oxblood);color:var(--ivory);font-size:.58rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;padding:.32rem .75rem}
.stars{color:var(--gold);letter-spacing:.12em;font-size:.9rem}
.revlink{font-size:.74rem;color:var(--muted);margin:.4rem 0 1.2rem;display:inline-block;border-bottom:1px solid var(--line)}
.scar{display:flex;align-items:center;gap:.6rem;font-size:.76rem;color:var(--oxblood);margin:.8rem 0}
.scar i{width:7px;height:7px;border-radius:50%;background:var(--oxblood);animation:pulse 1.6s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(107,31,42,.5)}70%{box-shadow:0 0 0 9px rgba(107,31,42,0)}100%{box-shadow:0 0 0 0 rgba(107,31,42,0)}}
.badges{display:flex;gap:1.4rem;flex-wrap:wrap;border:1px solid var(--line);padding:.9rem 1.1rem;margin:1.2rem 0 1.6rem;font-size:.74rem}
.badges span{display:flex;align-items:center;gap:.45rem}
.badges svg{width:16px;height:16px;fill:none;stroke:var(--emerald);stroke-width:1.5}
.lbl{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:.7rem}
.lbl h4{font-family:var(--sans);font-size:.66rem;font-weight:600;letter-spacing:.24em;text-transform:uppercase}
.lbl button{font-size:.74rem;color:var(--emerald);border-bottom:1px solid var(--emerald)}
.sizes{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:1rem}
.sizes button{min-width:52px;height:46px;padding:0 .8rem;border:1px solid rgba(28,20,13,.3);font-size:.82rem;transition:.3s var(--ease)}
.sizes button:hover{border-color:var(--espresso)}
.sizes button.on{background:var(--espresso);color:var(--ivory);border-color:var(--espresso)}
.toggle-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;border:1px solid var(--line);padding:.9rem 1.1rem;margin-bottom:.8rem;cursor:pointer;transition:border-color .3s}
.toggle-row:hover{border-color:var(--gold)}
.toggle-row b{font-weight:500;font-size:.88rem;display:block}
.toggle-row small{color:var(--muted);font-size:.74rem}
.sw{width:38px;height:22px;border-radius:11px;background:rgba(28,20,13,.2);position:relative;flex:0 0 auto;transition:background .3s}
.sw:after{content:'';position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:#fff;transition:transform .35s var(--ease)}
.on>.sw,.sw.on{background:var(--emerald)}
.on>.sw:after,.sw.on:after{transform:translateX(16px)}
.measure{display:grid;grid-template-columns:repeat(3,1fr);gap:.6rem;margin:-.2rem 0 1rem;padding:1rem;background:var(--ivory-warm);animation:viewin .5s var(--ease)}
.measure .f{margin:0}
.atc{display:flex;gap:.7rem;margin:1.2rem 0 1rem}
.atc .btn{flex:1}
.wishbig{width:58px;border:1px solid rgba(28,20,13,.3);display:flex;align-items:center;justify-content:center}
.wishbig svg{width:20px;height:20px;fill:none;stroke:var(--espresso);stroke-width:1.4}
.wishbig.on svg{fill:var(--oxblood);stroke:var(--oxblood)}
.deliv{background:var(--ivory-warm);padding:1rem 1.2rem;font-size:.82rem;margin-bottom:1.4rem}
.deliv b{font-weight:500}
.deliv .row{display:flex;gap:.6rem;align-items:center;margin-top:.6rem;flex-wrap:wrap}
.deliv input{border:1px solid var(--line);background:var(--ivory);padding:.45rem .6rem;font-size:.8rem}
.deliv .res{margin-top:.5rem}
.ok{color:var(--emerald)}.bad{color:var(--oxblood)}
.acc{border-top:1px solid var(--line)}
.acc details{border-bottom:1px solid var(--line)}
.acc summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;padding:1.1rem 0;font-family:var(--serif);font-size:1.08rem}
.acc summary::-webkit-details-marker{display:none}
.acc summary:after{content:'+';color:var(--gold);font-family:var(--sans);transition:transform .4s var(--ease)}
.acc details[open] summary:after{transform:rotate(45deg)}
.acc .ab{padding:0 0 1.3rem;font-size:.87rem;color:#4d4032;animation:viewin .5s var(--ease)}
.craft{display:grid;grid-template-columns:1fr 1fr;gap:.9rem 1.4rem}
.craft dt{font-size:.6rem;font-weight:600;letter-spacing:.24em;text-transform:uppercase;color:var(--gold)}
.craft dd{font-size:.86rem}
.look{background:var(--mocha);color:var(--ivory);padding:clamp(3rem,6vw,5rem) 0}
.look .eyebrow{color:var(--gold-soft)}
.look-g{display:grid;grid-template-columns:1fr 1fr 1fr auto;gap:1.2rem;align-items:center}
.look-item{display:flex;gap:1rem;align-items:center;background:rgba(248,243,234,.05);border:1px solid rgba(205,177,131,.2);padding:.8rem}
.look-item img{width:70px;height:90px;object-fit:cover}
.look-item h4{font-size:1rem}
.look-sum{text-align:right;min-width:220px}
.look-sum s{opacity:.55;margin-right:.5rem}
.look-sum .price{font-size:1.6rem;display:block;margin:.3rem 0 1rem}
.rail-sec{padding:clamp(4rem,7vw,6rem) 0}
.rail-h{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:2rem}
.rail-h h2{font-size:clamp(1.7rem,3.2vw,2.5rem)}
.rail{display:grid;grid-template-columns:repeat(4,1fr);gap:1.1rem}
.reviews{padding:clamp(4rem,7vw,6rem) 0;border-top:1px solid var(--line)}
.rv-sum{display:flex;gap:3rem;align-items:center;flex-wrap:wrap;margin-bottom:2rem}
.rv-sum .big{font-family:var(--serif);font-size:3.4rem;line-height:1}
.fitm{flex:1;min-width:240px;max-width:360px}
.fitm .trk{height:2px;background:var(--line);position:relative;margin:.8rem 0 .4rem}
.fitm .trk i{position:absolute;top:-5px;width:12px;height:12px;border-radius:50%;background:var(--gold);transform:translateX(-50%);transition:left 1s var(--ease)}
.fitm .lb{display:flex;justify-content:space-between;font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.rv-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.2rem}
.rv-card{border:1px solid var(--line);padding:1.3rem;background:rgba(255,255,255,.35)}
.rv-card img{width:100%;aspect-ratio:4/5;object-fit:cover;margin-bottom:1rem;cursor:zoom-in}
.rv-card p{font-size:.86rem;margin:.5rem 0}
.rv-card small{color:var(--muted);font-size:.72rem}

/* ─── forms & modals ─── */
.f{margin-bottom:1rem}
.f label{display:block;font-size:.6rem;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--muted);margin-bottom:.35rem}
.f input,.f textarea,.f select{width:100%;border:1px solid rgba(28,20,13,.25);background:transparent;padding:.8rem .95rem;outline:none;transition:border-color .3s;font-size:.9rem}
.f input:focus,.f textarea:focus,.f select:focus{border-color:var(--gold)}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:0 1rem}
.err{color:var(--oxblood);font-size:.78rem;min-height:1.1em;margin:.3rem 0 .6rem}
.modal{position:fixed;inset:0;z-index:700;display:flex;align-items:center;justify-content:center;padding:1rem;visibility:hidden}
.modal.open{visibility:visible}
.modal .scrim{position:absolute;inset:0;background:rgba(28,20,13,.6);opacity:0;transition:opacity .4s}
.modal.open .scrim{opacity:1}
.modal .box{position:relative;background:var(--ivory);width:100%;max-width:520px;max-height:88vh;overflow-y:auto;padding:2.4rem clamp(1.4rem,4vw,2.4rem);opacity:0;transform:translateY(30px) scale(.98);transition:.55s var(--ease)}
.modal.wide .box{max-width:820px}
.modal.open .box{opacity:1;transform:none}
.modal .x{position:absolute;top:.9rem;right:1rem}
.modal h3{font-size:1.7rem;margin:.4rem 0 1.2rem}
.tabs{display:flex;gap:.3rem;border-bottom:1px solid var(--line);margin-bottom:1.4rem}
.tabs button{padding:.7rem 1rem;font-size:.68rem;font-weight:500;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);border-bottom:2px solid transparent;margin-bottom:-1px}
.tabs button.on{color:var(--espresso);border-color:var(--gold)}
table.sz{width:100%;border-collapse:collapse;font-size:.84rem}
table.sz th{font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);text-align:left;padding:.6rem .4rem;border-bottom:1px solid var(--gold)}
table.sz td{padding:.6rem .4rem;border-bottom:1px solid var(--line)}
.quiz-opts{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:.6rem;margin:1rem 0}
.quiz-opts button{border:1px solid var(--line);padding:.9rem .5rem;font-size:.82rem;transition:.3s}
.quiz-opts button:hover,.quiz-opts button.on{border-color:var(--espresso);background:var(--espresso);color:var(--ivory)}
.quiz-res{text-align:center;padding:1rem 0}
.quiz-res b{display:block;font-family:var(--serif);font-weight:300;font-size:4rem;line-height:1.1;color:var(--emerald)}
.stars-in{display:flex;gap:.3rem;font-size:1.5rem;color:var(--gold)}
.stars-in button{color:rgba(176,141,87,.3);transition:transform .3s,color .2s}
.stars-in button.on{color:var(--gold)}
.stars-in button:hover{transform:scale(1.2)}
.segs{display:flex;border:1px solid var(--line)}
.segs button{flex:1;padding:.6rem;font-size:.72rem}
.segs button.on{background:var(--espresso);color:var(--ivory)}

/* cart */
.ci-row{display:grid;grid-template-columns:78px 1fr auto;gap:1rem;padding:1rem 0;border-bottom:1px solid var(--line);animation:viewin .5s var(--ease)}
.ci-row img,.ci-row .gcimg{width:78px;height:100px;object-fit:cover}
.gcimg{background:linear-gradient(135deg,var(--mocha),#4a3427);color:var(--gold-soft);display:flex;align-items:center;justify-content:center;font-family:var(--serif);font-style:italic}
.ci-row h4{font-size:1rem;font-weight:400}
.ci-row small{display:block;color:var(--muted);font-size:.7rem;margin:.15rem 0 .45rem}
.qty{display:inline-flex;align-items:center;border:1px solid rgba(28,20,13,.25)}
.qty button{width:28px;height:28px}
.qty span{width:26px;text-align:center;font-size:.8rem}
.rm{font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);text-decoration:underline;margin-top:.5rem}
.shipbar{height:2px;background:var(--line);margin:.5rem 0 1rem;overflow:hidden}
.shipbar i{display:block;height:100%;background:var(--emerald);transition:width .8s var(--ease)}
.tot{display:flex;justify-content:space-between;font-size:.86rem;margin:.28rem 0}
.tot.neg span:last-child{color:var(--emerald)}
.tot.g{font-family:var(--serif);font-size:1.25rem;border-top:1px solid var(--line);padding-top:.7rem;margin-top:.7rem}
.fly{position:fixed;z-index:990;pointer-events:none;object-fit:cover;transition:transform .9s var(--ease-io),opacity .9s,border-radius .9s}

/* checkout / account / planner / consult pages */
.page-h{text-align:center;padding:clamp(3rem,6vw,5rem) 0 2rem}
.page-h h1{font-size:clamp(2.2rem,5vw,3.8rem);margin-top:.8rem}
.page-h p{color:var(--muted);max-width:52ch;margin:1rem auto 0}
.co{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(2rem,5vw,4rem);padding-bottom:5rem;align-items:start}
.co h2{font-size:1.5rem;margin:0 0 1.2rem}
.side{background:var(--ivory-warm);padding:1.8rem;position:sticky;top:130px}
.opt{display:flex;gap:.9rem;border:1px solid rgba(28,20,13,.25);padding:1rem 1.2rem;margin-bottom:.6rem;cursor:pointer;transition:.3s}
.opt.on{border-color:var(--emerald);background:rgba(19,78,62,.05)}
.opt input{accent-color:var(--emerald);margin-top:.35rem}
.opt b{display:block;font-weight:500;font-size:.9rem}
.opt small{color:var(--muted);font-size:.76rem}
.mini{display:flex;gap:.5rem;margin:.6rem 0}
.mini input{flex:1;min-width:0;border:1px solid rgba(28,20,13,.25);background:transparent;padding:.6rem .8rem;font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;outline:none}
.mini button{border:1px solid var(--espresso);padding:0 1rem;font-size:.62rem;letter-spacing:.2em;text-transform:uppercase}
.done{text-align:center;max-width:560px;margin:0 auto;padding:clamp(3rem,8vw,6rem) 1rem}
.done .tick-c{width:84px;height:84px;margin:0 auto 1.4rem}
.done .tick-c circle{fill:none;stroke:var(--gold);stroke-width:1.2;stroke-dasharray:260;stroke-dashoffset:260;animation:dash 1.2s var(--ease) forwards}
.done .tick-c path{fill:none;stroke:var(--emerald);stroke-width:2;stroke-dasharray:60;stroke-dashoffset:60;animation:dash .6s .9s var(--ease) forwards}
@keyframes dash{to{stroke-dashoffset:0}}
.done h2{font-size:2.2rem;margin-bottom:1rem}
.acct{display:grid;grid-template-columns:320px 1fr;gap:3rem;padding-bottom:5rem;align-items:start}
.tiercard{background:var(--mocha);color:var(--ivory);padding:1.8rem;position:relative;overflow:hidden}
.tiercard:before{content:'';position:absolute;inset:-60%;background:conic-gradient(from 90deg,transparent,rgba(205,177,131,.22),transparent 40%);animation:spin 10s linear infinite}
.tiercard>*{position:relative}
.tiercard h3{font-size:2.2rem;font-style:italic;color:var(--gold-soft);margin:.5rem 0}
.tiercard .prog{height:2px;background:rgba(248,243,234,.2);margin:1rem 0 .5rem}
.tiercard .prog i{display:block;height:100%;background:var(--gold)}
.tiercard small{font-size:.74rem;color:rgba(248,243,234,.7)}
.acbox{border:1px solid var(--line);padding:1.3rem;margin-top:1rem}
.acbox h4{font-family:var(--sans);font-size:.62rem;font-weight:600;letter-spacing:.24em;text-transform:uppercase;color:var(--gold);margin-bottom:.6rem}
.ordc{border:1px solid var(--line);padding:1.2rem 1.4rem;margin-bottom:1rem}
.ordc .oh{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;align-items:baseline}
.ordc .oid{font-family:var(--serif);font-size:1.05rem}
.steps{display:flex;margin:1rem 0 .4rem}
.steps span{flex:1;height:2px;background:var(--line);position:relative}
.steps span.on{background:var(--emerald)}
.steps-l{display:flex;justify-content:space-between;font-size:.56rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.st{display:inline-block;font-size:.56rem;letter-spacing:.18em;text-transform:uppercase;padding:.28rem .7rem;background:var(--gold);color:var(--ivory)}
.st.new{background:var(--oxblood)}.st.shipped{background:#3a5a7a}.st.delivered{background:var(--emerald)}.st.cancelled{background:#888}.st.crafting{background:#7a5c3a}
.planner-steps{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:.8rem;margin:1.4rem 0}
.ev{border:1px solid var(--line);padding:1.2rem 1rem;text-align:center;cursor:pointer;transition:.35s var(--ease);position:relative}
.ev:hover{border-color:var(--gold);transform:translateY(-3px)}
.ev.on{background:var(--espresso);color:var(--ivory);border-color:var(--espresso)}
.ev h4{font-size:1.3rem}
.ev input{margin-top:.7rem;width:100%;border:1px solid var(--line);background:var(--ivory);color:var(--espresso);padding:.35rem;font-size:.74rem}
.plan-look{display:grid;grid-template-columns:180px 1fr auto;gap:1.4rem;align-items:center;border-bottom:1px solid var(--line);padding:1.3rem 0;animation:viewin .7s var(--ease) both}
.plan-look img{width:180px;aspect-ratio:3/4;object-fit:cover}
.plan-look h3{font-size:1.5rem;margin:.3rem 0}
.plan-look .alt{display:flex;gap:.4rem;margin-top:.6rem;flex-wrap:wrap}
.plan-look .alt button{font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;border-bottom:1px solid var(--line);color:var(--muted)}
.plan-total{background:var(--mocha);color:var(--ivory);padding:2rem;display:flex;justify-content:space-between;align-items:center;gap:1.4rem;flex-wrap:wrap;margin:2rem 0 5rem}
.plan-total .price{font-size:2rem}
.dates{display:flex;gap:.5rem;overflow-x:auto;padding-bottom:.5rem;margin:1rem 0}
.dates button{flex:0 0 72px;border:1px solid var(--line);padding:.7rem .3rem;text-align:center;font-size:.7rem;transition:.3s}
.dates button b{display:block;font-family:var(--serif);font-weight:400;font-size:1.5rem}
.dates button.on{background:var(--espresso);color:var(--ivory);border-color:var(--espresso)}
.slots{display:grid;grid-template-columns:repeat(auto-fill,minmax(88px,1fr));gap:.5rem;margin:1rem 0 1.4rem}
.slots button{border:1px solid var(--line);padding:.65rem;font-size:.8rem;transition:.3s}
.slots button.on{background:var(--emerald);color:var(--ivory);border-color:var(--emerald)}
.slots button[disabled]{opacity:.3;text-decoration:line-through;cursor:not-allowed}
.gc-amts{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:1rem;margin:1.6rem 0}
.gc-amts button{aspect-ratio:1.6;background:linear-gradient(135deg,var(--mocha),#4b3526);color:var(--gold-soft);display:flex;flex-direction:column;justify-content:space-between;align-items:flex-start;padding:1rem;transition:transform .5s var(--ease),box-shadow .5s;text-align:left}
.gc-amts button:hover{transform:translateY(-6px) rotate(-1deg);box-shadow:0 20px 40px rgba(28,20,13,.25)}
.gc-amts button.on{outline:2px solid var(--gold);outline-offset:3px}
.gc-amts small{font-size:.54rem;letter-spacing:.3em;text-transform:uppercase}
.gc-amts b{font-family:var(--serif);font-weight:300;font-size:1.6rem;color:var(--ivory)}
.policy{max-width:760px;margin:0 auto;padding:0 1.2rem 6rem}
.policy h3{font-size:1.3rem;margin:1.8rem 0 .6rem}
.policy p,.policy li{color:#4d4032;margin-bottom:.7rem}
.policy ul{padding-left:1.2rem}

/* footer */
footer{background:var(--mocha);color:rgba(248,243,234,.68);padding:clamp(4rem,8vw,6.5rem) 0 2rem;position:relative;overflow:hidden}
.foot-brand{text-align:center;margin-bottom:3.4rem}
.foot-brand .m{font-size:.58rem;letter-spacing:.6em;text-transform:uppercase;color:var(--gold);padding-left:.6em}
.foot-brand .n{font-family:var(--serif);font-size:clamp(2.2rem,6vw,4.8rem);color:var(--ivory);margin:.4rem 0}
.foot-brand .n i{font-style:italic}
.foot-g{display:grid;grid-template-columns:repeat(4,1fr);gap:2.4rem;max-width:1040px;margin:0 auto 3rem}
footer h5{color:var(--gold-soft);font-size:.6rem;font-weight:600;letter-spacing:.3em;text-transform:uppercase;margin-bottom:1rem}
footer ul{list-style:none}
footer li{margin-bottom:.5rem;font-size:.84rem}
footer li a{transition:color .25s}
footer li a:hover{color:var(--ivory)}
.nl{display:flex;border:1px solid rgba(176,141,87,.4)}
.nl input{flex:1;min-width:0;background:transparent;border:none;padding:.8rem 1rem;color:var(--ivory);outline:none;font-size:.82rem}
.nl input::placeholder{color:rgba(248,243,234,.4)}
.nl button{background:var(--gold);color:var(--mocha);font-size:.62rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;padding:0 1.2rem}
.foot-b{border-top:1px solid rgba(176,141,87,.18);padding-top:1.6rem;display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;max-width:1040px;margin:0 auto;font-size:.7rem;letter-spacing:.08em}
.soc{display:flex;gap:1.4rem}
.soc a{display:flex;align-items:center;gap:.45rem;font-size:.64rem;letter-spacing:.18em;text-transform:uppercase}
.soc a:hover{color:var(--gold-soft)}
.soc svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.4}

/* floating whatsapp */
#wa-float{position:fixed;right:1.3rem;bottom:1.3rem;z-index:300;width:56px;height:56px;border-radius:50%;background:#1f8f57;color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 12px 30px rgba(0,0,0,.25);transition:transform .45s var(--ease)}
#wa-float:hover{transform:scale(1.1) rotate(-8deg)}
#wa-float svg{width:28px;height:28px;fill:#fff}
#wa-float:before{content:'';position:absolute;inset:0;border-radius:50%;border:1px solid #1f8f57;animation:ring 2.4s infinite}
@keyframes ring{from{transform:scale(1);opacity:.8}to{transform:scale(1.6);opacity:0}}
#wa-float span{position:absolute;right:66px;background:var(--espresso);color:var(--ivory);font-size:.7rem;white-space:nowrap;padding:.5rem .9rem;opacity:0;transform:translateX(10px);transition:.4s var(--ease);pointer-events:none}
#wa-float:hover span{opacity:1;transform:none}
body.pdp-on #wa-float{bottom:5.2rem}

/* toast & preview flag */
#toast{position:fixed;left:50%;bottom:1.6rem;z-index:999;transform:translate(-50%,120px);background:var(--espresso);color:var(--ivory);padding:.95rem 1.6rem;font-size:.8rem;letter-spacing:.06em;transition:transform .6s var(--ease);max-width:92vw;text-align:center}
#toast.on{transform:translate(-50%,0)}
#toast b{color:var(--gold-soft);font-weight:500}
#pvflag{position:fixed;left:1rem;bottom:1rem;z-index:400;background:var(--gold);color:var(--espresso);font-size:.6rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;padding:.5rem .8rem;display:none}
body.preview #pvflag{display:block}
.sticky-atc{position:fixed;left:0;right:0;bottom:0;z-index:250;background:var(--ivory);border-top:1px solid var(--line);padding:.7rem 1rem;display:none;gap:.8rem;align-items:center;box-shadow:0 -10px 30px rgba(28,20,13,.08);transform:translateY(100%);transition:transform .5s var(--ease)}
.sticky-atc.show{transform:none}
.sticky-atc .btn{flex:1;padding:.95rem}

/* golden thread */
#thread{position:absolute;top:0;left:0;width:100%;pointer-events:none;z-index:5}
#thread path{fill:none;stroke:var(--gold);stroke-width:1.3;opacity:.5}
#needle{position:absolute;z-index:6;width:9px;height:9px;background:var(--gold);transform:rotate(45deg);pointer-events:none;box-shadow:0 0 14px rgba(176,141,87,.9);transition:opacity .4s}

/* ─── responsive ─── */
@media (max-width:1080px){
  .nav{display:none}.burger{display:flex}
  .grid,.rail{grid-template-columns:repeat(2,1fr);gap:2rem .8rem}
  .occ-grid{grid-template-columns:repeat(2,1fr)}.occ-grid .card:nth-child(even){margin-top:2rem}
  .cat-grid{grid-auto-rows:92px}
  .cat-grid .card:nth-child(n){grid-column:span 6;grid-row:span 3}
  .cat-grid .card:nth-child(1),.cat-grid .card:nth-child(5){grid-column:span 12;grid-row:span 3}
  .feat{grid-template-columns:1fr}.feat .fi{min-height:56vh}.feat.rev .fi{order:0}
  .atel-g,.pdp,.co,.acct{grid-template-columns:1fr}
  .gal{position:static;grid-template-columns:1fr}.thumbs{flex-direction:row;order:2}.thumbs button{width:64px}
  .side{position:static}
  .insta{grid-template-columns:repeat(3,1fr)}
  .trust-g,.foot-g{grid-template-columns:1fr 1fr}
  .look-g{grid-template-columns:1fr}.look-sum{text-align:left}
  .sticky-atc{display:flex}
  .plan-look{grid-template-columns:110px 1fr}.plan-look img{width:110px}.plan-look>div:last-child{grid-column:1/-1}
}
@media (max-width:560px){
  .brand .n{font-size:1.25rem}.brand .m{letter-spacing:.5em}
  .mast-r{gap:.9rem}
  .hero .meta{display:none}
  .hero .ctas .btn{padding:1rem 1.5rem;font-size:.66rem}
  .row2,.measure{grid-template-columns:1fr 1fr}
  .coll .num{display:none}
  .pc .qa{display:none}
}

/* ─── logo (image wordmark) ─── */
.brand-img{display:block;line-height:0}
.brand-img img{height:clamp(46px,5.6vw,76px);width:auto;max-width:min(58vw,420px);object-fit:contain;transition:opacity .5s}
.brand-img .lg-l{display:none}
#hdr.overlay .brand-img .lg-d{display:none}
#hdr.overlay .brand-img .lg-l{display:block}
.foot-logo{width:min(78vw,520px);height:auto;margin:0 auto}
#loaderLogo{width:min(70vw,420px);height:auto;clip-path:inset(0 100% 0 0);animation:logoReveal 1.7s var(--ease-io) .15s forwards}
@keyframes logoReveal{to{clip-path:inset(0 0 0 0)}}
#curtain b img{width:min(60vw,320px);height:auto}
@media (max-width:560px){.brand-img img{height:46px;max-width:56vw}.mast{grid-template-columns:44px 1fr auto;padding-top:.8rem}.mast-r{gap:.7rem}.mast-r .ico[data-act=search],.mast-r a.ico[href='#/shop/wish']{display:none}.brand-img{justify-self:center}}
/* ─── invoice ─── */
body.invoice #hdr,body.invoice #foot,body.invoice #wa-float,body.invoice #pvflag,body.invoice #thread,body.invoice #needle{display:none!important}
body.invoice{background:#e9e2d4}
.inv-bar{max-width:860px;margin:1.5rem auto 0;display:flex;justify-content:space-between;align-items:center;padding:0 1rem}
.invoice-doc{max-width:860px;margin:1.2rem auto 4rem;background:#fff;padding:clamp(1.4rem,5vw,3.4rem);box-shadow:0 20px 60px rgba(28,20,13,.12);font-size:.86rem}
.inv-h{display:flex;justify-content:space-between;gap:2rem;flex-wrap:wrap;border-bottom:1px solid var(--line);padding-bottom:1.6rem}
.inv-logo{height:56px;width:auto;margin-bottom:.8rem}
.inv-h p{color:#4d4032;line-height:1.55}
.inv-meta h1{font-size:2rem;margin-bottom:.6rem;text-align:right}
.inv-meta td{padding:.15rem 0 .15rem 1.2rem;vertical-align:top}
.inv-meta td:first-child{color:var(--muted);padding-left:0;font-size:.74rem;letter-spacing:.08em;text-transform:uppercase}
.inv-to{padding:1.4rem 0}
.inv-to p{margin-top:.4rem;line-height:1.55}
.inv-t{width:100%;border-collapse:collapse;margin:.6rem 0 1.4rem}
.inv-t th{font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);text-align:left;padding:.6rem .4rem;border-bottom:1px solid var(--gold)}
.inv-t td{padding:.7rem .4rem;border-bottom:1px solid var(--line);vertical-align:top}
.inv-t th:nth-child(n+4),.inv-t td:nth-child(n+4){text-align:right}
.inv-t small{color:var(--muted)}
.inv-sum{display:grid;grid-template-columns:1fr 300px;gap:2rem}
.inv-f{margin-top:2.4rem;padding-top:1.2rem;border-top:1px solid var(--line);color:var(--muted);font-size:.76rem;text-align:center}
@media (max-width:640px){.inv-sum{grid-template-columns:1fr}.inv-meta h1{text-align:left}}
@media print{
  body,body.invoice{background:#fff}
  body:after,.no-print,#loader,#curtain,#cur,#cur-ring,#toast,.sticky-atc{display:none!important}
  .invoice-doc{box-shadow:none;margin:0;max-width:none;padding:0}
  @page{margin:14mm}
}