/* ===========================
   Equip-Auto — Styles (v3)
   =========================== */

:root{
  --bg: #09111f;
  --card: rgba(12, 21, 38, .82);
  --card2: rgba(10, 18, 32, .76);
  --border: rgba(148, 163, 184, .18);
  --text: rgba(248,250,252,.96);
  --muted: rgba(203,213,225,.76);

  --shadow: 0 18px 44px rgba(2,6,23,.34);
  --radius: 22px;

  --accent: rgba(56,189,248,.96);
  --accent2: rgba(59,130,246,.96);
}

/* Reset-ish */
*{ box-sizing:border-box; }
html,body{ height:100%; }
body{
  margin:0;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color: var(--text);
  background:
    radial-gradient(900px 520px at 12% 0%, rgba(56,189,248,.12), transparent 58%),
    radial-gradient(900px 540px at 100% 8%, rgba(59,130,246,.14), transparent 52%),
    radial-gradient(780px 420px at 50% 100%, rgba(14,165,233,.08), transparent 55%),
    linear-gradient(180deg, #050b16, var(--bg));
  line-height:1.6;
}

img{ max-width:100%; height:auto; display:block; }

a{ color:inherit; }
.link{
  color: rgba(147,197,253,.95);
  text-decoration:none;
  font-weight:800;
}
.link:hover{ text-decoration:underline; }

.container{
  max-width: 1120px;
  margin: 0 auto;
  padding: 18px 16px 28px;
}

/* Header / Nav */
header{
  position: sticky;
  top:0;
  z-index:50;
  backdrop-filter: blur(12px);
  background: rgba(5, 10, 20, .82);
  border-bottom: 1px solid var(--border);
}

.nav{
  max-width: 1120px;
  margin: 0 auto;
  padding: 14px 16px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 14px;
}

.logoLink{
  text-decoration:none;
  color:inherit;
  display:flex;
  align-items:center;
  gap:10px;
  min-width: 220px;
}

.brandText strong{
  font-size: 16px;
  letter-spacing:.2px;
}
.brandText small{
  color: var(--muted);
  font-weight:700;
}

.logo{
  width: 38px;
  height: 38px;
  border-radius: 16px;
  background: url("images/logo.svg") center / cover no-repeat;
  box-shadow: 0 10px 22px rgba(0,0,0,.35);
  border: 1px solid rgba(255,255,255,.16);
}

.menu{
  display:flex;
  align-items:center;
  gap: 10px;
  flex-wrap:wrap;
  justify-content:flex-end;
}
.menu a{
  text-decoration:none;
  color: var(--text);
  font-weight:900;
  font-size: 13px;
  padding: 9px 12px;
  border-radius: 16px;
  border: 1px solid transparent;
  background: rgba(255,255,255,.03);
}
.menu a:hover{
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.05);
}

/* Layout blocks */
.hero{
  margin-top: 14px;
  padding: 24px;
  background: linear-gradient(180deg, rgba(8,15,28,.94), rgba(10,18,32,.78));
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}
.hero h1{ margin: 8px 0 10px; font-size: clamp(30px, 4vw, 46px); line-height:1.05; letter-spacing:-.03em; }
.hero p{ margin: 8px 0 0; color: var(--muted); font-weight:650; }

.muted{ color: var(--muted); }
.panel{
  margin-top: 18px;
}
.prodBox > div{
  min-width: 0;
  flex: 1;
}
.prodBox .btn,
.prodBox .btnSecondary{
  margin-right: 8px;
}
  padding: 12px 12px;
  border-radius: 16px;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.10);
}

.card{
  margin-top: 16px;
  padding: 22px;
  background: linear-gradient(180deg, rgba(10,18,32,.86), rgba(10,18,32,.72));
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}

.card h2{ margin: 0 0 10px; font-size: 20px; }
.card h3{ margin: 14px 0 10px; font-size: 16px; }
.card p{ color: var(--muted); font-weight:650; }
.card ul{ margin: 10px 0 0; padding-left: 18px; color: var(--muted); font-weight:650; }
.card li{ margin: 6px 0; }

.grid2{
  display:grid;
  grid-template-columns: 1.3fr .7fr;
  gap: 16px;
  margin-top: 14px;
}
@media (max-width: 980px){
  .grid2{ grid-template-columns: 1fr; }
  .logoLink{ min-width: auto; }
}

.hr{
  height: 1px;
  background: rgba(255,255,255,.10);
  margin: 16px 0;
}

