/* Hero only. Non-hero layout, colors and motion stay at approved 96e304d. */
.hero{position:relative;isolation:isolate;overflow:hidden;background:var(--ink);color:#fff;min-height:740px}
.hero .hero-media{position:absolute;inset:0;z-index:-2;background:#17121e url('../images/leader-hero-poster.webp') center center / cover no-repeat}
.hero .hero-background-video{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 50%}
.hero::before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(180deg,rgba(8,10,20,.72),rgba(8,10,20,.74) 55%,rgba(8,10,20,.88))}
.hero .container{position:relative;z-index:1}
.hero h1{color:#fff;text-shadow:0 2px 22px #0005}
.hero .rd-tag,.hero .co>p{color:#fff}
.hero .co>p{margin-top:clamp(5rem,10vw,9rem)}
.hero em{background:var(--pink);color:var(--ink)}
.hero .co>.pbtn{background:var(--pink);color:var(--ink);border-color:var(--pink)}
.hero .co>.pbtn:hover{background:var(--mint);border-color:var(--mint)}
.hero .paths{border-top-color:#ffffff70;padding-right:50px}
.hero .paths .pbtn{color:#fff}
.hero .paths .pbtn:hover{background:transparent;color:var(--mint)}
.hero .hero-video-toggle{position:absolute;bottom:25px;right:var(--space);z-index:3;width:44px;height:44px;border:1px solid #fff;border-radius:50%;display:grid;place-items:center;background:var(--ink);color:#fff;cursor:pointer}
.hero .hero-video-toggle:hover{background:var(--pink);color:var(--ink);border-color:var(--pink)}
.hero .hero-video-toggle:focus-visible{outline:3px solid #fff;outline-offset:4px}
.hero .hero-play-icon{display:none}
.hero .hero-video-toggle[aria-pressed="true"] .hero-play-icon{display:block}
.hero .hero-video-toggle[aria-pressed="true"] .hero-pause-icon{display:none}
@media (max-width:600px){
 .hero{min-height:700px}
 .hero .hero-media,.hero .hero-background-video{background-position:50% 50%;object-position:50% 50%}
 .hero .co>p{margin-top:90px}
 .hero .paths{padding-right:42px;gap:10px 16px}
 .hero .hero-video-toggle{bottom:19px}
}
@media (prefers-reduced-motion:reduce){
 .hero .hero-background-video{display:none}
 .hero .hero-video-toggle{display:none}
}
/* User-approved two-line title: text stays left of the central yellow figure. */
.hero .co{width:42%;container-type:inline-size;text-align:left}
.hero h1{font-size:inherit;line-height:1.02;text-align:left}
.hero .hero-title-line{display:block;white-space:nowrap;font-size:clamp(1.1rem,2.5vw,2.9rem);font-size:clamp(1.1rem,8cqw,2.9rem);line-height:1.15;margin-bottom:12px;letter-spacing:-.015em}
.hero h1 em{display:table;white-space:nowrap;font-size:clamp(4rem,7vw,8.3rem);font-size:clamp(4rem,27cqw,8.3rem);line-height:1.04}
.hero .co>p{max-width:380px;margin-top:70px}
.hero .paths{max-width:42%;padding-right:0;text-align:left}
.hero::before{background:linear-gradient(90deg,rgba(8,10,20,.88),rgba(8,10,20,.82) 44%,rgba(8,10,20,.15) 60%,rgba(8,10,20,.12)),linear-gradient(0deg,rgba(8,10,20,.5),transparent 70%)}
@media (max-width:900px) and (min-width:601px){
 .hero .co,.hero .paths{width:45%;max-width:45%}
 .hero .co>p{font-size:1rem}
}
@media (max-width:600px){
 .hero{min-height:800px}
 .hero .co{width:100%}
 .hero .hero-title-line{font-size:clamp(1.1rem,8cqw,2rem);margin-bottom:10px}
 .hero h1 em{font-size:clamp(4rem,27cqw,7rem)}
 .hero .co>p{margin-top:300px;max-width:330px}
 .hero .paths{width:100%;max-width:100%;padding-right:42px}
 .hero::before{background:linear-gradient(180deg,rgba(8,10,20,.84),rgba(8,10,20,.8) 25%,rgba(8,10,20,.12) 34%,rgba(8,10,20,.12) 49%,rgba(8,10,20,.86) 58%,rgba(8,10,20,.92))}
}
/* Narrow mobile hero correction: safe with either display or fallback fonts. */
@media (max-width:900px){
 .hero .co{container-type:normal;min-width:0}
 .hero h1{max-width:100%;min-width:0}
 .hero .hero-title-line{max-width:100%;white-space:normal;overflow-wrap:anywhere}
 .hero h1 em{display:block;width:fit-content;max-width:100%;white-space:normal;overflow-wrap:anywhere}
}
@media (min-width:601px) and (max-width:900px){
 .hero .hero-title-line{font-size:clamp(1rem,2.6vw,1.25rem)}
 .hero h1 em{font-size:clamp(3rem,8vw,4.25rem)}
}
@media (max-width:600px){
 .hero .hero-title-line{font-size:clamp(1rem,5.4vw,1.5rem)}
 .hero h1 em{font-size:clamp(3rem,16vw,5.6rem)}
 .hero .co,.hero .paths{max-width:100%;min-width:0}
 .hero .co>p{max-width:100%;overflow-wrap:anywhere}
}