/**
 * Domus Magna — Custom Styles
 *
 * DA "Maison & Cadastre" — brochure d'agence éditoriale.
 * Typo : Fraunces (titres, variable opsz), Newsreader (body, variable opsz).
 * Polices auto-hébergées WOFF2 — zéro requête Google Fonts (RGPD).
 * Mobile-first, breakpoints 560 / 760 / 880 / 960px.
 *
 * @package Domus_Magna_Child
 */

/* ==========================================================================
   1. POLICES — @font-face auto-hébergées (RGPD)
   Fraunces : serif d'affichage variable (opsz 9-144, SOFT)
   Newsreader : serif de lecture variable (opsz 6-72)
   ========================================================================== */

/* — Fraunces normal — */
@font-face {
	font-family: 'Fraunces';
	src: url('../fonts/Fraunces-Light.woff2') format('woff2');
	font-weight: 300;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'Fraunces';
	src: url('../fonts/Fraunces-Regular.woff2') format('woff2');
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'Fraunces';
	src: url('../fonts/Fraunces-Medium.woff2') format('woff2');
	font-weight: 500;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'Fraunces';
	src: url('../fonts/Fraunces-SemiBold.woff2') format('woff2');
	font-weight: 600;
	font-style: normal;
	font-display: swap;
}

/* — Fraunces italic — */
@font-face {
	font-family: 'Fraunces';
	src: url('../fonts/Fraunces-LightItalic.woff2') format('woff2');
	font-weight: 300;
	font-style: italic;
	font-display: swap;
}
@font-face {
	font-family: 'Fraunces';
	src: url('../fonts/Fraunces-Italic.woff2') format('woff2');
	font-weight: 400;
	font-style: italic;
	font-display: swap;
}
@font-face {
	font-family: 'Fraunces';
	src: url('../fonts/Fraunces-MediumItalic.woff2') format('woff2');
	font-weight: 500;
	font-style: italic;
	font-display: swap;
}

/* — Newsreader normal — */
@font-face {
	font-family: 'Newsreader';
	src: url('../fonts/Newsreader-Light.woff2') format('woff2');
	font-weight: 300;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'Newsreader';
	src: url('../fonts/Newsreader-Regular.woff2') format('woff2');
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

/* — Newsreader italic — */
@font-face {
	font-family: 'Newsreader';
	src: url('../fonts/Newsreader-LightItalic.woff2') format('woff2');
	font-weight: 300;
	font-style: italic;
	font-display: swap;
}
@font-face {
	font-family: 'Newsreader';
	src: url('../fonts/Newsreader-Italic.woff2') format('woff2');
	font-weight: 400;
	font-style: italic;
	font-display: swap;
}

/* ==========================================================================
   2. VARIABLES CSS — Palette "Maison & Cadastre"
   Papier chaud / terre / encre noire. Pas de dark mode.
   Variables nommées identiquement à shared.css (mockups) pour cohérence.
   ========================================================================== */

:root {
	/* Palette papier/terre/encre */
	--paper:        #f4ede0;
	--paper-2:      #ece3d0;
	--paper-3:      #e0d4ba;
	--ink:          #1a1410;
	--ink-2:        #2e2519;
	--ink-soft:     #4a3f30;
	--terre:        #7a3b1f;
	--terre-2:      #9a4d28;
	--terre-soft:   #b8845a;
	--bleu:         #0a0820;
	--bleu-2:       #1a1545;
	--rule:         rgba(26,20,16,.18);
	--rule-soft:    rgba(26,20,16,.10);
	--rule-strong:  rgba(26,20,16,.42);

	/* Anciennes variables → remap sur la nouvelle palette */
	--dm-dark: var(--ink);
	--dm-darker: var(--ink-2);
	--dm-card-bg: var(--paper-2);
	--dm-bg-alt: var(--paper-3);
	--dm-footer-bg: var(--paper);
	--dm-gold: var(--terre);
	--dm-gold-light: var(--terre-soft);
	--dm-text: var(--ink);
	--dm-text-muted: var(--ink-soft);
	--dm-border-subtle: var(--rule);
	--dm-primary: var(--ink);
	--dm-secondary: var(--terre);
	--dm-accent: var(--terre);
	--dm-bg: var(--paper);
	--dm-white: var(--paper);
	--dm-border: var(--rule);

	/* Polices */
	--serif:  'Fraunces', 'Hoefler Text', Georgia, serif;
	--read:   'Newsreader', 'Hoefler Text', Georgia, serif;
	--dm-font-heading: var(--serif);
	--dm-font-body: var(--read);

	/* Spacing */
	--dm-section-gap: clamp(56px, 6vw, 96px);
	--dm-content-max: 1200px;
	--max: 1180px;
	--gutter: clamp(18px, 3vw, 40px);
	--space-hero-top: clamp(34px, 4vw, 60px);
	--space-hero-bottom: clamp(28px, 3vw, 46px);
	--space-section: clamp(48px, 5.4vw, 80px);
	--space-section-tight: clamp(40px, 4.8vw, 68px);
	--space-section-head: clamp(24px, 2.8vw, 40px);
	--space-craft-gap: clamp(28px, 4vw, 56px);
	--space-craft-stack: clamp(44px, 5vw, 76px);
	--dm-content-padding: var(--gutter);
	--header-height: 76px;

	/* Effets — pas de border-radius, pas de shadows lourdes.
	   La DA est plate, éditoriale, filets fins. */
	--dm-radius: 0;
	--dm-shadow: none;
	--dm-shadow-hover: none;
	--dm-transition: 0.35s cubic-bezier(0.7, 0, 0.2, 1);
	--dm-ease-out: cubic-bezier(0.2, 0.7, 0.2, 1);
	--dm-transition-fast: 0.25s ease;
	--dm-transition-normal: 0.35s ease;
	--dm-max-width: 1200px;
	--wp-admin-offset: 0px;
}

/* ==========================================================================
   3. BASE — Reset GeneratePress, body, sélection, texture papier
   ========================================================================== */

body {
	background: var(--paper);
	color: var(--ink);
	font-family: var(--read);
	font-size: 15.5px;
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
	overflow-x: hidden;
	font-feature-settings: "liga", "dlig", "kern";
}

html {
	scroll-behavior: smooth;
}

::selection { background: var(--terre); color: var(--paper); }

/* Texture papier — grain léger multiplicatif */
body::before {
	content: "";
	position: fixed; inset: 0;
	pointer-events: none;
	z-index: 200;
	opacity: .07;
	mix-blend-mode: multiply;
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
}
body::after {
	content: "";
	position: fixed; inset: 0;
	pointer-events: none;
	z-index: 199;
	background:
		radial-gradient(ellipse 60% 40% at 12% 8%, rgba(122,59,31,.05), transparent 60%),
		radial-gradient(ellipse 50% 30% at 88% 92%, rgba(26,20,16,.04), transparent 60%);
}

/* Override GeneratePress — fond papier partout */
.site,
.site-content,
.content-area,
.inside-article,
.entry-content {
	background-color: var(--paper) !important;
	color: var(--ink);
}

/* Contenu centré avec gouttières */
.inside-article {
	max-width: var(--max);
	margin: 0 auto;
	padding: clamp(32px, 4vw, 64px) var(--gutter);
}
.entry-content {
	max-width: 100%;
}

.entry-content p,
.entry-content li,
.entry-content td { color: var(--ink); }

.entry-content h1,
.entry-content h2,
.entry-content h3,
.entry-content h4 { color: var(--ink); }

a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }

a,
button,
input,
select,
textarea,
summary,
.menu-toggle {
	touch-action: manipulation;
}

:where(a, button, input, select, textarea, summary, .menu-toggle):focus-visible {
	outline: 2px solid rgba(122,59,31,.48);
	outline-offset: 4px;
}

#metiers,
#biens,
#quartiers,
#equipe,
#journal,
#vox,
#partenaires,
#estimer,
#form {
	scroll-margin-top: calc(104px + var(--wp-admin-offset));
}

#estimer,
#form {
	scroll-margin-top: calc(132px + var(--wp-admin-offset));
}

/* Conteneurs utilitaires (blocs HTML custom) */
.wrap { max-width: var(--max); margin: 0 auto; padding: 0 var(--gutter); }
.wrap-narrow { max-width: 780px; margin: 0 auto; padding: 0 var(--gutter); }
.wrap-reading { max-width: 680px; margin: 0 auto; padding: 0 var(--gutter); }
.row { display: flex; align-items: center; }

/* Inputs par défaut (fond papier) */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="url"],
textarea,
select {
	background-color: transparent;
	color: var(--ink);
	border: 0;
	border-bottom: 1px solid var(--rule);
	border-radius: 0;
	padding: 10px 0;
	font-family: var(--read);
	font-size: 16px;
	transition: border-color .35s;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="tel"]:focus,
input[type="url"]:focus,
textarea:focus,
select:focus {
	border-bottom-color: var(--terre);
	outline: none;
	box-shadow: none;
}

/* ==========================================================================
   4. TYPOGRAPHIE — Fraunces display, titres GP, liens
   ========================================================================== */

/* Utilitaire display — grands titres éditoriaux */
.display {
	font-family: var(--serif);
	font-weight: 300;
	line-height: .96;
	letter-spacing: -.022em;
	font-variation-settings: "opsz" 144, "SOFT" 50;
}
.display em {
	font-style: italic;
	font-weight: 400;
	font-variation-settings: "opsz" 144, "SOFT" 100;
	color: var(--terre);
}

h1, h2, h3 {
	font-family: var(--serif);
	color: var(--ink);
	letter-spacing: -.02em;
}
h4, h5, h6 {
	font-family: var(--read);
	color: var(--ink);
}

.entry-content h2 {
	font-family: var(--serif);
	font-weight: 300;
	font-size: clamp(30px, 3.4vw, 52px);
	line-height: 1.04;
	letter-spacing: -.02em;
	font-variation-settings: "opsz" 144, "SOFT" 50;
}
.entry-content h2 em {
	font-style: italic;
	font-weight: 400;
	color: var(--terre);
	font-variation-settings: "opsz" 144, "SOFT" 100;
}
.entry-content h3 {
	font-family: var(--serif);
	font-weight: 400;
	font-size: clamp(20px, 2vw, 26px);
}

p { margin-bottom: 1em; }

/* ==========================================================================
   5. TOPBAR — Barre noire supérieure (via GP Elements / hook)
   ========================================================================== */

.topbar {
	background: var(--ink);
	color: var(--paper);
	font-family: var(--serif);
	font-size: 11px;
	letter-spacing: .04em;
	font-variation-settings: "opsz" 9;
}
.topbar .row {
	display: flex;
	justify-content: space-between;
	align-items: center;
	height: 34px;
}
.topbar .left,
.topbar .right {
	display: flex;
	gap: 24px;
	align-items: center;
}
.topbar a {
	color: var(--paper);
	text-decoration: none;
	opacity: .92;
}
.topbar a:hover { color: var(--terre-soft); }
.topbar .right a:hover { color: var(--terre-soft); }
.topbar em { font-style: italic; opacity: .75; }

body.admin-bar {
	--wp-admin-offset: 32px;
}

@media screen and (max-width: 782px) {
	body.admin-bar {
		--wp-admin-offset: 46px;
	}
}

@media (max-width: 920px) {
	.topbar .right { display: none; }
}

@media (max-width: 768px) {
	.topbar { display: none; }
}

/* ==========================================================================
   6. NAV — Header sticky papier, wordmark, menu, CTA
   ========================================================================== */

/* Structure nav custom (blocs HTML) */
.nav {
	position: sticky; top: var(--wp-admin-offset); z-index: 100;
	background: var(--paper);
	border-bottom: 1px solid var(--rule);
}
.nav .row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: 84px;
}

/* Wordmark Domus Magna */
.nav .brand {
	display: flex;
	align-items: baseline;
	text-decoration: none;
}
.nav .brand .wordmark {
	display: flex;
	flex-direction: column;
	gap: 4px;
	line-height: 1;
}
.nav .brand .name {
	font-family: var(--serif);
	font-weight: 400;
	font-size: clamp(26px, 2.6vw, 34px);
	line-height: 1;
	letter-spacing: -.012em;
	color: var(--ink);
	font-variation-settings: "opsz" 48;
}
.nav .brand .name em {
	font-style: italic;
	font-weight: 500;
	color: var(--terre);
	font-variation-settings: "opsz" 48, "SOFT" 100;
}
.nav .brand .sub {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	font-family: var(--serif);
	font-style: italic;
	font-size: 11px;
	color: var(--ink-soft);
	letter-spacing: .06em;
	margin-top: 2px;
}
.nav .brand .sub .gh-mark {
	height: 22px;
	width: auto;
	display: inline-block;
	filter: brightness(0);
	opacity: .85;
	vertical-align: middle;
}

/* Liens menu */
.menu {
	display: flex;
	gap: 38px;
	align-items: center;
}
.menu a {
	font-family: var(--serif);
	font-size: 14px;
	font-weight: 400;
	letter-spacing: .01em;
	position: relative;
	padding: 8px 0;
	font-variation-settings: "opsz" 14;
}
.menu a::after {
	content: "";
	position: absolute;
	left: 50%; right: 50%;
	bottom: 2px;
	height: 1px;
	background: var(--terre);
	transition: left .4s cubic-bezier(.7,0,.2,1), right .4s cubic-bezier(.7,0,.2,1);
}
.menu a:hover::after,
.menu a.current::after { left: 0; right: 0; }
.menu a.current { color: var(--terre); }

/* CTA nav */
.nav .cta {
	font-family: var(--serif);
	background: transparent;
	color: var(--ink);
	border: 1px solid var(--ink);
	padding: 13px 24px;
	font-size: 13px;
	letter-spacing: .04em;
	display: inline-flex;
	align-items: center;
	gap: 12px;
	transition:
		background-color .35s,
		border-color .35s,
		color .35s,
		transform .35s;
}
.nav .cta em { font-style: italic; color: var(--terre); }
.nav .cta:hover { background: var(--ink); color: var(--paper); }
.nav .cta:hover em { color: var(--terre-soft); }

/* Override GeneratePress header → papier, sticky, une seule ligne */
.site-header {
	position: sticky !important;
	top: var(--wp-admin-offset) !important;
	z-index: 100 !important;
	background-color: var(--paper) !important;
	border-bottom: 1px solid var(--rule);
	transition: box-shadow .35s;
}
.site-header.dm-scrolled {
	box-shadow: 0 1px 12px rgba(26,20,16,.08);
}

/* Force header en une seule ligne : logo à gauche, nav à droite */
.site-header .inside-header.grid-container {
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	height: var(--header-height);
	background-color: var(--paper) !important;
}

/* Branding prend sa largeur naturelle */
.site-branding {
	flex: 0 0 auto;
}

/* Nav prend le reste, alignée à droite */
#site-navigation {
	flex: 1 1 auto !important;
	display: flex !important;
	justify-content: flex-end !important;
	align-items: center !important;
	background: transparent !important;
}
#site-navigation .inside-navigation {
	display: flex !important;
	align-items: center;
	padding: 0 !important;
	max-width: none !important;
}

/* Liste du menu en ligne horizontale */
#site-navigation .main-nav > ul,
.main-navigation .main-nav > ul {
	display: flex !important;
	gap: clamp(10px, 1.2vw, 18px);
	list-style: none !important;
	margin: 0 !important;
	padding: 0 !important;
	align-items: center;
	flex-wrap: nowrap;
}
.main-navigation .main-nav > ul > li {
	margin: 0 !important;
	padding: 0;
}

/* Logo GP */
.site-title,
.main-title {
	font-family: var(--serif) !important;
	font-weight: 400 !important;
	font-size: clamp(26px, 2.6vw, 34px) !important;
	color: var(--ink) !important;
	font-variation-settings: "opsz" 48;
	margin: 0 !important;
}
.main-title a {
	color: var(--ink) !important;
}

/* --------------------------------------------------------------------------
   NAV — Modèle « Sommaire »
   Le menu <ul> reste présent pour le SEO/accessibilité, mais il est masqué.
   À tous les breakpoints, le header ne montre que :
     - le wordmark (GP .site-title)
     - le CTA « Estimation gratuite »
     - le bouton « Sommaire » qui ouvre un panneau plein écran éditorial
   -------------------------------------------------------------------------- */

/* On masque la liste native GP + le toggle hamburger natif à tous les écrans */
.main-navigation .main-nav,
.main-navigation .main-nav > ul,
#mobile-menu-control-wrapper,
#site-navigation .menu-toggle {
	display: none !important;
}

/* Liste du menu : off-screen mais lisible pour SR / crawlers */
.main-navigation ul.menu,
.main-navigation ul.nav-menu,
.main-navigation .main-nav > ul {
	position: absolute;
	left: -9999px;
	top: auto;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

/* Conteneur actions à droite du wordmark : CTA + bouton Sommaire */
.dm-nav-actions {
	display: inline-flex;
	align-items: center;
	gap: clamp(12px, 1.4vw, 22px);
	margin-left: auto;
	font-family: var(--serif);
}

/* -------- CTA « Estimation gratuite » — minuscule pile éditoriale -------- */
.dm-nav-cta {
	display: inline-flex;
	align-items: baseline;
	gap: 6px;
	padding: 10px 14px 9px;
	font-size: 12px;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--ink);
	background: transparent;
	border: 1px solid var(--rule-strong);
	text-decoration: none;
	position: relative;
	transition:
		background-color .35s var(--dm-ease-out),
		color .35s var(--dm-ease-out),
		border-color .35s var(--dm-ease-out),
		transform .35s var(--dm-ease-out);
}
.dm-nav-cta__label {
	font-variation-settings: "opsz" 14;
}
.dm-nav-cta__modifier {
	font-style: italic;
	letter-spacing: 0;
	text-transform: none;
	font-size: 12.5px;
	color: var(--terre);
	font-variation-settings: "opsz" 14, "SOFT" 100;
}
.dm-nav-cta__arrow {
	display: inline-block;
	margin-left: 2px;
	font-style: normal;
	font-size: 11px;
	transform: translateX(0);
	transition: transform .35s var(--dm-ease-out);
}
.dm-nav-cta:hover,
.dm-nav-cta:focus-visible {
	background: var(--ink);
	color: var(--paper);
	border-color: var(--ink);
}
.dm-nav-cta:hover .dm-nav-cta__modifier,
.dm-nav-cta:focus-visible .dm-nav-cta__modifier {
	color: var(--terre-soft);
}
.dm-nav-cta:hover .dm-nav-cta__arrow,
.dm-nav-cta:focus-visible .dm-nav-cta__arrow {
	transform: translateX(4px);
}
.dm-nav-cta.is-current {
	background: var(--ink);
	color: var(--paper);
	border-color: var(--ink);
}
.dm-nav-cta.is-current .dm-nav-cta__modifier { color: var(--terre-soft); }

/* -------- Bouton Sommaire — glyphe éditorial typographique -------- */
.dm-nav-sommaire {
	appearance: none;
	-webkit-appearance: none;
	background: transparent;
	border: 0;
	padding: 10px 2px 9px;
	font-family: var(--serif);
	font-size: 12px;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--ink);
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	gap: 12px;
	font-variation-settings: "opsz" 14;
	position: relative;
	transition: color .3s var(--dm-ease-out);
}
.dm-nav-sommaire__label {
	position: relative;
	display: inline-block;
}
.dm-nav-sommaire__label::after {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: -4px;
	height: 1px;
	background: currentColor;
	transform: scaleX(0);
	transform-origin: right center;
	transition: transform .4s var(--dm-ease-out);
}
.dm-nav-sommaire:hover .dm-nav-sommaire__label::after,
.dm-nav-sommaire:focus-visible .dm-nav-sommaire__label::after,
.dm-nav-sommaire[aria-expanded="true"] .dm-nav-sommaire__label::after {
	transform: scaleX(1);
	transform-origin: left center;
}
.dm-nav-sommaire__icon {
	display: inline-flex;
	flex-direction: column;
	justify-content: space-between;
	width: 22px;
	height: 12px;
}
.dm-nav-sommaire__icon span {
	display: block;
	height: 1px;
	background: currentColor;
	transition:
		transform .35s var(--dm-ease-out),
		opacity .25s var(--dm-ease-out),
		width .35s var(--dm-ease-out);
	transform-origin: center;
}
.dm-nav-sommaire__icon span:nth-child(1) { width: 100%; }
.dm-nav-sommaire__icon span:nth-child(2) { width: 70%; margin-left: auto; }
.dm-nav-sommaire__icon span:nth-child(3) { width: 100%; }
.dm-nav-sommaire:hover .dm-nav-sommaire__icon span:nth-child(2),
.dm-nav-sommaire:focus-visible .dm-nav-sommaire__icon span:nth-child(2) {
	width: 100%;
}
.dm-nav-sommaire[aria-expanded="true"] .dm-nav-sommaire__icon span:nth-child(1) {
	transform: translateY(5.5px) rotate(45deg);
}
.dm-nav-sommaire[aria-expanded="true"] .dm-nav-sommaire__icon span:nth-child(2) {
	opacity: 0;
	transform: translateX(-6px);
}
.dm-nav-sommaire[aria-expanded="true"] .dm-nav-sommaire__icon span:nth-child(3) {
	transform: translateY(-5.5px) rotate(-45deg);
}
.dm-nav-sommaire:hover,
.dm-nav-sommaire:focus-visible { color: var(--terre); }

/* Mobile — header compact : on retire le CTA du header (déjà présent dans le
 * panneau Sommaire), on garde le wordmark à gauche et l'icône ☰ à droite
 * pour éviter tout wrap à 375-414 px. */
@media (max-width: 720px) {
	/* Spécificité (0,2,0) pour battre GP `.main-navigation a` (0,1,1). */
	.dm-nav-actions .dm-nav-cta { display: none; }
	.dm-nav-actions .dm-nav-sommaire__label { display: none; }
	.dm-nav-actions .dm-nav-sommaire { gap: 0; padding: 10px 0 9px; }
}

/* Sur écrans très larges on aère un peu */
@media (min-width: 1280px) {
	.dm-nav-actions { gap: 26px; }
}

/* GeneratePress inline injecte sous 1100px :
 *   .has-inline-mobile-toggle #site-navigation .inside-navigation > :not(.navigation-search):not(.main-nav) { display: none }
 * ce qui masquerait notre conteneur custom. On rétablit .dm-nav-actions
 * pour que le bouton Sommaire reste accessible en mobile. */
@media (max-width: 1100px) {
	.has-inline-mobile-toggle #site-navigation .inside-navigation > .dm-nav-actions {
		display: inline-flex !important;
	}
}

/* Body quand le panneau est ouvert — verrouille le scroll */
body.dm-sommaire-open {
	overflow: hidden;
}

/* --------------------------------------------------------------------------
   NAV — Panneau Sommaire (overlay plein écran)
   -------------------------------------------------------------------------- */

.dm-sommaire {
	position: fixed;
	inset: 0;
	z-index: 9999;
	display: flex;
	pointer-events: none;
	visibility: hidden;
}
.dm-sommaire[hidden] { display: flex; }
.dm-sommaire[aria-hidden="false"] {
	visibility: visible;
	pointer-events: auto;
}

.dm-sommaire__scrim {
	position: absolute;
	inset: 0;
	background: rgba(26, 20, 16, .62);
	opacity: 0;
	transition: opacity .5s var(--dm-ease-out);
}
.dm-sommaire[aria-hidden="false"] .dm-sommaire__scrim { opacity: 1; }

.dm-sommaire__sheet {
	position: relative;
	margin-left: auto;
	width: min(720px, 100%);
	height: 100%;
	max-height: 100dvh;
	background: var(--paper);
	color: var(--ink);
	padding: clamp(28px, 4vw, 56px) clamp(22px, 4vw, 68px) clamp(40px, 5vw, 72px);
	overflow-y: auto;
	overflow-x: hidden;
	transform: translateX(100%);
	transition: transform .55s cubic-bezier(.7, 0, .15, 1);
	box-shadow: -28px 0 60px rgba(26, 20, 16, .22);
	outline: none;
	display: flex;
	flex-direction: column;
	gap: clamp(28px, 3.2vw, 44px);
	-webkit-overflow-scrolling: touch;
}
.dm-sommaire[aria-hidden="false"] .dm-sommaire__sheet {
	transform: translateX(0);
}

