/*
Theme Name: French Square
Theme URI: https://frenchsquare.org
Description: Thème enfant de Twenty Twenty-Five pour French Square, conseil marketing B2B. Design éditorial en bleu marine, contenu contenu dans des panneaux plutôt qu'en pleine largeur, structure entièrement alimentée par la base.
Author: French Square
Version: 7.0.0
Requires at least: 6.7
Tested up to: 7.1
Requires PHP: 7.4
Template: twentytwentyfive
Text Domain: frenchsquare
Tags: block-patterns, full-site-editing, custom-colors, accessibility-ready
*/

/* ==================================================================
   Principe de mise en page
   ------------------------------------------------------------------
   Aucune bande de couleur d'un bord à l'autre. Les zones de contraste
   sont des PANNEAUX arrondis, encartés dans la largeur de contenu.
   Le rythme vient de l'espacement et de filets fins, pas de blocs
   pleine largeur qui donnent une impression de vide.
   ================================================================== */

:root {
	--fs-line: #DCE4EC;
	--fs-line-strong: #C7D3E0;
	--fs-line-dark: #22405F;
	--fs-panel-shadow: 0 1px 2px rgba(12,27,46,.04), 0 10px 24px -14px rgba(12,27,46,.20);
	--fs-panel-shadow-lift: 0 2px 4px rgba(12,27,46,.06), 0 18px 36px -18px rgba(12,27,46,.30);
	--fs-ease: cubic-bezier(.2,.7,.3,1);
	--fs-radius: 12px;
}

/* ---------- Typographie ---------- */
:where(h1,h2,h3,h4,.wp-block-post-title) { letter-spacing: -.019em; text-wrap: balance; }
:where(p,li) { text-wrap: pretty; }

.fs-display {
	font-size: clamp(2rem, 1.1rem + 3.1vw, 3.15rem) !important;
	line-height: 1.06 !important;
	letter-spacing: -.028em !important;
	max-width: 17ch;
	margin: 0 0 1rem !important;
}
.fs-lede { max-width: 42ch; line-height: 1.6; }

/* Sur-titre : petites capitales, filet court devant. */
.fs-eyebrow {
	display: flex; align-items: center; gap: .65rem;
	font-family: var(--wp--preset--font-family--sans);
	font-size: .72rem; font-weight: 600; letter-spacing: .14em;
	text-transform: uppercase; color: var(--wp--preset--color--azur);
	margin: 0 0 .85rem;
}
.fs-eyebrow::before {
	content: ""; width: 1.6rem; height: 1px; flex: 0 0 auto;
	background: currentColor; opacity: .6;
}
.fs-eyebrow.is-centered { justify-content: center; }
.fs-dark .fs-eyebrow { color: var(--wp--preset--color--ciel); }

