:root{--accent:#1f5e6b;--doux:#5f5d57;--filet:#e4e1d8;--fond:#f9f8f4;--police-texte:"Iowan Old Style","Palatino Linotype","URW Palladio L",P052,serif;--police-titre:"Iowan Old Style","Palatino Linotype","URW Palladio L",P052,serif;--surface:#f0eee7;--texte:#25231f;}
/* Carnet (t2b02) : blog personnel en colonne unique, dates dans la marge.
   Variables des options (manifest.json) : palette --fond --surface --texte --doux --accent --filet ;
   typo --police-titre --police-texte. Polices système seulement, aucune ressource externe. */
:root{--marge:9rem;--gouttiere:2.25rem;--decalage:calc(var(--marge) + var(--gouttiere))}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;min-height:100vh;display:flex;flex-direction:column;background:var(--fond);color:var(--texte);font-family:var(--police-texte);font-size:1rem;line-height:1.6;overflow-wrap:break-word}
img{max-width:100%;height:auto}
h1,h2,h3,p,ul,ol{margin:0}
h1,h2,h3{font-family:var(--police-titre);font-weight:700;line-height:1.2}
a{color:var(--accent);text-decoration-thickness:1px;text-underline-offset:.2em}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
::selection{background:var(--accent);color:var(--fond)}

.masque{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.evitement{position:absolute;left:1rem;top:-6rem;z-index:10;padding:.7rem 1.1rem;background:var(--accent);color:var(--fond);font-weight:700;text-decoration:none}
.evitement:focus{top:0}
.evitement:focus-visible{outline-color:var(--texte)}

.colonne{width:calc(100% - 2.5rem);max-width:38rem;margin-left:auto;margin-right:auto}

/* En-tête : la marque, le nom et le domaine ; le menu */
.entete{padding-top:1.5rem}
.marque{display:inline-grid;grid-template-columns:auto minmax(0,auto);column-gap:.85rem;align-items:center;color:var(--texte);text-decoration:none}
.marque-image{grid-row:1/3;display:block;width:2.5rem;height:2.5rem}
.marque-nom,.marque-domaine{grid-column:2}
.marque-nom{font-family:var(--police-titre);font-size:1.3rem;font-weight:700;line-height:1.15;align-self:end;overflow-wrap:anywhere;text-wrap:balance}
.marque-domaine{font-family:var(--police-titre);font-style:italic;font-size:.875rem;line-height:1.4;color:var(--doux);align-self:start;margin-top:.1rem}
.marque:hover .marque-nom{color:var(--accent)}
.menu{margin-top:1rem;border-top:1px solid var(--filet);border-bottom:1px solid var(--filet)}
.menu ul{list-style:none;padding:0;display:flex;flex-wrap:wrap;column-gap:1.4rem}
.menu a{display:inline-flex;align-items:center;min-height:2.75rem;color:var(--texte);text-decoration:none}
.menu a:hover{color:var(--accent);text-decoration:underline}
.menu a[aria-current="page"]{color:var(--accent);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:.45em}

.principal{flex:1 0 auto;padding-top:2rem}

/* Accueil : le journal */
.rubrique{font-family:var(--police-texte);font-size:.75rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--doux);padding-bottom:.5rem}
.journal{list-style:none;padding:0}
.entree{display:grid;grid-template-columns:minmax(0,1fr);align-items:start;padding:1.6rem 0}
.entree+.entree{border-top:1px solid var(--filet)}
.entree-avec-image{grid-template-columns:minmax(0,1fr) 5.5rem;column-gap:1rem}
.entree-date,.billet-date{font-family:var(--police-titre);font-style:italic;font-variant-numeric:oldstyle-nums;color:var(--doux)}
.entree-date{grid-column:1/-1;font-size:.875rem;margin-bottom:.2rem}
.entree-titre{grid-column:1/-1;font-size:1.25rem;line-height:1.25;overflow-wrap:anywhere}
.entree-titre a{color:var(--texte);text-decoration:none}
.entree-titre a:hover{color:var(--accent);text-decoration:underline;text-decoration-thickness:1px}
.entree-extrait{grid-column:1;margin-top:.45rem;font-size:.97rem;line-height:1.6}
.entree-vignette{grid-column:2;grid-row:3;display:block;margin-top:.7rem}
.entree-vignette img{display:block;width:5.5rem;height:5.5rem;object-fit:cover;border:1px solid var(--filet);background:var(--surface)}
.vide{color:var(--doux);padding:2rem 0}

/* Pagination : précédente, numéros (la page courante cerclée), suivante */
.pagination{display:grid;grid-template-columns:minmax(0,1fr);row-gap:.5rem;margin-top:1.5rem;padding-top:1.25rem;border-top:1px solid var(--filet)}
.pagination-precedente,.pagination-suivante{display:inline-flex;align-items:center;min-height:2.75rem}
.pagination-precedente{justify-self:start}
.pagination-suivante{justify-self:end}
.pagination-numeros{list-style:none;padding:0;display:grid;grid-template-columns:repeat(5,2.75rem);gap:.25rem .5rem}
.pagination-numeros a,.pagination-courante{position:relative;display:flex;align-items:center;justify-content:center;width:2.75rem;height:2.75rem;border-radius:50%;text-decoration:none}
.pagination-numeros a{color:var(--texte)}
.pagination-numeros a:hover{color:var(--accent);text-decoration:underline}
.pagination-courante{border:1px solid var(--accent);color:var(--accent);font-weight:700}

