/* Bridgemont Life: one glass nav bar over a pinned "Many Lives" hero, then calm white sections. Mobile first. */
:root{--bg:#FFFFFF;--bg-soft:#F3F6FB;--bg-tint:#EAF2FF;--ink:#0B1220;--ink-soft:#5A6478;--line:#E2E8F2;--royal:#015AFF;--royal-deep:#0047CC;--sky:#00B2FE;--glass:rgba(255,255,255,.6);--glass-line:rgba(255,255,255,.75);--font:"Manrope",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;--ease:cubic-bezier(.23,1,.32,1);--wrap:1120px;--gutter:16px;--edge:clamp(16px,3vw,48px);--nav-h:64px;color-scheme:light}
@media(min-width:900px){:root{--gutter:32px}}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4{margin:0;text-wrap:balance;letter-spacing:-.02em;line-height:1.1}
p,ul,ol{margin:0;text-wrap:pretty}
ul,ol{padding-left:1.2em}
li+li{margin-top:6px}
strong{font-weight:700}
::selection{background:rgba(1,90,255,.18)}
:focus-visible{outline:2px solid var(--royal);outline-offset:3px;border-radius:4px}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.wrap{width:min(100% - var(--gutter) * 2,var(--wrap));margin-inline:auto}
.narrow{max-width:720px}
.todo{background:#FFF3C4;color:#6B4D00;padding:0 4px;border-radius:4px;font-weight:700}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:11px 18px;border-radius:999px;font:700 14px/1.15 var(--font);border:1px solid transparent;cursor:pointer;transition:transform .12s var(--ease),background .14s var(--ease),border-color .14s var(--ease),color .14s var(--ease);white-space:nowrap;text-align:center}
.btn:active{transform:scale(.97)}
.btn-primary{background:var(--royal);color:#fff}
.btn-primary:hover{background:var(--royal-deep)}
.btn-ghost{background:rgba(255,255,255,.6);border-color:rgba(11,18,32,.12);color:var(--ink)}
.btn-ghost:hover{background:#fff;border-color:rgba(11,18,32,.22)}
.btn-white{background:#fff;color:var(--royal)}
.btn-white:hover{color:var(--royal-deep)}
.btn-glass{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.55);color:#fff;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.btn-glass:hover{background:rgba(255,255,255,.26)}
.btn-outline{background:transparent;border-color:#fff;color:#fff}
.btn-outline:hover{background:#fff;color:var(--royal)}
.btn-lg{padding:15px 24px;font-size:16px}
.btn-wrap{white-space:normal;line-height:1.25;max-width:100%}
.btn[disabled]{opacity:.55;cursor:default;transform:none}
.btn-arrow::after{content:"\2192";transition:transform .14s var(--ease)}
.btn-arrow:hover::after{transform:translateX(3px)}
.more{display:inline-flex;align-items:center;gap:6px;font-weight:700;color:var(--royal);font-size:15.5px}
.more::after{content:"\2192";transition:transform .14s var(--ease)}
.more:hover::after{transform:translateX(3px)}
.ctas{display:flex;gap:10px;flex-wrap:wrap}

/* Nav: one glass bar across the whole top edge, mobile first. Logo never shrinks; links show only when every one of them fits. */
.nav{position:fixed;top:0;left:0;right:0;z-index:60;padding-top:env(safe-area-inset-top,0px);background:rgba(255,255,255,.66);border-bottom:1px solid rgba(11,18,32,.08);box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 8px 28px rgba(10,30,70,.06);-webkit-backdrop-filter:blur(22px) saturate(1.7);backdrop-filter:blur(22px) saturate(1.7)}
.nav-in{display:flex;align-items:center;gap:6px;height:calc(var(--nav-h) - 1px);padding-inline:var(--edge)}
.brand{display:flex;align-items:center;flex:0 0 auto;padding-block:4px;margin-right:auto}
.brand img{height:20px;width:auto;max-width:none}
.links{display:none;gap:2px;margin-left:auto}
.links a{padding:9px 12px;border-radius:999px;font-size:14px;font-weight:600;transition:background .14s var(--ease);white-space:nowrap}
.links a:hover{background:rgba(11,18,32,.06)}
.links a[aria-current=page]{background:rgba(1,90,255,.1);color:var(--royal-deep)}
.nav-cta{display:none;gap:6px;flex:0 0 auto}
.menu-btn{display:flex;flex:0 0 auto;width:42px;height:42px;border-radius:999px;border:1px solid rgba(11,18,32,.12);background:rgba(255,255,255,.6);flex-direction:column;align-items:center;justify-content:center;gap:5px;cursor:pointer;padding:0;margin-left:2px}
.menu-btn span{display:block;width:16px;height:2px;border-radius:2px;background:var(--ink);transition:transform .2s var(--ease),opacity .2s var(--ease)}
.menu-btn[aria-expanded=true] span:first-child{transform:translateY(3.5px) rotate(45deg)}
.menu-btn[aria-expanded=true] span:last-child{transform:translateY(-3.5px) rotate(-45deg)}
.sheet{position:fixed;left:12px;right:12px;top:calc(env(safe-area-inset-top,0px) + 72px);z-index:59;border-radius:24px;padding:10px;display:flex;flex-direction:column;gap:2px;max-height:calc(100dvh - env(safe-area-inset-top,0px) - 84px);overflow:auto;background:rgba(255,255,255,.86);border:1px solid var(--glass-line);box-shadow:0 24px 60px rgba(10,30,70,.18);-webkit-backdrop-filter:blur(24px) saturate(1.6);backdrop-filter:blur(24px) saturate(1.6)}
.sheet[hidden]{display:none}
.sheet a:not(.btn){padding:12px 14px;border-radius:14px;font-weight:700;font-size:17px}
.sheet a:not(.btn):hover{background:rgba(11,18,32,.05)}
.sheet a[aria-current=page]{color:var(--royal-deep)}
.sheet .login{font-size:15px;font-weight:600;color:var(--ink-soft);border-top:1px solid var(--line);border-radius:0;margin-top:4px;padding-top:14px}
.sheet .btn{padding:14px;font-size:15px}
.sheet .btn-primary{margin-top:8px}
.scrim{position:fixed;inset:0;z-index:58;background:rgba(11,18,32,.18)}
.scrim[hidden]{display:none}
@media(min-width:600px){.nav-cta{display:flex}.brand img{height:22px}.sheet{left:auto;right:16px;width:320px}}
@media(min-width:1000px){.links{display:flex}.links a.secondary{display:none}}
@media(min-width:1180px){.links a.secondary{display:inline-flex}.menu-btn{display:none}.sheet{display:none!important}.scrim{display:none!important}}
/* Phones: both CTAs live in a compact glass bar at the bottom, so they never leave the screen. */
.cta-bar{position:fixed;left:0;right:0;bottom:0;z-index:57;display:flex;gap:8px;padding:10px 12px calc(10px + env(safe-area-inset-bottom,0px));background:rgba(255,255,255,.72);border-top:1px solid var(--glass-line);box-shadow:0 -8px 30px rgba(10,30,70,.08);-webkit-backdrop-filter:blur(20px) saturate(1.6);backdrop-filter:blur(20px) saturate(1.6)}
.cta-bar .btn{flex:1 1 0;padding:13px 10px;font-size:15px;min-width:0}
body.has-bar{padding-bottom:calc(66px + env(safe-area-inset-bottom,0px))}
body.menu-open .cta-bar{display:none}
@media(min-width:600px){.cta-bar{display:none}body.has-bar{padding-bottom:0}}

/* Hero: "Many Lives". A wall of portraits with a Bridgemont blue panel over part of it; scroll slides the panel away and drifts the columns,
   then the camera pulls back: the wall shrinks and fills with more and more people, the brand mark comes to the centre as a window onto the crowd (the crowd stays faintly
   behind it), holds, turns solid blue, then slides left while the wordmark is revealed beside it, ending on the logo at the nav logo's proportions.
   .mosaic is the rest-state grid; the four .wall layers draw one repeating face sheet behind it once it zooms out (hero.js sizes and aligns them);
   .crowdveil is the white cover with the mark-shaped hole. */
.track{position:relative}
.track-b{height:300vh;height:300svh}
.stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;background:var(--bg);isolation:isolate}
.crowd{position:absolute;inset:0;z-index:1;will-change:transform,opacity}
.crowdveil{position:absolute;inset:0;z-index:2;background:var(--bg);opacity:0;will-change:opacity}
.wall{position:absolute;left:-50%;top:-50%;width:200%;height:200%;background-repeat:repeat;visibility:hidden;will-change:transform,opacity}
.mosaic{position:absolute;inset:-12% -3%;display:grid;grid-template-columns:repeat(7,1fr);grid-template-rows:repeat(5,1fr);gap:4px;background:var(--bg);will-change:transform,opacity}
.tile{min-width:0;min-height:0;will-change:transform;background:var(--bg-soft) center/cover no-repeat}
.tile:nth-child(n+36){display:none}
/* The opener panel (.copy): brand blue over part of the wall, at .92 so a trace of the faces shows through. Phones: the lower part of the hero,
   faces above, padded clear of the CTA bar. From 600px: a tall panel on the left, its text lined up with the nav logo. The gradient runs on the
   brand's 45-degree axis, sky in the top-right corner turning royal a fixed distance in (--glow), so the text always sits on royal and white
   keeps AA contrast over the lightest face whatever the panel's shape. hero.js slides it out. */
.copy{position:absolute;z-index:5;left:0;right:0;bottom:0;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:28px var(--edge) calc(94px + env(safe-area-inset-bottom,0px));color:#fff;background:linear-gradient(225deg,rgba(0,178,255,.92),rgba(0,87,255,.92) var(--glow));--glow:110px;will-change:transform,opacity}
.copy h1{font-size:clamp(34px,4.4vw,64px);font-weight:800;letter-spacing:-.035em;line-height:1.02;max-width:14ch}
.copy .sub{margin-top:16px;font-size:clamp(16px,1.4vw,19px);max-width:34ch;font-weight:500;line-height:1.45}
.copy .ctas{margin-top:26px}
.copy :focus-visible{outline-color:#fff}
@media(max-width:599px) and (max-height:640px){.copy{padding-top:20px}.copy .sub{margin-top:10px}.copy .ctas{margin-top:18px}.copy .btn-lg{padding:13px 16px;font-size:15px}} /* small phones: both CTAs on one row so the faces keep some room */
@media(min-width:600px){.copy{right:auto;top:0;width:max(44%,360px);padding:calc(var(--nav-h) + 32px) var(--edge) 48px;--glow:340px}}
@media(min-width:600px) and (max-height:520px){.copy{width:52%;padding-top:calc(var(--nav-h) + 12px);padding-bottom:16px;--glow:110px}}
/* The final lockup is the logo at its own proportions (logo.png is 2995 x 378: mark 311 x 347 at 0,0; wordmark 2559 x 374 at 435,4). */
.lockup{position:absolute;z-index:3;left:50%;top:46%;transform:translate(-50%,-50%);width:min(100% - var(--gutter) * 2,max(62vw,360px),960px);aspect-ratio:2995/378;pointer-events:none}
.markslot{position:absolute;left:0;top:0;width:calc(100% * 311 / 2995);aspect-ratio:309/346;z-index:1}
.markfill{position:absolute;inset:0;width:100%;height:100%;display:block;opacity:0;transform-origin:50% 50%;will-change:transform,opacity}
.wordmark{position:absolute;left:calc(100% * 435 / 2995);top:calc(100% * 4 / 378);height:calc(100% * 374 / 378);width:auto;opacity:0;will-change:clip-path,opacity}
@media(max-width:599px){.track-b{height:270vh;height:270svh}.mosaic{grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(8,1fr);inset:-12% -3%;gap:2px}.tile:nth-child(n+33){display:none}}
/* Reduced motion: the hero is not pinned and stays on the opener (hero.js lays it out once at rest). */
.reduce .track{height:auto!important}
.reduce .stage{position:relative}

/* Sections */
.section{padding-block:clamp(72px,9vw,128px)}
.section-sm{padding-block:clamp(40px,6vw,80px)}
/* Tinted sections run edge to edge and blend into the white around them: the tint fades in over the top padding and out over the bottom. */
.band{background:linear-gradient(180deg,#fff 0,var(--bg-soft) clamp(48px,6vw,96px),var(--bg-soft) calc(100% - clamp(48px,6vw,96px)),#fff 100%)}
/* How it works: the rotating steps (steps-rotate.css/js, which set their own gap under the lead) get a taller band. */
.how{padding-block:clamp(88px,11vw,160px)}
.tint{background:var(--bg-tint)}
.eyebrow{font-size:12.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--royal);margin-bottom:12px}
h2{font-size:clamp(26px,3vw,38px);font-weight:700;letter-spacing:-.02em;line-height:1.12;max-width:22ch}
h3{font-size:clamp(19px,2vw,22px);font-weight:800}
.lead{color:var(--ink-soft);font-size:clamp(16.5px,1.3vw,18px);line-height:1.55;max-width:60ch;margin-top:16px}
.prose{color:var(--ink-soft);font-size:16.5px;max-width:66ch}
.prose p+p,.prose ul+p,.prose p+ul,.prose p+ol{margin-top:14px}
.prose strong{color:var(--ink)}
.prose h2,.prose h3{color:var(--ink);margin-top:28px;margin-bottom:8px}
.prose h2,.ways h2{font-size:clamp(19px,2vw,22px);letter-spacing:-.02em;max-width:none}
.center{text-align:center}
.center h2,.center .lead{margin-inline:auto}
.split{display:grid;grid-template-columns:1fr;gap:clamp(32px,5vw,80px);align-items:center}
@media(min-width:760px){.split{grid-template-columns:5fr 7fr}.split.rev>.photo{order:2}.split.text-first>.photo{order:2}}
/* Photos sit in clean, near-square frames (6px), the same edge as the cards. */
.photo{border-radius:6px;overflow:hidden;background:var(--bg-soft)}
.photo img{width:100%;height:100%;object-fit:cover;aspect-ratio:3/2}
@media(min-width:760px){.photo.tall img{aspect-ratio:4/5}}
.small{font-size:13.5px;color:var(--ink-soft);line-height:1.5}
.cols{display:grid;grid-template-columns:1fr;gap:clamp(20px,3vw,40px)}
@media(min-width:760px){.cols-2{grid-template-columns:1fr 1fr}.cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}}
.facts{list-style:none;padding:0;display:grid;grid-template-columns:1fr;gap:10px 28px;margin-top:22px}
@media(min-width:560px){.facts{grid-template-columns:1fr 1fr}}
.facts li{margin:0;padding-top:10px;border-top:1px solid var(--line);font-size:15.5px;color:var(--ink-soft)}
.facts strong{color:var(--ink);display:block}
.steps{list-style:none;padding:0;margin:clamp(28px,4vw,48px) 0 0;display:grid;grid-template-columns:1fr;gap:28px;counter-reset:step}
@media(min-width:760px){.steps{grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(24px,3vw,44px)}}
.steps li{margin:0;padding-top:18px;border-top:1px solid var(--line);counter-increment:step}
.steps li::before{content:"0" counter(step);display:block;font-size:13px;font-weight:800;color:var(--royal);letter-spacing:.08em;margin-bottom:10px}
.steps h3{font-size:19px}
.steps p{color:var(--ink-soft);margin-top:8px;font-size:15.5px}
.numbered{counter-reset:n;list-style:none;padding:0;max-width:720px}
.numbered li{position:relative;padding-left:48px;margin:0;counter-increment:n}
.numbered li+li{margin-top:18px}
.numbered li::before{content:counter(n);position:absolute;left:0;top:1px;width:32px;height:32px;border-radius:999px;background:var(--bg-tint);color:var(--royal-deep);font-weight:800;font-size:14px;display:flex;align-items:center;justify-content:center}
.numbered li strong{color:var(--ink)}
.defs{list-style:none;padding:0;margin:0}
.defs li{margin:0;padding:22px 0;border-top:1px solid var(--line)}
.defs li:last-child{border-bottom:1px solid var(--line)}
@media(min-width:760px){.defs li{display:grid;grid-template-columns:1fr 2fr;gap:24px}}
.defs h3{font-size:20px}
.defs p{color:var(--ink-soft);font-size:15.5px}
.defs .fits{margin-top:10px;font-size:14.5px}
.defs .fits strong{color:var(--ink)}
.table-wrap{overflow-x:auto;margin-top:24px;-webkit-overflow-scrolling:touch;border:1px solid var(--line);border-radius:16px}
table{border-collapse:collapse;width:100%;min-width:560px;font-size:14.5px}
th,td{text-align:left;vertical-align:top;padding:12px 14px;border-bottom:1px solid var(--line)}
th{font-size:13px;font-weight:800;color:var(--ink);background:var(--bg-soft);letter-spacing:.02em}
tr:last-child td{border-bottom:0}
td{color:var(--ink-soft)}
td:first-child{color:var(--ink);font-weight:700}
.notice{border:1px solid var(--line);border-radius:16px;padding:18px 20px;font-size:14.5px;color:var(--ink);background:#fff}
.notice p+p{margin-top:8px}
details{border-top:1px solid var(--line);padding:4px 0}
details:last-of-type{border-bottom:1px solid var(--line)}
summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:16px 0;font-weight:700;font-size:17px}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";flex:none;width:28px;height:28px;border-radius:999px;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-weight:600;color:var(--royal);transition:transform .2s var(--ease)}
details[open] summary::after{transform:rotate(45deg)}
details .prose{padding:0 0 18px;max-width:70ch}
.faq-group h2{font-size:clamp(22px,2.4vw,28px);margin-bottom:8px}
.faq-group+.faq-group{margin-top:48px}
.check{list-style:none;padding:0}
.check li{position:relative;padding-left:28px;margin:0}
.check li+li{margin-top:10px}
.check li::before{content:"";position:absolute;left:0;top:7px;width:16px;height:16px;border-radius:999px;background:var(--bg-tint);border:1px solid rgba(1,90,255,.25)}
.check li::after{content:"";position:absolute;left:5px;top:11px;width:6px;height:3px;border-left:2px solid var(--royal);border-bottom:2px solid var(--royal);transform:rotate(-45deg)}
.check.no li::before{background:#FFF1F0;border-color:rgba(200,40,20,.25)}
.check.no li::after{border-color:#B42318;width:0;height:7px;border-left:0;border-bottom:0;border-right:2px solid #B42318;left:7px;top:7px;transform:rotate(45deg)}

/* Page hero (inner pages): headline left, photo right */
.page-hero{padding-top:calc(var(--nav-h) + env(safe-area-inset-top,0px) + clamp(40px,6vw,72px));padding-bottom:clamp(40px,6vw,80px)}
.page-hero h1{font-size:clamp(34px,4.6vw,58px);font-weight:800;letter-spacing:-.035em;line-height:1.04;max-width:16ch}
.page-hero .lead{margin-top:16px;max-width:52ch}
.page-hero .ctas{margin-top:28px}
.page-hero.plain{padding-bottom:clamp(24px,3vw,40px)}
.page-hero.plain h1{max-width:20ch}

/* Home: talk section with the brand shape */
.talk{position:relative;overflow:hidden;background:linear-gradient(180deg,#fff 0,var(--bg-tint) clamp(56px,7vw,112px),var(--bg-tint) calc(100% - clamp(56px,7vw,112px)),#fff 100%)}
.talk .split{grid-template-columns:1fr}
@media(min-width:760px){.talk .split{grid-template-columns:1.05fr .95fr}}
.shape{position:relative;min-height:220px}
@media(max-width:759px){.talk .mark-morph{width:min(58%,240px)}}

/* Carriers: a lighter headline with the key phrase in brand gradient on a hand-drawn underline */
.carriers h2{font-weight:600;letter-spacing:-.025em;max-width:24ch;font-size:clamp(28px,4vw,50px);line-height:1.12}
.carriers h2 em{font-style:normal;font-weight:800;letter-spacing:-.035em;display:inline-block;position:relative;padding-bottom:.12em;background:linear-gradient(94deg,var(--royal-deep) 0%,var(--royal) 45%,var(--sky) 100%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.carriers h2 em::after{content:"";position:absolute;left:1%;right:1%;bottom:0;height:.2em;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 12' preserveAspectRatio='none'%3E%3Cpath d='M2 8.5C40 3 70 2.5 100 6s60 4 98-2' fill='none' stroke='%2300B2FE' stroke-width='3.2' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center/100% 100%}
.carriers-line{margin:clamp(28px,4vw,40px) auto 0;max-width:30ch;font-size:clamp(20px,2.3vw,26px);letter-spacing:-.02em}

/* Carrier logo rail: one slow GPU drift on a duplicated track. Runs only while on screen (site.js adds .on),
   pauses on hover and focus, static under reduced motion. Edge fades are overlays, not a mask, so WebKit never re-rasterizes the moving track. */
.rail{position:relative;margin-top:clamp(28px,4vw,44px);overflow:hidden}
.rail::before,.rail::after{content:"";position:absolute;top:0;bottom:0;width:clamp(36px,9%,120px);z-index:1;pointer-events:none}
.rail::before{left:0;background:linear-gradient(90deg,#fff,rgba(255,255,255,0))}
.rail::after{right:0;background:linear-gradient(270deg,#fff,rgba(255,255,255,0))}
.rail-track{display:flex;width:max-content;align-items:center;transform:translate3d(0,0,0);backface-visibility:hidden;animation:rail 120s linear infinite;animation-play-state:paused}
.rail.on .rail-track{animation-play-state:running;will-change:transform}
.rail:hover .rail-track,.rail:focus-within .rail-track{animation-play-state:paused}
.rail-track span{display:flex;align-items:center;justify-content:center;flex:none;height:56px;width:150px;margin-right:clamp(28px,4vw,56px)}
.rail-track img{max-height:48px;max-width:140px;width:auto;height:auto;object-fit:contain}
@keyframes rail{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}
@media(prefers-reduced-motion:reduce){.rail::before,.rail::after{display:none}.rail-track{animation:none;flex-wrap:wrap;width:auto;justify-content:center;gap:16px 24px}.rail-track span{margin:0}.rail-track .dup{display:none}}

/* Topic sections on the home page */
.topic .facts{margin-top:26px}
.names{list-style:none;padding:0;margin-top:26px;display:grid;grid-template-columns:1fr 1fr;gap:0 28px}
.names li{margin:0;padding:12px 0 12px 22px;border-top:1px solid var(--line);font-weight:700;font-size:16.5px;color:var(--ink);position:relative}
.names li::before{content:"";position:absolute;left:0;top:calc(12px + .8em);width:9px;height:9px;margin-top:-4.5px;border-radius:999px;background:linear-gradient(135deg,var(--royal),var(--sky))} /* centered on the first line, not the row: a neighbour that wraps makes the row taller */
.topic .btn{margin-top:32px}
.topic .small{margin-top:20px;max-width:60ch}
.topic-annuities .photo img{aspect-ratio:16/9}
@media(min-width:760px){.topic-annuities .photo img{aspect-ratio:21/9}}
.topic-annuities .cols{margin-top:clamp(28px,4vw,48px)}

/* Careers teaser and closing band */
.teaser{border-radius:6px;background:var(--bg-tint);padding:clamp(24px,3vw,40px);display:grid;grid-template-columns:1fr;gap:clamp(20px,3vw,40px);align-items:center}
@media(min-width:760px){.teaser{grid-template-columns:1fr 1.2fr}}
.teaser .photo img{aspect-ratio:4/3}
.closing{position:relative;overflow:hidden;color:#fff;background:radial-gradient(55% 75% at 12% 18%,rgba(190,220,255,.55),transparent 62%),radial-gradient(45% 65% at 88% 85%,rgba(0,178,254,.9),transparent 68%),linear-gradient(135deg,#0152E8 0%,#2F86FF 55%,#00B2FF 100%)}
.closing h2{color:#fff;max-width:18ch}
.closing .lead{color:rgba(255,255,255,.88);max-width:46ch}
.closing .ctas{margin-top:28px}
.closing :focus-visible{outline-color:#fff}

/* Schedule: the Calendly inline embed in a Bridgemont frame */
.cal{max-width:960px;margin-inline:auto}
.cal .calendly-inline-widget{min-width:280px;height:960px}
@media(min-width:760px){.cal .calendly-inline-widget{height:720px}}

/* Footer */
.foot{border-top:1px solid var(--line);padding:clamp(40px,6vw,64px) 0 calc(28px + env(safe-area-inset-bottom,0px));font-size:14px;color:var(--ink-soft)}
.foot-grid{display:grid;grid-template-columns:1fr;gap:28px}
@media(min-width:760px){.foot-grid{grid-template-columns:1.4fr 1fr 1fr}}
.foot img{height:22px;width:auto;margin-bottom:14px}
.foot p{max-width:40ch}
.foot ul{list-style:none;padding:0;display:grid;gap:8px}
.foot li{margin:0}
.foot a{font-weight:600;color:var(--ink)}
.foot a:hover{color:var(--royal)}
.foot h3{font-size:12.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:12px;font-weight:800}
.foot .legal{margin-top:28px;padding-top:16px;border-top:1px solid var(--line);font-size:11px;line-height:1.5;color:var(--ink-soft);max-width:none}
.foot .bottom{margin-top:16px;display:flex;flex-wrap:wrap;gap:8px 24px;justify-content:space-between;font-size:13px}
.foot .bottom span:last-child{max-width:64ch}

/* Gentle rises below the fold */
[data-rise]{transition:opacity .7s var(--ease),transform .7s var(--ease)}
[data-rise].pre{opacity:0;transform:translateY(16px)}
@media(prefers-reduced-motion:reduce){[data-rise]{transition:none}[data-rise].pre{opacity:1;transform:none}}

/* Contact page */
.ways{list-style:none;padding:0;display:grid;grid-template-columns:1fr;gap:12px}
@media(min-width:640px){.ways{grid-template-columns:1fr 1fr}}
.ways li{margin:0;padding:22px;border:1px solid var(--line);border-radius:20px;background:#fff;display:flex;flex-direction:column;gap:6px}
.ways h2{font-size:18px}
.ways p{color:var(--ink-soft);font-size:15px}
.ways .btn,.ways .more{margin-top:8px;align-self:flex-start}
.ways a.big{font-size:clamp(17px,5.5vw,20px);font-weight:800;color:var(--ink);letter-spacing:-.01em;overflow-wrap:anywhere}
.ways a.big:hover{color:var(--royal)}

/* Forms (Get a quote, Apply): one question per screen. Phones: edge to edge. From 760px: one centered card on a soft ground. */
.form-page{min-height:100svh;display:flex;flex-direction:column}
.form-top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:calc(env(safe-area-inset-top,0px) + 14px) var(--gutter) 10px;font-size:14px;color:var(--ink-soft)}
.form-top img{height:20px;width:auto}
.form-top a{font-weight:700;color:var(--ink)}
.form-top .talk-line{text-align:right}
.form-top .talk-line span,.form-top .talk-line em{display:none;font-style:normal}
@media(min-width:480px){.form-top .talk-line em{display:inline}}
@media(min-width:640px){.form-top .talk-line span{display:inline}}
.progress{height:4px;background:var(--line);border-radius:2px;overflow:hidden;margin-bottom:24px}
.progress div{height:100%;width:0;background:var(--royal);border-radius:2px;transition:width .35s var(--ease)}
@media(prefers-reduced-motion:reduce){.progress div{transition:none}}
.form-main{flex:1;display:flex;flex-direction:column;padding:10px var(--gutter) 40px}
#flow{width:min(100%,640px);margin-inline:auto}
.screen{animation:screen-in .3s var(--ease)}
@keyframes screen-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.screen{animation:fade .2s linear}@keyframes fade{from{opacity:0}to{opacity:1}}}
@media(min-width:760px){
  .form-page{background:var(--bg-soft)}
  .form-main{padding:32px var(--gutter) 64px}
  #flow{width:min(100%,720px);padding:28px 48px 44px;background:#fff;border:1px solid var(--line);border-radius:28px;box-shadow:0 24px 64px rgba(10,30,70,.08)}
  .progress{margin-bottom:32px}
}
.back{display:inline-flex;align-items:center;gap:6px;background:none;border:0;padding:8px 10px 8px 0;font:600 14px var(--font);color:var(--ink-soft);cursor:pointer;margin-bottom:12px;border-radius:8px}
.back::before{content:"\2190"}
.back:hover{color:var(--ink)}
.screen h1{font-size:clamp(24px,3.4vw,34px);font-weight:800;letter-spacing:-.03em;line-height:1.15;outline:none;text-align:center;max-width:24ch;margin-inline:auto}
.screen .helper{margin-top:10px;color:var(--ink-soft);font-size:15.5px;max-width:52ch;text-align:center;margin-inline:auto}
.screen .intro{margin-top:4px;margin-bottom:14px;color:var(--ink-soft);font-size:14.5px;text-align:center}
.screen #serr{text-align:center}
/* Answer tiles: square, light blue with a blue edge, a line icon over the label. Two across on phones; by count from 640px. */
.choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:24px}
.choice{position:relative;display:block;min-width:0;aspect-ratio:1}
.choice input{position:absolute;opacity:0;width:1px;height:1px;margin:0}
.choice>span{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;height:100%;min-height:96px;padding:16px 12px;border:1.5px solid rgba(1,90,255,.3);border-radius:18px;background:var(--bg-tint);color:var(--ink);font-weight:600;font-size:14.5px;line-height:1.3;text-align:center;cursor:pointer;transition:border-color .14s var(--ease),background .14s var(--ease),transform .14s var(--ease),box-shadow .14s var(--ease),color .14s var(--ease)}
.choice .ic{width:30px;height:30px;flex:none;color:var(--royal);fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.choice .t{display:block;max-width:100%}
.choice:hover>span{border-color:var(--royal);background:#E3EEFF;transform:translateY(-2px);box-shadow:0 10px 24px rgba(1,90,255,.14)}
.choice>span:active{transform:scale(.97);box-shadow:none}
.choice input:checked+span{border-color:var(--royal);box-shadow:inset 0 0 0 1px var(--royal);background:#D9E8FF;color:var(--royal-deep)}
.choice input:checked+span::after{content:"";position:absolute;top:8px;right:8px;width:20px;height:20px;border-radius:999px;background:var(--royal) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 8.5l3 3 6-6' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/12px no-repeat}
.choice input:focus-visible+span{outline:2px solid var(--royal);outline-offset:3px}
@media(min-width:640px){
  .choices{gap:12px}
  .choices[data-n="2"]{grid-template-columns:repeat(2,minmax(0,200px));justify-content:center}
  .choices[data-n="3"],.choices[data-n="5"],.choices[data-n="6"]{grid-template-columns:repeat(3,minmax(0,1fr))}
  .choices[data-n="4"],.choices[data-n="7"],.choices[data-n="8"]{grid-template-columns:repeat(4,minmax(0,1fr))}
  .choice>span{font-size:15px}
}
/* The state picker: 51 short labels, so small rectangular tiles without icons. */
.choices.compact{grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:8px}
.choices.compact .choice{aspect-ratio:auto}
.choices.compact .choice>span{min-height:0;padding:12px 14px;font-size:14.5px;border-radius:12px}
.choices.compact .choice input:checked+span::after{display:none}
@media(prefers-reduced-motion:reduce){.choice:hover>span,.choice>span:active{transform:none}}
.fields{display:grid;gap:16px;margin-top:24px}
.fields.two{grid-template-columns:1fr}
@media(min-width:480px){.fields.two{grid-template-columns:1fr 1fr}}
.field label{display:block;font-weight:700;font-size:14px;margin-bottom:6px}
.field .hint{font-size:13px;color:var(--ink-soft);margin-top:6px}
.field input,.field textarea,.field select{width:100%;padding:14px 16px;border:1.5px solid var(--line);border-radius:14px;font:500 16px/1.4 var(--font);color:var(--ink);background:#fff;transition:border-color .12s var(--ease)}
.field input:focus,.field textarea:focus,.field select:focus{outline:none;border-color:var(--royal);box-shadow:0 0 0 3px rgba(1,90,255,.15)}
.field textarea{min-height:140px;resize:vertical}
.field.invalid input,.field.invalid textarea{border-color:#B42318}
.field .err{color:#B42318;font-size:13.5px;margin-top:6px;font-weight:600}
.count{font-size:13px;color:var(--ink-soft);text-align:right;margin-top:6px}
.consent{display:flex;gap:12px;align-items:flex-start;margin-top:20px;padding:16px;border:1.5px solid var(--line);border-radius:16px;font-size:14px;line-height:1.5;color:var(--ink)}
.consent input{flex:none;width:20px;height:20px;margin:2px 0 0;accent-color:var(--royal)}
.consent a{font-weight:700;text-decoration:underline;text-underline-offset:2px}
.consent.invalid{border-color:#B42318}
.file{margin-top:24px;border:1.5px dashed #B9C4D8;border-radius:16px;padding:24px;text-align:center;background:#fff}
.file input{display:none}
.file .pick{display:inline-flex}
.file .name{margin-top:12px;font-weight:600;font-size:15px}
.file .name button{margin-left:8px;background:none;border:0;color:var(--royal);font:700 14px var(--font);cursor:pointer}
.actions{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:28px;flex-wrap:wrap}
.skip{background:none;border:0;font:700 15px var(--font);color:var(--ink-soft);cursor:pointer;padding:10px 4px}
.skip:hover{color:var(--ink)}
.form-err{margin-top:16px;padding:14px 16px;border-radius:14px;background:#FFF1F0;color:#8A2015;font-weight:600;font-size:14.5px}
.form-err[hidden]{display:none}
.form-foot{padding:20px var(--gutter) calc(24px + env(safe-area-inset-bottom,0px));font-size:13px;color:var(--ink-soft);border-top:1px solid var(--line);max-width:100%;text-align:center}
.form-foot p{max-width:90ch;margin-inline:auto}
.form-foot p+p{margin-top:8px}
.form-foot a{font-weight:700;color:var(--ink)}
.thanks{text-align:center}
.thanks h1{font-size:clamp(28px,4vw,40px)}
.thanks .ctas{margin-top:26px;justify-content:center}
.hp{display:none}
