/**
 * Déclic Partenaires Immobilier (/partenaires-immobilier/) : en-tête espresso avec carte « dossier travaux »,
 * onglets par profil. Chargé uniquement sur cette page, après sections.css.
 */

/* =========================================================================================
   En-tête
   ========================================================================================= */
.mdih { position: relative; overflow: hidden; padding-block: clamp(1.5rem, 1rem + 2vw, 3rem) clamp(3.5rem, 2rem + 5vw, 6.5rem); color: var(--md-on-dark, #F8F6F1); isolation: isolate;
	/* Fond : profondeur espresso → encre, halo cuivré derrière le visuel, lumière douce à gauche. */
	background:
		radial-gradient(48rem 32rem at 78% 38%, rgb(171 121 86 / 0.24), transparent 70%),
		radial-gradient(36rem 28rem at 8% 0%, rgb(216 195 165 / 0.07), transparent 70%),
		linear-gradient(160deg, #2E241B 0%, var(--md-espresso) 38%, #1A1C1E 78%, #121820 100%); }
/* Trame de plan d'architecte, très discrète, estompée vers les bords. */
.mdih::before { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
	background-image:
		linear-gradient(rgb(216 195 165 / 0.07) 1px, transparent 1px),
		linear-gradient(90deg, rgb(216 195 165 / 0.07) 1px, transparent 1px),
		linear-gradient(rgb(216 195 165 / 0.035) 1px, transparent 1px),
		linear-gradient(90deg, rgb(216 195 165 / 0.035) 1px, transparent 1px);
	background-size: 96px 96px, 96px 96px, 24px 24px, 24px 24px;
	background-position: -1px -1px;
	-webkit-mask-image: radial-gradient(70% 80% at 70% 45%, #000 0%, rgb(0 0 0 / 0.55) 45%, transparent 85%);
	mask-image: radial-gradient(70% 80% at 70% 45%, #000 0%, rgb(0 0 0 / 0.55) 45%, transparent 85%); }
/* Filet champagne en pied d'en-tête. */
.mdih::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: linear-gradient(90deg, transparent, rgb(216 195 165 / 0.35), transparent); }
/* Repères d'angle façon plan coté, autour du visuel. */
.mdih__visual::before, .mdih__visual::after { content: ""; position: absolute; z-index: 0; width: 2.25rem; height: 2.25rem; border: 0 solid rgb(216 195 165 / 0.45); pointer-events: none; }
.mdih__visual::before { top: -0.9rem; right: -0.9rem; border-width: 1px 1px 0 0; }
.mdih__visual::after { bottom: -0.9rem; right: -0.9rem; border-width: 0 1px 1px 0; }
@media (max-width: 39.99rem) { .mdih__visual::before, .mdih__visual::after { display: none; } }
.mdih__grid { display: grid; gap: clamp(2.5rem, 1.5rem + 3vw, 4rem); align-items: center; }
.md-v2 .mdih .md-breadcrumb { margin-bottom: clamp(1.5rem, 1rem + 2vw, 2.75rem); }
.md-v2 .mdih .md-breadcrumb ol { color: rgb(248 246 241 / 0.6); }
.md-v2 .mdih .md-breadcrumb a:hover { color: var(--md-white); }
.md-v2 .mdih .md-breadcrumb [aria-current] { color: rgb(248 246 241 / 0.88); }
.mdih__eyebrow { display: flex; align-items: center; gap: 0.75rem; margin: 0 0 1.25rem; font-size: 0.875rem; font-weight: 500; letter-spacing: 0.01em; color: var(--md-champagne); }
.mdih__eyebrow::before { content: ""; width: 2rem; height: 1px; background: var(--md-copper); }
.mdih__title { max-width: 14ch; margin: 0; font-family: var(--md-font-display); font-size: clamp(2.6rem, 1.6rem + 4vw, 5rem); font-weight: 400; line-height: 1.02; letter-spacing: -0.02em; color: var(--md-white); text-wrap: balance; }
.mdih__lead { max-width: 34rem; margin: clamp(1.25rem, 1rem + 1vw, 1.75rem) 0 0; font-size: var(--md-fs-lead); line-height: 1.6; color: rgb(248 246 241 / 0.78); }
.mdih__actions { margin-top: clamp(1.75rem, 1.4rem + 1.2vw, 2.5rem); }
.mdih__proofs { display: flex; flex-wrap: wrap; gap: 0.6rem 1.75rem; margin: clamp(1.75rem, 1.4rem + 1vw, 2.5rem) 0 0; padding: 0; list-style: none; font-size: var(--md-fs-small); color: rgb(248 246 241 / 0.72); }
.mdih__proofs li { display: inline-flex; align-items: center; gap: 0.55rem; }
.mdih__proofs li::before { content: ""; width: 0.4rem; height: 0.4rem; border-radius: 50%; background: var(--md-copper); }

.mdih__visual { position: relative; }
.mdih__media { position: relative; margin: 0; aspect-ratio: 4 / 3; overflow: hidden; border-radius: 1rem; box-shadow: 0 30px 60px -30px rgb(0 0 0 / 0.6); }
.mdih__media img { display: block; width: 100%; height: 100%; object-fit: cover; }
.mdih__media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 55%, rgb(21 28 33 / 0.35)); pointer-events: none; }
.mdih__caption { position: absolute; top: 0.85rem; right: 0.85rem; z-index: 1; padding: 0.25rem 0.65rem; border-radius: 999px; background: rgb(21 28 33 / 0.6); font-size: 0.75rem; color: var(--md-white); backdrop-filter: blur(6px); }

/* Carte « dossier travaux » : la signature de la page. */
.mdih__card { position: relative; z-index: 2; width: min(100% - 2rem, 21rem); margin: -4.5rem auto 0; padding: 1.25rem 1.35rem 1.15rem; border: 1px solid rgb(216 195 165 / 0.5); border-radius: 0.9rem; background: var(--md-ivory); color: var(--md-espresso); box-shadow: 0 24px 50px -24px rgb(0 0 0 / 0.55); }
.mdih__card-head { display: flex; align-items: center; gap: 0.75rem; padding-bottom: 0.9rem; border-bottom: 1px solid rgb(41 32 24 / 0.08); }
.mdih__card-icon { display: inline-grid; place-items: center; width: 2.25rem; height: 2.25rem; border-radius: 0.6rem; background: rgb(171 121 86 / 0.12); color: var(--md-copper-text); }
.mdih__card-icon .md-icon { width: 1.15rem; height: 1.15rem; }
.mdih__card-titles { display: grid; gap: 0.1rem; }
.mdih__card-label { font-size: 0.75rem; color: var(--md-ink-muted); }
.mdih__card-title { font-size: 0.9375rem; font-weight: 600; }
.mdih__steps { position: relative; display: grid; gap: 0.7rem; margin: 1rem 0 0; padding: 0; list-style: none; }
.mdih__steps::before { content: ""; position: absolute; left: 0.4375rem; top: 0.5rem; bottom: 0.5rem; width: 1px; background: rgb(171 121 86 / 0.3); }
.mdih__step { position: relative; display: flex; align-items: center; gap: 0.8rem; font-size: 0.875rem; color: var(--md-espresso); }
.mdih__dot { position: relative; flex: none; width: 0.875rem; height: 0.875rem; border: 1.5px solid var(--md-copper); border-radius: 50%; background: var(--md-copper); }
.mdih__step:last-child { font-weight: 600; }
.mdih__step:last-child .mdih__dot { box-shadow: 0 0 0 4px rgb(171 121 86 / 0.18); }
.mdih__card-note { margin: 1rem 0 0; padding-top: 0.85rem; border-top: 1px solid rgb(41 32 24 / 0.08); font-size: 0.8125rem; line-height: 1.45; color: var(--md-ink-muted); }

/* Une seule animation, au chargement : le dossier avance d'étape en étape. */
@media (prefers-reduced-motion: no-preference) {
	/* Déclenchée par immo.js quand la carte entre à l'écran ; sans JavaScript, la carte reste statique et complète. */
	.mdih__card.is-armed .mdih__step { opacity: 0.35; }
	.mdih__card.is-armed .mdih__dot { background: var(--md-ivory); transform: scale(0.7); }
	.mdih__card.is-playing .mdih__step { opacity: 1; animation: mdih-step 0.45s var(--md-ease-out, ease) both; animation-delay: calc(0.35s + var(--i) * 0.42s); }
	.mdih__card.is-playing .mdih__dot { background: var(--md-copper); transform: none; animation: mdih-dot 0.45s var(--md-ease-out, ease) both; animation-delay: calc(0.45s + var(--i) * 0.42s); }
	.mdih__card.is-playing { animation: mdih-card 0.7s var(--md-ease-out, ease) both; }
}
@keyframes mdih-card { from { opacity: 0; transform: translateY(14px); } }
@keyframes mdih-step { from { opacity: 0.35; } }
@keyframes mdih-dot { from { background: var(--md-ivory); transform: scale(0.7); } }

@media (min-width: 40rem) {
	.mdih__card { margin: -5rem 0 0 auto; margin-right: -0.5rem; }
}
@media (min-width: 64rem) {
	.mdih__grid { grid-template-columns: minmax(0, 1.08fr) minmax(0, 0.92fr); }
	.mdih__media { aspect-ratio: 4 / 4.6; }
	.mdih__card { position: absolute; left: -3.5rem; bottom: -2.5rem; width: 19.5rem; margin: 0; }
}
@media (min-width: 64rem) and (max-width: 74.99rem) { .mdih__card { left: -2rem; } }

/* =========================================================================================
   Onglets par profil
   ========================================================================================= */
.mdip__head { max-width: 40rem; }
.mdip__body { margin-top: clamp(2rem, 1.5rem + 2vw, 3rem); }
.mdip__tabs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.5rem; }
.mdip__tabs[hidden] { display: none; }
.mdip__tab { display: flex; align-items: center; gap: 0.6rem; min-height: 3rem; padding: 0.6rem 0.8rem; border: 1px solid var(--md-line, rgb(41 32 24 / 0.12)); border-radius: 0.65rem; background: var(--md-white); font: inherit; font-size: 0.875rem; font-weight: 500; line-height: 1.25; color: var(--md-espresso); text-align: left; cursor: pointer; transition: border-color 0.18s ease, background-color 0.18s ease, color 0.18s ease; }
.mdip__tab-icon { display: inline-grid; flex: none; place-items: center; width: 1.9rem; height: 1.9rem; border-radius: 0.5rem; background: rgb(171 121 86 / 0.1); color: var(--md-copper-text); transition: background-color 0.18s ease, color 0.18s ease; }
.mdip__tab-icon .md-icon { width: 1rem; height: 1rem; }
.mdip__tab:hover { border-color: rgb(171 121 86 / 0.55); }
.mdip__tab[aria-selected="true"] { border-color: var(--md-espresso); background: var(--md-espresso); color: var(--md-white); }
.mdip__tab[aria-selected="true"] .mdip__tab-icon { background: rgb(216 195 165 / 0.16); color: var(--md-champagne); }
.mdip__tab:focus-visible, .mdip__panel:focus-visible { outline: 2px solid var(--md-copper); outline-offset: 2px; }

.mdip__panels { display: grid; gap: 1rem; }
.mdip.is-enhanced .mdip__panels { margin-top: 1rem; }
.mdip__panel { padding: clamp(1.5rem, 1.2rem + 1.2vw, 2.25rem); border: 1px solid rgb(171 121 86 / 0.22); border-radius: 1rem; background: linear-gradient(140deg, var(--md-ivory), rgb(216 195 165 / 0.18)); }
.mdip.is-enhanced .mdip__panel[hidden] { display: none; }
.mdip__panel-title { margin: 0; font-family: var(--md-font-display); font-size: clamp(1.6rem, 1.3rem + 1.2vw, 2.25rem); font-weight: 400; line-height: 1.15; color: var(--md-espresso); }
.mdip__intro { max-width: 36rem; margin: 0.75rem 0 0; font-size: var(--md-fs-body); line-height: 1.6; color: var(--md-ink-muted); }
.mdip__cases { display: grid; gap: 0.75rem; margin: 1.5rem 0 0; padding: 0; list-style: none; }
.mdip__cases li { display: flex; align-items: flex-start; gap: 0.75rem; font-size: var(--md-fs-body); line-height: 1.5; color: var(--md-espresso); }
.mdip__tick { flex: none; position: relative; width: 1.25rem; height: 1.25rem; margin-top: 0.15rem; border-radius: 50%; background: var(--md-copper); }
.mdip__tick::after { content: ""; position: absolute; left: 0.42rem; top: 0.24rem; width: 0.3rem; height: 0.55rem; border: solid var(--md-ink, #08131C); border-width: 0 1.5px 1.5px 0; transform: rotate(45deg); }
.mdip__cta { margin-top: 1.75rem; }
@media (prefers-reduced-motion: no-preference) {
	.mdip.is-enhanced .mdip__panel:not([hidden]) { animation: mdip-in 0.28s var(--md-ease-out, ease) both; }
}
@keyframes mdip-in { from { opacity: 0; transform: translateY(6px); } }
@media (prefers-reduced-motion: reduce) { .mdip__tab, .mdip__tab-icon { transition: none; } }

@media (min-width: 40rem) { .mdip__tabs { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 64rem) {
	.mdip.is-enhanced .mdip__body { display: grid; grid-template-columns: 19rem minmax(0, 1fr); gap: 1.5rem; align-items: start; }
	.mdip__tabs { grid-template-columns: 1fr; }
	.mdip__tab { min-height: 3.4rem; padding: 0.7rem 0.9rem; font-size: 0.9375rem; }
	.mdip.is-enhanced .mdip__panels { margin-top: 0; }
	.mdip__panel { min-height: 100%; padding: 2.5rem 2.75rem; }
	.mdip__cases { grid-template-columns: 1fr; max-width: 36rem; }
}

/* =========================================================================================
   Notre rôle : promesse en trois temps, mention de rôle, quatre garanties
   ========================================================================================= */
.mdir__top { display: grid; gap: clamp(1.75rem, 1.2rem + 2vw, 3rem); align-items: end; }
.mdir__title { display: grid; gap: 0.15em; margin: 1rem 0 0; padding-left: clamp(1rem, 0.7rem + 1vw, 1.5rem); border-left: 2px solid var(--md-copper); font-size: clamp(2rem, 1.4rem + 2.4vw, 3.25rem); font-weight: 500; line-height: 1.08; letter-spacing: -0.02em; color: var(--md-espresso); }
.mdir__line { display: block; }
.mdir__line + .mdir__line { color: rgb(41 32 24 / 0.78); }
.mdir__line:last-child { color: rgb(41 32 24 / 0.6); }
.mdir__body { display: grid; gap: 1.25rem; }
.mdir__text { max-width: 34rem; margin: 0; font-size: var(--md-fs-lead); line-height: 1.6; color: var(--md-ink-muted); }
.mdir__note { display: flex; align-items: flex-start; gap: 0.85rem; max-width: 34rem; margin: 0; padding: 1rem 1.15rem; border: 1px solid rgb(171 121 86 / 0.25); border-radius: 0.75rem; background: rgb(255 255 255 / 0.6); font-size: var(--md-fs-small); line-height: 1.55; color: var(--md-espresso); }
.mdir__note-icon { display: inline-grid; flex: none; place-items: center; width: 2rem; height: 2rem; border-radius: 0.55rem; background: var(--md-espresso); color: var(--md-champagne); }
.mdir__note-icon .md-icon { width: 1rem; height: 1rem; }

.mdir__points { display: grid; gap: 0.85rem; margin: clamp(2.5rem, 2rem + 2vw, 4rem) 0 0; padding: 0; list-style: none; }
.mdir__point { display: grid; align-content: start; gap: 0.5rem; padding: 1.5rem 1.4rem 1.6rem; border: 1px solid rgb(41 32 24 / 0.07); border-radius: 0.9rem; background: var(--md-white); box-shadow: 0 1px 2px rgb(41 32 24 / 0.04), 0 14px 30px -24px rgb(41 32 24 / 0.35); }
.mdir__icon { display: inline-grid; place-items: center; width: 2.75rem; height: 2.75rem; margin-bottom: 0.6rem; border-radius: 0.7rem; background: linear-gradient(140deg, rgb(171 121 86 / 0.16), rgb(216 195 165 / 0.3)); color: var(--md-copper-text); }
.mdir__icon .md-icon { width: 1.3rem; height: 1.3rem; }
.mdir__point-title { margin: 0; font-size: 1.0625rem; font-weight: 600; line-height: 1.3; color: var(--md-espresso); }
.mdir__point-text { margin: 0; font-size: var(--md-fs-small); line-height: 1.55; color: var(--md-ink-muted); }

@media (min-width: 40rem) { .mdir__points { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 64rem) {
	.mdir__top { grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr); gap: 4rem; }
	.mdir__points { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; }
}

/* =========================================================================================
   En-tête V1 (2026-10-27) : photo immobilière en pleine largeur, voile chaud limité à la colonne de texte,
   composition de droite identique à la version précédente (photo + carte « dossier »). Remplace le fond sombre à trame.
   ========================================================================================= */
.mdih { background: #2A2119; padding-block: clamp(1.5rem, 1rem + 2vw, 3rem) clamp(3rem, 2rem + 4vw, 5.5rem); }
.mdih::before { display: none; }
.mdih__bg { position: absolute; inset: 0; z-index: -2; overflow: hidden; }
.mdih__bg img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 62% 50%; }
/* Voile : lisibilité du texte à gauche, photo pleinement visible à droite. */
.mdih__bg::after { content: ""; position: absolute; inset: 0;
	background:
		linear-gradient(90deg, rgb(33 25 18 / 0.86) 0%, rgb(33 25 18 / 0.7) 34%, rgb(33 25 18 / 0.28) 62%, rgb(33 25 18 / 0.08) 100%),
		linear-gradient(180deg, rgb(21 18 15 / 0.35) 0%, transparent 22%, transparent 78%, rgb(21 18 15 / 0.35) 100%); }
@media (max-width: 63.99rem) { .mdih__bg::after { background: linear-gradient(180deg, rgb(33 25 18 / 0.78) 0%, rgb(33 25 18 / 0.7) 55%, rgb(33 25 18 / 0.5) 100%); } }
.mdih__caption { position: absolute; top: auto; bottom: 1rem; right: clamp(1rem, 0.5rem + 2vw, 2rem); z-index: 1; }
.mdih__title { text-shadow: 0 2px 24px rgb(0 0 0 / 0.25); }
.mdih__lead { color: rgb(248 246 241 / 0.86); }
.mdih__proofs { color: rgb(248 246 241 / 0.82); }

/* Carte « dossier travaux » seule, à la place de la photo (2026-10-27) : format agrandi, lecture aérée. */
.mdih__card { position: relative; left: auto; bottom: auto; width: min(100%, 30rem); margin: 0 auto; padding: clamp(1.5rem, 1.1rem + 1.4vw, 2.25rem); border-radius: 1.4rem; box-shadow: 0 50px 100px -45px rgb(0 0 0 / 0.75); }
.mdih__card-head { gap: 1rem; padding-bottom: 1.25rem; }
.mdih__card-icon { width: 3rem; height: 3rem; border-radius: 0.8rem; }
.mdih__card-icon .md-icon { width: 1.4rem; height: 1.4rem; }
.mdih__card-label { font-size: 0.8125rem; }
.mdih__card-title { font-size: clamp(1.15rem, 1rem + 0.5vw, 1.375rem); }
.mdih__steps { gap: 1.15rem; margin-top: 1.5rem; }
.mdih__steps::before { left: 0.5625rem; }
.mdih__step { gap: 1rem; font-size: clamp(0.95rem, 0.9rem + 0.25vw, 1.0625rem); }
.mdih__dot { width: 1.125rem; height: 1.125rem; }
.mdih__card-note { margin-top: 1.5rem; padding-top: 1.15rem; font-size: 0.9rem; }
@media (min-width: 40rem) { .mdih__card { margin: 0 auto; } }
@media (min-width: 64rem) {
	.mdih__visual { display: flex; justify-content: flex-end; }
	.mdih__card { position: relative; left: auto; bottom: auto; width: min(100%, 30rem); margin: 0; }
	.mdih__visual::before { right: -0.9rem; }
}
@media (min-width: 64rem) and (max-width: 74.99rem) { .mdih__card { left: auto; } }
@media (min-width: 64rem) {
	.mdih__card { width: min(100%, 33rem); padding: 2.5rem 2.5rem 2.25rem; }
	.mdih__steps { gap: 1.45rem; margin-top: 1.75rem; }
	.mdih__card-title { font-size: 1.5rem; }
}

/* =========================================================================================
   Carte « dossier travaux » — rendu interface produit (2026-10-27).
   Verre ivoire, filet cuivre en tête, étapes validées cochées, étape en cours mise en avant,
   numérotation discrète (la liste est une vraie séquence). Aucun texte ajouté.
   ========================================================================================= */
.mdih__card { overflow: hidden; border: 1px solid rgb(255 255 255 / 0.6); border-radius: 1.5rem; background: linear-gradient(180deg, rgb(255 253 250 / 0.96), rgb(250 244 237 / 0.93)); -webkit-backdrop-filter: blur(18px) saturate(1.15); backdrop-filter: blur(18px) saturate(1.15); box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.9), 0 2px 6px rgb(29 22 17 / 0.08), 0 60px 110px -50px rgb(0 0 0 / 0.8); }
/* Filet cuivre : progression du dossier (complète, dernière étape atteinte). */
.mdih__card::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 3px; background: linear-gradient(90deg, var(--md-copper) 0%, #D8B08C 70%, rgb(216 176 140 / 0.35) 100%); }
.mdih__card-head { align-items: center; border-bottom: 1px solid rgb(171 121 86 / 0.16); }
.mdih__card-icon { background: var(--md-espresso); color: var(--md-champagne); box-shadow: 0 10px 20px -12px rgb(41 32 24 / 0.8); }
.mdih__card-label { font-weight: 500; letter-spacing: 0.01em; color: var(--md-copper-text); }
.mdih__card-title { font-family: var(--md-font-display); font-weight: 400; letter-spacing: -0.015em; color: var(--md-espresso); }

.mdih__steps { counter-reset: mdih; gap: 0.35rem; }
.mdih__steps::before { left: calc(0.85rem + 0.6875rem - 1px); top: 1.4rem; bottom: 1.4rem; width: 2px; border-radius: 2px; background: linear-gradient(180deg, var(--md-copper), rgb(171 121 86 / 0.35)); }
.mdih__step { counter-increment: mdih; gap: 0.95rem; min-height: 3rem; padding: 0 1rem 0 0.85rem; border-radius: 0.9rem; color: rgb(41 32 24 / 0.82); }
.mdih__step::after { content: counter(mdih, decimal-leading-zero); margin-left: auto; font-size: 0.75rem; font-variant-numeric: tabular-nums; letter-spacing: 0.04em; color: rgb(41 32 24 / 0.35); }
/* Étapes validées : pastille cuivre cochée. */
.mdih__dot { display: grid; place-items: center; width: 1.375rem; height: 1.375rem; border: 0; background: var(--md-copper); box-shadow: 0 0 0 4px rgb(252 248 244 / 0.95); }
.mdih__dot::after { content: ""; width: 0.42rem; height: 0.24rem; margin-top: -0.1rem; border: solid #fff; border-width: 0 0 1.7px 1.7px; transform: rotate(-45deg); }
/* Étape en cours : ligne surlignée, pastille espresso. */
.mdih__step:last-child { font-weight: 600; color: var(--md-espresso); background: linear-gradient(90deg, rgb(171 121 86 / 0.16), rgb(171 121 86 / 0.05)); box-shadow: inset 0 0 0 1px rgb(171 121 86 / 0.22); }
.mdih__step:last-child::after { color: var(--md-copper-text); }
.mdih__step:last-child .mdih__dot { background: var(--md-espresso); box-shadow: 0 0 0 4px rgb(252 248 244 / 0.95), 0 0 0 7px rgb(171 121 86 / 0.28); }
.mdih__step:last-child .mdih__dot::after { width: 0.42rem; height: 0.42rem; margin: 0; border: 0; border-radius: 50%; background: var(--md-champagne); transform: none; }
.mdih__card-note { display: flex; gap: 0.65rem; align-items: flex-start; border-top: 1px solid rgb(171 121 86 / 0.16); color: rgb(41 32 24 / 0.68); line-height: 1.5; }
.mdih__card-note::before { content: ""; flex: none; width: 0.45rem; height: 0.45rem; margin-top: 0.45rem; border-radius: 50%; background: var(--md-copper); }

/* Animation (une seule, au premier affichage) : le dossier avance d'étape en étape, puis l'étape en cours respire. */
@media (prefers-reduced-motion: no-preference) {
	.mdih__card.is-armed .mdih__dot { background: rgb(171 121 86 / 0.25); }
	.mdih__card.is-armed .mdih__dot::after { opacity: 0; }
	.mdih__card.is-playing .mdih__dot { background: var(--md-copper); }
	.mdih__card.is-playing .mdih__dot::after { opacity: 1; transition: opacity 0.3s ease calc(0.6s + var(--i, 0) * 0.42s); }
	.mdih__card.is-playing .mdih__step:last-child .mdih__dot { background: var(--md-espresso); animation: mdih-now 2.8s ease-in-out 2.8s infinite; }
}
@keyframes mdih-now { 0%, 100% { box-shadow: 0 0 0 4px rgb(252 248 244 / 0.95), 0 0 0 7px rgb(171 121 86 / 0.28); } 50% { box-shadow: 0 0 0 4px rgb(252 248 244 / 0.95), 0 0 0 12px rgb(171 121 86 / 0); } }
@media (max-width: 30rem) { .mdih__step { min-height: 2.75rem; padding-right: 0.75rem; } }
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) { .mdih__card { background: var(--md-ivory); } }

/* =========================================================================================
   Passe B2B premium (2026-10-27) : « Pour qui », « Notre rôle », candidature.
   ========================================================================================= */
/* Pour qui — onglets affirmés, panneau éditorial texte + photo, CTA bouton. */
.mdip__tab { min-height: 3.6rem; border-color: rgb(41 32 24 / 0.08); border-radius: 0.9rem; box-shadow: 0 1px 2px rgb(41 32 24 / 0.04); }
.mdip__tab-icon { width: 2.25rem; height: 2.25rem; border-radius: 0.65rem; }
.mdip__tab:hover { border-color: rgb(171 121 86 / 0.5); background: rgb(252 248 244 / 0.9); }
.mdip__tab[aria-selected="true"] { border-color: var(--md-espresso); background: linear-gradient(135deg, #352A20, var(--md-espresso)); box-shadow: 0 18px 34px -20px rgb(41 32 24 / 0.75); }
.mdip__tab[aria-selected="true"] .mdip__tab-icon { background: var(--md-copper); color: var(--md-on-copper, #1A140F); }
.mdip__panel { position: relative; overflow: hidden; border: 1px solid rgb(41 32 24 / 0.07); border-radius: 1.5rem; background: var(--md-white); box-shadow: 0 2px 6px rgb(41 32 24 / 0.04), 0 40px 80px -60px rgb(41 32 24 / 0.55); }
.mdip__panel::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 3px; background: linear-gradient(90deg, var(--md-copper), rgb(216 195 165 / 0.25)); }
.mdip__panel.has-media { display: grid; gap: 1.5rem; padding: 0; }
.mdip__panel.has-media .mdip__content { padding: 0 clamp(1.5rem, 1.2rem + 1.2vw, 2.25rem) clamp(1.5rem, 1.2rem + 1.2vw, 2.25rem); }
.mdip__media { position: relative; margin: 0; aspect-ratio: 16 / 9; overflow: hidden; background: var(--md-linen); }
.mdip__media img { display: block; width: 100%; height: 100%; object-fit: cover; }
.mdip__media-note { position: absolute; right: 0.75rem; bottom: 0.75rem; padding: 0.22rem 0.6rem; border-radius: 999px; background: rgb(21 28 33 / 0.55); color: #fff; font-size: 0.6875rem; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.mdip__cases { gap: 0; }
.mdip__cases li { align-items: center; padding: 0.85rem 0; border-bottom: 1px solid rgb(41 32 24 / 0.07); }
.mdip__cases li:last-child { border-bottom: 0; }
.mdip__tick { margin-top: 0; width: 1.5rem; height: 1.5rem; background: rgb(171 121 86 / 0.14); }
.mdip__tick::after { left: 0.55rem; top: 0.35rem; border-color: var(--md-copper-text); }
.mdip__cta { display: inline-flex; align-items: center; gap: 0.5rem; min-height: 3.25rem; margin-top: 1.5rem; padding: 0 1.6rem; border-radius: 0.75rem; background: #C08D68; color: var(--md-on-copper, #1A140F); font-weight: 600; text-decoration: none; box-shadow: 0 1px 0 rgb(255 255 255 / 0.25) inset, 0 12px 24px -14px rgb(122 80 50 / 0.8); transition: background-color 0.2s ease; }
.mdip__cta:hover { background: var(--md-copper); color: var(--md-on-copper, #1A140F); }
.mdip__cta .md-icon { transition: transform 0.25s ease; }
.mdip__cta:hover .md-icon { transform: translateX(3px); }
.mdip__cta:focus-visible { outline: 2px solid var(--md-espresso); outline-offset: 3px; }
@media (min-width: 64rem) {
	.mdip.is-enhanced .mdip__body { grid-template-columns: 20rem minmax(0, 1fr); gap: 1.75rem; }
	.mdip__panel.has-media { grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr); align-items: stretch; gap: 0; }
	.mdip__panel.has-media .mdip__content { order: -1; padding: 2.75rem 2.75rem 2.5rem; }
	.mdip__media { aspect-ratio: auto; min-height: 100%; }
}
@media (prefers-reduced-motion: no-preference) {
	.mdip.is-enhanced .mdip__panel:not([hidden]) .mdip__media img { animation: mdip-photo 0.7s var(--md-ease-out, ease) both; }
}
@keyframes mdip-photo { from { opacity: 0; transform: scale(1.04); } }
@media (prefers-reduced-motion: reduce) { .mdip__cta, .mdip__cta .md-icon { transition: none; } }

/* Notre rôle — garanties : tuile espresso, survol discret. */
.mdir__point { border-radius: 1.1rem; transition: transform 0.3s var(--md-ease-out, ease), box-shadow 0.3s ease, border-color 0.3s ease; }
.mdir__icon { background: var(--md-espresso); color: var(--md-champagne); }
@media (hover: hover) and (prefers-reduced-motion: no-preference) { .mdir__point:hover { transform: translateY(-4px); border-color: rgb(171 121 86 / 0.35); box-shadow: 0 30px 50px -34px rgb(41 32 24 / 0.55); } }

/* Candidature — engagements cochés, formulaire en carte surélevée. */
.mds-immo .mds-immo__points { gap: 0.85rem; margin-top: 1.75rem; }
.mds-immo .mds-immo__points li { padding: 0.9rem 1rem 0.9rem 3rem; border: 1px solid rgb(171 121 86 / 0.18); border-radius: 0.9rem; background: rgb(255 255 255 / 0.65); font-size: 0.9375rem; }
.mds-immo .mds-immo__points li::before { left: 1rem; top: 50%; width: 1.25rem; height: 1.25rem; margin-top: -0.625rem; border-radius: 50%; background: var(--md-copper) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M3 6.2 5 8l4-4.2' fill='none' stroke='%23fff' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 0.8rem no-repeat; }
.mds-immo .mds-immo__card { padding: clamp(1.25rem, 0.9rem + 1.4vw, 2.25rem); border: 1px solid rgb(41 32 24 / 0.07); border-radius: 1.5rem; background: var(--md-white); box-shadow: 0 2px 6px rgb(41 32 24 / 0.04), 0 50px 90px -60px rgb(41 32 24 / 0.6); }
/* Le formulaire est déjà dans la carte : pas de second cadre ; groupes de champs mieux espacés ; profils en tuiles. */
.mds-immo .mds-immo__card .md-immo-form { padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; margin-top: 1.5rem; }
.mds-immo .md-immo-form fieldset + fieldset, .mds-immo .md-immo-form fieldset { margin-top: 1.75rem; }
.mds-immo .md-immo-form fieldset:first-of-type { margin-top: 0; }
.mds-immo .md-immo-form legend { margin-bottom: 0.85rem; font-family: var(--md-font-display); font-size: 1.25rem; font-weight: 400; color: var(--md-espresso); }
.mds-immo .md-immo-kinds .md-pa-structure__option { border-radius: 0.8rem; transition: border-color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease; }
.mds-immo .md-immo-kinds .md-pa-structure__option:hover { border-color: rgb(171 121 86 / 0.55); }
.mds-immo .md-immo-kinds .md-pa-structure__option:has(input:checked) { border-color: var(--md-copper); background: rgb(171 121 86 / 0.08); box-shadow: inset 0 0 0 1px var(--md-copper); }
.mds-immo .md-immo-kinds input[type="radio"] { accent-color: var(--md-copper); }
@media (prefers-reduced-motion: reduce) { .mds-immo .md-immo-kinds .md-pa-structure__option { transition: none; } }
.mdip__cta .md-icon, .mdip__cta svg { color: currentColor; }

/* =========================================================================================
   Hero — direction finale (2026-10-27) : titre fort sur la photo, suivi du dossier en barre produit
   horizontale pleine largeur (verre ivoire) sous le texte. Mobile : carte verticale inchangée.
   ========================================================================================= */
@media (min-width: 64rem) {
	.mdih { padding-bottom: clamp(2rem, 1.5rem + 1.5vw, 3rem); }
	.mdih__grid { grid-template-columns: minmax(0, 1fr); min-height: 0; gap: clamp(2.5rem, 2rem + 2vw, 4rem); }
	.mdih__text { max-width: 44rem; }
	.mdih__visual { display: block; padding: 0; }
	.mdih__visual::before, .mdih__visual::after { display: none; }
	.mdih__card { display: grid; grid-template-columns: 15rem minmax(0, 1fr); grid-template-rows: auto auto; align-items: center; column-gap: 2.5rem; width: 100%; max-width: none; margin: 0; padding: 1.5rem 2rem; border-radius: 1.25rem; }
	.mdih__card-head { grid-row: 1 / span 2; flex-direction: column; align-items: flex-start; gap: 0.85rem; padding: 0 2.5rem 0 0; border-bottom: 0; border-right: 1px solid rgb(171 121 86 / 0.18); align-self: stretch; justify-content: center; }
	.mdih__card-title { font-size: 1.25rem; line-height: 1.2; }
	.mdih__steps { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 0.5rem; margin: 0; }
	.mdih__steps::before { left: 1.6rem; right: calc(20% - 1.6rem); top: 1.5rem; bottom: auto; width: auto; height: 2px; background: linear-gradient(90deg, var(--md-copper), rgb(171 121 86 / 0.45)); }
	.mdih__step { flex-direction: column; align-items: flex-start; gap: 0.7rem; min-height: 0; padding: 0.85rem 0.9rem; font-size: 0.9375rem; line-height: 1.3; }
	.mdih__step::after { position: absolute; top: 0.95rem; right: 0.9rem; margin: 0; }
	.mdih__step:last-child { background: linear-gradient(180deg, rgb(171 121 86 / 0.16), rgb(171 121 86 / 0.05)); }
	.mdih__card-note { grid-column: 2; margin: 0.6rem 0 0; padding: 0.75rem 0.9rem 0; font-size: 0.8125rem; }
	.mdih__caption { bottom: auto; top: 1rem; }
}
@media (min-width: 64rem) and (max-width: 79.99rem) {
	.mdih__card { grid-template-columns: 12.5rem minmax(0, 1fr); column-gap: 1.75rem; padding: 1.25rem 1.5rem; }
	.mdih__card-head { padding-right: 1.75rem; }
	.mdih__step { font-size: 0.875rem; padding-inline: 0.7rem; }
}
@media (min-width: 64rem) {
	.mdih__step::after { display: none; }
	.mdih__steps::before { top: calc(0.85rem + 0.6875rem - 1px); }
	.mdih__text { max-width: 62rem; }
	.mdih__title { max-width: 20ch; font-size: clamp(3rem, 1.8rem + 2.6vw, 4.5rem); line-height: 1.04; }
	.mdih .md-breadcrumb { margin-bottom: 1.5rem; }
}

/* =========================================================================================
   « Comment ça marche » (page immobilier, 2026-10-27) : parcours en cartes numérotées,
   grands chiffres éditoriaux, photo arrondie fixe au défilement, étape finale mise en avant.
   ========================================================================================= */
#methode .mds-steps__media { position: relative; overflow: hidden; border-radius: 1.5rem; box-shadow: 0 40px 80px -50px rgb(41 32 24 / 0.6); }
#methode .mds-steps__media img { display: block; width: 100%; height: 100%; object-fit: cover; }
#methode .mds-steps__media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 60%, rgb(29 22 17 / 0.35)); pointer-events: none; }
#methode .mds-steps__list { counter-reset: none; gap: 0.85rem; margin-top: clamp(1.75rem, 1.4rem + 1vw, 2.5rem); }
#methode .mds-steps__list li { grid-template-columns: 4rem minmax(0, 1fr); gap: 1.25rem; align-items: center; padding: 1.35rem 1.5rem; border: 1px solid rgb(41 32 24 / 0.07); border-radius: 1.15rem; background: var(--md-white); box-shadow: 0 1px 2px rgb(41 32 24 / 0.04), 0 18px 36px -30px rgb(41 32 24 / 0.45); transition: transform 0.3s var(--md-ease-out, ease), border-color 0.3s ease, box-shadow 0.3s ease; }
#methode .mds-steps__list li::after { display: none; }
#methode .mds-steps__num { width: auto; height: auto; padding-right: 1.25rem; border-right: 1px solid rgb(171 121 86 / 0.25); border-radius: 0; background: none; font-family: var(--md-font-display); font-size: 2.25rem; font-weight: 400; line-height: 1; letter-spacing: -0.02em; color: var(--md-copper); }
#methode .mds-steps__body { padding-top: 0; }
#methode .mds-steps__body h3 { margin: 0 0 0.3rem; font-size: 1.0625rem; font-weight: 600; color: var(--md-espresso); }
#methode .mds-steps__body p { margin: 0; font-size: 0.9375rem; line-height: 1.55; color: var(--md-ink-muted); }
/* Étape finale : le suivi, ce que le partenaire voit au quotidien. */
#methode .mds-steps__list li:last-child { border-color: var(--md-espresso); background: linear-gradient(135deg, #352A20, var(--md-espresso)); box-shadow: 0 30px 60px -36px rgb(41 32 24 / 0.8); }
#methode .mds-steps__list li:last-child .mds-steps__num { border-right-color: rgb(216 195 165 / 0.25); color: var(--md-champagne); }
#methode .mds-steps__list li:last-child h3 { color: var(--md-white); }
#methode .mds-steps__list li:last-child p { color: rgb(248 246 241 / 0.75); }
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
	#methode .mds-steps__list li:not(:last-child):hover { transform: translateX(4px); border-color: rgb(171 121 86 / 0.4); }
}
@media (min-width: 64rem) {
	#methode .mds-steps__grid { grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr); align-items: center; }
	#methode .mds-steps__media { aspect-ratio: 4 / 5; }
}
@media (max-width: 30rem) { #methode .mds-steps__list li { grid-template-columns: 3rem minmax(0, 1fr); gap: 1rem; padding: 1.15rem; } #methode .mds-steps__num { font-size: 1.75rem; padding-right: 0.9rem; } }
@media (prefers-reduced-motion: reduce) { #methode .mds-steps__list li { transition: none; } }

/* Candidature immobilier : même présentation que celle des professionnels du bâtiment (règles reprises de professionals.css, non chargé ici). */
.md-pt-apply__points { display: grid; gap: 0.75rem; margin: 1.75rem 0 0; padding: 0; list-style: none; }
.md-pt-apply__points li { display: flex; align-items: center; gap: 0.7rem; font-size: 0.9375rem; color: var(--md-ink); }
.md-pt-apply__points .md-icon { flex: none; width: 1.35rem; height: 1.35rem; stroke-width: 1.4; color: var(--md-copper-btn); }
.md-pt-apply__next { margin-top: 2rem; padding: 1.5rem 1.6rem; border-radius: 16px; background: var(--md-brown); color: var(--md-on-dark); }
.md-pt-apply__next-title { font-size: var(--md-fs-xs); font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--md-champagne); }
.md-pt-apply__next ol { display: grid; gap: 1rem; margin: 1rem 0 0; padding: 0; list-style: none; counter-reset: md-next; }
.md-pt-apply__next li { position: relative; display: grid; gap: 0.2rem; padding-left: 2.4rem; counter-increment: md-next; }
.md-pt-apply__next li::before { content: counter(md-next); position: absolute; left: 0; top: 0; display: grid; place-items: center; width: 1.6rem; height: 1.6rem; border: 1px solid rgb(216 195 165 / 0.55); border-radius: 50%; font-size: 0.75rem; font-weight: 600; color: var(--md-champagne); }
.md-pt-apply__next strong { font-size: 0.9375rem; font-weight: 600; color: var(--md-white); }
.md-pt-apply__next span { font-size: var(--md-fs-small); line-height: 1.55; color: var(--md-on-dark-muted); }

/* Lien de téléchargement du kit de présentation (PDF), sous les boutons de l'en-tête. */
.mdih__download { display: inline-flex; align-items: center; gap: 0.75rem; margin-top: 1.1rem; padding: 0.45rem 0.9rem 0.45rem 0.45rem; border: 1px solid rgb(216 195 165 / 0.45); border-radius: 999px; color: #fff; text-decoration: none; transition: border-color 0.2s ease, background-color 0.2s ease; }
.mdih__download-icon { display: inline-grid; place-items: center; width: 2rem; height: 2rem; border-radius: 50%; background: var(--md-champagne, #D8C3A5); }
.mdih__download-icon svg { width: 1rem; height: 1rem; fill: none; stroke: var(--md-espresso, #292018); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.mdih__download span:last-child { display: grid; line-height: 1.25; }
.mdih__download strong { font-size: 0.875rem; font-weight: 600; }
.mdih__download small { font-size: 0.75rem; color: rgb(248 246 241 / 0.7); }
.mdih__download:hover { border-color: var(--md-champagne, #D8C3A5); background: rgb(216 195 165 / 0.1); }
.mdih__download:focus-visible { outline: 2px solid var(--md-champagne, #D8C3A5); outline-offset: 3px; }