/*
 * Le site public aux maquettes « Galri v2 » (lot 8 de la refonte graphique) : en-tête, accueil,
 * catégorie, carte d'exposition. Les couleurs viennent des jetons (`tokens/colors.css`), jamais
 * de valeurs écrites ici. Le balisage `gs-*` est produit par `inc/site/site.php` et les gabarits.
 */
:root {
	--gs-font-display: var(--wp--preset--font-family--archivo, "Archivo", system-ui, sans-serif);
	--gs-font-body: var(--wp--preset--font-family--inter, "Inter", system-ui, sans-serif);
	--gs-radius-card: var(--radius-card);
	--gs-shadow-raised: var(--shadow-lg);
	/* La marge de côté du site : 24 px, 16 sur téléphone (`--gutter`, `--gutter-mobile`). */
	--gs-gutter: var(--gutter, 24px);
}
@media (max-width: 600px) {
	:root { --gs-gutter: var(--gutter-mobile, 16px); }
}
/* Les pages refaites posent leur propre marge de côté. La règle de `style.css` qui retire 2rem à la
   largeur des blocs sous 77rem (écrite pour les anciennes pages, sans marge) l'y doublait : 32 px
   au lieu de 16 sur téléphone. */
@media (max-width: 79rem) {
	:is(.gs-home, .gs-category, .gs-expo, .gs-pricing, .gs-shop, .gs-product-page, .gs-cart, .gs-checkout),
	.wp-site-blocks > .is-layout-constrained:is(.gs-home, .gs-category, .gs-expo, .gs-pricing, .gs-shop, .gs-product-page, .gs-cart, .gs-checkout) {
		--wp--style--global--content-size: 100%;
		--wp--style--global--wide-size: 100%;
	}
}

/* Le lissage des maquettes (`base.css` du système de design), comme la webapp depuis le 14/10 : sans
   lui, le navigateur lisse en sous-pixels et tout le texte sort plus gras qu'à l'écran dessiné. */
body {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

/* ---- Boutons ---- */
.gs-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	/* Les cotes du bouton du système de design (`.gx-btn`) : 42 px, 34 px en petit, 52 px en grand. */
	height: 42px;
	padding: 0 24px;
	border-radius: 999px;
	border: 1px solid transparent;
	font-family: var(--gs-font-display);
	font-weight: 600;
	font-size: 14px;
	letter-spacing: 0.01em;
	line-height: 1;
	text-decoration: none;
	white-space: nowrap;
	cursor: pointer;
	transition: background-color .16s, border-color .16s, color .16s;
}
/* Le thème colore les liens du contenu avec plus de poids : la couleur du texte d'un bouton passe devant. */
a.gs-btn--primary, .gs-btn--primary { background: var(--primary); color: var(--text-on-accent) !important; }
a.gs-btn--primary:hover, .gs-btn--primary:hover { background: var(--primary-hover); color: var(--text-on-accent) !important; }
a.gs-btn--ghost, .gs-btn--ghost { background: transparent; color: var(--text) !important; }
a.gs-btn--ghost:hover, .gs-btn--ghost:hover { background: var(--neutral-100); color: var(--text) !important; }
a.gs-btn--light, .gs-btn--light { background: var(--neutral-0); color: var(--noir) !important; }
a.gs-btn--light:hover, .gs-btn--light:hover { background: var(--neutral-100); color: var(--noir) !important; }
/* Le bouton sombre (`gx-btn--dark`) : le panier, l'envoi d'un avis. */
a.gs-btn--dark, .gs-btn--dark { background: var(--noir); color: var(--neutral-0) !important; }
a.gs-btn--dark:hover, .gs-btn--dark:hover { background: var(--neutral-800); color: var(--neutral-0) !important; }
/* Le bouton secondaire (`gx-btn--secondary`) : fond de surface et filet intérieur. */
a.gs-btn--secondary, .gs-btn--secondary { background: var(--surface); color: var(--text) !important; box-shadow: var(--ring-inset); }
a.gs-btn--secondary:hover, .gs-btn--secondary:hover { background: var(--neutral-100); color: var(--text) !important; }
.gs-btn--sm { height: 34px; padding: 0 16px; font-size: 12px; }
.gs-btn--lg { height: 52px; padding: 0 32px; font-size: 16px; }

.gs-eyebrow {
	font-family: var(--gs-font-display);
	font-weight: 600;
	font-size: 12px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--text-muted);
}

/* ---- En-tête ---- */
/* L'ancien thème flottait son en-tête à 1rem du haut et réservait 6rem au contenu : la maquette le
   colle en haut de page, 64 px de haut, sur le fond de page des jetons. */
body:has(.gs-header) { background: var(--bg); }
body:has(.gs-header) .wp-site-blocks { padding-top: 65px; }
body:has(.gs-header) .wp-site-blocks > header { top: 0; }
.gs-header {
	z-index: 50;
	background: color-mix(in srgb, var(--bg) 88%, transparent);
	backdrop-filter: blur(var(--blur-md));
	border-bottom: 1px solid var(--neutral-150);
	margin: 0;
}
.gs-header__bar {
	max-width: 1280px;
	margin: 0 auto;
	height: 64px;
	padding: 0 24px;
	gap: 24px;
}
.gs-header__brand {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	text-decoration: none;
	color: var(--text);
	font-family: var(--gs-font-display);
	font-weight: 500;
	font-size: 11px;
	letter-spacing: 0.12em;
}
.gs-header__brand img { width: auto; height: 24px; display: block; }
.gs-header__nav { margin: 0; }
.gs-header__nav .wp-block-navigation__container { gap: 24px; }
.gs-header .gs-nav-link a,
.gs-header .gs-nav-link .wp-block-navigation-item__content {
	display: inline-flex;
	align-items: center;
	height: 23px;
	padding: 0;
	font-family: var(--gs-font-display);
	font-weight: 500;
	font-size: 14px;
	/* Le thème colore les liens avec plus de poids. */
	color: var(--text-secondary) !important;
	text-decoration: none;
}
.gs-header .gs-nav-link a:hover { color: var(--text) !important; }
/* La page en cours, en vert comme « Boutique » sur la maquette « Boutique » (1a). */
.gs-header .gs-nav-link.current-menu-item a,
.header-mobile-menu .gs-nav-link.current-menu-item a { color: var(--primary-active) !important; }
/* La mise en page « flex » de WordPress remet les marges de ses enfants à zéro : la recherche et ce
   qui la suit ne se rangeaient pas à droite. */
.gs-header__bar > .gs-header__search { flex: 0 1 220px; margin: 0 0 0 auto !important; }
.gs-header__search input[type="search"] {
	width: 100%;
	height: 42px;
	padding: 0 16px 0 48px;
	border-radius: 999px;
	border: 1px solid var(--border);
	background: var(--surface) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2386867f' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E") no-repeat 16px center;
	font-family: var(--gs-font-body);
	font-size: 14px;
	color: var(--text);
	outline: none;
}
.gs-header__search input[type="search"]:focus { border-color: var(--sky-400); }
.gs-header__actions { display: flex; align-items: center; gap: 8px; margin: 0; }
/* L'en-tête d'une boutique privée (maquette « Boutique », 3a) : la marque, un filet, le nom de
   l'exposition et la pastille « Boutique privée » ; le panier seul à droite. */
