/* Motion is progressive enhancement: content is readable without JavaScript. */
:root{--motion-ease:cubic-bezier(.16,1,.3,1)}
.header{height:100px}
.header-end{gap:var(--space-2)}
.motion-toggle{display:flex;align-items:center;justify-content:center;gap:var(--space-2);min-height:44px;padding:var(--space-2) var(--space-3);border:1px solid var(--color-border);background:transparent;color:var(--color-text);font-size:var(--text-xs);border-radius:var(--radius-full);transition:background var(--ease);white-space:nowrap}
.motion-toggle:hover{background:var(--color-surface)}
.motion-toggle[aria-pressed=true]{background:var(--color-surface)}
.motion-icon{font-size:var(--text-sm);width:16px}
.theme-toggle{width:auto;min-width:64px;display:flex;align-items:center;gap:var(--space-2);padding-inline:var(--space-2)}
.theme-symbol{font-family:Arial,sans-serif;font-size:1.25rem}
.theme-label{font-size:var(--text-xs)}
.hero{grid-template-columns:1.12fr 1fr;gap:var(--space-10);padding-block:var(--space-16) var(--space-20);perspective:1500px}
h1{font-size:clamp(3.6rem,6vw + .3rem,6rem);line-height:1.03;position:relative;z-index:2}
.headline-line{display:block;overflow:hidden;padding-bottom:.12em;margin-bottom:-.12em}
.headline-line>span{display:block;animation:headline-enter 1.25s var(--motion-ease) both}
.headline-line:nth-child(2)>span{animation-delay:.15s}
.headline-accent{color:var(--color-primary);font-style:italic}
.hero-copy .eyebrow{animation:hero-fade .9s ease both}
.hero-description,.hero-copy .button,.hero-note{animation:hero-fade 1.15s ease .35s both}
.hero-description{max-width:390px;margin-top:var(--space-8)}
.hero-art{height:590px;overflow:visible;transform:perspective(1100px) rotateX(var(--tilt-y,0deg)) rotateY(var(--tilt-x,0deg));transition:transform 650ms var(--motion-ease);border-radius:var(--radius-md);isolation:isolate}
.hero-art>img{border-radius:var(--radius-md);animation:photo-enter 1.5s var(--motion-ease) both}
.hero-art figcaption{font-size:var(--text-xs);letter-spacing:.04em;z-index:1;width:fit-content;max-width:calc(100% - 48px);padding:var(--space-1) var(--space-2);background:oklch(98.5% .009 100 / .92);color:oklch(25% .026 126);border-radius:var(--radius-sm)}
.hero-art figcaption span:last-child{display:none}
.hero-art::after{content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;box-shadow:inset 0 0 0 1px oklch(100% 0 0 / .16)}
.perspective-card{position:absolute;bottom:var(--space-6);left:calc(-1 * var(--space-8));width:310px;background:oklch(98.5% .009 100 / .96);color:oklch(25% .026 126);padding:var(--space-5) var(--space-6);border:1px solid oklch(98% .01 100 / .7);border-radius:var(--radius-md);backdrop-filter:blur(18px);box-shadow:0 12px 48px oklch(25% .026 126 / .14);transform:translateZ(24px);animation:card-enter 1.3s var(--motion-ease) .55s both}
.perspective-heading{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);padding-bottom:var(--space-3);font-size:var(--text-xs);letter-spacing:.09em}
.card-orbit{font-size:1.7rem;line-height:1;color:oklch(38% .064 122);animation:orbit 20s linear infinite}
.discovery-path{display:grid;gap:var(--space-1)}
.path-step{display:grid;grid-template-columns:24px 1fr 20px;gap:var(--space-2);align-items:center;font-size:var(--text-sm);padding:var(--space-2) 0;position:relative}
.path-step::after{content:"";position:absolute;inset:auto 0 0;height:1px;background:oklch(38% .064 122 / .5);transform:scaleX(0);transform-origin:left;animation:path-trace 7.2s var(--motion-ease) infinite}
.path-number{font-size:var(--text-xs);color:oklch(48% .03 115)}
.path-check{color:oklch(38% .064 122);opacity:.3;animation:path-arrow 7.2s ease infinite}
.path-step:nth-child(2)::after,.path-step:nth-child(2) .path-check{animation-delay:2.4s}
.path-step:nth-child(3)::after,.path-step:nth-child(3) .path-check{animation-delay:4.8s}
.perspective-strip{overflow:hidden;background:var(--color-surface);border-block:1px solid var(--color-border);padding-block:var(--space-6)}
.strip-track{display:flex;width:max-content;animation:marquee 42s linear infinite}
.strip-group{display:flex;align-items:center;gap:var(--space-12);padding-right:var(--space-12);flex-shrink:0}
.strip-group>span:not(.strip-star){white-space:nowrap;font-family:var(--font-display);font-size:clamp(1.5rem,2vw,2rem);line-height:1.1;color:var(--color-text)}
.strip-star{font-size:var(--text-lg);color:var(--color-primary)}
.section-space{padding-block:clamp(var(--space-16),9vw,var(--space-32))}
.section-heading h2,.situations-heading h2,.approach-intro h2,.faq h2{font-size:clamp(2.25rem,3.6vw,3.4rem)}
.vision{grid-template-columns:1.05fr 1fr}
.scenario-panel{transition:box-shadow .5s var(--motion-ease),border-color .5s ease}
.scenario-panel:hover{box-shadow:0 16px 44px oklch(25% .026 126 / .08);border-color:var(--color-primary)}
.scenario-question.panel-changing{animation:panel-change .45s var(--motion-ease)}
.scenario-tab{position:relative;padding-inline:var(--space-3);transition:background .3s ease,color .3s ease}
.scenario-tab[aria-selected=true]{background:var(--color-paper)}
.tab-number{opacity:1}
.scenario-tabs[hidden]+.scenario-panel{grid-column:1/-1;max-width:620px}
.scenario-tab:hover .tab-arrow{transform:translate(2px,-2px)}
.panel-star{transition:transform .8s var(--motion-ease)}
.scenario-panel:hover .panel-star{transform:rotate(90deg)}
.step{position:relative}
.step::after{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:var(--color-primary);transform:scaleX(0);transform-origin:left;transition:transform 1.2s var(--motion-ease)}
.step.in-view::after{transform:scaleX(1)}
.step:first-child::after{display:none}
.step-number{transition:color .4s ease}
.step.in-view .step-number{color:var(--color-primary)}
.statement{padding:var(--space-12) var(--space-16) var(--space-16);position:relative;overflow:hidden}
.statement-index{font-size:var(--text-xs);letter-spacing:.07em;color:oklch(83% .025 105)}
.statement h2{font-size:clamp(2.5rem,5.4vw,5.5rem);line-height:1.1;margin-top:var(--space-16)}
.statement h2 .serif-italic{display:inline-block}
.statement-bottom{margin-top:var(--space-10)}
.statement .light-button{border-radius:var(--radius-full)}
.button{border-radius:var(--radius-full);gap:var(--space-8);min-height:56px;position:relative;isolation:isolate;overflow:hidden;transition:background .3s ease,box-shadow .3s ease,transform .3s var(--motion-ease)}
.button:hover{filter:none;box-shadow:0 6px 20px oklch(25% .026 126 / .12);transform:translateY(-2px)}
.button:active{transform:translateY(0) scale(.98)}
.button span{width:26px;height:26px;display:grid;place-items:center;border-radius:50%;border:1px solid currentColor;opacity:.8;font-size:var(--text-base);transition:transform .35s var(--motion-ease)}
.button:hover span{transform:rotate(45deg)}
nav a{position:relative}
nav a::after{content:"";position:absolute;left:0;right:0;bottom:5px;height:1px;background:var(--color-primary);transform:scaleX(0);transform-origin:right;transition:transform .35s var(--motion-ease)}
nav a:hover::after,nav a:focus-visible::after{transform:scaleX(1);transform-origin:left}
.footer{padding-top:0}
.footer-wordmark{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--space-8);padding-block:var(--space-8) var(--space-12);border-bottom:1px solid var(--color-border);margin-bottom:var(--space-12)}
.footer-wordmark>span:first-child{font-family:var(--font-body);font-weight:700;font-size:clamp(8rem,21vw,19rem);letter-spacing:-.095em;line-height:1;color:var(--color-primary)}
.wordmark-note{font-size:var(--text-xs);letter-spacing:.07em;margin-bottom:var(--space-6);margin-left:auto;color:var(--color-muted)}
.wordmark-arrow{font-size:clamp(4rem,9vw,8rem);font-family:var(--font-display);line-height:1.3;color:var(--color-primary);pointer-events:none}
.reveal{opacity:1}
[data-motion=on] .reveal.reveal-enter{animation:content-reveal .9s var(--motion-ease)}
[data-motion=off] .hero-art{transform:none}
[data-motion=off] .headline-line>span,[data-motion=off] .hero-copy .eyebrow,[data-motion=off] .hero-description,[data-motion=off] .hero-copy .button,[data-motion=off] .hero-note,[data-motion=off] .hero-art>img,[data-motion=off] .perspective-card{opacity:1;clip-path:none;transform:none}
.intro-complete .headline-line>span,.intro-complete .hero-copy .eyebrow,.intro-complete .hero-description,.intro-complete .hero-copy .button,.intro-complete .hero-note,.intro-complete .hero-art>img,.intro-complete .perspective-card{animation:none;opacity:1;clip-path:none}
[data-motion=off] .strip-track{width:100%;transform:none}
[data-motion=off] .strip-group{width:100%;flex-wrap:wrap;justify-content:center;gap:var(--space-4) var(--space-8);padding-inline:var(--space-6)}
[data-motion=off] .strip-group+ .strip-group,[data-motion=off] .strip-star{display:none}
[data-motion=off] .strip-group>span{white-space:normal;text-align:center;font-size:var(--text-lg)}
[data-motion=off] .path-check{opacity:.75}
[data-motion=off] .path-step::after{transform:scaleX(1);opacity:.2}
[data-motion=off] .step::after{transform:scaleX(1)}
[data-motion=off] .button:hover,[data-motion=off] .button:hover span,[data-motion=off] .scenario-tab:hover .tab-arrow,[data-motion=off] .scenario-panel:hover .panel-star{transform:none}
.page-inactive *, .page-inactive *::before,.page-inactive *::after{animation-play-state:paused!important}
.hero-art.image-unavailable{background:var(--color-surface)}
.hero-art.image-unavailable figcaption{color:oklch(25% .026 126)}
@keyframes headline-enter{from{transform:translateY(110%);opacity:0}to{transform:translateY(0);opacity:1}}
@keyframes hero-fade{from{opacity:0}to{opacity:1}}
@keyframes photo-enter{from{clip-path:inset(0 0 100% 0)}to{clip-path:inset(0)}}
@keyframes card-enter{from{opacity:0;transform:translateY(16px) rotate(2deg)}to{opacity:1;transform:translateY(0) rotate(0deg)}}
@keyframes orbit{to{transform:rotate(360deg)}}
@keyframes path-trace{0%{transform:scaleX(0);opacity:.5}28%,43%{transform:scaleX(1);opacity:1}62%,100%{transform:scaleX(1);opacity:0}}
@keyframes path-arrow{0%,65%,100%{opacity:.3}25%,45%{opacity:1}}
@keyframes marquee{to{transform:translateX(-50%)}}
@keyframes panel-change{from{opacity:.15;filter:blur(3px)}to{opacity:1;filter:blur(0)}}
@keyframes content-reveal{from{opacity:.35}to{opacity:1}}
@media(min-width:1500px){.hero-art{height:630px}}
@media(max-width:1050px){h1{font-size:clamp(3.6rem,6.4vw,5.25rem)}.hero{gap:var(--space-6)}.hero-art{height:550px}.perspective-card{left:calc(-1 * var(--space-4));width:280px}.statement{padding-inline:var(--space-10)}.header{gap:var(--space-4)}nav{gap:var(--space-5)}}
@media(max-width:760px){
  .header{height:auto;min-height:88px;flex-wrap:wrap;row-gap:var(--space-2);padding-block:var(--space-4) var(--space-2)}.header-end{gap:var(--space-1)}.motion-toggle{padding:var(--space-2);min-width:96px}.motion-label{display:inline}.motion-icon{width:12px}.theme-toggle{min-width:58px;gap:var(--space-1)}.header nav{display:flex;order:3;width:100%;justify-content:space-between;gap:var(--space-4)}.hero{grid-template-columns:1fr;gap:var(--space-12);padding-block:var(--space-10) var(--space-12)}h1{font-size:clamp(3.6rem,10.8vw,5.5rem)}.hero-art{height:460px;margin-bottom:var(--space-8)}.hero-art>img{object-position:50% 50%}.perspective-card{left:auto;right:var(--space-4);bottom:calc(-1 * var(--space-8));width:min(280px,calc(100% - 32px));padding:var(--space-4) var(--space-5)}
  .perspective-strip{padding-block:var(--space-5)}.strip-group{gap:var(--space-8);padding-right:var(--space-8)}.strip-group>span:not(.strip-star){font-size:1.6rem}.vision{grid-template-columns:1fr}.section-heading h2,.situations-heading h2,.approach-intro h2,.faq h2{font-size:clamp(2.25rem,8vw,3rem)}.statement{padding:var(--space-8) var(--space-6) var(--space-10)}.statement-index{display:none}.statement-top .eyebrow{max-width:none}.statement h2{font-size:clamp(2.5rem,9vw,3.25rem);margin-top:var(--space-10)}.statement-bottom{margin-top:var(--space-6)}.footer-wordmark{gap:var(--space-4);padding-block:var(--space-6) var(--space-8);margin-bottom:var(--space-8)}.footer-wordmark>span:first-child{font-size:clamp(7rem,34vw,12rem)}.wordmark-note{display:none}.wordmark-arrow{font-size:5rem}
}