/* ══ INTERACTION LAYER ══ */

/* reveal on scroll */
@media (prefers-reduced-motion:no-preference){
.anim{opacity:0;transform:translateY(18px) scale(.995);filter:blur(4px)}
.anim.in{animation:reveal .8s cubic-bezier(.22,1,.36,1) forwards;animation-delay:var(--d,0s)}
@keyframes reveal{to{opacity:1;transform:none;filter:blur(0)}}
.nav{animation:slideDown .7s cubic-bezier(.22,1,.36,1) both}
@keyframes slideDown{from{opacity:0;transform:translateY(-16px)}to{opacity:1;transform:none}}
}

/* hover polish */
.card{transition:transform .35s cubic-bezier(.22,1,.36,1),border-color .35s ease,box-shadow .35s ease}
.card:hover{transform:translateY(-3px);border-color:rgba(11,15,26,.28);box-shadow:0 14px 34px rgba(11,15,26,.07)}
.card.dark:hover{border-color:rgba(255,255,255,.4);box-shadow:0 14px 34px rgba(11,15,26,.3)}
.row{transition:background .3s ease}
.row:hover{background:rgba(22,64,255,.035)}
.mark .wm{transition:opacity .3s ease}
.mark:hover .wm{opacity:.62}
.nav-links a{transition:color .25s ease}
.foot-nav a{transition:color .25s ease,transform .25s ease}
.foot-nav a:hover{transform:translateX(3px)}
.step .dot{transition:transform .35s cubic-bezier(.22,1,.36,1)}
.step:hover .dot{transform:scale(1.08)}

