/* Risk deliberately stays charcoal in every browser colour preference.
   Retained full-torso alpha portrait sits directly on this surface. */
.risk-nav,.risk-nav.scrolled{background:#10110f;color:#fff}
.risk-nav nav{border-bottom-color:transparent}
.risk-nav nav a,.risk-nav nav a[aria-current]{color:#fff}
.risk-hero{padding-top:2.75rem;padding-bottom:0;background:#10110f;color:#fff}
.hero-stage{display:grid;position:relative;isolation:isolate;grid-template-columns:minmax(0,.56fr) minmax(0,.44fr);grid-template-rows:auto auto;min-height:clamp(43rem,54vw,53rem);align-items:start}
.hero-intro{grid-column:1;grid-row:1;position:relative;z-index:1;padding-top:clamp(3rem,6vw,6rem)}
.risk-hero h1{max-width:none;margin:0;padding:0;font-size:clamp(4.2rem,6.6vw,6rem);line-height:.96;white-space:nowrap}
.risk-hero h1 em{display:inline;margin:0;color:var(--gold);font-style:normal}
.hero-translation{display:flex;align-items:baseline;gap:1rem;margin:1.25rem 0 0;color:#fff}
.hero-translation span{color:#bfc2b7;font:600 .85rem/1.4 var(--body);letter-spacing:.16em;text-transform:uppercase;white-space:nowrap}
.hero-translation i{font:italic clamp(1.3rem,1.7vw,1.6rem)/1.4 var(--body)}
.hero-visual{grid-column:2;grid-row:1/3;display:block;align-self:end;justify-self:center;width:100%;max-width:36rem;min-width:0;background:transparent;pointer-events:none}
.hero-visual img{display:block;width:100%;height:auto;max-height:53rem;object-fit:contain;object-position:center bottom}
.hero-support{grid-column:1;grid-row:2;max-width:42rem;padding:3.25rem 1rem 3rem 0;position:relative;z-index:1}
.hero-claim{margin:0;font:520 clamp(1.65rem,2.35vw,2.35rem)/1.18 var(--display);letter-spacing:-.045em}
.hero-claim span{display:block}
.hero-claim span+span{margin-top:.55rem}
.hero-claim em{color:var(--gold);font-style:normal}
.hero-support .hero-context{max-width:33rem;margin:1.9rem 0 0;color:#bfc2b7;font-size:1.0625rem;line-height:1.55}
@media(max-width:1024px) and (min-width:761px){
 .hero-stage{min-height:39rem}
 .hero-intro{padding-top:2rem}
 .risk-hero h1{font-size:clamp(4.5rem,9vw,6.3rem)}
 .hero-support{padding-top:2.25rem;padding-bottom:2rem}
 .hero-claim{font-size:clamp(1.6rem,2.6vw,1.9rem)}
 .hero-support .hero-context{font-size:1rem}
}
@media(max-width:760px){
 .risk-nav,.risk-nav.scrolled{background:#10110f;color:#fff}
 .risk-nav nav a,.risk-nav nav a[aria-current]{color:#fff}
 .risk-hero{padding-top:2.5rem}
 .hero-stage{grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto auto;min-height:0}
 .hero-intro{grid-column:1;grid-row:1;padding:0}
 .risk-hero h1{font-size:clamp(4.4rem,18.5vw,7.5rem);white-space:normal}
 .hero-translation{flex-wrap:wrap;column-gap:.8rem;row-gap:.15rem;margin-top:1rem}
 .hero-support{grid-column:1;grid-row:3;max-width:none;padding:2rem 0 3rem}
 .hero-claim{font-size:clamp(1.55rem,5.9vw,2.25rem)}
 .hero-support .hero-context{margin:1.25rem 0 0;font-size:1rem}
 .hero-visual{grid-column:1;grid-row:2;width:min(100%,25rem);margin-top:2rem;align-self:end}
 .hero-visual img{max-height:none;width:100%;height:auto;object-fit:contain}
}

/* The narrower iPads use the same deliberate reading order as phones. */
@media(min-width:761px) and (max-width:1024px){
 .risk-hero{padding-top:2.5rem}
 .hero-stage{grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto auto;min-height:0}
 .hero-intro{grid-column:1;grid-row:1;padding-top:2rem}
 .risk-hero h1{font-size:clamp(5.3rem,10vw,7rem)}
 .hero-visual{grid-column:1;grid-row:2;width:min(100%,32rem);max-width:none;margin:1.5rem auto 0}
 .hero-visual img{width:100%;max-height:32rem;object-fit:contain}
 .hero-support{grid-column:1;grid-row:3;max-width:42rem;padding:2rem 0 3rem}
}