/* ═══════════════════════════════════════════════════════════════════════
   RestauVert · warmth.css — Chaleur + Lisibilité PC & Mobile
   Loaded AFTER genius.css. Purement additif.
   Rend le site plus accueillant, humain, chaleureux.
   Améliore drastiquement la lisibilité texte sur tous les devices.
   ═══════════════════════════════════════════════════════════════════════ */

/* ─────────────────────────────────────────────────────────────────────
   0. TOKENS CHALEUR
   ───────────────────────────────────────────────────────────────────── */
:root {
  /* Fond crème plus chaud (très léger shift vers le doré) */
  --w-cream: #FFFBF2;
  --w-cream-section: #FFF8EC;
  --w-cream-card: #FFFEF9;

  /* Ombres plus douces, légèrement dorées */
  --w-shadow-warm:
    0 2px 6px rgba(180,140,50,0.04),
    0 8px 20px rgba(26,78,48,0.05);
  --w-shadow-warm-hover:
    0 4px 12px rgba(180,140,50,0.08),
    0 16px 36px rgba(26,78,48,0.08);

  /* Texte — meilleur contraste */
  --w-text-body: #2A3D32;
  --w-text-secondary: #4A6355;
  --w-text-muted: #6B8272;

  /* Espacement lisibilité */
  --w-line-height: 1.78;
  --w-paragraph-gap: 1.15em;
}


/* ─────────────────────────────────────────────────────────────────────
   1. FOND GLOBAL — Crème plus chaud et accueillant
   ───────────────────────────────────────────────────────────────────── */
html body {
  background-color: var(--w-cream) !important;
}

/* Sections blanches → crème subtil */
html body .section,
html body section:not(.hero):not(.page-hero):not(.lead-section):not([style*="background"]):not(.rv-stats-band):not(.rv-footer-pro) {
  background-color: var(--w-cream) !important;
}

/* Sections alternées avec fond légèrement plus chaud */
html body section:nth-of-type(even):not(.hero):not(.page-hero):not(.lead-section):not([style*="background"]):not(.rv-stats-band):not(.rv-footer-pro) {
  background-color: var(--w-cream-section) !important;
}


/* ─────────────────────────────────────────────────────────────────────
   2. TYPOGRAPHIE LISIBILITÉ — Desktop
   ───────────────────────────────────────────────────────────────────── */

/* Corps de texte : taille plus confortable et interligne aéré */
html body p,
html body li,
html body dd,
html body td,
html body .rv-content p,
html body article p,
html body .faq-answer p {
  font-size: 1.02rem !important;
  line-height: var(--w-line-height) !important;
  color: var(--w-text-body) !important;
}

/* Espacement entre paragraphes */
html body p + p,
html body .rv-content p + p,
html body article p + p {
  margin-top: var(--w-paragraph-gap) !important;
}