/* Grain papier à l'intérieur du panneau — cohérence DA */
.dm-sommaire__sheet::before {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	opacity: .05;
	mix-blend-mode: multiply;
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
}
.dm-sommaire__sheet > * { position: relative; z-index: 1; }

/* Topline — eyebrow + bouton Fermer */
.dm-sommaire__topline {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding-bottom: 18px;
	border-bottom: 1px solid var(--rule);
}
.dm-sommaire__eyebrow {
	font-family: var(--serif);
	font-style: italic;
	font-size: 12px;
	letter-spacing: .12em;
	color: var(--ink-soft);
	font-variation-settings: "opsz" 14, "SOFT" 100;
}
.dm-sommaire__close {
	appearance: none;
	-webkit-appearance: none;
	background: transparent;
	border: 0;
	font-family: var(--serif);
	font-size: 12px;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--ink);
	cursor: pointer;
	display: inline-flex;
	align-items: baseline;
	gap: 10px;
	padding: 4px 2px;
	transition: color .25s var(--dm-ease-out);
}
.dm-sommaire__close:hover,
.dm-sommaire__close:focus-visible { color: var(--terre); }
.dm-sommaire__close > span:first-child {
	position: relative;
}
.dm-sommaire__close > span:first-child::after {
	content: "";
	position: absolute;
	left: 0; right: 0;
	bottom: -4px;
	height: 1px;
	background: currentColor;
	transform: scaleX(0);
	transform-origin: right center;
	transition: transform .4s var(--dm-ease-out);
}
.dm-sommaire__close:hover > span:first-child::after,
.dm-sommaire__close:focus-visible > span:first-child::after {
	transform: scaleX(1);
	transform-origin: left center;
}
.dm-sommaire__close-x {
	font-family: var(--serif);
	font-size: 22px;
	font-weight: 300;
	line-height: 1;
	color: var(--terre);
	transition: transform .4s var(--dm-ease-out);
}
.dm-sommaire__close:hover .dm-sommaire__close-x { transform: rotate(90deg); }

/* Heading */
.dm-sommaire__heading {
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.dm-sommaire__title {
	font-family: var(--serif);
	font-weight: 300;
	font-size: clamp(36px, 5.2vw, 64px);
	line-height: .98;
	letter-spacing: -.022em;
	color: var(--ink);
	margin: 0;
	font-variation-settings: "opsz" 144, "SOFT" 50;
}
.dm-sommaire__title em {
	font-style: italic;
	font-weight: 400;
	color: var(--terre);
	font-variation-settings: "opsz" 144, "SOFT" 100;
}
.dm-sommaire__kicker {
	font-family: var(--read);
	font-style: italic;
	font-size: 14px;
	color: var(--ink-soft);
	margin: 0;
}

/* Body : index + aside */
.dm-sommaire__body {
	display: grid;
	grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
	gap: clamp(28px, 3.5vw, 54px);
}
@media (max-width: 820px) {
	.dm-sommaire__body { grid-template-columns: 1fr; }
}

/* Index — liste numérotée éditoriale */
.dm-sommaire__nav { min-width: 0; }
.dm-sommaire__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	border-top: 1px solid var(--rule);
}
.dm-sommaire__item {
	border-bottom: 1px solid var(--rule);
	opacity: 0;
	transform: translateY(14px);
	transition:
		opacity .5s var(--dm-ease-out),
		transform .55s var(--dm-ease-out);
	transition-delay: calc(180ms + var(--dm-stagger, 0) * 55ms);
}
.dm-sommaire[aria-hidden="false"] .dm-sommaire__item {
	opacity: 1;
	transform: translateY(0);
}
.dm-sommaire__link {
	display: grid;
	grid-template-columns: 44px 1fr auto;
	align-items: baseline;
	gap: 14px;
	padding: 18px 4px 16px;
	text-decoration: none;
	color: var(--ink);
	font-family: var(--serif);
	position: relative;
	transition: color .3s var(--dm-ease-out), padding-left .4s var(--dm-ease-out);
}
.dm-sommaire__numeral {
	font-family: var(--serif);
	font-style: italic;
	font-size: 14px;
	letter-spacing: .04em;
	color: var(--ink-soft);
	font-variation-settings: "opsz" 14, "SOFT" 100;
	transition: color .3s var(--dm-ease-out);
}
.dm-sommaire__link-label {
	font-family: var(--serif);
	font-weight: 300;
	font-size: clamp(22px, 2.6vw, 30px);
	line-height: 1.08;
	letter-spacing: -.012em;
	font-variation-settings: "opsz" 96, "SOFT" 70;
	transition: transform .4s var(--dm-ease-out), color .3s var(--dm-ease-out);
	transform-origin: left center;
}
.dm-sommaire__rule {
	height: 1px;
	width: 48px;
	background: var(--terre);
	transform: scaleX(0);
	transform-origin: left center;
	transition: transform .5s var(--dm-ease-out);
	align-self: center;
	opacity: .6;
}
.dm-sommaire__link:hover,
.dm-sommaire__link:focus-visible { color: var(--terre); }
.dm-sommaire__link:hover .dm-sommaire__numeral,
.dm-sommaire__link:focus-visible .dm-sommaire__numeral { color: var(--terre); }
.dm-sommaire__link:hover .dm-sommaire__rule,
.dm-sommaire__link:focus-visible .dm-sommaire__rule {
	transform: scaleX(1);
}
.dm-sommaire__link:hover .dm-sommaire__link-label,
.dm-sommaire__link:focus-visible .dm-sommaire__link-label {
	transform: translateX(6px);
}
.dm-sommaire__item.is-current .dm-sommaire__link,
.dm-sommaire__item.is-current .dm-sommaire__numeral {
	color: var(--terre);
}
.dm-sommaire__item.is-current .dm-sommaire__link-label {
	font-style: italic;
	font-variation-settings: "opsz" 96, "SOFT" 100;
}
.dm-sommaire__item.is-current .dm-sommaire__rule { transform: scaleX(1); }

/* Aside — coordonnées éditoriales */
.dm-sommaire__aside {
	display: flex;
	flex-direction: column;
	gap: 24px;
	padding: clamp(20px, 2.4vw, 32px);
	background: var(--paper-2);
	border-left: 1px solid var(--rule);
	position: relative;
}
@media (max-width: 820px) {
	.dm-sommaire__aside { border-left: 0; border-top: 1px solid var(--rule); }
}
.dm-sommaire__aside-head {
	display: flex;
	flex-direction: column;
	gap: 6px;
}
.dm-sommaire__tagline {
	font-family: var(--serif);
	font-weight: 300;
	font-size: clamp(18px, 2.2vw, 22px);
	line-height: 1.2;
	margin: 0;
	font-variation-settings: "opsz" 48, "SOFT" 50;
}
.dm-sommaire__tagline em {
	font-style: italic;
	color: var(--terre);
	font-variation-settings: "opsz" 48, "SOFT" 100;
}
.dm-sommaire__contact {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: 1fr;
	gap: 18px;
	border-top: 1px solid var(--rule);
	padding-top: 18px;
}
.dm-sommaire__contact > div {
	display: grid;
	grid-template-columns: 84px 1fr;
	gap: 16px;
	align-items: baseline;
	font-family: var(--read);
	font-size: 14px;
	line-height: 1.45;
}
.dm-sommaire__contact dt {
	font-family: var(--serif);
	font-style: italic;
	font-size: 11.5px;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--ink-soft);
	font-variation-settings: "opsz" 14, "SOFT" 100;
}
.dm-sommaire__contact dd {
	margin: 0;
	color: var(--ink);
}
.dm-sommaire__contact dd a {
	color: var(--ink);
	text-decoration: underline;
	text-decoration-color: var(--rule);
	text-underline-offset: 3px;
	transition: color .25s var(--dm-ease-out), text-decoration-color .25s var(--dm-ease-out);
}
.dm-sommaire__contact dd a:hover {
	color: var(--terre);
	text-decoration-color: var(--terre);
}
.dm-sommaire__contact em { color: var(--ink-soft); font-style: italic; }

.dm-sommaire__cta {
	display: inline-flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 16px 18px;
	margin-top: auto;
	background: var(--ink);
	color: var(--paper);
	font-family: var(--serif);
	font-size: 13px;
	letter-spacing: .06em;
	text-transform: uppercase;
	text-decoration: none;
	transition: background-color .35s var(--dm-ease-out);
}
.dm-sommaire__cta-arrow {
	transition: transform .4s var(--dm-ease-out);
}
.dm-sommaire__cta:hover,
.dm-sommaire__cta:focus-visible {
	background: var(--terre);
}
.dm-sommaire__cta:hover .dm-sommaire__cta-arrow {
	transform: translateX(6px);
}

/* Reduced motion : on coupe les transitions complexes */
@media (prefers-reduced-motion: reduce) {
	.dm-sommaire__sheet,
	.dm-sommaire__scrim,
	.dm-sommaire__item,
	.dm-sommaire__link,
	.dm-sommaire__link-label,
	.dm-sommaire__rule,
	.dm-nav-cta,
	.dm-nav-cta__arrow,
	.dm-nav-sommaire__icon span,
	.dm-nav-sommaire__label::after {
		transition: none !important;
	}
}

/* ==========================================================================
   6B. GUTENBERG BRIDGE — blocs dm-* raccordés à la DA mockup
   ========================================================================== */

.home .inside-article {
	padding-top: 0;
}

.dm-hero,
.dm-section {
	margin-inline: calc(var(--gutter) * -1);
	padding-inline: var(--gutter);
}

.dm-hero {
	position: relative;
	padding-top: clamp(56px, 8vw, 118px);
	padding-bottom: clamp(44px, 6vw, 88px);
	min-height: min(78svh, 820px);
	display: flex;
	flex-direction: column;
	justify-content: center;
	border-bottom: 1px solid var(--rule);
	overflow: hidden;
}

.dm-hero::before {
	content: "";
	position: absolute;
	inset: 0;
	background:
		radial-gradient(ellipse 72% 62% at 18% 22%, rgba(184,132,90,.18), transparent 62%),
		radial-gradient(ellipse 54% 48% at 84% 76%, rgba(26,20,16,.08), transparent 68%),
		linear-gradient(135deg, rgba(224,212,186,.55) 0%, rgba(244,237,224,.35) 48%, rgba(236,227,208,.72) 100%);
	z-index: 0;
}

.dm-hero::after {
	content: "";
	position: absolute;
	inset: auto var(--gutter) 0;
	height: 1px;
	background: var(--rule);
	z-index: 1;
}

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

.dm-hero h1 {
	max-width: 10.5ch;
	margin: 0;
	font-family: var(--serif);
	font-weight: 300;
	font-size: clamp(44px, 7vw, 108px);
	line-height: .94;
	letter-spacing: -.03em;
	color: var(--ink);
	font-variation-settings: "opsz" 144, "SOFT" 60;
}

.dm-hero p {
	max-width: 34ch;
	margin: clamp(24px, 3vw, 34px) 0 0;
	font-size: clamp(17px, 1.7vw, 22px);
	line-height: 1.6;
	color: var(--ink-soft);
}

.dm-hero > p:last-child {
	margin-top: clamp(28px, 3.5vw, 40px);
}

.dm-section {
	padding-top: clamp(56px, 7vw, 110px);
	padding-bottom: clamp(56px, 7vw, 110px);
	border-top: 1px solid var(--rule);
	position: relative;
}

.dm-hero + .dm-section {
	border-top: 0;
	padding-top: clamp(44px, 5vw, 76px);
}

.dm-section-alt {
	background:
		linear-gradient(180deg, rgba(236,227,208,.65), rgba(236,227,208,.65)),
		linear-gradient(135deg, rgba(224,212,186,.22), rgba(244,237,224,0));
}

.dm-section-inner {
	max-width: var(--max);
	margin: 0 auto;
}

.dm-section h2 {
	max-width: 12ch;
	margin: 0 0 clamp(20px, 2.2vw, 28px);
	font-family: var(--serif);
	font-weight: 300;
	font-size: clamp(32px, 4.5vw, 62px);
	line-height: 1.02;
	letter-spacing: -.024em;
	color: var(--ink);
	font-variation-settings: "opsz" 144, "SOFT" 50;
}

.dm-section h2::after {
	content: "";
	display: block;
	width: clamp(36px, 4vw, 54px);
	height: 1px;
	margin-top: 18px;
	background: var(--terre);
}

.dm-section h2 + p {
	max-width: 60ch;
	font-size: 17px;
	line-height: 1.72;
	color: var(--ink-soft);
}

.dm-btn {
	font-family: var(--serif);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	padding: 15px 22px;
	border: 1px solid var(--ink);
	font-size: 12px;
	letter-spacing: .11em;
	text-transform: uppercase;
	transition:
		background-color .35s cubic-bezier(.7,0,.2,1),
		color .35s cubic-bezier(.7,0,.2,1),
		border-color .35s cubic-bezier(.7,0,.2,1),
		transform .35s cubic-bezier(.2,.7,.2,1);
}

.dm-btn::after {
	content: "\2192";
	font-size: 17px;
	font-style: italic;
	letter-spacing: 0;
	text-transform: none;
	transition: transform .35s cubic-bezier(.2,.7,.2,1);
}

.dm-btn:hover::after,
.dm-btn:focus-visible::after {
	transform: translateX(6px);
}

.dm-btn:hover,
.dm-btn:focus-visible {
	transform: translateY(-1px);
}

.dm-btn-primary {
	background: var(--ink);
	color: var(--paper);
	border-color: var(--ink);
}

.dm-btn-primary:hover,
.dm-btn-primary:focus-visible {
	background: var(--terre);
	border-color: var(--terre);
	color: var(--paper);
}

.dm-btn-secondary {
	background: transparent;
	color: var(--ink);
	border-color: var(--rule-strong);
}

.dm-btn-secondary:hover,
.dm-btn-secondary:focus-visible {
	background: var(--ink);
	border-color: var(--ink);
	color: var(--paper);
}

.dm-stats {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	margin-top: clamp(34px, 4vw, 56px);
	border-top: 1px solid var(--rule-strong);
	border-bottom: 1px solid var(--rule-strong);
}

.dm-stat {
	padding: clamp(22px, 2.6vw, 36px) clamp(18px, 2vw, 30px);
	border-right: 1px solid var(--rule);
}

.dm-stat:last-child {
	border-right: 0;
}

.dm-stat-icon {
	display: inline-block;
	margin-bottom: 14px;
	font-size: 15px;
	line-height: 1;
	filter: grayscale(1);
	opacity: .82;
}

.dm-stat-value {
	display: block;
	font-family: var(--serif);
	font-weight: 300;
	font-size: clamp(40px, 6vw, 82px);
	line-height: .9;
	letter-spacing: -.04em;
	color: var(--ink);
	font-variation-settings: "opsz" 144, "SOFT" 70;
}

.dm-stat-label {
	display: block;
	margin-top: 14px;
	max-width: 22ch;
	font-family: var(--serif);
	font-style: italic;
	font-size: 12px;
	line-height: 1.5;
	letter-spacing: .04em;
	color: var(--ink-soft);
}

.dm-services-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	margin-top: clamp(34px, 4vw, 56px);
	border-top: 1px solid var(--rule);
	border-left: 1px solid var(--rule);
}

.dm-card {
	min-height: clamp(220px, 24vw, 320px);
	padding: clamp(28px, 3vw, 40px);
	border-right: 1px solid var(--rule);
	border-bottom: 1px solid var(--rule);
	background: rgba(244,237,224,.5);
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	transition: background-color .35s cubic-bezier(.7,0,.2,1);
}

.dm-card:hover {
	background: rgba(236,227,208,.92);
}

.dm-card h3 {
	margin: 0 0 18px;
	max-width: 14ch;
	font-family: var(--serif);
	font-weight: 300;
	font-size: clamp(24px, 2.4vw, 38px);
	line-height: 1.06;
	letter-spacing: -.02em;
	color: var(--ink);
	font-variation-settings: "opsz" 72, "SOFT" 50;
}

.dm-card p {
	margin: auto 0 0;
	max-width: 34ch;
	font-size: 15px;
	line-height: 1.7;
	color: var(--ink-soft);
}

.dm-newsletter-footer {
	padding: clamp(52px, 6vw, 84px) var(--gutter);
	background: var(--ink);
	color: var(--paper);
	border-top: 0;
	margin-top: -1px;
}

.dm-newsletter-inner {
	max-width: 760px;
	margin: 0 auto;
	padding: clamp(28px, 4vw, 44px);
	border: 1px solid rgba(244,237,224,.18);
	background:
		radial-gradient(ellipse 80% 80% at 15% 20%, rgba(184,132,90,.15), transparent 65%),
		linear-gradient(180deg, rgba(244,237,224,.02), rgba(244,237,224,.05));
}

.dm-newsletter-footer h3 {
	max-width: 16ch;
	margin: 0 auto 16px;
	font-family: var(--serif);
	font-weight: 300;
	font-size: clamp(28px, 3.5vw, 48px);
	line-height: 1.05;
	letter-spacing: -.02em;
	color: var(--paper);
	text-align: center;
}

.dm-newsletter-footer p {
	max-width: 42ch;
	margin: 0 auto;
	font-size: 15px;
	line-height: 1.7;
	color: rgba(244,237,224,.72);
	text-align: center;
}

.dm-newsletter-fallback {
	display: grid;
	justify-items: center;
	gap: 20px;
}

.dm-newsletter-fallback .btn {
	min-width: 184px;
}

.site-footer,
.site-info {
	background: var(--ink) !important;
	color: rgba(244,237,224,.72) !important;
}

.site-footer {
	border-top: 1px solid rgba(244,237,224,.14);
}

.inside-site-info.grid-container {
	padding-top: 26px;
	padding-bottom: 30px;
}

.site-info a {
	color: var(--paper) !important;
}

.site-info a:hover {
	color: var(--terre-soft) !important;
}

@media (max-width: 920px) {
	.dm-hero {
		min-height: auto;
		padding-top: 44px;
		padding-bottom: 40px;
	}

	.dm-stats,
	.dm-services-grid {
		grid-template-columns: 1fr;
	}

	.dm-stat {
		border-right: 0;
		border-bottom: 1px solid var(--rule);
	}

	.dm-stat:last-child {
		border-bottom: 0;
	}

	.dm-card {
		min-height: auto;
	}
}

/* ==========================================================================
   7. PAGE HERO — .page-head, .hero-quote, .standfirst, home hero
   ========================================================================== */

.page-head {
	padding: var(--space-hero-top) 0 var(--space-hero-bottom);
	position: relative;
}
.page-head .top-line {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: clamp(18px, 2.4vw, 32px);
	font-family: var(--serif);
	font-style: italic;
	font-size: 12px;
	color: var(--ink-soft);
	letter-spacing: .04em;
}
.page-head .breadcrumb a { color: var(--terre); }
.page-head .breadcrumb a:hover { color: var(--ink); }
.page-head .breadcrumb span { margin: 0 10px; color: var(--rule-strong); }

.page-head h1 {
	font-family: var(--serif);
	font-weight: 300;
	line-height: .96;
	letter-spacing: -.022em;
	font-variation-settings: "opsz" 144, "SOFT" 50;
	font-size: clamp(34px, 5vw, 78px);
	max-width: 11.5ch;
	text-wrap: balance;
}
.page-head h1 em {
	font-style: italic;
	font-weight: 400;
	color: var(--terre);
	font-variation-settings: "opsz" 144, "SOFT" 100;
}

/* Pull quote éditorial indenté */
.hero-quote {
	margin: clamp(22px, 3vw, 40px) 0 0;
	padding: 0 0 0 clamp(32px, 9vw, 140px);
	max-width: 66ch;
	font-family: var(--serif);
	font-style: italic;
	font-weight: 300;
	font-size: clamp(17px, 1.55vw, 23px);
	line-height: 1.38;
	color: var(--ink);
	font-variation-settings: "opsz" 48, "SOFT" 80;
	position: relative;
}
.hero-quote::before {
	content: "";
	position: absolute;
	left: 0; top: .7em;
	width: clamp(24px, 5vw, 80px);
	height: 1px;
	background: var(--terre);
}
.hero-quote .qt::before { content: "\00ab\00a0"; color: var(--terre); font-size: 1.05em; }
.hero-quote .qt::after { content: "\00a0\00bb"; color: var(--terre); font-size: 1.05em; }
.hero-quote .sig {
	display: block;
	margin-top: 22px;
	font-family: var(--serif);
	font-style: normal;
	font-size: 12px;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--ink-soft);
}
.hero-quote .sig::before { content: "\2014\00a0"; color: var(--terre); }

@media (max-width: 880px) {
	.hero-quote { padding-left: 0; font-size: 20px; }
	.hero-quote::before { display: none; }
}

/* Standfirst sous le h1 */
.page-head .standfirst {
	margin-top: clamp(20px, 2.4vw, 34px);
	padding-top: clamp(16px, 1.8vw, 24px);
	border-top: 1px solid var(--rule);
	display: grid;
	grid-template-columns: 1fr 2fr;
	gap: clamp(16px, 2vw, 28px);
	align-items: start;
}
.page-head .standfirst .label {
	margin: 0;
	font-family: var(--serif);
	font-style: italic;
	font-size: 13px;
	color: var(--terre);
	letter-spacing: .06em;
}
.page-head .standfirst p {
	font-family: var(--read);
	font-size: 15px;
	line-height: 1.55;
	color: var(--ink);
	max-width: 58ch;
	font-weight: 300;
}
.page-head .standfirst p em { font-style: italic; color: var(--terre); }

@media (max-width: 860px) {
	.page-head .standfirst { grid-template-columns: 1fr; gap: 18px; }
	.page-head .top-line { flex-direction: column; align-items: flex-start; gap: 6px; }
}

.page-head--contact .wrap {
	display: grid;
	row-gap: clamp(22px, 2.8vw, 34px);
}

.page-head--contact .top-line {
	margin-bottom: 0;
}

.page-head__body {
	display: grid;
	grid-template-columns: minmax(0, 1.06fr) minmax(0, .94fr);
	gap: clamp(28px, 4vw, 68px);
	align-items: end;
}

.page-head--contact h1 {
	margin: 0;
	max-width: 9.4ch;
}

.page-head--contact .hero-quote {
	margin: 0;
	padding-left: clamp(24px, 4vw, 48px);
	max-width: 30ch;
}

.page-head--contact .hero-quote::before {
	width: clamp(18px, 3vw, 36px);
	top: .72em;
}

.page-head--contact .standfirst {
	margin-top: 0;
	grid-template-columns: minmax(0, .72fr) minmax(0, 1fr);
	max-width: 980px;
}

.page-head--contact .standfirst .label {
	max-width: 24ch;
	line-height: 1.45;
}

.page-head__intro {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: clamp(18px, 2.2vw, 28px);
}

.page-head__intro > p {
	margin: 0;
}

.page-head__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}

@media (max-width: 980px) {
	.page-head__body {
		grid-template-columns: 1fr;
		gap: 20px;
	}

	.page-head--contact .hero-quote {
		max-width: 34ch;
	}

	.page-head--contact .standfirst {
		grid-template-columns: minmax(0, .82fr) minmax(0, 1fr);
	}
}

