/* Visual-first refinement: compact moving artwork, a quieter opening, and editorial studies. */
:root { --paper: #fff; --surface: #f4f4f2; --ink: #151a1c; --muted: #62696b; --gutter: clamp(22px, 2.6vw, 48px); }
body { background: #fff; }
h1, h2, h3 { font-weight: 450; letter-spacing: -.035em; }
.wrap { max-width: 1780px; }
.site-header, .site-header.is-scrolled { background: #ffffffed; border: 0; box-shadow: none; }
.header-bar { min-height: 80px; justify-content: space-between; }
.brand-logo { width: 215px; }
.site-nav { flex: 0 1 auto; gap: 29px; font: 500 .86rem/1.4 var(--sans); letter-spacing: -.01em; text-transform: none; }
.site-nav .nav-contact { margin-left: 0; min-height: 37px; padding: 7px 17px; }
.button, .round-link { min-height: 40px; padding: 9px 19px; gap: 22px; font: 500 .86rem/1.4 var(--sans); letter-spacing: -.01em; text-transform: none; }
.eyebrow { font-size: .7rem; }
.concept-hero { padding: 0; }
.hero-stage { --scene-progress: 0; height: calc(100svh - 80px); min-height: 640px; }
.hero-stage-pin { height: calc(100svh - 80px); min-height: 640px; position: relative; overflow: clip; }
.motion-enabled .hero-stage { height: 175svh; }
.motion-enabled .hero-stage-pin { position: sticky; top: 80px; }
.stage-overline { position: absolute; left: var(--gutter); right: var(--gutter); top: 25px; display: flex; justify-content: space-between; color: #697073; opacity: calc(1 - var(--scene-progress) * 4); }
.stage-overline span:last-child::before { content: ''; display: inline-block; width: 5px; height: 5px; margin-right: 9px; border-radius: 50%; background: var(--orange); }
.hero-stage .concept-canvas, .motion-enabled .hero-stage .concept-canvas {
  --canvas-scale: calc(.43 + var(--scene-progress) * .57);
  position: absolute; width: calc(100% - var(--gutter) * 2); height: calc(100% - 40px);
  top: 43%; left: 50%; display: block; margin: 0; background: #e8e6f4; color: #24202d;
  transform: translate(-50%, -50%) scale(var(--canvas-scale));
  transform-origin: center; border-radius: 10px; overflow: hidden;
}
.motion-enabled .hero-stage .concept-canvas { top: calc(43% + var(--scene-progress) * 7%); }
.film-label { position: absolute; left: 35px; right: 35px; top: 28px; display: flex; justify-content: space-between; align-items: center; z-index: 2; font-size: calc(.7rem / var(--canvas-scale)); }
.film-dot { width: 9px; height: 9px; border-radius: 50%; background: var(--orange); }
.sculpture-wrap { position: absolute; inset: -14% 8% -9%; transform: rotate(calc(-5deg + var(--scene-progress) * 12deg)); }
.signal-sculpture { width: 100%; height: 100%; object-fit: contain; }
.motion-enabled .art-in-view .signal-sculpture { animation: sculpture-drift 13s ease-in-out infinite alternate; }
@keyframes sculpture-drift { from { transform: translateY(-10px) rotate(-3deg); } to { transform: translateY(10px) rotate(3deg); } }
.hero-stage .film-caption { position: absolute; left: 0; right: 0; bottom: 0; display: flex; padding: 24px 35px; border: 0; background: transparent; font: 400 .8rem/1.5 var(--mono); color: #655e78; }
.hero-stage .film-caption span:nth-child(2) { font-size: inherit; color: inherit; }
.hero-stage .film-caption { font-size: calc(.65rem / var(--canvas-scale)); }
.hero-stage [data-phase=intelligence] .film-caption span:nth-child(1), .hero-stage [data-phase=engineering] .film-caption span:nth-child(2), .hero-stage [data-phase=experience] .film-caption span:nth-child(3) { color: #14121b; }
.hero-stage .hero-intro { position: absolute; left: var(--gutter); right: var(--gutter); bottom: 43px; display: flex; justify-content: space-between; align-items: end; gap: 40px; padding: 0; opacity: calc(1 - var(--scene-progress) * 3.3); transform: translateY(calc(var(--scene-progress) * 50px)); }
.hero-stage .hero-intro h1 { font-size: clamp(2rem, 3.2vw, 3.9rem); line-height: 1.09; letter-spacing: -.035em; font-weight: 450; text-wrap: initial; }
.hero-stage .hero-aside { display: flex; gap: 36px; align-items: end; max-width: none; padding: 0; }
.hero-stage .hero-aside p { color: #686e70; font-size: .91rem; line-height: 1.5; }
.hero-stage .hero-discover { width: 43px; height: 43px; min-height: 43px; margin: 0; justify-content: center; border: 1px solid #bec1c2; border-radius: 50%; }
.hero-stage .hero-discover span { color: var(--ink); }
.intro-statement { padding-block: 110px 100px; }
.intro-statement > .eyebrow { color: #62696b; margin-bottom: 33px; }
.statement-row { display: flex; gap: 80px; justify-content: space-between; align-items: start; }
.statement-row h2 { max-width: 1100px; font-size: clamp(2rem, 3.35vw, 4rem); line-height: 1.18; font-weight: 450; letter-spacing: -.035em; text-wrap: pretty; }
.statement-row .button { flex-shrink: 0; margin-top: 8px; }
.statement-note { margin-top: 30px; max-width: 625px; font-size: 1rem; color: #686e70; }
.principle-showcase { display: grid; grid-template-columns: 1fr 1fr; gap: 100px 32px; padding-bottom: 135px; }
.engineering-study { padding-top: 120px; }
.study-art { aspect-ratio: 1.23; position: relative; overflow: hidden; border-radius: 4px; isolation: isolate; }
.art-corner, .art-bottom { position: absolute; z-index: 3; left: 28px; right: 28px; font: 400 .67rem/1.5 var(--mono); }
.art-corner { top: 25px; }
.art-bottom { bottom: 25px; display: flex; justify-content: space-between; gap: 20px; }
.intelligence-art { background: #f4c29c; color: #72330d; }
.intelligence-lens { position: absolute; width: 60%; aspect-ratio: 1; top: 50%; left: 50%; transform: translate(-50%, -50%) rotate(-18deg); }
.intelligence-lens i { position: absolute; inset: 0; border: 1px solid #aa4f2590; border-radius: 50%; transform: translateX(-16%); }
.intelligence-lens i:nth-child(2) { transform: translateX(16%); }
.intelligence-lens i:nth-child(3) { transform: translateY(-16%); }
.intelligence-lens i:nth-child(4) { transform: translateY(16%); }
.intelligence-lens i:nth-child(5) { transform: rotate(45deg) translateX(-16%); }
.intelligence-lens i:nth-child(6) { transform: rotate(45deg) translateX(16%); }
.lens-center { position: absolute; inset: 27%; display: grid; place-items: center; border-radius: 50%; background: #f35c27; color: #fff8ed; font-size: clamp(2.5rem, 5vw, 6rem); font-weight: 450; letter-spacing: -.07em; box-shadow: 0 25px 45px #ad582934; }
.engineering-art { background: #ced8fc; color: #303c77; }
.engineering-stack { position: absolute; width: 64%; left: 18%; top: 26%; transform: rotate(-14deg) skew(7deg); }
.engineering-stack > div { height: 93px; padding: 18px 25px; display: flex; align-items: center; justify-content: space-between; border: 1px solid #6a7bb2; background: #edf0ff; box-shadow: -8px 10px 0 #abbbea; font: 400 .75rem/1.3 var(--mono); }
.engineering-stack > div:nth-child(2) { margin-top: 14px; transform: translateX(-20px); background: #c0c9ef; }
.engineering-stack > div:nth-child(3) { margin-top: 14px; transform: translateX(-40px); background: #4b5a9e; color: #fff; }
.engineering-stack b { font-size: 1.6rem; font-weight: 450; }
.showcase-caption { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; padding-top: 26px; }
.showcase-caption .eyebrow { font-size: .66rem; color: #707578; margin-bottom: 9px; }
.showcase-caption h3 { font-size: clamp(1.3rem, 1.7vw, 2rem); line-height: 1.17; letter-spacing: -.04em; }
.showcase-caption > p { color: #656b6e; font-size: .9rem; line-height: 1.55; }
.experience-study { grid-column: 1 / -1; width: 85%; margin: 0 auto; }
.experience-art { aspect-ratio: 2.05; background: #e4e9e2; color: #24483c; }
.experience-type { position: absolute; top: 50%; left: 12%; transform: translateY(-50%); font-size: clamp(3rem, 7vw, 8.5rem); letter-spacing: -.045em; line-height: .97; }
.experience-type span { color: #758e82; }
.experience-cursor { position: absolute; top: 39%; right: 13%; font-size: clamp(4rem, 9vw, 10rem); color: #f36130; transform: rotate(-12deg); text-shadow: 5px 8px 0 #b8c2b9; z-index: 2; }
.experience-orbit { position: absolute; width: 26%; aspect-ratio: 1; right: 11%; top: 24%; border: 1px solid #8da498; border-radius: 50%; }
.experience-orbit::after { content: ''; position: absolute; inset: 18%; border: 1px solid #8da498; border-radius: 50%; }
.experience-study .showcase-caption { grid-template-columns: 1fr 1fr; }
.study-art > div { transition: transform 1.1s cubic-bezier(.22,1,.36,1); }
@media (hover:hover) and (prefers-reduced-motion:no-preference) {
  .intelligence-study:hover .intelligence-lens { transform: translate(-50%, -50%) rotate(8deg); }
  .engineering-study:hover .engineering-stack { transform: rotate(-8deg) skew(3deg) translateY(-10px); }
  .experience-study:hover .experience-cursor { transform: rotate(0deg) translate(-12px,-12px); }
}
.engineering { background: #f4f4f2; color: var(--ink); padding-block: 95px; }
.engineering .section-index, .engineering .standard-top .eyebrow { color: #686e70; }
.engineering h2, .recruitment h2, .principle-intro h2 { font-size: clamp(2.5rem, 4vw, 4.6rem); font-weight: 450; line-height: 1.08; letter-spacing: -.035em; }
.engineering-heading > p { color: #656b6e; font-size: 1rem; max-width: 320px; }
.standards-grid { border-top-color: #adb3b3; margin-top: 60px; }
.standards-grid article, .standards-grid article:nth-child(2), .standards-grid article:nth-child(3) { border-right-color: #d8dddd; }
.standard-top { margin-bottom: 55px; }
.standards-grid h3 { font-size: clamp(1.6rem, 2vw, 2.3rem); font-weight: 450; }
.standards-grid p { color: #656b6e; }
.recruitment { padding-block: 125px; grid-template-columns: 1.1fr .9fr; gap: 100px; }
.recruitment-intro > p:not(.eyebrow) { font-size: 1.06rem; max-width: 470px; margin-top: 26px; }
.role-link h3 { font-size: 1.65rem; font-weight: 450; }
.contact-strip { background: #e8e6f4; padding-block: 110px; color: var(--ink); }
.contact-strip h2 { font-size: clamp(3rem, 5.4vw, 6.3rem); font-weight: 450; line-height: 1.05; letter-spacing: -.04em; }
.contact-strip .eyebrow { color: #666273; }
.contact-strip-copy { color: #666273; font-size: 1rem; }
.site-footer { background: #fff; padding-top: 65px; }
.footer-wordmark { font-size: clamp(5rem, 22.5vw, 27rem); letter-spacing: -.055em; line-height: .95; margin: 90px 0 24px; font-weight: 600; white-space: nowrap; }
.footer-wordmark > span { color: var(--orange); }
.footer-bottom { margin-top: 0; }
.page-heading h1 { font-size: clamp(3rem, 6vw, 7rem); font-weight: 450; line-height: 1.03; letter-spacing: -.04em; }
.page-heading h1 em { color: #8a8c8d; }
.page-heading { padding-top: 115px; }
.page-summary, .page-lede > p { font-size: clamp(1rem, 1.4vw, 1.3rem); }
.company-foundations h2 { font-size: clamp(3rem, 4vw, 4.8rem); font-weight: 450; }
.company-foundations > div:first-child { background: #e8e6f4; color: var(--ink); min-height: 470px; }
.company-foundations .section-index, .foundation-label { color: #686274; }
.principle-section { background: #f4f4f2; }
.roles-label h2, .apply-section h2 { font-size: clamp(2.7rem, 4vw, 4.6rem); font-weight: 450; }
.job-title h2 { font-weight: 450; }
.contact-mail { background: #e8e6f4; }
.contact-mail > a { font-weight: 450; }
.motion-control { font-size: .64rem; min-height: 34px; bottom: 12px; right: 12px; opacity: .8; }
.motion-control:hover, .motion-control:focus-visible { opacity: 1; }
@media (max-width:1100px) {
  .hero-stage .hero-aside { gap: 18px; }
  .statement-row { gap: 35px; }
  .showcase-caption { grid-template-columns: 1fr; gap: 12px; }
  .engineering-stack > div { height: 65px; padding: 14px; font-size: .6rem; }
  .recruitment { gap: 55px; }
}
@media (max-width:760px) {
  :root { --gutter: 22px; }
  .header-bar { min-height: 74px; }
  .brand-logo { width: 176px; }
  .site-nav { background: #fff; }
  .hero-stage, .motion-enabled .hero-stage { height: auto; min-height: 0; }
  .hero-stage-pin, .motion-enabled .hero-stage-pin { position: relative; top: auto; height: auto; min-height: 0; padding: 25px var(--gutter) 45px; overflow: hidden; }
  .stage-overline { position: static; font-size: .6rem; gap: 25px; opacity: 1; }
  .stage-overline span:last-child { text-align: right; max-width: 120px; }
  .hero-stage .concept-canvas, .motion-enabled .hero-stage .concept-canvas { position: relative; left: auto; top: auto; width: 100%; height: 330px; min-height: 0; margin: 56px 0 42px; transform: none; border-radius: 4px; }
  .film-label { top: 17px; left: 17px; right: 17px; font-size: .58rem; }
  .sculpture-wrap { inset: -1% -20% 0; }
  .hero-stage .film-caption { padding: 15px; font-size: .45rem; gap: 8px; }
  .hero-stage .film-caption span:last-child { display: block; }
  .hero-stage .film-caption span:nth-child(2) { font-size: inherit; }
  .hero-stage .hero-intro { position: static; display: block; opacity: 1; transform: none; }
  .hero-stage .hero-intro h1 { font-size: clamp(1.9rem, 6.6vw, 3rem); line-height: 1.12; letter-spacing: -.04em; }
  .hero-stage .hero-aside { margin-top: 28px; display: flex; align-items: center; justify-content: space-between; }
  .hero-stage .hero-aside p { font-size: .82rem; }
  .intro-statement { padding: 58px 0 64px; border-top: 1px solid var(--line); }
  .intro-statement > .eyebrow { margin-bottom: 25px; }
  .statement-row { display: block; }
  .statement-row h2 { font-size: 1.9rem; line-height: 1.22; }
  .statement-row .button { margin-top: 25px; }
  .statement-note { font-size: .94rem; margin-top: 26px; }
  .principle-showcase { grid-template-columns: 1fr; gap: 60px; padding-bottom: 75px; }
  .engineering-study { padding: 0; }
  .study-art { aspect-ratio: 1.06; }
  .art-corner, .art-bottom { left: 19px; right: 19px; font-size: .52rem; }
  .art-bottom { gap: 10px; }
  .showcase-caption, .experience-study .showcase-caption { grid-template-columns: 1fr; gap: 12px; padding-top: 20px; }
  .showcase-caption h3 { font-size: 1.5rem; }
  .showcase-caption > p { font-size: .94rem; }
  .engineering-stack { width: 65%; left: 24%; top: 25%; }
  .engineering-stack > div { height: 65px; }
  .experience-study { grid-column: auto; width: 100%; }
  .experience-type { font-size: 3.3rem; left: 8%; top: 46%; }
  .experience-cursor { font-size: 4.3rem; top: 62%; right: 11%; }
  .experience-orbit { top: 60%; right: 14%; }
  .engineering, .recruitment, .contact-strip { padding-block: 75px; }
  .engineering h2, .recruitment h2, .principle-intro h2 { font-size: 2.65rem; }
  .engineering-heading > p { margin-top: 23px; }
  .standards-grid { margin-top: 40px; }
  .standards-grid article, .standards-grid article:nth-child(2), .standards-grid article:nth-child(3) { border-bottom-color: #d8dddd; }
  .standard-top { margin-bottom: 25px; }
  .standards-grid h3 { font-size: 1.8rem; }
  .recruitment { grid-template-columns: 1fr; gap: 45px; }
  .contact-strip h2 { font-size: 3rem; }
  .footer-wordmark { font-size: 21.5vw; margin-top: 55px; }
  .page-heading { padding-top: 75px; }
  .page-heading h1 { font-size: 2.85rem; }
  .company-foundations h2, .roles-label h2, .apply-section h2 { font-size: 2.8rem; }
  .company-foundations > div:first-child { min-height: 370px; }
}

/* AI motion language: context → connected intelligence → useful outcomes. */
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
.mobile-network-input, .mobile-network-output { display:none; }
.network-wrap { position:absolute; inset:7% 0 5%; }
.intelligence-network { width:100%; height:100%; overflow:visible; }
.mesh-line { stroke:#ee743f; stroke-width:1.15; opacity:.48; }
.mesh-latitude { opacity:.65; }
.network-node { fill:#e95e28; stroke:#fff0df; stroke-width:1.5; }
.network-label { fill:#5e536f; font:400 18px var(--mono); letter-spacing:.5px; }
.core-caption { font-size:16px; letter-spacing:2px; }
.route-guide { stroke:#b7acc7; stroke-width:1.2; }
.signal-flow { stroke:#ef6634; stroke-width:4; stroke-linecap:round; stroke-dasharray:.045 .955; stroke-dashoffset:.3; }
.port-node { fill:#e8e6f4; stroke:#d16c46; stroke-width:2; }
.outcome-pill { fill:#f6f4fb; stroke:#beb3ce; stroke-width:1; }
.network-shell { transform-origin:600px 350px; }
.ai-animated { animation-play-state:paused !important; }
.motion-enabled .signal-flow { animation:signal-travel 6s linear infinite; animation-delay:var(--delay,0s); }
.motion-enabled .network-node { animation:node-activation 6s ease-in-out infinite; animation-delay:var(--delay,0s); }
.motion-enabled .core-ring { animation:core-breath 6s ease-in-out infinite; transform-origin:600px 350px; }
.motion-enabled .art-in-view .ai-animated { animation-play-state:running !important; }
.motion-enabled.page-away .ai-animated { animation-play-state:paused !important; }
@keyframes signal-travel { from {stroke-dashoffset:1;} to {stroke-dashoffset:0;} }
@keyframes node-activation { 0%,100% {opacity:.35;} 35%,55% {opacity:1;} }
@keyframes core-breath { 0%,100% {transform:scale(1);opacity:.45;} 50% {transform:scale(1.15);opacity:.9;} }
/* Traveling points follow the existing model's six evaluation orbits. */
.orbit-signal { position:absolute; inset:-1px; border-radius:50%; }
.orbit-signal::before { content:''; position:absolute; top:50%; left:-4px; width:9px; height:9px; border-radius:50%; background:#ed602b; box-shadow:0 0 0 5px #f8debd; }
.motion-enabled .orbit-signal { animation:evaluation-orbit 12s linear infinite; animation-delay:var(--delay,0s); }
.motion-enabled .lens-center { animation:evaluation-core 6s ease-in-out infinite; }
.motion-enabled .cycle-label { animation:evaluation-label 6s ease-in-out infinite; animation-delay:var(--delay,0s); }
@keyframes evaluation-orbit { to {transform:rotate(360deg);} }
@keyframes evaluation-core { 0%,100% {box-shadow:0 25px 45px #ad582934,0 0 0 0 #ee602426;} 50% {box-shadow:0 25px 45px #ad582934,0 0 0 14px #ee602400;} }
@keyframes evaluation-label { 0%,28% {color:#843407; text-decoration:underline; text-underline-offset:7px;} 38%,100% {color:#9c694c; text-decoration-color:transparent;} }
/* A request passes from intelligence through services to the experience. */
.system-layer { position:relative; isolation:isolate; }
.system-layer::after { content:''; position:absolute; inset:0; background:#fff; opacity:0; pointer-events:none; }
.motion-enabled .system-layer::after { animation:layer-transfer 6s ease-in-out infinite; animation-delay:var(--delay,0s); animation-play-state:paused; }
.motion-enabled .art-in-view .system-layer::after { animation-play-state:running; }
.motion-enabled.page-away .system-layer::after { animation-play-state:paused; }
.motion-enabled .system-layer b { animation:layer-indicator 6s ease-in-out infinite; animation-delay:var(--delay,0s); animation-play-state:paused; }
.motion-enabled .art-in-view .system-layer b { animation-play-state:running; }
.motion-enabled.page-away .system-layer b { animation-play-state:paused; }
@keyframes layer-transfer { 0%,8%,70%,100% {opacity:0;clip-path:inset(0 100% 0 0);} 24% {opacity:.6;clip-path:inset(0 0 0 0);} 42% {opacity:0;clip-path:inset(0 0 0 100%);} }
@keyframes layer-indicator { 0%,10%,65%,100% {transform:scale(1);} 25%,40% {transform:scale(1.3);color:#e85d27;} }
/* The result ends in a human decision, illustrated without a simulated UI. */
.experience-type { left:8%; font-size:clamp(3rem,5.8vw,7rem); }
.outcome-flow { position:absolute; top:50%; right:7%; width:32%; transform:translateY(-50%); }
.flow-caption { font:400 .62rem var(--mono); letter-spacing:.06em; margin-bottom:22px; color:#557164; }
.outcome-step { min-height:66px; display:flex; align-items:center; gap:17px; padding:17px 20px; background:#f3f5ef; border:1px solid #a8b9ad; border-radius:4px; color:#345346; font-size:clamp(.75rem,1.1vw,1rem); }
.step-number { font:400 .65rem var(--mono); color:#708779; }
.outcome-step i { width:6px; height:6px; border-radius:50%; background:#a8b9ad; margin-left:auto; }
.outcome-step > b { margin-left:auto; color:#e66030; font-size:1.3rem; font-weight:400; }
.human-step { border-color:#769684; background:#edf1e9; }
.flow-connector { position:relative; height:30px; width:1px; background:#a8b9ad; margin-left:31px; overflow:hidden; }
.flow-connector b { position:absolute; inset:0; height:10px; background:#ef6634; }
.motion-enabled .outcome-step { animation:outcome-focus 6s ease-in-out infinite; animation-delay:var(--delay,0s); }
.motion-enabled .flow-connector b { animation:outcome-connection 6s ease-in-out infinite; animation-delay:var(--delay,0s); }
@keyframes outcome-focus { 0%,30%,100% {border-color:#a8b9ad;transform:translateX(0);} 8%,22% {border-color:#e56b3c;transform:translateX(5px);} }
@keyframes outcome-connection { 0%,8% {transform:translateY(-12px);opacity:0;} 15% {opacity:1;} 30%,100% {transform:translateY(32px);opacity:0;} }
@media(max-width:1100px) and (min-width:761px) {
  .outcome-flow {right:5%;width:37%;}
  .experience-type {left:6%;font-size:5vw;}
  .outcome-step {min-height:50px;padding:12px;gap:10px;}
  .flow-connector {height:18px;}
}
@media(max-width:760px) {
  .hero-stage .concept-canvas, .motion-enabled .hero-stage .concept-canvas {height:350px;}
  .network-wrap {inset:48px 0;}
  .network-shell {transform:scale(1.5);}
  .network-routes, .core-caption, .intelligence-network > ellipse {display:none;}
  .mobile-network-input, .mobile-network-output {display:flex;position:absolute;left:12%;right:12%;justify-content:space-between;gap:12px;font:400 .53rem var(--mono);color:#665773;}
  .mobile-network-input {top:65px;}
  .mobile-network-output {bottom:63px;}
  .mobile-network-output span {border:1px solid #c6bdd2;background:#f2eff8;border-radius:20px;padding:5px 8px;}
  .mobile-network-input::after {content:'';position:absolute;top:20px;left:50%;width:1px;height:20px;background:#ed7548;}
  .mobile-network-output::before {content:'';position:absolute;bottom:30px;left:50%;width:1px;height:16px;background:#ed7548;}
  .network-label {font-size:26px;}
  .core-caption {font-size:20px;letter-spacing:1px;}
  .hero-stage .film-caption {font-size:.5rem;}
  .experience-art {aspect-ratio:auto;min-height:560px;}
  .experience-type {top:80px;left:8%;transform:none;font-size:3.2rem;}
  .outcome-flow {top:auto;bottom:62px;left:8%;right:8%;width:auto;transform:none;}
  .flow-caption {font-size:.55rem;margin-bottom:13px;}
  .outcome-step {min-height:48px;font-size:.8rem;padding:12px 16px;}
  .flow-connector {height:17px;}
}

/* A coordinated, explorable eight-second story in the opening scene. */
.flow-status { display:flex;align-items:center;gap:14px; }
.flow-status [data-flow-status] {font-size:.9em;color:#81748f;}
.cinematic .signal-flow, .cinematic .network-node, .cinematic .core-ring {animation:none !important;}
.cinematic .core-ring {transform-origin:600px 350px;}
.network-volume {pointer-events:none;}
.hero-stage .flow-controls {gap:24px;padding:10px 35px;align-items:center;}
.flow-controls button {position:relative;display:flex;align-items:center;justify-content:center;gap:12px;flex:1;min-width:0;min-height:calc(44px / var(--canvas-scale));padding:4px 8px;border:0;border-radius:0;background:transparent;color:#70657d;font:inherit;cursor:pointer;transition:color .25s,background .25s;}
.flow-controls button:hover {color:#23182e;background:#d7cfe333;}
.flow-controls button:focus-visible {outline:2px solid #b6461e;outline-offset:-2px;}
.flow-number {opacity:.55;}
.flow-controls button[aria-pressed=true] {color:#281c38;}
.flow-controls button[aria-pressed=true] .flow-number {opacity:1;color:#bc4c22;}
.flow-controls button i {position:absolute;bottom:0;left:12%;right:12%;height:2px;background:#f0612e;transform:scaleX(0);transform-origin:left;}
.flow-controls button[aria-pressed=true] i {transform:scaleX(var(--stage-progress,.4));}
.cinematic[data-flow-phase="0"] .mobile-network-input {color:#b44b25;}
.cinematic[data-flow-phase="2"] .outcome-pill {fill:#fff2e5;stroke:#df8868;transition:fill .5s,stroke .5s;}
.cinematic[data-flow-phase="2"] .mobile-network-output span {border-color:#df8868;background:#fff2e5;}
/* Layers separate gently as the signal travels upwards. */
.system-layer {--layer-x:0px;}
.system-layer:nth-child(2) {--layer-x:-20px;}
.system-layer:nth-child(3) {--layer-x:-40px;}
.motion-enabled .system-layer {animation:layer-lift 8.4s cubic-bezier(.4,0,.2,1) infinite;animation-delay:var(--delay,0s);}
.motion-enabled .system-layer::after, .motion-enabled .system-layer b {animation-duration:8.4s;}
@keyframes layer-lift {0%,60%,100% {transform:translate(var(--layer-x),0);} 20%,35% {transform:translate(var(--layer-x),-9px);}}
/* Cleaner timing and a little counter-motion around the evaluation model. */
.motion-enabled .orbit-signal {animation-duration:18s;}
.motion-enabled .intelligence-lens i:nth-child(even) .orbit-signal {animation-direction:reverse;animation-duration:22s;}
.motion-enabled .outcome-step, .motion-enabled .flow-connector b {animation-duration:8.4s;}
@media(max-width:760px) {
  .flow-status [data-flow-status] {display:none;}
  .hero-stage .flow-controls {padding:6px 10px;gap:8px;}
  .flow-controls button {min-height:44px;padding:4px 0;gap:6px;font-size:.5rem;}
  .flow-controls button i {height:1px;}
  .flow-number {font-size:.48rem;}
}

/* Expressive display shapes, quiet reading text, precise technical notation. */
h1, h2, h3, .footer-wordmark, .experience-type {font-family:var(--display);font-feature-settings:normal;}
h1, h2, h3 {letter-spacing:-.022em;}
.hero-stage .hero-intro h1 {font-size:clamp(2rem,3.65vw,4.4rem);line-height:1.08;letter-spacing:-.022em;font-weight:450;}
.statement-row h2 {line-height:1.16;letter-spacing:-.025em;}
.showcase-caption h3 {letter-spacing:-.025em;}
.hero-stage .hero-aside p, .showcase-caption > p {font-size:.96rem;line-height:1.6;}
.site-footer address {font-size:.95rem;}
.footer-wordmark {font-weight:500;letter-spacing:-.045em;}
.network-label {letter-spacing:.2px;}
@media(max-width:760px) {
  .hero-stage .hero-intro h1 {font-size:clamp(1.5rem,6.9vw,3rem);letter-spacing:-.025em;line-height:1.12;}
  .hero-stage .hero-aside p {font-size:.87rem;}
  .site-nav {font-size:1rem;}
  .contact-heading h1 {font-size:clamp(2rem,11.3vw,2.85rem);}
  .statement-row h2 {font-size:1.9rem;}
}

/* A connected sequence: gather, make connections, then surface an outcome. */
.hero-stage .concept-canvas, .motion-enabled .hero-stage .concept-canvas {
  background: radial-gradient(ellipse at 50% 42%, #f6f3ff 0, #ece8f6 44%, #e5e1f0 100%);
  box-shadow: inset 0 0 0 1px #8a769515;
}
.network-wrap::before {
  content:''; position:absolute; inset:4% 24%; border:1px solid #b7a4c122;
  border-radius:50%; pointer-events:none;
}
.network-wrap::after {
  content:''; position:absolute; inset:0; pointer-events:none; opacity:.22;
  background:linear-gradient(#ac9bbc66,#ac9bbc66) 50% 0/1px 18px no-repeat,
    linear-gradient(#ac9bbc66,#ac9bbc66) 50% 100%/1px 18px no-repeat,
    linear-gradient(90deg,#ac9bbc66,#ac9bbc66) 5% 50%/18px 1px no-repeat,
    linear-gradient(90deg,#ac9bbc66,#ac9bbc66) 95% 50%/18px 1px no-repeat;
}
.synapse-line {fill:none;stroke:#e66b36;stroke-width:1.5;stroke-dasharray:1;stroke-dashoffset:1;}
.synapse-spark {fill:#fffcf3;stroke:#f16933;stroke-width:1.5;}
.outcome-pill, .mobile-network-output span {transition:fill .45s,stroke .45s,background .45s,border-color .45s;}
.cinematic[data-flow-phase="2"] .outcome-pill {fill:#f6f4fb;stroke:#beb3ce;}
.cinematic[data-flow-phase="2"] .outcome-pill.is-arrived {fill:#fff2e5;stroke:#df8868;}
.cinematic[data-flow-phase="2"] .mobile-network-output span {background:#f2eff8;border-color:#c6bdd2;}
.cinematic[data-flow-phase="2"] .mobile-network-output span.is-arrived {background:#fff2e5;border-color:#df8868;}
.scene-caption {position:absolute;top:calc(64.5% + 18px);left:50%;width:min(580px,80%);text-align:center;transform:translateX(-50%);opacity:calc(1 - var(--scene-progress) * 5);pointer-events:none;}
.scene-caption-index {display:block;font:400 .65rem/1.5 var(--mono);letter-spacing:.05em;color:#985432;margin-bottom:7px;}
.scene-caption p {font:400 1rem/1.5 var(--sans);color:#62676a;}
.hero-stage .flow-controls button {letter-spacing:.02em;}
.hero-stage .flow-controls button i {border-radius:2px;}
.hero-stage .hero-discover {position:relative;overflow:hidden;border-color:#acb2b4;transition:border-color .25s,background .25s;}
.hero-stage .hero-discover:hover {background:var(--ink);color:#fff;border-color:var(--ink);}
.hero-stage .hero-discover:hover span {color:#fff;transform:translateY(3px);}
.intro-statement > .eyebrow {display:flex;align-items:center;gap:24px;}
.section-rule {height:1px;flex:1;background:#d9dcda;transform-origin:left;}
.motion-enabled .intro-statement .section-rule {transform:scaleX(.15);transition:transform 1.2s cubic-bezier(.22,1,.36,1);}
.motion-enabled .intro-statement.is-visible .section-rule {transform:scaleX(1);}
.statement-row h2 {max-width:1060px;}
.statement-note {max-width:630px;line-height:1.8;}
.study-art {border-radius:8px;}
.art-corner {display:flex;align-items:center;gap:18px;letter-spacing:.045em;}
.art-corner::after {content:'';height:1px;flex:1;background:currentColor;opacity:.2;}
.showcase-caption {padding-top:30px;}
.showcase-caption > p {font-size:1rem;line-height:1.7;}
.showcase-caption h3 {line-height:1.18;}
.intelligence-art {background:#f5c49e;}
.intelligence-lens {filter:drop-shadow(0 14px 16px #ac502010);}
.lens-center {font-family:var(--display);font-weight:500;letter-spacing:-.035em;}
.engineering-art {background:#d3ddff;}
.engineering-stack::before {content:'';position:absolute;left:15%;top:-28px;bottom:-35px;width:1px;border-left:1px dashed #6477b0;transform:rotate(6deg);}
.engineering-stack > div {border-radius:3px;box-shadow:-1px 2px 0 #a0b0da,-3px 4px 0 #a0b0da,-5px 6px 0 #a0b0da,-7px 8px 0 #a0b0da,-10px 17px 24px #52629715;}
.system-layer span::before {content:'';display:inline-block;width:5px;height:5px;background:currentColor;border-radius:50%;margin-right:10px;opacity:.6;}
.experience-type {line-height:1.02;}
.outcome-step {border-radius:7px;}
.human-step {background:#f5f7f0;border-color:#638b74;}
.human-step > b {display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#e96837;color:white;font-size:1.1rem;}
.motion-enabled .outcome-step i {animation:decision-node 8.4s ease-in-out infinite;animation-delay:var(--delay,0s);animation-play-state:paused;}
.motion-enabled .art-in-view .outcome-step i {animation-play-state:running;}
.motion-enabled.page-away .outcome-step i {animation-play-state:paused;}
@keyframes decision-node {0%,30%,100% {background:#a8b9ad;box-shadow:0 0 0 0 #ed693500;} 8%,22% {background:#ed6935;box-shadow:0 0 0 5px #ed693516;}}
.standard-top {align-items:center;}
.metric-icon, .standards-grid article:nth-child(2) .metric-icon, .standards-grid article:nth-child(3) .metric-icon {width:74px;height:42px;border:0;border-radius:0;background:none;color:#af5327;}
.standards-grid article:nth-child(2) .metric-icon {color:#50699d;}
.standards-grid article:nth-child(3) .metric-icon {color:#457572;}
.standard-diagram {width:100%;height:100%;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;}
.standards-grid article {position:relative;}
.standards-grid article::after {content:'';position:absolute;bottom:-1px;left:0;right:0;height:2px;background:#d47850;transform:scaleX(0);transform-origin:left;transition:transform .5s cubic-bezier(.22,1,.36,1);}
.standards-grid article:nth-child(2)::after {background:#7d90c8;}
.standards-grid article:nth-child(3)::after {background:#6e967f;}
.standards-grid article:hover::after {transform:scaleX(1);}
.contact-strip {position:relative;isolation:isolate;overflow:hidden;}
.contact-strip::before {content:'';position:absolute;z-index:-1;width:580px;height:580px;right:-120px;top:50%;transform:translateY(-50%);border:1px solid #a89bb940;border-radius:50%;box-shadow:0 0 0 70px #a89bb913,0 0 0 140px #a89bb90a;pointer-events:none;}
.contact-strip .wrap {position:relative;}
.contact-strip .wrap > div {min-width:0;max-width:100%;}
.button, .round-link {position:relative;overflow:hidden;transition:background .25s,color .25s,box-shadow .25s;}
.button:hover, .round-link:hover {box-shadow:0 5px 16px #151a1c15;}
.button > span {transition:transform .3s cubic-bezier(.22,1,.36,1);}
.button:hover > span {transform:translate(3px,-3px);}
.site-nav a:not(.nav-contact), .footer-top nav a {position:relative;}
.footer-top nav a {width:fit-content;}
.footer-top nav a::after {content:'';position:absolute;left:0;right:0;bottom:-3px;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .3s;}
.footer-top nav a:hover::after, .footer-top nav a:focus-visible::after {transform:scaleX(1);}
@media(max-width:1100px) and (min-width:761px) {
  .hero-stage .concept-canvas, .motion-enabled .hero-stage .concept-canvas {
    --canvas-scale:calc(.64 + var(--scene-progress) * .36);
    height:calc(68% + var(--scene-progress) * 25%);
  }
  .standard-top {gap:12px;}
  .metric-icon {max-width:52px;}
}
@media(max-width:760px) {
  .header-bar {gap:16px;}
  .footer-wordmark {font-size:19.5vw;}
  .scene-caption {position:static;transform:none;width:100%;margin:-21px 0 39px;opacity:1;}
  .scene-caption-index {font-size:.6rem;margin-bottom:5px;}
  .scene-caption p {font-size:.88rem;max-width:290px;margin-inline:auto;min-height:2.8em;}
  .network-wrap::before {inset:17% 11%;}
  .network-wrap::after {display:none;}
  .showcase-caption {padding-top:22px;}
  .showcase-caption > p {font-size:1rem;}
  .intro-statement > .eyebrow {gap:14px;font-size:.65rem;}
  .art-corner {gap:12px;}
  .human-step > b {width:24px;height:24px;font-size:1rem;}
  .experience-type {font-size:clamp(2.6rem,13vw,3.2rem);}
  .flow-controls button {flex-direction:column;gap:3px;font-size:.6rem;}
  .flow-number {font-size:.5rem;}
  .standard-top {justify-content:space-between;margin-bottom:28px;}
  .contact-strip::before {width:360px;height:360px;right:-240px;}
  .contact-strip h2 {font-size:clamp(2.4rem,11vw,3rem);}
}
