/* Mobile phase 1. Loaded only below 768px; approved desktop rules stay intact. */
@media (max-width:767px) {
 .hero{height:auto;min-height:0;max-height:none;isolation:isolate;background:#03111d;overflow:hidden}
 .hero .hero-photo{inset:0 0 auto;height:380px;background-size:cover;background-position:76% 38%;background-repeat:no-repeat}
 .hero::after{z-index:0;inset:0;mask-image:none;-webkit-mask-image:none;background:linear-gradient(180deg,#03111d40 0,#03111d00 100px,#03111d08 200px,#03111dc9 320px,#03111d 390px);pointer-events:none}
 .hero::before{z-index:2;height:52px;bottom:-1px;pointer-events:none;background:linear-gradient(180deg,#fff0,#ffffff12 25%,#ffffff70 65%,#fff)}
 .hero>header{height:80px;padding:12px 22px;flex-wrap:nowrap;z-index:5;gap:16px;background:linear-gradient(180deg,#03111db3,transparent)}
 .hero>header .wordmark img{width:132px;height:52px}
 .hero>header>.pill{display:none}
 .hero .menu-toggle{display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:76px;padding:10px 14px;border:1px solid #ffffff50;background:#091b2b99;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-radius:28px;color:white;font-size:13px;font-weight:500;position:relative;z-index:2}
 .hero .hero-copy{position:relative;inset:auto;display:block;width:100%;padding:176px 22px 80px;z-index:1}
 .hero h1{font-size:clamp(29px,8.45vw,39px);line-height:1.075;letter-spacing:-.9px;font-weight:500;max-width:520px}
 .hero .hero-headline-line{white-space:normal}
 .hero .hero-copy>p:not(.eyebrow){max-width:440px;font-size:15px;line-height:1.45;font-weight:400;color:#d0dae4;margin:17px 0 0}
 .hero .hero-support-line{display:inline;white-space:normal}
 .hero .hero-copy .actions{margin-top:22px;display:flex}
 .hero .hero-copy .actions .pill{min-height:52px;width:100%;max-width:440px;padding:14px 22px;justify-content:space-between;font-size:15px;font-weight:600;letter-spacing:0;background:linear-gradient(105deg,#35baf3,#1688dc);border:1px solid #66cfff80;box-shadow:0 7px 25px #139fed30,inset 0 1px 0 #ffffff40;backdrop-filter:none;-webkit-backdrop-filter:none}
 .hero .hero-copy .actions .pill:hover{background:linear-gradient(105deg,#4bc4f7,#2198eb)}
 .hero>header nav{display:none;margin:0;position:fixed;inset:80px 12px auto;max-height:calc(100dvh - 104px);overflow-y:auto;border-radius:22px;border:1px solid #d1e9ff33;background:linear-gradient(145deg,#0c243bf5,#101425fa);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);padding:16px;box-shadow:0 24px 70px #0008;z-index:1}
 .hero>header nav.open{display:grid;gap:4px}
 .hero>header nav a{display:flex;align-items:center;min-height:56px;padding:14px 16px;border-radius:12px;font-size:19px;font-weight:500;color:#eff7ff}
 .hero>header nav a:hover,.hero>header nav a:focus-visible{background:#74c8ff18}
 .hero.mobile-menu-is-open{overflow:visible;z-index:100}
 .hero.mobile-menu-is-open::after{position:fixed;background:#020914b8;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);z-index:3}
 html.mobile-menu-open{overflow:hidden}
 .hero .menu-toggle:focus-visible,.hero nav a:focus-visible,.hero .actions .pill:focus-visible{outline:3px solid #99dfff;outline-offset:3px}
}
@media (max-width:359px) {
 .hero>header{padding-inline:18px}
 .hero .hero-copy{padding:148px 18px 72px}
 .hero .hero-photo{height:350px}
 .hero h1{font-size:29px;letter-spacing:-.8px}
 .hero .hero-copy>p:not(.eyebrow){font-size:14px}
}
@media (min-width:431px) and (max-width:767px) {
 .hero .hero-photo{height:440px;background-position:73% 40%}
 .hero .hero-copy{padding-top:210px;padding-inline:28px}
 .hero::after{background:linear-gradient(180deg,#03111d40,transparent 130px,#03111d55 280px,#03111d 450px)}
 .hero>header{padding-inline:28px}
}
@media (max-width:767px) and (prefers-reduced-motion:reduce) {
 .hero *{scroll-behavior:auto;transition:none}
}