/* Product block */
.prodBox{
  display:flex;
  gap: 18px;
  align-items:center;
  padding: 18px;
  border-radius: 18px;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.10);
  margin-top: 18px;
}
.prodBox > div{
  min-width: 0;
  flex: 1;
}
.prodBox .btn,
.prodBox .btnSecondary{
  margin-right: 8px;
}
@media (max-width: 680px){
  .prodBox{ flex-direction: column; }
}
.prodImg{
  width: 235px;
  min-width: 235px;
  height: 165px;
  /* Keep product fully visible (no crop) */
  object-fit: contain;
  object-position: center;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.12);
  background: linear-gradient(180deg, rgba(255,255,255,.96), rgba(255,255,255,.88));
  padding: 12px;
  box-sizing: border-box;
}
@media (max-width: 680px){
  .prodImg{ width: 100%; min-width: auto; height: 180px; }
}

/* Badges + buttons */
.badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size: 12px;
  font-weight: 900;
  color: var(--text);
  padding: 5px 10px;
  border-radius: 999px;
  background: rgba(96,165,250,.14);
  border: 1px solid rgba(96,165,250,.30);
}

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 10px 14px;
  border-radius: 16px;
  font-weight: 950;
  text-decoration:none;
  color: rgba(8, 14, 26, .95);
  background: rgba(96,165,250,.95);
  border: 1px solid rgba(96,165,250,.20);
  box-shadow: 0 10px 20px rgba(0,0,0,.30);
  margin-top: 10px;
}
.btn:hover{ filter: brightness(1.06); }
.btn, .btnSecondary{
  max-width:100%;
  flex-wrap:wrap;
  text-align:center;
  line-height:1.3;
}

.btnSecondary{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 10px 14px;
  border-radius: 16px;
  font-weight: 950;
  text-decoration:none;
  color: var(--text);
  background: rgba(30, 64, 122, .72);
  border: 1px solid rgba(96,165,250,.42);
  margin-top: 10px;
}
.btnSecondary:hover{ filter: brightness(1.06); }

/* Tables */
table{
  width:100%;
  border-collapse: collapse;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 16px;
  overflow:hidden;
}
th, td{
  text-align:left;
  padding: 12px 12px;
  border-bottom: 1px solid rgba(255,255,255,.08);
  color: var(--muted);
  font-weight:650;
  vertical-align: top;
  font-size: 14px;
}
th{
  color: var(--text);
  font-weight: 950;
  background: rgba(255,255,255,.03);
}

/* Details / FAQ */
details{
  margin-top: 10px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.03);
  border-radius: 16px;
  padding: 10px 12px;
}
summary{
  cursor: pointer;
  font-weight: 950;
  color: var(--text);
}
details p{ margin: 10px 0 0; }

/* Footer */
footer{
  max-width: 1120px;
  margin: 0 auto;
  padding: 10px 16px 26px;
  color: var(--muted);
}
.footlinks{
  display:flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 10px;
}
.footlinks a{
  text-decoration:none;
  color: rgba(147,197,253,.95);
  font-weight: 900;
}
.footlinks a:hover{ text-decoration: underline; }


/* Ribbon label (used on comparatifs) */
.topRibbon{
  position:absolute;
  top:14px;
  left:14px;
  z-index:5;
  padding:6px 12px;
  border-radius:999px;
  font-weight:900;
  font-size:12px;
  color: #052e16;
  background: rgba(34,197,94,.22);
  border:1px solid rgba(34,197,94,.55);
  backdrop-filter: blur(2px);
}


/* --- Badge visibility fix (do not change layout) --- */
article.compareCard{ position: relative; }
.compareCard .cardMedia{ position: relative; }

.topRibbon{
  z-index: 30;                 /* stay above images */
  background: rgba(34,197,94,.88);
  border: 1px solid rgba(34,197,94,.95);
  box-shadow: 0 10px 24px rgba(0,0,0,.28);
  text-shadow: 0 1px 0 rgba(255,255,255,.25);
}

.badge{
  background: rgba(96,165,250,.26);
  border: 1px solid rgba(96,165,250,.45);
  box-shadow: 0 8px 18px rgba(0,0,0,.20);
}



/* ===== Mobile drawer navigation ===== */
.hamburger{
  display:none;
  width:42px;
  height:42px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.05);
  align-items:center;
  justify-content:center;
  gap:5px;
  padding:0;
  cursor:pointer;
}
.hamburger span{
  display:block;
  width:18px;
  height:2px;
  background: rgba(255,255,255,.82);
  border-radius:2px;
}