/* ---------- Marque ---------- */
.wp-block-site-title { display: flex; align-items: center; gap: .55rem; }
.wp-block-site-title::before {
	content: "FS"; flex: 0 0 auto;
	width: 1.85rem; height: 1.85rem;
	display: grid; place-items: center;
	background: var(--wp--preset--color--encre);
	color: #fff;
	font-family: var(--wp--preset--font-family--serif);
	font-size: .72rem; font-weight: 700;
	border-radius: 5px;
}
.fs-dark .wp-block-site-title::before { background: #fff; color: var(--wp--preset--color--encre); }
.wp-block-site-title a { text-decoration: none !important; }

/* ---------- En-tête ---------- */
.fs-header {
	border-bottom: 1px solid var(--fs-line);
	background: rgba(255,255,255,.88);
	backdrop-filter: saturate(140%) blur(8px);
	position: sticky; top: 0; z-index: 30;
}
.admin-bar .fs-header { top: 32px; }
.fs-header .wp-block-navigation a { text-decoration: none; color: var(--wp--preset--color--encre); }
.fs-header .wp-block-navigation-item__content { position: relative; }
.fs-header .wp-block-navigation-item__content::after {
	content: ""; position: absolute; left: 0; right: 0; bottom: .3rem; height: 1.5px;
	background: var(--wp--preset--color--azur);
	transform: scaleX(0); transform-origin: left;
	transition: transform .22s var(--fs-ease);
}
.fs-header .wp-block-navigation-item__content:hover::after,
.fs-header .current-menu-item .wp-block-navigation-item__content::after { transform: scaleX(1); }

/* ---------- Rythme des sections ---------- */
.fs-section { padding-block: clamp(2.5rem, 4.5vw, 3.75rem); }
.fs-section--tight { padding-block: clamp(1.5rem, 2.5vw, 2rem); }
/* Sections separees par un filet : tout l'espacement vient du filet
   interieur, sinon les paddings se cumulent et creent un grand vide. */
.fs-section--flush { padding-block: 0; }
.fs-section--flush:last-child { padding-bottom: clamp(2.5rem, 4.5vw, 3.75rem); }
.fs-section + .fs-section > .wp-block-group,
.fs-divide { border-top: 1px solid var(--fs-line); }

/* En-tête de section : mesure courte, aligné à gauche. */
.fs-section-head { max-width: 46ch; }
.fs-section-head > * { margin-inline: 0 !important; }
.fs-section-head h2 { margin-bottom: .55rem; }
.fs-section-head p:last-child { margin-bottom: 0; }

/* ---------- Panneaux : la brique de contraste ---------- */
.fs-panel {
	border-radius: var(--fs-radius);
	padding: clamp(1.5rem, 3vw, 2.35rem);
	background: var(--wp--preset--color--blanc);
	border: 1px solid var(--fs-line);
	box-shadow: var(--fs-panel-shadow);
}
.fs-panel--dark {
	background: var(--wp--preset--color--encre);
	border-color: var(--fs-line-dark);
	box-shadow: 0 24px 52px -28px rgba(12,27,46,.55);
}
.fs-panel--quiet { background: var(--wp--preset--color--blanc); box-shadow: none; }

/* ---------- Sections sombres ---------- */
.fs-dark { color: #E8EEF5; }
.fs-dark :where(h1,h2,h3,h4) { color: #fff; }
.fs-dark a:not(.wp-element-button) { color: var(--wp--preset--color--ciel); }
.fs-dark a:not(.wp-element-button):hover { color: #fff; }
.fs-dark .wp-block-button__link {
	background: #fff !important; color: var(--wp--preset--color--encre) !important;
}
.fs-dark .wp-block-button__link:hover { background: var(--wp--preset--color--ciel) !important; }
.fs-dark .is-style-outline .wp-block-button__link {
	background: transparent !important; color: #fff !important;
	border: 1.5px solid rgba(255,255,255,.4) !important;
}
.fs-dark .is-style-outline .wp-block-button__link:hover { background: rgba(255,255,255,.1) !important; }

/* ---------- Panneau pose sur une image ---------- */
/* Volontairement opaque : un backdrop-filter ici force le navigateur a
   rasteriser l'arriere-plan de la couverture, et l'image de fond
   disparait completement. Constate sur Chrome. */
.fs-glass {
	background: #16324F;
	border: 1px solid rgba(255, 255, 255, .14);
	border-radius: 12px;
	padding: clamp(1.25rem, 2.5vw, 1.75rem);
	box-shadow: 0 20px 44px -24px rgba(0, 0, 0, .55);
}
.fs-glass :where(h2, h3) { margin-top: 0; }
.fs-glass > :last-child { margin-bottom: 0; }

/* ---------- Bloc de couverture ---------- */
/* En pleine largeur, la couverture touche les bords de l'ecran : plus de
   marges pales sur les cotes, qui donnaient une impression de vide. */
.wp-block-cover.alignfull { border-radius: 0; margin-inline: 0; }
.fs-section:has(> .wp-block-cover.alignfull) { padding-block: 0; }
.wp-block-cover__image-background { object-fit: cover; }

/* ---------- Cartes ---------- */
.fs-card {
	position: relative;
	background: var(--wp--preset--color--blanc);
	border: 1px solid var(--fs-line);
	border-radius: 10px;
	padding: 1.15rem 1.15rem 1.25rem;
	box-shadow: 0 1px 2px rgba(12,27,46,.03);
	transition: transform .22s var(--fs-ease), box-shadow .22s var(--fs-ease),
	            border-color .22s var(--fs-ease);
	overflow: hidden;
}
.fs-card::before {
	content: ""; position: absolute; inset: 0 auto 0 0; width: 2px;
	background: var(--wp--preset--color--azur);
	transform: scaleY(0); transform-origin: top;
	transition: transform .26s var(--fs-ease);
}
.fs-card:hover, .fs-card:focus-within {
	transform: translateY(-2px);
	box-shadow: var(--fs-panel-shadow-lift);
	border-color: var(--fs-line-strong);
}
.fs-card:hover::before, .fs-card:focus-within::before { transform: scaleY(1); }
.fs-card :where(h2,h3) { margin: 0 0 .45rem; }
.fs-card :where(h2,h3) a { text-decoration: none; color: var(--wp--preset--color--encre); }
.fs-card :where(h2,h3) a:hover { color: var(--wp--preset--color--azur); }
.fs-card :where(h2,h3) a::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.fs-card p { margin: 0 0 .5rem; }
.fs-card > :last-child { margin-bottom: 0; }
.fs-card .wp-block-post-date { color: var(--wp--preset--color--ardoise); }

/* Image d'illustration : elle affleure les bords de la carte, avec un
   ratio fixe pour eviter tout decalage de mise en page au chargement. */
.fs-card .wp-block-post-featured-image {
	margin: -1.15rem -1.15rem 0.9rem;
	border-radius: 10px 10px 0 0;
	overflow: hidden;
	background: var(--wp--preset--color--brume);
}
.fs-card .wp-block-post-featured-image img {
	display: block; width: 100%;
	aspect-ratio: 16 / 6.5; object-fit: cover;
	transition: transform .4s var(--fs-ease);
}
.fs-card:hover .wp-block-post-featured-image img { transform: scale(1.03); }
.fs-cards-numbered .fs-card .wp-block-post-featured-image { margin-top: -2.9rem; }
@media (prefers-reduced-motion: reduce) {
	.fs-card .wp-block-post-featured-image img { transition: none; }
	.fs-card:hover .wp-block-post-featured-image img { transform: none; }
}

/* Banniere d'article et de page expertise */
.wp-block-post-featured-image { border-radius: 10px; overflow: hidden; }
.wp-block-post-featured-image img { display: block; width: 100%; }

/* height:100% uniquement dans les grilles de boucle : dans une pile
   verticale, il ferait prendre toute la hauteur du conteneur a chaque
   carte, et le contenu deborderait sur la section suivante. */
.wp-block-post-template .fs-card { height: 100%; }

/* Les termes affiches en sur-titre sont des liens : on retire le
   soulignement herite. */
.fs-eyebrow a { text-decoration: none; color: inherit; }
.fs-eyebrow a:hover { text-decoration: underline; }

/* Numérotation générée, jamais saisie dans le contenu. */
.fs-cards-numbered { counter-reset: fscard; }
.fs-cards-numbered .fs-card { counter-increment: fscard; padding-top: 2.9rem; }
.fs-cards-numbered .fs-card::after {
	content: "0" counter(fscard);
	position: absolute; top: 1.2rem; left: 1.35rem;
	font-family: var(--wp--preset--font-family--serif);
	font-size: .88rem; font-weight: 700;
	color: var(--wp--preset--color--azur);
}

@media (prefers-reduced-motion: reduce) {
	.fs-card, .fs-card::before, .wp-block-button__link,
	.fs-header .wp-block-navigation-item__content::after { transition: none; }
	.fs-card:hover { transform: none; }
}

/* ---------- Chiffres ---------- */
/* Nombre de colonnes deduit du contenu : ajouter ou retirer un chiffre
   ne casse plus la mise en page. */
.fs-stats { display: grid; gap: 0; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); }
@media (max-width: 780px) { .fs-stats { grid-template-columns: repeat(2, 1fr); } }
.fs-stats > .wp-block-column { padding: .2rem 1.25rem; border-left: 1px solid var(--fs-line); }
.fs-stats > .wp-block-column:first-child { border-left: 0; padding-left: 0; }
@media (max-width: 780px) {
	.fs-stats > .wp-block-column { padding: .9rem 1rem; }
	.fs-stats > .wp-block-column:nth-child(odd) { border-left: 0; padding-left: 0; }
}
.fs-stat-value {
	font-family: var(--wp--preset--font-family--serif);
	font-size: clamp(1.7rem, 1rem + 1.9vw, 2.35rem);
	font-weight: 700; line-height: 1; letter-spacing: -.03em;
	font-variant-numeric: tabular-nums;
	color: var(--wp--preset--color--marine);
	margin: 0 0 .3rem;
}
.fs-stat-label {
	font-size: .84rem; line-height: 1.4; color: var(--wp--preset--color--ardoise);
	margin: 0; max-width: 22ch;
}

/* ---------- Boutons ---------- */
.wp-block-button__link {
	transition: background-color .18s var(--fs-ease), transform .14s var(--fs-ease),
	            box-shadow .18s var(--fs-ease);
	box-shadow: 0 1px 2px rgba(12,27,46,.14);
}
.wp-block-button__link:hover { transform: translateY(-1px); box-shadow: 0 8px 18px -8px rgba(12,27,46,.45); }
.wp-block-button__link:active { transform: none; }
.is-style-outline .wp-block-button__link {
	box-shadow: none; border: 1.5px solid var(--fs-line-strong);
	background: transparent; color: var(--wp--preset--color--encre);
}
.is-style-outline .wp-block-button__link:hover {
	background: var(--wp--preset--color--brume); border-color: var(--fs-line-strong);
}

/* ---------- Liens « voir tout » ---------- */
.fs-more-link { margin: 0; }
.fs-more-link a {
	text-decoration: none; font-weight: 600; font-size: .88rem;
	color: var(--wp--preset--color--azur);
	display: inline-flex; align-items: center; gap: .35rem;
}
.fs-more-link a::after { content: "→"; transition: transform .2s var(--fs-ease); }
.fs-more-link a:hover { text-decoration: underline; text-underline-offset: 3px; }
.fs-more-link a:hover::after { transform: translateX(3px); }

/* ---------- États vides ---------- */
.wp-block-query-no-results {
	border: 1px dashed var(--fs-line-strong); border-radius: 10px;
	padding: 1.25rem 1.35rem; background: var(--wp--preset--color--blanc);
	color: var(--wp--preset--color--ardoise); font-size: .92rem;
}
.wp-block-query-no-results p:last-child { margin-bottom: 0; }
.fs-dark .wp-block-query-no-results {
	border-color: var(--fs-line-dark); background: rgba(255,255,255,.04); color: #A9BED2;
}

/* ---------- Fil d'Ariane ---------- */
.fs-breadcrumb { font-size: .82rem; color: var(--wp--preset--color--ardoise); margin-bottom: 1rem; }
.fs-breadcrumb ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .2rem .5rem; }
.fs-breadcrumb li { display: flex; align-items: center; gap: .5rem; }
.fs-breadcrumb li + li::before { content: "›"; color: var(--fs-line-strong); }
.fs-breadcrumb a { color: var(--wp--preset--color--ardoise); text-decoration: none; }
.fs-breadcrumb a:hover { text-decoration: underline; }
.fs-breadcrumb [aria-current="page"] { color: var(--wp--preset--color--encre); font-weight: 500; }

/* ---------- Contenu long ---------- */
.wp-block-post-content > p { line-height: 1.75; }
.wp-block-post-content > :where(h2) { margin-top: 2.4rem; }
.wp-block-post-content > :where(h3) { margin-top: 1.8rem; }
.wp-block-post-content :where(blockquote) {
	border-left: 2px solid var(--wp--preset--color--azur);
	padding-left: 1.15rem; margin-left: 0; font-style: normal;
}
.wp-block-post-content :where(ul,ol) { padding-left: 1.1rem; }
.wp-block-post-content :where(li) { margin-bottom: .35rem; }
.fs-verified { font-size: .84rem; color: var(--wp--preset--color--ardoise); }

/* ---------- Pied de page ---------- */
.fs-footer { border-top: 1px solid var(--fs-line-dark); }
.fs-footer .wp-block-latest-posts { list-style: none; padding: 0; margin: 0; }
.fs-footer .wp-block-latest-posts li { margin-bottom: .4rem; line-height: 1.4; }
.fs-footer .wp-block-navigation a { text-decoration: none; }
.fs-footer .wp-block-navigation a:hover { text-decoration: underline; }

/* ---------- Accessibilité ---------- */
:where(a,button,input,select,textarea,summary):focus-visible {
	outline: 3px solid rgba(26,83,144,.5); outline-offset: 2px; border-radius: 3px;
}
.fs-dark :where(a,button):focus-visible { outline-color: rgba(255,255,255,.8); }
.fs-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.wp-block-navigation .wp-block-navigation-item__content { min-height: 44px; display: flex; align-items: center; }

/* ==================================================================
   Grille de fond
   ------------------------------------------------------------------
   Motif de 40 px applique sur toute la page. C'est ce qui occupe les
   marges laterales : sans lui, un ecran large laisse deux grandes
   bandes pales de chaque cote du contenu.
   Les panneaux et les couvertures etant opaques, la grille ne se voit
   que dans les gouttieres et entre les sections — exactement l'effet
   recherche.
   ================================================================== */
body {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40'%3E%3Cpath d='M 40 0 L 0 0 0 40' fill='none' stroke='%23D0DCEB' stroke-width='1'/%3E%3C/svg%3E");
	background-size: 40px 40px;
	background-position: center top;
	background-repeat: repeat;
}
/* Teinte de la trame : #D0DCEB, soit environ trois fois le contraste du gris
   d'origine, et franchement bleue (B-R = 27). Pour l'ajuster, remplacer la
   valeur %23D0DCEB ci-dessus : %23DCE6F2 plus discret, %23C8D7E8 plus marque. */
/* La grille ne doit pas traverser les zones de contenu opaques. */
.fs-panel, .fs-card, .wp-block-cover { background-clip: padding-box; }

/* ==================================================================
   Pictogrammes — Lucide (licence ISC)
   ------------------------------------------------------------------
   Poses en filigrane dans l'angle des cartes de methode : ils donnent
   une texture et une lecture rapide de l'etape, sans concurrencer la
   numerotation ni alourdir la carte. Volontairement absents des cartes
   d'expertises, qui portent deja une photographie.
   ================================================================== */
.fs-cards-numbered .fs-card::before {
	content: "";
	position: absolute; top: 1rem; right: 1rem;
	width: 3.25rem; height: 3.25rem;
	background-repeat: no-repeat; background-position: center;
	background-size: contain;
	opacity: .10;
	transition: opacity .25s var(--fs-ease), transform .25s var(--fs-ease);
	transform: none;
	pointer-events: none;
	z-index: 0;
}
.fs-cards-numbered .fs-card:hover::before { opacity: .18; transform: translateY(-2px); }

/* 01 — Diagnostic : loupe */
.fs-cards-numbered .fs-card:nth-of-type(1)::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230C1B2E' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='m21 21-4.3-4.3'/%3E%3C/svg%3E");
}
/* 02 — Priorisation : liste cochee */
.fs-cards-numbered .fs-card:nth-of-type(2)::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230C1B2E' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m3 17 2 2 4-4'/%3E%3Cpath d='m3 7 2 2 4-4'/%3E%3Cpath d='M13 6h8'/%3E%3Cpath d='M13 12h8'/%3E%3Cpath d='M13 18h8'/%3E%3C/svg%3E");
}
/* 03 — Execution et mesure : courbe ascendante */
.fs-cards-numbered .fs-card:nth-of-type(3)::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230C1B2E' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='22 7 13.5 15.5 8.5 10.5 2 17'/%3E%3Cpolyline points='16 7 22 7 22 13'/%3E%3C/svg%3E");
}
/* Le contenu de la carte passe devant le filigrane */
.fs-cards-numbered .fs-card > * { position: relative; z-index: 1; }

