/* ==========================================================================
   polish.css — Couche de finition « premium » Erosophia (Phase 1)
   --------------------------------------------------------------------------
   Chargé GLOBALEMENT juste après tokens.css (voir head-*.php), donc AVANT
   les CSS de page : ceux-ci peuvent toujours surcharger au cas par cas.

   Objectif : harmoniser les 3 signaux qui pèsent le plus sur la perception
   de finition, sans toucher au design existant page par page.
     1. Anneau de focus clavier uniforme        (accessibilité + finition)
     2. Respect de prefers-reduced-motion        (confort + standard premium)
     3. Hover du CTA principal adouci            (suppression de l'à-coup)

   N'ajoute AUCUNE dépendance, AUCUN changement de structure HTML.
   ========================================================================== */


/* ─────────────────────────────────────────────────────────────────────────
   1. FOCUS CLAVIER UNIFORME
   --------------------------------------------------------------------------
   :focus-visible ne se déclenche qu'à la navigation clavier, jamais au clic
   souris — donc aucun changement visible pour l'usage à la souris.
   On neutralise d'abord l'outline navigateur par défaut UNIQUEMENT quand on
   va le remplacer, pour ne pas dégrader l'accessibilité entre-temps.
   --shadow-focus est défini dans tokens.css.
   ───────────────────────────────────────────────────────────────────────── */

:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
  outline: 2px solid var(--brand-500, #1f7cff);
  outline-offset: 2px;
  /* Anneau doux en complément de l'outline, pour les fonds sombres comme clairs */
  box-shadow: var(--shadow-focus, 0 0 0 3px rgba(31, 124, 255, .35));
  border-radius: var(--radius-xs, 4px);
}

/* Éléments déjà arrondis (boutons pill, cartes) : l'anneau suit leur forme.
   On laisse l'outline-offset gérer l'écart ; le border-radius hérité du
   composant n'est pas écrasé ici grâce à la faible spécificité de :where(). */
:where(.login-btn, .btn-home, .btn-secondary, .ghost,
       .test-card, .nav-link, .dropbtn):focus-visible {
  border-radius: inherit;
}

/* Le focus souris (sans :focus-visible) ne doit PAS afficher l'anneau, mais on
   garde un fallback outline pour les très vieux navigateurs sans :focus-visible. */
:where(a, button, input, select, textarea, summary, [tabindex]):focus:not(:focus-visible) {
  outline: none;
}


/* ─────────────────────────────────────────────────────────────────────────
   2. CTA PRINCIPAL — migré vers .btn-u--primary (buttons.css), 2026-06-29.
   --------------------------------------------------------------------------
   Les anciennes règles .cta-button (transition + hover « approfondi » +
   active) vivent désormais dans la variante canonique .btn-u--primary.
   Bloc retiré ici pour éviter la double source de vérité.
   ───────────────────────────────────────────────────────────────────────── */


/* ─────────────────────────────────────────────────────────────────────────
   3. PREFERS-REDUCED-MOTION — garde-fou global
   --------------------------------------------------------------------------
   Pour les utilisateurs ayant activé « réduire les animations » au niveau OS.
   On neutralise animations et transitions partout, tout en gardant l'état
   final visible (les cartes en cascade s'affichent, sans s'animer).
   Règle volontairement large : c'est le comportement attendu d'une interface
   haut de gamme, et ça couvre toutes les pages d'un coup.
   ───────────────────────────────────────────────────────────────────────── */

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

  /* Sécurité : les éléments dont l'état initial est « invisible » via une
     animation d'entrée (fadeUp, cardIn…) doivent rester visibles. */
  .hero-content,
  .slogan,
  .hero-headline,
  .hero-subheadline,
  .cta-hero-buttons,
  .test-card {
    opacity: 1 !important;
    transform: none !important;
  }
}