/* ============================================================
   base.css — reset, typography, layout primitives, utilities
   ============================================================ */
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  background:var(--bg);
  color:var(--text);
  font-family:var(--fb);
  line-height:1.62;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
  transition:background .5s var(--ease),color .5s var(--ease);
}
img,svg{display:block;max-width:100%}
a{color:inherit}
::selection{background:var(--accent);color:var(--ink)}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:4px}
.mono{font-family:var(--fm)}

/* layout shell */
.wrap{position:relative;z-index:2;max-width:var(--maxw);margin:0 auto;padding:0 var(--sx)}
section{padding:var(--sy) 0;border-bottom:1px solid var(--border);position:relative}

/* section header */
.shead{display:flex;align-items:baseline;gap:14px;margin-bottom:16px}
.snum{font-family:var(--fm);font-size:12.5px;color:var(--accent);font-weight:600;letter-spacing:.02em}
.kick{font-family:var(--fm);font-size:11.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.22em}

/* type scale — tightened modular rhythm (~1.25 ratio) */
h1{
  font-family:var(--fd);font-weight:700;letter-spacing:-.038em;
  font-size:clamp(32px,4.4vw,54px);line-height:1.05;margin-bottom:20px;
}
h2{
  font-family:var(--fd);font-weight:600;letter-spacing:-.028em;
  font-size:clamp(24px,3vw,37px);line-height:1.1;margin-bottom:16px;max-width:20ch;
}
h3{font-family:var(--fd);font-weight:600;font-size:17.5px;letter-spacing:-.01em;margin-bottom:9px}
.lead{color:var(--muted);font-size:clamp(15px,1.05vw,16.5px);line-height:1.6;max-width:60ch}

/* gradient sheen text */
.hl{
  background:var(--hl);background-size:220% auto;
  -webkit-background-clip:text;background-clip:text;color:transparent;
  animation:sheen 7s linear infinite;
}
@keyframes sheen{to{background-position:220% center}}

/* scroll-reveal */
.sr{
  opacity:0;transform:translateY(26px) scale(.985);filter:blur(6px);
  transition:opacity .8s var(--ease-out),transform .8s var(--ease-out),filter .8s var(--ease-out);
  will-change:opacity,transform;
}
.sr.in{opacity:1;transform:none;filter:none}
.d1{transition-delay:.05s}.d2{transition-delay:.13s}.d3{transition-delay:.22s}
.d4{transition-delay:.32s}.d5{transition-delay:.43s}.d6{transition-delay:.55s}

/* scroll progress bar */
.progress{position:fixed;top:0;left:0;height:2px;width:100%;z-index:60;transform-origin:0 50%;transform:scaleX(0);
  background:linear-gradient(90deg,var(--accent),var(--accent-2),var(--accent-3));box-shadow:0 0 14px var(--glow)}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .hl{animation:none}
  .sr{opacity:1!important;transform:none!important;filter:none!important;transition:none}
}
@media (max-width:560px){ h2{max-width:none} }
