/* ==========================================================================
   Comparateur d'épargne — design system
   --------------------------------------------------------------------------
   Couleurs  : #FFFFFF fond · #30283D titres/blocs sombres · #456A63 CTA
               #35534D hover CTA · #ECE7F1 surfaces douces · #D7A58C accent
               décoratif (jamais pour du petit texte sur blanc) · #62616B texte
               secondaire · #E3E5E8 bordures
   Polices   : Manrope (titres) · Source Sans 3 (texte, interface) — locales
   Échelle   : 13 / 15 / 17 / 19 / 22 / 28 / 32→52 px (fluide)
   Espacement: base 4 px → 4 8 12 16 24 32 48 64 96
   Rayons    : 6 px (contrôles) · 12 px (cartes)
   Conteneurs: 1200 px (site) · 720 px (pages juridiques)
   ========================================================================== */

@font-face{font-family:"Manrope";font-weight:600;font-style:normal;font-display:swap;src:url("../fonts/manrope-latin-600-normal.woff2") format("woff2")}
@font-face{font-family:"Manrope";font-weight:700;font-style:normal;font-display:swap;src:url("../fonts/manrope-latin-700-normal.woff2") format("woff2")}
@font-face{font-family:"Manrope";font-weight:800;font-style:normal;font-display:swap;src:url("../fonts/manrope-latin-800-normal.woff2") format("woff2")}
@font-face{font-family:"Source Sans 3";font-weight:400;font-style:normal;font-display:swap;src:url("../fonts/source-sans-3-latin-400-normal.woff2") format("woff2")}
@font-face{font-family:"Source Sans 3";font-weight:600;font-style:normal;font-display:swap;src:url("../fonts/source-sans-3-latin-600-normal.woff2") format("woff2")}
@font-face{font-family:"Source Sans 3";font-weight:700;font-style:normal;font-display:swap;src:url("../fonts/source-sans-3-latin-700-normal.woff2") format("woff2")}

:root{
  --white:#FFFFFF;
  --ink:#30283D;
  --brand:#456A63;
  --brand-hover:#35534D;
  --soft:#ECE7F1;
  --accent:#D7A58C;
  --muted:#62616B;
  --line:#E3E5E8;

  --font-head:"Manrope","Segoe UI",system-ui,-apple-system,Arial,sans-serif;
  --font-body:"Source Sans 3","Segoe UI",system-ui,-apple-system,Arial,sans-serif;

  --fs-xs:.8125rem;
  --fs-sm:.9375rem;
  --fs-base:1.0625rem;
  --fs-md:1.1875rem;
  --fs-lg:1.375rem;
  --fs-xl:clamp(1.5rem,1.1rem + 1.6vw,2rem);
  --fs-2xl:clamp(2rem,1.2rem + 3.2vw,3.25rem);

  --s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:24px;--s6:32px;--s7:48px;--s8:64px;--s9:96px;
  --r-sm:6px;--r-md:12px;
  --container:1200px;
  --gutter:clamp(16px,4vw,32px);
  --header-h:72px;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--header-h) + 16px)}
