/* =====================================================================
   DRG0NF1Y canonical brand + accessibility override (added 2026-06-29)
   Purpose: end the multi-stylesheet palette drift by declaring ONE
   canonical primary (purple) + accent (cyan), loaded LAST so it wins the
   cascade. Reversible: remove the single <link> to this file to revert.
   Decision of record: purple-primary + cyan accent.
   ===================================================================== */

:root {
  --df-primary: #8f4bff;        /* canonical purple */
  --df-primary-deep: #6532bd;
  --df-accent: #3fd0c9;         /* canonical cyan accent */
  --df-ink: #04030a;
}

/* Primary actions = purple. */
.btn.primary,
.cta,
a.cta {
  background: linear-gradient(135deg, var(--df-primary), var(--df-primary-deep)) !important;
  border: 1px solid rgba(143, 75, 255, 0.55) !important;
  color: #ffffff !important;
  box-shadow: 0 16px 42px rgba(143, 75, 255, 0.22) !important;
}
.btn.primary:hover,
.cta:hover,
a.cta:hover {
  border-color: rgba(143, 75, 255, 0.9) !important;
}

/* Nav CTA = subtle purple tint. */
.nav-cta {
  background: rgba(143, 75, 255, 0.12) !important;
  border: 1px solid rgba(143, 75, 255, 0.4) !important;
  color: var(--text, #f6f1ff) !important;
}

/* Cyan is the single restrained accent: eyebrows, accent buttons, accent links. */
.eyebrow,
.accent-text { color: var(--df-accent) !important; }
.btn.accent {
  background: linear-gradient(135deg, var(--df-accent), #2aa8a2) !important;
  border: 1px solid rgba(63, 208, 201, 0.5) !important;
  color: var(--df-ink) !important;
}

/* ---- Accessibility ---- */

/* Visible focus ring on all interactive elements. */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
.btn:focus-visible,
.cta:focus-visible,
.nav-cta:focus-visible,
[tabindex]:focus-visible {
  outline: 3px solid var(--df-accent) !important;
  outline-offset: 2px !important;
  border-radius: 8px;
}

/* Respect reduced-motion preference. */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
}
