/* Animated brand entrance. Decorative water routes are CSS, not images. */
.audience-page { color:#edf5f3; background:#040f19; --aqua:#83e8db; --scroll-progress:0; }
.audience-page .wrap { width:min(1280px,calc(100% - 96px)); }
.gateway-header { position:absolute; inset:0 0 auto; z-index:5; display:flex; align-items:center; justify-content:space-between; min-height:100px; border-bottom:1px solid #b9f2ef24; }
.audience-page .brand-lockup { background:transparent; overflow:visible; padding:10px 0; }
.gateway-header nav { display:flex; gap:32px; }
.gateway-header nav a { display:flex; align-items:center; min-height:44px; gap:12px; font-size:13px; }
.gateway-header nav span { padding:4px 8px; border:1px solid #85b7bb60; color:#bbd8d9; font-size:10px; }
.gateway-hero { position:relative; isolation:isolate; min-height:760px; overflow:hidden; background:radial-gradient(ellipse at 90% 30%,#0a3c48 0,transparent 55%),#040f19; }
.gateway-hero::after { content:""; position:absolute; inset:0; z-index:-1; pointer-events:none; background:linear-gradient(180deg,#040f19cc,transparent 140px),linear-gradient(90deg,#040f19 0,#040f19dc 30%,transparent 62%),linear-gradient(0deg,#040f19,transparent 24%); }
.gateway-hero-inner { position:relative; padding-top:188px; padding-bottom:95px; transform:translate3d(0,calc(var(--scroll-progress) * -34px),0); }
.gateway-eyebrow { margin:0; color:var(--aqua); font-size:10px; font-weight:600; letter-spacing:.2em; line-height:1.7; }
.gateway-hero .gateway-eyebrow::before { content:""; display:inline-block; width:26px; height:1px; margin:0 12px 4px 0; background:var(--aqua); }
.gateway-hero h1 { margin:30px 0 36px; font-size:clamp(52px,6.5vw,94px); line-height:1.19; letter-spacing:-.055em; font-weight:600; }
.gateway-hero h1>span,.gateway-hero h1>em { display:inline-block; }
.gateway-hero h1 em { font-style:normal; color:var(--aqua); background:linear-gradient(105deg,#a7f5e1 10%,#55c7d5 40%,#edfff8 55%,#64d0c5 80%); background-size:200% 100%; background-clip:text; -webkit-background-clip:text; -webkit-text-fill-color:transparent; }
.gateway-hero-bottom { display:flex; align-items:end; justify-content:space-between; gap:30px; }
.gateway-hero-bottom>p { margin:0; font-size:15px; line-height:2.1; color:#bbccd1; }
.gateway-hero-actions { display:flex; flex-direction:column; align-items:flex-end; gap:16px; }
.gateway-hero-actions>a { display:flex; align-items:center; justify-content:space-between; gap:40px; min-height:52px; padding:12px 0; border-bottom:1px solid #76b4b5; font-size:13px; }
.gateway-hero-actions>a span { font-size:23px; color:var(--aqua); }
.gateway-motion-toggle { min-height:44px; padding:8px 12px; border:1px solid #8bafb66b; border-radius:4px; background:#081b27; color:#c6dde0; font:inherit; font-size:13px; cursor:pointer; text-decoration:underline; text-underline-offset:5px; }
.gateway-motion-toggle[hidden] { display:none; }
.gateway-hero-rail { position:absolute; bottom:35px; left:0; right:0; display:flex; align-items:center; gap:26px; color:#8facb5; font-size:8px; letter-spacing:.19em; }
.gateway-hero-rail>i { flex:1; height:1px; position:relative; overflow:hidden; background:#aacbd52b; }
.gateway-hero-rail>i::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,transparent,#83e8db,transparent); transform:translateX(-100%); }
.gateway-flow { position:absolute; z-index:-2; inset:0; pointer-events:none; transform:translate3d(0,calc(var(--scroll-progress) * 85px),0); }
.flow-halo { position:absolute; width:660px; height:600px; left:57%; top:65px; border-radius:50%; background:radial-gradient(ellipse,#40c9c52c,transparent 65%); }
.flow-routes { position:absolute; width:1200px; height:800px; left:30%; top:-10px; }
.flow-surface { display:block; width:100%; height:100%; overflow:visible; }
.current-lines { stroke:#9ae2d4; stroke-width:.8; opacity:.25; }
.current-pulses { stroke:url(#current-light); stroke-width:2; stroke-linecap:round; filter:drop-shadow(0 0 7px #81dbc75c); }
.current-pulses use { stroke-dasharray:260 1800; stroke-dashoffset:calc(var(--current) * 390); }
.flow-coordinate { position:absolute; right:24px; top:400px; color:#8acece; font-size:9px; letter-spacing:.2em; writing-mode:vertical-rl; }
.gateway-choices { position:relative; padding-top:42px; padding-bottom:28px; scroll-margin-top:24px; }
.gateway-section-heading { display:flex; justify-content:space-between; align-items:end; gap:24px; margin-bottom:34px; }
.gateway-section-heading h2 { margin:13px 0 0; font-size:clamp(26px,3vw,40px); font-weight:500; letter-spacing:-.04em; }
.gateway-section-heading>p { margin:0; color:#a5bcc4; font-size:13px; line-height:1.8; }
.audience-options { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:26px; perspective:1600px; }
.audience-option { display:flex; flex-direction:column; position:relative; isolation:isolate; min-width:0; border:1px solid #57798277; background:#0a202e; transition:transform .6s cubic-bezier(.2,.7,.2,1),box-shadow .6s ease,border-color .3s ease; }
.audience-option::before { content:""; position:absolute; z-index:2; inset:0; pointer-events:none; opacity:0; background:radial-gradient(ellipse at var(--light-x,50%) var(--light-y,20%),#b6ffee16,transparent 60%); transition:opacity .4s ease; }
.audience-option::after { content:""; position:absolute; inset:-1px -1px auto; height:2px; background:linear-gradient(90deg,transparent,#97f7de,#6cbdff,transparent); transform:scaleX(.12); opacity:0; transition:transform .7s ease,opacity .4s ease; pointer-events:none; }
.audience-option-individual { background:#ecf3ef; color:#092735; border-color:#e6f4ec; }
.gateway-card-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:28px 32px 0; }
.audience-option-individual .gateway-eyebrow { color:#28787b; }
.gateway-status { color:#bce6e4; font-size:10px; line-height:1.6; padding:5px 10px; border:1px solid #598287; }
.audience-option-individual .gateway-status { color:#236a64; border-color:#7faeaa; }
.gateway-card-copy { padding:27px 32px 25px; }
.gateway-for { margin:0 0 10px; color:#a9c3cc; font-size:12px; line-height:1.8; }
.gateway-card-copy h3 { margin:0; font-size:37px; font-weight:500; letter-spacing:-.04em; line-height:1.3; }
.gateway-card-copy>p:last-child { margin:18px 0 0; color:#bbd0d6; font-size:14px; line-height:1.9; }
.audience-option-individual .gateway-for,.audience-option-individual .gateway-card-copy>p:last-child { color:#476776; }
.gateway-app-visual { position:relative; height:300px; overflow:hidden; margin:0 18px; background:radial-gradient(ellipse at 70% 60%,#bcdfd9,transparent 66%),#e1eeea; }
.gateway-visual-words { position:absolute; top:62px; left:27px; display:flex; flex-direction:column; font-size:clamp(23px,2.3vw,34px); line-height:1.2; font-weight:600; letter-spacing:-.035em; color:#297b78; }
.gateway-phone { position:absolute; width:auto; height:263px; top:18px; right:45px; border:4px solid #102c39; border-radius:18px; box-shadow:10px 14px 24px #0a26392c; }
.gateway-watch { position:absolute; width:86px; height:auto; right:149px; bottom:25px; border:3px solid #102c39; padding:3px; border-radius:24px; background:#102c39; box-shadow:8px 12px 20px #0a263920; }
.gateway-phone,.gateway-watch { transition:transform .7s cubic-bezier(.2,.7,.2,1); }
.gateway-team-visual { display:grid; align-items:center; height:300px; margin:0 18px; padding:22px; background:radial-gradient(ellipse at 40% 0,#174d56,transparent 75%),#071723; }
.gateway-card-detail { padding:14px 32px 24px; }
.gateway-visual-note { min-height:20px; margin:0; color:#a5c1cb; font-size:10px; line-height:1.8; }
.audience-option-individual .gateway-visual-note { color:#516f7b; }
.gateway-card-detail ul { display:flex; flex-wrap:wrap; gap:7px; padding:0; margin:17px 0 0; list-style:none; }
.gateway-card-detail li { padding:5px 9px; border:1px solid #668d954c; color:#c1d8dc; font-size:10px; line-height:1.6; }
.audience-option-individual .gateway-card-detail li { color:#426673; border-color:#8daeb277; }
.gateway-card-cta { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:20px 0; margin:auto 32px 0; border-top:1px solid #668d954c; font-size:14px; }
.audience-option-individual .gateway-card-cta { border-color:#7c9fa55c; }
.gateway-arrow { display:grid; place-items:center; width:42px; height:42px; border:1px solid #88b7be7a; border-radius:50%; color:var(--aqua); font-family:Arial,sans-serif; font-size:24px; transition:transform .4s ease,background .4s ease; }
.audience-option-individual .gateway-arrow { color:#17685f; border-color:#79a9a2; }
.gateway-belief { position:relative; padding-top:100px; padding-bottom:100px; text-align:center; }
.gateway-belief::before { content:""; display:block; width:1px; height:58px; background:linear-gradient(transparent,#78d7c7); margin:0 auto 30px; }
.gateway-belief>p:nth-child(2) { margin:21px 0 15px; font-size:clamp(22px,2.6vw,36px); font-weight:500; letter-spacing:-.04em; line-height:1.65; }
.gateway-belief>span { color:#91aeb9; font-size:13px; }
.gateway-mobile-break { display:none; }
.gateway-footer { display:flex; flex-direction:row; align-items:center; gap:30px; border-top:1px solid #7aafb33c; background:transparent; color:#a0bdc7; }
.gateway-footer nav { display:flex; flex-wrap:wrap; gap:26px; margin-left:auto; }
.gateway-footer nav a { display:inline-flex; align-items:center; min-height:44px; font-size:11px; text-decoration:none; }
.gateway-footer small { font-size:10px; }
.audience-page a:focus-visible,.gateway-motion-toggle:focus-visible { outline:3px solid #76dcca; outline-offset:6px; }
.audience-option-individual:focus-visible { outline-color:#f7fff9; }
@media (hover:hover) {
 .audience-option:hover { border-color:#90e1d2; box-shadow:0 24px 80px #0004; }
 .audience-option:hover::after { opacity:1; transform:scaleX(1); }
 .audience-option:hover .gateway-arrow { background:#c4f5e8; color:#103a3c; }
 .gateway-header a:hover,.gateway-footer a:hover { color:var(--aqua); }
}
[data-motion] .current-pulses use { animation:current-travel calc(9s + var(--current) * 2s) cubic-bezier(.45,0,.25,1) infinite; animation-delay:calc(var(--current) * -3s); }
[data-motion] .flow-halo { animation:flow-glow 7s ease-in-out infinite alternate; }
[data-motion] .gateway-hero h1 em { animation:type-light 9s ease-in-out infinite alternate; }
[data-motion] .gateway-hero-rail>i::after { animation:rail-travel 5s ease-in-out infinite; }
[data-motion="paused"] *,[data-motion="paused"] *::before,[data-motion="paused"] *::after { animation-play-state:paused!important; transition:none!important; }
[data-hero-running="false"] .gateway-hero *,[data-hero-running="false"] .gateway-hero *::before,[data-hero-running="false"] .gateway-hero *::after { animation-play-state:paused!important; }
@keyframes current-travel { from { stroke-dashoffset:2060; } to { stroke-dashoffset:0; } }
@keyframes flow-glow { from { opacity:.5; transform:scale(.9); } to { opacity:1; transform:scale(1.13); } }
@keyframes type-light { to { background-position:100% 50%; } }
@keyframes rail-travel { to { transform:translateX(100%); } }
@media (prefers-reduced-motion:no-preference) {
 .gateway-hero h1>span { animation:headline-enter .8s cubic-bezier(.2,.7,.2,1) both; }
 @keyframes headline-enter { from { opacity:0; transform:translateY(24px); clip-path:inset(0 0 100%); } to { opacity:1; transform:translateY(0); clip-path:inset(0); } }
 [data-motion="active"] .audience-option[data-entered="false"] { opacity:0; transform:translateY(55px) rotateX(4deg); }
 [data-motion="active"] .audience-option[data-entered="true"] { animation:card-enter .8s cubic-bezier(.2,.7,.2,1) both; }
 @keyframes card-enter { from { opacity:0; translate:0 45px; } to { opacity:1; translate:0 0; } }
}
@media (hover:hover) and (pointer:fine) {
 [data-motion="active"] .audience-option:hover { transform:translateY(-8px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg)); }
 [data-motion="active"] .audience-option[data-hover]::before { opacity:1; }
 [data-motion="active"] .audience-option:hover .gateway-phone { transform:translate(3px,-10px) rotate(2deg); }
 [data-motion="active"] .audience-option:hover .gateway-watch { transform:translate(-5px,-3px); }
 [data-motion="active"] .audience-option:hover .gateway-arrow { transform:rotate(45deg); }
}
@media (max-width:1000px) {
 .audience-page .wrap { width:calc(100% - 56px); }
 .gateway-hero { min-height:690px; }
 .gateway-hero-inner { padding-top:180px; }
 .flow-routes { left:21%; opacity:.85; }
 .gateway-card-heading { padding:24px 24px 0; }
 .gateway-card-copy { padding:24px; }
 .gateway-card-copy h3 { font-size:31px; }
 .gateway-card-copy>p:last-child br { display:none; }
 .gateway-card-detail { padding-inline:24px; }
 .gateway-card-cta { margin-inline:24px; }
 .gateway-phone { height:236px; right:20px; top:32px; }
 .gateway-watch { width:73px; right:106px; }
 .gateway-visual-words { font-size:22px; left:18px; top:48px; }
 .gateway-team-visual { padding:12px; }
}
@media (max-width:760px) {
 .audience-page .wrap { width:calc(100% - 40px); }
 .gateway-header { min-height:82px; }
 .gateway-header .brand-lockup { width:112px; height:66px; }
 .gateway-header nav { gap:18px; }
 .gateway-header nav a { font-size:12px; gap:6px; }
 .gateway-header nav span { font-size:9px; padding:3px 5px; }
 .gateway-hero { min-height:650px; }
 .gateway-hero-inner { padding-top:190px; padding-bottom:90px; }
 .gateway-hero h1 { margin:24px 0; font-size:clamp(38px,10.7vw,72px); }
 .gateway-hero::after { background:linear-gradient(180deg,#040f19a8,transparent 140px),linear-gradient(90deg,#040f19c9,transparent),linear-gradient(0deg,#040f19 3%,transparent 75%); }
 .gateway-flow { opacity:.8; }
 .flow-routes { left:7%; top:40px; width:900px; height:600px; opacity:.75; }
 .flow-coordinate { display:none; }
 .flow-halo { left:0; top:-40px; width:100%; height:450px; }
 .gateway-hero-bottom { display:block; }
 .gateway-hero-bottom>p { font-size:13px; }
 .gateway-hero-actions { flex-direction:row; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:10px; margin-top:24px; }
 .gateway-hero-actions>a { font-size:12px; gap:24px; min-height:48px; }
 .gateway-motion-toggle { min-height:44px; padding-inline:12px; font-size:13px; }
 .gateway-hero-rail { bottom:25px; gap:16px; font-size:7px; }
 .gateway-choices { padding-top:20px; }
 .gateway-section-heading { display:block; margin-bottom:28px; }
 .gateway-section-heading h2 { font-size:27px; }
 .gateway-section-heading>p { margin-top:14px; font-size:12px; }
 .audience-options { grid-template-columns:1fr; gap:24px; }
 .gateway-card-copy h3 { font-size:34px; }
 .gateway-app-visual,.gateway-team-visual { height:250px; margin-inline:12px; }
 .gateway-phone { height:224px; top:12px; right:22px; }
 .gateway-watch { width:72px; right:105px; bottom:18px; }
 .gateway-visual-words { top:52px; font-size:25px; }
 .gateway-team-visual { padding:17px; }
 .gateway-card-detail { padding-bottom:20px; }
 .gateway-card-cta { padding-block:17px; font-size:13px; }
 .gateway-belief { padding-block:58px; }
 .gateway-belief::before { height:40px; }
 .gateway-belief>p:nth-child(2) { font-size:clamp(20px,6.3vw,25px); }
 .gateway-mobile-break { display:block; }
 .gateway-footer { display:grid; grid-template-columns:1fr auto; gap:10px; padding-block:20px; }
 .gateway-footer nav { grid-row:2; grid-column:1 / -1; margin:0; gap:20px; }
 .gateway-footer small { grid-column:2; grid-row:1; }
}
@media (max-width:350px) {
 .audience-page .wrap { width:calc(100% - 32px); }
 .gateway-header .brand-lockup { width:94px; }
 .gateway-header nav { gap:11px; }
 .gateway-hero h1 { font-size:37px; }
 .gateway-hero-actions { gap:6px; }
 .gateway-hero-actions>a { font-size:11px; gap:12px; }
 .gateway-card-heading { padding-inline:20px; }
 .gateway-card-copy,.gateway-card-detail { padding-inline:20px; }
 .gateway-card-cta { margin-inline:20px; }
 .gateway-visual-words { font-size:20px; left:13px; }
 .gateway-phone { right:10px; }
 .gateway-watch { right:94px; width:62px; }
 .gateway-team-visual { padding:10px; }
 .gateway-section-heading h2 { font-size:24px; }
}
@media (prefers-reduced-motion:reduce) {
 html { scroll-behavior:auto; }
 .audience-page *,.audience-page *::before,.audience-page *::after { transition:none!important; }
}

/* A single current follows the visitor from the opening into the two paths. */
.audience-page { --journey-rgb:109,224,208; --journey-progress:0; --journey-y:0px; --arrival:0; transition:background-color 1s ease; }
.audience-gateway { position:relative; isolation:isolate; }
.gateway-journey { position:absolute; inset:0; overflow:hidden; pointer-events:none; z-index:-1; }
.journey-atmosphere { position:absolute; top:0; left:0; width:100%; height:850px; background:radial-gradient(ellipse at 50% 50%,rgba(var(--journey-rgb),.17),transparent 65%); transform:translate3d(0,calc(var(--journey-y) - 425px),0); transition:background .9s ease; }
.journey-track { position:absolute; top:640px; bottom:285px; left:50%; width:1px; background:linear-gradient(transparent,rgba(var(--journey-rgb),.2) 12%,rgba(var(--journey-rgb),.2) 90%,transparent); }
.journey-trace { position:absolute; inset:0; background:linear-gradient(transparent,rgba(var(--journey-rgb),.65)); transform-origin:top; transform:scaleY(var(--journey-progress)); }
.journey-head { position:absolute; top:calc(var(--journey-progress) * 100%); left:-3px; width:7px; height:7px; border-radius:50%; background:#d7fff3; box-shadow:0 0 18px 4px rgba(var(--journey-rgb),.65),0 0 60px 12px rgba(var(--journey-rgb),.2); opacity:var(--journey-started,0); }
.audience-page[data-audience="individual"] { --journey-rgb:157,246,223; background-color:#082323; }
.audience-page[data-audience="team"] { --journey-rgb:77,180,224; background-color:#071c30; }
.journey-atmosphere::before,.journey-atmosphere::after { content:""; position:absolute; inset:0; opacity:0; transition:opacity 1s ease; }
.journey-atmosphere::before { background:radial-gradient(ellipse at 25% 50%,#9df6df30,transparent 70%); }
.journey-atmosphere::after { background:radial-gradient(ellipse at 75% 50%,#4db4e438,transparent 70%); }
[data-audience="individual"] .journey-atmosphere::before,[data-audience="team"] .journey-atmosphere::after { opacity:1; }
.gateway-choices { transform-origin:50% 0; }
[data-motion="active"] .gateway-choices { transform:translate3d(0,calc((1 - var(--choice-progress,1)) * 40px),0) scale(calc(.97 + var(--choice-progress,1) * .03)); }
[data-motion="active"] .gateway-hero-inner { transform:translate3d(0,calc(var(--scroll-progress) * -85px),0); }
.gateway-belief::before { background:linear-gradient(transparent,rgba(var(--journey-rgb),.8)); box-shadow:0 0 calc(var(--arrival) * 24px) rgba(var(--journey-rgb),.7); }
.gateway-belief>p:nth-child(2) { text-shadow:0 0 calc(var(--arrival) * 32px) rgba(var(--journey-rgb),.3); }
[data-motion="paused"] .gateway-journey { opacity:.35; }
[data-motion="paused"] .journey-head { display:none; }
@media (max-width:760px) {
 .journey-track { left:9px; top:560px; bottom:240px; }
 .journey-atmosphere { height:650px; transform:translate3d(0,calc(var(--journey-y) - 325px),0); }
 [data-motion="active"] .gateway-choices { transform:translate3d(0,calc((1 - var(--choice-progress,1)) * 22px),0); }
}

/* Refined current: quiet surfaces, larger type and a single flowing gesture. */
.gateway-hero { background:radial-gradient(ellipse at 85% 32%,#092d36,transparent 57%),#040f19; }
.gateway-header { border-bottom-color:#b9f2ef18; }
.gateway-hero h1 { font-size:clamp(62px,7.2vw,104px); letter-spacing:-.06em; line-height:1.17; margin-top:33px; margin-bottom:42px; }
.gateway-hero h1>span { font-size:.72em; font-weight:500; color:#edf3f1; margin-bottom:10px; }
.gateway-hero h1 em { font-weight:600; background-image:linear-gradient(110deg,#a9dfd0 5%,#ecfff7 35%,#81c9c0 70%,#bdeddf); }
.gateway-hero-bottom>p { color:#a7bbc0; font-size:14px; }
.gateway-hero-actions>a { border-color:#8fc9c478; transition:border-color .3s ease; }
.flow-halo { opacity:.7; background:radial-gradient(ellipse,#55b8ba1c,transparent 66%); }
.audience-option { border-radius:6px; border-color:#56727c66; box-shadow:0 20px 60px #0002; }
.audience-option::after { left:12px; right:12px; }
.audience-option-individual { background:linear-gradient(145deg,#edf4ef,#dfece7); border-color:#e0ede8; }
.audience-option-team { background:linear-gradient(145deg,#102935,#091b29); }
.gateway-card-copy h3 { font-weight:550; letter-spacing:-.055em; }
.gateway-app-visual,.gateway-team-visual { border-radius:3px; }
.gateway-team-visual { background:radial-gradient(ellipse at 40% 0,#18414a,transparent 75%),#0a1d29; }
.gateway-card-cta { font-size:13px; }
.gateway-arrow { width:40px; height:40px; border-color:#8eb2b55e; }
.gateway-section-heading h2 { letter-spacing:-.055em; }
@media (min-width:761px) {
 .gateway-hero-inner { padding-top:190px; }
 .gateway-card-copy { padding-top:31px; padding-bottom:29px; }
}
@media (max-width:760px) {
 .gateway-hero h1 { font-size:clamp(42px,11.3vw,78px); margin:28px 0 30px; }
 .gateway-hero h1>span { font-size:.82em; margin-bottom:9px; }
 .gateway-hero-bottom>p { font-size:13px; }
 .gateway-hero::after { background:linear-gradient(180deg,#040f19b0,transparent 140px),linear-gradient(90deg,#040f19b3,transparent),linear-gradient(0deg,#040f19,transparent 55%); }
}
@media (max-width:350px) {
 .gateway-hero h1 { font-size:37px; letter-spacing:-.065em; }
}

/* One continuous scene, driven by native page scrolling. */
.gateway-scene { position:relative; }
[data-motion="active"] .gateway-scene { --scene-height:max(720px,100svh); height:calc(var(--scene-height) * 1.65); }
[data-motion="active"] .gateway-scene .gateway-hero { position:sticky; top:0; min-height:var(--scene-height); height:var(--scene-height); }
[data-motion="active"] .gateway-scene .gateway-hero-inner { transform-origin:35% 35%; transform:translate3d(0,calc(var(--scene-progress,0) * var(--scene-height) * -.9),0); opacity:1; }
[data-scene-departed="true"] .gateway-hero-inner { visibility:hidden; }
[data-motion="active"] .gateway-scene .gateway-flow { transform-origin:65% 45%; transform:translate3d(calc(var(--scene-progress,0) * 60px),calc(var(--scene-progress,0) * -70px),0) scale(calc(1 + var(--scene-progress,0) * .5)); }
[data-motion="active"] .gateway-scene .current-lines use:nth-child(1),[data-motion="active"] .gateway-scene .current-pulses use:nth-child(1) { translate:calc(var(--scene-progress,0) * -180px) calc(var(--scene-progress,0) * var(--scene-height) * -.95); }
[data-motion="active"] .gateway-scene .current-lines use:nth-child(3),[data-motion="active"] .gateway-scene .current-pulses use:nth-child(3) { translate:calc(var(--scene-progress,0) * 180px) calc(var(--scene-progress,0) * 80px); }
[data-motion="active"] .gateway-scene .gateway-hero-rail { opacity:calc(1 - var(--scene-progress,0)); }
[data-motion="active"] .gateway-choices { z-index:2; margin-top:-65svh; transform:none; }
[data-motion="active"] .gateway-section-heading { opacity:1; translate:0 calc((1 - var(--choice-progress,0)) * 30px); }
[data-motion="active"] .gateway-choices .audience-option { --entry-direction:-1; animation:none; opacity:1; translate:calc((1 - var(--card-reveal,1)) * var(--entry-direction) * 65px) calc((1 - var(--card-reveal,1)) * 65px); scale:calc(.9 + var(--card-reveal,1) * .1); transform:rotateY(calc((1 - var(--card-reveal,1)) * var(--entry-direction) * 6deg)); }
[data-motion="active"] .gateway-choices .audience-option-team { --entry-direction:1; }
[data-motion="active"] .gateway-choices .audience-option:focus-visible { opacity:1; translate:none; scale:1; transform:none; }
@media (hover:hover) and (pointer:fine) {
 [data-motion="active"] .gateway-choices .audience-option:hover { transform:translateY(-6px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg)); }
}
@media (max-width:760px) {
 [data-motion="active"] .gateway-scene { --scene-height:max(650px,100svh); height:calc(var(--scene-height) * 1.45); }
 [data-motion="active"] .gateway-scene .gateway-hero-inner { transform-origin:25% 30%; transform:translate3d(0,calc(var(--scene-progress,0) * var(--scene-height) * -.95),0); }
 [data-motion="active"] .gateway-choices { margin-top:-45svh; }
 [data-motion="active"] .gateway-choices .audience-option { translate:0 calc((1 - var(--card-reveal,1)) * 55px); scale:calc(.96 + var(--card-reveal,1) * .04); transform:none; }
}

.gateway-entry { min-width:0; }
.gateway-entry>.audience-option { height:100%; }
@media (min-width:761px) and (max-width:1000px) {
 [data-motion="active"] .gateway-choices .audience-option { translate:calc((1 - var(--card-reveal,1)) * var(--entry-direction) * 28px) calc((1 - var(--card-reveal,1)) * 50px); }
}

/* Do not create an unscrolled body container around the sticky scene. */
.audience-page { overflow-x:clip; overflow-y:visible; }

[data-motion="active"] .gateway-scene .gateway-hero { opacity:clamp(0,2 - var(--scene-progress,0) * 2,1); }

/* The dark surface parts to reveal a waterway through the page. */
.waterway-opening { display:none; position:absolute; inset:0; z-index:0; overflow:hidden; pointer-events:none; -webkit-mask-image:linear-gradient(transparent,#000 15%,#000 65%,transparent); mask-image:linear-gradient(transparent,#000 15%,#000 65%,transparent); }
.waterway-opening svg { display:block; width:100%; height:100%; }
.waterway-bank { transform-box:view-box; transform-origin:50% 0; }
.waterway-bank-left { transform:translateX(calc(var(--water-open,0) * -190px)) skewX(calc(var(--water-open,0) * -6deg)); }
.waterway-bank-right { transform:translateX(calc(var(--water-open,0) * 190px)) skewX(calc(var(--water-open,0) * 6deg)); }
.waterway-edge { stroke:url(#waterway-edge); stroke-width:.8; vector-effect:non-scaling-stroke; }
.waterway-halo { stroke:url(#waterway-edge); stroke-width:20; opacity:.17; filter:blur(12px); }
[data-motion="active"] .waterway-opening { display:block; opacity:clamp(0,var(--water-open,0) * 4,1); }
[data-motion="active"] .gateway-scene .gateway-hero { opacity:1; background:transparent; }
[data-motion="active"] .gateway-scene .gateway-hero::before { content:""; position:absolute; inset:0; z-index:-3; background:radial-gradient(ellipse at 85% 32%,#092d36,transparent 57%),#040f19; opacity:calc(1 - var(--water-open,0)); }
[data-motion="active"] .gateway-scene .gateway-flow { opacity:calc(1 - var(--water-open,0)); }
.gateway-hero-inner,.gateway-hero-rail { z-index:1; }
@media (max-width:760px) {
 .waterway-bank-left { transform:translateX(calc(var(--water-open,0) * -280px)) skewX(calc(var(--water-open,0) * -4deg)); }
 .waterway-bank-right { transform:translateX(calc(var(--water-open,0) * 280px)) skewX(calc(var(--water-open,0) * 4deg)); }
}



/* Clear choices and readable content throughout the opening scene. */
[data-motion="active"] .gateway-scene h1 { transform:scale(calc(1 - var(--scene-progress,0) * .12)); transform-origin:left center; }
.gateway-hero-bottom>p { max-width:660px; color:#c5d9dc; }
.gateway-quick-choices { display:none; }
.gateway-preview-label { margin:0 18px; padding:12px 16px; color:#204b56; background:#d2e6df; font-size:12px; line-height:1.7; }
.gateway-preview-label strong { font-weight:600; }
.gateway-visual-note { font-size:12px; }
.gateway-header .brand-lockup { width:126px; height:70px; padding:0; }
.gateway-footer .brand-lockup { width:144px; height:auto; aspect-ratio:1.8; padding:0; }
@media(max-width:760px) {
 .gateway-header .brand-lockup { width:108px; height:60px; }
 .gateway-footer .brand-lockup { width:128px; }
 .gateway-hero-bottom>p { font-size:14px; line-height:1.9; }
 .gateway-hero-actions { gap:16px; }
 .gateway-quick-choices { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin:0 0 32px; }
 .gateway-quick-choices a { display:flex; flex-direction:column; gap:10px; min-width:0; padding:18px 12px; border-top:1px solid #90c5c580; border-bottom:1px solid #90c5c530; background:#0c222dc9; color:#dceeed; }
 .gateway-quick-title { display:flex; align-items:center; justify-content:space-between; gap:8px; font-size:18px; }
 .gateway-quick-title>span { color:#a5e3d6; }
 .gateway-quick-choices a>span:nth-child(2) { font-size:13px; line-height:1.7; }
 .gateway-quick-choices small { margin-top:auto; color:#b6ced3; font-size:11px; line-height:1.7; }
 .gateway-preview-label { margin-inline:12px; padding:10px 12px; }
}
@media(max-width:350px) {
 .gateway-header .brand-lockup { width:99px; height:55px; }
 .gateway-quick-choices { gap:10px; }
 .gateway-quick-choices a { padding-inline:10px; }
 .gateway-quick-choices a>span:nth-child(2) { font-size:12px; }
 .gateway-quick-choices small { font-size:10px; }
}

/* Motion is a secondary preference, beside the site's footer information. */
.gateway-footer { flex-wrap:wrap; column-gap:24px; row-gap:8px; }
.gateway-footer .gateway-motion-toggle { padding:8px 0; border:0; border-radius:0; background:transparent; color:inherit; font-size:11px; text-decoration:none; white-space:nowrap; }
.gateway-footer .gateway-motion-toggle:hover { color:var(--aqua); }
@media(max-width:760px) {
 .gateway-footer .gateway-motion-toggle { grid-row:3; grid-column:1 / -1; justify-self:start; }
}

/* Remove only the official website logo's flat matte during rendering. */
.gateway-logo-filter { position:absolute; pointer-events:none; }
.gateway-header .brand-lockup img,
.gateway-footer .brand-lockup img { filter:url(#gateway-logo-transparent); }

/* Capture of the implemented Team UI; preserve the entire panel and its proportions. */
.gateway-team-preview-label { color:#c6e5e2; background:#16343e; }
.gateway-team-visual { padding:10px; overflow:hidden; }
.gateway-team-screen { display:block; width:100%; height:100%; min-height:0; object-fit:contain; }
@media(max-width:760px) {
 .gateway-team-visual { height:auto; padding:8px; }
 .gateway-team-screen { height:auto; }
}

/* Keep the Team screen responsive to the same hover as the individual devices. */
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference) {
 [data-motion="active"] .gateway-team-screen { transition:transform .7s cubic-bezier(.2,.7,.2,1),filter .7s ease; }
 [data-motion="active"] .audience-option-team:hover .gateway-team-screen { transform:translateY(-5px) scale(1.015); filter:drop-shadow(0 12px 14px #0004); }
}
