/* ================================================================
   Aubremont Portail — Identité Maison Patrimoine
   Heritage, sérieux, prestige. Inspirée mais distincte de Sageocracy.
   Références : Aman Resorts, Garrard, Christie's Wine, Mariage Frères,
                maisons patrimoniales (vs think-tank de sageocracy.org)

   Différenciation visuelle clé :
   • Palette : vert émeraude profond (vs bleu institutionnel)
   • Titre hero : Bodoni Moda or massif (vs Tenor Sans argent métallique)
   • Cards : liste horizontale pleine largeur (vs grille)
   • Divider : losange or ◇ (vs barre)
   ================================================================ */

/* ── Good Times — police logo Aubremont (self-hosted) ── */
@font-face {
	font-family: 'Good Times';
	src: url('../fonts/goodtime.ttf') format('truetype');
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

:root {
	--irr-green-deep:    #2A3034;
	--irr-green-darker:  #101315;
	--irr-green-mid:     #3E464B;
	--irr-green-light:   #616A70;
	--irr-green-pale:    #D4DADE;
	--irr-white:         #FFFFFF;
	--irr-cream:         #FAFBFC;
	--irr-cream-dark:    #F1F3F5;
	--irr-text:          #2A3034;
	--irr-text-muted:    #616A70;
	--irr-border:        #E1E5E8;
	--irr-border-dark:   #CDD3D8;
	--irr-gold:          #8A6B2E;
	--irr-gold-pale:     #C0A05F;
	--irr-gold-deep:     #7A5C24;   /* or fonce : 6,2:1 sur blanc, 4,6:1 sur la pierre pale du heros */
	--irr-radius:        0px;
	--irr-transition:    0.2s ease;
	--irr-shadow-sm:     0 1px 4px rgba(21, 48, 42, 0.08);
	--irr-shadow:        0 4px 16px rgba(21, 48, 42, 0.12);
}

/* ── Reset & base ─────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; font-size: 16px; }

body {
	font-family: "Inter", "Segoe UI", system-ui, sans-serif;
	font-size: 1rem;
	line-height: 1.75;
	color: var(--irr-text);
	background: var(--irr-cream);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

img { max-width: 100%; height: auto; display: block; }

a {
	color: var(--irr-green-mid);
	text-decoration: none;
	transition: color var(--irr-transition);
}
a:hover { color: var(--irr-gold); }

::selection {
	background-color: var(--irr-green-deep);
	color: var(--irr-cream);
}

/* ── Site header — FIXED (plus robuste que sticky en FSE) ─────── */
.wp-site-blocks > header.wp-block-template-part {
	position: fixed !important;
	top: 0 !important;
	left: 0 !important;
	right: 0 !important;
	width: 100% !important;
	z-index: 1000 !important;
	margin: 0 !important;
	background: rgba(245, 241, 235, 0.96);
	-webkit-backdrop-filter: saturate(180%) blur(10px);
	backdrop-filter: saturate(180%) blur(10px);
	transition: box-shadow 0.2s ease;
}

.wp-site-blocks > header.wp-block-template-part.scrolled {
	box-shadow: 0 2px 12px rgba(21, 48, 42, 0.08);
}

/* La admin bar WP est aussi en position:fixed/top:0 mais avec un z-index plus
   élevé : sans ce décalage elle recouvre le haut du header fixed quand on est connecté. */
body.admin-bar .wp-site-blocks > header.wp-block-template-part {
	top: 32px !important;
}
@media screen and (max-width: 782px) {
	body.admin-bar .wp-site-blocks > header.wp-block-template-part {
		top: 46px !important;
	}
}

/* Compense le header fixed en poussant le contenu vers le bas */
body {
	padding-top: 96px;
}

@media (max-width: 720px) {
	body { padding-top: 84px; }
}

.irr-site-header {
	padding-block: 1.25rem;
	background: transparent;
	border-block-end: 1px solid var(--irr-border);
	transition: padding 0.2s ease;
}

/* Quand on scroll, l'header s'allège légèrement */
.wp-site-blocks > header.wp-block-template-part.scrolled .irr-site-header {
	padding-block: 0.85rem;
}

.irr-brand-block {
	display: flex;
	align-items: center;
	gap: 1rem;
}

.wp-block-site-logo img {
	max-height: 52px;
	width: auto;
}

/* ── Logo header ─────────────────────────────────────────────────────── */
.irr-header-logo-link {
	display: block;
	line-height: 0;
	flex-shrink: 0;
}
.irr-header-logo {
	height: 48px;
	width: auto;
	display: block;
}

.wp-block-site-title {
	font-family: "Good Times", "Futura", "Century Gothic", sans-serif;
	font-weight: 400;
	font-size: 1.25rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	line-height: 1;
}

.wp-block-site-title a {
	color: var(--irr-green-deep);
	text-decoration: none;
}

.wp-block-site-tagline {
	font-family: "Inter", sans-serif;
	font-size: 0.6875rem;
	font-weight: 400;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--irr-text-muted);
	font-style: italic;
	margin-block-start: 0.4rem;
}

/* ── Navigation principale ────────────────────────────────────── */
.wp-block-navigation .wp-block-navigation-item__content {
	font-family: "Inter", sans-serif;
	font-size: 0.75rem;
	font-weight: 500;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--irr-green-deep);
	padding: 0.5rem 0;
	transition: color var(--irr-transition);
}

.wp-block-navigation .wp-block-navigation-item__content:hover {
	color: var(--irr-gold);
}

/* ── Sous-menu (dropdown) « La Maison » ───────────────────────── */
/* Le parent submenu : flèche subtile en or */
.irr-site-header .wp-block-navigation .wp-block-navigation-submenu > .wp-block-navigation-item__content {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	cursor: pointer;
}
.irr-site-header .wp-block-navigation .wp-block-navigation__submenu-icon {
	color: var(--irr-gold);
	transition: transform var(--irr-transition);
}
.irr-site-header .wp-block-navigation .wp-block-navigation-submenu:hover .wp-block-navigation__submenu-icon {
	transform: rotate(180deg);
}

/* Le conteneur du sous-menu : carte blanche, ombre douce, accent or */
.irr-site-header .wp-block-navigation .wp-block-navigation__submenu-container {
	background: #ffffff;
	border: 0;
	border-top: 2px solid var(--irr-gold);
	box-shadow: 0 12px 32px rgba(20, 40, 35, 0.10), 0 2px 6px rgba(20, 40, 35, 0.06);
	padding: 0.75rem 0;
	min-width: 220px;
	border-radius: 0 0 4px 4px;
	margin-top: 0.5rem;
	opacity: 0;
	visibility: hidden;
	transform: translateY(-6px);
	transition: opacity 220ms ease, transform 220ms ease, visibility 220ms;
}

.irr-site-header .wp-block-navigation .wp-block-navigation-submenu:hover > .wp-block-navigation__submenu-container,
.irr-site-header .wp-block-navigation .wp-block-navigation-submenu:focus-within > .wp-block-navigation__submenu-container {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

/* Items du sous-menu : plus aérés, séparateurs subtils */
.irr-site-header .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	display: block;
	padding: 0.7rem 1.5rem;
	font-size: 0.7rem;
	letter-spacing: 0.2em;
	color: var(--irr-green-deep);
	border-left: 2px solid transparent;
	transition: background-color var(--irr-transition), color var(--irr-transition), border-color var(--irr-transition);
}

.irr-site-header .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover {
	background-color: rgba(201, 169, 104, 0.06);
	color: var(--irr-gold);
	border-left-color: var(--irr-gold);
}

/* Sur header sticky scrolled : sous-menu reste blanc avec accent or */
.wp-site-blocks > header.wp-block-template-part.scrolled .irr-site-header .wp-block-navigation .wp-block-navigation__submenu-container {
	background: #ffffff;
}

/* Mobile : le sous-menu se déploie inline (pas en dropdown flottant) */
@media (max-width: 768px) {
	.irr-site-header .wp-block-navigation .wp-block-navigation__submenu-container {
		position: static;
		opacity: 1;
		visibility: visible;
		transform: none;
		box-shadow: none;
		border-top: 0;
		border-left: 1px solid rgba(201, 169, 104, 0.3);
		padding: 0.25rem 0 0.25rem 1rem;
		margin: 0.5rem 0 0 1rem;
		min-width: 0;
	}
}

/* ── HERO patrimoine — vert profond, logo or, titre Bodoni or ─── */
.irr-hero {
	background: var(--irr-green-darker);
	color: var(--irr-cream);
	padding-block: 8rem 6.5rem;
	text-align: center;
	position: relative;
	overflow: hidden;
}

.irr-hero::before {
	content: none; /* gradient supprimé — fond plat #0A1A14 validé */
}

/* Texture subtile : grain de fond papier patrimoine */
.irr-hero::after {
	content: '';
	position: absolute;
	inset: 0;
	background-image: radial-gradient(circle at 1px 1px, rgba(201, 169, 104, 0.03) 1px, transparent 0);
	background-size: 32px 32px;
	z-index: 0;
	pointer-events: none;
}

.irr-hero__inner {
	position: relative;
	z-index: 2;
	max-width: 880px;
	margin: 0 auto;
	padding: 0 1.5rem;
}

.irr-hero { isolation: isolate; }
.irr-hero::before, .irr-hero::after { z-index: 0 !important; }

.irr-section--green { isolation: isolate; }
.irr-section--green > *, .irr-section--green .irr-container { position: relative; z-index: 2; }
.irr-section--green::before { z-index: 0 !important; }

.irr-hero__logo {
	margin-bottom: 3rem;
}

.irr-hero__logo img {
	display: inline-block;
	max-height: 160px;
	width: auto;
}

.irr-hero__eyebrow {
	display: inline-block;
	font-family: "Inter", sans-serif;
	font-size: 0.75rem;
	font-weight: 500;
	letter-spacing: 0.32em;
	text-transform: uppercase;
	color: var(--irr-gold);
	margin-bottom: 2rem;
	padding: 0 1.5rem;
}

/* Petit losange or signature avant l'eyebrow */
.irr-hero__eyebrow::before,
.irr-hero__eyebrow::after {
	content: '◇';
	display: inline-block;
	margin: 0 1rem;
	font-size: 0.625rem;
	color: var(--irr-gold);
	opacity: 0.7;
}

.irr-hero__title {
	/* GOOD TIMES — police-marque officielle Aubremont (papier en-tête) — HERO ACCUEIL UNIQUEMENT */
	font-family: "Good Times", "Futura", "Century Gothic", sans-serif !important;
	font-size: clamp(3rem, 8vw, 5.5rem);
	font-weight: 400 !important;
	font-style: normal !important;
	line-height: 1.15;
	letter-spacing: 0.15em;
	text-transform: uppercase;
	margin: 0 0 1.5rem;

	/* Or métallique poli */
	color: transparent !important;
	background: linear-gradient(180deg,
		#FFF8DC   0%,
		#F5E2B0  12%,
		#C9A968  44%,
		#ECDCA0  74%,
		#DCC885 100%);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent !important;

	/* Relief creusé (letterpress) — comme sageocracy / variante-or-relief */
	text-shadow:
		0 -1px 0   rgba(0, 0, 0, 0.55),
		0  1px 1px rgba(255, 240, 200, 0.22),
		0  2px 5px rgba(0, 0, 0, 0.18);
}

/* Filet sous le titre — losange or */
.irr-hero__rule {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 1.5rem;
	margin: 2.5rem auto;
	max-width: 220px;
}

.irr-hero__rule::before,
.irr-hero__rule::after {
	content: '';
	flex: 1;
	height: 1px;
	background: linear-gradient(90deg, transparent, var(--irr-gold) 100%);
}

.irr-hero__rule::after {
	background: linear-gradient(90deg, var(--irr-gold) 0%, transparent);
}

.irr-hero__rule__diamond {
	color: var(--irr-gold);
	font-size: 0.6875rem;
	letter-spacing: 0;
}

.irr-hero__subtitle {
	font-family: "Inter", system-ui, sans-serif;
	font-size: clamp(1.0625rem, 1.6vw, 1.3125rem);
	font-style: normal;
	font-weight: 300;
	line-height: 1.6;
	color: rgba(245, 241, 235, 0.9);
	max-width: 580px;
	margin: 0 auto 1.5rem;
	letter-spacing: 0.02em;
}

.irr-hero__citation {
	font-family: "Inter", system-ui, sans-serif;
	font-size: 0.9375rem;
	font-style: normal;
	font-weight: 300;
	letter-spacing: 0.03em;
	color: rgba(224, 204, 156, 0.85);
	margin-block-start: 2.5rem;
	max-width: 540px;
	margin-left: auto;
	margin-right: auto;
}

.irr-hero__sub-domains {
	margin-block-start: 4rem;
	padding-block-start: 2rem;
	border-block-start: 1px solid rgba(201, 169, 104, 0.18);
	font-family: "Inter", sans-serif;
	font-size: 0.6875rem;
	font-weight: 500;
	letter-spacing: 0.4em;
	text-transform: uppercase;
	color: rgba(224, 204, 156, 0.7);
}

/* ── Sections institutionnelles ──────────────────────────────── */
.irr-section {
	padding-block: 6rem;
	background: var(--irr-cream);
}

.irr-section--alt {
	background: var(--irr-cream-dark);
}

.irr-section--white {
	background: var(--irr-white);
}

.irr-section--green {
	background: var(--irr-green-deep);
	color: var(--irr-cream);
	position: relative;
}

.irr-section--green::before {
	content: '';
	position: absolute;
	inset: 0;
	background-image: radial-gradient(circle at 1px 1px, rgba(201, 169, 104, 0.04) 1px, transparent 0);
	background-size: 32px 32px;
	pointer-events: none;
}

.irr-container {
	max-width: 1140px;
	margin: 0 auto;
	padding: 0 1.5rem;
	position: relative;
	z-index: 1;
}

.irr-container--narrow {
	max-width: 820px;
}

.irr-section__eyebrow {
	display: inline-block;
	font-family: "Inter", sans-serif;
	font-size: 0.75rem;
	font-weight: 500;
	letter-spacing: 0.28em;
	text-transform: uppercase;
	color: var(--irr-gold);
	margin-bottom: 1.25rem;
}

.irr-section__title {
	/* MONTSERRAT ExtraBold — titres de section impactants */
	font-family: "Montserrat", Arial, sans-serif;
	font-size: clamp(1.875rem, 3.5vw, 2.625rem);
	font-weight: 600;
	font-style: normal;
	line-height: 1.15;
	letter-spacing: 0.02em;
	color: var(--irr-green-deep);
	margin: 0 0 1.75rem;
	text-transform: uppercase;
}

.irr-section--green .irr-section__title {
	color: var(--irr-cream);
}

/* Losange or comme divider (au lieu d'une barre) */
.irr-divider {
	display: flex;
	align-items: center;
	gap: 1rem;
	margin: 0 0 2.5rem;
	max-width: 80px;
}

.irr-divider::before,
.irr-divider::after {
	content: '';
	flex: 1;
	height: 1px;
	background: var(--irr-gold);
	opacity: 0.6;
}

.irr-divider__diamond {
	color: var(--irr-gold);
	font-size: 0.75rem;
}

.irr-section--green .irr-divider::before,
.irr-section--green .irr-divider::after {
	background: var(--irr-gold);
	opacity: 0.7;
}

.irr-section__lead {
	font-family: "Inter", system-ui, sans-serif;
	font-size: clamp(1.0625rem, 1.6vw, 1.25rem);
	line-height: 1.7;
	font-style: normal;
	font-weight: 300;
	color: var(--irr-text);
	margin-bottom: 1.75rem;
	max-width: 720px;
	letter-spacing: 0.01em;
}

.irr-section--green .irr-section__lead {
	color: rgba(245, 241, 235, 0.95);
}

/* ── Cards — LISTE HORIZONTALE pleine largeur (vs grille sageocracy) ── */
.irr-cards-list {
	display: flex;
	flex-direction: column;
	margin-top: 3rem;
	border-top: 1px solid var(--irr-border-dark);
}

.irr-card-row {
	display: grid;
	grid-template-columns: 110px 1fr 140px;
	gap: 3.5rem;
	align-items: center;
	padding: 2.5rem 0;
	border-bottom: 1px solid var(--irr-border-dark);
	transition: background-color var(--irr-transition);
}

.irr-card-row:hover {
	background-color: rgba(201, 169, 104, 0.04);
}

.irr-card-row__number {
	font-family: "Cormorant Garamond", "Garamond", Georgia, serif;
	font-size: 3.5rem;
	font-weight: 400;
	font-style: italic;
	color: var(--irr-gold);
	line-height: 1;
	text-align: center;
}

.irr-card-row__body {
	max-width: 60ch;
}

.irr-card-row__title {
	font-family: "Cormorant Garamond", "Garamond", Georgia, serif;
	font-size: clamp(1.5rem, 2.5vw, 1.875rem);
	font-weight: 500;
	line-height: 1.2;
	margin: 0 0 0.65rem;
	letter-spacing: -0.005em;
	color: var(--irr-green-deep);
}

.irr-card-row__lede {
	font-family: "Cormorant Garamond", "Garamond", Georgia, serif;
	font-size: 1.0625rem;
	font-style: italic;
	font-weight: 400;
	line-height: 1.5;
	color: var(--irr-text-muted);
	margin: 0 0 0.75rem;
}

.irr-card-row__desc {
	font-size: 0.9375rem;
	line-height: 1.65;
	color: var(--irr-text);
	margin: 0;
}

.irr-card-row__link {
	display: inline-flex;
	align-items: center;
	justify-content: flex-end;
	gap: 0.5rem;
	font-family: "Inter", sans-serif;
	font-size: 0.75rem;
	font-weight: 500;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--irr-green-deep);
	text-decoration: none;
	white-space: nowrap;
	transition: all var(--irr-transition);
}