@media (max-width: 860px) {
	.page-head--contact .standfirst {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 680px) {
	.page-head--contact .hero-quote {
		padding-left: 0;
	}

	.page-head--contact .hero-quote::before {
		display: none;
	}

	.page-head__actions {
		width: 100%;
		flex-direction: column;
	}

	.page-head__actions .btn {
		width: 100%;
		justify-content: space-between;
	}
}

/* Hero accueil */
.hero { padding: var(--space-hero-top) 0 0; position: relative; }
.hero .top-line {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: clamp(16px, 2vw, 28px);
	font-family: var(--serif);
	font-style: italic;
	font-size: 11px;
	color: var(--ink-soft);
	letter-spacing: .04em;
	flex-wrap: wrap;
	gap: 8px 16px;
}
.hero .top-line .l,
.hero .top-line .r { display: flex; gap: 18px; flex-wrap: wrap; }

.hero h1 {
	font-family: var(--serif);
	font-weight: 300;
	line-height: .96;
	letter-spacing: -.022em;
	font-variation-settings: "opsz" 144, "SOFT" 50;
	font-size: clamp(34px, 4.6vw, 72px);
	max-width: 11.5ch;
	text-wrap: balance;
}
.hero h1 em {
	font-style: italic;
	font-weight: 400;
	color: var(--terre);
	font-variation-settings: "opsz" 144, "SOFT" 100;
}
.hero h1 .line2,
.hero h1 .line3 { display: block; }
.hero h1 .line2 { padding-left: 1.8vw; }
.hero h1 .line3 {
	text-align: left;
	padding-left: 4.2vw;
	color: var(--terre);
	font-style: italic;
}

.hero .lower {
	display: grid;
	grid-template-columns: .9fr 1.15fr .95fr;
	gap: clamp(20px, 2.4vw, 32px);
	margin-top: clamp(24px, 3vw, 40px);
	padding-top: clamp(18px, 1.8vw, 24px);
	border-top: 1px solid var(--rule);
	align-items: start;
}
.hero .col-quote {
	font-family: var(--serif);
	font-style: italic;
	font-weight: 300;
	font-size: clamp(15px, .98vw, 17px);
	line-height: 1.45;
	color: var(--ink);
	font-variation-settings: "opsz" 48;
}
.hero .col-quote .qt { display: block; }
.hero .col-quote .qt::before { content: "\00ab\00a0"; color: var(--terre); font-size: 1.2em; }
.hero .col-quote .qt::after { content: "\00a0\00bb"; color: var(--terre); font-size: 1.2em; }
.hero .col-quote .sig {
	display: block; margin-top: 18px;
	font-style: normal; font-size: 13px;
	letter-spacing: .06em; color: var(--ink-soft);
}
.hero .col-text p {
	font-size: 14px; line-height: 1.58;
	color: var(--ink-soft); max-width: 34ch;
}
.hero .col-text p + p { margin-top: 14px; }
.hero .col-actions {
	display: flex;
	flex-direction: column;
	gap: 10px;
	align-items: flex-start;
}

/* Image hero placeholder */
.hero-img-wrap {
	margin-top: clamp(28px, 3.2vw, 44px);
	position: relative;
	aspect-ratio: 18/7.6;
	overflow: hidden;
	border-top: 1px solid var(--rule);
	border-bottom: 1px solid var(--rule);
}
.hero-img {
	position: absolute; inset: 0;
	background:
		linear-gradient(180deg, rgba(244,237,224,0) 40%, rgba(26,20,16,.35) 100%),
		linear-gradient(135deg, #b8845a 0%, #7a3b1f 35%, #2e2519 75%, #1a1410 100%);
	filter: contrast(1.05);
}
.hero-img::after {
	content: "";
	position: absolute;
	inset: 0;
	background:
		radial-gradient(ellipse 60% 40% at 30% 40%, rgba(244,237,224,.18), transparent 60%),
		radial-gradient(ellipse 80% 60% at 75% 70%, rgba(26,20,16,.4), transparent 60%);
	mix-blend-mode: overlay;
}
.hero-img-cap {
	position: absolute;
	left: clamp(20px, 3vw, 40px);
	bottom: clamp(20px, 3vw, 40px);
	color: var(--paper);
	font-family: var(--serif);
	font-style: italic;
	font-size: 14px;
	letter-spacing: .04em;
	max-width: 40ch;
	line-height: 1.5;
	text-shadow: 0 1px 8px rgba(0,0,0,.4);
}
.hero-img-num {
	position: absolute;
	right: clamp(20px, 3vw, 40px);
	top: clamp(20px, 3vw, 40px);
	color: var(--paper);
	font-family: var(--serif);
	font-style: italic;
	font-size: 12px;
	letter-spacing: .18em;
	text-transform: uppercase;
	border: 1px solid rgba(244,237,224,.4);
	padding: 7px 12px;
	backdrop-filter: blur(2px);
}

@media (max-width: 880px) {
	.hero h1 .line2 { padding-left: 0; }
	.hero h1 .line3 { text-align: left; }
	.hero .lower { grid-template-columns: 1fr; gap: 32px; }
	.hero .top-line { flex-direction: column; align-items: flex-start; gap: 8px; }
	.hero-img-wrap { aspect-ratio: 4/3; }
}

/* ==========================================================================
   8. SECTIONS — .section, .section-head, .metiers-intro
   ========================================================================== */

.section {
	padding: var(--space-section) 0;
	border-top: 1px solid var(--rule);
	position: relative;
}
.section-head {
	text-align: center;
	max-width: 720px;
	margin: 0 auto var(--space-section-head);
}
.section-head .lot {
	font-family: var(--serif);
	font-style: italic;
	font-size: 12px;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--terre);
	margin-bottom: 12px;
	display: inline-block;
}
.section-head .lot::before,
.section-head .lot::after {
	content: "\00b7";
	margin: 0 10px;
	color: var(--rule-strong);
}
.section-head h2 {
	font-family: var(--serif);
	font-weight: 300;
	font-size: clamp(26px, 2.5vw, 38px);
	line-height: 1.04;
	letter-spacing: -.02em;
	font-variation-settings: "opsz" 144, "SOFT" 50;
	text-wrap: balance;
}
.section-head h2 em {
	font-style: italic;
	font-weight: 400;
	color: var(--terre);
	font-variation-settings: "opsz" 144, "SOFT" 100;
}
.section-head .meta {
	margin-top: 14px;
	font-family: var(--read);
	font-size: 14.5px;
	line-height: 1.58;
	color: var(--ink-soft);
	max-width: 52ch;
	margin-left: auto;
	margin-right: auto;
}
.section-head p {
	margin-top: 14px;
	font-family: var(--read);
	font-size: 14.5px;
	line-height: 1.58;
	color: var(--ink-soft);
	max-width: 52ch;
	margin-left: auto;
	margin-right: auto;
}

/* Intro métiers — pull quote fusionné */
.metiers-intro {
	max-width: 820px;
	margin: 0 auto clamp(28px, 3.4vw, 48px);
	text-align: center;
}
.metiers-intro .lot {
	font-family: var(--serif);
	font-style: italic;
	font-size: 12px;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--terre);
	display: inline-block;
	margin-bottom: clamp(16px, 2vw, 24px);
}
.metiers-intro .lot::before,
.metiers-intro .lot::after {
	content: "\00b7";
	margin: 0 10px;
	color: var(--rule-strong);
}
.metiers-intro q {
	display: block;
	font-family: var(--serif);
	font-style: italic;
	font-weight: 300;
	font-size: clamp(48px, 7.6vw, 112px);
	line-height: .94;
	letter-spacing: -.032em;
	color: var(--terre);
	font-variation-settings: "opsz" 144, "SOFT" 100;
	quotes: none;
	max-width: 13ch;
	margin: 0 auto;
}
.metiers-intro q::before,
.metiers-intro q::after { content: none; }
.metiers-intro .meta {
	margin-top: clamp(18px, 2.2vw, 28px);
	font-family: var(--read);
	font-size: 14.5px;
	line-height: 1.58;
	color: var(--ink-soft);
	max-width: 52ch;
	margin-left: auto;
	margin-right: auto;
}

/* ==========================================================================
   9. FIGURES — Chiffres dramatiques, align gauche, filets verticaux
   ========================================================================== */

.figures {
	padding: var(--space-section-tight) 0;
	border-top: 1px solid var(--rule);
}
.figures .row {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	border-left: 1px solid var(--rule);
}
.figures .item {
	border-right: 1px solid var(--rule);
	padding: clamp(20px, 2vw, 32px) clamp(24px, 3vw, 40px);
	text-align: center;
	position: relative;
}
.figures .item:last-child { border-right: 0; }
.figures .v {
	font-family: var(--serif);
	font-weight: 300;
	font-size: clamp(36px, 4.2vw, 60px);
	line-height: 1;
	letter-spacing: -.02em;
	font-variation-settings: "opsz" 144, "SOFT" 70;
	color: var(--ink);
}
.figures .v em { font-style: italic; color: var(--terre); font-weight: 400; }
.figures .v sup {
	font-size: .4em;
	vertical-align: super;
	font-style: italic;
	color: var(--terre);
	font-weight: 400;
	margin-left: 4px;
}
.figures .v.placeholder {
	color: var(--ink-soft);
	opacity: .35;
	font-size: clamp(36px, 4.2vw, 60px);
}
.figures .k {
	margin-top: 12px;
	font-family: var(--serif);
	font-style: italic;
	font-size: 12px;
	color: var(--ink-soft);
	letter-spacing: .04em;
}

@media (max-width: 880px) {
	.figures .row { grid-template-columns: 1fr 1fr; }
	.figures .item:nth-child(2n) { border-right: 0; }
}

/* ==========================================================================
   10. CRAFT — Grille 5fr/7fr avec watermark romain
   ========================================================================== */

.craft {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--space-craft-gap);
	align-items: start;
	margin-bottom: var(--space-craft-stack);
}
.craft:last-child { margin-bottom: 0; }
.craft.flip { direction: rtl; }
.craft.flip > * { direction: ltr; }

.craft-text {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	min-height: 100%;
}

