/* =============================================================
   immoProspia, pages de capture LIGHT (ivoire + or)
   Surcouche chargée APRÈS seo.css : ré-skin clair, papier + brillance,
   continuité visuelle avec les magazines (flipbook).
   ============================================================= */
:root {
  --bg-deep:      #efe6cf;
  --bg:           #f1ead8;
  --surface-1:    #faf6ec;
  --surface-2:    #f6f0e0;
  --border-light: #e7dfca;
  --border:       #d8cfb6;
  --gold:         #F5B300;
  --gold-light:   #FFD046;
  --gold-dark:    #c48f00;
  --gold-text:    #c48f00;   /* or sombre de la charte, lisible sur ivoire (TEXTE doré) */
  --text-title:   #181308;
  --text-body:    #322c1f;
  --text-2:       #6d6453;
  --text-3:       #938a76;
  --success:      #2f8a4f;
  --font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --disp: 'Sora', 'Inter', sans-serif;
}

/* papier ivoire + grain subtil */
body {
  background:
    linear-gradient(rgba(60,45,10,.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(60,45,10,.025) 1px, transparent 1px),
    radial-gradient(120% 90% at 50% -10%, #fcf8ec 0%, #f1ead8 45%, #e7decb 100%);
  background-size: 46px 46px, 46px 46px, 100% 100%;
  background-attachment: fixed;
  color: var(--text-body);
}

/* TEXTE doré -> bronze (contraste sur clair) ; or plein gardé pour les fills */
a, a:visited { color: var(--gold-text); }
a:hover { color: var(--gold-dark); }
.brand .p, .site-footer .brand .p { color: #c48f00; }
.hero h1 .gold, .section h2 .gold, .article h2 .gold, .cta h2 .gold { color: var(--gold-text); }
.card .stat { color: var(--gold-text); }
.btn-ghost { color: var(--gold-text); border-color: rgba(196,143,0,.4); }
.btn-ghost:hover { background: rgba(245,179,0,.12); color: var(--gold-dark); }
.eyebrow { color: var(--gold-text); border-color: rgba(196,143,0,.35); background: rgba(245,179,0,.10); }
.faq summary::after { color: var(--gold-text); }
.article .meta, .site-header .nav a { color: var(--text-2); }

/* titres en Sora (comme les magazines) */
.hero h1, .section h2, .cta h2, .article h1, .article h2, .brand { font-family: var(--disp); }

/* en-tête ivoire translucide */
.site-header { background: rgba(250,246,236,.86); border-bottom-color: var(--border); }
.brand { color: var(--text-title); }
.nav a:hover { color: var(--text-title); }
.nav .btn-nav { color: #000; }

/* hero clair + halo or doux + balayage brillant */
.hero {
  background:
    radial-gradient(900px 520px at 50% -12%, rgba(245,179,0,.22), transparent 70%),
    radial-gradient(120% 90% at 50% -10%, #fdf9ee, #f1ead8 55%, #ece2c9 100%);
}
.hero::before {
  content:""; position:absolute; top:-60%; left:-45%; width:55%; height:230%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.6), transparent);
  transform: rotate(18deg); filter: blur(7px); pointer-events:none; z-index:0;
  animation: lpsweep 7.5s ease-in-out 1.4s infinite;
}
.hero > .wrap { position: relative; z-index: 1; }
@keyframes lpsweep { 0%,60%{ transform: translateX(-45%) rotate(18deg); } 82%,100%{ transform: translateX(560%) rotate(18deg); } }
@media (prefers-reduced-motion: reduce) { .hero::before { animation: none; } }
.hero h1 { color: var(--text-title); }
.hero .lead { color: var(--text-2); }
.hero .note { color: var(--text-3); }

/* sections claires */
.section { border-top-color: var(--border-light); }
.section.alt { background: var(--surface-2); }
.section h2, .section h3, .article h1, .article h2, .article h3 { color: var(--text-title); }
.section p, .section li, .article p, .article li { color: var(--text-body); }
.section .muted, .article .meta { color: var(--text-2); }

/* cartes / faq ivoire */
.card, .faq details, .article .callout { background: var(--surface-1); border-color: var(--border); }
.faq summary { color: var(--text-title); }
.faq .answer { color: var(--text-2); }
.card p { color: var(--text-2); }

/* CTA clair */
.cta {
  background:
    radial-gradient(700px 380px at 50% 120%, rgba(245,179,0,.20), transparent 70%),
    var(--bg-deep);
  border-top-color: var(--border-light);
}
.cta h2 { color: var(--text-title); }
.cta p { color: var(--text-2); }

/* footer clair */
.site-footer { background: var(--bg-deep); border-top-color: var(--border-light); color: var(--text-3); }
.site-footer .legal { border-top-color: var(--border-light); color: var(--text-3); }
.site-footer .legal a { color: var(--text-2); }
.site-footer .legal a:hover { color: var(--gold-dark); }

/* le bouton or plein reste tel quel (fond #F5B300, texte noir) : OK sur ivoire */