/* Existing brand tokens only. Static HTML remains readable without JavaScript. */
html.lenis, html.lenis body { height:auto; }
html.lenis { scroll-behavior:auto; }
.lenis:not(.lenis-autoToggle).lenis-stopped { overflow:clip; }
.lenis [data-lenis-prevent] { overscroll-behavior:contain; }
/* Neutralize covers from an older cached document while it updates. */
.page-transition { display:none!important; }
.js-motion [data-reveal="lines"]:not([data-motion-ready]) { visibility:hidden; }
.motion-line-mask { overflow:clip; padding-block:.1em; margin-block:-.1em; }
[data-reveal="lines"] > a { display:block; }
.motion-label { display:grid; min-width:0; position:relative; line-height:1.5; padding-inline:.08em; margin-inline:-.08em; }
.motion-label-copy { grid-area:1 / 1; min-width:0; white-space:normal; }
.motion-letter-mask { vertical-align:bottom; }
.motion-underline { position:absolute; bottom:0; left:0; right:0; height:1px; background:currentColor; transform-origin:left; }
.button[data-hover="letters"]:hover { transform:none; }
[data-shape-section] { position:relative; }
.motion-shape { position:absolute; pointer-events:none; z-index:-1; background:var(--soft); opacity:.12; contain:layout paint; }
.motion-shape--vertical { width:clamp(8px,1.2vw,18px); height:2rem; right:0; top:0; }
.motion-shape--square { width:clamp(30px,5vw,70px); height:clamp(30px,5vw,70px); left:0; bottom:0; }
.motion-shape--notch { width:4%; height:12%; right:0; bottom:0; background:var(--paper); opacity:1; z-index:1; }
.motion-media { position:relative; align-self:start; }
.motion-media .founder-portrait { display:block; width:100%; }
[data-marquee] { position:relative; display:block; overflow:clip; }
.motion-marquee-track { display:flex; width:max-content; }
.motion-marquee-group { display:flex; align-items:center; flex:none; gap:clamp(2rem,5vw,5rem); padding-right:clamp(2rem,5vw,5rem); min-width:0; }
.motion-marquee-group p { white-space:nowrap; flex:none; }
[data-marquee-pause] { display:block; margin:.6rem 0 0 auto; border:0; border-bottom:1px solid var(--rule); padding:.25rem 0; background:transparent; color:var(--soft); font:inherit; font-size:.75rem; cursor:pointer; }
[data-marquee-pause]:focus-visible { outline:2px solid var(--brown); outline-offset:4px; }
html:not(.js-motion) .motion-marquee-track { width:auto; }
html:not(.js-motion) .motion-marquee-group { flex-wrap:wrap; min-width:0; padding:0; }
html:not(.js-motion) [data-marquee-pause] { visibility:hidden; }
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto!important; }
  .page-transition { display:none!important; }
  [data-reveal] { visibility:visible!important; opacity:1!important; transform:none!important; }
  .motion-shape { transition:none!important; animation:none!important; }
  [data-hover="letters"] { transition:color .1s,background-color .1s; }
  .motion-marquee-track { transform:none!important; width:auto; }
  .motion-marquee-group { flex-wrap:wrap; min-width:0; padding:0; }
  .motion-marquee-group[aria-hidden="true"] { display:none; }
  [data-marquee-pause] { visibility:hidden; }
}

.button[data-hover="letters"] { line-height:1.5; }

/* Flex prevents adjacent mask margins from collapsing and changing heading height. */
[data-reveal="lines"]:has(> .motion-line-mask), [data-reveal="lines"] > a:has(> .motion-line-mask) { display:flex; flex-direction:column; }

/* Keep the paper and header still; only the page content changes.
   This starts in CSS on first paint, including browsers without cross-document
   snapshots. The early pagereveal hook switches it off when a native transition
   exists, so the live page and its snapshot never animate twice. */
html { background:var(--paper); }
.site > main {
  view-transition-name:page-content;
  animation:optimind-content-arrive 560ms cubic-bezier(.25,.1,.25,1) backwards;
}
html.native-page-transition .site > main,
html.page-settled .site > main { animation:none; }
@view-transition { navigation:auto; }
::view-transition { pointer-events:none; }
::view-transition-group(root),
::view-transition-group(page-content) { animation:none; }
::view-transition-old(root) { display:none; }
::view-transition-new(root) { animation:none; mix-blend-mode:normal; }
::view-transition-image-pair(page-content) { isolation:isolate; }
::view-transition-old(page-content) {
  animation:optimind-content-depart 160ms ease-in-out both;
  mix-blend-mode:normal;
}
::view-transition-new(page-content) {
  animation:optimind-content-arrive 480ms cubic-bezier(.25,.1,.25,1) 80ms both;
  mix-blend-mode:normal;
}
@keyframes optimind-content-depart {
  from { opacity:1; transform:translateY(0); }
  to { opacity:0; transform:translateY(-6px); }
}
@keyframes optimind-content-arrive {
  from { opacity:0; transform:translateY(12px); }
  to { opacity:1; transform:translateY(0); }
}
@media (prefers-reduced-motion:reduce) {
  @view-transition { navigation:none; }
  .site > main { animation:none; }
  ::view-transition-group(*), ::view-transition-old(*), ::view-transition-new(*) { animation:none!important; }
}