.drawerOverlay{
  position: fixed;
  inset:0;
  background: rgba(0,0,0,.45);
  opacity:0;
  pointer-events:none;
  transition: opacity .25s ease;
  z-index: 80;
}

.drawer{
  position: fixed;
  top:0;
  left:0;
  height:100vh;
  width: 86vw;
  max-width: 320px;
  background: rgba(7,13,24,.97);
  border-right: 1px solid rgba(255,255,255,.08);
  transform: translateX(-102%);
  transition: transform .25s ease;
  z-index: 90;
  padding: 16px;
  overflow:auto;
  backdrop-filter: blur(18px);
}

.drawer .drawerHead{
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom: 10px;
}
.drawer .drawerHead .logo{
  width:30px;height:30px;
}
.drawer .drawerHead strong{ font-size:16px; }
.drawer .drawerHead small{ opacity:.75; }

.drawer a{
  display:block;
  padding: 10px 10px;
  border-radius: 12px;
  text-decoration:none;
  color: rgba(255,255,255,.90);
  border: 1px solid rgba(255,255,255,0);
}
.drawer a:hover{
  background: rgba(255,255,255,.06);
  border-color: rgba(255,255,255,.08);
}
.drawer .drawerSection{
  margin: 14px 0 8px;
  font-size: 12px;
  letter-spacing: .06em;
  text-transform: uppercase;
  opacity: .65;
}

body.drawerOpen .drawerOverlay{
  opacity:1;
  pointer-events:auto;
}
body.drawerOpen .drawer{
  transform: translateX(0);
}

/* Show hamburger on mobile, hide top menu */
@media (max-width: 980px){
  .hamburger{ display:flex; }
  header .menu{ display:none; }
  header .nav{ gap: 10px; }
}
.media {
  margin: 25px 0;
}

.media img {
  width: 100%;
  max-width: 900px;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  border-radius: 16px;
  display: block;
  margin: auto;
}


/* Footer alias for guide pages */
.footer-links{
  display:flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 10px;
}
.footer-links a{
  text-decoration:none;
  color: rgba(147,197,253,.95);
  font-weight: 900;
}
.footer-links a:hover{ text-decoration: underline; }


/* Codes défaut hub */
.searchForm{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:12px;
}
.searchInput{
  flex:1 1 280px;
  min-width:220px;
  padding:13px 15px;
  border-radius:16px;
  border:1px solid rgba(148,163,184,.22);
  background: rgba(255,255,255,.05);
  color: var(--text);
  font: inherit;
}
.searchInput::placeholder{ color: rgba(255,255,255,.52); }
.searchInput:focus{
  outline:none;
  border-color: rgba(96,165,250,.55);
  box-shadow: 0 0 0 3px rgba(96,165,250,.12);
}
.searchCount,.helperText{
  color: rgba(255,255,255,.78);
  font-weight:700;
}
.filterRow{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:14px;
}
.filterChip{
  padding:8px 12px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.04);
  color: var(--text);
  font: inherit;
  font-weight:900;
  cursor:pointer;
}
.filterChip.isActive{
  background: rgba(96,165,250,.20);
  border-color: rgba(96,165,250,.42);
}
.topActionRow{
  display:flex;
  gap:14px;
  align-items:flex-start;
  justify-content:space-between;
  flex-wrap:wrap;
}
.codeGroup{ margin-top:20px; }
.codeGroup h2{ margin-bottom:6px; }
.codeList{
  display:grid;
  gap:14px;
  grid-template-columns:repeat(2, minmax(0,1fr));
  margin-top:12px;
}
@media (max-width: 980px){
  .codeList{ grid-template-columns:1fr; }
}
.codeCard{
  padding:16px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.03);
  box-shadow: var(--shadow);
}
.codeCard h3{ margin:10px 0 8px; }
.codeCard p{ margin:0; color: var(--muted); font-weight:650; }
.codeCardTop{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  align-items:center;
}
.codeCode{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:70px;
  padding:6px 10px;
  border-radius:999px;
  background: rgba(34,197,94,.16);
  border:1px solid rgba(34,197,94,.35);
  font-weight:950;
}
.metaPill{
  display:inline-flex;
  align-items:center;
  padding:5px 10px;
  border-radius:999px;
  background: rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.10);
  font-size:12px;
  font-weight:850;
}
.emptyState{
  margin-top:16px;
  padding:14px 16px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.04);
  color: var(--muted);
  font-weight:700;
}
.srOnly{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0, 0, 0, 0);
  white-space:nowrap;
  border:0;
}