.craft-img {
	aspect-ratio: 4/5;
	position: relative;
	overflow: hidden;
	border: 1px solid var(--rule);
}
.craft-img.a { background: linear-gradient(160deg, #c9a47a 0%, #7a3b1f 60%, #2e2519 100%); }
.craft-img.b { background: linear-gradient(150deg, #b8845a 0%, #4a3f30 50%, #1a1410 100%); }
.craft-img.c { background: linear-gradient(170deg, #e0d4ba 0%, #9a4d28 60%, #1a1410 100%); }
.craft-img.d { background: linear-gradient(140deg, #7a3b1f 0%, #1a1545 60%, #0a0820 100%); }
.craft-img::after {
	content: "";
	position: absolute;
	inset: 0;
	background:
		radial-gradient(ellipse 50% 35% at 30% 30%, rgba(244,237,224,.2), transparent 60%),
		radial-gradient(ellipse 80% 60% at 70% 80%, rgba(26,20,16,.5), transparent 70%);
	mix-blend-mode: overlay;
}
.craft-img .frame-num {
	position: absolute;
	top: 18px;
	right: 18px;
	font-family: var(--serif);
	font-size: 12px;
	font-style: italic;
	color: var(--paper);
	letter-spacing: .18em;
	text-transform: uppercase;
	border-top: 1px solid rgba(244,237,224,.5);
	border-bottom: 1px solid rgba(244,237,224,.5);
	padding: 6px 0;
}
.craft-img .cap {
	position: absolute;
	left: 18px;
	bottom: 18px;
	font-family: var(--serif);
	font-style: italic;
	font-size: 12px;
	color: var(--paper);
	letter-spacing: .06em;
	text-shadow: 0 1px 6px rgba(0,0,0,.5);
}

.craft-text .pretitle {
	font-family: var(--serif);
	font-style: italic;
	font-size: 15px;
	color: var(--terre);
	letter-spacing: .06em;
}
.craft-text h3 {
	font-family: var(--serif);
	font-weight: 300;
	font-size: clamp(28px, 3.2vw, 46px);
	line-height: 1.02;
	letter-spacing: -.018em;
	margin: 14px 0 18px;
	font-variation-settings: "opsz" 144, "SOFT" 50;
}
.craft-text h3 em {
	font-style: italic;
	font-weight: 400;
	color: var(--terre);
	font-variation-settings: "opsz" 144, "SOFT" 100;
}
.craft-text p {
	font-family: var(--read);
	font-size: 15px;
	line-height: 1.6;
	color: var(--ink-soft);
	max-width: 50ch;
	margin: 0;
}
.craft-text__footer {
	margin-top: clamp(20px, 2.6vw, 32px);
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: clamp(14px, 1.8vw, 22px);
}
.craft-text .signature {
	margin-top: 0;
	display: inline-flex;
	align-items: center;
	gap: 14px;
	font-family: var(--serif);
	font-style: italic;
	font-size: 13px;
	color: var(--ink);
}
.craft-text .signature::before {
	content: "";
	width: 36px;
	height: 1px;
	background: var(--terre);
}
.craft-text .more {
	margin-top: 0;
	display: inline-flex;
	align-items: center;
	gap: 14px;
	font-family: var(--serif);
	font-size: 12px;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--ink);
	border-bottom: 1px solid var(--ink);
	padding-bottom: 6px;
	transition: color .3s, border-color .3s;
	width: fit-content;
}
.craft-text .more:hover { color: var(--terre); border-color: var(--terre); }
.craft-text .more::after {
	content: "\2192";
	font-style: italic;
	text-transform: none;
	font-size: 18px;
	transition: transform .3s;
}
.craft-text .more:hover::after { transform: translateX(6px); }

@media (max-width: 880px) {
	.craft,
	.craft.flip { grid-template-columns: 1fr; direction: ltr; }
	.craft-img { aspect-ratio: 3/2; }
}

/* ==========================================================================
   11. LISTINGS — Grille biens
   ========================================================================== */

.listings {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	border-top: 1px solid var(--rule);
	border-left: 1px solid var(--rule);
}
.listing {
	border-right: 1px solid var(--rule);
	border-bottom: 1px solid var(--rule);
	background: var(--paper);
	transition: background .35s;
	cursor: pointer;
}
.listing:hover { background: var(--paper-2); }

.listing .photo {
	aspect-ratio: 5/4;
	position: relative;
	overflow: hidden;
	border-bottom: 1px solid var(--rule);
}
.listing.a .photo { background: linear-gradient(155deg, #d4ad7e 0%, #7a3b1f 70%, #2e2519 100%); }
.listing.b .photo { background: linear-gradient(165deg, #b8845a 0%, #4a3f30 60%, #1a1410 100%); }
.listing.c .photo { background: linear-gradient(145deg, #9a4d28 0%, #1a1545 60%, #0a0820 100%); }
.listing .photo::after {
	content: "";
	position: absolute;
	inset: 0;
	background:
		radial-gradient(ellipse 50% 40% at 40% 35%, rgba(244,237,224,.18), transparent 60%),
		radial-gradient(ellipse 80% 60% at 70% 80%, rgba(26,20,16,.45), transparent 70%);
	mix-blend-mode: overlay;
}
.listing .photo .ref {
	position: absolute;
	top: 16px;
	left: 16px;
	font-family: var(--serif);
	font-style: italic;
	font-size: 11px;
	color: var(--paper);
	letter-spacing: .18em;
	text-transform: uppercase;
	border: 1px solid rgba(244,237,224,.5);
	padding: 6px 12px;
	backdrop-filter: blur(2px);
}
.listing .photo .price-tag {
	position: absolute;
	bottom: 16px;
	right: 16px;
	font-family: var(--serif);
	font-style: italic;
	font-size: 22px;
	color: var(--paper);
	text-shadow: 0 1px 8px rgba(0,0,0,.5);
	font-variation-settings: "opsz" 48, "SOFT" 100;
}
.listing .photo .price-tag.placeholder {
	color: var(--paper);
	opacity: .8;
	font-size: 20px;
}
.listing .body { padding: clamp(24px, 2.6vw, 36px); }
.listing .quartier {
	font-family: var(--serif);
	font-style: italic;
	font-size: 12px;
	color: var(--terre);
	letter-spacing: .08em;
	text-transform: uppercase;
}
.listing h3 {
	font-family: var(--serif);
	font-weight: 400;
	font-size: clamp(20px, 1.7vw, 26px);
	line-height: 1.15;
	letter-spacing: -.005em;
	margin: 10px 0 18px;
	font-variation-settings: "opsz" 48;
}
.listing .specs {
	display: flex;
	gap: 0;
	flex-wrap: wrap;
	border-top: 1px solid var(--rule);
	padding-top: 16px;
}
.listing .specs span {
	font-family: var(--serif);
	font-style: italic;
	font-size: 13px;
	color: var(--ink-soft);
	padding-right: 14px;
	margin-right: 14px;
	border-right: 1px solid var(--rule);
}
.listing .specs span:last-child { border-right: 0; margin-right: 0; padding-right: 0; }

@media (max-width: 880px) {
	.listings { grid-template-columns: 1fr; }
}

/* ==========================================================================
   12. QUARTIERS — Tableau cadastral
   ========================================================================== */

.cadastre-wrap { position: relative; }
.cadastre-wrap::before {
	content: "";
	position: absolute; inset: -40px -20px;
	background-image:
		linear-gradient(var(--rule-soft) 1px, transparent 1px),
		linear-gradient(90deg, var(--rule-soft) 1px, transparent 1px);
	background-size: 60px 60px;
	pointer-events: none;
	mask-image: radial-gradient(ellipse 70% 60% at 50% 50%, black 30%, transparent 80%);
	-webkit-mask-image: radial-gradient(ellipse 70% 60% at 50% 50%, black 30%, transparent 80%);
	z-index: 0;
}
.quartiers {
	position: relative; z-index: 1;
	border-top: 1px solid var(--rule-strong);
	border-bottom: 1px solid var(--rule-strong);
	background: var(--paper);
}
.q-row {
	display: grid;
	grid-template-columns: 60px 1.6fr 2fr 1fr 1fr;
	gap: clamp(16px, 2vw, 32px);
	align-items: center;
	padding: clamp(22px, 2.4vw, 32px) clamp(16px, 2vw, 28px);
	border-bottom: 1px solid var(--rule);
	transition: background .35s;
	cursor: pointer;
}
.q-row:last-child { border-bottom: 0; }
.q-row.head {
	background: var(--paper-2);
	cursor: default;
	font-family: var(--serif);
	font-style: italic;
	font-size: 12px;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--ink-soft);
	padding-top: 18px;
	padding-bottom: 18px;
}
.q-row:not(.head):hover { background: var(--paper-2); }
.q-row .lot {
	font-family: var(--serif);
	font-style: italic;
	font-size: 14px;
	color: var(--terre);
}
.q-row .name {
	font-family: var(--serif);
	font-weight: 400;
	font-size: clamp(18px, 1.5vw, 22px);
	letter-spacing: -.005em;
	font-variation-settings: "opsz" 48;
}
.q-row .desc {
	font-family: var(--read);
	font-style: italic;
	font-size: 14px;
	color: var(--ink-soft);
}
.q-row .price {
	font-family: var(--serif);
	font-style: italic;
	font-weight: 300;
	font-size: clamp(22px, 2.2vw, 34px);
	letter-spacing: -.01em;
	color: var(--ink);
	font-variation-settings: "opsz" 144, "SOFT" 100;
	text-align: right;
}
.q-row .price em { color: var(--terre); font-style: italic; }
.q-row .price.tbc { font-size: clamp(14px, 1.2vw, 18px); opacity: .4; }
.q-row .delta {
	font-family: var(--serif);
	font-style: italic;
	font-size: clamp(13px, 1.1vw, 16px);
	color: var(--terre);
	text-align: right;
	position: relative;
	padding-right: 12px;
}
.q-row .delta.tbc { opacity: .35; }

@media (max-width: 880px) {
	.q-row { grid-template-columns: 40px 1fr 1fr; gap: 14px; }
	.q-row .desc,
	.q-row.head .desc { display: none; }
	.q-row .delta,
	.q-row.head .delta { display: none; }
}

/* ==========================================================================
   13. JOURNAL — Feature + aside, version dark
   ========================================================================== */

.journal {
	display: grid;
	grid-template-columns: 1.4fr 1fr;
	gap: clamp(40px, 5vw, 80px);
}
.feature .img {
	aspect-ratio: 4/3;
	background:
		radial-gradient(circle at 22% 22%, rgba(184,132,90,.34), transparent 0 28%),
		radial-gradient(circle at 78% 78%, rgba(66,40,88,.18), transparent 0 24%),
		linear-gradient(135deg, #2b1d17 0%, #1d1512 52%, #21162d 100%);
	position: relative;
	overflow: hidden;
	border: 1px solid var(--rule);
	display: grid;
	place-items: center;
}
.feature .img::before {
	content: "";
	position: absolute;
	inset: 12%;
	border: 1px solid rgba(244,237,224,.1);
	pointer-events: none;
}
.feature .img .badge {
	position: absolute; top: 20px; left: 20px;
	font-family: var(--serif);
	font-style: italic;
	font-size: 12px;
	color: var(--ink-soft);
	letter-spacing: .14em;
	text-transform: uppercase;
	border: 1px solid var(--rule-strong);
	padding: 8px 14px;
}
.feature .img .placeholder-note {
	font-family: var(--serif);
	font-style: italic;
	font-size: 13px;
	color: rgba(244,237,224,.38);
	opacity: 1;
	letter-spacing: .1em;
	text-transform: uppercase;
}
.feature .meta-line {
	margin-top: 24px;
	display: flex;
	gap: 24px;
	flex-wrap: wrap;
	font-family: var(--serif);
	font-style: italic;
	font-size: 13px;
	color: var(--terre);
	letter-spacing: .04em;
}
.feature h3 {
	margin-top: 14px;
	font-family: var(--serif);
	font-weight: 300;
	font-size: clamp(26px, 2.8vw, 40px);
	line-height: 1.05;
	letter-spacing: -.015em;
	font-variation-settings: "opsz" 144, "SOFT" 50;
}
.feature h3 em {
	font-style: italic;
	font-weight: 400;
	color: var(--terre);
	font-variation-settings: "opsz" 144, "SOFT" 100;
}
.feature p {
	margin-top: 18px;
	font-family: var(--read);
	font-size: 16px;
	line-height: 1.65;
	color: var(--ink-soft);
	max-width: 54ch;
}
.feature .author {
	margin-top: 24px;
	font-family: var(--serif);
	font-style: italic;
	font-size: 13px;
	color: var(--ink);
	display: inline-flex;
	align-items: center;
	gap: 14px;
}
.feature .author::before {
	content: "";
	width: 32px;
	height: 1px;
	background: var(--ink);
}

.aside-list { display: flex; flex-direction: column; }
.aside-item {
	padding: 24px 0;
	border-bottom: 1px solid var(--rule);
	cursor: pointer;
	transition: padding-left .35s;
	display: block;
}
.aside-item:first-child { padding-top: 0; }
.aside-item:last-child { border-bottom: 0; }
.aside-item:hover { padding-left: 14px; }
.aside-item .num {
	font-family: var(--serif);
	font-style: italic;
	font-size: 12px;
	color: var(--terre);
	letter-spacing: .06em;
}
.aside-item h4 {
	margin-top: 8px;
	font-family: var(--serif);
	font-weight: 400;
	font-size: 19px;
	line-height: 1.2;
	letter-spacing: -.005em;
	font-variation-settings: "opsz" 48;
}
.aside-item .info {
	margin-top: 12px;
	font-family: var(--serif);
	font-style: italic;
	font-size: 12px;
	color: var(--ink-soft);
	letter-spacing: .04em;
}
.aside-item .info span + span::before { content: " \00b7 "; margin: 0 6px; }

@media (max-width: 880px) { .journal { grid-template-columns: 1fr; } }

/* Journal dark — inversion encre/papier */
.section.journal-dark {
	background: var(--ink);
	color: var(--paper);
	border-top: 1px solid var(--ink);
	position: relative;
	overflow: hidden;
}
.section.journal-dark::before {
	content: "";
	position: absolute; inset: 0;
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%25' height='100%25' filter='url(%23n)' opacity='0.6'/></svg>");
	opacity: .12;
	mix-blend-mode: overlay;
	pointer-events: none;
}
.section.journal-dark > .wrap { position: relative; z-index: 1; }
.section.journal-dark .section-head .lot { color: var(--terre-soft); }
.section.journal-dark .section-head .lot::before,
.section.journal-dark .section-head .lot::after { color: rgba(244,237,224,.25); }
.section.journal-dark .section-head h2 { color: var(--paper); }
.section.journal-dark .section-head h2 em { color: var(--terre-soft); }
.section.journal-dark .section-head .meta { color: rgba(244,237,224,.7); }
.section.journal-dark .feature .img {
	background: transparent;
	border: 1px solid rgba(244,237,224,.18);
	display: grid;
	place-items: center;
}
.section.journal-dark .feature .img .badge { color: var(--paper); border-color: rgba(244,237,224,.5); }
.section.journal-dark .feature .img .placeholder-note { color: rgba(244,237,224,.35); }
.section.journal-dark .feature .meta-line { color: var(--terre-soft); }
.section.journal-dark .feature h3 { color: var(--paper); }
.section.journal-dark .feature h3 em { color: var(--terre-soft); }
.section.journal-dark .feature p { color: rgba(244,237,224,.72); }
.section.journal-dark .feature .author { color: var(--paper); }
.section.journal-dark .feature .author::before { background: var(--paper); }
.section.journal-dark .aside-item { border-bottom-color: rgba(244,237,224,.18); }
.section.journal-dark .aside-item .num { color: var(--terre-soft); }
.section.journal-dark .aside-item h4 { color: var(--paper); }
.section.journal-dark .aside-item .info { color: rgba(244,237,224,.55); }
.section.journal-dark .tbc { color: rgba(244,237,224,.4); }

/* ==========================================================================
   14. VOX — Témoignages en grille 3 colonnes
   ========================================================================== */

.vox-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	border-top: 1px solid var(--rule);
	border-left: 1px solid var(--rule);
}
.vox-item {
	padding: clamp(32px, 3.4vw, 48px);
	border-right: 1px solid var(--rule);
	border-bottom: 1px solid var(--rule);
	background: var(--paper);
	transition: background .35s;
}
.vox-item:hover { background: var(--paper-2); }
.vox-item blockquote {
	font-family: var(--serif);
	font-style: italic;
	font-weight: 300;
	font-size: clamp(18px, 1.5vw, 22px);
	line-height: 1.45;
	color: var(--ink);
	margin-bottom: 28px;
	font-variation-settings: "opsz" 48, "SOFT" 80;
	quotes: "\00ab\00a0" "\00a0\00bb";
}
.vox-item blockquote::before { content: open-quote; color: var(--terre); font-size: 1.2em; }
.vox-item blockquote::after { content: close-quote; color: var(--terre); font-size: 1.2em; }
.vox-item .who {
	display: flex;
	align-items: center;
	gap: 14px;
	padding-top: 20px;
	border-top: 1px solid var(--rule);
}
.vox-item .who::before {
	content: "";
	width: 32px;
	height: 1px;
	background: var(--terre);
}
.vox-item .who .name { font-family: var(--serif); font-weight: 400; font-size: 14px; }
.vox-item .who .meta {
	font-family: var(--serif);
	font-style: italic;
	font-size: 12px;
	color: var(--ink-soft);
	margin-top: 2px;
}

@media (max-width: 880px) { .vox-grid { grid-template-columns: 1fr; } }

/* ==========================================================================
   15. PARTNERS — Monogrammes typographiques
   ========================================================================== */

.partners {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	border-top: 1px solid var(--rule);
	border-left: 1px solid var(--rule);
}
.partner {
	border-right: 1px solid var(--rule);
	border-bottom: 1px solid var(--rule);
	padding: clamp(32px, 3.4vw, 48px) clamp(20px, 2vw, 28px);
	text-align: left;
	background: var(--paper);
	transition: background .35s;
	display: flex;
	flex-direction: column;
	justify-content: center;
	min-height: 180px;
}
.partner:hover { background: var(--paper-2); }
.partner .crest {
	width: auto;
	height: auto;
	margin: 0 0 18px 0;
	border: 0;
	border-radius: 0;
	display: block;
	font-family: var(--serif);
	font-style: italic;
	font-weight: 300;
	font-size: clamp(56px, 5.6vw, 84px);
	line-height: .8;
	letter-spacing: -.03em;
	color: var(--terre);
	font-variation-settings: "opsz" 144, "SOFT" 100;
}
.partner .name {
	font-family: var(--serif);
	font-weight: 400;
	font-size: 15px;
	line-height: 1.35;
	color: var(--ink);
	font-variation-settings: "opsz" 24;
}
.partner .name em { font-style: italic; color: var(--terre); }
.partner .role {
	margin-top: 6px;
	font-family: var(--serif);
	font-style: italic;
	font-size: 12px;
	color: var(--ink-soft);
	letter-spacing: .04em;
}

@media (max-width: 980px) { .partners { grid-template-columns: 1fr 1fr 1fr; } }
@media (max-width: 560px) { .partners { grid-template-columns: 1fr 1fr; } }

/* ==========================================================================
   16. PROMISES — Bandeau 4 colonnes + STEPS process
   ========================================================================== */

.promises {
	padding: clamp(44px, 5vw, 70px) 0;
	border-top: 1px solid var(--rule);
	border-bottom: 1px solid var(--rule);
}
.promises .row {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	border-left: 1px solid var(--rule);
}
.promises .item {
	border-right: 1px solid var(--rule);
	padding: clamp(18px, 2vw, 28px) clamp(22px, 2.4vw, 32px);
}
.promises .item .n {
	font-family: var(--serif);
	font-style: italic;
	font-size: 12px;
	color: var(--terre);
	letter-spacing: .08em;
}
.promises .item .v {
	font-family: var(--serif);
	font-weight: 400;
	font-size: clamp(17px, 1.4vw, 21px);
	line-height: 1.2;
	margin-top: 10px;
	letter-spacing: -.005em;
	font-variation-settings: "opsz" 48;
}
.promises .item .k {
	margin-top: 10px;
	font-family: var(--read);
	font-size: 13px;
	color: var(--ink-soft);
	line-height: 1.5;
}

@media (max-width: 860px) { .promises .row { grid-template-columns: 1fr 1fr; } }

/* Étapes process */
.steps {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	border-top: 1px solid var(--rule);
	border-left: 1px solid var(--rule);
}
.step {
	padding: clamp(32px, 3.5vw, 52px);
	border-right: 1px solid var(--rule);
	border-bottom: 1px solid var(--rule);
	position: relative;
	min-height: 240px;
	transition: background .35s;
}
.step:hover { background: var(--paper-2); }
.step .roman {
	position: absolute;
	top: clamp(24px, 3vw, 40px);
	right: clamp(24px, 3vw, 40px);
	font-family: var(--serif);
	font-style: italic;
	font-weight: 300;
	font-size: clamp(56px, 6vw, 92px);
	line-height: .85;
	color: var(--rule-strong);
	letter-spacing: -.02em;
	font-variation-settings: "opsz" 144, "SOFT" 100;
	transition: color .4s;
}
.step:hover .roman { color: var(--terre); }
.step .label {
	font-family: var(--serif);
	font-style: italic;
	font-size: 13px;
	color: var(--terre);
	letter-spacing: .06em;
}
.step h3 {
	font-family: var(--serif);
	font-weight: 400;
	font-size: clamp(22px, 2vw, 30px);
	line-height: 1.1;
	margin: 14px 0 18px;
	letter-spacing: -.01em;
	font-variation-settings: "opsz" 48;
	max-width: 18ch;
}
.step p {
	font-family: var(--read);
	font-size: 15px;
	line-height: 1.65;
	color: var(--ink-soft);
	max-width: 44ch;
}

@media (max-width: 760px) { .steps { grid-template-columns: 1fr; } }

/* ==========================================================================
   17. FORMS — Form-section noire, dark-form, champs, radio, submit
   ========================================================================== */

.form-section {
	background: var(--ink);
	color: var(--paper);
	padding: clamp(72px, 9vw, 140px) 0;
	position: relative;
	overflow: hidden;
}
.form-section::before {
	content: "";
	position: absolute; inset: 0;
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%25' height='100%25' filter='url(%23n)' opacity='0.6'/></svg>");
	opacity: .15;
	mix-blend-mode: overlay;
	pointer-events: none;
}
.form-section .watermark {
	position: absolute;
	right: clamp(-40px, -2vw, -20px);
	bottom: clamp(-30px, -2vw, -10px);
	width: clamp(320px, 38vw, 520px);
	opacity: .04;
	pointer-events: none;
	user-select: none;
	filter: brightness(1.2);
	z-index: 0;
}
.form-section > .wrap { position: relative; z-index: 1; }
.form-section .head {
	text-align: center;
	max-width: 720px;
	margin: 0 auto clamp(48px, 5vw, 72px);
	position: relative;
}
.form-section .head .lot {
	font-family: var(--serif);
	font-style: italic;
	font-size: 13px;
	color: var(--terre-soft);
	letter-spacing: .16em;
	text-transform: uppercase;
	display: inline-block;
}
.form-section .head .lot::before,
.form-section .head .lot::after {
	content: "\00b7";
	margin: 0 14px;
	color: rgba(244,237,224,.3);
}
.form-section .head h2 {
	margin-top: 20px;
	font-family: var(--serif);
	font-weight: 300;
	font-size: clamp(36px, 4.6vw, 72px);
	line-height: .98;
	letter-spacing: -.022em;
	color: var(--paper);
	font-variation-settings: "opsz" 144, "SOFT" 50;
}
.form-section .head h2 em {
	font-style: italic;
	font-weight: 400;
	color: var(--terre-soft);
	font-variation-settings: "opsz" 144, "SOFT" 100;
}
.form-section .head p {
	margin-top: 20px;
	font-family: var(--read);
	font-size: 16px;
	line-height: 1.65;
	color: rgba(244,237,224,.72);
	max-width: 54ch;
	margin-left: auto;
	margin-right: auto;
}

@media (max-width: 760px) {
	.form-section .watermark { width: 280px; right: -40px; bottom: -20px; opacity: .05; }
}

/* Champs dark form */
.dark-form fieldset { border: 0; padding: 0; margin-bottom: 48px; }
.dark-form legend {
	font-family: var(--serif);
	font-style: italic;
	font-size: 13px;
	color: var(--terre-soft);
	letter-spacing: .1em;
	text-transform: uppercase;
	padding-bottom: 16px;
	margin-bottom: 32px;
	border-bottom: 1px solid rgba(244,237,224,.2);
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: baseline;
}
.dark-form legend .num { font-size: 11px; opacity: .6; }
.dark-form .fields {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 36px 44px;
}
.dark-form .fields .full { grid-column: 1 / -1; }
.dark-form .field { display: flex; flex-direction: column; gap: 8px; }
.dark-form .field label {
	font-family: var(--serif);
	font-style: italic;
	font-size: 12px;
	letter-spacing: .06em;
	color: rgba(244,237,224,.55);
}
.dark-form .field label .req { color: var(--terre-soft); margin-left: 4px; }
.dark-form .field input,
.dark-form .field select,
.dark-form .field textarea {
	background: transparent;
	border: 0;
	border-bottom: 1px solid rgba(244,237,224,.25);
	color: var(--paper);
	font-family: var(--read);
	font-size: 16px;
	padding: 10px 0;
	outline: none;
	transition: border-color .35s;
	border-radius: 0;
	font-feature-settings: "liga";
}
.dark-form .field textarea { min-height: 80px; resize: vertical; line-height: 1.55; }
.dark-form .field input:focus,
.dark-form .field select:focus,
.dark-form .field textarea:focus { border-bottom-color: var(--terre-soft); }
.dark-form .field input::placeholder,
.dark-form .field textarea::placeholder {
	color: rgba(244,237,224,.3);
	font-style: italic;
}
.dark-form .field select {
	cursor: pointer;
	appearance: none;
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path d='M1 1l5 5 5-5' stroke='%23b8845a' stroke-width='1.2' fill='none'/></svg>");
	background-repeat: no-repeat;
	background-position: right 4px center;
}
.dark-form .field select option { background: var(--ink); color: var(--paper); }
.dark-form .radio-group {
	display: flex;
	gap: 0;
	flex-wrap: wrap;
	border-top: 1px solid rgba(244,237,224,.2);
}
.dark-form .radio-group label {
	flex: 1;
	min-width: 120px;
	font-family: var(--serif);
	font-size: 14px;
	padding: 18px 16px;
	border-bottom: 1px solid rgba(244,237,224,.2);
	border-right: 1px solid rgba(244,237,224,.2);
	cursor: pointer;
	text-align: center;
	transition:
		background-color .3s,
		color .3s,
		border-color .3s;
	color: rgba(244,237,224,.7);
	letter-spacing: .02em;
	font-style: normal;
}
.dark-form .radio-group label:last-child { border-right: 0; }
.dark-form .radio-group input[type="radio"] { display: none; }
.dark-form .radio-group input[type="radio"]:checked + label {
	background: var(--terre);
	color: var(--paper);
	border-color: var(--terre);
}
.dark-form .radio-group label:hover { color: var(--paper); }
.dark-form .consent {
	margin-top: 20px;
	display: flex;
	gap: 14px;
	align-items: flex-start;
	font-family: var(--read);
	font-size: 13px;
	line-height: 1.55;
	color: rgba(244,237,224,.6);
}
.dark-form .consent input[type="checkbox"] {
	appearance: none;
	width: 16px;
	height: 16px;
	flex-shrink: 0;
	border: 1px solid rgba(244,237,224,.4);
	background: transparent;
	margin-top: 2px;
	cursor: pointer;
	position: relative;
}
.dark-form .consent input[type="checkbox"]:checked {
	background: var(--terre);
	border-color: var(--terre);
}
.dark-form .consent input[type="checkbox"]:checked::after {
	content: "\2713";
	position: absolute; inset: 0;
	color: var(--paper);
	font-size: 12px;
	display: grid;
	place-items: center;
}
.dark-form .consent a {
	color: var(--terre-soft);
	text-decoration: underline;
	text-underline-offset: 3px;
}
.dark-form .submit-row {
	margin-top: 44px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding-top: 32px;
	border-top: 1px solid rgba(244,237,224,.2);
	flex-wrap: wrap;
	gap: 20px;
}
.dark-form .submit-row .disclaimer {
	font-family: var(--serif);
	font-style: italic;
	font-size: 12px;
	color: rgba(244,237,224,.5);
	max-width: 38ch;
}
.big-submit {
	background: var(--terre);
	color: var(--paper);
	padding: 22px 44px;
	font-family: var(--serif);
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: .14em;
	display: inline-flex;
	align-items: center;
	gap: 18px;
	transition: background .35s;
	cursor: pointer;
	border: 0;
}
.big-submit:hover { background: var(--terre-2); }
.big-submit .arr {
	font-family: var(--serif);
	font-style: italic;
	font-size: 22px;
	letter-spacing: 0;
}

/* Fluent Forms dans form-section — override plugin */
.form-section .ff-el-group label {
	font-family: var(--serif) !important;
	font-style: italic;
	font-size: 12px !important;
	letter-spacing: .06em;
	color: rgba(244,237,224,.55) !important;
}
.form-section .ff-el-group input,
.form-section .ff-el-group select,
.form-section .ff-el-group textarea {
	background: transparent !important;
	border: 0 !important;
	border-bottom: 1px solid rgba(244,237,224,.25) !important;
	color: var(--paper) !important;
	font-family: var(--read) !important;
	font-size: 16px !important;
	padding: 10px 0 !important;
	border-radius: 0 !important;
}
.form-section .ff-el-group input[type="file"] {
	display: block;
	width: 100%;
	padding: 18px 0 !important;
	border: 1px solid rgba(244,237,224,.25) !important;
	border-left: 0 !important;
	border-right: 0 !important;
	cursor: pointer;
}
.form-section .ff-el-group .dropzone,
.form-section .ff-el-group .ff_file_upload,
.form-section .ff-el-group .ff-upload,
.form-section .ff-el-group .ff-upload-field {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px;
	width: 100%;
	padding: 16px 0;
	border-top: 1px solid rgba(244,237,224,.18);
	border-bottom: 1px solid rgba(244,237,224,.18);
}
.form-section .ff-el-group .dropzone .ff_upload_btn.ff-btn,
.form-section .ff-el-group .ff_file_upload .ff_upload_btn,
.form-section .ff-el-group .ff-upload-btn,
.form-section .ff-el-group .ff_upload_btn,
.form-section .ff-el-group .ff-upload .ff-btn,
.form-section .ff-el-group .ff-upload-field .ff-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	padding: 14px 20px !important;
	background: var(--terre) !important;
	color: var(--paper) !important;
	border: 0 !important;
	border-radius: 0 !important;
	font-family: var(--serif) !important;
	font-size: 12px !important;
	letter-spacing: .08em;
	text-transform: uppercase;
	line-height: 1.1;
	cursor: pointer;
}
.form-section .ff-el-group .dropzone .dz-message,
.form-section .ff-el-group .ff-uploaded-list,
.form-section .ff-el-group .ff-upload-preview,
.form-section .ff-el-group .ff-upload-file {
	flex: 1 1 100%;
	margin-top: 4px;
	color: rgba(244,237,224,.72);
}
.form-section .ff-el-group input[type="file"]::file-selector-button {
	background: var(--terre);
	color: var(--paper);
	border: 0;
	padding: 14px 20px;
	margin-right: 18px;
	font-family: var(--serif);
	font-size: 12px;
	letter-spacing: .08em;
	text-transform: uppercase;
	cursor: pointer;
}
.form-section .ff-el-group input[type="file"]::-webkit-file-upload-button {
	background: var(--terre);
	color: var(--paper);
	border: 0;
	padding: 14px 20px;
	margin-right: 18px;
	font-family: var(--serif);
	font-size: 12px;
	letter-spacing: .08em;
	text-transform: uppercase;
	cursor: pointer;
}
.form-section .ff-el-group input:focus,
.form-section .ff-el-group select:focus,
.form-section .ff-el-group textarea:focus {
	border-bottom-color: var(--terre-soft) !important;
	box-shadow: none !important;
}
/* Fluent Forms submit — aligné DA Domus Magna (.btn .btn-primary) */
.form-section .ff-btn-submit,
.dm-newsletter-footer .ff-btn-submit,
.fluent_form_DM .ff-btn-submit,
.ff-btn.ff-btn-submit {
	background: var(--terre) !important;
	color: var(--paper) !important;
	font-family: var(--serif) !important;
	font-size: 12px !important;
	font-weight: 400 !important;
	letter-spacing: .06em !important;
	text-transform: none !important;
	padding: 15px 28px !important;
	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	min-width: 180px;
	line-height: 1.1;
	transition: background-color .35s cubic-bezier(.7,0,.2,1), color .35s cubic-bezier(.7,0,.2,1);
	cursor: pointer;
	-webkit-font-smoothing: antialiased;
}
.form-section .ff-btn-submit:hover,
.dm-newsletter-footer .ff-btn-submit:hover,
.fluent_form_DM .ff-btn-submit:hover,
.ff-btn.ff-btn-submit:hover {
	background: var(--ink, #2b2418) !important;
	color: var(--paper) !important;
}
.form-section .ff-btn-submit:focus-visible,
.dm-newsletter-footer .ff-btn-submit:focus-visible,
.ff-btn.ff-btn-submit:focus-visible {
	outline: 2px solid var(--terre-soft) !important;
	outline-offset: 3px;
}
.form-section .ff-message-success,
.dm-newsletter-footer .ff-message-success {
	background: rgba(244,237,224,.04) !important;
	color: var(--paper) !important;
	border: 1px solid rgba(244,237,224,.22) !important;
	padding: 22px 26px !important;
	font-family: var(--read) !important;
	font-size: 16px !important;
	line-height: 1.6 !important;
}
.form-section .ff-el-is-error .error,
.dm-newsletter-footer .ff-el-is-error .error {
	font-size: 14px !important;
	margin-top: 10px !important;
}

/* --------------------------------------------------------------------------
   CONTACT FORM — Variante éditoriale claire sur la page Contact
   -------------------------------------------------------------------------- */

.contact-form-section {
	background: var(--paper);
	position: relative;
	padding-top: clamp(56px, 6vw, 92px);
	padding-bottom: clamp(56px, 6vw, 92px);
	border-top: 1px solid var(--rule);
	border-bottom: 1px solid var(--rule);
}

.contact-form-section::before {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	background:
		radial-gradient(ellipse 40% 35% at 8% 12%, rgba(122,59,31,.06), transparent 60%),
		radial-gradient(ellipse 30% 30% at 92% 88%, rgba(26,20,16,.04), transparent 60%);
}

.contact-form-section > .wrap { position: relative; z-index: 1; }

.contact-form-grid {
	display: grid;
	grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
	gap: clamp(32px, 4vw, 80px);
	align-items: start;
}
@media (max-width: 820px) {
	.contact-form-grid { grid-template-columns: 1fr; }
}

.contact-form-aside {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 18px;
	padding-right: clamp(0px, 2vw, 32px);
}
.contact-form-aside .lot {
	font-family: var(--serif);
	font-style: italic;
	font-size: 11.5px;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--ink-soft);
	display: inline-flex;
	align-items: center;
	gap: 10px;
	font-variation-settings: "opsz" 14, "SOFT" 100;
}
.contact-form-aside .lot::before,
.contact-form-aside .lot::after {
	content: "";
	display: inline-block;
	width: 24px;
	height: 1px;
	background: var(--rule-strong);
}

.contact-form-title {
	font-family: var(--serif);
	font-weight: 300;
	font-size: clamp(32px, 4vw, 50px);
	line-height: 1.02;
	letter-spacing: -.022em;
	color: var(--ink);
	margin: 0;
	font-variation-settings: "opsz" 144, "SOFT" 50;
}
.contact-form-title em {
	font-style: italic;
	font-weight: 400;
	color: var(--terre);
	font-variation-settings: "opsz" 144, "SOFT" 100;
}

.contact-form-lede {
	font-family: var(--read);
	font-size: 15.5px;
	line-height: 1.6;
	color: var(--ink-soft);
	margin: 0;
	max-width: 42ch;
}

.contact-form-note {
	list-style: none;
	margin: 14px 0 0;
	padding: 14px 0 0;
	border-top: 1px solid var(--rule);
	display: flex;
	flex-direction: column;
	gap: 8px;
	font-family: var(--read);
	font-size: 13.5px;
	color: var(--ink-soft);
}
.contact-form-note em {
	font-family: var(--serif);
	font-style: italic;
	color: var(--terre);
	margin-right: 8px;
	font-variation-settings: "opsz" 14, "SOFT" 100;
}

.contact-form-body {
	background: var(--paper);
	padding: clamp(26px, 3vw, 44px);
	border: 1px solid var(--rule);
	position: relative;
}
.contact-form-body::before {
	content: "";
	position: absolute;
	top: -1px;
	left: 22px;
	width: 44px;
	height: 2px;
	background: var(--terre);
}

/* Fluent Forms — override spécifique au formulaire Contact (clair) */
.contact-form-body .ff-el-group { margin-bottom: 18px; }

.contact-form-body .ff-el-group label,
.contact-form-body .ff-el-input--label label {
	font-family: var(--serif) !important;
	font-style: italic;
	font-size: 12px !important;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--ink-soft) !important;
	margin-bottom: 4px !important;
	font-variation-settings: "opsz" 14, "SOFT" 100;
}

.contact-form-body .ff-el-group input,
.contact-form-body .ff-el-group select,
.contact-form-body .ff-el-group textarea {
	background: transparent !important;
	border: 0 !important;
	border-bottom: 1px solid var(--rule) !important;
	color: var(--ink) !important;
	font-family: var(--read) !important;
	font-size: 16px !important;
	padding: 10px 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	transition: border-color .35s var(--dm-ease-out) !important;
}
.contact-form-body .ff-el-group textarea {
	line-height: 1.55 !important;
	min-height: 140px !important;
}
.contact-form-body .ff-el-group input::placeholder,
.contact-form-body .ff-el-group textarea::placeholder {
	color: var(--ink-soft) !important;
	opacity: .55 !important;
}
.contact-form-body .ff-el-group input:focus,
.contact-form-body .ff-el-group select:focus,
.contact-form-body .ff-el-group textarea:focus {
	border-bottom-color: var(--terre) !important;
	box-shadow: none !important;
	outline: none !important;
}

/* Submit button — ink background, terre accent on hover */
.contact-form-body .ff-btn-submit,
.contact-form-body .ff-btn.ff-btn-submit {
	background: var(--ink) !important;
	color: var(--paper) !important;
	border: 0 !important;
	border-radius: 0 !important;
	font-family: var(--serif) !important;
	font-size: 12px !important;
	font-weight: 400 !important;
	letter-spacing: .08em !important;
	text-transform: uppercase !important;
	padding: 16px 28px !important;
	min-height: 52px !important;
	display: inline-flex !important;
	align-items: center !important;
	gap: 12px;
	cursor: pointer;
	box-shadow: none !important;
	transition:
		background-color .35s var(--dm-ease-out) !important,
		color .35s var(--dm-ease-out) !important,
		transform .35s var(--dm-ease-out) !important;
}
.contact-form-body .ff-btn-submit::after,
.contact-form-body .ff-btn.ff-btn-submit::after {
	content: "→";
	font-family: var(--serif);
	font-weight: 300;
	transition: transform .4s var(--dm-ease-out);
	display: inline-block;
}
.contact-form-body .ff-btn-submit:hover,
.contact-form-body .ff-btn.ff-btn-submit:hover {
	background: var(--terre) !important;
}
.contact-form-body .ff-btn-submit:hover::after,
.contact-form-body .ff-btn.ff-btn-submit:hover::after {
	transform: translateX(6px);
}
.contact-form-body .ff-btn-submit:focus-visible,
.contact-form-body .ff-btn.ff-btn-submit:focus-visible {
	outline: 2px solid var(--terre-soft) !important;
	outline-offset: 3px;
}

/* Messages + erreurs */
.contact-form-body .ff-message-success {
	background: rgba(122,59,31,.06) !important;
	color: var(--ink) !important;
	border: 1px solid var(--rule-strong) !important;
	padding: 22px 26px !important;
	font-family: var(--read) !important;
	font-size: 15.5px !important;
	line-height: 1.55 !important;
}
.contact-form-body .ff-el-is-error .error,
.contact-form-body .text-danger {
	font-family: var(--serif) !important;
	font-style: italic !important;
	font-size: 13px !important;
	margin-top: 8px !important;
	color: var(--terre) !important;
}

.dm-form-bridge {
	border: 1px solid rgba(244,237,224,.18);
	padding: clamp(30px, 3vw, 44px);
}

.dm-form-bridge--dark {
	background: transparent;
	color: var(--paper);
}

.dm-form-bridge--light {
	background: transparent;
	color: var(--paper);
}

.dm-form-bridge__disclaimer {
	margin-top: 24px;
	padding-top: 18px;
	border-top: 1px solid rgba(244,237,224,.18);
	font-family: var(--serif);
	font-style: italic;
	font-size: 12px;
	line-height: 1.55;
	color: rgba(244,237,224,.55);
}

.dm-form-fallback__eyebrow {
	display: inline-block;
	font-family: var(--serif);
	font-style: italic;
	font-size: 15px;
	color: var(--terre-soft);
	letter-spacing: .04em;
}

.dm-form-fallback h3 {
	margin-top: 20px;
	font-family: var(--serif);
	font-weight: 300;
	font-size: clamp(28px, 3.4vw, 44px);
	line-height: 1.02;
	letter-spacing: -.018em;
	color: var(--paper);
}

.dm-form-fallback p {
	margin-top: 20px;
	font-family: var(--read);
	font-size: 16px;
	line-height: 1.65;
	color: rgba(244,237,224,.78);
	max-width: 48ch;
}

.dm-form-fallback__actions {
	margin-top: 30px;
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}

.dm-form-fallback__meta {
	margin-top: 28px;
	padding-top: 18px;
	border-top: 1px solid rgba(244,237,224,.18);
	display: flex;
	flex-wrap: wrap;
	gap: 8px 18px;
	font-family: var(--serif);
	font-style: italic;
	font-size: 12px;
	line-height: 1.5;
	color: rgba(244,237,224,.6);
}

.dm-form-fallback__meta span + span::before {
	content: "·";
	margin-right: 10px;
	color: var(--terre-soft);
}

@media (max-width: 760px) {
	.dark-form .fields { grid-template-columns: 1fr; gap: 28px; }
}

/* ==========================================================================
   18. FAQ — Accordéon details/summary
   ========================================================================== */

.faq-wrap {
	max-width: 860px;
	margin: 0 auto;
	border-top: 1px solid var(--rule);
}
details.faq {
	border-bottom: 1px solid var(--rule);
	padding: clamp(22px, 2.4vw, 32px) 0;
	cursor: pointer;
}
details.faq summary {
	list-style: none;
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	gap: 24px;
	font-family: var(--serif);
	font-weight: 400;
	font-size: clamp(18px, 1.8vw, 24px);
	line-height: 1.25;
	color: var(--ink);
	letter-spacing: -.005em;
	font-variation-settings: "opsz" 48;
	transition: color .3s;
	cursor: pointer;
}
details.faq summary::-webkit-details-marker { display: none; }
details.faq summary:hover { color: var(--terre); }
details.faq summary .plus {
	font-family: var(--serif);
	font-style: italic;
	font-weight: 300;
	font-size: 32px;
	line-height: 0;
	color: var(--terre);
	flex-shrink: 0;
	transition: transform .4s cubic-bezier(.7,0,.2,1);
}
details.faq[open] summary .plus { transform: rotate(45deg); }
details.faq .ans {
	padding-top: 22px;
	font-family: var(--read);
	font-size: 16px;
	line-height: 1.7;
	color: var(--ink-soft);
	max-width: 60ch;
}

/* ==========================================================================
   19. INVITE — CTA final noir plein cadre
   ========================================================================== */

.invite {
	background: var(--ink);
	color: var(--paper);
	padding: clamp(64px, 8vw, 120px) 0;
	position: relative;
	overflow: hidden;
}
.invite::before {
	content: "";
	position: absolute; inset: 0;
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%25' height='100%25' filter='url(%23n)' opacity='0.6'/></svg>");
	opacity: .15;
	mix-blend-mode: overlay;
	pointer-events: none;
}
.invite-grid {
	display: grid;
	grid-template-columns: 1.1fr 1fr;
	gap: clamp(48px, 6vw, 100px);
	align-items: stretch;
	position: relative;
}
.invite-text .pretitle {
	font-family: var(--serif);
	font-style: italic;
	font-size: 14px;
	color: var(--terre-soft);
	letter-spacing: .06em;
}
.invite-text h2 {
	margin-top: 22px;
	font-family: var(--serif);
	font-weight: 300;
	font-size: clamp(32px, 4vw, 60px);
	line-height: .98;
	letter-spacing: -.022em;
	color: var(--paper);
	font-variation-settings: "opsz" 144, "SOFT" 50;
}
.invite-text h2 em {
	font-style: italic;
	font-weight: 400;
	color: var(--terre-soft);
	font-variation-settings: "opsz" 144, "SOFT" 100;
}
.invite-text .lede {
	margin-top: 28px;
	font-family: var(--read);
	font-size: 16px;
	line-height: 1.65;
	color: rgba(244,237,224,.78);
	max-width: 48ch;
}
.invite-text .sign {
	margin-top: 36px;
	font-family: var(--serif);
	font-style: italic;
	font-size: 15px;
	color: rgba(244,237,224,.7);
}
.invite-text .sign strong {
	display: block;
	font-style: normal;
	color: var(--paper);
	font-weight: 400;
	font-size: 17px;
	margin-top: 4px;
}
.invite .form {
	background: transparent;
	border: 1px solid rgba(244,237,224,.18);
	padding: clamp(30px, 3vw, 44px);
	align-self: start;
}
.invite .form-title {
	font-family: var(--serif);
	font-style: italic;
	font-size: 15px;
	color: var(--terre-soft);
	margin-bottom: 32px;
	padding-bottom: 18px;
	border-bottom: 1px solid rgba(244,237,224,.18);
	letter-spacing: .04em;
}
.invite .form .row {
	display: flex;
	flex-direction: column;
	gap: 8px;
	margin-bottom: 20px;
}
.invite .form label {
	font-family: var(--serif);
	font-style: italic;
	font-size: 12px;
	letter-spacing: .06em;
	color: rgba(244,237,224,.55);
}
.invite .form input,
.invite .form select {
	background: transparent;
	border: 0;
	border-bottom: 1px solid rgba(244,237,224,.25);
	color: var(--paper);
	font-family: var(--read);
	font-size: 15px;
	padding: 10px 0;
	outline: none;
	transition: border-color .35s;
}
.invite .form input:focus,
.invite .form select:focus { border-bottom-color: var(--terre-soft); }
.invite .form input::placeholder {
	color: rgba(244,237,224,.3);
	font-style: italic;
}
.invite .form .submit {
	margin-top: 14px;
	width: 100%;
	background: var(--terre);
	color: var(--paper);
	padding: 22px;
	font-family: var(--serif);
	font-size: 14px;
	text-transform: uppercase;
	letter-spacing: .16em;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 18px;
	transition: background .35s;
	cursor: pointer;
	border: 0;
}
.invite .form .submit:hover { background: var(--terre-2); }
.invite .form .submit .arr {
	font-family: var(--serif);
	font-style: italic;
	font-size: 22px;
	text-transform: none;
	letter-spacing: 0;
}

.invite .dm-form-bridge {
	align-self: start;
}

@media (max-width: 880px) { .invite-grid { grid-template-columns: 1fr; } }

/* ==========================================================================
   20. FOOTER — foot-mark, foot-grid, cobrand, foot-bottom
   ========================================================================== */

.site-footer,
.site-info {
	background: var(--ink) !important;
	color: rgba(244,237,224,.72) !important;
}

.site-footer {
	padding: 0 !important;
	border-top: 0 !important;
}

#footer-widgets,
.site-footer .footer-widgets {
	display: none !important;
}

.site-info {
	padding: 26px 0 30px !important;
	border-top: 1px solid rgba(244,237,224,.14) !important;
}
.foot-mark {
	text-align: center;
	font-family: var(--serif);
	font-weight: 300;
	font-size: clamp(48px, 6.5vw, 96px);
	line-height: .85;
	letter-spacing: -.025em;
	font-variation-settings: "opsz" 144, "SOFT" 50;
	padding-bottom: clamp(36px, 4vw, 64px);
	border-bottom: 1px solid var(--rule);
}
.foot-mark em {
	font-style: italic;
	font-weight: 400;
	color: var(--terre);
	font-variation-settings: "opsz" 144, "SOFT" 100;
}
.foot-mark img {
	max-width: min(520px, 80%);
	height: auto;
	display: block;
	margin: 0 auto;
}
.foot-grid {
	display: grid;
	grid-template-columns: 2fr 1fr 1fr 1fr;
	gap: clamp(28px, 4vw, 60px);
	margin-top: clamp(32px, 4vw, 56px);
	padding-bottom: 40px;
	border-bottom: 1px solid var(--rule);
}
.foot-info p {
	font-family: var(--read);
	font-size: 14px;
	line-height: 1.7;
	color: var(--ink-soft);
	max-width: 36ch;
}
.foot-info .addr {
	font-family: var(--serif);
	font-size: 16px;
	font-weight: 400;
	color: var(--ink);
	margin-bottom: 8px;
	font-variation-settings: "opsz" 24;
}
.foot-info .addr em { font-style: italic; color: var(--terre); }
.foot-col h5 {
	font-family: var(--serif);
	font-style: italic;
	font-size: 13px;
	color: var(--terre);
	letter-spacing: .06em;
	margin-bottom: 20px;
	font-weight: 400;
}
.foot-col ul {
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: 12px;
}
.foot-col a {
	font-family: var(--serif);
	font-size: 14px;
	transition: color .3s, padding-left .3s;
	font-variation-settings: "opsz" 14;
}
.foot-col a:hover { color: var(--terre); padding-left: 6px; }
.foot-cobrand {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 18px;
	margin-top: 30px;
	padding-top: 30px;
	border-top: 1px dashed var(--rule);
	font-family: var(--serif);
	font-style: italic;
	font-size: 12px;
	color: var(--ink-soft);
	letter-spacing: .06em;
	flex-wrap: wrap;
	text-align: center;
}
.foot-cobrand img { height: 36px; width: auto; opacity: .75; }
.foot-bottom {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-top: 34px;
	font-family: var(--serif);
	font-style: italic;
	font-size: 12px;
	color: var(--ink-soft);
	letter-spacing: .04em;
	flex-wrap: wrap;
	gap: 14px;
}
.foot-bottom a:hover { color: var(--terre); }

/* Override liens footer GP */
.site-footer a,
.site-info a {
	color: rgba(244,237,224,.72) !important;
	transition: color .25s;
}
.site-footer a:hover,
.site-info a:hover { color: var(--terre-soft) !important; }
.site-footer .copyright,
.site-info .copyright {
	font-size: .85rem;
	color: rgba(244,237,224,.72);
}

@media (max-width: 880px) { .foot-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 520px) { .foot-grid { grid-template-columns: 1fr; } }

/* ==========================================================================
   20B. PAGE COMPONENTS — templates statiques V1
   ========================================================================== */

.est-hero h1 { max-width: 14ch; }
.est-hero .hero-quote { margin-top: clamp(36px, 4.2vw, 64px); }

.page-head.recrut,
.page-head.invest,
.page-head.loca {
	position: relative;
	overflow: hidden;
}

.page-head.recrut .chapter-watermark,
.page-head.invest .chapter-watermark,
.page-head.loca .chapter-watermark {
	position: absolute;
	right: clamp(-30px, -2vw, 40px);
	top: clamp(40px, 5vw, 80px);
	font-family: var(--serif);
	font-style: italic;
	font-weight: 300;
	font-size: clamp(200px, 30vw, 520px);
	line-height: .8;
	letter-spacing: -.05em;
	color: var(--terre);
	opacity: .08;
	pointer-events: none;
	user-select: none;
	font-variation-settings: "opsz" 144, "SOFT" 100;
	z-index: 0;
}

.page-head.recrut > .wrap,
.page-head.invest > .wrap,
.page-head.loca > .wrap {
	position: relative;
	z-index: 1;
}

.backlink-slab {
	border-top: 1px solid var(--rule-strong);
	border-bottom: 1px solid var(--rule-strong);
	background: var(--paper);
	padding: clamp(72px, 9vw, 140px) 0;
	position: relative;
	overflow: hidden;
}

.backlink-slab .roman-bg {
	position: absolute;
	right: clamp(-60px, -4vw, -20px);
	top: 50%;
	transform: translateY(-50%);
	font-family: var(--serif);
	font-style: italic;
	font-weight: 300;
	font-size: clamp(260px, 36vw, 580px);
	line-height: .8;
	letter-spacing: -.05em;
	color: var(--terre);
	opacity: .08;
	pointer-events: none;
	user-select: none;
	font-variation-settings: "opsz" 144, "SOFT" 100;
}

.backlink-slab .inner {
	position: relative;
	z-index: 1;
	max-width: 760px;
}

.backlink-slab .kicker {
	font-family: var(--serif);
	font-style: italic;
	font-size: 13px;
	color: var(--terre);
	letter-spacing: .12em;
	text-transform: uppercase;
	display: inline-block;
	margin-bottom: clamp(22px, 2.4vw, 36px);
}

.backlink-slab .kicker::before {
	content: "";
	display: inline-block;
	width: 40px;
	height: 1px;
	background: var(--terre);
	vertical-align: middle;
	margin-right: 14px;
}

.backlink-slab h2 {
	font-family: var(--serif);
	font-weight: 300;
	font-size: clamp(36px, 5vw, 80px);
	line-height: .98;
	letter-spacing: -.022em;
	font-variation-settings: "opsz" 144, "SOFT" 50;
	max-width: 14ch;
}

.backlink-slab h2 em {
	font-style: italic;
	font-weight: 400;
	color: var(--terre);
	font-variation-settings: "opsz" 144, "SOFT" 100;
}

.backlink-slab p {
	margin-top: clamp(26px, 3vw, 44px);
	font-family: var(--read);
	font-size: 17px;
	line-height: 1.65;
	color: var(--ink-soft);
	max-width: 56ch;
}

.backlink-slab .gh-cta {
	margin-top: clamp(36px, 4vw, 58px);
	display: inline-flex;
	align-items: center;
	gap: 18px;
	padding: 22px 36px;
	background: var(--ink);
	color: var(--paper);
	font-family: var(--serif);
	font-size: 13px;
	letter-spacing: .14em;
	text-transform: uppercase;
	transition: background .35s;
}

.backlink-slab .gh-cta:hover { background: var(--terre); }
.backlink-slab .gh-cta .url {
	font-style: italic;
	text-transform: none;
	letter-spacing: .02em;
	color: var(--terre-soft);
	font-size: 12px;
}
.backlink-slab .gh-cta .arr { font-size: 22px; font-style: italic; }

.typologies {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	border-top: 1px solid var(--rule);
	border-left: 1px solid var(--rule);
}

.typo {
	border-right: 1px solid var(--rule);
	border-bottom: 1px solid var(--rule);
	padding: clamp(32px, 3.6vw, 56px) clamp(24px, 2.6vw, 40px);
	background: var(--paper);
	transition: background .35s;
	min-height: 260px;
	display: flex;
	flex-direction: column;
}

.typo:hover { background: var(--paper-2); }
.typo .numeral {
	font-family: var(--serif);
	font-style: italic;
	font-weight: 300;
	font-size: clamp(48px, 5vw, 72px);
	line-height: .8;
	color: var(--terre);
	opacity: .4;
	margin-bottom: clamp(22px, 2.4vw, 34px);
}

.typo h3 {
	font-family: var(--serif);
	font-weight: 400;
	font-size: clamp(20px, 1.8vw, 26px);
	line-height: 1.15;
	font-variation-settings: "opsz" 48;
	margin-bottom: 14px;
}

.typo h3 em { font-style: italic; color: var(--terre); }
.typo p {
	font-family: var(--read);
	font-size: 14.5px;
	line-height: 1.6;
	color: var(--ink-soft);
}

.typo .foot {
	margin-top: auto;
	padding-top: 24px;
	border-top: 1px solid var(--rule);
	font-family: var(--serif);
	font-style: italic;
	font-size: 12px;
	color: var(--ink-soft);
	letter-spacing: .04em;
}

.offers {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	border-top: 1px solid var(--rule-strong);
	border-bottom: 1px solid var(--rule-strong);
	margin-top: clamp(48px, 5.5vw, 88px);
}

.offer {
	border-right: 1px solid var(--rule);
	padding: clamp(32px, 3.4vw, 56px) clamp(24px, 2.6vw, 40px);
	text-align: left;
	min-height: 280px;
	display: flex;
	flex-direction: column;
}

.offer:last-child { border-right: 0; }
.offer .numeral {
	font-family: var(--serif);
	font-style: italic;
	font-weight: 300;
	font-size: clamp(80px, 10vw, 160px);
	line-height: .82;
	letter-spacing: -.04em;
	color: var(--terre);
	opacity: .22;
	margin-bottom: 22px;
	font-variation-settings: "opsz" 144, "SOFT" 100;
}

.offer h3 {
	font-family: var(--serif);
	font-weight: 400;
	font-size: clamp(18px, 1.6vw, 22px);
	line-height: 1.2;
	font-variation-settings: "opsz" 48;
	margin-bottom: 14px;
}

.offer h3 em { font-style: italic; color: var(--terre); }
.offer p {
	font-family: var(--read);
	font-size: 14px;
	line-height: 1.6;
	color: var(--ink-soft);
	flex: 1;
}

.posts { border-top: 1px solid var(--rule); }
.post {
	display: grid;
	grid-template-columns: 80px 1.5fr 2fr auto;
	gap: clamp(20px, 2.5vw, 40px);
	align-items: center;
	padding: clamp(28px, 3vw, 44px) clamp(16px, 2vw, 28px);
	border-bottom: 1px solid var(--rule);
	transition: background .35s;
}

.post:hover { background: var(--paper-2); }
.post .num {
	font-family: var(--serif);
	font-style: italic;
	font-size: 14px;
	color: var(--terre);
}

.post .title {
	font-family: var(--serif);
	font-weight: 400;
	font-size: clamp(20px, 1.7vw, 26px);
	letter-spacing: -.005em;
	font-variation-settings: "opsz" 48;
}

.post .title em { font-style: italic; color: var(--terre); }
.post .type {
	font-family: var(--serif);
	font-style: italic;
	font-size: 13px;
	color: var(--ink-soft);
	letter-spacing: .04em;
}

.post .cta {
	font-family: var(--serif);
	font-size: 12px;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--ink);
	border-bottom: 1px solid var(--ink);
	padding-bottom: 4px;
	white-space: nowrap;
}

.why-vitry {
	display: grid;
	grid-template-columns: 5fr 7fr;
	gap: clamp(32px, 4.5vw, 80px);
	align-items: stretch;
	margin-top: clamp(32px, 4vw, 64px);
}

.why-vitry .frame {
	background: var(--paper);
	border: 1px solid var(--rule);
	min-height: clamp(320px, 36vw, 500px);
	display: grid;
	place-items: center;
	position: relative;
	overflow: hidden;
}

.why-vitry .frame img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	filter: saturate(.88) contrast(1.05);
}

.why-vitry .frame::after {
	content: "";
	position: absolute;
	inset: 0;
	background:
		linear-gradient(180deg, rgba(14, 10, 8, .08) 0%, rgba(14, 10, 8, .12) 44%, rgba(14, 10, 8, .76) 100%),
		radial-gradient(ellipse 60% 54% at 76% 72%, rgba(10, 7, 6, .3), transparent 72%);
	pointer-events: none;
}

.why-vitry .frame .big {
	position: relative;
	z-index: 1;
	font-family: var(--serif);
	font-style: italic;
	font-weight: 300;
	font-size: clamp(180px, 22vw, 320px);
	line-height: .8;
	letter-spacing: -.05em;
	color: rgba(244, 237, 224, .32);
	opacity: 1;
	user-select: none;
	font-variation-settings: "opsz" 144, "SOFT" 100;
}

.why-vitry .frame .cap {
	position: absolute;
	left: 24px;
	bottom: 24px;
	right: 24px;
	z-index: 2;
	font-family: var(--serif);
	font-style: italic;
	font-size: 11px;
	color: rgba(244, 237, 224, .88);
	letter-spacing: .14em;
	text-transform: uppercase;
}

.why-vitry .frame .cap::before {
	content: "";
	display: block;
	width: 40px;
	height: 1px;
	background: rgba(244, 237, 224, .92);
	margin-bottom: 12px;
}

.why-vitry .txt {
	padding: clamp(16px, 2vw, 36px) 0;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.why-vitry .txt h2 {
	font-family: var(--serif);
	font-weight: 300;
	font-size: clamp(32px, 3.6vw, 56px);
	line-height: 1.02;
	letter-spacing: -.018em;
	font-variation-settings: "opsz" 144, "SOFT" 50;
	margin-bottom: 28px;
}

.why-vitry .txt h2 em {
	font-style: italic;
	font-weight: 400;
	color: var(--terre);
}

.why-vitry .txt p {
	font-family: var(--read);
	font-size: 16px;
	line-height: 1.7;
	color: var(--ink-soft);
	max-width: 56ch;
}

.why-vitry .txt p + p { margin-top: 14px; }
.why-vitry .txt .stats {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: clamp(18px, 2vw, 28px);
	border-top: 1px solid var(--rule);
	padding-top: clamp(22px, 2.4vw, 32px);
	margin-top: 28px;
}

.why-vitry .stat .v {
	font-family: var(--serif);
	font-weight: 300;
	font-size: clamp(32px, 3.4vw, 52px);
	line-height: .9;
	letter-spacing: -.02em;
	color: var(--ink);
}

.why-vitry .stat .v em { font-style: italic; color: var(--terre); }
.why-vitry .stat .k {
	margin-top: 12px;
	font-family: var(--serif);
	font-style: italic;
	font-size: 12px;
	color: var(--ink-soft);
	letter-spacing: .04em;
	line-height: 1.45;
}

.ops-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	border-top: 1px solid var(--rule);
	border-left: 1px solid var(--rule);
}

.op {
	border-right: 1px solid var(--rule);
	border-bottom: 1px solid var(--rule);
	padding: clamp(36px, 4vw, 64px) clamp(28px, 3vw, 48px);
	background: var(--paper);
	transition: background .35s;
	display: flex;
	flex-direction: column;
	min-height: 320px;
}

.op:hover { background: var(--paper-2); }
.op .num {
	font-family: var(--serif);
	font-style: italic;
	font-weight: 300;
	font-size: clamp(56px, 5.6vw, 84px);
	line-height: .8;
	color: var(--terre);
	opacity: .32;
	margin-bottom: 22px;
}

.op h3 {
	font-family: var(--serif);
	font-weight: 400;
	font-size: clamp(22px, 2vw, 30px);
	line-height: 1.15;
	letter-spacing: -.005em;
	font-variation-settings: "opsz" 48;
	margin-bottom: 16px;
}

.op h3 em { font-style: italic; color: var(--terre); }
.op p {
	font-family: var(--read);
	font-size: 15px;
	line-height: 1.65;
	color: var(--ink-soft);
	max-width: 48ch;
	flex: 1;
}

.op .tag {
	margin-top: 22px;
	padding-top: 18px;
	border-top: 1px solid var(--rule);
	font-family: var(--serif);
	font-style: italic;
	font-size: 12px;
	color: var(--ink-soft);
	letter-spacing: .08em;
}

.hero-partner {
	border-top: 1px solid var(--rule-strong);
	border-bottom: 1px solid var(--rule-strong);
	background: var(--paper);
	padding: clamp(56px, 7vw, 110px) 0;
	position: relative;
	overflow: hidden;
}

.hero-partner .bigletter {
	position: absolute;
	left: clamp(-40px, -2vw, 0);
	top: 50%;
	transform: translateY(-50%);
	font-family: var(--serif);
	font-style: italic;
	font-weight: 300;
	font-size: clamp(260px, 36vw, 540px);
	line-height: .78;
	letter-spacing: -.05em;
	color: var(--terre);
	opacity: .12;
	pointer-events: none;
	user-select: none;
	font-variation-settings: "opsz" 144, "SOFT" 100;
}

.hero-partner .inner {
	position: relative;
	z-index: 1;
	display: grid;
	grid-template-columns: 1fr 1.4fr;
	gap: clamp(40px, 5vw, 90px);
	align-items: center;
}

.hero-partner .tag {
	font-family: var(--serif);
	font-style: italic;
	font-size: 13px;
	color: var(--terre);
	letter-spacing: .12em;
	text-transform: uppercase;
	display: inline-block;
	margin-bottom: 24px;
}

.hero-partner .tag::before {
	content: "";
	display: inline-block;
	width: 40px;
	height: 1px;
	background: var(--terre);
	vertical-align: middle;
	margin-right: 14px;
}

.hero-partner h2 {
	font-family: var(--serif);
	font-weight: 300;
	font-size: clamp(32px, 4.4vw, 72px);
	line-height: .98;
	letter-spacing: -.02em;
	max-width: 14ch;
}

.hero-partner h2 em { font-style: italic; font-weight: 400; color: var(--terre); }
.hero-partner .subtitle {
	margin-top: 18px;
	font-family: var(--serif);
	font-style: italic;
	font-size: 15px;
	color: var(--ink-soft);
	letter-spacing: .04em;
}

.hero-partner p {
	font-family: var(--read);
	font-size: 17px;
	line-height: 1.7;
	color: var(--ink);
}

.hero-partner p + p { margin-top: 16px; }
.hero-partner .link {
	margin-top: 32px;
	display: inline-flex;
	align-items: center;
	gap: 14px;
	font-family: var(--serif);
	font-size: 13px;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--ink);
	border-bottom: 1px solid var(--ink);
	padding-bottom: 6px;
}

.hero-partner .link::after { content: "→"; font-style: italic; font-size: 18px; }
.hero-partner .link:hover { color: var(--terre); border-color: var(--terre); }

.cat-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	border-top: 1px solid var(--rule);
	border-left: 1px solid var(--rule);
}

.cat {
	border-right: 1px solid var(--rule);
	border-bottom: 1px solid var(--rule);
	padding: clamp(32px, 3.4vw, 48px) clamp(24px, 2.6vw, 36px);
	background: var(--paper);
	transition: background .35s;
	min-height: 240px;
	display: flex;
	flex-direction: column;
}

.cat:hover { background: var(--paper-2); }
.cat .num {
	font-family: var(--serif);
	font-style: italic;
	font-size: 12px;
	color: var(--terre);
	letter-spacing: .08em;
}

.cat h3 {
	margin-top: 12px;
	font-family: var(--serif);
	font-weight: 400;
	font-size: clamp(20px, 1.7vw, 26px);
	line-height: 1.2;
}

.cat h3 em { font-style: italic; color: var(--terre); }
.cat p {
	margin-top: 12px;
	font-family: var(--read);
	font-size: 14.5px;
	line-height: 1.6;
	color: var(--ink-soft);
	flex: 1;
}

.cat .pending {
	margin-top: auto;
	padding-top: 20px;
	border-top: 1px solid var(--rule);
	font-family: var(--serif);
	font-style: italic;
	font-size: 12px;
	color: var(--ink-soft);
	letter-spacing: .04em;
	opacity: .6;
}

.blog-hero {
	padding: clamp(54px, 7vw, 110px) 0 clamp(36px, 4vw, 60px);
	border-bottom: 1px solid var(--rule-strong);
	position: relative;
}

.blog-hero .ours {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	gap: clamp(18px, 2vw, 32px);
	align-items: baseline;
	padding-bottom: clamp(32px, 3.6vw, 56px);
	border-bottom: 1px solid var(--rule);
	margin-bottom: clamp(40px, 4.6vw, 72px);
	font-family: var(--serif);
	font-style: italic;
	font-size: 12px;
	color: var(--ink-soft);
	letter-spacing: .08em;
	text-transform: uppercase;
}

.blog-hero .ours .left { text-align: left; }
.blog-hero .ours .right { text-align: right; }
.blog-hero .ours .center {
	font-style: normal;
	font-size: 13px;
	letter-spacing: .24em;
	color: var(--terre);
}

.blog-hero h1 {
	font-family: var(--serif);
	font-weight: 300;
	font-size: clamp(56px, 10vw, 180px);
	line-height: .88;
	letter-spacing: -.038em;
	text-align: center;
}

.blog-hero h1 em { font-style: italic; font-weight: 400; color: var(--terre); }
.blog-hero .tagline {
	margin-top: clamp(32px, 3.6vw, 56px);
	text-align: center;
	font-family: var(--serif);
	font-style: italic;
	font-size: clamp(18px, 1.8vw, 24px);
	color: var(--ink-soft);
	max-width: 56ch;
	margin-left: auto;
	margin-right: auto;
	line-height: 1.45;
}

.feat-slab {
	padding: clamp(56px, 7vw, 110px) 0;
	border-bottom: 1px solid var(--rule);
}

.feat {
	display: grid;
	grid-template-columns: 1.2fr 1fr;
	gap: clamp(40px, 5vw, 90px);
	align-items: center;
}

.feat .frame {
	aspect-ratio: 4/3;
	background:
		radial-gradient(circle at 20% 20%, rgba(184,132,90,.22), transparent 0 30%),
		radial-gradient(circle at 82% 76%, rgba(36,29,26,.08), transparent 0 24%),
		linear-gradient(135deg, #f1e7d8 0%, #ebe0cf 58%, #e3d6c4 100%);
	border: 1px solid var(--rule);
	position: relative;
	overflow: hidden;
	display: grid;
	place-items: center;
}
.feat .frame::before {
	content: "";
	position: absolute;
	inset: 18px;
	border: 1px solid rgba(44,31,24,.1);
	pointer-events: none;
}

.feat .frame .badge {
	position: absolute;
	top: 20px;
	left: 20px;
	font-family: var(--serif);
	font-style: italic;
	font-size: 12px;
	color: var(--ink-soft);
	letter-spacing: .14em;
	text-transform: uppercase;
	border: 1px solid var(--rule-strong);
	padding: 8px 14px;
}

.feat .frame .placeholder-note {
	font-family: var(--serif);
	font-style: italic;
	font-size: 13px;
	color: rgba(66,50,38,.42);
	opacity: 1;
	letter-spacing: .1em;
	text-transform: uppercase;
}

.feat .txt .kicker {
	font-family: var(--serif);
	font-style: italic;
	font-size: 13px;
	color: var(--terre);
	letter-spacing: .12em;
	text-transform: uppercase;
	margin-bottom: 22px;
	display: inline-block;
}

.feat .txt .kicker::before {
	content: "";
	display: inline-block;
	width: 32px;
	height: 1px;
	background: var(--terre);
	vertical-align: middle;
	margin-right: 12px;
}

.feat .txt h2 {
	font-family: var(--serif);
	font-weight: 300;
	font-size: clamp(32px, 4.4vw, 68px);
	line-height: .98;
	letter-spacing: -.02em;
}

.feat .txt h2 em { font-style: italic; font-weight: 400; color: var(--terre); }
.feat .txt .lede {
	margin-top: clamp(22px, 2.4vw, 34px);
	font-family: var(--read);
	font-size: 17px;
	line-height: 1.65;
	color: var(--ink-soft);
	max-width: 52ch;
}

.feat .txt .meta-line {
	margin-top: 28px;
	display: flex;
	gap: 20px;
	flex-wrap: wrap;
	font-family: var(--serif);
	font-style: italic;
	font-size: 13px;
	color: var(--ink);
	letter-spacing: .04em;
}

.feat .txt .meta-line span + span::before {
	content: "·";
	color: var(--terre);
	margin-right: 20px;
}

.feat .txt .readmore {
	margin-top: 36px;
	display: inline-flex;
	align-items: center;
	gap: 14px;
	font-family: var(--serif);
	font-size: 13px;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--ink);
	border-bottom: 1px solid var(--ink);
	padding-bottom: 6px;
}

.feat .txt .readmore::after { content: "→"; font-style: italic; font-size: 18px; }

.articles-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	border-top: 1px solid var(--rule);
	border-left: 1px solid var(--rule);
	margin-top: clamp(48px, 5.5vw, 88px);
}

.art-card {
	border-right: 1px solid var(--rule);
	border-bottom: 1px solid var(--rule);
	padding: clamp(32px, 3.4vw, 48px) clamp(24px, 2.6vw, 36px);
	background: var(--paper);
	transition: background .35s;
	display: flex;
	flex-direction: column;
	min-height: 320px;
	cursor: pointer;
}

.art-card:hover { background: var(--paper-2); }

.art-card__media {
	position: relative;
	aspect-ratio: 4 / 3;
	overflow: hidden;
	border: 1px solid var(--rule);
	background: #d9c3ab;
	margin-bottom: 20px;
}

.art-card__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	filter: saturate(.94) contrast(1.16) brightness(.96);
	transform: scale(1);
	transition: transform .85s ease, filter .85s ease;
}

.art-card__media::after {
	content: "";
	position: absolute;
	inset: 0;
	background:
		linear-gradient(180deg, rgba(14, 10, 8, .02) 0%, rgba(14, 10, 8, .08) 36%, rgba(14, 10, 8, .46) 100%),
		radial-gradient(ellipse 62% 56% at 76% 76%, rgba(10, 7, 6, .16), transparent 72%);
	pointer-events: none;
}

.art-card__media-badge,
.art-card__media-meta {
	position: absolute;
	z-index: 1;
	font-family: var(--serif);
	font-style: italic;
	color: var(--paper);
}

.art-card__media-badge {
	top: 16px;
	left: 16px;
	font-size: 11px;
	letter-spacing: .14em;
	text-transform: uppercase;
	border: 1px solid rgba(244, 237, 224, .42);
	background: rgba(16, 12, 10, .18);
	backdrop-filter: blur(8px);
	padding: 7px 12px;
}

.art-card__media-meta {
	right: 16px;
	bottom: 16px;
	font-size: 11px;
	letter-spacing: .12em;
	text-transform: uppercase;
}

.art-card:hover .art-card__media img {
	filter: saturate(1.02) contrast(1.2) brightness(.98);
	transform: scale(1.05);
}

.art-card .num {
	font-family: var(--serif);
	font-style: italic;
	font-size: 12px;
	color: var(--terre);
	letter-spacing: .1em;
	margin-bottom: 18px;
}

.art-card .cat {
	font-family: var(--serif);
	font-style: italic;
	font-size: 11px;
	color: var(--ink-soft);
	letter-spacing: .14em;
	text-transform: uppercase;
	padding-bottom: 14px;
	margin-bottom: 18px;
	border-bottom: 1px solid var(--rule);
}

.art-card h3 {
	font-family: var(--serif);
	font-weight: 400;
	font-size: clamp(20px, 1.8vw, 26px);
	line-height: 1.15;
	letter-spacing: -.005em;
	margin-bottom: 14px;
}

.art-card h3 em { font-style: italic; color: var(--terre); }
.art-card p {
	font-family: var(--read);
	font-size: 14.5px;
	line-height: 1.6;
	color: var(--ink-soft);
	flex: 1;
	display: -webkit-box;
	-webkit-line-clamp: 4;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.art-card .meta {
	margin-top: 22px;
	padding-top: 18px;
	border-top: 1px solid var(--rule);
	font-family: var(--serif);
	font-style: italic;
	font-size: 12px;
	color: var(--ink-soft);
	letter-spacing: .04em;
	display: flex;
	justify-content: space-between;
}

.cats-line {
	display: flex;
	gap: clamp(12px, 1.4vw, 22px);
	flex-wrap: wrap;
	justify-content: center;
	padding: clamp(40px, 4.5vw, 72px) 0;
	border-top: 1px solid var(--rule);
	border-bottom: 1px solid var(--rule);
}

.cat-pill {
	font-family: var(--serif);
	font-size: 13px;
	padding: 12px 22px;
	border: 1px solid var(--rule);
	color: var(--ink);
	letter-spacing: .02em;
	transition:
		background-color .35s,
		border-color .35s,
		color .35s,
		transform .35s;
}

.cat-pill:hover,
.cat-pill.active {
	background: var(--ink);
	color: var(--paper);
	border-color: var(--ink);
}

.cat-pill em { font-style: italic; color: var(--terre); }
.cat-pill:hover em,
.cat-pill.active em { color: var(--terre-soft); }

.article-visual {
	margin: clamp(36px, 4vw, 64px) 0 0;
	aspect-ratio: 16/9;
	border: 1px solid var(--rule);
	background:
		radial-gradient(circle at 18% 24%, rgba(184,132,90,.22), transparent 0 28%),
		radial-gradient(circle at 78% 78%, rgba(33,22,48,.08), transparent 0 24%),
		linear-gradient(135deg, #f0e4d4 0%, #eadfce 58%, #e4d7c4 100%);
	display: grid;
	place-items: center;
	position: relative;
}
.article-visual::before {
	content: "";
	position: absolute;
	inset: 22px;
	border: 1px solid rgba(44,31,24,.1);
	pointer-events: none;
}

.article-visual .badge {
	position: absolute;
	top: 24px;
	left: 24px;
	font-family: var(--serif);
	font-style: italic;
	font-size: 12px;
	color: var(--ink-soft);
	letter-spacing: .14em;
	text-transform: uppercase;
	border: 1px solid var(--rule-strong);
	padding: 8px 14px;
}

.article-visual .placeholder-note {
	font-family: var(--serif);
	font-style: italic;
	font-size: 14px;
	color: rgba(66,50,38,.42);
	opacity: 1;
	letter-spacing: .1em;
	text-transform: uppercase;
}

.article-visual .cap {
	position: absolute;
	bottom: 20px;
	left: 24px;
	right: 24px;
	font-family: var(--serif);
	font-style: italic;
	font-size: 12px;
	color: var(--ink-soft);
	letter-spacing: .04em;
	max-width: 58ch;
}

.article-visual .cap::before {
	content: "";
	display: block;
	width: 30px;
	height: 1px;
	background: var(--terre);
	margin-bottom: 8px;
}

.article-body a {
	color: var(--terre);
	border-bottom: 1px solid rgba(122, 59, 31, .35);
	padding-bottom: 1px;
	transition: color .3s, border-color .3s;
}

.article-body a:hover {
	color: var(--ink);
	border-color: rgba(26, 20, 16, .42);
}

.with-toc {
	display: grid;
	grid-template-columns: 1fr 220px;
	gap: clamp(32px, 4vw, 64px);
	max-width: 960px;
	margin: 0 auto;
	padding: 0 var(--gutter);
}

.with-toc .article-body {
	padding-left: 0;
	padding-right: 0;
	margin: 0;
}

.toc {
	position: sticky;
	top: 120px;
	align-self: start;
	padding-top: clamp(48px, 6vw, 96px);
	font-family: var(--serif);
	font-size: 13px;
	border-left: 1px solid var(--rule);
	padding-left: 20px;
}

.toc .label {
	font-style: italic;
	color: var(--terre);
	letter-spacing: .12em;
	text-transform: uppercase;
	font-size: 11px;
	margin-bottom: 18px;
	display: block;
}

.toc ol {
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.toc li { line-height: 1.4; }
.toc a {
	color: var(--ink-soft);
	display: flex;
	gap: 10px;
	transition: color .3s, padding-left .3s;
}

.toc a:hover { color: var(--terre); padding-left: 4px; }
.toc .num {
	font-style: italic;
	color: var(--terre);
	font-size: 11px;
	flex-shrink: 0;
	margin-top: 2px;
}

.related {
	border-top: 1px solid var(--rule);
	padding: clamp(56px, 7vw, 110px) 0;
	background: var(--paper);
}

.atouts {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	border-top: 1px solid var(--rule-strong);
	border-bottom: 1px solid var(--rule-strong);
	margin-top: clamp(40px, 5vw, 72px);
}

.atout {
	border-right: 1px solid var(--rule);
	padding: clamp(32px, 3.4vw, 56px) clamp(22px, 2.4vw, 36px);
	min-height: 260px;
	display: flex;
	flex-direction: column;
}

.atout:last-child { border-right: 0; }
.atout .v {
	font-family: var(--serif);
	font-weight: 300;
	font-size: clamp(48px, 6vw, 96px);
	line-height: .86;
	letter-spacing: -.02em;
	color: var(--ink);
}

.atout .v em { font-style: italic; color: var(--terre); font-weight: 400; }
.atout .v sup {
	font-size: .32em;
	vertical-align: super;
	font-style: italic;
	color: var(--terre);
	font-weight: 400;
	margin-left: 4px;
}

.atout .k {
	margin-top: 22px;
	font-family: var(--serif);
	font-style: italic;
	font-size: 12px;
	color: var(--ink-soft);
	letter-spacing: .04em;
	line-height: 1.5;
}

.atout .body {
	margin-top: auto;
	padding-top: 20px;
	border-top: 1px solid var(--rule);
	font-family: var(--read);
	font-size: 13.5px;
	line-height: 1.55;
	color: var(--ink-soft);
}

.stays {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	border-top: 1px solid var(--rule);
	border-left: 1px solid var(--rule);
}

.stay {
	border-right: 1px solid var(--rule);
	border-bottom: 1px solid var(--rule);
	background: var(--paper);
	transition: background .35s;
	display: flex;
	flex-direction: column;
}

.stay:hover { background: var(--paper-2); }
.stay .photo {
	aspect-ratio: 5/4;
	background: #cfb69c;
	display: grid;
	grid-template-rows: auto 1fr auto;
	padding: clamp(22px, 2.4vw, 32px);
	border-bottom: 1px solid var(--rule);
	position: relative;
	overflow: hidden;
}

.stay .photo::before {
	content: "";
	position: absolute;
	inset: 16px;
	border: 1px solid rgba(244, 237, 224, .16);
	pointer-events: none;
}

.stay .photo::after {
	content: "";
	position: absolute;
	inset: 0;
	background:
		linear-gradient(180deg, rgba(14, 10, 8, .05) 0%, rgba(14, 10, 8, .1) 42%, rgba(14, 10, 8, .68) 100%),
		radial-gradient(ellipse 60% 54% at 76% 78%, rgba(10, 7, 6, .3), transparent 72%);
	pointer-events: none;
}

.stay .photo img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	filter: saturate(.95) contrast(1.04);
	transform: scale(1);
	transition: transform .85s ease, filter .85s ease;
}

.stay:hover .photo img {
	filter: saturate(1.03) contrast(1.06);
	transform: scale(1.05);
}

.stay .photo .ref {
	position: relative;
	z-index: 1;
	align-self: start;
	justify-self: start;
	font-family: var(--serif);
	font-style: italic;
	font-size: 11px;
	color: var(--paper);
	letter-spacing: .18em;
	text-transform: uppercase;
	border: 1px solid rgba(244, 237, 224, .42);
	background: rgba(16, 12, 10, .14);
	backdrop-filter: blur(6px);
	padding: 6px 12px;
}

.stay .photo .photo-note {
	position: relative;
	z-index: 1;
	align-self: end;
	justify-self: start;
	grid-row: 3;
	max-width: 18ch;
	font-family: var(--serif);
	font-style: italic;
	font-size: 11px;
	letter-spacing: .08em;
	color: rgba(244, 237, 224, .92);
	text-transform: uppercase;
}

.stay .photo .capacity {
	position: relative;
	z-index: 1;
	align-self: end;
	justify-self: end;
	grid-row: 3;
	font-family: var(--serif);
	font-style: italic;
	font-weight: 300;
	font-size: clamp(22px, 2.4vw, 32px);
	line-height: .9;
	letter-spacing: -.01em;
	color: var(--paper);
	opacity: .88;
	text-shadow: 0 1px 10px rgba(0, 0, 0, .3);
}

.stay .body {
	padding: clamp(24px, 2.6vw, 36px);
	display: flex;
	flex-direction: column;
	flex: 1;
}
.stay .quartier {
	font-family: var(--serif);
	font-style: italic;
	font-size: 12px;
	color: var(--terre);
	letter-spacing: .08em;
	text-transform: uppercase;
}

.stay h3 {
	font-family: var(--serif);
	font-weight: 400;
	font-size: clamp(18px, 1.5vw, 23px);
	line-height: 1.15;
	margin: 10px 0 16px;
	text-wrap: balance;
}

.stay h3 em { font-style: italic; color: var(--terre); }

.stay .body p {
	margin: 0 0 18px;
	font-family: var(--read);
	font-size: 14px;
	line-height: 1.62;
	color: var(--ink-soft);
	flex: 1;
}

.stay .specs {
	display: flex;
	flex-wrap: wrap;
	border-top: 1px solid var(--rule);
	padding-top: 14px;
	font-family: var(--serif);
	font-style: italic;
	font-size: 12px;
	color: var(--ink-soft);
}

.stay .specs span {
	padding-right: 12px;
	margin-right: 12px;
	border-right: 1px solid var(--rule);
}

.stay .specs span:last-child { border-right: 0; margin-right: 0; }

.contact-slab {
	background: var(--ink);
	color: var(--paper);
	padding: clamp(56px, 6.4vw, 96px) 0;
	position: relative;
	overflow: hidden;
}

.contact-slab::before {
	content: "";
	position: absolute;
	inset: 0;
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%25' height='100%25' filter='url(%23n)' opacity='0.6'/></svg>");
	opacity: .15;
	mix-blend-mode: overlay;
	pointer-events: none;
}

.contact-slab > .wrap { position: relative; z-index: 1; }
.contact-slab .head {
	max-width: 720px;
	margin: 0 auto clamp(32px, 3.8vw, 56px);
	text-align: center;
}

.contact-slab .head .lot {
	font-family: var(--serif);
	font-style: italic;
	font-size: 13px;
	color: var(--terre-soft);
	letter-spacing: .16em;
	text-transform: uppercase;
	display: inline-block;
	margin-bottom: 20px;
}

.contact-slab .head h2 {
	font-family: var(--serif);
	font-weight: 300;
	font-size: clamp(30px, 3.5vw, 54px);
	line-height: .98;
	letter-spacing: -.022em;
	color: var(--paper);
}

.contact-slab .head h2 em { font-style: italic; font-weight: 400; color: var(--terre-soft); }
.contact-info {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: clamp(20px, 2.4vw, 34px);
	max-width: 940px;
	margin: 0 auto;
	border-top: 1px solid rgba(244,237,224,.18);
	border-bottom: 1px solid rgba(244,237,224,.18);
	padding: clamp(28px, 3.4vw, 44px) 0;
}

.contact-info .block { text-align: center; }
.contact-info .label {
	font-family: var(--serif);
	font-style: italic;
	font-size: 12px;
	color: var(--terre-soft);
	letter-spacing: .1em;
	text-transform: uppercase;
	margin-bottom: 14px;
}

.contact-info .val {
	font-family: var(--serif);
	font-weight: 400;
	font-size: clamp(17px, 1.6vw, 21px);
	line-height: 1.3;
	color: var(--paper);
}

.contact-info .val em { font-style: italic; color: var(--terre-soft); }
.contact-info a {
	color: var(--paper);
	border-bottom: 1px solid rgba(244,237,224,.3);
	padding-bottom: 2px;
}

.contact-info a:hover { color: var(--terre-soft); }

.section-cta {
	display: flex;
	justify-content: center;
	margin-top: clamp(28px, 3.6vw, 48px);
}

.section-cta--light .btn-light {
	min-width: min(100%, 320px);
	justify-content: center;
}

@media (max-width: 960px) {
	.typologies,
	.offers,
	.articles-grid,
	.cat-grid,
	.atouts,
	.contact-info {
		grid-template-columns: 1fr 1fr;
	}
}

@media (max-width: 900px) {
	.hero-partner .inner,
	.feat,
	.with-toc,
	.why-vitry {
		grid-template-columns: 1fr;
	}

	.toc {
		position: static;
		border-left: 0;
		border-top: 1px solid var(--rule);
		padding-left: 0;
		padding-top: 24px;
		margin-top: 32px;
	}
}

@media (max-width: 760px) {
	.post { grid-template-columns: 1fr; gap: 10px; }
	.ops-grid,
	.why-vitry .txt .stats {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 560px) {
	.typologies,
	.offers,
	.articles-grid,
	.cat-grid,
	.atouts,
	.stays,
	.contact-info {
		grid-template-columns: 1fr;
	}
}

/* ==========================================================================
   21. ARTICLE — Long-form (blog)
   ========================================================================== */

.article-head {
	padding: clamp(72px, 9vw, 140px) 0 clamp(44px, 5vw, 72px);
	border-bottom: 1px solid var(--rule);
	position: relative;
}
.article-head .chapter-roman {
	position: absolute;
	right: clamp(-10px, 2vw, 40px);
	top: clamp(72px, 9vw, 140px);
	font-family: var(--serif);
	font-style: italic;
	font-weight: 300;
	font-size: clamp(180px, 28vw, 480px);
	line-height: .8;
	color: var(--terre);
	opacity: .08;
	pointer-events: none;
	user-select: none;
	font-variation-settings: "opsz" 144, "SOFT" 100;
	z-index: 0;
}
.article-head > .wrap { position: relative; z-index: 1; }
.article-head .kicker {
	font-family: var(--serif);
	font-style: italic;
	font-size: 13px;
	color: var(--terre);
	letter-spacing: .12em;
	text-transform: uppercase;
	margin-bottom: clamp(22px, 2.4vw, 36px);
	display: inline-block;
}
.article-head .kicker::before {
	content: "";
	display: inline-block;
	width: 40px;
	height: 1px;
	background: var(--terre);
	vertical-align: middle;
	margin-right: 14px;
}
.article-head h1 {
	font-family: var(--serif);
	font-weight: 300;
	line-height: .96;
	letter-spacing: -.024em;
	font-variation-settings: "opsz" 144, "SOFT" 50;
	font-size: clamp(40px, 6vw, 96px);
	max-width: 16ch;
}
.article-head h1 em {
	font-style: italic;
	font-weight: 400;
	color: var(--terre);
	font-variation-settings: "opsz" 144, "SOFT" 100;
}
.article-head .byline {
	margin-top: clamp(32px, 3.8vw, 56px);
	padding-top: clamp(20px, 2.4vw, 32px);
	border-top: 1px solid var(--rule);
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	font-family: var(--serif);
	font-style: italic;
	font-size: 13px;
	color: var(--ink-soft);
	letter-spacing: .04em;
	flex-wrap: wrap;
	gap: 12px;
}
.article-head .byline .author { color: var(--ink); }
.article-head .standfirst {
	margin-top: clamp(36px, 4vw, 56px);
	font-family: var(--read);
	font-weight: 300;
	font-size: clamp(18px, 2vw, 24px);
	line-height: 1.5;
	color: var(--ink);
	max-width: 68ch;
}
.article-head .standfirst em { font-style: italic; color: var(--terre); }

/* Corps article */
.article-body {
	max-width: 680px;
	margin: 0 auto;
	padding: clamp(48px, 6vw, 96px) 0 clamp(64px, 8vw, 120px);
	font-family: var(--read);
	font-size: 18px;
	line-height: 1.75;
	color: var(--ink);
}
.article-body > p { margin-bottom: 22px; }
.article-body > p:first-of-type::first-letter {
	font-family: var(--serif);
	font-weight: 300;
	font-style: normal;
	float: left;
	font-size: clamp(96px, 12vw, 140px);
	line-height: .8;
	margin: 8px 14px 0 -4px;
	color: var(--terre);
	font-variation-settings: "opsz" 144, "SOFT" 100;
}
.article-body h2 {
	font-family: var(--serif);
	font-weight: 400;
	font-size: clamp(26px, 2.8vw, 40px);
	line-height: 1.1;
	letter-spacing: -.015em;
	margin: clamp(40px, 5vw, 72px) 0 clamp(18px, 2vw, 28px);
	font-variation-settings: "opsz" 48, "SOFT" 50;
}
.article-body h2 em {
	font-style: italic;
	color: var(--terre);
	font-weight: 400;
	font-variation-settings: "opsz" 144, "SOFT" 100;
}
.article-body h3 {
	font-family: var(--serif);
	font-weight: 400;
	font-style: italic;
	font-size: clamp(20px, 2vw, 26px);
	margin: clamp(28px, 3.4vw, 44px) 0 14px;
	color: var(--terre);
}
.article-body blockquote.pull {
	margin: clamp(40px, 5vw, 72px) 0;
	padding: 0 0 0 clamp(20px, 3vw, 48px);
	border-left: 2px solid var(--terre);
	font-family: var(--serif);
	font-style: italic;
	font-weight: 300;
	font-size: clamp(24px, 2.8vw, 40px);
	line-height: 1.25;
	letter-spacing: -.015em;
	color: var(--ink);
	font-variation-settings: "opsz" 144, "SOFT" 100;
}
.article-body a.inline {
	color: var(--terre);
	border-bottom: 1px solid var(--terre);
	padding-bottom: 1px;
	transition: color .3s, border-color .3s;
}
.article-body a.inline:hover { color: var(--ink); border-color: var(--ink); }
.article-body .standout {
	margin: clamp(40px, 5vw, 64px) 0;
	padding: clamp(28px, 3vw, 44px);
	border: 1px solid var(--rule-strong);
	background: var(--paper-2);
	font-family: var(--serif);
	font-style: italic;
	font-size: 16px;
	line-height: 1.55;
	color: var(--ink-soft);
}
.article-body .sources {
	margin-top: clamp(48px, 6vw, 80px);
	padding-top: 24px;
	border-top: 1px solid var(--rule);
	font-family: var(--serif);
	font-style: italic;
	font-size: 13px;
	color: var(--ink-soft);
	line-height: 1.55;
}
.article-body .sources strong {
	display: block;
	font-style: normal;
	color: var(--ink);
	letter-spacing: .08em;
	text-transform: uppercase;
	font-size: 11px;
	margin-bottom: 10px;
}

/* ==========================================================================
   22. ÉQUIPE — team-hero + grille de cartes
   ========================================================================== */

.team-hero {
	margin-bottom: clamp(24px, 2.8vw, 38px);
	display: grid;
	grid-template-columns: 1.4fr 1fr;
	gap: 0;
	border: 1px solid var(--rule);
	background: var(--paper);
}
.team-hero .frame {
	position: relative;
	overflow: hidden;
	border-right: 1px solid var(--rule);
	aspect-ratio: 4/3;
}
.team-hero .frame img {
	width: 100%; height: 100%;
	object-fit: cover;
	filter: grayscale(.18) contrast(1.03) sepia(.06);
	display: block;
}
.team-hero .frame .pl {
	position: absolute;
	left: 20px;
	bottom: 20px;
	font-family: var(--serif);
	font-style: italic;
	font-size: 12px;
	color: var(--paper);
	letter-spacing: .12em;
	text-transform: uppercase;
	text-shadow: 0 1px 8px rgba(0,0,0,.45);
}
.team-hero .cap {
	padding: clamp(22px, 2.4vw, 34px);
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 18px;
}
.team-hero .cap .label {
	font-family: var(--serif);
	font-style: italic;
	font-size: 12px;
	color: var(--terre);
	letter-spacing: .12em;
	text-transform: uppercase;
}
.team-hero .cap h3 {
	font-family: var(--serif);
	font-weight: 300;
	font-size: clamp(22px, 2.2vw, 32px);
	line-height: 1.05;
	letter-spacing: -.015em;
	margin-top: 12px;
	max-width: 18ch;
	font-variation-settings: "opsz" 144, "SOFT" 50;
}
.team-hero .cap h3 em { font-style: italic; color: var(--terre); font-weight: 400; }
.team-hero .cap p {
	font-family: var(--read);
	font-size: 14px;
	line-height: 1.58;
	color: var(--ink-soft);
	font-weight: 300;
	max-width: 38ch;
	margin-top: 14px;
}
.team-hero .cap .sign {
	display: flex;
	justify-content: space-between;
	gap: 20px;
	padding-top: 18px;
	border-top: 1px solid var(--rule);
	font-family: var(--serif);
	font-style: italic;
	font-size: 12px;
	color: var(--ink-soft);
	letter-spacing: .04em;
}
.team-hero .cap .sign .cat { color: var(--terre); }

@media (max-width: 860px) {
	.team-hero { grid-template-columns: 1fr; }
	.team-hero .frame { border-right: 0; border-bottom: 1px solid var(--rule); }
	.team-hero .cap { justify-content: flex-start; }
	.team-hero .cap .sign {
		flex-direction: column;
		justify-content: flex-start;
		gap: 14px;
	}
}

.team {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	border-top: 1px solid var(--rule);
	border-left: 1px solid var(--rule);
}
.team-card {
	border-right: 1px solid var(--rule);
	border-bottom: 1px solid var(--rule);
	background: var(--paper);
	transition: background .4s;
}
.team-card:hover { background: var(--paper-2); }
.team-card .portrait {
	aspect-ratio: 4/5;
	border-bottom: 1px solid var(--rule);
	position: relative;
	overflow: hidden;
	background: var(--paper-2);
}
.team-card .portrait img {
	width: 100%; height: 100%;
	object-fit: cover;
	display: block;
	filter: grayscale(.55) contrast(1.02) sepia(.1);
	transition: filter .6s ease;
}
.team-card:hover .portrait img { filter: grayscale(0) contrast(1.04) sepia(.04); }
.team-card .body { padding: clamp(20px, 2.2vw, 28px); }
.team-card .name {
	font-family: var(--serif);
	font-weight: 400;
	font-size: clamp(18px, 1.35vw, 22px);
	line-height: 1.15;
	letter-spacing: -.005em;
	font-variation-settings: "opsz" 48;
}
.team-card .name em { font-style: italic; color: var(--terre); }
.team-card .role {
	margin-top: 4px;
	font-family: var(--serif);
	font-style: italic;
	font-size: 12px;
	color: var(--terre);
	letter-spacing: .04em;
}
.team-card blockquote {
	margin-top: 18px;
	padding-top: 18px;
	border-top: 1px solid var(--rule);
	font-family: var(--read);
	font-style: italic;
	font-size: 14px;
	line-height: 1.55;
	color: var(--ink-soft);
}
.team-card blockquote::before { content: "\00ab\00a0"; color: var(--terre); }
.team-card blockquote::after { content: "\00a0\00bb"; color: var(--terre); }

@media (max-width: 980px) { .team { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .team { grid-template-columns: 1fr; } }

/* ==========================================================================
   23. UTILITIES — .tbc, .btn, .placeholder
   ========================================================================== */

.tbc {
	color: var(--ink-soft);
	opacity: .5;
	font-style: italic;
}
.section.journal-dark .tbc,
.form-section .tbc,
.invite .tbc { color: rgba(244,237,224,.4); }

/* Boutons éditoriaux */
.btn {
	font-family: var(--serif);
	display: inline-flex;
	align-items: center;
	gap: 12px;
	padding: 15px 24px;
	font-size: 12px;
	font-weight: 400;
	letter-spacing: .06em;
	transition:
		background-color .35s cubic-bezier(.7,0,.2,1),
		color .35s cubic-bezier(.7,0,.2,1),
		border-color .35s cubic-bezier(.7,0,.2,1),
		transform .35s cubic-bezier(.7,0,.2,1),
		box-shadow .35s cubic-bezier(.7,0,.2,1);
	text-transform: uppercase;
	cursor: pointer;
}
.btn .arr {
	font-family: var(--serif);
	font-style: italic;
	font-size: 18px;
	line-height: 0;
	transition: transform .35s;
	text-transform: none;
}
.btn:hover .arr { transform: translateX(8px); }

.btn-primary { background: var(--terre); color: var(--paper); }
.btn-primary:hover { background: var(--ink); }
.btn-ghost { background: transparent; color: var(--ink); border: 1px solid var(--ink); }
.btn-ghost:hover { background: var(--ink); color: var(--paper); }
.btn-light { background: transparent; color: var(--paper); border: 1px solid var(--paper); }
.btn-light:hover { background: var(--paper); color: var(--ink); }
.btn-block { width: 100%; justify-content: space-between; }

/* ==========================================================================
   24. FRONT POLISH — Nav cohérente, échelle apaisée, respirations resserrées
   ========================================================================== */

.dark-form .radio-group label {
	transition: background-color .3s, border-color .3s, color .3s;
}

.home-index {
	padding: 18px 0 0;
}

.home-index__inner {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px 12px;
	padding-top: 18px;
	border-top: 1px solid var(--rule);
}

.home-index__label {
	font-family: var(--serif);
	font-style: italic;
	font-size: 13px;
	color: var(--ink-soft);
	margin-right: 4px;
}

.home-index__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 10px 16px;
	border: 1px solid var(--rule);
	background: var(--paper);
	font-family: var(--serif);
	font-size: 12px;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--ink);
	transition: background-color .35s, border-color .35s, color .35s, transform .35s;
}

.home-index__link:hover {
	background: var(--paper-2);
	border-color: var(--rule-strong);
	color: var(--terre);
	transform: translateY(-1px);
}

.home .hero {
	padding-bottom: clamp(22px, 2.8vw, 40px);
}

.home .figures .item {
	padding: clamp(18px, 1.8vw, 28px) clamp(18px, 2vw, 28px);
}

.home .figures .v,
.home .figures .v.placeholder {
	font-size: clamp(34px, 3.8vw, 54px);
}

.home .figures .k {
	font-size: 11.5px;
	line-height: 1.5;
}

.home #metiers.section {
	padding-top: clamp(56px, 6vw, 88px);
}

.home #biens.section,
.home #quartiers.section,
.home #equipe.section,
.home #vox.section,
.home #partenaires.section {
	padding-top: clamp(52px, 5.8vw, 84px);
	padding-bottom: clamp(56px, 6vw, 88px);
}

.home #journal.section {
	padding-top: clamp(60px, 6.2vw, 92px);
	padding-bottom: clamp(60px, 6.4vw, 96px);
}

.home #equipe .section-head {
	margin-bottom: clamp(22px, 2.6vw, 34px);
}

.listing .body {
	padding: clamp(20px, 2.2vw, 28px);
}

.listing h3 {
	margin: 10px 0 14px;
	font-size: clamp(19px, 1.45vw, 23px);
}

.listing .specs {
	padding-top: 14px;
}

.listing .specs span {
	font-size: 12px;
}

.blog-hero {
	padding: clamp(40px, 5vw, 72px) 0 clamp(28px, 3vw, 46px);
}

.blog-hero .ours {
	padding-bottom: clamp(20px, 2.4vw, 34px);
	margin-bottom: clamp(24px, 3vw, 42px);
}

.blog-hero h1 {
	font-size: clamp(42px, 7vw, 118px);
	line-height: .92;
}

.blog-hero .tagline {
	margin-top: clamp(20px, 2.4vw, 32px);
	max-width: 48ch;
	font-size: clamp(16px, 1.5vw, 21px);
}

.feat-slab {
	padding: clamp(40px, 4.8vw, 72px) 0;
}

.feat {
	gap: clamp(28px, 3.6vw, 56px);
}

.feat .txt .kicker {
	margin-bottom: 16px;
	font-size: 12px;
}

.feat .txt h2 {
	font-size: clamp(28px, 3.6vw, 54px);
}

.feat .txt .lede {
	margin-top: 18px;
	max-width: 48ch;
	font-size: 15.5px;
}

.feat .txt .meta-line {
	margin-top: 20px;
	font-size: 12px;
}

.feat .txt .readmore {
	margin-top: 26px;
	font-size: 12px;
}

.cat {
	padding: clamp(24px, 2.6vw, 34px) clamp(18px, 2vw, 28px);
	min-height: 210px;
}

.cat h3 {
	font-size: clamp(19px, 1.45vw, 24px);
}

.cat p {
	font-size: 14px;
	line-height: 1.55;
}

.articles-grid {
	margin-top: clamp(32px, 3.8vw, 56px);
}

.art-card {
	min-height: 280px;
	padding: clamp(24px, 2.8vw, 36px) clamp(20px, 2.2vw, 28px);
}

.art-card .num {
	margin-bottom: 14px;
}

.art-card .cat {
	margin-bottom: 14px;
	padding-bottom: 10px;
}

.art-card h3 {
	margin-bottom: 10px;
	font-size: clamp(19px, 1.5vw, 24px);
}

.art-card p {
	font-size: 14px;
	line-height: 1.55;
}

.art-card .meta {
	margin-top: 18px;
	padding-top: 14px;
	font-size: 11.5px;
}

.cats-line {
	gap: 10px 12px;
	padding: clamp(28px, 3.6vw, 48px) 0;
}

.cat-pill {
	padding: 10px 18px;
	font-size: 12px;
	transition: background-color .35s, border-color .35s, color .35s, transform .35s;
}

.cat-pill:hover,
.cat-pill.active {
	transform: translateY(-1px);
}

.article-head {
	padding: clamp(52px, 6vw, 92px) 0 clamp(32px, 4vw, 52px);
}

.article-head .chapter-roman {
	top: clamp(52px, 6vw, 92px);
	font-size: clamp(120px, 22vw, 320px);
}

.article-head .kicker {
	margin-bottom: clamp(18px, 2vw, 28px);
	font-size: 12px;
}

.article-head .kicker::before {
	width: 28px;
	margin-right: 10px;
}

.article-head h1 {
	max-width: 15ch;
	font-size: clamp(34px, 4.8vw, 76px);
	text-wrap: balance;
}

.article-head .byline {
	margin-top: clamp(24px, 2.8vw, 40px);
	padding-top: clamp(16px, 1.8vw, 24px);
	font-size: 12px;
}

.article-head .standfirst {
	margin-top: clamp(26px, 3vw, 42px);
	max-width: 60ch;
	font-size: clamp(17px, 1.65vw, 21px);
}

.article-body {
	max-width: 660px;
	padding: clamp(36px, 4.8vw, 72px) 0 clamp(48px, 6vw, 88px);
	font-size: 17px;
	line-height: 1.68;
}

.article-body > p {
	margin-bottom: 18px;
}

.article-body > p:first-of-type::first-letter {
	margin: 6px 12px 0 -2px;
	font-size: clamp(74px, 10vw, 110px);
}

.article-body h2 {
	margin: clamp(30px, 3.4vw, 48px) 0 clamp(14px, 1.4vw, 20px);
	font-size: clamp(24px, 2.3vw, 34px);
}

.article-body h3 {
	margin: clamp(22px, 2.6vw, 34px) 0 10px;
	font-size: clamp(18px, 1.6vw, 23px);
}

.article-body blockquote.pull {
	margin: clamp(28px, 3.6vw, 48px) 0;
	padding-left: clamp(16px, 2vw, 28px);
	font-size: clamp(20px, 2.2vw, 30px);
}

.article-body .standout {
	margin: clamp(30px, 3.4vw, 48px) 0;
	padding: clamp(22px, 2.4vw, 32px);
	font-size: 15px;
}

.atout {
	min-height: 220px;
	padding: clamp(24px, 2.8vw, 40px) clamp(18px, 2vw, 28px);
}

.atout .v {
	font-size: clamp(40px, 5vw, 72px);
}

.atout .k {
	margin-top: 16px;
	font-size: 11.5px;
}

.atout .body {
	padding-top: 16px;
	font-size: 13px;
}

.stay .photo {
	padding: clamp(18px, 2vw, 28px);
}

.stay .body {
	padding: clamp(20px, 2.2vw, 30px);
}

.invite {
	padding: clamp(48px, 5.4vw, 84px) 0;
}

.invite-grid {
	gap: clamp(30px, 4vw, 60px);
}

.invite-text h2 {
	margin-top: 16px;
	font-size: clamp(30px, 3.4vw, 48px);
}

.invite-text .lede {
	margin-top: 20px;
	max-width: 44ch;
	font-size: 15px;
}

.invite-text .sign {
	margin-top: 28px;
	font-size: 14px;
}

.invite .form,
.invite .dm-form-bridge {
	padding: clamp(24px, 2.4vw, 34px);
}

.invite .form-title {
	margin-bottom: 24px;
	padding-bottom: 14px;
}

.invite .form .row {
	margin-bottom: 16px;
}

.big-submit,
.form-section .ff-btn-submit,
.invite .form .submit {
	padding: 18px 30px !important;
	font-size: 12px !important;
	gap: 14px;
}

.big-submit .arr,
.invite .form .submit .arr {
	font-size: 18px;
}

.team-hero .cap p,
.team-card blockquote {
	font-size: 14px;
	line-height: 1.58;
}

.btn {
	gap: 10px;
	padding: 14px 20px;
	font-size: 11.5px;
	transition:
		background-color .35s cubic-bezier(.7,0,.2,1),
		border-color .35s cubic-bezier(.7,0,.2,1),
		color .35s cubic-bezier(.7,0,.2,1),
		transform .35s cubic-bezier(.7,0,.2,1),
		box-shadow .35s cubic-bezier(.7,0,.2,1);
}

.btn:hover {
	transform: translateY(-1px);
}

.btn .arr {
	font-size: 16px;
}

@media (max-width: 880px) {
	.hero h1 .line2,
	.hero h1 .line3 {
		padding-left: 0;
	}

	.home-index {
		padding-top: 12px;
	}
}

@media (max-width: 768px) {
	.main-navigation .main-nav > ul > li > a {
		padding: 14px 0 !important;
	}

	.main-navigation .menu-item-dm-cta > a {
		justify-content: space-between;
		padding: 14px 0 !important;
		border: 0;
		font-size: 13px !important;
	}

	.home-index__inner {
		gap: 8px;
	}

	.home-index__label {
		display: block;
		width: 100%;
		margin: 0 0 4px;
	}

	.home-index__link {
		flex: 1 1 calc(50% - 8px);
	}

	.hero {
		padding-top: 20px;
	}

	.hero h1 {
		max-width: 9.5ch;
		font-size: clamp(32px, 11vw, 50px);
	}

	.hero-img-wrap {
		aspect-ratio: 4/3.4;
	}

	.section {
		padding: 40px 0;
	}

	.blog-hero h1 {
		font-size: clamp(38px, 15vw, 64px);
	}

	.article-head .chapter-roman {
		right: 0;
		opacity: .06;
	}

	.article-body {
		font-size: 16px;
	}

	.article-body > p:first-of-type::first-letter {
		font-size: clamp(60px, 16vw, 84px);
	}
}

@media (max-width: 560px) {
	.home-index__link {
		flex-basis: 100%;
	}

	.page-head h1,
	.article-head h1 {
		max-width: 100%;
	}

	.hero .top-line .l,
	.hero .top-line .r {
		gap: 8px 14px;
	}

	.blog-hero .ours {
		grid-template-columns: 1fr;
	}

	.blog-hero .ours .left,
	.blog-hero .ours .center,
	.blog-hero .ours .right {
		text-align: left;
	}
}

/* ==========================================================================
   25. WHATSAPP — Bouton flottant
   ========================================================================== */

.dm-whatsapp-btn {
	position: fixed;
	bottom: 24px;
	right: 24px;
	width: 56px;
	height: 56px;
	background-color: #25D366;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 3px 12px rgba(37, 211, 102, 0.35);
	transition: transform .25s, box-shadow .25s;
	z-index: 9999;
	animation: slideInUp 0.6s var(--dm-ease-out) 1.5s both;
}
.dm-whatsapp-btn:hover {
	transform: scale(1.1);
	box-shadow: 0 5px 20px rgba(37, 211, 102, 0.45);
}
.dm-whatsapp-btn svg { width: 28px; height: 28px; }
.dm-whatsapp-btn::after {
	content: '';
	position: absolute; inset: 0;
	width: 100%; height: 100%;
	border-radius: 50%;
	pointer-events: none;
	animation: whatsappPulse 8s ease-in-out 3s infinite;
}

@keyframes slideInUp {
	from { transform: translateY(100px); opacity: 0; }
	to { transform: translateY(0); opacity: 1; }
}
@keyframes whatsappPulse {
	0%, 15%, 100% { box-shadow: 0 0 0 0 rgba(37, 211, 102, 0); }
	7.5% { box-shadow: 0 0 0 12px rgba(37, 211, 102, 0.25); }
}

@media (max-width: 480px) {
	.dm-whatsapp-btn { bottom: 16px; right: 16px; width: 48px; height: 48px; }
	.dm-whatsapp-btn svg { width: 24px; height: 24px; }
}

/* ==========================================================================
   25. EDITORIAL REDESIGN — Hero photo-led, visuels réels, crédits
   ========================================================================== */

.hero .wrap {
	display: grid;
	grid-template-columns: minmax(0, .88fr) minmax(0, 1.12fr);
	grid-template-areas:
		"top top"
		"copy media";
	column-gap: clamp(42px, 5vw, 88px);
	row-gap: clamp(18px, 2vw, 28px);
	align-items: center;
}

.hero .top-line {
	grid-area: top;
}

.hero-copy {
	grid-area: copy;
	max-width: 33rem;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}

.hero h1 {
	max-width: 8.8ch;
	margin: 0;
}

.hero h1 .line2 {
	padding-left: 0;
	white-space: normal;
}

.hero h1 .line3 {
	padding-left: 0;
}

.hero-lead {
	margin: clamp(24px, 2.4vw, 34px) 0 0;
	max-width: 29ch;
	font-size: clamp(18px, 1.35vw, 22px);
	line-height: 1.52;
	color: var(--ink);
}

.hero .col-actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 16px 20px;
	margin-top: clamp(28px, 3vw, 38px);
}

.hero-link {
	font-family: var(--serif);
	font-size: 12px;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--ink);
	border-bottom: 1px solid rgba(44, 31, 24, .34);
	padding-bottom: 4px;
	transition: color .3s ease, border-color .3s ease;
}

