/* Sentiers des Cirques — design "signalétique de sentier"
   Palette : forêt de Bélouve / balise GR / brume des Hauts */
:root{
  --foret:#22382C;
  --fougere:#3E6B4F;
  --anis:#9DB94C;
  --brume:#F1F3EC;
  --terre:#4A3E32;
  --gr-rouge:#C8372D;
  --ambre:#D9A441;
  --blanc:#FFFFFF;
  --ombre:0 2px 12px rgba(34,56,44,.10);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:'Public Sans',system-ui,sans-serif;
  background:var(--brume);
  color:var(--terre);
  line-height:1.6;
}
.display{font-family:'Barlow Condensed',sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--foret)}
.mono{font-family:'IBM Plex Mono',monospace;font-size:.72rem;letter-spacing:.08em;text-transform:uppercase}

/* Balise GR : la signature du site */
.blaze{display:inline-block;width:22px;height:14px;border-radius:2px;overflow:hidden;flex:0 0 auto;box-shadow:inset 0 0 0 1px rgba(0,0,0,.08)}
.blaze::before{content:"";display:block;height:7px;background:var(--blanc)}
.blaze::after{content:"";display:block;height:7px;background:var(--gr-rouge)}

a{color:var(--fougere)}
img{max-width:100%;display:block}

/* ---------- Header ---------- */
header.site{
  background:var(--foret);
  color:var(--brume);
  padding:0.9rem 1.2rem;
  display:flex;align-items:center;gap:.8rem;flex-wrap:wrap;
  position:sticky;top:0;z-index:50;
}
header.site .logo{display:flex;align-items:center;gap:.6rem;text-decoration:none}
header.site .logo span{font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:1.35rem;text-transform:uppercase;letter-spacing:.06em;color:var(--brume)}
header.site nav{margin-left:auto;display:flex;gap:1.1rem;flex-wrap:wrap}
header.site nav a{color:var(--brume);text-decoration:none;font-size:.92rem;opacity:.92}
header.site nav a:hover,header.site nav a:focus-visible{color:var(--anis);opacity:1}
header.site nav a.cta{background:var(--ambre);color:var(--foret);padding:.35rem .8rem;border-radius:4px;font-weight:600}
:focus-visible{outline:3px solid var(--anis);outline-offset:2px}

/* ---------- Hero ---------- */
.hero{
  background:var(--foret) url("img/contours.svg") center/cover no-repeat;
  color:var(--brume);
  padding:4.2rem 1.2rem 4.6rem;
  text-align:center;
}
.hero h1{font-family:'Barlow Condensed',sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:.05em;font-size:clamp(2.2rem,6vw,3.6rem);line-height:1.05;color:var(--blanc)}
.hero h1 em{font-style:normal;color:var(--anis)}
.hero p.sub{max-width:38rem;margin:1rem auto 0;font-size:1.05rem;opacity:.92}
.hero .mono{color:var(--anis);display:flex;align-items:center;justify-content:center;gap:.6rem;margin-bottom:1.1rem}

