/* ---------- premium header (3-column, centered mark, transparent over hero) ---------- */
html .nav{position:fixed;top:0;left:0;right:0;z-index:50;padding-top:env(safe-area-inset-top,0px);background:transparent;border-bottom:1px solid transparent;
  -webkit-backdrop-filter:none;backdrop-filter:none;transition:background .5s,border-color .5s,-webkit-backdrop-filter .5s,backdrop-filter .5s}
html.scrolled .nav,html.nohero .nav,html.menu-open .nav{background:color-mix(in srgb,var(--bg) 74%,transparent);-webkit-backdrop-filter:saturate(160%) blur(22px);backdrop-filter:saturate(160%) blur(22px);border-bottom-color:color-mix(in srgb,var(--fg) 9%,transparent)}
html.ontop:not(.menu-open) .nav{--fg:#f5f5f7;--muted:rgba(245,245,247,.62);color:#f5f5f7}
body::before{display:none}
.nwrap{max-width:1440px;margin:0 auto;padding:0 clamp(18px,3.2vw,44px);height:72px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;transition:height .45s var(--ease)}
html.scrolled .nwrap,html.nohero .nwrap{height:58px}
.nav .nl{display:flex;gap:clamp(18px,2.4vw,34px);justify-self:start;margin:0;font-size:11px}
.nav .nl a,.nav .nj,.nav .nc,.nav .clock{font-size:11px;letter-spacing:.16em;text-transform:uppercase;font-weight:500;line-height:1}
.nav .nl a,.nav .nj{position:relative;opacity:.74;transition:opacity .3s}
.nav .nl a::after,.nav .nj::after{content:"";position:absolute;left:0;right:0;bottom:-7px;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .45s var(--ease)}
.nav .nl a:hover,.nav .nj:hover,.nav [aria-current]{opacity:1}
.nav .nl a:hover::after,.nav .nj:hover::after,.nav [aria-current]::after{transform:scaleX(1)}
.nav .brand{justify-self:center;display:flex;color:var(--fg)}
.nav .brand svg{width:46px;height:auto;color:var(--fg);transition:width .45s var(--ease)}
html.scrolled .nav .brand svg{width:40px}
.nav .nr{justify-self:end;display:flex;align-items:center;gap:clamp(12px,1.6vw,22px)}
.nav .clock{color:var(--muted);letter-spacing:.1em;font-variant-numeric:tabular-nums}
.nav .acct{margin:0;width:34px;height:34px}
.nav .acct:hover,.theme-t:hover{background:color-mix(in srgb,var(--fg) 10%,transparent)}
.theme-t{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;opacity:.85;transition:opacity .2s,background .2s,transform .5s var(--ease)}
.theme-t:hover{opacity:1}.theme-t:active{transform:rotate(40deg)}
.theme-t svg{width:18px;height:18px}
.theme-t .i-moon{display:none}
[data-theme="light"] .theme-t .i-sun{display:none}[data-theme="light"] .theme-t .i-moon{display:block}
.nav .pill.nc{background:transparent;color:var(--fg);border:1px solid color-mix(in srgb,var(--fg) 38%,transparent);padding:10px 18px;border-radius:999px;transition:background .3s,color .3s,border-color .3s}
.nav .pill.nc:hover{background:var(--fg);color:var(--bg);border-color:var(--fg);transform:none}
html.ontop .nav .pill.nc:hover{color:#000}
.nav .menu-btn{display:none;justify-self:start;grid-column:1;grid-row:1;margin:0 0 0 -10px}
html.nohero body{padding-top:58px}
.sheet{padding-top:calc(72px + env(safe-area-inset-top,0px) + 24px)}
@media (max-width:1100px){.nav .nl{gap:20px}}
@media (max-width:960px){
  .nav .nl,.nav .nj,.nav .nc{display:none}
  .nav .menu-btn{display:inline-flex}
  .nwrap{height:62px}
  .nav .brand svg{width:40px}
  .nav .nr{gap:6px}
}
/* ---------- light theme ---------- */
html[data-theme="light"]{--bg:#f3efe8;--tile:#fffdf9;--tile-2:#ebe5dc;--line:#ddd5c9;--fg:#16130f;--muted:#6f685e;--pill:#16130f;--on-pill:#f3efe8;color-scheme:light;background:#f3efe8}
html[data-theme="light"] .hero{--fg:#f5f5f7;--muted:#b8b8bd;--pill:#f5f5f7;--on-pill:#000;color:#f5f5f7}
html[data-theme="light"] .doc p,html[data-theme="light"] .doc li{color:#3d3832}
html[data-theme="light"] .sheet{background:rgba(243,239,232,.96)}
html[data-theme="light"] .tile,html[data-theme="light"] .offer,html[data-theme="light"] .num,html[data-theme="light"] .step{box-shadow:0 1px 0 rgba(0,0,0,.03),0 20px 40px -24px rgba(60,40,20,.18)}
html.theme-anim body,html.theme-anim body *{transition:background-color .5s ease,color .5s ease,border-color .5s ease!important}
.lang-t{display:flex;align-items:center;gap:7px;font-size:11px;letter-spacing:.14em;font-weight:500}
.lang-t button{opacity:.5;padding:6px 1px;transition:opacity .2s;letter-spacing:inherit;font-size:inherit}
.lang-t button:hover,.lang-t button[aria-current]{opacity:1}
.lang-t i{width:1px;height:10px;background:currentColor;opacity:.3}
.lang-t button{opacity:.8;width:34px;height:34px;border-radius:50%;padding:0}.lang-t button:hover{opacity:1;background:color-mix(in srgb,var(--fg) 10%,transparent)}