.hero-link:hover {
	color: var(--terre);
	border-color: var(--terre);
}

.hero-note {
	margin: 18px 0 0;
	font-family: var(--serif);
	font-style: italic;
	font-size: 12px;
	line-height: 1.5;
	color: var(--ink-soft);
}

.hero-media {
	grid-area: media;
	margin: 0;
	width: 100%;
}

.hero-media-frame {
	position: relative;
	width: 100%;
	overflow: hidden;
	aspect-ratio: 11 / 13;
	border: 1px solid var(--rule);
	background: #d8c4af;
	box-shadow: 0 30px 60px rgba(28, 19, 14, .12);
}

.hero-media-frame::before {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(10, 7, 6, .02) 0%, rgba(10, 7, 6, .02) 55%, rgba(10, 7, 6, .16) 100%);
	z-index: 1;
	pointer-events: none;
}

.hero-media-frame::after {
	content: "";
	position: absolute;
	inset: 14px;
	border: 1px solid rgba(244, 237, 224, .14);
	z-index: 2;
	pointer-events: none;
}

.hero-media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	filter: saturate(1.04) contrast(1.02) brightness(1.03);
	object-position: center center;
}

.hero-media .hero-media-caption {
	display: block;
	margin: 14px 0 0;
	max-width: 28ch;
	font-family: var(--serif) !important;
	font-style: italic !important;
	font-size: 13px !important;
	line-height: 1.5 !important;
	letter-spacing: 0 !important;
	color: var(--ink-soft) !important;
}

