:root{--primaire:#2a6f6f;--accent:#f4a259;--fond:#faf7f2;--carte:#ffffff;--texte:#2b2b2b;--doux:#e8f0ef;}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:system-ui,'Segoe UI',Roboto,sans-serif;background:var(--fond);color:var(--texte);line-height:1.65}
.conteneur{max-width:1050px;margin:0 auto;padding:0 1.25rem}
.entete{background:var(--primaire);padding:.9rem 0}
.entete .conteneur{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.75rem}
.logo{color:#fff;font-weight:800;font-size:1.15rem;text-decoration:none}
.logo span{color:var(--accent)}
nav ul{display:flex;flex-wrap:wrap;gap:1rem;list-style:none}
nav a{color:#e8f0ef;text-decoration:none;font-size:.92rem;padding:.2rem .35rem;border-radius:4px}
nav a:hover,nav a.actif{color:#fff;background:rgba(255,255,255,.14)}
.hero{background:linear-gradient(135deg,var(--primaire),#1c5252);color:#fff;text-align:center;padding:4rem 1.5rem}
.hero h1{font-size:clamp(1.7rem,4vw,2.7rem);margin-bottom:1rem}
.hero p{max-width:44rem;margin:0 auto 1.5rem;font-size:1.08rem}
.bouton{display:inline-block;background:var(--accent);color:#222;font-weight:700;padding:.8rem 1.6rem;border-radius:999px;text-decoration:none}
.bouton:hover{filter:brightness(1.07)}
h1,h2,h3{line-height:1.25;color:var(--primaire)}
main h1{margin:1.8rem 0 .8rem;font-size:1.9rem}
main h2{margin:1.8rem 0 .6rem;font-size:1.35rem}
main h3{margin:1.2rem 0 .4rem;font-size:1.1rem}
main p,main li{margin-bottom:.55rem}
.grille-cartes{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1.1rem;margin:1.4rem 0}
.carte{background:var(--carte);border:1px solid #e5ded4;border-radius:12px;padding:1.2rem;box-shadow:0 1px 4px rgba(0,0,0,.05)}
.carte h3{margin-top:0}
.encadre{border-radius:10px;padding:1rem 1.2rem;margin:1.2rem 0;border-left:5px solid var(--primaire);background:var(--doux)}
.encadre.alerte{border-left-color:#c0392b;background:#fdf0ee}
.encadre.succes{border-left-color:#2e8b57;background:#eef8f1}
.ressource{background:var(--carte);border:1px solid #e5ded4;border-left:5px solid var(--accent);border-radius:8px;padding:.85rem 1.1rem;margin-bottom:.8rem}
.ressource strong{display:block}
table{width:100%;border-collapse:collapse;margin:1rem 0;background:var(--carte)}
th,td{border:1px solid #e5ded4;padding:.55rem .7rem;text-align:left;font-size:.95rem;vertical-align:top}
th{background:var(--doux)}
figure.illustration{margin:1.4rem 0;background:var(--carte);border:1px solid #e5ded4;border-radius:12px;overflow:hidden}
figure.illustration img{width:100%;height:auto;display:block;max-height:420px;object-fit:cover}
figure.illustration figcaption{font-size:.85rem;color:#666;padding:.6rem .9rem}
figure.illustration figcaption em{color:#999;font-style:normal}
.grille-photos{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1rem;margin:1.4rem 0}
.grille-photos figure.illustration{margin:0}
.fils{font-size:.85rem;color:#777;margin-top:1rem}
figure.illustration{margin:1.5rem 0}
figure.illustration img{width:100%;max-height:420px;object-fit:cover;border-radius:12px;box-shadow:0 2px 8px rgba(0,0,0,.12)}
figure.illustration figcaption{font-size:.8rem;color:#777;margin-top:.4rem}
figure.illustration figcaption a{color:var(--primaire)}
.fils a{color:var(--primaire)}
.pied{background:#22403f;color:#cfe3e2;margin-top:3rem;padding:1.6rem 0;font-size:.9rem}
.pied .conteneur p{margin-bottom:.5rem}
.pied a{color:#fff}
@media(max-width:720px){nav ul{gap:.55rem}main h1{font-size:1.55rem}}