:root{--accent:#1f3d68;--coin:#c26a24;--coton:#fbfcfe;--doux:#4b5a6f;--e1:#1f3d68;--e2:#d39a35;--e3:#2b7a8c;--e4:#b8513f;--etoffe:#f4f7fb;--fil:#d0873f;--fond:#e8edf3;--liaison:#b9c8dc;--matelasse:#a8b9d0;--photo:#ffffff;--police-texte:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;--police-titre:"Iowan Old Style","Palatino Linotype","URW Palladio L",P052,serif;--ruban:#e4eaf3;--sur-accent:#ffffff;--texte:#172338;--trame:#d3dde9;}
/* Courtepointe (t2b085) : une courtepointe de blocs cousus. Chaque article est un bloc carré (aspect-ratio 1) bordé d'une
   piqûre, posé dans une trame de bandes de liaison (l'ombre pleine de chaque bloc remplit la gouttière) avec un carré de coin à
   chaque croisement (::before de chaque bloc : quatre carrés en dégradés, calés dans les croisements des gouttières). La une
   (premiere) est le médaillon central, colonnes 2 et 3 sur deux rangées, flanqué par placement dense et bordé d'un biais rayé.
   Bloc sans capture : bande d'étoffe imprimée selon sa place (vichy, rayures, pois, chevrons, écossais : cinq motifs, pour qu'un
   bloc ne touche jamais son pareil sur 2, 3 ou 4 colonnes) et initiale appliquée. Téléphone : deux colonnes, médaillon en tête.
   Palette : --fond --accent --sur-accent --texte --doux --coton --ruban --trame --liaison --coin --fil --matelasse --etoffe
   --e1 --e2 --e3 --e4 --photo. Typo : --police-titre --police-texte. Polices système seulement, aucune ressource externe. */

*,*::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}
a{color:var(--accent);text-decoration-thickness:1px;text-underline-offset:.18em}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
h1,h2,h3{font-family:var(--police-titre);font-weight:700;line-height:1.2}
.vh{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.evitement{position:absolute;top:.75rem;left:.75rem;z-index:30;padding:.75rem 1.25rem;border-radius:8px;background:var(--coton);color:var(--accent);font-weight:700;box-shadow:0 0 0 3px var(--accent);transform:translateY(-12rem)}
.evitement:focus{transform:none}

/* Piqûres : un pointillé posé à --piq du bord de l'élément */
.marque::after,.etiquette::after,.page-plan_du_site .texte h2::after,.bloc::after,.panneau::after,.carre::after,.pied-ecusson::after,.bloc-applique::after,.vide::after{content:"";position:absolute;inset:var(--piq,4px);border:var(--piq-l,1.5px) dashed var(--fil);border-radius:var(--piq-r,3px);pointer-events:none}

/* Carrés de coin : quatre carrés de --g aux croisements des bandes de liaison qui entourent un bloc */
.bloc::before,.panneau::before,.vide::before{content:"";position:absolute;inset:calc(-1 * var(--g) - var(--b,0px));z-index:-1;pointer-events:none;background:linear-gradient(var(--coin) 0 0) 0 0/var(--g) var(--g) no-repeat,linear-gradient(var(--coin) 0 0) 100% 0/var(--g) var(--g) no-repeat,linear-gradient(var(--coin) 0 0) 0 100%/var(--g) var(--g) no-repeat,linear-gradient(var(--coin) 0 0) 100% 100%/var(--g) var(--g) no-repeat}

/* Étiquettes tissées : trame fine, bords piqués ; la courante pleine à l'accent */
.etiquette,.page-plan_du_site .texte h2{--piq:4px;position:relative;display:inline-flex;align-items:center;justify-content:center;gap:.5em;padding:.375rem 1rem;border-radius:6px;background:repeating-linear-gradient(90deg,var(--trame) 0 1px,transparent 0 3px) var(--ruban);color:var(--texte);font-size:.875rem;font-weight:700;line-height:1.35;letter-spacing:.02em;text-decoration:none}
a.etiquette{min-height:2.75rem;padding:.5rem 1.125rem}
a.etiquette:hover{text-decoration:underline}
.etiquette[aria-current],.etiquette-pleine{background:var(--accent);color:var(--sur-accent)}
.etiquette[aria-current]::after,.etiquette-pleine::after{border-color:var(--sur-accent);opacity:.7}
.pagination-sens::before,.retour .etiquette::before{content:"";flex:none;width:.45rem;height:.45rem;border:solid currentColor;border-width:0 0 2px 2px;transform:rotate(45deg)}
.pagination-suivante::before{order:1;transform:rotate(-135deg)}

/* En-tête : bande de liaison matelassée, écusson cousu au centre, menu en trois étiquettes */
.tete{background:repeating-linear-gradient(45deg,transparent 0 1.25rem,var(--matelasse) 0 calc(1.25rem + 1.5px)),repeating-linear-gradient(-45deg,transparent 0 1.25rem,var(--matelasse) 0 calc(1.25rem + 1.5px)) var(--liaison);border-bottom:2px dashed var(--fil)}
.tete-interieur{width:min(100% - 1.5rem,75rem);margin:0 auto;padding:1.25rem 0 1rem;display:flex;flex-direction:column;align-items:center;gap:.875rem}
.ecusson{margin:0;max-width:100%;font-size:1.375rem;line-height:1.15}
.marque{--piq:4px;--piq-r:10px;--piq-l:2px;position:relative;display:flex;align-items:center;gap:.75rem;max-width:100%;min-height:2.75rem;padding:.75rem 1.375rem .75rem .875rem;border-radius:14px;background:var(--coton);color:var(--texte);font-family:var(--police-titre);font-weight:700;text-decoration:none;box-shadow:0 10px 24px -14px rgb(0 0 0 / 55%)}
.marque-image{flex:none;display:block;width:2.5rem;height:2.5rem}
.marque-nom{min-width:0;overflow-wrap:anywhere}
.marque:hover .marque-nom{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:.2em}
.menu{align-self:stretch}
.menu ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,auto);gap:.5rem}
.menu .etiquette{width:100%;padding:.5rem .5rem;font-size:.8125rem;text-align:center}