.hero h1,
.blog-hero h1,
.feature h3,
.feat .txt h2,
.art-card h3,
.article-head h1,
.contact-slab .head h2,
.invite-text h2,
.why-vitry .txt h2,
.hero-partner h2,
.team-hero .cap h3 {
	text-wrap: balance;
}

.hero-img-credit {
	display: none;
}

.craft-img {
	background: #d9c3ab;
}

.craft-img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	filter: grayscale(.08) saturate(.94) contrast(1.04);
	transform: scale(1);
	transition: transform .9s ease, filter .9s ease;
}

.craft:hover .craft-img img {
	filter: grayscale(0) saturate(1.04) contrast(1.06);
	transform: scale(1.04);
}

.craft-img.a img {
	object-position: 50% 80%;
}

.craft-img.b img {
	object-position: center 68%;
}

.craft-img.c img {
	object-position: center 58%;
}

.craft-img.d img {
	object-position: center center;
}

.craft-img::after {
	background:
		linear-gradient(180deg, rgba(18, 13, 10, .04) 0%, rgba(18, 13, 10, .02) 40%, rgba(18, 13, 10, .62) 100%),
		radial-gradient(ellipse 70% 58% at 72% 78%, rgba(16, 9, 7, .28), transparent 70%);
	mix-blend-mode: normal;
}

