/* ════════════════════════════════════════════════════════════════════════════
   changer-de-mutuelle.fr – Design System v3
   Palette : Navy #1B3A5C  |  Orange CTA #F07820  |  Teal #1A8A72
   Fonts   : system-ui uniquement (zéro latence externe)
   ════════════════════════════════════════════════════════════════════════════ */
:root {
  --navy:       #1B3A5C;
  --navy-light: #254e7a;
  --orange:     #F07820;
  --orange-dk:  #d4661a;
  --teal:       #1A8A72;
  --teal-light: #e8f7f4;
  --bg:         #F4F6F9;
  --card-bg:    #ffffff;
  --text:       #2c3e50;
  --muted:      #6b7a8d;
  --border:     #dde3ea;
  --shadow-sm:  0 2px 8px rgba(27,58,92,.08);
  --shadow-md:  0 6px 24px rgba(27,58,92,.14);
  --radius:     .75rem;
  --font:       -apple-system,BlinkMacSystemFont,'Segoe UI',system-ui,'Helvetica Neue',Arial,sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
body{font-family:var(--font);font-size:15px;line-height:1.65;color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased}

/* ── Navbar ─────────────────────────────────────────────────────────────── */
.site-navbar{background:var(--navy);position:sticky;top:0;z-index:1030;box-shadow:0 2px 12px rgba(0,0,0,.2)}
.site-navbar .navbar-brand{font-weight:800;font-size:1.1rem;color:#fff!important;letter-spacing:-.4px}
.site-navbar .nav-link{color:rgba(255,255,255,.8)!important;font-size:.875rem;font-weight:500;transition:color .15s}
.site-navbar .nav-link:hover{color:#fff!important}
.btn-cta-nav{background:var(--orange);color:#fff!important;border:none;border-radius:6px;font-weight:700;font-size:.82rem;padding:.42rem 1rem;transition:background .2s,transform .1s}
.btn-cta-nav:hover{background:var(--orange-dk);transform:translateY(-1px)}

/* ── Hero ────────────────────────────────────────────────────────────────── */
.hero{background:linear-gradient(135deg,var(--navy) 0%,#254e7a 55%,#1A8A72 100%);padding:3.5rem 0 2.5rem;position:relative;overflow:hidden}
.hero::before{content:'';position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23ffffff' fill-opacity='0.04'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/svg%3E")}
.hero-badge{display:inline-flex;align-items:center;gap:.4rem;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.22);color:#fff;font-size:.76rem;font-weight:600;padding:.28rem .8rem;border-radius:20px;letter-spacing:.3px;margin-bottom:.9rem}
.hero h1{color:#fff;font-size:clamp(1.55rem,4vw,2.35rem);font-weight:800;line-height:1.2;margin-bottom:.7rem}
.hero h1 em{color:#FFD166;font-style:normal}
.hero-sub{color:rgba(255,255,255,.8);font-size:.95rem;margin-bottom:1.25rem}
.hero-trust{display:flex;flex-wrap:wrap;gap:1rem;margin-top:1.4rem}
.hero-trust-item{display:flex;align-items:center;gap:.38rem;color:rgba(255,255,255,.88);font-size:.8rem;font-weight:500}
.hero-trust-item i{color:#FFD166}

/* ── Form card hero ──────────────────────────────────────────────────────── */
.form-card{background:#fff;border-radius:var(--radius);box-shadow:0 16px 48px rgba(0,0,0,.25);padding:1.75rem;position:relative}
.form-card::before{content:'';position:absolute;top:0;left:1.5rem;right:1.5rem;height:3px;background:linear-gradient(90deg,var(--orange),var(--teal));border-radius:0 0 3px 3px}
.form-card-title{font-size:1rem;font-weight:700;color:var(--navy);margin-bottom:.2rem}
.form-card-sub{font-size:.78rem;color:var(--muted);margin-bottom:1.15rem}

/* ── Stats bar ───────────────────────────────────────────────────────────── */
.stats-bar{background:#fff;border-bottom:2px solid var(--border);padding:.9rem 0}
.stat-item{text-align:center;padding:.4rem 1rem}
.stat-number{font-size:1.5rem;font-weight:800;color:var(--navy);line-height:1}
.stat-label{font-size:.72rem;color:var(--muted);font-weight:500;margin-top:.15rem}
.stat-divider{width:1px;background:var(--border);align-self:stretch}

/* ── Page header (inner pages) ───────────────────────────────────────────── */
.page-header-bar{background:#fff;border-bottom:1px solid var(--border);padding:.9rem 0}
.breadcrumb{margin:0;font-size:.78rem;--bs-breadcrumb-divider-color:var(--muted)}
.breadcrumb-item a{color:var(--navy);text-decoration:none;font-weight:500}
.page-h1{font-size:1.4rem;font-weight:800;color:var(--navy);margin:.3rem 0 0}
.page-h2{font-size:.85rem;color:var(--muted);margin:.1rem 0 0}

/* ── Content cards ───────────────────────────────────────────────────────── */
.content-card{background:#fff;border-radius:var(--radius);box-shadow:var(--shadow-sm);padding:1.6rem;margin-bottom:1.25rem;border:1px solid var(--border);transition:box-shadow .2s}
.content-card:hover{box-shadow:var(--shadow-md)}
.content-card h2{font-size:1rem;font-weight:700;color:var(--navy);margin-bottom:.7rem;display:flex;align-items:center;gap:.5rem}
.content-card h2 i{color:var(--orange);font-size:1.05rem}
.content-card h3{font-size:.9rem;font-weight:700;color:var(--navy);margin-top:1.1rem;margin-bottom:.35rem}
.content-card p{font-size:.875rem}
.content-card ul li{font-size:.875rem;margin-bottom:.3rem}

/* ── Highlight ───────────────────────────────────────────────────────────── */
.highlight-box{background:var(--teal-light);border-left:3px solid var(--teal);border-radius:0 .5rem .5rem 0;padding:.85rem 1rem;font-size:.85rem;margin:1rem 0;color:#0f5244}
.highlight-box strong{color:var(--teal)}

/* ── Steps ───────────────────────────────────────────────────────────────── */
.step-list{list-style:none;padding:0;margin:0;counter-reset:step}
.step-list li{counter-increment:step;display:flex;gap:.8rem;padding:.65rem 0;border-bottom:1px solid var(--border);font-size:.855rem;align-items:flex-start}
.step-list li:last-child{border-bottom:none}
.step-list li::before{content:counter(step);min-width:1.5rem;height:1.5rem;background:var(--navy);color:#fff;font-size:.7rem;font-weight:800;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:.08rem}

/* ── Check list ──────────────────────────────────────────────────────────── */
ul.check-list{list-style:none;padding:0}
ul.check-list li{display:flex;gap:.5rem;align-items:flex-start;font-size:.855rem;margin-bottom:.4rem}
ul.check-list li i{color:var(--teal);flex-shrink:0;margin-top:.18rem}

/* ── Guarantee chips ─────────────────────────────────────────────────────── */
.guarantee-chip{display:inline-flex;align-items:center;gap:.32rem;font-size:.76rem;font-weight:600;color:var(--teal);background:var(--teal-light);padding:.28rem .7rem;border-radius:20px;border:1px solid #a8ddd4;margin:.2rem}

/* ── Sidebar ─────────────────────────────────────────────────────────────── */
.sidebar-card{background:#fff;border-radius:var(--radius);box-shadow:var(--shadow-sm);border:1px solid var(--border);overflow:hidden;margin-bottom:1.25rem}
.sidebar-card-hd{background:var(--navy);color:#fff;padding:.8rem 1.15rem;font-size:.85rem;font-weight:700;display:flex;align-items:center;gap:.45rem}
.sidebar-card-body{padding:1.15rem}

/* CTA urgency box */
.cta-box{background:linear-gradient(135deg,var(--orange) 0%,var(--orange-dk) 100%);border-radius:var(--radius);padding:1.4rem;text-align:center;color:#fff;margin-bottom:1.25rem}
.cta-box .cta-title{font-size:1rem;font-weight:800;margin-bottom:.3rem}
.cta-box .cta-sub{font-size:.78rem;opacity:.88;margin-bottom:.9rem}
.btn-cta-white{background:#fff;color:var(--orange);font-weight:700;font-size:.85rem;border:none;border-radius:6px;padding:.55rem 1.3rem;display:inline-block;text-decoration:none;transition:background .15s,transform .1s}
.btn-cta-white:hover{background:#fff3e6;color:var(--orange-dk);transform:translateY(-1px)}

/* Dept list */
.dept-list{max-height:310px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--border) transparent}
.dept-list a{display:flex;align-items:center;gap:.38rem;padding:.38rem .9rem;font-size:.8rem;color:var(--text);text-decoration:none;border-bottom:1px solid var(--border);transition:background .12s,color .12s}
.dept-list a:last-child{border-bottom:none}
.dept-list a:hover{background:#f0f4ff;color:var(--navy);padding-left:1.1rem}
.dept-list a i{color:var(--orange);font-size:.65rem;flex-shrink:0}

/* Contact form */
.contact-form .form-control{border-radius:6px;border:1.5px solid var(--border);font-size:.875rem;padding:.58rem .85rem;transition:border-color .15s,box-shadow .15s}
.contact-form .form-control:focus{border-color:var(--navy);box-shadow:0 0 0 3px rgba(27,58,92,.1);outline:none}
.contact-form label{font-size:.8rem;font-weight:600;color:var(--navy);margin-bottom:.3rem}
.btn-submit{background:var(--orange);color:#fff;font-weight:700;font-size:.9rem;border:none;border-radius:6px;padding:.7rem 1rem;width:100%;transition:background .2s,transform .1s;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:.45rem}
.btn-submit:hover{background:var(--orange-dk);transform:translateY(-1px)}

/* Rating */
.stars{color:#FFB800;font-size:.85rem}
.rating-line{display:flex;align-items:center;gap:.4rem;font-size:.78rem;color:var(--muted);margin-top:.5rem}

/* Mobile sticky CTA */
.mobile-cta{display:none;position:fixed;bottom:0;left:0;right:0;background:var(--orange);color:#fff;text-align:center;padding:.85rem;font-weight:700;font-size:.92rem;z-index:1020;text-decoration:none;box-shadow:0 -3px 12px rgba(0,0,0,.15)}
@media(max-width:767px){.mobile-cta{display:block}body{padding-bottom:52px}.hero{padding:2rem 0 1.5rem}.stat-number{font-size:1.2rem}}

/* Footer */
.site-footer{background:var(--navy);color:rgba(255,255,255,.65);padding:2.5rem 0 1.5rem;margin-top:3rem}
.site-footer h6{color:#fff;font-weight:700;margin-bottom:.7rem;font-size:.83rem;text-transform:uppercase;letter-spacing:.5px}
.site-footer a{color:rgba(255,255,255,.6);text-decoration:none;font-size:.82rem;transition:color .15s;display:block;margin-bottom:.3rem}
.site-footer a:hover{color:#fff}
.footer-brand{font-size:1.05rem;font-weight:800;color:#fff}
.footer-bottom{border-top:1px solid rgba(255,255,255,.1);margin-top:1.5rem;padding-top:1rem;font-size:.76rem}
