/* TiKamp — refonte graphique 2026-10 : famille « public ».
   ------------------------------------------------------------------
   Chargée après le socle (tk-refonte.css) sur les pages qui déclarent
   data-refonte-famille="public". Mêmes règles : tout est porté par
   html[data-refonte], et VERSION change dans src/services/refonte.js.

   Sommaire :
     1. Pages « document » (mentions légales, confidentialité, accessibilité…)
     2. Briques communes aux pages publiques (liste de suggestions, encart de saison)
     3. Accueil (body.page-accueil)
     4. Scanner (body.page-scan)
     5. Carte (body.page-carte) — par-dessus refonte-public-carte.css
     7. Accès (body.page-acces) : connexion de l'hôte
     8. Pages de présentation (body.page-vitrine) : réseau
    13. Tarifs (body.page-tarifs) — par-dessus sa feuille d'origine
    12. Contact (body.page-contact) — par-dessus sa feuille d'origine
    11. Inscriptions : camping (body.page-inscription), hôte (body.page-devenir-hote) — par-dessus leurs feuilles d'origine
    10. Offres communes et associations (body.page-offre) — par-dessus leurs feuilles d'origine
     9. Aide et guide PayFiP (body.page-aide, body.page-aide-payfip) — par-dessus leurs feuilles d'origine
     6. Annuaire, fiche d'un lieu, page introuvable — pages générées par le serveur (body.page-annuaire)
   Chaque page pose une classe sur <body> : ses règles ne débordent pas ailleurs.
   ------------------------------------------------------------------ */

/* ── 1. Pages « document » ───────────────────────────────────────── */

html[data-refonte] .document { max-width:1150px; padding-bottom:var(--e-7); }

html[data-refonte] .document-intro { max-width:900px; padding-block:var(--e-6); }
html[data-refonte] .document-intro h1 { margin-block:var(--e-4); font-size:2.6875rem; letter-spacing:-.045em; }
html[data-refonte] .document-intro p { max-width:70ch; color:var(--ink-3); font-size:1.0625rem; }

html[data-refonte] .document-layout {
  display:grid; grid-template-columns:230px minmax(0, 1fr); gap:var(--e-6); align-items:start;
}

/* Sommaire : colonne collante sur ordinateur, bandeau sur tablette,
   liste repliable sur téléphone (.mobile-toc). */
html[data-refonte] .document-toc,
html[data-refonte] .mobile-toc {
  border:1px solid var(--primary-soft-border); background:var(--primary-soft); color:var(--primary-hover);
  font-size:.875rem;
}
html[data-refonte] .document-toc {
  position:sticky; top:var(--e-5); min-width:0; padding:var(--e-5) 20px; border-radius:var(--e-4);
}
html[data-refonte] .document-toc strong { display:block; margin-bottom:var(--e-1); font-size:.8125rem; }
html[data-refonte] .document-toc a,
html[data-refonte] .mobile-toc a {
  display:flex; align-items:center; min-height:44px; line-height:1.4; text-decoration:none;
}
html[data-refonte] .document-toc a:hover,
html[data-refonte] .mobile-toc a:hover { text-decoration:underline; }
html[data-refonte] .mobile-toc { display:none; }

html[data-refonte] .document-body { min-width:0; font-size:1rem; line-height:1.7; }
html[data-refonte] .document-body p { margin:var(--e-3) 0 var(--e-4); }
html[data-refonte] .document-body ul { margin:0 0 var(--e-4); padding-left:20px; }
html[data-refonte] .document-body li { margin-bottom:var(--e-2); }
html[data-refonte] .document-body a { color:var(--primary-hover); overflow-wrap:anywhere; }
html[data-refonte] .document-body a:hover { color:var(--primary); }
/* Liens seuls sur leur ligne (fiche d'informations, adresse de contact) : 44 px de haut. */
html[data-refonte] .document-body dl.card dd a,
html[data-refonte] .document-body li a[href^="mailto:"] { display:inline-flex; align-items:center; min-height:44px; }
html[data-refonte] .document-body .meta { margin:var(--e-3) 0 var(--e-5); color:var(--ink-3); }

/* Partie repliable : le titre (h2) est dans le bouton d'ouverture. */
html[data-refonte] .document-part {
  margin-block:var(--e-4); padding:var(--e-2) var(--e-5);
  border:1px solid var(--border); border-radius:var(--r-md); background:var(--surface);
  scroll-margin-top:var(--e-5);
  transition:border-color var(--transition);
}
html[data-refonte] .document-part:hover,
html[data-refonte] .document-part[open] { border-color:var(--border-fort); }
html[data-refonte] .document-part > summary {
  min-height:44px; padding-block:20px;
  color:var(--primary-hover); font-size:1.1875rem; font-weight:600; line-height:1.35;
}
html[data-refonte] .document-part > summary h2 {
  display:inline; font:inherit; letter-spacing:-.01em; color:inherit;
}
html[data-refonte] .document-part[open] > summary { border-bottom:1px solid var(--border); margin-bottom:var(--e-4); }
html[data-refonte] .document-part > :last-child:not(summary) { margin-bottom:var(--e-4); }

/* Fiche d'informations (terme / valeur) à l'intérieur d'un document. */
html[data-refonte] .document-body dl.card {
  display:grid; grid-template-columns:170px minmax(0, 1fr); gap:var(--e-3) var(--e-5);
  margin:var(--e-5) 0; padding:var(--e-5);
  border-radius:var(--e-4); background:var(--bg);
}
html[data-refonte] .document-body dl.card dt { color:var(--ink-3); font-size:.875rem; line-height:1.6; }
html[data-refonte] .document-body dl.card dd { margin:0; font-size:.9375rem; line-height:1.6; overflow-wrap:anywhere; }

/* Contenus des documents : encadré d'introduction, listes numérotées, tableaux, mentions. */
html[data-refonte] .document-body .intro {
  margin:0 0 var(--e-5); padding:var(--e-4) 20px;
  border:1px solid var(--primary-soft-border); border-radius:var(--r-md); background:var(--primary-soft); color:var(--ink-2);
}
html[data-refonte] .document-body ol { margin:0 0 var(--e-4); padding-left:var(--e-5); }
html[data-refonte] .document-body h3 { margin:var(--e-5) 0 var(--e-2); font-size:1.0625rem; letter-spacing:-.01em; }
html[data-refonte] .document-body .source { color:var(--ink-3); font-size:.875rem; }
html[data-refonte] .document-body .badge-conf {
  display:inline-block; padding:var(--e-1) var(--e-3); border-radius:999px;
  background:var(--accent-soft); color:var(--accent-ink);
  font:500 .8125rem/1.4 var(--police-signal); letter-spacing:.08em; text-transform:uppercase;
}
html[data-refonte] .document-body table { width:100%; margin:var(--e-3) 0 var(--e-5); border-collapse:collapse; font-size:.9375rem; line-height:1.5; }
html[data-refonte] .document-body caption {
  margin-bottom:var(--e-2); color:var(--primary-hover); text-align:left;
  font:500 .8125rem/1.4 var(--police-signal); letter-spacing:.08em; text-transform:uppercase;
}
html[data-refonte] .document-body th,
html[data-refonte] .document-body td { padding:var(--e-3); border-bottom:1px solid var(--border); text-align:left; vertical-align:top; overflow-wrap:anywhere; }
html[data-refonte] .document-body th { background:var(--bg); color:var(--ink); font-weight:600; }

@media (max-width:1050px) {
  html[data-refonte] .document-layout { display:block; }
  html[data-refonte] .document-toc {
    position:static; display:flex; flex-wrap:wrap; gap:0 20px; margin-bottom:var(--e-5);
  }
  html[data-refonte] .document-toc strong { flex-basis:100%; }
}

@media (max-width:650px) {
  html[data-refonte] .document { padding-bottom:var(--e-6); }
  html[data-refonte] .document-intro { padding-block:var(--e-5); }
  html[data-refonte] .document-intro h1 { margin-block:var(--e-3); font-size:2.125rem; }
  html[data-refonte] .document-intro p { font-size:.9375rem; }
  html[data-refonte] .document-toc { display:none; }
  html[data-refonte] .mobile-toc { display:block; margin-bottom:var(--e-5); padding:var(--e-1) var(--e-4); border-radius:var(--r-md); }
  html[data-refonte] .mobile-toc > summary { display:list-item; min-height:44px; padding-block:var(--e-3); font-weight:600; }
  html[data-refonte] .document-part { padding-inline:20px; }
  html[data-refonte] .document-part > summary { padding-block:var(--e-4); font-size:1.0625rem; }
  html[data-refonte] .document-body dl.card { grid-template-columns:minmax(0, 1fr); gap:0; padding:20px; }
  html[data-refonte] .document-body dl.card dt { margin-top:var(--e-3); }
  html[data-refonte] .document-body dl.card dt:first-child { margin-top:0; }
}

/* Tableaux : sous 760 px, chaque ligne devient une fiche, l'en-tête de colonne en étiquette. */
@media (max-width:760px) {
  html[data-refonte] .document-body table,
  html[data-refonte] .document-body thead,
  html[data-refonte] .document-body tbody,
  html[data-refonte] .document-body tr,
  html[data-refonte] .document-body td,
  html[data-refonte] .document-body caption { display:block; width:100%; }
  html[data-refonte] .document-body thead { position:absolute; left:-9999px; }
  html[data-refonte] .document-body tr { margin-bottom:var(--e-3); padding:var(--e-3) var(--e-4); border:1px solid var(--border); border-radius:var(--r-md); background:var(--bg); }
  html[data-refonte] .document-body td { padding:var(--e-1) 0; border-bottom:0; }
  html[data-refonte] .document-body td + td { margin-top:var(--e-2); }
  html[data-refonte] .document-body td::before {
    content:attr(data-label); display:block; color:var(--ink-3);
    font:500 .75rem/1.4 var(--police-signal); letter-spacing:.08em; text-transform:uppercase;
  }
}

@media (prefers-reduced-motion:reduce) {
  html[data-refonte] .document-part { transition:none; }
}

/* Impression : le script ouvre toutes les parties ; sommaire et navigation inutiles sur papier. */
@media print {
  html[data-refonte] .site-header,
  html[data-refonte] .site-footer,
  html[data-refonte] .document-toc,
  html[data-refonte] .mobile-toc,
  html[data-refonte] .skip-link { display:none; }
  html[data-refonte] .document-layout { display:block; }
}


/* ── 2. Briques communes aux pages publiques ─────────────────────── */