/* ══ COUNT-UP STAT BAND ══ */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;border-top:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft)}
.stat{padding:clamp(26px,3vw,40px) clamp(14px,1.8vw,26px) clamp(26px,3vw,40px) 0;border-right:1px solid var(--line-soft);display:flex;flex-direction:column;gap:11px}
.stat:last-child{border-right:0}
.stat .sk{font-family:"Geist Mono",monospace;font-size:11.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--cobalt)}
.stat .sv{font-family:"Instrument Serif",serif;font-size:clamp(46px,5.4vw,86px);line-height:.92;letter-spacing:-.03em;color:var(--ink);font-variant-numeric:tabular-nums}
.stat .sl{font-size:var(--small);line-height:1.4;color:var(--muted)}
.dark-band .stats{border-color:rgba(255,255,255,.18)}
.dark-band .stat{border-right-color:rgba(255,255,255,.18)}
.dark-band .stat .sv{color:#fff}
.dark-band .stat .sl{color:rgba(255,255,255,.62)}
.dark-band .stat .sk{color:#8FA5FF}

/* ══ MOBILE MENU ══ */
.burger{display:none;width:46px;height:46px;border-radius:50%;background:var(--ink);border:0;cursor:pointer;position:relative;flex:0 0 auto;transition:background .3s ease}
.burger span{position:absolute;left:50%;top:50%;width:17px;height:1.5px;background:#fff;border-radius:2px;transition:transform .34s cubic-bezier(.22,1,.36,1),opacity .2s ease,background .3s ease}
.burger span:nth-child(1){transform:translate(-50%,-50%) translateY(-5.5px)}
.burger span:nth-child(2){transform:translate(-50%,-50%)}
.burger span:nth-child(3){transform:translate(-50%,-50%) translateY(5.5px)}
.burger[aria-expanded="true"]{background:#fff}
.burger[aria-expanded="true"] span{background:var(--ink)}
.burger[aria-expanded="true"] span:nth-child(1){transform:translate(-50%,-50%) rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.burger[aria-expanded="true"] span:nth-child(3){transform:translate(-50%,-50%) rotate(-45deg)}

.m-overlay{position:fixed;inset:0;background:rgba(11,15,26,.5);backdrop-filter:blur(6px);z-index:30;animation:ovIn .28s ease both}
@keyframes ovIn{from{opacity:0}to{opacity:1}}
.m-sheet{position:fixed;left:var(--pad-x);right:var(--pad-x);top:86px;z-index:31;background:#fff;border-radius:24px;padding:14px;box-shadow:0 22px 64px rgba(11,15,26,.34);animation:shIn .38s cubic-bezier(.22,1,.36,1) both}
@keyframes shIn{from{opacity:0;transform:translateY(-14px) scale(.97)}to{opacity:1;transform:none}}
.m-sheet a{display:block;padding:16px 18px;border-radius:14px;font-family:"Geist Mono",monospace;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);animation:lkIn .4s cubic-bezier(.22,1,.36,1) both;animation-delay:var(--ld,0s)}
@keyframes lkIn{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:none}}
.m-sheet a:hover{background:var(--bone-2);color:var(--ink)}
.m-sheet a.on{color:var(--ink);background:rgba(22,64,255,.06)}
.m-sheet a.on::after{content:"";display:block;width:22px;height:2px;background:var(--cobalt);margin-top:9px}
body.menu-open{overflow:hidden}

@media(max-width:860px){
.burger{display:block}
.nav-in{flex-direction:row;align-items:center;justify-content:space-between;gap:16px}
.nav-links{display:none}
.stats{grid-template-columns:repeat(2,1fr)}
.stat{padding-right:clamp(14px,3vw,22px)}
.stat:nth-child(2){border-right:0}
.stat:nth-child(1),.stat:nth-child(2){border-bottom:1px solid var(--line-soft)}
.dark-band .stat:nth-child(1),.dark-band .stat:nth-child(2){border-bottom-color:rgba(255,255,255,.18)}
}
@media(max-width:520px){
.stats{grid-template-columns:1fr}
.stat,.stat:nth-child(2){border-right:0;border-bottom:1px solid var(--line-soft)}
.stat:last-child{border-bottom:0}
}
@media (prefers-reduced-motion:reduce){
.anim,.nav,.m-sheet,.m-sheet a,.m-overlay{animation:none!important;opacity:1!important;transform:none!important;filter:none!important}
.card:hover,.step:hover .dot,.foot-nav a:hover{transform:none}
}

/* ══ WEB LAYER ══ */
.progress{position:fixed;top:0;left:0;width:100%;height:2px;background:var(--cobalt);transform:scaleX(0);transform-origin:left;z-index:60;pointer-events:none}

@media (prefers-reduced-motion:no-preference){
body{animation:pageFade .45s ease both}
@keyframes pageFade{from{opacity:0}to{opacity:1}}
body.leaving{opacity:0;transition:opacity .24s ease}
}

/* nav hover underline */
.nav-links a{position:relative}
.nav-links a::before{content:"";position:absolute;left:0;bottom:-7px;height:2px;width:100%;background:var(--ink);transform:scaleX(0);transform-origin:right;transition:transform .35s cubic-bezier(.22,1,.36,1)}
.nav-links a:hover::before{transform:scaleX(1);transform-origin:left}
.nav-links a.on::before{display:none}

/* accordion */
.fx{border-top:1px solid var(--line-soft)}
.fx-item{border-bottom:1px solid var(--line-soft)}
.fx-head{width:100%;display:grid;grid-template-columns:72px 1fr auto 34px;align-items:center;gap:20px;padding:clamp(20px,2.4vw,30px) 0;background:none;border:0;cursor:pointer;text-align:left;font:inherit;color:inherit}
.fx-num{font-family:"Geist Mono",monospace;font-size:13px;letter-spacing:.16em;color:var(--cobalt)}
.fx-t{font-family:"Instrument Serif",serif;font-weight:400;letter-spacing:-.015em;font-size:clamp(26px,3.2vw,46px);line-height:1.04;color:var(--ink);transition:color .3s ease,transform .35s cubic-bezier(.22,1,.36,1)}
.fx-head:hover .fx-t{color:var(--cobalt);transform:translateX(6px)}
.fx-tag{font-family:"Geist Mono",monospace;font-size:11.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.fx-x{position:relative;width:34px;height:34px;border:1px solid var(--line-soft);border-radius:50%;transition:transform .4s cubic-bezier(.22,1,.36,1),background .3s ease,border-color .3s ease}
.fx-x::before,.fx-x::after{content:"";position:absolute;left:50%;top:50%;background:var(--ink);transition:background .3s ease}
.fx-x::before{width:12px;height:1.5px;transform:translate(-50%,-50%)}
.fx-x::after{width:1.5px;height:12px;transform:translate(-50%,-50%)}
.fx-item.open .fx-x{transform:rotate(45deg);background:var(--cobalt);border-color:var(--cobalt)}
.fx-item.open .fx-x::before,.fx-item.open .fx-x::after{background:#fff}
.fx-body{overflow:hidden;max-height:0;transition:max-height .55s cubic-bezier(.22,1,.36,1)}
.fx-body p{margin:0 0 clamp(22px,2.4vw,30px) 92px;max-width:62ch}
.fx-item.open .fx-t{color:var(--cobalt)}
@media(max-width:860px){
.fx-head{grid-template-columns:46px 1fr 30px;gap:14px}
.fx-tag{display:none}
.fx-x{width:30px;height:30px}
.fx-body p{margin-left:0}
}
@media (prefers-reduced-motion:reduce){
.progress{display:none}
.fx-body{transition:none}
.fx-head:hover .fx-t{transform:none}
}
@media print{.anim{opacity:1 !important;transform:none !important;filter:none !important;animation:none !important}}