/* Cookie consent banner */
body.cookieConsentLocked{
  overflow:hidden;
}
.cookieConsentBar{
  position:fixed;
  inset:0;
  z-index:10000;
  padding:20px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(2, 6, 23, .76);
  backdrop-filter: blur(6px);
}
.cookieConsentBar::before{
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(circle at top, rgba(59,130,246,.16), transparent 42%);
}
.cookieConsentPanel{
  position:relative;
  z-index:1;
  width:min(640px, calc(100vw - 32px));
  padding:26px;
  border-radius:24px;
  background:linear-gradient(180deg, rgba(10,18,32,.98), rgba(7,13,24,.98));
  border:1px solid rgba(255,255,255,.16);
  box-shadow:0 28px 90px rgba(0,0,0,.55);
  display:block;
}
.cookieConsentContent{
  max-width:62ch;
}
.cookieConsentEyebrow{
  margin:0 0 8px;
  color:rgba(147,197,253,.96);
  font-weight:950;
  text-transform:uppercase;
  font-size:12px;
  letter-spacing:.08em;
}
.cookieConsentPanel h2{
  margin:0 0 10px;
  font-size:clamp(24px, 3vw, 34px);
  line-height:1.12;
}
.cookieConsentPanel p{
  margin:0;
  color:var(--muted);
  font-weight:700;
  line-height:1.55;
}
.cookieConsentNote{
  margin-top:12px !important;
  font-size:14px;
}
.cookieConsentNote a{
  color:rgba(147,197,253,.96);
  font-weight:900;
}
.cookieConsentActions{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  margin-top:22px;
}
.cookieConsentActions .btn,
.cookieConsentActions .btnSecondary{
  margin-top:0;
  cursor:pointer;
  white-space:nowrap;
  flex:1 1 190px;
  justify-content:center;
}
@media (max-width:680px){
  .cookieConsentBar{
    padding:14px;
    align-items:flex-end;
  }
  .cookieConsentPanel{
    width:100%;
    padding:20px;
    border-radius:20px;
  }
  .cookieConsentActions{
    flex-direction:column;
  }
  .cookieConsentActions .btn,
  .cookieConsentActions .btnSecondary{
    width:100%;
  }
}

/* ===== Button consistency fix — 2026-04-25 ===== */
.btn,
.btnSecondary{
  min-height: 46px;
  border-radius: 18px;
  padding: 11px 16px;
  gap: 8px;
  white-space: normal;
  vertical-align: middle;
}

.btn{
  color: rgba(7, 13, 24, .98);
  background: linear-gradient(180deg, rgba(96,165,250,.98), rgba(59,130,246,.96));
  border-color: rgba(147,197,253,.42);
}

.btnSecondary{
  color: rgba(248,250,252,.96);
  background: linear-gradient(180deg, rgba(30,64,122,.82), rgba(15,38,78,.86));
  border-color: rgba(96,165,250,.48);
}

.prodBox .btn,
.prodBox .btnSecondary{
  min-width: 156px;
  margin-right: 10px;
  margin-bottom: 8px;
}

@media (max-width: 680px){
  .prodBox .btn,
  .prodBox .btnSecondary{
    width: 100%;
    margin-right: 0;
  }
}


/* ===== Chargeur product cards — 2026-04-25 ===== */
.prodActions{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-top:10px;}
.chargerCard{align-items:center;}
.chargerCard .prodImg{width:320px;min-width:320px;height:230px;padding:4px;object-fit:contain;object-position:center;background:linear-gradient(180deg, rgba(255,255,255,1), rgba(245,247,250,.96));}
@media (max-width:680px){.prodActions{width:100%;}.prodActions .btn,.prodActions .btnSecondary{flex:1 1 100%;}.chargerCard .prodImg{width:100%;min-width:auto;height:220px;}}

/* ===== Chargeur context image — 2026-04-25 ===== */
.prodBox .contextImg{
  width:320px;
  min-width:320px;
  height:205px;
  padding:4px;
  object-fit:cover;
  object-position:center;
  background:linear-gradient(180deg, rgba(255,255,255,1), rgba(245,247,250,.96));
}
@media (max-width:680px){
  .prodBox .contextImg{width:100%;min-width:auto;height:220px;}
}

/* ===== Product buttons unified — 2026-04-25 ===== */
.prodBox .btn,
.prodBox .btnSecondary,
.prodActions .btn,
.prodActions .btnSecondary{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:178px;
  min-height:52px;
  padding:12px 20px;
  border-radius:18px;
  font-weight:950;
  line-height:1.15;
  text-align:center;
  white-space:nowrap;
  box-sizing:border-box;
}