.irr-card-row__link::after {
	content: '→';
	display: inline-block;
	transition: transform var(--irr-transition);
}

.irr-card-row__link:hover {
	color: var(--irr-gold);
}

.irr-card-row__link:hover::after {
	transform: translateX(4px);
}

/* ── Quote / citation ────────────────────────────────────────── */
.irr-quote {
	border-left: 2px solid var(--irr-gold);
	background: transparent;
	padding: 0.5rem 0 0.5rem 2rem;
	margin: 2rem 0;
	font-family: "Cormorant Garamond", "Garamond", Georgia, serif;
	font-style: italic;
	font-size: 1.1875rem;
	line-height: 1.55;
	color: var(--irr-text);
}

.irr-section--green .irr-quote {
	border-left-color: var(--irr-gold);
	color: var(--irr-cream);
}

/* ── Buttons (heritage maison) ────────────────────────────────── */
.irr-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	padding: 0.95rem 1.85rem;
	font-family: "Inter", sans-serif;
	font-size: 0.75rem;
	font-weight: 500;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	border-radius: 0;
	border: 1.5px solid transparent;
	cursor: pointer;
	transition: all var(--irr-transition);
	text-decoration: none;
	white-space: nowrap;
}

.irr-btn--primary {
	background: var(--irr-green-deep);
	color: var(--irr-cream);
	border-color: var(--irr-green-deep);
}
.irr-btn--primary:hover {
	background: var(--irr-gold);
	border-color: var(--irr-gold);
	color: var(--irr-green-deep);
}

.irr-btn--outline {
	background: transparent;
	color: var(--irr-green-deep);
	border-color: var(--irr-green-deep);
}
.irr-btn--outline:hover {
	background: var(--irr-green-deep);
	color: var(--irr-cream);
}

.irr-btn--ghost {
	background: transparent;
	color: var(--irr-gold);
	border-color: var(--irr-gold);
}
.irr-btn--ghost:hover {
	background: var(--irr-gold);
	border-color: var(--irr-gold);
	color: var(--irr-green-deep);
}

/* Bouton WP standard aligné */
.wp-block-button__link {
	font-family: "Inter", sans-serif;
	font-size: 0.75rem;
	font-weight: 500;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	padding: 0.95rem 1.85rem;
	border-radius: 0;
	border: 1.5px solid var(--irr-green-deep);
	background: var(--irr-green-deep);
	color: var(--irr-cream);
	transition: all var(--irr-transition);
}

.wp-block-button__link:hover {
	background: var(--irr-gold);
	border-color: var(--irr-gold);
	color: var(--irr-green-deep);
}

.is-style-outline > .wp-block-button__link {
	background: transparent !important;
	color: var(--irr-green-deep) !important;
	border-color: var(--irr-green-deep) !important;
}
.is-style-outline > .wp-block-button__link:hover {
	background: var(--irr-green-deep) !important;
	color: var(--irr-cream) !important;
}

/* ── Page banner (pages intérieures) — VERSION CLASSE ─────────── */
.irr-page-banner {
	background: var(--irr-green-darker);
	color: var(--irr-cream);
	padding-block: 7rem 6rem;
	text-align: center;
	position: relative;
	overflow: hidden;
	isolation: isolate;
}

/* FIX CRITIQUE — sans cette règle, les pseudo-éléments ::before et ::after
   (gradients et texture) passent par-dessus le texte enfant et le rendent
   invisible. On force tous les enfants directs au-dessus des pseudos. */
.irr-page-banner > *,
.irr-page-banner .wp-block-post-title,
.irr-page-banner h1 {
	position: relative !important;
	z-index: 2 !important;
}

.irr-page-banner::before,
.irr-page-banner::after {
	z-index: 0 !important;
}

.irr-page-banner::before {
	content: none; /* gradient supprimé — fond plat #0A1A14 validé */
}

.irr-page-banner::after {
	content: '';
	position: absolute;
	inset: 0;
	background-image: radial-gradient(circle at 1px 1px, rgba(201, 169, 104, 0.035) 1px, transparent 0);
	background-size: 32px 32px;
	z-index: 0;
	pointer-events: none;
}

.irr-page-banner__inner {
	max-width: 880px;
	margin: 0 auto;
	padding: 0 1.5rem;
	position: relative;
	z-index: 1;
}

.irr-page-banner__eyebrow {
	display: inline-block;
	font-family: "Inter", sans-serif !important;
	font-size: 0.75rem !important;
	font-weight: 500 !important;
	letter-spacing: 0.32em !important;
	text-transform: uppercase !important;
	color: var(--irr-gold) !important;
	margin: 0 0 1.75rem !important;
}

.irr-page-banner__eyebrow::before,
.irr-page-banner__eyebrow::after {
	content: '◇';
	display: inline-block;
	margin: 0 0.75rem;
	font-size: 0.625rem;
	color: var(--irr-gold);
	opacity: 0.7;
	vertical-align: middle;
}

.irr-page-banner__title,
.irr-page-banner .wp-block-post-title {
	font-family: "Tenor Sans", "Optima", "Helvetica Neue", sans-serif !important;
	font-size: clamp(2.5rem, 5vw, 4rem) !important;
	font-weight: 400 !important;
	font-style: normal !important;
	line-height: 1.1 !important;
	letter-spacing: 0.12em !important;
	color: var(--irr-gold) !important;
	margin: 0 !important;
	text-shadow: 0 2px 20px rgba(201, 169, 104, 0.18);
	text-align: center;
	display: block;
}

.irr-page-banner__rule {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 1.25rem;
	margin: 2rem auto 0;
	max-width: 180px;
}

.irr-page-banner__rule::before,
.irr-page-banner__rule::after {
	content: '';
	flex: 1;
	height: 1px;
	background: var(--irr-gold);
	opacity: 0.55;
}

.irr-page-banner__rule__diamond {
	color: var(--irr-gold);
	font-size: 0.625rem;
}

/* ── Cards univers — GRILLE 2×2 (vs liste horizontale précédente) ── */
.irr-cards-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 0;
	margin-top: 3.5rem;
	border-top: 1px solid var(--irr-border-dark);
	border-left: 1px solid var(--irr-border-dark);
}

.irr-card-cell {
	background: transparent;
	padding: 3rem 2.5rem;
	border-right: 1px solid var(--irr-border-dark);
	border-bottom: 1px solid var(--irr-border-dark);
	transition: background-color var(--irr-transition);
	display: flex;
	flex-direction: column;
	position: relative;
}

.irr-card-cell:hover {
	background-color: rgba(201, 169, 104, 0.05);
}

.irr-card-cell__header {
	display: flex;
	align-items: baseline;
	gap: 1.5rem;
	margin-bottom: 1.5rem;
}

.irr-card-cell__number {
	font-family: "Cormorant Garamond", "Garamond", Georgia, serif;
	font-size: 2.5rem;
	font-weight: 400;
	font-style: italic;
	color: var(--irr-gold);
	line-height: 1;
	flex-shrink: 0;
}

.irr-card-cell__title {
	font-family: "Cormorant Garamond", "Garamond", Georgia, serif !important;
	font-size: clamp(1.375rem, 2.2vw, 1.75rem) !important;
	font-weight: 500 !important;
	line-height: 1.2 !important;
	margin: 0 !important;
	letter-spacing: -0.005em !important;
	color: var(--irr-green-deep) !important;
	flex: 1;
}

.irr-card-cell__lede {
	font-family: "Cormorant Garamond", "Garamond", Georgia, serif !important;
	font-size: 1.0625rem !important;
	font-style: italic !important;
	font-weight: 400 !important;
	line-height: 1.5 !important;
	color: var(--irr-text-muted) !important;
	margin: 0 0 0.85rem !important;
}

.irr-card-cell__desc {
	font-size: 0.9375rem !important;
	line-height: 1.7 !important;
	color: var(--irr-text) !important;
	margin: 0 0 1.5rem !important;
}

.irr-card-cell__lede {
	font-family: "Cormorant Garamond", "Garamond", Georgia, serif;
	font-size: 1.0625rem;
	font-style: italic;
	font-weight: 400;
	line-height: 1.5;
	color: var(--irr-text-muted);
	margin: 0 0 0.85rem;
}

.irr-card-cell__desc {
	font-size: 0.9375rem;
	line-height: 1.7;
	color: var(--irr-text);
	margin: 0 0 1.5rem;
	flex: 1;
}

.irr-card-cell__link {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	font-family: "Inter", sans-serif;
	font-size: 0.75rem;
	font-weight: 500;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--irr-green-deep);
	text-decoration: none;
	border-bottom: 1.5px solid var(--irr-green-deep);
	padding-bottom: 4px;
	align-self: flex-start;
	transition: all var(--irr-transition);
}

.irr-card-cell__link::after {
	content: '→';
	display: inline-block;
	transition: transform var(--irr-transition);
}

.irr-card-cell__link:hover {
	color: var(--irr-gold);
	border-bottom-color: var(--irr-gold);
}

.irr-card-cell__link:hover::after {
	transform: translateX(4px);
}

/* ── Formulaire de contact ────────────────────────────────────── */
.irr-contact-form {
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
	max-width: 640px;
	margin: 2.5rem 0 0;
}

.irr-form-field {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
}

.irr-form-field label {
	font-family: "Inter", sans-serif;
	font-size: 0.75rem;
	font-weight: 500;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--irr-gold);
}

.irr-form-field input,
.irr-form-field textarea {
	font-family: "Inter", sans-serif;
	font-size: 1rem;
	line-height: 1.6;
	padding: 0.85rem 1rem;
	border: 1px solid var(--irr-border-dark);
	border-radius: 0;
	background: var(--irr-white);
	color: var(--irr-text);
	transition: border-color var(--irr-transition), box-shadow var(--irr-transition);
}

/* Layout 2 colonnes Prénom / Nom */
.irr-form-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1.25rem;
	margin-bottom: 1.25rem;
}
.irr-form-row .irr-form-field {
	margin-bottom: 0;
}
@media (max-width: 600px) {
	.irr-form-row {
		grid-template-columns: 1fr;
		gap: 1.25rem;
	}
}

/* Auto-capitalisation visuelle (fallback CSS, JS prend le relais à la saisie) */
.irr-input--capitalize {
	text-transform: capitalize;
}
.irr-input--uppercase {
	text-transform: uppercase;
	letter-spacing: 0.04em;
}

.irr-form-field input:focus,
.irr-form-field textarea:focus {
	outline: none;
	border-color: var(--irr-green-deep);
	box-shadow: 0 0 0 3px rgba(201, 169, 104, 0.15);
}

.irr-form-field textarea {
	resize: vertical;
	min-height: 160px;
}

.irr-form-honeypot {
	position: absolute;
	left: -10000px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.irr-contact-form button[type="submit"] {
	align-self: flex-start;
	margin-top: 0.5rem;
}

.irr-form-success {
	border-left: 3px solid var(--irr-gold);
	background: rgba(201, 169, 104, 0.08);
	padding: 1.5rem 2rem;
	margin: 2rem 0 0;
	font-family: "Cormorant Garamond", "Garamond", Georgia, serif;
	font-style: italic;
	font-size: 1.125rem;
	color: var(--irr-green-deep);
}

.irr-form-error {
	border-left: 3px solid #c44;
	background: rgba(204, 68, 68, 0.06);
	padding: 1rem 1.5rem;
	margin: 1.5rem 0 0;
	font-family: "Inter", sans-serif;
	font-size: 0.9375rem;
	color: #a33;
}

/* ── Hero bandeau clair — articles, archive, 404 ─────────────── */
/*    (analogue de .irr-page-banner mais sur fond crème)           */
.irr-page-hero {
	text-align: center;
}

/* Eyebrow "Article" / "Erreur 404" / "Recherche" */
.irr-page-hero__eyebrow {
	display: inline-block;
	font-family: "Inter", "Segoe UI", sans-serif;
	font-size: 0.6875rem;
	font-weight: 500;
	letter-spacing: 0.32em;
	text-transform: uppercase;
	color: var(--irr-gold);
	margin-block-end: 1.5rem;
}
.irr-page-hero__eyebrow::before,
.irr-page-hero__eyebrow::after {
	content: '◇';
	display: inline-block;
	margin-inline: 0.55rem;
	font-size: 0.5rem;
	opacity: 0.65;
	vertical-align: middle;
}

/* Titre principal (h1 via wp:post-title ou wp:heading) */
.irr-page-hero h1,
.irr-page-hero h1.wp-block-post-title,
.irr-page-hero h1.irr-page-hero__title,
.irr-page-hero__title,
.irr-page-hero .wp-block-post-title {
	font-family: "Cormorant Garamond", "Garamond", Georgia, serif !important;
	font-size: clamp(2.25rem, 5vw, 3.75rem) !important;
	font-weight: 400 !important;
	font-style: italic !important;
	line-height: 1.18 !important;
	letter-spacing: 0.01em !important;
	color: var(--irr-green-deep) !important;
	margin-block: 0 !important;
	max-width: 820px;
	margin-inline: auto;
}

/* Effet gravé (front-end — miroir exact de editor.css) */
.is-style-engraved {
	text-shadow:
		0 1px 0 rgba(255, 255, 255, 0.92),
		0 -1px 1px rgba(0, 0, 0, 0.18) !important;
}

/* Filet décoratif ◇ (archive.html, 404.html) */
.irr-page-hero__rule {
	border: none;
	border-top: 1px solid var(--irr-border);
	width: 80px;
	margin-inline: auto;
	margin-block-start: 2rem;
	opacity: 0.55;
}

/* Lede/sous-titre (404.html) */
.irr-page-hero__lede {
	font-size: 1.0625rem;
	line-height: 1.65;
	color: var(--irr-text-muted);
	margin-block-start: 0.75rem;
}

/* ── Articles cards ──────────────────────────────────────────── */
.irr-article-card {
	padding-block: 2rem;
}

.irr-article-card__date {
	font-family: "Inter", sans-serif;
	font-size: 0.75rem;
	font-weight: 500;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--irr-gold);
}

.irr-article-card__title {
	font-family: "Cormorant Garamond", "Garamond", Georgia, serif;
	font-size: clamp(1.5rem, 2.5vw, 1.75rem);
	font-weight: 500;
	line-height: 1.25;
	margin: 0.6rem 0 0.75rem;
	letter-spacing: -0.005em;
}

.irr-article-card__title a {
	color: var(--irr-green-deep);
	text-decoration: none;
	transition: color var(--irr-transition);
}
.irr-article-card__title a:hover { color: var(--irr-gold); }

.irr-article-card__excerpt {
	color: var(--irr-text);
	max-width: 62ch;
	font-size: 0.9375rem;
	line-height: 1.7;
}

/* ── Post content ────────────────────────────────────────────── */
.wp-block-post-content {
	font-size: 1rem;
	line-height: 1.8;
}

.wp-block-post-content p { margin-block: 1.25em; }

.wp-block-post-content h2 {
	color: var(--irr-green-deep);
	font-family: "Cormorant Garamond", "Garamond", Georgia, serif;
	font-size: clamp(1.25rem, 2.5vw, 1.5rem);
	font-style: italic;
	font-weight: 600;
	line-height: 1.3;
	margin-block-start: 3em;
	margin-block-end: 0.75em;
}

.wp-block-post-content h3 {
	color: var(--irr-green-deep);
	font-family: "Cormorant Garamond", "Garamond", Georgia, serif;
	font-size: clamp(1.0625rem, 2vw, 1.1875rem);
	font-style: italic;
	font-weight: 600;
	line-height: 1.35;
	margin-block-start: 2.25em;
	margin-block-end: 0.6em;
}

/* Normalise <strong> DANS les titres — évite le double-gras */
.wp-block-post-content h2 strong,
.wp-block-post-content h3 strong { font-weight: inherit; }

