/* Site-wide colors follow the approved cobalt-and-yellow hero artwork. */
:root {
  --brand-blue: #0744bd;
  --brand-yellow: #ffca20;
  --brand-navy: #09245c;
  --brand-blue-light: #edf3ff;
  --brand-yellow-light: #fff5cd;
  --ink: var(--brand-navy);
  --ink-deep: #071b46;
  --paper: #fff;
  --white: #fff;
  --muted: #4a5d7c;
  --line: #cbd8ee;
  /* Existing component accent names share the approved yellow. */
  --orange: var(--brand-yellow);
  --lime: var(--brand-yellow);
}
::selection { background: var(--brand-yellow); color: var(--brand-navy); }
button:focus-visible, a:focus-visible { outline-color: var(--brand-yellow); box-shadow: 0 0 0 6px var(--brand-blue); }
.announcement { background: var(--brand-blue); }
.main-nav a, .language-toggle .active { color: var(--brand-blue); }
.main-nav a::after, .menu-toggle span { background: var(--brand-blue); }
.button { background: var(--brand-blue); border-color: var(--brand-blue); color: #fff; }
.button:hover { background: var(--brand-navy); border-color: var(--brand-navy); }
.text-link { color: var(--brand-blue); border-color: currentColor; }
.text-link:hover { color: var(--brand-navy); border-color: currentColor; }

/* Preserve the approved image, scale and full-bleed composition. */
.hero.hero-fullframe, .hero-fullframe h1 { color: var(--brand-navy); }
.hero-fullframe .warm-underline { color: var(--brand-blue); }
.hero-fullframe .eyebrow, html[lang=en] .hero-fullframe .eyebrow,
.hero-fullframe .hero-description, html[lang=en] .hero-fullframe .hero-description,
.hero-fullframe .hero-next, .hero-fullframe .hero-image-credit { color: var(--brand-navy); }
.hero-fullframe .hero-buttons .button { background: var(--brand-blue); border-color: var(--brand-blue); color: #fff; }
.hero-fullframe .hero-buttons .button:hover { background: var(--brand-navy); border-color: var(--brand-navy); }
.hero-fullframe .hero-buttons .text-link { color: var(--brand-navy); }
.hero-fullframe .hero-buttons .text-link:hover { color: var(--brand-blue); }
.hero-fullframe .hero-orbit { background: var(--brand-blue); color: var(--brand-yellow); }
.hero-fullframe .hero-bottom { border-color: #09245c45; }

.values-band { background: var(--brand-blue); color: #fff; }
.values-inner > div { border-color: #ffffff45; }
.value-number { color: var(--brand-yellow); }
.values-inner p > span { color: #e4edff; }
.about-orbit, .note-mark { color: var(--brand-blue); }
.about-principles { border-color: var(--brand-blue); }
.about-principles span::before { color: var(--brand-blue); }
.support-section { background: var(--brand-blue-light); }
.focus-grid, .focus-card { border-color: var(--line); }
.focus-card { border-top-color: var(--brand-blue); }
.focus-card:nth-child(even) { border-top-color: var(--brand-yellow); }
.focus-card:hover { background: #f7faff; }
.focus-card-top > span, .focus-orbit,
.focus-card:nth-child(even) .focus-orbit { color: var(--brand-blue); }
.focus-card-top svg { stroke: var(--brand-blue); }
.status-note { background: var(--brand-yellow-light); border-color: var(--brand-yellow); }
.plan-label { color: var(--muted); }
.resource-list { border-color: var(--brand-blue); }
.resource-row:hover { background: var(--brand-blue-light); }
.resource-icon, .resource-orbit { color: var(--brand-blue); }
.resource-arrow { background: var(--brand-blue); color: var(--brand-yellow); }
.resource-shield svg { stroke: var(--brand-blue); }

.editorial-feature { background: var(--brand-blue); }
.editorial-feature > p { color: #e4edff; }
.art-arrival { background: var(--brand-yellow); color: var(--brand-navy); }
.art-help { background: var(--brand-blue); color: var(--brand-yellow); }
.join-section { background: var(--brand-yellow); border-top-color: var(--brand-blue); }
.join-section p:not(.eyebrow) { color: var(--brand-navy); }
.join-section h2 span { color: var(--brand-blue); box-shadow: none; }
.join-options { background: var(--brand-blue); }
.join-options button > span:last-child { color: var(--brand-yellow); }
.contact-description, .contact-status { color: var(--muted); }
.contact-details { border-top-color: var(--brand-blue); }
.contact-label, .contact-address, .contact-organization { color: var(--brand-blue); }
.site-footer { background: var(--brand-blue); }
.footer-top > p, .footer-bottom { color: #e4edff; }

dialog { box-shadow: 0 24px 100px #071b4649; }
dialog::backdrop { background: #071b46d9; }
.dialog-content .callout { background: var(--brand-yellow-light); border-color: var(--brand-blue); }
.dialog-content a:hover { color: var(--brand-blue); }
.dialog-content .button { border-color: var(--brand-blue); }
.dialog-content .button:hover { color: #fff; border-color: var(--brand-navy); }