/* Liste de suggestions de la recherche (public/js/search-autocomplete.js). */
html[data-refonte] .tk-ac {
  position:absolute; top:100%; left:0; right:0; z-index:1200;
  margin:var(--e-2) 0 0; padding:var(--e-1); list-style:none; max-height:320px; overflow:auto;
  border:1px solid var(--border); border-radius:var(--r-md); background:var(--surface);
  box-shadow:0 12px 32px rgba(10, 95, 45, .12); text-align:left;
}
html[data-refonte] .tk-ac-opt {
  display:flex; align-items:center; gap:var(--e-2); min-height:44px; padding:var(--e-2) var(--e-3);
  border-radius:var(--r-sm); color:var(--ink); font-size:1rem; cursor:pointer;
}
html[data-refonte] .tk-ac-opt.active,
html[data-refonte] .tk-ac-opt:hover { background:var(--primary-soft); }
html[data-refonte] .tk-ac-ic { flex:none; width:18px; text-align:center; }
html[data-refonte] .tk-ac-empty { padding:var(--e-3); color:var(--ink-3); font-size:1rem; }

/* Saison sur l'accueil : le ruban du thème saisonnier (même forme que sur les pages d'un
   camping, sous le pied de page), en vert — la page n'est jamais recolorée. */
html[data-refonte] .tk-or-ruban { display:flex; justify-content:center; width:100%; padding:0 var(--e-4) calc(var(--e-4) + env(safe-area-inset-bottom, 0px)); }
html[data-refonte] .tk-or-pill {
  display:inline-flex; align-items:center; gap:var(--e-2); min-height:44px; max-width:100%; padding:6px var(--e-4) 6px var(--e-3);
  border:1px solid var(--primary-soft-border); border-radius:999px; background:var(--primary-soft); color:var(--primary-hover);
  font-size:.8125rem; font-weight:600; line-height:1.3; text-decoration:none;
  transition:background-color var(--transition), border-color var(--transition);
}
html[data-refonte] .tk-or-pill .tk-or-ic { flex:none; color:var(--primary-hover); }
html[data-refonte] .tk-or-pill .tk-or-sub { font-weight:500; }
html[data-refonte] a.tk-or-pill:hover { border-color:var(--border-fort); text-decoration:underline; }
html[data-refonte] .tk-or-sr { position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0, 0, 0, 0); white-space:nowrap; border:0; }

/* En-tête commun, réglage de la famille « public » : l'accueil et la page Scanner portent
   leur propre bouton « Scanner le QR code » ; celui de l'en-tête n'y est pas répété (il reste
   dans le menu), et le nom de la marque y reste donc affiché même sur un très petit téléphone. */
html[data-refonte] .page-accueil .site-header .header-scan,
html[data-refonte] .page-scan .site-header .header-scan { display:none; }
@media (max-width:359px) {
  html[data-refonte] .page-accueil .site-header .tk-logo__text,
  html[data-refonte] .page-scan .site-header .tk-logo__text { position:static; width:auto; height:auto; overflow:visible; clip:auto; }
}

/* Icônes au trait posées par public/js/refonte-public.js à la place des emoji des scripts d'origine. */
html[data-refonte] .rp-ico { display:inline-flex; flex:none; vertical-align:-.18em; margin-inline:.2em; }
html[data-refonte] .rp-ico svg { width:1.1em; height:1.1em; }
html[data-refonte] .row-fav .rp-ico,
html[data-refonte] .tk-ac-ic .rp-ico { margin-inline:0; }
html[data-refonte] .row-fav .rp-ico svg { width:22px; height:22px; }

/* Éléments cachés au départ (voir public/js/refonte-public.js). */
html[data-refonte] [data-refonte-cache]:not([style]) { display:none; }

/* ── 3. Accueil ──────────────────────────────────────────────────── */
html[data-refonte] .page-accueil .intro { padding-top:var(--e-7); }
html[data-refonte] .page-accueil .hero {
  display:grid; grid-template-columns:minmax(0, 1fr) minmax(0, 1.03fr); gap:var(--e-7); align-items:center;
}
html[data-refonte] .page-accueil .hero-copy { min-width:0; padding-block:var(--e-5); }
html[data-refonte] .page-accueil .hero-copy h1 { margin-block:var(--e-5); }
html[data-refonte] .page-accueil .hero-sub { max-width:475px; color:var(--ink-3); font-size:1.1875rem; }
html[data-refonte] .page-accueil .hero-photo {
  height:468px; border-radius:28px; overflow:hidden; background:#DCE7D4;
}
html[data-refonte] .page-accueil .hero-photo img {
  display:block; width:100%; height:100%; object-fit:cover; object-position:65% center;
}

/* Recherche : un seul cadre, l'anneau de focus est porté par le cadre. */
html[data-refonte] .page-accueil .search {
  position:relative; display:flex; gap:var(--e-2); margin:var(--e-5) 0 var(--e-3); padding:var(--e-2);
  border:1px solid var(--border); border-radius:var(--e-4); background:var(--surface);
  box-shadow:0 8px 26px rgba(10, 95, 45, .03);
  transition:border-color var(--transition);
}
html[data-refonte] .page-accueil .search:hover { border-color:var(--border-fort); }
html[data-refonte] .page-accueil .search:focus-within { border-color:var(--primary); box-shadow:0 0 0 3px var(--primary-soft); }
html[data-refonte] .page-accueil .search-champ { flex:1; min-width:0; display:flex; align-items:center; }
html[data-refonte] .page-accueil .search-ic { flex:none; width:16px; height:16px; margin-left:var(--e-3); color:var(--ink-3); }
html[data-refonte] .page-accueil .search input {
  width:100%; min-width:0; min-height:48px; padding:var(--e-2) var(--e-3);
  border:0; background:transparent; color:var(--ink); font-size:1rem;
}
html[data-refonte] .page-accueil .search input::placeholder { color:var(--ink-3); opacity:1; }
html[data-refonte] .page-accueil .search input:focus-visible { outline:none; box-shadow:none; }
html[data-refonte] .page-accueil .search .btn { flex:none; }

html[data-refonte] .page-accueil .arrival-actions { display:flex; flex-wrap:wrap; gap:var(--e-3); }
html[data-refonte] .page-accueil .arrival-actions .btn { flex:1; white-space:nowrap; }
html[data-refonte] .page-accueil #geo[aria-busy="true"] { color:var(--ink-3); cursor:progress; }

html[data-refonte] .page-accueil .near-shortcuts {
  display:flex; flex-wrap:wrap; align-items:center; gap:var(--e-2) var(--e-3); margin-top:var(--e-3);
  color:var(--ink-3); font-size:.875rem;
}
html[data-refonte] .page-accueil .envie {
  display:inline-flex; flex-direction:column; align-items:flex-start; justify-content:center;
  min-height:44px; max-width:100%; padding:6px var(--e-3);
  border:1px solid var(--border); border-radius:var(--r-md); background:var(--surface);
  color:var(--primary-hover); text-align:left; line-height:1.3;
  transition:background-color var(--transition), border-color var(--transition);
}
html[data-refonte] .page-accueil .envie:hover { background:var(--primary-soft); border-color:var(--primary-soft-border); }
html[data-refonte] .page-accueil .envie-nom { font-size:.875rem; font-weight:600; overflow-wrap:anywhere; }
html[data-refonte] .page-accueil .envie-meta { color:var(--ink-3); font-size:.8125rem; overflow-wrap:anywhere; }
html[data-refonte] .page-accueil .envie[aria-busy="true"] { opacity:.6; cursor:progress; }
/* Ligne « Au plus proche » : sur une ligne tant qu'elle tient ; sinon le libellé passe seul
   au-dessus et les deux pastilles forment une grille 2 colonnes, même largeur, même hauteur,
   alignées sur les bords des deux boutons du dessus (même gouttière var(--e-2) que leur grille
   mobile). Requête de conteneur sur le bloc lui-même : vaut à toute largeur d'écran et quelle que
   soit la police (charte ou non), sans dépendre du découpage de la colonne du hero. */
html[data-refonte] .page-accueil .near-shortcuts { container:proche / inline-size; }
@container proche (max-width:520px) {
  html[data-refonte] .page-accueil .near-shortcuts > .near-titre { flex:1 0 100%; line-height:1.3; }
  html[data-refonte] .page-accueil .near-shortcuts > .envie {
    flex:1 1 0; min-width:0; min-height:52px; max-width:none;
  }
}
@container proche (max-width:327px) {
  html[data-refonte] .page-accueil .near-shortcuts > .envie { flex-basis:100%; }
}
html[data-refonte] .page-accueil .near-status { margin-top:var(--e-2); color:var(--ink-2); font-size:.875rem; }
html[data-refonte] .page-accueil .near-status:empty { display:none; }

/* Trois parcours */
html[data-refonte] .page-accueil .paths {
  display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:var(--e-4);
  margin:var(--e-6) 0 0; padding:0; list-style:none;
}
html[data-refonte] .page-accueil .path-card {
  position:relative; display:flex; align-items:flex-start; gap:var(--e-4); padding:var(--e-5);
  border:1px solid var(--border); border-radius:var(--r-lg); background:var(--surface);
  transition:border-color var(--transition), transform var(--transition);
}
html[data-refonte] .page-accueil .path-card:hover { border-color:var(--border-fort); transform:translateY(-2px); }
html[data-refonte] .page-accueil .path-card.host { border-color:var(--primary-soft-border); background:var(--primary-soft); }
html[data-refonte] .page-accueil .icon-box {
  flex:none; display:flex; align-items:center; justify-content:center; width:44px; height:44px;
  border-radius:var(--r-md); background:var(--bg-2); color:var(--primary-hover);
}
html[data-refonte] .page-accueil .path-card.host .icon-box { background:var(--surface); }
html[data-refonte] .page-accueil .icon-box svg { width:23px; height:23px; }
html[data-refonte] .page-accueil .path-card h2 { margin-bottom:var(--e-1); font-size:1.125rem; line-height:1.3; letter-spacing:-.025em; }
html[data-refonte] .page-accueil .path-card p { color:var(--ink-3); font-size:.875rem; line-height:1.5; }
html[data-refonte] .page-accueil .path-card.host p { color:var(--ink-2); }
html[data-refonte] .page-accueil .path-card a {
  display:inline-flex; align-items:center; min-height:44px; font-size:.875rem; font-weight:600;
}
/* Toute la carte est cliquable ; le lien reste le seul élément annoncé. */
html[data-refonte] .page-accueil .path-card a::after { content:''; position:absolute; inset:0; border-radius:inherit; }
html[data-refonte] .page-accueil .path-card a:focus-visible { outline:none; box-shadow:none; }
html[data-refonte] .page-accueil .path-card a:focus-visible::after { outline:3px solid var(--accent); outline-offset:2px; box-shadow:0 0 0 2px var(--ink); }

