/* ==========================================================================
   CSF — feuille unique (maquette « 1b — Blocs couleur »)
   Points de rupture : mobile ≤ 640 px, bureau ≥ 1100 px.
   ========================================================================== */

/* Polices (variables : un fichier par écriture couvre toutes les graisses) */
@font-face { font-family: "Gabarito"; src: url("../fonts/gabarito-latin.woff2") format("woff2"); font-weight: 400 900; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Gabarito"; src: url("../fonts/gabarito-latin-ext.woff2") format("woff2"); font-weight: 400 900; font-display: swap; unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Figtree"; src: url("../fonts/figtree-latin.woff2") format("woff2"); font-weight: 300 900; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Figtree"; src: url("../fonts/figtree-latin-ext.woff2") format("woff2"); font-weight: 300 900; font-display: swap; unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Caveat"; src: url("../fonts/caveat-latin.woff2") format("woff2"); font-weight: 400 700; font-display: swap; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Caveat"; src: url("../fonts/caveat-latin-ext.woff2") format("woff2"); font-weight: 400 700; font-display: swap; unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF; }

/* Jetons */
:root {
	/* Bleu de la maquette légèrement assombri (+ plugin csf-core) : le blanc dessus atteint 4,5:1, les petits textes blancs passent l'audit de contraste. */
	--csf-blue: #0A7AC0;
	--csf-blue-dark: #0B5C96;
	--csf-green: #7AB51D;
	--csf-orange: #F28C1E;
	--csf-violet: #6B3FA0;
	--csf-ink: #14243A;
	--csf-cream: #FAF8F3;
	--csf-white: #FFFFFF;
	--csf-muted: #4A5768;
	--csf-line: #E8E3D8;
	--csf-line-light: #EEE9DE;
	--csf-border: #D8D2C4;
	--csf-grey: #6E7681;
	--csf-hover: #F3EFE6;
	--csf-closed: #9AA3AE;
	--csf-font-title: "Gabarito", system-ui, sans-serif;
	--csf-font-text: "Figtree", system-ui, sans-serif;
	--csf-max: 1280px;
	--csf-gutter: clamp(18px, 3.75vw, 48px);
	/* Accent par défaut (bleu) ; redéfini sur les éléments colorés. */
	--accent: var(--csf-blue);
	--on-accent: var(--csf-white);
	--accent-dark: var(--csf-blue-dark);
	--accent-soft: #DCEBF7;
}

/* Base */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
	margin: 0;
	background: var(--csf-cream);
	color: var(--csf-ink);
	font: 400 16px/1.5 var(--csf-font-text);
	overflow-wrap: break-word;
	hyphens: manual;
}
body > * { max-width: var(--csf-max); margin-inline: auto; }
body > .csf-topbar, body > .csf-footer { max-width: none; }

/* Grands écrans : la composition de la maquette (1280 px) est agrandie proportionnellement
   au lieu de rester une colonne étroite. Les paliers en dessous de 1500 px sont inchangés. */
/* Le bandeau et le panneau des cookies calculent leur position en pixels de fenêtre :
   l'agrandissement est annulé sur leur racine (zoom effectif 1). */
