@import url('https://fonts.googleapis.com/css2?family=Doto:wght@400..900&family=IBM+Plex+Mono:wght@400;500;600&display=swap');
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;background:var(--bg);scroll-padding-top:78px}
body{font-family:var(--font-mono);background:var(--bg);color:var(--ink2);line-height:1.7;
 transition:background-color .5s ease,color .5s ease;overflow-x:hidden;min-height:100vh}
a{color:inherit;text-decoration:none}
.dotbg{position:fixed;inset:0;z-index:0;opacity:.5;pointer-events:none;transition:.5s;
 background-image:radial-gradient(circle,var(--dotc) 1px,transparent 1.4px);background-size:18px 18px}
.wrap{max-width:var(--maxw);margin:0 auto;position:relative;z-index:1}
.container{max-width:820px;margin:0 auto;padding:0 22px;position:relative;z-index:1}
h1,h2,h3{font-family:var(--font-display);color:var(--ink);font-weight:800;line-height:1.12;letter-spacing:.03em}
h1{font-size:clamp(34px,6vw,54px)}
h2{font-size:clamp(24px,4vw,32px)}
h3{font-size:19px}
p{font-size:14px;margin:10px 0}
p b,li b{color:var(--ink);font-weight:600}
.eyebrow{font-size:11px;letter-spacing:4px;text-transform:uppercase;color:var(--gray)}
.lead{font-size:16px;color:var(--ink2)}
.hook{font-family:var(--font-display);font-weight:700;font-size:clamp(24px,5vw,44px);line-height:1.14;color:var(--ink)}
.hook b{font-weight:600}
.section{padding:70px 0;border-top:1px solid var(--line)}
.center{text-align:center}
ul.dots{list-style:none;margin:10px 0}
ul.dots li{position:relative;padding:6px 0 6px 20px;font-size:14px}
ul.dots li:before{content:"";position:absolute;left:2px;top:14px;width:6px;height:6px;border-radius:50%;background:var(--accent)}
@media(prefers-reduced-motion:reduce){*{animation:none!important}}

/* digital glow: letters light up sequentially as their section reaches mid-screen.
   Each letter carries its own hue (--h): a spectrum sweep across the heading. */
i.gl{font-style:normal;transition:color .3s ease,text-shadow .3s ease}
i.gl.g1{color:hsl(var(--h) 75% 72%);text-shadow:0 0 6px hsl(var(--h) 90% 60% / .35)}
i.gl.g2{color:hsl(var(--h) 85% 66%);text-shadow:0 0 10px hsl(var(--h) 92% 60% / .6),0 0 22px hsl(var(--h) 92% 60% / .28)}
i.gl.g3{color:hsl(var(--h) 95% 62%);text-shadow:0 0 12px hsl(var(--h) 95% 60% / .9),0 0 30px hsl(var(--h) 95% 60% / .45),0 0 54px hsl(var(--h) 95% 60% / .2)}