/* Sorin Assainissement — feuille de style du site public */

@font-face { font-family: "Barlow"; src: url("../fonts/barlow-latin-400-normal.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Barlow"; src: url("../fonts/barlow-latin-500-normal.woff2") format("woff2"); font-weight: 500; font-display: swap; }
@font-face { font-family: "Barlow"; src: url("../fonts/barlow-latin-600-normal.woff2") format("woff2"); font-weight: 600; font-display: swap; }
@font-face { font-family: "Barlow"; src: url("../fonts/barlow-latin-700-normal.woff2") format("woff2"); font-weight: 700; font-display: swap; }
@font-face { font-family: "Barlow Semi Condensed"; src: url("../fonts/barlow-semi-condensed-latin-600-normal.woff2") format("woff2"); font-weight: 600; font-display: swap; }
@font-face { font-family: "Barlow Semi Condensed"; src: url("../fonts/barlow-semi-condensed-latin-700-normal.woff2") format("woff2"); font-weight: 700; font-display: swap; }

:root {
  /* --bleu, --rouge, --eau, --soleil sont redéfinies par les réglages (voir layout) */
  --bleu: #124389;
  --bleu-fonce: #0b2c5c;
  --rouge: #bb0c20;
  --eau: #1babe3;
  --soleil: #ffba00;
  --encre: #17202b;
  --texte: #39424e;
  --gris: #6b7480;
  --ligne: #dfe4ea;
  --fond: #f3f6f9;
  --blanc: #fff;
  --rayon: 6px;
  --ombre: 0 1px 2px rgba(16, 32, 56, .06), 0 8px 24px rgba(16, 32, 56, .07);
  --large: 1200px;
  --titre: "Barlow Semi Condensed", "Arial Narrow", Arial, sans-serif;
  --corps: "Barlow", "Helvetica Neue", Arial, sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body { margin: 0; font-family: var(--corps); font-size: 17px; line-height: 1.6; color: var(--texte); background: var(--blanc); }
img { max-width: 100%; height: auto; display: block; }
a { color: var(--bleu); text-underline-offset: 3px; }
a:hover { color: var(--rouge); }
h1, h2, h3, h4 { font-family: var(--titre); color: var(--encre); line-height: 1.15; margin: 0 0 .5em; font-weight: 700; letter-spacing: -.005em; }
h1 { font-size: clamp(2rem, 4.2vw, 3.2rem); }
h2 { font-size: clamp(1.6rem, 2.8vw, 2.25rem); }
h3 { font-size: 1.3rem; }
p { margin: 0 0 1em; }
:focus-visible { outline: 3px solid var(--soleil); outline-offset: 2px; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.lien-evitement { position: absolute; left: -999px; top: 0; background: var(--bleu); color: #fff; padding: .6rem 1rem; z-index: 100; }
.lien-evitement:focus { left: 1rem; }

.conteneur { width: min(100% - 32px, var(--large)); margin-inline: auto; }
.section { padding: clamp(3rem, 7vw, 5.5rem) 0; }
.section--fond { background: var(--fond); }
.section--bleu { background: var(--bleu); color: #dce6f5; }
.section--bleu h2, .section--bleu h3 { color: #fff; }
.surtitre { display: inline-block; font-family: var(--titre); font-weight: 600; text-transform: uppercase; letter-spacing: .08em; font-size: .85rem; color: var(--eau); margin-bottom: .6rem; }
.entete-section { max-width: 720px; margin-bottom: 2.5rem; }
.entete-section p { font-size: 1.08rem; color: var(--gris); }
.section--bleu .entete-section p { color: #c3d3ea; }

/* Boutons */
.btn { display: inline-flex; align-items: center; gap: .55rem; font-family: var(--titre); font-weight: 600; font-size: 1.05rem; letter-spacing: .01em; padding: .8rem 1.35rem; border-radius: var(--rayon); border: 2px solid transparent; text-decoration: none; cursor: pointer; line-height: 1.2; transition: background .15s, color .15s, border-color .15s, transform .15s; }
.btn svg { width: 1.1em; height: 1.1em; flex: none; }
.btn--rouge { background: var(--rouge); color: #fff; }
.btn--rouge:hover { background: #9a0a1a; color: #fff; }
.btn--bleu { background: var(--bleu); color: #fff; }
.btn--bleu:hover { background: var(--bleu-fonce); color: #fff; }
.btn--contour { border-color: currentColor; color: var(--bleu); background: transparent; }
.btn--contour:hover { background: var(--bleu); border-color: var(--bleu); color: #fff; }
.btn--clair { border-color: rgba(255,255,255,.7); color: #fff; }
.btn--clair:hover { background: #fff; color: var(--bleu); border-color: #fff; }
.btn:active { transform: translateY(1px); }

/* Barre d'administration */
.barre-admin { background: #1d232b; color: #cfd6df; font-size: .85rem; }
.barre-admin .conteneur { display: flex; flex-wrap: wrap; gap: .4rem 1.2rem; align-items: center; padding: .4rem 0; }
.barre-admin a { color: #fff; }
.barre-admin .alerte-hl { background: var(--soleil); color: #1d232b; padding: .1rem .5rem; border-radius: 3px; font-weight: 600; }

/* Bandeau supérieur */
.bandeau { background: var(--bleu-fonce); color: #c9d6ea; font-size: .88rem; }
.bandeau .conteneur { display: flex; justify-content: space-between; gap: 1rem; padding: .45rem 0; }
.bandeau a { color: #fff; text-decoration: none; font-weight: 600; }
.bandeau__infos { display: flex; gap: 1.4rem; white-space: nowrap; }
.bandeau__infos span, .bandeau__infos a { display: inline-flex; align-items: center; gap: .4rem; }
.bandeau svg { width: 15px; height: 15px; color: var(--eau); }

/* En-tête */
.entete { background: #fff; position: sticky; top: 0; z-index: 50; border-bottom: 1px solid var(--ligne); }
.entete .conteneur { display: flex; align-items: center; gap: 1.5rem; min-height: 84px; }
.logo { display: block; flex: none; }
.logo img, .logo svg { height: 60px; width: auto; }
.nav { margin-left: auto; display: flex; align-items: center; gap: .25rem; }
.nav > ul { list-style: none; margin: 0; padding: 0; display: flex; gap: .1rem; }
.nav li { position: relative; }
.nav a.nav__lien, .nav button.nav__lien { display: flex; align-items: center; gap: .3rem; font-family: var(--titre); font-weight: 600; font-size: 1.06rem; color: var(--encre); text-decoration: none; padding: .55rem .75rem; border-radius: var(--rayon); background: none; border: 0; cursor: pointer; }
.nav a.nav__lien:hover, .nav button.nav__lien:hover, .nav .actif > .nav__lien { color: var(--bleu); background: var(--fond); }
.nav .actif > .nav__lien { box-shadow: inset 0 -3px 0 var(--eau); border-radius: var(--rayon) var(--rayon) 0 0; }
.nav__chevron { width: 12px; height: 12px; transition: transform .15s; }
.sous-menu { position: absolute; top: 100%; left: 0; min-width: 320px; background: #fff; border: 1px solid var(--ligne); border-radius: var(--rayon); box-shadow: var(--ombre); padding: .6rem; display: none; }
.nav li:hover > .sous-menu, .nav li.ouvert > .sous-menu { display: block; }
.nav li.ouvert .nav__chevron { transform: rotate(180deg); }
.sous-menu ul { list-style: none; margin: 0; padding: 0; }
.sous-menu__gamme { display: block; padding: .5rem .7rem .2rem; font-family: var(--titre); font-weight: 700; color: var(--bleu); text-decoration: none; }
.sous-menu__modele { display: flex; justify-content: space-between; gap: 1rem; padding: .35rem .7rem; color: var(--texte); text-decoration: none; border-radius: 4px; font-size: .95rem; }
.sous-menu__modele small { color: var(--gris); white-space: nowrap; }
.sous-menu a:hover { background: var(--fond); color: var(--bleu); }
.sous-menu__tout { display: block; margin-top: .4rem; border-top: 1px solid var(--ligne); padding: .6rem .7rem .3rem; font-weight: 600; font-size: .92rem; text-decoration: none; }
.nav__cta { margin-left: .6rem; }
.burger { display: none; margin-left: auto; background: none; border: 0; padding: .5rem; cursor: pointer; color: var(--bleu); }
.burger svg { width: 30px; height: 30px; }

@media (max-width: 1040px) {
  .bandeau__texte { display: none; }
  .bandeau .conteneur { justify-content: center; }
  .burger { display: block; }
  .nav { position: fixed; inset: 0 0 0 auto; width: min(360px, 88vw); background: #fff; flex-direction: column; align-items: stretch; padding: 5rem 1.2rem 2rem; transform: translateX(100%); transition: transform .2s ease; box-shadow: -12px 0 32px rgba(0,0,0,.15); overflow-y: auto; z-index: 60; }
  .nav.ouverte { transform: none; }
  .nav > ul { flex-direction: column; }
  .nav a.nav__lien, .nav button.nav__lien { width: 100%; font-size: 1.2rem; justify-content: space-between; }
  .sous-menu { position: static; box-shadow: none; border: 0; padding: 0 0 .5rem .6rem; min-width: 0; }
  .nav li:hover > .sous-menu { display: none; }
  .nav li.ouvert > .sous-menu { display: block; }
  .nav__cta { margin: 1rem 0 0; justify-content: center; }
  .nav__fermer { position: absolute; top: 1rem; right: 1rem; }
  .voile { position: fixed; inset: 0; background: rgba(10, 20, 35, .45); z-index: 55; display: none; }
  .voile.visible { display: block; }
}
@media (min-width: 1041px) { .nav__fermer, .voile { display: none !important; } }

/* Fil d'Ariane */
.fil { font-size: .88rem; color: var(--gris); padding: 1rem 0 0; }
.fil ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .3rem; }
.fil li + li::before { content: "/"; margin-right: .3rem; color: #b0b8c2; }
.fil a { color: var(--gris); text-decoration: none; }
.fil a:hover { color: var(--bleu); text-decoration: underline; }

/* Héros accueil */
.heros { position: relative; color: #fff; background: var(--bleu-fonce); overflow: hidden; }
.heros__image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.heros::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(8, 30, 66, .92) 0%, rgba(8, 30, 66, .78) 45%, rgba(8, 30, 66, .25) 100%); }
.heros .conteneur { position: relative; z-index: 1; padding: clamp(4rem, 10vw, 7.5rem) 0 clamp(5.5rem, 11vw, 8.5rem); }
.heros__texte { max-width: 680px; }
.heros h1 { color: #fff; margin-bottom: 1rem; }
.heros .surtitre { color: var(--soleil); }
.heros p { font-size: 1.15rem; color: #d7e2f2; max-width: 600px; }
.heros__actions { display: flex; flex-wrap: wrap; gap: .8rem; margin-top: 1.8rem; }
.vague { display: block; width: 100%; height: 48px; }
.heros .vague { position: absolute; bottom: -1px; left: 0; z-index: 1; }

.chiffres { position: relative; z-index: 2; margin-top: -3.2rem; }
.chiffres ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); background: #fff; border-radius: var(--rayon); box-shadow: var(--ombre); }
.chiffres li { padding: 1.4rem 1.6rem; border-left: 1px solid var(--ligne); }
.chiffres li:first-child { border-left: 0; }
.chiffres strong { display: block; font-family: var(--titre); font-size: 1.7rem; color: var(--bleu); line-height: 1.1; }
.chiffres span { color: var(--gris); font-size: .95rem; }
@media (max-width: 700px) {
  .chiffres ul { grid-template-columns: 1fr; }
  .chiffres li { border-left: 0; border-top: 1px solid var(--ligne); padding: 1rem 1.2rem; }
  .chiffres li:first-child { border-top: 0; }
}

/* Cartes de gammes */
.gammes { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 1.6rem; }
.carte-gamme { display: flex; flex-direction: column; background: #fff; border: 1px solid var(--ligne); border-radius: var(--rayon); overflow: hidden; text-decoration: none; color: inherit; transition: box-shadow .2s, transform .2s, border-color .2s; }
.carte-gamme:hover { box-shadow: var(--ombre); transform: translateY(-3px); border-color: #c9d3de; color: inherit; }
.carte-gamme__visuel { aspect-ratio: 16 / 10; background: var(--fond) center / cover no-repeat; position: relative; }
.carte-gamme__visuel img { width: 100%; height: 100%; object-fit: cover; }
.carte-gamme__capacite { position: absolute; left: 1rem; bottom: 1rem; background: var(--soleil); color: #1d232b; font-family: var(--titre); font-weight: 700; padding: .25rem .6rem; border-radius: 3px; font-size: .95rem; }
.carte-gamme__corps { padding: 1.3rem 1.4rem 1.5rem; display: flex; flex-direction: column; flex: 1; }
.carte-gamme h3 { font-size: 1.45rem; margin-bottom: .4rem; }
.carte-gamme p { color: var(--gris); font-size: .98rem; }
.carte-gamme__modeles { list-style: none; margin: auto 0 0; padding: .8rem 0 0; border-top: 1px solid var(--ligne); font-size: .95rem; }
.carte-gamme__modeles li { display: flex; justify-content: space-between; gap: .8rem; padding: .2rem 0; }
.carte-gamme__modeles small { color: var(--gris); }
.carte-gamme__plus { margin-top: 1rem; font-family: var(--titre); font-weight: 600; color: var(--bleu); display: inline-flex; align-items: center; gap: .4rem; }
.carte-gamme:hover .carte-gamme__plus { color: var(--rouge); }
.visuel-vide { display: grid; place-items: center; width: 100%; height: 100%; color: var(--eau); background: linear-gradient(160deg, #eaf4fb, #dbe8f4); }
.visuel-vide svg { width: 72px; height: 72px; opacity: .7; }

/* Étapes */
.etapes { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.6rem; counter-reset: etape; }
.etape { position: relative; padding: 1.6rem 1.5rem 1.4rem; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.14); border-radius: var(--rayon); }
.etape::before { counter-increment: etape; content: "0" counter(etape); font-family: var(--titre); font-weight: 700; font-size: 2.6rem; line-height: 1; color: var(--eau); display: block; margin-bottom: .8rem; }
.etape h3 { color: #fff; }
.etape p { margin: 0; color: #c3d3ea; }
@media (max-width: 860px) { .etapes { grid-template-columns: 1fr; } }

/* Bloc deux colonnes */
.duo { display: grid; grid-template-columns: 1.05fr 1fr; gap: clamp(2rem, 5vw, 4rem); align-items: center; }
.duo--inverse > :first-child { order: 2; }
.duo img { border-radius: var(--rayon); width: 100%; object-fit: cover; }
@media (max-width: 860px) { .duo { grid-template-columns: 1fr; } .duo--inverse > :first-child { order: 0; } }

.puces { list-style: none; padding: 0; margin: 0 0 1.4rem; }
.puces li { position: relative; padding-left: 1.8rem; margin-bottom: .45rem; }
.puces li::before { content: ""; position: absolute; left: 0; top: .5em; width: 1rem; height: .55rem; border-left: 3px solid var(--eau); border-bottom: 3px solid var(--eau); transform: rotate(-45deg); }

/* Réalisations */
.grille-real { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 1.2rem; }
.real { margin: 0; position: relative; border-radius: var(--rayon); overflow: hidden; background: var(--fond); }
.real a { display: block; color: inherit; text-decoration: none; }
.real img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; transition: transform .35s; }
.real a:hover img { transform: scale(1.04); }
.real figcaption { padding: .8rem 1rem 1rem; background: #fff; border: 1px solid var(--ligne); border-top: 0; border-radius: 0 0 var(--rayon) var(--rayon); }
.real figcaption strong { display: block; font-family: var(--titre); font-size: 1.12rem; color: var(--encre); }
.real figcaption span { font-size: .9rem; color: var(--gris); }
.filtres { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 1.8rem; }
.filtres a { padding: .4rem .9rem; border: 1px solid var(--ligne); border-radius: 99px; text-decoration: none; color: var(--texte); font-size: .95rem; }
.filtres a.actif, .filtres a:hover { background: var(--bleu); border-color: var(--bleu); color: #fff; }

/* Zone */
.departements { display: flex; flex-wrap: wrap; gap: .5rem; margin: 1.2rem 0 1.6rem; padding: 0; list-style: none; }
.departements li { font-family: var(--titre); font-weight: 600; background: #fff; border: 1px solid var(--ligne); border-radius: var(--rayon); padding: .35rem .75rem; }
.departements b { color: var(--rouge); margin-right: .3rem; }
.carte-zone { background: #fff; border-radius: var(--rayon); padding: 1rem; border: 1px solid var(--ligne); }

/* Partenaire */
.partenaire { display: flex; gap: 2rem; align-items: center; }
.partenaire img { max-height: 90px; width: auto; flex: none; }
@media (max-width: 640px) { .partenaire { flex-direction: column; align-items: flex-start; } }

/* Appel à l'action */
.cta { background: var(--rouge); color: #fff; border-radius: var(--rayon); padding: clamp(1.8rem, 4vw, 2.8rem); display: flex; flex-wrap: wrap; gap: 1.5rem; align-items: center; justify-content: space-between; }
.cta h2 { color: #fff; margin-bottom: .3rem; }
.cta p { margin: 0; color: #fbe3e6; max-width: 640px; }
.cta .btn--clair:hover { color: var(--rouge); }

/* En-tête de page intérieure */
.entete-page { background: var(--fond); border-bottom: 1px solid var(--ligne); }
.entete-page .conteneur { padding-bottom: clamp(2rem, 4vw, 3rem); }
.entete-page h1 { margin: .8rem 0 .6rem; }
.entete-page__accroche { font-size: 1.15rem; color: var(--gris); max-width: 760px; margin: 0; }
.entete-page--visuel .conteneur { display: grid; grid-template-columns: 1.2fr 1fr; gap: 2.5rem; align-items: end; }
.entete-page--visuel img { border-radius: var(--rayon) var(--rayon) 0 0; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; margin-bottom: calc(-1 * clamp(2rem, 4vw, 3rem)); }
.badge-capacite { display: inline-block; background: var(--soleil); color: #1d232b; font-family: var(--titre); font-weight: 700; padding: .2rem .65rem; border-radius: 3px; }
@media (max-width: 860px) { .entete-page--visuel .conteneur { grid-template-columns: 1fr; } .entete-page--visuel img { margin-bottom: 0; border-radius: var(--rayon); } }

/* Contenu rédactionnel */
.mise-en-page { display: grid; grid-template-columns: minmax(0, 1fr) 330px; gap: clamp(2rem, 5vw, 4rem); align-items: start; }
@media (max-width: 960px) { .mise-en-page { grid-template-columns: 1fr; } }
.redac { max-width: 760px; }
.redac h2 { margin-top: 1.8em; font-size: 1.75rem; }
.redac h2:first-child { margin-top: 0; }
.redac h3 { margin-top: 1.4em; color: var(--bleu); }
.redac ul, .redac ol { padding-left: 1.3rem; }
.redac li { margin-bottom: .35rem; }
.redac li::marker { color: var(--eau); }
.redac blockquote { margin: 1.5rem 0; padding: .4rem 0 .4rem 1.2rem; border-left: 4px solid var(--eau); color: var(--encre); }
.redac table { border-collapse: collapse; width: 100%; margin: 1.2rem 0; font-size: .95rem; }
.redac th, .redac td { border: 1px solid var(--ligne); padding: .5rem .7rem; text-align: left; }
.redac th { background: var(--fond); }
.redac img { border-radius: var(--rayon); margin: 1rem 0; }
.lead { font-size: 1.12rem; color: var(--encre); }

.encart { background: #fff; border: 1px solid var(--ligne); border-radius: var(--rayon); padding: 1.4rem; margin-bottom: 1.4rem; }
.encart h2, .encart h3 { font-size: 1.25rem; }
.encart--bleu { background: var(--bleu); border-color: var(--bleu); color: #d6e1f2; }
.encart--bleu h2, .encart--bleu h3 { color: #fff; }
.encart--bleu .btn { width: 100%; justify-content: center; margin-top: .4rem; }
.encart__tel { display: flex; align-items: center; gap: .5rem; font-family: var(--titre); font-size: 1.5rem; font-weight: 700; color: #fff; text-decoration: none; margin: .4rem 0 .8rem; }
.encart__tel:hover { color: var(--soleil); }
.colonne-laterale { position: sticky; top: 110px; }

.carac { list-style: none; margin: 0; padding: 0; }
.carac li { display: flex; gap: .6rem; padding: .55rem 0; border-bottom: 1px solid var(--ligne); }
.carac li:last-child { border-bottom: 0; }
.carac svg { width: 18px; height: 18px; color: var(--eau); flex: none; margin-top: .25rem; }

.avantages { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: .8rem; list-style: none; padding: 0; margin: 0; }
.avantages li { display: flex; gap: .7rem; align-items: flex-start; background: #fff; border: 1px solid var(--ligne); border-radius: var(--rayon); padding: .9rem 1rem; font-weight: 500; color: var(--encre); }
.avantages svg { width: 22px; height: 22px; color: var(--eau); flex: none; }

/* Modèles d'une gamme */
.modeles { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 1.2rem; }
.modele { display: grid; grid-template-rows: auto 1fr; background: #fff; border: 1px solid var(--ligne); border-radius: var(--rayon); overflow: hidden; text-decoration: none; color: inherit; transition: box-shadow .2s, border-color .2s; }
.modele:hover { box-shadow: var(--ombre); border-color: #c9d3de; color: inherit; }
.modele img, .modele .visuel-vide { aspect-ratio: 16 / 9; width: 100%; object-fit: cover; }
.modele__corps { padding: 1.1rem 1.2rem 1.3rem; }
.modele__corps h3 { margin: .4rem 0; }
.modele__corps p { color: var(--gris); font-size: .96rem; margin-bottom: .6rem; }

/* Documents */
.docs { list-style: none; margin: 0; padding: 0; display: grid; gap: .7rem; }
.doc { display: flex; align-items: center; gap: 1rem; padding: .9rem 1rem; background: #fff; border: 1px solid var(--ligne); border-radius: var(--rayon); text-decoration: none; color: inherit; transition: border-color .15s, box-shadow .15s; }
.doc:hover { border-color: var(--bleu); box-shadow: var(--ombre); color: inherit; }
.doc__icone { flex: none; width: 44px; height: 52px; display: grid; place-items: center; border-radius: 4px; background: #fdecee; color: var(--rouge); font-family: var(--titre); font-weight: 700; font-size: .8rem; }
.doc__icone--lien { background: #e6f4fb; color: var(--bleu); }
.doc__texte { flex: 1; min-width: 0; }
.doc__texte strong { display: block; color: var(--encre); line-height: 1.3; }
.doc__texte span { display: block; font-size: .88rem; color: var(--gris); }
.doc__action { flex: none; color: var(--bleu); }
.doc__action svg { width: 22px; height: 22px; }
.groupe-docs + .groupe-docs { margin-top: 2.6rem; }
.groupe-docs h2 { display: flex; align-items: baseline; gap: .8rem; flex-wrap: wrap; }
.groupe-docs h2 a { font-size: 1rem; font-family: var(--corps); font-weight: 600; }

/* Galerie */
.galerie { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: .7rem; }
.galerie a { display: block; position: relative; border-radius: 4px; overflow: hidden; background: var(--fond); }
.galerie img { width: 100%; aspect-ratio: 1; object-fit: cover; transition: transform .3s, opacity .3s; }
.galerie a:hover img { transform: scale(1.05); }
.galerie figcaption { position: absolute; left: 0; right: 0; bottom: 0; padding: .9rem .6rem .4rem; font-size: .8rem; color: #fff; background: linear-gradient(transparent, rgba(0,0,0,.7)); }

.visionneuse { position: fixed; inset: 0; background: rgba(6, 14, 26, .94); z-index: 200; display: none; align-items: center; justify-content: center; padding: 3rem 4rem; }
.visionneuse.ouverte { display: flex; }
.visionneuse figure { margin: 0; max-width: 100%; max-height: 100%; text-align: center; }
.visionneuse img { max-height: calc(100vh - 8rem); max-width: 100%; width: auto; margin: auto; border-radius: 4px; }
.visionneuse figcaption { color: #dfe7f1; margin-top: .8rem; }
.visionneuse button { position: absolute; background: rgba(255,255,255,.1); color: #fff; border: 0; width: 48px; height: 48px; border-radius: 50%; cursor: pointer; display: grid; place-items: center; }
.visionneuse button:hover { background: rgba(255,255,255,.22); }
.visionneuse button svg { width: 24px; height: 24px; }
.visionneuse__fermer { top: 1rem; right: 1rem; }
.visionneuse__prec { left: 1rem; top: 50%; transform: translateY(-50%); }
.visionneuse__suiv { right: 1rem; top: 50%; transform: translateY(-50%); }
@media (max-width: 640px) { .visionneuse { padding: 3.5rem .5rem; } .visionneuse__prec, .visionneuse__suiv { top: auto; bottom: 1rem; transform: none; } }

/* Formulaire */
.formulaire { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem 1.2rem; }
.champ { display: flex; flex-direction: column; gap: .35rem; }
.champ--large { grid-column: 1 / -1; }
.champ label { font-weight: 600; color: var(--encre); font-size: .95rem; }
.champ label small { font-weight: 400; color: var(--gris); }
.champ input, .champ select, .champ textarea { font: inherit; font-size: 1rem; padding: .7rem .8rem; border: 1px solid #c4ccd6; border-radius: var(--rayon); background: #fff; color: var(--encre); width: 100%; }
.champ input:focus, .champ select:focus, .champ textarea:focus { border-color: var(--bleu); outline: 3px solid rgba(27, 171, 227, .25); outline-offset: 0; }
.champ textarea { min-height: 170px; resize: vertical; }
.case { grid-column: 1 / -1; display: flex; gap: .6rem; align-items: flex-start; font-size: .92rem; color: var(--gris); }
.case input { margin-top: .3rem; width: 18px; height: 18px; accent-color: var(--bleu); }
.pot-de-miel { position: absolute; left: -5000px; }
@media (max-width: 640px) { .formulaire { grid-template-columns: 1fr; } }
.message { padding: 1rem 1.2rem; border-radius: var(--rayon); margin-bottom: 1.4rem; }
.message--ok { background: #e7f6ec; border: 1px solid #a8dcb8; color: #1d5b31; }
.message--erreur { background: #fdecee; border: 1px solid #f2b8bf; color: #7d0f1c; }
.message ul { margin: .3rem 0 0; padding-left: 1.2rem; }

.coordonnees { list-style: none; margin: 0; padding: 0; }
.coordonnees li { display: flex; gap: .8rem; padding: .7rem 0; border-bottom: 1px solid rgba(255,255,255,.15); }
.coordonnees li:last-child { border-bottom: 0; }
.coordonnees svg { width: 20px; height: 20px; flex: none; color: var(--eau); margin-top: .2rem; }
.coordonnees a { color: #fff; }

/* Pied de page */
.pied { background: var(--bleu-fonce); color: #b8c7de; font-size: .95rem; position: relative; margin-top: 0; }
.pied .vague { position: absolute; top: -47px; left: 0; }
.pied__haut { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1.2fr; gap: 2.5rem; padding: 4rem 0 2.5rem; }
.pied h2 { font-size: 1.15rem; color: #fff; margin-bottom: 1rem; text-transform: uppercase; letter-spacing: .06em; }
.pied ul { list-style: none; margin: 0; padding: 0; }
.pied li { margin-bottom: .5rem; }
.pied a { color: #dfe8f5; text-decoration: none; }
.pied a:hover { color: #fff; text-decoration: underline; }
.pied__logo { background: #fff; display: inline-block; padding: .6rem .8rem; border-radius: var(--rayon); margin-bottom: 1rem; }
.pied__logo img, .pied__logo svg { height: 52px; width: auto; }
.pied__partenaire { margin-top: 1.2rem; display: flex; align-items: center; gap: .8rem; font-size: .85rem; }
.pied__partenaire img { height: 40px; width: auto; background: #fff; padding: .3rem .5rem; border-radius: 4px; }
.pied__bas { border-top: 1px solid rgba(255,255,255,.12); padding: 1.2rem 0; display: flex; flex-wrap: wrap; gap: .6rem 1.6rem; justify-content: space-between; font-size: .85rem; color: #8ea2c1; }
.pied__bas a { color: #b8c7de; }
@media (max-width: 960px) { .pied__haut { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) { .pied__haut { grid-template-columns: 1fr; gap: 1.8rem; } }

/* Bouton d'appel flottant (mobile) */
.appel-mobile { display: none; }
@media (max-width: 700px) {
  .appel-mobile { display: flex; position: fixed; right: 14px; bottom: 14px; z-index: 40; width: 56px; height: 56px; border-radius: 50%; background: var(--rouge); color: #fff; align-items: center; justify-content: center; box-shadow: 0 6px 18px rgba(0,0,0,.25); }
  .appel-mobile svg { width: 26px; height: 26px; }
}

/* Page 404 / hors ligne */
.page-erreur { text-align: center; padding: 5rem 0; }
.page-erreur .code { font-family: var(--titre); font-size: 6rem; line-height: 1; color: var(--eau); font-weight: 700; }

@media print {
  .bandeau, .entete, .pied, .barre-admin, .appel-mobile, .cta, .colonne-laterale { display: none !important; }
  body { font-size: 12pt; }
}
@media (prefers-reduced-motion: reduce) { * { transition: none !important; scroll-behavior: auto !important; } }