/* --- Pictogrammes en ligne (page Contact, pied de page) ------------- */
.fs-ico { display: inline-flex; align-items: center; gap: .55rem; }
.fs-ico::before {
	content: ""; flex: 0 0 auto; width: 1.05em; height: 1.05em;
	background-repeat: no-repeat; background-position: center; background-size: contain;
}
.fs-ico--mail::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231A5390' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='20' height='16' x='2' y='4' rx='2'/%3E%3Cpath d='m22 7-8.97 5.7a1.94 1.94 0 0 1-2.06 0L2 7'/%3E%3C/svg%3E");
}
.fs-ico--tel::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231A5390' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72 12.84 12.84 0 0 0 .7 2.81 2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45 12.84 12.84 0 0 0 2.81.7A2 2 0 0 1 22 16.92z'/%3E%3C/svg%3E");
}
.fs-ico--linkedin::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231A5390' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 8a6 6 0 0 1 6 6v7h-4v-7a2 2 0 0 0-2-2 2 2 0 0 0-2 2v7h-4v-7a6 6 0 0 1 6-6z'/%3E%3Crect width='4' height='12' x='2' y='9'/%3E%3Ccircle cx='4' cy='4' r='2'/%3E%3C/svg%3E");
}
.fs-dark .fs-ico::before { filter: brightness(0) invert(1) opacity(.75); }