.craft-img .frame-num,
.craft-img .cap {
	z-index: 2;
}

.listing .photo {
	background: #cab097;
}

.listing .photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	filter: saturate(.94) contrast(1.05);
	transform: scale(1);
	transition: transform .8s ease, filter .8s ease;
}

.listing:hover .photo img {
	filter: saturate(1.02) contrast(1.07);
	transform: scale(1.05);
}

.listing.a .photo img {
	object-position: center center;
}

.listing.b .photo img {
	object-position: center 68%;
}

.listing.c .photo img {
	object-position: center center;
}

.listing .photo::after {
	background:
		linear-gradient(180deg, rgba(16, 11, 8, .08) 0%, rgba(16, 11, 8, .03) 42%, rgba(16, 11, 8, .66) 100%),
		radial-gradient(ellipse 65% 58% at 76% 78%, rgba(10, 8, 7, .36), transparent 72%);
	mix-blend-mode: normal;
}

.listing .photo .ref,
.listing .photo .price-tag {
	z-index: 2;
}

.feature .img,
.feat .frame,
.article-visual {
	display: block;
}

.feature .img img,
.feat .frame img,
.article-visual img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.feature .img img {
	filter: saturate(.82) contrast(1.04);
}

.feat .frame img,
.article-visual img {
	filter: saturate(.88) contrast(1.05);
}