/* Article et pages */
.billet-entete{margin-bottom:2rem}
.billet-date{font-size:.9375rem;margin-bottom:.5rem}
.billet-publie{font-family:var(--police-texte);font-style:normal;font-size:.6875rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;margin-right:.35rem}
.billet-titre{font-size:clamp(1.75rem,1.2rem + 2.4vw,2.4rem);line-height:1.15;overflow-wrap:anywhere}
.texte{font-size:1.0625rem;line-height:1.7}
.texte p,.texte ul,.texte ol{margin-bottom:1.15em}
.texte a{overflow-wrap:anywhere}
.texte h2{font-size:1.35rem;margin:2.2em 0 .6em;text-wrap:balance}
.texte h3{font-size:1.15rem;margin:1.8em 0 .5em}
.texte ul,.texte ol{padding-left:1.3rem}
.texte li{margin-bottom:.45em}
.texte li::marker{color:var(--accent)}
.texte img{display:block;width:100%;margin:2rem 0;border:1px solid var(--filet);background:var(--surface)}
.retour{margin-top:3rem;padding-top:1.25rem;border-top:1px solid var(--filet)}
.retour a{display:inline-flex;align-items:center;min-height:2.75rem}

/* Contact : le cadre du formulaire */
.page-contact iframe{margin:2rem 0;background:var(--surface);border-radius:.375rem;box-shadow:0 0 0 1px var(--filet)}

/* Plan du site */
.page-plan_du_site .texte{font-size:1rem}
.page-plan_du_site .texte ul{list-style:none;padding:0}
.page-plan_du_site .texte li{margin:0}
.page-plan_du_site .texte li a{display:block;padding:.55rem 0}
.texte nav{margin-top:2.5rem;padding-top:1rem;border-top:1px solid var(--filet)}
.texte nav h2{margin:0;font-family:var(--police-texte);font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;color:var(--doux)}
.page-plan_du_site .texte nav ul{display:flex;flex-wrap:wrap;column-gap:1.5rem}
.page-plan_du_site .texte nav li a,.texte nav b{display:inline-flex;align-items:center;min-height:2.75rem;padding:0}
.texte nav b{color:var(--texte)}

/* Pied */
.pied{margin-top:4rem;background:var(--surface);border-top:1px solid var(--filet);padding:2.25rem 0 2.5rem}
.pied-signature{display:inline-grid;grid-template-columns:auto minmax(0,auto);column-gap:.75rem;align-items:center}
.pied-marque{grid-row:1/3;display:block;width:2rem;height:2rem}
.pied-nom,.pied-domaine{grid-column:2}
.pied-nom{font-family:var(--police-titre);font-size:1.1rem;font-weight:700;line-height:1.2;align-self:end;overflow-wrap:anywhere}
.pied-domaine{font-family:var(--police-titre);font-style:italic;font-size:.875rem;line-height:1.4;color:var(--doux);align-self:start}
.pied-liens{list-style:none;padding:0;margin-top:1rem;display:flex;flex-wrap:wrap;column-gap:1.4rem}
.pied-liens a{display:inline-flex;align-items:center;min-height:2.75rem;font-size:.9375rem;color:var(--texte)}
.pied-liens a:hover{color:var(--accent)}

/* Ordinateur et tablette : colonne de 45 rem, dates dans la marge gauche */
@media (min-width:48rem){
.colonne{width:calc(100% - 4rem);max-width:45rem}
.entete{padding-top:3rem}
.entete-colonne{display:flex;align-items:center;justify-content:space-between;gap:1.75rem;padding-bottom:2.25rem;border-bottom:1px solid var(--filet)}
.marque{column-gap:1rem;margin-left:calc(var(--decalage) - 3.75rem)}
.marque-image{width:2.75rem;height:2.75rem}
.marque-nom{font-size:1.375rem}
.menu{flex-shrink:0;margin:0;border:0}
.menu ul{column-gap:1.4rem}
.principal{padding-top:3rem}
.rubrique,.texte,.retour,.vide{margin-left:var(--decalage)}
.pagination{grid-template-columns:var(--marge) var(--gouttiere) minmax(0,1fr) auto;align-items:start}
.pagination-precedente,.pagination-suivante{min-height:2.5rem}
.pagination-precedente{grid-column:1;grid-row:1;justify-self:end;text-align:right}
.pagination-numeros{grid-column:3;grid-row:1;display:flex;flex-wrap:wrap;gap:0}
.pagination-numeros a,.pagination-courante{width:2.5rem;height:2.5rem}
.pagination-suivante{grid-column:4;grid-row:1;margin-left:1rem}
.entree{grid-template-columns:var(--marge) minmax(0,1fr);grid-template-rows:auto 1fr;column-gap:var(--gouttiere);align-items:baseline;padding:2rem 0}
.entree-avec-image{grid-template-columns:var(--marge) minmax(0,1fr) 6.5rem}
.entree-date{grid-column:1;grid-row:1;text-align:right;margin:0;white-space:nowrap}
.entree-titre{grid-column:2;grid-row:1;font-size:1.7rem}
.entree-extrait{grid-column:2;grid-row:2;align-self:start;font-size:1.0625rem;margin-top:.55rem}
.entree-vignette{grid-column:3;grid-row:1/3;align-self:start;margin-top:.3rem}
.entree-vignette img{width:6.5rem;height:6.5rem}
.billet-entete{display:grid;grid-template-columns:var(--marge) minmax(0,1fr);column-gap:var(--gouttiere);align-items:baseline;margin-bottom:2.5rem}
.billet-date{grid-column:1;grid-row:1;text-align:right;margin:0}
.billet-publie{display:block;margin:0 0 .15rem}
.billet-titre{grid-column:2;grid-row:1}
.texte{font-size:1.125rem}
.page-plan_du_site .texte li a{padding:.2rem 0}
.pied-colonne{padding-left:var(--decalage)}
.pied-signature{margin-left:-2.75rem}
}