/* ==========================================================================
   Couvreur De L'Eure Et Loir — couche de refonte
   Chargée après la feuille du site. N'ajoute aucune classe dans le HTML :
   elle n'agit que par variables et sélecteurs de structure.
   Retirer les deux lignes d'appel dans le <head> rend le site à son état
   d'origine.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. LE CORRECTIF CRITIQUE — révéler le contenu masqué
   L'export pose style="opacity:0;transform:translateY(26px)" sur 718 éléments,
   attendant un script de révélation qui ne s'exécute jamais. Résultat : une
   grande partie du site est invisible en production. On rend tout visible,
   puis on ré-anime proprement plus bas — de sorte qu'un navigateur qui ne
   sait pas animer affiche quand même la page entière.
   -------------------------------------------------------------------------- */
[style*="opacity:0"] {
  opacity: 1 !important;
  transform: none !important;
}

/* --------------------------------------------------------------------------
   2. Révélation au défilement, sans JavaScript et sans risque
   Uniquement si le navigateur connaît les timelines de défilement ET si la
   personne n'a pas demandé moins d'animation. Sinon : aucune règle, page
   lisible.
   -------------------------------------------------------------------------- */
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) and (min-width: 48rem) {
    main [style*="opacity:0"] {
      animation: rf-apparait linear both;
      animation-timeline: view();
      animation-range: entry 5% cover 22%;
      will-change: opacity, transform;
    }
    @keyframes rf-apparait {
      from { opacity: 0; transform: translateY(22px); }
      to   { opacity: 1; transform: none; }
    }
  }
}

/* --------------------------------------------------------------------------
   3. Emplacements sans photo authentique
   Le pipeline y a posé un pixel transparent plutôt qu'une image inventée.
   On efface le cadre pour qu'aucun trou ne subsiste à l'écran.
   -------------------------------------------------------------------------- */
img[src$="_sans-photo.gif"] { display: none !important; }
:has(> img[src$="_sans-photo.gif"]),
figure:has(img[src$="_sans-photo.gif"]) {
  display: none !important;
}

/* --------------------------------------------------------------------------
   4. Barre d'action mobile (posée par la couche JS après hydratation)
   Discrète, persistante, et qui ne recouvre jamais le bas du contenu :
   le script ajoute la réserve de place sur <body>.
   -------------------------------------------------------------------------- */
