/* Trinity spatial stage. Solid Matrix-inspired colour fields, no image crossfades. */
:root{--paper:#f7f8fa;--ink:#202c3c;--green:#202c3c;--muted:#687687;--rule:#cbd2dd;--signal:#a9c1b3}
.journey-world,.journey-position{display:none}
.journey-motion{position:fixed;bottom:23px;right:5.5%;z-index:30;background:#f7f8fadd;border:1px solid #8796a6;color:#202c3c;padding:7px 11px;font:8px/1.5 var(--mono);letter-spacing:.5px}
.journey-motion[hidden]{display:none}
.immersive{background:#f7f8fa}.immersive .journey-world{display:block;position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;background:#f7f8fa}
.scene-fallback,.spatial-canvas{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:right bottom}
.journey-world[data-renderer="webgl"] .scene-fallback{display:none}.journey-world[data-renderer="photo"] .spatial-canvas{display:none}
.immersive main{position:relative;z-index:2}.immersive .journey-frame{height:var(--chapter-height,185svh);position:static;isolation:auto;pointer-events:none}
.immersive .journey-extra{display:none}
.immersive .journey-content{position:fixed;inset:0;width:100%;height:100svh;min-height:0;max-height:none;margin:0;padding:120px 8% 85px;border:0;background:transparent;opacity:var(--stage-opacity,0);visibility:hidden;pointer-events:none;overflow-x:hidden;overflow-y:auto;transform:none;scrollbar-width:thin;z-index:2}
.immersive .journey-content.on-stage{visibility:visible;pointer-events:auto}
.immersive .header{position:fixed;left:5.5%;right:5.5%;height:85px;z-index:25;border:0}.immersive .header:before{display:none}
.immersive .header .nav-cta{background:#f7f8fac9;border-color:#8796a6}
.immersive .hero.white-cover{display:flex;align-items:center;padding:110px 5.5% 90px}
.immersive .hero .cover-photo,.immersive .cover-colophon,.immersive .fold-photograph{display:none}
.immersive .white-cover .hero-copy{width:60%;min-height:0;padding:0}
.immersive .white-cover h1{font-size:clamp(60px,6.7vw,108px);line-height:1.03;letter-spacing:-.065em;margin:28px 0 25px}
.immersive .white-cover .hero-lede{font-size:16px;max-width:430px;margin-bottom:32px;color:#687687}
.immersive .hero-bottom{position:static;margin-top:55px;padding:0;font-size:7px}.immersive .hero-bottom span:last-child{display:none}.immersive .hero-copy>*{animation:none}
.immersive .photo-fold.statement{display:flex;align-items:center}
.immersive .fold-heading{display:block;padding:0;width:48%;max-width:660px}
.immersive .fold-heading h2{font-size:clamp(37px,4vw,62px);margin:26px 0;line-height:1.1}
.immersive .fold-copy{max-width:340px}.immersive .fold-copy p{font-size:14px;line-height:1.8;color:#687687}
.immersive .perspective{display:flex;flex-direction:column;justify-content:center;padding:110px 8% 85px}
.immersive .perspective-heading{padding:0;margin-bottom:25px;align-items:center}
.immersive .perspective-heading h2{font-size:clamp(34px,3.4vw,52px);margin:12px 0 0;line-height:1.08}
.immersive .perspective-heading>p{font-size:12px;line-height:1.8;max-width:300px;color:#687687}
.immersive .observation-demo{grid-template-columns:1fr 1fr;min-height:350px;max-height:calc(100svh - 290px);border:1px solid #cbd2dd;box-shadow:none;background:transparent}
.immersive .demo-visual{background:#f7f8fa;padding:18px 22px 14px;overflow:hidden}
.immersive .loop{min-height:0;height:100%;max-height:100%;width:100%;flex:1}
.immersive .demo-story{background:#202c3c;padding:22px 30px 16px}
.immersive .story-content{padding-top:20px}.immersive .story-content h3{font-size:30px;margin:14px 0}.immersive .story-content>p{font-size:12px;line-height:1.75}
.immersive .receipt{background:#2b3b50;border-color:#8796a6;padding:14px;margin-top:18px}.immersive .receipt p{font-size:12px}.immersive .receipt-dot{background:#a9c1b3}
.immersive .next-owner{padding:15px 0}.immersive .next-owner p{font-size:11px}.immersive .demo-footnote{font-size:8px}
.immersive .how-it-works{display:flex;justify-content:center;flex-direction:column}
.immersive .how-heading{align-items:center}.immersive .how-heading h2{font-size:clamp(38px,4.2vw,64px)}
.immersive .how-steps{background:#f7f8fa;border:1px solid #cbd2dd;padding:26px 32px 32px;margin-top:45px;gap:45px}
.immersive .how-steps h3{font-size:23px;margin-top:24px}.immersive .how-steps p{font-size:12px;line-height:1.8}
.immersive .step-icon{background:#e8edf2;box-shadow:3px 4px 0 #8796a6;border-color:#8796a6}
.immersive .connections{display:grid;align-items:center;grid-template-columns:1.1fr 1fr;gap:12%}
.immersive .connections h2{font-size:clamp(38px,4.2vw,64px)}.immersive .connections>div>p{font-size:14px}
.immersive .agent-list{background:#f7f8fa;border:1px solid #cbd2dd;padding:20px 30px}.immersive .agent-list>div{padding:20px 0}.immersive .agent-list>div:first-child{border-top:0}.immersive .agent-mark{box-shadow:none;background:#e8edf2}
.immersive .questions{display:grid;grid-template-columns:.6fr 1fr;gap:12%;align-items:center}
.immersive .questions>div{background:#f7f8fa;border:1px solid #cbd2dd;padding:5px 28px}.immersive .questions details:first-child{border-top:0}.immersive .questions details:last-child{border-bottom:0}.immersive .questions details p{font-size:13px}
.immersive .access{display:grid;align-items:center;grid-template-columns:1fr 1fr;gap:12%}
.immersive .access h2{font-size:clamp(44px,4.8vw,72px)}.immersive .access-form{background:#f7f8fa;border:1px solid #cbd2dd;padding:30px}
.immersive .email-row button{background:#a9c1b3;border-color:#8796a6}.immersive .fullstop{color:#8796a6}
.immersive footer{position:relative;z-index:4;background:#f7f8fa;margin:0;padding:25px 8% 55px;border:0}
.immersive .journey-position{display:flex;position:fixed;bottom:30px;left:5.5%;right:190px;z-index:25;align-items:center;gap:40px;color:#687687;font:8px var(--mono);letter-spacing:1px}
.journey-dots{display:flex;gap:10px;margin-left:auto}.journey-dots button{width:21px;height:22px;position:relative;border:0;background:none;padding:0}.journey-dots button:after{content:'';position:absolute;top:10px;left:1px;right:1px;height:1px;background:#8796a6}.journey-dots button[aria-current]:after{height:3px;top:9px;background:#202c3c}
@media(min-width:701px) and (max-height:780px){
.immersive .journey-content{padding-top:100px;padding-bottom:70px}.immersive .white-cover h1{font-size:64px}.immersive .hero.white-cover{padding-top:105px}
.immersive .perspective-heading{margin-bottom:18px}.immersive .perspective-heading h2{font-size:34px}.immersive .observation-demo{min-height:340px;max-height:calc(100svh - 240px)}.immersive .demo-story{padding:18px 24px 12px}.immersive .story-content{padding-top:12px}.immersive .story-content h3{font-size:25px}.immersive .story-content>p{font-size:11px}.immersive .receipt{padding:10px;margin-top:12px}.immersive .next-owner{padding:10px 0}.immersive .next-owner p{font-size:10px}.immersive .how-steps{margin-top:25px;padding-top:18px;padding-bottom:20px}.immersive .how-heading h2{font-size:42px}.immersive .how-steps h3{margin-top:18px}.immersive .questions details{padding:16px 0}
}
@media(max-width:700px){
.immersive .header{left:7%;right:7%;height:74px}.immersive .header .brand img.original-wordmark{width:100px}.immersive .header .nav-cta{font-size:9px}
.immersive .journey-content{padding:110px 7% 85px;height:100svh;min-height:0;max-height:100svh}
.immersive .hero.white-cover{padding:125px 7% 90px;align-items:flex-start}.immersive .white-cover .hero-copy{width:100%;min-height:0}.immersive .white-cover h1{font-size:clamp(42px,10.4vw,66px);margin:25px 0 22px}.immersive .white-cover .hero-lede{font-size:14px;line-height:1.8;max-width:290px}.immersive .hero-actions{gap:20px}.immersive .hero-actions .primary{font-size:9px;padding:13px 14px}.immersive .hero-actions .text-link{font-size:9px}.immersive .hero-bottom{margin-top:45px;opacity:.8;max-width:270px}.immersive .hero-bottom .tiny{font-size:6px}
.immersive .photo-fold.statement{align-items:flex-start;padding-top:130px}.immersive .fold-heading{width:100%;max-width:340px}.immersive .fold-heading h2{font-size:36px}.immersive .fold-copy p{font-size:13px;max-width:290px}.immersive .fold-copy{background:#f7f8fada;padding:12px;margin-left:-12px}
.immersive .perspective{justify-content:flex-start;padding-top:95px}.immersive .perspective-heading{display:block;margin-bottom:22px}.immersive .perspective-heading h2{font-size:35px}.immersive .perspective-heading>p{font-size:11px;max-width:270px;margin:15px 0 0}
.immersive .observation-demo{display:block;min-height:0;max-height:none}.immersive .demo-visual{display:none}.immersive .demo-story{padding:24px}.immersive .demo-tabs{gap:24px}.immersive .demo-tabs button{font-size:11px}.immersive .story-content{padding-top:25px}.immersive .story-content h3{font-size:30px}.immersive .story-content>p{font-size:12px}.immersive .receipt p{font-size:12px}.immersive .next-owner{display:block}.immersive .next-owner p{font-size:11px}.immersive .demo-footnote{font-size:9px}
.immersive .how-it-works{justify-content:flex-start}.immersive .how-heading{display:block}.immersive .how-heading h2{font-size:35px;margin-top:20px}.immersive .how-steps{padding:20px;margin-top:25px;gap:20px;grid-template-columns:1fr}.immersive .how-steps li{padding-top:12px}.immersive .step-top{height:32px}.immersive .step-icon{width:32px;height:32px}.immersive .step-icon svg{width:25px;height:25px}.immersive .how-steps h3{font-size:20px;margin:14px 0 9px}.immersive .how-steps p{font-size:11px;line-height:1.75}
.immersive .connections{display:flex;flex-direction:column;align-items:stretch;justify-content:center;gap:22px}.immersive .connections h2{font-size:35px;margin:18px 0}.immersive .connections>div>p{font-size:12px}.immersive .agent-list{padding:15px 20px}.immersive .agent-list>div{padding:15px 0;font-size:20px}.immersive .agent-list .connection-note{font-size:9px}.immersive .agent-mark{width:35px;height:35px}
.immersive .questions{display:flex;justify-content:center;flex-direction:column;align-items:stretch;gap:28px}.immersive .questions>div{padding:8px 20px}.immersive .questions details{padding:20px 0}.immersive .questions details p{font-size:12px;padding-right:0}
.immersive .access{display:flex;flex-direction:column;justify-content:center;align-items:stretch;gap:25px}.immersive .access h2{font-size:40px}.immersive .access-form{padding:22px}.immersive .email-row input{font-size:20px}.immersive .email-row button{height:44px;min-width:44px}.immersive .consent{font-size:9px!important}
.immersive .journey-position{left:7%;right:125px;bottom:25px;font-size:6px;letter-spacing:.7px;gap:12px}.journey-dots{gap:3px}.journey-dots button{width:10px}.journey-motion{right:7%;bottom:17px;font-size:6px;padding:6px 8px}
.immersive footer{padding:25px 7% 55px}
}
@media(prefers-reduced-motion:reduce){.journey-world,.journey-position{display:none!important}.journey-frame{height:auto!important}.journey-content{opacity:1!important;transform:none!important}}

/* Reading surfaces stay opaque as the camera passes the set. */
.immersive .perspective-heading>p{background:#f7f8fa;padding:12px 16px}
.immersive .connections>div:first-child,.immersive .access>div:first-child,.immersive .how-heading{background:#f7f8faeF;padding:18px 22px}

/* Trinity warmth: upholstery reds complement the cool observation greens. */
:root{--action-blue:#3155b7;--action-blue-hover:#24428f;--oxblood:#4a1420;--crimson:#9b5861;--umber:#6c4b3a;--rose-stone:#e8d8d4}
.hero-actions .primary{background:var(--action-blue);color:#fff}
.hero-actions .primary:hover{background:var(--action-blue-hover)}
.hero .fullstop,.hero .asterisk,.access h2>span{color:var(--crimson)}
.immersive .header .nav-cta{color:var(--action-blue);border-color:#b2c0e0;background:#fff}
.immersive .email-row button{background:var(--action-blue);border-color:var(--action-blue);color:#fff}
.immersive .email-row button:hover{background:var(--action-blue-hover)}
.journey-dots button[aria-current]:after{background:var(--green)}
a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible{outline:2px solid var(--action-blue);outline-offset:5px}

/* One restrained palette across the staged and static views. */
body{background:var(--paper);color:var(--ink)}
.demo-story{background:#202c3c}.receipt{background:#2b3b50}.receipt-dot{background:#a9c1b3}
.header .nav-cta{color:var(--action-blue);border-color:#b2c0e0;background:#f7f8fa}
.email-row button{background:var(--action-blue);color:#fff}
.step-icon,.agent-mark{background:#e8edf2;border-color:#cbd2dd}

/* The same space gradually moves from daylight into a blue night. */
.immersive{--stage-bg:#f7f8fa;--stage-surface:#f7f8fa;--stage-ink:#202c3c;--stage-muted:#687687;--stage-rule:#cbd2dd;--stage-link:#3155b7;background:var(--stage-bg);color:var(--stage-ink)}
.immersive .journey-world{background:var(--stage-bg)}
.immersive .journey-content{color:var(--stage-ink)}
.immersive .hero-lede,.immersive .fold-copy p,.immersive .perspective-heading>p,.immersive .connections>div>p,.immersive .access-form>p,.immersive .how-steps p,.immersive .questions details p,.immersive .journey-position,.immersive .hero-bottom,.immersive .agent-list small,.immersive .connection-note{color:var(--stage-muted)}
.immersive .white-cover .hero-lede{color:var(--stage-muted)}
.immersive .demo-visual,.immersive .how-steps,.immersive .agent-list,.immersive .questions>div,.immersive .access-form,.immersive .perspective-heading>p,.immersive .connections>div:first-child,.immersive .access>div:first-child,.immersive .how-heading,.immersive .fold-copy{background:var(--stage-surface);border-color:var(--stage-rule)}
.immersive .header .nav-cta{background:var(--stage-surface);color:var(--stage-link);border-color:var(--stage-rule)}
.immersive .header .brand img,.immersive footer .brand img{filter:invert(var(--night,0))}
.immersive .journey-motion{background:var(--stage-surface);border-color:var(--stage-rule);color:var(--stage-muted)}
.immersive .journey-dots button:after{background:var(--stage-muted)}
.immersive .journey-dots button[aria-current]:after{background:var(--stage-link)}
.immersive .agent-mark,.immersive .step-icon{background:var(--stage-bg);color:var(--stage-ink);border-color:var(--stage-rule);box-shadow:3px 4px 0 var(--stage-rule)}
.immersive .email-row{border-color:var(--stage-rule)}
.immersive .email-row input{color:var(--stage-ink)}
.immersive .email-row input::placeholder{color:var(--stage-muted)}
.immersive .form-note,.immersive .consent{color:var(--stage-muted)}
.immersive details,.immersive .agent-list>div{border-color:var(--stage-rule)}
.immersive footer{background:var(--stage-bg);color:var(--stage-muted)}
.immersive a:focus-visible,.immersive button:focus-visible,.immersive input:focus-visible,.immersive summary:focus-visible{outline-color:var(--stage-link)}

.immersive .access-form .consent,.immersive .access-form .consent span,.immersive .access-form .consent a{color:var(--stage-muted)}

.immersive .header nav{color:var(--header-ink,var(--stage-ink))}
.immersive .header .brand img{filter:invert(var(--header-night,0))}

/* Scroll is depth travel. Content dissolves on the stationary stage. */
.immersive{scrollbar-width:none}
.immersive::-webkit-scrollbar{width:0}
.immersive .journey-content{transform:scale(var(--stage-scale,1));transform-origin:38% 48%;will-change:opacity,transform}
.immersive footer{position:fixed;left:0;right:0;bottom:52px;background:transparent;padding:10px 5.5%;opacity:0;pointer-events:none;visibility:hidden}
.immersive.journey-end footer{opacity:1;pointer-events:auto;visibility:visible}
.immersive footer .brand{display:none}
.immersive .journey-content{overscroll-behavior-y:auto}
@media(min-width:701px){.immersive .journey-content{overflow-y:hidden}}
@media(max-width:700px){.immersive footer{bottom:48px;padding:8px 7%;font-size:9px}.immersive .access{padding-bottom:130px}}

/* Keep the environment open around quiet, readable content planes. */
.immersive .fold-copy{padding:16px 20px;background:var(--stage-surface)}
.immersive .journey-content{transform-origin:40% 50%;backface-visibility:hidden}
.immersive .journey-world canvas{image-rendering:auto}

/* The interface stays still while the visitor travels through the room. */
.immersive .journey-content{transform:none;will-change:opacity}
.immersive.journey-travelling .journey-position:before{content:'';width:5px;height:5px;border-radius:50%;background:var(--stage-link)}

/* A quiet red-pill invitation; blue remains the colour of exploration. */
:root{--interest-red:#a3293d;--interest-red-hover:#852035}
.hero-actions .primary,.immersive .hero-actions .primary,
.header .nav-cta,.immersive .header .nav-cta{background:var(--interest-red);color:#fff;border:1px solid var(--interest-red);border-radius:999px;box-shadow:inset 0 1px 0 #ffffff26,0 3px 0 #621b2a18}
.hero-actions .primary:hover,.immersive .hero-actions .primary:hover,
.header .nav-cta:hover,.immersive .header .nav-cta:hover{background:var(--interest-red-hover);border-color:var(--interest-red-hover)}
.hero-actions .primary{display:inline-flex;align-items:center;gap:14px}
.pill-symbol{display:inline-block;width:21px;height:9px;border:1px solid #ffffffb3;border-radius:99px;transform:rotate(-32deg);position:relative;box-shadow:inset 0 2px 0 #ffffff26}
.pill-symbol:after{content:'';position:absolute;left:50%;top:-1px;height:9px;border-left:1px solid #ffffff75}
.email-row button,.immersive .email-row button{background:var(--interest-red);border-color:var(--interest-red);border-radius:50%;color:#fff}
.email-row button:hover,.immersive .email-row button:hover{background:var(--interest-red-hover);border-color:var(--interest-red-hover)}
.hero-actions .text-link,.immersive .hero-actions .text-link{color:var(--action-blue)}
.hero-actions .primary:focus-visible,.header .nav-cta:focus-visible{outline-color:var(--interest-red);outline-offset:5px}

/* Matrix material study: celadon whites, olive shadow, pine ink. One red invitation. */
:root{--paper:#f0f2e8;--ink:#1e3124;--green:#294b33;--muted:#485949;--rule:#bdc7b3;--signal:#a2b394;--interest-red:#9e3526;--interest-red-hover:#7f2a1e}
body{color:var(--ink);background:var(--paper)}
.hero .fullstop,.hero .asterisk,.access h2>span,.immersive .fullstop{color:#506b48}
.header .nav-cta,.immersive .header .nav-cta{background:var(--stage-surface,var(--paper));color:var(--stage-link,var(--green));border:1px solid var(--stage-rule,var(--rule));border-radius:2px;box-shadow:none}
.header .nav-cta:hover,.immersive .header .nav-cta:hover{background:#d7dfca;border-color:#6b8262;color:#294b33}
.email-row button,.immersive .email-row button{background:#31503a;border-color:#31503a;color:#f0f2e8;box-shadow:none}
.email-row button:hover,.immersive .email-row button:hover{background:#243e2c;border-color:#243e2c}
.hero-actions .text-link,.immersive .hero-actions .text-link{color:var(--stage-link,var(--green))}
.hero-actions .text-link:hover>span{color:#4f6d9a}
.hero-actions .primary,.immersive .hero-actions .primary{box-shadow:inset 0 1px 0 #e8c8a64d,0 3px 0 #44231c20}
.demo-story,.immersive .demo-story{background:#243b2c}.receipt,.immersive .receipt{background:#304a37;border-color:#6c8065}
.receipt-dot,.immersive .receipt-dot{background:#abbc8e}
.immersive .journey-world:after{content:'';position:absolute;inset:0;pointer-events:none;opacity:.035;mix-blend-mode:multiply;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.72' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%236a715b' filter='url(%23n)' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}
a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible{outline-color:#476a45}

/* The silhouette carries the pill reference; no pictogram. */
.hero-actions .primary,.immersive .hero-actions .primary{border-radius:999px;padding:16px 29px;min-height:48px;gap:24px}

/* The pill silhouette alone, with a solid oxblood surface. */
.hero-actions .primary,.immersive .hero-actions .primary{
 position:relative;overflow:hidden;border-radius:999px;min-width:192px;min-height:54px;
 padding:17px 29px;border:1px solid #a63825;background:#a63825;color:#fff4e9;
 box-shadow:none;text-shadow:none;transition:background .2s;
}
.hero-actions .primary:before,.hero-actions .primary:after{content:none}
.hero-actions .primary:hover,.immersive .hero-actions .primary:hover{background:#b33c29;border-color:#b33c29;box-shadow:none}

/* Wordmark study: the hero's Space Grotesk, retaining the family symbol. */
.header .brand,footer .brand{display:inline-flex;align-items:center;gap:8px;letter-spacing:normal;line-height:1}
.header .brand .brand-symbol,footer .brand .brand-symbol{width:24px;height:24px;flex:none}
.brand-word{font-family:'Space Grotesk',Arial,sans-serif;font-size:26px;font-weight:400;line-height:1;letter-spacing:-.055em;display:block;transform:translateY(-1px)}
.immersive .header .brand-word{color:var(--header-ink,var(--ink))}
@media(max-width:700px){.header .brand .brand-symbol{width:21px;height:21px}.brand-word{font-size:24px}}

/* Keep the early-access label on a single line at every breakpoint. */
.hero-actions .primary,.immersive .hero-actions .primary{white-space:nowrap;width:max-content;flex-shrink:0}
.header .nav-cta{white-space:nowrap}
