/* ---------- fixes (v2.1): load glitches, header, glows, mobile ---------- */

/* 0. fonts load without blocking first paint; Arial has the same widths as Hanken Grotesk, so nothing reflows on swap */
:root{--f-b:"Hanken Grotesk",Arial,Helvetica,sans-serif}

/* 1. characters, speech and leader lines appear together once the 3D stage is ready (no pop-in / size jump) */
.js .flat{opacity:0;transition:opacity .6s}
.js.flatmode .flat,.js.gl-late .flat{opacity:1}
.js:not(.gl-on):not(.flatmode):not(.gl-late) .voice.show{opacity:0}
.js .leaders{transition:opacity .6s}
.js:not(.gl-on):not(.flatmode):not(.gl-late) .leaders{opacity:0}

/* 2. header: no page text ghosting through it */
.top.scrolled{background:rgba(238,232,221,.985);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}

/* 3. background glows: smooth radial falloff instead of blurred discs */
.mo-blobs i{filter:none}
.mo-blobs i:nth-child(1){background:radial-gradient(closest-side,rgba(232,87,58,.85),rgba(232,87,58,0))}
.mo-blobs i:nth-child(2){background:radial-gradient(closest-side,rgba(156,179,150,.95),rgba(156,179,150,0))}
.mo-blobs i:nth-child(3){background:radial-gradient(closest-side,rgba(242,201,168,.95),rgba(242,201,168,0))}
@media (prefers-reduced-motion:reduce){.mo-blobs i{filter:none}}

/* 4. buttons: drop the extra wobble that fought the hover lift */
@media (hover:hover){.js:not(.rm) .btn:hover{animation:none}}

/* 5. phones */
@media (max-width:899px){
  .pl-name{font-size:11.2vw;white-space:nowrap}
  .in-hero #v-ai .v-line{min-height:2.45em}
}