@media (min-width: 1500px) { html { zoom: 1.15; } #tarteaucitronRoot { zoom: calc(1 / 1.15); } }
@media (min-width: 1800px) { html { zoom: 1.35; } #tarteaucitronRoot { zoom: calc(1 / 1.35); } }
@media (min-width: 2200px) { html { zoom: 1.55; } #tarteaucitronRoot { zoom: calc(1 / 1.55); } }
@media (min-width: 2500px) { html { zoom: 1.75; } #tarteaucitronRoot { zoom: calc(1 / 1.75); } }
img { max-width: 100%; height: auto; display: block; }
a { color: #0A6BB0; text-decoration: none; }
a:hover { color: var(--csf-blue-dark); text-decoration: underline; }
h1, h2, h3 { font-family: var(--csf-font-title); margin: 0; }
:focus-visible { outline: 3px solid var(--csf-ink); outline-offset: 2px; }
h1, h2, h3 { hyphens: auto; }
.csf-only-mobile { display: none; }
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.csf-skip { position: absolute; left: 12px; top: -60px; z-index: 100000; background: var(--csf-ink); color: var(--csf-white); padding: 12px 18px; border-radius: 12px; font-weight: 800; }
.csf-skip:focus { top: 12px; color: var(--csf-white); }

/* Pastille d'état (vert ouvert, gris fermé) */
.csf-dot { display: inline-block; flex: none; width: 8px; height: 8px; border-radius: 50%; background: var(--csf-closed); }
.csf-dot--open { background: var(--csf-green); }

/* Bandeau des sites (bureau) */
.csf-topbar { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 8px 28px; padding: 10px 40px; background: var(--csf-blue-dark); color: var(--csf-white); font-size: 14px; line-height: 1.2; }
.csf-topbar__site { display: flex; align-items: center; gap: 8px; }
.csf-topbar a { color: var(--csf-white); }
.csf-topbar__status { opacity: .85; }

/* En-tête et logo */
.csf-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 40px; position: relative; }
.csf-logo { display: flex; align-items: center; gap: 14px; text-decoration: none; }
.csf-logo:hover { text-decoration: none; }
.csf-logo__mark { width: 60px; height: 60px; border-radius: 14px; background: var(--csf-blue); color: var(--csf-white); display: flex; align-items: center; justify-content: center; text-align: center; font: 700 21px/.82 "Caveat", cursive; transform: rotate(-5deg); box-shadow: inset 0 -6px 0 rgba(0, 0, 0, .14); }
.csf-logo__name { border-left: 4px solid var(--csf-green); padding-left: 12px; font: 800 20px/1.02 var(--csf-font-title); color: var(--csf-blue-dark); }

/* Pied de page */
.csf-footer { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 16px 24px; padding: 30px 48px; background: var(--csf-ink); color: var(--csf-white); font-size: 14px; }
.csf-footer__name { font: 800 20px var(--csf-font-title); }
.csf-footer__address { margin: 6px 0 0; font-size: 13px; opacity: .8; }
.csf-footer__address a { color: var(--csf-white); display: inline-flex; align-items: center; min-height: 32px; }
.csf-footer__links { display: flex; flex-wrap: wrap; gap: 8px 20px; }
.csf-footer__links a { color: var(--csf-white); display: inline-flex; align-items: center; min-height: 44px; }
.csf-footer__years { opacity: .8; }
.csf-footer__credit { flex-basis: 100%; text-align: right; opacity: .8; font-size: 13px; }
.csf-footer__credit a { color: var(--csf-white); font-weight: 700; text-decoration: none; }
.csf-footer__credit a:hover, .csf-footer__credit a:focus-visible { color: var(--csf-white); text-decoration: underline; text-underline-offset: 2px; }

/* Pages simples (repli, mentions légales…) : complétées à la tâche 11 */
.csf-page { padding: 40px var(--csf-gutter) 72px; }
.csf-page__title { font: 900 clamp(40px, 5vw, 56px)/1 var(--csf-font-title); letter-spacing: -.03em; margin-bottom: 24px; }

@media (max-width: 640px) {
	.csf-topbar { display: none; }
	.csf-header { padding: 16px 18px; }
	.csf-logo { gap: 10px; }
	.csf-logo__mark { width: 44px; height: 44px; border-radius: 11px; font-size: 15px; box-shadow: none; }
	.csf-logo__name { border-left-width: 3px; padding-left: 9px; font-size: 15px; }
	.csf-footer { justify-content: flex-start; align-items: center; gap: 0 6px; padding: 20px; font-size: 13px; }
	.csf-footer__years { order: 1; opacity: 1; }
	.csf-footer__id { order: 2; }
	.csf-footer__name { font: 400 13px var(--csf-font-text); }
	.csf-footer__address { margin-top: 2px; }
	.csf-footer__links { order: 3; flex-basis: 100%; gap: 0 16px; font-size: 14px; }
	.csf-footer__credit { order: 4; margin-top: 8px; }
}

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { transition: none !important; animation: none !important; }
	.csf-logo__mark { transform: none; }
}

/* ==========================================================================
   Navigation (bureau ≥ 1100 px : pilules ; en dessous : bouton Menu)
   ========================================================================== */
.csf-nav { display: flex; align-items: center; }
.csf-nav__list { position: relative; display: flex; gap: 6px; margin: 0; padding: 6px; list-style: none; background: var(--csf-white); border-radius: 999px; box-shadow: 0 1px 0 var(--csf-line); font-size: 15px; font-weight: 700; }
.csf-nav__item { position: static; }
.csf-nav__pill { display: inline-flex; align-items: center; min-height: 44px; padding: 12px 16px; border: 0; border-radius: 999px; background: none; color: var(--csf-ink); font: inherit; cursor: pointer; text-decoration: none; }
.csf-nav__pill:hover { background: var(--csf-cream); color: var(--csf-ink); text-decoration: none; }
.csf-nav__pill--current, .csf-nav__pill[aria-expanded="true"] { padding-inline: 18px; background: var(--csf-blue); color: var(--csf-white); }
.csf-nav__pill--current:hover { background: var(--csf-blue); color: var(--csf-white); }

/* Panneau d'une pilule : une colonne par rubrique, aux couleurs du menu mobile */
.csf-nav__panel { position: absolute; top: calc(100% + 14px); right: 0; left: auto; z-index: 50; display: flex; gap: 28px; width: max-content; max-width: min(880px, calc(100vw - 48px)); padding: 24px 28px; background: var(--csf-white); border-radius: 22px; box-shadow: 0 1px 0 var(--csf-line), 0 18px 40px rgba(20, 36, 58, .16); }
.csf-nav__panel[hidden] { display: none; }
.csf-nav__col { min-width: 200px; }
.csf-nav__rubrique { display: flex; align-items: center; gap: 10px; min-height: 44px; font: 900 20px/1.1 var(--csf-font-title); color: var(--csf-ink); }
.csf-nav__square { flex: none; width: 14px; height: 14px; border-radius: 4px; background: var(--accent); }
.csf-nav__fiches { margin: 4px 0 0; padding: 0; list-style: none; }
.csf-nav__fiches a { display: flex; align-items: center; min-height: 40px; padding: 0 0 0 24px; color: var(--csf-ink); font-weight: 700; font-size: 16px; }
.csf-nav__fiches a:hover { color: var(--accent-dark); }

.csf-nav__menu { display: none; align-items: center; min-height: 48px; padding: 0 18px; border-radius: 999px; background: var(--csf-blue); color: var(--csf-white); font-weight: 800; font-size: 14px; }
.csf-nav__menu:hover { color: var(--csf-white); text-decoration: none; }

@media (max-width: 1099px) {
	.csf-nav__list { display: none; }
	.csf-nav__menu { display: inline-flex; }
}

/* ==========================================================================
   Menu mobile plein écran (3a)
   ========================================================================== */
.csf-menu { display: none; position: fixed; inset: 0; z-index: 1000; max-width: none; flex-direction: column; background: var(--csf-cream); }
.csf-menu:target, .csf-menu.is-open { display: flex; }
.csf-no-scroll { overflow: hidden; }
.csf-menu__head { flex: none; display: flex; align-items: center; justify-content: space-between; padding: 16px 18px; border-bottom: 2px solid var(--csf-line); }
.csf-menu__close { display: inline-flex; align-items: center; gap: 8px; min-height: 48px; padding: 0 18px; border-radius: 999px; background: var(--csf-ink); color: var(--csf-white); font-weight: 800; font-size: 14px; }
.csf-menu__close:hover { color: var(--csf-white); text-decoration: none; }
.csf-menu__body { flex: 1; overflow-y: auto; display: flex; flex-direction: column; gap: 18px; padding: 16px 12px 24px; }
.csf-menu__quick { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.csf-menu__tile { display: flex; flex-direction: column; justify-content: flex-end; min-height: 104px; padding: 16px; border-radius: 20px; text-decoration: none; }
.csf-menu__tile:hover { text-decoration: none; }
.csf-menu__tile--news { justify-content: space-between; background: var(--csf-orange); color: var(--csf-ink); transform: rotate(-1deg); }
.csf-menu__tile--contact { background: var(--csf-blue); color: var(--csf-white); transform: rotate(1deg); }
.csf-menu__tile--news:hover { color: var(--csf-ink); }
.csf-menu__tile--contact:hover { color: var(--csf-white); }
.csf-menu__count { font: 900 13px var(--csf-font-text); text-transform: uppercase; letter-spacing: .06em; }
.csf-menu__tile-title { font: 900 21px/1.05 var(--csf-font-title); }
.csf-menu__label { padding: 0 6px; font: 800 13px var(--csf-font-text); text-transform: uppercase; letter-spacing: .08em; color: var(--csf-muted); }
.csf-menu__rubriques, .csf-menu__sites { display: flex; flex-direction: column; gap: 8px; margin-top: -10px; }

.csf-acc { overflow: hidden; border-radius: 20px; background: var(--csf-white); box-shadow: 0 1px 0 var(--csf-line); }
.csf-acc__toggle { display: flex; align-items: center; gap: 14px; width: 100%; min-height: 64px; padding: 10px 10px 10px 16px; border: 0; background: var(--csf-white); color: var(--csf-ink); text-align: left; cursor: pointer; transition: background .2s; }
.csf-acc__toggle[aria-expanded="true"] { background: var(--accent); color: var(--on-accent); }
.csf-acc__dot { flex: none; width: 14px; height: 14px; border-radius: 4px; background: var(--accent); }
.csf-acc__toggle[aria-expanded="true"] .csf-acc__dot { background: var(--on-accent); }
.csf-acc__name { flex: 1; font: 900 21px/1.1 var(--csf-font-title); }
.csf-acc__chev { flex: none; display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 12px; background: var(--csf-cream); color: var(--accent-dark); font: 900 24px/1 var(--csf-font-title); transition: transform .2s; }
.csf-acc__toggle[aria-expanded="true"] .csf-acc__chev { background: rgba(255, 255, 255, .22); color: var(--on-accent); transform: rotate(90deg); }
.csf-acc__panel { display: flex; flex-direction: column; padding: 6px 8px 10px; }
.csf-acc__panel[hidden] { display: none; }
.csf-acc__link { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 48px; padding: 0 12px; border-bottom: 1px solid #F1EDE4; border-radius: 12px; color: var(--csf-ink); font-weight: 700; font-size: 17px; }
.csf-acc__link:hover { background: var(--csf-cream); color: var(--csf-ink); text-decoration: none; }
.csf-acc__link span { color: var(--accent-dark); font-weight: 800; }
.csf-acc__all { display: flex; align-items: center; min-height: 48px; padding: 0 12px; color: var(--accent-dark); font-weight: 800; font-size: 16px; }

.csf-menu__site { display: flex; align-items: center; gap: 12px; padding: 16px; border-radius: 20px; background: var(--accent); color: var(--on-accent); }
.csf-menu__site-text { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.csf-menu__site-name { font: 900 20px/1.1 var(--csf-font-title); }
.csf-menu__site-status { font-weight: 700; font-size: 15px; }
.csf-menu__call { flex: none; display: inline-flex; align-items: center; min-height: 48px; padding: 0 14px; border-radius: 14px; background: var(--csf-white); color: var(--csf-ink); font-weight: 800; font-size: 15px; }
.csf-menu__social { display: flex; gap: 8px; padding: 0 4px; }
.csf-menu__social a { flex: 1; display: flex; align-items: center; justify-content: center; min-height: 48px; border: 2px solid var(--csf-border); border-radius: 14px; color: var(--csf-ink); font-weight: 800; }

@media (min-width: 641px) {
	.csf-menu__body { width: 100%; max-width: 560px; margin-inline: auto; }
}
@media (prefers-reduced-motion: reduce) {
	.csf-menu__tile--news, .csf-menu__tile--contact { transform: none; }
}

/* ==========================================================================
   Cartes des sites (1b « Nous trouver », Contact)
   ========================================================================== */
.csf-sites { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.csf-site { overflow: hidden; display: flex; flex-direction: column; border-radius: 28px; background: var(--accent); color: var(--on-accent); }
.csf-site a { color: inherit; }
.csf-site__photo { height: 160px; }
.csf-site__photo img { width: 100%; height: 100%; object-fit: cover; }
.csf-site__body { display: flex; flex-direction: column; gap: 18px; padding: 34px 36px; }
.csf-site--contact .csf-site__body { gap: 14px; padding: 28px 32px 32px; }
.csf-site__head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
.csf-site__name { font: 900 32px/1.05 var(--csf-font-title); }
.csf-site--contact .csf-site__name { font-size: 30px; }
.csf-site__town { display: none; }
.csf-site__addr { margin: 6px 0 0; font-size: 16px; }
.csf-site__pill { display: flex; align-items: center; gap: 6px; padding: 7px 12px; border-radius: 999px; background: var(--csf-white); color: var(--csf-ink); font-weight: 800; font-size: 13px; white-space: nowrap; }
.csf-site__reason { margin: -6px 0 0; padding: 8px 12px; border-radius: 10px; background: rgba(255, 255, 255, .24); font-weight: 700; }
.csf-site__phone { font: 900 38px var(--csf-font-title); letter-spacing: -.01em; }
.csf-site--contact .csf-site__phone { font-size: 34px; }
.csf-site__email { font-weight: 700; font-size: 16px; }
.csf-site__hours { display: flex; flex-direction: column; gap: 2px; margin: 0; padding: 0; list-style: none; }
.csf-site__row { display: flex; justify-content: space-between; padding: 8px 12px; border-radius: 10px; }
.csf-site__row--today { background: rgba(255, 255, 255, .24); font-weight: 700; }
.csf-site__call { display: none; }

@media (max-width: 640px) {
	.csf-sites { grid-template-columns: minmax(0, 1fr); gap: 10px; }
	.csf-site { border-radius: 22px; }
	.csf-site--home .csf-site__body { gap: 6px; padding: 20px; }
	.csf-site--home .csf-site__name { font-size: 22px; }
	.csf-site--home .csf-site__town { display: inline; }
	.csf-site--home .csf-site__head { display: block; }
	.csf-site--home .csf-site__addr, .csf-site--home .csf-site__phone, .csf-site--home .csf-site__email, .csf-site--home .csf-site__hours { display: none; }
	.csf-site--home .csf-site__pill { display: inline; padding: 0; background: none; color: inherit; font-weight: 700; font-size: 16px; }
	.csf-site--home .csf-site__pill .csf-dot { display: none; }
	.csf-site--home .csf-site__call { display: inline-flex; align-self: flex-start; align-items: center; gap: 6px; min-height: 44px; margin-top: 6px; padding: 12px 16px; border-radius: 12px; background: var(--csf-white); color: var(--csf-ink); font-weight: 800; }
	.csf-site--contact .csf-site__body { padding: 22px 20px; }
	.csf-site--contact .csf-site__phone { font-size: 28px; }
}

/* ==========================================================================
   Boutons et titres de section
   ========================================================================== */
.csf-btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 52px; padding: 0 26px; border: 0; border-radius: 16px; font: 800 16px var(--csf-font-text); text-decoration: none; cursor: pointer; }
.csf-btn:hover { text-decoration: none; filter: brightness(1.04); }
.csf-btn--primary { background: var(--csf-green); color: var(--csf-ink); }
.csf-btn--primary:hover { color: var(--csf-ink); }
.csf-btn--light { background: var(--csf-white); color: var(--csf-blue-dark); }
.csf-btn--accent { min-height: 52px; padding: 0 22px; background: var(--accent); color: var(--on-accent); font-size: 19px; }
.csf-btn--accent:hover { color: var(--on-accent); }
.csf-btn--outline { min-height: 48px; border: 2px solid var(--csf-border); background: none; color: var(--accent-dark); }
.csf-section-head { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; margin-bottom: 20px; }
.csf-section-title { font: 900 46px/1 var(--csf-font-title); letter-spacing: -.02em; }
.csf-section-link { display: inline-flex; gap: 6px; align-items: center; min-height: 44px; color: var(--csf-blue-dark); font-weight: 800; }

/* ==========================================================================
   Accueil (1b)
   ========================================================================== */
.csf-hero { display: grid; grid-template-columns: 1.1fr 1fr; gap: 40px; overflow: hidden; margin: 8px 24px 0; padding: 56px 56px 0; border-radius: 32px; background: var(--csf-blue); color: var(--csf-white); }
.csf-hero__text { display: flex; flex-direction: column; gap: 22px; padding-bottom: 56px; }
.csf-hero__title { font: 900 clamp(42px, 6vw, 76px)/.96 var(--csf-font-title); letter-spacing: -.03em; text-wrap: balance; }
.csf-hero__lead { max-width: 480px; margin: 0; font-size: 20px; line-height: 1.5; }
.csf-hero__actions { display: flex; flex-wrap: wrap; gap: 12px; }
.csf-hero__media { position: relative; align-self: end; height: 380px; }
.csf-hero__img { position: absolute; inset: 0 0 0 20px; overflow: hidden; clip-path: polygon(8% 0, 100% 0, 100% 100%, 0 100%, 0 14%); }
.csf-hero__img img { width: 100%; height: 100%; object-fit: cover; }
.csf-hero__img--empty { background: rgba(255, 255, 255, .14); }
.csf-hero__tag { position: absolute; padding: 10px 16px; border-radius: 12px; font: 800 18px var(--csf-font-title); }
.csf-hero__tag--orange { top: 30px; left: -6px; background: var(--csf-orange); color: var(--csf-ink); transform: rotate(-6deg); }
.csf-hero__tag--violet { top: 150px; right: -10px; background: var(--csf-violet); color: var(--csf-white); transform: rotate(5deg); }
.csf-hero__tag--vert { bottom: 40px; left: 30px; background: var(--csf-green); color: var(--csf-ink); transform: rotate(-3deg); }

.csf-home__agenda { display: grid; grid-template-columns: 1.5fr 1fr; gap: 32px; align-items: start; padding: 72px var(--csf-gutter) 24px; }
.csf-home__sites { padding: 56px var(--csf-gutter); }
.csf-home__sites .csf-section-title, .csf-home__tiles .csf-section-title { margin-bottom: 4px; }
.csf-home__tiles { padding: 16px var(--csf-gutter) 72px; }

/* À la une */
.csf-une { display: flex; flex-direction: column; gap: 16px; padding: 20px; border-radius: 28px; background: var(--accent); color: var(--on-accent); text-decoration: none; transform: rotate(1.2deg); }
.csf-une:hover { color: var(--on-accent); text-decoration: none; }
.csf-une__img { display: block; height: 300px; overflow: hidden; border-radius: 18px; }
.csf-une__img img { width: 100%; height: 100%; object-fit: cover; }
.csf-une__text { display: flex; flex-direction: column; gap: 6px; padding: 0 8px 8px; }
.csf-une__date { font-size: 14px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; }
.csf-une__title { font: 900 40px/1 var(--csf-font-title); }
.csf-une__excerpt { font-size: 17px; }

/* ==========================================================================
   Agenda : lignes à pastille de date (accueil, autres actualités)
   ========================================================================== */
.csf-agenda__list { display: flex; flex-direction: column; }
.csf-news-row { display: grid; grid-template-columns: 84px minmax(0, 1fr) auto; gap: 22px; align-items: center; padding: 18px 0; border-top: 2px solid var(--csf-line); color: var(--csf-ink); text-decoration: none; }
.csf-news-row:hover { background: var(--csf-white); color: var(--csf-ink); text-decoration: none; }
.csf-news-row--une { display: none; }
.csf-datebox { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 84px; height: 84px; border-radius: 18px; background: var(--accent); color: var(--on-accent); line-height: 1; }
.csf-datebox__day { font: 900 34px var(--csf-font-title); }
.csf-datebox__month { font-size: 13px; font-weight: 800; text-transform: uppercase; }
.csf-news-row__body { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.csf-news-row__cat { font-size: 13px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; color: var(--accent-dark); }
.csf-news-row__title { font: 800 25px/1.15 var(--csf-font-title); }
.csf-news-row__excerpt { color: var(--csf-muted); }
.csf-news-row__arrow { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; border: 2px solid var(--csf-border); border-radius: 50%; font-weight: 800; }

/* ==========================================================================
   Tuiles colorées (rubriques de l'accueil, fiches voisines)
   ========================================================================== */
.csf-tiles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.csf-tile { display: flex; flex-direction: column; justify-content: space-between; gap: 12px; min-height: 170px; padding: 24px; border-radius: 22px; background: var(--accent); color: var(--on-accent); text-decoration: none; transition: transform .15s; }
.csf-tile:hover { color: var(--on-accent); text-decoration: none; transform: rotate(-1.5deg) scale(1.02); }
.csf-tile__title { font: 900 24px/1.05 var(--csf-font-title); hyphens: auto; }
.csf-tile--fiche .csf-tile__title { font-size: 26px; }
.csf-tile__text { font-size: 14px; font-weight: 600; line-height: 1.4; }
.csf-tile--fiche .csf-tile__text { font-size: 19px; font-weight: 700; line-height: 1.3; }

@media (max-width: 1099px) {
	.csf-hero { grid-template-columns: 1fr 1fr; padding: 40px 36px 0; }
	.csf-home__agenda { grid-template-columns: minmax(0, 1fr); }
	.csf-une { max-width: 560px; }
	.csf-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.csf-section-title { font-size: 38px; }
}

@media (max-width: 640px) {
	.csf-hero { display: flex; flex-direction: column; gap: 16px; margin: 0 12px; padding: 28px 22px; border-radius: 26px; }
	.csf-hero__text { gap: 16px; padding-bottom: 0; }
	.csf-hero__title { font-size: 42px; letter-spacing: -.02em; text-wrap: wrap; }
	.csf-hide-mobile { display: none; }
	.csf-only-mobile { display: inline; }
	.csf-hero__lead, .csf-hero__media, .csf-btn--light { display: none; }
	.csf-btn { min-height: 48px; padding: 0 20px; border-radius: 14px; }
	.csf-home__agenda { padding: 24px 18px 8px; gap: 0; }
	.csf-section-head { margin-bottom: 8px; }
	.csf-section-title { font-size: 28px; }
	.csf-home__agenda .csf-section-link, .csf-une { display: none; }
	.csf-news-row { display: flex; gap: 14px; padding: 12px 0; }
	.csf-news-row--une { display: flex; }
	.csf-agenda__list .csf-news-row:nth-child(n+4) { display: none; }
	.csf-datebox { flex: none; width: 58px; height: 58px; border-radius: 14px; }
	.csf-datebox__day { font-size: 24px; }
	.csf-datebox__month { font-size: 11px; }
	.csf-news-row__cat, .csf-news-row__excerpt, .csf-news-row__arrow { display: none; }
	.csf-news-row__title { font-size: 18px; }
	.csf-home__sites { padding: 16px 12px; }
	.csf-home__sites .csf-section-head { display: none; }
	.csf-home__tiles { padding: 8px 12px 20px; }
	.csf-home__tiles .csf-section-head { display: none; }
	.csf-tiles { gap: 8px; }
	.csf-tile { justify-content: flex-end; min-height: 84px; padding: 16px; border-radius: 16px; }
	.csf-tile__title { font: 800 17px/1.1 var(--csf-font-title); }
	.csf-tile--rubrique .csf-tile__text { display: none; }
	.csf-tile--fiche { min-height: 96px; }
	.csf-tile--fiche .csf-tile__title { font: 900 19px/1.1 var(--csf-font-title); }
	.csf-tile--fiche .csf-tile__text { display: none; }
}

@media (prefers-reduced-motion: reduce) {
	.csf-hero__tag, .csf-une, .csf-tile:hover { transform: none; }
}

/* ==========================================================================
   Agenda & actualités (page)
   ========================================================================== */
.csf-agenda-page { padding: 40px var(--csf-gutter) 72px; }
.csf-agenda-page__title { margin-bottom: 20px; font: 900 clamp(40px, 6vw, 72px)/1 var(--csf-font-title); letter-spacing: -.03em; }
.csf-filters { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 24px; }
.csf-filter { display: inline-flex; align-items: center; min-height: 48px; padding: 0 18px; border: 2px solid #D5E1EC; border-radius: 14px; background: var(--csf-white); color: var(--csf-ink); font: 800 15px var(--csf-font-text); }
.csf-filter:hover { border-color: var(--csf-blue); color: var(--csf-ink); text-decoration: none; }
.csf-filter.is-active { border-color: var(--csf-blue); background: var(--csf-blue); color: var(--csf-white); }
.csf-agenda-group { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 32px; padding: 28px 0; border-top: 3px solid var(--csf-ink); }
.csf-agenda-group[hidden], .csf-news-card[hidden] { display: none; }
.csf-agenda-group__month { font: 900 26px/1.1 var(--csf-font-title); color: var(--csf-blue-dark); }
.csf-agenda-group__items { display: flex; flex-direction: column; gap: 14px; }
.csf-news-card { display: grid; grid-template-columns: 96px minmax(0, 1fr) 200px; gap: 24px; align-items: center; padding: 16px; border-radius: 22px; background: var(--csf-white); color: var(--csf-ink); text-decoration: none; }
.csf-news-card:not(:has(.csf-news-card__img)) { grid-template-columns: 96px minmax(0, 1fr); }
.csf-news-card:hover { color: var(--csf-ink); text-decoration: none; box-shadow: 0 0 0 2px var(--accent); }
.csf-datebox--lg { width: 96px; height: 96px; }
.csf-datebox--lg .csf-datebox__day { font-size: 38px; }
.csf-news-card__title { font: 800 26px/1.15 var(--csf-font-title); }
.csf-news-card__img { display: block; height: 120px; overflow: hidden; border-radius: 14px; }
.csf-news-card__img img { width: 100%; height: 100%; object-fit: cover; }
.csf-agenda-page .navigation.pagination, .csf-search .navigation.pagination { margin-top: 24px; font-weight: 800; }
.csf-agenda-page .nav-links, .csf-search .nav-links { display: flex; gap: 12px; flex-wrap: wrap; }
.csf-agenda-page .page-numbers, .csf-search .page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; padding: 0 14px; border-radius: 12px; background: var(--csf-white); }
.csf-agenda-page .page-numbers.current, .csf-search .page-numbers.current { background: var(--csf-blue); color: var(--csf-white); }
.csf-search a.page-numbers:hover { background: var(--csf-hover); text-decoration: none; }
.csf-search a.page-numbers:focus-visible { outline: 3px solid var(--csf-blue-dark); outline-offset: 2px; }

@media (max-width: 1099px) {
	.csf-agenda-group { grid-template-columns: minmax(0, 1fr); gap: 14px; }
}
@media (max-width: 640px) {
	.csf-agenda-page { padding: 24px 12px 40px; }
	.csf-filters { flex-wrap: nowrap; overflow-x: auto; margin-inline: -12px; padding: 0 12px 4px; }
	.csf-filter { flex: none; }
	.csf-news-card, .csf-news-card:not(:has(.csf-news-card__img)) { grid-template-columns: 58px minmax(0, 1fr); gap: 14px; padding: 12px; border-radius: 16px; }
	.csf-datebox--lg { width: 58px; height: 58px; border-radius: 14px; }
	.csf-datebox--lg .csf-datebox__day { font-size: 24px; }
	.csf-news-card__title { font-size: 19px; }
	.csf-news-card__img, .csf-news-card .csf-news-row__excerpt { display: none; }
	.csf-agenda-group__month { font-size: 22px; }
}

/* ==========================================================================
   Fil d'Ariane
   ========================================================================== */
.csf-breadcrumb { padding: 0 34px 6px; font-size: 15px; font-weight: 700; }
.csf-breadcrumb__list { display: flex; flex-wrap: wrap; align-items: center; gap: 2px; margin: 0; padding: 0; list-style: none; }
.csf-breadcrumb__list li { display: flex; align-items: center; gap: 2px; }
.csf-breadcrumb__list a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 6px; color: var(--csf-blue-dark); }
.csf-breadcrumb__list li > span:not(.csf-breadcrumb__sep) { padding: 0 6px; color: var(--csf-ink); }
.csf-breadcrumb__sep { color: var(--csf-grey); }
.csf-breadcrumb__back { display: none; }

/* ==========================================================================
   Contenu éditorial (fiches, articles, pages)
   ========================================================================== */
.csf-entry { display: flex; flex-direction: column; gap: 18px; font-size: 19px; line-height: 1.65; }
.csf-entry > * { margin: 0; }
.csf-entry > p:first-child { font-size: 22px; line-height: 1.55; font-weight: 600; text-wrap: pretty; }
.csf-entry h2 { margin-top: 16px; font: 900 30px/1.1 var(--csf-font-title); letter-spacing: -.01em; }
.csf-entry h3 { margin-top: 8px; font: 900 24px/1.15 var(--csf-font-title); }
.csf-entry ul, .csf-entry ol { display: flex; flex-direction: column; gap: 10px; padding: 0; list-style: none; }
.csf-entry li { position: relative; padding-left: 24px; line-height: 1.5; }
.csf-entry ul > li::before { content: ""; position: absolute; left: 0; top: .55em; width: 10px; height: 10px; border-radius: 3px; background: var(--accent); }
.csf-entry ol { counter-reset: csf; }
.csf-entry ol > li::before { counter-increment: csf; content: counter(csf) "."; position: absolute; left: 0; font-weight: 800; color: var(--accent-dark); }
.csf-entry a { color: var(--accent-dark); text-decoration: underline; text-underline-offset: 3px; }
.csf-entry img { border-radius: 14px; }
.csf-entry p > a > img, .csf-entry p > img { display: inline-block; margin: 0 8px 8px 0; vertical-align: top; }
.csf-entry blockquote { margin: 0; padding: 16px 20px; border-left: 4px solid var(--accent); background: var(--csf-white); border-radius: 0 14px 14px 0; }

/* ==========================================================================
   Documents à télécharger
   ========================================================================== */
.csf-docs { display: flex; flex-direction: column; gap: 10px; }
.csf-docs__title { margin-bottom: 8px; font: 900 30px/1.05 var(--csf-font-title); }
.csf-docs__short, .csf-doc__short { display: none; }
.csf-doc { display: flex; align-items: center; gap: 16px; min-height: 76px; padding: 14px 16px; border-radius: 18px; background: var(--csf-white); color: var(--csf-ink); text-decoration: none; }
.csf-doc:hover { background: var(--csf-hover); color: var(--csf-ink); text-decoration: none; }
.csf-doc__type { flex: none; display: flex; align-items: flex-end; justify-content: center; width: 46px; height: 56px; padding-bottom: 8px; border-radius: 10px; background: var(--csf-ink); color: var(--csf-white); font: 800 13px var(--csf-font-text); }
.csf-doc__text { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.csf-doc__title { font: 800 18px/1.2 var(--csf-font-title); }
.csf-doc__meta { font-size: 14px; color: var(--csf-muted); }
.csf-doc__action { flex: none; display: flex; align-items: center; min-height: 44px; padding: 0 14px; border: 2px solid var(--csf-border); border-radius: 12px; color: var(--accent-dark); font-weight: 800; }

/* ==========================================================================
   Article (2e)
   ========================================================================== */
.csf-article__head { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 28px; align-items: center; padding: 16px var(--csf-gutter) 0; }
.csf-datebox--xl { width: 120px; height: 120px; border-radius: 24px; transform: rotate(-3deg); }
.csf-datebox--xl .csf-datebox__day { font-size: 52px; }
.csf-datebox--xl .csf-datebox__month { font-size: 15px; }
.csf-article__intro { display: flex; flex-direction: column; gap: 10px; }
.csf-article__cat { font-size: 14px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; color: var(--accent-dark); }
.csf-article__title { font: 900 clamp(40px, 6vw, 76px)/.95 var(--csf-font-title); letter-spacing: -.03em; }
.csf-article__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; }
.csf-article__chip { padding: 9px 14px; border-radius: 12px; background: var(--accent-soft); color: var(--accent-dark); font-weight: 800; font-size: 16px; }
.csf-article__published { font-size: 15px; color: var(--csf-muted); }
.csf-article__body { display: grid; grid-template-columns: 500px minmax(0, 1fr); gap: 48px; align-items: start; padding: 40px var(--csf-gutter) 24px; }
.csf-article__body--single { grid-template-columns: minmax(0, 760px); }
.csf-article__affiche { margin: 0; }
.csf-article__affiche img { width: 100%; max-height: 680px; object-fit: contain; border-radius: 28px; }
.csf-article__content { display: flex; flex-direction: column; gap: 18px; max-width: 620px; }
.csf-article__content .csf-entry > p:first-child { font-size: 23px; line-height: 1.5; }
.csf-article__call { align-self: flex-start; margin-top: 8px; font-size: 18px; }
.csf-article__others { padding: 40px var(--csf-gutter) 72px; }
.csf-article__others .csf-section-title { font-size: 40px; }

@media (max-width: 1099px) {
	.csf-article__body { grid-template-columns: minmax(0, 1fr); }
	.csf-article__affiche img { max-height: 520px; width: auto; }
}
@media (max-width: 640px) {
	.csf-breadcrumb { padding: 0; }
	.csf-breadcrumb__list { display: none; }
	.csf-breadcrumb__back { display: flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 18px; color: var(--csf-blue-dark); font-weight: 800; font-size: 15px; }
	.csf-entry { font-size: 18px; line-height: 1.6; }
	.csf-entry > p:first-child { font-size: 19px; }
	.csf-docs__title { font-size: 24px; margin: 0 6px 6px; }
	.csf-docs__long, .csf-doc__long { display: none; }
	.csf-docs__short { display: inline; }
	.csf-doc { gap: 12px; min-height: 64px; padding: 12px 14px; border-radius: 16px; }
	.csf-doc__type { width: 38px; height: 46px; padding-bottom: 6px; border-radius: 8px; font-size: 11px; }
	.csf-doc__title { font-size: 16px; }
	.csf-doc__meta { font-size: 13px; }
	.csf-doc__action { justify-content: center; width: 44px; height: 44px; padding: 0; }
	.csf-doc__short { display: inline; }
	.csf-article__head { grid-template-columns: 72px minmax(0, 1fr); gap: 16px; padding: 8px 18px 0; }
	.csf-datebox--xl { width: 72px; height: 72px; border-radius: 16px; }
	.csf-datebox--xl .csf-datebox__day { font-size: 30px; }
	.csf-datebox--xl .csf-datebox__month { font-size: 12px; }
	.csf-article__title { font-size: 40px; }
	.csf-article__body { padding: 24px 18px; gap: 20px; }
	.csf-article__content .csf-entry > p:first-child { font-size: 20px; }
	.csf-article__call { align-self: stretch; }
	.csf-article__others { padding: 24px 18px 40px; }
	.csf-article__others .csf-section-title { font-size: 28px; }
}
@media (prefers-reduced-motion: reduce) {
	.csf-datebox--xl { transform: none; }
}

/* ==========================================================================
   Panneau d'en-tête coloré (fiche, rubrique)
   ========================================================================== */
.csf-panel { display: grid; grid-template-columns: 1.15fr 1fr; gap: 40px; overflow: hidden; margin: 0 24px; padding: 44px 48px 0; border-radius: 32px; background: var(--accent); color: var(--on-accent); }
.csf-panel__text { display: flex; flex-direction: column; justify-content: center; gap: 18px; padding-bottom: 48px; }
.csf-panel__title { hyphens: auto; font: 900 clamp(40px, 5.2vw, 66px)/.98 var(--csf-font-title); letter-spacing: -.03em; text-wrap: balance; }
.csf-panel__lead { max-width: 500px; margin: 0; font-size: 21px; line-height: 1.45; font-weight: 700; text-wrap: pretty; }
.csf-panel__media { position: relative; align-self: end; height: 290px; }
.csf-panel__img { position: absolute; inset: 0 0 0 20px; overflow: hidden; clip-path: polygon(8% 0, 100% 0, 100% 100%, 0 100%, 0 14%); }
.csf-panel__img img { width: 100%; height: 100%; object-fit: cover; }
.csf-panel__img--contain { background: var(--csf-white); }
.csf-panel__img--contain img { object-fit: contain; }
.csf-panel__tag { padding: 10px 16px; border-radius: 12px; background: var(--csf-white); color: var(--csf-ink); font: 800 18px var(--csf-font-title); }
.csf-panel__tag--media { position: absolute; top: 26px; left: -6px; transform: rotate(-6deg); }
.csf-panel__tag--text { display: none; align-self: flex-start; transform: rotate(-3deg); }
.csf-panel--text { display: flex; flex-direction: column; padding: 44px 48px 52px; }
.csf-panel--text .csf-panel__text { padding-bottom: 0; }
.csf-panel--text .csf-panel__tag--text { display: inline-block; }
.csf-panel--text .csf-panel__title { max-width: 900px; }
.csf-panel--text .csf-panel__lead { max-width: 720px; }

/* ==========================================================================
   Fiche (2a, 2b, 2c)
   ========================================================================== */
.csf-infos { display: flex; flex-direction: column; gap: 20px; margin: 24px 24px 0; padding: 32px 36px; border-radius: 28px; background: var(--csf-white); }
.csf-infos__head { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 16px; }
.csf-infos__title { font: 900 34px/1 var(--csf-font-title); }
.csf-infos__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 28px; margin: 0; }
.csf-infos__item { display: flex; flex-direction: column; gap: 4px; padding: 16px 0; border-top: 2px solid var(--csf-line-light); }
.csf-infos__label { font-size: 13px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; color: var(--accent-dark); }
.csf-infos__value { margin: 0; font: 800 22px/1.2 var(--csf-font-title); }
.csf-infos__precision { margin: 0; font-size: 16px; line-height: 1.4; color: var(--csf-muted); }

.csf-fiche__body { display: flex; flex-wrap: wrap; gap: 40px; align-items: flex-start; padding: 44px var(--csf-gutter) 16px; }
.csf-fiche__main { flex: 1 1 560px; max-width: 720px; display: flex; flex-direction: column; gap: 28px; }
.csf-fiche__docs { flex: 1 1 380px; }
.csf-fiche__body--aside { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 56px; padding-top: 48px; }
.csf-fiche__body--aside .csf-fiche__main { max-width: 720px; }
.csf-fiche__aside { display: flex; flex-direction: column; gap: 28px; }
.csf-galerie { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.csf-galerie__item { height: 250px; margin: 0; overflow: hidden; border-radius: 22px; }
.csf-galerie__item img { width: 100%; height: 100%; object-fit: cover; }
.csf-contact-card { display: flex; flex-direction: column; gap: 12px; padding: 28px; border-radius: 28px; background: var(--csf-white); }
.csf-contact-card__label { font-size: 13px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; color: var(--accent-dark); }
.csf-contact-card__name { font: 900 24px/1.1 var(--csf-font-title); }
.csf-contact-card__addr { color: var(--csf-muted); }
.csf-contact-card .csf-btn--accent { margin-top: 6px; }
.csf-fiche__siblings { padding: 32px var(--csf-gutter) 72px; }
.csf-fiche__siblings .csf-section-title { font-size: 40px; }

@media (max-width: 1099px) {
	.csf-panel { grid-template-columns: 1fr 1fr; padding: 36px 36px 0; }
	.csf-panel--text { padding: 36px 36px 44px; }
	.csf-infos__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.csf-fiche__body--aside { grid-template-columns: minmax(0, 1fr); gap: 32px; }
}
@media (max-width: 640px) {
	.csf-panel, .csf-panel--text { display: flex; flex-direction: column; gap: 14px; margin: 0 12px; padding: 24px 20px; border-radius: 26px; }
	.csf-panel__text { gap: 14px; padding-bottom: 0; }
	.csf-panel__tag--text { display: inline-block; padding: 8px 12px; border-radius: 10px; font-size: 15px; }
	.csf-panel__tag--media { display: none; }
	.csf-panel__title { font-size: 42px; letter-spacing: -.02em; }
	.csf-panel__lead { font-size: 19px; line-height: 1.4; }
	.csf-panel__media { align-self: stretch; height: 180px; margin: 4px -4px 0; }
	.csf-panel__img { inset: 0; }
	.csf-infos { gap: 20px; margin: 14px 12px 0; padding: 22px 20px; }
	.csf-infos__title { font-size: 28px; }
	.csf-infos__call { width: 100%; }
	.csf-infos__grid { grid-template-columns: minmax(0, 1fr); }
	.csf-fiche__body, .csf-fiche__body--aside { display: flex; flex-direction: column; gap: 20px; padding: 28px 18px 8px; }
	.csf-fiche__main, .csf-fiche__docs, .csf-fiche__aside { flex: none; width: 100%; }
	.csf-galerie { gap: 8px; }
	.csf-galerie__item { height: 130px; border-radius: 16px; }
	.csf-fiche__siblings { padding: 24px 12px; }
	.csf-fiche__siblings .csf-section-title { font-size: 24px; margin-inline: 6px; }
}
@media (prefers-reduced-motion: reduce) {
	.csf-panel__tag { transform: none !important; }
}

/* ==========================================================================
   Rubrique (2d)
   ========================================================================== */
.csf-rubrique__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; padding: 48px var(--csf-gutter) 24px; }
.csf-rcard { display: flex; flex-direction: column; gap: 12px; min-height: 260px; padding: 14px; border-radius: 26px; background: var(--accent); color: var(--on-accent); text-decoration: none; transition: transform .15s; }
.csf-rcard:hover { color: var(--on-accent); text-decoration: none; transform: rotate(-1deg) scale(1.015); }
.csf-rcard__img { display: block; height: 190px; overflow: hidden; border-radius: 16px; }
.csf-rcard__img img { width: 100%; height: 100%; object-fit: cover; }
.csf-rcard__img--contain { background: var(--csf-white); }
.csf-rcard__img--contain img { object-fit: contain; }
.csf-rcard__body { flex: 1; display: flex; flex-direction: column; justify-content: flex-end; gap: 8px; padding: 8px 10px 10px; }
.csf-rcard__title { font: 900 30px/1.02 var(--csf-font-title); hyphens: auto; }
.csf-rcard__when { font-size: 19px; font-weight: 700; line-height: 1.3; }
.csf-rcard__more { align-self: flex-start; display: flex; align-items: center; gap: 6px; min-height: 44px; margin-top: 6px; padding: 0 16px; border-radius: 12px; background: var(--csf-white); color: var(--accent-dark); font-weight: 800; font-size: 16px; }
.csf-inscrire { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 28px; align-items: center; margin: 16px var(--csf-gutter) 72px; padding: 28px 32px; border-radius: 28px; background: var(--csf-white); }
.csf-inscrire__title { font: 900 28px/1.1 var(--csf-font-title); }
.csf-inscrire p { max-width: 640px; margin: 6px 0 0; font-size: 18px; line-height: 1.5; color: var(--csf-muted); }
.csf-rubrique { padding-bottom: 48px; }

@media (max-width: 1099px) {
	.csf-rubrique__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
	.csf-rubrique__grid { grid-template-columns: minmax(0, 1fr); gap: 10px; padding: 16px 12px; }
	.csf-rcard { min-height: 0; border-radius: 20px; }
	.csf-rcard__img { height: 150px; }
	.csf-rcard__title { font-size: 24px; }
	.csf-rcard__when { font-size: 17px; }
	.csf-inscrire { grid-template-columns: minmax(0, 1fr); margin: 8px 12px 40px; padding: 22px 20px; }
}
@media (prefers-reduced-motion: reduce) {
	.csf-rcard:hover { transform: none; }
}

/* ==========================================================================
   Contact (1b Contact) et formulaire
   ========================================================================== */
.csf-contact { display: flex; flex-direction: column; gap: 24px; padding: 40px var(--csf-gutter) 72px; }
.csf-contact__title { font: 900 clamp(40px, 6vw, 72px)/1 var(--csf-font-title); letter-spacing: -.03em; }
.csf-contact__form { display: grid; grid-template-columns: 280px minmax(0, 1fr); gap: 36px; padding: 32px 36px; border-radius: 28px; background: var(--csf-white); }
.csf-contact__lead h2 { font: 900 32px/1.05 var(--csf-font-title); }
.csf-contact__lead p { color: var(--csf-muted); font-size: 16px; line-height: 1.5; }
.csf-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.csf-form__wide { grid-column: 1 / -1; }
.csf-form__field { display: block; }
.csf-form input[type="text"], .csf-form input[type="email"], .csf-form textarea, .csf-form select { width: 100%; padding: 15px 16px; border: 2px solid var(--csf-line); border-radius: 14px; background: var(--csf-cream); color: var(--csf-ink); font: 500 16px var(--csf-font-text); }
.csf-form select { font-weight: 600; }
.csf-form textarea { resize: vertical; min-height: 120px; }
.csf-form input:focus, .csf-form textarea:focus, .csf-form select:focus { border-color: var(--csf-blue); outline: 3px solid rgba(10, 122, 192, .25); outline-offset: 0; }
.csf-form .wpcf7-submit { width: 100%; min-height: 54px; background: var(--csf-blue); color: var(--csf-white); font-size: 19px; font-weight: 800; }
.csf-form__consent { font-size: 15px; color: var(--csf-muted); }
.csf-form__consent input { width: 20px; height: 20px; margin-right: 8px; vertical-align: -4px; }
.csf-hp { position: absolute; left: -10000px; top: auto; width: 1px; height: 1px; overflow: hidden; }
.csf-contact__antispam { margin-top: 14px; color: var(--csf-muted); font-size: 14px; }
.csf-contact__antispam a { text-decoration: underline; }
.csf-contact .wpcf7-not-valid-tip { margin-top: 6px; color: #A12C1F; font-size: 14px; font-weight: 700; }
.csf-contact .wpcf7-response-output { margin: 16px 0 0 !important; padding: 12px 16px !important; border-radius: 12px; }
.csf-contact .wpcf7-spinner { position: absolute; }

@media (max-width: 1099px) {
	.csf-contact__form { grid-template-columns: minmax(0, 1fr); gap: 16px; }
}
@media (max-width: 640px) {
	.csf-contact { gap: 16px; padding: 24px 12px 40px; }
	.csf-contact__form { padding: 22px 20px; }
	.csf-form { grid-template-columns: minmax(0, 1fr); }
}

/* ==========================================================================
   Pages simples, recherche, 404
   ========================================================================== */
.csf-page .csf-entry { max-width: 760px; }
.csf-page .csf-entry > p:first-child { font-size: 19px; font-weight: 400; line-height: 1.65; }
.csf-page__actions { display: flex; flex-wrap: wrap; gap: 12px; margin: 24px 0; }
.search-form { display: flex; gap: 8px; max-width: 560px; margin: 16px 0 24px; }
.search-form label { flex: 1; }
.search-form .search-field { width: 100%; min-height: 52px; padding: 0 16px; border: 2px solid var(--csf-line); border-radius: 14px; background: var(--csf-white); font: 500 16px var(--csf-font-text); }
.search-form .search-submit { min-height: 52px; padding: 0 20px; border: 0; border-radius: 14px; background: var(--csf-blue); color: var(--csf-white); font: 800 16px var(--csf-font-text); cursor: pointer; }
.csf-search__list { display: flex; flex-direction: column; gap: 10px; max-width: 760px; margin: 0; padding: 0; list-style: none; }
.csf-search__item { display: flex; flex-direction: column; gap: 2px; padding: 16px 18px; border-radius: 18px; background: var(--csf-white); color: var(--csf-ink); }
.csf-search__item:hover { background: var(--csf-hover); text-decoration: none; color: var(--csf-ink); }
.csf-search__type { font-size: 13px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; color: var(--csf-blue-dark); }
.csf-search__title { font: 800 22px/1.2 var(--csf-font-title); }
@media (max-width: 640px) {
	.csf-page { padding: 24px 18px 48px; }
	.csf-page__title { font-size: 36px; }
}

/* ==========================================================================
   Consentement aux cookies (tarteaucitron, bibliothèque hébergée dans le thème)
   Sélecteurs préfixés #tarteaucitronRoot : la feuille de la bibliothèque est ajoutée après la nôtre.
   ========================================================================== */
#tarteaucitronRoot, #tarteaucitronRoot button, #tarteaucitronRoot a { font-family: var(--csf-font-text); }
#tarteaucitronRoot #tarteaucitronAlertBig { background: var(--csf-white); color: var(--csf-ink); font-size: 16px !important; border-top: 1px solid var(--csf-border); box-shadow: 0 -8px 30px rgba(20, 36, 58, .12); }
#tarteaucitronRoot #tarteaucitronAlertBig #tarteaucitronDisclaimerAlert { display: flex; box-sizing: border-box; width: 100%; max-width: var(--csf-max); margin: 0 auto; flex-wrap: wrap; align-items: center; justify-content: center; gap: 10px 14px; padding: 4px var(--csf-gutter); color: var(--csf-ink); font-size: 16px; line-height: 1.4; }
#tarteaucitronRoot #tarteaucitronAlertBig button { box-sizing: border-box; min-height: 44px; padding: 8px 20px; border-radius: 14px; font: 800 16px/1.2 var(--csf-font-text); cursor: pointer; }
#tarteaucitronRoot #tarteaucitronAlertBig #tarteaucitronPersonalize2 { border: 2px solid var(--csf-blue-dark); background: var(--csf-blue-dark); color: var(--csf-white); }
#tarteaucitronRoot #tarteaucitronAlertBig #tarteaucitronAllDenied2 { border: 2px solid var(--csf-ink); background: var(--csf-white); color: var(--csf-ink); }
#tarteaucitronRoot #tarteaucitronAlertBig #tarteaucitronCloseAlert, #tarteaucitronRoot #tarteaucitronAlertBig #tarteaucitronPrivacyUrl { border: 2px solid transparent; background: transparent; color: var(--csf-ink); text-decoration: underline; }
#tarteaucitronRoot #tarteaucitronAlertBig button:focus-visible { outline: 3px solid var(--csf-blue); outline-offset: 2px; }
#tarteaucitronRoot #tarteaucitronAlertBig button:hover { filter: brightness(1.08); }
#tarteaucitronIcon { margin: 0 0 8px 8px; }
#tarteaucitronIcon #tarteaucitronManager { min-width: 44px; min-height: 44px; padding: 4px; border-radius: 50%; background: var(--csf-white); box-shadow: 0 2px 10px rgba(20, 36, 58, .25); }
#tarteaucitronIcon #tarteaucitronManager img { display: block; width: 40px; height: 40px; }
#tarteaucitronIcon #tarteaucitronManager:focus-visible { outline: 3px solid var(--csf-blue); outline-offset: 2px; }
@media (max-width: 640px) {
	#tarteaucitronRoot #tarteaucitronAlertBig #tarteaucitronDisclaimerAlert { padding: 4px 12px; font-size: 15px; }
	#tarteaucitronRoot #tarteaucitronAlertBig button { flex: 1 1 140px; }
}

/* ==========================================================================
   Images du contenu (centrage) et visionneuse (lightbox.js)
   ========================================================================== */
/* Alignements explicites de l'éditeur : conservés. */
.csf-entry img.alignleft { float: left; margin: 4px 20px 12px 0; }
.csf-entry img.alignright { float: right; margin: 4px 0 12px 20px; }
.csf-entry img.aligncenter { margin-inline: auto; }

/* Un paragraphe d'images (classe csf-gallery posée par csf_theme_mark_galleries : images seules, liées ou non,
   éventuellement précédées d'un texte d'intro) forme une rangée centrée qui passe à la ligne.
   Le texte d'intro occupe sa propre ligne (::after pleine largeur, placé avant les images grâce à `order`).
   Un paragraphe qui mêle texte et images n'a pas la classe : rendu normal, ordre des mots intact. */
.csf-entry p.csf-gallery {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: flex-start;
	gap: 12px;
	text-align: center;
}
.csf-entry p.csf-gallery > :is(a, img) { order: 1; margin: 0; }
.csf-entry p.csf-gallery::after { content: ""; flex: 0 0 100%; height: 0; margin-top: -12px; }
.csf-entry p.csf-gallery > a { display: block; max-width: 100%; }
.csf-entry p.csf-gallery img { max-width: 100%; }
/* Vignettes agrandies : 340 px, jamais plus de la moitié de la colonne (3 par ligne sur ordinateur,
   2 sur tablette et dans les colonnes étroites ; une pleine largeur sur téléphone, plus bas). */
.csf-entry p.csf-gallery > a:has(> img), .csf-entry p.csf-gallery > img { flex: 0 1 min(340px, calc((100% - 12px) / 2)); }
.csf-entry p.csf-gallery img { width: 100%; height: auto; }

/* Visionneuse : le <dialog> occupe toute la fenêtre (le fond sombre est le dialog lui-même, donc cliquable). */
.csf-lightbox {
	position: fixed;
	inset: 0;
	/* Largeur de la fenêtre sans la barre de défilement (100vw passerait dessous). */
	width: auto;
	max-width: none;
	height: auto;
	max-height: none;
	margin: 0;
	padding: 0;
	border: 0;
	background: color-mix(in srgb, var(--csf-ink) 94%, transparent);
	color: var(--csf-white);
	overflow: hidden;
}
.csf-lightbox[open] { display: flex; align-items: center; justify-content: center; }
.csf-lightbox::backdrop { background: var(--csf-ink); }
/* Page bloquée pendant l'ouverture : plus de barre de défilement à côté de la visionneuse. */
html:has(dialog.csf-lightbox[open]) { overflow: hidden; }
.csf-lightbox [hidden] { display: none !important; }
/* Marges haute et basse : place du bouton Fermer et de la barre (compteur, flèches, liens). */
.csf-lightbox__figure { display: flex; flex-direction: column; align-items: center; gap: 8px; margin: 56px 0 64px; max-width: 92vw; }
.csf-lightbox__img { width: auto; max-width: 92vw; height: auto; max-height: 85vh; max-height: min(85dvh, calc(100dvh - 170px)); border-radius: 8px; background: var(--csf-white); }
.csf-lightbox__frame { width: min(92vw, 1000px); height: 82vh; height: min(82dvh, calc(100dvh - 170px)); border: 0; border-radius: 8px; background: var(--csf-white); }
.csf-lightbox__caption { max-width: 70ch; font: 600 17px/1.4 var(--csf-font-text); text-align: center; }
.csf-lightbox__btn {
	position: absolute;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	padding: 0;
	border: 2px solid var(--csf-white);
	border-radius: 50%;
	background: var(--csf-ink);
	color: var(--csf-white);
	font: 700 28px/1 var(--csf-font-text);
	cursor: pointer;
}
.csf-lightbox__btn:hover { background: var(--csf-blue-dark); }
.csf-lightbox__btn:focus-visible, .csf-lightbox__link:focus-visible { outline: 3px solid var(--csf-white); outline-offset: 3px; }
.csf-lightbox__close { top: 24px; right: 24px; font-size: 22px; }
/* Bureau : flèches sur les côtés (fixed : le conteneur est la fenêtre, la barre du bas ne sert pas de repère). */
.csf-lightbox__prev { position: fixed; left: 12px; top: 50%; margin-top: -24px; }
.csf-lightbox__next { position: fixed; right: 12px; top: 50%; margin-top: -24px; }
.csf-lightbox__bar { position: absolute; left: 0; right: 0; bottom: 0; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px 20px; padding: 8px 72px; }
.csf-lightbox__count { font: 800 17px/1 var(--csf-font-text); }
.csf-lightbox__link { display: inline-flex; align-items: center; min-height: 44px; padding: 0 12px; color: var(--csf-white); font: 700 17px/1 var(--csf-font-text); text-decoration: underline; text-underline-offset: 3px; }
.csf-lightbox__link:hover { color: var(--csf-white); text-decoration-thickness: 2px; }
@media (max-width: 640px) {
	.csf-lightbox__bar { padding: 8px 12px; }
	/* Mobile : précédent et suivant rejoignent la barre du bas pour ne plus recouvrir l'affiche. */
	.csf-lightbox__prev, .csf-lightbox__next { position: static; margin: 0; }
	.csf-lightbox__close { top: 16px; right: 16px; }
}
@media (prefers-reduced-motion: no-preference) {
	.csf-lightbox[open] { animation: csf-lightbox-in .18s ease-out; }
	@keyframes csf-lightbox-in { from { opacity: 0; } to { opacity: 1; } }
}
/* Grands écrans : le zoom de <html> est annulé sur la visionneuse pour qu'elle reste à l'échelle de la fenêtre. */
@media (min-width: 1500px) { .csf-lightbox { zoom: calc(1 / 1.15); } }
@media (min-width: 1800px) { .csf-lightbox { zoom: calc(1 / 1.35); } }
@media (min-width: 2200px) { .csf-lightbox { zoom: calc(1 / 1.55); } }
@media (min-width: 2500px) { .csf-lightbox { zoom: calc(1 / 1.75); } }

/* ==========================================================================
   Actualités : images et PDF centrés par défaut
   ========================================================================== */
.csf-article .csf-entry img:not(.alignleft):not(.alignright) { display: block; margin-inline: auto; }
.csf-article .csf-entry p.csf-file { text-align: center; }
/* Actualité sans affiche latérale : le corps prend toute la largeur ; le texte garde sa colonne de lecture
   (620 px, sous le titre), les images, rangées de vignettes et liens PDF se centrent sur la page. */
.csf-article__body--single { grid-template-columns: minmax(0, 1fr); }
.csf-article__body--single .csf-article__content { max-width: none; }
.csf-article__body--single .csf-entry > :not(.csf-gallery):not(.csf-file):not(:has(img)),
.csf-article__body--single .csf-article__content > :not(.csf-entry) { max-width: 620px; }
@media (max-width: 640px) {
	/* Téléphone : une vignette par ligne, sur toute la largeur du contenu (marges de page conservées). */
	.csf-entry p.csf-gallery > a:has(> img), .csf-entry p.csf-gallery > img { flex: 0 1 100%; }
	.csf-entry p.csf-gallery img { width: 100%; height: auto; }
}