/* Contenu */
.principal{flex:1 0 auto;width:min(100% - 1.5rem,75rem);margin:0 auto;padding-top:1.75rem}
.principal-texte{width:min(100% - 1.5rem,54rem)}
.principal-texte.page-plan_du_site{width:min(100% - 1.5rem,75rem)}
.rubrique{display:flex;align-items:center;gap:.75rem;margin:0 0 .875rem;font-size:1rem}
.rubrique::before,.rubrique::after{content:"";flex:1;border-top:2px dashed var(--fil)}
.rubrique .etiquette{font-size:.9375rem}
.vide{--g:1rem;--piq:6px;position:relative;isolation:isolate;margin:var(--g);padding:2rem;background:var(--coton);box-shadow:0 0 0 var(--g) var(--liaison);color:var(--doux);text-align:center}

/* Le quilt : blocs carrés dans les bandes de liaison (ombre pleine de --g), gouttières de --g */
.quilt{--g:.5rem;list-style:none;margin:0;padding:var(--g);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-flow:row dense;gap:var(--g)}
.bloc{--p:.5rem;--piq:4px;position:relative;isolation:isolate;container-type:inline-size;display:flex;flex-direction:column;gap:.5rem;min-width:0;aspect-ratio:1;place-self:stretch;padding:var(--p);background:var(--coton);box-shadow:0 0 0 var(--g) var(--liaison)}
.bloc:focus-within{z-index:2}
.bloc-capture{display:block;flex:0 1 auto;width:100%;height:auto;aspect-ratio:16/9;min-height:2.5rem;object-fit:cover;object-position:50% 0;border-radius:3px;background:var(--etoffe);box-shadow:0 0 0 1px var(--liaison)}
.bloc-etoffe{display:grid;place-items:center;flex:1 1 0;min-height:2.5rem;border-radius:3px}
.bloc-texte{display:flex;flex-direction:column;gap:.1875rem;flex:1 1 0;min-width:0}
.bloc-image .bloc-texte{flex:1 0 auto}
.bloc-titre{margin:0;font-size:clamp(.875rem,7cqi,1.1875rem);line-height:1.2;overflow-wrap:anywhere}
.bloc-lien{color:var(--texte);text-decoration:none}
.bloc-lien::after{content:"";position:absolute;inset:0;z-index:1}
.bloc:hover .bloc-lien{text-decoration:underline;text-decoration-thickness:2px}
.bloc-lien:focus-visible{outline:0}
.bloc-lien:focus-visible::after{outline:3px solid var(--accent);outline-offset:3px}
.bloc-date{margin:0;color:var(--doux);font-size:.75rem;line-height:1.3}
.bloc-extrait{display:none;margin:.125rem 0 0;font-size:.8125rem;line-height:1.4;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
@container (min-width:12rem){.bloc-extrait{display:-webkit-box}}
@container (min-width:15rem){.bloc-date{font-size:.8125rem}.bloc-extrait{font-size:.875rem}}
.bloc-vide{background:repeating-linear-gradient(45deg,transparent 0 .75rem,var(--trame) 0 calc(.75rem + 1px)),repeating-linear-gradient(-45deg,transparent 0 .75rem,var(--trame) 0 calc(.75rem + 1px)) var(--etoffe)}
.bloc-applique{--piq:3px;--piq-r:50%;position:relative;display:grid;place-items:center;width:2rem;height:2rem;border-radius:50%;background:var(--coton);color:var(--accent);font-family:var(--police-titre);font-size:.9375rem;font-weight:700;line-height:1;box-shadow:0 1px 4px rgb(0 0 0 / 30%)}

/* Étoffes imprimées des blocs sans capture, selon la place : vichy, rayures, pois, chevrons, écossais */
.bloc-etoffe,.trou span{--vm:color-mix(in srgb,var(--e1) 50%,var(--etoffe));--ec:color-mix(in srgb,var(--e3) 45%,transparent);background-color:var(--etoffe);background-size:1rem 1rem}
.bloc:nth-child(5n+1) .bloc-etoffe,.trou span:nth-child(odd){background-image:conic-gradient(var(--e1) 25%,var(--vm) 0 50%,transparent 0 75%,var(--vm) 0)}
.bloc:nth-child(5n+2) .bloc-etoffe,.trou span:nth-child(2){background-image:repeating-linear-gradient(90deg,var(--e2) 0 .25rem,transparent 0 .5rem,var(--e2) 0 .625rem,transparent 0 1.25rem);background-size:auto}
.bloc:nth-child(5n+3) .bloc-etoffe,.trou span:nth-child(4){background-color:var(--e3);background-image:radial-gradient(circle,var(--etoffe) .1875rem,transparent calc(.1875rem + .5px)),radial-gradient(circle,var(--etoffe) .1875rem,transparent calc(.1875rem + .5px));background-size:.875rem .875rem;background-position:0 0,.4375rem .4375rem}
.bloc:nth-child(5n+4) .bloc-etoffe,.trou span:nth-child(6){background-image:linear-gradient(135deg,var(--e4) 25%,transparent 0),linear-gradient(225deg,var(--e4) 25%,transparent 0),linear-gradient(315deg,var(--e4) 25%,transparent 0),linear-gradient(45deg,var(--e4) 25%,transparent 0);background-position:-.5rem 0,-.5rem 0,0 0,0 0}
.bloc:nth-child(5n) .bloc-etoffe,.trou span:nth-child(8){background-image:repeating-linear-gradient(90deg,transparent 0 .5rem,var(--ec) 0 1rem,transparent 0 1.25rem,var(--e2) 0 1.375rem),repeating-linear-gradient(0deg,transparent 0 .5rem,var(--ec) 0 1rem,transparent 0 1.25rem,var(--e2) 0 1.375rem);background-size:auto}

/* Le médaillon : la une, bordée d'un biais rayé ; grande capture brodée d'une double piqûre, ou étoffe vichy à l'accent */
.bloc-une{--p:.75rem;--b:.5rem;--piq:.375rem;grid-column:1/-1;aspect-ratio:auto;gap:.625rem;border:var(--b) solid transparent;background:linear-gradient(var(--coton) 0 0) padding-box,repeating-linear-gradient(45deg,var(--e2) 0 .3125rem,var(--etoffe) 0 .625rem) border-box}
.bloc-une .bloc-capture{width:calc(100% - .75rem);min-height:7rem;margin:.375rem;padding:.25rem;border:2px dashed var(--fil);border-radius:8px;outline:1.5px dashed var(--fil);outline-offset:3px;background:var(--coton);box-shadow:none}
.bloc-une .bloc-lien::after{inset:calc(-1 * var(--b))}
.bloc-une .bloc-etoffe{flex-grow:3;min-height:7rem;background-size:1.5rem 1.5rem}
.bloc-une .bloc-texte{flex-grow:2}
.bloc-une .bloc-applique{width:3.5rem;height:3.5rem;font-size:1.625rem}
.bloc-etiquette{margin:0 0 .25rem}
.bloc-une .bloc-titre{font-size:clamp(1.375rem,6.5cqi,2.25rem);line-height:1.15}
.bloc-une .bloc-date{font-size:.875rem}
.bloc-une .bloc-extrait{display:-webkit-box;margin-top:.25rem;font-size:1rem;line-height:1.5;-webkit-line-clamp:3}

/* Pagination : petits carrés cousus sur une bande de liaison, le courant plein à l'accent */
.pagination{display:grid;grid-template-columns:auto auto;justify-content:space-between;grid-template-areas:"prec suiv" "pages pages";align-items:center;gap:1rem .5rem;margin:2.25rem 0 0}
.pagination-precedente{grid-area:prec;justify-self:start}
.pagination-suivante{grid-area:suiv;justify-self:end}
.pagination-pages{grid-area:pages;justify-self:center;list-style:none;margin:0;padding:.375rem;display:flex;flex-wrap:wrap;justify-content:center;gap:.375rem;background:var(--liaison)}
.carre{--piq:4px;position:relative;display:flex;align-items:center;justify-content:center;width:2.75rem;height:2.75rem;background:var(--coton);color:var(--texte);font-weight:700;text-decoration:none}
a.carre:hover{text-decoration:underline}
.carre[aria-current]{background:var(--accent);color:var(--sur-accent)}
.carre[aria-current]::after{border-color:var(--sur-accent);opacity:.7}

/* Article et pages : un grand bloc piqué dans sa bande de liaison, étoffe à fines rayures en tête */
.panneau{--g:.625rem;--piq:.375rem;--piq-r:6px;position:relative;isolation:isolate;margin:var(--g);padding:1.25rem 1.125rem 1.75rem;background:var(--coton);box-shadow:0 0 0 var(--g) var(--liaison)}
.panneau-etoffe{display:block;height:2.25rem;margin:0 0 1.25rem;border-radius:3px;background:repeating-linear-gradient(90deg,var(--e1) 0 2px,var(--etoffe) 0 6px,var(--e2) 0 7px,var(--etoffe) 0 11px)}
.panneau-titre{margin:0 0 1.25rem;font-size:clamp(1.5rem,1.1rem + 2vw,2.5rem);line-height:1.15;letter-spacing:-.01em;overflow-wrap:anywhere}
.panneau-suite{color:var(--doux);font-weight:400}
.panneau-date{margin:0 0 1.75rem}
.panneau-date .etiquette{gap:.3em}
.texte{max-width:44rem;margin:0 auto;font-size:1.0625rem;line-height:1.7}
.texte > :first-child{margin-top:0}
.texte > :last-child{margin-bottom:0}
.texte p,.texte ul,.texte ol{margin:0 0 1.1em}
.texte h2{margin:2rem 0 .75rem;font-size:1.3125rem}
.texte a{overflow-wrap:anywhere}
.texte ul{padding-left:1.25rem}
.texte li::marker{color:var(--accent)}
.texte img{display:block;width:100%;height:auto;margin:1.75rem 0;padding:.625rem;border:1px solid var(--trame);border-radius:6px;background:var(--photo);outline:1.5px dashed var(--fil);outline-offset:-.375rem;box-shadow:0 8px 20px -12px rgb(0 0 0 / 45%)}
.retour{margin:2.25rem 0 0;text-align:center}

/* Pages de service */
.page-plan_du_site .texte{max-width:none;font-size:1rem}
.page-plan_du_site .texte h2{display:flex;width:fit-content;margin:2rem 0 1rem;font-size:.9375rem}
.page-plan_du_site .texte > ul{list-style:none;padding:0;columns:3 15rem;column-gap:2rem}
.page-plan_du_site .texte > ul:first-child{columns:auto;display:flex;flex-wrap:wrap;gap:.25rem 1.5rem}
.page-plan_du_site .texte li{break-inside:avoid;margin:0;padding:.1875rem 0}
.page-plan_du_site nav ul{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:.5rem}
.page-plan_du_site nav li{padding:0}
.page-plan_du_site nav a,.page-plan_du_site nav b{display:flex;align-items:center;min-height:2.75rem;padding:.5rem 1rem;border-radius:4px;background:var(--ruban)}
.page-plan_du_site nav b{background:var(--accent);color:var(--sur-accent)}
.page-contact .texte iframe{margin:1.5rem 0 .75rem;border-radius:6px;background:var(--etoffe);outline:2px dashed var(--fil);outline-offset:.25rem;box-shadow:0 0 0 .5rem var(--ruban)}
.panneau-404{text-align:center}
.trou{display:grid;grid-template-columns:repeat(3,2.75rem);gap:.375rem;width:max-content;margin:.5rem auto 1.5rem;padding:.375rem;background:var(--liaison)}
.trou span{aspect-ratio:1;border-radius:2px}
.trou span:nth-child(5){background:var(--fond);outline:2px dashed var(--fil);outline-offset:-5px}

/* Pied : bordure de quilt, carrés de coin aux extrémités, écusson du nom, liens en étiquettes */
.pied{margin-top:3.5rem;background:var(--liaison);color:var(--texte)}
.pied-bordure{width:min(100% - 1.5rem,75rem);margin:0 auto;padding:1.25rem 0;display:flex;flex-direction:column;align-items:center;gap:1.25rem;text-align:center}
.pied-bordure::before,.pied-bordure::after{content:"";align-self:stretch;height:1rem;background:linear-gradient(var(--coin) 0 0) 0 0/1rem 1rem no-repeat,linear-gradient(var(--coin) 0 0) 100% 0/1rem 1rem no-repeat,repeating-linear-gradient(90deg,var(--e1) 0 .25rem,var(--etoffe) 0 .5rem) 1.25rem 0/calc(100% - 2.5rem) 100% no-repeat}
.pied-ecusson{--piq:4px;--piq-r:10px;position:relative;display:flex;flex-direction:column;align-items:center;max-width:100%;margin:0;padding:.875rem 1.5rem;border-radius:14px;background:var(--coton);box-shadow:0 10px 24px -14px rgb(0 0 0 / 55%)}
.pied-nom{font-family:var(--police-titre);font-size:1.25rem;font-weight:700;line-height:1.2;overflow-wrap:anywhere}
.pied-domaine{color:var(--doux);font-size:.875rem;overflow-wrap:anywhere}
.pied-liens{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem}

/* Blocs à venir (unis, matelassés et piqués) : ils finissent la dernière rangée du quilt, jamais une rangée de plus (selon le
   nombre de colonnes ; quatre au plus, pour la page d'un seul article). Téléphone : titres de 13 à 14 px pour que les domaines
   longs tiennent dans leur bloc, liens du plan du site hauts de 44 px. */
@media (max-width:39.99rem){
.bloc-vide:nth-child(2n),.bloc-vide:nth-child(2n)~*{display:none}
.bloc-titre{font-size:clamp(.8125rem,9cqi,.875rem)}
.page-plan_du_site .texte li{padding:0}
.page-plan_du_site .texte > ul a{display:flex;align-items:center;min-height:2.75rem}
}
@media (min-width:40rem) and (max-width:63.99rem){.bloc-vide:nth-child(3n+4),.bloc-vide:nth-child(3n+4)~*{display:none}}
@media (min-width:64rem){.bloc-vide:nth-child(4n+6),.bloc-vide:nth-child(4n+6)~*{display:none}}

/* Tablette : trois colonnes, le médaillon sur deux colonnes et deux rangées */
@media (min-width:40rem){
.tete-interieur,.principal,.pied-bordure,.principal-texte.page-plan_du_site{width:min(100% - 3rem,75rem)}
.principal-texte{width:min(100% - 3rem,54rem)}
.tete-interieur{padding:2rem 0 1.5rem;gap:1.125rem}
.ecusson{font-size:1.75rem}
.marque{gap:.875rem;padding:.875rem 1.75rem .875rem 1rem}
.marque-image{width:3rem;height:3rem}
.menu ul{display:flex;flex-wrap:wrap;justify-content:center}
.menu .etiquette{width:auto;padding:.5rem 1.25rem;font-size:.875rem}
.principal{padding-top:2.5rem}
.rubrique{margin-bottom:1.25rem}
.quilt{--g:1rem;grid-template-columns:repeat(3,minmax(0,1fr))}
.bloc{--p:.875rem;--piq:.5rem}
.bloc-applique{width:2.5rem;height:2.5rem;font-size:1.125rem}
.bloc-une{--p:1rem;grid-column:1/span 2;grid-row:1/span 2;aspect-ratio:1}
.bloc-une .bloc-applique{width:4.5rem;height:4.5rem;font-size:2.125rem}
.panneau{--g:1rem;padding:2rem 2.5rem 2.5rem}
.page-contact .texte iframe{margin:1.75rem 0 1rem;outline-offset:.5rem;box-shadow:0 0 0 1rem var(--ruban)}
.pied-bordure{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:1.5rem 2rem;padding:1.75rem 0;text-align:left}
.pied-bordure::before,.pied-bordure::after{grid-column:1/-1}
.pied-ecusson{align-items:flex-start}
.pied-liens{display:grid;grid-template-columns:repeat(2,auto);justify-content:end}
.pied-liens .etiquette{width:100%}
}

/* Ordinateur : quatre colonnes, le médaillon au centre (colonnes 2 et 3) */
@media (min-width:64rem){
.quilt{grid-template-columns:repeat(4,minmax(0,1fr))}
.bloc-une{--p:1.25rem;grid-column:2/span 2}
.panneau{padding:2.5rem 4rem 3rem}
.pied-liens{display:flex}
.pagination{display:flex;flex-wrap:wrap;justify-content:center;gap:1rem}
}