.rf-barre {
  position: fixed;
  inset: auto 0 0 0;
  z-index: 60;
  display: none;
  gap: .5rem;
  padding: .5rem .75rem calc(.5rem + env(safe-area-inset-bottom));
  background: color-mix(in srgb, #0b0b0c 92%, transparent);
  backdrop-filter: blur(10px);
  border-top: 1px solid rgba(255, 255, 255, .12);
}
.rf-barre a {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .4rem;
  min-height: 48px;
  padding: 0 .75rem;
  border-radius: 999px;
  font: 600 15px/1.1 inherit;
  text-decoration: none;
  transition: transform .18s ease;
}
.rf-barre a:active { transform: scale(.97); }
.rf-barre .rf-tel   { background: #f97316; color: #17110b; }
.rf-barre .rf-devis { background: transparent; color: #fff; border: 1px solid rgba(255,255,255,.35); }
.rf-barre a:focus-visible { outline: 3px solid #fff; outline-offset: 2px; }

@media (max-width: 47.99rem) {
  .rf-barre { display: flex; }
  body.rf-avec-barre { padding-bottom: 76px; }
}

/* --------------------------------------------------------------------------
   5. Bloc itinéraire, à la place des tuiles OpenStreetMap retirées
   -------------------------------------------------------------------------- */
.rf-itineraire {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .75rem 1rem;
  padding: 1.15rem 1.25rem;
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: 1.25rem;
  background: rgba(255, 255, 255, .03);
}
.rf-itineraire p { margin: 0; font-size: .95rem; line-height: 1.5; opacity: .85; }
.rf-itineraire a {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  min-height: 44px;
  padding: 0 1.1rem;
  border-radius: 999px;
  background: #f97316;
  color: #17110b;
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
}
.rf-itineraire a:focus-visible { outline: 3px solid #fff; outline-offset: 2px; }


/* --------------------------------------------------------------------------
   5 bis. La carte de tuiles
   L'export monte une carte dont les tuiles venaient directement des serveurs
   d'OpenStreetMap — usage que leur politique interdit à un site commercial, et
   douze requêtes tierces par page. Les tuiles sont retirées ; le conteneur,
   devenu vide, est masqué et remplacé par le bloc « Voir l'itinéraire ».
   -------------------------------------------------------------------------- */
.leaflet-container,
[class*="leaflet-tile"],
[class*="leaflet-pane"] {
  display: none !important;
}
:has(> .leaflet-container) { min-height: 0 !important; }

/* --------------------------------------------------------------------------
   6. Consentement au traitement des données, ajouté au formulaire
   -------------------------------------------------------------------------- */
.rf-consentement {
  display: flex;
  gap: .6rem;
  align-items: flex-start;
  margin: 1rem 0 .25rem;
  font-size: .85rem;
  line-height: 1.5;
  opacity: .9;
}
.rf-consentement input {
  flex: none;
  width: 20px;
  height: 20px;
  margin-top: .1rem;
  accent-color: #f97316;
}
.rf-consentement a { color: inherit; text-underline-offset: 3px; }
.rf-erreur {
  margin: .5rem 0 0;
  padding: .6rem .8rem;
  border-radius: .6rem;
  background: rgba(248, 113, 113, .14);
  border: 1px solid rgba(248, 113, 113, .4);
  font-size: .9rem;
}
.rf-succes {
  margin: 1rem 0 0;
  padding: .9rem 1rem;
  border-radius: .8rem;
  background: rgba(74, 222, 128, .12);
  border: 1px solid rgba(74, 222, 128, .4);
  font-size: .95rem;
  line-height: 1.55;
}

/* --------------------------------------------------------------------------
   6 bis. Invitation à laisser un avis Google
   Remplace la section de témoignages retirée : les six qui figuraient ici
   étaient inventés, et la fiche Google ne porte aucun avis.
   -------------------------------------------------------------------------- */
.rf-avis {
  padding: 3.5rem 1.25rem;
  border-top: 1px solid rgba(255, 255, 255, .08);
}
.rf-avis > div {
  max-width: 46rem;
  margin: 0 auto;
  text-align: center;
}
.rf-avis h2 {
  margin: 0 0 .75rem;
  font-size: clamp(1.4rem, 3.4vw, 2rem);
  line-height: 1.15;
}
.rf-avis p {
  margin: 0 auto 1.5rem;
  max-width: 34rem;
  font-size: 1rem;
  line-height: 1.65;
  opacity: .78;
}
.rf-avis a {
  display: inline-flex;
  align-items: center;
  min-height: 48px;
  padding: 0 1.5rem;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, .28);
  color: inherit;
  font-weight: 600;
  text-decoration: none;
  transition: border-color .2s ease, transform .2s ease;
}
.rf-avis a:hover { border-color: #f97316; transform: translateY(-1px); }

/* Sections devenues vides après le retrait des faux témoignages */
main section:not(:has(h1, h2, h3, img, a, button, input, li)) { display: none !important; }

/* --------------------------------------------------------------------------
   7. Lien d'évitement (accessibilité) — posé par la couche JS
   -------------------------------------------------------------------------- */
.rf-evitement {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 100;
  padding: .75rem 1.1rem;
  background: #f97316;
  color: #17110b;
  font-weight: 600;
  border-radius: 0 0 .6rem 0;
}
.rf-evitement:focus { left: 0; }

/* --------------------------------------------------------------------------
   8. Contraste — conformité WCAG AA
   Le gris de texte secondaire du thème (--color-ink-400 : #6b6b78) donne un
   rapport de 3,6 à 3,9 sur les fonds sombres du site, pour un seuil requis de
   4,5. Une seule variable expliquait 47 échecs sur la page réalisations. On
   l'éclaircit juste ce qu'il faut : #8c8c98 donne 5,7 sur #0b0b0c, sans casser
   la hiérarchie visuelle entre texte principal et secondaire.
   -------------------------------------------------------------------------- */
:root {
  --color-ink-400: #8c8c98;
  --color-ink-600: #3d3d49; /* bordures et séparateurs, un cran plus lisibles */
}

/* --------------------------------------------------------------------------
   9. Confort de lecture et cibles tactiles
   -------------------------------------------------------------------------- */
:where(a, button):focus-visible {
  outline: 3px solid #f97316;
  outline-offset: 3px;
  border-radius: 4px;
}
@media (max-width: 47.99rem) {
  main :where(a[href^="tel:"], a[href*="/devis"], a[href*="/contact"]) { min-height: 44px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}
