/* ════════════════════════════════════════════════════════════════════
   RestauVert · polish.css — Niveaux 1 + 2 uniquement
   ★ Quick wins + Polish typographique
   Aucune classe existante modifiée. Désactivable en retirant le <link>.
   ════════════════════════════════════════════════════════════════════ */

/* ─────────────────────────────────────────────
   ★ NIVEAU 1 — Quick wins
   ───────────────────────────────────────────── */

/* 1.1 — Texture grain subtile sur le fond (desktop uniquement) */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 0.5 0'/></filter><rect width='200' height='200' filter='url(%23n)'/></svg>");
  opacity: 0.035;
  mix-blend-mode: multiply;
}

/* 1.2 — Underline animée "ink reveal" sur les liens éditoriaux */
article p > a,
article li > a,
.rv-content a:not(.btn):not(.nav-cta),
.rv-glossary-item a,
.rv-link {
  background-image: linear-gradient(currentColor, currentColor) !important;
  background-size: 0% 1px !important;
  background-position: 0 calc(100% + 1px) !important;
  background-repeat: no-repeat !important;
  text-decoration: none !important;
  transition: background-size .4s cubic-bezier(.16,1,.3,1) !important;
}
article p > a:hover,
article li > a:hover,
.rv-content a:not(.btn):not(.nav-cta):hover,
.rv-glossary-item a:hover,
.rv-link:hover {
  background-size: 100% 1px !important;
}

/* 1.4 — Sélection texte couleur or chaud */
::selection {
  background: rgba(201, 162, 78, 0.32);
  color: #1a4e30;
  text-shadow: none;
}
::-moz-selection {
  background: rgba(201, 162, 78, 0.32);
  color: #1a4e30;
}

/* ─────────────────────────────────────────────
   ★ NIVEAU 2 — Polish typographique
   ───────────────────────────────────────────── */

/* 2.2 — Letter-spacing négatif sur les gros titres (effet éditorial) */
.hero h1,
.page-hero h1,
.section-title,
h1,
h2.section-title {
  letter-spacing: -0.022em;
}
.hero h1 {
  letter-spacing: -0.03em;
  font-feature-settings: "kern" 1, "liga" 1, "ss01" 1;
}

/* 2.3 — Variable font axes Fraunces (si supporté par le navigateur) */
@supports (font-variation-settings: normal) {
  .hero h1,
  .page-hero h1,
  .section-title,
  blockquote {
    font-variation-settings: "opsz" 144, "SOFT" 30;
  }
}

/* 2.4 — Interligne plus généreux sur les articles longs */
article p,
.rv-content p,
.lead-section p,
.faq-answer p {
  line-height: 1.78;
}
article p + p,
.rv-content p + p {
  margin-top: 1.1em;
}

/* Drop-cap or sur le 1er paragraphe d'article (lettrine éditoriale) */
article > p:first-of-type::first-letter,
.rv-content > p:first-of-type::first-letter {
  font-family: 'Fraunces', Georgia, serif;
  font-size: 3.4em;
  line-height: 0.85;
  float: left;
  margin: 0.05em 0.08em 0 0;
  color: #c9a24e;
  font-weight: 500;
}

/* ─────────────────────────────────────────────
   Adaptations mobile : alléger les effets coûteux
   ───────────────────────────────────────────── */
@media (max-width: 900px) {
  body::before { display: none; }
  article > p:first-of-type::first-letter,
  .rv-content > p:first-of-type::first-letter {
    font-size: 2.6em;
  }
}

/* ─────────────────────────────────────────────
   Reduced motion : neutraliser les transitions
   ───────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  article p > a,
  article li > a,
  .rv-content a:not(.btn):not(.nav-cta),
  .rv-glossary-item a,
  .rv-link {
    transition: none !important;
    background-size: 100% 1px !important;
  }
}