.wp-block-post-content blockquote {
	border-left: 2px solid var(--irr-gold);
	background: transparent;
	padding: 0.5rem 0 0.5rem 2rem;
	margin: 2rem 0;
	font-family: "Cormorant Garamond", "Garamond", Georgia, serif;
	font-style: italic;
	font-size: 1.1875rem;
	color: var(--irr-text);
}

/* Séparateurs wp:separator dans le corps des articles — masqués */
.wp-block-post-content .wp-block-separator,
.wp-block-post-content hr { display: none; }

/* ── Navigation prev/next article ─── */
.wp-block-post-navigation-link { flex: 1; min-width: 0; align-self: flex-start; }
.wp-block-post-navigation-link a {
	display: flex;
	flex-direction: column;
	text-decoration: none;
	transition: opacity var(--irr-transition);
}
.wp-block-post-navigation-link a:hover { opacity: 0.72; }
.wp-block-post-navigation-link:last-child a { text-align: right; }
/* Libellé direction */
.post-navigation-link__label {
	display: block;
	font-family: "Good Times", "Futura", "Century Gothic", sans-serif;
	font-size: 0.5625rem;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--irr-gold);
	margin-bottom: 0.5rem;
}
/* Titre de l'article adjacent — 2 lignes max */
.post-navigation-link__title {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	font-family: "Cormorant Garamond", "Garamond", Georgia, serif;
	font-style: italic;
	font-size: 1rem;
	line-height: 1.4;
	color: var(--irr-text-muted);
}

/* ── Footer institutionnel vert profond — INTERLIGNE RESSERRÉ ── */
.irr-site-footer {
	background: var(--irr-green-darker);
	color: rgba(245, 241, 235, 0.78);
	padding-block: 4rem 2rem;
	font-size: 0.875rem;
	line-height: 1.55;
}

.irr-site-footer a {
	color: rgba(245, 241, 235, 0.78);
	text-decoration: none;
	transition: color var(--irr-transition);
}
.irr-site-footer a:hover { color: var(--irr-gold); }

.irr-site-footer .wp-block-site-title {
	font-family: "Good Times", "Futura", "Century Gothic", sans-serif;
	font-size: 1.1rem;
	font-weight: 400;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	line-height: 1.1;
}
.irr-site-footer .wp-block-site-title a { color: var(--irr-cream); }

.irr-site-footer .wp-block-site-tagline {
	color: var(--irr-gold-pale);
	font-style: italic;
	margin-block-start: 0.35rem;
	letter-spacing: 0.14em;
	font-size: 0.6875rem;
	line-height: 1.3;
}

.irr-site-footer h4 {
	font-family: "Inter", sans-serif;
	font-size: 0.6875rem;
	font-weight: 500;
	letter-spacing: 0.28em;
	text-transform: uppercase;
	color: var(--irr-gold);
	margin-block-end: 1rem;
	line-height: 1.3;
}

/* INTERLIGNE FOOTER NAVIGATION : RESSERRÉ */
.irr-site-footer .wp-block-navigation .wp-block-navigation-item__content {
	font-family: "Inter", sans-serif;
	font-size: 0.8125rem;
	font-weight: 400;
	letter-spacing: 0;
	text-transform: none;
	color: rgba(245, 241, 235, 0.78);
	line-height: 1.5;
	padding: 0.15rem 0;
}

.irr-site-footer .wp-block-navigation .wp-block-navigation-item__content:hover {
	color: var(--irr-gold);
}

.irr-site-footer p {
	line-height: 1.55;
	margin-block: 0.5rem 0;
}

.irr-site-footer-bottom {
	font-family: "Inter", sans-serif;
	font-size: 0.6875rem;
	letter-spacing: 0.06em;
	color: rgba(245, 241, 235, 0.45);
	margin-block-start: 2.5rem;
	padding-block-start: 1.5rem;
	border-block-start: 1px solid rgba(201, 169, 104, 0.12);
	line-height: 1.5;
}

/* ── Univers développés (page Les Univers) — chapitres éditoriaux ── */
.irr-universe-block {
	display: grid;
	grid-template-columns: 200px 1fr;
	gap: 4.5rem;
	padding-block: 5.5rem 5rem;
	border-block-end: 1px solid var(--irr-border-dark);
}

.irr-universe-block:first-of-type {
	border-block-start: 1px solid var(--irr-border-dark);
}

.irr-universe-block:last-of-type {
	border-block-end: 0;
}

.irr-universe-block__sidebar {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	align-items: flex-start;
}

.irr-universe-block__number {
	font-family: "Cormorant Garamond", "Garamond", Georgia, serif;
	font-size: 5.5rem;
	font-weight: 400;
	font-style: italic;
	line-height: 0.95;
	color: var(--irr-gold);
	margin: 0;
	letter-spacing: -0.01em;
}

.irr-universe-block__sidebar__diamond {
	color: var(--irr-gold);
	font-size: 0.875rem;
	margin-block-start: 0.5rem;
	opacity: 0.7;
}

.irr-universe-block__sidebar__label {
	font-family: "Inter", sans-serif;
	font-size: 0.6875rem;
	font-weight: 500;
	letter-spacing: 0.28em;
	text-transform: uppercase;
	color: var(--irr-gris-chaud, #5A554F);
	margin-block-start: 0.5rem;
}

.irr-universe-block__content {
	max-width: 64ch;
}

.irr-universe-block__title {
	font-family: "Cormorant Garamond", "Garamond", Georgia, serif;
	font-size: clamp(1.875rem, 3vw, 2.5rem);
	font-weight: 500;
	font-style: italic;
	line-height: 1.15;
	letter-spacing: -0.005em;
	color: var(--irr-green-deep);
	margin: 0 0 1rem;
}

.irr-universe-block__lede {
	font-family: "Cormorant Garamond", "Garamond", Georgia, serif;
	font-size: 1.1875rem;
	font-style: italic;
	font-weight: 400;
	line-height: 1.55;
	color: var(--irr-text-muted);
	margin: 0 0 2rem;
}

.irr-universe-block__content p {
	font-family: "Inter", sans-serif;
	font-size: 1rem;
	line-height: 1.8;
	color: var(--irr-text);
	margin: 0 0 1.25rem;
}

.irr-universe-block__missions {
	margin-block: 2.5rem;
	padding-block: 2rem;
	border-block: 1px solid var(--irr-border);
}

.irr-universe-block__missions__title {
	font-family: "Inter", sans-serif;
	font-size: 0.6875rem;
	font-weight: 500;
	letter-spacing: 0.28em;
	text-transform: uppercase;
	color: var(--irr-gold);
	margin: 0 0 1.25rem;
}

.irr-universe-block__missions__list {
	list-style: none;
	padding: 0;
	margin: 0;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: 0.85rem 2rem;
}

.irr-universe-block__missions__list li {
	font-family: "Inter", sans-serif;
	font-size: 0.9375rem;
	line-height: 1.55;
	color: var(--irr-text);
	padding-inline-start: 1.25rem;
	position: relative;
}

.irr-universe-block__missions__list li::before {
	content: '◇';
	position: absolute;
	left: 0;
	top: 0.15em;
	color: var(--irr-gold);
	font-size: 0.625rem;
}

.irr-universe-block__quote {
	font-family: "Cormorant Garamond", "Garamond", Georgia, serif;
	font-style: italic;
	font-size: 1.0625rem;
	line-height: 1.65;
	color: var(--irr-green-deep);
	border-inline-start: 2px solid var(--irr-gold);
	padding-inline-start: 1.5rem;
	margin-block: 2rem;
}

.irr-universe-block__link {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	font-family: "Inter", sans-serif;
	font-size: 0.75rem;
	font-weight: 500;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--irr-green-deep);
	text-decoration: none;
	border-bottom: 1.5px solid var(--irr-green-deep);
	padding-bottom: 4px;
	margin-block-start: 1.5rem;
	transition: all var(--irr-transition);
}

.irr-universe-block__link::after {
	content: '→';
	display: inline-block;
	transition: transform var(--irr-transition);
}

.irr-universe-block__link:hover {
	color: var(--irr-gold);
	border-bottom-color: var(--irr-gold);
}

.irr-universe-block__link:hover::after {
	transform: translateX(4px);
}

/* ================================================================
   VARIANTE ARGENT — Trajan Pro / Cinzel + Métal Relief
   Page /variante-argent/ uniquement
   ================================================================ */

.irr-silver-hero {
	background: #0A1A14;
	color: #E8E8E8;
	padding-block: 8rem 7rem;
	text-align: center;
	position: relative;
	overflow: hidden;
	isolation: isolate;
}

