/* LiveQuest — thème saisonnier « Octobre Rose » (lot 2026-10-01), sur le modèle de TiKamp.
   ------------------------------------------------------------------
   Chargée UNIQUEMENT quand le serveur a activé la saison (src/services/saison.js :
   1er→31 octobre heure de Paris, ou THEME_SAISON=octobre-rose). Hors saison, ni cette
   feuille ni l'attribut ne sont servis : zéro effet de bord.

   Mécanique : on ne touche AUCUNE règle de composant ; on redéfinit les TOKENS de couleur
   sous html[data-saison="octobre-rose"] (accueil historique : tokens posés sur :root) et
   sous html[data-saison] body (landings v4 : les tokens d'accent sont posés sur body.pg-*).
   Quelques composants à couleur codée en dur reçoivent une règle ciblée (section dédiée).

   Nuances (identité LiveQuest conservée : crème, encre, soleil) :
     poudré      #FCE4EC   fonds doux
     rosé        #F6C6D6   bordures douces
     framboise   #C2185B   primaire   blanc dessus 5,87:1 · sur #FFFDF8 5,9:1
     prune       #9C1450   texte/survol  blanc dessus 7,99:1 · sur poudré 6,64:1
     lie-de-vin  #4A0B28   fonds profonds  blanc dessus ≥ 14:1
   Ratios WCAG 2.x (luminance relative), vérifiés dans tests/saison-octobre-rose.test.js.
   Pages « ruban » (data-saison-ruban) : AUCUN token touché, seulement le ruban en pied.
   ------------------------------------------------------------------ */

/* ═══ 1. Accueil historique (livequest.html) + pages utilisant lq-tokens ═══ */
html[data-saison="octobre-rose"] {
  --forest: #7A1340;
  --lq-forest: #7A1340;
  --sage: #C2185B;
  --lq-sage: #C2185B;
  --sage-light: #F8BBD0;
  --accent: #C2185B;
  --accent-light: #F8BBD0;
  --accent-dark: #7A1340;
  --accent-ink: #9C1450;
  --accent-ui: #C2185B;
  --on-accent: #FFFFFF;
}