body{margin:0;background:var(--white);color:var(--ink);font-family:var(--font-body);font-size:var(--fs-base);line-height:1.6;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img,svg{max-width:100%;display:block}
h1,h2,h3,h4{font-family:var(--font-head);color:var(--ink);line-height:1.2;margin:0;letter-spacing:-.01em}
h1{font-size:var(--fs-2xl);font-weight:800;line-height:1.1}
h2{font-size:var(--fs-xl);font-weight:800}
h3{font-size:var(--fs-md);font-weight:700}
p{margin:0}
a{color:var(--brand);text-underline-offset:3px}
a:hover{color:var(--brand-hover)}
ul{margin:0;padding:0}
button,select{font:inherit;color:inherit}

:focus-visible{outline:3px solid var(--brand);outline-offset:3px;border-radius:var(--r-sm)}
.on-dark :focus-visible,.site-footer :focus-visible{outline-color:var(--white)}

.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip-link{position:absolute;left:var(--s4);top:-80px;z-index:100;background:var(--ink);color:var(--white);padding:var(--s3) var(--s4);border-radius:var(--r-sm);text-decoration:none;font-weight:600}
.skip-link:focus{top:var(--s3);color:var(--white)}

.container{width:100%;max-width:var(--container);margin-inline:auto;padding-inline:var(--gutter)}

/* ---------- Boutons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--s2);min-height:48px;padding:0 var(--s5);border:2px solid transparent;border-radius:var(--r-sm);font-family:var(--font-body);font-size:var(--fs-base);font-weight:700;line-height:1;text-decoration:none;cursor:pointer;transition:background-color .15s ease,border-color .15s ease,color .15s ease,transform .1s ease}
.btn-primary{background:var(--brand);color:var(--white)}
.btn-primary:hover{background:var(--brand-hover);color:var(--white)}
.btn-primary:active{background:var(--brand-hover);transform:translateY(1px)}
.btn-secondary{background:var(--white);color:var(--ink);border-color:var(--ink)}
.btn-secondary:hover{background:var(--soft);color:var(--ink)}
.btn-secondary:active{transform:translateY(1px)}
.btn-sm{min-height:44px;padding:0 var(--s4);font-size:var(--fs-sm)}
.btn[disabled],.btn[aria-disabled="true"]{background:var(--line);color:var(--muted);border-color:var(--line);cursor:not-allowed;transform:none}
.btn svg{width:16px;height:16px;flex:none}

/* ---------- En-tête ---------- */
.site-header{position:sticky;top:0;z-index:50;background:var(--white);border-bottom:1px solid var(--line)}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:var(--s5);min-height:var(--header-h)}
.brand{display:flex;align-items:center;gap:var(--s3);color:var(--ink);text-decoration:none;font-family:var(--font-head);font-weight:800;font-size:var(--fs-md);letter-spacing:-.01em}
.brand:hover{color:var(--ink)}
.brand{min-width:0}
.nav-toggle{flex:none}
.wordmark{font-family:var(--font-head);font-weight:800;font-size:1rem;letter-spacing:.06em;text-transform:uppercase;line-height:1.25;color:var(--ink)}
.wm-api{color:var(--brand)}
.site-footer .wordmark{color:var(--white)}
.site-footer .wm-api{color:var(--accent)}
/* Emplacement réservé au futur logo : se remplit avec <img> sans modifier la mise en page */
.logo-slot{display:flex;align-items:center;min-width:0;min-height:40px}
.logo-slot:empty{display:none}
.logo-slot img{max-height:40px;width:auto}
.nav{display:flex;align-items:center;gap:var(--s5)}
.nav a:not(.btn){color:var(--ink);text-decoration:none;font-weight:600;font-size:var(--fs-sm);padding:var(--s2) 0;border-bottom:2px solid transparent}
.nav a:not(.btn):hover{border-bottom-color:var(--accent);color:var(--ink)}
.nav a[aria-current="page"]{border-bottom-color:var(--brand)}
.nav-toggle{display:none;align-items:center;gap:var(--s2);min-height:44px;padding:0 var(--s4);background:var(--white);border:2px solid var(--ink);border-radius:var(--r-sm);font-weight:700;cursor:pointer}
.nav-toggle:hover{background:var(--soft)}
.nav-toggle .bars{width:18px;height:12px;position:relative;display:block}
.nav-toggle .bars::before,.nav-toggle .bars::after,.nav-toggle .bars i{content:"";position:absolute;left:0;right:0;height:2px;background:var(--ink);border-radius:2px;transition:transform .2s ease,opacity .2s ease}
.nav-toggle .bars::before{top:0}
.nav-toggle .bars i{top:5px}
.nav-toggle .bars::after{bottom:0}
.nav-toggle[aria-expanded="true"] .bars::before{transform:translateY(5px) rotate(45deg)}
.nav-toggle[aria-expanded="true"] .bars i{opacity:0}
.nav-toggle[aria-expanded="true"] .bars::after{transform:translateY(-5px) rotate(-45deg)}

