/* Commute's cinematic marketing composition. Shared guide styles stay unchanged. */
.cinematic{--wrap:1200px;--sc-canvas:#091e18;--sc-ink:#f5f3ec;--sc-ink-soft:#b9cbbf;--sc-accent:#b6f4cc;background:#091e18;color:#f5f3ec;overflow-x:clip}
.cinematic .wrap{width:min(1200px,calc(100% - 96px));max-width:none;margin-inline:auto}
.cinematic h1,.cinematic h2{letter-spacing:-.055em;text-wrap:balance;font-weight:600}
.cinematic h2{font-size:clamp(36px,5.1vw,68px);line-height:1.06;margin:0 0 28px}
.cinematic p{text-wrap:pretty}
.cinematic .eyebrow{font-size:11px;letter-spacing:.17em;font-weight:650;margin:0 0 26px;color:#a8c4b5}
.cinematic a,.cinematic button{touch-action:manipulation}
.cinematic :focus-visible{outline:3px solid #dca548;outline-offset:6px}
.cinematic .site-header{background:#091e18;position:relative;border:0;padding:25px 0;z-index:5}
.cinematic .site-header .wrap{display:flex;align-items:center;justify-content:space-between}
.cinematic .brand{font-size:22px;letter-spacing:-.055em;color:#f5f3ec}
.cinematic .brand img{border-radius:9px}
.cinematic .site-nav{gap:36px;display:flex;align-items:center}
.cinematic .site-nav a{color:#d4e1d8;font-size:13px;text-decoration:none}
.cinematic .site-nav .nav-cta{border-bottom:1px solid #749182;padding:9px 0;color:#b6f4cc}
.nav-cta span{margin-left:24px}
.opening{position:relative;min-height:1140px;isolation:isolate;overflow:hidden;background:#091e18}
.opening-copy{position:relative;text-align:center;z-index:3;padding-top:44px}
.cinematic h1{font-size:clamp(70px,8.2vw,116px);line-height:.96;margin:0 auto 26px;max-width:950px}
.opening h1 span{color:#b6f4cc}
.opening-lead{font-size:18px;line-height:1.55;color:#c0d1c6;margin:0 auto 23px}
.cinematic .primary{background:#b6f4cc;color:#102b22;border-radius:6px;min-height:50px;font-size:14px;gap:40px;padding:0 24px;transition:transform 150ms ease-out,background 150ms ease-out}
.cinematic .primary:hover{background:#d4ffe2}
.cinematic .primary:active,.cinematic button:active{transform:translateY(1px)}
.cinematic .availability{font-size:11px;color:#a8c4b5;margin:13px 0 0}
.hero-landscape{position:absolute;inset:420px 0 0;z-index:0;overflow:hidden}
.map-plane{position:absolute;inset:50px -8% -80px;transform-origin:center;opacity:.75}
.map-plane svg{width:100%;height:100%;transform:perspective(1000px) rotateX(24deg) rotateZ(-15deg);color:#37624f}
.network{color:#37624f}
.map-route{fill:none;stroke:#9ce7b7;stroke-width:4}
.endpoint{fill:#102b22;stroke:#b6f4cc;stroke-width:4}
.map-plane text{fill:#a8c4b5;font-size:12px;letter-spacing:4px}
.hero-distance{position:absolute;left:8%;top:330px;color:#a8c4b5;font-size:17px;line-height:1.6;letter-spacing:-.02em}
.hero-device{position:relative;width:245px;margin:56px auto 0;z-index:2;transform:rotate(-5deg)}
.device-shell{border:5px solid #263e33;border-radius:35px;overflow:hidden;background:#102b22;box-shadow:0 40px 80px #020e0ba6,1px 1px 0 #9db8a7}
.device-shell img{display:block;width:100%;height:auto}
.hero-device figcaption{text-align:center;margin-top:19px;color:#a8c4b5;font-size:10px}
.route-story{position:relative;background:#102b22}
.motion-enabled .route-story{height:190svh}
.story-stage{padding:70px 0 24px;min-height:850px;position:relative;overflow:hidden}
.motion-enabled .story-stage{position:sticky;top:0;height:100svh;min-height:700px}
.story-heading{position:relative;z-index:2;pointer-events:none}
.story-heading h2{max-width:660px}
.story-heading h2 span{color:#b6f4cc}
.story-heading>p:last-child{max-width:365px;font-size:16px;line-height:1.7;color:#b9cbbf}
.route-demo{position:absolute;width:72%;right:-2%;top:100px;bottom:0;--route-progress:1}
.route-demo svg{width:100%;height:100%;overflow:visible}
.route-demo .network{opacity:.35}
.route-track{fill:none;stroke:#385f4b;stroke-width:6}
.selected-route{fill:none;stroke:#b6f4cc;stroke-width:6;stroke-dasharray:1;stroke-dashoffset:0}
.other-incidents{fill:#b4c7ba;opacity:.15}
.selected-incident circle{fill:#efb54e}
.selected-incident text{fill:#102b22;font-size:28px;font-weight:700}
.place{fill:#c9dacf;font-size:15px}
.incident-caption{position:absolute;left:50%;top:50%;padding:22px 26px;background:#f0f3e9;color:#102b22;box-shadow:0 18px 50px #03120b55;border-radius:5px;max-width:280px}
.incident-caption span{font-size:10px;text-transform:uppercase;letter-spacing:.13em;color:#496653}
.incident-caption strong{display:block;font-size:25px;letter-spacing:-.04em;margin:7px 0}
.incident-caption p{font-size:13px;line-height:1.5;margin:0;color:#496653}
.story-base{position:absolute;bottom:25px;left:0;right:0;display:flex;align-items:center;justify-content:space-between;gap:20px;z-index:3}
.story-base p{font-size:10px;color:#a8c4b5;margin:0}
.story-base a{color:#d4e1d8;font-size:13px;text-decoration:none}
.product-section{background:#eaf0e6;color:#173529;padding:120px 0}
.product-layout{display:grid;grid-template-columns:1.15fr 1fr;gap:110px;align-items:center}
.cinematic .product-section .eyebrow{color:#526e5c}
.product-copy>p:not(.eyebrow){font-size:16px;max-width:420px;color:#526e5c}
.product-choices{margin:40px 0 30px;border-top:1px solid #a9b9a9}
.choice{display:flex;align-items:start;gap:18px;width:100%;padding:23px 0;border:0;border-bottom:1px solid #a9b9a9;background:none;color:#526e5c;text-align:left;cursor:pointer;font:inherit;transition:color 150ms ease-out}
.choice>span:first-child{font-size:11px;margin-top:5px}.choice>span:last-child{margin-left:auto}.choice strong{font-size:18px;font-weight:600;letter-spacing:-.025em}.choice p{font-size:13px;margin:5px 0 0;line-height:1.5}.choice[aria-pressed=true]{color:#102b22}.choice[aria-pressed=true] strong{text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px}.choice:hover{color:#102b22}
.product-visual{margin:0;justify-self:center;width:270px}.product-visual .device-shell{box-shadow:0 26px 60px #244c2e35;border-color:#173529}.product-visual figcaption{font-size:10px;color:#526e5c;margin-top:20px;text-align:center}.product-copy .product-detail{font-size:13px!important;line-height:1.7}
.truth-section{padding:110px 0;background:#b6f4cc;color:#102b22}.cinematic .truth-section .eyebrow{color:#3b6149}.truth-section h2{max-width:800px}.truth-columns{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:60px;margin-top:50px}.truth-columns p{font-size:15px;line-height:1.75;margin:0;color:#294e39}
.cinematic .section{padding:90px 0;background:#f3f5ee;color:#102b22}.cinematic .section .narrow{max-width:800px}.cinematic .section h2{font-size:42px}.cinematic details{border-color:#bdcbbb;padding:20px 0}.cinematic summary{font-size:17px}.cinematic details p{color:#496653;font-size:15px}.cinematic .section:has(.guide-list){padding-top:0}.cinematic .guide-list{border-top:1px solid #bdcbbb}.cinematic .guide-list li{border-color:#bdcbbb}.cinematic .guide-list a{color:#173529}.cinematic .lead{font-size:17px;color:#496653}
.cinematic #tilmeld{background:#091e18;color:#f3f5ee;text-align:center;padding:110px 0}.cinematic #tilmeld .wrap{max-width:640px}.cinematic #tilmeld h2{font-size:clamp(44px,5vw,70px)}.cinematic #tilmeld .lead{color:#b9cbbf}.cinematic #tilmeld .waitlist{text-align:left;max-width:460px;margin:35px auto 0}.cinematic #tilmeld input{border-radius:5px;border-color:#567563;min-height:56px}.cinematic #tilmeld .btn{background:#b6f4cc;color:#102b22;border-radius:5px;font-size:15px}.cinematic #tilmeld .form-note{color:#a8c4b5;font-size:12px}.cinematic .site-footer{background:#091e18;color:#a8c4b5;border-top:1px solid #294536;font-size:11px;padding:32px 0}.cinematic .site-footer a{color:#c5d8ca}.cinematic .foot-links{margin-bottom:18px}
@media(min-width:1500px){.opening{min-height:1200px}.hero-device{width:275px}}
@media(max-width:900px){.cinematic .wrap{width:calc(100% - 48px)}.product-layout{gap:40px}.product-visual{width:235px}.route-demo{width:90%;right:-15%;top:220px}.truth-columns{gap:25px}.story-heading h2{font-size:54px}.hero-distance{left:6%;font-size:14px}}
@media(max-width:600px){.cinematic .wrap{width:calc(100% - 40px)}.cinematic .site-header{padding:18px 0}.cinematic .brand{font-size:19px}.cinematic .brand img{width:26px;height:26px}.cinematic .site-nav{gap:16px}.cinematic .site-nav a{font-size:11px}.cinematic .site-nav a:first-child{display:none}.nav-cta span{margin-left:15px}.opening{min-height:950px}.opening-copy{padding-top:38px}.cinematic .eyebrow{font-size:9px;letter-spacing:.14em;margin-bottom:23px}.cinematic h1{font-size:clamp(55px,14.5vw,84px);line-height:1.01;margin-bottom:23px}.opening-lead{font-size:15px;line-height:1.6;margin-bottom:21px}.cinematic .availability{font-size:10px}.hero-device{width:205px;margin-top:49px}.hero-landscape{top:420px}.map-plane{inset:0 -85% -80px;opacity:.65}.hero-distance{display:none}.motion-enabled .route-story{height:160svh}.story-stage{padding:45px 0 20px;min-height:760px}.motion-enabled .story-stage{min-height:600px}.story-heading h2{font-size:43px;margin-bottom:18px}.story-heading>p:last-child{max-width:300px;font-size:14px;line-height:1.6}.route-demo{top:255px;bottom:60px;width:135%;right:-14%}.route-demo svg{overflow:visible}.incident-caption{left:39%;top:49%;padding:15px 18px;max-width:215px}.incident-caption strong{font-size:21px}.incident-caption p{font-size:11px}.incident-caption span{font-size:8px}.place{font-size:19px}.story-base{bottom:20px;align-items:end}.story-base p{max-width:155px;font-size:9px}.story-base a{font-size:11px}.product-section{padding:65px 0}.product-layout{grid-template-columns:1fr;gap:45px}.cinematic h2{font-size:42px}.product-copy>p:not(.eyebrow){font-size:15px}.product-choices{margin-top:28px}.choice{padding:20px 0}.choice strong{font-size:16px}.choice p{font-size:12px}.product-visual{width:230px}.truth-section{padding:65px 0}.truth-columns{grid-template-columns:1fr;gap:25px;margin-top:35px}.truth-columns p{font-size:15px}.cinematic .section{padding:65px 0}.cinematic .section h2{font-size:34px}.cinematic summary{font-size:15px}.cinematic #tilmeld{padding:70px 0}.cinematic .site-footer{padding:30px 0}.cinematic .foot-links{gap:16px;flex-wrap:wrap}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.motion-enabled .route-story{height:auto}.motion-enabled .story-stage{position:relative;height:auto;min-height:800px}.hero-device,.map-plane{transform:none!important}.cinematic *, .cinematic *::before,.cinematic *::after{animation:none!important;transition:none!important}.selected-route{stroke-dashoffset:0!important}.other-incidents{opacity:.15!important}.incident-caption{opacity:1!important;transform:none!important}}
@media(max-width:600px){.route-demo svg{height:60%;margin-top:5%}.incident-caption{top:65%;left:auto;right:19%;padding:12px 18px}.incident-caption p{display:none}.incident-caption strong{margin-bottom:0;font-size:19px}.cinematic .choice:disabled{cursor:default}}
.cinematic .form-note a{color:inherit}
html:not(.sc-ready) [data-sc-in],html:not(.sc-ready) [data-sc-cue]{opacity:1;transform:none}
@media(min-width:601px) and (max-width:900px){.incident-caption{left:auto;right:25%;max-width:250px}}