/* Shared base and topic-scene styles. Homepage has its own stylesheet. */
:root{color-scheme:dark;--bg:#08051b;--text:#f5f4ff;--muted:#a7a0d8;--cyan:#65d5ff;--border:rgb(167 160 216 / 30%)}
*{box-sizing:border-box}
html{scroll-behavior:auto}
body{margin:0;background:var(--bg);color:var(--text);font:16px/1.55 ui-sans-serif,system-ui,sans-serif}
a{color:inherit;text-decoration:none}
button,summary{font:inherit;cursor:pointer}
button{color:inherit;background:transparent;border:1px solid var(--border);border-radius:30px;min-height:44px;padding:8px 18px}
button:hover{border-color:var(--cyan)}
:focus-visible{outline:2px solid var(--cyan);outline-offset:5px}
header{height:96px;padding:24px 6%;display:flex;align-items:center;justify-content:space-between;background:var(--bg);position:relative;z-index:5}

.review-tag,.eyebrow,.draft-note,.card-number{font-size:12px;letter-spacing:2px}
.review-tag{color:var(--muted)}
#pause{font-size:12px}
h1{font-size:clamp(48px,5.3vw,76px);letter-spacing:-3px;line-height:1.04;font-weight:500;margin:26px 0}
h1 em{font-style:normal;color:#c8b9fa}
.eyebrow{color:var(--muted);line-height:1.7}
.draft-note{letter-spacing:.6px;font-size:11px;color:var(--muted)}
.text-link{display:inline-flex;gap:32px;border-bottom:1px solid #7750d6;padding:14px 0;margin-top:20px}
.text-link span{color:var(--cyan)}
@keyframes signal-travel{from{stroke-dashoffset:1000}to{stroke-dashoffset:0}}
.scene{position:relative;isolation:isolate;overflow:hidden;min-height:940px;padding:110px 8%;background:var(--bg);display:flex;align-items:center}
.scene-background{position:absolute;inset:0;z-index:-2;overflow:hidden;background:linear-gradient(140deg,#08051b,#100b2b 60%,#08051b);pointer-events:none}
.field{position:absolute;inset:-8%;animation:breathe 6s ease-in-out infinite;animation-play-state:paused;will-change:transform,opacity;pointer-events:none}
.violet{background:radial-gradient(ellipse at 67% 52%,#7750d6 0,#442ba2 30%,transparent 65%);opacity:.2}
.cyan{background:radial-gradient(ellipse at 51% 63%,#65d5ff,transparent 40%);opacity:.07;animation-name:breathe-cyan;animation-duration:7s}
.scene:nth-child(2) .violet{background:radial-gradient(ellipse at 57% 40%,#7750d6,#442ba2 30%,transparent 66%);animation-delay:-2s}
.scene:nth-child(2) .cyan{background:radial-gradient(ellipse at 78% 47%,#65d5ff,transparent 38%);animation-delay:-3s}
@keyframes breathe{0%,100%{transform:scale(1) translate(-1%,0);opacity:.18}50%{transform:scale(1.06) translate(1%,2%);opacity:.32}}
@keyframes breathe-cyan{0%,100%{transform:scale(1) translate(0,0);opacity:.05}50%{transform:scale(1.06) translate(2%,-1%);opacity:.1}}
.waves{position:absolute;inset:0;width:100%;height:100%;fill:none;opacity:.75;transform-origin:65% 55%}
.wave-ribbon{animation:wave-flow 8s ease-in-out infinite alternate;animation-play-state:paused;transform-origin:60% 55%}
.wave-thread{stroke-width:.65;opacity:.35}
.wave-dot{stroke-width:1.1;stroke-dasharray:.5 7;stroke-linecap:round;opacity:.65}
.wave-bloom{stroke-width:16;opacity:.2}
.wave-traveler{stroke:#9ae3ff;stroke-width:1.6;stroke-dasharray:6 994;stroke-linecap:round;opacity:.8;animation:signal-travel 9s linear infinite;animation-play-state:paused}
.wave-traveler:nth-child(4){animation-delay:-3s}
.wave-traveler:nth-child(6){animation-delay:-6s}
.scene:nth-child(2) .waves{transform:scaleY(-1)}
@keyframes wave-flow{from{transform:translate(-.6%,-1%) scaleY(.98)}to{transform:translate(.6%,1%) scaleY(1.02)}}
.scene-copy{position:relative;z-index:1;width:30%;max-width:390px}
.scene-copy:before{content:"";position:absolute;inset:-50px -35px;background:radial-gradient(ellipse,#08051b95,transparent 72%);z-index:-1}
.scene-copy .eyebrow{font-size:10px;letter-spacing:1.6px}
.scene h2{font-size:clamp(44px,4.3vw,64px);line-height:1.02;letter-spacing:-2.4px;font-weight:500;margin:24px 0;max-width:340px}
.scene-copy h2{max-width:10ch}
.topic-dek{font-size:15px;line-height:1.4;color:#e1d8f8;margin:20px 0 12px;max-width:280px}
.overview{color:#c4bedd;max-width:410px;font-size:16px;line-height:1.65}
.benefit{border-left:1px solid #65d5ff88;padding-left:18px;font-size:13px;color:var(--muted);margin-top:26px;max-width:290px}
.dot{display:inline-block;width:7px;height:7px;background:var(--cyan);border-radius:50%;margin-right:8px;box-shadow:0 0 14px #65d5ff99}
.cards{position:absolute;inset:10% 6% 12% 41%;perspective:1400px;transform-style:preserve-3d;--px:0px;--py:0px;--rx:0deg;--ry:0deg}
.glass{background:linear-gradient(132deg,#7750d630,#1a123ce0 42%,#16153eea);border:1px solid #b8a5f54d;box-shadow:inset 0 1px 0 #f5f4ff19,inset 0 -1px 0 #65d5ff09,0 24px 60px #0006,0 0 35px #7750d612;backdrop-filter:blur(16px);border-radius:15px;padding:23px}
.card{position:absolute;width:clamp(280px,23vw,340px);transform-style:preserve-3d;transform:translate3d(calc(var(--px) * var(--depth,1)),calc(var(--py) * var(--depth,1)),0) rotateX(var(--rx)) rotateY(var(--ry)) rotateZ(var(--tilt,0deg));transition:transform .65s cubic-bezier(.2,.7,.2,1),border-color .3s,box-shadow .3s;animation:card-float 7s ease-in-out infinite;animation-play-state:paused;animation-delay:var(--float-phase,0s);--float:3px}
.card:before{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(145deg,#d7c7ff0c,transparent 45%);pointer-events:none}
.card-0{top:1%;left:0;--tilt:-1.6deg;--float-phase:-1s}
.card-1{right:0;top:28%;--tilt:1.8deg;--float-phase:-3s;--float:-3px;--depth:.65}
.card-2{bottom:0;left:8%;--tilt:-.6deg;--float-phase:-5s;--depth:1.2}
.scene:nth-child(2) .card-0{top:7%;left:8%;--tilt:1.4deg}
.scene:nth-child(2) .card-1{top:38%;--tilt:-1.3deg}
.scene:nth-child(2) .card-2{bottom:0;left:0;--tilt:1deg}
.card:hover,.card:focus-within{z-index:5;border-color:#b5a4edaa;box-shadow:inset 0 1px 0 #f5f4ff30,0 30px 68px #0008,0 0 36px #7750d62b}
.card:has(details[open]){z-index:6;background:linear-gradient(130deg,#29204ded,#1a123cfa 40%)}
.card-icon{display:inline-grid;place-items:center;width:44px;height:44px;background:linear-gradient(145deg,#7750d64d,#442ba22b);border:1px solid #a7a0d84d;box-shadow:inset 0 1px 0 #c4c8ff26;border-radius:10px;color:#b2caff}
.card-icon svg{width:25px;height:25px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.card-heading{display:grid;grid-template-columns:44px minmax(0,1fr);gap:14px;align-items:center}
.card-heading .card-number{font-size:9px;letter-spacing:1.3px;color:var(--muted);margin:0 0 5px}
.card h3{font-size:18px;font-weight:500;line-height:1.25;margin:0}
.card p:not(.card-number){font-size:16px;color:#cdc7e1;line-height:1.5;margin:16px 0}
summary{min-height:44px;border-top:1px solid var(--border);padding-top:10px;font-size:12px;color:#d0c3f9;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:12px}
summary::-webkit-details-marker{display:none}
details[open] summary span{transform:rotate(45deg)}
.expanded{max-height:150px;overflow:auto;overscroll-behavior:contain}
.expanded .draft-note{font-size:11px}
.scene-watermark{position:absolute;right:6%;bottom:4%;font-size:100px;line-height:1;color:#a7a0d80a;z-index:-1}
.scene.visible .field,.scene.visible .wave-particles,.scene.visible .wave-ribbon,.scene.visible .wave-traveler,.scene.visible .card{animation-play-state:running}
.scene.traveling .card{animation-play-state:paused;--px:0px!important;--py:0px!important;--rx:0deg!important;--ry:0deg!important;transition:none}
.scene:has(details[open]) .card{animation-play-state:paused}
@keyframes card-float{0%,100%{translate:0 0}50%{translate:0 var(--float)}}
.journey-nav{padding:20px 6%;display:flex;align-items:center;gap:16px;background:var(--bg);border-top:1px solid var(--border);font-size:12px}
.journey-nav .motion-toggle{font-size:11px;margin-left:auto;min-width:128px}
.journey-nav a{margin-left:0;color:var(--muted);padding:12px}
#position{min-width:240px;color:#c4bedd}
.specialist{display:grid;grid-template-columns:35% 1fr;gap:8%;background:radial-gradient(ellipse at 30% 40%,#442ba233,transparent 60%),var(--bg)}
.portrait-frame{width:270px;max-width:100%;border:1px solid #7750d6;border-radius:160px;padding:16px;box-shadow:0 0 60px #7750d61a;justify-self:center}
.portrait-frame img{width:100%;height:auto;display:block}
.specialist h2{max-width:550px}
footer{padding:110px 7% 30px;border-top:1px solid var(--border);background:#060316;min-height:650px}
footer h2{font-size:clamp(40px,5vw,68px);line-height:1.1;font-weight:500;letter-spacing:-2px}
footer>p{color:var(--muted)}
.footer-bottom{display:flex;align-items:center;justify-content:space-between;gap:25px;border-top:1px solid var(--border);margin-top:100px;padding-top:30px;font-size:12px;color:var(--muted)}
.sr-only,.skip:not(:focus){position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.skip:focus{position:fixed;top:10px;left:10px;z-index:20;background:var(--bg);padding:14px}
.enhanced .pin{height:100svh;position:sticky;top:0;overflow:hidden}
.enhanced .track{display:flex;width:max-content;will-change:transform;height:calc(100svh - 85px)}
.enhanced .scene{width:100vw;height:100%;min-height:0;padding-top:35px;padding-bottom:35px;flex-shrink:0}
.enhanced .journey-nav{height:85px}
.paused .scene *,.hidden .scene *{animation-play-state:paused!important}
.paused .cards,.hidden .cards{--px:0px!important;--py:0px!important;--rx:0deg!important;--ry:0deg!important}
@media(min-width:1700px){
.cards{inset:12% 9% 15% 42%}
.card{width:330px}
}
@media(max-height:850px) and (min-width:1100px){
.scene-copy .eyebrow{font-size:9px}
.scene h2{font-size:50px}
.topic-dek{font-size:14px}
.overview{font-size:15px}
.card{width:clamp(260px,20vw,310px);padding:18px}
.card-icon{width:34px;height:34px}
.card-heading .card-number{margin:0 0 4px}
.card-heading{grid-template-columns:34px minmax(0,1fr);gap:12px}
.card h3{font-size:18px}
.card p:not(.card-number){font-size:14px}
.card-1{top:23%}
.cards{inset:8% 5% 10% 41%}
}
@media(max-width:1099px){
header{padding:20px 6%}
.review-tag span{display:none}
.scene{display:block;padding:75px 6%;min-height:0}
.scene-copy{width:100%;max-width:560px}
.scene-copy h2{max-width:18ch;font-size:48px}
.topic-dek{max-width:none}
.overview{max-width:520px}
.cards{position:relative;inset:auto;display:grid;grid-template-columns:1fr 1fr;gap:32px;margin:55px 0 0;min-height:0}
.card,.scene:nth-child(2) .card{position:relative;inset:auto;width:100%;max-width:360px}
.card-0{grid-column:1;grid-row:1;align-self:start}
.card-1{grid-column:2;grid-row:1;margin-top:60px;align-self:start}
.card-2,.scene:nth-child(2) .card-2{grid-column:1/3;grid-row:2;justify-self:center;width:60%}
.specialist{display:grid;min-height:0;grid-template-columns:1fr}
.specialist>div:last-child{order:-1}
.portrait-frame{width:220px}
.specialist h2{max-width:550px}
.journey-nav{flex-wrap:wrap}
#position{min-width:160px}
.footer-bottom{flex-wrap:wrap}
h1{letter-spacing:-2px}
}
@media(max-width:600px){

.review-tag{font-size:9px;letter-spacing:1px}
#pause{font-size:10px;padding:8px 10px}
.scene{padding:65px 7%;min-height:0}
.scene h2{font-size:42px;max-width:12ch}
.scene-copy{width:100%}
.cards{display:flex;position:relative;inset:auto;flex-direction:column;gap:32px;margin:55px 0 0;min-height:0;perspective:none}
.card,.scene:nth-child(2) .card{position:relative;inset:auto;width:94%;max-width:none;padding:24px;margin:0;--tilt:0deg;animation:none;transform:none}
.card-1{align-self:flex-end}
.card-2{align-self:flex-start}
.waves{opacity:.6}
.field{inset:0}
.benefit{max-width:none}
.footer-bottom{margin-top:60px}
footer{padding-top:70px}
.journey-nav{gap:8px}
.journey-nav a{margin-left:0}
.specialist{display:grid}
.specialist .overview{font-size:16px}
}
@media(prefers-reduced-motion:reduce){
*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
.field{opacity:.24}
.cyan{opacity:.08}
.card{transform:rotate(var(--tilt,0deg));translate:none}
.wave-traveler{stroke-dashoffset:400}
}
@supports not (backdrop-filter:blur(1px)){
.glass{background:#1a123c}
}
body:not(.js-ready) .motion-toggle,body:not(.js-ready) #previous,body:not(.js-ready) #next{display:none}
.wave-particles{animation:particle-drift 7s ease-in-out infinite;animation-play-state:paused;transform-origin:60% 50%;stroke-linecap:round;fill:none;opacity:.6}
.particle-far{stroke:#a18bdf;stroke-width:1.1;opacity:.32}
.particle-mid{stroke:#65d5ff;stroke-width:1.6;opacity:.46}
.particle-near{stroke:#eae8fd;stroke-width:2.4;opacity:.65}
@keyframes particle-drift{0%,100%{transform:translate(-.4%,.3%);opacity:.5}50%{transform:translate(.4%,-.3%);opacity:.7}}
@media(prefers-reduced-motion:reduce){
.wave-particles{animation:none!important;transform:none;opacity:.6}
}
.sequence-enabled .cards{inset:0 4% 0 42%;overflow:clip;perspective:1400px}
.sequence-enabled .card{top:0!important;bottom:auto!important;translate:0 var(--sequence-y,110vh);animation:none!important;transform:translate3d(calc(var(--px) * var(--depth,1)),calc(var(--py) * var(--depth,1)),0) rotateX(var(--rx)) rotateY(var(--ry)) rotateZ(var(--tilt,0deg)) scale(var(--layer-scale,1));will-change:translate}
.sequence-enabled .card-0{left:4%;--layer-scale:1.02;--depth:1.1;z-index:3}
.sequence-enabled .card-1{right:1%;--layer-scale:.98;--depth:.7;z-index:2}
.sequence-enabled .card-2{left:22%;--layer-scale:.94;--depth:.45;z-index:1}
.sequence-enabled .card:focus-within,.sequence-enabled .card:has(details[open]){z-index:8}
.sequence-enabled .expanded{max-height:var(--detail-room,130px)}
.sequence-controls{display:none;align-items:center;gap:8px}
.enhanced .sequence-controls:not([hidden]){display:inline-flex}
.sequence-controls button{font-size:11px;padding:8px 10px;min-width:60px}
.sequence-controls progress{width:56px;height:4px;accent-color:#7750d6}
button:disabled{opacity:.4;cursor:default}
body:not(.js-ready) #previous-card,body:not(.js-ready) #next-card{display:none}
#topic-scope-dialog{max-width:560px;width:calc(100% - 40px);border:1px solid #a7a0d84d;border-radius:18px;background:#1a123cf5;color:#f5f4ff;padding:32px;box-shadow:0 30px 100px #0009}
#topic-scope-dialog::backdrop{background:#08051bbf;backdrop-filter:blur(6px)}
#topic-scope-dialog h2{font-size:32px;line-height:1.15;font-weight:500}
#topic-scope-dialog p:not(.eyebrow){color:#c4bedd}
.dialog-close{float:right}
.sequence-enabled .card:hover{z-index:7}
.sequence-enabled .card:focus-within,.sequence-enabled .card:has(details[open]){z-index:8}
.sequence-enabled .card{transform:translate3d(calc(var(--px) * var(--depth,1)),calc(var(--py) * var(--depth,1)),var(--layer-z,0px)) rotateX(var(--rx)) rotateY(var(--ry)) rotateZ(var(--tilt,0deg)) scale(var(--layer-scale,1))}
.sequence-enabled .card-0{--layer-z:24px}
.sequence-enabled .card-1{--layer-z:-18px}
.sequence-enabled .card-2{--layer-z:-48px}
.sequence-enabled .card:focus-within,.sequence-enabled .card:has(details[open]){--layer-z:48px}
/* The six unfinished topics are honest direct-entry shells, not expanded copy. */
.topic-shell .scene-copy{width:34%;max-width:440px}.topic-shell .scene-copy h2{font-size:clamp(34px,3.8vw,56px);overflow-wrap:anywhere}
.shell-notice{width:min(40%,420px);margin-left:auto;padding:28px;color:#c4bedd;line-height:1.7}.shell-notice .eyebrow{font-size:10px;letter-spacing:1.4px}
@media(max-width:1099px){.topic-shell .scene-copy{width:100%;max-width:600px}.shell-notice{width:100%;max-width:600px;margin:40px 0 0}}
/* Avoid allocating full-scene compositor hints for offscreen navigation shells. */
.scene .field{will-change:auto}.scene.visible .field{will-change:transform,opacity}

/* Original transparent Laurel asset; only its empty outside canvas is framed.
   Visible bounds 1693x530+67+145 within the unchanged 1923x818 PNG. */
.brand-plaque{display:inline-block;flex:none;line-height:0;border-radius:16px;text-decoration:none;animation:brand-float 7s ease-in-out infinite}
.brand-glass{display:block;padding:9px 16px;border:1px solid #c5adfa52;border-radius:16px;background:linear-gradient(125deg,#251542ba,#100b25b8);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 10px 28px #03011166,inset 1px 0 0 #b18aff28,inset -1px 0 0 #73deee20,0 0 18px #8c4eea13;transition:transform .3s ease,border-color .3s ease,box-shadow .3s ease}
.brand-art{position:relative;display:block;width:250px;aspect-ratio:1693/530;overflow:hidden}
.brand-art img{position:absolute;width:113.5854%;max-width:none;height:auto;left:-3.9575%;top:-27.3585%}
.brand-plaque:hover .brand-glass,.brand-plaque:focus-visible .brand-glass{transform:translateY(-2px);border-color:#dbc4ffa6;box-shadow:0 12px 30px #03011177,inset 1px 0 0 #b18aff44,inset -1px 0 0 #73deee38,0 0 22px #8c4eea26}
.brand-plaque:focus-visible{outline:2px solid #c7bdff;outline-offset:5px}
.brand-plaque--footer{animation:none}
.brand-plaque--footer .brand-art{width:220px}
.brand-plaque--footer .brand-glass{background:#1b112b7a;border-color:#baa5df33;box-shadow:0 6px 18px #03011144,inset 1px 0 #b18aff12,inset -1px 0 #73deee10;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.paused .brand-plaque,.hidden .brand-plaque{animation-play-state:paused}
@keyframes brand-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
@media(max-width:760px){.brand-art{width:210px}.brand-glass{padding:7px 10px;border-radius:12px}.brand-plaque{border-radius:12px;animation-name:brand-float-mobile}.brand-plaque--footer{animation:none}.brand-plaque--footer .brand-art{width:210px}.brand-plaque:hover .brand-glass,.brand-plaque:focus-visible .brand-glass{transform:translateY(-1px)}}
@keyframes brand-float-mobile{0%,100%{transform:translateY(0)}50%{transform:translateY(-2px)}}
@media(prefers-reduced-motion:reduce){.brand-plaque{animation:none}.brand-glass{transition:none}.brand-plaque:hover .brand-glass,.brand-plaque:focus-visible .brand-glass{transform:none}}