.gs-header--private-shop .gs-header__bar { gap: 24px; }
.gs-header__private { display: flex; flex: 1; align-items: center; gap: 24px; min-width: 0; margin: 0; }
.gs-header__divider { flex: none; width: 1px; height: 24px; background: var(--neutral-150); }
.gs-header__shop-name { min-width: 0; overflow: hidden; font-family: var(--gs-font-display); font-weight: 600; font-size: 14px; color: var(--text) !important; white-space: nowrap; text-overflow: ellipsis; text-decoration: none; }
a.gs-header__shop-name:hover { text-decoration: underline; }
.gs-badge-dot { display: inline-flex; flex: none; align-items: center; gap: 4px; height: 22px; padding: 0 12px; border-radius: 999px; background: var(--neutral-150); color: var(--neutral-700); font-family: var(--gs-font-display); font-weight: 600; font-size: 12px; letter-spacing: 0.02em; white-space: nowrap; }
.gs-badge-dot::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.gs-header--private-shop .header-cart { margin-left: auto !important; }
@media (max-width: 600px) {
	.gs-header--private-shop .gs-header__bar,
	.gs-header__private { gap: 12px; }
	.gs-header--private-shop .gs-header__brand span { display: none; }
}
.gs-header .header-cart { margin: 0; }
/* Le panier, d'après la maquette « Boutique » : une pastille noire « Panier · 2 » (bouton `dark`
   petit, 34 px). C'est le mini-panier de WooCommerce, redessiné : son tiroir s'ouvre toujours. Ses
   couleurs sont celles de `.gs-btn--dark`, que son balisage ne peut pas porter. */
.gs-header .header-cart .wc-block-mini-cart__button {
	display: inline-flex;
	align-items: center;
	gap: 0;
	height: 34px;
	padding: 0 16px;
	border: 0;
	border-radius: 999px;
	background: var(--noir);
	color: var(--neutral-0);
	font-family: var(--gs-font-display);
	font-weight: 600;
	font-size: 12px;
	letter-spacing: 0.01em;
	line-height: 1;
	white-space: nowrap;
	cursor: pointer;
	transition: background-color .16s, box-shadow .2s;
}
.gs-header .header-cart .wc-block-mini-cart__button:hover { background: var(--neutral-800); box-shadow: var(--shadow-lg); }
.gs-header .header-cart .wc-block-mini-cart__button::before { content: "Panier"; }
.gs-header .header-cart .wc-block-mini-cart__quantity-badge { display: inline-flex; align-items: center; }
.gs-header .header-cart .wc-block-mini-cart__icon { display: none; }
/* Le nombre d'articles suit le mot, séparé d'un point médian ; rien quand le panier est vide. */
.gs-header .header-cart .wc-block-mini-cart__badge {
	position: static;
	display: inline;
	min-width: 0;
	height: auto;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: none !important;
	color: inherit !important;
	font: inherit;
	transform: none;
}
.gs-header .header-cart .wc-block-mini-cart__badge:not(:empty)::before { content: "·"; margin: 0 5px; }
.gs-header .header-cart .wc-block-mini-cart__badge:empty { display: none; }

/* Le tiroir du panier, comme les panneaux « Cartel » et « Livre d'or » de la webapp
   (`components/viewer/viewer-panel.tsx`) : 380 px à droite, sans voile sur la page, filet et ombre de panneau, 28 px de marge, surtitre gris et croix de 34 px. Le
   contenu reprend l'écran « Votre panier » de la maquette « Boutique ». */
.wc-block-components-drawer__screen-overlay:has(.wc-block-mini-cart__drawer) { background-color: transparent !important; }
.wc-block-mini-cart__drawer.wc-block-components-drawer {
	width: 380px;
	max-width: 100%;
	/* Le panneau latéral du système : filet `--neutral-150` à gauche et `--shadow-panel`. */
	border-left: 1px solid var(--neutral-150);
	box-shadow: var(--shadow-panel);
}
/* WooCommerce trace aussi un cadre de 1 px (noir translucide) par un `::after` : la ligne foncée à
   gauche du tiroir. Le filet clair ci-dessus le remplace. */
.wc-block-mini-cart__drawer.wc-block-components-drawer::after { display: none; }
.wc-block-mini-cart__drawer .wc-block-components-drawer__content { background: var(--surface); }
.wc-block-mini-cart__drawer .wp-block-woocommerce-mini-cart-contents { padding: 0; }
.wc-block-mini-cart__drawer .wc-block-mini-cart__title {
	position: relative;
	display: flex;
	align-items: center;
	gap: 6px;
	min-height: 34px;
	box-sizing: content-box;
	margin: 0;
	padding: 28px 76px 20px 28px;
	font-family: var(--gs-font-display);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.12em;
	line-height: 1;
	text-transform: uppercase;
	color: var(--text-muted);
	border: 0;
	mask-image: none;
}
.wc-block-mini-cart__drawer .wc-block-mini-cart__title > * { margin: 0; font: inherit; color: inherit; }
/* La croix de secours du thème (`inc/site/site.php`), pour le cas où WooCommerce n'affiche pas la sienne. */
.wc-block-mini-cart__drawer .gs-drawer-close {
	position: absolute;
	top: 28px;
	right: 28px;
	display: grid;
	place-items: center;
	width: 34px;
	height: 34px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: transparent;
	color: var(--text);
	cursor: pointer;
	transition: background-color .16s;
}
.wc-block-mini-cart__drawer .gs-drawer-close:hover { background: var(--neutral-100); }
/* La croix de WooCommerce, quand il l'affiche, au même dessin ; la nôtre se retire alors. Le
   sélecteur porte aussi `.wc-block-components-button` : sans quoi les règles de WooCommerce
   (marge de -1em, marge intérieure de 1em en !important, son icône) l'emportaient et décalaient la
   croix du titre. */
.wc-block-mini-cart__drawer .wc-block-components-button.wc-block-components-drawer__close {
	position: absolute !important;
	top: 28px;
	right: 28px;
	left: auto;
	z-index: 2;
	display: grid;
	place-items: center;
	width: 34px;
	height: 34px;
	min-height: 0;
	margin: 0;
	padding: 0 !important;
	border: 0;
	border-radius: 50%;
	background: transparent !important;
	color: var(--text) !important;
	opacity: 1;
	cursor: pointer;
	transition: background-color .16s;
}
.wc-block-mini-cart__drawer .wc-block-components-button.wc-block-components-drawer__close:hover { background: var(--neutral-100) !important; }
.wc-block-mini-cart__drawer .wc-block-components-button.wc-block-components-drawer__close svg { display: none; }
/* Le tracé de la croix des panneaux de la webapp (lucide `X`, 16 px, trait de 2, bouts arrondis),
   à la place de l'icône de WooCommerce. */