/* Hôtes */
html[data-refonte] .page-accueil .host-band {
  display:grid; grid-template-columns:minmax(0, 1.4fr) minmax(0, 1fr); gap:var(--e-7); align-items:center;
  padding:var(--e-7); border-radius:28px; background:var(--primary-hover); color:#fff;
}
html[data-refonte] .page-accueil .host-band .eyebrow { color:#B5DFBC; }
html[data-refonte] .page-accueil .host-band h2 { margin:var(--e-3) 0 var(--e-4); }
html[data-refonte] .page-accueil .host-band-texte p { max-width:535px; color:#D4E8D8; }
html[data-refonte] .page-accueil .host-band-actions { display:flex; flex-wrap:wrap; align-items:center; gap:var(--e-3) var(--e-5); margin-top:var(--e-5); }
html[data-refonte] .page-accueil .host-band .btn { background:#fff; color:var(--primary-hover); }
html[data-refonte] .page-accueil .host-band .btn:hover { background:var(--primary-soft); }
html[data-refonte] .page-accueil .host-band-lien { display:inline-flex; align-items:center; min-height:44px; color:#fff; font-size:.9375rem; font-weight:600; }
html[data-refonte] .page-accueil .host-steps {
  display:grid; gap:20px; margin:0; padding:0 0 0 var(--e-6); list-style:none;
  border-left:1px solid rgba(255, 255, 255, .19); font-size:.9375rem; font-weight:600;
}
html[data-refonte] .page-accueil .host-steps span { display:block; margin-top:2px; color:#C5E0CC; font-size:.8125rem; font-weight:400; line-height:1.5; }
html[data-refonte] .page-accueil .host-steps a { display:inline-flex; align-items:center; min-height:44px; color:#fff; font-size:.8125rem; font-weight:600; }

/* Une fois arrivé */
html[data-refonte] .page-accueil .section-suite { padding-top:0; }
html[data-refonte] .page-accueil .section-head { margin-bottom:var(--e-6); }
html[data-refonte] .page-accueil .section-head h2,
html[data-refonte] .page-accueil .pro-texte h2,
html[data-refonte] .page-accueil .faq-titre h2 { margin-top:var(--e-3); }
html[data-refonte] .page-accueil .steps {
  display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:var(--e-6); margin:0; padding:0; list-style:none;
}
html[data-refonte] .page-accueil .step { padding-top:var(--e-4); border-top:1px solid var(--border); }
html[data-refonte] .page-accueil .step .eyebrow { margin-bottom:var(--e-3); font-size:.8125rem; }
html[data-refonte] .page-accueil .step p { margin-top:var(--e-2); color:var(--ink-3); font-size:.9375rem; }

/* Gestion */
html[data-refonte] .page-accueil .pro-panel {
  display:flex; align-items:center; justify-content:space-between; gap:var(--e-7); padding:var(--e-6);
  border:1px solid var(--border); border-radius:var(--r-lg); background:var(--surface);
}
html[data-refonte] .page-accueil .pro-texte { min-width:0; }
html[data-refonte] .page-accueil .pro-texte > p { max-width:650px; margin-top:var(--e-3); color:var(--ink-3); }
html[data-refonte] .page-accueil .pro-liens { display:flex; flex-wrap:wrap; gap:0 var(--e-5); font-size:.875rem; font-weight:600; }
html[data-refonte] .page-accueil .pro-liens a { display:inline-flex; align-items:center; min-height:44px; color:var(--primary-hover); }
html[data-refonte] .page-accueil .pro-actions { flex:none; display:grid; gap:var(--e-2); width:260px; }
html[data-refonte] .page-accueil .pro-fine { color:var(--ink-2); font-size:.8125rem; }
html[data-refonte] .page-accueil .pro-fine:empty { display:none; }
html[data-refonte] .page-accueil .pro-prix { margin-top:var(--e-1); color:var(--ink-3); font-size:.8125rem; line-height:1.5; }
html[data-refonte] .page-accueil #pro-demo[aria-busy="true"] { cursor:progress; }

/* Questions */
html[data-refonte] .page-accueil .faq { display:grid; grid-template-columns:minmax(0, .8fr) minmax(0, 1.4fr); gap:var(--e-8); }
html[data-refonte] .page-accueil .faq details { border-bottom:1px solid var(--border); font-size:.9375rem; }
html[data-refonte] .page-accueil .faq details:first-child { border-top:1px solid var(--border); }
html[data-refonte] .page-accueil .faq summary {
  display:flex; align-items:center; justify-content:space-between; gap:var(--e-4);
  min-height:56px; padding:var(--e-4) var(--e-1); font-weight:600; list-style:none;
  transition:color var(--transition);
}
html[data-refonte] .page-accueil .faq summary::-webkit-details-marker { display:none; }
html[data-refonte] .page-accueil .faq summary:hover { color:var(--primary-hover); }
html[data-refonte] .page-accueil .faq .tgl {
  flex:none; position:relative; width:14px; height:14px; color:var(--primary-hover);
}
html[data-refonte] .page-accueil .faq .tgl::before,
html[data-refonte] .page-accueil .faq .tgl::after {
  content:''; position:absolute; top:6px; left:0; width:14px; height:2px; border-radius:1px; background:currentColor;
  transition:transform var(--transition);
}
html[data-refonte] .page-accueil .faq .tgl::after { transform:rotate(90deg); }
html[data-refonte] .page-accueil .faq details[open] .tgl::after { transform:rotate(0deg); }
html[data-refonte] .page-accueil .faq details > p,
html[data-refonte] .page-accueil .faq details > ul { margin:0 0 var(--e-4); padding-inline:var(--e-1); color:var(--ink-2); max-width:70ch; }
html[data-refonte] .page-accueil .faq details > ul { padding-left:var(--e-5); }
html[data-refonte] .page-accueil .faq details li { margin-bottom:var(--e-2); }
html[data-refonte] .page-accueil .faq details a { color:var(--primary-hover); font-weight:600; }
html[data-refonte] .page-accueil .sources-carte { padding-bottom:var(--e-6); color:var(--ink-3); font-size:.8125rem; }

@media (max-width:1050px) {
  html[data-refonte] .page-accueil .hero { grid-template-columns:minmax(0, 1.08fr) minmax(0, .92fr); gap:var(--e-5); }
  html[data-refonte] .page-accueil .hero-copy h1 { font-size:3rem; }
  html[data-refonte] .page-accueil .hero-sub { font-size:1rem; }
  html[data-refonte] .page-accueil .hero-photo { height:455px; }
  html[data-refonte] .page-accueil .arrival-actions { flex-direction:column; }
  html[data-refonte] .page-accueil .paths { grid-template-columns:repeat(2, minmax(0, 1fr)); }
  html[data-refonte] .page-accueil .path-card.host { grid-column:1 / -1; order:-1; }
  html[data-refonte] .page-accueil .host-band { grid-template-columns:minmax(0, 1fr) minmax(0, 1fr); gap:var(--e-5); padding:var(--e-6); }
  html[data-refonte] .page-accueil .host-steps { padding-left:var(--e-5); }
  html[data-refonte] .page-accueil .pro-panel { align-items:flex-start; gap:var(--e-5); }
  html[data-refonte] .page-accueil .pro-actions { width:220px; }
  html[data-refonte] .page-accueil .faq { gap:var(--e-6); }
}

@media (max-width:650px) {
  html[data-refonte] .page-accueil .intro { padding-top:var(--e-5); }
  html[data-refonte] .page-accueil .hero { display:flex; flex-direction:column; align-items:stretch; gap:var(--e-5); }
  html[data-refonte] .page-accueil .hero-copy { padding:0; }
  html[data-refonte] .page-accueil .hero-copy h1 { margin-block:var(--e-3); font-size:2.5rem; }
  html[data-refonte] .page-accueil .hero-sub { font-size:.9375rem; line-height:1.5; }
  html[data-refonte] .page-accueil .hero-photo { height:185px; border-radius:var(--r-lg); }
  html[data-refonte] .page-accueil .search { margin:var(--e-4) 0 var(--e-3); border-radius:var(--r-md); }
  html[data-refonte] .page-accueil .search-ic { display:none; }
  html[data-refonte] .page-accueil .search input::placeholder { font-size:.875rem; }
  html[data-refonte] .page-accueil .search .btn { padding-inline:var(--e-4); }
  html[data-refonte] .page-accueil .arrival-actions { display:grid; grid-template-columns:minmax(0, 1fr) minmax(0, 1fr); gap:var(--e-2); }
  /* Deux boutons strictement jumeaux : même largeur (grille 1fr/1fr), même hauteur, libellé sur
     UNE ligne à 360 comme à 390 px (police 13 px, picto 16 px). Si la police est agrandie par
     l'utilisateur, le retour à la ligne reste permis et équilibré, la hauteur reste commune. */
  html[data-refonte] .page-accueil .arrival-actions .btn {
    min-height:52px; padding:var(--e-2); gap:6px; font-size:.8125rem; line-height:1.25;
    white-space:normal; text-wrap:balance;
  }
  html[data-refonte] .page-accueil .arrival-actions .btn svg { flex:none; width:16px; height:16px; }
  html[data-refonte] .page-accueil .near-shortcuts { align-items:stretch; row-gap:var(--e-2); column-gap:var(--e-2); }
  html[data-refonte] .page-accueil .paths { grid-template-columns:minmax(0, 1fr); gap:var(--e-3); margin-top:var(--e-5); }
  html[data-refonte] .page-accueil .path-card { padding:20px; }
  html[data-refonte] .page-accueil .path-card:hover { transform:none; }
  html[data-refonte] .page-accueil .host-band { grid-template-columns:minmax(0, 1fr); gap:var(--e-5); padding:var(--e-5) 20px; border-radius:var(--r-lg); }
  html[data-refonte] .page-accueil .host-band h2 { font-size:1.8125rem; }
  html[data-refonte] .page-accueil .host-band-texte p { font-size:.9375rem; }
  html[data-refonte] .page-accueil .host-band .btn { width:100%; }
  html[data-refonte] .page-accueil .host-steps { padding:var(--e-5) 0 0; border-left:0; border-top:1px solid rgba(255, 255, 255, .19); gap:var(--e-4); }
  html[data-refonte] .page-accueil .section-head { margin-bottom:var(--e-5); }
  html[data-refonte] .page-accueil .steps { grid-template-columns:minmax(0, 1fr); gap:var(--e-5); }
  html[data-refonte] .page-accueil .pro-panel { display:block; padding:var(--e-5) 20px; }
  html[data-refonte] .page-accueil .pro-actions { width:auto; margin-top:var(--e-4); }
  html[data-refonte] .page-accueil .faq { grid-template-columns:minmax(0, 1fr); gap:var(--e-5); }
}

@media (max-width:380px) {
  html[data-refonte] .page-accueil .arrival-actions .btn { padding-inline:6px; gap:var(--e-1); }
  html[data-refonte] .page-accueil .near-shortcuts > .envie { padding-inline:var(--e-2); }
}
@media (max-width:359px) {
  html[data-refonte] .page-accueil .arrival-actions { grid-template-columns:minmax(0, 1fr); }
}
@media (prefers-reduced-motion:reduce) {
  html[data-refonte] .page-accueil .path-card,
  html[data-refonte] .page-accueil .envie,
  html[data-refonte] .page-accueil .search,
  html[data-refonte] .page-accueil .faq summary,
  html[data-refonte] .page-accueil .faq .tgl::before,
  html[data-refonte] .page-accueil .faq .tgl::after { transition:none; }
  html[data-refonte] .page-accueil .path-card:hover { transform:none; }
}


/* ── 4. Scanner ──────────────────────────────────────────────────── */
html[data-refonte] .page-scan main { max-width:1150px; padding-bottom:var(--e-8); }
html[data-refonte] .page-scan .scan-intro { padding:var(--e-7) 0 var(--e-6); }
html[data-refonte] .page-scan .scan-intro h1 { margin:var(--e-3) 0; font-size:clamp(2.125rem, 4vw, 2.625rem); line-height:1.12; letter-spacing:-.045em; }
html[data-refonte] .page-scan .scan-intro p { max-width:66ch; color:var(--ink-3); font-size:1.0625rem; }
html[data-refonte] .page-scan .scan-layout {
  display:grid; grid-template-columns:minmax(0, 1.3fr) minmax(0, .7fr); gap:var(--e-7); align-items:start;
}
html[data-refonte] .page-scan .scanner-box {
  display:flex; flex-direction:column; align-items:center; gap:var(--e-5); padding:var(--e-6);
  border:1px solid var(--primary-soft-border); border-radius:var(--r-lg); background:var(--primary-soft); text-align:center;
}
/* Au repos : un repère et une phrase. Caméra ouverte : le cadre sombre et la visée. */
html[data-refonte] .page-scan .scanner {
  position:relative; display:flex; align-items:center; justify-content:center; width:100%; max-width:420px;
  border-radius:var(--r-lg); overflow:hidden;
}
html[data-refonte] .page-scan .scanner.live { aspect-ratio:1 / 1; background:var(--ink); }
html[data-refonte] .page-scan .scanner video { display:none; width:100%; height:100%; object-fit:cover; }
html[data-refonte] .page-scan .scanner.live video { display:block; }
html[data-refonte] .page-scan .placeholder { padding:var(--e-2) 0; color:var(--ink); font-size:1.5625rem; font-weight:600; letter-spacing:-.03em; line-height:1.2; }
html[data-refonte] .page-scan .placeholder svg { display:block; width:84px; height:84px; margin:0 auto var(--e-5); color:var(--primary-hover); }
html[data-refonte] .page-scan .scanner.live .placeholder { display:none; }
html[data-refonte] .page-scan .reticle {
  display:none; position:absolute; inset:18%; border-radius:18px; pointer-events:none;
  box-shadow:0 0 0 100vmax rgba(10, 15, 10, .35);
}
html[data-refonte] .page-scan .scanner.live .reticle { display:block; }
html[data-refonte] .page-scan .reticle::before,
html[data-refonte] .page-scan .reticle::after,
html[data-refonte] .page-scan .reticle > i::before,
html[data-refonte] .page-scan .reticle > i::after { content:''; position:absolute; width:26px; height:26px; border:3px solid #fff; }
html[data-refonte] .page-scan .reticle::before { top:0; left:0; border-right:0; border-bottom:0; border-top-left-radius:12px; }
html[data-refonte] .page-scan .reticle::after { top:0; right:0; border-left:0; border-bottom:0; border-top-right-radius:12px; }
html[data-refonte] .page-scan .reticle > i::before { bottom:0; left:0; border-right:0; border-top:0; border-bottom-left-radius:12px; }
html[data-refonte] .page-scan .reticle > i::after { bottom:0; right:0; border-left:0; border-top:0; border-bottom-right-radius:12px; }
html[data-refonte] .page-scan .scanner-box .btn { min-width:220px; }
/* « Arrêter » n'existe que caméra ouverte (le script ne pilote que son style en ligne). */
html[data-refonte] .page-scan .scanner:not(.live) ~ #stop { display:none; }
html[data-refonte] .page-scan .msg { display:none; width:100%; max-width:420px; padding:var(--e-3) var(--e-4); border-radius:var(--r-md); font-size:.9375rem; text-align:left; }
html[data-refonte] .page-scan .msg.show { display:block; }
html[data-refonte] .page-scan .msg.err { border:1px solid #E7BAA9; background:#FFF0EC; color:#8A2713; }
html[data-refonte] .page-scan .msg.ok { border:1px solid var(--primary-soft-border); background:var(--surface); color:var(--primary-hover); }

html[data-refonte] .page-scan .scanner-help { min-width:0; }
html[data-refonte] .page-scan .scanner-help h2 { margin-bottom:var(--e-3); font-size:1.3125rem; letter-spacing:-.025em; }
html[data-refonte] .page-scan .scanner-help details { border-bottom:1px solid var(--border); font-size:.9375rem; }
html[data-refonte] .page-scan .scanner-help summary { display:list-item; min-height:44px; padding-block:var(--e-3); font-weight:600; }
html[data-refonte] .page-scan .scanner-help summary:hover { color:var(--primary-hover); }
html[data-refonte] .page-scan .scanner-help details p { margin:0 0 var(--e-3); color:var(--ink-2); }
html[data-refonte] .page-scan .code-form { display:grid; gap:var(--e-2); margin-top:var(--e-5); }
html[data-refonte] .page-scan .code-form label { font-size:.9375rem; font-weight:600; }
html[data-refonte] .page-scan .code-form input {
  width:100%; min-width:0; min-height:48px; padding:var(--e-3);
  border:1px solid var(--border-fort); border-radius:var(--r-md); background:var(--surface); color:var(--ink);
  font-size:1.0625rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase;
  transition:border-color var(--transition);
}
html[data-refonte] .page-scan .code-form input:hover { border-color:var(--ink-3); }
html[data-refonte] .page-scan .code-form input::placeholder { color:var(--ink-3); font-weight:400; letter-spacing:normal; text-transform:none; opacity:1; }
html[data-refonte] .page-scan .code-hint { color:var(--ink-3); font-size:.8125rem; line-height:1.5; }
html[data-refonte] .page-scan .code-form .btn { margin-top:var(--e-2); }

@media (max-width:1050px) {
  html[data-refonte] .page-scan .scan-layout { gap:var(--e-6); }
}
@media (max-width:650px) {
  html[data-refonte] .page-scan main { padding-bottom:var(--e-7); }
  html[data-refonte] .page-scan .scan-intro { padding:var(--e-5) 0; }
  html[data-refonte] .page-scan .scan-intro p { font-size:.9375rem; }
  html[data-refonte] .page-scan .scan-layout { grid-template-columns:minmax(0, 1fr); gap:var(--e-5); }
  html[data-refonte] .page-scan .scanner-box { padding:var(--e-5) 20px; gap:var(--e-4); }
  html[data-refonte] .page-scan .scanner-box .btn { width:100%; min-width:0; }
  html[data-refonte] .page-scan .placeholder { font-size:1.3125rem; }
  html[data-refonte] .page-scan .placeholder svg { width:64px; height:64px; margin-bottom:var(--e-4); }
}


/* ── 5. Carte ────────────────────────────────────────────────────────
   Application plein écran : l'en-tête commun, puis la carte et son panneau.
   Les règles d'origine (résultats, fiche, « Mon voyage »…) viennent de
   refonte-public-carte.css ; ici, seulement la mise en place et l'habillage. */
html[data-refonte] body.page-carte { display:flex; flex-direction:column; }
html[data-refonte] .page-carte .site-header { flex:none; position:relative; z-index:700; }
html[data-refonte] .page-carte .carte-app { position:relative; flex:1 1 auto; min-height:0; }

/* Barre de recherche (l'ancien en-tête de la page). */
html[data-refonte] .page-carte .carte-barre { height:64px; padding-top:0; padding-bottom:0; gap:var(--e-3); }
html[data-refonte] .page-carte .carte-titre {
  position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0, 0, 0, 0); white-space:nowrap;
}
html[data-refonte] .page-carte .map-search { border-color:var(--border-fort); border-radius:var(--r-md); min-height:48px; padding:var(--e-1) var(--e-3); box-shadow:none; transition:border-color var(--transition); }
html[data-refonte] .page-carte .map-search:focus-within { border-color:var(--primary); box-shadow:0 0 0 3px var(--primary-soft); }
html[data-refonte] .page-carte .map-search input { min-height:44px; font-size:1rem; }
html[data-refonte] .page-carte .map-search input:focus-visible { outline:none; box-shadow:none; }
html[data-refonte] .page-carte .btn-geo {
  min-height:48px; padding:var(--e-3) var(--e-4); border:1px solid var(--border); border-radius:var(--r-md);
  background:var(--surface); color:var(--ink); font-size:.9375rem; box-shadow:none;
  transition:background-color var(--transition), border-color var(--transition);
}
html[data-refonte] .page-carte .btn-geo:hover { background:var(--bg-2); border-color:var(--border-fort); transform:none; }
html[data-refonte] .page-carte .btn-geo svg { color:var(--primary-hover); }

/* Panneau : titre, filtres, liste qui défile (avec le pied de page à la fin). */
html[data-refonte] .page-carte .sheet { max-height:calc(100% - 72px); }
html[data-refonte] .page-carte .sheet-header h2 { flex:none; font-size:1.1875rem; line-height:1.3; letter-spacing:-.025em; white-space:nowrap; }
html[data-refonte] .page-carte .sheet-header .count { min-width:0; text-align:right; }
html[data-refonte] .page-carte .sheet-header .count { color:var(--ink-3); }
html[data-refonte] .page-carte .sheet-defil { flex:1; min-height:0; overflow-y:auto; overscroll-behavior:contain; touch-action:pan-y; }
html[data-refonte] .page-carte .sheet-defil .results { flex:none; overflow:visible; padding-bottom:var(--e-4); }
html[data-refonte] .page-carte .trunc-banner {
  margin:var(--e-2) var(--e-4) 0; padding:var(--e-2) var(--e-3); border-radius:var(--r-sm);
  background:var(--primary-soft); color:var(--ink-2); font-size:.8125rem;
}
html[data-refonte] .page-carte .filter-chip {
  min-height:44px; border-color:var(--border); border-radius:999px; font-size:.875rem;
  transition:background-color var(--transition), border-color var(--transition), color var(--transition);
}
html[data-refonte] .page-carte .filter-chip:hover { border-color:var(--border-fort); }
html[data-refonte] .page-carte .filter-chip.active { background:var(--primary); border-color:var(--primary); color:#fff; }
html[data-refonte] .page-carte .filter-more > summary { min-height:44px; color:var(--primary-hover); }
html[data-refonte] .page-carte .filter-reset { min-height:44px; }
html[data-refonte] .page-carte .carte-classement { margin:0; padding:0 var(--e-4) var(--e-2); font-size:.8125rem; }
html[data-refonte] .page-carte .carte-classement a { display:inline-flex; align-items:center; min-height:44px; color:var(--primary-hover); font-weight:600; text-decoration:underline; text-underline-offset:4px; }

/* Pied commun, au bout de la liste : compact, sur deux colonnes. */
html[data-refonte] .page-carte .site-footer { margin-top:0; padding:var(--e-2) 0 var(--e-5); font-size:.8125rem; }
html[data-refonte] .page-carte .site-footer .wrap { flex-direction:column; align-items:stretch; gap:0; padding-inline:var(--e-4); }
html[data-refonte] .page-carte .site-footer nav { gap:0 var(--e-4); }
html[data-refonte] .page-carte .site-footer nav > * { flex:1 1 calc(50% - var(--e-2)); }

/* Distances : dire d'où elles partent tant que la position du visiteur n'est pas connue
   (public/js/refonte-public.js pose data-position="connue" sur <body>). */
html[data-refonte] .page-carte .carte-distances { margin:0; padding:var(--e-3) var(--e-4) 0; color:var(--ink-3); font-size:.8125rem; line-height:1.45; }
html[data-refonte] .page-carte[data-position="connue"] .carte-distances { display:none; }
html[data-refonte] .page-carte .row-fav { color:var(--accent-ink); }
/* Capacité inconnue : jamais de chiffre (un « 0 » se lirait « aucune place libre »). */
html[data-refonte] .page-carte .camp-row .dot.unknown { font-size:0; }
html[data-refonte] .page-carte .camp-row .dot.unknown::after { content:'?'; content:'?' / 'Capacité inconnue'; font-size:.9375rem; }
html[data-refonte] .page-carte .pin.unknown .body span { display:none; }
html[data-refonte] .page-carte .pin.unknown .body::after { content:'?'; content:'?' / 'Capacité inconnue'; color:#fff; }

/* Bulle : une croix de fermeture franche, facile à toucher. */
html[data-refonte] .page-carte .leaflet-popup-close-button {
  top:4px; right:4px; display:flex; align-items:center; justify-content:center; width:44px; height:44px; padding:0;
  border-radius:50%; background:var(--surface); color:var(--ink); font-size:1.5rem; font-weight:400; line-height:1; text-decoration:none;
  transition:background-color var(--transition);
}
html[data-refonte] .page-carte .leaflet-popup-close-button:hover { background:var(--bg-2); color:var(--ink); }
html[data-refonte] .page-carte .leaflet-popup-content .pop-name,
html[data-refonte] .page-carte .poi-card > :first-child { padding-right:36px; }

/* Bulle d'un camping TiKamp : bouton principal vert, actions en vrais boutons de 44 px. */
html[data-refonte] .page-carte .leaflet-popup-content a.pop-cta {
  min-height:48px; margin-top:var(--e-2); border-radius:var(--r-md); background:var(--primary); color:#fff;
  font-size:.9375rem; font-weight:600; transition:background-color var(--transition);
}
html[data-refonte] .page-carte .leaflet-popup-content a.pop-cta:hover { background:var(--primary-hover); color:#fff; }
html[data-refonte] .page-carte .leaflet-popup-content a.pop-cp {
  display:inline-flex !important; align-items:center; min-height:44px; margin:var(--e-2) var(--e-2) 0 0 !important; padding:0 var(--e-3);
  border:1px solid var(--border); border-radius:var(--r-md); background:var(--surface); color:var(--ink); font-size:.875rem; text-decoration:none;
  transition:background-color var(--transition), border-color var(--transition);
}
html[data-refonte] .page-carte .leaflet-popup-content a.pop-cp:hover { border-color:var(--border-fort); background:var(--bg-2); color:var(--ink); }
html[data-refonte] .page-carte .leaflet-popup-content .pop-cp { font-size:.8125rem; }
html[data-refonte] .page-carte .leaflet-popup-content .pop-dispo { font-size:.8125rem; }

html[data-refonte] .page-carte .sheet-header .count { font-size:.8125rem; }
/* Intertitre de la liste (« Dans cette zone ») : écrit par carte.js avec sa taille en ligne. */
html[data-refonte] .page-carte .results > div[style] { font-size:.8125rem !important; }
html[data-refonte] .page-carte .conditions .sep { color:var(--ink-3); }

/* Résultats : une ligne par lieu (repère, nom, favori, flèche sur la même ligne). */
html[data-refonte] .page-carte .camp-row {
  grid-template-columns:auto minmax(0, 1fr) auto auto; gap:var(--e-3); min-height:64px; padding:var(--e-3) var(--e-2);
  border-radius:var(--r-md); transition:background-color var(--transition);
}
html[data-refonte] .page-carte .camp-row:hover,
html[data-refonte] .page-carte .camp-row.active { background:var(--bg-2); }
html[data-refonte] .page-carte .camp-row .name { font-size:1rem; line-height:1.3; overflow-wrap:anywhere; }
html[data-refonte] .page-carte .camp-row .meta { font-size:.8125rem; line-height:1.4; }
html[data-refonte] .page-carte .camp-row .chev { color:var(--primary-hover); }
html[data-refonte] .page-carte .row-fav { min-width:44px; min-height:44px; }
html[data-refonte] .page-carte .results .empty { color:var(--ink-3); }

/* Bulle et fiche d'un lieu : boutons et liens aux couleurs du socle. */
html[data-refonte] .page-carte .poi-badge { font-family:var(--police-signal); font-weight:500; font-size:.8125rem; letter-spacing:.05em; }
html[data-refonte] .page-carte .poi-badge.aire { background:var(--accent-soft); color:var(--accent-ink); }
html[data-refonte] .page-carte .poi-card .poi-title { color:var(--ink); font-weight:600; font-size:1.125rem; line-height:1.25; }
html[data-refonte] .page-carte .poi-card .poi-loc,
html[data-refonte] .page-carte .poi-card .poi-src { color:var(--ink-3); }
html[data-refonte] .page-carte .poi-chip,
html[data-refonte] .page-carte .fiche-services .svc { border-color:var(--border); background:var(--bg); color:var(--ink-2); }
html[data-refonte] .page-carte .poi-card .poi-contacts a,
html[data-refonte] .page-carte .fiche-meta a { color:var(--primary-hover); text-decoration:underline; text-underline-offset:3px; }
html[data-refonte] .page-carte .poi-card .poi-contacts a:hover,
html[data-refonte] .page-carte .fiche-meta a:hover { color:var(--primary); }
html[data-refonte] .page-carte .poi-btn {
  min-height:48px; border-radius:var(--r-md);
  font-family:var(--police-texte); font-size:.9375rem; font-weight:600; letter-spacing:0; text-transform:none;
  transition:background-color var(--transition), border-color var(--transition);
}
html[data-refonte] .page-carte .poi-btn.primary { background:var(--primary); color:#fff; box-shadow:none; }
html[data-refonte] .page-carte .poi-btn.primary:hover { background:var(--primary-hover); transform:none; }
html[data-refonte] .page-carte .poi-btn.ghost { border:1px solid var(--border); background:var(--surface); color:var(--ink); }
html[data-refonte] .page-carte .poi-btn.ghost:hover { border-color:var(--border-fort); background:var(--bg-2); transform:none; }
html[data-refonte] .page-carte .leaflet-popup-content-wrapper { border-radius:var(--r-lg); }

html[data-refonte] .page-carte .fiche-overlay { background:rgba(7, 25, 15, .72); backdrop-filter:none; }
html[data-refonte] .page-carte .fiche { background:var(--bg); box-shadow:none; border-left:1px solid var(--border); }
html[data-refonte] .page-carte .fiche-head { background:var(--primary-hover); padding-bottom:var(--e-5); }
html[data-refonte] .page-carte .fiche-head::after { display:none; }
html[data-refonte] .page-carte .fiche-head h2 { padding-right:var(--e-7); font-size:1.6875rem; font-weight:600; line-height:1.14; letter-spacing:-.035em; }
html[data-refonte] .page-carte .fiche-body h3 { font-family:var(--police-signal); font-weight:500; font-size:.8125rem; letter-spacing:.11em; color:var(--primary-hover); }
html[data-refonte] .page-carte .fiche-body .desc { color:var(--ink-2); font-size:.9375rem; }
html[data-refonte] .page-carte .fiche-meta { color:var(--ink-2); font-size:.9375rem; }
html[data-refonte] .page-carte .fiche-meta .row .k { color:var(--ink-3); font-weight:400; }
html[data-refonte] .page-carte .fiche-actions { background:linear-gradient(to top, var(--bg) 62%, rgba(250, 250, 247, 0)); }

@media (min-width:900px) {
  html[data-refonte] .page-carte .carte-barre { height:72px; }
  html[data-refonte] .page-carte .sheet { top:72px; max-height:none; border-right-color:var(--border); box-shadow:none; }
  html[data-refonte] .page-carte .carte-titre {
    position:static; flex:none; width:calc(400px - 2.4rem); height:auto; margin:0; overflow:visible; clip:auto; white-space:normal;
    font-size:1.5rem; line-height:1.15; letter-spacing:-.035em;
  }
  html[data-refonte] .page-carte .carte-titre .eyebrow { margin-bottom:2px; font-size:.75rem; }
  html[data-refonte] .page-carte .leaflet-top.leaflet-right { top:72px; }
}
@media (max-width:899px) {
  /* Liste à mi-hauteur : le script lui donne 38 % de l'écran, trop peu sur un téléphone
     (titre et filtres seulement). On la remonte de 18 % de plus ; les boutons flottants suivent. */
  html[data-refonte] .page-carte .sheet[data-state="mid"] { transform:translateY(max(0px, calc(var(--sheet-y, 0px) - 18vh))); }
  html[data-refonte] .page-carte .carte-app:has(#sheet[data-state="mid"]) .fab { bottom:calc(var(--sheet-visible-px, 128px) + 18vh + 14px); }
  html[data-refonte] body.page-carte:has(#sheet[data-state="mid"]) #trip-fab { bottom:calc(18px + var(--sheet-visible-px, 0px) + 18vh + env(safe-area-inset-bottom)); }
}
@media (max-width:899px) {
  /* Liste ouverte en grand : les boutons de la carte et « Mon voyage » ne flottent plus
     par-dessus (ils reviennent dès que la liste redescend). */
  html[data-refonte] .page-carte .carte-app:has(#sheet[data-state="full"]) .leaflet-top,
  html[data-refonte] .page-carte .carte-app:has(#sheet[data-state="full"]) .fab,
  html[data-refonte] body.page-carte:has(#sheet[data-state="full"]) #trip-fab { visibility:hidden; }
}
@media (min-width:761px) and (max-width:899px) {
  /* Tablette : la mention des sources reste au-dessus de la liste, pas par-dessus. */
  html[data-refonte] .page-carte .leaflet-bottom.leaflet-right { bottom:var(--sheet-visible-px, 128px); z-index:450; }
}
@media (max-width:650px) {
  /* Téléphone : contrôles de la carte décollés du bord de l'écran. (Les pastilles de
     regroupement ne sont plus réduites ici : carte.js les écarte les unes des autres, et les
     réduire ramenait la cible sous 44 px et le chiffre sous 11 px.) */
  html[data-refonte] .page-carte .leaflet-right .leaflet-control { margin-right:var(--e-3); }
}
@media (max-width:760px) {
  /* Téléphone : la bulle d'un lieu occupe presque toute la carte ; la mention des sources
     de la carte (répétée dans la bulle) ne doit pas recouvrir son dernier bouton. */
  html[data-refonte] .page-carte .leaflet-container:has(.leaflet-popup) .leaflet-control-attribution { visibility:hidden; }
  /* Bulle ouverte : elle doit tenir entre la barre de recherche et la liste repliée, et rien
     ne doit la toucher ni la recouvrir (boutons de zoom, « Mon voyage », recentrage). */
  html[data-refonte] .page-carte .leaflet-container:has(.leaflet-popup) .leaflet-top { visibility:hidden; }
  html[data-refonte] .page-carte .carte-app:has(.leaflet-popup) .fab,
  html[data-refonte] body.page-carte:has(.leaflet-popup) #trip-fab { visibility:hidden; }
  html[data-refonte] .page-carte .leaflet-popup-content { max-height:calc(100dvh - 300px) !important; overflow-y:auto; overscroll-behavior:contain; }
  html[data-refonte] .page-carte .poi-card .poi-btn { min-height:44px; padding:var(--e-2); }
  /* Les actions restent visibles au bas de la bulle (le reste défile au-dessus) : sur deux
     rangées, « Itinéraire » et le dernier bouton (« Voir la fiche ») en premier. */
  html[data-refonte] .page-carte .poi-card .poi-actions {
    position:sticky; bottom:0; z-index:1; display:grid; grid-template-columns:minmax(0, 1fr) minmax(0, 1fr); gap:6px;
    padding-top:var(--e-2); background:var(--surface);
  }
  html[data-refonte] .page-carte .poi-card .poi-btn.primary { order:-2; }
  html[data-refonte] .page-carte .poi-card .poi-actions > :last-child:not(.primary) { order:-1; }
  html[data-refonte] .page-carte .poi-card .poi-src { margin-top:var(--e-1); }
  html[data-refonte] .page-carte .poi-card .poi-desc { -webkit-line-clamp:2; }
  /* Filtres : la rangée défile ; son bord droit s'estompe pour le montrer. */
  html[data-refonte] .page-carte .filter-row {
    padding-right:var(--e-6);
    -webkit-mask-image:linear-gradient(to right, #000 calc(100% - 40px), transparent);
    mask-image:linear-gradient(to right, #000 calc(100% - 40px), transparent);
  }
}
@media (max-width:680px) {
  /* « Mon voyage » : un bouton avec son nom, à la place de l'emoji seul dans un rond. */
  html[data-refonte] .page-carte #trip-fab,
  html[data-refonte] .page-carte #trip-fab.empty { width:auto; height:44px; padding:0 var(--e-4) !important; border-radius:999px !important; opacity:1; }
  html[data-refonte] .page-carte #trip-fab::before,
  html[data-refonte] .page-carte #trip-fab.empty::before { content:'Mon voyage'; font-size:.8125rem; font-weight:600; line-height:1; }
}
@media (max-width:359px) {
  html[data-refonte] .page-carte .map-search input::placeholder { font-size:.875rem; }
}
@media (max-width:650px) {
  html[data-refonte] .page-carte .sheet-header h2 { font-size:1.125rem; white-space:nowrap; }
}
@media (max-width:650px) {
  html[data-refonte] .page-carte .leaflet-top.leaflet-right { top:64px; }
  html[data-refonte] .page-carte .btn-geo { min-width:48px; padding:var(--e-3); }
}


/* ── 6. Annuaire, fiche d'un lieu, page introuvable ──────────────────
   Pages générées par le serveur (src/pages/campings.js). Leur feuille d'origine
   est reprise, bornée au contenu ; ici, l'accord avec le socle. */
html[data-refonte] .page-annuaire main.annuaire { padding:var(--e-6) 0 var(--e-8); }
html[data-refonte] .page-annuaire main.annuaire > .wrap { max-width:1150px; padding-inline:var(--gouttiere); }
html[data-refonte] .page-annuaire main.annuaire h1 { margin:var(--e-2) 0 var(--e-3); font-size:clamp(2.125rem, 4vw, 2.6875rem); line-height:1.1; letter-spacing:-.045em; font-weight:600; }
html[data-refonte] .page-annuaire main.annuaire h2 { letter-spacing:-.02em; font-weight:600; }
html[data-refonte] .page-annuaire main.annuaire .region h2 a { display:inline-flex; align-items:center; min-height:44px; color:var(--primary-hover); }
html[data-refonte] .page-annuaire main.annuaire .b { font-size:.8125rem; }
html[data-refonte] .page-annuaire main.annuaire p > a:only-child { display:inline-flex; align-items:center; min-height:44px; }
html[data-refonte] .page-annuaire main.annuaire .lead { color:var(--ink-3); font-size:1.0625rem; }
html[data-refonte] .page-annuaire main.annuaire .bc a { display:inline-flex; align-items:center; min-height:44px; text-decoration:underline; text-underline-offset:4px; }
html[data-refonte] .page-annuaire main.annuaire .cta { border-radius:var(--r-md); transition:background-color var(--transition), border-color var(--transition); }
html[data-refonte] .page-annuaire main.annuaire .cta.alt { border-color:var(--border); color:var(--ink); }
html[data-refonte] .page-annuaire main.annuaire .cta.alt:hover { border-color:var(--border-fort); background:var(--bg-2); }
html[data-refonte] .page-annuaire main.annuaire .dcard,
html[data-refonte] .page-annuaire main.annuaire .camp,
html[data-refonte] .page-annuaire main.annuaire .facts { border-radius:var(--r-md); box-shadow:none; }
html[data-refonte] .page-annuaire main.annuaire .dcard:hover { border-color:var(--border-fort); box-shadow:none; }
html[data-refonte] .page-annuaire main.annuaire .camp:hover { border-color:var(--border-fort); box-shadow:none; }
html[data-refonte] .page-annuaire main.annuaire input:focus-visible,
html[data-refonte] .page-annuaire main.annuaire button:focus-visible,
html[data-refonte] .page-annuaire main.annuaire a:focus-visible { outline:3px solid var(--accent); outline-offset:2px; box-shadow:0 0 0 2px var(--ink); }

/* Page introuvable */
html[data-refonte] .page-annuaire .introuvable { max-width:900px; padding-block:var(--e-6) var(--e-7); }
html[data-refonte] .page-annuaire .introuvable h1 { margin-block:var(--e-4); }
html[data-refonte] .page-annuaire .introuvable .lead { margin:0; max-width:60ch; }
html[data-refonte] .page-annuaire .introuvable-suite { display:flex; flex-wrap:wrap; gap:var(--e-3); margin-top:var(--e-6); }
html[data-refonte] .page-annuaire .introuvable-suite .btn-primary { color:#fff; }
html[data-refonte] .page-annuaire .introuvable-suite .btn-light { color:var(--ink); }
@media (max-width:650px) {
  html[data-refonte] .page-annuaire main.annuaire { padding:var(--e-5) 0 var(--e-7); }
  html[data-refonte] .page-annuaire .introuvable-suite { flex-direction:column; }
}


/* ── 7. Accès : connexion ────────────────────────────────────────── */
html[data-refonte] .page-acces main.acces { max-width:1150px; padding-block:var(--e-6) var(--e-8); }
html[data-refonte] .page-acces .auth-role-tabs { display:flex; flex-wrap:wrap; gap:var(--e-2); }
html[data-refonte] .page-acces .auth-role-tabs .btn { min-height:44px; padding-block:var(--e-2); }
html[data-refonte] .page-acces .auth-role-tabs .current-page-label { color:#fff; cursor:default; }
html[data-refonte] .page-acces .form-intro { padding-block:var(--e-6) var(--e-5); }
html[data-refonte] .page-acces .form-intro h1 { margin-top:var(--e-3); font-size:clamp(2.125rem, 4vw, 2.6875rem); line-height:1.1; letter-spacing:-.045em; }
html[data-refonte] .page-acces .public-form-layout {
  display:grid; grid-template-columns:minmax(0, 1.2fr) minmax(0, .8fr); gap:var(--e-6); align-items:start;
}
html[data-refonte] .page-acces .public-form { display:grid; gap:var(--e-3); }
html[data-refonte] .page-acces .public-form form { display:grid; gap:var(--e-2); }
html[data-refonte] .page-acces .form-lead { color:var(--ink-2); }
html[data-refonte] .page-acces .public-field { font-size:.9375rem; font-weight:600; }
html[data-refonte] .page-acces .public-form input[type="email"] {
  width:100%; min-width:0; min-height:48px; padding:var(--e-3);
  border:1px solid var(--border-fort); border-radius:var(--r-md); background:var(--surface); color:var(--ink);
  transition:border-color var(--transition);
}
html[data-refonte] .page-acces .public-form input[type="email"]:hover { border-color:var(--ink-3); }
html[data-refonte] .page-acces .public-form input::placeholder { color:var(--ink-3); opacity:1; }
html[data-refonte] .page-acces .public-form .btn { margin-top:var(--e-2); justify-self:start; }
html[data-refonte] .page-acces .public-form .btn[disabled] { opacity:.6; cursor:progress; }
html[data-refonte] .page-acces .field-help { color:var(--ink-3); font-size:.875rem; }
html[data-refonte] .page-acces .msg { font-size:.9375rem; }
html[data-refonte] .page-acces .msg:empty { display:none; }
html[data-refonte] .page-acces .msg.ok { padding:var(--e-3) var(--e-4); border:1px solid var(--primary-soft-border); border-radius:var(--r-md); background:var(--primary-soft); color:var(--primary-hover); }
html[data-refonte] .page-acces .msg.err { padding:var(--e-3) var(--e-4); border:1px solid #E7BAA9; border-radius:var(--r-md); background:#FFF0EC; color:#8A2713; }
html[data-refonte] .page-acces .acces-jeton { justify-items:start; }
html[data-refonte] .page-acces .acces-jeton h2 { font-size:1.5625rem; }
html[data-refonte] .page-acces .acces-jeton p { color:var(--ink-2); }
html[data-refonte] .page-acces .mark {
  align-items:center; justify-content:center; width:52px; height:52px; border-radius:50%;
  background:var(--primary-soft); color:var(--primary-hover); font-size:1.5rem; font-weight:700;
}
html[data-refonte] .page-acces .spinner {
  width:28px; height:28px; border:3px solid var(--border); border-top-color:var(--primary); border-radius:50%;
  animation:tk-refonte-tourne .8s linear infinite;
}
@keyframes tk-refonte-tourne { to { transform:rotate(360deg); } }
html[data-refonte] .page-acces .public-side-note {
  padding:var(--e-5); border:1px solid var(--primary-soft-border); border-radius:var(--r-lg); background:var(--primary-soft);
}
html[data-refonte] .page-acces .public-side-note h2 { font-size:1.3125rem; letter-spacing:-.025em; }
html[data-refonte] .page-acces .public-side-note p { margin:var(--e-2) 0 var(--e-4); color:var(--ink-2); }
/* Lien reçu par e-mail : seule la carte de connexion compte. */
html[data-refonte] .page-acces .public-form-layout:has(#demander-card[style*="none"]) .public-side-note { display:none; }
@media (max-width:760px) {
  html[data-refonte] .page-acces main.acces { padding-block:var(--e-5) var(--e-7); }
  html[data-refonte] .page-acces .form-intro { padding-block:var(--e-5) var(--e-4); }
  html[data-refonte] .page-acces .public-form-layout { grid-template-columns:minmax(0, 1fr); gap:var(--e-5); }
  html[data-refonte] .page-acces .public-form .btn { justify-self:stretch; }
  html[data-refonte] .page-acces .auth-role-tabs .btn { flex:1; }
}
@media (prefers-reduced-motion:reduce) {
  html[data-refonte] .page-acces .spinner { animation-duration:2.4s; }
}


/* ── 8. Pages de présentation ────────────────────────────────────── */
html[data-refonte] .page-vitrine main.vitrine { padding-block:var(--e-7) var(--e-8); }
html[data-refonte] .page-vitrine .public-hero {
  display:grid; grid-template-columns:minmax(0, 1.1fr) minmax(0, .9fr); gap:var(--e-7); align-items:center;
}
html[data-refonte] .page-vitrine .public-hero h1 { margin-block:var(--e-4); }
html[data-refonte] .page-vitrine .public-hero-texte > p { max-width:520px; color:var(--ink-3); font-size:1.1875rem; }
html[data-refonte] .page-vitrine .public-hero-actions { display:flex; flex-wrap:wrap; gap:var(--e-3); margin-top:var(--e-5); }
html[data-refonte] .page-vitrine .public-hero-photo {
  display:block; width:100%; height:420px; border-radius:28px; object-fit:cover; background:#DCE7D4;
}
html[data-refonte] .page-vitrine .stat-band {
  display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:var(--e-5); margin-top:var(--e-7); padding-block:var(--e-5);
  border-block:1px solid var(--border);
}
html[data-refonte] .page-vitrine .stat-band .n { display:block; color:var(--primary-hover); font:500 2rem/1.2 var(--police-signal); letter-spacing:.02em; }
html[data-refonte] .page-vitrine .stat-band .l { display:block; margin-top:var(--e-1); color:var(--ink-3); font-size:.875rem; }
html[data-refonte] .page-vitrine .public-features {
  display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:var(--e-4); margin:var(--e-7) 0 0; padding:0; list-style:none;
}
html[data-refonte] .page-vitrine .public-features.two { grid-template-columns:repeat(2, minmax(0, 1fr)); margin-top:var(--e-5); }
html[data-refonte] .page-vitrine .public-features .card h2,
html[data-refonte] .page-vitrine .public-features .card h3 { font-size:1.3125rem; line-height:1.3; letter-spacing:-.025em; }
html[data-refonte] .page-vitrine .public-features .card p { margin-top:var(--e-2); color:var(--ink-3); font-size:.9375rem; }
html[data-refonte] .page-vitrine .public-host-band {
  display:flex; align-items:center; justify-content:space-between; gap:var(--e-6); margin-top:var(--e-7); padding:var(--e-6);
  border:1px solid var(--primary-soft-border); border-radius:var(--r-lg); background:var(--primary-soft);
}
html[data-refonte] .page-vitrine .public-host-band h2 { margin:var(--e-3) 0 var(--e-2); }
html[data-refonte] .page-vitrine .public-host-band p { max-width:560px; color:var(--ink-2); }
html[data-refonte] .page-vitrine .public-host-band .btn { flex:none; }
html[data-refonte] .page-vitrine .public-audiences { padding-bottom:0; }
html[data-refonte] .page-vitrine .section-copy { max-width:70ch; margin-top:var(--e-3); color:var(--ink-3); }
html[data-refonte] .page-vitrine .section-copy a { color:var(--primary-hover); font-weight:600; }
html[data-refonte] .page-vitrine .audience-link {
  display:block; text-decoration:none;
  transition:border-color var(--transition), transform var(--transition);
}
html[data-refonte] .page-vitrine .audience-link:hover { border-color:var(--border-fort); transform:translateY(-2px); }
html[data-refonte] .page-vitrine .audience-link > span { display:inline-flex; align-items:center; min-height:44px; margin-top:var(--e-2); color:var(--primary-hover); font-size:.9375rem; font-weight:600; text-decoration:underline; text-underline-offset:4px; }
html[data-refonte] .page-vitrine .audience-link:focus-visible { border-radius:var(--r-lg); }

@media (max-width:1050px) {
  html[data-refonte] .page-vitrine .public-hero { gap:var(--e-5); }
  html[data-refonte] .page-vitrine .public-hero h1 { font-size:3rem; }
  html[data-refonte] .page-vitrine .public-hero-texte > p { font-size:1rem; }
  html[data-refonte] .page-vitrine .public-hero-photo { height:380px; }
  html[data-refonte] .page-vitrine .public-features { grid-template-columns:minmax(0, 1fr); }
  html[data-refonte] .page-vitrine .public-features.two { grid-template-columns:repeat(2, minmax(0, 1fr)); }
}
@media (max-width:650px) {
  html[data-refonte] .page-vitrine main.vitrine { padding-block:var(--e-5) var(--e-7); }
  html[data-refonte] .page-vitrine .public-hero { grid-template-columns:minmax(0, 1fr); gap:var(--e-5); }
  html[data-refonte] .page-vitrine .public-hero h1 { margin-block:var(--e-3); font-size:2.5rem; }
  html[data-refonte] .page-vitrine .public-hero-actions .btn { flex:1 1 100%; }
  html[data-refonte] .page-vitrine .public-hero-photo { height:200px; border-radius:var(--r-lg); }
  html[data-refonte] .page-vitrine .stat-band { grid-template-columns:minmax(0, 1fr); gap:var(--e-4); margin-top:var(--e-6); }
  html[data-refonte] .page-vitrine .public-features,
  html[data-refonte] .page-vitrine .public-features.two { grid-template-columns:minmax(0, 1fr); gap:var(--e-3); margin-top:var(--e-6); }
  html[data-refonte] .page-vitrine .public-host-band { flex-direction:column; align-items:stretch; gap:var(--e-4); margin-top:var(--e-6); padding:var(--e-5) 20px; }
  html[data-refonte] .page-vitrine .audience-link:hover { transform:none; }
}
@media (prefers-reduced-motion:reduce) {
  html[data-refonte] .page-vitrine .audience-link { transition:none; }
  html[data-refonte] .page-vitrine .audience-link:hover { transform:none; }
}


/* ── 9. Aide et guide PayFiP ─────────────────────────────────────────
   Contenu et fonctionnement d'origine (refonte-public-aide*.css) ; ici, l'accord avec le socle. */
html[data-refonte] body.page-aide,
html[data-refonte] body.page-aide-payfip { font-family:var(--police-texte); font-size:1rem; line-height:1.55; }
html[data-refonte] .page-aide main.origine { max-width:860px; padding:var(--e-6) var(--gouttiere) var(--e-8); }
html[data-refonte] .page-aide main.origine .o-entete.top { padding:0; border:0; background:none; }
html[data-refonte] .page-aide main.origine .back-link {
  display:inline-flex; align-items:center; min-height:44px; color:var(--primary-hover); font-size:.875rem; font-weight:600;
  text-decoration:underline; text-underline-offset:4px;
}
html[data-refonte] .page-aide main.origine h1 { margin:var(--e-3) 0; font-size:clamp(2.125rem, 4vw, 2.6875rem); line-height:1.1; letter-spacing:-.045em; font-weight:600; }
html[data-refonte] .page-aide main.origine .lead { color:var(--ink-3); font-size:1.0625rem; }
html[data-refonte] .page-aide main.origine .liens-rapides a { min-height:44px; }
html[data-refonte] .page-aide main.origine a.btn,
html[data-refonte] .page-aide main.origine .rep-liens a { min-height:44px; }

html[data-refonte] .page-aide-payfip main.origine .wrap { max-width:900px; padding:var(--e-5) var(--gouttiere) var(--e-8); }
html[data-refonte] .page-aide-payfip main.origine .crumb a { display:inline-flex; align-items:center; min-height:44px; color:var(--primary-hover); font-weight:600; text-decoration:underline; text-underline-offset:4px; }
html[data-refonte] .page-aide-payfip main.origine .o-entete.hd { padding:var(--e-6); border-radius:var(--r-lg); background:var(--primary-hover); }
html[data-refonte] .page-aide-payfip main.origine .o-entete.hd .eyebrow { color:#B5DFBC; }
html[data-refonte] .page-aide-payfip main.origine .o-entete.hd h1 { margin:var(--e-3) 0 var(--e-2); font-size:clamp(2rem, 4vw, 2.6875rem); line-height:1.1; letter-spacing:-.045em; font-weight:600; }
html[data-refonte] .page-aide-payfip main.origine .o-entete.hd p { color:#D4E8D8; opacity:1; font-size:1.0625rem; }
html[data-refonte] .page-aide-payfip main.origine .toc strong { font-size:.8125rem; }
html[data-refonte] .page-aide-payfip main.origine .toc a { display:inline-flex; align-items:center; min-height:44px; }
html[data-refonte] .page-aide-payfip main.origine summary { display:list-item; min-height:44px; padding-block:var(--e-3); }
html[data-refonte] .page-aide-payfip main.origine a.btn { min-height:48px; border-radius:var(--r-md); }
@media (max-width:650px) {
  html[data-refonte] .page-aide main.origine { padding-top:var(--e-4); }
  html[data-refonte] .page-aide-payfip main.origine .o-entete.hd { padding:var(--e-5) 20px; }
}


/* ── 10. Offres : communes, associations ─────────────────────────────
   Contenu, tarifs, formulaire de contact et démonstration d'origine
   (refonte-public-communes.css / -associations.css) ; ici, l'accord avec le socle. */
html[data-refonte] body.page-offre { font-family:var(--police-texte); }
html[data-refonte] .page-offre main.origine .hero { padding:var(--e-8) var(--gouttiere); }
html[data-refonte] .page-offre main.origine .hero .eyebrow { color:#fff; font-size:.9375rem; letter-spacing:.11em; opacity:1; }
html[data-refonte] .page-offre main.origine h1 { font-size:clamp(2.375rem, 4.5vw, 4.25rem); line-height:1.04; letter-spacing:-.055em; font-weight:600; }
html[data-refonte] .page-offre main.origine h2 { letter-spacing:-.035em; font-weight:600; }
html[data-refonte] .page-offre main.origine .btn,
html[data-refonte] .page-offre main.origine .tarif-cta {
  min-height:48px; border-radius:var(--r-md);
  font-family:var(--police-texte); font-size:1rem; font-weight:600; letter-spacing:0; text-transform:none;
  transition:background-color var(--transition), border-color var(--transition), color var(--transition);
}
html[data-refonte] .page-offre main.origine .btn.primary { box-shadow:none; }
html[data-refonte] .page-offre main.origine .btn.primary:hover { transform:none; }
html[data-refonte] .page-offre main.origine .link-quiet { min-height:48px; font-family:var(--police-texte); font-weight:600; }
html[data-refonte] .page-offre main.origine form input,
html[data-refonte] .page-offre main.origine form select { min-height:48px; }
html[data-refonte] .page-offre main.origine form input,
html[data-refonte] .page-offre main.origine form select,
html[data-refonte] .page-offre main.origine form textarea { border-radius:var(--r-md); font-family:var(--police-texte); font-size:1rem; }
html[data-refonte] .page-offre main.origine .modal-overlay .btn { min-height:44px; }
html[data-refonte] .page-offre main.origine .pm-tag { font-size:.8125rem; }
html[data-refonte] .page-offre main.origine .reassure a { display:inline-flex; align-items:center; min-height:44px; }
html[data-refonte] .page-offre main.origine .tt-devis a { display:inline-flex; align-items:center; min-height:44px; }
/* Pictogrammes au trait (à la place des emoji de la page d'origine). */
html[data-refonte] .page-offre main.origine .ico,
html[data-refonte] .page-aide-payfip main.origine .ico { flex:none; width:1.2em; height:1.2em; vertical-align:-.22em; color:var(--primary-hover); }
html[data-refonte] .page-offre main.origine .modal-icon .ico { width:40px; height:40px; }
html[data-refonte] .page-offre main.origine .pm-icon .ico { width:26px; height:26px; }
html[data-refonte] .page-aide-payfip main.origine a.btn .ico { color:inherit; }
@media (max-width:360px) {
  html[data-refonte] .page-offre main.origine .tarif-table td.tt-prix { white-space:normal; }
}
@media (max-width:760px) {
  /* Liste de garanties : la coche à gauche, le texte et son lien à la suite sur les mêmes lignes. */
  html[data-refonte] .page-offre main.origine .reassure span { display:block; position:relative; min-height:0; padding:var(--e-2) 0 var(--e-2) var(--e-5); }
  html[data-refonte] .page-offre main.origine .reassure span::before { position:absolute; left:0; }
  html[data-refonte] .page-offre main.origine .reassure a { display:inline-flex; align-items:center; min-height:44px; }
}
@media (max-width:650px) {
  html[data-refonte] .page-offre main.origine .hero { padding:var(--e-6) var(--gouttiere) var(--e-7); }
  html[data-refonte] .page-offre main.origine h1 { font-size:2.5rem; }
}


/* ── 11. Inscriptions : camping, hôte ────────────────────────────────
   Formulaires, étapes et scripts d'origine (refonte-public-signup.css,
   refonte-public-devenir-hote.css) ; ici, l'accord avec le socle. */
html[data-refonte] body.page-inscription,
html[data-refonte] body.page-devenir-hote { font-family:var(--police-texte); }

html[data-refonte] .page-inscription main.origine { max-width:720px; margin:0 auto; padding:var(--e-6) var(--gouttiere) var(--e-8); }
/* « .header-inner » est aussi le nom d'un bloc de l'en-tête commun : ici c'est un simple bloc de texte. */
html[data-refonte] .page-inscription main.origine .header-inner { display:block; min-height:0; max-width:none; }
html[data-refonte] .page-inscription main.origine .o-entete { padding:0 0 var(--e-5); background:none; overflow:visible; }
html[data-refonte] .page-inscription main.origine .o-entete::after { display:none; }
html[data-refonte] .page-inscription main.origine .o-entete h1 { max-width:none; margin:var(--e-3) 0; font-size:clamp(2.125rem, 4vw, 2.6875rem); line-height:1.1; letter-spacing:-.045em; }
html[data-refonte] .page-inscription main.origine .o-entete p.sub { max-width:60ch; color:var(--ink-3); font-size:1.0625rem; }
html[data-refonte] .page-inscription main.origine .card { border-radius:var(--r-lg); box-shadow:none; }
html[data-refonte] .page-inscription main.origine legend { font-size:.8125rem; }
html[data-refonte] .page-inscription main.origine form input,
html[data-refonte] .page-inscription main.origine form select { min-height:48px; border-radius:var(--r-md); font-size:1rem; }
html[data-refonte] .page-inscription main.origine form button[type="submit"] { min-height:48px; border-radius:var(--r-md); font-family:var(--police-texte); font-weight:600; }

html[data-refonte] .page-devenir-hote main.origine { max-width:720px; padding:var(--e-6) var(--gouttiere) var(--e-8); }
html[data-refonte] .page-devenir-hote main.origine h1 { margin:var(--e-3) 0; font-size:clamp(2.125rem, 4vw, 2.6875rem); line-height:1.1; letter-spacing:-.045em; font-weight:600; }
html[data-refonte] .page-devenir-hote main.origine .sub { max-width:62ch; margin-bottom:var(--e-4); color:var(--ink-3); font-size:1.0625rem; }
html[data-refonte] .page-devenir-hote main.origine .grille-hote > summary { display:list-item; min-height:44px; padding-block:var(--e-2); }
html[data-refonte] .page-devenir-hote main.origine .card { border-radius:var(--r-lg); box-shadow:none; }
html[data-refonte] .page-devenir-hote main.origine .step-label { font-size:.8125rem; }
/* Aperçu de fin : le bandeau de photo prend toute la largeur de la carte. */
html[data-refonte] .page-devenir-hote main.origine .fiche-preview .fp-photo { width:100%; height:140px; aspect-ratio:auto; }
@media (max-width:650px) {
  html[data-refonte] .page-inscription main.origine,
  html[data-refonte] .page-devenir-hote main.origine { padding-top:var(--e-5); padding-bottom:var(--e-7); }
}


/* ── 12. Contact ─────────────────────────────────────────────────────
   Formulaire et script d'origine (refonte-public-contact.css, public/js/contact.js) ;
   ici, l'accord avec le socle. */
html[data-refonte] body.page-contact { font-family:var(--police-texte); font-size:1rem; line-height:1.55; }
html[data-refonte] .page-contact main.origine { max-width:860px; padding:var(--e-6) var(--gouttiere) var(--e-8); }
html[data-refonte] .page-contact main.origine .o-entete.top { padding:0; border:0; background:none; }
html[data-refonte] .page-contact main.origine .back-link {
  display:inline-flex; align-items:center; min-height:44px; color:var(--primary-hover); font-size:.875rem; font-weight:600;
  text-decoration:underline; text-underline-offset:4px;
}
html[data-refonte] .page-contact main.origine h1 { margin:var(--e-3) 0; font-size:clamp(2.125rem, 4vw, 2.6875rem); line-height:1.1; letter-spacing:-.045em; font-weight:600; }
html[data-refonte] .page-contact main.origine .lead { color:var(--ink-3); font-size:1.0625rem; }
html[data-refonte] .page-contact main.origine .carte { border-radius:var(--r-lg); box-shadow:none; }
html[data-refonte] .page-contact main.origine .champ input,
html[data-refonte] .page-contact main.origine .champ select,
html[data-refonte] .page-contact main.origine .champ textarea { border-radius:var(--r-md); font-size:1rem; }
html[data-refonte] .page-contact main.origine .btn { min-height:48px; border-radius:var(--r-md); font-weight:600; }
html[data-refonte] .page-contact main.origine .autre a,
html[data-refonte] .page-contact main.origine .note a { display:inline-flex; align-items:center; min-height:44px; }
@media (max-width:650px) {
  html[data-refonte] .page-contact main.origine { padding-top:var(--e-4); padding-bottom:var(--e-7); }
}

/* ── 13. Tarifs (body.page-tarifs) — par-dessus sa feuille d'origine ── */
html[data-refonte] body.page-tarifs { font-family:var(--police-texte); font-size:1rem; line-height:1.55; }
html[data-refonte] .page-tarifs main.origine { max-width:1180px; padding:var(--e-6) var(--gouttiere) var(--e-8); }
html[data-refonte] .page-tarifs main.origine .o-entete.top { padding:0; border:0; background:none; }
html[data-refonte] .page-tarifs main.origine .back-link {
  display:inline-flex; align-items:center; min-height:44px; color:var(--primary-hover); font-size:.875rem; font-weight:600;
  text-decoration:underline; text-underline-offset:4px;
}
html[data-refonte] .page-tarifs main.origine h1 { margin:var(--e-3) 0; font-size:clamp(2.125rem, 4vw, 2.6875rem); line-height:1.1; letter-spacing:-.045em; font-weight:600; }
html[data-refonte] .page-tarifs main.origine h2 { font-size:clamp(1.5rem, 2.6vw, 1.875rem); line-height:1.2; letter-spacing:-.03em; font-weight:600; }
html[data-refonte] .page-tarifs main.origine .devis h2 { color:#fff; }
html[data-refonte] .page-tarifs main.origine .lead { color:var(--ink-3); font-size:1.0625rem; }
html[data-refonte] .page-tarifs main.origine .bloc-tete p { color:var(--ink-3); }
html[data-refonte] .page-tarifs main.origine .tg-cadre,
html[data-refonte] .page-tarifs main.origine .regles,
html[data-refonte] .page-tarifs main.origine .carte { border-radius:var(--r-lg); box-shadow:none; }
html[data-refonte] .page-tarifs main.origine .devis { border-radius:var(--r-lg); }
html[data-refonte] .page-tarifs main.origine .champ input[type="text"],
html[data-refonte] .page-tarifs main.origine .champ select,
html[data-refonte] .page-tarifs main.origine .mode label,
html[data-refonte] .page-tarifs main.origine .groupe { border-radius:var(--r-md); }
html[data-refonte] .page-tarifs main.origine .champ input[type="text"],
html[data-refonte] .page-tarifs main.origine .champ select { font-size:1rem; }
html[data-refonte] .page-tarifs main.origine .btn { min-height:48px; border-radius:var(--r-md); font-weight:600; }
html[data-refonte] .page-tarifs main.origine .tg-detail a,
html[data-refonte] .page-tarifs main.origine .regles a,
html[data-refonte] .page-tarifs main.origine .faq a { display:inline-flex; align-items:center; min-height:44px; color:var(--primary-hover); }
@media (max-width:860px) {
  html[data-refonte] .page-tarifs main.origine .tg-cadre { border-radius:0; }
  html[data-refonte] .page-tarifs main.origine .tg tbody tr { border-radius:var(--r-lg); }
}
@media (max-width:650px) {
  html[data-refonte] .page-tarifs main.origine { padding:var(--e-4) var(--e-4) var(--e-7); }
}