:root{
  --cas:#2e4a3b; --recit:#7a3b2e; --pratique:#3b4a7a;
  --ink:#1c1a17; --paper:#faf6ef; --line:#ddd4c2; --accent:#a8471f;
}
*{box-sizing:border-box}
body{margin:0;font-family:Georgia,'Source Serif 4',serif;background:var(--paper);color:var(--ink);line-height:1.55}
main{max-width:720px;margin:0 auto;padding:1.5rem 1.2rem 4rem}
.site-header{max-width:720px;margin:0 auto;padding:1.5rem 1.2rem 0.8rem;border-bottom:2px solid var(--ink)}
.logo{font-size:2rem;font-weight:bold;text-decoration:none;color:var(--ink);letter-spacing:0.02em}
.tagline{margin:0.2rem 0 0.8rem;font-style:italic;color:#555}
nav a{color:var(--ink);text-decoration:none;margin-right:0.3rem}
nav a.active,nav a:hover{text-decoration:underline}
h1,h2,h3{font-family:Georgia,serif;line-height:1.2}
h1{font-size:1.8rem}
a{color:var(--accent)}
.grille-cartes{display:grid;gap:1rem;margin:1rem 0}
.carte{border:1px solid var(--line);padding:0.9rem 1rem;background:#fff}
.carte h3{margin:0.3rem 0}
.meta-ligne{font-size:0.8rem;text-transform:uppercase;letter-spacing:0.04em}
.badge{display:inline-block;padding:0.1rem 0.5rem;border-radius:2px;color:#fff;font-size:0.75rem}
.badge-cas{background:var(--cas)}
.badge-recit{background:var(--recit)}
.badge-pratique{background:var(--pratique)}
.fiche .corps p{margin:0.8rem 0}
.site-footer{max-width:720px;margin:2rem auto 0;padding:1rem 1.2rem;border-top:1px solid var(--line);font-size:0.85rem;color:#555}
@media (min-width:640px){.grille-cartes{grid-template-columns:1fr 1fr}}