/* Cores ligadas à posição da rolagem, sem atraso de transições CSS. */
:root{--contrast-halo:transparent;--light-progress:0;--script-ink:#fedd90}
.name-equation span:last-child,.hero-brand .period{color:var(--script-ink);text-shadow:0 0 1px var(--script-halo,transparent),1px 0 1px var(--script-halo,transparent),-1px 0 1px var(--script-halo,transparent),0 1px 1px var(--script-halo,transparent),0 -1px 1px var(--script-halo,transparent)}
.steps .active-step .step-count{background:none;color:var(--page-fg)}
.header,.header.scrolled,.header nav a,.section .split p,.section-intro p,.steps p,.faq-list details p{transition:none}
.header nav a,.menu-toggle,.hero-meta,.hero-first,.hero-second,.hero-brand,.hero-lead,.section h2,.section h3,.section p,.section .eyebrow,.scene-hint,.name-equation,.name-equation b,.footer,.button.secondary{color:var(--page-fg);text-shadow:0 0 1px var(--contrast-halo),1px 0 1px var(--contrast-halo),-1px 0 1px var(--contrast-halo),0 1px 1px var(--contrast-halo),0 -1px 1px var(--contrast-halo)}
.section .split p,.section-intro p,.steps p,.faq-list details p{color:var(--page-muted)}
.header .wordmark,.footer .wordmark{position:relative}
.header .wordmark img,.footer .wordmark img{opacity:0;filter:none}
.header .wordmark::after,.footer .wordmark::after{content:'';position:absolute;inset:0;background:var(--page-fg);mask:url('assets/logo-horizontal.png') center/contain no-repeat;-webkit-mask:url('assets/logo-horizontal.png') center/contain no-repeat;filter:drop-shadow(0 0 1px var(--contrast-halo))}
.name-logo{display:block;position:relative;z-index:2}.name-logo img{opacity:0;filter:none}
.name-logo::after{content:'';position:absolute;inset:0;background:var(--page-fg);mask:url('assets/logo-horizontal.png') center/contain no-repeat;-webkit-mask:url('assets/logo-horizontal.png') center/contain no-repeat;filter:drop-shadow(0 0 1px var(--contrast-halo))}
.hero-scribble{opacity:1;bottom:1px;z-index:1;overflow:visible}
.name-scroll,.opening-scroll{--scene-height:clamp(400px,58svh,550px);min-height:calc(var(--scene-height) + 28svh)}
.name-stage,.opening .name-stage{height:var(--scene-height);padding:20px 0 12px}
.name-composition{min-height:185px;flex:1}
.name-block{margin-top:46px}.name-copy{margin-top:16px}
.opening+.point{padding-top:45px}
.point,.way{isolation:isolate;overflow:hidden}
.light-handwriting{position:absolute;pointer-events:none;user-select:none;white-space:nowrap;z-index:-1;font:400 clamp(150px,24vw,340px)/1 'Fair Prosper';color:#7524aa;opacity:calc(.065 * var(--light-progress));transform:rotate(-15deg);right:-4%;bottom:30px}
.way>.light-handwriting{top:45%;bottom:auto;right:-8%;transform:rotate(-24deg);color:#986b25;opacity:calc(.085 * var(--light-progress))}
.diagnostic h2,.diagnostic p,.diagnostic h3,.diagnostic .eyebrow{text-shadow:none}
.diagnostic h2,.diagnostic p,.diagnostic h3{color:#fcebd9}.diagnostic .eyebrow{color:#fedd90}
@media(max-width:720px){
  .name-scroll,.opening-scroll{--scene-height:clamp(315px,47svh,390px);min-height:calc(var(--scene-height) + 22svh)}
  .name-stage,.opening .name-stage{padding:16px 0 10px;top:78px}
  .name-stage>h2,.opening .name-stage h2{font-size:clamp(30px,9vw,40px)}
  .name-composition{min-height:175px}
  .name-equation{padding:8px 0;font-size:10.6vw;gap:3px}
  .name-stage .eyebrow{margin-bottom:12px}.name-stage .scene-hint{min-height:20px}
  .name-block{margin-top:36px}.name-copy{margin-top:14px}
  .opening+.point{padding-top:35px}
  .light-handwriting{font-size:50vw;right:-18%;bottom:18px}
  .way>.light-handwriting{right:-20%;top:51%;font-size:55vw}
}
@media(prefers-reduced-motion:reduce){
  .name-scroll,.opening-scroll{min-height:0}.name-stage,.opening .name-stage{height:auto;top:auto;padding:28px 0}
  .hero-scribble path{stroke-dashoffset:0!important}
}