/* ---------- Hero ---------- */
.hero{padding:var(--s8) 0 var(--s9)}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:var(--s8);align-items:center}
.eyebrow{display:inline-flex;align-items:center;gap:var(--s2);font-size:var(--fs-sm);font-weight:700;color:var(--brand);text-transform:uppercase;letter-spacing:.08em;margin-bottom:var(--s4)}
.eyebrow::before{content:"";width:28px;height:3px;background:var(--accent);border-radius:2px}
.hero h1{max-width:18ch}
.hero-lead{margin-top:var(--s5);font-size:var(--fs-md);color:var(--muted);max-width:56ch}
.hero-actions{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s4) var(--s5);margin-top:var(--s6)}
.text-link{font-weight:700}
.hero-note{margin-top:var(--s5);font-size:var(--fs-sm);color:var(--muted);max-width:60ch}

.hero-card{background:var(--ink);color:var(--white);border-radius:var(--r-md);padding:var(--s4) var(--s6) var(--s6);position:relative;overflow:hidden}
.hero-card::before{content:"";position:absolute;left:var(--s6);top:0;width:56px;height:5px;background:var(--accent);border-radius:0 0 4px 4px}
.hero-card h2{color:var(--white);font-size:var(--fs-lg);margin-top:var(--s3)}
.hero-card dl{margin:0;display:grid;gap:0}
.hero-card .stat:first-child{border-top:0}
.hero-card .stat{display:flex;align-items:baseline;gap:var(--s4);padding:var(--s4) 0;border-top:1px solid rgba(255,255,255,.18)}
.hero-card dt{order:2;font-size:var(--fs-base);color:#E9E6EE}
.hero-card dd{order:1;margin:0;font-family:var(--font-head);font-weight:800;font-size:2rem;line-height:1;min-width:2.2ch;color:var(--white);font-variant-numeric:tabular-nums}
.hero-card .caveat{margin-top:var(--s4);padding-top:var(--s4);border-top:1px solid rgba(255,255,255,.18);font-size:var(--fs-sm);color:#E9E6EE}

/* ---------- Sections ---------- */
.section{padding:var(--s9) 0}
.section-tight{padding:var(--s8) 0}
.section-head{max-width:720px;margin-bottom:var(--s7)}
.section-head p{margin-top:var(--s4);color:var(--muted);font-size:var(--fs-md)}
.surface{background:var(--soft)}

/* Transparence */
.disclosure-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);gap:var(--s8);align-items:start}
.disclosure-head .quote{font-size:var(--fs-md);border-left:4px solid var(--accent);padding-left:var(--s5)}
.facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s5);margin:var(--s7) 0 0}
.fact{background:var(--white);border-radius:var(--r-md);padding:var(--s5) var(--s5) var(--s6);border-top:4px solid var(--ink)}
.fact:nth-child(2){border-top-color:var(--brand)}
.fact:nth-child(3){border-top-color:var(--accent)}
.fact dt{font-family:var(--font-head);font-weight:700;font-size:var(--fs-md);line-height:1.3;color:var(--ink)}
.fact dd{margin:var(--s3) 0 0;color:var(--muted)}