.wc-block-mini-cart__drawer .wc-block-components-button.wc-block-components-drawer__close::before {
	content: "";
	width: 16px;
	height: 16px;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 6 6 18M6 6l12 12'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 6 6 18M6 6l12 12'/%3E%3C/svg%3E") center / contain no-repeat;
}
.wc-block-mini-cart__drawer:has(.wc-block-components-drawer__close) .gs-drawer-close { display: none; }
.wc-block-mini-cart__drawer .wc-block-mini-cart__items { padding: 0 28px; }
.wc-block-mini-cart__drawer .wc-block-mini-cart__products-table { margin: 0; }
.wc-block-mini-cart__drawer table.wc-block-cart-items { margin: 0; border: 0; }
.wc-block-mini-cart__drawer .wc-block-cart-items__row {
	display: grid !important;
	grid-template-columns: 64px minmax(0, 1fr) auto;
	gap: 16px;
	align-items: start;
	padding: 16px 0 !important;
	border-bottom: 1px solid var(--neutral-150);
}
.wc-block-mini-cart__drawer .wc-block-cart-item__image { padding: 0 !important; width: 64px; }
.wc-block-mini-cart__drawer .wc-block-cart-item__image a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 64px;
	height: 64px;
	padding: 6px;
	box-sizing: border-box;
	border-radius: 14px;
	background: var(--neutral-100);
}
.wc-block-mini-cart__drawer .wc-block-cart-item__image img { width: auto !important; max-width: 100%; max-height: 52px; object-fit: contain; }
.wc-block-mini-cart__drawer .wc-block-cart-item__product { padding: 0 !important; }
.wc-block-mini-cart__drawer .wc-block-cart-item__wrap { display: flex; flex-direction: column; gap: 4px; }
.wc-block-mini-cart__drawer .wc-block-components-product-name {
	font-family: var(--gs-font-display);
	font-size: 14px;
	font-weight: 600;
	line-height: 1.3;
	color: var(--text) !important;
	text-decoration: none;
}
.wc-block-mini-cart__drawer .wc-block-cart-item__prices,
.wc-block-mini-cart__drawer .wc-block-components-product-metadata {
	margin: 0;
	font-family: var(--gs-font-body);
	font-size: 12px;
	color: var(--text-secondary);
}
.wc-block-mini-cart__drawer .wc-block-components-product-metadata p { margin: 0; }
.wc-block-mini-cart__drawer .wc-block-cart-item__quantity { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 8px; }
.wc-block-mini-cart__drawer .wc-block-components-quantity-selector {
	width: auto;
	height: 34px;
	box-sizing: border-box;
	margin: 0;
	border: 1px solid var(--border);
	border-radius: 999px;
	overflow: hidden;
}
.wc-block-mini-cart__drawer .wc-block-components-quantity-selector::after { display: none; }
.wc-block-mini-cart__drawer .wc-block-components-quantity-selector__input {
	width: 34px;
	height: 100%;
	min-height: 0;
	min-width: 0;
	font-family: var(--gs-font-display);
	font-size: 14px;
	font-weight: 600;
}
/* WooCommerce donne au champ 45 px de haut et 16 px : ramené à la pilule de 34. */
.wc-block-mini-cart__drawer .wc-block-components-quantity-selector input.wc-block-components-quantity-selector__input { height: 100%; min-height: 0; padding: 0; font-size: 14px; }
.wc-block-mini-cart__drawer .wc-block-components-quantity-selector__button { min-width: 32px; color: var(--text); opacity: 1; }
.wc-block-mini-cart__drawer .wc-block-cart-item__remove-link {
	padding: 0;
	font-family: var(--gs-font-body);
	font-size: 12px !important;
	color: var(--text-muted) !important;
	text-decoration: underline !important;
	text-underline-offset: 2px;
}
.wc-block-mini-cart__drawer .wc-block-cart-item__total { padding: 0 !important; text-align: right; }
.wc-block-mini-cart__drawer .wc-block-cart-item__total .wc-block-components-product-price {
	font-family: var(--gs-font-display);
	font-size: 14px;
	font-weight: 600;
	color: var(--text);
}
/* Le récapitulatif : sous-total, puis les deux boutons. */
.wc-block-mini-cart__drawer .wc-block-mini-cart__footer {
	box-sizing: border-box;
	padding: 20px 28px 28px;
	border-top: 1px solid var(--neutral-150);
	box-shadow: none;
}
.wc-block-mini-cart__drawer .wc-block-mini-cart__footer-subtotal {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: baseline;
	padding: 0;
	font-family: var(--gs-font-display);
}
.wc-block-mini-cart__drawer .wc-block-components-totals-item__label { font-size: 16px; font-weight: 600; color: var(--text); }
.wc-block-mini-cart__drawer .wc-block-mini-cart__footer-subtotal .wc-block-formatted-money-amount { font-size: 20px; font-weight: 700; color: var(--text); }
.wc-block-mini-cart__drawer .wc-block-components-totals-item__description {
	flex-basis: 100%;
	margin-top: 4px;
	font-family: var(--gs-font-body);
	font-size: 12px;
	color: var(--text-muted);
}
.wc-block-mini-cart__drawer .wc-block-mini-cart__footer-actions {
	display: flex;
	flex-direction: column-reverse;
	gap: 10px;
	margin-top: 18px;
}
.wc-block-mini-cart__drawer .wc-block-mini-cart__footer-actions .wc-block-components-button {
	box-sizing: border-box;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: 0;
	height: 52px;
	margin: 0;
	padding: 0 24px;
	border-radius: 999px;
	font-family: var(--gs-font-display);
	font-size: 16px;
	font-weight: 600;
	text-decoration: none;
	box-shadow: none;
}
.wc-block-mini-cart__drawer .wc-block-mini-cart__footer-checkout { background: var(--primary) !important; color: var(--text-on-accent) !important; border: 0 !important; }
.wc-block-mini-cart__drawer .wc-block-mini-cart__footer-checkout:hover { background: var(--primary-hover) !important; }
.wc-block-mini-cart__drawer .wc-block-mini-cart__footer-cart {
	height: 42px !important;
	background: transparent !important;
	color: var(--text) !important;
	border: 1px solid var(--border) !important;
	font-size: 14px !important;
}
.wc-block-mini-cart__drawer .wc-block-mini-cart__footer-cart:hover { background: var(--neutral-100) !important; }
.gs-header .header-hamburger { display: none; }

@media (max-width: 900px) {
	.gs-header__bar { padding: 0 16px; gap: 10px; }
	.gs-header__nav, .gs-header__search, .gs-header__login { display: none; }
	/* Le panier et le menu partent à droite, côte à côte. */
	.gs-header .header-cart { margin-left: auto; }
	.gs-header__actions { margin-left: 0; }
	.gs-header .header-hamburger { display: flex; }
}
@media (max-width: 480px) {
	.gs-header__create { display: none; }
}

/* ---- Accueil ---- */
.gs-home, .gs-category { padding: 24px 24px 80px; margin-top: 0; }
.gs-home > * + * { margin-top: 56px; }

/* ---- « À la une » : maquette « Galri v2 » ----
   1232 px (la largeur de l'en-tête, 1280 px, moins ses marges), proportion 16/6,5, halo de couleurs autour
   (le `gx-glow--strong` du système de design), fondu entre les expositions avec un lent zoom. */
