/**
 * AI20 Visual Identity v1 — Staging closeout.
 *
 * Neutralizes legacy Customizer Additional CSS variables/rules that still
 * conflict with Approved v1. Does NOT delete Additional CSS (retire later).
 *
 * Legacy vars observed in Additional CSS:
 *   --n navy, --b blue, --p purple, --o orange, --l light, --m muted,
 *   --bd border, --r radius(22px), --s shadow
 */

/* Remap legacy homepage variables → Approved v1 */
body.ai20-vi-system {
  --n: var(--ai20-midnight);
  --b: var(--ai20-azure);
  --p: var(--ai20-cyan);
  --o: var(--ai20-azure);
  --l: var(--ai20-white);
  --m: var(--ai20-vi-muted);
  --bd: var(--ai20-vi-border);
  --r: var(--ai20-vi-radius);
  --s: none;
}

/* Buttons — kill pill radius + orange gradient/glow leftovers */
body.ai20-vi-system .ai20-btn,
body.ai20-vi-system .ai20-btn-primary,
body.ai20-vi-system .ai20-btn-secondary {
  border-radius: var(--ai20-vi-radius) !important;
  transform: none !important;
}

body.ai20-vi-system .ai20-btn-primary,
body.ai20-vi-system .ai20-btn-primary:hover,
body.ai20-vi-system .ai20-btn-primary:focus-visible {
  background: var(--ai20-vi-action) !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #ffffff !important;
}

body.ai20-vi-system .ai20-btn-primary:hover,
body.ai20-vi-system .ai20-btn-primary:focus-visible {
  background: var(--ai20-vi-action-hover) !important;
}

body.ai20-vi-system .ai20-btn-secondary:hover,
body.ai20-vi-system .ai20-btn-secondary:focus-visible {
  transform: none !important;
  box-shadow: none !important;
}

/* Kicker accent bar — Azure → Cyan (not purple) */
body.ai20-vi-system .ai20-kicker::before {
  background: linear-gradient(90deg, var(--ai20-azure), var(--ai20-cyan)) !important;
  border-radius: var(--ai20-vi-radius) !important;
}

body.ai20-vi-system .ai20-kicker,
body.ai20-vi-system .ai20-section .ai20-kicker {
  color: var(--ai20-azure) !important;
  font-family: var(--ai20-vi-font) !important;
}

body.ai20-vi-system .ai20-hero .ai20-kicker,
body.ai20-vi-system .ai20-programs .ai20-kicker,
body.ai20-vi-system .ai20-cta .ai20-kicker {
  color: var(--ai20-cyan) !important;
}

/* Section titles / leads */
body.ai20-vi-system .ai20-section-title,
body.ai20-vi-system .ai20-title {
  font-family: var(--ai20-vi-font) !important;
  color: var(--ai20-midnight) !important;
}

body.ai20-vi-system .ai20-programs .ai20-section-title,
body.ai20-vi-system .ai20-cta .ai20-section-title,
body.ai20-vi-system .ai20-hero .ai20-title {
  color: #ffffff !important;
}

body.ai20-vi-system .ai20-lead {
  font-family: var(--ai20-vi-font);
  color: var(--ai20-vi-muted);
}

body.ai20-vi-system .ai20-programs .ai20-lead,
body.ai20-vi-system .ai20-cta .ai20-lead {
  color: rgba(247, 249, 252, 0.82) !important;
}

/* Cards — institutional, no lift/shadow */
body.ai20-vi-system .ai20-card,
body.ai20-vi-system .ai20-pillar,
body.ai20-vi-system .ai20-program {
  background: #ffffff !important;
  border: 1px solid var(--ai20-vi-border) !important;
  border-radius: var(--ai20-vi-radius) !important;
  box-shadow: none !important;
  transform: none !important;
  color: var(--ai20-graphite) !important;
}

body.ai20-vi-system .ai20-card:hover,
body.ai20-vi-system .ai20-pillar:hover,
body.ai20-vi-system .ai20-program:hover {
  transform: none !important;
  box-shadow: none !important;
  border-color: color-mix(in srgb, var(--ai20-azure) 40%, var(--ai20-vi-border)) !important;
}

body.ai20-vi-system .ai20-card h3,
body.ai20-vi-system .ai20-pillar h3,
body.ai20-vi-system .ai20-program h3 {
  color: var(--ai20-midnight) !important;
  font-family: var(--ai20-vi-font) !important;
}

body.ai20-vi-system .ai20-card p,
body.ai20-vi-system .ai20-pillar p,
body.ai20-vi-system .ai20-program p {
  color: var(--ai20-vi-muted) !important;
  font-family: var(--ai20-vi-font) !important;
}

body.ai20-vi-system .ai20-card a {
  color: var(--ai20-azure) !important;
  font-weight: 600 !important;
}

body.ai20-vi-system .ai20-card a:hover {
  color: var(--ai20-vi-azure-hover) !important;
}

/* Icon badges — Azure soft, institutional radius */
body.ai20-vi-system .ai20-icon {
  background: var(--ai20-vi-azure-soft) !important;
  background-image: none !important;
  color: var(--ai20-azure) !important;
  border-radius: var(--ai20-vi-radius) !important;
}

/* Section canvases */
body.ai20-vi-system .ai20-audiences {
  background: var(--ai20-white) !important;
}

body.ai20-vi-system .ai20-pillars {
  background: #ffffff !important;
}

body.ai20-vi-system .ai20-programs {
  background: var(--ai20-midnight) !important;
  color: #ffffff !important;
}

body.ai20-vi-system .ai20-programs .ai20-card,
body.ai20-vi-system .ai20-programs .ai20-program {
  background: rgba(255, 255, 255, 0.04) !important;
  border-color: rgba(255, 255, 255, 0.14) !important;
  color: rgba(247, 249, 252, 0.9) !important;
}

body.ai20-vi-system .ai20-programs .ai20-card h3,
body.ai20-vi-system .ai20-programs .ai20-program h3 {
  color: #ffffff !important;
}

body.ai20-vi-system .ai20-programs .ai20-card p,
body.ai20-vi-system .ai20-programs .ai20-program p {
  color: rgba(247, 249, 252, 0.72) !important;
}

body.ai20-vi-system .ai20-programs .ai20-card a {
  color: var(--ai20-cyan) !important;
}

/* CTA band */
body.ai20-vi-system .ai20-cta {
  background: var(--ai20-midnight) !important;
}

/* Trust / values strip under hero */
body.ai20-vi-system .ai20-trust {
  font-family: var(--ai20-vi-font);
  color: rgba(247, 249, 252, 0.82);
}

body.ai20-vi-system .ai20-trust strong {
  color: #ffffff;
  font-weight: 600;
}