/* ═══ 2. Landings v4 : les tokens d'accent vivent sur body.pg-* → même nœud, spécificité supérieure ═══ */
html[data-saison="octobre-rose"] body {
  --accent: #C2185B;
  --accent-ink: #8E1149;
  --on-accent: #FFFFFF;
  --btn-bg: #C2185B;
  --btn-ink: #FFFFFF;
  --focus: #8E1149;
  --line: rgba(142, 17, 73, .18);
}
/* Particuliers : « coral » reste un aplat CLAIR (rose poudré) : le texte posé dessus est foncé (.l2, .tm, onglet actif), 8:1. Associations : « green/gdark » = accent ; Tourisme : « deep » = accent. */
html[data-saison="octobre-rose"] body.pg-part { --coral: #F48FB1; --pink: #F8BBD0; }
html[data-saison="octobre-rose"] body.pg-asso { --green: #C2185B; --gdark: #8E1149; }
html[data-saison="octobre-rose"] body.pg-tour { --deep: #7A1340; --accent: #8E1149; --btn-bg: #8E1149; --focus: #7A1340; }
/* Entreprises (nuit indigo) : l'ambre devient rose clair, texte sombre dessus (≥ 6:1). */
html[data-saison="octobre-rose"] body.pg-ent {
  --amber: #FF7EB3; --accent: #FF7EB3; --on-accent: #1A1030; --btn-bg: #FF7EB3; --btn-ink: #1A1030;
  --accent-ink: #FFB3D1; --focus: #FF9EC4; --line: rgba(244, 240, 255, .16);
}

/* En-tête partagé des landings (variables --hd-* exposées par public/landing/header.css). */
html[data-saison="octobre-rose"] header.lq-hd { --hd-accent: #C2185B; --hd-on-accent: #FFFFFF; --hd-focus: #8E1149; }
html[data-saison="octobre-rose"] header.lq-hd[data-tone="dark"] { --hd-accent: #FF7EB3; --hd-on-accent: #1A1030; --hd-focus: #FF9EC4; }

/* ═══ 3. Couleurs codées en dur (habillage uniquement) ═══ */
/* Accueil historique : boutons « sage » à texte forêt → framboise + blanc. */
html[data-saison="octobre-rose"] .btn-hero-primary,
html[data-saison="octobre-rose"] .split-trail .split-cta,
html[data-saison="octobre-rose"] .universe-trail .universe-cta { background: #C2185B; color: #FFFFFF; box-shadow: 0 4px 24px rgba(194, 24, 91, .45); }
html[data-saison="octobre-rose"] .split-trail,
html[data-saison="octobre-rose"] .universe-trail { background: linear-gradient(160deg, #4A0B28 0%, #7A1340 55%, #9C1450 100%); }
html[data-saison="octobre-rose"] .hero-headline h1 em { text-shadow: 0 2px 12px rgba(0, 0, 0, .6), 0 0 24px rgba(248, 187, 208, .35); }
html[data-saison="octobre-rose"] .mode-where { background: #FCE4EC; color: #7A1340; }
html[data-saison="octobre-rose"] .feat-badge-trail { background: rgba(194, 24, 91, .1); }
html[data-saison="octobre-rose"] a:focus-visible,
html[data-saison="octobre-rose"] button:focus-visible,
html[data-saison="octobre-rose"] input:focus-visible,
html[data-saison="octobre-rose"] select:focus-visible,
html[data-saison="octobre-rose"] textarea:focus-visible { outline-color: #C2185B; }
/* Pastille « Plateforme pour organisateurs » (couleurs en style inline → !important nécessaire). */
html[data-saison="octobre-rose"] .hero-b2b-badge { background: rgba(248, 187, 208, .16) !important; border-color: rgba(248, 187, 208, .5) !important; color: #F8BBD0 !important; }
html[data-saison="octobre-rose"] .hero-b2b-badge span { background: #F8BBD0 !important; }
/* Texte « sage » posé sur fond SOMBRE : rose clair (framboise y serait < 4,5:1). */
html[data-saison="octobre-rose"] .hero-trust span::before,
html[data-saison="octobre-rose"] .comparison-col .col-title.trail-c { color: #F8BBD0; }

/* ═══ 4. Bandeau de prévention (en tête de page) ═══ */
.lq-or-bandeau {
  background: linear-gradient(135deg, #FCE4EC 0%, #FDF0F4 60%, #FFFFFF 100%);
  border-bottom: 1px solid #F6C6D6;
  color: #3A1B2A;
  font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
  line-height: 1.55;
  position: relative;
  z-index: 2;
}
.lq-or-in {
  max-width: 1200px;
  margin: 0 auto;
  padding: 16px 24px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 20px;
  box-sizing: border-box;
}
.lq-or-badge {
  flex: none;
  width: 48px; height: 48px;
  border-radius: 50%;
  background: #FFFFFF;
  color: #C2185B;
  display: inline-flex; align-items: center; justify-content: center;
  box-shadow: 0 0 0 1px #F6C6D6;
}
.lq-or-body { flex: 1 1 320px; min-width: 0; }
.lq-or-bandeau .lq-or-body > * { text-align: left; }
.lq-or-bandeau .lq-or-eyebrow { margin: 0 0 2px; font: 700 12px/1.4 Inter, -apple-system, system-ui, sans-serif !important; letter-spacing: .05em; text-transform: uppercase; color: #9C1450; }
.lq-or-bandeau .lq-or-body h2 { margin: 0 0 6px; padding: 0; text-shadow: none; text-transform: none; color: #2A0A1B;
  /* !important : typo.css (landings v4) impose Fraunces 3 rem à tout h2 en !important */
  font-family: Inter, -apple-system, system-ui, sans-serif !important; font-weight: 700 !important; font-variation-settings: normal !important;
  font-size: clamp(1.05rem, 2.2vw, 1.25rem) !important; line-height: 1.25 !important; letter-spacing: -.01em !important; word-spacing: normal !important; }
.lq-or-bandeau .lq-or-body p { margin: 0 0 4px; font: 400 .92rem/1.55 Inter, -apple-system, system-ui, sans-serif; color: #3A1B2A; max-width: none; text-shadow: none; }
.lq-or-bandeau .lq-or-body p.lq-or-fine { margin: 0; font-size: .86rem; }
@media (min-width: 980px) {
  .lq-or-body { display: grid; grid-template-columns: 1fr 1fr; column-gap: 28px; align-items: start; }
  .lq-or-bandeau .lq-or-eyebrow, .lq-or-bandeau .lq-or-body h2 { grid-column: 1 / -1; }
}
.lq-or-btn {
  flex: none;
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 48px;
  padding: 10px 20px;
  border-radius: 12px;
  background: #C2185B;
  color: #FFFFFF;
  font-weight: 600; font-size: .95rem;
  text-decoration: none;
  transition: background-color .18s ease, transform .18s ease;
}
.lq-or-btn:hover { background: #9C1450; opacity: 1; }
.lq-or-btn:active { transform: translateY(1px); }
.lq-or-btn:focus-visible { outline: 3px solid #7A1340; outline-offset: 3px; }
@media (max-width: 560px) {
  .lq-or-in { padding: 14px 16px; gap: 10px; }
  .lq-or-badge { display: none; }   /* l'eyebrow « Octobre Rose » porte déjà le message sur mobile */
  .lq-or-btn { width: 100%; }
}
/* Accueil historique : la barre de navigation est fixe (64 px, 56 px sur mobile) → le bandeau s'y glisse dessous. */
html[data-saison="octobre-rose"] .lq-or-bandeau { margin-top: 64px; }
@media (max-width: 768px) { html[data-saison="octobre-rose"] .lq-or-bandeau { margin-top: 56px; } }
html[data-saison="octobre-rose"] .lq-or-bandeau + .hero-headline { padding-top: 56px; }
/* Landings v4 : l'en-tête est sticky et dans le flux → pas de marge. */
html[data-saison="octobre-rose"] main > .lq-or-bandeau { margin-top: 0; }

/* ═══ 5. Ruban discret des pages à l'identité LiveQuest (pied de page) ═══ */
.lq-or-ruban { display: flex; justify-content: center; padding: 16px 16px calc(16px + env(safe-area-inset-bottom, 0px)); box-sizing: border-box; width: 100%; clear: both; }
.lq-or-pill {
  display: inline-flex; align-items: center; gap: 8px;
  min-height: 44px; max-width: 100%; box-sizing: border-box;
  padding: 6px 16px 6px 12px;
  border-radius: 999px;
  background: #FCE4EC; border: 1px solid #F6C6D6; color: #9C1450;
  font: 600 13px/1.3 Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  text-decoration: none;
  transition: background-color .18s ease, border-color .18s ease;
}
.lq-or-pill .lq-or-ic { flex: none; color: #C2185B; }
.lq-or-pill .lq-or-sub { font-weight: 500; }
a.lq-or-pill:hover { background: #F9D5E1; border-color: #EDA3BD; text-decoration: underline; opacity: 1; }
a.lq-or-pill:focus-visible { outline: 3px solid #9C1450; outline-offset: 2px; }
@media (max-width: 380px) { .lq-or-pill .lq-or-sep, .lq-or-pill .lq-or-sub { display: none; } }

.lq-or-sr { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

@media (prefers-reduced-motion: reduce) { .lq-or-btn, .lq-or-pill { transition: none; } }
@media print { .lq-or-ruban, .lq-or-bandeau { display: none !important; } }