.gs-hero-glow {
	position: relative;
	isolation: isolate;
	border-radius: 28px;
}
/* Plus précis que la règle `alignwide` de WordPress, qui l’emportait. */
.gs-home > .gs-hero-glow.alignwide {
	max-width: calc(1280px - 48px);
	/* 28 px sous l'en-tête, comme la maquette : `.gs-home` en donne déjà 24. */
	margin-top: 4px;
	margin-bottom: 6px;
}
.gs-hero-glow::before,
.gs-hero-glow::after {
	content: "";
	position: absolute;
	border-radius: inherit;
	background: conic-gradient(from 120deg, #95c11f, #8ccab2, #62aade, #ffdd00, #95c11f);
	pointer-events: none;
}
/* Le liseré : seul le bord du dégradé reste visible. */
.gs-hero-glow::before {
	inset: 0;
	padding: 2.5px;
	-webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
	-webkit-mask-composite: xor;
	mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
	mask-composite: exclude;
	z-index: 3;
}
/* Le halo, qui respire. */
.gs-hero-glow::after {
	inset: -4px;
	filter: blur(22px);
	opacity: 0.5;
	animation: gs-glow-pulse 3.4s ease-in-out infinite;
	z-index: 0;
}
@keyframes gs-glow-pulse { 0%, 100% { opacity: 0.42; } 50% { opacity: 0.7; } }
@media (prefers-reduced-motion: reduce) { .gs-hero-glow::after { animation: none; } }
.gs-hero {
	position: relative;
	z-index: 2;
	border-radius: 28px;
	overflow: hidden;
	background: var(--noir);
	aspect-ratio: 16 / 6.5;
	color: #fff;
}
.gs-hero__slide {
	position: absolute;
	inset: 0;
	opacity: 0;
	pointer-events: none;
	transition: opacity .7s cubic-bezier(0.16, 1, 0.3, 1);
}
.gs-hero__slide.is-active { opacity: 1; pointer-events: auto; }
/* Les diapositives viennent de la boucle de requête (`div` > `ul` > `li`) : ces enveloppes ne comptent
   pas dans la mise en page, chaque diapositive se place sur `.gs-hero` comme avant. */
.gs-hero__query, ul.gs-hero__slides, ul.gs-hero__slides > li { display: contents; }
.gs-hero__image {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transform: scale(1);
	transition: transform 6s linear;
}
.gs-hero__slide.is-active .gs-hero__image { transform: scale(1.04); }
.gs-hero__slide::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg, rgba(29, 29, 27, 0.86) 0%, rgba(29, 29, 27, 0.45) 46%, rgba(29, 29, 27, 0) 74%);
}
.gs-hero__content {
	position: absolute;
	z-index: 1;
	left: 0;
	bottom: 0;
	max-width: 580px;
	padding: 0 0 40px 46px;
	box-sizing: border-box;
}
.gs-hero__eyebrow { display: inline-flex; align-items: center; gap: 10px; margin-bottom: 16px; }
.gs-hero__flag {
	display: inline-flex;
	align-items: center;
	height: 22px;
	padding: 0 12px;
	border-radius: 999px;
	background: var(--apple-100);
	color: var(--apple-800);
	font-family: var(--gs-font-display);
	font-weight: 600;
	font-size: 12px;
	letter-spacing: 0.02em;
	white-space: nowrap;
}
.gs-hero__badge {
	font-family: var(--gs-font-display);
	font-weight: 500;
	font-size: 14px;
	color: rgba(255, 255, 255, 0.72);
}
.gs-hero__title {
	margin: 0;
	font-family: var(--gs-font-display);
	font-weight: 700;
	font-size: 48px;
	line-height: 1.02;
	letter-spacing: -0.02em;
	color: #fff;
}
.gs-hero__author { margin: 14px 0 24px; font-family: var(--gs-font-body); font-size: 16px; color: rgba(255, 255, 255, 0.84); }
/* Le bouton de verre de la maquette : blanc translucide, flou derrière, flèche. */
a.gs-btn--glass, .gs-btn--glass {
	box-sizing: border-box;
	gap: 8px;
	padding: 0 40px;
	background: rgba(255, 255, 255, 0.16);
	color: #fff !important;
	backdrop-filter: blur(var(--blur-md));
	-webkit-backdrop-filter: blur(var(--blur-md));
}
a.gs-btn--glass:hover, .gs-btn--glass:hover { background: rgba(255, 255, 255, 0.26); color: #fff !important; }
.gs-hero__nav {
	position: absolute;
	z-index: 2;
	right: 28px;
	bottom: 36px;
	display: flex;
	align-items: center;
	gap: 14px;
}
.gs-hero__dots { display: flex; align-items: center; gap: 6px; }
.gs-hero__dot {
	width: 8px;
	height: 8px;
	padding: 0;
	border: 0;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.45);
	cursor: pointer;
	transition: all .3s cubic-bezier(0.16, 1, 0.3, 1);
}
.gs-hero__dot.is-active { width: 24px; background: #fff; }
.gs-hero__arrows { display: flex; gap: 8px; }
.gs-hero__arrow {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	padding: 0;
	border-radius: 999px;
	border: 1px solid rgba(255, 255, 255, 0.26);
	background: rgba(255, 255, 255, 0.16);
	backdrop-filter: blur(var(--blur-md));
	-webkit-backdrop-filter: blur(var(--blur-md));
	color: #fff;
	cursor: pointer;
}
.gs-hero__arrow:hover { background: rgba(255, 255, 255, 0.24); }

/* Les rangées de l'accueil, d'après la maquette « Galri v2 » (tailles ramenées à l'échelle du
   système : titre 23 → 24, « Tout voir » 13,5 → 14, signature 12,5 → 12 ; survol −2 px). */
.gs-row__head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 16px; }
.gs-row__title { margin: 0; font-family: var(--gs-font-display); font-weight: 700; font-size: 24px; letter-spacing: -0.01em; color: var(--text); }
.gs-row__more { flex: none; display: inline-flex; align-items: center; gap: 5px; font-family: var(--gs-font-display); font-weight: 600; font-size: 14px; line-height: 1.65; color: var(--link) !important; text-decoration: none; }
/* `!important` comme les boutons : `style.css` impose `a { color: inherit !important }`. */
.gs-row__more:hover { color: var(--link-hover) !important; }
.gs-row__track {
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: 274px;
	gap: 16px;
	overflow-x: auto;
	padding-bottom: 10px;
	scroll-snap-type: x proximity;
	scrollbar-width: thin;
	scrollbar-color: var(--neutral-200) transparent;
}
.gs-row__track > * { scroll-snap-align: start; }
/* La piste est la liste de la boucle de requête (`core/post-template`) : ni puces ni marges, et pas
   l'espacement que la disposition « flow » met entre ses éléments. */
ul.gs-row__track { list-style: none; margin: 0; padding: 0 0 10px; }
ul.gs-row__track > li { margin: 0; min-width: 0; }
/* La piste déborde jusqu'aux bords de l'écran (maquette du 16/10) : la première carte reste alignée
   sur le titre, les suivantes défilent jusqu'au bord. Le débord est l'écart entre le bord de l'écran
   et le contenu (1232 px centrés, au moins la marge de l'accueil). 4 px au-dessus pour le soulèvement
   au survol, barre de défilement masquée. */
.gs-home { --gs-row-bleed: max(24px, (100vw - 1232px) / 2); overflow-x: clip; }
.gs-row .gs-row__track {
	padding: 4px var(--gs-row-bleed) 14px;
	margin: -4px calc(-1 * var(--gs-row-bleed)) 0;
	scroll-padding-inline: var(--gs-row-bleed);
	scrollbar-width: none;
	/* `core/post-template` borne sa liste à 100 % : sans cela, le débord de droite ne joue pas. */
	max-width: none;
}
.gs-row .gs-row__track::-webkit-scrollbar { display: none; }
/* Dans une rangée, la carte porte son titre et sa signature sur l'image, en 16/10, sur un dégradé
   sombre ; ailleurs (catégorie) ils restent dessous. */