.irr-silver-hero::before {
	content: '';
	position: absolute;
	inset: 0;
	background: radial-gradient(ellipse at center top, rgba(60, 90, 80, 0.4) 0%, transparent 60%),
				linear-gradient(180deg, #050D08 0%, #0F221A 60%, #050D08 100%);
	z-index: 0;
}

.irr-silver-hero::after {
	content: '';
	position: absolute;
	inset: 0;
	background-image: radial-gradient(circle at 1px 1px, rgba(220, 220, 220, 0.04) 1px, transparent 0);
	background-size: 32px 32px;
	z-index: 0;
	pointer-events: none;
}

.irr-silver-hero > * { position: relative; z-index: 2; }

.irr-silver-hero__logo {
	margin: 0 auto 3rem;
	display: block;
}

/* Logo argent + relief PRONONCÉ : transformation or → argent + relief gravé profond */
.irr-silver-hero__logo img {
	display: inline-block;
	max-height: 140px;
	width: auto;
	filter:
		grayscale(100%)
		brightness(1.6)
		contrast(1.25)
		/* Ombre portée profonde (relief vertical) */
		drop-shadow(0 5px 8px rgba(0, 0, 0, 0.75))
		drop-shadow(0 3px 3px rgba(0, 0, 0, 0.55))
		/* Highlight de bord supérieur (effet gravure en relief) */
		drop-shadow(0 -2px 1px rgba(255, 255, 255, 0.5))
		drop-shadow(-1px -1px 0 rgba(255, 255, 255, 0.4))
		/* Halo argenté autour */
		drop-shadow(0 0 22px rgba(200, 200, 200, 0.25));
}

.irr-silver-hero__eyebrow {
	display: inline-block;
	font-family: "Cinzel", "Trajan Pro", Georgia, serif !important;
	font-size: 0.875rem;
	font-weight: 500;
	font-style: normal !important;
	letter-spacing: 0.45em;
	text-transform: uppercase;
	color: #C8C8C8;
	margin: 0 0 2.5rem;
	text-shadow:
		0 1px 0 rgba(0, 0, 0, 0.4),
		0 -1px 0 rgba(255, 255, 255, 0.15);
}

.irr-silver-hero__eyebrow::before,
.irr-silver-hero__eyebrow::after {
	content: '◇';
	display: inline-block;
	margin: 0 1rem;
	font-size: 0.5em;
	color: #C0C0C0;
	opacity: 0.7;
	vertical-align: middle;
}

/* TITRE ARGENT POLI — Cinzel + RELIEF CREUSÉ (letterpress comme Sageocracy) */
.irr-silver-hero__title {
	font-family: "Cinzel", "Trajan Pro", "Trajan", Georgia, "Times New Roman", serif !important;
	font-size: clamp(3rem, 8vw, 6rem);
	font-weight: 400 !important;
	font-style: normal !important;
	line-height: 1.15;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	margin: 0;

	/* Métal poli — même gradient que sageocracy.org */
	color: transparent;
	background: linear-gradient(180deg,
		#FFFFFF   0%,
		#F0F0F0  12%,
		#C8C8C8  44%,
		#ECECEC  74%,
		#DCDCDC 100%);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;

	/* Relief CREUSÉ (letterpress) — comme sageocracy.org :
	   fine ombre noire EN HAUT (l'arête du creux), reflet sous la lettre, profondeur */
	text-shadow:
		0 -1px 0   rgba(0, 0, 0, 0.55),
		0  1px 1px rgba(255, 255, 255, 0.22),
		0  2px 5px rgba(0, 0, 0, 0.18);
	filter: none !important;
}

.irr-silver-hero__rule {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 1.5rem;
	margin: 3rem auto 0;
	max-width: 220px;
}

.irr-silver-hero__rule::before,
.irr-silver-hero__rule::after {
	content: '';
	flex: 1;
	height: 1px;
	background: linear-gradient(90deg, transparent, #C0C0C0 50%, transparent);
}

.irr-silver-hero__rule__diamond {
	color: #D8D8D8;
	font-size: 0.75rem;
	filter: drop-shadow(0 1px 1px rgba(0, 0, 0, 0.4));
}

.irr-silver-hero__subtitle {
	font-family: "Inter", "Segoe UI", system-ui, sans-serif !important;
	font-size: clamp(1rem, 1.5vw, 1.1875rem);
	font-weight: 300;
	font-style: normal !important;
	line-height: 1.6;
	letter-spacing: 0.02em;
	color: rgba(232, 232, 232, 0.85);
	max-width: 640px;
	margin: 2.5rem auto 0;
}

/* ── Bandeau de page version argent ──────────────────────────── */
.irr-silver-banner {
	background: #0A1A14;
	color: #E8E8E8;
	padding-block: 6rem 5rem;
	text-align: center;
	position: relative;
	overflow: hidden;
	isolation: isolate;
}

.irr-silver-banner::before {
	content: '';
	position: absolute;
	inset: 0;
	background: radial-gradient(ellipse at center top, rgba(60, 90, 80, 0.4) 0%, transparent 60%),
				linear-gradient(180deg, #050D08 0%, #0F221A 60%, #050D08 100%);
	z-index: 0;
}

.irr-silver-banner > * { position: relative; z-index: 2; }

.irr-silver-banner__eyebrow {
	display: inline-block;
	font-family: "Cinzel", "Trajan Pro", Georgia, serif !important;
	font-size: 0.75rem;
	font-weight: 500;
	font-style: normal !important;
	letter-spacing: 0.5em;
	text-transform: uppercase;
	color: #C8C8C8;
	margin: 0 0 1.75rem;
}

.irr-silver-banner__eyebrow::before,
.irr-silver-banner__eyebrow::after {
	content: '◇';
	display: inline-block;
	margin: 0 1rem;
	font-size: 0.5em;
	color: #C0C0C0;
	opacity: 0.7;
	vertical-align: middle;
}

.irr-silver-banner__title {
	font-family: "Cinzel", "Trajan Pro", "Trajan", Georgia, "Times New Roman", serif !important;
	font-size: clamp(2.5rem, 6vw, 4.5rem);
	font-weight: 400 !important;
	font-style: normal !important;
	line-height: 1.15;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	margin: 0;
	color: transparent;
	background: linear-gradient(180deg,
		#FFFFFF   0%,
		#F0F0F0  12%,
		#C8C8C8  44%,
		#ECECEC  74%,
		#DCDCDC 100%);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	/* Relief CREUSÉ — letterpress comme sageocracy.org */
	text-shadow:
		0 -1px 0   rgba(0, 0, 0, 0.55),
		0  1px 1px rgba(255, 255, 255, 0.22),
		0  2px 5px rgba(0, 0, 0, 0.18);
	filter: none !important;
}

.irr-silver-banner__rule {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 1.25rem;
	margin: 2.25rem auto 0;
	max-width: 200px;
}

.irr-silver-banner__rule::before,
.irr-silver-banner__rule::after {
	content: '';
	flex: 1;
	height: 1px;
	background: linear-gradient(90deg, transparent, #C0C0C0 50%, transparent);
}

.irr-silver-banner__rule__diamond {
	color: #D8D8D8;
	font-size: 0.625rem;
}

/* ================================================================
   COMPARAISON DES POLICES — page /comparaison-polices/
   ================================================================ */

.poliscompare-block {
	padding: 4rem 0;
	border-bottom: 1px solid #D8D2C6;
}
.poliscompare-block:last-child { border-bottom: 0; }

.poliscompare-header {
	max-width: 820px;
	margin: 0 auto 2rem;
	padding: 0 1.5rem;
}

.poliscompare-num {
	display: inline-block;
	font-family: "Inter", sans-serif;
	font-size: 0.75rem;
	font-style: normal;
	font-weight: 500;
	color: #C9A968;
	margin-bottom: 0.5rem;
	letter-spacing: 0.32em;
	text-transform: uppercase;
}

.poliscompare-name {
	font-family: "Inter", sans-serif;
	font-size: 0.875rem;
	font-weight: 600;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: #1F1B17;
	margin: 0 0 0.75rem;
}

.poliscompare-tagline {
	font-family: "Inter", sans-serif;
	font-size: 0.9375rem;
	font-style: normal;
	color: #5A554F;
	margin: 0;
	line-height: 1.65;
	max-width: 70ch;
}

.poliscompare-demo {
	background: #0A1A14;
	padding: 5rem 1.5rem;
	text-align: center;
	position: relative;
	overflow: hidden;
	isolation: isolate;
}

.poliscompare-demo::before {
	content: '';
	position: absolute;
	inset: 0;
	background: radial-gradient(ellipse at center top, rgba(60,90,80,0.4) 0%, transparent 60%),
				linear-gradient(180deg, #050D08 0%, #0F221A 60%, #050D08 100%);
	z-index: 0;
}

.poliscompare-demo > * { position: relative; z-index: 2; }

.poliscompare-title {
	font-size: clamp(4rem, 10vw, 7.5rem) !important;
	font-weight: 400 !important;
	font-style: normal !important;
	line-height: 1.15 !important;
	letter-spacing: 0.22em !important;
	text-transform: uppercase !important;
	margin: 0 !important;
	color: transparent !important;
	background: linear-gradient(180deg, #FFF8DC 0%, #F5E2B0 12%, #C9A968 44%, #ECDCA0 74%, #DCC885 100%) !important;
	-webkit-background-clip: text !important;
	background-clip: text !important;
	-webkit-text-fill-color: transparent !important;
	/* RELIEF CREUSÉ SOBRE — identique à sageocracy.org */
	text-shadow:
		0 -1px 0   rgba(0, 0, 0, 0.55),
		0  1px 1px rgba(255, 240, 200, 0.22),
		0  2px 5px rgba(0, 0, 0, 0.18) !important;
}

/* Phrase italique lowercase sous chaque titre — pour voir le vrai caractère de la police */
.poliscompare-italic {
	font-size: clamp(1.5rem, 2.5vw, 2.25rem);
	font-style: italic;
	font-weight: 400;
	color: rgba(245, 229, 187, 0.88);
	margin: 1.5rem 0 0;
	letter-spacing: 0.005em;
	line-height: 1.4;
}

/* Variantes de police pour la phrase italique */
.poliscompare-italic--cinzel    { font-family: "Cinzel", serif; font-style: normal; /* Cinzel n'a pas d'italique */ }
.poliscompare-italic--ebgaramond { font-family: "EB Garamond", serif; }
.poliscompare-italic--marcellus { font-family: "Marcellus", serif; font-style: normal; }
.poliscompare-italic--cormorant { font-family: "Cormorant Garamond", serif; }
.poliscompare-italic--italiana  { font-family: "Italiana", serif; font-style: normal; }
.poliscompare-italic--spectral  { font-family: "Spectral", serif; }

.poliscompare-title--cinzel     { font-family: "Cinzel", "Trajan Pro", serif !important; }
.poliscompare-title--ebgaramond { font-family: "EB Garamond", Garamond, serif !important; }
.poliscompare-title--marcellus  { font-family: "Marcellus", serif !important; }
.poliscompare-title--cormorant  { font-family: "Cormorant Garamond", Garamond, serif !important; }
.poliscompare-title--italiana   { font-family: "Italiana", serif !important; }
.poliscompare-title--spectral   { font-family: "Spectral", Georgia, serif !important; }

/* Tenor Sans : quasi sans-serif minimaliste, garde uppercase + letter-spacing */
.poliscompare-title--tenorsans  {
	font-family: "Tenor Sans", "Optima", "Helvetica Neue", sans-serif !important;
}

/* Aguafina Script : police cursive — DOIT être en casse mixte sans letter-spacing
   sinon les lettres ne se connectent plus. Override total. */
.poliscompare-title--aguafina {
	font-family: "Aguafina Script", "Snell Roundhand", cursive !important;
	text-transform: none !important;
	letter-spacing: 0 !important;
	font-size: clamp(5rem, 12vw, 9rem) !important;
	line-height: 1.05 !important;
}

.poliscompare-sub {
	font-family: "Inter", sans-serif;
	font-size: 0.6875rem;
	font-weight: 500;
	letter-spacing: 0.32em;
	text-transform: uppercase;
	color: #C9A968;
	margin: 1rem 0 0;
	opacity: 0.85;
}

.poliscompare-reco {
	max-width: 820px;
	margin: 5rem auto 0;
	padding: 3rem;
	background: #F3EDDD;
	border-left: 3px solid #C9A968;
}

.poliscompare-reco__eyebrow {
	font-family: "Cormorant Garamond", "Garamond", Georgia, serif;
	font-size: 0.875rem;
	font-weight: 600;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: #C9A968;
	margin: 0 0 1rem;
}

.poliscompare-reco__title {
	font-family: "Cormorant Garamond", "Garamond", Georgia, serif;
	font-size: 1.5rem;
	font-style: normal;
	font-weight: 500;
	line-height: 1.45;
	color: #1F1B17;
	margin: 0 0 1.5rem;
}

.poliscompare-reco__body {
	font-family: "Inter", sans-serif;
	font-size: 1rem;
	line-height: 1.8;
	color: #1F1B17;
	margin: 0;
}

/* ================================================================
   VARIANTE OR RELIEF — même technique letterpress qu'argent
   mais gradient doré au lieu d'argenté.
   Page /variante-or-relief/
   ================================================================ */

.irr-gold-hero {
	background: #0A1A14;
	color: #F5E5BB;
	padding-block: 8rem 7rem;
	text-align: center;
	position: relative;
	overflow: hidden;
	isolation: isolate;
}

.irr-gold-hero::before {
	content: '';
	position: absolute;
	inset: 0;
	background: radial-gradient(ellipse at center top, rgba(60, 90, 80, 0.4) 0%, transparent 60%),
				linear-gradient(180deg, #050D08 0%, #0F221A 60%, #050D08 100%);
	z-index: 0;
}

.irr-gold-hero::after {
	content: '';
	position: absolute;
	inset: 0;
	background-image: radial-gradient(circle at 1px 1px, rgba(201, 169, 104, 0.05) 1px, transparent 0);
	background-size: 32px 32px;
	z-index: 0;
	pointer-events: none;
}

.irr-gold-hero > * { position: relative; z-index: 2; }

.irr-gold-hero__logo {
	margin: 0 auto 3rem;
	display: block;
}

/* Logo or NON-modifié (déjà or natif) + relief subtil */
.irr-gold-hero__logo img {
	display: inline-block;
	max-height: 140px;
	width: auto;
	filter:
		drop-shadow(0 3px 5px rgba(0, 0, 0, 0.6))
		drop-shadow(0 -1px 0 rgba(255, 240, 200, 0.3))
		drop-shadow(0 0 22px rgba(201, 169, 104, 0.25));
}

.irr-gold-hero__eyebrow {
	display: inline-block;
	font-family: "Cinzel", "Trajan Pro", Georgia, serif;
	font-size: 0.875rem;
	font-weight: 500;
	font-style: normal;
	letter-spacing: 0.45em;
	text-transform: uppercase;
	color: #D4B872;
	margin: 0 0 2.5rem;
}

.irr-gold-hero__eyebrow::before,
.irr-gold-hero__eyebrow::after {
	content: '◇';
	display: inline-block;
	margin: 0 1rem;
	font-size: 0.5em;
	color: #C9A968;
	opacity: 0.8;
	vertical-align: middle;
}

/* TITRE OR MASSIF avec RELIEF CREUSÉ (letterpress) — même technique que argent */
.irr-gold-hero__title {
	font-family: "Cinzel", "Trajan Pro", "Trajan", Georgia, "Times New Roman", serif !important;
	font-size: clamp(3rem, 8vw, 6rem);
	font-weight: 400 !important;
	font-style: normal !important;
	line-height: 1.15;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	margin: 0;

	/* Gradient OR — équivalent doré du gradient argent */
	color: transparent;
	background: linear-gradient(180deg,
		#FFF8DC   0%,
		#F5E2B0  12%,
		#C9A968  44%,
		#ECDCA0  74%,
		#DCC885 100%);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;

	/* Relief CREUSÉ (letterpress) — identique à variante-argent */
	text-shadow:
		0 -1px 0   rgba(0, 0, 0, 0.55),
		0  1px 1px rgba(255, 240, 200, 0.22),
		0  2px 5px rgba(0, 0, 0, 0.18);
	filter: none !important;
}

.irr-gold-hero__rule {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 1.5rem;
	margin: 3rem auto 0;
	max-width: 220px;
}

.irr-gold-hero__rule::before,
.irr-gold-hero__rule::after {
	content: '';
	flex: 1;
	height: 1px;
	background: linear-gradient(90deg, transparent, #C9A968 50%, transparent);
}

.irr-gold-hero__rule__diamond {
	color: #C9A968;
	font-size: 0.75rem;
}

.irr-gold-hero__subtitle {
	font-family: "Inter", "Segoe UI", system-ui, sans-serif;
	font-size: clamp(1rem, 1.5vw, 1.1875rem);
	font-weight: 300;
	line-height: 1.6;
	letter-spacing: 0.02em;
	color: rgba(245, 229, 187, 0.88);
	max-width: 640px;
	margin: 2.5rem auto 0;
}

/* ─── Bandeau page version or relief ───────────────────────── */
.irr-gold-banner {
	background: #0A1A14;
	color: #F5E5BB;
	padding-block: 6rem 5rem;
	text-align: center;
	position: relative;
	overflow: hidden;
	isolation: isolate;
}

.irr-gold-banner::before {
	content: '';
	position: absolute;
	inset: 0;
	background: radial-gradient(ellipse at center top, rgba(60, 90, 80, 0.4) 0%, transparent 60%),
				linear-gradient(180deg, #050D08 0%, #0F221A 60%, #050D08 100%);
	z-index: 0;
}

.irr-gold-banner > * { position: relative; z-index: 2; }

.irr-gold-banner__eyebrow {
	display: inline-block;
	font-family: "Cinzel", "Trajan Pro", Georgia, serif;
	font-size: 0.75rem;
	font-weight: 500;
	font-style: normal;
	letter-spacing: 0.5em;
	text-transform: uppercase;
	color: #D4B872;
	margin: 0 0 1.75rem;
}

.irr-gold-banner__eyebrow::before,
.irr-gold-banner__eyebrow::after {
	content: '◇';
	display: inline-block;
	margin: 0 1rem;
	font-size: 0.5em;
	color: #C9A968;
	opacity: 0.8;
	vertical-align: middle;
}

.irr-gold-banner__title {
	font-family: "Cinzel", "Trajan Pro", "Trajan", Georgia, "Times New Roman", serif !important;
	font-size: clamp(2.5rem, 6vw, 4.5rem);
	font-weight: 400 !important;
	font-style: normal !important;
	line-height: 1.15;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	margin: 0;
	color: transparent;
	background: linear-gradient(180deg,
		#FFF8DC   0%,
		#F5E2B0  12%,
		#C9A968  44%,
		#ECDCA0  74%,
		#DCC885 100%);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	text-shadow:
		0 -1px 0   rgba(0, 0, 0, 0.55),
		0  1px 1px rgba(255, 240, 200, 0.22),
		0  2px 5px rgba(0, 0, 0, 0.18);
	filter: none !important;
}

.irr-gold-banner__rule {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 1.25rem;
	margin: 2.25rem auto 0;
	max-width: 200px;
}

.irr-gold-banner__rule::before,
.irr-gold-banner__rule::after {
	content: '';
	flex: 1;
	height: 1px;
	background: linear-gradient(90deg, transparent, #C9A968 50%, transparent);
}

.irr-gold-banner__rule__diamond {
	color: #C9A968;
	font-size: 0.625rem;
}

/* ─── Override bandeau de page sur /variante-or-relief/ et /comparaison-polices/ ─── */
body.page-variante-or-relief .irr-page-banner__eyebrow,
body.page-comparaison-polices .irr-page-banner__eyebrow {
	/* Eyebrow ◇ AUBREMONT ◇ avec léger relief or */
	color: #C9A968 !important;
	text-shadow:
		0 -1px 0 rgba(0, 0, 0, 0.4),
		0  1px 0 rgba(255, 240, 200, 0.2) !important;
}

body.page-variante-or-relief .irr-page-banner__title,
body.page-variante-or-relief .irr-page-banner .wp-block-post-title,
body.page-variante-or-relief .irr-page-banner h1,
body.page-comparaison-polices .irr-page-banner__title,
body.page-comparaison-polices .irr-page-banner .wp-block-post-title,
body.page-comparaison-polices .irr-page-banner h1 {
	font-family: "Cinzel", "Trajan Pro", "Trajan", Georgia, serif !important;
	font-style: normal !important;
	font-weight: 400 !important;
	letter-spacing: 0.22em !important;
	text-transform: uppercase !important;
	color: transparent !important;
	background: linear-gradient(180deg,
		#FFF8DC 0%, #F5E2B0 12%, #C9A968 44%, #ECDCA0 74%, #DCC885 100%) !important;
	-webkit-background-clip: text !important;
	background-clip: text !important;
	-webkit-text-fill-color: transparent !important;
	text-shadow:
		0 -1px 0   rgba(0, 0, 0, 0.55),
		0  1px 1px rgba(255, 240, 200, 0.22),
		0  2px 5px rgba(0, 0, 0, 0.18) !important;
	filter: none !important;
}

/* ─── Page /variante-argent/ — TOUT EN ARGENT ──────────────────
   Override de toute trace d'or sur cette page spécifique
   (body.page-variante-argent ajouté automatiquement par WordPress) */

/* Bandeau du haut : H1 page-banner argent au lieu de l'or */
body.page-variante-argent .irr-page-banner__title,
body.page-variante-argent .irr-page-banner .wp-block-post-title,
body.page-variante-argent .irr-page-banner h1 {
	font-family: "Cinzel", "Trajan Pro", "Trajan", Georgia, serif !important;
	font-style: normal !important;
	font-weight: 500 !important;
	letter-spacing: 0.18em !important;
	text-transform: uppercase !important;
	color: transparent !important;
	background: linear-gradient(180deg,
		#FFFFFF 0%,
		#F0F0F0 12%,
		#C8C8C8 44%,
		#ECECEC 74%,
		#DCDCDC 100%) !important;
	-webkit-background-clip: text !important;
	background-clip: text !important;
	-webkit-text-fill-color: transparent !important;
	filter:
		drop-shadow(0 1px 0 rgba(0, 0, 0, 0.6))
		drop-shadow(0 -1px 0 rgba(255, 255, 255, 0.25))
		drop-shadow(0 3px 6px rgba(0, 0, 0, 0.3)) !important;
	text-shadow: none !important;
}

/* Eyebrow du bandeau page : argent + Cinzel */
body.page-variante-argent .irr-page-banner__eyebrow {
	color: #C8C8C8 !important;
	font-family: "Cinzel", "Trajan Pro", Georgia, serif !important;
	letter-spacing: 0.32em !important;
}

body.page-variante-argent .irr-page-banner__eyebrow::before,
body.page-variante-argent .irr-page-banner__eyebrow::after {
	color: #C0C0C0 !important;
}

/* Rule du bandeau page : losanges et filets argent */
body.page-variante-argent .irr-page-banner__rule::before,
body.page-variante-argent .irr-page-banner__rule::after {
	background: #C8C8C8 !important;
}
body.page-variante-argent .irr-page-banner__rule__diamond {
	color: #C8C8C8 !important;
}

/* Eyebrows de section (irr-eyebrow / section__eyebrow) : argent */
body.page-variante-argent .irr-eyebrow,
body.page-variante-argent .irr-section__eyebrow {
	color: #888888 !important;
}

/* Dividers internes : losanges + filets argent */
body.page-variante-argent .irr-divider::before,
body.page-variante-argent .irr-divider::after {
	background: #B0B0B0 !important;
	opacity: 0.7 !important;
}
body.page-variante-argent .irr-divider__diamond {
	color: #B0B0B0 !important;
}

/* H2/H3 sur la page : reste en encre normale, ni or ni vert */
body.page-variante-argent h2,
body.page-variante-argent h3 {
	color: var(--irr-anthracite, #2A2622) !important;
}

/* Quote / blockquote : border-left argent */
body.page-variante-argent .irr-quote {
	border-inline-start-color: #B0B0B0 !important;
}

/* Liens / accents : argent au hover au lieu de l'or */
body.page-variante-argent a:hover {
	color: #888888 !important;
}

/* Compare title or → argent (la colonne "Version actuelle Or" garde l'or pour rappel comparatif) */
body.page-variante-argent .irr-silver-compare__col--silver h3 {
	color: #888888 !important;
}

/* Encart présentation côte à côte sur la page comparaison */
.irr-silver-compare {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0;
	margin-block: 3rem;
	border: 1px solid var(--irr-border);
}

.irr-silver-compare__col {
	padding: 2rem;
	border-right: 1px solid var(--irr-border);
}

.irr-silver-compare__col:last-child {
	border-right: 0;
}

.irr-silver-compare__col h3 {
	font-family: "Cinzel", "Trajan Pro", serif;
	font-size: 0.875rem;
	font-weight: 500;
	letter-spacing: 0.32em;
	text-transform: uppercase;
	color: var(--irr-gold);
	margin: 0 0 1.25rem;
}

.irr-silver-compare__col--silver h3 {
	color: #888888;
}

/* ── Mobile ─────────────────────────────────────────────────── */
@media (max-width: 720px) {
	.irr-hero { padding-block: 5rem 4rem; }
	.irr-section { padding-block: 4rem; }
	.irr-page-banner { padding-block: 5rem 4rem; }
	.irr-card-row {
		grid-template-columns: 1fr;
		gap: 1rem;
		text-align: center;
	}
	.irr-card-row__link { justify-content: center; }
	.irr-cards-grid {
		grid-template-columns: 1fr;
	}
	.irr-universe-block {
		grid-template-columns: 1fr;
		gap: 1.5rem;
		padding-block: 3.5rem;
	}
	.irr-universe-block__number {
		font-size: 4rem;
	}
	.irr-silver-compare {
		grid-template-columns: 1fr;
	}
	.irr-silver-compare__col {
		border-right: 0;
		border-bottom: 1px solid var(--irr-border);
	}
	.irr-silver-compare__col:last-child { border-bottom: 0; }
}

/* ═════════════════════════════════════════════════════════════════
   PAGE ARTICLES — refonte éditoriale type Sageocracy
   ═════════════════════════════════════════════════════════════════ */

.irr-articles-page {
	background: var(--irr-cream, #FAF7F0);
}

/* ─── Hero compact ─── */
.irr-articles-hero {
	background: var(--irr-green-darker);
	padding: 7rem 1.5rem 6rem;
	text-align: center;
	color: var(--irr-cream);
}
.irr-articles-hero__inner {
	max-width: 880px;
	margin: 0 auto;
}
.irr-articles-hero__eyebrow {
	display: inline-block;
	font-family: "Inter", sans-serif;
	font-size: 0.75rem;
	font-weight: 500;
	letter-spacing: 0.32em;
	text-transform: uppercase;
	color: var(--irr-gold);
	margin: 0 0 1.75rem;
}
.irr-articles-hero__subtitle {
	font-family: "Inter", sans-serif;
	font-size: 1rem;
	font-weight: 400;
	color: #E8D597;
	max-width: 640px;
	margin: 1.5rem auto 0;
	line-height: 1.6;
	opacity: 0.92;
	letter-spacing: 0.01em;
}
.irr-articles-hero__rule {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 18px;
	max-width: 200px;
	margin: 2.5rem auto 0;
}
.irr-articles-hero__rule__line {
	flex: 1;
	height: 1px;
	background: var(--irr-gold);
	opacity: 0.55;
}
.irr-articles-hero__rule__diamond {
	color: var(--irr-gold);
	font-size: 0.875rem;
	line-height: 1;
}

/* ─── Section + container ─── */
.irr-articles-section {
	padding: 4rem 1.5rem 5rem;
}
.irr-articles-container {
	max-width: 1180px;
	margin: 0 auto;
}

/* ─── Filtres par registre ─── */
.irr-articles-filters {
	display: flex;
	gap: 0.5rem;
	flex-wrap: wrap;
	align-items: center;
	margin-bottom: 2.5rem;
}
.irr-articles-filters__label {
	font-family: "Inter", sans-serif;
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--irr-gris-chaud, #5A554F);
	margin-right: 0.5rem;
}
.irr-articles-filter {
	font-family: "Inter", sans-serif;
	font-size: 0.8125rem;
	font-weight: 500;
	padding: 0.35rem 1rem;
	border: 1px solid var(--irr-border, #E5DFD2);
	border-radius: 999px;
	color: var(--irr-text, #1F1B17);
	text-decoration: none;
	transition: all 0.18s ease;
	background: transparent;
}
.irr-articles-filter:hover {
	border-color: var(--irr-gold);
	color: var(--irr-gold);
}
.irr-articles-filter.is-active {
	background: var(--irr-green-deep);
	border-color: var(--irr-green-deep);
	color: #fff;
}

/* ─── Grille articles ─── */
.irr-blog-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 2rem;
}
@media (max-width: 980px) {
	.irr-blog-grid { grid-template-columns: repeat(2, 1fr); gap: 1.5rem; }
}
@media (max-width: 640px) {
	.irr-blog-grid { grid-template-columns: 1fr; gap: 1.75rem; }
}

/* ─── Carte article ─── */
.irr-blog-card {
	background: #fff;
	border: 1px solid var(--irr-border, #E5DFD2);
	display: flex;
	flex-direction: column;
	transition: box-shadow 0.22s ease, transform 0.22s ease;
}
.irr-blog-card:hover {
	box-shadow: 0 12px 32px rgba(20, 40, 35, 0.08), 0 2px 6px rgba(20, 40, 35, 0.05);
	transform: translateY(-2px);
}

/* Image (ou placeholder ◇) */
.irr-blog-card__img {
	display: block;
	aspect-ratio: 3 / 2;
	overflow: hidden;
	background: var(--irr-green-darker);
	position: relative;
}
.irr-blog-card__img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.45s ease;
}
.irr-blog-card:hover .irr-blog-card__img img {
	transform: scale(1.03);
}
.irr-blog-card__img__placeholder {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: "Cinzel", Georgia, serif;
	font-size: 3rem;
	color: var(--irr-gold);
	opacity: 0.4;
	background: linear-gradient(135deg, var(--irr-green-darker) 0%, var(--irr-green-deep) 100%);
}

.irr-blog-card__body {
	padding: 1.5rem 1.5rem 1.75rem;
	display: flex;
	flex-direction: column;
	flex: 1;
}

.irr-blog-card__meta {
	font-family: "Inter", sans-serif;
	font-size: 0.6875rem;
	font-weight: 500;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--irr-gris-chaud, #5A554F);
	margin: 0 0 0.75rem;
}
.irr-blog-card__sep {
	margin: 0 0.5rem;
	color: var(--irr-gold);
}
.irr-blog-card__cat {
	color: var(--irr-gold);
	text-decoration: none;
	font-weight: 600;
}
.irr-blog-card__cat:hover {
	text-decoration: underline;
}

.irr-blog-card__title {
	font-family: "Inter", sans-serif;
	font-size: 1.125rem;
	font-weight: 600;
	line-height: 1.35;
	letter-spacing: -0.005em;
	margin: 0 0 0.75rem;
	color: var(--irr-green-deep);
}
.irr-blog-card__title a {
	color: inherit;
	text-decoration: none;
}
.irr-blog-card__title a:hover {
	color: var(--irr-gold);
}

.irr-blog-card__excerpt {
	font-family: "Inter", sans-serif;
	font-size: 0.9375rem;
	line-height: 1.65;
	color: var(--irr-text, #2A2622);
	flex: 1;
	margin-bottom: 1.25rem;
}
.irr-blog-card__excerpt p {
	margin: 0;
}

.irr-blog-card__read {
	font-family: "Inter", sans-serif;
	font-size: 0.8125rem;
	font-weight: 600;
	letter-spacing: 0.04em;
	color: var(--irr-gold);
	text-decoration: none;
	align-self: flex-start;
	border-bottom: 1px solid transparent;
	transition: border-color 0.18s ease;
}
.irr-blog-card__read:hover {
	border-bottom-color: var(--irr-gold);
}

/* ─── Pagination ─── */
.irr-pagination {
	margin-top: 3.5rem;
	text-align: center;
}
.irr-pagination .page-numbers {
	display: inline-block;
	padding: 0.5rem 0.9rem;
	margin: 0 0.15rem;
	font-family: "Inter", sans-serif;
	font-size: 0.875rem;
	color: var(--irr-text);
	text-decoration: none;
	border: 1px solid var(--irr-border, #E5DFD2);
	transition: all 0.18s ease;
}
.irr-pagination .page-numbers:hover {
	border-color: var(--irr-gold);
	color: var(--irr-gold);
}
.irr-pagination .page-numbers.current {
	background: var(--irr-green-deep);
	border-color: var(--irr-green-deep);
	color: #fff;
}
.irr-pagination .page-numbers.dots {
	border: 0;
}

/* ─── Empty state ─── */
.irr-articles-empty {
	text-align: center;
	padding: 4rem 1.5rem;
	max-width: 560px;
	margin: 0 auto;
}
.irr-articles-empty__diamond {
	font-family: "Cinzel", Georgia, serif;
	font-size: 3rem;
	color: var(--irr-gold);
	opacity: 0.6;
	margin: 0 0 1.5rem;
	line-height: 1;
}
.irr-articles-empty__title {
	font-family: "Cinzel", "Trajan Pro", Georgia, serif;
	font-size: 1.875rem;
	font-weight: 400;
	letter-spacing: 0.06em;
	color: var(--irr-green-deep);
	margin: 0 0 1.25rem;
}
.irr-articles-empty__text {
	font-family: "Inter", sans-serif;
	font-size: 1rem;
	line-height: 1.65;
	color: var(--irr-gris-chaud, #5A554F);
	margin: 0 0 2rem;
}

/* ─── CTA final ─── */
.irr-articles-cta {
	background: var(--irr-green-darker);
	color: var(--irr-cream);
	padding: 5rem 1.5rem;
	text-align: center;
}
.irr-articles-cta__inner {
	max-width: 720px;
	margin: 0 auto;
}
.irr-articles-cta__quote {
	font-family: "EB Garamond", Georgia, serif;
	font-size: clamp(1.5rem, 3vw, 2rem);
	font-style: italic;
	font-weight: 400;
	line-height: 1.35;
	color: var(--irr-gold);
	margin: 0 0 2rem;
	letter-spacing: 0.01em;
}
.irr-articles-cta__text {
	font-family: "Inter", sans-serif;
	font-size: 1rem;
	line-height: 1.7;
	color: var(--irr-cream);
	opacity: 0.88;
	margin: 0 0 2.5rem;
}
.irr-articles-cta__buttons {
	display: flex;
	gap: 1rem;
	flex-wrap: wrap;
	justify-content: center;
}
.irr-articles-cta .irr-btn--ghost {
	color: var(--irr-cream);
	border-color: rgba(255, 255, 255, 0.3);
}
.irr-articles-cta .irr-btn--ghost:hover {
	border-color: var(--irr-gold);
	color: var(--irr-gold);
}

/* ══════════════════════════════════════════════════════════════════════
   MAISON VIVANTE — Animations & micro-interactions  v1.0.0
   ══════════════════════════════════════════════════════════════════════ */

/* ─── Variables d'animation ──────────────────────────────────────────── */
:root {
	--irr-ease-out-expo: cubic-bezier(0.22, 1, 0.36, 1);
	--irr-ease-in-expo:  cubic-bezier(0.64, 0, 0.78, 0);
}

/* ─── Curseur : désactivé, retour au curseur natif ───────────────────── */
/* initCursor() désactivé dans animations.js */

/* ─── Révélation au scroll ────────────────────────────────────────────── */
@media (prefers-reduced-motion: no-preference) {
	.irr-reveal {
		opacity: 0;
		transform: translateY(28px);
		transition:
			opacity   0.72s var(--irr-ease-out-expo),
			transform 0.72s var(--irr-ease-out-expo);
	}
	.irr-reveal--visible {
		opacity: 1;
		transform: translateY(0);
	}
}

/* ─── Animation d'entrée du hero ──────────────────────────────────────── */
@keyframes irrHeroIn {
	from {
		opacity: 0;
		transform: translateY(18px);
		filter: blur(5px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
		filter: blur(0);
	}
}
@media (prefers-reduced-motion: no-preference) {
	.irr-hero-item {
		opacity: 0;
		animation: irrHeroIn 0.95s var(--irr-ease-out-expo) both;
	}
}

/* ─── Hero — overflow clippé pour le parallax ────────────────────────── */
.irr-hero { overflow: hidden; }

/* ─── Header — ombre dorée au scroll ─────────────────────────────────── */
.irr-site-header {
	transition: box-shadow 0.35s ease;
}
.irr-site-header--scrolled {
	box-shadow:
		0 1px 0 rgba(201, 169, 104, 0.22),
		0 4px 28px rgba(10, 26, 20, 0.09);
}

/* ─── Cartes — survol élevé + contour doré ────────────────────────────── */
.irr-card-cell {
	transition:
		transform    0.38s var(--irr-ease-out-expo),
		box-shadow   0.38s ease,
		border-color 0.38s ease !important;
}
.irr-card-cell:hover {
	transform:    translateY(-7px);
	box-shadow:   0 18px 52px rgba(10, 26, 20, 0.18),
	              0 0 0 1.5px var(--irr-gold) !important;
	border-color: var(--irr-gold) !important;
}

/* ─── Article cards — glissement latéral ──────────────────────────────── */
.irr-article-card {
	transition: transform 0.35s var(--irr-ease-out-expo);
	will-change: transform;
}
.irr-article-card:hover {
	transform: translateX(5px);
}

/* ─── Boutons — remplissage de gauche à droite ────────────────────────── */
.irr-btn {
	position: relative;
	overflow: hidden;
	z-index: 0;
}
.irr-btn::after {
	content: '';
	position: absolute;
	inset: 0;
	transform: translateX(-102%);
	transition: transform 0.45s var(--irr-ease-out-expo);
	z-index: -1;
	pointer-events: none;
}
.irr-btn--outline::after { background: var(--irr-green-mid); }
.irr-btn--ghost::after   { background: rgba(255, 255, 255, 0.1); }
.irr-btn:not(.irr-btn--outline):not(.irr-btn--ghost)::after {
	background: rgba(0, 0, 0, 0.08);
}
.irr-btn:hover::after { transform: translateX(0); }

/* ─── Navigation — soulignement doré animé ────────────────────────────── */
.wp-block-navigation-item__content {
	position: relative;
}
.wp-block-navigation-item__content::after {
	content: '';
	position: absolute;
	bottom: -2px; left: 0;
	width: 100%; height: 1px;
	background: var(--irr-gold);
	transform: scaleX(0);
	transform-origin: right;
	transition: transform 0.35s var(--irr-ease-out-expo);
}
.wp-block-navigation-item__content:hover::after,
.current-menu-item .wp-block-navigation-item__content::after {
	transform: scaleX(1);
	transform-origin: left;
}

/* ─── Soudure header / bandeau : le fond sombre remonte derrière le nav ── */
/* Le header fixed flotte sur fond sombre avec son backdrop-blur — sans     */
/* couture crème visible. Les deux valeurs compensent body padding-top.     */
.irr-hero {
	margin-top: -96px;
	padding-top: calc(3.5rem + 96px);
}
.irr-page-banner {
	margin-top: -96px !important;
	padding-top: calc(7rem + 96px) !important;
}
.irr-articles-hero {
	margin-top: -96px;
	padding-top: calc(7rem + 96px);
}
@media (max-width: 720px) {
	.irr-hero {
		margin-top: -84px;
		padding-top: calc(3rem + 84px);
	}
	.irr-page-banner {
		margin-top: -84px !important;
		padding-top: calc(4.5rem + 84px) !important;
	}
	.irr-articles-hero {
		margin-top: -84px;
		padding-top: calc(5rem + 84px);
	}
}


/* Fix : supprime le bandeau creme entre le contenu et le footer (marge blockGap),
   et delimite les deux blocs sombres par un trait fin d'1px (nuance plus claire du vert de fond). */
.wp-site-blocks > footer.wp-block-template-part { margin-block-start: 0 !important; margin-top: 0 !important; border-top: 1px solid var(--irr-green-deep); }

/* Sections pleine largeur collees : supprime TOUTES les bandes creme du blockGap (1.5rem) — home + footer + partout */
:where(.wp-site-blocks) > * { margin-block-start: 0 !important; }


/* ══════════════════════════════════════════════════════════════════
   REFONTE « CARACTÈRE » — la matière entre dans la page d'accueil
   Photographie sous voile vert dans le héros, bandeau photographique
   en tête de chacun des quatre univers. Les chemins sont relatifs à
   cette feuille de style : identiques en local et en production.
   ══════════════════════════════════════════════════════════════════ */

/* ── Héros : photographie sous voile vert profond ─────────────── */
/* Le voile vertical et la desaturation sont cuits dans le JPEG :
   pas de filter au rendu, rien a recalculer au scroll.             */
.irr-hero {
	min-height: min(72vh, 680px); /* 28/09/2026, était min(88vh, 820px) */
	display: flex;
	align-items: center;
	background-color: var(--irr-green-darker);
}

.irr-hero__inner { width: 100%; }

.irr-hero::before {
	content: '' !important;
	display: block !important;
	position: absolute;
	inset: 0;
	background: url('../img/hero-accueil-escalier-franc.jpg?v=1') center 55% / cover no-repeat;
	pointer-events: none;
}

/* Grain patrimoine + assombrissement local sous le bloc de titre :
   la photographie garde sa presence sur les bords, l'or reste lisible. */
.irr-hero::after {
	background-image:
		radial-gradient(circle at 1px 1px, rgba(201, 169, 104, 0.03) 1px, transparent 0),
		radial-gradient(ellipse 62% 58% at 50% 50%,
			rgba(10, 26, 20, 0.74)  0%,
			rgba(10, 26, 20, 0.45) 55%,
			rgba(10, 26, 20, 0.00) 78%);
	background-size: 32px 32px, cover;
	background-repeat: repeat, no-repeat;
}

/* Le logo or doit rester détaché de la photographie */
.irr-hero__logo img {
	filter: drop-shadow(0 2px 14px rgba(0, 0, 0, 0.55));
}

/* ── Univers : bandeau photographique en tête de cellule ────────── */
/* Desaturation et voile vert cuits dans les JPEG : les quatre
   photographies parlent d'une seule voix, sans filter au rendu.     */
.irr-card-cell { padding: 0; }

.irr-card-cell__media {
	position: relative;
	aspect-ratio: 16 / 9;
	overflow: hidden;
	background-color: var(--irr-green-deep);
}

.irr-card-cell__media::before {
	content: '';
	position: absolute;
	inset: 0;
	background-image: var(--irr-card-img);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	transform: scale(1.01);
	transition: transform 0.7s ease;
}

.irr-card-cell:hover .irr-card-cell__media::before {
	transform: scale(1.06);
}

.irr-card-cell__body {
	display: flex;
	flex-direction: column;
	flex: 1;
	padding: 2.5rem 2.5rem 3rem;
}

.irr-card-cell--immobilier  { --irr-card-img: url('../img/univers-immobilier.jpg?v=11'); }
.irr-card-cell--webharmonie { --irr-card-img: url('../img/univers-webharmonie.jpg?v=11'); }
.irr-card-cell--laboratoire { --irr-card-img: url('../img/univers-laboratoire.jpg?v=12'); }
.irr-card-cell--fondateur   { --irr-card-img: url('../img/univers-fondateur.jpg?v=10'); }

@media (prefers-reduced-motion: reduce) {
	.irr-card-cell__media::before,
	.irr-card-cell:hover .irr-card-cell__media::before {
		transform: none;
		transition: none;
	}
}

@media (max-width: 720px) {
	.irr-hero { min-height: 70vh; }
	.irr-card-cell__body { padding: 2rem 1.75rem 2.5rem; }
}


/* ══════════════════════════════════════════════════════════════════
   BANDEAU DE MARQUE — la maison se présente sur fond sombre
   Sur l'accueil il flotte sur la photographie du héros, puis se pose
   au premier scroll. Sur les pages intérieures il est sombre d'emblée.
   Fini la bande crème qui coupait la page en deux.
   ══════════════════════════════════════════════════════════════════ */

.wp-site-blocks > header.wp-block-template-part {
	background: transparent !important;
	-webkit-backdrop-filter: none;
	backdrop-filter: none;
	box-shadow: none;
}

.irr-site-header {
	background-color: var(--irr-green-darker) !important;
	border-block-end: 1px solid rgba(201, 169, 104, 0.20);
	transition: background-color 0.35s ease, border-color 0.35s ease, padding 0.2s ease;

	/* Habillage du sélecteur de langue (variables exposées par inc/i18n.php) */
	--sat-ls-border: rgba(245, 241, 235, 0.28);
	--sat-ls-text:   rgba(245, 241, 235, 0.90);
	--sat-ls-accent: var(--irr-gold);
}

/* Accueil : rien sous le bandeau tant qu'on est en haut de page. */
body.home .irr-site-header {
	background: transparent !important;
	border-block-end-color: transparent;
}

body.home .irr-site-header--scrolled {
	background: rgba(10, 26, 20, 0.94) !important;
	-webkit-backdrop-filter: saturate(180%) blur(12px);
	backdrop-filter: saturate(180%) blur(12px);
	border-block-end-color: rgba(201, 169, 104, 0.28);
}

/* ── Bloc de marque : logo, filet or, logotype ──────────────────── */
.irr-site-header .irr-brand-block { gap: 1.15rem; }

.irr-site-header .irr-header-logo {
	height: 46px;
	filter: drop-shadow(0 1px 6px rgba(0, 0, 0, 0.45));
}

/* Le filet vertical or sépare la marque figurative de la marque écrite.
   C'est le geste de signature qui manquait au bandeau. */
.irr-site-header .irr-brand-block > .wp-block-group {
	padding-left: 1.15rem;
	border-left: 1px solid rgba(201, 169, 104, 0.38);
}

.irr-site-header .wp-block-site-title a {
	color: var(--irr-cream);
	transition: color var(--irr-transition);
}
.irr-site-header .wp-block-site-title a:hover { color: var(--irr-gold); }

.irr-site-header .wp-block-site-tagline {
	color: rgba(201, 169, 104, 0.88);
	font-style: normal;
	font-size: 0.625rem;
	letter-spacing: 0.26em;
	margin-block-start: 0.45rem;
}

/* ── Navigation sur fond sombre ─────────────────────────────────── */
.irr-site-header .wp-block-navigation .wp-block-navigation-item__content {
	color: rgba(245, 241, 235, 0.86);
}
.irr-site-header .wp-block-navigation .wp-block-navigation-item__content:hover {
	color: var(--irr-gold);
}

/* ── Sous-menu : vert profond plutôt que blanc ──────────────────── */
.irr-site-header .wp-block-navigation .wp-block-navigation__submenu-container,
.wp-site-blocks > header.wp-block-template-part.scrolled .irr-site-header .wp-block-navigation .wp-block-navigation__submenu-container {
	background: var(--irr-green-darker);
	border-top: 2px solid var(--irr-gold);
	box-shadow: 0 14px 36px rgba(0, 0, 0, 0.42);
}

.irr-site-header .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	color: rgba(245, 241, 235, 0.88);
}
.irr-site-header .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover {
	background-color: rgba(201, 169, 104, 0.10);
	color: var(--irr-gold);
}

/* Le héros n'a plus besoin de remonter sous un bandeau opaque :
   la photographie passe désormais derrière le bandeau transparent. */
.irr-site-header--scrolled {
	box-shadow: 0 1px 0 rgba(201, 169, 104, 0.22), 0 4px 28px rgba(0, 0, 0, 0.28);
}

@media (max-width: 720px) {
	.irr-site-header .irr-header-logo { height: 38px; }
	.irr-site-header .irr-brand-block { gap: 0.85rem; }
	.irr-site-header .irr-brand-block > .wp-block-group { padding-left: 0.85rem; }
}

/* La regle « :where(.wp-site-blocks) > * { margin-block-start: 0 !important } »
   annulait le remontage du heros sous le bandeau fixe : on le retablit ici,
   sinon la bande creme du body reste visible derriere le bandeau. */
body.home .irr-hero { margin-block-start: -96px !important; }
@media (max-width: 720px) {
	body.home .irr-hero { margin-block-start: -84px !important; }
}


/* ══════════════════════════════════════════════════════════════════
   BANDEAU À DEUX ÉTAGES — barre de service + bandeau de marque
   Reference : lvmh.com. Ce qu'on leur emprunte : la separation entre
   une ligne de service minuscule et un bandeau ou le logotype domine,
   et un filigrane de losanges en fond. Ce qu'on fait autrement : le
   bandeau flotte sur la photographie du heros au lieu de reposer sur
   un aplat, et la marque reste lisible au lieu d'etre un pur signe.
   ══════════════════════════════════════════════════════════════════ */

:root { --irr-header-h: 124px; }

/* ── Étage 1 : barre de service ─────────────────────────────────── */
.irr-service-bar {
	background-color: var(--irr-green-darker);
	/* Filigrane de losanges : transposition du motif matelasse, avec
	   le ◇ qui est deja la signature graphique de la maison. */
	background-image:
		repeating-linear-gradient( 45deg, rgba(201, 169, 104, 0.07) 0 1px, transparent 1px 20px),
		repeating-linear-gradient(-45deg, rgba(201, 169, 104, 0.07) 0 1px, transparent 1px 20px);
	border-block-end: 1px solid rgba(201, 169, 104, 0.14);
}

.irr-service-bar__inner {
	max-width: 1240px;
	margin: 0 auto;
	padding: 0.45rem 1.5rem;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1.5rem;
}

.irr-service-bar__stamp {
	font-family: "Inter", sans-serif;
	font-size: 0.625rem;
	font-weight: 500;
	letter-spacing: 0.26em;
	text-transform: uppercase;
	color: rgba(201, 169, 104, 0.80);
	white-space: nowrap;
}
.irr-service-bar__stamp i {
	font-style: normal;
	margin: 0 0.55rem;
	opacity: 0.65;
}

.irr-service-bar__tools {
	--sat-ls-border: transparent;
	--sat-ls-text:   rgba(245, 241, 235, 0.82);
	--sat-ls-accent: var(--irr-gold);
	display: flex;
	align-items: center;
}
.irr-service-bar__tools .sat-langswitch__current { padding: 0.1rem 0.35rem; font-size: 0.6875rem; }

/* ── Étage 2 : le logotype prend toute la place qui lui revient ─── */
.irr-site-header .wp-block-site-title {
	font-size: clamp(1.5rem, 2.4vw, 2.05rem);
	letter-spacing: 0.16em;
}

/* La signature est deja portee par la barre de service au-dessus :
   sous le logotype elle ne faisait que tasser le bloc de marque. */
.irr-site-header .wp-block-site-tagline { display: none; }

.irr-site-header .irr-header-logo { height: 54px; }

/* ── Hauteur du bandeau : une seule source de verite ────────────── */
body { padding-top: var(--irr-header-h); }

body.home .irr-hero {
	margin-block-start: calc(-1 * var(--irr-header-h)) !important;
	padding-top: calc(3.5rem + var(--irr-header-h)) !important;
}
.irr-page-banner {
	margin-top: calc(-1 * var(--irr-header-h)) !important;
	padding-top: calc(7rem + var(--irr-header-h)) !important;
}
.irr-articles-hero {
	margin-top: calc(-1 * var(--irr-header-h)) !important;
	padding-top: calc(7rem + var(--irr-header-h)) !important;
}

@media (max-width: 720px) {
	:root { --irr-header-h: 106px; }
	.irr-service-bar__inner { padding: 0.4rem 1rem; }
	.irr-service-bar__stamp { font-size: 0.5625rem; letter-spacing: 0.18em; }
	.irr-site-header .irr-header-logo { height: 40px; }
	.irr-site-header .wp-block-site-title { font-size: 1.35rem; }
}

@media (max-width: 460px) {
	.irr-service-bar__stamp i + * , .irr-service-bar__stamp { letter-spacing: 0.14em; }
}


/* ══════════════════════════════════════════════════════════════════
   BASCULE CLAIRE — blanc, encre, or
   Le vert disparait de la palette : les variables --irr-green-* ne
   portent plus du vert mais de l'encre. Ce bloc inverse les six
   ensembles qui etaient construits en clair-sur-sombre.
   Or : #8A6B2E pour tout ce qui porte du texte (4,98:1 sur blanc),
   --irr-gold-pale #C0A05F pour les filets et les ornements.
   ══════════════════════════════════════════════════════════════════ */

/* ── 1. Bandeau de service : bande tres pale, filigrane a l'encre ── */
.irr-service-bar {
	background-color: #F1F3F5;
	background-image:
		repeating-linear-gradient( 45deg, rgba(27, 30, 32, 0.06) 0 1px, transparent 1px 20px),
		repeating-linear-gradient(-45deg, rgba(27, 30, 32, 0.06) 0 1px, transparent 1px 20px);
	border-block-end: 1px solid var(--irr-border);
}
.irr-service-bar__stamp { color: var(--irr-gold); }
.irr-service-bar__tools {
	--sat-ls-border: transparent;
	--sat-ls-text:   var(--irr-text);
	--sat-ls-accent: var(--irr-gold);
}

/* ── 2. Bandeau de marque : blanc ────────────────────────────────── */
.irr-site-header {
	background-color: var(--irr-white) !important;
	border-block-end: 1px solid var(--irr-border);
	--sat-ls-border: transparent;
	--sat-ls-text:   var(--irr-text);
	--sat-ls-accent: var(--irr-gold);
}
body.home .irr-site-header {
	background: transparent !important;
	border-block-end-color: transparent;
}
body.home .irr-site-header--scrolled {
	background: rgba(250, 251, 252, 0.94) !important;
	-webkit-backdrop-filter: saturate(160%) blur(12px);
	backdrop-filter: saturate(160%) blur(12px);
	border-block-end-color: var(--irr-border);
}
.irr-site-header--scrolled {
	box-shadow: 0 1px 0 rgba(138, 107, 46, 0.16), 0 4px 24px rgba(27, 30, 32, 0.07);
}

.irr-site-header .wp-block-site-title a { color: var(--irr-text); }
.irr-site-header .wp-block-site-title a:hover { color: var(--irr-gold); }
.irr-site-header .irr-header-logo { filter: none; }
.irr-site-header .irr-brand-block > .wp-block-group {
	border-left-color: rgba(138, 107, 46, 0.35);
}
.irr-site-header .wp-block-navigation .wp-block-navigation-item__content { color: var(--irr-text); }
.irr-site-header .wp-block-navigation .wp-block-navigation-item__content:hover { color: var(--irr-gold); }

.irr-site-header .wp-block-navigation .wp-block-navigation__submenu-container,
.wp-site-blocks > header.wp-block-template-part.scrolled .irr-site-header .wp-block-navigation .wp-block-navigation__submenu-container {
	background: var(--irr-white);
	border-top: 2px solid var(--irr-gold);
	box-shadow: 0 14px 32px rgba(27, 30, 32, 0.12);
}
.irr-site-header .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content { color: var(--irr-text); }
.irr-site-header .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover {
	background-color: rgba(138, 107, 46, 0.07);
	color: var(--irr-gold);
}

/* ── 3. Héros : la photographie passe en voile blanc ─────────────── */
.irr-hero { background-color: var(--irr-white); }

/* Voile blanc local sous le bloc de titre : la photographie garde sa
   presence sur les bords, l'encre reste franche au centre. */
.irr-hero::after {
	background-image:
		repeating-linear-gradient( 45deg, rgba(27, 30, 32, 0.03) 0 1px, transparent 1px 22px),
		repeating-linear-gradient(-45deg, rgba(27, 30, 32, 0.03) 0 1px, transparent 1px 22px),
		radial-gradient(ellipse 66% 62% at 50% 50%,
			rgba(250, 251, 252, 0.30)  0%,
			rgba(250, 251, 252, 0.14) 52%,
			rgba(250, 251, 252, 0.00) 80%);
	background-size: 22px 22px, 22px 22px, cover;
	background-repeat: repeat, repeat, no-repeat;
}

/* Le logotype quitte l'or en relief pour l'encre pleine : sur blanc,
   un degrade dore et un letterpress ne tiennent pas. */
.irr-hero__title {
	color: var(--irr-text) !important;
	background: none !important;
	-webkit-background-clip: border-box !important;
	background-clip: border-box !important;
	-webkit-text-fill-color: var(--irr-text) !important;
	text-shadow: none !important;
}
.irr-hero__logo img { filter: none; }
.irr-hero__subtitle    { color: var(--irr-text) !important; }
.irr-hero__citation    { color: var(--irr-text-muted) !important; }
.irr-hero__sub-domains { color: var(--irr-gold) !important; }
.irr-hero__rule__diamond, .irr-hero__rule { color: var(--irr-gold) !important; }

/* ── 4. « Le Mouvement » : blanc casse plutot qu'aplat sombre ────── */
.irr-section--green {
	background: var(--irr-cream-dark);
	color: var(--irr-text);
	border-block: 1px solid var(--irr-border);
}
.irr-section--green::before {
	background-image: radial-gradient(circle at 1px 1px, rgba(31, 29, 26, 0.035) 1px, transparent 0);
}
.irr-section--green .irr-section__title { color: var(--irr-text); }
.irr-section--green .irr-section__lead  { color: var(--irr-text); }
.irr-section--green .irr-quote          { color: var(--irr-text); }
.irr-section--green .irr-btn--ghost {
	color: var(--irr-gold);
	border-color: var(--irr-gold);
}
.irr-section--green .irr-btn--ghost:hover {
	background: var(--irr-gold);
	color: var(--irr-white);
}

/* ── 5. Bandeaux des pages intérieures ───────────────────────────── */
.irr-page-banner,
.irr-articles-hero {
	background-color: var(--irr-cream-dark) !important;
	color: var(--irr-text) !important;
	border-block-end: 1px solid var(--irr-border);
}
/* Les h1 de bandeau n'ont pas de classe : ils sont cibles par
   « .irr-page-banner h1 » et portent le degrade or + letterpress
   concu pour un fond sombre. Sur fond clair il faut de l'encre pleine. */
.wp-site-blocks .irr-page-banner h1,
.wp-site-blocks .irr-articles-hero h1 {
	color: var(--irr-text) !important;
	background: none !important;
	-webkit-background-clip: border-box !important;
	background-clip: border-box !important;
	-webkit-text-fill-color: var(--irr-text) !important;
	text-shadow: none !important;
}
.wp-site-blocks .irr-page-banner p,
.wp-site-blocks .irr-articles-hero p { color: var(--irr-text-muted) !important; }
.irr-page-banner__eyebrow,
.irr-page-banner__rule { color: var(--irr-gold) !important; }

/* ── 6. Le pied de page reste le seul bloc sombre : il ancre la page,
       comme chez les maisons dont on s'inspire. Il vire simplement du
       vert a l'encre, par le remappage des variables. ─────────────── */
.irr-site-footer { background: var(--irr-green-darker); }
.irr-site-footer .wp-block-site-title a,
.irr-site-footer a:hover { color: var(--irr-gold-pale); }

/* ── Bandeau : le texte passe a l'or ────────────────────────────── */
/* Or #8A6B2E : 4,98:1 sur blanc, lisible y compris en petites capitales. */
.irr-site-header .wp-block-site-title a { color: var(--irr-gold); }
.irr-site-header .wp-block-site-title a:hover { color: var(--irr-text); }
.irr-site-header .wp-block-navigation .wp-block-navigation-item__content { color: var(--irr-gold); }
.irr-site-header .wp-block-navigation .wp-block-navigation-item__content:hover { color: var(--irr-text); }
.irr-site-header .wp-block-navigation .wp-block-navigation__submenu-icon { color: var(--irr-gold); }
.irr-site-header .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content { color: var(--irr-gold); }
.irr-site-header .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover { color: var(--irr-text); }
.irr-site-header { --sat-ls-text: var(--irr-gold); }
.irr-site-header .irr-brand-block > .wp-block-group { border-left-color: rgba(138, 107, 46, 0.45); }


/* ══════════════════════════════════════════════════════════════════
   HÉROS — l'or foncé et la lisibilité
   Tout le bloc de titre passe a --irr-gold-deep #7A5C24 : assez fonce
   pour tenir 4,6:1 sur la pierre pale de la photographie, ce que
   l'or courant #8A6B2E ne garantissait pas en petites capitales.
   ══════════════════════════════════════════════════════════════════ */

.irr-hero__title {
	color: var(--irr-gold-deep) !important;
	-webkit-text-fill-color: var(--irr-gold-deep) !important;
}

.irr-hero__subtitle {
	color: var(--irr-gold-deep) !important;
	font-weight: 400;
	font-size: clamp(1.125rem, 1.7vw, 1.375rem);
}

.irr-hero__citation {
	color: var(--irr-gold-deep) !important;
	font-weight: 400;
	font-size: 1rem;
	font-style: italic;
	opacity: 0.92;
}

/* La ligne des quatre metiers etait la moins lisible : elle tombait sur
   le dallage, qui est clair mais bavard. Corps et graisse augmentes,
   interlettrage resserre, et un voile clair sous le bas du heros. */
.irr-hero__sub-domains {
	color: var(--irr-gold-deep) !important;
	font-size: 0.8125rem;
	font-weight: 600;
	letter-spacing: 0.28em;
	border-block-start-color: rgba(122, 92, 36, 0.28);
	padding-block-start: 1.75rem;
	margin-block-start: 3rem;
}

.irr-hero__rule__diamond,
.irr-hero__rule { color: var(--irr-gold-deep) !important; }

/* Voile clair progressif sur le bas du heros : le dallage s'estompe,
   la ligne des metiers se detache sans assombrir la photographie. */
.irr-hero::after {
	background-image:
		repeating-linear-gradient( 45deg, rgba(27, 30, 32, 0.03) 0 1px, transparent 1px 22px),
		repeating-linear-gradient(-45deg, rgba(27, 30, 32, 0.03) 0 1px, transparent 1px 22px),
		linear-gradient(180deg,
			rgba(250, 251, 252, 0.00) 48%,
			rgba(250, 251, 252, 0.42) 76%,
			rgba(250, 251, 252, 0.72) 100%),
		radial-gradient(ellipse 56% 44% at 50% 46%,
			rgba(250, 251, 252, 0.64)  0%,
			rgba(250, 251, 252, 0.46) 44%,
			rgba(250, 251, 252, 0.00) 86%);
	background-size: 22px 22px, 22px 22px, cover, cover;
	background-repeat: repeat, repeat, no-repeat, no-repeat;
}

/* Bandeau : le logotype et la navigation prennent l'or fonce du heros,
   pour que la marque parle d'une seule voix d'un bout a l'autre. */
.irr-site-header .wp-block-site-title a { color: var(--irr-gold-deep); }
.irr-site-header .wp-block-site-title a:hover { color: var(--irr-text); }
.irr-site-header .wp-block-navigation .wp-block-navigation-item__content { color: var(--irr-gold-deep); }
.irr-site-header .wp-block-navigation .wp-block-navigation-item__content:hover { color: var(--irr-text); }
.irr-site-header .wp-block-navigation .wp-block-navigation__submenu-icon { color: var(--irr-gold-deep); }
.irr-site-header .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content { color: var(--irr-gold-deep); }
.irr-site-header { --sat-ls-text: var(--irr-gold-deep); }
.irr-service-bar__stamp { color: var(--irr-gold-deep); }
.irr-site-header .irr-brand-block > .wp-block-group { border-left-color: rgba(122, 92, 36, 0.40); }


/* ══════════════════════════════════════════════════════════════════
   LOGOTYPE DU HÉROS — or plat
   Le degrade metal a ete abandonne apres comparaison a l'ecran. Trois
   raisons : la photographie du hall porte deja toute la matiere, deux
   matieres superposees se disputent l'attention ; le bandeau et
   l'embleme sont en or uni, le degrade etait le seul element traite
   autrement dans toute l'identite ; et un degrade cale en pourcentages
   se durcit sur les petits ecrans, alors qu'un aplat est identique
   partout. Reste une ombre portee discrete, qui decolle les lettres
   du mur sans imiter le metal.
   ══════════════════════════════════════════════════════════════════ */
.irr-hero__title {
	color: var(--irr-gold-deep) !important;
	background: none !important;
	-webkit-background-clip: border-box !important;
	background-clip: border-box !important;
	-webkit-text-fill-color: var(--irr-gold-deep) !important;
	-webkit-text-stroke: 0 !important;
	letter-spacing: 0.16em;
	text-shadow:
		0 2px 3px  rgba(48, 35, 9, 0.28),
		0 5px 14px rgba(48, 35, 9, 0.14) !important;
}


/* ══════════════════════════════════════════════════════════════════
   LES UNIVERS — quatre cartes distinctes plutot qu'un tableau regle
   Deux photographies separees par un filet d'un pixel se lisent comme
   une seule bande : l'oeil ne sait plus ou finit l'une. On ouvre donc
   la grille. Ca rend aussi son sens au survol, qui souleve la carte de
   7 px : une carte ne peut decoller que si elle est deja detachee.
   ══════════════════════════════════════════════════════════════════ */
.irr-cards-grid {
	gap: 1.75rem;
	border-top: 0;
	border-left: 0;
}

.irr-card-cell {
	background: var(--irr-white);
	border: 1px solid var(--irr-border);
}

.irr-card-cell:hover {
	background-color: var(--irr-white);
}

@media (max-width: 720px) {
	.irr-cards-grid { gap: 1.25rem; }
}


/* ══════════════════════════════════════════════════════════════════
   BANDEAU RAMENÉ À UN SEUL ÉTAGE
   La barre de service empruntee a LVMH ne portait qu'un tampon et un
   selecteur de langue : elle ne justifiait pas un etage, et son texte
   de 10 px etait illisible sur la photographie du heros. Le tampon
   passe sous le logotype, ou il peut respirer ; la langue revient a
   droite de la navigation. Le filigrane de losanges est conserve, mais
   sur le bandeau lui-meme : il n'apparait donc que la ou le fond est
   opaque, pages interieures et bandeau au scroll.
   ══════════════════════════════════════════════════════════════════ */
.irr-service-bar { display: none; }

:root { --irr-header-h: 96px; }

.irr-site-header {
	background-color: var(--irr-white) !important;
	background-image: none;
}
body.home .irr-site-header {
	background-color: transparent !important;
	background-image: none;
}
body.home .irr-site-header--scrolled {
	background-color: rgba(250, 251, 252, 0.94) !important;
	background-image: none;
}

/* ── Le tampon sous le logotype ──────────────────────────────────── */
.irr-brand-stamp {
	display: block;
	font-family: "Inter", sans-serif;
	font-size: 0.6875rem;
	font-weight: 500;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--irr-gold-deep);
	margin-block-start: 0.5rem;
	white-space: nowrap;
}
.irr-brand-stamp i {
	font-style: normal;
	margin: 0 0.5rem;
	opacity: 0.7;
}

/* ── Le sélecteur de langue à droite de CONTACT ──────────────────── */
.irr-header-tools {
	display: flex;
	align-items: center;
	--sat-ls-border: rgba(122, 92, 36, 0.30);
	--sat-ls-text:   var(--irr-gold-deep);
	--sat-ls-accent: var(--irr-gold-deep);
}

@media (max-width: 720px) {
	:root { --irr-header-h: 84px; }
	.irr-brand-stamp { font-size: 0.5625rem; letter-spacing: 0.14em; }
}

/* Le tampon passe de 11 a 12 px avec un interlettrage resserre : c'est
   la taille, pas le contraste, qui le rendait illisible. */
.irr-brand-stamp {
	font-size: 0.75rem;
	letter-spacing: 0.18em;
	margin-block-start: 0.55rem;
}

/* Le halo blanc qui decollait le texte du bandeau de la photographie est
   retire : la bande claire en haut du heros, ajoutee depuis, fait le meme
   travail en mieux. Un halo clair autour de lettres sombres eclaircit leur
   teinte percue, ce qui faisait paraitre l'or du bandeau different de celui
   du heros alors que les deux valent exactement #7A5C24. */


/* ══════════════════════════════════════════════════════════════════
   HÉROS — voile haut, sous le bandeau
   Le voile n'existait qu'en bas : le bandeau reposait donc sur la zone
   brute de la photographie, la plus claire et la plus chargee. On ajoute
   une bande claire sur les 20 premiers pour cent : elle aplatit les
   meneaux et les reflets derriere le texte, et comme l'or est sombre,
   blanchir le fond augmente le contraste au lieu de le reduire.
   ══════════════════════════════════════════════════════════════════ */
.irr-hero::after {
	background-image:
		repeating-linear-gradient( 45deg, rgba(27, 30, 32, 0.03) 0 1px, transparent 1px 22px),
		repeating-linear-gradient(-45deg, rgba(27, 30, 32, 0.03) 0 1px, transparent 1px 22px),
		linear-gradient(180deg,
			rgba(250, 251, 252, 0.82)  0%,
			rgba(250, 251, 252, 0.74) 10%,
			rgba(250, 251, 252, 0.58) 18%,
			rgba(250, 251, 252, 0.40) 26%,
			rgba(250, 251, 252, 0.24) 34%,
			rgba(250, 251, 252, 0.11) 42%,
			rgba(250, 251, 252, 0.00) 52%),
		linear-gradient(180deg,
			rgba(250, 251, 252, 0.00) 48%,
			rgba(250, 251, 252, 0.42) 76%,
			rgba(250, 251, 252, 0.72) 100%),
		radial-gradient(ellipse 56% 44% at 50% 46%,
			rgba(250, 251, 252, 0.64)  0%,
			rgba(250, 251, 252, 0.46) 44%,
			rgba(250, 251, 252, 0.00) 86%);
	background-size: 22px 22px, 22px 22px, cover, cover, cover;
	background-repeat: repeat, repeat, no-repeat, no-repeat, no-repeat;
}

/* La navigation est en petites capitales tres interlettrees : sur une
   photographie, 500 de graisse ne tient pas. */
.irr-site-header .wp-block-navigation .wp-block-navigation-item__content {
	font-weight: 600;
}

/* Le heros n'a plus d'embleme au-dessus du logotype : on rend au bloc
   de titre l'espace que prenait le logo, sans qu'il flotte trop haut. */
.irr-hero__logo { display: none; }

/* L'embleme occupait 160 px plus 3 rem de marge : sans lui le bloc de
   titre remontait se coller sous la barre. On lui rend une partie de
   cet espace pour qu'il retrouve son centre optique dans le volume. */
.irr-hero__title { margin-block-start: 12rem; }


/* ══════════════════════════════════════════════════════════════════
   BANDEAU — le logo recadre et cale sur les deux lignes
   Le fichier d'origine ne remplissait que 70 % de sa hauteur : demander
   54 px n'affichait qu'un dragon de 38 px, d'ou son air rabougri et son
   mauvais calage. Le fichier est recadre sur son dessin (logo-net.png),
   la hauteur CSS correspond donc enfin a ce que l'oeil voit.
   Le bloc de texte fait deux lignes : le logo est cale sur leur hauteur
   totale, avec un leger relevement pour compenser le poids du logotype,
   qui tire le centre optique vers le haut.
   ══════════════════════════════════════════════════════════════════ */
.irr-site-header .irr-brand-block {
	align-items: center;
	gap: 1rem;
}

.irr-site-header .irr-header-logo {
	height: 52px;
	transform: translateY(-2px);
}

.irr-site-header .irr-brand-block > .wp-block-group {
	padding-left: 1.1rem;
	border-left: 1px solid rgba(122, 92, 36, 0.40);
}

@media (max-width: 720px) {
	.irr-site-header .irr-header-logo { height: 40px; }
	.irr-site-header .irr-brand-block { gap: 0.75rem; }
	.irr-site-header .irr-brand-block > .wp-block-group { padding-left: 0.8rem; }
}


/* ══════════════════════════════════════════════════════════════════
   TITRES DE SECTION — Tenor Sans à la place de Montserrat
   Montserrat est l'une des polices les plus repandues du web, et elle
   portait le texte le plus visible apres le heros. Tenor Sans a des
   futs plus fins et des capitales plus etroites : il faut donc moins de
   graisse, plus d'interlettrage et un corps legerement superieur pour
   garder la meme presence.
   ══════════════════════════════════════════════════════════════════ */
.irr-section__title {
	font-family: "Tenor Sans", "Optima", "Helvetica Neue", sans-serif;
	font-weight: 400;
	font-size: clamp(2rem, 3.7vw, 2.875rem);
	letter-spacing: 0.06em;
	line-height: 1.2;
}

/* Le thème chargeait onze familles pour quatre utilisees. On garde les
   quatre reellement en usage : Cinzel et Cormorant pour les cartes et
   les citations, Tenor Sans pour les titres, Inter pour le corps.
   Bodoni Moda et Good Times viennent de theme.json et du fichier local. */


/* ══════════════════════════════════════════════════════════════════
   BOUTONS — un seul comportement pour les trois
   « Lire la Vision » et « Découvrir sageocracy.org » sont des .irr-btn,
   « Tous les articles » est un bouton natif WordPress : trois composants,
   donc trois survols. On les aligne sur un seul : fond encre, texte
   perle, et le meme remplissage de gauche a droite pour tous.
   ══════════════════════════════════════════════════════════════════ */

/* 1. Le bouton natif recoit la mecanique des .irr-btn */
.wp-block-button__link {
	position: relative;
	overflow: hidden;
	z-index: 0;
}
.wp-block-button__link::after {
	content: '';
	position: absolute;
	inset: 0;
	background: var(--irr-green-mid);
	transform: translateX(-102%);
	transition: transform 0.45s var(--irr-ease-out-expo);
	z-index: -1;
	pointer-events: none;
}
.wp-block-button__link:hover::after { transform: translateX(0); }

/* 2. Le meme voile de remplissage partout, y compris sur le fantome */
.irr-btn--ghost::after { background: var(--irr-green-mid); }

/* 3. Le meme couple de couleurs au survol, quel que soit le composant */
.irr-btn--outline:hover,
.irr-btn--ghost:hover,
.irr-section--green .irr-btn--ghost:hover,
.wp-block-button__link:hover,
.is-style-outline > .wp-block-button__link:hover,
:root :where(.wp-element-button:hover, .wp-block-button__link:hover) {
	background-color: var(--irr-green-deep) !important;
	color: var(--irr-cream) !important;
	border-color: var(--irr-green-deep) !important;
}

/* 4. La regle generique « a:hover { color: or } » passait devant et
      repeignait le texte en or sur le fond encre. */
.irr-btn:hover,
.wp-block-button__link:hover { color: var(--irr-cream) !important; }


/* ══════════════════════════════════════════════════════════════════
   HÉROS — le point d'entree
   Le premier lien cliquable etait sous la ligne de flottaison, ce qui
   se defend mal pour un site qui se presente comme un site d'orientation.
   Ce bouton descend a la grille des quatre univers.
   ══════════════════════════════════════════════════════════════════ */
.irr-hero__cta {
	display: inline-flex;
	align-items: center;
	gap: 0.6rem;
	margin-block-start: 2.25rem;
	font-family: "Inter", sans-serif;
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--irr-gold-deep);
	text-decoration: none;
	padding-block-end: 0.45rem;
	border-block-end: 1px solid rgba(122, 92, 36, 0.35);
	transition: color 0.25s ease, border-color 0.25s ease;
}
.irr-hero__cta::after {
	content: '↓';
	font-size: 0.95em;
	transition: transform 0.3s var(--irr-ease-out-expo);
}
.irr-hero__cta:hover {
	color: var(--irr-text);
	border-block-end-color: var(--irr-text);
}
.irr-hero__cta:hover::after { transform: translateY(3px); }

/* Le bandeau est fixe : sans cette marge, l'ancre placerait le titre
   de section sous le bandeau. */
#les-univers,
#the-universes { scroll-margin-top: calc(var(--irr-header-h) + 1.5rem); }

/* La ligne des quatre metiers et son bouton ferment le heros : ils
   descendent vers le bas du volume au lieu de flotter au milieu.
   Le bloc etant centre verticalement, agrandir cet ecart fait remonter
   le titre et descendre la cloture d'autant. */
.irr-hero__sub-domains {
	margin-block-start: 7rem;
	padding-block-start: 2.25rem;
}


/* ══════════════════════════════════════════════════════════════════
   BANDEAUX DES PAGES INTÉRIEURES — le filigrane plutot qu'une photo
   Rejouer l'image de l'accueil en ferait un papier peint et rendrait
   les pages indistinctes. Un detail de cette meme photo ne donne rien :
   elle est en haute lumiere et tonalement uniforme, aucun fragment n'a
   de structure. On prend donc la texture de la maison, le losange, deja
   presente sur le bandeau de navigation. Elle est a nous, elle tient a
   toutes les tailles, et elle ne pese rien.
   ══════════════════════════════════════════════════════════════════ */
.wp-site-blocks .irr-page-banner,
.wp-site-blocks .irr-articles-hero {
	background-image: url('../img/bandeau-interieur.jpg?v=11') !important;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

/* Le grain dore d'origine passait par-dessus : il faisait double texture. */
.irr-page-banner::after { background-image: none; }


/* ══════════════════════════════════════════════════════════════════
   BANDEAUX — une image par page
   WordPress pose deja une classe « page-<slug> » sur le corps : on s'y
   accroche. Chaque page qui a son image la prend, toutes les autres
   retombent sur le hall, qui reste la valeur par defaut. Pour en ajouter
   une, deux lignes suffisent : le fichier dans assets/img/ et un
   selecteur ici, en francais et en anglais.
   ══════════════════════════════════════════════════════════════════ */
body.page-vision    .irr-page-banner,
body.page-vision-en .irr-page-banner {
	background-image: url('../img/bandeau-vision.jpg?v=1') !important;
}

body.page-approche .irr-page-banner,
body.page-approach .irr-page-banner {
	background-image: url('../img/bandeau-approche.jpg?v=1') !important;
}

body.page-ethique .irr-page-banner,
body.page-ethics  .irr-page-banner {
	background-image: url('../img/bandeau-ethique.jpg?v=1') !important;
}

body.page-le-fondateur .irr-page-banner,
body.page-the-founder  .irr-page-banner {
	background-image: url('../img/bandeau-fondateur.jpg?v=1') !important;
}

body.page-les-univers        .irr-page-banner,
body.page-the-four-universes .irr-page-banner {
	background-image: url('../img/bandeau-univers.jpg?v=1') !important;
}

body.page-contact    .irr-page-banner,
body.page-contact-en .irr-page-banner {
	background-image: url('../img/bandeau-contact.jpg?v=1') !important;
}

/* La page Articles n'a pas de .irr-page-banner mais un .irr-articles-hero,
   et sa classe de corps est « page-articles-redux » et non « page-articles ». */
body.page-articles-redux .irr-articles-hero,
body.page-articles-en    .irr-articles-hero {
	background-image: url('../img/bandeau-articles.jpg?v=1') !important;
}


/* ══════════════════════════════════════════════════════════════════
   L'ENCRE POUR LE TEXTE, L'OR POUR L'ORNEMENT
   Mesures sur la photographie du heros, contraste avec le fond reel :
     or vrai #D4AF37 ... 1,0:1   invisible, meme luminance que la pierre
     or #7A5C24 ....... 2,9:1   sous le seuil de 3:1 des grands textes
     encre #1B1E20 .... 7,7:1
   L'or est une couleur claire : sur un fond pale, « ressembler a de l'or »
   et « etre lisible » s'excluent. Le texte passe donc a l'encre, ce qui
   aligne au passage le logotype sur tous les autres titres du site, deja
   en encre. L'or reste sur les losanges et les filets, qui sont
   decoratifs et ne sont soumis a aucun seuil.
   ══════════════════════════════════════════════════════════════════ */

/* ── Le logotype du heros : grave plutot que dore ────────────────── */
.irr-hero__title {
	color: var(--irr-text) !important;
	-webkit-text-fill-color: var(--irr-text) !important;
	/* Relief creuse : ombre fine au-dessus, lumiere en dessous. Les
	   lettres paraissent gravees dans la pierre, pas posees dessus. */
	text-shadow:
		0 -1px 1px rgba(12, 14, 16, 0.50),
		0  1px 0   rgba(255, 255, 255, 0.92),
		0  2px 3px rgba(255, 255, 255, 0.45) !important;
}

.irr-hero__subtitle,
.irr-hero__citation,
.irr-hero__sub-domains,
.irr-hero__cta { color: var(--irr-text) !important; }

.irr-hero__cta { border-block-end-color: rgba(27, 30, 32, 0.35); }
.irr-hero__cta:hover { color: var(--irr-gold); border-block-end-color: var(--irr-gold); }

/* Les losanges et les filets gardent l'or : ce sont des ornements. */
.irr-hero__rule,
.irr-hero__rule__diamond { color: var(--irr-gold) !important; }

/* ── Le bandeau de navigation ────────────────────────────────────── */
.irr-site-header .wp-block-site-title a,
.irr-site-header .wp-block-navigation .wp-block-navigation-item__content,
.irr-brand-stamp,
.irr-site-header { --sat-ls-text: var(--irr-text); }

.irr-site-header .wp-block-site-title a { color: var(--irr-text); }
.irr-site-header .wp-block-site-title a:hover { color: var(--irr-gold); }
.irr-site-header .wp-block-navigation .wp-block-navigation-item__content { color: var(--irr-text); }
.irr-site-header .wp-block-navigation .wp-block-navigation-item__content:hover { color: var(--irr-gold); }
.irr-brand-stamp { color: var(--irr-text); }
.irr-brand-stamp i { color: var(--irr-gold); opacity: 1; }
.irr-site-header .irr-brand-block > .wp-block-group { border-left-color: rgba(122, 92, 36, 0.45); }

/* ── Le pied de page : le seul endroit ou l'or peut etre de l'or ─── */
/* Sur fond encre, l'or #7A5C24 ne donnait que 3,0:1, insuffisant.
   Un or franc y monte a 8,8:1 et ressemble enfin a de l'or. On
   redefinit les variables dans le pied de page : tout ce qui s'y
   colore en or suit, sans avoir a reprendre chaque regle. */
.irr-site-footer {
	--irr-gold:      #C9A968;
	--irr-gold-deep: #C9A968;
	--irr-gold-pale: #C9A968;
}


/* ══════════════════════════════════════════════════════════════════
   LES SIX JALONS — la preuve que la page n'avait pas
   La presentation affirmait « depuis 1998 » sans rien etayer. Ces six
   dates viennent du site de l'auteur, donc de faits deja publics, et
   font remonter l'anciennete de la maison de 28 a plus de 45 ans.
   Elles vivent dans la section Presentation, pas dans une section a
   elles : la preuve doit se lire au meme endroit que l'affirmation.
   ══════════════════════════════════════════════════════════════════ */
.irr-trajectoire {
	margin-block-start: 4rem;
	padding-block-start: 2.5rem;
	border-block-start: 1px solid var(--irr-border);
}
.irr-trajectoire__titre { display: block; margin-block-end: 2rem; }

.irr-jalons {
	list-style: none;
	margin: 0 0 3rem;
	padding: 0;
}

.irr-jalon {
	display: grid;
	grid-template-columns: 11rem 1fr;
	gap: 1.5rem;
	padding-block: 1.5rem;
	border-block-start: 1px solid var(--irr-border);
}
.irr-jalon:first-child { border-block-start: 0; padding-block-start: 0; }

.irr-jalon__date {
	font-family: "Inter", sans-serif;
	font-size: 0.6875rem;
	font-weight: 600;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--irr-gold);
	line-height: 1.6;
	padding-block-start: 0.35rem;
}

.irr-jalon__titre {
	font-family: "Cormorant Garamond", "Garamond", Georgia, serif;
	font-size: 1.25rem;
	font-weight: 500;
	line-height: 1.3;
	color: var(--irr-text);
	margin: 0 0 0.4rem;
	letter-spacing: 0;
	text-transform: none;
}

.irr-jalon__texte {
	font-size: 0.9375rem;
	line-height: 1.7;
	color: var(--irr-text-muted);
	margin: 0;
}

@media (max-width: 620px) {
	.irr-jalon {
		grid-template-columns: 1fr;
		gap: 0.5rem;
	}
	.irr-jalon__date { padding-block-start: 0; }
}

/* ════════════════════════════════════════════════════════════════════
   MENU REPLIE (« trois lignes ») SOUS 1080px (28/09/2026)
   WordPress ne replie le menu que sous 600 px. Au-dessus, les liens ne
   tenaient plus sur une ligne : ils s'empilaient et le header fixe
   recouvrait le haut de la page.
   ════════════════════════════════════════════════════════════════════ */
@media (max-width: 1079.98px) {
	.wp-site-blocks > header .wp-block-navigation__responsive-container-open:not(.always-shown) {
		display: flex !important;
	}
	.wp-site-blocks > header .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
		display: none !important;
	}
}

/* Menu ouvert : un flou ou une transformation sur le header fixe enferme
   le panneau plein ecran dans la hauteur du header. On les coupe tant
   que le menu est ouvert. */
html.has-modal-open .wp-site-blocks > header,
html.has-modal-open .wp-site-blocks > header * {
	-webkit-backdrop-filter: none !important;
	backdrop-filter: none !important;
	filter: none !important;
	transform: none !important;
}

/* Panneau du menu ouvert : liens centres, lisibles au doigt. */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	align-items: center !important;
	text-align: center;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	padding-top: 4.5rem !important;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	gap: 1.6rem !important;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
	font-size: 0.95rem !important;
}

/* Sous-menus dans le panneau ouvert : a plat, centres, sans boite flottante. */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container {
	position: static !important;
	box-shadow: none !important;
	background: transparent !important;
	border: 0 !important;
	min-width: 0 !important;
	padding: 1rem 0 0 !important;
	gap: 1rem !important;
	align-items: center !important;
	opacity: 1 !important;
	visibility: visible !important;
}

/* (28/09/2026) Telephone : la ligne « Maison Aubremont, depuis 1998 » (277 px,
   sans retour a la ligne) poussait le menu et la langue hors de l'ecran. */
@media (max-width: 560px) {
	.irr-site-header .irr-brand-stamp { display: none; }
	/* le logotype chevauchait le bouton du menu */
	.irr-site-header .irr-header-logo { height: 44px; }
	.irr-site-header .wp-block-site-title,
	.irr-site-header .wp-block-site-title a { font-size: 17px !important; letter-spacing: 0.12em !important; }
}

/* Icone du menu : trois barres (le dessin par defaut de WordPress n'en a que
   deux, moins reconnaissable). 28/09/2026. */
.wp-block-navigation__responsive-container-open svg { display: none !important; }
.wp-block-navigation__responsive-container-open::before {
	content: "";
	display: block;
	width: 22px;
	height: 16px;
	background:
		linear-gradient(currentColor 0 0) top / 100% 2px no-repeat,
		linear-gradient(currentColor 0 0) center / 100% 2px no-repeat,
		linear-gradient(currentColor 0 0) bottom / 100% 2px no-repeat;
}

/* ── BANDEAU D'ACCUEIL MOINS HAUT (28/09/2026) ─────────────────────
   Le bandeau occupait tout l'écran (967 px sur un écran de 900) : on ne
   voyait rien d'autre et rien n'invitait à descendre. On resserre les deux
   grandes marges (au-dessus du titre, avant la ligne des quatre métiers)
   pour qu'environ un quart de l'écran laisse voir la section suivante. */
body.home .irr-hero .irr-hero__title { margin-top: clamp(2.5rem, 7vh, 4.5rem) !important; }
body.home .irr-hero .irr-hero__sub-domains { margin-top: clamp(2rem, 5vh, 3.25rem) !important; }
body.home .irr-hero { padding-bottom: clamp(3.5rem, 7vh, 5rem) !important; }
/* Écrans bas (portables 768-820 px de haut, petits téléphones) : marges encore resserrées. */
@media (max-height: 820px) {
	body.home .irr-hero .irr-hero__title { margin-top: 1.25rem !important; }
	body.home .irr-hero .irr-hero__sub-domains { margin-top: 1.5rem !important; padding-top: 1.5rem !important; }
	body.home .irr-hero { padding-bottom: 2.5rem !important; }
}

/* ── LIGNE DES QUATRE MÉTIERS EN OR (28/09/2026, essai validé en local) ──
   Or profond du site (#8A6B2E, celui du losange) : l'or clair pâlirait sur le
   bandeau clair. Taille portée de 13 à 15,5 px, semi-gras conservé : sur ce
   fond, un texte doré fin ne se lirait plus. */
body.home .irr-hero .irr-hero__sub-domains {
	color: #8A6B2E !important;
	font-size: 15.5px !important;
	letter-spacing: 0.26em !important;
}
@media (max-width: 600px) {
	body.home .irr-hero .irr-hero__sub-domains { font-size: 13.5px !important; letter-spacing: 0.2em !important; }
}

/* ── POLICE DU NOM : CASTORO TITLING (28/09/2026) ──────────────────
   Police retenue pour la marque (nom et grands titres) à la place de Good
   Times et de Tenor Sans. Hébergée sur le site (licence libre OFL) : aucun
   appel à Google. Elle n'existe qu'en graisse normale : pas de faux gras. */
@font-face {
	font-family: 'Castoro Titling';
	src: url('../fonts/CastoroTitling-Regular.ttf') format('truetype');
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}
.wp-block-site-title,
.wp-block-site-title a,
.irr-site-footer .wp-block-site-title,
.post-navigation-link__label {
	font-family: 'Castoro Titling', 'Cinzel', Georgia, serif !important;
	font-weight: 400 !important;
	letter-spacing: 0.16em !important;
	font-synthesis: none;
}
.irr-hero__title {
	font-family: 'Castoro Titling', 'Cinzel', Georgia, serif !important;
	font-weight: 400 !important;
	letter-spacing: 0.14em !important;
	font-synthesis: none;
}

/* ═══ AUBREMONT : EN-TÊTE ÉTROIT (triangle-olivier plus large que l'ancien nœud) ═══ */
@media (max-width:1180px){.irr-site-header .irr-brand-stamp{letter-spacing:.13em!important}}
@media (max-width:1100px){.irr-site-header .irr-header-logo{height:42px!important}}
@media (max-width:782px){.irr-site-header .irr-header-logo{height:36px!important}}
@media (max-width:600px){.irr-site-header .irr-header-logo{height:30px!important}
	.irr-site-header .irr-brand-block{gap:10px!important;min-width:0}
	.irr-site-header .irr-brand-block>.wp-block-group{padding-left:10px!important}
	.irr-site-header .irr-brand-block .wp-block-site-title,.irr-site-header .irr-brand-block .wp-block-site-title a{font-size:15px!important;letter-spacing:.1em!important}}
@media (max-width:400px){.irr-site-header .irr-header-logo{height:26px!important}
	.irr-site-header .irr-brand-block .wp-block-site-title,.irr-site-header .irr-brand-block .wp-block-site-title a{font-size:14px!important;letter-spacing:.08em!important}}
@media (max-width:350px){.irr-site-header .irr-header-logo{height:22px!important}
	.irr-site-header .irr-brand-block{gap:7px!important}
	.irr-site-header .irr-brand-block>.wp-block-group{padding-left:7px!important}
	.irr-site-header :has(> .irr-brand-block){column-gap:10px!important}
	.irr-site-header .irr-nav-wrap{column-gap:10px!important}
	.irr-site-header .irr-brand-block .wp-block-site-title,.irr-site-header .irr-brand-block .wp-block-site-title a{font-size:13px!important;letter-spacing:.06em!important}}