:root {
  --container: 1440px;
  --brand: #7B4FD6;
  --brand-dark: #7B4FD6;
  --brand-soft: #EFE5FA;
  --brand-mint: #C93B7E;
  --brand-mint-rgb: 201,59,126;
  --sage: #B7AACB;
  --acc-violet:       #7B4FD6;  --acc-violet-rgb: 123,79,214;
  --acc-rosso:        #C93B7E;  --acc-rosso-rgb: 201,59,126;
  --acc-green:        #2B7D4E;  --acc-green-rgb: 43,125,78;
  --acc-sand:         #9A6A2E;  --acc-sand-rgb: 154,106,46;
  --acc-slate:        #56607A;  --acc-slate-rgb: 86,96,122;
  --acc-aqua:         #0F7F86;  --acc-aqua-rgb: 15,127,134;
  --acc-copper:       #A8582A;  --acc-copper-rgb: 168,88,42;
  --acc-azure:        #3159C9;  --acc-azure-rgb: 49,89,201;
  --acc-ember:        #C8452C;  --acc-ember-rgb: 200,69,44;
  --acc-amber:        #A86400;  --acc-amber-rgb: 168,100,0;
  --acc-steel:        #5A6D84;  --acc-steel-rgb: 90,109,132;
  --acc-terracotta:   #B9502E;  --acc-terracotta-rgb: 185,80,46;
  --acc-sky:          #2B76AE;  --acc-sky-rgb: 43,118,174;
  --acc-blue:         #2862C4;  --acc-blue-rgb: 40,98,196;
  --acc-cyan:         #0E7A92;  --acc-cyan-rgb: 14,122,146;
  --acc-forest:       #2E7340;  --acc-forest-rgb: 46,115,64;
  --acc-volt:         #4A7F14;  --acc-volt-rgb: 74,127,20;
  --acc-graphite:     #4A4E5C;  --acc-graphite-rgb: 74,78,92;
  --acc-teal:         #11796B;  --acc-teal-rgb: 17,121,107;
  --acc: var(--brand);
  --acc-rgb: 123,79,214;
  --ink: #2A1F45;
  --text: #3F3558;
  --muted: #6A6084;
  --line: #EADFF2;
  --bg: #FFF9FB;
  --bg-alt: #F6EFFB;
  --surface: #FFFFFF;
  --surface-2: #F6EFFB;
  --surface-inverse: #2A1F45;
  --cat-ciel-a: #FFE1F0;
  --cat-ciel-b: #DDF0FF;
  --font: 'Nunito', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --font-display: 'Fredoka', 'Nunito', system-ui, sans-serif;
  --radius: 18px;
}
:root[data-theme="dark"] {
  --brand: #B597F5;
  --brand-dark: #B597F5;
  --brand-soft: #2E2347;
  --brand-mint: #F28CBC;
  --brand-mint-rgb: 242,140,188;
  --on-accent: #170F2A;
  --acc-violet:       #B597F5;  --acc-violet-rgb: 181,151,245;
  --acc-rosso:        #F28CBC;  --acc-rosso-rgb: 242,140,188;
  --acc-green:        #6FCF97;  --acc-green-rgb: 111,207,151;
  --acc-sand:         #D9A867;  --acc-sand-rgb: 217,168,103;
  --acc-slate:        #A3AEC8;  --acc-slate-rgb: 163,174,200;
  --acc-aqua:         #5CCFD6;  --acc-aqua-rgb: 92,207,214;
  --acc-copper:       #E59A6B;  --acc-copper-rgb: 229,154,107;
  --acc-azure:        #8FA9F5;  --acc-azure-rgb: 143,169,245;
  --acc-ember:        #F48C76;  --acc-ember-rgb: 244,140,118;
  --acc-amber:        #F2B24C;  --acc-amber-rgb: 242,178,76;
  --acc-steel:        #9FB1C8;  --acc-steel-rgb: 159,177,200;
  --acc-terracotta:   #EB9673;  --acc-terracotta-rgb: 235,150,115;
  --acc-sky:          #7DBDEB;  --acc-sky-rgb: 125,189,235;
  --acc-blue:         #86A9F0;  --acc-blue-rgb: 134,169,240;
  --acc-cyan:         #5BC5DB;  --acc-cyan-rgb: 91,197,219;
  --acc-forest:       #7CC48D;  --acc-forest-rgb: 124,196,141;
  --acc-volt:         #A3D468;  --acc-volt-rgb: 163,212,104;
  --acc-graphite:     #B4B8C6;  --acc-graphite-rgb: 180,184,198;
  --acc-teal:         #5CC9B6;  --acc-teal-rgb: 92,201,182;
  --acc-rgb: 181,151,245;
  --ink: #F7F2FF;
  --text: #DCD3EC;
  --muted: #A99FC0;
  --line: #372E4A;
  --bg: #16121F;
  --bg-alt: #1D1829;
  --surface: #231D31;
  --surface-2: #2B243B;
  --glass: rgba(22, 18, 31, .82);
  --glass-strong: rgba(22, 18, 31, .96);
  --surface-inverse: #0E0B15;
  --cat-ciel-a: #33204A;
  --cat-ciel-b: #142A40;
}
:root { --jaune: #FFD24A; --jaune-doux: #FFF3C4; --rose: #C93B7E; --encre-fixe: #2A1F45; }
:root[data-theme="dark"] { --jaune: #5A4614; --jaune-doux: #2A2414; --rose: #F28CBC; }
.eyebrow {
  display: inline-block; background: var(--jaune); color: var(--encre-fixe);
  font-family: var(--font-display); font-weight: 600; font-size: var(--fs-sm); letter-spacing: 0; text-transform: none;
  padding: 4px 12px; border-radius: 8px; transform: rotate(-2deg);
}
:root[data-theme="dark"] .eyebrow { color: #FFE9A8; }
.eyebrow::before { display: none; }
.page-titre { background: var(--jaune); border: 0; padding-block: clamp(1.4rem, 1rem + 2vw, 2.6rem); }
.page-titre .eyebrow { background: var(--surface); color: var(--brand); }
.page-titre__h { color: var(--encre-fixe); font-size: var(--fs-2xl); }
:root[data-theme="dark"] .page-titre__h { color: #FFE9A8; }
.heromag, .product-hero, .kb-hero { background: var(--jaune-doux); }
.kb-hero { background: var(--jaune); border-bottom: 0; }
.kb-hero .article-lead { color: var(--encre-fixe); }
:root[data-theme="dark"] .kb-hero .article-lead { color: #FFE9A8; }
.kb-hero .eyebrow { background: var(--surface); color: var(--brand); }
.kb-hero__grid, .kb-hero--pick .kb-hero__grid { max-width: none; }
@media (min-width: 1180px) {
  .kb-hero--pick .kb-hero__grid { grid-template-columns: minmax(0, 1fr); }
  .kb-hero--pick .choix-sujet { display: none; }
  .kb-hero__text { max-width: 60rem; }
}
@media (min-width: 1180px) { .avec-panneau > .article-body { margin-left: 0; } }
@media (max-width: 1500px) { .nav { gap: 2px 10px; } .nav__link { font-size: .93rem; } }
.listicle-hero { background: var(--jaune-doux); border: 2px solid var(--jaune); }
.section--alt { background: var(--jaune-doux); }
.pcard, .mag-card, .hub-card, .tool-card { border: 2px solid var(--line); border-radius: 22px; }
.pcard:hover, .mag-card:hover, .hub-card:hover, .tool-card:hover { border-color: var(--brand); }
.pcard__badge { background: var(--rose); color: #fff; font-family: var(--font-display); font-weight: 600; letter-spacing: 0; text-transform: none; border-radius: 8px; transform: rotate(-2deg); }
:root[data-theme="dark"] .pcard__badge { color: #1B1230; }
.btn { border-radius: 14px; }
.nav__link { font-family: var(--font-display); font-weight: 500; font-size: .98rem; color: var(--ink); }
.header__inner { max-width: var(--container); }
@media (max-width: 600px) { .header__inner { gap: 8px; } .hd-cta { font-size: .8rem; padding: 8px 10px; } .search-btn, .menu-btn { width: 36px; height: 36px; } }
@media (max-width: 370px) { .logo { font-size: 1.05rem; } .logo__mark { display: none; } .hd-cta { padding: 7px 8px; } }
.btn { font-family: var(--font-display); font-weight: 600; letter-spacing: 0; }
.btn--amazon { font-family: var(--font); font-weight: 800; }
h1, h2, h3 { font-weight: 600; }
.mag-card__photo { display: block; aspect-ratio: 4 / 3; background: #fff; border-radius: 14px; overflow: hidden; margin-bottom: 12px; }
.mag-card__photo img { width: 100%; height: 100%; object-fit: contain; display: block; }
.mag-card__kicker { font-family: var(--font-display); font-weight: 600; font-size: var(--fs-sm); letter-spacing: 0; text-transform: none; color: var(--rose); }
.filter-wrap { display: block; }
.filter-wrap .filter-search { width: 100%; border: 2px solid var(--line); border-radius: 14px; }
.idees-rangee { margin-top: 18px; }
.idees-rangee__titre { display: block; font-family: var(--font-display); font-weight: 600; font-size: var(--fs-md); color: var(--ink); margin-bottom: 8px; }
.idees-rangee__choix { display: flex; flex-wrap: wrap; gap: 8px; }
.idees-choix {
  appearance: none; cursor: pointer; font: 700 var(--fs-sm) var(--font); color: var(--ink);
  padding: 8px 14px; border-radius: 12px; background: var(--surface); border: 2px solid var(--line);
}
.idees-choix:hover { border-color: var(--brand); }
.idees-choix:focus-visible { outline: 3px solid var(--brand); outline-offset: 2px; }
.idees-choix[aria-pressed="true"] { background: var(--brand); border-color: var(--brand); color: #fff; }
:root[data-theme="dark"] .idees-choix[aria-pressed="true"] { color: #1B1230; }
.idees-compte { font-family: var(--font-display); font-weight: 600; font-size: var(--fs-lg); color: var(--ink); margin: 22px 0 0; }
.filter-wrap .filter-bar { display: none; }
.filter-wrap:not(.idees-pret) { min-height: var(--idees-h, 447px); }
.filter-wrap:not(.idees-pret) .filter-search { visibility: hidden; }
@media (min-width: 1024px) and (max-width: 1279px) { .filter-wrap { --idees-h: 536px; } }
@media (max-width: 1023px) {
  .filter-wrap { --idees-h: 295px; }
  .idees-rangee__choix { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; padding-bottom: 4px; margin-right: -22px; padding-right: 22px; }
  .idees-rangee__choix::-webkit-scrollbar { display: none; }
  .idees-choix { flex: none; }
}
.pcard[hidden] { display: none; }
@media (prefers-reduced-motion: reduce) { .eyebrow, .pcard__badge { transform: none; } }