.gs-row .gs-card__link { position: relative; gap: 0; color: #fff; }
.gs-row .gs-card__media { aspect-ratio: 16 / 10; margin: 0; background: var(--noir); box-shadow: var(--shadow-sm); }
.gs-row .gs-card__media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(29, 29, 27, 0.62), transparent 56%); pointer-events: none; }
.gs-row .gs-card__title, .gs-row .gs-card__meta { position: absolute; left: 14px; right: 14px; z-index: 1; line-height: 1.65; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gs-row .gs-card__title { bottom: 32px; color: #fff; }
.gs-row .gs-card__meta { bottom: 12px; color: rgba(255, 255, 255, 0.74); }
.gs-row .gs-card__badge { z-index: 1; }

/* ---- Carte d'exposition ---- */
.gs-card { margin: 0; min-width: 0; }
.gs-card__link { display: flex; flex-direction: column; gap: 4px; text-decoration: none; color: inherit; }
.gs-card__media {
	position: relative;
	display: block;
	aspect-ratio: 4 / 3;
	border-radius: var(--gs-radius-card);
	overflow: hidden;
	background: var(--neutral-150);
	margin-bottom: 8px;
	transition: box-shadow .2s, transform .2s;
}
.gs-card__link:hover .gs-card__media { box-shadow: var(--gs-shadow-raised); transform: translateY(-2px); }
.gs-card__image { width: 100%; height: 100%; object-fit: cover; display: block; }
.gs-card__badge {
	position: absolute;
	left: 12px;
	top: 12px;
	display: inline-flex;
	align-items: center;
	height: 22px;
	padding: 0 12px;
	border-radius: 999px;
	background: var(--glass-dark-strong);
	color: #fff;
	font-family: var(--gs-font-display);
	font-weight: 600;
	font-size: 12px;
}
.gs-card__title {
	font-family: var(--gs-font-display);
	font-weight: 600;
	font-size: 16px;
	line-height: 1.3;
	color: var(--text);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.gs-card__meta { font-family: var(--gs-font-body); font-size: 12px; color: var(--text-muted); }

/* ---- Parcourir par thème ---- */
/* Maquette « Galri v2 » : surtitre, 6 px, titre de section (24 px), 22 px avant la grille. */
.gs-themes__head { display: flex; flex-direction: column; gap: 6px; margin-bottom: 22px; }
/* Hauteurs de ligne de la maquette : 1,65 pour le texte, 1,12 pour les grands titres. */
.gs-themes__eyebrow { margin: 0; line-height: 1.65; }
.gs-themes__title { margin: 0; font-family: var(--gs-font-display); font-weight: 700; font-size: 24px; letter-spacing: -0.01em; line-height: 1.12; color: var(--text); }
.gs-themes__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-auto-rows: 172px; gap: 16px; }
/* Les sections de l'accueil sur 1232 px, comme « À la une » (1280 px moins les marges). */
.gs-home > .gs-themes.alignwide, .gs-home > .gs-row.alignwide { max-width: calc(1280px - 48px); }
.gs-theme {
	position: relative;
	display: flex;
	align-items: flex-end;
	border-radius: var(--gs-radius-card);
	overflow: hidden;
	background: var(--neutral-800);
	color: #fff;
	text-decoration: none;
}
/* Les tuiles viennent de la boucle des catégories (`ul` > `li`) : ces enveloppes ne comptent pas dans
   la grille, et la grande tuile est celle du premier `li`. */
.gs-themes__grid > ul, .gs-themes__grid > ul > li { display: contents; }
/* Ni l'espacement de la disposition « flow » des blocs, ni marges de paragraphe : la grille seule. */
.gs-themes__grid > * { margin: 0; }
.gs-themes__grid > ul > li:first-child > .gs-theme { grid-column: span 2; grid-row: span 2; }
.gs-theme__image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.gs-theme:hover .gs-theme__image { transform: scale(1.04); }
.gs-theme::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(29, 29, 27, 0.72), rgba(29, 29, 27, 0.12)); }
.gs-theme__text { position: relative; z-index: 1; display: flex; flex-direction: column; padding: 0 16px 16px 18px; }
.gs-theme__label { font-family: var(--gs-font-display); font-weight: 600; font-size: 16px; line-height: 1.65; color: #fff; }
.gs-theme__sub { font-family: var(--gs-font-body); font-size: 12px; line-height: 1.65; color: rgba(255, 255, 255, 0.78); }
.gs-theme--create { background: var(--gradient-brand); color: var(--noir); }
.gs-theme--create::after { display: none; }
/* « Créez la vôtre », d'après la maquette : l'étincelle en haut, le texte en bas, 20 × 22 px de marge. */
.gs-theme--create { flex-direction: column; justify-content: space-between; align-items: flex-start; padding: 20px 22px; }
.gs-theme--create .gs-theme__spark { position: relative; z-index: 1; color: var(--noir); }
.gs-theme--create .gs-theme__text { padding: 0; }
.gs-theme--create .gs-theme__label { font-size: 16px; line-height: 1.15; color: var(--noir); }
.gs-theme--create .gs-theme__sub { display: inline-flex; align-items: center; gap: 5px; margin-top: 6px; font-family: var(--gs-font-display); font-weight: 600; font-size: 12px; color: var(--noir); }

/* « Votre galerie, en ligne ce soir. » (accueil) et « Exposez vos photos… » (Tarifs) : le même bloc,
   d'après la maquette « Galri v2 » — coins de 40 px, une tache floue aux couleurs de la marque en
   haut à droite, titre 38 px graisse 700. */
.gs-cta {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 64px 40px;
	border-radius: 40px;
	background: var(--noir);
	text-align: center;
}
.gs-cta::before {
	content: "";
	position: absolute;
	z-index: -1;
	top: -130px;
	right: -70px;
	width: 380px;
	height: 380px;
	border-radius: 50%;
	background: var(--gradient-brand);
	opacity: 0.5;
	filter: blur(var(--blur-lg));
	pointer-events: none;
}
.gs-cta__title { margin: 0 0 12px; font-family: var(--gs-font-display); font-weight: 700; font-size: 38px; letter-spacing: -0.02em; line-height: 1.12; color: #fff; }
.gs-cta__text { margin: 0 0 28px; font-family: var(--gs-font-body); font-size: 18px; line-height: 1.65; color: rgba(255, 255, 255, 0.78); }
/* Le bouton au dégradé de marque (`gx-btn--gradient`), qui glisse au survol. */
a.gs-btn--gradient, .gs-btn--gradient {
	box-sizing: border-box;
	background: var(--gradient-brand);
	background-size: 160% 160%;
	background-position: 0% 50%;
	color: var(--noir) !important;
	transition: background-position .4s, box-shadow .2s;
}
a.gs-btn--gradient:hover, .gs-btn--gradient:hover { background-position: 100% 50%; color: var(--noir) !important; box-shadow: var(--shadow-lg); }

/* ---- Catégorie ---- */
.gs-cat-head { padding-top: 16px; }
.gs-crumbs { display: flex; flex-wrap: wrap; gap: 8px; font-family: var(--gs-font-body); font-size: 12px; color: var(--text-muted); }
.gs-crumbs a { color: var(--text-muted); text-decoration: none; }
.gs-crumbs a:hover { color: var(--text); }
.gs-cat-head__line { display: flex; flex-wrap: wrap; align-items: baseline; gap: 14px; margin-top: 10px; }
.gs-cat-head__title { margin: 0; font-family: var(--gs-font-display); font-weight: 700; font-size: clamp(38px, 5vw, 48px); letter-spacing: -0.02em; color: var(--text); }
.gs-cat-head__count { font-family: var(--gs-font-display); font-size: 14px; color: var(--text-muted); }
.gs-cat-head__desc { margin: 12px 0 0; max-width: 68ch; font-family: var(--gs-font-body); font-size: 16px; line-height: 1.6; color: var(--text-secondary); }

.gs-toolbar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 12px 20px;
	margin-top: 28px;
	padding-bottom: 18px;
	border-bottom: 1px solid var(--neutral-150);
}
.gs-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.gs-chip {
	display: inline-flex;
	align-items: center;
	height: 34px;
	padding: 0 16px;
	border-radius: 999px;
	border: 1px solid var(--border);
	background: var(--surface);
	font-family: var(--gs-font-display);
	font-weight: 600;
	font-size: 14px;
	color: var(--text-secondary);
	text-decoration: none;
}
.gs-chip:hover { color: var(--text); border-color: var(--border-strong); }
.gs-sort { display: flex; align-items: center; gap: 2px; margin-left: auto; padding: 3px; border-radius: 999px; background: var(--neutral-100); }
.gs-sort__label { padding: 0 10px 0 12px; font-family: var(--gs-font-display); font-size: 12px; color: var(--text-muted); }
.gs-sort__option {
	display: inline-flex;
	align-items: center;
	height: 28px;
	padding: 0 16px;
	border-radius: 999px;
	font-family: var(--gs-font-display);
	font-weight: 500;
	font-size: 12px;
	color: var(--text-secondary);
	text-decoration: none;
}
.gs-sort__option.is-active { background: var(--surface); color: var(--text); box-shadow: var(--shadow-sm); }

.gs-category .wp-block-query { margin-top: 28px; }
.gs-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
	gap: 28px 20px;
	list-style: none;
	margin: 0;
	padding: 0;
}
.gs-grid > li { margin: 0; }
.gs-pagination { margin-top: 40px; font-family: var(--gs-font-display); font-size: 14px; }

