/* Page-specific styles: benefits */
/* Benefits page */
.benefits-page { color: #172536; background: #fff; }
.benefits-container { width: min(1200px, calc(100% - 40px)); margin-inline: auto; }
.benefits-hero {
    position: relative; min-height: 720px; display: flex; align-items: center; overflow: hidden;
    padding: 100px 0 120px; color: #fff;
    background:
        linear-gradient(90deg, rgba(3,20,36,.99), rgba(3,20,36,.87) 48%, rgba(3,20,36,.27)),
        url("../images/slide-magnetic.png") 72% center / cover;
}
.benefits-hero-orbit { position: absolute; top: -210px; right: -140px; width: 610px; height: 610px; border: 1px solid rgba(255,255,255,.11); border-radius: 50%; }
.benefits-hero-orbit::before, .benefits-hero-orbit::after { content: ""; position: absolute; border: 1px solid rgba(255,255,255,.08); border-radius: 50%; }.benefits-hero-orbit::before { inset: 78px; }.benefits-hero-orbit::after { inset: 155px; }
.benefits-hero-grid { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr 270px; gap: 90px; align-items: end; }
.benefits-kicker { display: flex; align-items: center; gap: 14px; margin-bottom: 20px; color: #20acd9; font-size: 10px; font-weight: 700; letter-spacing: 1.9px; text-transform: uppercase; }
.benefits-kicker::before { content: ""; width: 42px; height: 2px; background: currentColor; }
.benefits-hero h1 { margin: 0 0 25px; font-size: clamp(55px,7vw,92px); line-height: .94; letter-spacing: -3px; }.benefits-hero h1 em { color: #20acd9; font-style: normal; }
.benefits-hero-copy > p { max-width: 690px; margin: 0; color: rgba(255,255,255,.72); font-size: 15px; line-height: 1.85; }
.benefits-hero-note { padding: 27px 0; border-top: 1px solid rgba(255,255,255,.24); border-bottom: 1px solid rgba(255,255,255,.24); }
.benefits-hero-note span { color: #20acd9; font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: 1.4px; }.benefits-hero-note strong { display: block; margin: 13px 0 9px; color: #fff; font-size: 22px; }.benefits-hero-note p { margin: 0; color: rgba(255,255,255,.55); font-size: 11px; line-height: 1.7; }
.benefits-hero-index { position: absolute; right: 0; bottom: 0; left: 0; background: rgba(3,20,36,.88); border-top: 1px solid rgba(255,255,255,.13); backdrop-filter: blur(7px); }
.benefits-hero-index .benefits-container { display: grid; grid-template-columns: repeat(4,1fr); }
.benefits-hero-index span { display: flex; min-height: 70px; padding: 18px 22px; align-items: center; gap: 13px; color: rgba(255,255,255,.68); border-right: 1px solid rgba(255,255,255,.12); font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: .7px; }.benefits-hero-index span:first-child { border-left: 1px solid rgba(255,255,255,.12); }.benefits-hero-index b { color: #20acd9; font-size: 9px; }
.benefits-intro { position: relative; padding: 115px 0; overflow: hidden; }
.benefits-intro::after { content: "VALUE"; position: absolute; right: -15px; bottom: -40px; color: #f4f6f8; font-size: clamp(110px,16vw,220px); font-weight: 700; line-height: 1; letter-spacing: -9px; pointer-events: none; }
.benefits-intro-grid { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr .75fr; gap: 100px; align-items: end; }
.benefits-intro h2, .benefits-core h2, .benefits-safety h2, .benefits-impact h2, .benefits-outcomes h2 { margin: 8px 0 0; color: #10243b; font-size: clamp(35px,4.5vw,55px); line-height: 1.13; }
.benefits-intro-grid > div:last-child p { color: #66727e; font-size: 14px; line-height: 1.85; }.benefits-intro-grid .benefits-lead { color: #27394b; font-size: 17px; font-weight: 500; }
.benefits-core { padding: 105px 0 120px; background: #f3f6f9; }
.benefits-core-heading { max-width: 750px; margin-bottom: 65px; }
.benefits-core-list { display: grid; grid-template-columns: 1fr 1fr; gap: 0 70px; }
.benefits-core-list article { display: grid; grid-template-columns: 50px 55px 1fr; min-height: 175px; padding: 32px 0; align-items: start; gap: 17px; border-top: 1px solid #d8e0e7; }
.benefits-core-list article:nth-last-child(-n+2) { border-bottom: 1px solid #d8e0e7; }
.benefits-core-list article > span { padding-top: 15px; color: #a8b2bc; font-size: 10px; font-weight: 700; }
.benefits-core-list i { display: grid; width: 48px; height: 48px; place-items: center; color: #fff; background: #10243b; font-size: 17px; }
.benefits-core-list h3 { margin: 0 0 10px; color: #14283b; font-size: 20px; }.benefits-core-list p { margin: 0; color: #687580; font-size: 12px; line-height: 1.75; }
.benefits-safety { display: grid; grid-template-columns: 1fr 1fr; min-height: 700px; color: #fff; background: #0a2239; }
.benefits-safety-image { min-height: 700px; overflow: hidden; }.benefits-safety-image img { width: 100%; height: 100%; object-fit: cover; }
.benefits-safety-copy { display: flex; padding: 75px clamp(35px,7vw,115px); flex-direction: column; justify-content: center; background: linear-gradient(135deg,#071b30,#10314f); }
.benefits-safety h2 { color: #fff; }.benefits-safety-copy > p { color: rgba(255,255,255,.63); font-size: 14px; line-height: 1.85; }
.benefits-safety dl { margin: 32px 0 0; border-top: 1px solid rgba(255,255,255,.15); }.benefits-safety dl div { display: grid; grid-template-columns: 1fr 1fr; gap: 25px; padding: 18px 0; border-bottom: 1px solid rgba(255,255,255,.15); }.benefits-safety dt { color: #fff; font-size: 12px; font-weight: 600; }.benefits-safety dd { margin: 0; color: rgba(255,255,255,.51); font-size: 11px; line-height: 1.6; }
.benefits-impact { padding: 115px 0; }
.benefits-impact-heading { max-width: 700px; margin-bottom: 65px; }
.benefits-impact-flow { display: grid; grid-template-columns: 1fr 35px 1fr 35px 1fr 35px 1fr; align-items: center; }
.benefits-impact-flow article { min-height: 210px; padding: 27px 10px 25px 0; border-top: 2px solid #294d94; }
.benefits-impact-flow > i { color: #c6cdd4; text-align: center; }
.benefits-impact-flow b { color: #294d94; font-size: 10px; }.benefits-impact-flow h3 { margin: 45px 0 10px; color: #10243b; font-size: 21px; }.benefits-impact-flow p { margin: 0; color: #697580; font-size: 12px; line-height: 1.7; }
.benefits-outcomes { padding: 110px 0; color: #fff; background: #071c31; }
.benefits-outcomes-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: 90px; }.benefits-outcomes h2 { color: #fff; }.benefits-outcomes-grid > div:first-child > p { color: rgba(255,255,255,.58); font-size: 13px; line-height: 1.8; }
.benefits-outcome-list { border-top: 1px solid rgba(255,255,255,.15); }.benefits-outcome-list article { display: grid; grid-template-columns: 130px 1fr; gap: 25px; padding: 24px 4px; border-bottom: 1px solid rgba(255,255,255,.15); }.benefits-outcome-list span { color: #20acd9; font-size: 9px; font-weight: 700; text-transform: uppercase; letter-spacing: 1px; }.benefits-outcome-list h3 { margin: 0; color: #fff; font-size: 17px; font-weight: 500; }
@media (max-width: 900px) {
    .benefits-hero-grid, .benefits-intro-grid, .benefits-safety, .benefits-outcomes-grid { grid-template-columns: 1fr; }
    .benefits-hero-grid { gap: 40px; }.benefits-hero-note { max-width: 420px; }.benefits-intro-grid, .benefits-outcomes-grid { gap: 40px; }
    .benefits-safety-image { min-height: 520px; }.benefits-core-list { grid-template-columns: 1fr; gap: 0; }.benefits-core-list article:nth-last-child(2) { border-bottom: 0; }
    .benefits-impact-flow { grid-template-columns: 1fr 1fr; gap: 30px; }.benefits-impact-flow > i { display: none; }
}
@media (max-width: 600px) {
    .benefits-hero { min-height: 750px; padding: 75px 0 140px; }.benefits-hero h1 { font-size: clamp(52px,17vw,72px); letter-spacing: -2px; }
    .benefits-hero-index .benefits-container { grid-template-columns: 1fr 1fr; }.benefits-hero-index span { min-height: 52px; padding: 10px 8px; font-size: 8px; }
    .benefits-intro, .benefits-core, .benefits-impact, .benefits-outcomes { padding: 75px 0; }.benefits-intro::after { display: none; }
    .benefits-core-list article { grid-template-columns: 32px 45px 1fr; gap: 10px; }.benefits-core-list i { width: 42px; height: 42px; }
    .benefits-safety-image { min-height: 360px; }.benefits-safety-copy { padding: 65px 22px; }.benefits-safety dl div { grid-template-columns: 1fr; gap: 7px; }
    .benefits-impact-flow { grid-template-columns: 1fr; }.benefits-impact-flow article { min-height: 175px; }
    .benefits-outcome-list article { grid-template-columns: 1fr; gap: 9px; }
}