.prodBox a.btn[href^="/"],
.prodActions a.btn[href^="/"]{
  color:rgba(7,13,24,.98);
  background:linear-gradient(180deg, rgba(96,165,250,1), rgba(59,130,246,.98));
  border:1px solid rgba(147,197,253,.46);
  box-shadow:0 10px 20px rgba(0,0,0,.30);
}

.prodBox a.btnSecondary[href^="https://www.amazon"],
.prodActions a.btnSecondary[href^="https://www.amazon"]{
  color:rgba(248,250,252,.96);
  background:linear-gradient(180deg, rgba(30,64,122,.88), rgba(15,38,78,.92));
  border:1px solid rgba(96,165,250,.52);
  box-shadow:0 10px 20px rgba(0,0,0,.24);
}

@media (max-width:680px){
  .prodBox .btn,
  .prodBox .btnSecondary,
  .prodActions .btn,
  .prodActions .btnSecondary{
    width:100%;
    min-width:0;
    white-space:normal;
    margin-right:0;
  }
}


/* Amélioration page recherche codes défaut */
.codesHero .heroBadge{
  display:inline-flex;
  width:max-content;
  max-width:100%;
  margin:0 0 12px;
}
.codesHero .heroLead{
  max-width:980px;
}
.codesStatRow{
  margin-top:18px;
}
.familyHubPanel h2{
  margin-top:0;
}
.familyHubGrid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:14px;
  margin-top:18px;
}
.familyHubCard{
  display:flex;
  flex-direction:column;
  gap:8px;
  min-height:150px;
  padding:18px;
  border-radius:22px;
  border:1px solid rgba(96,165,250,.28);
  background:
    radial-gradient(520px 170px at 90% 0%, rgba(96,165,250,.16), transparent 55%),
    rgba(255,255,255,.045);
  color:var(--text);
  text-decoration:none;
  box-shadow:var(--shadow);
}
.familyHubCard:hover{
  transform:translateY(-1px);
  border-color:rgba(96,165,250,.50);
}
.familyHubCard strong{
  font-size:20px;
  line-height:1.25;
}
.familyHubCard span:not(.familyIcon){
  color:var(--muted);
  font-weight:750;
}
.familyHubCard em{
  margin-top:auto;
  color:#93c5fd;
  font-style:normal;
  font-weight:950;
}
.familyIcon{
  width:42px;
  height:42px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:14px;
  background:rgba(96,165,250,.16);
  border:1px solid rgba(96,165,250,.28);
}
.codeSearchPanel{
  background:
    radial-gradient(760px 260px at 100% 0%, rgba(96,165,250,.10), transparent 60%),
    rgba(15,23,42,.72);
}
.codeSearchPanel .sectionLead{
  max-width:980px;
}
.codeSearchPanel .searchForm{
  display:grid;
  grid-template-columns:minmax(260px,1fr) auto auto;
  align-items:center;
  gap:12px;
  padding:14px;
  border-radius:24px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(2,6,23,.35);
}
.codeSearchPanel .searchInput{
  min-height:56px;
  border-radius:18px;
}
.codeSearchPanel .searchForm .btn,
.codeSearchPanel .searchForm .btnSecondary{
  min-height:52px;
  margin-top:0;
  padding-left:24px;
  padding-right:24px;
}
.searchMetaRow{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
  margin:14px 0 4px;
}
.codeResultsGroup{
  padding:18px;
}
.codeResultsGroup h2{
  margin-top:0 !important;
}
.codeGrid,
.codeList{
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:14px;
  margin-top:16px;
}
.codeCard{
  position:relative;
  display:flex;
  flex-direction:column;
  min-height:188px;
  padding:18px;
  border-radius:22px;
  border:1px solid rgba(148,163,184,.18);
  background:
    radial-gradient(420px 160px at 100% 0%, rgba(96,165,250,.09), transparent 60%),
    rgba(15,23,42,.72);
}
.codeCard:hover{
  border-color:rgba(96,165,250,.36);
}
.codeCard h3{
  margin:12px 0 8px;
  line-height:1.25;
}
.codeCard h3 a{
  color:var(--text);
  text-decoration:none;
}
.codeCard h3 a:hover{
  color:#bfdbfe;
}
.codeCard p{
  margin:0;
  color:rgba(226,232,240,.78);
  font-weight:720;
  line-height:1.55;
}
.codeCardTop{
  gap:10px;
}
.codeCode{
  min-width:auto;
  padding:8px 14px;
  color:#ecfdf5;
}
.codeTag{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:7px 12px;
  border-radius:999px;
  background:rgba(96,165,250,.14);
  border:1px solid rgba(96,165,250,.28);
  color:#bfdbfe;
  font-size:13px;
  font-weight:950;
}
.miniLinks{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:auto;
  padding-top:14px;
}
.miniLinks a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:42px;
  padding:9px 16px;
  border-radius:15px;
  background:rgba(96,165,250,.95);
  border:1px solid rgba(96,165,250,.25);
  color:rgba(8,14,26,.95);
  font-weight:950;
  text-decoration:none;
  box-shadow:0 10px 20px rgba(0,0,0,.22);
}
.miniLinks a:hover{
  filter:brightness(1.06);
}
.chip,
.filterChip{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:38px;
  padding:8px 13px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.04);
  color:var(--text);
  font:inherit;
  font-weight:900;
  cursor:pointer;
}
.chip.isActive,
.chip.is-active,
.filterChip.isActive,
.filterChip.is-active{
  background:rgba(96,165,250,.20);
  border-color:rgba(96,165,250,.42);
}
@media (max-width:980px){
  .familyHubGrid,
  .codeGrid,
  .codeList{
    grid-template-columns:1fr;
  }
  .codeSearchPanel .searchForm{
    grid-template-columns:1fr;
  }
  .codeSearchPanel .searchForm .btn,
  .codeSearchPanel .searchForm .btnSecondary{
    width:100%;
  }
}
@media (max-width:560px){
  .codeResultsGroup,
  .codeCard,
  .familyHubCard{
    border-radius:18px;
  }
  .codesHero .statRow{
    grid-template-columns:1fr;
  }
}