/* Descriptions sous-titres de section : plus lisibles */
html body .section-desc,
html body .section-subtitle,
html body section > .container > p:first-of-type,
html body .section > .container > p {
  font-size: 1.06rem !important;
  line-height: 1.72 !important;
  color: var(--w-text-secondary) !important;
  max-width: 680px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Titres de sections — plus chaleureux */
html body .section-title,
html body h2.section-title {
  color: #1a4e30 !important;
  font-weight: 700 !important;
  line-height: 1.22 !important;
}

/* H3 dans les cartes — meilleur poids */
html body .rv-card h3,
html body .service-card h3,
html body .explore-card h3,
html body h3 {
  font-weight: 650 !important;
  line-height: 1.32 !important;
  color: #1a4e30 !important;
}

/* Texte dans les cartes — plus lisible */
html body .rv-card p,
html body .service-card p,
html body .explore-card p,
html body .tarif-card p,
html body .card p {
  font-size: 0.96rem !important;
  line-height: 1.72 !important;
  color: var(--w-text-secondary) !important;
}

/* Petits textes : un poil plus grands */
html body small,
html body .text-sm,
html body .text-small,
html body figcaption,
html body .breadcrumb,
html body .meta {
  font-size: 0.86rem !important;
  line-height: 1.6 !important;
  color: var(--w-text-muted) !important;
}


/* ─────────────────────────────────────────────────────────────────────
   3. CARTES — Plus chaleureuses, bordures douces
   ───────────────────────────────────────────────────────────────────── */

/* Fond blanc pur → crème très subtil */
html body .rv-card,
html body .service-card,
html body .explore-card,
html body .tarif-card,
html body .testimonial-card,
html body .card,
html body article[style*="background:#fff"],
html body div[style*="background: #fff"][style*="border-radius"] {
  background: var(--w-cream-card) !important;
  border-color: rgba(212,180,100,0.18) !important;
}

/* Bordure gauche accent plus chaleureuse */
html body .rv-card-emerald-accent {
  border-left: 4px solid #2D8A56 !important;
}
html body .rv-card-gold-accent {
  border-left: 4px solid #d4a843 !important;
}

/* Icônes dans les cartes — doré plus chaud */
html body .rv-card .ico,
html body .explore-card .ico,
html body .service-card .ico,
html body .explore-card i,
html body .rv-card i.fa,
html body .rv-card i.fas,
html body .rv-card i.far {
  color: #c9a24e !important;
}


/* ─────────────────────────────────────────────────────────────────────
   4. HERO — Texte plus lisible, description plus douce
   ───────────────────────────────────────────────────────────────────── */

/* Description hero — plus grande et lisible */
html body .hero-desc,
html body .hero .hero-desc,
html body .hero p:not(.hero-badge) {
  font-size: 1.12rem !important;
  line-height: 1.72 !important;
  color: rgba(255,255,255,0.88) !important;
  max-width: 560px !important;
}

/* Sous-titre hero — crème doux */
html body .hero .hero-badge,
html body .hero-badge {
  color: #F5DDA0 !important;
  background: rgba(212,168,67,0.22) !important;
  font-size: 0.82rem !important;
  letter-spacing: 1.8px !important;
}

/* Page hero descriptions plus lisibles */
html body .page-hero p,
html body .page-hero .hero-desc {
  font-size: 1.08rem !important;
  line-height: 1.7 !important;
  color: rgba(255,255,255,0.85) !important;
}


/* ─────────────────────────────────────────────────────────────────────
   5. SECTION STATS — Chiffres plus chaleureux
   ───────────────────────────────────────────────────────────────────── */
html body .rv-stats-band .stat-label,
html body .stat-label,
html body .stats-grid .stat-label {
  font-size: 0.82rem !important;
  letter-spacing: 1.2px !important;
  color: rgba(255,255,255,0.72) !important;
  line-height: 1.5 !important;
}


/* ─────────────────────────────────────────────────────────────────────
   6. SECTION TAGS — Plus doux et chaleureux
   ───────────────────────────────────────────────────────────────────── */
html body .section-tag {
  font-size: 0.76rem !important;
  letter-spacing: 1.6px !important;
  padding: 6px 18px !important;
  border-radius: 999px !important;
}

/* Eyebrow "POURQUOI" etc — ton plus doux */
html body .section-eyebrow,
html body .rv-eyebrow {
  color: var(--w-text-muted) !important;
  font-size: 0.78rem !important;
  letter-spacing: 2px !important;
}


/* ─────────────────────────────────────────────────────────────────────
   7. BOUTONS — Coins plus doux, texte plus lisible
   ───────────────────────────────────────────────────────────────────── */

/* Rayon plus doux (10→12px) */
html body .btn,
html body a.btn,
html body button.btn {
  border-radius: 12px !important;
  font-size: 0.96rem !important;
  letter-spacing: 0.01em !important;
  padding: 15px 30px !important;
}

/* CTA gold — plus rond, plus accueillant */
html body .nav-cta {
  border-radius: 999px !important;
  padding: 11px 26px !important;
  font-size: 0.9rem !important;
}

/* Boutons outline "En savoir plus" — meilleure lisibilité */
html body .btn-outline-green,
html body .btn.btn-outline,
html body a.btn.btn-outline {
  border-color: rgba(26,78,48,0.3) !important;
  color: #1a4e30 !important;
  font-weight: 600 !important;
}
html body .btn-outline-green:hover,
html body .btn.btn-outline:hover {
  background: rgba(26,78,48,0.06) !important;
  border-color: #1a4e30 !important;
}


/* ─────────────────────────────────────────────────────────────────────
   8. TIMELINE / MÉTHODE — Plus lisible
   ───────────────────────────────────────────────────────────────────── */
html body .timeline-step p,
html body .method-step p,
html body .rv-timeline-item p {
  font-size: 0.96rem !important;
  line-height: 1.72 !important;
  color: var(--w-text-secondary) !important;
}
html body .timeline-step h3,
html body .method-step h3,
html body .rv-timeline-item h3 {
  font-size: 1.18rem !important;
  font-weight: 650 !important;
}


/* ─────────────────────────────────────────────────────────────────────
   9. BLOG CARDS — Meilleur confort de lecture
   ───────────────────────────────────────────────────────────────────── */
html body .blog-card p,
html body .blog-card .excerpt,
html body .blog-preview p {
  font-size: 0.94rem !important;
  line-height: 1.68 !important;
  color: var(--w-text-secondary) !important;
}
html body .blog-card h3 {
  font-size: 1.12rem !important;
  line-height: 1.35 !important;
}
html body .blog-card .meta,
html body .blog-card .date {
  font-size: 0.82rem !important;
  color: var(--w-text-muted) !important;
}


/* ─────────────────────────────────────────────────────────────────────
   10. NEWSLETTER — Plus accueillant
   ───────────────────────────────────────────────────────────────────── */
html body #newsletter-form input[type="email"],
html body .newsletter-input {
  border-radius: 12px !important;
  padding: 14px 18px !important;
  font-size: 1rem !important;
  border: 1.5px solid rgba(212,168,67,0.3) !important;
  background: #fff !important;
}
html body #newsletter-form input[type="email"]:focus,
html body .newsletter-input:focus {
  border-color: #c9a24e !important;
  box-shadow: 0 0 0 4px rgba(201,162,78,0.15) !important;
}


/* ─────────────────────────────────────────────────────────────────────
   11. FAQ — Plus aéré et lisible
   ───────────────────────────────────────────────────────────────────── */
html body .faq-question,
html body .faq-item summary,
html body details summary {
  font-size: 1.04rem !important;
  font-weight: 600 !important;
  line-height: 1.5 !important;
  padding: 18px 20px !important;
  color: #1a4e30 !important;
}
html body .faq-answer,
html body .faq-item .faq-answer,
html body details .faq-answer {
  padding: 0 20px 18px !important;
}
html body .faq-answer p {
  font-size: 0.98rem !important;
  line-height: 1.78 !important;
}


/* ─────────────────────────────────────────────────────────────────────
   12. FOOTER — Plus lisible et chaleureux
   ───────────────────────────────────────────────────────────────────── */
html body .rv-footer-col a,
html body .rv-footer-pro a {
  font-size: 0.94rem !important;
  line-height: 1.7 !important;
}
html body .rv-footer-col p,
html body .rv-footer-brand p {
  font-size: 0.94rem !important;
  line-height: 1.7 !important;
  color: rgba(255,255,255,0.78) !important;
}


/* ─────────────────────────────────────────────────────────────────────
   13. LIENS — Plus chaleureux
   ───────────────────────────────────────────────────────────────────── */
html body a:not(.btn):not(.nav-cta):not(.nav-logo):not(.logo) {
  color: #1A6B42 !important;
}
html body a:not(.btn):not(.nav-cta):not(.nav-logo):not(.logo):hover {
  color: #c9a24e !important;
}

/* Exception : liens dans footer restent blancs */
html body .rv-footer-pro a,
html body footer a {
  color: rgba(255,255,255,0.78) !important;
}
html body .rv-footer-pro a:hover,
html body footer a:hover {
  color: #d4a843 !important;
}

/* Exception : liens dans hero restent blancs */
html body .hero a,
html body .page-hero a,
html body .lead-section a {
  color: #fff !important;
}

/* Exception : liens nav */
html body .nav-links a:not(.nav-cta) {
  color: #2A3D32 !important;
}
html body .nav-links a:not(.nav-cta):hover {
  color: #1a4e30 !important;
}


/* ─────────────────────────────────────────────────────────────────────
   14. FORMULAIRES — Plus accueillants
   ───────────────────────────────────────────────────────────────────── */
html body input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="submit"]),
html body textarea,
html body select {
  border-radius: 10px !important;
  border: 1.5px solid rgba(26,78,48,0.18) !important;
  padding: 13px 16px !important;
  font-size: 0.98rem !important;
  line-height: 1.5 !important;
  background: #fff !important;
  color: var(--w-text-body) !important;
}
html body input:focus,
html body textarea:focus,
html body select:focus {
  border-color: #c9a24e !important;
  box-shadow: 0 0 0 4px rgba(201,162,78,0.12) !important;
  outline: none !important;
}


