/* BriceducruiX — feuille de style */
:root{
  --bg:#f4f1ea;
  --surface:#ffffff;
  --ink:#1f2a2e;
  --muted:#5d6b70;
  --accent:#1d6b74;
  --accent-dark:#124a51;
  --accent-soft:#e3efef;
  --line:#ddd6c8;
  --radius:10px;
  --max:1100px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--bg);color:var(--ink);
  font:17px/1.65 "Source Sans 3","Segoe UI",system-ui,-apple-system,sans-serif;
}
img{max-width:100%;height:auto;display:block}
a{color:var(--accent)}
a:hover{color:var(--accent-dark)}
.wrap{max-width:var(--max);margin:0 auto;padding:0 16px}

/* En-tête */
.site-header{background:var(--accent-dark);color:#fff}
.site-header .wrap{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 18px;padding-top:22px;padding-bottom:14px}
.brand{font:700 2rem/1.1 Georgia,"Times New Roman",serif;color:#fff;text-decoration:none;letter-spacing:.5px}
.brand:hover{color:#fff}
.tagline{color:#cfe3e4;font-size:.98rem}

/* Navigation */
.nav{background:var(--accent)}
.nav ul{list-style:none;margin:0 auto;padding:0 16px;max-width:var(--max);display:flex;flex-wrap:wrap}
.nav a{display:block;padding:10px 13px;color:#fff;text-decoration:none;font-size:.95rem}
.nav a:hover,.nav a[aria-current="page"]{background:var(--accent-dark)}
.nav-toggle{display:none}

/* Diaporama */
.slider{position:relative;max-width:var(--max);margin:20px auto 0;padding:0 16px}
.slides{position:relative;aspect-ratio:1000/300;overflow:hidden;border-radius:var(--radius);background:#c9d6d6}
.slides img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 1s ease}
.slides img.active{opacity:1}

/* Contenu */
main{padding:28px 0 48px}
.page-title{font:700 1.9rem/1.2 Georgia,serif;margin:0 0 6px}
.lead{color:var(--muted);margin:0 0 26px}

.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:20px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column;text-decoration:none;color:inherit;transition:transform .15s,box-shadow .15s}
.card:hover{transform:translateY(-3px);box-shadow:0 8px 22px rgba(18,74,81,.14);color:inherit}
.card .thumb{aspect-ratio:16/10;background:var(--accent-soft);display:flex;align-items:center;justify-content:center;overflow:hidden}
.card .thumb img{width:100%;height:100%;object-fit:cover}
.card .thumb .glyph{font:700 3rem Georgia,serif;color:var(--accent)}
.card .body{padding:14px 16px 16px;flex:1;display:flex;flex-direction:column}
.card h2{font:700 1.2rem/1.3 Georgia,serif;margin:0 0 4px}
.card .meta{color:var(--muted);font-size:.85rem;margin:0 0 8px}
.card p{margin:0 0 10px;font-size:.95rem}
.card .more{margin-top:auto;color:var(--accent);font-weight:600;font-size:.92rem}

/* Pages de texte */
.article{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:28px clamp(18px,4vw,44px);max-width:860px}
.article h2{font:700 1.3rem/1.3 Georgia,serif;margin:2em 0 .5em;color:var(--accent-dark)}
.article h3{font-size:1.05rem;margin:1.5em 0 .4em}
.article .updated{color:var(--muted);font-size:.9rem;margin-top:0}
.article dl{margin:0}
.article dt{font-weight:700;margin-top:.8em}
.article dd{margin:0 0 .3em 0}
.article table{width:100%;border-collapse:collapse;font-size:.95rem;margin:1em 0}
.article th,.article td{border:1px solid var(--line);padding:8px 10px;text-align:left;vertical-align:top}
.article th{background:var(--accent-soft)}
.identity{background:var(--accent-soft);border-radius:8px;padding:14px 18px}
.identity p{margin:.25em 0}
.toc{background:#faf8f3;border:1px solid var(--line);border-radius:8px;padding:12px 18px;margin:1em 0 1.5em}
.toc ol{margin:.3em 0;padding-left:1.3em}

/* Pied de page */
.site-footer{background:var(--ink);color:#c8d0d2;font-size:.92rem}
.site-footer .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px 24px;padding-top:20px;padding-bottom:20px}
.site-footer a{color:#fff;text-decoration:none}
.site-footer a:hover{text-decoration:underline;color:#fff}
.site-footer nav a{margin-right:16px}

@media (max-width:760px){
  .brand{font-size:1.6rem}
  .nav-toggle{display:block;width:100%;background:var(--accent);color:#fff;border:0;padding:11px 16px;text-align:left;font:600 1rem inherit;cursor:pointer}
  .nav ul{display:none;flex-direction:column;padding:0}
  .nav.open ul{display:flex}
  .nav a{padding:11px 16px;border-top:1px solid rgba(255,255,255,.12)}
  .slides{aspect-ratio:16/7}
}

/* Bouton */
.btn{background:var(--accent);color:#fff;border:0;border-radius:8px;padding:10px 18px;font:600 1rem inherit;cursor:pointer}
.btn:hover{background:var(--accent-dark)}
