:root{--ardoise:#262a27;--craie:#f1efe6;--rouge:#a82920;--papier:#f3ecd8;--encre:#2b2118;--craie-font:'Caveat Brush','Comic Sans MS',cursive;--texte:'Libre Baskerville',Georgia,'Times New Roman',serif}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--texte);font-size:17px;line-height:1.7;color:var(--encre);background:var(--papier)}
a{color:inherit}
p+p{margin-top:.9em}
[hidden]{display:none!important}

.vichy{height:44px;background-color:#fff;background-image:linear-gradient(90deg,rgba(168,41,32,.55) 50%,transparent 50%),linear-gradient(rgba(168,41,32,.55) 50%,transparent 50%);background-size:44px 44px}
.vichy.haut{height:36px}

.nav{background:var(--ardoise);color:var(--craie);border-top:6px solid #6b4a2b;border-bottom:6px solid #6b4a2b}
.nav-in{max-width:960px;margin:0 auto;padding:10px 20px;display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}
.nav a{text-decoration:none}
.marque{font-family:var(--craie-font);font-size:1.7rem;line-height:1}
.liens a{font-family:var(--craie-font);font-size:1.3rem;margin-left:18px}
.liens a:hover{text-decoration:underline}
.liens a.lang{font-size:1.1rem;border:2px dashed var(--craie);padding:0 10px;border-radius:4px;margin-left:26px;white-space:nowrap}
.liens a.lang:hover{background:var(--craie);color:var(--ardoise);text-decoration:none}

.ardoise{background:var(--ardoise);color:var(--craie);padding:64px 20px 72px;text-align:center;
 background-image:radial-gradient(ellipse at 20% 10%,rgba(255,255,255,.07),transparent 55%),radial-gradient(ellipse at 85% 90%,rgba(255,255,255,.05),transparent 50%);
 border-bottom:10px solid #6b4a2b}
.ardoise .in{max-width:860px;margin:0 auto}
.ardoise small{font-family:var(--craie-font);font-size:1.35rem;opacity:.85;display:block;margin-bottom:10px}
.ardoise h1{font-family:var(--craie-font);font-weight:400;font-size:clamp(2.6rem,9vw,5.8rem);line-height:1.02;text-shadow:0 0 1px rgba(255,255,255,.6)}
.ardoise h1 u{text-decoration:none;border-bottom:5px solid var(--craie);padding-bottom:2px}
.ardoise .adr{font-family:var(--craie-font);font-size:clamp(1.3rem,3.4vw,1.9rem);margin:26px 0 22px;line-height:1.35}
.craie-btn{display:inline-block;font-family:var(--craie-font);font-size:1.5rem;text-decoration:none;color:var(--craie);border:3px dashed var(--craie);padding:6px 24px;margin:6px 8px;border-radius:4px}
.craie-btn:hover{background:var(--craie);color:var(--ardoise)}

.carte{max-width:800px;margin:44px auto;padding:46px clamp(20px,6vw,64px);background:var(--papier);border:4px double var(--rouge);outline:1px solid var(--rouge);outline-offset:6px;width:calc(100% - 44px)}
.carte section{padding:30px 0}
.carte section+section{border-top:1px solid #2b211833}
h2{font-family:var(--texte);font-weight:700;font-style:italic;font-size:clamp(1.6rem,4.6vw,2.2rem);line-height:1.2;color:var(--rouge);text-align:center;margin-bottom:.7em}
h2:after{content:"";display:block;width:90px;height:0;border-top:3px double var(--rouge);margin:12px auto 0}
.titre-page{font-family:var(--texte);font-weight:700;font-style:italic;font-size:clamp(2rem,6vw,2.8rem);line-height:1.15;color:var(--rouge);text-align:center;margin-bottom:.5em}
.carte p{text-align:justify;hyphens:auto}
.lead{font-style:italic;text-align:center!important;font-size:1.1rem}
.gros{font-size:1.25rem;font-weight:700;text-align:center!important;line-height:1.4}
.centre{text-align:center!important}

.menu{list-style:none;margin-top:6px}
.menu li{display:flex;align-items:baseline;gap:8px;padding:5px 0}
.menu .n{font-weight:700;white-space:nowrap}
.menu .p{flex:1;border-bottom:2px dotted #2b211888;transform:translateY(-4px);min-width:16px}
.menu .d{font-style:italic;text-align:right;max-width:55%}
@media(max-width:600px){.menu li{flex-wrap:wrap}.menu .p{display:none}.menu .d{text-align:left;max-width:100%;flex-basis:100%}}

/* billets du blog */
.billet{padding:18px 0;border-bottom:1px dotted #2b211888}
.billet:last-of-type{border-bottom:0}
.billet .meta{font-size:.85rem;font-style:italic;opacity:.8}
.billet h3{font-size:1.25rem;line-height:1.3;margin:2px 0 4px;border:0;padding:0;color:var(--encre)}
.billet h3 a{text-decoration:none;color:var(--rouge)}
.billet h3 a:hover{text-decoration:underline}
.billet p{text-align:left!important}
.filtres{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:22px 0 10px}
.filtre{font-family:var(--texte);font-size:.9rem;text-decoration:none;color:var(--rouge);border:2px solid var(--rouge);padding:4px 12px;background:transparent;cursor:pointer}
.filtre:hover,.filtre.on{background:var(--rouge);color:#fffdf6}

/* articles */
.article .fil{font-size:.85rem;font-style:italic;text-align:left;opacity:.8}
.article h1{font-family:var(--texte);font-weight:700;font-size:clamp(1.8rem,5.2vw,2.5rem);line-height:1.2;color:var(--rouge);margin:10px 0 8px}
.article .meta{font-size:.9rem;font-style:italic;text-align:left;opacity:.8;margin-bottom:26px}
.corps h2,.page h2{text-align:left;font-size:1.45rem;margin:1.6em 0 .5em}
.corps h2:after,.page h2:after{display:none}
.corps p,.page p{text-align:left}
.corps ul,.corps ol,.page ul,.page ol{margin:.6em 0 .6em 1.4em}
.corps li,.page li{padding:2px 0}
.corps a,.page a{color:var(--rouge)}
.encart{margin:36px 0 10px;padding:16px 20px;border:2px dashed var(--rouge);text-align:center}
.encart a{color:var(--rouge);font-weight:700}
.suite-titre{font-size:1.4rem!important;margin-top:40px!important}
.page .box{background:#fffdf6;border:4px double var(--rouge);padding:26px clamp(18px,4vw,36px);text-align:center;margin:26px 0}
.page .box h2{text-align:center;margin-top:0}
.page .box h2:after{display:block}
.page .box p{text-align:center}
.page .box b{color:var(--rouge)}

.btn{display:inline-block;background:var(--rouge);color:#fffdf6!important;text-decoration:none;font-weight:700;padding:12px 24px;margin:8px 6px 0;border:2px solid var(--rouge)}
.btn:hover{background:#fffdf6;color:var(--rouge)!important}
.btn.alt{background:transparent;color:var(--rouge)!important}
.btn.alt:hover{background:var(--rouge);color:#fffdf6!important}

footer{background:var(--ardoise);color:var(--craie);padding:34px 20px 40px;text-align:center;font-size:.9rem;border-top:10px solid #6b4a2b}
footer div{max-width:720px;margin:0 auto}
footer div+div{margin-top:8px}
footer .t{font-family:var(--craie-font);font-size:1.5rem}
footer a{color:var(--craie)}

/* grand écran : on occupe la largeur */
@media(min-width:1000px){
body{font-size:19px}
.nav-in{max-width:1400px;padding:12px 40px}
.carte{max-width:1400px;width:calc(100% - 80px);margin:48px auto;padding:56px 72px}
.ardoise .in{max-width:1100px}
footer div{max-width:1000px}
/* accueil : derniers articles sur 2 colonnes */
.carte section:first-child{display:grid;grid-template-columns:1fr 1fr;column-gap:56px}
.carte section:first-child>h2,.carte section:first-child>.centre{grid-column:1/-1}
/* blog : liste sur 2 colonnes */
.carte:has(>.filtres){display:grid;grid-template-columns:1fr 1fr;column-gap:56px}
.carte:has(>.filtres)>h1,.carte:has(>.filtres)>.lead,.carte:has(>.filtres)>.filtres,.carte:has(>.filtres)>.centre{grid-column:1/-1}
/* articles et pages : texte centré, lisible, dans la grande carte */
.article.carte>*,.page.carte>*{max-width:1000px;margin-left:auto;margin-right:auto}
.article.carte>.billet{width:100%}
.article.carte>.suite-titre{text-align:center!important}
}