@charset "UTF-8";
/* BASE + TYPOGRAPHIE
---------------------------------------------------------- */
:root{--bleu:#0081c9;--bleu-fonce:#006aa6;--encre:#0d0d0d;--gris:#5b6167;--trait:#e4e6e9;--fond:#fff;--fond-doux:#f6f7f8}
*{margin:0;padding:0;box-sizing:border-box}
html{font-size:100%;scroll-behavior:smooth;scroll-padding-top:70px}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;font-size:16px;line-height:1.65;color:var(--encre);background:var(--fond);-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block;border:0}
a{color:var(--bleu-fonce);text-decoration:none}a:hover{text-decoration:underline}
h1,h2,h3{font-weight:600;line-height:1.2;letter-spacing:-.01em}
h1{font-size:clamp(38px,7vw,64px);font-weight:700;letter-spacing:.06em}
h2{font-size:clamp(23px,3.4vw,30px)}
h3{font-size:18px;letter-spacing:0}
p{margin:0 0 14px}p:last-child{margin-bottom:0}
.wrap{width:100%;max-width:1080px;margin:0 auto;padding:0 22px}

/* NAVIGATION
---------------------------------------------------------- */
.nav{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.94);backdrop-filter:blur(8px);border-bottom:1px solid var(--trait)}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:62px;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:10px;color:var(--encre)}.brand:hover{text-decoration:none}
.brand span{display:flex;flex-direction:column;line-height:1.15}
.brand b{font-size:16px;font-weight:700;letter-spacing:.14em}
.brand i{font-style:normal;font-size:11px;color:var(--gris);letter-spacing:.04em}
.nav-links{list-style:none;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.nav-links a{display:inline-block;padding:8px 10px;font-size:12px;font-weight:600;letter-spacing:.09em;color:var(--gris)}
.nav-links a:hover{color:var(--encre);text-decoration:none}
.btn-nav{background:var(--encre);color:#fff!important;border-radius:4px}.btn-nav:hover{background:var(--bleu)}

/* EN-TÊTE DE PAGE
---------------------------------------------------------- */
.hero{position:relative;min-height:min(74vh,620px);display:flex;align-items:center;justify-content:center;text-align:center;color:#fff;background:var(--encre);overflow:hidden}
.hero picture,.hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.55),rgba(0,0,0,.72))}
.hero .wrap{position:relative;z-index:2;padding-top:70px;padding-bottom:70px}
.hero .sur{display:block;font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:#9fd3f2;margin-bottom:16px}
.hero h1{margin-bottom:10px}
.hero .base{font-size:clamp(15px,2.2vw,19px);letter-spacing:.05em;text-transform:uppercase;color:#fff;opacity:.92}
.hero .rule{width:54px;height:3px;background:var(--bleu);margin:22px auto}
.hero .lede{max-width:660px;margin:0 auto;font-size:clamp(15px,2vw,18px);color:#e8eaec}

/* RYTHME DES SECTIONS
---------------------------------------------------------- */
.band{padding:70px 0;border-bottom:1px solid var(--trait)}
.band.doux{background:var(--fond-doux)}
.band.sombre{background:var(--encre);color:#e8eaec;border-bottom:0}
.band.sombre h2{color:#fff}.band.sombre a{color:#7cc6ee}
.label{display:block;font-size:11px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--bleu);margin-bottom:10px}
.band h2{margin-bottom:8px}
.band h2+.chapo{max-width:720px;color:var(--gris);font-size:17px;margin-bottom:26px}
.band.sombre .chapo{color:#a9b1b8}
.texte{max-width:720px}
.texte p+p{margin-top:0}

/* GRILLES DE CARTES
---------------------------------------------------------- */
.grid{display:grid;gap:18px;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));margin-top:26px}
.carte{background:#fff;border:1px solid var(--trait);border-radius:6px;padding:24px 22px}
.band.doux .carte{background:#fff}
.band.sombre .carte{background:#161819;border-color:#26292b}
.carte svg{width:30px;height:30px;color:var(--bleu);margin-bottom:12px}
.carte h3{margin-bottom:6px}
.carte p{font-size:15px;color:var(--gris)}
.band.sombre .carte p{color:#a9b1b8}

/* GALERIE
---------------------------------------------------------- */
.gal{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));margin-top:26px}
.gal figure{position:relative;border-radius:6px;overflow:hidden;background:var(--encre)}
.gal img{width:100%;aspect-ratio:4/5;object-fit:cover;transition:transform .5s ease}
.gal figure:hover img{transform:scale(1.04)}
.gal figcaption{position:absolute;left:0;right:0;bottom:0;padding:26px 14px 12px;font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:#fff;background:linear-gradient(transparent,rgba(0,0,0,.7))}

/* CONTACT
---------------------------------------------------------- */
.contact{display:grid;gap:26px;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));margin-top:24px}
.contact .bloc span{display:block;font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--bleu);margin-bottom:6px}
.contact .bloc p{font-size:17px}
.contact a{color:#fff;border-bottom:1px solid var(--bleu)}.contact a:hover{text-decoration:none;border-color:#fff}

/* PIED DE PAGE
---------------------------------------------------------- */
.site-footer{background:#08090a;color:#8d949a;padding:46px 0 34px;font-size:13px;text-align:center}
.site-footer a{color:#c3c9ce}
.foot-logo{margin:0 auto 18px;opacity:.9}
.foot-legal{line-height:1.9}.foot-legal strong{color:#fff;letter-spacing:.1em}
.foot-nav{margin:16px 0 10px}
.foot-copy{font-size:12px;color:#5d6469;margin:0}

/* PAGE CONDITIONS GÉNÉRALES (contenu lu par leizart.com/cgv — ne pas déstructurer)
---------------------------------------------------------- */
.cgv{padding:50px 0 70px}
.cgv-legal{max-width:820px;margin:0 auto;font-size:15px;line-height:1.75;color:#2b3035}
.cgv-legal h2{font-size:22px;margin:0 0 18px;text-align:center}
.cgv-legal h3{font-size:16px;font-weight:700;margin:28px 0 6px;color:var(--encre)}
.cgv-legal p{margin-bottom:12px}
.cgv-legal a{word-break:break-word}

/* MOBILE
---------------------------------------------------------- */
@media(max-width:760px){
.band{padding:52px 0}
.nav .wrap{justify-content:center;min-height:0;padding-top:8px;padding-bottom:8px}
.nav-links{justify-content:center;gap:2px}
.nav-links a{padding:6px 7px;font-size:11px}
.hero{min-height:62vh}
.gal img{aspect-ratio:4/3}
}