/* ─────────────────────────────────────────────────────────────────────
   15. MARQUEE TRUST — Plus lisible
   ───────────────────────────────────────────────────────────────────── */
html body .rv-marquee span,
html body .rv-marquee-track span,
html body .trust-marquee span {
  font-size: 0.88rem !important;
  letter-spacing: 0.02em !important;
  color: var(--w-text-muted) !important;
}


/* ═══════════════════════════════════════════════════════════════════════
   ★ MOBILE — Lisibilité renforcée
   ═══════════════════════════════════════════════════════════════════════ */

@media (max-width: 768px) {

  /* Corps de texte mobile — plus grand et aéré */
  html body p,
  html body li,
  html body .rv-content p,
  html body article p {
    font-size: 1.02rem !important;
    line-height: 1.82 !important;
  }

  /* Titres de section mobile — taille optimale */
  html body .section-title,
  html body h2.section-title,
  html body h2 {
    font-size: clamp(1.45rem, 5.5vw, 1.85rem) !important;
    line-height: 1.25 !important;
    letter-spacing: -0.01em !important;
  }

  /* H3 mobile */
  html body h3 {
    font-size: 1.12rem !important;
    line-height: 1.35 !important;
  }

  /* Descriptions sections mobile */
  html body .section-desc,
  html body .section-subtitle {
    font-size: 0.98rem !important;
    line-height: 1.72 !important;
    padding: 0 0.5rem !important;
  }

  /* Cards texte mobile */
  html body .rv-card p,
  html body .service-card p,
  html body .explore-card p,
  html body .tarif-card p,
  html body .card p {
    font-size: 0.95rem !important;
    line-height: 1.72 !important;
  }

  /* Padding cartes mobile — plus d'air */
  html body .rv-card,
  html body .service-card,
  html body .explore-card,
  html body .card {
    padding: 22px 20px !important;
  }

  /* Hero mobile — texte plus lisible */
  html body .hero-desc {
    font-size: 1.02rem !important;
    line-height: 1.7 !important;
    color: rgba(255,255,255,0.88) !important;
  }

  /* Boutons mobile — plus gros, plus faciles à taper */
  html body .btn,
  html body a.btn {
    padding: 16px 28px !important;
    font-size: 0.98rem !important;
    min-height: 50px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  /* Blog cards mobile */
  html body .blog-card p,
  html body .blog-card .excerpt {
    font-size: 0.94rem !important;
    line-height: 1.68 !important;
  }

  /* FAQ mobile */
  html body .faq-question,
  html body details summary {
    font-size: 1rem !important;
    padding: 16px 18px !important;
  }
  html body .faq-answer p {
    font-size: 0.96rem !important;
    line-height: 1.78 !important;
  }

  /* Footer mobile — texte plus grand */
  html body .rv-footer-col a {
    font-size: 0.94rem !important;
    padding: 10px 0 !important;
    min-height: 44px !important;
    display: inline-flex !important;
    align-items: center !important;
  }

  /* Container padding mobile — plus d'air latéral */
  html body .container {
    padding-left: 1.4rem !important;
    padding-right: 1.4rem !important;
  }

  /* Espacement sections mobile — plus de respiration */
  html body section:not(.hero):not(.page-hero) {
    padding-top: 56px !important;
    padding-bottom: 56px !important;
  }
}

/* ── Petit mobile (≤480px) ── */
@media (max-width: 480px) {

  /* Texte corps encore plus confortable */
  html body p,
  html body li {
    font-size: 1rem !important;
    line-height: 1.8 !important;
  }

  /* Titres adaptés */
  html body .section-title,
  html body h2 {
    font-size: clamp(1.35rem, 6vw, 1.65rem) !important;
  }

  html body h3 {
    font-size: 1.08rem !important;
  }

  /* Plus d'air dans les cartes */
  html body .rv-card,
  html body .service-card,
  html body .card {
    padding: 20px 18px !important;
    border-radius: 14px !important;
  }

  /* Boutons pleine largeur sur petit mobile */
  html body .btn,
  html body a.btn {
    width: 100% !important;
    text-align: center !important;
  }
}


/* ═══════════════════════════════════════════════════════════════════════
   ★ GRAND ÉCRAN — Lisibilité renforcée
   ═══════════════════════════════════════════════════════════════════════ */

@media (min-width: 1200px) {

  /* Mesure de lecture optimale (65-75 caractères) */
  html body article p,
  html body .rv-content p,
  html body .faq-answer p {
    max-width: 72ch !important;
  }

  /* Descriptions centrées */
  html body .section-desc,
  html body .section-subtitle {
    max-width: 700px !important;
  }

  /* Cards — padding généreux */
  html body .rv-card,
  html body .service-card,
  html body .explore-card {
    padding: 28px 26px !important;
  }
}


/* ─────────────────────────────────────────────────────────────────────
   ★ ACCESSIBILITÉ — Contraste renforcé
   ───────────────────────────────────────────────────────────────────── */
@media (prefers-contrast: more) {
  :root {
    --w-text-body: #1A2A20;
    --w-text-secondary: #2A3D32;
    --w-text-muted: #4A5E52;
  }
  html body .rv-card,
  html body .service-card {
    border-color: rgba(26,78,48,0.3) !important;
  }
}


/* ─────────────────────────────────────────────────────────────────────
   ★ REDUCED MOTION
   ───────────────────────────────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  html body a:not(.btn):not(.nav-cta):not(.nav-logo):not(.logo):hover {
    transition: none !important;
  }
}


/* ─────────────────────────────────────────────────────────────────────
   ★ PRINT — lisibilité maximale
   ───────────────────────────────────────────────────────────────────── */
@media print {
  html body {
    background: #fff !important;
  }
  html body p,
  html body li {
    font-size: 11pt !important;
    line-height: 1.6 !important;
    color: #000 !important;
  }
}