/* ===========================================================
   Parc Naturel de Zorofla — Jardin de la Mère de Dieu (JDM)
   Design system — d'après la charte graphique fournie (juillet 2026)
   Typos de substitution libres : Oswald (~ Phenomena) / Poppins (~ Nexa)
   =========================================================== */

:root{
  --vert-foret:#1B4D3E;
  --vert-emeraude:#2D7D5A;
  --mauve:#6B4E8C;
  --or:#C9A84C;
  --creme:#F8F3E8;
  --texte:#1F2A24;
  --gris:#6b7269;
  --radius:14px;
  --ombre:0 10px 30px rgba(27,77,62,.12);
  --font-title:'Oswald', sans-serif;
  --font-body:'Poppins', sans-serif;
  --header-h:76px;
}

*,*::before,*::after{box-sizing:border-box;}
[hidden]{display:none !important;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:var(--font-body);
  color:var(--texte);
  background:var(--creme);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
ul{list-style:none;margin:0;padding:0;}
h1,h2,h3,h4{
  font-family:var(--font-title);
  color:var(--vert-foret);
  text-transform:uppercase;
  letter-spacing:.02em;
  line-height:1.15;
  margin:0 0 .5em;
}
h1{font-size:clamp(2.2rem,5vw,3.6rem);}
h2{font-size:clamp(1.6rem,3.2vw,2.4rem);}
h3{font-size:1.25rem;}
p{margin:0 0 1em;}
.container{width:100%;max-width:1180px;margin:0 auto;padding:0 24px;}
.section{padding:72px 0;}
.section-alt{background:#fff;}
.section-dark{background:var(--vert-foret);color:var(--creme);}
.section-dark h2,.section-dark h3{color:var(--creme);}
.eyebrow{
  font-family:var(--font-title);
  color:var(--vert-emeraude);
  text-transform:uppercase;
  letter-spacing:.15em;
  font-size:.8rem;
  margin-bottom:.6em;
  display:block;
}
.lead{font-size:1.1rem;color:var(--gris);max-width:640px;}
.center{text-align:center;margin-left:auto;margin-right:auto;}

/* Buttons */
.btn{
  display:inline-flex;align-items:center;gap:8px;
  font-family:var(--font-title);text-transform:uppercase;letter-spacing:.05em;
  padding:14px 28px;border-radius:999px;border:2px solid transparent;
  cursor:pointer;font-size:.95rem;transition:.2s ease;
}
.btn-primary{background:var(--or);color:var(--vert-foret);}
.btn-primary:hover{background:#dfc06a;transform:translateY(-2px);}
.btn-outline{border-color:var(--creme);color:var(--creme);background:transparent;}
.btn-outline:hover{background:rgba(248,243,232,.15);}
.btn-secondary{background:var(--vert-foret);color:var(--creme);}
.btn-secondary:hover{background:var(--vert-emeraude);}
.btn-block{width:100%;justify-content:center;}
.btn[disabled]{opacity:.45;cursor:not-allowed;}

/* Alert banner */
.alert-bar{
  background:var(--mauve);color:#fff;text-align:center;
  font-size:.85rem;padding:8px 16px;position:relative;
  display:flex;align-items:center;justify-content:center;gap:10px;
}
.alert-bar button{background:none;border:none;color:#fff;opacity:.8;cursor:pointer;font-size:1rem;position:absolute;right:16px;}
.alert-bar[hidden]{display:none;}

/* Header */
header.site-header{
  position:sticky;top:0;z-index:100;background:rgba(248,243,232,.96);
  backdrop-filter:blur(6px);border-bottom:1px solid rgba(27,77,62,.08);
}
.nav-wrap{
  display:flex;align-items:center;justify-content:space-between;
  height:var(--header-h);max-width:1280px;margin:0 auto;padding:0 20px;gap:16px;
}
.brand{display:flex;align-items:center;gap:10px;font-family:var(--font-title);color:var(--vert-foret);}
.brand img{width:42px;height:42px;}
.brand .brand-name{line-height:1.05;text-transform:uppercase;font-size:.95rem;}
.brand .brand-name small{display:block;font-size:.55rem;letter-spacing:.12em;color:var(--vert-emeraude);font-weight:400;}

nav.primary-nav{display:flex;align-items:center;gap:2px;}
nav.primary-nav > ul{display:flex;align-items:center;}
.nav-item{position:relative;}
.nav-item > a, .nav-item > button.nav-toplink{
  font-family:var(--font-title);font-size:.82rem;text-transform:uppercase;
  letter-spacing:.04em;padding:10px 12px;display:inline-block;
  background:none;border:none;cursor:pointer;color:var(--texte);
}
.nav-item > a:hover, .nav-item:hover > button.nav-toplink{color:var(--vert-emeraude);}
.dropdown{
  position:absolute;top:100%;left:0;background:#fff;min-width:240px;
  box-shadow:var(--ombre);border-radius:10px;padding:8px;opacity:0;
  visibility:hidden;transform:translateY(6px);transition:.15s ease;
}
.nav-item:hover .dropdown, .nav-item:focus-within .dropdown{opacity:1;visibility:visible;transform:translateY(0);}
.dropdown a{display:block;padding:9px 12px;border-radius:6px;font-size:.88rem;}
.dropdown a:hover{background:var(--creme);color:var(--vert-foret);}

.header-actions{display:flex;align-items:center;gap:14px;}
.lang-toggle{display:flex;border:1px solid var(--vert-foret);border-radius:999px;overflow:hidden;font-family:var(--font-title);font-size:.75rem;}
.lang-toggle button{border:none;background:none;padding:6px 12px;cursor:pointer;color:var(--vert-foret);}
.lang-toggle button.active{background:var(--vert-foret);color:#fff;}
.btn-reserver{
  font-family:var(--font-title);text-transform:uppercase;letter-spacing:.05em;
  background:var(--or);color:var(--vert-foret);padding:11px 22px;border-radius:999px;font-size:.85rem;
}
.btn-reserver:hover{background:#dfc06a;}
.burger{display:none;background:none;border:none;font-size:1.6rem;color:var(--vert-foret);cursor:pointer;}

@media (max-width:960px){
  nav.primary-nav{
    position:fixed;inset:var(--header-h) 0 0 0;background:var(--creme);
    padding:20px;overflow-y:auto;transform:translateX(100%);transition:.25s ease;
  }
  nav.primary-nav.open{transform:translateX(0);}
  nav.primary-nav > ul{flex-direction:column;align-items:stretch;gap:4px;width:100%;}
  .dropdown{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;display:none;padding-left:12px;}
  .nav-item.open .dropdown{display:block;}
  .burger{display:block;}
  .header-actions .lang-toggle{display:none;}
}

/* Hero */
.hero{
  position:relative;min-height:88vh;display:flex;align-items:flex-end;
  background:linear-gradient(160deg,#0f3327,var(--vert-foret) 55%,var(--vert-emeraude));
  color:#fff;overflow:hidden;
}
.hero-carousel{position:absolute;inset:0;z-index:0;}
.hero-carousel-slide{
  position:absolute;inset:0;background-size:cover;background-position:center;
  opacity:0;transition:opacity 1.8s ease-in-out;
}
.hero-carousel-slide.is-active{opacity:1;}
.hero::before{
  content:"";position:absolute;inset:0;z-index:1;
  background:
    radial-gradient(circle at 15% 20%, rgba(45,125,90,.5), transparent 40%),
    radial-gradient(circle at 85% 75%, rgba(107,78,140,.35), transparent 45%),
    linear-gradient(180deg, rgba(15,51,39,.35), rgba(15,51,39,.85) 78%);
}
.hero::after{
  content:"";position:absolute;inset:0;z-index:1;opacity:.12;pointer-events:none;
  background-image:url('leaf-pattern.svg');background-size:340px;
}
.hero-inner{position:relative;z-index:2;padding:80px 0;max-width:760px;}
.hero .eyebrow{color:var(--or);}
.hero h1{color:#fff;}
.hero-actions{display:flex;gap:16px;flex-wrap:wrap;margin-top:28px;}

/* Impact counters */
.counters{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;text-align:center;}
.counter-item .num{font-family:var(--font-title);font-size:2.4rem;color:var(--or);}
.counter-item .label{font-size:.85rem;color:var(--creme);opacity:.85;text-transform:uppercase;letter-spacing:.05em;}
.counters.on-light .num{color:var(--vert-foret);}
.counters.on-light .label{color:var(--gris);opacity:1;}
@media (max-width:760px){.counters{grid-template-columns:repeat(2,1fr);}}

/* Cards / grids */
.grid{display:grid;gap:28px;}
.grid-3{grid-template-columns:repeat(3,1fr);}
.grid-4{grid-template-columns:repeat(4,1fr);}
.grid-2{grid-template-columns:repeat(2,1fr);}
@media (max-width:960px){.grid-3,.grid-4{grid-template-columns:repeat(2,1fr);}}
@media (max-width:620px){.grid-3,.grid-4,.grid-2{grid-template-columns:1fr;}}

.card{background:#fff;border-radius:var(--radius);overflow:hidden;box-shadow:var(--ombre);transition:.2s ease;display:flex;flex-direction:column;}
.card:hover{transform:translateY(-4px);}
.card .card-media{height:170px;background:linear-gradient(135deg,var(--vert-emeraude),var(--vert-foret));display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.6);font-size:2rem;}
.card .card-body{padding:20px 22px 24px;flex:1;display:flex;flex-direction:column;}
.card .tag{font-family:var(--font-title);font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;color:var(--vert-emeraude);margin-bottom:6px;}
.card p{color:var(--gris);font-size:.92rem;flex:1;}
.card .card-foot{margin-top:12px;font-family:var(--font-title);font-size:.8rem;color:var(--vert-foret);text-transform:uppercase;letter-spacing:.04em;}

.saviez-vous{
  background:var(--creme);border-left:4px solid var(--or);border-radius:10px;
  padding:18px 22px;margin:28px 0;font-size:.95rem;
}
.saviez-vous strong{color:var(--vert-foret);font-family:var(--font-title);text-transform:uppercase;letter-spacing:.03em;display:block;margin-bottom:4px;}

/* Anchor sub-nav for rubrique pages */
.subnav{position:sticky;top:var(--header-h);z-index:40;background:var(--vert-foret);}
.subnav ul{display:flex;overflow-x:auto;max-width:1180px;margin:0 auto;padding:0 24px;}
.subnav a{white-space:nowrap;color:var(--creme);opacity:.75;font-family:var(--font-title);font-size:.78rem;text-transform:uppercase;letter-spacing:.04em;padding:14px 16px;display:inline-block;}
.subnav a:hover,.subnav a.active{opacity:1;border-bottom:2px solid var(--or);}

.page-hero{
  padding:64px 0 40px;background:linear-gradient(180deg,var(--vert-foret),var(--vert-emeraude));color:#fff;text-align:center;
}
.page-hero h1{color:#fff;}
.page-hero p{color:rgba(248,243,232,.85);max-width:640px;margin:0 auto;}

/* Filters */
.filters{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:32px;}
.filter-chip{
  border:1px solid var(--vert-foret);color:var(--vert-foret);background:#fff;
  border-radius:999px;padding:8px 18px;font-size:.85rem;cursor:pointer;font-family:var(--font-title);
  text-transform:uppercase;letter-spacing:.03em;
}
.filter-chip.active,.filter-chip:hover{background:var(--vert-foret);color:#fff;}

/* Forms */
.form-field{margin-bottom:18px;}
.form-field label{display:block;font-family:var(--font-title);font-size:.8rem;text-transform:uppercase;letter-spacing:.04em;color:var(--vert-foret);margin-bottom:6px;}
.form-field input,.form-field select,.form-field textarea{
  width:100%;padding:12px 14px;border:1px solid #d8d2c2;border-radius:8px;
  font-family:var(--font-body);font-size:.95rem;background:#fff;color:var(--texte);
}
.form-field input:focus,.form-field select:focus,.form-field textarea:focus{outline:2px solid var(--vert-emeraude);border-color:transparent;}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:18px;}
@media (max-width:620px){.form-row{grid-template-columns:1fr;}}
.form-note{font-size:.8rem;color:var(--gris);}
.form-success{background:#fff;border:2px solid var(--vert-emeraude);border-radius:var(--radius);padding:32px;text-align:center;}

/* Reservation wizard */
.wizard{max-width:780px;margin:0 auto;background:#fff;border-radius:var(--radius);box-shadow:var(--ombre);padding:36px;}
.wizard-steps{display:flex;justify-content:space-between;margin-bottom:36px;counter-reset:step;}
.wizard-steps li{flex:1;text-align:center;position:relative;font-family:var(--font-title);font-size:.7rem;text-transform:uppercase;letter-spacing:.03em;color:var(--gris);}
.wizard-steps li::before{
  counter-increment:step;content:counter(step);display:block;width:32px;height:32px;line-height:32px;
  border-radius:50%;background:#e8e2d0;color:var(--vert-foret);margin:0 auto 6px;font-family:var(--font-body);font-weight:600;
}
.wizard-steps li.active::before,.wizard-steps li.done::before{background:var(--vert-foret);color:#fff;}
.wizard-steps li.active{color:var(--vert-foret);}
.wizard-panel{display:none;}
.wizard-panel.active{display:block;}
.option-card{border:1px solid #e2ddca;border-radius:10px;padding:16px 18px;margin-bottom:12px;display:flex;align-items:center;gap:14px;cursor:pointer;}
.option-card input{margin:0;}
.option-card.selected{border-color:var(--vert-emeraude);background:#f2f7f2;}
.wizard-actions{display:flex;justify-content:space-between;margin-top:28px;}
.recap-list{list-style:none;padding:0;}
.recap-list li{display:flex;justify-content:space-between;padding:10px 0;border-bottom:1px dashed #e2ddca;font-size:.92rem;}
.recap-list li span:first-child{color:var(--gris);}

/* Newsletter */
.newsletter-box{background:var(--vert-foret);color:#fff;border-radius:var(--radius);padding:40px;text-align:center;}
.newsletter-form{display:flex;gap:12px;max-width:440px;margin:20px auto 0;}
.newsletter-form input{flex:1;padding:12px 16px;border-radius:999px;border:none;}
@media(max-width:520px){.newsletter-form{flex-direction:column;}}

/* Footer */
footer.site-footer{background:var(--vert-foret);color:rgba(248,243,232,.85);padding:56px 0 24px;font-size:.9rem;}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px;margin-bottom:36px;}
.footer-grid h4{color:var(--creme);font-size:.85rem;letter-spacing:.06em;}
.footer-grid a{display:block;padding:4px 0;opacity:.8;}
.footer-grid a:hover{opacity:1;color:var(--or);}
.footer-bottom{border-top:1px solid rgba(248,243,232,.15);padding-top:20px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;font-size:.78rem;opacity:.75;}
@media (max-width:820px){.footer-grid{grid-template-columns:1fr 1fr;}}

/* Utility */
.mt-0{margin-top:0;}
.text-center{text-align:center;}
.badge{display:inline-block;background:var(--vert-emeraude);color:#fff;font-size:.7rem;padding:4px 10px;border-radius:999px;font-family:var(--font-title);letter-spacing:.04em;text-transform:uppercase;}
.skip-link{position:absolute;left:-9999px;top:0;background:var(--vert-foret);color:#fff;padding:10px 16px;z-index:200;}
.skip-link:focus{left:12px;top:12px;}
[data-lang="en"]{display:none !important;}
html[lang="en"] [data-lang="fr"]{display:none !important;}
html[lang="en"] [data-lang="en"]{display:inline !important;}
html[lang="en"] [data-lang="en"].block{display:block !important;}
html[lang="en"] h1[data-lang="en"],
html[lang="en"] h2[data-lang="en"],
html[lang="en"] h3[data-lang="en"],
html[lang="en"] h4[data-lang="en"],
html[lang="en"] p[data-lang="en"],
html[lang="en"] div[data-lang="en"],
html[lang="en"] label[data-lang="en"],
html[lang="en"] .eyebrow[data-lang="en"],
html[lang="en"] .form-note[data-lang="en"]{display:block !important;}
html[lang="en"] li[data-lang="en"]{display:list-item !important;}
html[lang="en"] option[data-lang="en"]{display:block !important;}


/* === Correctif migration jmd-zorofla.com (01/10/2026) ===
   Le menu mobile hors-écran (translateX) créait un défilement horizontal
   sur smartphone. overflow-x:clip ne crée pas de conteneur de défilement
   (n'affecte pas position:sticky). Retour arrière : supprimer ce bloc. */
html, body { overflow-x: clip; }

/* === Logo officiel (FINAL-06 en-tête, FINAL-07 pied de page) — 01/10/2026 ===
   Retour arrière : supprimer ce bloc et restaurer partials.js. */
.brand img.brand-logo { width: auto; height: 54px; }
.brand img.brand-logo-footer { width: auto; height: 64px; }
@media (max-width: 600px) { .brand img.brand-logo { height: 44px; } }