/* Barre d'outils du tableau */
.toolbar{display:flex;flex-wrap:wrap;align-items:flex-end;gap:var(--s4) var(--s5);padding:var(--s5);border:1px solid var(--line);border-radius:var(--r-md);margin-bottom:var(--s5)}
.field{display:grid;gap:var(--s1)}
.field label{font-size:var(--fs-sm);font-weight:700;color:var(--ink)}
.select{appearance:none;-webkit-appearance:none;min-height:44px;min-width:220px;padding:0 44px 0 var(--s4);background:var(--white) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%2330283D' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 16px center;border:2px solid var(--ink);border-radius:var(--r-sm);cursor:pointer}
.select:hover{background-color:var(--soft)}
.select:disabled{border-color:var(--line);color:var(--muted);cursor:not-allowed}
.toolbar-status{margin-left:auto;font-size:var(--fs-sm);color:var(--muted);max-width:44ch}
.toolbar-status strong{color:var(--ink)}
.order-note{font-size:var(--fs-sm);color:var(--muted);margin-bottom:var(--s4)}

/* Tableau de comparaison (bureau) */
.table-wrap{width:100%}
.compare{width:100%;border-collapse:separate;border-spacing:0;font-size:var(--fs-base)}
.compare caption{text-align:left}
.compare thead th{text-align:left;font-family:var(--font-head);font-weight:700;font-size:var(--fs-sm);letter-spacing:.02em;color:var(--ink);padding:0 var(--s4) var(--s3);border-bottom:2px solid var(--ink)}
.compare tbody tr{transition:background-color .15s ease}
.compare tbody tr[hidden]{display:none!important}
.compare tbody tr:hover{background:rgba(236,231,241,.45)}
.compare td{padding:var(--s5) var(--s4);border-bottom:1px solid var(--line);vertical-align:top}
.compare .col-offer{width:27%}
.compare .col-rate{width:35%}
.compare .col-deposit{width:12%}
.compare .col-cap{width:12%}
.compare .col-cta{width:14%;text-align:right}
.compare tbody tr.is-sponsored td:first-child{box-shadow:inset 4px 0 0 var(--accent)}
.offer-bank{display:block;font-family:var(--font-head);font-weight:800;font-size:var(--fs-md);line-height:1.25}
.offer-product{display:block;margin-top:var(--s1);color:var(--muted)}
.badge{display:inline-flex;align-items:center;margin-top:var(--s3);padding:2px var(--s3);border-radius:999px;background:var(--soft);color:var(--ink);border:1px solid var(--ink);font-size:var(--fs-xs);font-weight:700;letter-spacing:.04em;text-transform:uppercase;line-height:1.6}

.rate-main{display:block;font-family:var(--font-head);font-weight:800;font-size:1.75rem;line-height:1.1;color:var(--ink)}
.rate-main-label{display:block;font-size:var(--fs-sm);color:var(--muted);margin-bottom:var(--s1)}
.rate-lines{margin:var(--s3) 0 0;display:grid;gap:var(--s1);font-size:var(--fs-sm)}
.rate-lines div{display:flex;flex-wrap:wrap;gap:0 var(--s2);align-items:baseline}
.rate-lines dt{color:var(--muted)}
.rate-lines dd{margin:0;font-weight:700;color:var(--ink)}
.rate-lines .is-boost dd{color:var(--brand)}
.rate-lines .duration{display:inline-block;margin-left:var(--s1);padding:0 var(--s2);background:var(--soft);border-radius:999px;font-weight:600;color:var(--ink);font-size:var(--fs-xs)}
.rate-lines .none dd{font-weight:400;color:var(--muted)}
.value{font-weight:700}
.value-muted{color:var(--muted);font-weight:400}
.cta-link svg{width:16px;height:16px}

.table-footnote{margin-top:var(--s5);display:grid;gap:var(--s3);font-size:var(--fs-sm);color:var(--muted);max-width:90ch}
.table-footnote p:first-child{color:var(--ink);font-weight:600}

/* Comprendre les taux */
.timeline-card{border:1px solid var(--line);border-radius:var(--r-md);padding:var(--s6);background:var(--white)}
.timeline-title{font-family:var(--font-head);font-weight:700;margin-bottom:var(--s5)}
.timeline{display:grid;grid-template-columns:repeat(12,1fr);gap:4px;margin-bottom:var(--s3)}
.timeline span{height:44px;border-radius:4px;background:var(--soft);border:1px solid var(--line)}
.timeline span.boost{background:var(--brand);border-color:var(--brand)}
.timeline-legend{display:grid;grid-template-columns:2fr 10fr;gap:4px}
.timeline-legend p{font-size:var(--fs-sm);color:var(--ink);font-weight:600;line-height:1.35}
.timeline-legend p span{display:block;font-weight:400;color:var(--muted)}
.timeline-result{margin-top:var(--s5);padding-top:var(--s5);border-top:1px solid var(--line);display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--s2) var(--s4)}
.timeline-result strong{font-family:var(--font-head);font-weight:800;font-size:2rem;line-height:1;color:var(--ink)}
.two-col{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:var(--s8);align-items:start}
.two-col .section-head{margin-bottom:0}
.defs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s5);margin-top:var(--s7)}
.def{border-top:3px solid var(--ink);padding-top:var(--s4)}
.def:nth-child(2){border-top-color:var(--brand)}
.def:nth-child(3){border-top-color:var(--accent)}
.def h3{margin-bottom:var(--s2)}
.def p{color:var(--muted)}

/* Vérifications */
.checks{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s5);list-style:none;counter-reset:check}
.check{counter-increment:check;background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);padding:var(--s5)}
.check::before{content:counter(check);display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;background:var(--ink);color:var(--white);font-family:var(--font-head);font-weight:800;margin-bottom:var(--s4)}
.check h3{margin-bottom:var(--s2)}
.check p{color:var(--muted);font-size:var(--fs-sm)}

