#ai.ai-atlas-section{--atlas-bg:#000;--atlas-ink:#fff;--atlas-muted:#b8b8b8;position:relative;isolation:isolate;display:block;height:auto;min-height:0;padding:0;margin-top:0;overflow:clip;background:var(--atlas-bg)!important;color:var(--atlas-ink)}
html.theme-light #ai.ai-atlas-section{--atlas-bg:#fff;--atlas-ink:#000;--atlas-muted:#555}
#ai::before,#ai::after{display:none!important}
.ai-journey{position:relative;isolation:isolate;padding-bottom:140px;background:var(--atlas-bg)}
.ai-journey *{box-sizing:border-box}
.ai-thread-viewport{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0;overflow:clip}
.ai-thread{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;color:var(--atlas-ink);overflow:visible;will-change:auto}
.ai-thread path{stroke-width:23}
.ai-journey__header{position:relative;z-index:1;padding:110px 7% 125px;pointer-events:none}
.ai-journey__header h2{font-size:clamp(64px,11vw,165px);line-height:.98;letter-spacing:-.065em;margin:0;font-weight:650;max-width:78%}
.ai-journey__header p{font-size:clamp(18px,2vw,27px);line-height:1.4;margin:28px 0 0;max-width:560px}
.ai-field{position:relative;height:145svh;min-height:970px;z-index:1;margin:0;padding:0 5.5%}
.ai-field__stage{position:sticky;top:85px;height:calc(100svh - 110px);min-height:570px;max-height:800px;max-width:1550px;margin:auto}
.ai-field__heading{position:absolute;top:3%;left:2%;z-index:3;max-width:78%}
.ai-field h3{font-size:clamp(48px,7.2vw,108px);line-height:1.02;letter-spacing:-.055em;font-weight:550;margin:0;text-wrap:balance}
.ai-field__visual{position:absolute;width:62%;height:72%;left:1%;top:24%;margin:0;z-index:1}
.ai-field__scene{position:absolute;inset:0}
.ai-field__scene canvas{display:block;width:100%;height:100%}
.ai-field__copy{position:absolute;width:31%;right:2%;top:37%;z-index:3;background:var(--atlas-bg);padding:18px 0}
.ai-field__description{font-size:clamp(16px,1.65vw,24px);line-height:1.55;margin:0 0 22px;text-wrap:pretty}
.ai-field ul{display:flex;flex-wrap:wrap;list-style:none;gap:9px 15px;margin:0;padding:0;color:var(--atlas-muted);font-size:12px;line-height:1.5}
.ai-field li+li:before{content:'·';margin-right:12px}
.ai-field a{display:inline-block;color:inherit;text-decoration:none;font-size:13px;margin-top:24px;padding:10px 0;border-bottom:1px solid currentColor}
.ai-field a:focus-visible{outline:2px solid currentColor;outline-offset:6px}
.ai-field__status{position:absolute;bottom:10px;font-size:13px}
.ai-field--business .ai-field__heading{left:27%;top:0}
.ai-field--business .ai-field__visual{left:34%;top:24%;width:66%}
.ai-field--business .ai-field__copy{left:4%;right:auto;top:40%;width:28%}
.ai-field--office .ai-field__heading{left:3%;top:0;max-width:60%}
.ai-field--office .ai-field__visual{left:0;top:31%;width:62%;height:68%}
.ai-field--office .ai-field__copy{top:27%;right:0;width:29%}
.ai-field--research .ai-field__heading{left:38%;top:0;max-width:62%}
.ai-field--research h3{font-size:clamp(44px,6.5vw,96px)}
.ai-field--research .ai-field__visual{left:20%;top:25%;width:78%;height:76%}
.ai-field--research .ai-field__copy{left:0;right:auto;top:30%;width:27%}
@media(max-width:760px){
 .ai-journey__header{padding:80px 7% 85px}.ai-journey__header h2{font-size:65px;max-width:100%}.ai-journey__header p{font-size:18px;max-width:270px}
 .ai-thread path{stroke-width:14}
 .ai-field{height:135svh;min-height:1030px;padding:0 6%}
 .ai-field .ai-field__stage{top:76px;height:calc(100svh - 95px);min-height:630px;max-height:780px}
 .ai-field .ai-field__heading{left:0;top:0;max-width:100%}.ai-field h3{font-size:clamp(40px,11vw,62px)}
 .ai-field .ai-field__visual{left:-5%;top:19%;width:110%;height:44%}
 .ai-field .ai-field__copy{left:3%;right:auto;top:64%;width:94%;padding:12px}
 .ai-field__description{font-size:16px;line-height:1.5;margin-bottom:12px}.ai-field a{margin-top:12px}.ai-field ul{font-size:11px}
}
@media(prefers-reduced-motion:reduce){.ai-field{height:auto;min-height:0;margin-bottom:70px}.ai-field__stage{position:relative;top:0}.ai-thread{opacity:.2}}
/* Keep document scrolling as the sticky containing block (hidden creates a new one). */
html:has(#ai.ai-atlas-section) body{overflow-x:clip}
.ai-field h3{display:inline;background:transparent;box-shadow:none}

.ai-thread path{vector-effect:non-scaling-stroke}
@media(max-width:760px){.ai-field .ai-field__stage{top:112px;height:calc(100svh - 140px)}}
/* Connecting arcs cross in the breathing room between reading compositions. */
.ai-field{padding-bottom:180px}
.ai-field__copy{background:transparent}
.ai-field__visual{background:transparent}
@media(max-width:760px){.ai-field{padding-bottom:160px}}

/* The drawn route remains fixed in document coordinates. */
.ai-thread{transform:none}


/* Native scroll sampling keeps the tip in step with document scrolling even
   while the main thread renders the blueprint construction. */
.ai-journey[data-native-ribbon="true"]{view-timeline-name:--ai-ribbon;view-timeline-axis:block}
.ai-journey[data-native-ribbon="true"] .ai-thread path{
 animation:aiRibbonReveal 1s linear both;
 animation-timeline:--ai-ribbon;
 animation-range:entry 0% exit 100%;
}
@media(prefers-reduced-motion:reduce){
 .ai-journey[data-native-ribbon="true"] .ai-thread path{animation:none;stroke-dashoffset:0}
}