/* Generated by tools/build-static.js — edit the design source, not this file. */

html, body { margin:0; padding:0; background:#FBFAF8; -webkit-font-smoothing:antialiased; }
  a { color:#0C234B; text-decoration:none; }
  a:hover { color:#AB0520; }
  ::selection { background:#0C234B; color:#fff; }

  /* About-page photo carousel: 3 stacked layers, one shared cycle, offset per layer */
  @keyframes rhFade {
    0%, 29% { opacity: .94; }
    33.33%, 95.66% { opacity: 0; }
    100% { opacity: .94; }
  }

  /* Mobile: collapse the fixed-column desktop grids. Overrides inline styles, so !important. */
  @media (max-width: 900px) {
    [style*="grid-template-columns"] { grid-template-columns: 1fr !important; }
    [style*="gap:80px"], [style*="gap:72px"], [style*="gap:64px"], [style*="gap:56px"] { gap: 40px !important; }
    [style*="margin:0 auto"] { padding-left: 24px !important; padding-right: 24px !important; }
    [style*="padding:130px 40px"], [style*="padding:120px 40px"], [style*="padding:110px 40px"],
    [style*="padding:100px 40px"], [style*="padding:80px 40px"], [style*="padding:72px 40px"],
    [style*="padding:40px 40px"] { padding-top: 66px !important; padding-bottom: 66px !important; }
    [data-r="keep2"] { grid-template-columns: 1fr 1fr !important; }
    [data-r="stats"] { grid-template-columns: 1fr 1fr !important; }
    [data-r="stats"] > div { padding: 22px 14px 22px 0 !important; border-right: none !important; border-top: 1px solid rgba(255,255,255,.14) !important; }
    [data-r="stats"] > div:nth-child(4) { border-bottom: 1px solid rgba(255,255,255,.14) !important; }
    [data-r="labelrow"] { gap: 16px !important; }
    [data-r="newsrow"] { gap: 10px !important; }
    [data-r="newsrow"] > span:last-child { text-align: left !important; }
    [data-r="logo"] { max-width: 210px !important; }
    [data-r="hero"] { height: auto !important; min-height: 88vh !important; }
    [data-r="herobody"] { position: relative !important; inset: auto !important; min-height: 88vh !important; padding-top: 96px !important; box-sizing: border-box !important; }
    [data-r="desktopnav"] { display: none !important; }
    [data-r="burger"] { display: flex !important; }
  }
  @media (min-width: 901px) { [data-r="drawer"] { display: none !important; } }
  @media (max-width: 620px) {
    [style*="margin:0 auto"] { padding-left: 20px !important; padding-right: 20px !important; }
    [data-r="keep2"] { gap: 8px !important; }
  }

.skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 100;
  background: #0C234B;
  color: #fff;
  font-family: Archivo, sans-serif;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  padding: 16px 24px;
}
.skip-link:focus { left: 0; color: #fff; }

:focus-visible { outline: 2px solid #AB0520; outline-offset: 3px; }

/* The photo columns on the About and Speaking pages crossfade with a CSS
   animation the design declares in its <helmet>. Nothing there honours a
   reduced-motion preference, and the animation runs forever, so it is stopped
   here — on its first frame, which is what the column would show anyway. */
@media (prefers-reduced-motion: reduce) {
  [style*="animation:rhFade"] { animation: none !important; }
  [style*="animation:rhFade"]:first-of-type { opacity: 0.94 !important; }
}

/* Newsletter signup. Three things inline styles in the design cannot reach: a
   placeholder, a disabled button, and the fact that the footer field sits on
   navy, where the browser default placeholder is close to unreadable. */
[data-newsletter] input::placeholder { color: #9B9689; opacity: 1; }
footer [data-newsletter] input::placeholder { color: #6C7A92; }
[data-newsletter] button[disabled] { opacity: 0.55; cursor: default; }

/* Hover states, lifted from the design's style-hover attributes. */
.hv-1:hover { background:var(--accent, #AB0520) !important; }
.hv-2:hover { color:var(--accent, #AB0520) !important; }
.hv-3:hover { background:var(--accent, #AB0520) !important; color:#fff !important; }
.hv-4:hover { border-color:var(--accent, #AB0520) !important; color:var(--accent, #AB0520) !important; }
.hv-5:hover { background:var(--accent, #AB0520) !important; border-color:var(--accent, #AB0520) !important; color:#fff !important; }
.hv-6:hover { color:#EF6275 !important; }
.hv-7:hover { background:rgba(255,255,255,.12) !important; color:#EF6275 !important; }
.hv-8:hover { filter:grayscale(0.2) contrast(1.02) !important; opacity:0.95 !important; }
.hv-9:hover { filter:none !important; mix-blend-mode:normal !important; opacity:1 !important; }
.hv-10:hover { border-color:#0C234B !important; color:var(--accent, #AB0520) !important; }
.hv-11:hover { background:rgba(255,255,255,.06) !important; color:#EF6275 !important; padding-left:22px !important; box-shadow:inset 3px 0 0 #EF6275 !important; }
.hv-12:hover { background:#fff !important; transform:translateY(-6px) !important; box-shadow:0 24px 48px rgba(12,35,75,.16) !important; z-index:2 !important; }
.hv-13:hover { background:#fff !important; color:var(--accent, #AB0520) !important; padding-left:22px !important; box-shadow:inset 3px 0 0 var(--accent, #AB0520) !important; }

/* The mobile menu's drawer and icons carry inline display values, which beat
   the [hidden] rule in the user-agent stylesheet. This puts it back. */
[hidden] { display: none !important; }