@media (max-width: 782px) {
	.gs-home, .gs-category { padding: 16px 16px 64px; }
	.gs-home { --gs-row-bleed: 16px; }
	.gs-home > * + * { margin-top: 40px; }
	/* 16/6,5 ne laisse pas la place au texte : une hauteur fixe, le texte sur toute la largeur. */
	.gs-home > .gs-hero-glow.alignwide { margin-top: 0; border-radius: 20px; }
	.gs-hero { border-radius: 20px; aspect-ratio: auto; min-height: 460px; }
	.gs-hero__content { max-width: none; padding: 24px 22px 76px; }
	.gs-hero__nav { left: 22px; right: auto; bottom: 22px; }
	.gs-themes__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 150px; }
	.gs-themes__grid > ul > li:first-child > .gs-theme { grid-column: span 2; grid-row: span 1; }
	/* Sur deux lignes, 1,65 écartait trop les mots d'un même libellé. */
	.gs-theme__label { line-height: 1.2; }
	.gs-sort { margin-left: 0; }
}

/* ---- Tarifs ---- */
a.gs-btn--outline, .gs-btn--outline { background: var(--surface); border-color: var(--neutral-150); color: var(--text) !important; }
a.gs-btn--outline:hover, .gs-btn--outline:hover { background: var(--neutral-100); color: var(--text) !important; }
a.gs-btn--on-dark, .gs-btn--on-dark { background: transparent; border-color: rgba(255, 255, 255, 0.4); color: #fff !important; }
a.gs-btn--on-dark:hover, .gs-btn--on-dark:hover { background: rgba(255, 255, 255, 0.12); color: #fff !important; }
.gs-btn--block { display: flex; width: 100%; box-sizing: border-box; }

.gs-pricing { padding: 24px 24px 80px; margin-top: 0; }
.gs-pricing > * + * { margin-top: 64px; }
.gs-pricing__head { display: flex; flex-direction: column; align-items: center; gap: 14px; padding-top: 40px; text-align: center; }
.gs-pricing__title { margin: 0; max-width: 22ch; font-family: var(--gs-font-display); font-weight: 700; font-size: clamp(38px, 4.6vw, 48px); line-height: 1.08; letter-spacing: -0.02em; color: var(--text); }
.gs-pricing__lead { margin: 0; max-width: 60ch; font-family: var(--gs-font-body); font-size: 18px; line-height: 1.6; color: var(--text-secondary); }
.gs-toggle { display: inline-flex; gap: 4px; margin-top: 10px; padding: 4px; border-radius: 999px; background: var(--neutral-100); }
.gs-toggle__option { display: inline-flex; align-items: center; gap: 8px; height: 34px; padding: 0 20px; border: 0; border-radius: 999px; background: transparent; font-family: var(--gs-font-display); font-weight: 500; font-size: 14px; color: var(--text-secondary); cursor: pointer; }
.gs-toggle__option.is-active { background: var(--surface); color: var(--text); box-shadow: var(--shadow-sm); }
.gs-toggle__note { padding: 2px 8px; border-radius: 999px; background: var(--apple-100); color: var(--apple-800); font-size: 11px; }

/* `alignwide` élargit le bloc à la largeur du site : la maquette tient les deux offres sur 872 px, centrées. */
.gs-pricing .gs-plans { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; max-width: 872px !important; margin: 40px auto 0 !important; }
/* La carte du système : rayon 20, ombre seule, sans bordure. */
.gs-plan { display: flex; flex-direction: column; gap: 12px; padding: 32px; border-radius: var(--radius-card); border: 0; background: var(--surface); box-shadow: var(--shadow-sm); box-sizing: border-box; }
/* L'offre Pro : un filet en dégradé de marque, pas un cadre noir. */
.gs-plan--pro { border: 2px solid transparent; background: linear-gradient(var(--surface), var(--surface)) padding-box, linear-gradient(110deg, var(--sky-400), var(--yellow-400) 55%, var(--apple-500)) border-box; box-shadow: var(--gs-shadow-raised); }
.gs-plan__name { display: flex; align-items: center; gap: 10px; margin: 0; font-family: var(--gs-font-display); font-weight: 700; font-size: 20px; color: var(--text); }
.gs-plan__flag { display: inline-flex; align-items: center; height: 22px; margin-left: auto; padding: 0 12px; border-radius: 999px; background: var(--noir); color: var(--neutral-0); font-size: 12px; font-weight: 600; letter-spacing: 0.02em; }
.gs-plan__pitch { margin: 0; font-family: var(--gs-font-body); font-size: 14px; color: var(--text-secondary); }
.gs-plan__price { display: flex; align-items: baseline; gap: 8px; margin: 36px 0 0; font-family: var(--gs-font-display); color: var(--text); }
.gs-plan__price[hidden] { display: none; }
.gs-plan__price strong { font-size: 38px; font-weight: 700; letter-spacing: -0.02em; line-height: 1; }
.gs-plan__price span { font-size: 14px; color: var(--text-muted); }
.gs-plan__note { margin: 0; min-height: 42px; font-family: var(--gs-font-body); font-size: 12px; line-height: 1.55; color: var(--text-muted); }
.gs-plan__note[hidden] { display: none; }
/* L'offre gratuite n'a pas de note : le même vide sous le prix garde les deux boutons alignés. */
.gs-plan:not(.gs-plan--pro) .gs-plan__price { margin-bottom: 54px; }
.gs-plan .gs-btn { margin-top: 8px; }
.gs-plan__features { display: flex; flex-direction: column; gap: 12px; margin: 16px 0 0; padding: 24px 0 0; border-top: 1px solid var(--neutral-150); list-style: none; }
.gs-plan__features li { position: relative; padding-left: 30px; font-family: var(--gs-font-body); font-size: 14px; line-height: 1.5; color: var(--text); }
.gs-plan__features li strong { font-weight: inherit; }
.gs-plan__features li::before { content: "✓"; position: absolute; left: 0; top: 0; font-weight: 700; color: var(--apple-600); }

.gs-section-title { margin: 0; font-family: var(--gs-font-display); font-weight: 700; font-size: 24px; letter-spacing: -0.015em; color: var(--text); text-align: center; }
.gs-section-lead { margin: 8px 0 0; font-family: var(--gs-font-body); font-size: 16px; color: var(--text-muted); text-align: center; }
.gs-compare, .gs-faq { max-width: 880px; }
/* Le tableau dans une carte : ombre seule ; la colonne Pro sur le fond vert pâle. */
.gs-compare__scroll { margin-top: 24px; overflow-x: auto; border-radius: var(--gs-radius-card); background: var(--surface); box-shadow: var(--shadow-sm); }
.gs-compare__table { width: 100%; min-width: 520px; border-collapse: collapse; font-family: var(--gs-font-body); font-size: 14px; }
.gs-compare__table th, .gs-compare__table td { padding: 12px 20px; border-bottom: 1px solid var(--neutral-150); text-align: left; color: var(--text-secondary); }
.gs-compare__table tbody tr:last-child th, .gs-compare__table tbody tr:last-child td { border-bottom: 0; }
.gs-compare__table thead th { font-family: var(--gs-font-display); font-weight: 600; font-size: 14px; color: var(--text); background: var(--neutral-50); }
.gs-compare__table tbody th { font-weight: 500; color: var(--text); }
.gs-compare__table td { width: 26%; }
.gs-compare__table tr > :last-child { background: var(--primary-soft); }

.gs-faq__item { margin-top: 12px; border-radius: var(--gs-radius-card); background: var(--surface); box-shadow: var(--shadow-sm); }
.gs-faq > .gs-section-title { margin-bottom: 20px; }
.gs-faq__item summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; cursor: pointer; padding: 18px 22px; font-family: var(--gs-font-display); font-weight: 600; font-size: 16px; color: var(--text); list-style: none; }
.gs-faq__item summary::-webkit-details-marker { display: none; }
/* Le chevron Lucide (`ChevronDown`, 16 px), qui pivote à l'ouverture. */
.gs-faq__item summary::after {
	content: "";
	flex: none;
	width: 16px;
	height: 16px;
	background: var(--text-muted);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") center / contain no-repeat;
	transition: transform var(--dur-base) var(--ease-out);
}
.gs-faq__item[open] summary::after { transform: rotate(180deg); }
.gs-faq__item p { margin: 0; padding: 0 22px 20px; font-family: var(--gs-font-body); font-size: 14px; line-height: 1.65; color: var(--text-secondary); }
.gs-cta__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }

