/* ============================================================
   simulators-seo.css
   PRESENTATION EDITORIALE commune aux pages simulateurs :
   hero SEO, bandes blanc/ivoire, contenu pedagogique (.read/.block),
   cartes exemples, bloc CTA conversion (layout), FAQ, methodologie,
   signature, footer scope. Marque : Fraunces + DM Sans, teal #006E64,
   or #C4973A, forest.
   Le WIDGET/moteur visuel (primitives .sim-*, wizard, carte outil,
   overrides couleur des CTA .sim-cta) reste dans simulators.css et en
   inline dans chaque page. Ne pas melanger les deux responsabilites.
   Centralise depuis capacite/mensualite/taux-endettement (regles
   editoriales strictement identiques).
   ============================================================ */
  :root { --forest:#0F2E22; --teal:#006E64; --teal-dark:#005249; --gold:#C4973A; --iv:#FCFBF7; --iv2:#F6F4EC; --slate:#5B6670; --line:#E7E3D6; }
  body { font-family:'DM Sans',system-ui,sans-serif; }
  .cap-wrap { font-family:'DM Sans',system-ui,sans-serif; color:#1E2422; }
  .cap-wrap h1,.cap-wrap h2,.cap-wrap h3,.cap-wrap .serif { font-family:'Fraunces',Georgia,serif; color:var(--forest); }
  .wide { max-width:1080px; margin:0 auto; padding:0 24px; }
  .read { max-width:760px; margin:0 auto; }
  /* SIM-DESIGN : surtitre detache du premier H2 (6->10) */
  .eyebrow { font-family:'DM Sans'; font-size:12px; letter-spacing:2px; text-transform:uppercase; color:var(--teal); font-weight:800; margin:0 0 10px; }
  /* HERO */
  .cap-hero { text-align:center; max-width:860px; margin:0 auto; padding:44px 24px 22px; }
  .cap-hero h1 { font-size:clamp(30px,4.4vw,44px); line-height:1.14; font-weight:600; margin:4px 0 12px; }
  .cap-hero p.intro { font-size:16.5px; color:var(--slate); line-height:1.6; margin:0 auto 18px; max-width:680px; }
  .cap-hero .reassure { font-size:13px; color:var(--slate); margin:10px 0 0; }
  .cap-hero .reassure b { color:var(--forest); font-weight:700; }
  .cap-hero .reassure span { margin:0 5px; opacity:.5; }
  .hero-cta { margin:12px 0 2px; text-align:center; }
  /* SECTIONS / RYTHME */
  /* SIM-DESIGN : respiration verticale des bandes (34->40) */
  .band { padding:40px 0; }
  .band--soft { background:var(--iv2); }
  .band--hero { background:var(--iv); padding-top:18px; }
  /* SIM-DESIGN : H2 pedagogique affine (taille conservee, tracking + gap) */
  .cap-wrap h2 { font-size:clamp(24px,3vw,30px); font-weight:600; margin:0 0 14px; line-height:1.22; letter-spacing:-.2px; }
  .cap-wrap .read p, .cap-wrap .read li { color:#2A302E; line-height:1.75; font-size:16px; }
  /* SIM-DESIGN : aeration entre les couples titre+contenu (26->40) */
  .block { margin:0 0 40px; }
  .block:last-child { margin-bottom:0; }
  /* CARTES EXEMPLES */
  .ex-cards { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:8px; }
  .ex-card { background:#fff; border:1px solid var(--line); border-radius:16px; padding:22px 20px; box-shadow:0 1px 2px rgba(15,46,34,.04); text-align:center; }
  .ex-card .ex-top { font-family:'DM Sans'; font-size:12px; letter-spacing:1.5px; text-transform:uppercase; color:var(--slate); font-weight:800; }
  .ex-card .ex-amount { font-family:'Fraunces',serif; font-size:34px; font-weight:600; color:var(--forest); line-height:1.1; margin:4px 0 10px; }
  .ex-card .ex-dur { font-size:13.5px; color:var(--slate); margin:0 0 14px; }
  .ex-card .ex-income-l { font-family:'DM Sans'; font-size:11px; letter-spacing:.6px; text-transform:uppercase; color:var(--slate); font-weight:800; }
  .ex-card .ex-income-v { font-family:'DM Sans'; font-size:24px; font-weight:800; color:var(--teal); line-height:1.1; margin:2px 0 2px; }
  .ex-card .ex-income-u { font-size:12.5px; color:var(--slate); }
  .ex-card .ex-rate { margin-top:14px; padding-top:12px; border-top:1px solid var(--line); font-size:12.5px; color:var(--slate); }
  .ex-hyp { margin:18px auto 0; max-width:820px; text-align:center; font-size:13px; color:var(--slate); line-height:1.6; }
  /* CTA CONVERSION */
  .cta-conv { background:var(--forest); border-radius:22px; padding:38px 28px; text-align:center; color:#F3EFE3; }
  .cta-conv h2 { color:#fff; font-size:clamp(26px,3.4vw,34px); margin:0 0 10px; }
  .cta-conv p { color:rgba(243,239,227,.85); max-width:560px; margin:0 auto 20px; line-height:1.6; font-size:16px; }
  .cta-reassure { margin-top:16px; display:flex; gap:10px 22px; justify-content:center; flex-wrap:wrap; font-size:13px; color:rgba(243,239,227,.8); }
  .cta-reassure span::before { content:"— "; color:var(--gold); }
  /* FAQ */
  .faq { max-width:820px; margin:0 auto; }
  .faq details { border:1px solid var(--line); border-radius:14px; margin:12px 0; background:#fff; overflow:hidden; }
  .faq details[open] { border-color:#CFE0DC; }
  .faq summary { cursor:pointer; padding:18px 20px; font-weight:700; color:var(--forest); font-family:'DM Sans'; font-size:16px; list-style:none; display:flex; justify-content:space-between; align-items:center; gap:12px; transition:background .15s; }
  .faq summary::-webkit-details-marker { display:none; }
  .faq summary:hover { background:#FAFBFA; }
  .faq summary:focus-visible { outline:2px solid var(--teal); outline-offset:-2px; }
  .faq summary::after { content:"+"; color:var(--teal); font-size:22px; font-weight:400; line-height:1; }
  .faq details[open] summary::after { content:"−"; }
  .faq .a { padding:0 20px 18px; color:#2A302E; line-height:1.7; font-size:15px; }
  /* MÉTHODOLOGIE */
  .method-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-top:10px; }
  .method-cell { background:#fff; border:1px solid var(--line); border-radius:14px; padding:18px 16px; }
  .method-cell .mt { font-family:'DM Sans'; font-weight:800; font-size:12px; letter-spacing:.6px; text-transform:uppercase; color:var(--teal); }
  .method-cell .md { margin:6px 0 0; color:var(--slate); font-size:13.5px; line-height:1.6; }
  .method-note { max-width:760px; margin:16px auto 0; text-align:center; font-size:13.5px; color:var(--slate); font-style:italic; }
  /* SIGNATURE */
  .signature { max-width:760px; margin:22px auto 0; text-align:center; }
  .signature .sig-name { font-family:'Fraunces',serif; font-size:22px; color:var(--forest); font-weight:600; }
  .signature p { color:var(--slate); font-size:14px; line-height:1.6; margin:6px auto 0; max-width:600px; }
  .signature a { color:var(--teal); font-weight:700; }
  /* FOOTER */
  .cap-footer { background:var(--forest); color:rgba(255,255,255,.8); margin-top:0; }
  .cap-footer .fwrap { max-width:1080px; margin:0 auto; padding:40px 24px 20px; }
  .footer-grid { display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:28px; }
  .cap-footer h4 { color:#fff; font-family:'DM Sans'; font-size:13px; text-transform:uppercase; letter-spacing:1px; margin:0 0 12px; }
  .cap-footer a { color:rgba(255,255,255,.75); text-decoration:none; display:block; margin:6px 0; font-size:14px; }
  .cap-footer a:hover { color:var(--gold); }
  .cap-footer .fbrand img { height:44px; width:auto; opacity:.95; margin-bottom:12px; }
  .cap-footer .fbrand p { font-size:13.5px; line-height:1.6; color:rgba(255,255,255,.7); max-width:280px; }
  .footer-bottom { border-top:1px solid rgba(255,255,255,.12); margin-top:26px; padding-top:18px; text-align:center; font-size:12px; color:rgba(255,255,255,.55); }
  @media (max-width:960px){ .ex-cards{ grid-template-columns:1fr 1fr; } .method-grid{ grid-template-columns:1fr 1fr; } .footer-grid{ grid-template-columns:1fr 1fr; } }
  @media (max-width:600px){
      .band--hero { padding-top:8px; }
      .cap-hero { padding:16px 18px 2px; }
      .cap-hero p.intro { margin-bottom:12px; }
      .hero-cta { margin:8px 0 2px; }
      .cap-hero .reassure { margin-top:8px; }
      .wide { padding:0 16px; }
      .ex-cards { grid-template-columns:1fr; } .method-grid { grid-template-columns:1fr; }
      .footer-grid { grid-template-columns:1fr; }
      .cta-conv { padding:30px 20px; border-radius:18px; }
  }
