/* ============================================================
   blog-v4.css — complément pour les articles de blog
   Chargé APRÈS shared-v4.css. Style les classes propres aux
   articles (prose, cross-links, CTA, footer 4 colonnes).
   ============================================================ */

:root{--ink-soft:rgba(28,25,22,.74);--text-3:rgba(28,25,22,.40)}
/* Dans le footer sombre, --text-3 doit être clair (adresse footer-intro) */
.site-footer{--text-3:rgba(255,255,255,.42)}

.container-narrow{width:min(760px,92%);margin-inline:auto}

/* ── Hero sous-titre géo ── */
.page-hero .h1-geo{font-size:.8rem;color:var(--gold-h);letter-spacing:.02em;margin:.3rem 0 .5rem}

/* ── Corps d'article (prose) ── */
.container-narrow article{color:var(--ink-soft)}
.container-narrow article h2{font-family:'Cormorant Garamond',serif;font-weight:300;font-size:clamp(1.55rem,2.6vw,2.15rem);letter-spacing:-.02em;color:var(--ink);margin:2.4rem 0 1rem;line-height:1.15}
.container-narrow article h3{font-family:'Cormorant Garamond',serif;font-weight:500;color:var(--ink);letter-spacing:-.01em}
.container-narrow article p{margin-bottom:1.1rem}
.container-narrow article a{color:var(--gold-h);transition:color .2s}
.container-narrow article a:hover{color:var(--gold)}
.container-narrow article strong{color:var(--ink);font-weight:600}

/* ── Cross-links (À lire aussi) ── */
.cross-links{display:grid;gap:.6rem}
.cross-link{display:block;padding:.8rem 1.1rem;border:1px solid var(--border);border-radius:var(--r);font-size:.88rem;color:var(--ink);transition:border-color .3s var(--ease),background .3s,color .3s}
.cross-link:hover{border-color:var(--gold);background:var(--gold-dim);color:var(--gold-h)}

/* ── CTA bannière sombre + halo doré ── */
.cta-banner{position:relative;overflow:hidden;background:var(--dark);padding:4.5rem 0;text-align:center}
.cta-banner::before{content:'';position:absolute;inset:0;pointer-events:none;background:
  radial-gradient(ellipse 60% 50% at 50% 45%,rgba(184,145,74,.16),transparent 66%),
  radial-gradient(ellipse 120% 100% at 50% 45%,transparent 42%,rgba(0,0,0,.5) 100%)}
.cta-banner .container{position:relative;z-index:1}
.cta-banner h2{color:#fff;margin-bottom:.6rem}
.cta-banner p{color:rgba(255,255,255,.55);margin:0 auto 1.8rem;max-width:560px}
.cta-banner .actions{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}
/* Bouton principal sur fond sombre = doré (lisible) */
.cta-banner .btn-primary{background:var(--gold);color:var(--dark);border-color:var(--gold)}
.cta-banner .btn-primary:hover{background:#fff;border-color:#fff;color:var(--dark)}
/* Bouton secondaire du CTA = contour clair */
.cta-banner .btn-outline{background:transparent;color:rgba(255,255,255,.85);border-color:rgba(255,255,255,.32)}
.cta-banner .btn-outline:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.7);color:#fff}

/* ── Footer 4 colonnes (articles) ── */
.site-footer .footer-grid{grid-template-columns:1.6fr 1fr 1fr 1.2fr}
@media(max-width:820px){.site-footer .footer-grid{grid-template-columns:1fr 1fr;gap:2rem}}
@media(max-width:520px){.site-footer .footer-grid{grid-template-columns:1fr}}
.footer-col-title{font-family:'Instrument Sans',sans-serif;font-size:.65rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:#fff;margin-bottom:1.2rem}
.footer-links li{margin-bottom:.4rem}
.footer-links a{font-size:.82rem;color:rgba(255,255,255,.45);line-height:1.6;transition:color .2s}
.footer-links a:hover{color:var(--gold-l)}
.footer-bottom-links a{color:rgba(255,255,255,.35);transition:color .2s}
.footer-bottom-links a:hover{color:var(--gold-l)}
/* Boutons dans le footer (colonne Réserver) */
.site-footer .footer-grid .btn{width:100%}
.site-footer .btn-primary{background:var(--gold);color:var(--dark);border-color:var(--gold)}
.site-footer .btn-primary:hover{background:var(--gold-h);border-color:var(--gold-h);color:#fff}
.btn-outline-footer{display:inline-flex;align-items:center;justify-content:center;width:100%;background:transparent;color:rgba(255,255,255,.85);border:1.5px solid rgba(255,255,255,.32);font-family:'Instrument Sans',sans-serif;font-size:.72rem;font-weight:600;letter-spacing:.13em;text-transform:uppercase;padding:.9rem 1.6rem;border-radius:var(--r);cursor:pointer;transition:all .6s var(--ease)}
.btn-outline-footer:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.7);color:#fff}