.kinetic-stage{position:relative;isolation:isolate;overflow:hidden;background:#071e17;color:#eff8e9}.kinetic-stage::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 50% 50%,#285b322e,transparent 62%);z-index:-1}.kinetic-stage canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.kinetic-stage .art-label{color:#9bac99;z-index:1}.kinetic-mark{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:105px;height:105px;border:1px solid #cbef9e44;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#102b2050;backdrop-filter:blur(3px);pointer-events:none}.kinetic-mark img{width:55%;height:55%;object-fit:contain;filter:brightness(0) invert(1);opacity:.88}.kinetic-stage .art-bottom{z-index:1;color:#bbd5a8;bottom:27px}.kinetic-control{position:absolute;right:25px;top:25px;z-index:2;border:1px solid #b5d8ab44;background:#09231bb3;color:#d6e6cb;padding:8px 12px;border-radius:30px;font-size:10px;letter-spacing:.5px}.kinetic-control:hover{background:#284a32}.motion-feature{padding:70px 5% 80px;background:var(--paper)}.motion-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;margin-bottom:35px}.motion-heading h2{font-size:clamp(30px,4vw,56px);margin:15px 0 0}.motion-heading>p{font-size:13px;color:#697068;max-width:300px}.motion-installation{height:clamp(430px,46vw,680px);border-radius:3px}.motion-installation .kinetic-mark{width:145px;height:145px}.installation-title{position:absolute;left:35px;bottom:35px;z-index:1;font-size:clamp(28px,4.2vw,62px);font-weight:500;letter-spacing:-2px;line-height:1.08;pointer-events:none}.installation-title small{display:block;font-size:10px;letter-spacing:3px;margin-top:16px;font-weight:400;color:#bfd1b2}.installation-meta{position:absolute;left:35px;top:30px;font-size:10px;letter-spacing:2px;color:#bfd1b2}.motion-installation .art-bottom{left:auto;right:35px;bottom:35px}.motion-note{font-size:11px;color:#697068;margin:15px 0 0;display:flex;justify-content:space-between;gap:20px}.footer-brand{align-items:flex-start}.footer-brand .company-name{white-space:nowrap;font-size:16px;letter-spacing:-.7px}.footer-brand img{flex-shrink:0}footer{grid-template-columns:minmax(230px,.8fr) 1.2fr 1fr}footer>div{min-width:0}footer a{overflow-wrap:anywhere}
@media(max-width:900px){footer{grid-template-columns:1fr 1.2fr}.footer-brand{grid-column:1/-1}.hero-art.kinetic-stage{min-height:520px}.kinetic-mark{width:80px;height:80px}}
@media(max-width:650px){.hero-art.kinetic-stage{min-height:390px}.kinetic-stage .art-label{left:20px;top:22px;font-size:8px;letter-spacing:1px}.kinetic-control{right:16px;top:20px;font-size:9px;padding:7px 10px}.kinetic-stage .art-bottom{left:20px;right:20px;font-size:7px;letter-spacing:.5px}.motion-feature{padding:50px 5%}.motion-heading{display:block;margin-bottom:25px}.motion-heading>p{margin-top:20px;font-size:12px}.motion-installation{height:480px}.motion-installation .kinetic-mark{width:95px;height:95px}.installation-title{left:22px;bottom:50px;font-size:36px;letter-spacing:-1px}.installation-title small{font-size:8px;letter-spacing:2px}.installation-meta{left:22px;font-size:8px;letter-spacing:1px;top:26px}.motion-installation .art-bottom{left:22px;bottom:20px;font-size:7px}.motion-note{font-size:9px}footer{grid-template-columns:1fr}.footer-brand .company-name{font-size:18px}.hero-foot{gap:15px}.hero-foot span{max-width:55%}}

@media(max-width:650px){.hero-art.kinetic-stage{order:-1;min-height:270px}.hero{padding-top:24px;gap:28px}.hero-copy h1{margin-top:20px}.hero-copy .muted{word-break:keep-all;font-size:13px}}
.hero{position:relative;isolation:isolate;display:block;background:#071c18;color:#f2f5ef;min-height:760px;padding:80px 5% 0;overflow:hidden}.hero .hero-art.digital-world{position:absolute;inset:0;z-index:-2;min-height:0;border-radius:0;background:radial-gradient(ellipse at 70% 40%,#173a31,#050f12 80%)}.hero::after{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,#061713f5 0%,#061713e0 28%,#06171320 62%,transparent)}.hero-copy{position:relative;max-width:650px;padding-bottom:70px;pointer-events:none}.hero-copy a{pointer-events:auto}.hero h1{font-size:clamp(62px,6.7vw,104px)}.hero .dot{color:#badd91}.hero .muted{color:#aabfb2;max-width:420px}.hero .eyebrow{color:#a8cbb9}.hero .button{background:#d7edc3;color:#102a20}.hero .hero-foot{position:relative;padding:24px 0;border-top-color:#abc7b333;color:#b8cbbb}.digital-world .art-label,.digital-world .art-bottom{display:none}.music-control{position:absolute;right:143px;top:25px;z-index:2;border:1px solid #b5d8ab44;background:#09231bb3;color:#d6e6cb;padding:8px 12px;border-radius:30px;font-size:10px}.hero .kinetic-control,.hero .music-control{top:30px}.hero .hero-art{pointer-events:auto}
@media(max-width:900px){.hero-copy{max-width:52%}.hero .muted{font-size:13px}.hero h1{letter-spacing:-4px}}
@media(max-width:650px){.hero{padding:330px 5% 0;min-height:950px}.hero-copy{max-width:none;padding-bottom:35px}.hero-copy h1{font-size:62px;margin:20px 0;letter-spacing:-4px}.hero::after{background:linear-gradient(0deg,#061713 0%,#061713eb 46%,#06171300 78%)}.hero .hero-sub{font-size:21px}.hero .hero-copy .button{margin-top:15px}.hero .kinetic-control{top:18px;right:18px}.hero .music-control{top:18px;right:126px;font-size:9px;padding:7px 10px}.hero .hero-foot{font-size:7px;letter-spacing:.4px}.hero .muted{word-break:keep-all}.hero .hero-art.digital-world{min-height:0}}
/* Full-screen art direction. All artwork is supplied raster imagery. */
.cinematic-hero{height:calc(100svh - 82px);min-height:650px;padding:0 5%;display:flex;flex-direction:column;justify-content:center;background:#081b16;color:#f5f4ee}
.cinematic-hero::after,.cinematic-hero::before{display:none}
.cinema-scenes{position:absolute;inset:0;z-index:-1;overflow:hidden;background:#081b16}
.cinema-scene{position:absolute;inset:0;visibility:hidden;overflow:hidden;z-index:0}
.cinema-scene.is-current{visibility:visible;z-index:1}
.cinema-scene img{width:100%;height:100%;object-fit:cover;object-position:68% 50%;animation:cinema-drift 3s ease-in-out infinite alternate;transform:scale(1.04);filter:brightness(.8)}
.cinema-scene[data-scene="1"] img{object-position:50% 65%;filter:brightness(.95)}
.cinema-scene[data-scene="2"] img{object-position:50% 50%;filter:brightness(.7);animation-name:gallery-drift}
@keyframes cinema-drift{from{transform:scale(1.04) translateX(-.6%)}to{transform:scale(1.13) translateX(1%)}}
@keyframes gallery-drift{from{transform:scale(1.12) translateX(1%)}to{transform:scale(1.03) translateX(-.6%)}}
.cinematic-hero.is-paused .cinema-scene img{animation-play-state:paused}
.cinematic-hero .hero-copy{max-width:630px;padding:30px 0 85px;pointer-events:auto;text-shadow:0 2px 20px #0008}
.cinematic-hero h1{font-size:clamp(65px,6.3vw,106px);letter-spacing:-5px;margin:25px 0;line-height:1.09}
.cinematic-hero .hero-sub{font-size:clamp(21px,2vw,28px);margin:20px 0}
.cinematic-hero .muted{color:#ebeee7;font-size:14px;line-height:1.9}
.cinematic-hero .eyebrow{color:#e1eade;font-size:10px;letter-spacing:3px}
.cinematic-hero .button{margin-top:18px;background:#d7edc3;color:#102a20;text-shadow:none}
.cinematic-hero .hero-foot{position:absolute;left:5%;right:5%;bottom:0;padding:20px 0;color:inherit;align-items:center}
.scene-select{display:flex;align-items:center;gap:12px}
.scene-select button{border:1px solid currentColor;background:transparent;color:inherit;border-radius:50%;width:40px;height:40px;font-size:11px}
.scene-select button[aria-pressed="true"]{background:#d7edc3;color:#102a20;border-color:#d7edc3}
.scene-caption{font-size:9px;letter-spacing:1.5px;margin-left:15px}
.cinema-controls{position:absolute;right:5%;top:24px;display:flex;gap:10px;z-index:4}
.cinematic-hero .cinema-controls button{position:static;min-height:40px;font-size:11px;background:#102a20d9;color:#f2f5ef;border:1px solid #b5d8ab66}
.cinematic-hero.light-scene{color:#17251c}
.cinematic-hero.light-scene .hero-copy{text-shadow:0 1px 18px #fff9}
.cinematic-hero.light-scene .eyebrow,.cinematic-hero.light-scene .muted{color:#24372a}
.cinematic-hero.light-scene .hero-foot{border-color:#17251c55}
.cinematic-hero.light-scene .dot{color:#397547}
@media(max-width:900px){.cinematic-hero .hero-copy{max-width:65%}.scene-caption{display:none}}
@media(max-width:650px){
.cinematic-hero{height:calc(100svh - 75px);min-height:650px;padding:0 6%;justify-content:flex-end}
.cinematic-hero .hero-copy{max-width:none;padding:0 0 108px;text-shadow:0 2px 15px #000b}
.cinematic-hero h1{font-size:clamp(52px,14vw,76px);letter-spacing:-3px;margin:18px 0}
.cinematic-hero .hero-sub{font-size:20px;margin:16px 0}
.cinematic-hero .muted{display:none}
.cinematic-hero .eyebrow{font-size:8px;letter-spacing:2px}
.cinematic-hero .button{font-size:12px;padding:12px 18px;margin-top:10px}
.cinematic-hero .cinema-controls{top:18px;right:6%}
.cinematic-hero .cinema-controls button{font-size:10px;padding:8px 12px}
.cinematic-hero .hero-foot{left:6%;right:6%;font-size:8px;letter-spacing:.5px;padding:16px 0;gap:10px}
.scene-select{gap:8px}.scene-select button{width:36px;height:36px}
.cinema-scene img{object-position:66% 40%;filter:brightness(.62)}
.cinema-scene[data-scene="1"] img{object-position:30% 50%;filter:brightness(.94)}
.cinema-scene[data-scene="2"] img{object-position:48% 40%;filter:brightness(.55)}
.cinematic-hero.light-scene .hero-copy{background:#f5f4eecc;margin:0 -3%;padding:18px 3% 108px}
}
@media(prefers-reduced-motion:reduce){.cinema-scene img{animation:none}}
/* Three separate editorial blocks, each with its own moving background. */
.motion-section{position:relative;isolation:isolate;overflow:hidden;min-height:100svh;display:flex;flex-direction:column;justify-content:space-between;border:0;padding-top:90px;padding-bottom:75px}
.section-backdrop{position:absolute;inset:0;z-index:-2;pointer-events:none;overflow:hidden}
.section-backdrop img{width:100%;height:100%;object-fit:cover;animation:cinema-drift 4.5s ease-in-out infinite alternate;transform:scale(1.04)}
.motion-section.is-paused .section-backdrop img{animation-play-state:paused}
.motion-section>.kinetic-control{z-index:3;right:5%;top:25px;min-height:40px;font-size:11px}
.motion-section .section-top{padding-right:0}
.knowledge-section{background:#eeeade;color:#14271a}
.knowledge-section .section-backdrop img{object-position:50% 55%}
.knowledge-section h2{margin-bottom:160px;text-shadow:0 1px 18px #fff9}
.knowledge-section .services{background:#f6f5edeb;backdrop-filter:blur(8px);padding:26px 30px 12px}
.knowledge-section .services>a{margin-right:22px;border-color:#56674960}
.knowledge-section .services>a:last-child{margin-right:0;border-right:0}
.knowledge-section .services h3{font-size:24px;margin:22px 0 16px}
.knowledge-section .services p{color:#394c3c}
.gallery-section{background:#0c1c18;color:#fff;min-height:110svh}
.gallery-section .section-backdrop img{object-position:50% 50%;filter:brightness(.57);animation-name:gallery-drift}
.gallery-section .side-note,.gallery-section .eyebrow{color:#d4e5da}
.gallery-section h2{font-size:clamp(38px,4.5vw,70px);margin:35px 0 220px;text-shadow:0 3px 24px #0007}
.gallery-section .work-grid{gap:60px;background:#09231bd9;backdrop-filter:blur(8px);padding:30px 35px}
.gallery-section .work-card h3{font-size:25px;margin:10px 0 15px}
.gallery-section .work-card>p:not(.eyebrow){color:#d0ddd5;max-width:480px}
.gallery-section .work-card>a{color:#e6f4d3}
@media(max-width:900px){.knowledge-section h2{margin-bottom:100px}.knowledge-section .services{padding:22px}.gallery-section h2{margin-bottom:180px}.gallery-section .work-grid{gap:30px;padding:25px}}
@media(max-width:650px){
.motion-section{min-height:100svh;padding:80px 6% 35px}
.motion-section .section-top{display:block}.motion-section .side-note{display:none}
.motion-section h2{font-size:34px;letter-spacing:-1.8px;line-height:1.35;margin:25px 0 160px}
.motion-section>.kinetic-control{right:6%;top:20px;font-size:10px;padding:8px 12px}
.knowledge-section .section-backdrop img{object-position:45% 40%}
.knowledge-section .services{display:grid;grid-template-columns:1fr 1fr;gap:22px 18px;padding:20px 18px 5px}
.knowledge-section .services>a{margin:0;padding:18px 0 35px;border-right:0}
.knowledge-section .services h3{font-size:19px;margin:15px 0 12px;letter-spacing:-.7px}
.knowledge-section .services p{font-size:12px;line-height:1.8;word-break:keep-all}
.gallery-section h2{font-size:34px;margin-bottom:210px}
.gallery-section .section-backdrop img{object-position:45% 40%;filter:brightness(.57)}
.gallery-section .work-grid{grid-template-columns:1fr;gap:25px;padding:24px}
.gallery-section .work-card+article{border-top:1px solid #fff3;padding-top:22px}
.gallery-section .work-card h3{font-size:22px}.gallery-section .work-card>p:not(.eyebrow){font-size:13px}
}
@media(prefers-reduced-motion:reduce){.section-backdrop img{animation:none}}

.cinematic-hero .hero-copy{max-width:900px}
.cinematic-hero .hero-copy h1{font-size:clamp(48px,6.3vw,100px);line-height:1.04;letter-spacing:-.055em}
#site-music-toggle{position:fixed;right:24px;bottom:24px;z-index:80;border:1px solid #ffffff50;border-radius:30px;background:#123d30;color:#fff;padding:12px 19px;font:600 13px inherit;cursor:pointer;box-shadow:0 4px 24px #0003}
#site-music-toggle:focus-visible{outline:3px solid #dfff69;outline-offset:4px}
.music-status:not(:empty){position:fixed;right:24px;bottom:80px;z-index:80;max-width:280px;background:#fff;color:#16382b;padding:14px;border-radius:8px}
@media(max-width:650px){.cinematic-hero .hero-copy h1{font-size:clamp(38px,9.8vw,64px);letter-spacing:-.055em}.cinematic-hero .hero-copy{max-width:100%}#site-music-toggle{right:16px;bottom:16px;padding:11px 15px;font-size:12px}}
/* Camera opens the sequence; the projected sculpture dissolves over it. */
.cinematic-hero .cinema-scene.is-current{display:block;visibility:visible;z-index:1}.cinematic-hero .cinema-scene img{animation:none;transform:none}
.hero-sculpture{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:2;opacity:0}

.cinematic-hero .cinema-scene img{transform-origin:70% 50%;will-change:transform,filter}

/* Layer motion never intercepts links or changes the approved artwork. */
.depth-backdrop{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;display:none}
.depth-ready .depth-backdrop{display:block}.depth-ready>img{visibility:hidden}
.gallery-section .depth-backdrop{filter:brightness(.57)}
.knowledge-section .depth-backdrop{filter:contrast(1.03)}
.brand-network .network-film{animation:red-film-travel 15s ease-in-out infinite;transform-origin:50% 45%}
@keyframes red-film-travel{0%,100%{transform:scale(1.03) translateX(-.5%)}50%{transform:scale(1.12) translateX(.5%)}}
.brand-network .network-node{animation-duration:2.4s}
.brand-network.outside-view .network-film{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){.depth-backdrop{display:none!important}.depth-ready>img{visibility:visible}.brand-network .network-film{animation:none}}

/* Pre-rendered 1080p film: preserve DOM copy and accessible calls to action. */
#hero-remotion-film{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%;z-index:3;pointer-events:none}
@media(max-width:650px){#hero-remotion-film{height:52%;object-position:100% 50%;object-fit:cover}.cinematic-hero .cinema-scenes{background:#061713}.cinematic-hero:has(#hero-remotion-film) .cinema-scene{display:none}}
@media(prefers-reduced-motion:reduce){#hero-remotion-film{display:none}}
@media(prefers-reduced-motion:reduce){.cinematic-hero:has(#hero-remotion-film) .cinema-scene{display:block}}
/* Reserve separate copy and film regions at narrow widths. */
@media(min-width:1101px){
 #hero-remotion-film{object-fit:contain}
 .cinematic-hero:has(#hero-remotion-film) .hero-copy{max-width:44%}
 .cinematic-hero:has(#hero-remotion-film) h1{font-size:clamp(54px,5.4vw,100px)}
}
@media(max-width:1100px){
 .cinematic-hero:has(#hero-remotion-film){--film-height:clamp(260px,68vw,440px);height:auto;min-height:calc(100svh - 75px);padding:var(--film-height) 6% 0;justify-content:flex-start}
 .cinematic-hero:has(#hero-remotion-film) #hero-remotion-film{height:var(--film-height);object-fit:cover;object-position:100% 50%}
 .cinematic-hero:has(#hero-remotion-film) .cinema-scenes{background:#061713}
 .cinematic-hero:has(#hero-remotion-film) .cinema-scene{display:none}
 .cinematic-hero:has(#hero-remotion-film) .hero-copy{max-width:100%;width:100%;padding:30px 0 100px;margin:0}
 .cinematic-hero:has(#hero-remotion-film) h1{font-size:clamp(46px,8vw,70px);letter-spacing:-2px;margin:18px 0}
 .cinematic-hero:has(#hero-remotion-film) .hero-sub{font-size:clamp(19px,3vw,25px)}
}
@media(prefers-reduced-motion:reduce) and (max-width:1100px){
 .cinematic-hero:has(#hero-remotion-film) .cinema-scene{display:block;height:var(--film-height)}
}




/* Phone screens show the right-hand artwork and captions at readable scale. */
@media(max-width:650px){
 .cinematic-hero:has(#hero-remotion-film){--film-height:112.5vw}
 .cinematic-hero:has(#hero-remotion-film) #hero-remotion-film{width:200%;max-width:none;left:-100%;right:auto;height:var(--film-height);object-fit:contain}
}

/* The gallery architecture stays still; only the masked sea is animated. */
.gallery-section .section-backdrop img{animation:none!important;transform:none!important;object-position:50% 50%}
.gallery-letter{opacity:0}
.letters-visible .gallery-letter{animation:gallery-letter-in 6s linear var(--letter-delay) infinite both}
@keyframes gallery-letter-in{0%{opacity:0}3%,68%{opacity:1}78%,100%{opacity:0}}
@media(prefers-reduced-motion:reduce){.gallery-letter{opacity:1!important;animation:none!important}}

.knowledge-section .letters-visible .gallery-letter{animation-duration:3s}

.hero-promise{position:absolute;right:5%;bottom:9%;width:43%;z-index:2;color:#f6f3e9;font-size:clamp(14px,1.2vw,20px);font-weight:700;line-height:1.6;word-break:keep-all;pointer-events:none}
.hero-promise p{margin:0 0 6px}.hero-promise span{opacity:0}
.promise-active span{animation:promise-type 6s linear var(--promise-delay) infinite both}
@keyframes promise-type{0%{opacity:0}2%,65%{opacity:1}78%,100%{opacity:0}}
@media(max-width:1100px){.hero-promise{top:calc(var(--film-height)*.81);bottom:auto;right:5%;width:55%;font-size:14px;line-height:1.45}}
@media(max-width:650px){.hero-promise{width:90%;font-size:clamp(13px,3.7vw,20px)}}
@media(prefers-reduced-motion:reduce){.hero-promise span{opacity:1;animation:none!important}}

/* One sentence at a time; stable shared box avoids duplicate lines and layout shifts. */
.hero-promise{display:grid}
.hero-promise p{grid-area:1/1;margin:0}
.hero-promise span{animation:none!important;opacity:1;visibility:hidden}
@media(prefers-reduced-motion:reduce){.hero-promise p{grid-area:auto;opacity:1!important}.hero-promise span{visibility:visible!important}}

/* Space art continues behind the film; captions have no panel or stripe. */
.cinematic-hero:has(#hero-remotion-film){background:#020611}
.cinematic-hero:has(#hero-remotion-film) .cinema-scenes{background:#020611 url('/assets/hero-universe.png') center/cover}
.hero-promise{background:none!important;border:0;box-shadow:none;text-shadow:0 1px 5px #0008}
.cinematic-hero:has(#hero-remotion-film) h1{font-size:clamp(34px,4vw,72px);line-height:1.24;letter-spacing:-2px;word-break:keep-all}
.cinematic-hero:has(#hero-remotion-film) .hero-sub{font-size:clamp(17px,1.5vw,23px);line-height:1.65;word-break:keep-all}
.cinematic-hero:has(#hero-remotion-film) .eyebrow{letter-spacing:.6px;font-size:clamp(12px,1vw,16px)}
@media(max-width:650px){.cinematic-hero:has(#hero-remotion-film) h1{font-size:clamp(31px,8.2vw,49px);letter-spacing:-1.2px}.cinematic-hero:has(#hero-remotion-film) .cinema-scenes{background-size:auto var(--film-height);background-repeat:no-repeat;background-position:top right}}

/* Keep the original identity, introduce the slogan, and pair the lower message with its CTA. */
.cinematic-hero:has(#hero-remotion-film){min-height:800px}
.cinematic-hero:has(#hero-remotion-film) .hero-copy{padding:30px 0 90px}
.cinematic-hero:has(#hero-remotion-film) h1{font-size:clamp(48px,5.3vw,94px);line-height:1.04;letter-spacing:-.055em;margin:20px 0 26px}
.hero-slogan{margin:0 0 34px;max-width:550px}
.hero-slogan .slogan-intro{margin:0 0 12px}
.hero-slogan .slogan-intro,.hero-slogan h2{font-size:clamp(25px,2.5vw,43px);line-height:1.3;letter-spacing:-1px;margin:0 0 14px;word-break:keep-all}
.hero-slogan .slogan-description{font-size:clamp(14px,1.12vw,18px);line-height:1.7;color:#dce4ee;margin:0;word-break:keep-all}
.hero-action-row{display:flex;align-items:center;gap:28px}
.cinematic-hero:has(#hero-remotion-film) .hero-action-row .hero-sub{font-size:clamp(16px,1.4vw,23px);margin:0;line-height:1.5}
.cinematic-hero .hero-action-row .button{margin:0;white-space:nowrap;flex-shrink:0;padding:17px 20px;font-size:13px;gap:24px}
@media(min-width:1101px){.cinematic-hero:has(#hero-remotion-film) .hero-copy{max-width:48%}}
@media(max-width:1100px){.cinematic-hero:has(#hero-remotion-film) .hero-copy{padding:30px 0 100px}.hero-slogan{max-width:600px}.hero-slogan .slogan-intro,.hero-slogan h2{font-size:32px}.hero-slogan .slogan-description{font-size:16px}}
@media(max-width:650px){.cinematic-hero:has(#hero-remotion-film) h1{font-size:clamp(36px,9.3vw,60px)}.hero-slogan .slogan-intro,.hero-slogan h2{font-size:28px}.hero-action-row{gap:12px;justify-content:space-between}.cinematic-hero:has(#hero-remotion-film) .hero-action-row .hero-sub{font-size:14px}.cinematic-hero .hero-action-row .button{font-size:11px;padding:14px 12px;gap:12px}}

.hero-slogan .slogan-intro,.hero-slogan h2{font-weight:700;color:inherit;line-height:1.3;letter-spacing:-1px;word-break:keep-all}
/* Edge-to-edge film and wide-screen slogan hierarchy. */
@media(min-width:1101px){
 .cinematic-hero:has(#hero-remotion-film) #hero-remotion-film{object-fit:cover}
 .cinematic-hero:has(#hero-remotion-film) .hero-copy{max-width:62%;padding-top:40px}
 .hero-slogan{max-width:none}
 .hero-slogan .slogan-intro,.hero-slogan h2{font-size:clamp(25px,2.2vw,43px);white-space:nowrap}
}
.hero-slogan .slogan-description{font-size:clamp(18px,1.5vw,26px);line-height:1.65;max-width:720px}
.hero-action-row{margin-top:64px}
.cinematic-hero .hero-action-row .button{background:#e8edf5;color:#142037;border:1px solid #ffffffb3;box-shadow:0 4px 22px #0002}
.cinematic-hero .hero-action-row .button:hover{background:#fff;color:#172b50}
@media(max-width:1100px){.hero-slogan .slogan-intro,.hero-slogan h2{font-size:clamp(22px,3.5vw,32px)}.hero-slogan .slogan-description{font-size:20px}.hero-action-row{margin-top:48px}}
@media(max-width:650px){.hero-slogan .slogan-intro,.hero-slogan h2{white-space:normal;font-size:24px}.hero-slogan .slogan-description{font-size:18px}.hero-action-row{margin-top:40px}}
/* Air between the identity, slogan, and lower action. */
.cinematic-hero .dot{color:#fff}
.cinematic-hero:has(#hero-remotion-film) h1{margin-bottom:48px}
.hero-slogan .slogan-intro{margin-bottom:20px}
.hero-slogan h2{margin-bottom:22px}
.hero-action-row{margin-top:88px}
@media(min-width:1101px){.cinematic-hero:has(#hero-remotion-film){min-height:900px}}
@media(max-width:1100px){.hero-action-row{margin-top:64px}}
@media(max-width:650px){.cinematic-hero:has(#hero-remotion-film) h1{margin-bottom:36px}.hero-action-row{margin-top:52px}}

#site-music-toggle{background:#d5ff57;color:#17201b;border-color:#d5ff57}

/* Give every brand dialog action its own breathing room. */
#brand-dialog .brand-site{display:inline-block;margin-left:24px;vertical-align:middle}
@media(max-width:650px){#brand-dialog .brand-site{display:table;margin:20px 0 0}}
/* Lime during the reveal, then white when the sentence is complete. */
.hero-promise{font-size:clamp(15px,calc(1.2vw + 1px),21px)}
@media(max-width:1100px){.hero-promise{font-size:15px}}
@media(max-width:650px){.hero-promise{font-size:clamp(14px,calc(3.7vw + 1px),21px)}}