@media (max-width: 782px) {
	.gs-pricing { padding: 16px 16px 64px; }
	/* Aussi précis que la règle de bureau : sans quoi les deux offres restaient côte à côte et débordaient. */
	.gs-pricing .gs-plans { grid-template-columns: 1fr; }
}

/* ---- Page d'une exposition, variante A « galerie de musée » ----
   Réglée sur le rendu de la maquette « Galri v2 » (capture du 13/10/2026), pas sur sa seule structure. */
.gs-expo { padding: 0 24px 120px; margin-top: 0; }
.gs-expo > * + * { margin-top: 56px; }
.gs-expo-head { padding-top: 28px; }
.gs-crumbs__current { color: var(--text); font-weight: 600; }
.gs-expo-head__eyebrow { display: flex; align-items: center; gap: 24px; margin-top: 40px; }
.gs-expo-head__series { font-family: var(--gs-font-display); font-weight: 600; font-size: 14px; color: var(--text); text-decoration: none; }
.gs-expo-head__title {
	margin: 14px 0 0;
	font-family: var(--gs-font-display);
	font-weight: 800;
	font-size: clamp(48px, 8vw, 104px);
	line-height: 1;
	letter-spacing: -0.03em;
	color: var(--text);
}
.gs-expo-head__meta { margin: 26px 0 0; font-family: var(--gs-font-body); font-size: 16px; color: var(--text-secondary); }

.gs-expo-figure { margin-top: 36px !important; margin-bottom: 0; }
.gs-expo-cover {
	position: relative;
	border-radius: 20px;
	overflow: hidden;
	background: var(--neutral-800);
	aspect-ratio: 2 / 1;
	box-shadow: var(--shadow-xl);
}
.gs-expo-cover__image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.gs-expo-cover__enter { position: absolute; left: 0; right: 0; bottom: 36px; display: flex; justify-content: center; }
.gs-expo-cover__enter .gs-btn { height: 52px; padding: 0 40px; font-size: 16px; gap: 12px; box-shadow: var(--shadow-lg); }
/* La pastille sur photo du système (`PhotoBadge`) : 22 px, 12 px du coin, verre sombre. */
.gs-expo-cover__count {
	position: absolute;
	right: 12px;
	bottom: 12px;
	display: inline-flex;
	align-items: center;
	height: 22px;
	padding: 0 12px;
	border-radius: 999px;
	background: var(--glass-dark-strong);
	backdrop-filter: blur(var(--blur-md));
	font-family: var(--gs-font-display);
	font-weight: 600;
	font-size: 12px;
	color: #fff;
}
.gs-expo-figure__caption { margin-top: 14px; font-family: var(--gs-font-body); font-style: italic; font-size: 12px; color: var(--text-muted); }

.gs-expo-body { display: grid; grid-template-columns: 320px minmax(0, 1fr); gap: 72px; align-items: start; margin-top: 72px !important; }
.gs-expo-body > * { margin: 0 !important; }
.gs-cartel { margin: 0; border-top: 2px solid var(--noir); }
.gs-cartel__row { display: flex; flex-direction: column; gap: 8px; padding: 14px 0; border-bottom: 1px solid var(--neutral-150); }
.gs-cartel dt { font-family: var(--gs-font-display); font-weight: 600; font-size: 12px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--text-muted); }
.gs-cartel dd { margin: 0; font-family: var(--gs-font-body); font-size: 14px; color: var(--text); }
.gs-cartel dd a { color: var(--text); text-decoration: underline; text-underline-offset: 3px; }
.gs-cartel dd a.gs-cartel__artist { display: inline-flex; align-items: center; gap: 10px; font-family: var(--gs-font-display); font-weight: 600; font-size: 14px; text-decoration: none; }
/* La pastille d'un auteur (`gx-avatar--sm`) : 28 px, photo ou initiales blanches sur sa teinte. */
.gs-avatar {
	display: inline-flex;
	flex: none;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	border-radius: 50%;
	overflow: hidden;
	object-fit: cover;
	color: #fff;
	font-family: var(--gs-font-display);
	font-weight: 600;
	font-size: 12px;
	line-height: 1;
	user-select: none;
}
/* La taille par défaut de `gx-avatar` : 40 px, pour les commentaires du livre d'or. */
.gs-avatar--md { width: 40px; height: 40px; font-size: 14px; }
.gs-expo-body__cartel .wp-block-expo-expo-download-archive { margin-top: 20px; }
.gs-expo-lead, .gs-expo-lead p { margin: 0; padding-top: 12px; font-family: var(--gs-font-body); font-size: 20px; line-height: 1.55; color: var(--text); max-width: 34em; }

