/* ============================================================
   STYLE.CSS - Apple Design 2026 - Liquid Glass
   Kia Niro EV vs Toyota Yaris Cross - Comparatif
   ============================================================ */

/* ── 1. RESET & BASE ── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --bg:           #f5f5f7;
  --bg-dark:      #1c1c1e;
  --surface:      rgba(255,255,255,0.72);
  --surface-dark: rgba(28,28,30,0.82);
  --border:       rgba(0,0,0,0.08);
  --border-light: rgba(255,255,255,0.45);
  --shadow-sm:    0 2px 12px rgba(0,0,0,0.07);
  --shadow-md:    0 8px 32px rgba(0,0,0,0.10);
  --shadow-lg:    0 20px 60px rgba(0,0,0,0.13);

  --kia:       #1a56db;
  --kia-light: #dbeafe;
  --kia-dark:  #1e3a8a;
  --kia-ev:    #e4541d;

  --toy:       #eb4444;
  --toy-des:   #2980b9;
  --toy-grs:   #374151;

  --green:     #16a34a;
  --green-bg:  #dcfce7;
  --orange:    #ea580c;
  --orange-bg: #ffedd5;
  --red:       #dc2626;
  --red-bg:    #fee2e2;
  --blue:      #2563eb;

  --font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --radius-xl: 34px;
  --radius-lg: 22px;
  --radius-md: 14px;
  --radius-sm: 8px;
  --transition: all 0.35s cubic-bezier(0.4,0,0.2,1);
}

html { scroll-behavior: smooth; font-size: 16px; }

body {
  font-family: var(--font);
  background: var(--bg);
  color: #1d1d1f;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

a { text-decoration: none; color: inherit; }
img { max-width: 100%; display: block; }
h1, h2, h3, h4 { font-weight: 700; line-height: 1.2; }

/* ── 2. UTILITIES ── */
.txt-green  { color: var(--green) !important; }
.txt-red    { color: var(--red) !important; }
.txt-orange { color: var(--orange) !important; }
.txt-blue   { color: var(--blue) !important; }
.txt-des    { color: var(--toy-des) !important; }
.txt-dark   { color: #1d1d1f !important; }
.txt-muted  { color: #6e6e73 !important; }
.txt-sm     { font-size: .8rem; }
.td-bold    { font-weight: 700; }
.td-green   { color: var(--green); }
.td-red     { color: var(--red); }
.td-orange  { color: var(--orange); }
.td-des     { color: var(--toy-des); }
.small-green { color: var(--green); font-size: .78rem; }
.small-red   { color: var(--red);   font-size: .78rem; }
.fs-1rem    { font-size: 1rem; }
.section-mt    { margin-top: 2rem; }
.section-mt-sm { margin-top: 1rem; }
.anchor-neg70  { display: block; height: 0; position: relative; top: -80px; }

/* ── 3. PAGE ── */
.page { max-width: 1280px; margin: 0 auto; padding: 2.5rem 1.5rem 3rem; }
.page-no-pt { padding-top: 0; }

/* ── 4. STICKY NAV ── */
.sticky-nav {
  position: sticky; top: 0; z-index: 1000;
  background: rgba(245,245,247,0.82);
  backdrop-filter: blur(25px) saturate(180%);
  -webkit-backdrop-filter: blur(25px) saturate(180%);
  border-bottom: 1px solid var(--border);
  box-shadow: var(--shadow-sm);
}
.nav-progress { height: 3px; background: linear-gradient(90deg, var(--kia-ev), var(--kia)); width: 0%; transition: width .2s ease; }
.sticky-nav-inner {
  max-width: 1280px; margin: 0 auto; padding: 0 1.25rem;
  display: flex; align-items: center; gap: .25rem;
  overflow-x: auto; scrollbar-width: none; height: 52px;
}
.sticky-nav-inner::-webkit-scrollbar { display: none; }
.nav-logo { display: flex; align-items: center; gap: .5rem; margin-right: .75rem; flex-shrink: 0; }
.nav-logo-badge {
  width: 32px; height: 32px;
  background: linear-gradient(135deg, var(--kia-ev), var(--kia));
  border-radius: 8px; display: flex; align-items: center; justify-content: center; font-size: 1rem;
}
.nav-logo-title { font-size: .8rem; font-weight: 700; display: block; }
.nav-logo-sub   { font-size: .65rem; color: #6e6e73; display: block; }
.sticky-nav-inner a:not(.nav-logo) {
  display: flex; align-items: center; gap: .3rem; padding: .3rem .7rem;
  border-radius: 20px; font-size: .78rem; font-weight: 500; color: #1d1d1f;
  white-space: nowrap; transition: var(--transition); flex-shrink: 0;
}
.sticky-nav-inner a:not(.nav-logo):hover { background: rgba(0,0,0,.07); color: var(--kia); }
.nav-emoji { font-size: .85rem; }

/* ── 5. HERO ── */
.hero { text-align: center; padding: 4rem 1.5rem 3rem; max-width: 860px; margin: 0 auto; }
.hero-badge {
  display: inline-block; background: rgba(228,84,29,.1); color: var(--kia-ev);
  border: 1px solid rgba(228,84,29,.25); border-radius: 20px; padding: .3rem .9rem;
  font-size: .78rem; font-weight: 600; letter-spacing: .03em; margin-bottom: 1.25rem;
}
.hero-title { font-size: clamp(2.2rem,6vw,4rem); font-weight: 900; letter-spacing: -.03em; color: #1d1d1f; margin-bottom: .75rem; }
.hero-title-vs { color: #6e6e73; font-weight: 300; font-size: .7em; }
.hero-sub { font-size: 1rem; color: #6e6e73; font-weight: 400; margin-bottom: 2.5rem; }

/* Verdict Flash */
.hero-verdict { display: flex; gap: 1rem; justify-content: center; align-items: stretch; flex-wrap: wrap; margin-bottom: 1.5rem; }
.hv-card {
  background: var(--surface); backdrop-filter: blur(25px); -webkit-backdrop-filter: blur(25px);
  border: 1px solid var(--border-light); border-radius: var(--radius-xl); padding: 1.25rem 1.1rem;
  min-width: 180px; max-width: 230px; text-align: center; cursor: pointer;
  transition: var(--transition); box-shadow: var(--shadow-md); flex: 1;
}
.hv-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); }
.hv-kia { border-top: 3px solid var(--kia-ev); }
.hv-des { border-top: 3px solid var(--toy-des); }
.hv-grs { border-top: 3px solid var(--toy-grs); }
.hv-icon   { font-size: 1.6rem; margin-bottom: .4rem; }
.hv-name   { font-size: .82rem; font-weight: 700; color: #1d1d1f; margin-bottom: .2rem; }
.hv-detail { font-size: .7rem; color: #6e6e73; margin-bottom: .5rem; }
.hv-price  { font-size: 1.5rem; font-weight: 900; letter-spacing: -.03em; color: #1d1d1f; }
.hv-sub    { font-size: .68rem; color: #6e6e73; margin-bottom: .4rem; }
.hv-cost8  { font-size: .72rem; font-weight: 600; color: var(--green); }
.hv-tag    { display: inline-block; margin-top: .5rem; padding: .2rem .7rem; border-radius: 12px; font-size: .68rem; font-weight: 600; }
.hv-tag-kia { background: rgba(228,84,29,.12); color: var(--kia-ev); }
.hv-tag-des { background: rgba(41,128,185,.12); color: var(--toy-des); }
.hv-tag-grs { background: rgba(55,65,81,.1); color: var(--toy-grs); }
.hv-vs { font-size: 1.1rem; font-weight: 700; color: #6e6e73; display: flex; align-items: center; flex-shrink: 0; }

.hv-insight {
  background: rgba(22,163,74,.08); border: 1px solid rgba(22,163,74,.2);
  border-radius: var(--radius-md); padding: .75rem 1.25rem; font-size: .82rem; color: #1d1d1f; margin-bottom: 1.25rem;
}

.wb-toggle-wrap { display: flex; align-items: center; gap: .6rem; justify-content: center; margin-bottom: 1.5rem; }
.wb-toggle-label { font-size: .8rem; color: #6e6e73; }
.wb-toggle {
  background: var(--kia-ev); color: #fff; border: none; border-radius: 20px;
  padding: .35rem .9rem; font-size: .78rem; font-weight: 600; cursor: pointer; transition: var(--transition);
}
.wb-toggle:hover { background: #c0410f; }

.hero-ctas { display: flex; gap: .75rem; justify-content: center; flex-wrap: wrap; }
.hcta { padding: .65rem 1.4rem; border-radius: 22px; font-size: .85rem; font-weight: 600; transition: var(--transition); }
.hcta-primary { background: #1d1d1f; color: #fff; }
.hcta-primary:hover { background: #3a3a3c; transform: translateY(-2px); }
.hcta-secondary {
  background: rgba(255,255,255,.72); backdrop-filter: blur(12px);
  border: 1px solid var(--border); color: #1d1d1f;
}
.hcta-secondary:hover { background: rgba(255,255,255,.92); transform: translateY(-2px); }

/* ── 6. STICKY CAR BAR ── */
.sticky-car-bar {
  position: sticky; top: 52px; z-index: 900;
  background: rgba(245,245,247,.88); backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px); border-bottom: 1px solid var(--border); display: none;
}
.sticky-car-bar.visible { display: block; }
.scb-inner {
  max-width: 1280px; margin: 0 auto; padding: .5rem 1.25rem;
  display: flex; align-items: center; gap: .75rem; overflow-x: auto; scrollbar-width: none;
}
.scb-inner::-webkit-scrollbar { display: none; }
.scb-cars { display: flex; gap: .5rem; }
.scb-btn {
  display: flex; align-items: center; gap: .4rem; padding: .3rem .75rem;
  border-radius: 20px; border: 1px solid var(--border); background: var(--surface);
  font-size: .75rem; font-weight: 500; cursor: pointer; transition: var(--transition); white-space: nowrap;
}
.scb-btn:hover, .scb-active { background: #1d1d1f; color: #fff; }
.scb-dot { width: 7px; height: 7px; border-radius: 50%; display: inline-block; }
.scb-dot-kia { background: var(--kia-ev); }
.scb-dot-des { background: var(--toy-des); }
.scb-dot-grs { background: var(--toy-grs); }
.scb-name  { font-weight: 600; }
.scb-price { color: #6e6e73; font-size: .7rem; }
.scb-sep   { width: 1px; height: 24px; background: var(--border); flex-shrink: 0; }
.scb-anchors { display: flex; align-items: center; gap: 2px; }
.scb-anchor {
  display: flex; flex-direction: column; align-items: center; gap: 2px;
  padding: .3rem .65rem; border-radius: 8px; text-decoration: none; cursor: pointer;
  color: #6e6e73; transition: background .15s ease, color .15s ease, transform .1s ease;
  white-space: nowrap; -webkit-tap-highlight-color: transparent; user-select: none;
}
.scb-anchor-icon  { font-size: .82rem; line-height: 1; }
.scb-anchor-label { font-size: .62rem; font-weight: 500; letter-spacing: .01em; }
.scb-anchor:hover { background: rgba(0,0,0,.06); color: #1d1d1f; }
.scb-anchor.scb-anchor-active { background: #007aff; color: #fff; }
.scb-anchor:active { transform: scale(.93); }
@media (max-width: 380px) {
  .scb-anchor-label { display: none; }
  .scb-anchor { padding: .35rem .5rem; }
}

/* ── 7. CAR SWITCHER ── */
.cs-wrap { max-width: 1280px; margin: 0 auto; padding: 0 1.5rem 2rem; }
.cs-tabs { display: flex; gap: .75rem; margin-bottom: 1.5rem; overflow-x: auto; scrollbar-width: none; padding-bottom: .25rem; }
.cs-tabs::-webkit-scrollbar { display: none; }
.cs-tab {
  flex: 1; min-width: 220px; background: var(--surface); backdrop-filter: blur(20px);
  border: 1.5px solid var(--border); border-radius: var(--radius-lg); padding: 1rem 1.1rem;
  cursor: pointer; display: flex; align-items: center; gap: .75rem; transition: var(--transition); box-shadow: var(--shadow-sm);
}
.cs-tab:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); }
.cs-tab.active { border-width: 2px; box-shadow: var(--shadow-md); }
.cs-kia.active { border-color: var(--kia-ev); background: rgba(228,84,29,.06); }
.cs-des.active { border-color: var(--toy-des); background: rgba(41,128,185,.06); }
.cs-grs.active { border-color: var(--toy-grs); background: rgba(55,65,81,.06); }
.ct-icon  { font-size: 1.5rem; flex-shrink: 0; }
.ct-name  { font-size: .88rem; font-weight: 700; color: #1d1d1f; }
.ct-sub   { font-size: .72rem; color: #6e6e73; }
.ct-price { font-size: .82rem; font-weight: 800; color: var(--kia-ev); margin-top: .1rem; }
.cs-panel { display: none; }
.cs-panel.active { display: block; }

/* ── 8. GALLERY ── */
.cs-gallery { border-radius: var(--radius-xl); overflow: hidden; background: #000; margin-bottom: 1rem; box-shadow: var(--shadow-md); }
.cs-gal-header { display: flex; align-items: center; justify-content: space-between; padding: .6rem 1rem; background: rgba(0,0,0,.7); backdrop-filter: blur(10px); }
.gal-header-kia { border-bottom: 2px solid var(--kia-ev); }
.gal-header-grs { border-bottom: 2px solid #e74c3c; }
.gal-header-des { border-bottom: 2px solid var(--toy-des); }
.gal-header-label { font-size: .78rem; font-weight: 600; color: #fff; }
.gal-header-right { display: flex; align-items: center; gap: .6rem; }
.gal-counter-txt  { font-size: .72rem; color: rgba(255,255,255,.7); }
.gal-fullscreen-btn {
  background: rgba(255,255,255,.15); border: none; color: #fff;
  width: 28px; height: 28px; border-radius: 7px; cursor: pointer; font-size: .9rem; transition: var(--transition);
}
.gal-fullscreen-btn:hover { background: rgba(255,255,255,.3); }
.cs-gal-progress { height: 3px; background: rgba(255,255,255,.15); }
.cs-gal-bar { height: 100%; transition: width .3s ease; width: 0%; }
.gal-bar-kia { background: var(--kia-ev); }
.gal-bar-grs { background: #e74c3c; }
.gal-bar-des { background: var(--toy-des); }
.gal-wrap { position: relative; overflow: hidden; }
.cs-gal-img { width: 100%; height: 420px; object-fit: cover; display: block; transition: transform .4s ease; }
.gal-hint { position: absolute; bottom: 12px; left: 50%; transform: translateX(-50%); pointer-events: none; opacity: 0; transition: opacity .3s; }
.gal-wrap:hover .gal-hint { opacity: 1; }
.gal-hint-inner { background: rgba(0,0,0,.6); color: #fff; padding: .25rem .75rem; border-radius: 12px; font-size: .72rem; backdrop-filter: blur(8px); }
.gallery-nav {
  position: absolute; top: 50%; transform: translateY(-50%); background: rgba(0,0,0,.5);
  color: #fff; border: none; width: 44px; height: 44px; border-radius: 50%; font-size: 1.4rem;
  cursor: pointer; transition: var(--transition); display: flex; align-items: center; justify-content: center;
}
.gallery-prev { left: 12px; }
.gallery-next { right: 12px; }
.gallery-counter {
  position: absolute; bottom: 10px; right: 12px; background: rgba(0,0,0,.55); color: #fff;
  padding: .2rem .6rem; border-radius: 10px; font-size: .7rem; font-weight: 600; backdrop-filter: blur(6px);
}
.cs-thumbs { display: flex; gap: 5px; flex-wrap: wrap; padding: 6px 0; margin-bottom: 1rem; }
.cs-thumbs img, .gal-thumbs-kia img, .gal-thumbs-des img, .gal-thumbs-grs img {
  width: 52px; height: 40px; object-fit: cover; border-radius: 6px; cursor: pointer;
  opacity: .65; transition: var(--transition); border: 2px solid transparent;
}
.cs-thumbs img:hover { opacity: 1; }
.thumbs-kia .active, .gal-thumbs-kia .active { border-color: var(--kia-ev); opacity: 1; }
.thumbs-grs .active, .gal-thumbs-grs .active { border-color: #e74c3c; opacity: 1; }
.thumbs-des .active, .gal-thumbs-des .active { border-color: var(--toy-des); opacity: 1; }
.gal-thumbs-kia, .gal-thumbs-des, .gal-thumbs-grs { display: flex; gap: 5px; flex-wrap: wrap; padding: 6px 0; margin-bottom: 1rem; }

.lightbox, .lb-toyota {
  display: none; position: fixed; inset: 0; background: rgba(0,0,0,.92); z-index: 9999;
  align-items: center; justify-content: center; backdrop-filter: blur(10px);
}
.lightbox.open, .lb-toyota.open { display: flex; }
.lightbox-img { max-width: 92vw; max-height: 88vh; border-radius: var(--radius-lg); object-fit: contain; }
.lb-close {
  position: absolute; top: 16px; right: 20px; background: rgba(255,255,255,.15); border: none; color: #fff;
  width: 36px; height: 36px; border-radius: 50%; font-size: 1rem; cursor: pointer; transition: var(--transition);
}
.lb-close:hover { background: rgba(255,255,255,.3); }
.lb-arrow {
  position: absolute; top: 50%; transform: translateY(-50%); background: rgba(255,255,255,.12);
  border: none; color: #fff; width: 52px; height: 52px; border-radius: 50%; font-size: 1.8rem;
  cursor: pointer; transition: var(--transition); display: flex; align-items: center; justify-content: center;
}
.lb-arrow:hover { background: rgba(255,255,255,.25); }
.lb-prev { left: 16px; }
.lb-next { right: 16px; }
.lb-counter { position: absolute; bottom: 16px; left: 50%; transform: translateX(-50%); color: rgba(255,255,255,.7); font-size: .8rem; font-weight: 500; }

/* ── 9. CARDS ── */
.card {
  background: var(--surface); backdrop-filter: blur(25px); -webkit-backdrop-filter: blur(25px);
  border: 1px solid var(--border-light); border-radius: var(--radius-xl); padding: 1.75rem;
  margin-bottom: 1.5rem; box-shadow: var(--shadow-md); transition: var(--transition);
}
.card:hover { box-shadow: var(--shadow-lg); }
.card-eq  { margin-bottom: 1.5rem; }
.card-rel { position: relative; }
.ad-title { font-size: 1.3rem; font-weight: 800; color: #1d1d1f; margin-bottom: .3rem; }
.ad-sub   { font-size: .85rem; color: #6e6e73; margin-bottom: .75rem; }

.badge { display: inline-block; padding: .2rem .75rem; border-radius: 12px; font-size: .72rem; font-weight: 600; background: rgba(0,0,0,.07); color: #1d1d1f; margin-right: .4rem; margin-bottom: .75rem; }
.badge.orange { background: rgba(228,84,29,.12); color: var(--kia-ev); }
.badge.green  { background: var(--green-bg); color: var(--green); }

.price-block { display: flex; gap: 1.25rem; align-items: flex-start; margin-bottom: 1.25rem; flex-wrap: wrap; }
.price-box { flex-shrink: 0; }
.price-label { font-size: .72rem; color: #6e6e73; margin-bottom: .15rem; }
.price-annonce { font-size: 2rem; font-weight: 900; letter-spacing: -.04em; color: #1d1d1f; }
.price-annonce-grs { color: var(--toy-grs); }
.price-annonce-des { color: var(--toy-des); }
.price-tout-compris { background: rgba(228,84,29,.06); border: 1px solid rgba(228,84,29,.2); border-radius: var(--radius-md); padding: .75rem 1rem; flex: 1; min-width: 200px; }
.ptc-grs { background: rgba(55,65,81,.05); border-color: rgba(55,65,81,.2); }
.ptc-des { background: rgba(41,128,185,.05); border-color: rgba(41,128,185,.2); }
.ptc-label { font-size: .7rem; color: #6e6e73; margin-bottom: .1rem; }
.ptc-price { font-size: 1.4rem; font-weight: 900; color: #1d1d1f; letter-spacing: -.03em; }
.ptc-includes { display: flex; flex-wrap: wrap; gap: .3rem; margin-top: .5rem; }
.ptc-includes span { background: var(--green-bg); color: var(--green); font-size: .65rem; font-weight: 600; padding: .15rem .5rem; border-radius: 8px; }

.garantie-banner { display: flex; align-items: flex-start; gap: 1rem; background: rgba(22,163,74,.06); border: 1px solid rgba(22,163,74,.2); border-radius: var(--radius-lg); padding: 1rem 1.25rem; margin-bottom: 1.25rem; }
.garantie-banner-grs { background: rgba(55,65,81,.05); border-color: rgba(55,65,81,.2); }
.garantie-banner-des { background: rgba(41,128,185,.05); border-color: rgba(41,128,185,.2); }
.gar-icon   { font-size: 1.6rem; flex-shrink: 0; }
.gar-content { flex: 1; }
.gar-title  { font-size: .9rem; font-weight: 700; color: #1d1d1f; }
.gar-detail { font-size: .78rem; color: #374151; margin-top: .25rem; }
.gar-badge  { text-align: center; flex-shrink: 0; }
.gar-years  { display: block; font-size: 1.1rem; font-weight: 900; color: var(--green); }
.gar-years-label { font-size: .65rem; color: #6e6e73; }

.specs { display: grid; grid-template-columns: repeat(auto-fill,minmax(200px,1fr)); gap: .5rem; margin-bottom: 1rem; }
.spec { background: rgba(0,0,0,.03); border-radius: var(--radius-sm); padding: .55rem .85rem; display: flex; justify-content: space-between; align-items: center; gap: .5rem; }
.spec-label { font-size: .75rem; color: #6e6e73; }
.spec-value { font-size: .82rem; font-weight: 700; color: #1d1d1f; text-align: right; }

.finition-bloc { border-radius: var(--radius-md); padding: 1rem 1.25rem; margin-bottom: 1rem; border: 1px solid transparent; }
.finition-bloc-kia { background: rgba(228,84,29,.06); border-color: rgba(228,84,29,.2); }
.finition-bloc-grs { background: rgba(55,65,81,.06); border-color: rgba(55,65,81,.2); }
.finition-bloc-des { background: rgba(41,128,185,.06); border-color: rgba(41,128,185,.2); }
.finition-label { font-size: .82rem; font-weight: 700; margin-bottom: .5rem; }
.finition-list  { font-size: .78rem; color: #374151; line-height: 1.8; }
.finition-list-kia { color: var(--kia-dark); }

.battery-bloc { display: grid; grid-template-columns: repeat(auto-fill,minmax(150px,1fr)); gap: .75rem; margin-top: 1rem; }
.bat-item { background: rgba(0,0,0,.04); border-radius: var(--radius-md); padding: .85rem .75rem; text-align: center; transition: var(--transition); }
.bat-item:hover { transform: translateY(-2px); box-shadow: var(--shadow-sm); }
.bat-item.green  { background: var(--green-bg); }
.bat-item.orange { background: var(--orange-bg); }
.bat-item.dark   { background: rgba(55,65,81,.08); }
.bat-item-grs { background: rgba(55,65,81,.1); }
.bat-item-des { background: rgba(41,128,185,.08); }
.bat-icon  { font-size: 1.2rem; margin-bottom: .25rem; }
.bat-val   { font-size: .95rem; font-weight: 800; color: #1d1d1f; letter-spacing: -.02em; }
.bat-label { font-size: .68rem; color: #6e6e73; margin-top: .1rem; }

/* ── 10. EQUIPEMENTS ── */
.eq-seg-wrap { margin-bottom: 1.5rem; }
.eq-seg { display: flex; background: rgba(0,0,0,.05); border-radius: 18px; padding: 4px; gap: 4px; overflow-x: auto; scrollbar-width: none; }
.eq-seg::-webkit-scrollbar { display: none; }
.eq-seg-btn { flex: 1; display: flex; align-items: center; gap: .5rem; padding: .6rem .9rem; border-radius: 14px; border: none; background: transparent; cursor: pointer; font-family: var(--font); font-size: .78rem; font-weight: 500; color: #6e6e73; white-space: nowrap; transition: var(--transition); }
.eq-seg-active { background: #fff; color: #1d1d1f; font-weight: 700; box-shadow: var(--shadow-sm); }
.eq-seg-dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
.eq-seg-dot-kia { background: var(--kia-ev); }
.eq-seg-dot-des { background: var(--toy-des); }
.eq-seg-dot-grs { background: var(--toy-grs); }
.eq-seg-sub { font-size: .68rem; color: #6e6e73; }
.eq-panel { display: block; }
.eq-panel-hidden { display: none; }

.eq-panel-header { display: flex; justify-content: space-between; align-items: flex-start; padding: 1.25rem; border-radius: var(--radius-lg); margin-bottom: 1.25rem; gap: 1rem; flex-wrap: wrap; }
.eq-panel-header-kia { background: linear-gradient(135deg,rgba(228,84,29,.1),rgba(26,86,219,.06)); border: 1px solid rgba(228,84,29,.2); }
.eq-panel-header-des { background: linear-gradient(135deg,rgba(41,128,185,.1),rgba(41,128,185,.04)); border: 1px solid rgba(41,128,185,.2); }
.eq-panel-header-grs { background: linear-gradient(135deg,rgba(55,65,81,.1),rgba(55,65,81,.04)); border: 1px solid rgba(55,65,81,.2); }
.eq-panel-eyebrow { font-size: .7rem; font-weight: 600; color: #6e6e73; text-transform: uppercase; letter-spacing: .06em; }
.eq-panel-title   { font-size: 1.2rem; font-weight: 800; color: #1d1d1f; }
.eq-panel-sub     { font-size: .78rem; color: #6e6e73; }
.eq-panel-pills   { display: flex; gap: .4rem; flex-wrap: wrap; align-items: center; }
.eq-panel-pill    { padding: .25rem .7rem; border-radius: 12px; font-size: .72rem; font-weight: 600; }
.eq-pill-ev      { background: rgba(228,84,29,.12); color: var(--kia-ev); }
.eq-pill-hybrid  { background: var(--orange-bg); color: var(--orange); }
.eq-pill-ok      { background: var(--green-bg); color: var(--green); }
.eq-pill-neutral { background: rgba(0,0,0,.06); color: #374151; }
.eq-pill-grs     { background: rgba(55,65,81,.1); color: var(--toy-grs); }

.desc-intro { font-size: .82rem; color: #374151; background: rgba(0,0,0,.03); border-radius: var(--radius-md); padding: .85rem 1rem; margin-bottom: 1rem; line-height: 1.7; }
.desc-intro-des { border-left: 3px solid var(--toy-des); }
.desc-intro-grs { border-left: 3px solid var(--toy-grs); }
.desc-section { margin-bottom: 1rem; }
.desc-section-title { font-size: .8rem; font-weight: 700; color: #1d1d1f; padding: .5rem 0 .4rem; border-bottom: 1px solid var(--border); margin-bottom: .5rem; display: flex; align-items: center; gap: .4rem; }
.desc-section-title .icon { font-size: 1rem; }
.desc-items { display: grid; grid-template-columns: repeat(auto-fill,minmax(220px,1fr)); gap: .25rem; }
.desc-item  { font-size: .78rem; color: #374151; padding: .3rem .6rem; border-radius: var(--radius-sm); background: rgba(0,0,0,.02); }
.note-pedagogique { background: rgba(234,88,12,.06); border: 1px solid rgba(234,88,12,.2); border-radius: var(--radius-md); padding: .85rem 1.1rem; font-size: .78rem; color: #374151; margin-top: 1rem; line-height: 1.7; }
.note-green    { background: rgba(22,163,74,.06); border-color: rgba(22,163,74,.2); }
.note-fiab-src { background: rgba(37,99,235,.04); border-color: rgba(37,99,235,.15); }

/* ── 11. PRINT BUTTON ── */
.print-btn-wrap { max-width: 1280px; margin: 0 auto 2rem; padding: 0 1.5rem; }
.print-btn { display: flex; align-items: center; gap: 1rem; background: var(--surface); backdrop-filter: blur(20px); border: 1px solid var(--border); border-radius: var(--radius-lg); padding: 1rem 1.5rem; cursor: pointer; width: 100%; transition: var(--transition); font-family: var(--font); box-shadow: var(--shadow-sm); }
.print-btn:hover { box-shadow: var(--shadow-md); transform: translateY(-2px); }
.print-btn-icon  { font-size: 1.4rem; }
.print-btn-label { font-size: .9rem; font-weight: 700; color: #1d1d1f; display: block; }
.print-btn-sub   { font-size: .72rem; color: #6e6e73; display: block; }
.print-btn-arrow { margin-left: auto; font-size: 1.1rem; color: #6e6e73; }

/* ── 12. COMPARAISON ── */
.comp-section { padding-bottom: 2rem; }
.comp-header  { text-align: center; margin-bottom: 2rem; }
.comp-header h2 { font-size: clamp(1.5rem,4vw,2.2rem); font-weight: 900; letter-spacing: -.03em; margin-bottom: .4rem; }
.comp-subtitle { font-size: .85rem; color: #6e6e73; margin-bottom: .75rem; }
.comp-tags { display: flex; flex-wrap: wrap; gap: .4rem; justify-content: center; }
.comp-tag  { background: rgba(0,0,0,.06); border-radius: 12px; padding: .2rem .7rem; font-size: .72rem; font-weight: 500; }

/* Verdict 3 cols */
.comp-verdict-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1rem; margin-bottom: 2rem; }
.cvg-card { background: var(--surface); backdrop-filter: blur(20px); border: 1px solid var(--border-light); border-radius: var(--radius-xl); padding: 1.25rem; box-shadow: var(--shadow-md); transition: var(--transition); }
.cvg-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); }
.cvg-kia { border-top: 3px solid var(--kia-ev); }
.cvg-des { border-top: 3px solid var(--toy-des); }
.cvg-grs { border-top: 3px solid var(--toy-grs); }
.cvg-header { display: flex; align-items: flex-start; gap: .6rem; margin-bottom: .75rem; }
.cvg-icon     { font-size: 1.3rem; flex-shrink: 0; }
.cvg-title    { font-size: .9rem; font-weight: 800; color: #1d1d1f; }
.cvg-subtitle { font-size: .7rem; color: #6e6e73; }
.cvg-best { margin-left: auto; background: rgba(22,163,74,.1); color: var(--green); font-size: .65rem; font-weight: 700; padding: .2rem .5rem; border-radius: 8px; white-space: nowrap; flex-shrink: 0; }
.cvg-best-des { background: rgba(41,128,185,.1); color: var(--toy-des); }
.cvg-best-grs { background: rgba(55,65,81,.1); color: var(--toy-grs); }
.cvg-price-block { margin-bottom: .75rem; }
.cvg-price-achat { font-size: 1.5rem; font-weight: 900; letter-spacing: -.04em; }
.cvg-price-8ans  { font-size: .72rem; color: #6e6e73; }
.cvg-list { list-style: none; display: flex; flex-direction: column; gap: .3rem; }
.cvg-list li { font-size: .75rem; padding-left: 1rem; position: relative; }
.cvg-list li::before { content: ""; position: absolute; left: 0; top: .35em; width: 6px; height: 6px; border-radius: 50%; background: #d1d5db; }
.cvg-ok::before   { background: var(--green) !important; }
.cvg-warn::before { background: var(--orange) !important; }
.cvg-ok   { color: #374151; }
.cvg-warn { color: #6b7280; }
.comp-body { display: flex; flex-direction: column; gap: 1.5rem; }

/* ── 13. COMP-BLOC (Bento) ── */
.comp-bloc { background: var(--surface); backdrop-filter: blur(25px); -webkit-backdrop-filter: blur(25px); border: 1px solid var(--border-light); border-radius: var(--radius-xl); padding: 1.5rem; box-shadow: var(--shadow-md); transition: var(--transition); }
.comp-bloc:hover { box-shadow: var(--shadow-lg); }
.comp-bloc-title { font-size: 1rem; font-weight: 800; color: #1d1d1f; margin-bottom: 1.25rem; padding-bottom: .75rem; border-bottom: 1px solid var(--border); cursor: pointer; display: flex; align-items: center; justify-content: space-between; }
.accord-icon { font-size: .8rem; color: #6e6e73; transition: transform .3s; }
.accord-body { overflow: hidden; }
.accord-body.collapsed { max-height: 0 !important; overflow: hidden; }
.comp-bloc-subtitle { font-size: .85rem; font-weight: 700; color: #374151; margin: 1rem 0 .75rem; padding-left: .5rem; border-left: 3px solid var(--kia-ev); }

/* Galeries cote a cote */
.gals-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.gal-comp-kia, .gal-comp-des { border-radius: var(--radius-lg); overflow: hidden; background: #000; }
.gal-comp-header-kia, .gal-comp-header-des { display: flex; align-items: center; justify-content: space-between; padding: .5rem .85rem; background: rgba(0,0,0,.7); }
.gal-comp-header-kia { border-bottom: 2px solid var(--kia-ev); }
.gal-comp-header-des { border-bottom: 2px solid var(--toy-des); }
.gal-comp-title-kia, .gal-comp-title-des { font-size: .75rem; color: #fff; font-weight: 600; }
.gal-comp-btn { display: flex; align-items: center; gap: .5rem; }
.gal-comp-counter-kia, .gal-comp-counter-des { font-size: .7rem; color: rgba(255,255,255,.7); }
.gal-prog-bar { height: 2px; background: rgba(255,255,255,.15); }
.gal-prog-fill-kia { height: 100%; background: var(--kia-ev); width: 0%; transition: width .3s; }
.gal-prog-fill-des { height: 100%; background: var(--toy-des); width: 0%; transition: width .3s; }

/* ── 14. COUT 8 ANS ── */
.cout8-wrap { overflow-x: auto; margin-bottom: 1.5rem; }
.cout8-table { width: 100%; border-collapse: collapse; font-size: .8rem; }
.cout8-th-label, .cout8-th-kia, .cout8-th-des, .cout8-th-grs { padding: .85rem .75rem; text-align: center; font-weight: 700; }
.cout8-th-kia { background: rgba(228,84,29,.06); color: var(--kia-ev); border-bottom: 3px solid var(--kia-ev); }
.cout8-th-des { background: rgba(41,128,185,.06); color: var(--toy-des); border-bottom: 3px solid var(--toy-des); }
.cout8-th-grs { background: rgba(55,65,81,.06); color: var(--toy-grs); border-bottom: 3px solid var(--toy-grs); }
.cout8-head-icon { font-size: 1.2rem; }
.cout8-head-name { font-size: .88rem; font-weight: 800; }
.cout8-head-sub  { font-size: .68rem; color: #6e6e73; }
.cout8-head-badge { margin-top: .25rem; display: inline-block; padding: .15rem .5rem; border-radius: 8px; font-size: .65rem; font-weight: 600; }
.cout8-badge-kia { background: rgba(228,84,29,.12); color: var(--kia-ev); }
.cout8-badge-des { background: rgba(41,128,185,.12); color: var(--toy-des); }
.cout8-badge-grs { background: rgba(55,65,81,.1); color: var(--toy-grs); }
.cout8-sep-row td { background: rgba(0,0,0,.04); font-size: .72rem; font-weight: 700; color: #6e6e73; padding: .4rem .75rem; text-transform: uppercase; letter-spacing: .04em; }
.cout8-sep-label { text-align: left; }
.cout8-row td, .cout8-alt td { padding: .6rem .75rem; border-bottom: 1px solid var(--border); vertical-align: middle; }
.cout8-alt td { background: rgba(0,0,0,.02); }
.cout8-td-label { font-size: .78rem; color: #374151; font-weight: 500; }
.cout8-detail   { font-size: .68rem; color: #9ca3af; margin-top: .1rem; font-weight: 400; }
.cout8-td-kia, .cout8-td-des, .cout8-td-grs { text-align: center; }
.cout8-na { color: #d1d5db; font-size: .85rem; }
.cout8-chip { display: inline-block; padding: .25rem .65rem; border-radius: 10px; font-size: .8rem; font-weight: 700; }
.cout8-chip-green  { background: var(--green-bg); color: var(--green); }
.cout8-chip-red    { background: var(--red-bg); color: var(--red); }
.cout8-chip-orange { background: var(--orange-bg); color: var(--orange); }
.cout8-chip-neutral { background: rgba(0,0,0,.06); color: #374151; }
.cout8-price-main { display: block; font-size: 1rem; font-weight: 900; letter-spacing: -.03em; }
.cout8-price-kia { color: var(--kia-ev); }
.cout8-price-des { color: var(--toy-des); }
.cout8-price-grs { color: var(--toy-grs); }
.cout8-price-sub { font-size: .68rem; color: #9ca3af; }
.cout8-note-warn { font-size: .72rem; color: var(--orange); }
.cout8-note-good { font-size: .72rem; color: var(--green); }
.cout8-total-row td { padding: 1rem .75rem; font-weight: 700; border-top: 2px solid var(--border); }
.cout8-total-label { font-size: .85rem; font-weight: 800; }
.cout8-total-main  { font-size: 1.3rem; font-weight: 900; letter-spacing: -.03em; }
.cout8-total-sub   { font-size: .72rem; color: #6e6e73; }
.cout8-total-alt   { font-size: .68rem; color: #9ca3af; }

/* Explication / Final */
.explication-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-bottom: 1.25rem; }
.expl-card { border-radius: var(--radius-lg); padding: 1rem 1.1rem; }
.expl-card-kia  { background: rgba(228,84,29,.06); border: 1px solid rgba(228,84,29,.2); }
.expl-card-warn { background: rgba(234,88,12,.04); border: 1px solid rgba(234,88,12,.15); }
.expl-title-kia  { font-size: .85rem; font-weight: 800; color: var(--kia-ev); margin-bottom: .5rem; }
.expl-title-warn { font-size: .85rem; font-weight: 800; color: var(--orange); margin-bottom: .5rem; }
.expl-text { font-size: .78rem; color: #374151; line-height: 1.7; }

.final-grid { display: grid; gap: .75rem; margin-bottom: 1.25rem; }
.final-grid-3 { grid-template-columns: repeat(3,1fr); }
.final-card { text-align: center; padding: .85rem; border-radius: var(--radius-lg); border: 1px solid var(--border); }
.fc-hc    { background: rgba(228,84,29,.06); border-color: rgba(228,84,29,.25); }
.fc-des   { background: rgba(41,128,185,.05); border-color: rgba(41,128,185,.2); }
.fc-yaris { background: rgba(55,65,81,.05); border-color: rgba(55,65,81,.2); }
.fc-label { font-size: .72rem; color: #6e6e73; margin-bottom: .25rem; }
.fc-price { font-size: 1.2rem; font-weight: 900; letter-spacing: -.03em; }
.fc-month { font-size: .68rem; color: #6e6e73; }

.analyse-banner { background: rgba(22,163,74,.06); border: 1px solid rgba(22,163,74,.2); border-radius: var(--radius-md); padding: 1rem 1.1rem; font-size: .78rem; color: #374151; line-height: 1.8; margin-bottom: 1rem; }
.winner-banner, .winner-banner-kia-des { display: flex; align-items: flex-start; gap: 1rem; background: linear-gradient(135deg,rgba(228,84,29,.08),rgba(26,86,219,.06)); border: 1px solid rgba(228,84,29,.25); border-radius: var(--radius-lg); padding: 1rem 1.25rem; }
.wb-icon { font-size: 1.5rem; flex-shrink: 0; }
.wb-text { font-size: .82rem; color: #374151; line-height: 1.6; }
.wb-sub  { font-size: .72rem; color: #6e6e73; }

/* ── 15. BUDGET MENSUEL ── */
.bm-subtitle { font-size: .8rem; color: #6e6e73; margin-bottom: 1rem; }
.bm-assurance { display: flex; align-items: flex-start; gap: .75rem; background: rgba(37,99,235,.05); border: 1px solid rgba(37,99,235,.15); border-radius: var(--radius-md); padding: .85rem 1rem; font-size: .78rem; margin-bottom: 1rem; }
.bm-assur-icon   { font-size: 1.2rem; flex-shrink: 0; }
.bm-assur-detail { font-size: .72rem; color: #374151; margin-top: .15rem; }
.bm-ranking { display: flex; align-items: center; gap: .5rem; margin-bottom: 1.25rem; flex-wrap: wrap; }
.bm-rank-item { display: flex; align-items: center; gap: .4rem; padding: .35rem .8rem; border-radius: 14px; font-size: .75rem; font-weight: 600; }
.bm-rank-best { background: rgba(228,84,29,.1); color: var(--kia-ev); }
.bm-rank-des  { background: rgba(41,128,185,.08); color: var(--toy-des); }
.bm-rank-sb   { background: rgba(0,0,0,.06); color: #374151; }
.bm-rank-grs  { background: rgba(55,65,81,.08); color: var(--toy-grs); }
.bm-rank-n { font-size: .65rem; }
.bm-rank-lbl { font-weight: 700; }
.bm-rank-val { font-weight: 900; }
.bm-rank-sep { color: #d1d5db; font-size: .8rem; }

.bm-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: .85rem; margin-bottom: 1.25rem; }
.bm-card { background: rgba(0,0,0,.025); border: 1px solid var(--border); border-radius: var(--radius-lg); overflow: hidden; transition: var(--transition); }
.bm-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); }
.bm-card-head { padding: .85rem 1rem; color: #fff; }
.bm-head-kia    { background: linear-gradient(135deg,var(--kia-ev),#c0410f); }
.bm-head-des    { background: linear-gradient(135deg,var(--toy-des),#1a6496); }
.bm-head-kia-sb { background: linear-gradient(135deg,#374151,#1f2937); }
.bm-head-grs    { background: linear-gradient(135deg,var(--toy-grs),#111827); }
.bm-head-eyebrow { font-size: .68rem; opacity: .8; margin-bottom: .2rem; }
.bm-head-price-row { display: flex; align-items: baseline; gap: .2rem; }
.bm-head-price { font-size: 2rem; font-weight: 900; letter-spacing: -.04em; }
.bm-head-unit  { font-size: .8rem; opacity: .8; }
.bm-head-taeg-badge { font-size: .65rem; opacity: .8; margin-top: .2rem; }
.bm-rank-pill { text-align: center; font-size: .72rem; font-weight: 700; padding: .3rem; border-bottom: 1px solid var(--border); }
.bm-rank-pill-best  { background: rgba(22,163,74,.08); color: var(--green); }
.bm-rank-pill-2     { background: rgba(41,128,185,.08); color: var(--toy-des); }
.bm-rank-pill-3     { background: rgba(55,65,81,.06); color: var(--toy-grs); }
.bm-rank-pill-worst { background: rgba(220,38,38,.06); color: var(--red); }
.bm-card-body { padding: .75rem .85rem; }
.bm-item { display: flex; align-items: center; justify-content: space-between; padding: .3rem 0; border-bottom: 1px solid rgba(0,0,0,.04); gap: .5rem; }
.bm-item-muted { opacity: .65; }
.bm-item-left  { display: flex; align-items: center; gap: .4rem; flex: 1; min-width: 0; }
.bm-item-icon  { font-size: .85rem; flex-shrink: 0; }
.bm-item-lbl   { font-size: .72rem; color: #6e6e73; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bm-item-right { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; flex-shrink: 0; }
.bm-item-val   { font-size: .8rem; font-weight: 700; color: #1d1d1f; }
.bm-val-red    { color: var(--red); }
.bm-val-green  { color: var(--green); }
.bm-val-orange { color: var(--orange); }
.bm-bar { width: 60px; height: 3px; background: rgba(0,0,0,.08); border-radius: 2px; }
.bm-bar-fill { height: 100%; border-radius: 2px; }
.bm-bar-neutral { background: #9ca3af; }
.bm-bar-red     { background: var(--red); }
.bm-bar-green   { background: var(--green); }
.bm-bar-orange  { background: var(--orange); }

/* ── 16. CHECKLIST ── */
.cl2-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.cl2-col  { display: flex; flex-direction: column; gap: .6rem; }
.cl2-header { display: flex; align-items: center; gap: .75rem; padding: .85rem 1rem; border-radius: var(--radius-lg); margin-bottom: .25rem; }
.cl2-header-kia { background: rgba(228,84,29,.08); border: 1px solid rgba(228,84,29,.2); }
.cl2-header-grs { background: rgba(55,65,81,.06); border: 1px solid rgba(55,65,81,.18); }
.cl2-header-icon  { font-size: 1.4rem; }
.cl2-header-title { font-size: .9rem; font-weight: 800; }
.cl2-header-sub   { font-size: .72rem; color: #6e6e73; }
.cl2-item { display: flex; gap: .65rem; align-items: flex-start; background: rgba(0,0,0,.025); border-radius: var(--radius-md); padding: .65rem .85rem; border-left: 3px solid transparent; }
.cl2-critical { border-left-color: var(--red); background: rgba(220,38,38,.04); }
.cl2-important { border-left-color: var(--orange); background: rgba(234,88,12,.03); }
.cl2-warn  { border-left-color: #fbbf24; background: rgba(251,191,36,.03); }
.cl2-info  { border-left-color: var(--blue); background: rgba(37,99,235,.03); }
.cl2-good  { border-left-color: var(--green); background: rgba(22,163,74,.03); }
.cl2-status { font-size: .62rem; font-weight: 800; padding: .15rem .45rem; border-radius: 6px; flex-shrink: 0; text-transform: uppercase; letter-spacing: .04em; }
.cl2-status-critical  { background: var(--red-bg); color: var(--red); }
.cl2-status-important { background: var(--orange-bg); color: var(--orange); }
.cl2-status-warn { background: rgba(251,191,36,.15); color: #b45309; }
.cl2-status-info { background: rgba(37,99,235,.1); color: var(--blue); }
.cl2-status-good { background: var(--green-bg); color: var(--green); }
.cl2-icon  { font-size: 1rem; flex-shrink: 0; }
.cl2-title { font-size: .78rem; font-weight: 700; color: #1d1d1f; }
.cl2-text  { font-size: .72rem; color: #4b5563; margin-top: .15rem; line-height: 1.6; }
.cl2-tag   { display: inline-block; padding: .1rem .4rem; border-radius: 6px; font-size: .65rem; font-weight: 600; margin: .1rem; }
.cl2-tag-red   { background: var(--red-bg); color: var(--red); }
.cl2-tag-green { background: var(--green-bg); color: var(--green); }

/* ── 17. DATA TABLE ── */
.fiab-table-wrap { overflow-x: auto; margin-bottom: 1rem; }
.fiab-table-mb14 { margin-bottom: 1.4rem; }
.fiab-table-mb20 { margin-bottom: 2rem; }
.data-table { width: 100%; border-collapse: collapse; font-size: .78rem; }
.fin-thead th { padding: .75rem .85rem; font-weight: 700; font-size: .78rem; text-align: center; border-bottom: 2px solid var(--border); }
.th-label { text-align: left; font-weight: 600; color: #6e6e73; }
.th-kia   { background: rgba(228,84,29,.06); color: var(--kia-ev); border-bottom-color: var(--kia-ev); }
.th-des   { background: rgba(41,128,185,.06); color: var(--toy-des); border-bottom-color: var(--toy-des); }
.th-grs   { background: rgba(55,65,81,.06); color: var(--toy-grs); border-bottom-color: var(--toy-grs); }
.th-w32   { width: 32%; }
.th-w23   { width: 23%; }
.th-center { text-align: center; }
.th-w32px { width: 40px; text-align: center; }
.tr-head-bg td { background: rgba(0,0,0,.04); font-weight: 700; font-size: .72rem; text-transform: uppercase; letter-spacing: .04em; color: #6e6e73; padding: .45rem .85rem; }
.tr-row td, .tr-alt td { padding: .5rem .85rem; border-bottom: 1px solid var(--border); vertical-align: top; }
.tr-alt td { background: rgba(0,0,0,.02); }
.td-label { font-size: .78rem; color: #374151; }
.td-val   { font-size: .78rem; text-align: center; }

/* Synth grid */
.synth-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1rem; margin-top: 1rem; }
.synth-card { border-radius: var(--radius-lg); padding: 1rem; border: 1px solid transparent; }
.synth-kia { background: rgba(228,84,29,.05); border-color: rgba(228,84,29,.2); }
.synth-des { background: rgba(41,128,185,.05); border-color: rgba(41,128,185,.2); }
.synth-grs { background: rgba(55,65,81,.05); border-color: rgba(55,65,81,.15); }
.synth-title { font-size: .82rem; font-weight: 800; margin-bottom: .6rem; }
.synth-title-kia { color: var(--kia-ev); }
.synth-title-des { color: var(--toy-des); }
.synth-title-grs { color: var(--toy-grs); }
.synth-items { display: flex; flex-direction: column; gap: .25rem; font-size: .74rem; color: #374151; }
.synth-note  { margin-top: .5rem; font-size: .7rem; color: #6e6e73; }
.synth-note-warn { color: var(--orange) !important; background: rgba(234,88,12,.06); border-radius: 6px; padding: .25rem .5rem; }

/* GR Sport — carte double section */
.synth-grs-split { display: flex; flex-direction: column; gap: 0; }
.synth-vs-label {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: .68rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .05em;
  padding: .35rem .6rem;
  border-radius: 8px;
  margin: .6rem 0 .4rem;
}
.synth-vs-label span {
  font-size: .65rem;
  font-weight: 700;
  padding: .1rem .45rem;
  border-radius: 6px;
}
.synth-vs-des {
  background: rgba(55,65,81,.1);
  color: var(--toy-grs);
}
.synth-vs-des span {
  background: rgba(55,65,81,.15);
  color: var(--toy-grs);
}
.synth-vs-kia {
  background: rgba(228,84,29,.08);
  color: var(--kia-ev);
  margin-top: 1rem;
}
.synth-vs-kia span {
  background: rgba(228,84,29,.15);
  color: var(--kia-ev);
}

/* Séparateur visuel entre les deux blocs */
.synth-grs-split .synth-items + .synth-vs-label {
  border-top: 1px dashed rgba(0,0,0,.1);
  padding-top: .5rem;
}

/* ── 18. WALLBOX ── */
.wb-tarifs-header { display: flex; align-items: center; margin-bottom: .75rem; }
.wb-tarifs-label  { font-size: .82rem; font-weight: 700; color: #1d1d1f; }
.wb-tarifs-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: .75rem; margin-bottom: 1.25rem; }
.wb-tarif-card { background: rgba(0,0,0,.03); border: 1px solid var(--border); border-radius: var(--radius-lg); padding: .85rem; text-align: center; transition: var(--transition); position: relative; }
.wb-tarif-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-sm); }
.wb-tarif-base { border-top: 2px solid #6b7280; }
.wb-tarif-hp   { border-top: 2px solid var(--orange); }
.wb-tarif-hc   { border-top: 2px solid var(--green); background: rgba(22,163,74,.04); }
.wb-tarif-pub  { border-top: 2px solid var(--red); }
.wb-tarif-badge { position: absolute; top: -8px; left: 50%; transform: translateX(-50%); background: var(--green); color: #fff; font-size: .6rem; font-weight: 700; padding: .1rem .5rem; border-radius: 6px; white-space: nowrap; }
.wb-tarif-icon  { font-size: 1.2rem; margin-bottom: .25rem; }
.wb-tarif-name  { font-size: .72rem; font-weight: 700; color: #1d1d1f; }
.wb-tarif-price { font-size: 1.1rem; font-weight: 900; letter-spacing: -.03em; color: #1d1d1f; margin: .2rem 0; }
.wb-tarif-sub   { font-size: .65rem; color: #6e6e73; }
.wb-main-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.wb-cost-card, .wb-steps-card { background: rgba(0,0,0,.025); border: 1px solid var(--border); border-radius: var(--radius-lg); padding: 1rem; }
.wb-cost-header, .wb-steps-header { display: flex; align-items: flex-start; gap: .75rem; margin-bottom: .85rem; }
.wb-cost-icon, .wb-steps-icon { font-size: 1.3rem; flex-shrink: 0; }
.wb-cost-title, .wb-steps-title { font-size: .88rem; font-weight: 800; }
.wb-cost-sub, .wb-steps-sub { font-size: .72rem; color: #6e6e73; }
.wb-no-aide { display: flex; align-items: center; gap: .5rem; background: rgba(220,38,38,.06); border: 1px solid rgba(220,38,38,.18); border-radius: var(--radius-sm); padding: .4rem .7rem; font-size: .72rem; margin-bottom: .85rem; }
.wb-no-aide-icon { font-size: .9rem; }
.wb-cost-lines { display: flex; flex-direction: column; gap: .3rem; }
.wb-cost-line { display: flex; justify-content: space-between; padding: .3rem 0; font-size: .78rem; border-bottom: 1px solid rgba(0,0,0,.04); }
.wb-cost-total { font-weight: 800; border-top: 2px solid var(--border) !important; border-bottom: none !important; margin-top: .25rem; }
.wb-cost-val   { font-weight: 700; color: #1d1d1f; }
.wb-roi-banner { display: flex; align-items: center; justify-content: center; gap: .75rem; background: var(--green-bg); border-radius: var(--radius-sm); padding: .75rem; margin-top: .85rem; }
.wb-roi-item { text-align: center; }
.wb-roi-val  { font-size: .95rem; font-weight: 900; color: var(--green); }
.wb-roi-lbl  { font-size: .65rem; color: #6e6e73; }
.wb-roi-sep  { color: #d1d5db; }
.wb-steps { display: flex; flex-direction: column; gap: .5rem; }
.wb-step { display: flex; align-items: flex-start; gap: .65rem; font-size: .76rem; color: #374151; }
.wb-step-num { width: 22px; height: 22px; background: #1d1d1f; color: #fff; border-radius: 50%; font-size: .68rem; font-weight: 700; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.wb-step-done { opacity: .8; }
.wb-step-num-done { background: var(--green); }
.wb-step-text { line-height: 1.5; }

/* ── 19. COMP TABLE ── */
.comp-table { width: 100%; border-collapse: collapse; font-size: .78rem; margin-bottom: 1rem; }
.comp-table th { padding: .6rem .75rem; background: rgba(0,0,0,.04); font-weight: 700; text-align: left; font-size: .75rem; border-bottom: 2px solid var(--border); }
.comp-table td { padding: .55rem .75rem; border-bottom: 1px solid var(--border); vertical-align: top; }
.comp-table .highlight td { background: rgba(0,0,0,.025); }
.comp-table .ok   { color: var(--green); }
.comp-table .warn { color: var(--orange); }

/* ── 20. CKM GRID ── */
.ckm-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1rem; margin-bottom: 1.25rem; }
.ckm-card { background: rgba(0,0,0,.025); border: 1px solid var(--border); border-radius: var(--radius-lg); overflow: hidden; transition: var(--transition); }
.ckm-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); }
.ckm-kia    { border-top: 3px solid var(--kia-ev); }
.ckm-kia-sb { border-top: 3px solid #374151; }
.ckm-toy    { border-top: 3px solid var(--orange); }
.ckm-head   { padding: .85rem 1rem; background: rgba(0,0,0,.04); border-bottom: 1px solid var(--border); }
.ckm-head-label     { font-size: .75rem; font-weight: 700; color: #374151; margin-bottom: .2rem; }
.ckm-head-price     { font-size: 1.3rem; font-weight: 900; letter-spacing: -.03em; color: var(--green); }
.ckm-head-price span { font-size: .8rem; font-weight: 500; color: #6e6e73; }
.ckm-head-price-warn { font-size: .75rem; font-weight: 600; color: var(--orange); }
.ckm-head-annual    { font-size: .7rem; color: #6e6e73; margin-top: .1rem; }
.ckm-body { padding: .75rem 1rem; }
.ckm-row  { display: flex; justify-content: space-between; align-items: center; padding: .28rem 0; border-bottom: 1px solid rgba(0,0,0,.04); font-size: .74rem; }
.ckm-row-lbl { color: #6e6e73; }
.ckm-row-val { font-weight: 600; color: #1d1d1f; }
.ckm-val-green  { color: var(--green); }
.ckm-val-orange { color: var(--orange); }
.ckm-val-red    { color: var(--red); }
.ckm-note { font-size: .68rem; color: #9ca3af; margin-top: .5rem; }
.ckm-abo-banner { display: flex; gap: .5rem; align-items: flex-start; background: rgba(37,99,235,.04); border: 1px solid rgba(37,99,235,.12); border-radius: var(--radius-sm); padding: .5rem .7rem; margin-bottom: .75rem; font-size: .7rem; }
.ckm-abo-icon  { font-size: .9rem; flex-shrink: 0; }
.ckm-abo-title { font-weight: 600; color: #1d1d1f; }
.ckm-abo-sub   { font-size: .65rem; color: #6e6e73; }
.sb-table { width: 100%; border-collapse: collapse; font-size: .72rem; }
.sb-table th { padding: .35rem .5rem; background: rgba(0,0,0,.05); font-weight: 700; font-size: .68rem; text-align: left; border-bottom: 2px solid var(--border); }
.sb-table td { padding: .3rem .5rem; border-bottom: 1px solid rgba(0,0,0,.05); vertical-align: middle; }
.sb-sep td { background: rgba(0,0,0,.04); font-weight: 700; font-size: .65rem; color: #6e6e73; padding: .25rem .5rem; }
.sb-sep-green td  { background: rgba(22,163,74,.06); color: var(--green); }
.sb-sep-orange td { background: rgba(234,88,12,.06); color: var(--orange); }
.sb-row-best td { background: rgba(22,163,74,.03); }
.sb-row-bad  td { background: rgba(220,38,38,.03); }
.sb-badge { padding: .1rem .35rem; border-radius: 5px; font-size: .65rem; font-weight: 700; }
.sb-badge-green  { background: var(--green-bg); color: var(--green); }
.sb-badge-orange { background: var(--orange-bg); color: var(--orange); }
.sb-badge-red    { background: var(--red-bg); color: var(--red); }
.sb-green  { color: var(--green); font-weight: 700; }
.sb-orange { color: var(--orange); font-weight: 600; }
.sb-red    { color: var(--red); font-weight: 600; }
.sb-footer { display: flex; flex-direction: column; gap: .25rem; margin-top: .5rem; font-size: .68rem; color: #6e6e73; }
.sb-footer-tip { color: var(--green); }

/* ── 21. VERDICT ── */
.verdict-grid { display: grid; gap: 1rem; margin-bottom: 1.25rem; }
.verdict-grid-3 { grid-template-columns: repeat(3,1fr); }
.verdict-box { background: rgba(0,0,0,.025); border: 1px solid var(--border); border-radius: var(--radius-lg); padding: 1.1rem; }
.verdict-box.elec         { border-top: 3px solid var(--kia-ev); background: rgba(228,84,29,.04); }
.verdict-box.verdict-box-des { border-top: 3px solid var(--toy-des); background: rgba(41,128,185,.04); }
.verdict-box.hybrid       { border-top: 3px solid var(--toy-grs); background: rgba(55,65,81,.04); }
.verdict-box h3 { font-size: .9rem; font-weight: 800; margin-bottom: .75rem; color: #1d1d1f; }
.verdict-box ul { list-style: none; display: flex; flex-direction: column; gap: .4rem; }
.verdict-box li { font-size: .76rem; color: #374151; padding-left: 1rem; position: relative; }
.verdict-box li::before { content: "•"; position: absolute; left: 0; color: #9ca3af; }
.verdict-note { font-size: .72rem; color: #6e6e73; font-style: italic; line-height: 1.6; }

/* ── 22. AVIS ── */
.avis-section-header { text-align: center; padding: 2rem 1.5rem 1.5rem; }
.avis-section-title { font-size: clamp(1.3rem,3vw,1.8rem); font-weight: 900; letter-spacing: -.03em; }
.avis-section-sub   { font-size: .82rem; color: #6e6e73; margin-top: .3rem; }
.avis-grid { max-width: 1280px; margin: 0 auto; padding: 0 1.5rem 2rem; display: grid; grid-template-columns: repeat(3,1fr); gap: 1.25rem; }
.avis-header { margin: -1.75rem -1.75rem 1.25rem; border-radius: var(--radius-xl) var(--radius-xl) 0 0; padding: 1.25rem 1.5rem; }
.avis-header-kia { background: linear-gradient(135deg,rgba(228,84,29,.12),rgba(26,86,219,.08)); border-bottom: 1px solid rgba(228,84,29,.2); }
.avis-header-des { background: linear-gradient(135deg,rgba(41,128,185,.12),rgba(41,128,185,.04)); border-bottom: 1px solid rgba(41,128,185,.2); }
.avis-header-grs { background: linear-gradient(135deg,rgba(55,65,81,.1),rgba(55,65,81,.04)); border-bottom: 1px solid rgba(55,65,81,.18); }
.avis-header-top  { display: flex; align-items: flex-start; gap: .75rem; }
.avis-icon        { font-size: 1.5rem; flex-shrink: 0; }
.avis-title       { font-size: 1rem; font-weight: 800; color: #1d1d1f; }
.avis-sub         { font-size: .72rem; color: #6e6e73; }
.avis-score       { margin-left: auto; text-align: center; flex-shrink: 0; }
.avis-score-val   { font-size: 1.6rem; font-weight: 900; letter-spacing: -.04em; }
.avis-score-val-kia { color: var(--kia-ev); }
.avis-score-val-des { color: var(--toy-des); }
.avis-score-val-grs { color: var(--toy-grs); }
.avis-score-lbl   { font-size: .65rem; color: #6e6e73; }
.avis-body { display: flex; flex-direction: column; gap: .75rem; }
.avis-crit-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: .25rem; }
.avis-crit-name  { font-size: .78rem; font-weight: 600; color: #1d1d1f; }
.avis-crit-score { font-size: .82rem; font-weight: 900; }
.avis-crit-bar-bg { height: 5px; background: rgba(0,0,0,.08); border-radius: 3px; margin-bottom: .25rem; overflow: hidden; }
.avis-crit-bar { height: 100%; border-radius: 3px; transition: width .6s cubic-bezier(0.4,0,0.2,1); }
.bar-1 { width: 20%; } .bar-2 { width: 40%; } .bar-3 { width: 60%; } .bar-4 { width: 80%; } .bar-5 { width: 100%; }
.bar-kia-green  { background: var(--green); }
.bar-kia-orange { background: var(--orange); }
.bar-kia-red    { background: var(--red); }
.bar-des-blue   { background: var(--toy-des); }
.bar-des-red    { background: var(--red); }
.bar-grs-green  { background: var(--green); }
.bar-grs-orange { background: var(--orange); }
.bar-grs-red    { background: var(--red); }
.avis-crit-sub  { font-size: .7rem; color: #6e6e73; line-height: 1.5; }
.avis-resume { border-radius: var(--radius-md); padding: .85rem 1rem; font-size: .76rem; color: #374151; line-height: 1.7; margin-top: .25rem; }
.avis-resume-kia { background: rgba(228,84,29,.05); border: 1px solid rgba(228,84,29,.18); }
.avis-resume-des { background: rgba(41,128,185,.05); border: 1px solid rgba(41,128,185,.18); }
.avis-resume-grs { background: rgba(55,65,81,.05); border: 1px solid rgba(55,65,81,.15); }
.avis-resume-title { font-size: .8rem; font-weight: 800; color: #1d1d1f; margin-bottom: .5rem; }
.avis-tags { display: flex; flex-wrap: wrap; gap: .3rem; margin-top: .75rem; }
.avis-tag  { background: rgba(0,0,0,.06); border-radius: 10px; padding: .18rem .6rem; font-size: .65rem; font-weight: 500; color: #374151; }

/* ── 23. BATTERIE ── */
.bat-section { max-width: 1280px; margin: 0 auto; padding: 1.5rem; }
.bat-header   { text-align: center; margin-bottom: 2rem; }
.bat-header h2 { font-size: 1.6rem; font-weight: 900; letter-spacing: -.03em; }
.bat-header p  { font-size: .85rem; color: #6e6e73; margin-top: .3rem; }
.bat-body { display: flex; flex-direction: column; gap: 2rem; }
.section-label { font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: #6e6e73; margin-bottom: .75rem; padding-bottom: .4rem; border-bottom: 1px solid var(--border); }
.bat-stat-grid { display: grid; grid-template-columns: repeat(auto-fill,minmax(160px,1fr)); gap: .75rem; }
.bat-stat { background: var(--surface); backdrop-filter: blur(20px); border: 1px solid var(--border-light); border-radius: var(--radius-lg); padding: 1rem .85rem; text-align: center; box-shadow: var(--shadow-sm); transition: var(--transition); }
.bat-stat:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); }
.bs-icon  { font-size: 1.3rem; margin-bottom: .3rem; }
.bs-val   { font-size: 1rem; font-weight: 900; letter-spacing: -.03em; color: #1d1d1f; }
.bs-label { font-size: .72rem; font-weight: 700; color: #374151; margin-top: .1rem; }
.bs-sub   { font-size: .65rem; color: #9ca3af; margin-top: .15rem; }
.bat-fiabilite-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: .75rem; }
.bat-fiche { border-radius: var(--radius-lg); padding: 1rem; border: 1px solid transparent; }
.bat-fiche-green { background: rgba(22,163,74,.06); border-color: rgba(22,163,74,.2); }
.bat-fiche-red   { background: rgba(220,38,38,.05); border-color: rgba(220,38,38,.2); }
.bat-fiche-blue  { background: rgba(37,99,235,.05); border-color: rgba(37,99,235,.18); }
.bat-fiche-title { font-size: .82rem; font-weight: 800; margin-bottom: .5rem; }
.bat-fiche-title-green { color: var(--green); }
.bat-fiche-title-red   { color: var(--red); }
.bat-fiche-title-blue  { color: var(--blue); }
.bat-fiche-text  { font-size: .75rem; color: #374151; line-height: 1.7; }
.bat-risque-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; }
.bat-risque { border-radius: var(--radius-lg); padding: 1rem; border: 1px solid transparent; }
.bat-risque-bad  { background: rgba(220,38,38,.05); border-color: rgba(220,38,38,.2); }
.bat-risque-good { background: rgba(22,163,74,.05); border-color: rgba(22,163,74,.2); }
.bat-risque-title { font-size: .82rem; font-weight: 800; margin-bottom: .5rem; }
.bat-risque-title-bad  { color: var(--red); }
.bat-risque-title-good { color: var(--green); }
.bat-risk-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: .75rem; }
.bat-risk { border-radius: var(--radius-lg); padding: 1rem; border: 1px solid var(--border); }
.bat-risk h4 { font-size: .8rem; font-weight: 800; margin-bottom: .5rem; }
.bat-risk p  { font-size: .75rem; color: #374151; line-height: 1.7; }
.bat-risk.ok     { background: rgba(22,163,74,.05); border-color: rgba(22,163,74,.2); }
.bat-risk.warn   { background: rgba(234,88,12,.05); border-color: rgba(234,88,12,.2); }
.bat-risk.danger { background: rgba(220,38,38,.05); border-color: rgba(220,38,38,.2); }
.bat-conclusion  { background: rgba(37,99,235,.05); border: 1px solid rgba(37,99,235,.18); border-radius: var(--radius-xl); padding: 1.25rem; }
.bat-conclusion-title { font-size: .9rem; font-weight: 800; color: #1d1d1f; margin-bottom: .85rem; }
.bat-conclusion-grid  { display: grid; grid-template-columns: repeat(3,1fr); gap: .75rem; }
.bat-conclusion-card  { background: rgba(255,255,255,.6); border-radius: var(--radius-md); padding: .85rem; font-size: .75rem; color: #374151; line-height: 1.7; }
.bat-conclusion-card-title { font-size: .75rem; font-weight: 800; color: #1d1d1f; margin-bottom: .4rem; }
.fiab-footer { display: grid; grid-template-columns: 1fr; }

/* ── FINANCEMENT ── */
.fin-section { padding-bottom: 2rem; }
.fin-header { text-align: center; margin-bottom: 2rem; }
.fin-header h2 { font-size: clamp(1.2rem,3vw,1.7rem); font-weight: 900; letter-spacing: -.03em; margin-bottom: .4rem; }
.fin-header p  { font-size: .83rem; color: #6e6e73; }
.fin-body { }
.fin-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.25rem;
  align-items: start;
}
.fin-car { display: flex; flex-direction: column; gap: .75rem; }
.fin-car-header {
  display: flex; align-items: center; gap: .85rem;
  border-radius: var(--radius-lg); padding: 1rem 1.25rem;
  color: #fff;
}
.kia-h { background: linear-gradient(135deg, var(--kia-ev), #c0410f); }
.des-h { background: linear-gradient(135deg, var(--toy-des), #1a6496); }
.toy-h { background: linear-gradient(135deg, var(--toy-grs), #111827); }
.fch-icon  { font-size: 1.8rem; flex-shrink: 0; }
.fch-title { font-size: .95rem; font-weight: 800; }
.fch-price { font-size: .75rem; opacity: .85; margin-top: .15rem; }
.fin-cards { display: flex; flex-direction: column; gap: .65rem; }

/* Carte financement générique */
.fin-card {
  background: var(--surface);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border: 1px solid var(--border-light);
  border-radius: var(--radius-lg);
  padding: .9rem 1rem;
  box-shadow: var(--shadow-sm);
  transition: var(--transition);
  border-top: 3px solid var(--border);
}
.fin-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); }

/* Badges */
.fc-badge {
  display: inline-block;
  font-size: .7rem; font-weight: 700;
  padding: .2rem .65rem; border-radius: 8px;
  background: rgba(0,0,0,.07); color: #1d1d1f;
  margin-bottom: .5rem;
}
.fc-badge-kia { background: rgba(228,84,29,.12); color: var(--kia-ev); }

/* Mensualité */
.fc-monthly {
  font-size: 1.45rem; font-weight: 900; letter-spacing: -.04em;
  color: #1d1d1f; margin-bottom: .35rem;
}
.fc-monthly span { font-size: .78rem; font-weight: 400; color: #6e6e73; }

/* Détails */
.fc-details { font-size: .74rem; color: #374151; line-height: 1.7; margin-bottom: .5rem; }

/* Total */
.fc-total {
  display: flex; justify-content: space-between; align-items: center;
  padding: .4rem .6rem; background: rgba(0,0,0,.04); border-radius: 8px;
  margin-top: .25rem;
}
.fc-total-lbl { font-size: .68rem; color: #6e6e73; font-weight: 600; }
.fc-total-val { font-size: .9rem; font-weight: 900; color: #1d1d1f; }

/* Variantes cartes */
.fc-best {
  border-color: rgba(22,163,74,.3) !important;
  background: rgba(22,163,74,.04);
}
.fc-best .fc-badge {
  background: var(--green); color: #fff;
}
.fc-bour  { border-top-color: #7c3aed !important; }
.fc-banq  { border-top-color: var(--orange) !important; }
.fc-pret  { border-top-color: var(--red) !important; }
.fc-loa   { border-top-color: #6b7280 !important; background: rgba(107,114,128,.03); }
.fin-macif-kia { border-top-color: #059669 !important; }
.fin-macif-des { border-top-color: var(--toy-des) !important; }
.fin-macif-grs { border-top-color: var(--toy-grs) !important; }

/* ── Carte LOA redesign ── */
.loa-card-redesign {
  display: flex; flex-direction: column; gap: .6rem;
  padding: .85rem 1rem;
}
.loa-r-header {
  display: flex; align-items: center; gap: .5rem; flex-wrap: wrap;
}
.loa-r-badge {
  font-size: .72rem; font-weight: 800;
  background: rgba(107,114,128,.12); color: #374151;
  padding: .2rem .6rem; border-radius: 8px;
}
.loa-r-pill {
  font-size: .68rem; font-weight: 600; color: var(--orange);
  background: var(--orange-bg); padding: .15rem .5rem; border-radius: 6px;
}
.loa-r-monthly-row {
  display: flex; align-items: baseline; gap: .4rem; flex-wrap: wrap;
}
.loa-r-amount {
  font-size: 1.4rem; font-weight: 900; letter-spacing: -.04em; color: #1d1d1f;
}
.loa-r-unit {
  font-size: .78rem; color: #6e6e73;
}
.loa-r-meta {
  font-size: .7rem; color: #6e6e73; margin-left: .25rem;
}
.loa-r-breakdown {
  display: flex; flex-direction: column; gap: .3rem;
  background: rgba(0,0,0,.03); border-radius: 10px; padding: .6rem .75rem;
}
.loa-r-line {
  display: flex; align-items: center; gap: .5rem;
  font-size: .75rem; color: #374151;
}
.loa-r-dot {
  width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0;
}
.loa-r-lbl { flex: 1; }
.loa-r-val { font-weight: 700; color: #1d1d1f; }
.loa-r-val-oa { color: var(--red); }
.loa-r-total-line {
  display: flex; justify-content: space-between; align-items: center;
  padding-top: .4rem; margin-top: .15rem;
  border-top: 1.5px solid var(--border); font-weight: 800;
}
.loa-r-total-lbl { font-size: .78rem; color: #1d1d1f; }
.loa-r-total-val { font-size: 1rem; font-weight: 900; color: var(--orange); }

/* TAEG grid dans comparatif */
.taeg-grid {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: .75rem;
  margin-bottom: 1rem;
}
.taeg-item {
  background: var(--surface);
  backdrop-filter: blur(20px);
  border: 1px solid var(--border-light);
  border-radius: var(--radius-lg);
  padding: .85rem 1rem;
  text-align: center;
  box-shadow: var(--shadow-sm);
}
.taeg-item-kia { border-top: 3px solid var(--kia-ev); }
.taeg-item-des { border-top: 3px solid var(--toy-des); }
.taeg-item-grs { border-top: 3px solid var(--toy-grs); }
.taeg-label { font-size: .72rem; color: #6e6e73; margin-bottom: .2rem; }
.taeg-rate  { font-size: 1.3rem; font-weight: 900; letter-spacing: -.04em; color: #1d1d1f; }
.taeg-sub   { font-size: .68rem; color: #6e6e73; margin-top: .1rem; }
.taeg-best  { color: var(--green) !important; }

@media (max-width: 900px) {
  .fin-grid { grid-template-columns: 1fr; }
  .taeg-grid { grid-template-columns: 1fr; }
}


.ckm-rentab-bloc {
  background: rgba(255,255,255,0.6);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: 1rem 1.1rem;
  margin-bottom: 1rem;
}
.ckm-rentab-title {
  font-size: .85rem;
  font-weight: 700;
  color: #1d1d1f;
  margin-bottom: .75rem;
}
.ckm-rentab-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .75rem;
  margin-bottom: .75rem;
}
.ckm-rentab-card {
  border-radius: var(--radius-sm);
  padding: .75rem .85rem;
  border-left: 3px solid transparent;
}
.ckm-rentab-ilwat  { background: rgba(37,99,235,.07); border-left-color: #2563eb; }
.ckm-rentab-electra{ background: rgba(22,163,74,.07);  border-left-color: #16a34a; }
.ckm-rentab-name {
  font-size: .8rem;
  font-weight: 700;
  margin-bottom: .3rem;
  color: #1d1d1f;
}
.ckm-rentab-detail {
  font-size: .75rem;
  color: #555;
  line-height: 1.5;
  margin-bottom: .35rem;
}
.ckm-rentab-verdict {
  font-size: .76rem;
  font-weight: 600;
  line-height: 1.4;
  padding: .3rem .5rem;
  border-radius: 6px;
}
.ckm-rentab-ok  { background: var(--green-bg); color: var(--green); }
.ckm-rentab-bad { background: var(--red-bg);   color: var(--red); }
.ckm-rentab-note {
  font-size: .76rem;
  color: #555;
  padding: .5rem .7rem;
  background: rgba(234,88,12,.07);
  border-radius: 8px;
  border-left: 3px solid var(--orange);
  line-height: 1.5;
}

@media (max-width: 600px) {
  .ckm-rentab-grid { grid-template-columns: 1fr; }
}

/* ── 27. PRINT ── */
@media print {
  .sticky-nav, .sticky-car-bar, .scroll-btns, .print-btn-wrap, .site-footer { display: none !important; }
  .page { padding: .5rem; }
  .comp-bloc, .card { box-shadow: none; border: 1px solid #e5e7eb; }
  body { background: #fff; }
}

/* ── Bouton impression dans le groupe scroll ── */
.scroll-btn-print { font-size: .95rem; }

/* ── FIN-COMPARE : tableau récap + LOA vs Achat + TAEG ── */
.fin-compare {
  margin-top: 2rem;
}
.fin-compare-title {
  font-size: .92rem;
  font-weight: 800;
  color: #1d1d1f;
  margin-bottom: .85rem;
  letter-spacing: -.02em;
}

/* Tableau récapitulatif financement */
.fin-recap-table { width: 100%; border-collapse: collapse; }
.fin-recap-table th,
.fin-recap-table td { padding: .55rem .7rem; font-size: .78rem; }
.fin-recap-table thead th { background: rgba(0,0,0,.04); font-weight: 700; }
.th-center { text-align: center !important; }
.th-w32px  { width: 44px; }

/* Lignes du tableau */
.fin-row-0  { background: rgba(228,84,29,.06); }
.fin-row-0b { background: rgba(192,64,16,.04); }
.fin-row-1  { background: rgba(37,99,235,.04); }
.fin-row-2,.fin-row-3,.fin-row-7,.fin-row-des-cic60,.fin-row-des-cic84,.fin-row-12,.fin-row-15 { background: rgba(41,128,185,.04); }
.fin-row-4,.fin-row-6,.fin-row-8,.fin-row-9,.fin-row-9c { background: rgba(37,99,235,.03); }
.fin-row-9b,.fin-row-10,.fin-row-11,.fin-row-13,.fin-row-13b,.fin-row-14,.fin-row-16 { background: rgba(231,76,60,.04); }

/* Badges de rang */
.td-rank { text-align: center; padding: .4rem .5rem; }
.rank {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px; height: 24px;
  border-radius: 50%;
  font-size: .7rem;
  font-weight: 800;
  background: rgba(0,0,0,.08);
  color: #1d1d1f;
}
.rank-kia    { background: var(--kia-ev); color: #fff; }
.rank-des    { background: var(--toy-des); color: #fff; }
.rank-des-lt { background: rgba(41,128,185,.15); color: var(--toy-des); }
.rank-grs    { background: var(--toy-grs); color: #fff; }
.rank-grn    { background: var(--green); color: #fff; }
.rank-gray   { background: #d1d5db; color: #374151; }

.fin-sub { font-size: .68rem; color: #6e6e73; margin-top: .1rem; line-height: 1.4; }
.fin-note-info {
  margin-top: 1rem;
  padding: .75rem 1rem;
  background: rgba(37,99,235,.05);
  border-left: 3px solid var(--blue);
  border-radius: 0 var(--radius-md) var(--radius-md) 0;
  font-size: .75rem;
  color: #374151;
  line-height: 1.7;
}

/* ── LOA vs Achat ── */
.loa-compare-wrap {
  margin-top: 1.5rem;
}
.fin-loa-header {
  display: flex;
  align-items: center;
  gap: .5rem;
  margin-bottom: .85rem;
}
.fin-loa-header-title {
  font-size: .92rem;
  font-weight: 800;
  color: #1d1d1f;
}
.loa-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
  margin-bottom: .75rem;
}
.loa-card-bad,
.loa-card-good {
  border-radius: var(--radius-lg);
  padding: 1rem 1.1rem;
  font-size: .8rem;
  line-height: 1.75;
  color: #374151;
}
.loa-card-bad {
  background: rgba(220,38,38,.05);
  border: 1px solid rgba(220,38,38,.18);
  border-top: 3px solid var(--red);
}
.loa-card-good {
  background: rgba(22,163,74,.05);
  border: 1px solid rgba(22,163,74,.18);
  border-top: 3px solid var(--green);
}
.loa-card-title {
  font-size: .85rem;
  font-weight: 800;
  margin-bottom: .5rem;
}
.loa-card-title-bad  { color: var(--red); }
.loa-card-title-good { color: var(--green); }
.loa-card-text { white-space: normal; }

.loa-conseil-wrap {
  margin-top: .5rem;
}
.loa-conseil {
  padding: .7rem 1rem;
  background: rgba(37,99,235,.06);
  border-left: 3px solid var(--blue);
  border-radius: 0 var(--radius-md) var(--radius-md) 0;
  font-size: .8rem;
  color: #1d1d1f;
  line-height: 1.6;
}

/* ── TAEG Résumé ── */
.taeg-resume {
  margin-top: 1.5rem;
}
.taeg-resume-title {
  font-size: .92rem;
  font-weight: 800;
  color: #1d1d1f;
  margin-bottom: .75rem;
}
.taeg-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: .5rem;
}
.taeg-item {
  background: var(--surface);
  border: 1px solid var(--border-light);
  border-radius: var(--radius-md);
  padding: .6rem .75rem;
  font-size: .74rem;
  color: #374151;
  line-height: 1.6;
  border-left: 3px solid var(--border);
  transition: var(--transition);
}
.taeg-item:hover { box-shadow: var(--shadow-sm); transform: translateY(-1px); }
.taeg-kia-best { border-left-color: var(--kia-ev) !important; background: rgba(228,84,29,.04); }
.taeg-des-best { border-left-color: var(--toy-des) !important; background: rgba(41,128,185,.04); }
.taeg-grs-ok   { border-left-color: var(--toy-grs) !important; }
.taeg-kia-ok   { border-left-color: var(--blue) !important; }
.taeg-neutral  { border-left-color: #9ca3af !important; }
.taeg-toyota-warn { border-left-color: var(--orange) !important; background: rgba(234,88,12,.03); }
.taeg-warn     { border-left-color: var(--red) !important; background: rgba(220,38,38,.04); }

/* Cellules spéciales tableau récap */
.td-kia-best { color: var(--kia-ev); font-weight: 700; }
.td-des-val  { color: var(--toy-des); font-weight: 700; }
.td-grs-val  { color: var(--toy-grs); font-weight: 700; }

/* Note de bas de financement */
.fin-note {
  margin-top: 1rem;
  padding: .75rem 1rem;
  background: rgba(0,0,0,.03);
  border-radius: var(--radius-md);
  font-size: .72rem;
  color: #6e6e73;
  line-height: 1.7;
}

@media (max-width: 900px) {
  .taeg-grid { grid-template-columns: repeat(2,1fr); }
  .loa-grid  { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  .taeg-grid { grid-template-columns: 1fr; }
  .fin-recap-table th,
  .fin-recap-table td { padding: .4rem .5rem; font-size: .7rem; }
}

/* ── FOOTER ── */
.site-footer {
  background: rgba(245,245,247,0.82);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-top: 1px solid var(--border);
  padding: 2rem 1.5rem;
  margin-top: 2rem;
}
.site-footer-inner {
  max-width: 1280px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .5rem;
  text-align: center;
}
.site-footer-copy {
  font-size: .82rem;
  font-weight: 700;
  color: #1d1d1f;
}
.site-footer-legal {
  font-size: .72rem;
  color: #6e6e73;
  line-height: 1.6;
}
.site-footer-links {
  display: flex;
  gap: 1.25rem;
  margin-top: .5rem;
  flex-wrap: wrap;
  justify-content: center;
}
.site-footer-links a {
  font-size: .75rem;
  font-weight: 600;
  color: var(--blue);
  transition: var(--transition);
}
.site-footer-links a:hover {
  color: var(--kia);
  text-decoration: underline;
}
@media (max-width: 480px) {
  .site-footer { padding: 1.5rem 1rem; }
  .site-footer-links { gap: .75rem; }
}

/* ══════════════════════════════
   28. RESPONSIVE — MOBILE FIRST
══════════════════════════════ */
@media (max-width: 1024px) {
  .bm-grid           { grid-template-columns: repeat(2,1fr); }
  .wb-tarifs-grid    { grid-template-columns: repeat(2,1fr); }
  .fin-grid          { grid-template-columns: 1fr; }
  .avis-grid         { grid-template-columns: 1fr; }
  .synth-grid        { grid-template-columns: 1fr; }
  .ckm-grid          { grid-template-columns: 1fr; }
  .bat-fiabilite-grid{ grid-template-columns: 1fr; }
  .bat-conclusion-grid{ grid-template-columns: 1fr; }
  .kpi-grid          { grid-template-columns: repeat(2,1fr); }
}

@media (max-width: 768px) {
  :root { --radius-xl: 22px; --radius-lg: 16px; }
  .page  { padding: 1.25rem 1rem 2rem; }
  .hero  { padding: 2.5rem 1rem 2rem; }

  .hero-verdict { flex-direction: column; align-items: center; }
  .hv-card { max-width: 100%; min-width: 0; width: 100%; }
  .hv-vs   { justify-content: center; }

  .hero-ctas { flex-direction: column; align-items: center; }
  .hcta { width: 100%; max-width: 320px; text-align: center; }

  .sticky-nav-inner a:not(.nav-logo) span:last-child { display: none; }
  .nav-logo-sub { display: none; }

  .cs-tabs { flex-direction: column; }
  .cs-tab  { min-width: 0; }
  .cs-gal-img { height: 240px; }
  .gals-grid  { grid-template-columns: 1fr; }

  .comp-verdict-grid { grid-template-columns: 1fr; }
  .explication-grid  { grid-template-columns: 1fr; }
  .final-grid-3      { grid-template-columns: 1fr; }
  .bm-grid           { grid-template-columns: 1fr; }
  .cl2-grid          { grid-template-columns: 1fr; }
  .wb-main-grid      { grid-template-columns: 1fr; }
  .loa-grid          { grid-template-columns: 1fr; }
  .bat-risk-grid     { grid-template-columns: 1fr; }
  .bat-risque-grid   { grid-template-columns: 1fr; }
  .fiab-footer       { grid-template-columns: 1fr; }
  .verdict-grid-3    { grid-template-columns: 1fr; }

  .cout8-wrap { font-size: .72rem; }
  .data-table { font-size: .72rem; }
  .comp-table { font-size: .72rem; }

  .specs { grid-template-columns: 1fr 1fr; }
  .battery-bloc { grid-template-columns: repeat(3,1fr); }

  .avis-header { margin: -1.25rem -1.25rem 1rem; }
  .avis-score-val { font-size: 1.2rem; }
  .avis-grid { grid-template-columns: 1fr; }

  .bm-ranking { flex-direction: column; align-items: flex-start; }
  .taeg-grid { grid-template-columns: 1fr; }
  .eq-seg    { flex-direction: column; }
  .eq-seg-btn { justify-content: center; }
  .comp-bloc { padding: 1rem; }
  .card { padding: 1.25rem; }
  .synth-grid { grid-template-columns: 1fr; }
  .vacances-grid { grid-template-columns: 1fr; }
}

/* ── SECTION VACANCES ── */
.vacances-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
  margin: 1rem 0;
}
.vacances-card {
  border-radius: var(--radius-lg);
  padding: 1.25rem;
  background: var(--surface);
  backdrop-filter: blur(12px);
  border: 1px solid var(--border);
  box-shadow: var(--shadow-sm);
}
.vacances-card-kia  { border-top: 3px solid var(--kia); }
.vacances-card-comp { border-top: 3px solid var(--green); }
.vacances-card-head {
  display: flex;
  align-items: center;
  gap: .75rem;
  margin-bottom: 1rem;
  padding-bottom: .75rem;
  border-bottom: 1px solid var(--border);
}
.vacances-head-icon { font-size: 1.6rem; }
.vacances-head-title { font-size: .95rem; font-weight: 700; color: #1d1d1f; }
.vacances-head-sub   { font-size: .75rem; color: #6e6e73; margin-top: .15rem; }
.vacances-rows { display: flex; flex-direction: column; gap: .5rem; }
.vacances-row {
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-rows: auto auto;
  gap: .1rem .75rem;
  padding: .5rem .75rem;
  border-radius: var(--radius-sm);
  background: rgba(0,0,0,.02);
  font-size: .82rem;
}
.vacances-row-alt { background: rgba(0,0,0,.04); }
.vacances-row-total {
  background: rgba(22,163,74,.08);
  border: 1px solid rgba(22,163,74,.2);
  font-weight: 600;
}
.vacances-lbl  { color: #1d1d1f; font-weight: 500; grid-column: 1; grid-row: 1; }
.vacances-val  { font-weight: 700; font-size: .9rem; grid-column: 2; grid-row: 1; text-align: right; white-space: nowrap; }
.vacances-calc { font-size: .72rem; color: #6e6e73; grid-column: 1 / -1; grid-row: 2; }
.vacances-val-green  { color: var(--green); }
.vacances-val-orange { color: var(--orange); }
.vacances-val-red    { color: var(--red); }
.vacances-note {
  margin-top: .75rem;
  padding: .6rem .75rem;
  background: rgba(37,99,235,.06);
  border-left: 3px solid var(--blue);
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
  font-size: .78rem;
  color: #1d1d1f;
  line-height: 1.5;
}

@media (max-width: 480px) {
  .hero-title   { font-size: 1.8rem; }
  .cs-gal-img   { height: 200px; }
  .battery-bloc { grid-template-columns: repeat(2,1fr); }
  .specs        { grid-template-columns: 1fr; }
  .bat-stat-grid { grid-template-columns: repeat(2,1fr); }
  .wb-tarifs-grid { grid-template-columns: 1fr 1fr; }
  .ckm-grid     { grid-template-columns: 1fr; }
  .cs-thumbs img { width: 42px; height: 34px; }
  .price-block  { flex-direction: column; }
  .garantie-banner { flex-direction: column; }
  .kpi-grid     { grid-template-columns: repeat(2,1fr); }
  .bat-conclusion-grid { grid-template-columns: 1fr; }
  .fiab-footer  { grid-template-columns: 1fr; }
  .vacances-grid { grid-template-columns: 1fr; }
}