/* ==========================================================================
   refonte.css : identite visuelle 2026-10, chargee en dernier sur toutes les
   pages. Elle reprend le systeme de la page residences-etudiantes-lille.html
   (fond blanc, titres sans empattement, heros clairs, cartes photo arrondies)
   par-dessus les styles propres a chaque gabarit.
   ========================================================================== */

:root {
  --ft: 'DM Sans', system-ui, sans-serif;
  --fb: 'DM Sans', system-ui, sans-serif;
  --parch: #ffffff;
  --parch2: #f6f5f2;
  --parch3: #efede8;
  --parchment: #ffffff;
  --parchment2: #f6f5f2;
  --parchment3: #efede8;
  --gl: #ebe8e2;
  --line: #ebe8e2;
  --bg2: #f6f5f2;
  --ink2: #3d3b38;
  --gd: #57544f;
}

body { background: #fff; }

/* ---------- Typographie ---------- */
h1, h2, h3, h4,
[style*="Playfair"], [style*="playfair"],
.lfnav-logo, .logo {
  font-family: 'DM Sans', system-ui, sans-serif !important;
}
h1, h2 { letter-spacing: -.025em; font-weight: 700; }
h3, h4 { letter-spacing: -.015em; }
h1 { line-height: 1.1; }
h2 { line-height: 1.18; }

/* Libelles de section : plus de filet ni de capitales espacees */
.s-label, .eyebrow, .sec-label, .section-label, .kicker, .lfrel-k, .cat {
  font-size: .78rem !important;
  font-weight: 600 !important;
  letter-spacing: .01em !important;
  text-transform: none !important;
  color: var(--red) !important;
  background: none !important;
  border: 0 !important;
  padding: 0 !important;
}
.s-label::before, .eyebrow::before, .sec-label::before, .section-label::before { display: none !important; }

/* ---------- Header ---------- */
header.lfh { background: rgba(255,255,255,.94); border-bottom-color: var(--line); }
main .bc, .bc { background: #fff; border-bottom: 0; }

/* ---------- Heros : sombres -> clairs ---------- */
body :is(.hero, .qhero, .ihero, .cmp-hero, .lx-hero, section.ph):not(.rx-hero) {
  background: #fff !important;
  color: var(--ink) !important;
  border-bottom: 1px solid var(--line);
}
:is(.hero, .qhero, .ihero, .cmp-hero, .lx-hero, section.ph):not(.rx-hero)::before,
:is(.hero, .qhero, .ihero, .cmp-hero, .lx-hero, section.ph):not(.rx-hero)::after,
.hero-bg, .hero-grid-bg, .orb { display: none !important; }

:is(.hero, .qhero, .ihero, .cmp-hero, .lx-hero, section.ph):not(.rx-hero) :is(h1, h2, h3, h4, strong, b) {
  color: var(--ink) !important;
}
:is(.hero, .qhero, .ihero, .cmp-hero, .lx-hero, section.ph):not(.rx-hero) h1 {
  font-size: clamp(2rem, 4.2vw, 3rem) !important;
  letter-spacing: -.03em;
}
:is(.hero, .qhero, .ihero, .cmp-hero, .lx-hero, section.ph):not(.rx-hero) :is(h1, h2) :is(em, span, i) {
  color: var(--red) !important;
  font-style: normal;
  background: none !important;
}
:is(.hero, .qhero, .ihero, .cmp-hero, .lx-hero, section.ph):not(.rx-hero) :is(p, li, dd, small, .lead, .hero-sub, .hero-lead, .lx-lead, .cmp-sub, .byline, .author-role, .author-note) {
  color: var(--ink2) !important;
}
:is(.hero, .qhero, .ihero, .cmp-hero, .lx-hero, section.ph):not(.rx-hero) :is(div, span, figcaption):not([class*="btn"]):not([class*="chip"]):not(.hero-price):not(.hero-price *) {
  color: var(--ink2);
}
:is(.hero, .qhero, .ihero, .cmp-hero, .lx-hero, section.ph):not(.rx-hero) svg { color: var(--red); }
:is(.hero, .qhero, .ihero, .cmp-hero, .lx-hero, section.ph):not(.rx-hero) a:not([class*="btn"]):not(.chip) { color: var(--ink); }
:is(.hero, .qhero, .ihero, .cmp-hero, .lx-hero, section.ph):not(.rx-hero) a[class*="btn"] * { color: inherit !important; }
.hero-frame figcaption { background: rgba(255,255,255,.94) !important; color: var(--ink) !important; }

/* Pastilles du hero */
:is(.hero, .qhero, .ihero, .cmp-hero, .lx-hero, section.ph):not(.rx-hero) :is(.chip, .hero-tag, .lx-pill, .author-pill) {
  background: var(--bg2) !important;
  border: 1px solid var(--line) !important;
  color: var(--ink) !important;
  letter-spacing: .01em !important;
  text-transform: none !important;
  font-weight: 600 !important;
}
:is(.hero, .qhero, .ihero, .cmp-hero, .lx-hero, section.ph):not(.rx-hero) .chip-gold { color: var(--red) !important; }
:is(.hero, .qhero, .ihero, .cmp-hero, .lx-hero, section.ph):not(.rx-hero) .chip-mint { color: #1d7a4f !important; }

/* Chiffres cles du hero : tuiles claires */
:is(.hero, .qhero, .ihero, .cmp-hero, .lx-hero, section.ph):not(.rx-hero) :is(.stat, .kpi, .fact, .cmp-fact, .hero-stats > div) {
  background: var(--bg2) !important;
  border: 1px solid var(--line) !important;
  box-shadow: none !important;
  border-radius: 14px !important;
}
:is(.hero, .qhero, .ihero, .cmp-hero, .lx-hero, section.ph):not(.rx-hero) :is(.stat-val, .fact-v, .kpi strong, .kpi b, .stat strong, .kpi > :first-child, .stat > :first-child) {
  color: var(--ink) !important;
  font-family: 'DM Sans', system-ui, sans-serif !important;
  font-weight: 700 !important;
}
:is(.hero, .qhero, .ihero, .cmp-hero, .lx-hero, section.ph):not(.rx-hero) :is(.stat-lbl, .fact-l, .kpi span, .kpi small, .stat span, .stat small) {
  color: var(--gd) !important;
}

/* Photo du hero */
:is(.hero-shot, .hero-frame, .hero-media) img { border-radius: 18px !important; }
:is(.hero-shot, .hero-frame, .hero-media) { box-shadow: none !important; border: 0 !important; }
:is(.hero-shot, .hero-frame, .hero-media)::before, :is(.hero-shot, .hero-frame, .hero-media)::after { display: none !important; }
.hero-price { box-shadow: 0 10px 30px rgba(15,17,23,.12) !important; border: 1px solid var(--line); }
.hero-price * { color: var(--ink) !important; }

/* Bandeau de faits sous le hero des fiches (sombre a l'origine) */
body .facts, body .strip, body .hero-strip {
  background: var(--bg2) !important;
  color: var(--ink) !important;
  border-top: 0 !important;
  border-bottom: 1px solid var(--line) !important;
}
:is(.facts, .strip, .hero-strip) :is(.fact, .strip-i) { border-color: var(--line) !important; background: transparent !important; }
:is(.facts, .strip, .hero-strip) :is(.fact-l, .strip-l, small, span, dt) { color: var(--gd) !important; }
:is(.facts, .strip, .hero-strip) :is(.fact-v, .strip-v, strong, b, p, dd) { color: var(--ink) !important; }
:is(.facts, .strip, .hero-strip) dt { letter-spacing: .02em; }

/* ---------- Boutons ---------- */
:is(.btn, .hero-btn, .cta-btn, .cta-link, .btn-primary, .btn-red, .nav-cta) {
  border-radius: 12px !important;
  box-shadow: none !important;
  letter-spacing: 0 !important;
}
:is(.btn-primary, .btn-red, .hero-btn) { background: var(--red) !important; color: #fff !important; border-color: var(--red) !important; }
:is(.btn-ghost, .hero-btn-2, .btn-secondary, .btn-outline) {
  background: #fff !important;
  color: var(--ink) !important;
  border: 1px solid var(--ink) !important;
}

/* ---------- Sections et cartes ---------- */
section { border-color: var(--line); }
:is(.card, .res-card, .rcard, .rank, .rank-card, .formule, .typo, .svc-i, .lfrel-card, .conv-card, .faq-i, .ecole, .site-card, .q-card, .qcard, .tip, .alt-card, .alternative-card, .box, .info-card) {
  border-radius: 16px !important;
  border-color: var(--line) !important;
  box-shadow: none !important;
}
:is(.card, .res-card, .rcard, .rank-card, .lfrel-card, .conv-card, .alt-card, .alternative-card):hover {
  box-shadow: 0 12px 32px rgba(15,17,23,.08) !important;
}
:is(.res-photo, .rank-photo, .card-img) { border-radius: 16px 16px 0 0; }
.amenity, .tag, .pill { border-radius: 100px; }

/* Encarts de prix et chiffres : plus de serif a l'ancienne */
:is(.price, .prix, .res-price, .hero-price, .formule-prix, .typo-prix, .stat-val, .fact-v, .kpi strong) {
  font-family: 'DM Sans', system-ui, sans-serif !important;
  font-variant-numeric: lining-nums tabular-nums;
}

/* ---------- Tableaux : en-tete clair ---------- */
main table thead th, main table thead td, main table tr.thead th {
  background: var(--bg2) !important;
  color: var(--ink) !important;
  font-weight: 700;
  letter-spacing: 0 !important;
  text-transform: none !important;
  border-bottom: 1px solid var(--line) !important;
}
main table { border-radius: 14px; overflow: hidden; border: 1px solid var(--line); }
main table td, main table th { border-color: var(--line) !important; }

/* ---------- Blocs sombres de conversion : on garde le contraste, on modernise ---------- */
:is(.cta, .cta-sec, .cta-final, .conv) { border-radius: 0; }
.cta :is(h2, h3) { letter-spacing: -.02em; }

/* ---------- Pied de page ---------- */
.lfnav-logo span { color: #e2574a !important; }

/* Encart "a partir de" pose sur la photo du hero : toujours clair */
.hero-price { background: #fff !important; }
