/* ============================================================
   PUBLIC.CSS — site vitrine public (ambiance « Terre patrimoine »)
   Feuille STANDALONE, isolée du back-office : n'importe NI les
   tokens fulgore NI components.css. Port fidèle du design system
   validé (design-systems/base.css + terre-patrimoine/theme.css),
   sous-ensemble « home ». 100 % piloté par variables.
   Polices self-hébergées (RGPD, zéro appel réseau) servies par
   Propshaft depuis app/assets/fonts/.
   ============================================================ */

/* ── FONTS (Cormorant Garamond display + DM Sans corps) ─────── */
/* latin-ext */
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 400 600;
  font-display: swap;
  src: url("/assets/cormorant-garamond-normal-400-600-latin-ext-978b5ddd.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 400 600;
  font-display: swap;
  src: url("/assets/cormorant-garamond-normal-400-600-latin-a7e1075e.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: italic;
  font-weight: 400 600;
  font-display: swap;
  src: url("/assets/cormorant-garamond-italic-400-600-latin-ext-dbd1535f.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: italic;
  font-weight: 400 600;
  font-display: swap;
  src: url("/assets/cormorant-garamond-italic-400-600-latin-68caabcf.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("/assets/dm-sans-normal-400-700-latin-ext-bad22e9b.woff2") format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("/assets/dm-sans-normal-400-700-latin-97b33bb4.woff2") format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ── THEME — TERRE PATRIMOINE (terracotta chaud, mode clair) ── */
:root {
  color-scheme: light;

  --color-bg:#FBF6EF; --color-surface:#F5EAD9; --color-surface-alt:#EEDCC2;
  --color-text:#2E2116; --color-text-soft:#5C4A38; --color-text-muted:#8F7B62;
  --color-accent:#B75A34; --color-accent-hover:#9B4A29; --color-on-accent:#FBF6EF;
  --color-secondary:#5F7052; --color-secondary-dark:#485840;
  --color-border:#E6D5BB; --color-border-strong:#D4BB93;
  --color-header-bg:rgba(251,246,239,0.88);

  --radius-sm:3px; --radius-md:8px; --radius-lg:12px;

  --shadow-sm:0 1px 3px rgba(46,33,22,0.08);
  --shadow-md:0 10px 26px rgba(46,33,22,0.12);
  --shadow-lg:0 22px 54px rgba(46,33,22,0.17);

  --scene-hero:radial-gradient(90% 70% at 82% 10%, rgba(183,90,52,0.10), transparent 55%), radial-gradient(70% 60% at 8% 95%, rgba(95,112,82,0.08), transparent 60%), linear-gradient(170deg,#FBF6EF 0%,#F6ECDC 55%,#EFDFC5 100%);

  --tile-hero:linear-gradient(155deg,#E9D2B4,#CBA173);
  --hero-visual-overlay:radial-gradient(55% 45% at 70% 25%, rgba(255,255,255,0.14), transparent 60%);
  --tile-portrait:linear-gradient(155deg,#E2C6A2,#BE9269);
  --tile-1:linear-gradient(155deg,#EAD4B7,#CDA679);
  --tile-2:linear-gradient(155deg,#DEE1C9,#BFC59F);
  --tile-3:linear-gradient(155deg,#E7DCC9,#CBB98F);
  --tile-4:linear-gradient(155deg,#E3CBAE,#C09E76);
}

/* ── ÉCHELLE PARTAGÉE (typo + espace + mouvement) ─────────── */
:root {
  --text-xs:.75rem; --text-sm:.875rem; --text-base:1rem; --text-lg:1.125rem;
  --text-xl:1.25rem; --text-2xl:1.5rem; --text-3xl:1.875rem; --text-4xl:2.25rem;
  --text-5xl:3rem; --text-6xl:3.75rem; --text-7xl:4.5rem;
  --space-1:.25rem; --space-2:.5rem; --space-3:.75rem; --space-4:1rem; --space-5:1.25rem;
  --space-6:1.5rem; --space-8:2rem; --space-10:2.5rem; --space-12:3rem; --space-16:4rem;
  --space-20:5rem; --space-24:6rem;
  --gutter:clamp(1rem,6vw,4rem); --section-gap:clamp(3rem,8vw,7rem);
  --ease:cubic-bezier(0.4,0,0.2,1); --duration-fast:160ms; --duration-base:300ms;
  --font-display:'Cormorant Garamond',Georgia,serif;
  --font-body:'DM Sans',system-ui,-apple-system,sans-serif;
}

/* ── RESET ────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  font-family: var(--font-body);
  font-size: 1rem; line-height: 1.65;
  color: var(--color-text); background-color: var(--color-bg);
  overflow-x: hidden; -webkit-font-smoothing: antialiased;
}
img, svg { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
ul, ol { list-style: none; }
address { font-style: normal; }
button { font: inherit; }

/* ── UTILITAIRES DE LAYOUT ────────────────────────────────── */
.container { width: 100%; max-width: 1240px; margin-inline: auto; padding-inline: var(--gutter); }
.container-narrow { width: 100%; max-width: 860px; margin-inline: auto; padding-inline: var(--gutter); }
.visually-hidden { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.skip-link { position:absolute; left:var(--space-4); top:-100px; z-index:200; background:var(--color-accent); color:var(--color-on-accent,#fff); padding:var(--space-3) var(--space-5); border-radius:var(--radius-sm); transition:top var(--duration-fast) var(--ease); }
.skip-link:focus { top:var(--space-4); }
:focus-visible { outline:2px solid var(--color-accent); outline-offset:3px; }

.eyebrow { font-family: var(--font-body); font-size: var(--text-xs); font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--color-secondary); margin-bottom:var(--space-3); }
.section-title { font-family:var(--font-display); font-size: clamp(var(--text-3xl),4.5vw,var(--text-5xl)); font-weight: 600; letter-spacing: -0.01em; color: var(--color-text); line-height:1.1; }
.section-lead { font-size:var(--text-lg); color:var(--color-text-soft); max-width:56ch; margin-top:var(--space-4); line-height:1.6; }
.section-head { margin-bottom: var(--space-10); }
@media (min-width:768px){ .section-head{ margin-bottom: var(--space-12); } }

/* ── BOUTONS ──────────────────────────────────────────────── */
.btn {
  display:inline-flex; align-items:center; justify-content:center; gap:var(--space-2);
  font-family:var(--font-body); font-size:var(--text-sm); font-weight:600; letter-spacing:.02em;
  text-decoration:none; white-space:nowrap; cursor:pointer;
  border-radius:999px; padding:var(--space-3) var(--space-6); min-height:44px;
  border:1px solid transparent; transition:background-color var(--duration-base) var(--ease), color var(--duration-base) var(--ease), border-color var(--duration-base) var(--ease), transform var(--duration-fast) var(--ease);
}
.btn-primary { background:var(--color-accent); color:var(--color-on-accent); }
.btn-primary:hover, .btn-primary:focus-visible { background:var(--color-accent-hover); transform:translateY(-1px); }
.btn-secondary { background:transparent; color:var(--color-text); border-color:var(--color-border-strong); }
.btn-secondary:hover, .btn-secondary:focus-visible { border-color:var(--color-accent); color:var(--color-accent); }
.btn-ghost { background:transparent; color:var(--color-accent); padding-inline:0; min-height:auto; }
.btn-ghost::after { content:'→'; margin-left:var(--space-1); transition:transform var(--duration-base) var(--ease); display:inline-block; }
.btn-ghost:hover::after { transform:translateX(4px); }
.btn-sm { font-size:var(--text-xs); padding:var(--space-2) var(--space-4); min-height:36px; }
.btn-lg { font-size:var(--text-base); padding:var(--space-4) var(--space-8); }
.btn-block { width:100%; }

/* ── HEADER ───────────────────────────────────────────────── */
/* Flash — confirmation / erreur après soumission d'un formulaire public */
.site-flash-region { margin-top:var(--space-5); }
.site-flash { padding:var(--space-4) var(--space-5); border-radius:var(--radius-md); border-left:4px solid; line-height:1.5; color:var(--color-text); }
.site-flash + .site-flash { margin-top:var(--space-3); }
.site-flash--notice { background:var(--color-surface); border-left-color:var(--color-secondary); }
.site-flash--alert { background:#F7E6E2; border-left-color:#B03A2E; color:#7A2A20; }

.site-header { position:sticky; top:0; z-index:100; background-color:var(--color-header-bg); border-bottom:1px solid var(--color-border); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); }
.header-inner { display:flex; align-items:center; gap:var(--space-4); min-height:72px; padding-block:var(--space-2); }
.logo { display:flex; align-items:center; gap:var(--space-3); flex-shrink:0; }
.logo-mark { width:44px; height:44px; flex-shrink:0; }
.logo-name { font-family:var(--font-display); font-size:var(--text-lg); font-weight:600; color:var(--color-text); letter-spacing:.01em; white-space:nowrap; line-height:1.15; }
.logo-name small { display:block; font-family:var(--font-body); font-size:.6rem; font-weight:500; letter-spacing:.16em; text-transform:uppercase; color:var(--color-text-muted); margin-top:2px; }
.site-nav { flex:1; min-width:0; display:none; }
.nav-list { display:flex; align-items:center; gap:var(--space-1); flex-wrap:wrap; }
.nav-link { font-size:var(--text-sm); font-weight:500; color:var(--color-text-soft); padding:var(--space-2) var(--space-4); border-radius:999px; transition:color var(--duration-fast) var(--ease), background-color var(--duration-fast) var(--ease); white-space:nowrap; }
.nav-link:hover, .nav-link:focus-visible { color:var(--color-text); background-color:var(--color-surface-alt); }
.nav-cta { flex-shrink:0; margin-left:auto; }
.nav-toggle { display:flex; align-items:center; justify-content:center; font-size:var(--text-xl); background:none; border:1px solid var(--color-border-strong); border-radius:999px; color:var(--color-text); cursor:pointer; min-width:44px; min-height:44px; }
@media (min-width:960px){ .nav-toggle{display:none;} .site-nav{display:block;} .nav-cta{margin-left:0;} }
@media (max-width:959px){ .header-inner{gap:var(--space-3);} .nav-cta{display:none;} }

/* ── HERO (home) ──────────────────────────────────────────── */
.hero { position:relative; padding-block: clamp(3rem,10vw,6rem) var(--section-gap); overflow:hidden; background:var(--scene-hero); border-bottom:1px solid var(--color-border); }
.hero-inner { display:grid; grid-template-columns:1fr; gap:var(--space-10); align-items:center; }
@media (min-width:900px){ .hero-inner{ grid-template-columns: 1.1fr .9fr; gap:var(--space-12); } }
.hero-title { font-family:var(--font-display); font-weight:600; font-size:clamp(2.4rem,7vw,4.5rem); line-height:1.04; letter-spacing:-0.01em; color:var(--color-text); margin-bottom:var(--space-5); }
.hero-title em { font-style:italic; color:var(--color-accent); font-weight:500; }
.hero-sub { font-size:clamp(var(--text-base),1.6vw,var(--text-lg)); color:var(--color-text-soft); max-width:52ch; line-height:1.65; margin-bottom:var(--space-8); }
.hero-actions { display:flex; flex-wrap:wrap; align-items:center; gap:var(--space-4); }
.hero-stats { display:flex; gap:var(--space-8); margin-top:var(--space-10); flex-wrap:wrap; }
.hero-stat-num { font-family:var(--font-display); font-size:var(--text-3xl); font-weight:600; color:var(--color-accent); line-height:1; }
.hero-stat-label { font-size:var(--text-xs); color:var(--color-text-muted); letter-spacing:.08em; text-transform:uppercase; margin-top:var(--space-1); }
.hero-visual { position:relative; aspect-ratio:4/5; border-radius:var(--radius-lg); overflow:hidden; background:var(--tile-hero); border:1px solid var(--color-border); }
.hero-visual::after { content:''; position:absolute; inset:0; background:var(--hero-visual-overlay,none); }
.hero-visual-badge { position:absolute; left:var(--space-5); bottom:var(--space-5); background:var(--color-surface); border:1px solid var(--color-border); border-radius:999px; padding:var(--space-2) var(--space-4); font-size:var(--text-xs); font-weight:600; color:var(--color-text); display:flex; align-items:center; gap:var(--space-2); box-shadow:var(--shadow-md); }
.hero-visual-badge .dot { width:8px; height:8px; border-radius:999px; background:var(--color-accent); }

/* ── GRILLE DE BIENS ──────────────────────────────────────── */
.properties-section { padding-block: var(--section-gap); }
.properties-grid { display:grid; grid-template-columns:1fr; gap:var(--space-6); }
@media (min-width:640px){ .properties-grid{ grid-template-columns:repeat(2,1fr); } }
@media (min-width:1040px){ .properties-grid{ grid-template-columns:repeat(3,1fr); gap:var(--space-8); } }

.property-card { position:relative; display:flex; flex-direction:column; background:var(--color-surface); border:1px solid var(--color-border); border-radius:var(--radius-lg); overflow:hidden; transition:box-shadow var(--duration-base) var(--ease), border-color var(--duration-base) var(--ease), transform var(--duration-base) var(--ease); }
.property-card:hover, .property-card:focus-within { border-color:var(--color-border-strong); box-shadow:var(--shadow-md); transform:translateY(-3px); }
/* Titre = lien réel ; le ::after étire la zone cliquable sur toute la carte (a11y : un seul lien nommé par le titre). */
.property-card-link { color:inherit; }
.property-card-link::after { content:''; position:absolute; inset:0; z-index:1; }
.property-card-link:focus-visible { outline:none; }
.property-card:focus-within { outline:2px solid var(--color-accent); outline-offset:2px; }
.property-media { position:relative; aspect-ratio:4/3; background:var(--tile-1); overflow:hidden; }
.property-media img { width:100%; height:100%; object-fit:cover; }
.property-card:nth-child(3n+2) .property-media { background:var(--tile-2); }
.property-card:nth-child(3n+3) .property-media { background:var(--tile-3); }
.property-status { position:absolute; top:var(--space-3); left:var(--space-3); font-size:var(--text-xs); font-weight:700; letter-spacing:.06em; text-transform:uppercase; padding:var(--space-1) var(--space-3); border-radius:999px; background:var(--color-accent); color:var(--color-on-accent); }
/* for_sale : défaut vente, déjà couvert par .property-status de base (accent terracotta). */
/* for_rent : ambre chaud saturé (hex littéral, comme .dpe-* — pas de token ambre existant).
   Distinct du terracotta accent (vente), du muted (loué/vendu, terminal) et des verts DPE
   (#319834/#33cc31) affichés en bas-droite de la même carte. Texte foncé pour AA (~6:1). */
.property-status--for_rent { background:#C68A2E; color:var(--color-text); }
.property-status--under_offer { background:var(--color-surface-alt); color:var(--color-accent); border:1px solid var(--color-accent); padding:calc(var(--space-1) - 1px) calc(var(--space-3) - 1px); }
.property-status--sold, .property-status--rented { background:var(--color-text-muted); color:var(--color-on-accent); }
.property-category { position:absolute; top:var(--space-3); right:var(--space-3); font-size:var(--text-xs); font-weight:600; padding:var(--space-1) var(--space-3); border-radius:999px; background:color-mix(in srgb, var(--color-bg) 82%, transparent); color:var(--color-text); border:1px solid var(--color-border); backdrop-filter:blur(6px); }
.property-body { padding:var(--space-5); display:flex; flex-direction:column; gap:var(--space-2); flex:1; }
.property-type { font-size:var(--text-xs); font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--color-secondary); }
.property-title { font-family:var(--font-display); font-size:var(--text-xl); font-weight:600; color:var(--color-text); line-height:1.2; }
.property-location { font-size:var(--text-sm); color:var(--color-text-soft); display:flex; align-items:center; gap:var(--space-1); }
.property-meta { display:flex; align-items:center; justify-content:space-between; margin-top:auto; padding-top:var(--space-3); border-top:1px solid var(--color-border); }
.property-price { font-family:var(--font-display); font-size:var(--text-lg); font-weight:600; color:var(--color-accent); }
.property-facts { display:flex; align-items:center; gap:var(--space-3); font-size:var(--text-xs); color:var(--color-text-muted); }
.property-dpe { display:inline-flex; align-items:center; justify-content:center; width:24px; height:20px; border-radius:4px; font-size:.65rem; font-weight:700; color:#fff; }

/* Couleurs officielles DPE (grille A→G, vert → rouge) réutilisées pour badges compacts */
.dpe-a { background:#319834; } .dpe-b { background:#33cc31; }
.dpe-c { background:#cbfc34; color:#1a1a1a; } .dpe-d { background:#fbfe06; color:#1a1a1a; }
.dpe-e { background:#fbcc05; color:#1a1a1a; } .dpe-f { background:#fc9935; } .dpe-g { background:#fc1a10; }

/* ── PHILOSOPHIE / PITCH ──────────────────────────────────── */
.philosophy-section { padding-block: var(--section-gap); background:var(--color-surface); border-top:1px solid var(--color-border); border-bottom:1px solid var(--color-border); }
.philosophy-inner { display:grid; grid-template-columns:1fr; gap:var(--space-10); align-items:center; }
@media (min-width:900px){ .philosophy-inner{ grid-template-columns:.9fr 1.1fr; gap:var(--space-16); } }
.philosophy-portrait { aspect-ratio:1; border-radius:var(--radius-lg); background:var(--tile-portrait); border:1px solid var(--color-border); }
.philosophy-quote { font-family:var(--font-display); font-style:italic; font-size:clamp(var(--text-2xl),3.4vw,var(--text-4xl)); line-height:1.3; color:var(--color-text); }
.philosophy-quote em { color:var(--color-accent); font-style:italic; }
.philosophy-signature { margin-top:var(--space-6); font-size:var(--text-sm); color:var(--color-text-soft); }
.philosophy-signature strong { color:var(--color-text); font-weight:600; }

/* ── FACTS / PARTENAIRES ──────────────────────────────────── */
.facts-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:var(--space-4); margin:var(--space-8) 0; }
@media (min-width:520px){ .facts-grid{ grid-template-columns:repeat(4,1fr); } }
.fact-item { padding:var(--space-4); background:var(--color-surface); border:1px solid var(--color-border); border-radius:var(--radius-md); text-align:center; }
.fact-num { font-family:var(--font-display); font-size:var(--text-xl); font-weight:600; color:var(--color-text); }
.fact-label { font-size:var(--text-xs); color:var(--color-text-muted); margin-top:var(--space-1); text-transform:uppercase; letter-spacing:.06em; }

/* ── FOOTER ───────────────────────────────────────────────── */
.site-footer { background:var(--color-bg); border-top:1px solid var(--color-border); padding-block:var(--space-12); }
.footer-inner { display:grid; grid-template-columns:1fr; gap:var(--space-8); }
@media (min-width:768px){ .footer-inner{ grid-template-columns:1.2fr 1fr 1fr; } }
.footer-brand-name { font-family:var(--font-display); font-size:var(--text-xl); font-weight:600; color:var(--color-text); margin-bottom:var(--space-3); }
.footer-tagline { font-size:var(--text-sm); color:var(--color-text-soft); max-width:32ch; line-height:1.6; }
.footer-heading { font-size:var(--text-xs); font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--color-text-muted); margin-bottom:var(--space-4); }
.footer-nav { display:flex; flex-direction:column; gap:var(--space-2); }
.footer-link { font-size:var(--text-sm); color:var(--color-text-soft); transition:color var(--duration-fast) var(--ease); }
.footer-link:hover { color:var(--color-accent); }
.footer-contact { font-size:var(--text-sm); color:var(--color-text-soft); line-height:1.8; }
.footer-contact a { color:var(--color-accent); }
.footer-bottom { margin-top:var(--space-10); padding-top:var(--space-6); border-top:1px solid var(--color-border); display:flex; flex-wrap:wrap; gap:var(--space-4); justify-content:space-between; font-size:var(--text-xs); color:var(--color-text-muted); }
.footer-mentions { max-width:70ch; line-height:1.6; opacity:.85; }

/* ── NAV MOBILE (hamburger fonctionnel — contrôleur Stimulus « mobile-nav ») ──
   Le prototype statique laissait le hamburger décoratif ; ici le contrôleur
   bascule `.is-open` sur `.site-nav`, affiché en panneau déroulant sous le header. */
@media (max-width:959px){
  .site-nav {
    position:absolute; top:100%; left:0; right:0;
    display:none;
    background:var(--color-header-bg);
    -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px);
    border-bottom:1px solid var(--color-border);
    box-shadow:var(--shadow-md);
    padding:var(--space-4) var(--gutter);
  }
  .site-nav.is-open { display:block; }
  .site-nav.is-open .nav-list { flex-direction:column; align-items:stretch; gap:var(--space-1); }
  .site-nav.is-open .nav-link { padding-block:var(--space-3); }
}

/* Partenaires : 2 colonnes fixes (2 items) plutôt que la grille facts 4-col */
.facts-grid--pairs { grid-template-columns:repeat(2,1fr); }

/* ── FICHE BIEN (page /biens/:slug — porté du mockup terre-patrimoine) ─────
   Régime standalone : servi direct par Propshaft, hors `css:bundle`.
   Les barres énergie réutilisent la palette `.dpe-a…g` (échelle A→G identique
   DPE/GES) ; largeurs posées par `:nth-child` (pas de `style=` inline → CSP). */
.property-hero { position:relative; padding-block: var(--space-10) var(--space-8); background:var(--scene-hero); border-bottom:1px solid var(--color-border); }
.property-breadcrumb { font-size:var(--text-xs); color:var(--color-text-muted); margin-bottom:var(--space-5); display:flex; gap:var(--space-2); flex-wrap:wrap; align-items:center; }
.property-breadcrumb a { color:var(--color-text-muted); }
.property-breadcrumb a:hover { color:var(--color-accent); }
.property-hero-media { aspect-ratio:16/9; border-radius:var(--radius-lg); overflow:hidden; background:var(--tile-1); border:1px solid var(--color-border); margin-bottom:var(--space-8); position:relative; }
.property-hero-media img { width:100%; height:100%; object-fit:cover; }
.property-hero-head { display:flex; flex-wrap:wrap; align-items:flex-start; justify-content:space-between; gap:var(--space-6); }
.property-hero-title { font-family:var(--font-display); font-size:clamp(1.9rem,4.6vw,3rem); font-weight:600; color:var(--color-text); line-height:1.1; margin-bottom:var(--space-2); }
.property-hero-location { font-size:var(--text-base); color:var(--color-text-soft); }
.property-hero-price { text-align:right; }
.property-hero-price .price { font-family:var(--font-display); font-size:clamp(var(--text-2xl),3.4vw,var(--text-4xl)); font-weight:600; color:var(--color-accent); }
.property-badges { display:flex; gap:var(--space-2); flex-wrap:wrap; margin-top:var(--space-4); }
.property-badge { font-size:var(--text-xs); font-weight:600; letter-spacing:.06em; text-transform:uppercase; padding:var(--space-2) var(--space-4); border-radius:999px; border:1px solid var(--color-border-strong); color:var(--color-text-soft); }
.property-badge--accent { background:var(--color-accent); color:var(--color-on-accent); border-color:var(--color-accent); }
.property-badge--muted { background:var(--color-text-muted); color:var(--color-on-accent); border-color:var(--color-text-muted); }

.gallery-strip { display:grid; grid-template-columns:repeat(4,1fr); gap:var(--space-3); margin-top:var(--space-8); }
@media (max-width:640px){ .gallery-strip{ grid-template-columns:repeat(2,1fr); } }
.gallery-thumb { aspect-ratio:4/3; border-radius:var(--radius-md); overflow:hidden; border:1px solid var(--color-border); background:var(--tile-2); }
.gallery-thumb img { width:100%; height:100%; object-fit:cover; }
.gallery-thumb:nth-child(3n+2){ background:var(--tile-3); } .gallery-thumb:nth-child(3n+3){ background:var(--tile-4); }

.property-content { padding-block: var(--section-gap); }
.property-layout { display:grid; grid-template-columns:1fr; gap:var(--space-12); }
@media (min-width:960px){ .property-layout{ grid-template-columns: 1.6fr 1fr; gap:var(--space-16); } }
.property-description h2 { font-family:var(--font-display); font-size:var(--text-2xl); font-weight:600; color:var(--color-text); margin-bottom:var(--space-4); }
.property-description p { color:var(--color-text-soft); line-height:1.75; margin-bottom:var(--space-4); }
.property-description p:last-child { margin-bottom:0; }

.energy-block { background:var(--color-surface); border:1px solid var(--color-border); border-radius:var(--radius-lg); padding:var(--space-6); }
.energy-block h2 { font-family:var(--font-display); font-size:var(--text-2xl); font-weight:600; color:var(--color-text); margin-bottom:var(--space-6); }
.energy-scales { display:flex; flex-direction:column; gap:var(--space-6); }
@media (min-width:640px){ .energy-scales{ flex-direction:row; } .energy-scales > * { flex:1; } }
.energy-cost { margin-top:var(--space-6); padding-top:var(--space-6); border-top:1px solid var(--color-border); font-size:var(--text-sm); color:var(--color-text-muted); }
.energy-scale-title { font-size:var(--text-xs); font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--color-text-soft); margin-bottom:var(--space-2); display:block; }
.energy-bars { display:flex; flex-direction:column; gap:2px; }
.energy-bar { display:flex; align-items:center; justify-content:flex-end; padding:3px 8px; font-size:.7rem; font-weight:700; color:#fff; border-radius:0 4px 4px 0; line-height:1.5; }
.energy-bar:nth-child(1){ width:38%; } .energy-bar:nth-child(2){ width:46%; } .energy-bar:nth-child(3){ width:54%; } .energy-bar:nth-child(4){ width:62%; } .energy-bar:nth-child(5){ width:70%; } .energy-bar:nth-child(6){ width:78%; } .energy-bar:nth-child(7){ width:86%; }
.energy-bar--active { outline:2px solid var(--color-text); outline-offset:1px; z-index:1; }

.sidebar-card { background:var(--color-surface); border:1px solid var(--color-border); border-radius:var(--radius-lg); padding:var(--space-6); margin-bottom:var(--space-6); }
.sidebar-card h3 { font-family:var(--font-display); font-size:var(--text-lg); font-weight:600; color:var(--color-text); margin-bottom:var(--space-4); }
.sidebar-list { display:flex; flex-direction:column; gap:var(--space-3); }
.sidebar-row { display:flex; justify-content:space-between; gap:var(--space-4); font-size:var(--text-sm); padding-bottom:var(--space-3); border-bottom:1px solid var(--color-border); }
.sidebar-row:last-child { border-bottom:none; padding-bottom:0; }
.sidebar-row .k { color:var(--color-text-muted); } .sidebar-row .v { color:var(--color-text); font-weight:600; text-align:right; }
.sidebar-agent { display:flex; align-items:center; gap:var(--space-3); margin-bottom:var(--space-5); }
.sidebar-agent-photo { width:52px; height:52px; border-radius:999px; background:var(--tile-portrait); border:1px solid var(--color-border); flex-shrink:0; }
.sidebar-agent-name { font-weight:600; color:var(--color-text); font-size:var(--text-sm); }
.sidebar-agent-role { font-size:var(--text-xs); color:var(--color-text-muted); }
.property-tour-link { margin-top:var(--space-3); }

/* ── INDEX BIENS (page /biens — grille filtrable, form GET SEO-friendly) ──── */
.index-hero { padding-block: var(--space-12) var(--space-8); background:var(--scene-hero); border-bottom:1px solid var(--color-border); }
.filter-bar { display:flex; flex-wrap:wrap; gap:var(--space-4); align-items:flex-end; margin-bottom:var(--space-8); padding:var(--space-5); background:var(--color-surface); border:1px solid var(--color-border); border-radius:var(--radius-lg); }
.filter-field { display:flex; flex-direction:column; gap:var(--space-2); flex:1 1 160px; min-width:0; }
.filter-label { font-size:var(--text-xs); font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--color-text-muted); }
.filter-select { font:inherit; font-size:var(--text-sm); color:var(--color-text); background:var(--color-bg); border:1px solid var(--color-border-strong); border-radius:var(--radius-sm); padding:var(--space-2) var(--space-3); min-height:44px; width:100%; cursor:pointer; }
.filter-select:focus-visible { outline:2px solid var(--color-accent); outline-offset:1px; border-color:var(--color-accent); }
.filter-actions { display:flex; gap:var(--space-3); align-items:center; flex:0 0 auto; }
.results-count { font-size:var(--text-sm); color:var(--color-text-muted); margin-bottom:var(--space-5); }
.empty-state { text-align:center; padding-block:var(--space-16); display:flex; flex-direction:column; gap:var(--space-5); align-items:center; }
.empty-state p { font-size:var(--text-lg); color:var(--color-text-soft); }
@media (max-width:560px){ .filter-field { flex-basis:100%; } .filter-actions { flex-basis:100%; } .filter-actions .btn { flex:1; } }

/* ── PAGES LÉGALES (/mentions-legales, /confidentialite — carte conformité) ──
   Régime standalone Propshaft, hors `css:bundle`. Prose légale lisible ;
   `.legal-todo` = placeholder VOYANT pour les mentions Hoguet/RGPD encore à
   compléter (n° carte T, garant, RC pro, barème, médiateur). */
.footer-legal { flex:0 0 auto; }
.footer-legal-links { display:flex; flex-wrap:wrap; gap:var(--space-2) var(--space-5); }

.legal-page { padding-block: var(--section-gap); }
.legal-inner { max-width:760px; }
.legal-head { margin-bottom:var(--space-10); padding-bottom:var(--space-6); border-bottom:1px solid var(--color-border); }
.legal-title { font-family:var(--font-display); font-size:clamp(2rem,4.6vw,var(--text-4xl)); font-weight:600; color:var(--color-text); line-height:1.1; }
.legal-lead { font-size:var(--text-lg); color:var(--color-text-soft); max-width:60ch; margin-top:var(--space-4); line-height:1.6; }
.legal-block { margin-bottom:var(--space-8); }
.legal-block h2 { font-family:var(--font-display); font-size:var(--text-xl); font-weight:600; color:var(--color-text); margin-bottom:var(--space-3); }
.legal-block p { color:var(--color-text-soft); line-height:1.75; margin-bottom:var(--space-3); max-width:70ch; }
.legal-block p:last-child { margin-bottom:0; }
.legal-list { display:flex; flex-direction:column; gap:var(--space-3); margin-top:var(--space-2); padding-left:var(--space-5); list-style:disc; }
.legal-list li { color:var(--color-text-soft); line-height:1.7; max-width:68ch; }
.legal-todo { font-size:var(--text-sm); color:var(--color-text-muted); background:var(--color-surface); border-left:3px solid var(--color-border-strong); border-radius:var(--radius-sm); padding:var(--space-3) var(--space-4); font-style:italic; margin-bottom:var(--space-3); }
.legal-bareme-download a { color:var(--color-accent); text-decoration:underline; text-underline-offset:2px; font-weight:500; }
.legal-bareme-download a:hover, .legal-bareme-download a:focus-visible { color:var(--color-accent-hover); }

/* ── CONTACT (/contact — formulaire public) ──────────────────────────────
   Régime standalone Propshaft, hors `css:bundle`. Les champs (.ui-input,
   .ui-textarea, .form-actions) sont des primitives fulgore déjà stylées ;
   ici uniquement l'agencement/espacement du wrapper, calqué sur .legal-*. */
.contact-page { padding-block: var(--section-gap); }
.contact-inner { max-width:760px; }
.contact-head { margin-bottom:var(--space-10); padding-bottom:var(--space-6); border-bottom:1px solid var(--color-border); }
.contact-title { font-family:var(--font-display); font-size:clamp(2rem,4.6vw,var(--text-4xl)); font-weight:600; color:var(--color-text); line-height:1.1; }
.contact-lead { font-size:var(--text-lg); color:var(--color-text-soft); max-width:60ch; margin-top:var(--space-4); line-height:1.6; }

.contact-form-wrapper { max-width:640px; padding:var(--space-8); background:var(--color-surface); border:1px solid var(--color-border); border-radius:var(--radius-lg); }
@media (min-width:640px){ .contact-form-wrapper{ padding:var(--space-10); } }

.contact-privacy { margin-top:var(--space-6); font-size:var(--text-xs); color:var(--color-text-muted); line-height:1.6; }
.contact-privacy-link { color:var(--color-accent); text-decoration:underline; text-underline-offset:2px; font-weight:500; }
.contact-privacy-link:hover, .contact-privacy-link:focus-visible { color:var(--color-accent-hover); }

/* Honeypot anti-spam : hors-flux visuellement mais présent dans le DOM
   (pas de display:none — certains bots le détectent et l'ignorent). */
.contact-form__honeypot { position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }

/* Primitives fulgore (.ui-form, .ui-input, .ui-button…) rendues nues par le
   composant Public::ContactForm — ce layout ne charge PAS components.css
   (cf. en-tête). Habillage scopé sous .public-contact-form uniquement. */
.public-contact-form .ui-form { display:flex; flex-direction:column; gap:var(--space-6); }
.public-contact-form .ui-input { display:flex; flex-direction:column; gap:var(--space-2); }
.public-contact-form .ui-input__label-text { font-size:var(--text-sm); font-weight:600; color:var(--color-text); }
.public-contact-form .ui-input__required { color:var(--color-accent); margin-left:var(--space-1); }
.public-contact-form .ui-input input,
.public-contact-form .ui-input textarea {
  width:100%; font:inherit; font-size:var(--text-base); color:var(--color-text);
  padding:var(--space-3) var(--space-4);
  border:1px solid var(--color-border-strong); border-radius:var(--radius-md);
  background:var(--color-bg);
  transition:border-color var(--duration-fast) var(--ease), box-shadow var(--duration-fast) var(--ease);
}
.public-contact-form .ui-input textarea { min-height:9rem; resize:vertical; }
.public-contact-form .ui-input input:focus,
.public-contact-form .ui-input textarea:focus {
  outline:none; border-color:var(--color-accent);
  box-shadow:0 0 0 3px rgba(183,90,52,0.16);
}
.public-contact-form .form-actions { margin-top:var(--space-2); }
.public-contact-form .ui-button--primary {
  display:inline-flex; align-items:center; justify-content:center;
  min-height:44px; padding:var(--space-3) var(--space-6);
  border:none; border-radius:999px;
  font:inherit; font-size:var(--text-sm); font-weight:600; letter-spacing:.02em;
  color:var(--color-on-accent); background:var(--color-accent);
  cursor:pointer; transition:background-color var(--duration-base) var(--ease), transform var(--duration-fast) var(--ease);
}
.public-contact-form .ui-button--primary:hover,
.public-contact-form .ui-button--primary:focus-visible {
  background:var(--color-accent-hover); transform:translateY(-1px);
}