/* =====================================================================
   KIT AFFILIATION MAISON — styles (repris du kit Romain + comparateur)
   ===================================================================== */
/* Polices = stack système (0 requête externe, rapide + RGPD-friendly, pas de Google Fonts) */

/* ---------- Bouton CTA sticky (kit Romain) ---------- */
html .sticky-button{position:fixed;left:0;right:0;bottom:10px;z-index:9999;width:auto;margin-left:auto;margin-right:auto;white-space:nowrap;background-color:#c97b4a;color:#fff;padding:15px 30px;font-size:15px;border:none;border-radius:5px;text-align:center;box-shadow:0 2px 5px rgba(0,0,0,.2);text-decoration:none;font-weight:bold}
html .sticky-button:hover{background-color:#000;color:#fff;cursor:pointer}

body:not(.home) h1{margin-top:50px}

/* ---------- Boîtes produit .azonpress (kit Romain) ---------- */
.azonpress{box-sizing:border-box;font-family:var(--kaf-font);width:100%;max-width:800px;margin:0 auto;padding:20px;background:#fff;border-radius:10px;box-shadow:0 4px 12px rgba(0,0,0,.1);display:flex;flex-direction:column;align-items:stretch;cursor:pointer;transition:box-shadow .3s ease}
.azonpress:hover{box-shadow:0 12px 30px rgba(0,0,0,.25);transform:scale(1.02);transition:box-shadow .3s ease,transform .3s ease}
.azonpress-image img{max-width:100%;width:32%;height:auto;display:block;margin:0 auto 20px;border-radius:8px}
.azonpress-title{font-size:24px;font-weight:600;text-align:center;margin-bottom:20px}
.azonpress-arguments{display:flex;flex-wrap:wrap;justify-content:space-between;width:100%;margin-bottom:20px;gap:10px}
.azonpress-pros,.azonpress-cons{flex:1 1 calc(50% - 10px);background:#f0fff4;padding:15px;border-radius:8px;box-sizing:border-box}
.azonpress-cons{background:#fff5f5}
.azonpress-pros h4,.azonpress-cons h4{font-size:18px;font-weight:600;margin-bottom:10px}
.azonpress-pros h4{color:#28a745}.azonpress-cons h4{color:#dc3545}
.azonpress-pros ul,.azonpress-cons ul{list-style:none;padding-left:0;margin:0}
.azonpress-pros ul li,.azonpress-cons ul li{position:relative;padding-left:25px;font-size:16px;line-height:1.6;margin-bottom:8px}
.azonpress-pros ul li::before,.azonpress-cons ul li::before{position:absolute;left:0;top:0;font-weight:bold}
.azonpress-pros ul li::before{content:"+";color:#28a745}.azonpress-cons ul li::before{content:"-";color:#dc3545}
.azonpress-footer{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;width:100%;margin-top:10px;padding-top:10px;border-top:1px solid #e0e0e0}
.azonpress-button{background:#c97b4a;color:#fff;padding:12px 30px;font-size:15px;border-radius:5px;text-align:center;text-decoration:none;display:inline-block;transition:background-color .3s ease}
.azonpress-button:hover{background:#000}
@media(max-width:768px){.azonpress{padding:15px}.azonpress-title{font-size:18px}.azonpress-arguments{flex-direction:column}.azonpress-pros,.azonpress-cons{flex:1 1 100%}.azonpress-image img{width:60%}.azonpress-button{padding:8px 15px;font-size:13px;margin-left:auto}}

/* ---------- Bulles de maillage .qc-bubbles (kit Romain) ---------- */
.qc-collections{margin:24px 0}
.qc-bubbles{--size:148px;--ring:3px;--gap:18px;display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:var(--gap)}
.qc-bubble{text-decoration:none;text-align:center;display:flex;flex-direction:column;align-items:center;gap:10px;color:inherit}
.qc-thumb{width:var(--size);height:var(--size);border-radius:999px;overflow:hidden;display:grid;place-items:center;position:relative;background:#f4f4f4;box-shadow:0 0 0 var(--ring) rgba(0,0,0,.06),0 8px 20px rgba(0,0,0,.08);transition:transform .18s ease,box-shadow .18s ease}
.qc-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.qc-label{font-size:.98rem;font-weight:700;letter-spacing:.2px}
.qc-bubble:hover .qc-thumb{transform:translateY(-2px);box-shadow:0 0 0 var(--ring) rgba(0,0,0,.10),0 14px 28px rgba(0,0,0,.14)}
@media(max-width:860px){.qc-bubbles{display:flex;gap:14px;overflow-x:auto;padding:4px 2px 8px;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}.qc-bubble{min-width:120px;scroll-snap-align:start}.qc-thumb{--size:116px}}

/* ---------- Onglets / accordéon .qc-tabs (kit Romain) ---------- */
.qc-tabs{max-width:1400px;margin:40px auto;padding:24px 40px;background:#fafcfb;border-radius:22px;box-shadow:0 10px 28px rgba(15,50,48,.06)}
.qc-tabs__tablist{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.qc-tab{display:block;padding:14px 18px;border:1px solid #e3ece9;border-radius:14px;background:#fff;font-weight:800;cursor:pointer;transition:transform .15s ease,box-shadow .15s ease;text-align:left}
.qc-tab:hover{transform:translateY(-2px);box-shadow:0 18px 40px rgba(15,50,48,.12)}
.qc-tab.is-active,.qc-tab[aria-selected="true"]{background:#fff;border-color:#ceddda}
.qc-tabpanel__content{padding:22px 26px 26px;font-size:17px;line-height:1.7;color:#395c59}
.qc-acc__btn{display:none}
@media(max-width:980px){.qc-tabs{padding:14px}.qc-tabs__tablist-wrap{display:none}.qc-acc__btn{display:grid;grid-template-columns:1fr 18px;gap:12px;width:100%;padding:14px;border:1px solid #e3ece9;border-radius:12px;background:#fff;font-weight:800;cursor:pointer;margin-top:10px}.qc-panel-wrap.is-open .qc-acc__chev{transform:rotate(180deg)}}

/* ---------- Wrapper grille (kit Romain) ---------- */
.wpgb-wrapper{box-sizing:border-box;width:100%;max-width:1400px;margin:0 auto;padding:0 50px}
@media(max-width:980px){.wpgb-wrapper{padding:0 20px}}
@media(max-width:768px){.wpgb-wrapper{padding:0}}

/* ---------- Beau tableau comparatif (.kaf-table) ---------- */
.kaf-table{margin:28px auto;max-width:1000px;overflow-x:auto;border-radius:14px;box-shadow:0 6px 24px rgba(0,0,0,.08)}
.kaf-table table{width:100%;border-collapse:collapse;font-family:var(--kaf-font);background:#fff;overflow:hidden;border-radius:14px}
.kaf-table thead th{background:#c97b4a;color:#fff;font-weight:600;text-align:left;padding:14px 16px;font-size:15px;border:none}
.kaf-table tbody td{padding:13px 16px;border-top:1px solid #eef1f0;font-size:14.5px;color:#33413f;vertical-align:top}
.kaf-table tbody tr:nth-child(even){background:#f7faf9}
.kaf-table tbody tr:hover{background:#eef7f2}
.kaf-table tbody td:first-child{font-weight:600;color:#1f2a29}
@media(max-width:600px){.kaf-table thead th,.kaf-table tbody td{padding:10px 12px;font-size:13px}}

/* =====================================================================
   COMPARATEUR MAISON (.kaf-*) — remplace WP Grid Builder
   ===================================================================== */
.kaf{font-family:var(--kaf-font);margin:12px auto 26px;max-width:1180px}
.kaf-toolbar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-bottom:18px}
.kaf-search,.kaf-sort{padding:10px 14px;border:1.5px solid #b9c2bc;border-radius:8px;font-size:14px;background:#fff;box-sizing:border-box;max-width:100%}
.kaf-search:focus,.kaf-sort:focus{outline:none;border-color:var(--kaf-terra);box-shadow:0 0 0 3px rgba(201,123,74,.15)}
.kaf-search{flex:1 1 220px}
.kaf-reset{padding:10px 16px;border:1.5px solid #b9c2bc;border-radius:8px;background:#fff;cursor:pointer;font-weight:600}
.kaf-reset:hover{background:#f4f4f4;border-color:#8a978f}
.kaf-count{margin-left:auto;font-size:14px;color:#666}
/* Comparateur : filtres en SIDEBAR à gauche, visibles sur PC (préférence utilisateur).
   align-items:start → les cartes ne sont pas étirées à la hauteur de la colonne filtres. */
.kaf-layout{display:grid;grid-template-columns:230px 1fr;gap:26px;align-items:start}
.kaf-facets{display:flex;flex-direction:column;gap:18px}
.kaf-facet__title{font-size:15px;font-weight:700;margin:0 0 8px}
.kaf-options{display:flex;flex-wrap:wrap;gap:8px}
.kaf-opt{display:inline-flex;align-items:center;gap:6px;padding:7px 13px;border:1.5px solid #b9c2bc;border-radius:999px;cursor:pointer;font-size:13px;font-weight:600;color:var(--kaf-ink);background:#fff;user-select:none;transition:border-color .15s ease,background .15s ease,box-shadow .15s ease}
.kaf-opt:hover{border-color:var(--kaf-terra);box-shadow:0 2px 8px rgba(201,123,74,.15)}
.kaf-opt input{display:none}
.kaf-opt:has(input:checked){background:var(--kaf-terra);color:#fff;border-color:var(--kaf-terra-d);box-shadow:0 4px 12px rgba(201,123,74,.30)}
.kaf-range{display:flex;align-items:center;gap:8px}
.kaf-range input{width:80px;padding:8px;border:1.5px solid #b9c2bc;border-radius:8px}
.kaf-range input:focus{outline:none;border-color:var(--kaf-terra);box-shadow:0 0 0 3px rgba(201,123,74,.15)}
/* Grille auto-fit : peu de cartes → elles remplissent la largeur (pas de vide) ;
   beaucoup de cartes → 3-4 colonnes régulières. Les colonnes vides se replient. */
.kaf-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:18px;align-items:stretch}
.kaf-card{background:#fff;border-radius:14px;border:1px solid #efe9e4;box-shadow:0 1px 2px rgba(0,0,0,.04),0 8px 22px rgba(20,30,25,.06);text-decoration:none;color:inherit;overflow:hidden;transition:box-shadow .3s ease,transform .3s ease,border-color .3s ease;display:flex;flex-direction:column}
.kaf-card:hover{box-shadow:0 16px 38px rgba(20,30,25,.14);transform:translateY(-4px);border-color:#e6d8cd}
.kaf-card__media{position:relative;display:block;overflow:hidden}
.kaf-card__media img{width:100%;height:auto;display:block;transition:transform .45s ease}
.kaf-card:hover .kaf-card__media img{transform:scale(1.06)}
.kaf-card__hover{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) translateY(6px);background:rgba(20,20,20,.55);backdrop-filter:blur(2px);color:#fff;text-transform:uppercase;font-weight:700;font-size:12px;padding:8px 16px;border-radius:999px;opacity:0;transition:opacity .25s ease,transform .25s ease;white-space:nowrap}
.kaf-card:hover .kaf-card__hover{opacity:1;transform:translate(-50%,-50%) translateY(0)}
.kaf-card__name{padding:12px 14px 2px;font-weight:600;font-size:16px;text-align:center;min-height:2.6em}
.kaf-card__price{padding:0 14px 12px;text-align:center;font-family:Georgia,serif;font-weight:700;font-size:18px;color:var(--kaf-terra-d)}
/* CTA carte : affordance claire et efficace, posée au bas de la carte (pas bling-bling). */
.kaf-card__cta{margin:auto 12px 14px;padding:11px 14px;border-radius:10px;background:var(--kaf-terra);
  color:#fff;font-weight:700;font-size:14.5px;text-align:center;letter-spacing:.01em;
  box-shadow:0 4px 12px rgba(201,123,74,.28);transition:background .2s ease,transform .15s ease}
.kaf-card:hover .kaf-card__cta{background:var(--kaf-terra-d)}
.kaf-card__cta span{transition:transform .2s ease;display:inline-block}
.kaf-card:hover .kaf-card__cta span{transform:translateX(3px)}
.kaf-card.is-hidden{display:none}
.kaf-empty{text-align:center;color:#666;padding:30px}
.kaf-more-wrap{text-align:center;margin-top:18px}
.kaf-more{padding:12px 30px;border:none;border-radius:5px;background:var(--kaf-terra);color:#fff;font-weight:700;cursor:pointer}
.kaf-more:hover{background:var(--kaf-terra-d)}
.kaf-more.is-hidden{display:none}
@media(max-width:980px){
  .kaf-layout{grid-template-columns:1fr}
  /* Pas de survol au doigt → l'étiquette "Lire notre test" reste visible et lisible. */
  .kaf-card__hover{opacity:1;background:rgba(20,20,20,.66);transform:translate(-50%,-50%)}
}
/* Sur petits écrans : 2 colonnes confortables, puis 1 colonne sous 430px (géré par l'auto-fit). */
@media(max-width:600px){.kaf-grid{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px}}

/* ---- Fiche : encart CTA affilié + tableau specs ---- */
.kaf-cta{display:flex;flex-wrap:wrap;align-items:center;gap:12px 18px;justify-content:space-between;border:1px solid #e6e6e6;border-left:5px solid #c97b4a;border-radius:10px;padding:16px 18px;margin:22px 0;background:#fafafa}
.kaf-cta__info{display:flex;flex-direction:column;line-height:1.2}
.kaf-cta__price{font-family:Georgia,serif;font-weight:700;font-size:26px;color:#c97b4a}
.kaf-cta__merchant{font-size:13px;color:#666}
.kaf-cta__btn{display:inline-block;background:#c97b4a;color:#fff;font-weight:700;text-decoration:none;padding:13px 26px;border-radius:8px;transition:background .25s ease}
.kaf-cta__btn:hover{background:#000;color:#fff}
.kaf-cta__maj{flex-basis:100%;font-size:12px;color:#999}
.kaf-specs table{width:100%}
.kaf-specs th{width:40%;text-align:left;background:#f4faf6}

/* =====================================================================
   DESIGN SITE (réseau Quel-X) — hero, boutons, sections, footer
   Palette : vert #c97b4a (accent) · encre #1f2a24 · fond doux #f7f9f8
   ===================================================================== */
:root{--kaf-green:#c97b4a;--kaf-green-d:#a85f33;--kaf-ink:#1f2a24;--kaf-soft:#f7f9f8;--kaf-line:#e6ece8;
  /* 2e couleur d'accent = bois/terracotta chaud (niche « table à manger ») */
  --kaf-terra:#c97b4a;--kaf-terra-d:#a85f33;--kaf-terra-soft:#fdf2ea;
  --kaf-font:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,"Apple Color Emoji","Segoe UI Emoji",sans-serif}

/* Boutons réutilisables */
.kaf-btn{display:inline-block;background:var(--kaf-green);color:#fff !important;font-weight:700;text-decoration:none;padding:14px 30px;border-radius:10px;transition:background .25s ease,transform .2s ease;box-shadow:0 6px 18px rgba(201,123,74,.25)}
.kaf-btn:hover{background:#000;transform:translateY(-1px)}
.kaf-btn--ghost{background:transparent;color:var(--kaf-green) !important;border:2px solid var(--kaf-green);box-shadow:none}
.kaf-btn--ghost:hover{background:var(--kaf-green);color:#fff !important}

/* Hero d'accueil */
.kaf-hero{margin:0 0 36px;padding:44px 24px;border-radius:18px;text-align:center;
  background:linear-gradient(135deg,#fdf1e7 0%,#fbf6f0 55%,#fbf7ef 100%);border:1px solid var(--kaf-line)}
.kaf-hero__inner{max-width:760px;margin:0 auto}
.kaf-hero__title{font-size:clamp(28px,5vw,46px);line-height:1.12;margin:0 0 14px;color:var(--kaf-ink)}
.kaf-hero__sub{font-size:clamp(16px,2.2vw,20px);color:#48564f;margin:0 0 26px}
.kaf-hero__cta{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin:0}
/* Bande de réassurance (signal « pro/confiance », façon grands comparateurs) */
.kaf-hero__trust{list-style:none;display:flex;flex-wrap:wrap;justify-content:center;gap:10px 12px;margin:24px 0 0;padding:0}
.kaf-hero__trust li{display:inline-flex;align-items:center;gap:7px;font-size:13.5px;font-weight:700;color:var(--kaf-ink);
  background:rgba(255,255,255,.94);border:1px solid rgba(255,255,255,.6);border-radius:999px;padding:7px 14px;
  box-shadow:0 4px 14px rgba(20,50,38,.14)}
.kaf-hero__trust li::before{content:"✓";font-weight:900;color:var(--kaf-terra-d);font-size:12px}
@media(max-width:600px){.kaf-hero__trust{gap:8px}.kaf-hero__trust li{font-size:12px;padding:6px 11px}}

/* Liste de guides */
.kaf-guides{list-style:none;padding:0;margin:18px 0;display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.kaf-guides li{margin:0}
.kaf-guides a{display:block;padding:16px 18px;background:#fff;border:1px solid var(--kaf-line);border-left:4px solid var(--kaf-green);border-radius:10px;text-decoration:none;color:var(--kaf-ink);font-weight:600;transition:box-shadow .2s ease,transform .2s ease}
.kaf-guides a:hover{box-shadow:0 8px 22px rgba(0,0,0,.07);transform:translateY(-1px)}
@media(max-width:680px){.kaf-guides{grid-template-columns:1fr}}

/* Footer maison */
.kaf-footer{background:var(--kaf-ink);color:#cfd8d2;margin-top:50px;padding:48px 24px 0}
.kaf-footer a{color:#cfd8d2;text-decoration:none}
.kaf-footer a:hover{color:#fff;text-decoration:underline}
.kaf-footer__cols{max-width:1100px;margin:0 auto;display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:30px}
.kaf-footer h3{color:#fff;font-size:15px;letter-spacing:.04em;text-transform:uppercase;margin:0 0 14px}
.kaf-footer ul{list-style:none;padding:0;margin:0;line-height:2}
.kaf-footer__brand p{color:#9fb0a7;margin:8px 0 0;font-size:14px;line-height:1.6}
.kaf-footer__bar{max-width:1100px;margin:34px auto 0;padding:18px 0;border-top:1px solid #34433b;font-size:13px;color:#9fb0a7;display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap}
@media(max-width:780px){.kaf-footer__cols{grid-template-columns:1fr 1fr}.kaf-footer__brand{grid-column:1/-1}}
@media(max-width:480px){.kaf-footer__cols{grid-template-columns:1fr}}

/* Rythme général du contenu */
.wp-block-post-content h2{margin-top:1.6em}
.kaf-table{margin:22px 0}

/* Pas d'affichage de date sur les articles/fiches (évite l'effet « daté »). */
.wp-block-post-date,.wp-block-post-date time{display:none !important}

/* =====================================================================
   RAFFINEMENT DESIGN — police système, header collant, menu, bulles, typo
   ===================================================================== */
body{font-family:var(--kaf-font)}

/* Header collant et épuré (le footer est <footer>, non affecté) */
.wp-site-blocks header.wp-block-template-part{position:sticky;top:0;z-index:1000;background:#fff;box-shadow:0 1px 0 rgba(0,0,0,.05),0 6px 18px rgba(0,0,0,.04)}
.wp-block-site-title a{color:var(--kaf-ink);font-weight:800;text-decoration:none;letter-spacing:-.01em}
.wp-block-navigation a{color:var(--kaf-ink);font-weight:600}
.wp-block-navigation a:hover{color:var(--kaf-green)}
.wp-block-navigation .wp-block-navigation__submenu-container{border:1px solid var(--kaf-line);box-shadow:0 14px 32px rgba(0,0,0,.12);border-radius:12px;padding:6px}
.wp-block-navigation .wp-block-navigation__submenu-container a{border-radius:8px;padding:8px 12px}
.wp-block-navigation .wp-block-navigation__submenu-container a:hover{background:var(--kaf-soft);color:var(--kaf-green)}

/* Bulles : pastille dégradée verte quand pas d'image */
.qc-thumb{background:linear-gradient(135deg,#fbeede,#f3ddc8)}
.qc-thumb::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 32% 24%,rgba(255,255,255,.65),transparent 62%);pointer-events:none}
.qc-thumb img{position:relative;z-index:1}
.qc-label{color:var(--kaf-ink)}

/* Typographie & lisibilité */
h1,h2,h3{color:var(--kaf-ink)}
.wp-block-post-content{font-size:17px;line-height:1.72}
.wp-block-post-content a:not([class*="kaf-"]):not([class*="btn"]):not(.azonpress-button){text-underline-offset:2px}
.wp-block-post-content h2{font-size:clamp(22px,3vw,30px)}
.wp-block-post-content h3{font-size:clamp(18px,2.2vw,22px)}
.home .wp-block-post-content>h2{margin-top:2.1em}

/* Petits écrans : header non collant pour libérer de la hauteur */
@media(max-width:600px){.wp-site-blocks header.wp-block-template-part{position:static;box-shadow:none}}

/* =====================================================================
   AMBIANCE — réchauffer le site (corrige l'effet « tout blanc »)
   Idée : un fond de page légèrement teinté (canvas) + des composants
   blancs qui ressortent dessus + des accents verts/crème + du rythme.
   ===================================================================== */
:root{--kaf-canvas:#f7f3ee;--kaf-cream:#fbf6ef;--kaf-green-soft:#fbf1e8;--kaf-green-line:#f0d9c6}

/* 1) Le fond de page n'est plus blanc mais une teinte vert-doux très claire.
      Header (blanc collant) et footer (encre) restent inchangés. */
body{background:var(--kaf-canvas)}

/* 2) Le corps de l'article est posé sur une « feuille » blanche arrondie
      → contraste net avec le canvas, lecture plus premium.
      Les blocs pleine largeur (hero, comparateur) gardent leur propre style. */
.wp-block-post-content{background:#fff;border:1px solid var(--kaf-line);border-radius:20px;padding:30px clamp(18px,3vw,44px);box-shadow:0 10px 34px rgba(20,50,38,.06)}
.home .wp-block-post-content{background:transparent;border:none;box-shadow:none;padding:0}

/* 3) Titres de section : accent vert sous le H2 (rythme visuel). */
.wp-block-post-content h2{position:relative;padding-bottom:12px}
.wp-block-post-content h2::after{content:"";position:absolute;left:0;bottom:0;width:60px;height:4px;border-radius:4px;background:linear-gradient(90deg,var(--kaf-green),#7fc6a1)}

/* 4) Premier paragraphe = chapô plus grand et plus foncé. */
.wp-block-post-content>p:first-of-type{font-size:1.1em;color:#2b3a33}

/* 5) Image à la une : arrondie + ombre douce (au lieu d'un rectangle brut). */
.wp-block-post-featured-image img,.wp-post-image{border-radius:16px;box-shadow:0 14px 34px rgba(20,50,38,.12)}

/* 6) Les bulles de collections posées sur une bande crème encadrée. */
.qc-collections{background:linear-gradient(180deg,var(--kaf-green-soft),#fff);border:1px solid var(--kaf-green-line);border-radius:22px;padding:28px 24px;margin:30px 0}

/* 7) Citations / encadrés : barre verte + fond crème (au lieu de blanc nu). */
.wp-block-post-content blockquote{background:var(--kaf-cream);border-left:5px solid var(--kaf-green);border-radius:0 12px 12px 0;padding:16px 20px;margin:24px 0;font-style:normal;color:#3a4a42}

/* 8) Listes : puces vertes pour casser le noir/blanc. */
.wp-block-post-content ul li::marker{color:var(--kaf-green)}

/* 9) Hero d'accueil enrichi : un soupçon de motif lumineux. */
.kaf-hero{position:relative;overflow:hidden}
.kaf-hero::before{content:"";position:absolute;right:-60px;top:-60px;width:240px;height:240px;border-radius:50%;background:radial-gradient(circle,rgba(201,123,74,.14),transparent 68%);pointer-events:none}

/* 10) Cartes comparateur : léger fond crème + bord pour exister sur le canvas. */
.kaf-card{border:1px solid var(--kaf-line)}
.kaf-grid{background:transparent}

/* =====================================================================
   2e ACCENT TERRACOTTA + ENCADRÉS ÉDITORIAUX (pages money)
   Le vert reste la couleur principale ; le terracotta réchauffe et
   signale les zones « bon plan / conversion » propres à la niche.
   ===================================================================== */

/* Touche terracotta sur l'accent de titre (dégradé vert → terracotta). */
.wp-block-post-content h2::after{background:linear-gradient(90deg,var(--kaf-green),var(--kaf-terra))}

/* Survol des liens de TEXTE uniquement (paragraphes/listes), jamais les boutons. */
.wp-block-post-content :is(p,li,td) a:not([class*="kaf-"]):not([class*="btn"]):not(.azonpress-button):hover{color:var(--kaf-terra-d)}

/* ---- Encadré commun ---- */
.kaf-callout{margin:26px 0;padding:18px 20px 6px;border-radius:14px;border:1px solid;border-left-width:6px;
  box-shadow:0 8px 24px rgba(20,50,38,.06)}
.kaf-callout__head{display:flex;align-items:center;gap:10px;margin:0 0 4px;font-size:18px;font-weight:800;letter-spacing:-.01em}
.kaf-callout__ico{font-size:20px;line-height:1}
.kaf-callout__body{font-size:16.5px;line-height:1.7}
.kaf-callout__body p{margin:.5em 0}
.kaf-callout__body :last-child{margin-bottom:.6em}

/* « Notre avis » = vert (verdict éditorial, confiance). */
.kaf-callout--avis{background:#f6f3ee;border-color:#e6ddd0;border-left-color:var(--kaf-ink)}
.kaf-callout--avis .kaf-callout__head{color:var(--kaf-ink)}

/* « Le bon plan » = terracotta (astuce, économie, action). */
.kaf-callout--plan{background:var(--kaf-terra-soft);border-color:#f0cdb4;border-left-color:var(--kaf-terra)}
.kaf-callout--plan .kaf-callout__head{color:var(--kaf-terra-d)}

/* =====================================================================
   SEO/CONTENU façon grands comparateurs : palmarès, sommaire, scores
   ===================================================================== */

/* ---- Verdict box / palmarès (top 3 badgés) ---- */
.kaf-palmares{margin:8px 0 12px}
.wp-block-post-content .kaf-palmares__title{margin-top:.2em}
.kaf-palmares__title{margin:0 0 16px}
.kaf-palmares__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:16px}
.kaf-palmares__card{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;background:#fff;border:1px solid var(--kaf-line);border-radius:16px;padding:24px 16px 16px;box-shadow:0 8px 24px rgba(20,50,38,.07)}
.kaf-palmares__card--win{border-color:#e5c46b;box-shadow:0 10px 30px rgba(201,162,74,.18)}
.kaf-palmares__card--qp{border-color:#f0cdb4}
.kaf-palmares__card--low{border-color:#f0cdb4}
.kaf-palmares__badge{position:absolute;top:-12px;left:50%;transform:translateX(-50%);white-space:nowrap;font-size:12.5px;font-weight:800;padding:6px 14px;border-radius:999px;background:var(--kaf-ink);color:#fff}
.kaf-palmares__card--win .kaf-palmares__badge{background:#c9a24a}
.kaf-palmares__card--qp .kaf-palmares__badge{background:var(--kaf-ink)}
.kaf-palmares__card--low .kaf-palmares__badge{background:var(--kaf-ink)}
.kaf-palmares__media{display:block;width:100%;margin:6px 0 14px}
.kaf-palmares__media img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:12px;background:#f6f3f0;display:block}
.kaf-palmares__name{font-weight:700;color:var(--kaf-ink);text-decoration:none;font-size:16px;line-height:1.3}
.kaf-palmares__name:hover{color:var(--kaf-terra-d)}
.kaf-palmares__price{display:block;margin:8px 0 14px;font-family:Georgia,serif;font-weight:700;font-size:20px;color:var(--kaf-terra-d)}
.kaf-palmares__price small{font-family:var(--kaf-font);font-weight:400;font-size:12px;color:#888}
.kaf-palmares__cta{margin-top:auto;display:inline-block;background:var(--kaf-green);color:#fff;font-weight:700;text-decoration:none;padding:11px 22px;border-radius:9px;transition:background .25s ease}
.kaf-palmares__cta:hover{background:#000;color:#fff}
@media(max-width:780px){.kaf-palmares__grid{grid-template-columns:1fr;gap:22px}}

/* ---- Sommaire ancré (TOC) ---- */
.kaf-toc{background:var(--kaf-green-soft);border:1px solid var(--kaf-green-line);border-radius:14px;padding:16px 22px;margin:22px 0}
.kaf-toc__title{margin:0 0 8px;font-weight:800;color:var(--kaf-ink)}
.kaf-toc__list{margin:0;padding-left:20px;columns:2;column-gap:30px}
.kaf-toc__list li{margin:4px 0;break-inside:avoid}
.kaf-toc__list a{color:var(--kaf-green-d);text-decoration:none}
.kaf-toc__list a:hover{text-decoration:underline;color:var(--kaf-terra-d)}
@media(max-width:600px){.kaf-toc__list{columns:1}}

/* ---- Scores éditoriaux par critère (barres) ---- */
.kaf-scores{margin:22px 0;max-width:560px}
.kaf-scores__title{font-weight:800;margin:0 0 12px;color:var(--kaf-ink)}
.kaf-score{display:grid;grid-template-columns:130px 1fr 54px;align-items:center;gap:12px;margin:9px 0}
.kaf-score__lib{font-size:14px;font-weight:600;color:var(--kaf-ink)}
.kaf-score__bar{height:9px;border-radius:999px;background:#ececec;overflow:hidden}
.kaf-score__fill{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,var(--kaf-terra),var(--kaf-green))}
.kaf-score__val{font-size:13px;font-weight:700;color:var(--kaf-terra-d);text-align:right}
@media(max-width:480px){.kaf-score{grid-template-columns:100px 1fr 46px;gap:8px}}

/* =====================================================================
   COLLECTIONS EN CARTES RECTANGULAIRES (remplace les cercles)
   → un format paysage 4:3 montre bien mieux une table (plateau, pieds,
   forme) qu'une vignette ronde qui rogne les angles.
   ===================================================================== */
.qc-bubbles{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;overflow:visible}
.qc-bubble{flex-direction:column;min-width:0;gap:12px}
.qc-thumb{width:100%;height:auto;aspect-ratio:4/3;border-radius:16px;
  box-shadow:0 6px 18px rgba(20,50,38,.10);transition:transform .18s ease,box-shadow .18s ease}
.qc-thumb img{width:100%;height:100%;object-fit:cover}
.qc-thumb::after{border-radius:16px}
.qc-label{font-size:1rem;font-weight:700}
.qc-bubble:hover .qc-thumb{transform:translateY(-3px);box-shadow:0 14px 30px rgba(20,50,38,.16)}
/* Mobile : 2 colonnes (au lieu du carrousel de cercles) */
@media(max-width:860px){
  .qc-bubbles{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;overflow:visible;scroll-snap-type:none}
  .qc-bubble{min-width:0}
  .qc-thumb{aspect-ratio:4/3}
}
@media(max-width:420px){.qc-bubbles{grid-template-columns:1fr 1fr;gap:10px}}

/* ---- Formulaire de contact [kaf_contact] ---- */
/* Le formulaire est posé sur un panneau crème encadré → ne se fond plus dans le blanc. */
.kaf-form{max-width:680px;margin:18px 0;display:flex;flex-direction:column;gap:16px;
  background:var(--kaf-cream);border:1px solid #ead9c6;border-radius:16px;
  padding:26px clamp(18px,3vw,30px);box-shadow:0 10px 30px rgba(20,50,38,.07)}
.kaf-form label{display:flex;flex-direction:column;gap:6px;font-weight:600;color:var(--kaf-ink)}
.kaf-form label span{color:#c0392b}
/* Champs : bordure nettement plus visible (gris-bois) + fond blanc qui ressort sur le crème. */
.kaf-form input,.kaf-form textarea{font-family:var(--kaf-font);font-size:15px;padding:12px 14px;border:1.5px solid #c8b9a6;border-radius:10px;background:#fff;width:100%;box-sizing:border-box;transition:border-color .15s ease,box-shadow .15s ease}
.kaf-form input:hover,.kaf-form textarea:hover{border-color:#a98f72}
.kaf-form input:focus,.kaf-form textarea:focus{outline:none;border-color:var(--kaf-terra);box-shadow:0 0 0 3px rgba(201,123,74,.18)}
.kaf-form__row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.kaf-form .kaf-btn{border:none;cursor:pointer;align-self:flex-start;font-size:15px;background:var(--kaf-terra);box-shadow:0 6px 18px rgba(201,123,74,.28)}
.kaf-form .kaf-btn:hover{background:var(--kaf-terra-d)}
.kaf-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.kaf-form__msg{padding:14px 16px;border-radius:10px;margin:0 0 16px;font-weight:600}
.kaf-form__ok{background:#eafaf0;border:1px solid #b8e6c9;color:#1e7a45}
.kaf-form__err{background:#fdecea;border:1px solid #f3c2bb;color:#b5392b}
@media(max-width:560px){.kaf-form__row{grid-template-columns:1fr}}

/* =====================================================================
   IDENTITÉ VISUELLE — ne pas ressembler à un WordPress par défaut
   + LISIBILITÉ (textes plus foncés, FAQ/onglets plus visibles)
   ===================================================================== */
:root{
  /* Serif éditorial = signature "magazine / comparateur" (pas le sans générique de WP). 0 requête externe. */
  --kaf-serif:Georgia,"Iowan Old Style","Palatino Linotype",Palatino,"Times New Roman",serif;
  --kaf-text:#26332e; /* encre de lecture, bien contrastée */
}
/* Titres en serif, plus marqués */
h1,h2,h3,h4,
.kaf-hero__title,.kaf-palmares__title,.kaf-faq__title,
.qc-tabs h2,.kaf-scores__title,.kaf-toc__title{
  font-family:var(--kaf-serif);letter-spacing:-.015em;font-weight:700;color:var(--kaf-ink)
}
.wp-block-post-content h2{font-size:clamp(24px,3.3vw,33px)}
.wp-block-post-content h3{font-size:clamp(19px,2.3vw,23px);margin-top:1.4em}

/* Lisibilité : corps de texte plus foncé, un peu plus dense ET un peu plus gras */
body{color:var(--kaf-text)}
.wp-block-post-content{color:var(--kaf-text);font-size:17.5px;line-height:1.75;font-weight:450}
.wp-block-post-content p,.wp-block-post-content li,.wp-block-post-content td{color:var(--kaf-text);font-weight:450}
/* Zones qui paraissaient les plus fines : un cran de graisse en plus */
.qc-tabpanel__content{color:var(--kaf-text);font-size:17px;line-height:1.75;font-weight:480}
.kaf-cta__merchant{color:#5a6660}
.kaf-card__name{color:var(--kaf-ink)}

/* Liens de contenu plus francs — UNIQUEMENT les liens de texte (pas les boutons/cartes) */
.wp-block-post-content :is(p,li,td) a:not([class*="kaf-"]):not([class*="btn"]){color:var(--kaf-terra-d);font-weight:600;text-decoration:underline;text-underline-offset:2px}
.wp-block-post-content :is(p,li,td) a:not([class*="kaf-"]):not([class*="btn"]):hover{color:#000}
/* Sécurité : les boutons/cartes sont des <a> → ne jamais leur appliquer le style lien souligné */
.wp-block-post-content .kaf-palmares__cta,
.wp-block-post-content .kaf-cta__btn,
.wp-block-post-content a.kaf-btn,
.wp-block-post-content .azonpress-button{color:#fff;text-decoration:none;font-weight:700}
.wp-block-post-content a.kaf-card{color:inherit;text-decoration:none}

/* =====================================================================
   POLICES DE MARQUE auto-hébergées (Fraunces titres + Manrope corps)
   WOFF2 sous-ensemble latin · font-display:swap · fallback système.
   0 requête externe (RGPD) · ~78 Ko · preload des 2 critiques côté PHP.
   ===================================================================== */
@font-face{font-family:'Manrope';font-style:normal;font-weight:400;font-display:swap;src:url('fonts/manrope-latin-400-normal.woff2') format('woff2')}
@font-face{font-family:'Manrope';font-style:normal;font-weight:500;font-display:swap;src:url('fonts/manrope-latin-500-normal.woff2') format('woff2')}
@font-face{font-family:'Manrope';font-style:normal;font-weight:700;font-display:swap;src:url('fonts/manrope-latin-700-normal.woff2') format('woff2')}
@font-face{font-family:'Fraunces';font-style:normal;font-weight:600;font-display:swap;src:url('fonts/fraunces-latin-600-normal.woff2') format('woff2')}
@font-face{font-family:'Fraunces';font-style:normal;font-weight:700;font-display:swap;src:url('fonts/fraunces-latin-700-normal.woff2') format('woff2')}

/* On redéfinit les variables : Manrope/Fraunces d'abord, stack système en secours */
:root{
  --kaf-font:'Manrope',-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --kaf-serif:'Fraunces',Georgia,"Palatino Linotype",Palatino,"Times New Roman",serif;
}

/* ---- Affinage typo (Fraunces titres + Manrope corps) ---- */
/* Corps Manrope : taille/interligne confortables + léger resserrage */
body{letter-spacing:-.004em}
.wp-block-post-content{font-size:17px;line-height:1.72}
/* Titres : interligne serré, tracking serif doux (au lieu de -.015em trop tendu) */
h1,h2,h3,h4,
.kaf-hero__title,.kaf-palmares__title,.kaf-faq__title,
.qc-tabs h2,.kaf-scores__title,.kaf-toc__title{letter-spacing:-.01em;line-height:1.18}
/* Titres de section en Fraunces 600 (plus élégant/lisible que le 700 massif) */
.wp-block-post-content h2,.wp-block-post-content h3,.wp-block-post-content h4,
.kaf-palmares__title,.kaf-faq__title,.kaf-scores__title,.kaf-toc__title,.qc-tabs h2{font-weight:600}
/* On garde le 700 pour les titres forts (H1 + hero) */
h1,.wp-block-post-content h1,.kaf-hero__title{font-weight:700}
/* Sous-titre du hero un peu plus foncé */
.kaf-hero__sub{color:#3c4a43}

/* ---- Maîtrise de la hauteur des images (cartes trop hautes / image à la une trop longue) ---- */
/* Cartes du comparateur : vignette régulière 4:3 (recadrée), au lieu d'une hauteur libre */
.kaf-card__media img{width:100%;aspect-ratio:4/3;object-fit:cover;height:auto;display:block;background:#f6f3f0}
/* Image à la une (1re image de la page) : paysage 16:9 plafonné, recadrage propre */
.wp-block-post-featured-image img{aspect-ratio:16/9;object-fit:cover;width:100%;height:auto;max-height:440px}

/* =====================================================================
   RESPONSIVE MOBILE — passe dédiée (filtres repliables + ajustements)
   ===================================================================== */
/* Bouton « Afficher les filtres » : CACHÉ sur PC (filtres déjà visibles en barre),
   VISIBLE sur mobile (les filtres se replient derrière). */
.kaf-filter-toggle{display:none;align-items:center;gap:9px;width:100%;justify-content:flex-start;margin-bottom:16px;
  padding:13px 18px;border:none;border-radius:12px;background:var(--kaf-terra);color:#fff;font-weight:700;font-size:15px;
  cursor:pointer;box-shadow:0 4px 12px rgba(201,123,74,.25)}
/* Chevron d'affordance (signale clairement que ça déplie) — pseudo non effacé par le JS */
.kaf-filter-toggle::before{content:"≡";font-size:18px;font-weight:700;line-height:1}
.kaf-filter-toggle::after{content:"▾";font-size:13px;transition:transform .2s ease;margin-left:auto}
.kaf.is-filters-open .kaf-filter-toggle::after{transform:rotate(180deg)}

/* MOBILE : layout en pile + filtres repliés derrière le bouton « Afficher les filtres ». */
@media(max-width:768px){
  .kaf-layout{display:block}
  .kaf-filter-toggle{display:flex}
  .kaf-facets{display:none;flex-direction:column;gap:14px;padding:14px;margin-bottom:14px;
    background:var(--kaf-soft);border:1px solid var(--kaf-line);border-radius:12px}
  .kaf.is-filters-open .kaf-facets{display:flex}
}

@media(max-width:600px){
  /* Toolbar : recherche pleine largeur, tri/reset côte à côte */
  .kaf-toolbar{gap:8px}
  .kaf-search{flex:1 1 100%}
  .kaf-sort,.kaf-reset{flex:1 1 auto}
  .kaf-count{flex:1 1 100%;margin-left:0;text-align:right}

  /* Hero plus compact */
  .kaf-hero{padding:38px 18px;border-radius:14px;margin-bottom:28px}

  /* Moins d'espace gaspillé en haut + sections resserrées */
  body:not(.home) h1{margin-top:22px}
  .qc-tabs{margin:22px auto}
  .kaf-palmares{margin:18px 0}
  .wp-block-post-content{padding:22px 16px}

  /* Tableaux : les petits (≤3-4 colonnes) tiennent dans l'écran ; les très larges
     peuvent scroller. Police et marges réduites pour faire entrer le contenu. */
  .wp-block-post-content .wp-block-table{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .wp-block-post-content .wp-block-table table{min-width:0;width:100%;font-size:13px}
  .wp-block-post-content .wp-block-table th,.wp-block-post-content .wp-block-table td{padding:8px 10px;word-break:normal;overflow-wrap:break-word}
  /* Comparatif (.kaf-table) large : police compacte + 1re colonne FIGÉE pendant le glissement
     → on garde toujours le repère (Matière…) visible, le scroll devient lisible et minimal. */
  .kaf-table{font-size:11.5px}
  .kaf-table thead th,.kaf-table tbody td{padding:8px 9px}
  .kaf-table th:first-child,.kaf-table td:first-child{position:sticky;left:0;z-index:1}
  .kaf-table tbody td:first-child{background:#fff}
  .kaf-table tbody tr:nth-child(even) td:first-child{background:#f7faf9}

  /* CTA fiche : bouton pleine largeur, plus facile au pouce */
  .kaf-cta{flex-direction:column;align-items:stretch;text-align:center}
  .kaf-cta__btn{width:100%}

  /* Sommaire compact */
  .kaf-toc{padding:14px 16px}

  /* Encadrés un peu plus serrés */
  .kaf-callout{padding:16px 16px 4px}
}

@media(max-width:400px){
  .qc-bubbles{gap:9px}
  .kaf-hero__cta{gap:10px}
  .kaf-hero__cta .kaf-btn,.kaf-hero__cta .kaf-btn--ghost{width:100%}
}

/* Anti-débordement global : aucun élément ne crée de scroll horizontal sur mobile
   (un débordement à droite décalait la page → titres rognés à gauche). */
html,body{overflow-x:hidden;max-width:100%}
.wp-site-blocks{overflow-x:clip}
*{min-width:0}
/* Filet de sécurité : aucun bloc du kit ne déborde (box-sizing + largeur bornée)
   → corrige le contenu qui « penche à gauche » sur mobile. */
.wp-block-post-content :is(.azonpress,.kaf-cta,.kaf-callout,.kaf-toc,.kaf-scores,
.kaf-palmares,.kaf-news,.kaf,.wpgb-wrapper,.qc-collections,.kaf-table,.wp-block-table,.kaf-hero){
  box-sizing:border-box;max-width:100%}
@media(max-width:600px){
  /* Home : le corps est transparent (padding:0) → on lui rend un padding latéral
     pour décoller titres, paragraphes et boîtes des bords. */
  .home .wp-block-post-content{padding-left:16px;padding-right:16px}
  /* Sécurité largeur : ces conteneurs ne dépassent jamais la fenêtre. */
  .wp-block-post-content,.kaf,.kaf-layout,.kaf-toolbar,.kaf-filter-toggle,
  .kaf-search,.kaf-sort,.kaf-reset,.kaf-count,.kaf-facets{max-width:100%;box-sizing:border-box}
}

/* =====================================================================
   MENU MOBILE (overlay) — aligné à gauche, lisible, sous-menus en retrait
   Corrige : items collés à droite + sous-menus en « cartes » flottantes.
   ===================================================================== */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content{
  justify-content:flex-start;align-items:stretch;width:100%}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container{
  flex-direction:column;align-items:stretch;text-align:left;width:100%;gap:2px}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item{width:100%;justify-content:flex-start}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item>a,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu>a{
  width:100%;padding:13px 2px;font-size:18px;font-weight:700;font-family:var(--kaf-serif);border-bottom:1px solid rgba(0,0,0,.07)}
/* Sous-menus : pas de carte flottante → simple retrait à gauche */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container{
  position:static !important;border:none !important;box-shadow:none !important;border-radius:0 !important;
  background:transparent !important;padding:0 0 6px 14px !important;width:100%;opacity:1;visibility:visible;transform:none}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item>a{
  font-family:var(--kaf-font);font-size:16px;font-weight:500;padding:10px 2px;border-bottom:none;color:#3a4a43}

/* =====================================================================
   BOUTONS — finition premium, cohérente desktop + mobile
   Dégradé terracotta subtil, survol qui s'enfonce dans le ton (pas de noir
   brutal), micro-relief, état actif, anneau de focus clavier.
   ===================================================================== */
.kaf-btn,.kaf-cta__btn,.kaf-palmares__cta,.azonpress-button,.kaf-more,.kaf-filter-toggle{
  background:linear-gradient(180deg,#d4895a,#c97b4a);
  border:none;border-radius:13px;font-weight:700;letter-spacing:.012em;cursor:pointer;box-sizing:border-box;max-width:100%;
  box-shadow:0 5px 16px rgba(201,123,74,.30),inset 0 1px 0 rgba(255,255,255,.22);
  transition:transform .15s ease,box-shadow .2s ease,background .2s ease}
.kaf-btn:hover,.kaf-cta__btn:hover,.kaf-palmares__cta:hover,.azonpress-button:hover,.kaf-more:hover,.kaf-filter-toggle:hover{
  background:linear-gradient(180deg,#c97b4a,#a85f33);color:#fff;
  transform:translateY(-2px);box-shadow:0 9px 24px rgba(168,95,51,.38),inset 0 1px 0 rgba(255,255,255,.2)}
.kaf-btn:active,.kaf-cta__btn:active,.kaf-palmares__cta:active,.azonpress-button:active,.kaf-more:active,.kaf-filter-toggle:active{
  transform:translateY(0);box-shadow:0 3px 10px rgba(168,95,51,.3)}
/* Anneau de focus clavier (accessibilité) */
.kaf-btn:focus-visible,.kaf-cta__btn:focus-visible,.kaf-palmares__cta:focus-visible,.azonpress-button:focus-visible,
.kaf-more:focus-visible,.kaf-reset:focus-visible,.kaf-btn--ghost:focus-visible,.kaf-filter-toggle:focus-visible,.kaf-sort:focus-visible{
  outline:3px solid rgba(201,123,74,.45);outline-offset:2px}
/* Bouton secondaire « Nos guides » : rempli foncé (≠ terracotta principal), élégant */
.kaf-btn--ghost{background:var(--kaf-ink) !important;color:#fff !important;border:none !important;
  box-shadow:0 4px 14px rgba(31,42,36,.22),inset 0 1px 0 rgba(255,255,255,.08) !important}
.kaf-btn--ghost:hover{background:#0c0f0d !important;color:#fff !important;transform:translateY(-2px);
  box-shadow:0 9px 24px rgba(31,42,36,.32) !important}
/* Bouton « Réinitialiser » (outline) — cohérent et net */
.kaf-reset{font-weight:700;transition:border-color .15s ease,background .15s ease,box-shadow .15s ease}
.kaf-reset:hover{box-shadow:0 4px 12px rgba(0,0,0,.06)}
/* Boutons sur mobile : présents mais pas épais, tactiles, sans débordement */
@media(max-width:600px){
  /* Design mobile : boutons nets, plus rectangulaires (coins légers), tactiles, sans débordement */
  .kaf-btn,.kaf-btn--ghost,.kaf-cta__btn,.kaf-palmares__cta,.azonpress-button,.kaf-more,.kaf-reset,.kaf-filter-toggle{
    min-height:48px;font-size:16px;border-radius:10px;padding-left:18px;padding-right:18px;padding-top:12px;padding-bottom:12px;
    display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;max-width:100%;width:100%}
  /* Boutons d'action principaux en pleine largeur (hero + offre + palmarès) */
  .kaf-hero__cta .kaf-btn,.kaf-hero__cta .kaf-btn--ghost,.kaf-cta__btn,.kaf-palmares__cta{width:100%;max-width:100%}
  .kaf-hero__cta{flex-direction:column;gap:12px;width:100%}
  /* "Trier"/"Réinitialiser" : 2 colonnes égales qui tiennent sans déborder */
  .kaf-sort,.kaf-reset{width:auto;flex:1 1 0}
  /* CTA carte un peu plus généreux au pouce */
  .kaf-card__cta{min-height:44px;display:flex;align-items:center;justify-content:center}
}

/* =====================================================================
   NEWSLETTER [kaf_newsletter]
   ===================================================================== */
.kaf-news{max-width:640px;margin:6px auto 26px;padding:26px clamp(18px,3vw,30px);
  background:linear-gradient(180deg,var(--kaf-green-soft),#fff);border:1px solid var(--kaf-green-line);
  border-radius:18px;box-shadow:0 10px 30px rgba(20,50,38,.06)}
.kaf-news__title{font-family:var(--kaf-serif);font-size:clamp(20px,2.6vw,26px);font-weight:700;color:var(--kaf-ink);margin:0 0 6px}
.kaf-news__intro{margin:0 0 16px;color:#3c4a43}
.kaf-news__row{display:flex;gap:10px;flex-wrap:wrap}
.kaf-news__row input[type=email]{flex:1 1 220px;min-width:0;padding:13px 15px;border:1.5px solid #c8b9a6;border-radius:12px;font-size:15px;box-sizing:border-box;background:#fff}
.kaf-news__row input[type=email]:focus{outline:none;border-color:var(--kaf-terra);box-shadow:0 0 0 3px rgba(201,123,74,.18)}
.kaf-news__row .kaf-btn{white-space:nowrap}
.kaf-news__consent{display:flex;gap:9px;align-items:flex-start;margin-top:12px;font-size:13.5px;color:#4a584f;line-height:1.5}
.kaf-news__consent input{margin-top:3px;flex:0 0 auto}
@media(max-width:560px){.kaf-news__row .kaf-btn{width:100%}}

/* =======================================================================
 * SOCLE RESPONSIVE — obligatoire sur tous les sites du réseau (v1.4.4)
 * Corrige le défaut « la page penche à gauche sur mobile » (iOS Safari).
 * CAUSE : un bloc .alignfull s'étend via des MARGES NÉGATIVES ; lui poser
 * un max-width l'empêche de s'élargir -> il glisse à gauche et laisse un
 * vide à droite. RÈGLE : box-sizing global OUI, max-width sur .alignfull JAMAIS
 * (on contraint les ENFANTS : img, table, pre, iframe, video).
 * ===================================================================== */
*,*::before,*::after{box-sizing:border-box}
html,body{max-width:100%;overflow-x:hidden}
.wp-site-blocks{overflow-x:clip}
img{max-width:100%;height:auto}
.wp-block-post-content :is(table,pre,iframe,video,figure){max-width:100%}

@media(max-width:781px){
  /* max-width:none reserve au MOBILE : sur PC il supprimerait la contrainte de largeur */
  .alignfull,.wp-block-group.alignfull,.entry-content.alignfull,
  .wp-block-post-content.alignfull{max-width:none}
  /* H1 : ne doit pas occuper tout le premier écran */
  .wp-block-post-title,.wp-block-post-content h1{font-size:clamp(1.5rem,6vw,2.05rem);line-height:1.16;overflow-wrap:break-word}
  /* Tableaux : le conteneur défile, le tableau garde sa largeur naturelle dedans */
  .kaf-table,.wp-block-table,figure.wp-block-table{display:block;width:100%;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .kaf-table>table,.wp-block-table>table,figure.wp-block-table>table{display:table;width:max-content;min-width:100%;max-width:none}
  /* Tableaux NUS (sans conteneur) : sinon ils elargissent toute la page */
  .wp-block-post-content table,.entry-content table{display:block;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
  /* Champs < 16px : iOS zoome au focus */
  input,select,textarea,.wp-block-search__input{font-size:16px}
  /* Cibles tactiles >= 44x44 */
  .wp-block-navigation__responsive-container-open,
  .wp-block-navigation__responsive-container-close{min-width:44px;min-height:44px;display:flex;align-items:center;justify-content:center}
}

/* Figures injectees en HTML brut (infographies, guides) : elles echappent a la contrainte
   de largeur de Gutenberg et occupent toute la carte -> l'image plafonnee se colle a gauche.
   On centre l'image dans sa figure. */
.wp-block-post-content figure{margin-left:auto;margin-right:auto;text-align:center}
.wp-block-post-content figure > a{display:inline-block}
.wp-block-post-content figure > a,
.wp-block-post-content figure > img,
.wp-block-post-content figure > a > img{display:block;margin-left:auto;margin-right:auto}

/* =====================================================================
   BANDEAU DE CONSENTEMENT (plugin CookieAdmin) — compactage MOBILE (v1.4.9)
   Resserre le BANDEAU (Notice) ET le panneau « Personnaliser » (modal) sur
   mobile. !important car la CSS du plugin est injectée par consent.js APRÈS
   cette feuille. Inerte là où le plugin est absent (classes sans cible).
   ===================================================================== */
@media(max-width:767px){
  /* Bandeau (Notice) */
  .cookieadmin_consent_inside{padding:11px 12px !important;border-radius:12px !important;max-width:340px !important;margin:0 auto !important;max-height:80vh !important;overflow-y:auto !important}
  .cookieadmin_notice_con{padding:0 !important}
  .cookieadmin_notice_title{font-size:.98rem !important;line-height:1.25 !important;margin:0 0 6px !important}
  .cookieadmin_desc{font-size:12px !important;line-height:1.35 !important;padding:0 !important;margin:0 0 9px !important}
  .cookieadmin_consent_btns{gap:6px !important;margin:0 !important;justify-content:space-between !important}
  .cookieadmin_consent_inside .cookieadmin_btn{padding:.45rem .55rem !important;margin:0 !important;font-size:12.5px !important;min-height:0 !important}
  .cookieadmin_consent_inside .cookieadmin_customize_btn,
  .cookieadmin_consent_inside .cookieadmin_reject_btn{width:calc(50% - 3px) !important}
  .cookieadmin_consent_inside .cookieadmin_accept_btn{width:100% !important}
  .cookieadmin_remark{font-size:10.5px !important}
  /* Panneau « Personnaliser » (modal) */
  .cookieadmin_cookie_modal{width:92% !important;max-width:340px !important;max-height:80vh !important;padding:12px !important;border-radius:12px !important;overflow-y:auto !important}
  .cookieadmin_preference_title{font-size:1rem !important;margin:0 0 8px !important}
  .cookieadmin_preference,.cookieadmin_details_wrapper,.cookieadmin_types,.cookieadmin_mod_head{font-size:12px !important;line-height:1.35 !important}
  .cookieadmin_modal_footer .cookieadmin_btn{padding:.45rem .6rem !important;font-size:12.5px !important}
}
