*{box-sizing:border-box;margin:0;padding:0}
:root{
 --cobalt:#1D4ED8; --gold:#F5B700; --cream:#FAF8F3; --ink:#1B1F2B;
 --gap:14px;
}
html{-webkit-text-size-adjust:100%}
body{background:#EFECE4;color:var(--ink);font-family:'Readex Pro',system-ui,-apple-system,'Segoe UI',sans-serif;font-size:16px;line-height:1.65;font-weight:300}
a{color:inherit}
h1,h2,h3{font-family:'Sen',system-ui,sans-serif;font-weight:700;line-height:1.12;letter-spacing:-.015em}

/* slim top strip */
.strip{display:flex;align-items:center;justify-content:space-between;gap:16px 24px;
 max-width:1280px;margin:0 auto;padding:16px 20px 10px;flex-wrap:wrap}
.mark{font-family:'Sen',sans-serif;font-weight:800;font-size:18px;letter-spacing:-.02em;text-decoration:none;flex-shrink:0}
.mark span{color:var(--cobalt)}
.nav{display:flex;flex-wrap:wrap;gap:8px 18px;font-size:12px;letter-spacing:.12em;text-transform:uppercase;margin-left:auto;margin-right:8px}
.nav a{text-decoration:none;color:#3A4050;padding-bottom:2px;border-bottom:1px solid transparent}
.nav a:hover,.nav a.is-on{border-bottom-color:currentColor;color:var(--ink)}
.crumb{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:#6B7080;flex-shrink:0}

/* the mosaic */
.mosaic{max-width:1280px;margin:0 auto;padding:0 20px 20px;
 display:grid;grid-template-columns:repeat(6,1fr);gap:var(--gap);
 grid-auto-rows:minmax(74px,auto)}
.t{border-radius:9px;padding:26px 28px;display:flex;flex-direction:column;justify-content:flex-start}
.t.mid{justify-content:center}
a.t{text-decoration:none;transition:transform .16s ease,filter .16s ease}
a.t:hover{transform:translateY(-2px);filter:brightness(1.06)}
a.t:focus-visible{outline:3px solid var(--ink);outline-offset:2px}
.cream{background:var(--cream)}
.cobalt{background:var(--cobalt);color:var(--cream)}
.gold{background:var(--gold);color:var(--ink)}
.ink{background:var(--ink);color:var(--cream)}

.w2{grid-column:span 2}.w3{grid-column:span 3}.w4{grid-column:span 4}.w6{grid-column:span 6}
.h2{grid-row:span 2}.h3{grid-row:span 3}.h4{grid-row:span 4}.h5{grid-row:span 5}.h6{grid-row:span 6}

.eyebrow{font-size:11px;letter-spacing:.2em;text-transform:uppercase;font-weight:400;opacity:.72;margin-bottom:12px}
.t h1{font-size:clamp(30px,4.6vw,54px)}
.t h2{font-size:clamp(21px,2.3vw,30px)}
.t h3{font-size:17px;letter-spacing:0}
.t p{margin-top:12px;font-size:15px}
.t p.lede{font-size:17px;line-height:1.6}
.small{font-size:13.5px;line-height:1.6}
.place{font-family:'Sen',sans-serif;font-weight:400;font-size:12px;letter-spacing:.14em;text-transform:uppercase;margin-top:8px;opacity:.8}
.count{font-family:'Sen',sans-serif;font-weight:800;font-size:13px;letter-spacing:.12em;text-transform:uppercase;margin-top:auto;padding-top:20px}
.num{font-family:'Sen',sans-serif;font-weight:800;font-size:12px;letter-spacing:.14em;opacity:.55}

.photo{
  background:radial-gradient(120% 90% at 50% 42%, #2a3d63 0%, #152238 52%, #0e1626 100%);
  overflow:hidden
}
.t.photo{
  padding:22px 24px;
  max-height:none;
  align-items:center;
  justify-content:center
}
.hero-frame{
  margin:0 auto;
  width:min(100%, 320px);
  padding:1px;
  border-radius:8px;
  background:linear-gradient(165deg, rgba(245,183,0,.95), rgba(245,183,0,.22) 46%, rgba(245,183,0,.72));
  box-shadow:0 18px 40px rgba(0,0,0,.38)
}
.hero-frame img{
  display:block;
  width:100%;
  height:auto;
  border-radius:7px;
  object-fit:contain;
  object-position:center
}

.links{display:flex;flex-wrap:wrap;gap:8px 22px;margin-top:14px;font-size:13.5px}
.links a{text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:1px}
.t ul{margin-top:12px;padding-left:18px;font-size:14.5px}
.t li{margin-bottom:6px}
.t .body p+p{margin-top:12px}

@media (max-width:1000px){
 .mosaic{grid-template-columns:repeat(4,1fr)}
 .w3{grid-column:span 4}.w4{grid-column:span 4}.w6{grid-column:span 4}.w2{grid-column:span 2}
}
@media (max-width:720px){
 .strip{align-items:flex-start}
 .nav{width:100%;margin:0;order:3}
 .mosaic{grid-template-columns:1fr;grid-auto-rows:auto;gap:12px}
 .mosaic>.t{grid-column:1 / -1 !important;grid-row:auto !important;padding:22px 20px}
 .mosaic>.t.photo{padding:16px;max-height:none}
 .hero-frame{width:min(100%, 280px)}
}