/* Still typography. Motion only where it helps tell the story. */
body { padding-top:var(--header-height); }
html { scroll-padding-top:calc(var(--header-height) + 24px); }
.site-header { position:fixed; top:0; left:0; right:0; z-index:50; background:#f1efe8f5; backdrop-filter:blur(12px); }
.progress { top:calc(var(--header-height) - 1px); height:2px; z-index:51; }
.vision-sticky { top:var(--header-height); height:calc(100svh - var(--header-height)); }
.before-work { padding-inline:var(--pad); }
.before-work .case-sheet { width:min(950px,calc(100vw - 360px)); max-width:none; margin-inline:auto; }
.case-sheet-before .margin-note { left:-153px; width:130px; font-size:29px; }
.margin-note::after { display:none!important; }
.admin-mark path { stroke-width:1; opacity:.8; }
.case-sheet-before .row-context { color:#a5685c; }
.case-sheet-before .case-row-final .row-context { color:var(--muted); }
.case-board .fragment { --sticky:#efe3a9; background:linear-gradient(180deg,#00000009,transparent 33%),var(--sticky); border:0; padding:27px 22px 23px; min-height:174px; box-shadow:3px 8px 7px #0005; }
.case-board .fragment::after { display:none; }
.case-board .f1 { --sticky:#efe3a9; }.case-board .f2 { --sticky:#efccbc; }.case-board .f3 { --sticky:#b8d6af; }
.case-board .f4 { --sticky:#c3d4df; }.case-board .f5 { --sticky:#dfcfe5; }.case-board .f6 { --sticky:#e7d9b7; }
.case-board .fragment > span { font:500 12px/1.3 'Manrope',sans-serif; letter-spacing:0; text-transform:none; color:#495044; margin-bottom:14px; }
.case-board .fragment > strong { font:500 22px/1.2 'Manrope',sans-serif; letter-spacing:-.04em; color:#213128; }
.case-board .fragment > small { font:400 13px/1.45 'Manrope',sans-serif; color:#485043; margin-top:13px; }
.struck-word { transition:color .45s .25s ease; }
.is-rewritten .struck-word { color:#8fa38f; }
.struck-word::after { left:-6%; width:112%; height:7px; background:#f0eac8; }
.rewrite-copy h2 { gap:.3em; }
.replace-word { left:auto; right:-.16em; bottom:.9em; }
.insertion-mark { position:absolute; right:-.25em; bottom:.04em; width:.27em; height:.25em; overflow:visible; }
.insertion-mark path { fill:none; stroke:#fcf5d7; stroke-width:3; stroke-linecap:round; stroke-linejoin:round; }
.motion-ready .insertion-mark path { stroke-dasharray:1; stroke-dashoffset:1; }
.motion-ready .is-rewritten .insertion-mark path { animation:thread-connect .4s .55s ease forwards; }
.reveal, .reveal.in-view { opacity:1; transform:none; transition:none; }
.hero-reframe::after { animation-duration:.65s; }
.vision-brand,.vision-philosophy { transform:none!important; }
.header-actions { gap:20px; }
.sound-toggle { width:44px; height:44px; padding:11px; display:grid; place-items:center; }
.sound-toggle svg { width:21px; height:21px; }
.sound-muted { display:none; }
.sound-toggle[aria-pressed=false] .sound-muted { display:block; }
.sound-toggle[aria-pressed=false] .sound-waves { display:none; }
.contact-link { font-size:14px; text-underline-offset:5px; }
.contact-link:hover,.footer-contact:hover { text-decoration:underline; }
.footer-contact { color:inherit; font-size:13px; text-underline-offset:4px; }
a:focus-visible,button:focus-visible { outline:2px solid currentColor; outline-offset:5px; }
.primary-cta span { transition:transform .2s ease; }.primary-cta:hover span { transform:translate(2px,-2px); }
.form-trap { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
.access-form { position:relative; }
.access-form [type=submit]:disabled { cursor:wait; opacity:.65; }
.access-form[data-state=success] .input-row { border-color:#d3e5c4; }
.access-form[data-state=error] #formMessage { color:#ffe4bf; }
.access-form[data-state=success] #formMessage { color:#e0efd4; }
#formMessage { min-height:2.8em; font-size:14px; }
.motion-ready .case-sheet-after .typed-char { visibility:visible; }
.motion-ready .case-sheet-after .row-context .write-text { opacity:1; transition:color .65s ease; color:#949b88; }
.motion-ready .case-sheet-after .is-context-visible .row-context .write-text { color:var(--signal); }
.case-sheet-after .row-action .type-visual { text-decoration:none!important; }
.case-sheet-after .strike-action { width:fit-content; }
.case-sheet-after .strike-action::after { display:block; transform:scaleX(0); top:53%; }
.motion-ready .case-sheet-after .is-context-visible .strike-action::after { animation:quiet-strike .45s ease forwards; }
.motion-ready .board-thread { stroke-dasharray:1; stroke-dashoffset:1; }
.motion-ready .threads-connected .board-thread { animation:thread-connect .85s ease forwards; animation-delay:var(--thread-delay,0ms); }
.map-route-return { animation:none; }
.motion-ready .map-route:not(.map-route-return) { stroke-dasharray:1; stroke-dashoffset:1; }
.motion-ready .map-connected .map-route:not(.map-route-return) { animation:thread-connect .7s ease forwards; animation-delay:var(--route-delay,0ms); }
@keyframes thread-connect { to { stroke-dashoffset:0; } }
@keyframes quiet-strike { to { transform:scaleX(1); } }
@media(max-width:600px) {
  .header-actions { gap:10px; }.contact-link { font-size:12px; }.sound-toggle { width:32px; padding:5px; }
  .primary-cta { padding-inline:10px; gap:6px; }.site-header { padding-inline:16px; }
  .footer-contact { font-size:12px; }
  .case-sheet-after .strike-action::after { display:none; }
  .case-sheet-after .is-context-visible .strike-action .type-visual { text-decoration:line-through!important; text-decoration-thickness:1px!important; }
  .struck-word::after { height:4px; }.rewrite-copy h2 { font-size:12.3vw; }.replace-word { bottom:.88em; }
  .case-board .fragment { min-height:166px; padding:22px 16px 19px; }.case-board .fragment > strong { font-size:20px; }.case-board .fragment > small { font-size:12px; }
}
@media(max-width:900px) {
  .before-work .case-sheet { width:100%; }
  .case-sheet-before .margin-note { left:auto; width:260px; font-size:29px; }
  .case-board .fragment-center strong { font-size:38px; }
}
@media(max-width:600px) { .case-board .fragment-center strong { font-size:32px; } }
/* A natural document flow avoids trapping the long vision passage on phones. */
@media(max-width:600px), (max-height:600px) {
  .vision-story { height:auto; padding-block:70px; }
  .vision-sticky { position:relative; top:0; height:auto; min-height:0; display:block; }
  .vision-brand { position:relative; display:block; text-align:center; opacity:1!important; margin-bottom:55px; font-size:clamp(72px,20vw,160px); }
  .vision-philosophy { padding:0; opacity:1!important; }
  .input-row button { min-height:44px; }
}
@media(max-width:360px) { .header-actions { gap:6px; }.primary-cta span { display:none; }.wordmark { font-size:23px; } }
@media(prefers-reduced-motion:reduce) {
  .motion-ready .board-thread,.motion-ready .map-route:not(.map-route-return) { stroke-dashoffset:0; animation:none; }
  .motion-ready .case-sheet-after .row-context .write-text { color:var(--signal); }
  .motion-ready .insertion-mark path { stroke-dashoffset:0; animation:none; }
}