/* Correctif recherche codes défaut : ouverture directe des codes + rendu compact */
.codeSearchPanel{
  border-radius:24px;
  overflow:hidden;
  border:1px solid rgba(148,163,184,.18);
}
.codeSearchPanel .searchForm{
  max-width:100%;
  box-sizing:border-box;
}
.codeCard .miniLinks a,
.codeCard a[href*="/guides/code-defaut-"]:not(.link){
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:42px;
  padding:0 18px;
  border-radius:14px;
  background:linear-gradient(180deg,#60a5fa,#3b82f6);
  color:#04111f !important;
  font-weight:950;
  text-decoration:none;
  border:1px solid rgba(147,197,253,.55);
  box-shadow:0 10px 22px rgba(37,99,235,.18);
}
.codeCard .miniLinks a:hover,
.codeCard a[href*="/guides/code-defaut-"]:not(.link):hover{
  transform:translateY(-1px);
  filter:brightness(1.04);
}
@media (max-width: 760px){
  .codeGrid,
  .codeList{
    grid-template-columns:1fr;
  }
  .codeSearchPanel .searchForm{
    grid-template-columns:1fr;
  }
}


/* ===== Modern header + cleaner home — 2026-05-02 ===== */
.siteHeader{
  background: rgba(4, 10, 22, .90);
  border-bottom: 1px solid rgba(148,163,184,.16);
  box-shadow: 0 10px 28px rgba(2,6,23,.22);
}
.modernNav{min-height:70px;}
.modernLogo .logo{width:42px;height:42px;border-radius:15px;}
.modernLogo .brandText small{color:rgba(203,213,225,.78);font-weight:800;}
.desktopMega{gap:6px;flex-wrap:nowrap;}
.navItem{position:relative;}
.navTrigger,.navSimple{
  display:inline-flex;align-items:center;gap:6px;text-decoration:none;color:var(--text);font-weight:950;font-size:14px;
  padding:10px 12px;border-radius:14px;border:1px solid transparent;background:rgba(255,255,255,.025);
}
.navTrigger::after{content:"▾";font-size:11px;opacity:.72;}
.navTrigger:hover,.navSimple:hover,.navItem:focus-within .navTrigger,.navItem:hover .navTrigger{
  background:rgba(96,165,250,.12);border-color:rgba(96,165,250,.28);
}
.megaMenu{
  position:absolute;top:calc(100% + 10px);left:0;width:310px;padding:10px;border-radius:20px;
  background:rgba(8,15,28,.98);border:1px solid rgba(148,163,184,.18);box-shadow:0 24px 56px rgba(2,6,23,.55);
  opacity:0;visibility:hidden;transform:translateY(8px);transition:.18s ease;z-index:200;backdrop-filter:blur(16px);
}
.navItem:hover .megaMenu,.navItem:focus-within .megaMenu{opacity:1;visibility:visible;transform:translateY(0);}
.megaMenu a{display:block;padding:12px;border-radius:14px;text-decoration:none;background:transparent;border:1px solid transparent;}
.megaMenu a:hover{background:rgba(96,165,250,.10);border-color:rgba(96,165,250,.20);}
.megaMenu strong{display:block;font-size:14px;line-height:1.2;color:rgba(248,250,252,.98);}
.megaMenu span{display:block;margin-top:4px;color:var(--muted);font-weight:700;font-size:12px;line-height:1.35;}
@media (max-width:980px){.desktopMega{display:none}.modernNav{justify-content:flex-start}.modernLogo{margin-left:2px}}

.homeContainer{max-width:1180px;padding-top:22px;}
.homeHeroNew{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(280px,.55fr);gap:22px;align-items:stretch;padding:28px;border-radius:28px;background:
  radial-gradient(900px 380px at 12% 0%, rgba(56,189,248,.18), transparent 55%),
  linear-gradient(180deg, rgba(8,15,28,.96), rgba(10,18,32,.82));}
.heroContentNew h1{font-size:clamp(34px,5vw,58px);line-height:.98;margin:14px 0 12px;letter-spacing:-.045em;max-width:820px;}
.heroContentNew .heroLead{font-size:18px;max-width:760px;}
.homeSearchNew{display:grid;grid-template-columns:minmax(260px,1fr) auto;gap:12px;margin-top:22px;padding:12px;border-radius:24px;background:rgba(2,6,23,.38);border:1px solid rgba(148,163,184,.16);}
.homeSearchNew .searchInput{min-height:56px;background:rgba(255,255,255,.07);}
.homeSearchNew .btn{margin-top:0;min-width:135px;}
.heroQuickLinks{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px;}
.heroQuickLinks a{padding:9px 12px;border-radius:999px;text-decoration:none;font-weight:900;color:rgba(219,234,254,.96);background:rgba(96,165,250,.12);border:1px solid rgba(96,165,250,.24);}
.heroPanelNew{padding:20px;border-radius:24px;background:rgba(255,255,255,.045);border:1px solid rgba(148,163,184,.16);box-shadow:var(--shadow);}
.heroPanelNew>strong{display:block;margin-bottom:12px;font-size:17px;}
.heroPanelNew a{display:block;padding:12px 0;text-decoration:none;border-top:1px solid rgba(148,163,184,.13);color:var(--text);font-weight:800;}
.heroPanelNew a:first-of-type{border-top:0;}
.heroPanelNew a:hover{color:#93c5fd;}
.heroPanelNew span{display:inline-flex;min-width:72px;margin-right:8px;color:#7dd3fc;font-weight:950;}
.homeBlockNew{margin-top:18px;padding:24px;border-radius:26px;background:linear-gradient(180deg, rgba(10,18,32,.84), rgba(10,18,32,.68));border:1px solid rgba(148,163,184,.16);box-shadow:var(--shadow);}
.eyebrowNew{display:inline-flex;margin-bottom:8px;color:#7dd3fc;font-weight:950;font-size:12px;text-transform:uppercase;letter-spacing:.08em;}
.homeBlockNew h2{margin:0 0 8px;font-size:clamp(24px,3vw,34px);line-height:1.1;letter-spacing:-.025em;}
.homeBlockNew p{color:var(--muted);font-weight:700;margin:0;}
.homeChoiceGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:18px;}
.homeChoiceCard{min-height:220px;padding:20px;border-radius:24px;text-decoration:none;color:var(--text);background:rgba(255,255,255,.04);border:1px solid rgba(148,163,184,.16);display:flex;flex-direction:column;transition:.2s ease;}
.homeChoiceCard:hover{transform:translateY(-3px);border-color:rgba(96,165,250,.42);background:rgba(96,165,250,.08);}
.choiceIcon{width:50px;height:50px;border-radius:18px;display:inline-flex;align-items:center;justify-content:center;font-weight:950;background:rgba(96,165,250,.16);border:1px solid rgba(96,165,250,.30);color:#bfdbfe;}
.homeChoiceCard h3{font-size:22px;margin:16px 0 8px;line-height:1.15;}
.homeChoiceCard p{margin:0;color:var(--muted);}
.homeChoiceCard em{margin-top:auto;font-style:normal;font-weight:950;color:#93c5fd;}
.pillLinkGrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:18px;}
.pillLinkGrid a,.equipmentRowNew a,.diagnosticGridNew a{border-radius:18px;text-decoration:none;border:1px solid rgba(148,163,184,.14);background:rgba(255,255,255,.035);transition:.18s ease;}
.pillLinkGrid a{padding:14px;}
.pillLinkGrid a:hover,.equipmentRowNew a:hover,.diagnosticGridNew a:hover{background:rgba(96,165,250,.09);border-color:rgba(96,165,250,.32);transform:translateY(-2px);}
.pillLinkGrid strong{display:block;color:#dbeafe;font-size:18px;}
.pillLinkGrid span{display:block;color:var(--muted);font-weight:750;font-size:13px;margin-top:2px;}
.diagnosticGridNew{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:18px;}
.diagnosticGridNew a{padding:16px;font-weight:950;color:rgba(248,250,252,.96);}
.equipmentRowNew{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:18px;}
.equipmentRowNew a{padding:18px;color:var(--text);}
.equipmentRowNew strong{display:block;font-size:20px;}
.equipmentRowNew span{display:block;margin-top:4px;color:var(--muted);font-weight:750;}
@media (max-width:980px){
  .homeHeroNew{grid-template-columns:1fr;padding:22px;}
  .homeSearchNew{grid-template-columns:1fr;}
  .homeChoiceGrid,.pillLinkGrid,.diagnosticGridNew,.equipmentRowNew{grid-template-columns:1fr;}
  .homeChoiceCard{min-height:auto;}
}

/* Cookie consent popup - options version */
.cookieConsentPanel.cookieConsentMain,
.cookieConsentPanel.cookieConsentOptions{
  width:min(620px, calc(100vw - 32px));
  padding:30px;
  border-radius:18px;
  background:#fff;
  color:#172033;
  border:1px solid rgba(15,23,42,.10);
  box-shadow:0 28px 90px rgba(0,0,0,.36);
}
.cookieConsentPanel.cookieConsentMain h2,
.cookieConsentPanel.cookieConsentOptions h2{
  color:#172033;
  font-size:clamp(22px, 2.7vw, 30px);
  text-align:center;
}
.cookieConsentPanel.cookieConsentMain p,
.cookieConsentPanel.cookieConsentOptions p{
  color:#5b6473;
}
.cookieConsentPanel .cookieConsentEyebrow{
  color:#6b7280;
  text-align:center;
  text-transform:none;
  letter-spacing:0;
  font-size:14px;
}
.cookieConsentList{
  display:grid;
  gap:14px;
  margin-top:22px;
}
.cookieConsentItem{
  display:flex;
  gap:14px;
  align-items:flex-start;
  color:#374151;
  font-weight:800;
}
.cookieConsentItem span{
  width:30px;
  height:30px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
  background:#dbeafe;
  color:#1d4ed8;
  font-weight:950;
}
.cookieConsentMore,
.cookieRejectLink{
  margin-top:18px;
  border:0;
  background:transparent;
  color:#4b5563;
  font-weight:900;
  cursor:pointer;
  text-decoration:underline;
  padding:0;
}
.cookieConsentExtra{
  margin-top:14px;
  padding-top:14px;
  border-top:1px solid #e5e7eb;
}
.cookieConsentPanel .cookieConsentActions{
  border-top:1px solid #e5e7eb;
  padding-top:20px;
  margin-top:24px;
}
.cookieConsentPanel .cookieConsentActions .btn{
  background:#2563eb;
  color:#fff;
  border-color:#2563eb;
  box-shadow:none;
}
.cookieConsentPanel .cookieConsentActions .btnSecondary{
  background:#2563eb;
  color:#fff;
  border-color:#2563eb;
  opacity:.95;
}
.cookieOptionRow{
  display:flex;
  justify-content:space-between;
  gap:18px;
  align-items:center;
  padding:16px 0;
  border-top:1px solid #e5e7eb;
}
.cookieOptionRow strong{
  display:block;
  color:#172033;
  margin-bottom:4px;
}
.cookieOptionRow p{
  font-size:14px;
  line-height:1.45;
}
.cookieOptionBadge{
  white-space:nowrap;
  border-radius:999px;
  padding:8px 12px;
  background:#eef2ff;
  color:#1d4ed8;
  font-weight:900;
  font-size:13px;
}
.cookieOptionToggle input{
  width:22px;
  height:22px;
  accent-color:#2563eb;
  flex:0 0 auto;
}