/* FAQ */
.faq-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.4fr);gap:var(--s8);align-items:start}
.faq-list{border-top:1px solid var(--line)}
.faq-item{border-bottom:1px solid var(--line)}
.faq-item summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:var(--s4);padding:var(--s5) 0;cursor:pointer;font-family:var(--font-head);font-weight:700;font-size:var(--fs-md);line-height:1.35}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary:hover{color:var(--brand)}
.faq-item summary::after{content:"";flex:none;width:28px;height:28px;border-radius:50%;border:2px solid var(--ink);background:no-repeat center/12px 12px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='M6 1v10M1 6h10' stroke='%2330283D' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E")}
.faq-item[open] summary::after{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='M1 6h10' stroke='%2330283D' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");background-color:var(--soft)}
.faq-item .answer{padding:0 var(--s7) var(--s5) 0;color:var(--muted)}
.faq-item .answer p+p{margin-top:var(--s3)}

/* ---------- Pied de page ---------- */
.site-footer{background:var(--ink);color:#E9E6EE;padding:var(--s8) 0 var(--s6);font-size:var(--fs-sm)}
.site-footer a{color:var(--white)}
.site-footer a:hover{color:var(--accent)}
.footer-grid{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) minmax(0,1.1fr);gap:var(--s7)}
.footer-brand{font-family:var(--font-head);font-weight:800;font-size:var(--fs-md);color:var(--white);display:flex;align-items:center;gap:var(--s3);margin-bottom:var(--s4)}
.site-footer h2{color:var(--white);font-size:var(--fs-base);margin-bottom:var(--s4)}
.site-footer p+p{margin-top:var(--s3)}
.footer-links{list-style:none;display:grid;gap:var(--s2)}
.footer-links a{display:inline-block;padding:var(--s1) 0}
.site-footer address{font-style:normal;display:grid;gap:var(--s1)}
.footer-bottom{margin-top:var(--s7);padding-top:var(--s5);border-top:1px solid rgba(255,255,255,.18);text-align:center;color:#CFCAD8}

/* ---------- Pages juridiques ---------- */
.legal-hero{padding:var(--s8) 0 var(--s6);border-bottom:1px solid var(--line)}
.legal-hero .container{max-width:calc(720px + 2 * var(--gutter))}
.legal-hero h1{font-size:clamp(1.875rem,1.3rem + 2.4vw,2.75rem)}
.legal-meta{margin-top:var(--s4);color:var(--muted);font-size:var(--fs-sm)}
.crumbs{font-size:var(--fs-sm);margin-bottom:var(--s5);color:var(--muted)}
.crumbs a{color:var(--muted)}
.crumbs a:hover{color:var(--brand-hover)}
.legal{padding:var(--s7) 0 var(--s9)}
.legal .container{max-width:calc(720px + 2 * var(--gutter))}
.legal-body{font-size:var(--fs-base);line-height:1.75}
.legal-body h2{font-size:var(--fs-lg);margin:var(--s8) 0 var(--s4);padding-top:var(--s5);border-top:1px solid var(--line)}
.legal-body h2:first-of-type{margin-top:var(--s7)}
.legal-body h3{font-size:var(--fs-base);margin:var(--s5) 0 var(--s2)}
.legal-body p{margin-top:var(--s3)}
.legal-body ul{padding-left:var(--s5);margin-top:var(--s3)}
.legal-body li{margin-top:var(--s2)}
.legal-body li::marker{color:var(--brand)}
.legal-body dl{margin:var(--s4) 0 0;border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden}
.legal-body dl div{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.6fr);gap:var(--s4);padding:var(--s3) var(--s4);border-bottom:1px solid var(--line)}
.legal-body dl div:last-child{border-bottom:0}
.legal-body dl div:nth-child(odd){background:rgba(236,231,241,.4)}
.legal-body dt{font-weight:700;color:var(--ink)}
.legal-body dd{margin:0;overflow-wrap:anywhere}
.callout{margin-top:var(--s5);background:var(--soft);border-radius:var(--r-md);padding:var(--s5);border-left:5px solid var(--accent)}
.callout p:first-child{margin-top:0}
.toc{margin-top:var(--s6);background:var(--soft);border-radius:var(--r-md);padding:var(--s5) var(--s6)}
.legal-body .toc h2{font-size:var(--fs-base);margin:0 0 var(--s3);padding:0;border:0}
.toc ol{margin:0;padding-left:var(--s5);display:grid;gap:var(--s1)}
.toc a{color:var(--ink)}
.toc a:hover{color:var(--brand-hover)}
.legal-body table{width:100%;border-collapse:collapse;margin-top:var(--s4);font-size:var(--fs-sm)}
.legal-body th,.legal-body td{text-align:left;padding:var(--s3);border:1px solid var(--line);vertical-align:top}
.legal-body th{background:var(--soft);font-family:var(--font-head)}
.todo{background:var(--soft);border-radius:var(--r-sm);padding:0 var(--s2);font-weight:700;color:var(--ink);overflow-wrap:anywhere}

/* ---------- Responsive ---------- */
@media (max-width:1100px){
  .checks{grid-template-columns:repeat(2,minmax(0,1fr))}
  .footer-grid{grid-template-columns:1fr 1fr}
  .footer-grid>:first-child{grid-column:1/-1}
}

@media (max-width:960px){
  .hero{padding:var(--s7) 0 var(--s8)}
  .hero-grid,.disclosure-head,.two-col,.faq-grid{grid-template-columns:1fr;gap:var(--s6)}
  .facts{grid-template-columns:1fr;margin-top:var(--s6)}
  .section{padding:var(--s8) 0}
  .defs{grid-template-columns:1fr}
  .toolbar-status{margin-left:0;max-width:none}

  .nav-toggle{display:inline-flex}
  .nav{display:none;position:absolute;left:0;right:0;top:100%;flex-direction:column;align-items:stretch;gap:0;background:var(--white);border-bottom:1px solid var(--line);padding:var(--s3) var(--gutter) var(--s5)}
  .nav.is-open{display:flex}
  .nav a:not(.btn){padding:var(--s4) 0;border-bottom:1px solid var(--line)}
  .nav .btn{margin-top:var(--s4)}
}

/* Tableau → cartes */
@media (max-width:860px){
  .compare,.compare tbody,.compare tr,.compare td{display:block}
  .compare thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .compare tbody{display:grid;gap:var(--s4)}
  .compare tbody tr{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;background:var(--white)}
  .compare tbody tr:hover{background:var(--white)}
  .compare tbody tr.is-sponsored{border-top:4px solid var(--accent)}
  .compare tbody tr.is-sponsored td:first-child{box-shadow:none}
  .compare td{padding:var(--s4) var(--s5);border-bottom:1px solid var(--line)}
  .compare td.col-offer,.compare td.col-rate,.compare td.col-cta{grid-column:1/-1;width:auto}
  .compare td.col-deposit,.compare td.col-cap{width:auto;border-bottom:1px solid var(--line)}
  .compare td.col-deposit{border-right:1px solid var(--line)}
  .compare td.col-cta{border-bottom:0;text-align:left}
  .compare td.col-cta .btn{width:100%}
  .compare td[data-label]::before{content:attr(data-label);display:block;font-size:var(--fs-xs);font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:var(--s2)}
  .compare td.col-offer::before,.compare td.col-cta::before{display:none}
}

@media (max-width:600px){
  .hero-card{padding:var(--s3) var(--s5) var(--s5)}
  .hero-card::before{left:var(--s5)}
  .hero-actions .btn{width:100%}
  .wordmark{font-size:.8125rem;letter-spacing:.04em}
  .toolbar{padding:var(--s4)}
  .field,.select{width:100%;min-width:0}
  .checks{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr}
  .timeline-card{padding:var(--s4)}
  .faq-item .answer{padding-right:0}
  .legal-body dl div{grid-template-columns:1fr;gap:var(--s1)}
  .legal-body table{display:block;overflow-x:auto}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition:none!important;animation:none!important}
}

@media print{
  .site-header,.nav-toggle,.toolbar,.skip-link{display:none}
  .site-footer{background:var(--white);color:var(--ink)}
  .site-footer a{color:var(--ink)}
}