:root{
  --marine:#27392d; --nuit:#141e17; --laiton:#b58a3c; --laiton-fonce:#86641f; --or-clair:#e3c887;
  --lien:#2c6a47; --fond:#f8f5ee; --brume:#efeadf; --ligne:#ddd5c4;
  --encre:#212721; --acier:#5c6558; --blanc:#fff; --rayon:6px;
  --serif:"Iowan Old Style","Palatino Linotype",Palatino,"Book Antiqua",Georgia,serif;
  --sans:"Manrope","Segoe UI",system-ui,-apple-system,Roboto,Helvetica,Arial,sans-serif;
}
@font-face{font-family:"Manrope";font-style:normal;font-weight:200 800;font-display:swap;src:url(../assets/fonts/manrope-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Manrope";font-style:normal;font-weight:200 800;font-display:swap;src:url(../assets/fonts/manrope-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font:400 1rem/1.65 var(--sans);color:var(--encre);background:var(--fond);-webkit-font-smoothing:antialiased}
p,li{max-width:72ch}
img,video{max-width:100%;height:auto;display:block}
a{color:var(--lien)}
a:hover{color:var(--marine)}
:focus-visible{outline:3px solid var(--lien);outline-offset:3px}
.skip{position:absolute;left:-999px;top:0;background:var(--marine);color:#fff;padding:.6rem 1rem;z-index:100}
.skip:focus{left:0}
.wrap{max-width:1100px;margin:0 auto;padding:0 1.25rem}

/* en-tête */
.site-header{background:var(--blanc);border-bottom:1px solid var(--ligne);border-top:4px solid var(--marine);position:sticky;top:0;z-index:50}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:64px;max-width:1240px}
.logo{white-space:nowrap;font:700 1.3rem var(--serif);letter-spacing:-.02em;color:var(--marine);text-decoration:none}
.logo span{color:var(--laiton-fonce)}
nav ul{list-style:none;display:flex;gap:.25rem 1.1rem;margin:0;padding:0}
nav a{white-space:nowrap;text-decoration:none;color:var(--encre);font-weight:600;font-size:.92rem;padding:.4rem .1rem;border-bottom:2px solid transparent}
nav a:hover,nav a[aria-current="page"]{border-color:var(--laiton);color:var(--marine)}

/* héros */
.hero{background:var(--nuit);color:#d5e0ea;padding:3rem 0 3.5rem}
.hero .wrap{display:grid;gap:2.5rem;grid-template-columns:1fr;align-items:center}
@media(min-width:860px){.hero .wrap{grid-template-columns:1.15fr .85fr}}
h1,h2,h3{font-family:var(--serif);line-height:1.15;color:var(--marine);letter-spacing:-.01em;font-weight:700}
h1{font-size:clamp(1.9rem,4.5vw,3rem);margin:.2em 0 .4em}
h2{font-size:clamp(1.5rem,3vw,2rem);margin:1.6em 0 .6em}
h3{font-size:1.2rem;margin:1.4em 0 .5em}
h2:first-child,h3:first-child,.wrap>h2:first-child{margin-top:0}

.surtitre{font-size:1.2rem;font-weight:700;color:var(--laiton-fonce);margin:0 0 .6rem;padding-left:.9rem;border-left:4px solid var(--laiton)}
@media(min-width:700px){.surtitre{font-size:1.45rem}}
.hero h1{color:#fff}.hero .surtitre{color:var(--or-clair)}.hero .chapo{color:#b9c9d8}
.hero .btn.sec{color:#fff;border-color:rgba(255,255,255,.6)}.hero .btn.sec:hover{background:#fff;color:var(--nuit);border-color:#fff}
.chapo{font-size:1.12rem;color:var(--acier)}
.btn{display:inline-block;background:var(--laiton);color:var(--nuit);text-decoration:none;padding:.85rem 1.5rem;border-radius:var(--rayon);font-weight:700;border:2px solid var(--laiton);transition:background .15s,color .15s}
.btn:hover{background:var(--or-clair);border-color:var(--or-clair);color:var(--nuit)}
.btn.sec{background:transparent;color:var(--marine);border-color:var(--marine)}
.btn.sec:hover{background:var(--marine);border-color:var(--marine);color:#fff}
.actions{display:flex;gap:.8rem;flex-wrap:wrap;margin-top:1.4rem}

/* vidéos */
.cadre-portrait{max-width:340px;margin:0 auto;border-radius:12px;overflow:hidden;box-shadow:0 18px 40px rgba(0,0,0,.45);background:#000;position:relative}
.cadre-portrait video{width:100%;aspect-ratio:624/1104;object-fit:cover}
.video-large{border-radius:var(--rayon);overflow:hidden;box-shadow:0 12px 30px rgba(12,28,43,.18);background:#000}
.video-large video{width:100%;aspect-ratio:16/9}
.video-portrait-fond{position:relative;border-radius:var(--rayon);overflow:hidden;background:#111;display:flex;justify-content:center}
.video-portrait-fond video{max-height:80vh;width:auto;aspect-ratio:624/1104}
.legende{font-size:.9rem;color:var(--acier);margin:.5rem 0 0}
.son{position:absolute;right:.7rem;bottom:.7rem;background:rgba(0,0,0,.6);color:#fff;border:0;border-radius:var(--rayon);padding:.4rem .9rem;font:600 .85rem var(--sans);cursor:pointer}

/* sections */
section{padding:3rem 0}
section.alt{background:var(--blanc)}
.grille{display:grid;gap:1.5rem;grid-template-columns:repeat(auto-fit,minmax(235px,1fr))}
.carte{background:var(--blanc);border:1px solid var(--ligne);border-radius:var(--rayon);overflow:hidden;text-decoration:none;color:inherit;display:block;transition:border-color .15s}
.carte:hover{border-color:var(--marine);color:inherit}
.carte img{aspect-ratio:16/10;object-fit:cover;width:100%}
.carte div{padding:1rem 1.2rem 1.3rem}
.carte h3{margin:.1em 0 .3em}
.fiche{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin:0;padding:0;list-style:none}

.fiche li{background:var(--brume);border:1px solid var(--ligne);border-top:3px solid var(--marine);border-radius:var(--rayon);padding:1rem 1.2rem}
.fiche b{display:block;font-size:.88rem;font-weight:700;color:var(--acier);margin-bottom:.15rem}
@media(max-width:700px){.fiche{grid-template-columns:1fr}}
.galerie{display:grid;gap:.8rem;grid-template-columns:repeat(auto-fill,minmax(230px,1fr))}
.galerie a{display:block;border-radius:var(--rayon);overflow:hidden}
.galerie img{aspect-ratio:4/3;object-fit:cover;width:100%;transition:transform .3s}
.galerie a:hover img{transform:scale(1.04)}
.fil{font-size:.9rem;padding:1rem 0 0;color:var(--acier)}
.fil a{color:var(--acier)}

/* emplacements à compléter (visibles tant que le contenu n'est pas fourni) */
.todo{background:#fff3c4;border:2px dashed #c9a100;border-radius:8px;padding:.7rem 1rem;color:#5a4a00;font-size:.95rem}
.todo::before{content:"À COMPLÉTER — ";font-weight:800}

footer{background:var(--nuit);color:#b9c9d8;padding:3rem 0;font-size:.95rem}
footer a,footer a:visited{color:#fff;text-decoration:none}
footer a:hover,footer a:focus-visible{color:#fff;text-decoration:underline}
footer .wrap{display:grid;gap:1.5rem;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
footer h2{margin-top:0;color:#fff;font-size:1.1rem}
footer ul{list-style:none;margin:0;padding:0}
.petit{font-size:.85rem;color:#93a6b8}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

/* slider (CSS scroll-snap : glissement tactile natif, boutons et points ajoutés par JS) */
.slider{position:relative;border-radius:var(--rayon);overflow:hidden;background:#000;box-shadow:0 12px 30px rgba(12,28,43,.18)}
.slides{overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
.slides::-webkit-scrollbar{display:none}
.sl-track{display:flex}
.slide{flex:0 0 100%;min-width:0;scroll-snap-align:center;margin:0}
.slider.embla-on .slides{overflow:hidden;scroll-snap-type:none;cursor:grab;touch-action:pan-y pinch-zoom}
.slider.embla-on .slides.glisse{cursor:grabbing}
.slider.embla-on .sl-track{touch-action:pan-y pinch-zoom}
.slide img{-webkit-user-drag:none;user-select:none;-webkit-user-select:none}
.slide img{width:100%;aspect-ratio:4/3;object-fit:cover}
@media(min-width:700px){.slide img{aspect-ratio:16/10}}
@media(min-width:1000px){.slide img{aspect-ratio:2/1}}
.sl-btn{position:absolute;top:50%;transform:translateY(-50%);width:48px;height:48px;border-radius:50%;border:0;background:rgba(255,255,255,.88);color:var(--marine);font-size:1.2rem;cursor:pointer;display:grid;place-items:center;box-shadow:0 2px 10px rgba(0,0,0,.3)}
.sl-btn:hover{background:#fff}
.sl-prev{left:.7rem}.sl-next{right:.7rem}
.sl-btn[hidden],.sl-dots[hidden]{display:none}
@media(max-width:600px){.sl-btn{width:40px;height:40px;font-size:1rem}}
.sl-bas{position:absolute;left:0;right:0;bottom:0;padding:2rem .8rem .7rem;background:linear-gradient(transparent,rgba(0,0,0,.55));display:flex;justify-content:space-between;align-items:flex-end;gap:.5rem;pointer-events:none}
.sl-dots{display:flex;gap:.45rem;flex-wrap:wrap;pointer-events:auto}
.sl-dot{width:11px;height:11px;border-radius:50%;border:2px solid #fff;background:transparent;padding:0;cursor:pointer}
.sl-dot[aria-current="true"]{background:#fff}
.sl-compteur{margin:0;color:#fff;font-size:.85rem;font-weight:600;text-shadow:0 1px 3px rgba(0,0,0,.6)}
@media(max-width:600px){.sl-dots{display:none}}

/* diaporama plein écran ouvert depuis les miniatures */
.galerie a{cursor:zoom-in}
.lightbox{border:0;padding:0;background:transparent;max-width:min(1200px,96vw);width:100%;max-height:96vh;overflow:visible;color:#fff}
.lightbox::backdrop{background:rgba(8,16,24,.94)}
.lightbox .slider{box-shadow:none;border-radius:var(--rayon)}
.lightbox .slide img{aspect-ratio:auto;width:100%;height:auto;max-height:82vh;object-fit:contain;background:#000}
.lb-close{position:absolute;top:-48px;right:0;width:42px;height:42px;border-radius:50%;border:0;background:#fff;color:var(--marine);font-size:1.2rem;cursor:pointer;z-index:5}
@media(max-width:700px){.lb-close{top:-50px}}
html.lb-ouvert{overflow:hidden}
.lightbox .sl-track{align-items:center}.slide img{background:#000}

/* menu replié (écrans étroits) : bouton hamburger ajouté par JS */
.nav-toggle{display:none;width:44px;height:44px;border:1px solid var(--ligne);border-radius:8px;background:var(--blanc);cursor:pointer;padding:0;flex-direction:column;align-items:center;justify-content:center;gap:5px}
.nav-toggle span{display:block;width:22px;height:2px;background:var(--marine);transition:transform .2s,opacity .2s}
.nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
.nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
@media(max-width:1020px){
  .js .site-header .wrap{flex-wrap:wrap}
  .js .nav-toggle{display:flex}
  .js #menu-principal{display:none;flex-basis:100%;order:3;padding-bottom:.8rem}
  .js .site-header.ouvert #menu-principal{display:block}
  .js #menu-principal ul{flex-direction:column;gap:0}
  .js #menu-principal a{display:block;padding:.7rem .2rem;border-bottom:1px solid var(--ligne)}
}
@media(max-width:1020px){html:not(.js) .site-header .wrap{flex-wrap:wrap}}

footer h2{letter-spacing:0;font-size:1rem}
section.alt{background:var(--blanc);border-top:1px solid var(--ligne);border-bottom:1px solid var(--ligne)}

/* hero avec photo */
.hero-photo{border-radius:10px;overflow:hidden;box-shadow:0 18px 40px rgba(0,0,0,.45)}
.hero-photo img{width:100%;aspect-ratio:4/3;object-fit:cover}
.dpe{display:flex;gap:.6rem;flex-wrap:wrap;margin:.5rem 0 0}
.dpe span{display:inline-flex;align-items:center;gap:.5rem;background:var(--brume);border:1px solid var(--ligne);border-radius:var(--rayon);padding:.35rem .8rem;font-weight:600}
.dpe b{display:inline-grid;place-items:center;width:1.7rem;height:1.7rem;border-radius:4px;background:#f0b323;color:#222}
details{background:var(--blanc);border:1px solid var(--ligne);border-radius:var(--rayon);padding:.2rem 1.1rem;margin:.6rem 0}
summary{cursor:pointer;font-weight:700;padding:.7rem 0;color:var(--marine)}
details p{margin:.2rem 0 1rem}

/* bandeau photo en haut de page */
.bandeau{position:relative;padding:0;min-height:clamp(260px,38vw,460px);display:flex;align-items:flex-end;background:var(--nuit);color:#fff;overflow:hidden}
.bandeau>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.bandeau::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(10,16,12,.82) 0%,rgba(10,16,12,.35) 45%,rgba(10,16,12,0) 75%)}
.bandeau .wrap{position:relative;z-index:1;padding-top:3rem;padding-bottom:1.8rem}
.bandeau h1{color:#fff;margin:0 0 .3em;text-shadow:0 2px 10px rgba(0,0,0,.45)}
.bandeau .chapo{color:#eef1ea;margin:0;text-shadow:0 1px 6px rgba(0,0,0,.5)}