/* ---------- Recherche ---------- */
.searchbox{max-width:44rem;margin:2rem auto 0;display:flex;gap:.5rem;flex-wrap:wrap;justify-content:center}
.searchbox input,.searchbox select{
  font:inherit;padding:.85rem 1rem;border:2px solid var(--fougere);border-radius:6px;background:var(--blanc);color:var(--terre);
}
.searchbox input{flex:1 1 16rem}
.searchbox select{flex:0 1 auto}
.searchbox input::placeholder{color:#8a8377}

/* ---------- Sections ---------- */
main{max-width:72rem;margin:0 auto;padding:0 1.2rem}
section{margin:3rem 0}
h2.display{font-size:1.9rem;margin-bottom:.35rem;display:flex;align-items:center;gap:.7rem}
.section-sub{color:#6b6154;margin-bottom:1.4rem}

/* ---------- Cartes cirques ---------- */
.cirques{display:grid;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));gap:1.2rem}
.cirque-card{background:var(--blanc);border-radius:10px;overflow:hidden;box-shadow:var(--ombre);text-decoration:none;color:inherit;display:flex;flex-direction:column;transition:transform .15s ease}
.cirque-card:hover{transform:translateY(-3px)}
.cirque-card .body{padding:1.1rem 1.2rem 1.3rem}
.cirque-card h3{font-family:'Barlow Condensed',sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:.05em;font-size:1.5rem;color:var(--foret)}
.cirque-card p{font-size:.92rem;color:#6b6154;margin-top:.3rem}
.cirque-card .mono{color:var(--fougere);margin-top:.7rem;display:block}

/* ---------- Grille de gîtes ---------- */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(16.5rem,1fr));gap:1.2rem}
.card{background:var(--blanc);border-radius:10px;overflow:hidden;box-shadow:var(--ombre);display:flex;flex-direction:column;position:relative;transition:transform .15s ease}
.card:hover{transform:translateY(-3px)}
.card.featured{border:2px solid var(--ambre)}
.badge{position:absolute;top:.7rem;left:.7rem;background:var(--ambre);color:var(--foret);font-weight:700;font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;padding:.25rem .6rem;border-radius:4px;z-index:2}
.card .body{padding:1rem 1.1rem 1.2rem;display:flex;flex-direction:column;gap:.45rem;flex:1}
.card h3{font-family:'Barlow Condensed',sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:.04em;font-size:1.28rem;line-height:1.15}
.card h3 a{color:var(--foret);text-decoration:none}
.card h3 a:hover{color:var(--fougere)}
.card .meta{display:flex;align-items:center;gap:.55rem;color:var(--fougere)}
.card .desc{font-size:.9rem;color:#6b6154;flex:1}
.card .foot{display:flex;justify-content:space-between;align-items:center;margin-top:.4rem}
.tag{font-size:.72rem;background:var(--brume);color:var(--fougere);border:1px solid var(--fougere);border-radius:99px;padding:.15rem .6rem}
.card .lien{font-weight:600;font-size:.9rem;text-decoration:none;color:var(--gr-rouge)}
.card .lien:hover{text-decoration:underline}

/* ---------- Fiche ---------- */
.fiche{background:var(--blanc);border-radius:12px;box-shadow:var(--ombre);overflow:hidden;margin-top:2rem}
.fiche .photo{position:relative}
.fiche .photo .badge{top:1rem;left:1rem}
.fiche .contenu{padding:1.6rem;display:grid;gap:1.6rem;grid-template-columns:1fr}
@media(min-width:760px){.fiche .contenu{grid-template-columns:1.5fr 1fr}}
.fiche h1{font-family:'Barlow Condensed',sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:.04em;font-size:2rem;color:var(--foret);line-height:1.1}
.fiche .meta{display:flex;align-items:center;gap:.6rem;color:var(--fougere);margin:.5rem 0 1rem}
.fiche .desc{color:#59503f}
.infos{background:var(--brume);border-radius:10px;padding:1.2rem}
.infos h2{font-size:1.2rem;margin-bottom:.7rem}
.infos dl{display:grid;gap:.55rem}
.infos dt{font-family:'IBM Plex Mono',monospace;font-size:.68rem;letter-spacing:.08em;text-transform:uppercase;color:var(--fougere)}
.infos dd{margin-bottom:.35rem}
.btn{display:inline-block;background:var(--gr-rouge);color:var(--blanc);font-weight:600;text-decoration:none;padding:.7rem 1.2rem;border-radius:6px;border:none;font:inherit;font-weight:600;cursor:pointer}
.btn:hover{background:#a72c24}
.btn.vert{background:var(--fougere)}.btn.vert:hover{background:var(--foret)}
.btn.ambre{background:var(--ambre);color:var(--foret)}.btn.ambre:hover{background:#c08f2f}
.note{font-size:.8rem;color:#8a8377;margin-top:.6rem}

/* ---------- Bandeau partenaire ---------- */
.bandeau{background:var(--foret);color:var(--brume);border-radius:12px;padding:2rem;display:flex;gap:1.5rem;align-items:center;flex-wrap:wrap;justify-content:space-between}
.bandeau h2{font-family:'Barlow Condensed',sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:.05em;font-size:1.7rem;color:var(--blanc)}
.bandeau p{opacity:.9;max-width:34rem}

/* ---------- Formulaire partenaire ---------- */
.form-card{background:var(--blanc);border-radius:12px;box-shadow:var(--ombre);padding:1.8rem;max-width:34rem}
.form-card label{display:block;font-weight:600;margin:.9rem 0 .3rem;color:var(--foret)}
.form-card input,.form-card select{width:100%;font:inherit;padding:.7rem .9rem;border:2px solid var(--fougere);border-radius:6px;background:var(--blanc)}
.prix{display:flex;align-items:baseline;gap:.4rem;margin:1.2rem 0 .2rem}
.prix strong{font-family:'Barlow Condensed',sans-serif;font-size:2.6rem;font-weight:700;color:var(--foret)}
.avantages{margin:1rem 0 0;padding-left:1.2rem;color:#59503f}
.avantages li{margin:.3rem 0}
.msg-erreur{color:var(--gr-rouge);font-size:.9rem;margin-top:.8rem;display:none}

/* ---------- Footer ---------- */
footer.site{background:var(--foret);color:var(--brume);margin-top:4rem;padding:2.2rem 1.2rem;font-size:.88rem}
footer.site .inner{max-width:72rem;margin:0 auto;display:flex;justify-content:space-between;gap:1.5rem;flex-wrap:wrap;align-items:center}
footer.site a{color:var(--anis);text-decoration:none}
footer.site a:hover{text-decoration:underline}

.empty{padding:2rem;text-align:center;color:#8a8377;display:none}

@media (prefers-reduced-motion:reduce){
  *{transition:none!important;scroll-behavior:auto}
}

/* ---------- Disponibilités ---------- */
.dispo-chips{display:flex;gap:.4rem;flex-wrap:wrap;margin-bottom:.3rem}
.jour{font-size:.78rem;background:var(--blanc);border:1.5px solid var(--fougere);border-radius:6px;padding:.25rem .55rem;color:var(--terre)}
.jour b{font-family:'IBM Plex Mono',monospace;font-size:.66rem;text-transform:uppercase;letter-spacing:.05em;color:var(--fougere);display:block}
.jour.libre{border-color:var(--anis);background:#f4f8e8}
.jour.complet{border-color:var(--gr-rouge);color:var(--gr-rouge)}

/* ---------- Formules partenaire ---------- */
.formules{display:flex;gap:.7rem;margin:.4rem 0 .8rem}
.formule{flex:1;border:2px solid var(--fougere);border-radius:8px;padding:.7rem;text-align:center;cursor:pointer;display:block}
.formule input{position:absolute;opacity:0}
.formule:has(input:checked){border-color:var(--ambre);background:#fdf6e7;box-shadow:0 0 0 1px var(--ambre)}
.formule strong{font-family:'Barlow Condensed',sans-serif;font-size:1.6rem;color:var(--foret)}
.formule small{color:#6b6154}

/* ---------- Formulaires 2 colonnes + page maj ---------- */
.deux-col{display:grid;gap:.2rem 1rem;grid-template-columns:1fr 1fr}
@media(max-width:560px){.deux-col{grid-template-columns:1fr}}
.maj-ligne{display:flex;justify-content:space-between;align-items:center;padding:.8rem 0;border-bottom:1px solid #e2e0d5}
.maj-ligne:last-child{border-bottom:none}
.maj-boutons{display:flex;align-items:center;gap:.5rem}
.maj-boutons .btn{padding:.45rem .85rem;font-size:1.1rem;line-height:1}
.maj-n{font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:1.7rem;min-width:2.2rem;text-align:center;color:var(--foret)}
.complet-btn{background:var(--gr-rouge);color:var(--blanc);font-size:.8rem!important}
.galerie{display:grid;grid-template-columns:repeat(auto-fill,minmax(8rem,1fr));gap:.6rem;margin-top:1rem}
.galerie img{border-radius:8px;aspect-ratio:4/3;object-fit:cover}

/* ---------- Carte Leaflet ---------- */
.carte-wrap{margin:.5rem 0 1.5rem}
.carte{height:420px;border-radius:12px;box-shadow:var(--ombre);z-index:1}
@media(max-width:560px){.carte{height:320px}}
.carte-legende{font-size:.82rem;color:#6b6154;margin-top:.6rem;display:flex;align-items:center;gap:.4rem;flex-wrap:wrap}
.carte-legende span{display:inline-flex;align-items:center;gap:.3rem}
.pin-part::before,.pin-std::before,.pin-approx::before{content:"";width:.85rem;height:.85rem;border-radius:50% 50% 50% 0;transform:rotate(-45deg);display:inline-block;border:2px solid #fff;box-shadow:0 1px 3px rgba(0,0,0,.3)}
.pin-part::before{background:var(--ambre)}
.pin-std::before{background:var(--fougere)}
.pin-approx::before{background:var(--fougere);opacity:.45}
/* Marqueurs personnalisés */
.gite-pin{width:20px;height:20px;border-radius:50% 50% 50% 0;transform:rotate(-45deg);border:2px solid #fff;box-shadow:0 2px 5px rgba(0,0,0,.35)}
.gite-pin.part{background:var(--ambre)}
.gite-pin.std{background:var(--fougere)}
.gite-pin.approx{opacity:.5}
.leaflet-popup-content{font-family:'Public Sans',sans-serif;margin:.7rem .9rem}
.leaflet-popup-content b{font-family:'Barlow Condensed',sans-serif;font-size:1.1rem;text-transform:uppercase;letter-spacing:.03em;color:var(--foret)}
.leaflet-popup-content a{color:var(--gr-rouge);font-weight:600;text-decoration:none}
.leaflet-popup-content .approx-note{color:#8a8377;font-size:.78rem;font-style:italic}

/* ---------- Photo d'en-tête de cirque (CC BY-SA) ---------- */
.hero-photo{margin:0 0 1.4rem;border-radius:12px;overflow:hidden;box-shadow:var(--ombre)}
.hero-photo img{width:100%;height:clamp(200px,34vw,380px);object-fit:cover;display:block}
.hero-photo figcaption{font-size:.76rem;color:#6b6154;padding:.5rem .8rem;background:var(--blanc);text-align:right}
.hero-photo figcaption a{color:var(--fougere);text-decoration:none}
.hero-photo figcaption a:hover{text-decoration:underline}

/* Limite de cirque dans la légende de carte */
.pin-limite::before{content:"";width:1.1rem;height:0;border-top:2.5px dashed var(--gr-rouge);display:inline-block;vertical-align:middle}

/* Marqueurs de points d'intérêt (école, église, commerce) sur les cartes d'îlets */
.poi-pin{width:24px;height:24px;display:flex;align-items:center;justify-content:center;
  background:var(--blanc);border:2px solid var(--fougere);border-radius:50%;font-size:13px;
  box-shadow:0 1px 4px rgba(0,0,0,.3)}
.pin-poi::before{content:"🏫";font-size:.9rem;vertical-align:middle}