@media (prefers-reduced-motion: reduce) {
	.fs-cards-numbered .fs-card::before { transition: none; }
	.fs-cards-numbered .fs-card:hover::before { transform: none; }
}


/* ============================================================
   IDENTITE DE MARQUE — logo French Square
   ============================================================
   Le logo est pose dans WordPress (Apparence > Editeur > Styles,
   ou Reglages du site), pas code en dur ici : le bloc wp:site-logo
   de parts/header.html lit l'option custom_logo. Le CSS ci-dessous
   ne fait que le dimensionner et gerer les fonds sombres.
   ------------------------------------------------------------ */

/* --- En-tete : le logo porte deja le nom, le titre textuel devient
       un simple filet de secours si aucun logo n'est defini. ------ */
.fs-marque {
	align-items: center;
}

.fs-marque .wp-block-site-logo {
	line-height: 0;
}

.fs-marque .wp-block-site-logo img {
	display: block;
	width: 215px;
	max-width: 46vw;
	height: auto;
}

/* Quand un logo est present, on masque le titre textuel : il ferait
   doublon avec le lettrage du logo. Il reste dans le DOM pour les
   lecteurs d'ecran et les moteurs. */
.fs-marque:has(.wp-block-site-logo) .fs-marque__texte {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

/* Repli pour les navigateurs sans :has() — le titre reste affiche,
   ce qui est degrade mais jamais casse. */
@supports not selector(:has(*)) {
	.fs-marque .wp-block-site-logo img { width: 44px; }
}

@media (max-width: 600px) {
	.fs-marque .wp-block-site-logo img { width: 168px; }
}

/* --- Pied de page : sur fond encre, le logo bleu marine disparaitrait.
       On y substitue la variante claire, livree avec le theme comme
       ressource graphique (chemin relatif, pas d'URL de media en dur). --- */
.fs-footer-marque {
	position: relative;
	min-height: 46px;
}

.fs-footer-marque::before {
	content: "";
	display: block;
	width: 232px;
	max-width: 100%;
	aspect-ratio: 1969 / 420;
	background-image: url("assets/img/logo-clair.png");
	background-repeat: no-repeat;
	background-position: left center;
	background-size: contain;
}

.fs-footer-marque .wp-block-site-title {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	white-space: nowrap;
}

/* --- Filigrane : le motif reseau du logo, tres en retrait, cale dans
       l'angle bas-droit du pied de page. Il donne de la matiere au
       bloc sombre sans ajouter un seul element de contenu. --------- */
.fs-footer {
	position: relative;
	overflow: hidden;
	isolation: isolate;
}

.fs-footer::after {
	content: "";
	position: absolute;
	right: -3rem;
	bottom: -4rem;
	width: 26rem;
	height: 26rem;
	background-image: url("assets/img/symbole-clair.png");
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
	opacity: .07;
	pointer-events: none;
	z-index: -1;
}

@media (max-width: 782px) {
	.fs-footer::after { width: 17rem; height: 17rem; right: -2.5rem; bottom: -3rem; }
}
