/* Oversized type and a photograph stack that opens into the four focus areas. */
.focus-showcase { --focus-surface:#0003d1; --focus-ink:#e6f7ff; position:relative; background:var(--focus-surface); color:var(--focus-ink); isolation:isolate; }
.focus-sticky { position:relative; padding-block:76px 40px; }
.focus-stage { position:relative; }
.focus-showcase-intro { display:flex; flex-direction:column; align-items:center; gap:22px; text-align:center; }
.focus-emblem { display:flex; align-items:center; justify-content:center; width:82px; height:82px; border-radius:50%; background:#fff; }
.focus-emblem img { width:60px; height:auto; }
.focus-showcase-intro p { color:#d9f3ff; max-width:360px; margin:0; font:600 12px/1.5 JAOF,Arial,sans-serif; letter-spacing:.09em; text-transform:uppercase; }
.focus-showcase-heading { margin:48px 0 50px; text-align:center; color:var(--focus-ink); font-size:clamp(60px,9.8vw,178px); letter-spacing:-.07em; line-height:.88; }
.focus-showcase-heading > span { display:block; font-family:Arial,Helvetica,sans-serif; font-weight:900; }
.focus-showcase-heading > em { display:block; color:#87dfff; font-family:Georgia,'Times New Roman',serif; font-weight:400; font-size:.82em; letter-spacing:-.065em; word-spacing:.16em; }
.focus-title-word { display:inline-block; white-space:nowrap; transform-origin:50% 70%; }
.has-focus-title-motion:not(.is-focus-animated) .focus-title-word { opacity:0; transform:translateY(24px) scale(.35); transition:transform 950ms cubic-bezier(.22,.61,.36,1),opacity 750ms ease; transition-delay:var(--focus-word-delay,0ms); }
.has-focus-title-motion:not(.is-focus-animated) .is-focus-title-visible .focus-title-word { opacity:1; transform:translateY(0) scale(1); }
.focus-area-cards { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:24px; }
.focus-area-card { position:relative; display:block; width:100%; min-width:0; min-height:370px; aspect-ratio:.72; border-radius:20px; overflow:hidden; isolation:isolate; color:#fff; text-decoration:none; background:#15384f; box-shadow:0 20px 45px #00004724; }
.focus-area-photo { position:absolute; inset:0; z-index:-2; }
.focus-area-photo img { width:100%; height:100%; object-fit:cover; object-position:50% 35%; transition:transform 900ms cubic-bezier(.2,.65,.3,1); }
.focus-area-card:nth-child(4) .focus-area-photo img { object-position:65% 35%; }
.focus-area-card::after { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg,#071d3126 0%,#071d3100 24%,#071d3140 42%,#071d31e6 78%,#071d31fa 100%); }
.focus-area-number { position:absolute; top:20px; left:20px; display:grid; place-items:center; width:32px; height:32px; border:1px solid #ffffff75; border-radius:50%; color:#fff; font:400 11px/1 JAOF,Arial,sans-serif; }
.focus-area-caption { position:absolute; inset:auto 24px 24px; }
.focus-area-category { display:block; color:#c5ebfa; font:500 9px/1.5 JAOF,Arial,sans-serif; letter-spacing:.12em; text-transform:uppercase; margin-bottom:10px; }
.focus-area-caption h3 { color:#fff; font:500 clamp(20px,1.7vw,28px)/1.12 JAOF,Arial,sans-serif; letter-spacing:-.04em; margin:0; overflow-wrap:anywhere; }
.focus-area-caption p { color:#d5e3ec; font:400 12px/1.65 JAOF,Arial,sans-serif; margin:14px 0 0; }
.focus-area-link { display:flex; align-items:center; justify-content:space-between; gap:15px; color:#fff; font:500 11px/1.4 JAOF,Arial,sans-serif; margin-top:20px; padding-top:14px; border-top:1px solid #ffffff50; }
.focus-card-arrow { display:block; font-size:23px; line-height:1; transition:transform 450ms cubic-bezier(.2,.65,.3,1); }
.focus-area-card:focus-visible { outline:3px solid #7ce0ff; outline-offset:6px; }
.focus-area-card:focus-visible .focus-area-photo img { transform:scale(1.045); }
.focus-showcase-footer { display:flex; justify-content:space-between; align-items:center; gap:25px; margin-top:38px; }
.focus-scroll-hint { display:none; align-items:center; gap:13px; color:#c5ebfa; font:500 10px/1.4 JAOF,Arial,sans-serif; letter-spacing:.1em; text-transform:uppercase; }
.focus-scroll-hint > span { display:grid; place-items:center; width:32px; height:32px; border:1px solid #ffffff60; border-radius:50%; font-size:17px; }
.focus-showcase-footer > a { display:flex; justify-content:space-between; align-items:center; gap:44px; margin-left:auto; color:#fff; font:500 12px/1.5 JAOF,Arial,sans-serif; border-bottom:1px solid #ffffff80; padding-bottom:12px; }
.focus-showcase-footer > a > span { font-size:22px; }
html[data-theme="dark"] .focus-showcase { --focus-surface:#071a78; }
@media(hover:hover) and (pointer:fine) {
 .focus-area-card:hover .focus-area-photo img { transform:scale(1.045); }
 .focus-area-card:hover .focus-card-arrow { transform:translate(3px,-3px); }
 .focus-showcase-footer > a:hover { border-bottom-color:#fff; }
}
@media(min-width:1000px) and (min-height:680px) and (prefers-reduced-motion:no-preference) {
 .focus-showcase.is-focus-animated { height:220svh; }
 .is-focus-animated .focus-sticky { position:sticky; top:0; height:100svh; padding:0; overflow:hidden; overflow:clip; }
 .is-focus-animated .focus-stage { height:100%; }
 .is-focus-animated .focus-showcase-intro { position:absolute; top:5.5%; left:50%; transform:translateX(-50%); z-index:1; gap:18px; width:100%; }
 .is-focus-animated .focus-emblem { width:70px; height:70px; }
 .is-focus-animated .focus-emblem img { width:53px; }
 .is-focus-animated .focus-showcase-heading { position:absolute; top:44%; left:50%; width:calc(100% + 80px); margin:0; font-size:min(12.1vw,20svh); transform:translate(-50%,-50%) translateY(var(--focus-title-y,0px)); opacity:var(--focus-title-opacity,1); }
 .is-focus-animated .focus-showcase-heading > span { letter-spacing:-.075em; }
 .is-focus-animated .focus-title-word { opacity:var(--focus-word-opacity,0); transform:translate3d(0,var(--focus-word-y,28px),0) scale(var(--focus-word-scale,.001)); transition:none; }
 .is-focus-animated .focus-showcase-heading > em { font-size:.82em; white-space:nowrap; }
 .is-focus-animated .focus-area-cards { display:block; position:absolute; inset:0; pointer-events:none; }
 .is-focus-animated .focus-area-card { opacity:var(--focus-card-opacity,0); position:absolute; top:54%; left:50%; width:min(330px,calc((100% - 72px)/4)); min-height:0; aspect-ratio:.72; margin:0; pointer-events:var(--focus-card-hit,none); transform:translate(-50%,-50%) translate3d(var(--focus-x,0px),var(--focus-y,24px),0) rotate(var(--focus-turn,0deg)) scale(var(--focus-scale,1)); }
 .is-focus-animated .focus-area-caption p { opacity:var(--focus-description,0); max-height:calc(var(--focus-description,0) * 90px); overflow:hidden; margin-top:calc(var(--focus-description,0) * 14px); }
 .is-focus-animated .focus-area-link { margin-top:14px; }
 .is-focus-animated .focus-showcase-footer { position:absolute; left:0; right:0; bottom:5%; margin:0; }
 .is-focus-animated .focus-scroll-hint { display:flex; }
}
@media(max-width:999px) {
 .focus-area-cards { grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
 .focus-area-card { min-height:350px; aspect-ratio:.83; }
 .focus-area-caption h3 { font-size:25px; }
 .focus-area-caption p { font-size:13px; }
 .focus-showcase-heading { font-size:11.2vw; }
}
@media(max-width:600px) {
 .focus-sticky { padding-block:55px 36px; }
 .focus-showcase-intro { gap:20px; }
 .focus-emblem { width:68px; height:68px; }
 .focus-emblem img { width:51px; }
 .focus-showcase-intro p { max-width:260px; font-size:10px; letter-spacing:.08em; }
 .focus-showcase-heading { margin:36px 0; font-size:12vw; line-height:.96; }
 .focus-showcase-heading > em { font-size:.85em; }
 .focus-area-cards { gap:14px; }
 .focus-area-card { min-height:300px; border-radius:14px; aspect-ratio:.56; }
 .focus-area-caption { inset:auto 14px 17px; }
 .focus-area-caption h3 { font-size:19px; line-height:1.14; }
 .focus-area-caption p { display:none; }
 .focus-area-category { font-size:8px; letter-spacing:.07em; margin-bottom:9px; }
 .focus-area-number { top:14px; left:14px; width:26px; height:26px; font-size:10px; }
 .focus-area-link { font-size:10px; margin-top:13px; padding-top:11px; gap:7px; }
 .focus-card-arrow { font-size:21px; }
 .focus-showcase-footer { margin-top:27px; }
 .focus-showcase-footer > a { width:100%; font-size:12px; }
}
@media(prefers-reduced-motion:reduce) {
 .focus-area-photo img,.focus-card-arrow { transition:none; }
}

@media (min-width:701px) and (max-width:1200px), (min-width:701px) and (max-width:1600px) and (any-pointer:coarse) {
 .focus-sticky { padding-block:clamp(38px,5vw,60px) clamp(28px,4vw,45px); }
 .focus-showcase-heading { margin:clamp(20px,3vw,40px) 0 clamp(26px,3vw,42px); }
 .focus-area-cards { gap:clamp(12px,1.5vw,20px); }
 .focus-area-card { min-height:300px; aspect-ratio:.85; }
 .focus-showcase-footer { margin-top:clamp(24px,3vw,38px); }
}