.gs-expo-next { margin-top: 96px !important; }
.gs-expo-next__head { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; padding-bottom: 14px; border-bottom: 2px solid var(--noir); }
.gs-expo-next__title { margin: 0; font-family: var(--gs-font-display); font-weight: 700; font-size: 24px; letter-spacing: -0.015em; color: var(--text); }
.gs-expo-next__sub { font-family: var(--gs-font-body); font-size: 12px; color: var(--text-muted); }
.gs-next-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: 24px; }
.gs-next-grid--series-only { grid-template-columns: 1fr; }
.gs-next-grid > p:empty, .gs-next-grid > br { display: none; }
.gs-next-grid__lead { display: flex; min-width: 0; }
.gs-next-grid__lead > .gs-next-tile { flex: 1; }
.gs-next-grid__side { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; align-content: stretch; }
.gs-next-tile { position: relative; display: flex; align-items: flex-end; min-height: 172px; border-radius: 20px; overflow: hidden; background: var(--neutral-800); text-decoration: none; }
.gs-next-tile--lead { min-height: 360px; }
.gs-next-tile__image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.gs-next-tile:hover .gs-next-tile__image { transform: scale(1.04); }
.gs-next-tile::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(29, 29, 27, 0) 45%, rgba(29, 29, 27, 0.72) 100%); }
.gs-next-tile__text { position: relative; z-index: 1; display: flex; flex-direction: column; gap: 4px; padding: 18px; min-width: 0; }
.gs-next-tile__title { font-family: var(--gs-font-display); font-weight: 700; font-size: 20px; color: #fff; }
.gs-next-tile--small .gs-next-tile__title { font-size: 18px; }
.gs-next-tile__meta { font-family: var(--gs-font-body); font-size: 12px; color: rgba(255, 255, 255, 0.82); }
.gs-next-series { grid-column: 1 / -1; display: flex; flex-direction: column; justify-content: flex-end; gap: 6px; min-height: 172px; padding: 22px; border-radius: 20px; background: var(--gradient-brand); color: var(--noir); text-decoration: none; }
.gs-next-series__label { margin-bottom: auto; font-family: var(--gs-font-display); font-weight: 600; font-size: 12px; letter-spacing: 0.12em; text-transform: uppercase; }
.gs-next-series__name { font-family: var(--gs-font-display); font-weight: 700; font-size: 20px; }
.gs-next-series__meta { font-family: var(--gs-font-display); font-weight: 600; font-size: 14px; }

.gs-expo-guestbook { display: grid; grid-template-columns: 320px minmax(0, 1fr); gap: 72px; align-items: start; margin-top: 96px !important; }
.gs-expo-guestbook > * { margin: 0 !important; }
/* Maquette « Galri v2 » : 16 px sous le trait, surtitre, nombre 30 px puis texte 14 px, 10 px
   entre chaque. Des <p> et non des <span> : WordPress glissait un paragraphe vide entre eux (+32 px). */
.gs-guestbook-head { display: flex; flex-direction: column; padding-top: 16px; border-top: 2px solid var(--noir); }
.gs-guestbook-head > p { margin: 0; }
.gs-guestbook-head__label { font-family: var(--gs-font-display); font-weight: 600; font-size: 12px; line-height: 1.65; letter-spacing: 0.12em; text-transform: uppercase; color: var(--text-muted); }
.gs-guestbook-head > .gs-guestbook-head__count { margin-top: 10px; font-family: var(--gs-font-display); font-weight: 700; font-size: 30px; line-height: 1.65; color: var(--text); }
.gs-guestbook-head > .gs-guestbook-head__text { margin-top: 10px; font-family: var(--gs-font-body); font-size: 14px; line-height: 1.6; color: var(--text-muted); }
/* Le bloc de commentaires porte son propre titre et un rappel de visite : la colonne de gauche et le bouton fixe en tiennent lieu. */
.gs-expo-guestbook .exhibition-comments > h3,
.gs-expo-guestbook .exhibition-comments__cta { display: none; }

.gs-expo-fixed[hidden] { display: none; }
.gs-expo-fixed { position: fixed; z-index: 40; right: 28px; bottom: 28px; margin: 0 !important; }
.gs-expo-fixed .gs-btn { height: 52px; padding: 0 40px; font-size: 16px; gap: 12px; box-shadow: var(--shadow-primary), 0 2px 8px rgba(29, 29, 27, 0.12); }

@media (max-width: 900px) {
	.gs-expo { padding: 0 16px 110px; }
	.gs-expo-body, .gs-expo-guestbook { grid-template-columns: 1fr; gap: 32px; }
	.gs-next-grid { grid-template-columns: 1fr; }
	.gs-next-tile--lead { min-height: 240px; }
	.gs-expo-cover { aspect-ratio: 4 / 3; }
	/* Sur une couverture étroite, le bouton « Entrer » occupe le bas : la pastille passe en haut. */
	.gs-expo-cover__count { top: 12px; bottom: auto; }
	.gs-expo-fixed { right: 16px; bottom: 16px; }
}

/* ---- Pied de page (maquette « Galri Pour vous ») ---- */
.gs-footer { margin: 80px 0 0 !important; border-top: 1px solid var(--neutral-150); background: var(--surface); font-family: var(--gs-font-body); }
.gs-footer__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 180px), 1fr)); gap: 32px; max-width: 1280px; margin: 0 auto !important; padding: 48px var(--gs-gutter) 32px; box-sizing: border-box; }
.gs-footer__grid > * { margin: 0 !important; }
.gs-footer__brand { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; }
.gs-footer__brand .gs-header__brand img { height: 22px; }
.gs-footer__brand p { margin: 0; font-size: 14px; line-height: 1.6; color: var(--text-muted); }
.gs-footer__social { display: flex; gap: 8px; }
.gs-footer__social a { display: grid; place-items: center; width: 34px; height: 34px; box-sizing: border-box; border: 1px solid var(--border); border-radius: 999px; background: var(--surface); color: var(--text-secondary) !important; transition: background-color .16s, color .16s; }
.gs-footer__social a:hover { background: var(--neutral-100); color: var(--text) !important; }
.gs-footer__col { display: flex; flex-direction: column; gap: 12px; }
.gs-footer__col > * { margin: 0 !important; }
.gs-footer__label { font-family: var(--gs-font-display); font-size: 12px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--text-muted); }
.gs-footer__col .wp-block-navigation__container { gap: 12px !important; }
/* Les motifs de navigation écrivent leur couleur en ligne (blanc, pour l'ancien pied sombre). */
.gs-footer__col .wp-block-navigation,
.gs-footer__col .wp-block-navigation a,
.gs-footer__col .wp-block-navigation .wp-block-navigation-item__content { font-family: var(--gs-font-display); font-size: 14px; font-weight: 400; color: var(--text-secondary) !important; text-decoration: none; }
.gs-footer__col .wp-block-navigation a:hover { color: var(--text) !important; }
.gs-footer__bottom { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; max-width: 1280px; margin: 0 auto; padding: 16px var(--gs-gutter) 24px; border-top: 1px solid var(--neutral-150); font-size: 12px; color: var(--text-muted); box-sizing: border-box; }
.gs-footer__bottom em { font-style: italic; color: var(--text-secondary); }

/* ---- Page 404, d'après la maquette « Page 404 » : surtitre, grand numéro au dégradé de marque,
   titre de page du site (48), une phrase et deux boutons, centrés sur 720 px. ---- */
/* 80 px sous l'en-tête et 80 px avant le pied, comme la maquette : le site réserve déjà 24 px sous
   l'en-tête et 80 px avant le pied de page. */
.gs-error { padding: 56px 24px 0; }
.gs-error .gs-eyebrow { line-height: 1.65; }
/* Bordure comprise, comme `gx-btn` : 52 px de haut. */
.gs-error__actions .gs-btn { box-sizing: border-box; }
.gs-error__inner { max-width: 720px; margin: 0 auto; display: flex; flex-direction: column; align-items: center; gap: 20px; text-align: center; }
.gs-error__inner > * { margin: 0; }
.gs-error__number {
	font-family: var(--gs-font-display);
	font-weight: 700;
	font-size: clamp(120px, 22vw, 240px);
	line-height: 0.9;
	letter-spacing: -0.04em;
	background: var(--gradient-brand);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}
.gs-error__title { font-family: var(--gs-font-display); font-weight: 700; font-size: 48px; line-height: 1.12; letter-spacing: -0.02em; color: var(--text); text-wrap: balance; }
.gs-error__text { font-family: var(--gs-font-body); font-size: 16px; line-height: 1.65; color: var(--text-secondary); text-wrap: pretty; }
.gs-error__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin-top: 12px; }