:root{--bg:#140C0B;--bg2:#221A16;--card:#2A1B18;--ink:#F8F3EB;--sub:#BEB3A7;--mut:#93887D;--gold:#EFC66B;--red:#BA0000;--cream:#FBF3D8;--line:rgba(255,244,232,.09);--goldT:rgba(239,198,107,.3);--disp:'Hobo Std','HoboStd','Hobo','Chewy',cursive;--ui:'Poppins',system-ui,-apple-system,sans-serif}
@font-face{font-family:'Chewy';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/chewy-400.woff2) format('woff2')}
@font-face{font-family:'Poppins';font-style:normal;font-weight:300;font-display:swap;src:url(../fonts/poppins-300.woff2) format('woff2')}
@font-face{font-family:'Poppins';font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/poppins-400.woff2) format('woff2')}
@font-face{font-family:'Poppins';font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/poppins-500.woff2) format('woff2')}
@font-face{font-family:'Poppins';font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/poppins-600.woff2) format('woff2')}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font:300 16px/1.65 var(--ui);-webkit-font-smoothing:antialiased}
a{color:var(--gold);text-decoration:none}a:hover{color:var(--cream)}
::selection{background:var(--gold);color:#2A1B00}
img{max-width:100%}
h1,h2,h3{font-family:var(--disp);font-weight:400;color:var(--cream);line-height:1.05;margin:0}
.wrap{max-width:1200px;margin:0 auto;padding:0 32px}
.skip{position:absolute;left:-9999px;top:0;background:var(--gold);color:#2A1B00;padding:10px 16px;border-radius:0 0 10px 0;z-index:99}.skip:focus{left:0}
.hd{position:sticky;top:0;z-index:50;background:rgba(20,12,11,.94);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
/* The header is sticky and opaque, so anything scrolled to by an anchor jump or
   scrollIntoView() must clear it. Without this, the target parks underneath the
   header and its buttons swallow clicks — the header is what gets hit. */
html{scroll-padding-top:96px}
@media (max-width:720px){html{scroll-padding-top:80px}}
.hd-in{display:flex;align-items:center;gap:26px;height:72px}
.brand{display:flex;align-items:center;gap:10px;flex:none}
.brand img{display:block}
.brand span{font-family:var(--disp);font-size:21px;color:var(--cream)}
.nav{display:flex;align-items:center;gap:4px;margin-left:auto;font-size:14.5px}
.nav>a,.dd>a{color:#D8CFC4;padding:9px 12px;border-radius:10px;transition:color .18s,background .18s}
.nav>a:hover,.dd>a:hover{color:var(--cream);background:rgba(255,244,232,.05)}
.dd{position:relative}
.dd-m{position:absolute;left:0;top:100%;min-width:230px;background:#1B110F;border:1px solid rgba(255,244,232,.14);border-radius:14px;padding:8px;display:none;box-shadow:0 24px 60px rgba(0,0,0,.55)}
.dd:hover .dd-m,.dd:focus-within .dd-m{display:block}
.dd-m a{display:block;padding:9px 12px;border-radius:9px;color:#D8CFC4;font-size:14px;font-weight:300}
.dd-m a:hover{background:rgba(239,198,107,.1);color:var(--cream)}
.dd-m a.all{color:var(--gold);border-top:1px solid var(--line);margin-top:6px;padding-top:11px}
.cta{font-family:var(--disp);font-size:16px;color:#FFF6F0!important;background:var(--red);padding:11px 20px;border-radius:99px;white-space:nowrap;transition:transform .18s,box-shadow .18s}
.cta:hover{transform:translateY(-1px);box-shadow:0 8px 24px rgba(186,0,0,.4)}
.nav-t{display:none}.nav-b{display:none}
.sec{padding:96px 0;border-bottom:1px solid var(--line)}
.sec.alt{background:var(--bg2)}
.eyebrow{margin:0 0 18px;font-size:12px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--gold)}
.h-page{font-size:clamp(38px,5.4vw,68px);text-wrap:balance;max-width:820px}
.h-sec{font-size:clamp(29px,4vw,44px);text-wrap:balance;max-width:720px}
.lede{max-width:640px;margin:22px 0 0;font-size:17.5px;line-height:1.68;color:var(--sub);text-wrap:pretty}
.crumbs{padding:18px 0 0;font-size:13px;color:var(--mut)}
.crumbs a{color:var(--mut)}.crumbs a:hover{color:var(--gold)}
.crumbs span{color:#6A6058;margin:0 7px}
.g2{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.g3{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.g4{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.mt{margin-top:48px}
.card{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:24px}
.card h3{font-size:22px;margin:0 0 9px}
.card p{margin:0;font-size:14.5px;color:var(--sub)}
a.card{transition:border-color .18s}a.card:hover{border-color:var(--goldT)}
.tile{display:block;background:var(--bg2);border:1px solid var(--goldT);border-radius:16px;padding:18px;transition:border-color .18s}
.tile b{display:block;font-family:var(--disp);font-weight:400;font-size:21px;color:var(--cream)}
.tile span{font-size:12.5px;color:var(--mut)}
.tile:hover{border-color:var(--gold)}
.chips{display:flex;flex-wrap:wrap;gap:9px}
.chips a{font-size:14px;color:#D8CFC4;background:var(--bg2);border:1px solid rgba(255,244,232,.12);padding:9px 16px;border-radius:99px;transition:border-color .18s}
.chips a:hover{border-color:var(--gold);color:var(--cream)}
.chips a.hot{color:var(--gold);background:rgba(239,198,107,.1);border-color:var(--goldT)}
.step{padding-top:20px;border-top:1px solid var(--goldT)}
.step .n{font-family:var(--disp);font-size:28px;color:var(--gold);margin:0 0 10px}
.step h3{font-size:23px;margin:0 0 9px}
.step p{margin:0;font-size:15px;color:var(--sub)}
.note{display:flex;align-items:center;gap:10px;margin:0 0 20px;padding:11px 16px;border-radius:12px;background:rgba(239,198,107,.09);border:1px solid var(--goldT);font-size:13.5px;color:var(--gold)}
.show{border-radius:18px;overflow:hidden;background:var(--card);border:1px solid var(--line)}
a.show{transition:border-color .18s}a.show:hover{border-color:var(--goldT)}
.show .ph{position:relative}
.show img{display:block;width:100%;height:180px;object-fit:cover}
.show .sc{position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,rgba(10,7,6,.88))}
.show .tag{position:absolute;left:13px;top:13px;font-size:10px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;background:var(--gold);color:#2A1B00;padding:4px 8px;border-radius:8px}
.show .tt{position:absolute;left:15px;right:15px;bottom:12px}
.show .tt b{font-family:var(--disp);font-weight:400;font-size:21px;color:#FBF7F0;display:block}
.show .tt i{font-style:normal;font-size:12px;color:#D8CFC4}
.show .mt2{display:flex;align-items:center;gap:9px;padding:13px 15px}
.show .pr{font-family:var(--disp);font-size:20px;color:var(--gold)}
.show .mt2 span{font-size:12px;color:var(--mut)}
.show .k{margin-left:auto;font-size:10.5px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--sub);padding:4px 8px;border-radius:8px;background:rgba(255,244,232,.06)}
.faq{display:grid;grid-template-columns:1fr 1fr;gap:44px 64px}
.faq h3{font-size:21px;color:var(--gold);margin:0 0 8px}
.faq p{margin:0;font-size:15px;color:var(--sub);text-wrap:pretty}
.btn{display:inline-block;white-space:nowrap;font-family:var(--disp);font-size:18px;color:#FFF6F0;background:var(--red);padding:14px 26px;border-radius:14px;border:none;cursor:pointer;transition:transform .18s,box-shadow .18s}
.btn:hover{transform:translateY(-1px);box-shadow:0 10px 28px rgba(186,0,0,.4);color:#FFF6F0}
.btn2{display:inline-block;white-space:nowrap;font-family:var(--disp);font-size:18px;color:var(--cream);background:rgba(255,244,232,.05);border:1px solid rgba(255,244,232,.2);padding:14px 26px;border-radius:14px}
.wl{border:1px solid var(--goldT);border-radius:24px;background:var(--bg2);padding:48px 44px;display:grid;grid-template-columns:1.1fr .9fr;gap:44px;align-items:center;position:relative;overflow:hidden}
.wl .bgi{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.14}
.wl>div,.wl>form{position:relative}
.wl h2{font-size:clamp(28px,3.4vw,40px)}
.wl p{color:var(--sub);font-size:16px;max-width:440px}
.wl input,.wl select{width:100%;height:54px;padding:0 16px;border-radius:13px;background:#190F0E;border:1px solid rgba(255,244,232,.2);color:var(--ink);font:300 15px var(--ui);margin-bottom:9px}
.wl .ok{display:none;margin:10px 0 0;font-size:13.5px;color:#7BD88F}
.wl .fine{margin:10px 0 0;font-size:12.5px;color:var(--mut);text-align:center}
.stats{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:26px 0;max-width:760px}
.stats>div{padding-left:24px;border-left:1px solid var(--line)}
.stats>div:first-child{padding-left:0;border:none}
.stats b{display:block;font-family:var(--disp);font-weight:400;font-size:32px;color:var(--gold);line-height:1}
.stats span{font-size:13px;color:var(--mut)}
.cmp{border:1px solid rgba(255,244,232,.12);border-radius:18px;overflow:hidden;font-size:14.5px}
.cmp .r{display:grid;grid-template-columns:1.8fr 1fr 1fr 1fr;border-top:1px solid var(--line)}
.cmp .r:first-child{border-top:none;background:#190F0E}
.cmp .r:nth-child(odd){background:rgba(255,244,232,.02)}
.cmp .c{padding:17px 18px}
.cmp .c+.c{text-align:center;border-left:1px solid var(--line)}
.cmp .y{color:var(--gold);font-size:16px}
.cmp .m{color:var(--mut);font-size:12.5px}
.cmp .hdc{font-family:var(--disp);font-size:17px;color:var(--gold)}
.ft{background:#0E0908}
.ft-in{padding:72px 0 30px}
.ft-g{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr 1fr;gap:44px}
.ft h4{margin:0 0 14px;font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--gold)}
.ft ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px;font-size:13.5px}
.ft ul a{color:var(--sub)}.ft ul a:hover{color:var(--cream)}
.ft .base{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:44px;padding-top:22px;border-top:1px solid var(--line);font-size:12.5px;color:#6A6058}
.ft .base a{color:#6A6058}
@keyframes bulb{0%,100%{opacity:.32}50%{opacity:1}}
.bulbs{display:flex;gap:6px;margin:0 0 16px}
.bulbs i{width:7px;height:7px;border-radius:50%;background:var(--gold);box-shadow:0 0 12px 3px rgba(239,198,107,.5);animation:bulb 1.9s ease-in-out infinite}
.bulbs i:nth-child(2){animation-delay:.16s}.bulbs i:nth-child(3){animation-delay:.32s}
html.js .reveal{opacity:0;transform:translateY(16px);transition:opacity .6s ease,transform .6s ease}
html.js .reveal.in{opacity:1;transform:none}
html.no-anim .reveal,html.no-anim .reveal.in{transition:none!important;opacity:1!important;transform:none!important}
html.no-anim .fold-prog{transition:none!important}
html.no-anim .hero .bgp{animation:none!important;opacity:0}
html.no-anim .hero .bgp:first-child{opacity:.14}
html.no-anim .bulbs i,html.no-anim .ld-b i,html.no-anim .ann-dot{animation:none!important;opacity:1}
html.no-anim .ann-rot b{animation:none!important;opacity:0;position:static;transform:none}
html.no-anim .ann-rot b:first-child{opacity:1}
html.no-anim .ann-rot{height:auto}
html.no-anim .strip-t,html.no-anim .ph3-t{animation:none!important}
html.no-anim .eyebrow::after{animation:none!important;transform:none}
html.no-anim .hero .in>*{animation:none!important;opacity:1;transform:none}
html.no-anim .vs-p.on{animation:none!important}
@media (prefers-reduced-motion:reduce){html.js .reveal{opacity:1!important;transform:none!important;transition:none}.bulbs i{animation:none}html{scroll-behavior:auto}}
.hero{position:relative;overflow:hidden}
.hero .bgp{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.18}
.hero .in{position:relative;padding-top:104px;padding-bottom:110px}
article.prose{max-width:720px}
article.prose h2{font-size:clamp(25px,3vw,34px);margin:52px 0 14px}
article.prose p{margin:0 0 16px;font-size:16.5px;line-height:1.75;color:var(--sub)}
article.prose li{font-size:16.5px;line-height:1.7;color:var(--sub);margin-bottom:8px}
.byline{display:flex;gap:14px;align-items:center;margin-top:26px;font-size:13px;color:var(--mut)}
@media (max-width:1080px){
.wrap{padding:0 24px}.g4{grid-template-columns:1fr 1fr}.ft-g{grid-template-columns:1fr 1fr;gap:32px}
.g2,.g3,.wl{grid-template-columns:1fr}.faq{grid-template-columns:1fr;gap:36px}
.nav{display:none;position:absolute;left:0;right:0;top:72px;background:#171010;border-bottom:1px solid var(--line);flex-direction:column;align-items:stretch;padding:14px 20px 20px;gap:2px}
.nav-t:checked~.nav{display:flex}
.dd-m{position:static;display:block;box-shadow:none;border:none;background:transparent;padding:0 0 0 14px}
.nav-b{display:flex;flex-direction:column;justify-content:center;gap:5px;width:40px;height:40px;margin-left:auto;cursor:pointer}
.nav-b i{height:2px;background:var(--cream);border-radius:2px}
.sec{padding:64px 0}.hero .in{padding-top:72px;padding-bottom:72px}
}
@media (max-width:640px){.g4{grid-template-columns:1fr}.stats{grid-template-columns:1fr;gap:18px}.stats>div{padding-left:0;border:none}.wl{padding:32px 24px}.cmp{overflow-x:auto}.cmp .r{min-width:560px}}
/* ══ PHOTOGRAPHY & MOTION ══ */
@keyframes kb{from{transform:scale(1.04)}to{transform:scale(1.15)}}
@keyframes slide{to{transform:translateX(calc(-50% - 7px))}}
@keyframes settle{from{transform:translateY(10px)}to{transform:none}}
@keyframes sweep{from{transform:scaleX(0)}to{transform:scaleX(1)}}

.hero::after{content:"";position:absolute;inset:0;pointer-events:none;
 background:radial-gradient(84% 72% at 46% 38%,transparent 26%,rgba(20,12,11,.72) 100%),
 radial-gradient(60% 46% at 84% 26%,rgba(186,0,0,.18),transparent 66%)}
.hero::before{content:"";position:absolute;inset:0;pointer-events:none;z-index:1;opacity:.16;mix-blend-mode:soft-light;
 background-image:url(../img/curtain.webp);background-size:auto 130%;background-position:center;background-repeat:repeat-x}

.hero .in>.bulbs,.hero .in>.eyebrow,.hero .in>.lede,.hero .in>p:last-child{animation:settle .7s cubic-bezier(.2,.7,.3,1) both}
.hero .in>.eyebrow{animation-delay:.06s}
.hero .in>.h-page{animation:settle .8s cubic-bezier(.2,.7,.3,1) both;animation-delay:.1s}
.hero .in>.lede{animation-delay:.2s}
.hero .in>p:last-child{animation-delay:.3s}

/* eyebrow rule that draws in */
.eyebrow{position:relative;display:inline-block;padding-bottom:9px}
.eyebrow::after{content:"";position:absolute;left:0;bottom:0;width:44px;height:2px;background:var(--gold);transform-origin:left;animation:sweep .7s cubic-bezier(.2,.7,.3,1) both}

/* photo marquee */
.strip{overflow:hidden;margin-top:44px;mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent)}
.strip-t{display:flex;gap:14px;width:max-content;animation:slide 46s linear infinite;will-change:transform}
.strip:hover .strip-t{animation-play-state:paused}
.strip figure{margin:0;flex:none;width:272px;height:184px;border-radius:16px;overflow:hidden;border:1px solid var(--line);position:relative}
.strip img{width:100%;height:100%;object-fit:cover;display:block}
.strip figcaption{position:absolute;left:0;right:0;bottom:0;padding:22px 14px 11px;font-size:12px;color:var(--cream);background:linear-gradient(transparent,rgba(10,7,6,.9))}

/* photo mosaic */
.mos{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:44px}
.mos figure{margin:0;position:relative;border-radius:16px;overflow:hidden;border:1px solid var(--line);aspect-ratio:4/3}
.mos figure:nth-child(even){margin-top:26px}
.mos img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .9s cubic-bezier(.2,.7,.3,1)}
.mos figure:hover img{transform:scale(1.07)}
.mos figcaption{position:absolute;left:0;right:0;bottom:0;padding:26px 14px 13px;font-family:var(--disp);font-size:17px;color:var(--cream);background:linear-gradient(transparent,rgba(10,7,6,.92))}

/* full-bleed photo band */
.band2{position:relative;overflow:hidden;border-bottom:1px solid var(--line);min-height:400px;display:flex;align-items:center;
 background:radial-gradient(120% 90% at 88% 50%,rgba(186,0,0,.20),transparent 62%),linear-gradient(100deg,#170E0D,#241A16 62%,#1B1210)}
.band2::before{content:"";position:absolute;inset:0;background-image:url(../img/curtain.webp);background-size:auto 118%;background-position:center;
 background-repeat:repeat-x;opacity:.13;mix-blend-mode:soft-light;pointer-events:none}
.band2>img{position:absolute;top:50%;right:max(24px,calc(50% - 570px));transform:translateY(-50%);
 width:min(36%,392px);height:auto;max-height:74%;object-fit:cover;opacity:1;border-radius:18px;
 border:1px solid rgba(239,198,107,.26);box-shadow:0 26px 64px rgba(0,0,0,.55);animation:none}
.band2 .ov{position:absolute;inset:0;background:linear-gradient(94deg,rgba(20,12,11,.72) 0%,rgba(20,12,11,.34) 46%,transparent 72%)}
.band2 .h-sec,.band2 .lede{max-width:min(560px,58%)}
.band2 .wrap{position:relative;width:100%;flex:1 1 auto;padding-top:76px;padding-bottom:76px}
.band2 .h-sec{max-width:600px}
.band2 .lede{max-width:520px}

/* hover life on existing photo cards */
.show .ph{overflow:hidden}
.show img{transition:transform .9s cubic-bezier(.2,.7,.3,1)}
a.show:hover img{transform:scale(1.06)}
.tile,.card{transition:border-color .2s,transform .2s}
a.tile:hover,a.card:hover{transform:translateY(-2px)}

/* staggered reveal (JS sets --i) */
.reveal{transition-delay:calc(var(--i,0)*70ms)}

@media (max-width:1080px){
 .mos{grid-template-columns:1fr 1fr}
 .band2{min-height:0}
 .band2 .wrap{padding-top:56px;padding-bottom:56px}
 .band2>img{opacity:.3}
}
@media (max-width:640px){.mos figure:nth-child(even){margin-top:0}.strip figure{width:214px;height:150px}}
@media (prefers-reduced-motion:reduce){
 .hero .bgp,.band2>img,.strip-t{animation:none!important}
 .hero .in>*,.eyebrow::after{animation:none!important}
 .mos figure:hover img,a.show:hover img{transform:none}
}

/* ══ LOADER ══ */
@keyframes ldOut{to{opacity:0;visibility:hidden}}
@keyframes ldBulb{0%,100%{opacity:.25;transform:scale(.82)}50%{opacity:1;transform:scale(1)}}
@keyframes ldRise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes ldBar{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.ld{position:fixed;inset:0;z-index:9999;background:var(--bg);display:flex;align-items:center;justify-content:center;
 animation:ldOut .45s ease 900ms both;will-change:opacity}
.ld::before{content:"";position:absolute;inset:0;background:radial-gradient(60% 46% at 50% 42%,rgba(186,0,0,.26),transparent 70%)}
.ld-in{position:relative;text-align:center;animation:ldRise .5s cubic-bezier(.2,.7,.3,1) both}
.ld-in img{width:74px;height:74px;display:block;margin:0 auto 20px}
.ld-b{display:flex;gap:8px;justify-content:center;margin-bottom:18px}
.ld-b i{width:9px;height:9px;border-radius:50%;background:var(--cream);box-shadow:0 0 14px 4px rgba(251,243,216,.4);animation:ldBulb 1.1s ease-in-out infinite}
.ld-b i:nth-child(2){animation-delay:.12s}.ld-b i:nth-child(3){animation-delay:.24s}
.ld-b i:nth-child(4){animation-delay:.36s}.ld-b i:nth-child(5){animation-delay:.48s}
.ld-in p{margin:0 0 20px;font-family:var(--disp);font-size:19px;color:var(--gold)}
.ld-t{width:172px;height:2px;margin:0 auto;background:rgba(255,244,232,.14);overflow:hidden}
.ld-t i{display:block;height:100%;background:var(--gold);transform-origin:left;animation:ldBar 1s cubic-bezier(.4,0,.2,1) both}
.ld.done{animation:ldOut .3s ease both}
body.loading{overflow:hidden}
@media (prefers-reduced-motion:reduce){.ld{display:none}}

/* ══ ANNOUNCEMENT BAR ══ */
.ann{background:linear-gradient(90deg,#1B1210,#2A1B18 50%,#1B1210);border-bottom:1px solid rgba(239,198,107,.22);font-size:13px;overflow:hidden}
.ann-in{display:flex;align-items:center;gap:12px;height:42px}
.ann-dot{flex:none;width:7px;height:7px;border-radius:50%;background:#7BD88F;box-shadow:0 0 9px 2px rgba(123,216,143,.5);animation:bulb 2s ease-in-out infinite}
.ann-rot{position:relative;flex:1;height:20px;overflow:hidden}
.ann-rot b{position:absolute;left:0;top:0;white-space:nowrap;font-weight:400;color:#E6DCD0;opacity:0;animation:annCyc 20s cubic-bezier(.4,0,.2,1) infinite;animation-delay:-.6s}
.ann-rot b:nth-child(2){animation-delay:4.4s}.ann-rot b:nth-child(3){animation-delay:9.4s}.ann-rot b:nth-child(4){animation-delay:14.4s}
.ann-rot b em{font-style:normal;color:var(--gold)}
@keyframes annCyc{0%{opacity:0;transform:translateY(9px)}3%{opacity:1;transform:none}25%{opacity:1;transform:none}28%{opacity:0;transform:translateY(-9px)}100%{opacity:0;transform:translateY(-9px)}}
.ann-in>a{flex:none;color:var(--gold);font-weight:500}
.ann-in>a:hover{color:var(--cream)}
@media (prefers-reduced-motion:reduce){.ann-rot{height:auto}.ann-rot b{position:static;opacity:1;animation:none;white-space:normal}.ann-rot b+b{display:none}}
@media (max-width:720px){.ann-in>a{display:none}.ann-rot b{font-size:12.5px}}

/* ══ HEADER: scroll progress + active state ══ */
.hd-prog{position:absolute;left:0;bottom:-1px;height:2px;background:linear-gradient(90deg,var(--gold),var(--red));width:0;transition:width .12s linear}
.nav>a[aria-current="page"],.dd>a[aria-current="page"]{color:var(--gold);background:rgba(239,198,107,.1)}
.hd{transition:box-shadow .25s,background .25s}
.hd.stuck{box-shadow:0 10px 34px rgba(0,0,0,.44)}

/* ══ TIMELINE ══ */
.tl{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:48px;border-top:1px solid var(--goldT)}
.tl>div{padding:26px 24px 0;border-left:1px solid var(--line);position:relative}
.tl>div:first-child{border-left:none;padding-left:0}
.tl>div::before{content:"";position:absolute;top:-5px;left:24px;width:9px;height:9px;border-radius:50%;background:var(--gold);box-shadow:0 0 12px 3px rgba(239,198,107,.4)}
.tl>div:first-child::before{left:0}
.tl time{display:block;font-family:var(--disp);font-size:27px;color:var(--gold);line-height:1;margin-bottom:9px}
.tl h3{font-size:21px;margin:0 0 8px}
.tl p{margin:0;font-size:14.5px;color:var(--sub)}

/* ══ PULL QUOTE OVER PHOTO ══ */
.qt{position:relative;overflow:hidden;border-radius:24px;margin-top:48px;display:grid;grid-template-columns:1.25fr .75fr;align-items:stretch;
 background:linear-gradient(100deg,#1D1412,#2A1B18);border:1px solid var(--line)}
.qt>img{grid-area:1/2;width:100%;height:100%;max-height:320px;object-fit:cover;opacity:.92}
.qt .ov{grid-area:1/2;background:linear-gradient(90deg,rgba(29,20,18,.92),transparent 46%);pointer-events:none}
.qt blockquote{grid-area:1/1;position:relative;margin:0;padding:38px 40px;align-self:center}
.qt p{margin:0 0 14px;font-family:var(--disp);font-size:clamp(22px,2.6vw,32px);line-height:1.22;color:var(--cream);max-width:760px}
.qt footer{font-size:13.5px;color:var(--gold)}

/* ══ BIG NUMBERS ══ */
.num{display:grid;grid-template-columns:repeat(auto-fit,minmax(198px,1fr));gap:20px;margin-top:48px}
.num>div{padding:26px 22px;border-radius:18px;background:var(--card);border:1px solid var(--line)}
.num b{display:block;font-family:var(--disp);font-size:clamp(32px,4vw,46px);color:var(--gold);line-height:1;margin-bottom:8px}
.num span{font-size:13.5px;color:var(--sub)}

/* ══ IMAGE SLOT (client's own shoot) ══ */
.slot{position:relative;border-radius:18px;border:1px dashed rgba(239,198,107,.42);background:rgba(239,198,107,.05);
 display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;padding:30px 20px;text-align:center;min-height:190px}
.slot b{font-family:var(--disp);font-size:16px;color:var(--gold);font-weight:400}
.slot span{font-size:12px;color:var(--mut);max-width:230px}

@media (max-width:1080px){.tl{grid-template-columns:1fr;border-top:none}
 .tl>div{border-left:none;border-top:1px solid var(--line);padding:26px 0 0}
 .tl>div:first-child{border-top:1px solid var(--goldT)}
 .tl>div::before{left:0}
 .qt blockquote{padding:30px 26px}}


/* icons */
.ic{width:1em;height:1em;flex:none;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;vertical-align:-.13em}
.card h3,.step h3,.faq h3,.tl h3{display:flex;align-items:center;gap:10px}
.card h3 .ic,.step h3 .ic,.tl h3 .ic{color:var(--gold);font-size:19px}
.faq h3 .ic{color:var(--gold);font-size:18px}
.ft h4{display:flex;align-items:center;gap:8px}
.ft h4 .ic{font-size:14px}
.tile b .ic,.chips a .ic{font-size:14px;color:var(--gold);margin-right:6px}
.faq>div{padding:20px 22px;border-radius:16px;border:1px solid transparent;transition:border-color .2s,background .2s}
.faq>div:hover{border-color:var(--goldT);background:rgba(255,244,232,.025)}
.num>div{transition:transform .2s,border-color .2s}
.num>div:hover{transform:translateY(-3px);border-color:var(--goldT)}
.num b{display:flex;align-items:center;gap:10px}
.num b .ic{font-size:22px;color:var(--gold);stroke-width:2.2}
.tl>div{transition:background .25s}
.tl>div:hover{background:rgba(255,244,232,.03)}
.step{transition:border-color .25s}
.step:hover{border-top-color:var(--gold)}
@media (max-width:1080px){
 .band2>img{position:static;transform:none;width:100%;max-width:470px;max-height:250px;margin:26px auto 0;right:auto;display:block}
 .band2{display:block}
 .band2 .ov{display:none}
 .band2 .h-sec,.band2 .lede{max-width:none}
 .qt{grid-template-columns:1fr}
 .qt>img{grid-area:auto;width:100%;max-width:470px;max-height:230px;margin:0 auto}
 .qt .ov{display:none}
 .qt blockquote{grid-area:auto;padding:28px 24px}
}

/* ══ FEED FILTERS ══ */
.ff{display:flex;flex-wrap:wrap;gap:9px;margin:44px 0 20px}
.ff button{font:400 13.5px var(--ui);color:#D8CFC4;background:var(--bg2);border:1px solid rgba(255,244,232,.14);padding:9px 15px;border-radius:99px;cursor:pointer;display:inline-flex;align-items:center;gap:7px;transition:border-color .2s,color .2s,background .2s}
.ff button:hover{border-color:var(--goldT);color:var(--cream)}
.ff button[aria-pressed="true"]{background:var(--gold);border-color:var(--gold);color:#2A1B00;font-weight:500}
.ff .ic{color:var(--gold);font-size:15px}
.ff button[aria-pressed="true"] .ic{color:#2A1B00}
.ff-c{font-size:13px;color:var(--mut);margin:0 0 22px;min-height:19px}
.ff-c b{color:var(--gold);font-weight:400;font-family:var(--disp);font-size:15px}
.feed{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.feed>article{transition:opacity .3s ease,transform .3s ease}
.feed>article.out{opacity:0;transform:scale(.97)}
.feed>article[hidden]{display:none}

/* ══ BEFORE / AFTER ══ */
.ba{display:grid;grid-template-columns:1fr auto 1fr;margin-top:48px;align-items:stretch}
.ba-c{padding:28px 30px;border-radius:18px;border:1px solid var(--line);background:var(--card)}
.ba-c.bad{border-color:rgba(221,0,0,.26);background:rgba(221,0,0,.045)}
.ba-c.good{border-color:var(--goldT);background:rgba(239,198,107,.05)}
.ba-h{display:flex;align-items:center;gap:10px;margin:0 0 16px;font-family:var(--disp);font-size:21px;color:var(--cream)}
.ba-c.bad .ba-h .ic{color:#FF8A8A}
.ba-c.good .ba-h .ic{color:var(--gold)}
.ba ol{list-style:none;margin:0;padding:0;counter-reset:s}
.ba li{counter-increment:s;display:flex;gap:12px;padding:11px 0;font-size:14.5px;color:var(--sub);border-top:1px solid var(--line)}
.ba li:first-child{border-top:none}
.ba li::before{content:counter(s);flex:none;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font-family:var(--disp);font-size:12px;background:rgba(255,244,232,.08);color:var(--mut)}
.ba-c.good li::before{background:rgba(239,198,107,.18);color:var(--gold)}
.ba-f{margin:16px 0 0;padding-top:14px;border-top:1px solid var(--line);font-size:13px;color:var(--mut);display:flex;align-items:baseline;gap:9px}
.ba-f b{font-family:var(--disp);font-size:22px;color:var(--gold);font-weight:400}
.ba-c.bad .ba-f b{color:#FF8A8A}
.ba-mid{display:grid;place-items:center;padding:0 22px}
.ba-mid span{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:var(--bg2);border:1px solid var(--goldT);color:var(--gold);font-size:17px}

/* ══ VS TOGGLE ══ */
.vs-t{display:inline-flex;padding:4px;border-radius:99px;background:rgba(255,244,232,.05);border:1px solid rgba(255,244,232,.14);margin-top:44px}
.vs-t button{padding:10px 20px;border-radius:99px;border:none;cursor:pointer;background:transparent;font:500 13.5px var(--ui);color:#BEB3A7;transition:background .22s,color .22s}
.vs-t button[aria-pressed="true"]{background:var(--gold);color:#2A1B00}
.vs{margin-top:24px;border-radius:20px;border:1px solid var(--line);background:var(--bg);overflow:hidden}
.vs-hd{display:flex;align-items:center;gap:11px;padding:15px 20px;border-bottom:1px solid var(--line);background:#190F0E;font-size:13px;color:var(--mut)}
.vs-hd .ic{font-size:16px;color:var(--gold)}
.vs-p{padding:20px;display:none}
.vs-p.on{display:block;animation:settle .4s cubic-bezier(.2,.7,.3,1) both}
.vs-r{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:13px;background:var(--card);border:1px solid var(--line);margin-bottom:9px}
.vs-r:last-child{margin-bottom:0}
.vs-r>.ic{font-size:17px;color:var(--gold);flex:none}
.vs-r div{min-width:0}
.vs-r b{font-family:var(--disp);font-weight:400;font-size:16px;color:var(--ink);display:block}
.vs-r span{font-size:12px;color:var(--mut)}
.vs-r .t{margin-left:auto;flex:none;font-size:12px;color:var(--mut);text-align:right}
.vs-r.no{opacity:.45}
.vs-r.no>.ic{color:#FF8A8A}
.vs-f{margin:16px 0 0;font-size:12.5px;color:#7A6E63}

/* ══ PHONE SCROLLER ══ */
@keyframes phS{
 0%,13%{transform:translateY(0)}
 21%,34%{transform:translateY(calc(var(--ph-h) * -1))}
 42%,55%{transform:translateY(calc(var(--ph-h) * -2))}
 63%,76%{transform:translateY(calc(var(--ph-h) * -3))}
 84%,97%{transform:translateY(calc(var(--ph-h) * -4))}
 100%{transform:translateY(calc(var(--ph-h) * -5))}}
.ph3{--ph-h:512px;display:grid;grid-template-columns:296px 1fr;gap:56px;align-items:center;margin-top:48px}
.ph3-d{width:296px;border-radius:38px;border:9px solid #0B0706;background:#190F0E;overflow:hidden;box-shadow:0 30px 70px rgba(0,0,0,.6),0 0 0 1px rgba(239,198,107,.16);position:relative}
.ph3-d::after{content:"";position:absolute;top:10px;left:50%;transform:translateX(-50%);width:72px;height:5px;border-radius:3px;background:#0B0706;z-index:4}
.ph3-vp{height:var(--ph-h);overflow:hidden}
.ph3-t{animation:phS 24s cubic-bezier(.65,0,.35,1) infinite}
.ph3-s{height:var(--ph-h);padding:30px 14px 14px;box-sizing:border-box;border-bottom:1px solid rgba(255,244,232,.05)}
.ph3-s h4{margin:0 0 13px;font-family:var(--disp);font-weight:400;font-size:18px;color:var(--cream);display:flex;align-items:center;gap:8px}
.ph3-s h4 .ic{font-size:15px;color:var(--gold)}
.ph3-row{display:flex;gap:9px;padding:8px;border-radius:12px;background:var(--card);border:1px solid var(--line);margin-bottom:8px;align-items:center}
.ph3-row img{width:42px;height:38px;border-radius:9px;object-fit:cover;flex:none}
.ph3-row b{display:block;font-family:var(--disp);font-weight:400;font-size:13px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ph3-row span{font-size:10px;color:var(--mut)}
.ph3-row .p{margin-left:auto;flex:none;font-family:var(--disp);font-size:14px;color:var(--gold)}
.ph3-hero{border-radius:14px;overflow:hidden;position:relative;border:1px solid var(--goldT);margin-bottom:9px}
.ph3-hero img{display:block;width:100%;height:112px;object-fit:cover}
.ph3-hero .g{position:absolute;inset:0;background:linear-gradient(180deg,transparent 34%,rgba(10,7,6,.9))}
.ph3-hero .c{position:absolute;left:10px;right:10px;bottom:8px}
.ph3-hero b{display:block;font-family:var(--disp);font-weight:400;font-size:15px;color:#FBF7F0}
.ph3-hero span{font-size:9.5px;color:#D8CFC4}
.ph3-chip{display:inline-flex;font-size:9.5px;padding:5px 9px;border-radius:99px;background:var(--card);border:1px solid rgba(255,244,232,.14);color:var(--sub);margin:0 5px 5px 0}
.ph3-chip.on{background:rgba(239,198,107,.16);border-color:var(--goldT);color:var(--cream)}
.ph3-btn{height:40px;border-radius:11px;background:var(--red);display:grid;place-items:center;font-family:var(--disp);font-size:15px;color:#FFF6F0;margin-top:11px}
.ph3-st{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:10px}
.ph3-st div{padding:11px 9px;border-radius:12px;background:var(--card);border:1px solid var(--line);text-align:center}
.ph3-st b{display:block;font-family:var(--disp);font-weight:400;font-size:19px;color:var(--gold);line-height:1}
.ph3-st span{font-size:9px;color:var(--mut)}
.ph3-l{display:flex;flex-direction:column;gap:16px}
.ph3-l>div{padding-left:18px;border-left:2px solid var(--line);transition:border-color .25s}
.ph3-l>div:hover{border-left-color:var(--gold)}
.ph3-l h3{font-size:20px;margin:0 0 5px;display:flex;align-items:center;gap:9px}
.ph3-l p{margin:0;font-size:14.5px;color:var(--sub)}

/* ══ DIGEST SIGN-UP ══ */
.dg{display:grid;grid-template-columns:1.05fr .95fr;gap:44px;align-items:center;margin-top:44px;padding:38px 40px;border-radius:22px;background:var(--card);border:1px solid var(--line)}
.dg h3{font-size:clamp(23px,2.5vw,31px);margin:0 0 12px;display:flex;align-items:center;gap:11px}
.dg p{margin:0;font-size:15.5px;color:var(--sub)}
.dg ul{list-style:none;margin:18px 0 0;padding:0;display:flex;flex-direction:column;gap:9px}
.dg li{display:flex;gap:10px;align-items:flex-start;font-size:14px;color:var(--sub)}
.dg li .ic{color:var(--gold);font-size:16px;margin-top:2px}
.dg form label{display:block;margin-bottom:9px}
.dg input,.dg select{width:100%;height:52px;padding:0 15px;border-radius:13px;background:#190F0E;border:1px solid rgba(255,244,232,.2);color:var(--ink);font:300 15px var(--ui)}
.dg .fine{margin:11px 0 0;font-size:12px;color:var(--mut);text-align:center}

/* ══ PHOTO CREDIT ══ */
.strip figcaption cite,.mos figcaption cite{display:block;font-style:normal;font-size:10.5px;color:rgba(239,198,107,.8);font-family:var(--ui);margin-top:3px}

@media (max-width:1080px){
 .feed{grid-template-columns:1fr 1fr}
 .ba{grid-template-columns:1fr}
 .ba-mid{padding:16px 0}
 .ba-mid span{transform:rotate(90deg)}
 .ph3{grid-template-columns:1fr;justify-items:center;gap:34px}
 .ph3-l{justify-self:stretch}
 .dg{grid-template-columns:1fr;padding:30px 24px}
}
@media (max-width:640px){.feed{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.ph3-t{animation:none}.vs-p.on{animation:none}.feed>article{transition:none}}

/* ══════════════════════════════════════════════════════
   RESPONSIVE — consolidated tiers (appended last, wins)
   ══════════════════════════════════════════════════════ */
html{-webkit-text-size-adjust:100%}
body{overflow-x:hidden}
h1,h2,h3,.ba-h,.dg h3{overflow-wrap:break-word}
.crumbs{display:flex;flex-wrap:wrap;align-items:center;row-gap:4px}
.crumbs span{margin:0 5px}
.ph3-d{max-width:100%}
.ld-t{max-width:60%}

/* ── tablet landscape / small laptop: keep three-ups as two, not one ── */
@media (max-width:1080px) and (min-width:641px){
 .g3,.tl{grid-template-columns:1fr 1fr}
 .g3>*:nth-child(3):last-child,.tl>div:nth-child(3):last-child{grid-column:1/-1}
 .tl{border-top:1px solid var(--goldT)}
 .tl>div{border-top:none;border-left:1px solid var(--line);padding:26px 24px 0}
 .tl>div:nth-child(odd){border-left:none;padding-left:0}
 .tl>div::before{left:24px}
 .tl>div:nth-child(odd)::before{left:0}
 .faq{grid-template-columns:1fr 1fr;gap:32px 40px}
}

/* ── tablet portrait ── */
@media (max-width:900px){
 .wrap{padding:0 22px}
 .sec{padding:56px 0}
 .hero .in{padding-top:60px;padding-bottom:64px}
 .band2 .wrap{padding-top:52px;padding-bottom:52px}
 .faq{grid-template-columns:1fr;gap:30px}
 .g4{grid-template-columns:1fr 1fr}
 .ba-c{padding:24px 22px}
 .qt blockquote{padding:26px 22px}
 .dg{padding:28px 22px;gap:30px}
 .ph3{gap:34px}
 article.prose h2{margin-top:40px}
}

/* ── phone ── */
@media (max-width:640px){
 .wrap{padding:0 18px}
 .sec{padding:46px 0}
 .hero .in{padding-top:44px;padding-bottom:50px}
 .band2 .wrap{padding-top:42px;padding-bottom:42px}
 .g2,.g3,.g4,.tl,.feed,.mos,.num,.faq,.ba,.dg,.wl,.ph3,.qt{grid-template-columns:1fr}
 .tl{border-top:none}
 .tl>div{border-left:none;border-top:1px solid var(--line);padding:22px 0 0}
 .tl>div:first-child{border-top:1px solid var(--goldT)}
 .tl>div::before,.tl>div:nth-child(odd)::before{left:0}
 .mos figure{aspect-ratio:16/10}
 .mos figure:nth-child(even){margin-top:0}
 .brand span{font-size:18px}
 .brand img{width:32px;height:32px}
 .hd-in{gap:12px;height:64px}
 .nav{top:64px}
 .cta{font-size:14.5px;padding:10px 15px}
 .h-page{font-size:clamp(31px,8.6vw,40px)}
 .h-sec{font-size:clamp(25px,6.6vw,32px)}
 .lede{font-size:16px;margin-top:18px}
 .eyebrow{margin-bottom:14px}
 .mt{margin-top:32px}
 .ff{margin:32px 0 16px}
 .strip{margin-top:32px}
 .stats b{font-size:27px}
 .num b{font-size:32px}
 .ba-f b{font-size:19px}
 .card,.faq>div{padding:20px 18px}
 .step h3,.card h3,.ba-h{font-size:19px}
 article.prose p,article.prose li{font-size:15.5px}
 article.prose h2{font-size:23px;margin-top:34px}
 .vs-r{flex-wrap:wrap;row-gap:3px}
 .vs-r .t{margin-left:34px;text-align:left;width:100%}
 .ann-in{height:auto;padding:9px 0;align-items:flex-start}
 .ann-rot{height:34px}
 .ann-rot b{white-space:normal;font-size:12px;line-height:1.4}
 .ld-in img{width:60px;height:60px}
 .ld-in p{font-size:16px}
 .ph3{--ph-h:470px}
 .qt p{font-size:20px}
 .dg h3{font-size:22px}
 .strip figure{width:196px;height:138px}
}

/* ── small phone ── */
@media (max-width:430px){
 .wrap{padding:0 15px}
 .brand span{display:none}
 .cta{font-size:14px;padding:10px 13px}
 .h-page{font-size:clamp(28px,8.4vw,34px)}
 .h-sec{font-size:clamp(23px,7vw,28px)}
 .ba-c,.card,.faq>div{padding:18px 16px}
 .wl,.dg{padding:24px 16px}
 .num>div{padding:20px 16px}
 .ph3{--ph-h:440px}
 .strip figure{width:172px;height:122px}
 .cmp .r{min-width:520px}
}

/* ── touch: 44px minimum targets ── */
@media (hover:none) and (pointer:coarse){
 .ff button,.vs-t button,.chips a,.nav>a,.dd>a,.dd-m a{min-height:44px;display:inline-flex;align-items:center}
 .chips a,.ff button{padding-top:11px;padding-bottom:11px}
 .nav>a,.dd>a,.dd-m a{padding-top:12px;padding-bottom:12px}
 .ft ul a{display:inline-block;padding:5px 0}
 .ft .base a{padding:6px 0;display:inline-block}
 .crumbs a{padding:6px 0;display:inline-block}
 .strip:hover .strip-t{animation-play-state:running}
}

/* responsive corrections from the width audit */
@media (max-width:1080px) and (min-width:901px){.ph3{grid-template-columns:280px 1fr;gap:38px}}
@media (max-width:640px){
 .ft-g{grid-template-columns:1fr;gap:28px}
 .ph3-hero span,.ph3-row span,.ph3-st span{font-size:10.5px}
 .ph3-s p{font-size:11.5px!important}
}
@media (max-width:430px){.ft-g{gap:24px}}

/* phone track: 6th screen duplicates the 1st so the loop resets invisibly */
.ph3-t{will-change:transform}

/* comparison: five tabs + verdict marks */
.vs-t{flex-wrap:wrap;gap:2px}
.vs-t button{padding:10px 16px;font-size:13px}
.vm{flex:none;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font-size:13px}
.vm .ic{font-size:15px}
.vm.y{background:rgba(239,198,107,.18);color:var(--gold)}
.vm.n{background:rgba(221,0,0,.16);color:#FF8A8A}
.vm.p{background:rgba(255,244,232,.09);color:var(--sub)}
.vm.x{background:rgba(255,244,232,.06);color:var(--mut)}
.vs-r.no{opacity:1}
.vs-r.no b{color:var(--sub)}
@media (max-width:640px){.vs-t{width:100%}.vs-t button{flex:1 1 auto;padding:10px 12px;font-size:12.5px}}

/* ══ HERO: crossfading banner ══ */
@keyframes heroX{0%{opacity:0}2%{opacity:.14}31%{opacity:.14}35%{opacity:0}100%{opacity:0}}
.hero .bgw{position:absolute;inset:0;overflow:hidden}
.hero .bgp{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;
 filter:saturate(1.08) contrast(1.04);
 animation:heroX 21s linear infinite,kb 21s ease-in-out infinite alternate;will-change:opacity,transform}
.hero .bgp:nth-child(2){animation-delay:7s}
.hero .bgp:nth-child(3){animation-delay:14s}
.hero .bgp.soft{filter:blur(2px) saturate(1.14) contrast(1.06)}
@media (prefers-reduced-motion:reduce){
 .hero .bgp{animation:none;opacity:0}
 .hero .bgp:first-child{opacity:.14}
}

/* ══ PHONE TRIO (static mockups) ══ */
.trio{display:flex;gap:26px;justify-content:center;align-items:flex-end;margin-top:48px;flex-wrap:wrap}
.trio figure{margin:0;width:236px;flex:none}
.trio .fr{width:236px;border-radius:32px;border:8px solid #0B0706;background:#190F0E;overflow:hidden;position:relative;
 box-shadow:0 24px 56px rgba(0,0,0,.55),0 0 0 1px rgba(239,198,107,.14);transition:transform .35s cubic-bezier(.2,.7,.3,1)}
.trio .fr::after{content:"";position:absolute;top:8px;left:50%;transform:translateX(-50%);width:60px;height:4px;border-radius:3px;background:#0B0706;z-index:4}
.trio figure:nth-child(1) .fr{transform:rotate(-2.2deg)}
.trio figure:nth-child(3) .fr{transform:rotate(2.2deg)}
.trio figure:nth-child(2){margin-bottom:26px}
.trio figure:hover .fr{transform:rotate(0) translateY(-6px)}
.trio .sc2{height:426px;padding:26px 12px 12px;box-sizing:border-box;overflow:hidden}
.trio h4{margin:0 0 11px;font-family:var(--disp);font-weight:400;font-size:16px;color:var(--cream);display:flex;align-items:center;gap:7px}
.trio h4 .ic{font-size:14px;color:var(--gold)}
.trio figcaption{margin-top:15px;text-align:center}
.trio figcaption b{display:block;font-family:var(--disp);font-weight:400;font-size:17px;color:var(--cream)}
.trio figcaption span{font-size:12.5px;color:var(--mut)}
.tr-hero{border-radius:13px;overflow:hidden;position:relative;border:1px solid var(--goldT);margin-bottom:8px}
.tr-hero img{display:block;width:100%;height:104px;object-fit:cover}
.tr-hero .g{position:absolute;inset:0;background:linear-gradient(180deg,transparent 32%,rgba(10,7,6,.9))}
.tr-hero .c{position:absolute;left:9px;right:9px;bottom:7px}
.tr-hero b{display:block;font-family:var(--disp);font-weight:400;font-size:14px;color:#FBF7F0}
.tr-hero span{font-size:9.5px;color:#D8CFC4}
.tr-hero .tag2{position:absolute;left:9px;top:9px;font-size:8px;font-weight:600;letter-spacing:.07em;text-transform:uppercase;background:var(--gold);color:#2A1B00;padding:3px 6px;border-radius:6px}
.tr-row{display:flex;gap:8px;padding:7px;border-radius:11px;background:var(--card);border:1px solid var(--line);margin-bottom:7px;align-items:center}
.tr-row img{width:38px;height:34px;border-radius:8px;object-fit:cover;flex:none}
.tr-row b{display:block;font-family:var(--disp);font-weight:400;font-size:12px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tr-row span{font-size:9.5px;color:var(--mut)}
.tr-row .p{margin-left:auto;flex:none;font-family:var(--disp);font-size:13px;color:var(--gold)}
.tr-row>.ic{font-size:15px;color:var(--gold);flex:none}
.tr-chip{display:inline-flex;font-size:9px;padding:5px 8px;border-radius:99px;background:var(--card);border:1px solid rgba(255,244,232,.14);color:var(--sub);margin:0 4px 4px 0}
.tr-chip.on{background:rgba(239,198,107,.16);border-color:var(--goldT);color:var(--cream)}
.tr-btn{height:36px;border-radius:10px;background:var(--red);display:grid;place-items:center;font-family:var(--disp);font-size:14px;color:#FFF6F0;margin-top:9px}
.tr-st{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-bottom:9px}
.tr-st div{padding:10px 8px;border-radius:11px;background:var(--card);border:1px solid var(--line);text-align:center}
.tr-st b{display:block;font-family:var(--disp);font-weight:400;font-size:18px;color:var(--gold);line-height:1}
.tr-st span{font-size:8.5px;color:var(--mut)}
.tr-p{margin:9px 0 0;font-size:10px;line-height:1.55;color:var(--sub)}
@media (max-width:820px){.trio{gap:18px}.trio figure,.trio .fr{width:206px}.trio .sc2{height:392px}}
@media (max-width:640px){.trio figure:nth-child(2){margin-bottom:0}.trio figure .fr{transform:none!important}}
@media (prefers-reduced-motion:reduce){.trio figure:hover .fr{transform:none}}

/* ══ HI-FI DEVICE MOCKUPS ══ */
.mk figure{margin:0;width:302px;flex:none}
.mk-lab{margin:0 0 15px;font-size:10.5px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--mut);text-align:center}
.mk-ph{position:relative;width:302px;border-radius:46px;padding:9px;
 background:linear-gradient(155deg,#4a423e 0%,#141010 26%,#2c2522 58%,#0d0a09 100%);
 box-shadow:0 34px 74px rgba(0,0,0,.62),0 0 0 1px rgba(239,198,107,.1);
 transition:transform .4s cubic-bezier(.2,.7,.3,1)}
.mk figure:hover .mk-ph{transform:translateY(-7px)}
.mk-ph::before,.mk-ph::after{content:"";position:absolute;left:-2px;width:3px;border-radius:2px;background:linear-gradient(#3a3330,#1a1513)}
.mk-ph::before{top:112px;height:30px}
.mk-ph::after{top:154px;height:52px}
.mk-btn-r{position:absolute;right:-2px;top:132px;width:3px;height:74px;border-radius:2px;background:linear-gradient(#3a3330,#1a1513)}
.mk-sc{position:relative;border-radius:38px;overflow:hidden;background:#0E0908;height:596px;display:flex;flex-direction:column}
.mk-isl{position:absolute;top:10px;left:50%;transform:translateX(-50%);width:82px;height:23px;border-radius:14px;background:#000;z-index:6}
.mk-st{display:flex;align-items:center;justify-content:space-between;padding:13px 24px 6px;font-size:11px;font-weight:600;color:#fff;position:relative;z-index:5}
.mk-st .sig{display:flex;gap:3px;align-items:flex-end}
.mk-st .sig i{width:3px;background:#fff;border-radius:1px;display:block}
.mk-st .sig i:nth-child(1){height:4px}.mk-st .sig i:nth-child(2){height:6px}
.mk-st .sig i:nth-child(3){height:8px}.mk-st .sig i:nth-child(4){height:10px}
.mk-st .bat{width:22px;height:11px;border:1px solid rgba(255,255,255,.6);border-radius:3px;padding:1.5px;display:flex}
.mk-st .bat i{flex:1;background:#fff;border-radius:1px;display:block}
.mk-hd{display:flex;align-items:center;gap:8px;padding:7px 13px 9px}
.mk-hd img{width:26px;height:26px;flex:none}
.mk-hd b{font-family:var(--disp);font-weight:400;font-size:16px;color:var(--cream);flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mk-hd .ib{width:30px;height:30px;border-radius:9px;background:rgba(255,244,232,.07);display:grid;place-items:center;flex:none}
.mk-hd .ib .ic{font-size:14px;color:var(--cream)}
.mk-body{flex:1;overflow:hidden;padding:0 13px 4px}
.mk-fil{display:flex;gap:5px;margin-bottom:9px;overflow:hidden}
.mk-fil span{font-size:9.5px;padding:6px 10px;border-radius:99px;border:1px solid rgba(255,244,232,.16);color:var(--sub);white-space:nowrap;flex:none}
.mk-fil span.on{background:var(--gold);border-color:var(--gold);color:#2A1B00;font-weight:600}
.mk-pro{position:relative;border-radius:13px;overflow:hidden;border:1px solid rgba(239,198,107,.34);margin-bottom:9px}
.mk-pro img{display:block;width:100%;height:96px;object-fit:cover;opacity:.62}
.mk-pro .ov2{position:absolute;inset:0;background:linear-gradient(96deg,rgba(14,9,8,.95) 4%,rgba(14,9,8,.42) 74%)}
.mk-pro .tx{position:absolute;inset:0;padding:11px 12px;display:flex;flex-direction:column;justify-content:center}
.mk-pro em{font-style:normal;font-size:7.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--gold)}
.mk-pro b{display:block;font-family:var(--disp);font-weight:400;font-size:14px;line-height:1.12;color:var(--cream);margin:3px 0 2px}
.mk-pro span{font-size:9px;color:var(--sub)}
.mk-pro .lk{display:inline-flex;align-items:center;gap:4px;margin-top:5px;font-size:9px;color:var(--gold)}
.mk-sec2{display:flex;align-items:center;gap:6px;margin:11px 0 8px}
.mk-sec2 i{width:5px;height:5px;border-radius:50%;background:var(--gold);display:block;flex:none}
.mk-sec2 b{font-family:var(--disp);font-weight:400;font-size:13px;color:var(--cream)}
.mk-sec2 span{margin-left:auto;font-size:8.5px;color:var(--mut)}
.mk-g2{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.mk-c{border-radius:11px;overflow:hidden;background:var(--card);border:1px solid var(--line);position:relative}
.mk-c>img{display:block;width:100%;height:62px;object-fit:cover}
.mk-c .hrt{position:absolute;right:6px;top:6px;width:20px;height:20px;border-radius:50%;background:rgba(10,7,6,.66);display:grid;place-items:center}
.mk-c .hrt .ic{font-size:11px;color:#fff}
.mk-c .cb{padding:7px 8px 8px}
.mk-c b{display:block;font-family:var(--disp);font-weight:400;font-size:11px;color:var(--cream);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mk-c span{font-size:8px;color:var(--mut);display:block;margin-top:1px}
.mk-c .pr2{display:flex;align-items:center;gap:4px;margin-top:5px;font-size:8.5px;color:var(--gold)}
.mk-c .flag{font-size:7px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;background:var(--red);color:#fff;padding:2px 5px;border-radius:4px;margin-left:auto}
.mk-tab{display:flex;padding:8px 0 11px;background:#120C0B;border-top:1px solid rgba(255,244,232,.07)}
.mk-tab div{flex:1;text-align:center;font-size:8.5px;color:var(--mut)}
.mk-tab div .ic{display:block;margin:0 auto 3px;font-size:16px}
.mk-tab div.on{color:#FF4B4B}
/* detail screen */
.mk-dh{position:relative}
.mk-dh>img{display:block;width:100%;height:196px;object-fit:cover}
.mk-dh .g3{position:absolute;inset:0;background:linear-gradient(180deg,rgba(14,9,8,.34) 0%,transparent 34%,rgba(14,9,8,.92) 100%)}
.mk-dh .bk{position:absolute;left:12px;top:12px;width:30px;height:30px;border-radius:50%;background:rgba(10,7,6,.6);display:grid;place-items:center;color:#fff;font-size:14px}
.mk-dh .acts{position:absolute;right:12px;bottom:-16px;display:flex;gap:7px}
.mk-dh .acts span{width:32px;height:32px;border-radius:50%;background:#241D1A;border:1px solid rgba(255,244,232,.14);display:grid;place-items:center}
.mk-dh .acts .ic{font-size:14px;color:var(--cream)}
.mk-dt{padding:14px 13px 0}
.mk-dt h5{margin:0 0 7px;font-family:var(--disp);font-weight:400;font-size:19px;color:var(--cream)}
.mk-meta{display:flex;flex-wrap:wrap;gap:9px;font-size:9px;color:var(--sub);margin-bottom:9px}
.mk-meta span{display:inline-flex;align-items:center;gap:4px}
.mk-meta .ic{font-size:11px;color:var(--gold)}
.mk-price{display:flex;align-items:baseline;gap:7px;margin-bottom:10px}
.mk-price b{font-family:var(--disp);font-weight:400;font-size:21px;color:var(--gold)}
.mk-price span{font-size:8.5px;color:var(--mut)}
.mk-cta{height:38px;border-radius:11px;background:var(--red);display:flex;align-items:center;justify-content:center;gap:7px;font-family:var(--disp);font-size:14px;color:#FFF6F0;margin-bottom:7px}
.mk-cta .ic{font-size:15px}
.mk-cta2{height:36px;border-radius:11px;background:#241D1A;border:1px solid rgba(255,244,232,.14);display:flex;align-items:center;justify-content:center;gap:7px;font-size:11.5px;color:var(--cream)}
.mk-cta2 .ic{font-size:13px;color:var(--gold)}
.mk-note2{margin:9px 0 0;padding:9px 11px;border-radius:10px;background:rgba(239,198,107,.09);border:1px solid rgba(239,198,107,.26)}
.mk-note2 b{display:flex;align-items:center;gap:5px;font-family:var(--disp);font-weight:400;font-size:11px;color:var(--gold);margin-bottom:2px}
.mk-note2 b .ic{font-size:12px}
.mk-note2 p{margin:0;font-size:9px;color:var(--sub);line-height:1.5}
.mk-blk{margin-top:11px}
.mk-blk b{display:flex;align-items:center;gap:5px;font-family:var(--disp);font-weight:400;font-size:11.5px;color:var(--cream);margin-bottom:5px}
.mk-blk b .ic{font-size:12px;color:var(--gold)}
.mk-blk p{margin:0;font-size:9px;line-height:1.55;color:var(--sub)}
.mk-bill{display:flex;align-items:center;gap:8px;padding:7px 9px;border-radius:10px;background:var(--card);border:1px solid var(--line)}
.mk-bill .av{width:24px;height:24px;border-radius:50%;background:rgba(186,0,0,.3);display:grid;place-items:center;font-family:var(--disp);font-size:11px;color:#FFB4B4;flex:none}
.mk-bill b{margin:0;font-size:10.5px}
.mk-bill span{font-size:8.5px;color:var(--mut)}
.mk-tags{display:flex;flex-wrap:wrap;gap:5px;margin-top:6px}
.mk-tags span{font-size:8px;padding:4px 7px;border-radius:7px;background:rgba(255,244,232,.06);color:var(--sub);display:inline-flex;align-items:center;gap:4px}
.mk-tags .ic{font-size:10px;color:var(--gold)}
@media (max-width:720px){.mk{gap:34px}.mk figure,.mk-ph{width:272px}.mk-sc{height:552px}}
@media (max-width:430px){.mk figure,.mk-ph{width:248px}.mk-sc{height:512px}}
@media (prefers-reduced-motion:reduce){.mk figure:hover .mk-ph{transform:none}}

/* ══ REAL APP EMBEDDED IN DEVICE FRAME ══ */
.mk-ifw{flex:1;overflow:hidden;position:relative;background:#140C0B}
.mk-if{position:absolute;top:0;left:0;width:390px;height:778px;border:0;
 transform:scale(.7282);transform-origin:top left;pointer-events:none;background:#140C0B}
.mk-live{display:inline-flex;align-items:center;gap:5px;margin-top:9px;font-size:10px;
 letter-spacing:.1em;text-transform:uppercase;color:var(--gold)}
.mk-live i{width:5px;height:5px;border-radius:50%;background:#7BD88F;box-shadow:0 0 8px 2px rgba(123,216,143,.5);display:block;animation:bulb 2s ease-in-out infinite}
.mk figcaption{text-align:center;margin-top:13px}
.mk figcaption b{display:block;font-family:var(--disp);font-weight:400;font-size:16px;color:var(--cream)}
.mk figcaption span{font-size:12px;color:var(--mut)}
@media (max-width:720px){.mk-if{transform:scale(.6564)}}
@media (max-width:430px){.mk-if{transform:scale(.5949)}}
@media (prefers-reduced-motion:reduce){.mk-live i{animation:none}}

/* ══ APP LAUNCH STRIP ══ */
.als{display:grid;grid-template-columns:1fr auto;gap:52px;align-items:center}
.als-pill{display:inline-flex;align-items:center;gap:8px;padding:8px 15px;border-radius:99px;
 background:rgba(239,198,107,.11);border:1px solid var(--goldT);font-size:12px;font-weight:600;
 letter-spacing:.12em;text-transform:uppercase;color:var(--gold);margin-bottom:20px}
.als-pill i{width:6px;height:6px;border-radius:50%;background:#7BD88F;box-shadow:0 0 8px 2px rgba(123,216,143,.5);display:block;animation:bulb 2s ease-in-out infinite}
.als h2{font-size:clamp(28px,3.6vw,42px)}
.store{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}
.store span{display:flex;align-items:center;gap:10px;padding:12px 18px;border-radius:13px;
 border:1px solid rgba(255,244,232,.16);background:rgba(255,244,232,.04)}
.store .ic{font-size:21px;color:var(--sub)}
.store b{display:block;font-family:var(--disp);font-weight:400;font-size:15px;color:var(--cream)}
.store em{font-style:normal;font-size:10.5px;color:var(--mut);letter-spacing:.06em;text-transform:uppercase}
.als-facts{display:flex;gap:26px;flex-wrap:wrap;margin-top:26px;padding-top:22px;border-top:1px solid var(--line)}
.als-facts div b{display:block;font-family:var(--disp);font-weight:400;font-size:24px;color:var(--gold);line-height:1}
.als-facts div span{font-size:12.5px;color:var(--mut)}
@media (max-width:1080px){.als{grid-template-columns:1fr;gap:34px}}
@media (prefers-reduced-motion:reduce){.als-pill i{animation:none}}

/* ══ MOCKUPS: swipeable carousel on phones ══ */
.mk-hint{display:none}
@media (max-width:720px){
 .mk{display:flex;flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;overflow-y:hidden;
  scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;gap:16px;
  margin:32px -18px 0;padding:0 18px 10px;scrollbar-width:none}
 .mk::-webkit-scrollbar{display:none}
 .mk figure{scroll-snap-align:center;width:236px;flex:0 0 236px}
 .mk-ph{width:236px;padding:7px;border-radius:36px}
 .mk-sc{height:468px;border-radius:30px}
 .mk-isl{width:66px;height:19px;top:8px}
 .mk-st{padding:10px 18px 5px;font-size:10px}
 .mk-if{transform:scale(.559)}
 .mk-lab{font-size:9.5px;margin-bottom:11px}
 .mk figcaption{margin-top:10px}
 .mk figcaption b{font-size:14px}
 .mk figcaption span{font-size:11px}
 .mk-live{font-size:9px}
 .mk+.mk-hint{display:flex;align-items:center;justify-content:center;gap:7px;margin:12px 0 0;
  font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--mut)}
 .mk-hint .ic{font-size:14px;color:var(--gold)}
}
@media (max-width:430px){
 .mk figure{width:214px;flex:0 0 214px}
 .mk-ph{width:214px}
 .mk-sc{height:432px}
 .mk-if{transform:scale(.5077)}
}

/* ══ MOCKUP GRID: 3 up, 3 down ══ */
.mk{margin-top:48px}
.mk figcaption{text-align:center;margin-top:13px;display:flex;flex-direction:column;align-items:center;gap:4px}
.mk figcaption b{display:block;font-family:var(--disp);font-weight:400;font-size:16px;color:var(--cream)}
.mk figcaption span{display:block;font-size:12px;color:var(--mut)}
.mk figcaption .mk-live{margin-top:3px}
@media (max-width:1080px){.mk{grid-template-columns:1fr 1fr;gap:44px 26px}}


/* ══ CTA BAR UNDER MOCKUP GROUPS ══ */
.mk-cta-bar{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:12px;margin-top:36px}
.mk-cta-bar .store{margin:0}
.mk-cta-bar .sb{display:flex;align-items:center;gap:10px;padding:11px 17px;border-radius:13px;
 border:1px solid rgba(255,244,232,.16);background:rgba(255,244,232,.04);transition:border-color .2s}
.mk-cta-bar .sb:hover{border-color:var(--goldT)}
.mk-cta-bar .sb .ic{font-size:20px;color:var(--sub)}
.mk-cta-bar .sb b{display:block;font-family:var(--disp);font-weight:400;font-size:14px;color:var(--cream)}
.mk-cta-bar .sb em{font-style:normal;font-size:10px;color:var(--mut);letter-spacing:.06em;text-transform:uppercase}
@media (max-width:640px){.mk-cta-bar{gap:9px}.mk-cta-bar .btn{width:100%;text-align:center}}


/* ══ POSTER PHONES: layout restored, one live instance max ══ */
.mk-po{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;
 background:radial-gradient(120% 80% at 50% 30%,rgba(186,0,0,.20),transparent 62%),#140C0B;
 border:0;width:100%;cursor:pointer;font:inherit;color:inherit;text-align:center;padding:26px 20px;
 transition:background .25s}
.mk-po:hover{background:radial-gradient(120% 80% at 50% 30%,rgba(186,0,0,.30),transparent 62%),#170F0D}
.mk-po img{width:54px;height:54px;display:block;opacity:.9}
.mk-po b{font-family:var(--disp);font-weight:400;font-size:19px;color:var(--cream);line-height:1.15}
.mk-po small{font-size:11.5px;color:var(--mut);max-width:200px;line-height:1.5}
.mk-po .play{display:inline-flex;align-items:center;gap:8px;padding:10px 17px;border-radius:99px;
 background:rgba(239,198,107,.13);border:1px solid var(--goldT);color:var(--gold);
 font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase}
.mk-po .play .ic{font-size:14px}
.mk-po:hover .play{background:var(--gold);color:#2A1B00;border-color:var(--gold)}
.mk-po:focus-visible{outline:2px solid var(--gold);outline-offset:-4px}
.mk-ifw.live .mk-po{display:none}
.mk-note3{margin:14px 0 0;text-align:center;font-size:12px;color:var(--mut)}
.mk-note3 .ic{font-size:13px;color:var(--gold);vertical-align:-.15em;margin-right:5px}

@media (max-width:720px){.mk-po b{font-size:16px}.mk-po img{width:44px;height:44px}}

/* desktop grid scoped so it never fights the mobile carousel */
@media (min-width:721px){.mk{display:flex;flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;gap:34px;padding-bottom:14px;scrollbar-width:thin;scrollbar-color:rgba(239,198,107,.4) transparent;mask-image:linear-gradient(90deg,#000 92%,transparent)}.mk::-webkit-scrollbar{height:6px}.mk::-webkit-scrollbar-thumb{background:rgba(239,198,107,.34);border-radius:3px}.mk figure{width:302px;flex:0 0 302px;scroll-snap-align:start}}
@media (min-width:721px) and (max-width:1080px){.mk{grid-template-columns:1fr 1fr}}
.mk-ifw.live{background:#140C0B}

/* ── mockups: single authoritative carousel rule (≤720px) ── */
@media (max-width:720px){
 .mk{display:flex!important;flex-wrap:nowrap;justify-content:flex-start!important;align-items:flex-start;
  overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;
  gap:16px;margin:32px -18px 0;padding:0 18px 10px;scrollbar-width:none}
 .mk::-webkit-scrollbar{display:none}
 .mk figure{width:236px!important;flex:0 0 236px;scroll-snap-align:center}
 .mk-ph{width:236px}
}
@media (max-width:430px){
 .mk figure{width:214px!important;flex:0 0 214px}
 .mk-ph{width:214px}
}

/* ══════════════ HOMEPAGE FOLD CAROUSEL ══════════════ */
.folds{position:relative;--fold-h:calc(100vh - 180px);padding-bottom:var(--rail-h,56px)}
.folds-t{display:flex;flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;
 scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.folds-t::-webkit-scrollbar{display:none}
.folds-t>section{flex:0 0 100vw;width:100vw;scroll-snap-align:start;
 height:var(--fold-h);min-height:320px;overflow-y:auto;overflow-x:hidden;
 border-bottom:0;display:flex;flex-direction:column;justify-content:flex-start;padding:0;
 scrollbar-width:thin;scrollbar-color:rgba(239,198,107,.4) transparent}
.folds-t>section::-webkit-scrollbar{width:5px}
.folds-t>section::-webkit-scrollbar-thumb{background:rgba(239,198,107,.34);border-radius:3px}
.folds-t>section>.wrap{margin-top:auto;margin-bottom:auto;padding-top:40px;padding-bottom:96px}
.folds-t>section.hero .in{margin-top:auto;margin-bottom:auto;padding:40px 0 96px}
/* arrows */
.fold-nav{position:fixed;top:var(--fold-mid,50%);transform:translateY(-50%);z-index:40;width:52px;height:52px;border-radius:50%;
 border:1px solid var(--goldT);background:rgba(20,12,11,.82);backdrop-filter:blur(8px);color:var(--gold);
 display:grid;place-items:center;cursor:pointer;transition:background .2s,transform .2s,opacity .2s}
.fold-nav .ic{font-size:22px}
.fold-nav:hover{background:var(--gold);color:#2A1B00;transform:translateY(-50%) scale(1.06)}
.fold-nav.prev{left:16px}
.fold-nav.prev .ic{transform:rotate(180deg)}
.fold-nav.next{right:16px}
.fold-nav[disabled]{opacity:.28;pointer-events:none}
/* dots / labels */
.fold-dots{position:fixed;left:0;right:0;bottom:0;z-index:40;background:#140C0B;border-top:1px solid var(--line);display:flex;gap:6px;justify-content:center;
 flex-wrap:nowrap;overflow-x:auto;padding:12px 16px;scrollbar-width:none}
.fold-dots::-webkit-scrollbar{display:none}
.fold-dot{flex:none;border:1px solid rgba(255,244,232,.16);background:rgba(255,244,232,.05);color:var(--sub);
 border-radius:99px;padding:8px 14px;cursor:pointer;font:400 12px var(--ui);white-space:nowrap;transition:all .2s}
.fold-dot:hover{border-color:var(--goldT);color:var(--cream)}
.fold-dot.on{background:var(--gold);border-color:var(--gold);color:#2A1B00;font-weight:500}
/* progress */
.fold-prog{position:absolute;left:0;top:0;height:2px;width:100%;transform-origin:left center;transform:scaleX(0);background:linear-gradient(90deg,var(--gold),var(--red));z-index:21}
@media (max-width:1080px){
 .fold-dots{padding:10px 14px}
 .fold-nav{width:44px;height:44px}
 .fold-nav.prev{left:8px}.fold-nav.next{right:8px}
}
@media (max-width:720px){
 .folds-t>section[data-lite="0"],.fold-dot[data-lite="0"]{display:none}
 .folds-t>section{height:auto;min-height:var(--fold-h);justify-content:flex-start}
 .folds-t>section>.wrap,.folds-t>section.hero .in{margin-top:0;margin-bottom:0}
 .folds-t>section>.wrap{padding-top:34px;padding-bottom:82px}
 .fold-nav{display:none}
 .fold-dot{font-size:11.5px;padding:7px 12px}
}
@media (prefers-reduced-motion:reduce){.folds-t{scroll-behavior:auto}.fold-nav{transition:none}}

/* fold panels: mockups are one row, never a second (keeps a panel ~one fold) */
.folds-t .mk>figure:nth-child(n+4){display:none}
.folds-t .mk{gap:34px 26px}
@media (max-width:720px){.folds-t .mk>figure:nth-child(n+4){display:flex}}

.folds-t>section>.wrap{padding-bottom:56px}

/* fit-to-fold scaling — JS sets --fit per panel; zoom (unlike transform) reflows */
.folds-t>section>.wrap{zoom:var(--fit,1)}

/* fold panels: mockup row must fit its fold at every width */
.folds-t .mk{grid-template-columns:repeat(3,1fr)!important;gap:20px}
.folds-t .mk-lab{display:none}
.folds-t .mk figure{width:auto}
.folds-t .mk-ph{width:100%;padding:6px;border-radius:30px}
.folds-t .mk-sc{height:min(46vh,470px);border-radius:24px}
.folds-t .mk-if{transform:scale(var(--ifs,.62))}
.folds-t .mk figcaption b{font-size:14px}
.folds-t .mk figcaption span{font-size:11px}
.folds-t .mk-po b{font-size:15px}
.folds-t .mk-po img{width:40px;height:40px}
.folds-t .mk-po small{font-size:10.5px}
@media (max-width:720px){
 .folds-t .mk{grid-template-columns:none!important}
 .folds-t .mk-lab{display:block}
 .folds-t .mk figure{width:236px!important}
 .folds-t .mk-sc{height:468px}
}

/* ══ SECTION CAROUSELS: long content rows scroll left-to-right inside a vertical page ══ */
.hsc{position:relative}
.hsc-t{display:flex;flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;
 -webkit-overflow-scrolling:touch;gap:24px;padding-bottom:14px;scrollbar-width:thin;
 scrollbar-color:rgba(239,198,107,.4) transparent;mask-image:linear-gradient(90deg,#000 92%,transparent)}
.hsc-t::-webkit-scrollbar{height:6px}
.hsc-t::-webkit-scrollbar-thumb{background:rgba(239,198,107,.34);border-radius:3px}
.hsc-t>*{flex:0 0 340px;scroll-snap-align:start}
.hsc-btn{position:absolute;top:50%;transform:translateY(-50%);z-index:5;width:42px;height:42px;border-radius:50%;
 border:1px solid var(--goldT);background:rgba(20,12,11,.86);color:var(--gold);display:grid;place-items:center;cursor:pointer}
.hsc-btn:hover{background:var(--gold);color:#2A1B00}
.hsc-btn.p{left:0}.hsc-btn.p .ic{transform:rotate(180deg)}
.hsc-btn.n{right:0}
.hsc-btn[disabled]{opacity:.25;pointer-events:none}
/* feed cards + FAQ become in-section carousels */
.feed{display:flex!important;flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;
 gap:24px;padding-bottom:14px;scrollbar-width:thin;scrollbar-color:rgba(239,198,107,.4) transparent;
 mask-image:linear-gradient(90deg,#000 92%,transparent)}
.feed::-webkit-scrollbar{height:6px}
.feed::-webkit-scrollbar-thumb{background:rgba(239,198,107,.34);border-radius:3px}
.feed>article{flex:0 0 340px;scroll-snap-align:start}
@media (max-width:720px){.feed>article{flex-basis:280px}.hsc-t>*{flex-basis:280px}.mk figure{width:236px!important;flex:0 0 236px}}

/* ══ MOBILE: hero fills the screen, image reads, menu is full-screen ══ */
@media (max-width:720px){
 .hero{display:flex;flex-direction:column;justify-content:center;min-height:calc(100svh - 106px)}
 .hero .in{padding-top:36px;padding-bottom:44px}
 .hero .bgp{opacity:0}
 .hero .bgp:first-child,html.no-anim .hero .bgp:first-child{opacity:.14}
 .hero .bgp{animation:none}
 .hero::after{background:radial-gradient(120% 86% at 50% 34%,transparent 20%,rgba(20,12,11,.78) 100%)}
 .h-page{font-size:clamp(34px,10vw,44px)}
 .hero .lede{font-size:16.5px}
 .hero .btn,.hero .btn2{padding:15px 22px;font-size:17px}
}
@media (max-width:1080px){
 /* full-screen menu instead of a cramped dropdown */
 .nav{position:fixed;left:0;right:0;top:64px;bottom:0;z-index:60;background:#171010;
  overflow-y:auto;padding:18px 20px 40px;gap:4px;border-bottom:0}
 .nav>a,.dd>a{font-size:17px;padding:15px 12px;border-bottom:1px solid var(--line);border-radius:0}
 .dd-m{padding:4px 0 10px 14px}
 .dd-m a{font-size:15px;padding:11px 12px}
 .nav-t:checked~.nav{display:flex}
 body:has(.nav-t:checked){overflow:hidden}
}

/* launch strip: single phone on the right, balanced with the copy */
.als-ph{width:302px;flex:none}
.als-ph .mk-lab{display:none}
@media (max-width:1080px){.als-ph{margin:0 auto}}

@media (max-width:1080px){
 .nav{position:absolute;left:0;right:0;top:100%;bottom:auto;max-height:calc(100svh - 64px);overflow-y:auto;
  box-shadow:0 30px 60px rgba(0,0,0,.5)}
}
@media (max-width:720px){
 .ann-in{height:auto;padding:8px 0;gap:9px;align-items:center}
 .ann-rot{height:auto;min-height:18px}
 .ann-rot b{font-size:11.5px;line-height:1.35;white-space:normal}
 .brand img[src*="logo-text"]{height:26px!important}
 .hd-in{gap:10px}
}

/* — single brand lockup, bigger — */
.bmark{height:52px;width:auto;display:block}
.fmark{height:44px}
@media (max-width:720px){.bmark{height:40px}.fmark{height:36px}}
/* — icon watermark identity — */
.sec .wrap{position:relative}
.wm{position:absolute;right:-40px;top:-10px;width:240px;height:auto;opacity:.05;pointer-events:none;user-select:none;transform:rotate(-8deg)}
.sec.alt .wm{opacity:.07}
.hero .wm-h{position:absolute;right:4%;bottom:-6%;width:320px;opacity:.08;transform:rotate(8deg);pointer-events:none}
@media (max-width:720px){.wm{width:150px;right:-24px}.hero .wm-h{width:200px}}

/* — stage-curtain identity — */
.hero .in{z-index:2}
.hero::before,.hero::after{content:"";position:absolute;top:0;bottom:0;width:clamp(120px,16vw,260px);background:url(../img/curtain.webp) center/cover;opacity:.34;pointer-events:none;z-index:1}
.hero::before{left:0;-webkit-mask-image:linear-gradient(90deg,#000 25%,transparent);mask-image:linear-gradient(90deg,#000 25%,transparent)}
.hero::after{right:0;-webkit-mask-image:linear-gradient(270deg,#000 25%,transparent);mask-image:linear-gradient(270deg,#000 25%,transparent)}
@media (max-width:720px){.hero::before,.hero::after{width:90px;opacity:.26}}
.wl .bgi[src*="curtain"]{opacity:.24;object-position:center top}
.ft{position:relative}
.ft::before{content:"";position:absolute;top:0;left:0;right:0;height:56px;background:url(../img/curtain.webp) center top/auto 200px repeat-x;opacity:.16;-webkit-mask-image:linear-gradient(180deg,#000,transparent);mask-image:linear-gradient(180deg,#000,transparent);pointer-events:none}

/* — logo: bigger, consistent — */
.hd-in{height:84px}
.bmark{height:64px}
.fmark{height:54px}
.ld-in img{width:120px;height:auto}
@media (max-width:1080px){.nav{top:100%}}
@media (max-width:720px){
 .hd-in{height:68px}
 .bmark{height:50px}
 .fmark{height:46px}
 .ld-in img{width:96px}
}
/* — logo watermark identity — */
.sec .wrap{position:relative;z-index:0}
.sec.alt .wrap::after,.hero .in::after{content:"";position:absolute;z-index:-1;background:url(../img/logo-icon.png) no-repeat center/contain;pointer-events:none}
.sec.alt .wrap::after{right:-60px;top:-24px;width:300px;height:280px;opacity:.045;transform:rotate(-10deg)}
.hero .in{z-index:2;position:relative}
.hero .in::after{right:2%;bottom:-40px;width:380px;height:355px;opacity:.06;transform:rotate(8deg)}
.wl::after{content:"";position:absolute;right:-50px;bottom:-60px;width:280px;height:262px;background:url(../img/logo-icon.png) no-repeat center/contain;opacity:.06;transform:rotate(-12deg);pointer-events:none}
.ft-in{position:relative;z-index:0}
.ft-in::after{content:"";position:absolute;z-index:-1;right:-40px;bottom:-30px;width:340px;height:318px;background:url(../img/logo-icon.png) no-repeat center/contain;opacity:.035;transform:rotate(10deg);pointer-events:none}
/* soft brand shadow under the header lockup */
.brand .bmark{filter:drop-shadow(0 4px 14px rgba(186,0,0,.35))}
@media (max-width:720px){
 .sec.alt .wrap::after{width:180px;height:168px;right:-40px}
 .hero .in::after{width:220px;height:206px;bottom:-24px}
 .wl::after{width:170px;height:159px;right:-36px;bottom:-40px}
 .ft-in::after{width:200px;height:187px}
}

/* logo lockup sizing — specificity matched to .brand img */
.brand img.bmark{width:auto;height:64px}
.brand img.fmark{width:auto;height:54px}
@media (max-width:720px){.brand img.bmark{height:50px}.brand img.fmark{height:46px}}

/* — stage backdrops from brand curtain art — */
.hero{background:#0B0605 url(../img/curtain-hero.webp) center/cover no-repeat}
.hero::before,.hero::after{content:none}
.hero .bgp{opacity:.10;mix-blend-mode:luminosity}
.wl .bgi[src*="curtain"]{opacity:.5;object-position:center}

/* — stage personality for body sections: red glows, doodles, texture — */
/* alt sections: faint curtain texture + warm top glow */
.sec.alt{background:var(--bg2) url(../img/curtain.webp) center top/1400px auto repeat;background-blend-mode:soft-light;position:relative}
.sec.alt::before{content:"";position:absolute;inset:0;background:radial-gradient(60% 50% at 50% 0%,rgba(186,0,0,.14),transparent 70%),linear-gradient(rgba(34,26,22,.88),rgba(34,26,22,.92));pointer-events:none}
.sec.alt .wrap{position:relative;z-index:1}
/* plain sections: soft red corner glow, alternating sides */
.sec:not(.alt){position:relative}
.sec:not(.alt)::before{content:"";position:absolute;inset:0;background:radial-gradient(42% 38% at 0% 0%,rgba(186,0,0,.07),transparent 70%);pointer-events:none}
.sec:not(.alt):nth-of-type(even)::before{background:radial-gradient(42% 38% at 100% 0%,rgba(186,0,0,.07),transparent 70%)}
/* doodle: red squiggle under section headings */
.h-sec{position:relative;padding-bottom:16px}
.h-sec::after{content:"";position:absolute;left:2px;bottom:0;width:120px;height:10px;background:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 120 10"><path d="M2 6 C 12 1, 22 9, 32 5 S 52 1, 62 6 S 82 9, 92 4 S 112 2, 118 6" fill="none" stroke="%23BA0000" stroke-width="3" stroke-linecap="round"/></svg>') no-repeat left center/contain}
/* doodle: gold starburst before eyebrows */
.eyebrow{display:flex;align-items:center;gap:8px}
.eyebrow::before{content:"";width:14px;height:14px;flex:none;background:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 14 14"><path d="M7 0 L8.3 5.7 L14 7 L8.3 8.3 L7 14 L5.7 8.3 L0 7 L5.7 5.7 Z" fill="%23EFC66B"/></svg>') no-repeat center/contain}
/* cards & tiles: depth + red hover glow */
.card,.tile,.show{box-shadow:0 6px 20px rgba(0,0,0,.28)}
a.card:hover,.tile:hover,a.show:hover{box-shadow:0 12px 34px rgba(186,0,0,.26);transform:translateY(-2px)}
a.card,.tile,a.show{transition:border-color .18s,box-shadow .22s,transform .22s}
/* steps: red number glow + doodle arc */
.step .n{text-shadow:0 0 18px rgba(186,0,0,.55)}
.step{position:relative}
.step::after{content:"";position:absolute;right:6px;top:14px;width:26px;height:26px;opacity:.5;background:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 26 26"><path d="M3 18 C 6 8, 16 4, 23 8 M23 8 l-5.5 -0.5 M23 8 l-2 5" fill="none" stroke="%23BA0000" stroke-width="2.4" stroke-linecap="round"/></svg>') no-repeat center/contain}
/* waitlist + comparison: red ambience */
.wl{box-shadow:0 24px 70px rgba(186,0,0,.16),0 8px 30px rgba(0,0,0,.4)}
.cmp{box-shadow:0 10px 34px rgba(0,0,0,.32)}
.cmp .hdc{text-shadow:0 0 14px rgba(239,198,107,.4)}
/* FAQ question doodle */
.faq h3{position:relative;padding-left:20px}
.faq h3::before{content:"";position:absolute;left:0;top:6px;width:12px;height:12px;background:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 12 12"><circle cx="6" cy="6" r="4.5" fill="none" stroke="%23BA0000" stroke-width="2.4" stroke-dasharray="3 2.4"/></svg>') no-repeat center/contain}
@media (max-width:720px){.h-sec::after{width:92px}.step::after{display:none}}