.feature .img::after,
.feat .frame::after,
.article-visual::after {
	content: "";
	position: absolute;
	inset: 0;
	background:
		linear-gradient(180deg, rgba(12, 9, 8, .08) 0%, rgba(12, 9, 8, .12) 38%, rgba(12, 9, 8, .82) 100%),
		radial-gradient(ellipse 60% 52% at 76% 74%, rgba(12, 8, 7, .3), transparent 72%);
	pointer-events: none;
}

.feature .img::before,
.feat .frame::before,
.article-visual::before {
	z-index: 2;
}

.feature .img .badge,
.feature .img .placeholder-note,
.feat .frame .badge,
.feat .frame .placeholder-note,
.article-visual .badge,
.article-visual .placeholder-note,
.article-visual .cap {
	z-index: 3;
}

.feature .img .placeholder-note,
.feat .frame .placeholder-note,
.article-visual .placeholder-note {
	position: absolute;
	right: 20px;
	bottom: 20px;
	font-size: 11px;
	letter-spacing: .14em;
	color: rgba(244, 237, 224, .88);
	text-align: right;
}

.feat .frame .badge,
.article-visual .badge {
	color: var(--paper);
	border-color: rgba(244, 237, 224, .5);
	background: rgba(21, 16, 13, .18);
	backdrop-filter: blur(8px);
}

.article-visual .cap {
	color: rgba(244, 237, 224, .9);
	max-width: 50ch;
}

.article-visual .cap::before {
	background: rgba(244, 237, 224, .92);
}

.feat {
	align-items: stretch;
}

.feat .frame,
.article-visual {
	box-shadow: 0 28px 56px rgba(29, 19, 13, .08);
}

.section.journal-dark .feature .img .placeholder-note {
	color: rgba(244, 237, 224, .86);
}

.photo-credits {
	display: block;
	margin-top: 8px;
	max-width: 76ch;
	font-size: 11px;
	line-height: 1.6;
}

.photo-credits a {
	white-space: normal;
}

@media (max-width: 980px) {
	.hero .wrap {
		grid-template-columns: 1fr;
		grid-template-areas:
			"top"
			"copy"
			"media";
		row-gap: 24px;
	}

	.hero-copy {
		max-width: 100%;
	}

	.hero h1 {
		max-width: 9.8ch;
	}

	.hero-lead {
		max-width: 34ch;
	}

	.hero-media-frame {
		aspect-ratio: 4 / 5;
	}

	.hero-media .hero-media-caption {
		max-width: none;
	}
}

@media (max-width: 680px) {
	.hero-lead {
		font-size: 17px;
		max-width: 100%;
	}

	.hero .col-actions {
		gap: 14px;
	}

	.hero-note,
	.hero-media .hero-media-caption,
	.photo-credits {
		font-size: 10.5px;
	}
}

/* ==========================================================================
   26. REVEAL — Animations intersection observer
   ========================================================================== */

.reveal {
	opacity: 1;
	transform: none;
}
.reveal.in { opacity: 1; transform: none; }
.d1 { transition-delay: .05s; }
.d2 { transition-delay: .15s; }
.d3 { transition-delay: .25s; }
.d4 { transition-delay: .36s; }
.d5 { transition-delay: .48s; }
.d6 { transition-delay: .6s; }

/* Compatibilité ancien nommage :
   les anciens blocs Gutenberg restent visibles par défaut.
   Le nouveau système .reveal porte désormais les animations d'entrée. */
.dm-fade-in,
.dm-fade-in.dm-visible {
	opacity: 1;
	transform: none;
}

/* ==========================================================================
   27. PAGE SHELL — verrouillage typo + pages WordPress éditorialisées
   ========================================================================== */

html body {
	font-family: var(--read) !important;
	color: var(--ink);
	background: var(--paper);
}

body :where(p, li, dd, dt, td, th, label, input, textarea, select) {
	font-family: inherit;
}

body :where(
	h1,
	h2,
	h3,
	h4,
	h5,
	h6,
	.main-title a,
	.main-navigation a,
	.topbar,
	.btn,
	.hero-link,
	.home-index__label,
	.home-index__link,
	.lot,
	.label,
	.sig,
	.kicker,
	.dm-page-kicker,
	.dm-page-aside__eyebrow
) {
	font-family: var(--serif);
}

.section-head--left {
	margin: 0 0 20px;
	max-width: none;
	text-align: left;
}

.dm-page-shell {
	padding-bottom: clamp(44px, 5vw, 84px);
}

.dm-page-hero {
	position: relative;
	padding: clamp(40px, 5vw, 86px) 0 clamp(28px, 3vw, 48px);
	border-bottom: 1px solid var(--rule);
	background:
		radial-gradient(ellipse 80% 55% at 10% 8%, rgba(184, 132, 90, .16), transparent 62%),
		linear-gradient(180deg, rgba(244, 237, 224, .98) 0%, rgba(240, 231, 217, .92) 100%);
}

.dm-page-hero__topline {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 12px 20px;
	padding-bottom: 16px;
	margin-bottom: clamp(20px, 2.2vw, 34px);
	border-bottom: 1px solid var(--rule);
	font-size: 11px;
	letter-spacing: .09em;
	text-transform: uppercase;
	color: var(--ink-soft);
}

.dm-page-hero__topline .breadcrumb {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 0;
}

.dm-page-hero__topline .breadcrumb a {
	color: var(--terre);
}

.dm-page-hero__topline .breadcrumb span {
	margin: 0 10px;
	color: rgba(26, 20, 16, .44);
}

.dm-page-hero h1 {
	margin: 0;
	max-width: 12ch;
	font-size: clamp(34px, 4.6vw, 72px);
	line-height: .97;
}

.dm-page-hero h1 em {
	font-style: italic;
	font-weight: 400;
	color: var(--terre);
}

.dm-page-hero__lead {
	margin: clamp(22px, 2.6vw, 34px) 0 0;
	max-width: 42rem;
	font-size: clamp(17px, 1.45vw, 22px);
	line-height: 1.58;
	color: var(--ink);
}

.dm-page-hero__summary {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 18px;
	margin-top: clamp(24px, 2.8vw, 38px);
	max-width: 840px;
}

.dm-page-hero__summary > div {
	padding: 18px 20px;
	border: 1px solid rgba(26, 20, 16, .12);
	background: rgba(244, 237, 224, .7);
}

.dm-page-kicker {
	display: inline-block;
	margin-bottom: 8px;
	font-size: 11px;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--terre);
}

.dm-page-hero__summary p {
	margin: 0;
	font-size: 14px;
	line-height: 1.55;
}

.dm-page-content {
	padding: clamp(34px, 4.5vw, 68px) 0 0;
}

.dm-page-grid {
	display: grid;
	grid-template-columns: minmax(0, 320px) minmax(0, 1fr);
	gap: clamp(24px, 3vw, 48px);
	align-items: start;
}

.dm-page-grid--single {
	grid-template-columns: minmax(0, 1fr);
}

.dm-page-aside {
	position: sticky;
	top: calc(var(--header-height) + 28px);
	padding: clamp(22px, 2.6vw, 32px);
	border: 1px solid rgba(26, 20, 16, .12);
	background: linear-gradient(180deg, rgba(236, 227, 208, .88) 0%, rgba(244, 237, 224, .96) 100%);
}

.dm-page-aside__eyebrow {
	display: inline-block;
	margin-bottom: 10px;
	font-size: 11px;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--terre);
}

.dm-page-aside h2 {
	margin: 0;
	font-size: clamp(26px, 2.4vw, 36px);
	line-height: 1.04;
}

.dm-page-aside p {
	margin: 16px 0 0;
	font-size: 14px;
	line-height: 1.6;
	color: var(--ink-soft);
}

.dm-page-aside__contact {
	display: grid;
	gap: 10px;
	margin-top: 22px;
	padding-top: 18px;
	border-top: 1px solid rgba(26, 20, 16, .12);
}

.dm-page-aside__contact a {
	color: var(--ink);
	text-decoration: underline;
	text-decoration-color: rgba(122, 59, 31, .32);
	text-underline-offset: 3px;
}

.dm-page-prose {
	max-width: 760px;
}

.dm-page-prose section + section {
	margin-top: clamp(26px, 3vw, 38px);
}

.dm-page-prose h2 {
	margin: 0 0 12px;
	font-size: clamp(28px, 2.5vw, 40px);
	line-height: 1.05;
}

.dm-page-prose h3 {
	margin: 22px 0 10px;
	font-size: clamp(20px, 1.7vw, 26px);
}

.dm-page-prose p,
.dm-page-prose li {
	font-size: 16px;
	line-height: 1.72;
	color: var(--ink);
}

.dm-page-prose p {
	margin: 0 0 14px;
}

.dm-page-prose ul {
	margin: 0 0 16px;
	padding-left: 22px;
}

.dm-page-prose a {
	text-decoration: underline;
	text-decoration-color: rgba(122, 59, 31, .36);
	text-underline-offset: 3px;
}

.dm-inline-note {
	padding: 18px 20px;
	border-left: 2px solid rgba(122, 59, 31, .34);
	background: rgba(236, 227, 208, .58);
	font-size: 15px;
	line-height: 1.62;
	color: var(--ink-soft);
}

.dm-page-shell--legal .dm-page-prose {
	padding-bottom: clamp(12px, 2vw, 24px);
}

@media (max-width: 980px) {
	.dm-page-grid { grid-template-columns: 1fr; }

	.dm-page-aside {
		position: static;
	}
}

@media (max-width: 680px) {
	.dm-page-hero__topline {
		flex-direction: column;
		align-items: flex-start;
	}

	.dm-page-hero__summary {
		grid-template-columns: 1fr;
	}

	.dm-page-hero h1 {
		max-width: 100%;
	}
}

/* ==========================================================================
   26. ACCESSIBILITÉ — Mouvement réduit
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {
	* { animation: none !important; transition: none !important; }
	.reveal { opacity: 1; transform: none; }
	.dm-fade-in { opacity: 1; transform: none; }
	.dm-whatsapp-btn { animation: none; }
	.dm-whatsapp-btn::after { animation: none; }
}

/* ==========================================================================
   27. FRONTEND SUBMIT ARTICLE — /proposer-un-article/
   Interface commerciales : formulaire minimaliste DA Maison & Cadastre,
   inspiration Medium / Google Docs.
   ========================================================================== */

.dm-submit {
	padding: clamp(48px, 8vw, 96px) 0 clamp(72px, 10vw, 140px);
	background: var(--paper, #f4ede0);
	color: var(--ink, #1a1410);
}

.dm-submit__inner {
	max-width: 720px;
}

.dm-submit__eyebrow {
	font-family: var(--serif, 'Fraunces', Georgia, serif);
	font-size: 13px;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--terre, #7a3b1f);
	margin: 0 0 16px;
}

.dm-submit__head h1,
.dm-submit__thanks h1 {
	font-family: var(--serif, 'Fraunces', Georgia, serif);
	font-weight: 500;
	font-size: clamp(34px, 5.6vw, 56px);
	line-height: 1.1;
	letter-spacing: -0.01em;
	margin: 0 0 20px;
}

.dm-submit__lead {
	font-family: var(--read, 'Newsreader', Georgia, serif);
	font-size: clamp(16px, 2vw, 19px);
	line-height: 1.55;
	color: var(--ink-soft, #4a3f30);
	margin: 0 0 48px;
	max-width: 52ch;
}

.dm-submit__error {
	background: #fbe9e6;
	border-left: 3px solid #a83217;
	color: #7a2413;
	padding: 14px 18px;
	margin: 0 0 32px;
	font-size: 15px;
	line-height: 1.5;
	border-radius: 2px;
}

.dm-submit__form {
	display: flex;
	flex-direction: column;
	gap: 36px;
}

.dm-submit__field {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.dm-submit__field label {
	display: flex;
	flex-direction: column;
	gap: 4px;
	cursor: pointer;
}

.dm-submit__label {
	font-family: var(--serif, 'Fraunces', Georgia, serif);
	font-size: 14px;
	font-weight: 500;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--terre, #7a3b1f);
}

.dm-submit__hint-inline {
	font-family: var(--read, 'Newsreader', Georgia, serif);
	font-size: 13.5px;
	color: var(--ink-soft, #4a3f30);
	font-style: italic;
	line-height: 1.45;
}

.dm-submit__hint-inline code {
	font-family: 'SFMono-Regular', Menlo, Consolas, monospace;
	font-style: normal;
	font-size: 12.5px;
	background: rgba(122, 59, 31, 0.08);
	padding: 1px 5px;
	border-radius: 2px;
}

.dm-submit__form input[type="text"],
.dm-submit__form textarea,
.dm-submit__form select {
	width: 100%;
	background: transparent;
	border: 0;
	border-bottom: 1px solid var(--rule, rgba(26, 20, 16, 0.18));
	padding: 12px 0;
	font-family: var(--read, 'Newsreader', Georgia, serif);
	font-size: 17px;
	line-height: 1.5;
	color: var(--ink, #1a1410);
	transition: border-color 0.2s ease;
	box-shadow: none;
}

.dm-submit__form input[type="text"]:focus,
.dm-submit__form textarea:focus,
.dm-submit__form select:focus {
	outline: 0;
	border-bottom-color: var(--terre, #7a3b1f);
	border-bottom-width: 2px;
}

.dm-submit__form textarea {
	resize: vertical;
	min-height: 180px;
	line-height: 1.65;
}

.dm-submit__form input[type="file"] {
	display: block;
	padding: 14px 0 4px;
	font-family: var(--read, 'Newsreader', Georgia, serif);
	font-size: 15px;
	color: var(--ink-soft, #4a3f30);
	width: 100%;
}

.dm-submit__form input[type="file"]::file-selector-button {
	font-family: var(--serif, 'Fraunces', Georgia, serif);
	font-size: 13px;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	background: transparent;
	border: 1px solid var(--rule, rgba(26, 20, 16, 0.18));
	color: var(--ink, #1a1410);
	padding: 10px 18px;
	margin-right: 14px;
	cursor: pointer;
	transition: border-color 0.2s ease, color 0.2s ease;
}

.dm-submit__form input[type="file"]::file-selector-button:hover {
	border-color: var(--terre, #7a3b1f);
	color: var(--terre, #7a3b1f);
}

.dm-submit__form select {
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	background-image: linear-gradient(45deg, transparent 50%, var(--ink-soft, #4a3f30) 50%), linear-gradient(135deg, var(--ink-soft, #4a3f30) 50%, transparent 50%);
	background-position: calc(100% - 18px) center, calc(100% - 12px) center;
	background-size: 6px 6px, 6px 6px;
	background-repeat: no-repeat;
	padding-right: 36px;
	cursor: pointer;
}

.dm-submit__counter {
	font-family: var(--read, 'Newsreader', Georgia, serif);
	font-size: 13px;
	color: var(--ink-soft, #4a3f30);
	font-style: italic;
	text-align: right;
	margin: 4px 0 0;
}

.dm-submit__actions {
	display: flex;
	flex-direction: column;
	gap: 14px;
	margin-top: 16px;
}

.dm-submit__form .dm-btn--primary,
.dm-submit__thanks .dm-btn--primary {
	display: inline-block;
	background: var(--terre, #7a3b1f);
	color: var(--paper, #f4ede0);
	padding: 16px 34px;
	border: 0;
	border-radius: 2px;
	font-family: var(--serif, 'Fraunces', Georgia, serif);
	font-size: 15px;
	font-weight: 500;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	cursor: pointer;
	text-decoration: none;
	transition: background-color 0.2s ease, transform 0.2s ease;
	align-self: flex-start;
}

.dm-submit__form .dm-btn--primary:hover,
.dm-submit__thanks .dm-btn--primary:hover {
	background: var(--ink, #1a1410);
	transform: translateY(-1px);
}

.dm-submit__thanks .dm-btn--ghost {
	display: inline-block;
	background: transparent;
	color: var(--ink, #1a1410);
	padding: 16px 28px;
	border: 1px solid var(--rule, rgba(26, 20, 16, 0.28));
	border-radius: 2px;
	font-family: var(--serif, 'Fraunces', Georgia, serif);
	font-size: 14px;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	text-decoration: none;
	transition: border-color 0.2s ease, color 0.2s ease;
	margin-left: 12px;
}

.dm-submit__thanks .dm-btn--ghost:hover {
	border-color: var(--terre, #7a3b1f);
	color: var(--terre, #7a3b1f);
}

.dm-submit__hint {
	font-family: var(--read, 'Newsreader', Georgia, serif);
	font-size: 14px;
	line-height: 1.5;
	color: var(--ink-soft, #4a3f30);
	margin: 0;
	max-width: 52ch;
}

.dm-submit__thanks {
	text-align: left;
	padding: clamp(20px, 4vw, 48px) 0;
}

.dm-submit__thanks .dm-submit__lead {
	margin-bottom: 40px;
}

.dm-submit__thanks .dm-submit__actions {
	flex-direction: row;
	flex-wrap: wrap;
	gap: 12px;
	align-items: center;
}

@media (max-width: 640px) {
	.dm-submit__form { gap: 28px; }
	.dm-submit__form .dm-btn--primary { width: 100%; text-align: center; }
	.dm-submit__thanks .dm-btn--ghost { margin-left: 0; width: 100%; text-align: center; }
	.dm-submit__thanks .dm-submit__actions { flex-direction: column; align-items: stretch; }
}