/* Film-led marketing finish. Shared native screen crops stay unchanged. */
.marketing-site.multipage{--paper:#061c24;--muted:#aec1c5;--flow-line:#b1dcd222;background:var(--paper)}
.marketing-site .site-header{background:#061a22e8;border-bottom-color:#b6ded51a}
.marketing-site .site-header .brand img{width:125px}
.marketing-site .site-header nav{font-size:13px}
.marketing-site .button{border-radius:100px;min-height:48px}
.marketing-site .header-cta{border-radius:100px}
.cinema-hero{position:relative;isolation:isolate;overflow:hidden;padding:65px 0 0;background:#061920}
.hero-halo{position:absolute;z-index:-1;inset:0;background:radial-gradient(ellipse at 50% 70%,#39756c50,transparent 58%),radial-gradient(ellipse at 90% 20%,#626a4817,transparent 45%)}
.cinema-intro{text-align:center;position:relative;z-index:1}
.cinema-intro .eyebrow{display:flex;justify-content:center;align-items:center;gap:10px;color:#beded2;margin:0 0 23px;font-size:12px}
.cinema-intro h1{font-size:clamp(48px,6.4vw,86px);line-height:1.02;letter-spacing:-.06em;font-weight:580}
.cinema-intro h1>span{color:#9ee8d3;background:linear-gradient(100deg,#e5faed,#81dfcf);background-clip:text;-webkit-text-fill-color:transparent}
.cinema-lede{font-size:17px;line-height:1.65!important;margin:25px auto 0;max-width:610px;color:#aec5c9}
.cinema-actions{display:flex;justify-content:center;align-items:center;gap:30px;margin:27px 0 42px}
.cinema-actions .button{gap:13px;padding:14px 23px;font-size:14px;background:#b1f0dc;box-shadow:inset 0 1px #fff8,0 8px 36px #68e0bf16}
.cinema-actions .button small{font-size:11px;border-left:1px solid #103c3940;padding-left:13px;font-weight:400}
.cinema-actions .text-link{font-size:14px;color:#cbe1da}
.cinema-stage{max-width:1280px;position:relative}
.cinema-screen{position:relative;aspect-ratio:16/9;border-radius:25px;overflow:hidden;border:1px solid #b0ded63d;box-shadow:0 35px 90px #0006;background:#0a242a;isolation:isolate}
.cinema-poster,.cinema-screen video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.cinema-screen video{opacity:0;transition:opacity .45s}.cinema-screen.is-playing video,.cinema-screen.has-played video{opacity:1}
.cinema-screen:after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(#020e184d,transparent 28%,transparent 68%,#020e18d9)}
.cinema-topline{position:absolute;z-index:2;top:25px;left:30px;right:30px;display:flex;justify-content:space-between;gap:20px;font-size:10px;letter-spacing:.12em;color:#fff;text-shadow:0 1px 8px #000}
.cinema-topline i{display:inline-block;background:#a6edda;width:5px;height:5px;border-radius:50%;margin-right:9px}
.cinema-topline>span:last-child{letter-spacing:0;font-size:12px}
.cinema-bottom{position:absolute;bottom:24px;left:30px;right:30px;z-index:2;display:flex;justify-content:space-between;align-items:center;gap:20px}
.film-play{display:inline-flex;align-items:center;gap:14px;color:white;font-size:15px;font-weight:550}
.play-disc{display:grid;place-items:center;width:50px;height:50px;border:1px solid #ffffff70;border-radius:50%;background:#fff1;backdrop-filter:blur(10px);font-size:25px;transition:background .2s,transform .2s}
.film-play:hover .play-disc{background:#b7efdc;color:#06252a;transform:scale(1.05)}
.film-play small{display:block;font-size:11px;color:#c1d4d6;font-weight:400;margin-top:3px}
.motion-toggle{font-size:11px;padding:11px 16px;border-radius:100px;border:1px solid #ffffff45;color:white;background:#081c2899;backdrop-filter:blur(12px)}
.motion-toggle span{margin-left:10px}.motion-toggle[hidden]{display:none}
.cinema-stage figcaption{display:flex;justify-content:space-between;gap:20px;text-align:left;margin:0;padding:21px 0 28px;border-bottom:1px solid #b4dcd525;font-size:12px;color:#91aeaf}
.cinema-stage figcaption>span:first-child{color:#d9eae3;letter-spacing:.02em}.cinema-stage figcaption i{font-style:normal;margin:0 9px;color:#5b7d81}
.home-page .home-modes{padding-block:90px 100px}.home-page .split-heading{margin-bottom:35px}
.mode-portals{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.mode-portal{min-width:0;overflow:hidden;border-radius:24px;border:1px solid #c3e2df26;position:relative;background:linear-gradient(135deg,#244559,#112d3b);transition:transform .3s,box-shadow .3s,border-color .3s}
.portal-game{background:linear-gradient(135deg,#284e46,#12332f)}.portal-practice{background:linear-gradient(135deg,#504b35,#293b33)}
.mode-portal:hover{transform:translateY(-7px);border-color:#b5ddce80;box-shadow:0 25px 50px #0003}
.portal-copy{padding:28px 25px 24px}.portal-index{font-size:10px;letter-spacing:.1em;color:#a9c3ca}
.portal-copy h3{font-size:29px;margin:16px 0 9px}.portal-copy p{font-size:14px;color:#d0dfdc}
.portal-visual{height:170px;display:flex;align-items:center;padding:5px 18px 16px;position:relative}
.portal-visual img{width:100%;border-radius:11px;border:4px solid #071b24;box-shadow:0 16px 30px #0006;transition:transform .45s}
.portal-team .portal-visual img{border-width:1px;border-radius:7px}
.mode-portal:hover .portal-visual img{transform:scale(1.035)}
.portal-footer{display:flex;justify-content:space-between;align-items:center;margin:16px 25px 0;padding:18px 0 22px;border-top:1px solid #c5dfd22a;gap:15px;font-size:12px;color:#dbe9e4}
.portal-arrow{display:grid;place-items:center;border:1px solid #cfebe53a;border-radius:50%;height:31px;width:31px;font-size:17px;flex-shrink:0}
.keeper-section{overflow:hidden;background:radial-gradient(ellipse at 25% 50%,#345d4c55,transparent 50%),linear-gradient(120deg,#102d31,#0b252c);border-block:1px solid #c8e3d617}
.keeper-grid{display:grid;grid-template-columns:1fr 1.05fr;align-items:center;gap:100px;padding-block:85px}
.keeper-art{position:relative;isolation:isolate;display:flex;justify-content:center;padding:20px 20px 45px}
.keeper-orbit{position:absolute;width:480px;height:480px;max-width:130%;border:1px solid #b7e4cf18;border-radius:50%;top:12%;z-index:-1;box-shadow:0 0 0 45px #b0ddc905,0 0 0 90px #b0ddc903;background:radial-gradient(ellipse,#65947e24,transparent 65%)}
.keeper-phone{width:240px;max-width:70%;border:7px solid #193a3e;border-radius:33px;box-shadow:0 35px 60px #0006,0 0 0 1px #a6c8b34d;transform:rotate(-5deg);overflow:hidden}
.keeper-phone img{width:100%}
.keeper-stamp{position:absolute;bottom:45px;right:-15px;display:flex;align-items:center;gap:17px;padding:20px 25px;background:#bcebd8;color:#0e3734;border-radius:18px;box-shadow:0 15px 40px #0004;transform:rotate(3deg);font-size:21px;letter-spacing:-.03em}
.keeper-stamp>span{display:grid;place-items:center;width:43px;height:43px;border-radius:50%;background:#4edec5;color:#07362e;font-size:26px}.keeper-stamp small{display:block;font-size:11px;letter-spacing:0;margin-top:3px}
.keeper-copy h2 span{color:#b2ddca}.keeper-copy>p:not(.eyebrow){font-size:16px;margin-top:24px;line-height:1.85;max-width:500px}
.keeper-steps{list-style:none;padding:0;margin:30px 0 10px}.keeper-steps li{display:flex;gap:20px;padding:17px 0;border-top:1px solid #b5ddcb22}.keeper-steps li>span{font-size:11px;color:#78b3a4;padding-top:4px}.keeper-steps strong{font-size:16px;font-weight:550}.keeper-steps p{font-size:13px;line-height:1.7;margin-top:5px}
.premium-features{padding-block:90px}.feature-bento{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.feature-bento article{border:1px solid #bdd8d52b;border-radius:25px;overflow:hidden;position:relative;min-width:0}
.bento-copy{position:relative;z-index:1}.bento-copy .eyebrow{font-size:11px!important}.bento-copy h3{font-size:36px;line-height:1.08;letter-spacing:-.04em}.bento-copy>p:not(.eyebrow){font-size:14px;line-height:1.8;margin-top:22px;max-width:300px}.bento-copy .text-link{margin-top:18px;font-size:13px}
.bento-watch{display:grid;grid-template-columns:1.1fr .9fr;align-items:center;background:radial-gradient(ellipse at right,#527c6c77,transparent 80%),#173637;padding:35px 15px 35px 35px;min-height:410px;gap:10px}
.bento-watch .watch-device{width:200px;transform:rotate(9deg);filter:drop-shadow(0 20px 20px #0005)}
.bento-reel{display:grid;grid-template-columns:1fr .85fr;align-items:center;gap:20px;padding:35px 0 35px 35px;background:radial-gradient(ellipse at bottom right,#415d8e66,transparent 90%),#142d3b}
.reel-preview{width:220px;max-width:100%;border:5px solid #3d545d;border-radius:23px;box-shadow:0 20px 45px #0005;transform:rotate(7deg) translateX(15px);overflow:hidden}.reel-preview img{width:100%}
.bento-broadcast{grid-column:1/-1;display:grid;grid-template-columns:.72fr 1.28fr;align-items:center;gap:50px;background:radial-gradient(ellipse at right,#3c627e55,transparent 80%),#122c39;padding:42px}
.bento-broadcast figure{margin:0;min-width:0}.bento-broadcast figure img{border-radius:13px;box-shadow:0 25px 45px #0005;border:1px solid #bdd8e342}.bento-broadcast figcaption{font-size:10px;margin-top:15px}.broadcast-tags{display:flex;flex-wrap:wrap;gap:7px;margin-top:20px}.broadcast-tags span{padding:5px 10px;border:1px solid #c9e4df30;border-radius:100px;color:#c8dcd7;font-size:10px}
.everywhere-section{position:relative;display:grid;grid-template-columns:1.1fr 1fr;align-items:center;gap:65px;padding:40px;margin-bottom:85px;border-radius:25px;background:#d9e4d8;color:#153b3a;overflow:hidden}
.everywhere-image{position:relative;min-width:0}.everywhere-image img{border-radius:15px;box-shadow:0 20px 35px #10271c30}.everywhere-copy .eyebrow{color:#496d5c;font-size:10px!important;max-width:310px}.everywhere-copy h2{font-size:clamp(32px,3.4vw,47px)}.everywhere-copy .text-link{color:#245d4a;margin-top:15px}
.home-page .pricing-section{border-top:1px solid #b0d9cd22;background:radial-gradient(ellipse at 50% 55%,#244b4033,transparent 65%);padding-block:70px 45px}.home-page .plan{border-radius:24px;background:#122f35}.home-page .annual{background:linear-gradient(130deg,#294c43,#143536);border-color:#98ccaf78}.home-page .price{font-weight:450;letter-spacing:-.06em}.home-page .home-questions{padding-block:25px 75px}.home-page .mode-next{padding:45px;border:1px solid #a4d6c32b;border-radius:24px;background:linear-gradient(125deg,#20403b,#102d38);margin-bottom:65px}
.film-cinema{padding:24px;width:min(1260px,96vw);max-width:none;max-height:94dvh;overflow:auto;border:1px solid #a8d5c738;border-radius:23px;background:#061820;color:#edf6f0;box-shadow:0 30px 100px #0009}.film-cinema::backdrop{background:#020b11ed;backdrop-filter:blur(15px)}
.cinema-dialog-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;gap:20px}.cinema-dialog-top .eyebrow{font-size:10px;margin:0 0 3px}.cinema-dialog-top h2{font-size:26px}.cinema-dialog-top button{background:#ffffff0e;border:1px solid #d5f1e339;border-radius:100px;padding:10px 18px;min-height:44px;color:white;font-size:13px}.cinema-dialog-top button span{margin-left:15px}.film-cinema video{display:block;width:100%;max-height:70dvh;aspect-ratio:16/9;background:#000;border-radius:10px}.film-cinema>p{display:flex;justify-content:space-between;gap:20px;margin-top:15px;font-size:12px}.film-cinema>p a{text-decoration:underline}
/* Give the existing mode journeys the same material and spacing treatment. */
.flow-redesign:not(.home-page) .portrait-hero,.flow-redesign:not(.home-page) .mode-hero{padding-top:35px;background-color:#061920}
.flow-redesign .portrait-stage:before{box-shadow:0 0 0 38px #a1d7bf05,0 0 0 76px #a1d7bf03}
.flow-redesign .capture-phone{box-shadow:0 35px 70px #0007,0 0 70px #6cd9b50b}
.flow-redesign .chapter-links a{background:#09242d66;transition:background .2s,border-color .2s}
.flow-redesign .result-well,.flow-redesign .companion-watch,.flow-redesign .companion-helper{box-shadow:inset 0 1px #e8fff00b,0 20px 40px #0001}
@media(min-width:1500px){.cinema-stage{width:min(1280px,calc(100% - 160px))}}
@media(max-width:1000px){.keeper-grid{gap:55px}.keeper-stamp{right:-25px;padding:16px;font-size:18px}.bento-copy h3{font-size:29px}.bento-watch,.bento-reel{padding-left:25px}.bento-watch .watch-device{width:170px}.bento-broadcast{gap:30px;padding:30px}.everywhere-section{gap:35px;padding:30px}.portal-copy{padding:24px 20px 18px}.portal-copy h3{font-size:24px}.portal-copy p{font-size:12px}.portal-visual{height:140px;padding-inline:12px}.portal-footer{margin-inline:20px;font-size:10px}.mode-portals{gap:14px}}
@media(max-width:700px){.marketing-site .site-header .brand img{width:105px}.marketing-site .site-header nav{font-size:13px}.cinema-hero{padding-top:40px}.cinema-intro h1{font-size:clamp(38px,8.3vw,56px);line-height:1.06}.cinema-intro .eyebrow{font-size:10px;margin-bottom:20px}.cinema-lede{font-size:14px;margin-top:21px;max-width:360px}.cinema-lede br{display:none}.cinema-actions{gap:19px;margin:24px 0 29px}.cinema-actions .button{font-size:12px;padding:12px 17px;gap:9px}.cinema-actions .button small{padding-left:9px;font-size:10px}.cinema-actions .text-link{font-size:12px}.cinema-stage{width:calc(100% - 24px)}.cinema-screen{border-radius:16px}.cinema-topline{top:13px;left:15px;right:15px;font-size:8px}.cinema-topline>span:last-child{display:none}.cinema-bottom{bottom:14px;left:15px;right:15px;gap:10px}.film-play{font-size:11px;gap:9px}.film-play small{font-size:9px}.play-disc{width:34px;height:34px;font-size:19px}.motion-toggle{font-size:10px;padding:8px}.cinema-stage figcaption{display:block;font-size:10px;padding:15px 7px 22px}.cinema-stage figcaption>span{display:block}.cinema-stage figcaption>span+span{margin-top:5px}.cinema-stage figcaption i{margin-inline:4px}.home-page .home-modes{padding-block:55px}.home-page .split-heading{gap:20px;margin-bottom:26px}.mode-portals{grid-template-columns:1fr;gap:17px}.portal-copy{padding:25px 25px 15px}.portal-copy h3{font-size:29px;margin-top:10px}.portal-copy p{font-size:14px}.portal-visual{height:auto;padding:10px 23px 17px}.portal-visual img{width:100%}.portal-footer{font-size:12px;margin:10px 25px 0;padding:15px 0 20px}.keeper-grid{grid-template-columns:1fr;gap:35px;padding-block:40px 55px}.keeper-art{padding:15px 0 35px}.keeper-phone{width:200px;max-width:65%}.keeper-stamp{right:0;bottom:22px;font-size:18px}.keeper-orbit{width:340px;height:340px;max-width:100%;top:10%}.keeper-copy h2{font-size:37px}.keeper-copy>p:not(.eyebrow){font-size:15px}.keeper-copy .eyebrow{font-size:11px}.premium-features{padding-block:55px}.feature-bento{grid-template-columns:1fr;gap:17px}.bento-watch,.bento-reel{min-height:340px;padding:27px 10px 27px 25px;gap:10px}.bento-copy h3{font-size:29px}.bento-copy>p:not(.eyebrow){font-size:13px;margin-top:16px}.bento-copy .eyebrow{font-size:9px!important}.bento-copy .text-link{font-size:11px}.bento-watch .watch-device{width:160px}.reel-preview{width:165px}.bento-broadcast{grid-template-columns:1fr;gap:28px;padding:27px 25px}.bento-broadcast .bento-copy>p{max-width:none}.broadcast-tags{margin-top:10px}.everywhere-section{grid-template-columns:1fr;gap:27px;padding:22px;margin-bottom:50px}.everywhere-copy{padding:0 3px 8px}.everywhere-copy h2{font-size:36px}.everywhere-copy .eyebrow{font-size:10px!important}.home-page .pricing-section{padding-top:50px}.home-page .mode-next{padding:28px;margin-bottom:45px}.film-cinema{padding:16px;border-radius:16px}.cinema-dialog-top h2{font-size:23px}.film-cinema>p{display:block;font-size:11px}.film-cinema>p a{display:block;margin-top:7px}}
@media(max-width:370px){.cinema-actions{gap:12px;flex-wrap:wrap}.bento-watch,.bento-reel{grid-template-columns:1fr;padding:25px}.bento-watch .watch-device{width:170px}.reel-preview{width:190px;justify-self:center;transform:rotate(4deg)}.keeper-stamp{font-size:16px;gap:10px}.keeper-stamp small{font-size:10px}}
@media(prefers-reduced-motion:reduce){.cinema-screen video,.mode-portal,.portal-visual img,.play-disc{transition:none}.mode-portal:hover,.mode-portal:hover .portal-visual img,.film-play:hover .play-disc{transform:none}}
.bento-broadcast .broadcast-native-stage{padding:30px 22px;border:1px solid #a7cce13d;border-radius:17px;background:radial-gradient(ellipse at top,#42799a55,transparent 80%),repeating-linear-gradient(90deg,transparent 0,transparent 78px,#d9edfa06 79px,transparent 80px),#102736;box-shadow:0 20px 45px #0004}
.broadcast-live{display:flex;align-items:center;gap:8px;font-size:9px;letter-spacing:.13em;color:#a7d4d6}.broadcast-live i{height:5px;width:5px;background:#92e4ca;border-radius:50%}
.broadcast-native-stage>p{font-size:25px;line-height:1.2;letter-spacing:-.035em;color:#e3f1ec;margin:28px 0 38px}
.bento-broadcast .player-native{max-width:none;width:100%;border-radius:6px;box-shadow:0 12px 25px #0004}
.bento-broadcast .player-native img{border:0;border-radius:0;box-shadow:none}
@media(max-width:700px){.bento-broadcast .broadcast-native-stage{padding:24px 16px}.broadcast-native-stage>p{font-size:23px;margin-block:25px 30px}}
@media(max-width:700px){.bento-watch,.bento-reel{grid-template-columns:1fr;padding:28px;gap:24px}.bento-copy h3{font-size:32px}.bento-copy>p:not(.eyebrow){max-width:none;font-size:14px}.bento-copy .text-link{font-size:12px}.bento-watch .watch-device{width:185px}.bento-reel .reel-preview{width:195px;justify-self:center;transform:rotate(4deg);margin-block:5px 15px}}
