/* TPO Search - homepage entrance only. */
/* ============ TPO splash entrance (FRM-style: white -> hit p, black -> land, white -> lift away) ============ */
html{scrollbar-gutter:stable}
.splash{display:none}
html.has-splash .splash{display:flex}
html.splash-lock{overflow:hidden;background:#fff}   /* root matches the splash so the reserved scrollbar gutter never shows */
html.splash-lock.splash-dark{background:var(--night)}
.splash{position:fixed;inset:0;z-index:200;align-items:center;justify-content:center}
/* each impact inverts the screen: white / black letters  <->  black / white letters; the dot is always yellow */
.splash__bg{position:absolute;inset:0;background:#fff}
.splash.is-dark .splash__bg{background:var(--night)}
.splash__stage{color:var(--ink)}
.splash.is-dark .splash__stage{color:#fff}
.splash .dotpath{fill:var(--accent)}   /* the full stop stays brand yellow in both states, like FRM's red square */
.splash__stage{position:relative;width:clamp(180px,22vw,300px);transform-origin:0 0;will-change:transform}
.splash__stage svg{display:block;width:100%;height:auto;overflow:visible}
.dotpath{opacity:0;transform-box:fill-box;transform-origin:50% 100%}
/* while the intro runs: the nav logo waits for the flying one. The hero copy is already drawn behind the curtain
   (so the page counts as loaded straight away for Google's speed score) and only slides up as the curtain lifts. */
html.has-splash .nav .brand .logo{visibility:hidden}
html.splash-lock .hero__lead.reveal{opacity:1;transform:translateY(20px)}
@media (prefers-reduced-motion:reduce){
  html.has-splash .splash{display:none}
  html.splash-lock{overflow:visible}
  html.has-splash .nav .brand .logo{visibility:visible}
}