/* KOADBOOTH — CSS additionnel. Remplace tout le contenu du champ.
   31 juillet 2026. Justification de chaque retrait : koadbooth-css-additionnel-avant.css */

/* Les trois espaceurs Elementor de 50 px herites de l'ancien en-tete collant.
   Releve sur les 43 pages et articles du site : il n'y en a pas d'autres. */
.elementor-element-199b5a6,   /* accueil */
.elementor-element-7da5e85,   /* nous contacter */
.elementor-element-d68e139 {  /* l'atelier */
	display: none;
}

/* Plus aucune marge au-dessus du contenu, sur tout le site.
   Blocksy ajoute 90 px en haut ET en bas de la zone de contenu
   (--theme-content-vertical-spacing). On ne retire que le haut : les 90 px
   du bas separent le contenu du pied de page, ils ont leur utilite.
   Le selecteur est ancre sur #main pour ne pas toucher aux conteneurs
   du pied de page, qui ont leurs propres marges (30 px et 3 px). */
#main .ct-container-full,
#main .ct-container {
	padding-top: 0;
}

/* Mots plus larges que leur colonne. Propriete heritee : une seule ligne suffit. */
body {
	overflow-wrap: break-word;
}

/* ============================================================================
   PEAU SKEUDVA — la DA commune, en un fichier portable
   ----------------------------------------------------------------------------
   Implémente DESIGN.md (source de vérité, racine du projet). Déjà en
   production sur analoggwerz.com ; à rejouer tel quel sur koadbooth.fr.

   Où le coller : Apparence → Personnaliser → CSS additionnel
   (ou l'enfiler en feuille dans le thème enfant).

   AVANT de coller :
   1) Téléverser les deux fontes de `fontes/` dans la médiathèque du site.
   2) Remplacer les deux URL «/wp-content/uploads/…» ci-dessous par celles
      obtenues.
   3) Si le site charge encore Playfair/Inter/Caveat/Alexandria quelque part,
      les alias du bloc B les récupèrent — ne pas les supprimer.
   ========================================================================== */

/* ---- A. Jetons ---------------------------------------------------------- */
:root{
  /* palette matière — bois, papier, cuivre, feuillage */
  --skv-foret:#3A4E3A;         /* action */
  --skv-foret-fonce:#2C3C2C;   /* survol du vert, fonds sombres */
  --skv-foret-voile:#F2F6F1;   /* option sélectionnée */
  --skv-terre:#8C5A4F;         /* sollicitation, promotion */
  --skv-terre-fonce:#75463D;
  --skv-cuivre:#C89B7B;        /* décor, CTA secondaire sur sombre */
  --skv-cuivre-encre:#8A6244;  /* sur-titres sur fond clair */
  --skv-cuivre-clair:#DCB18C;  /* texte sur vert profond */
  --skv-creme:#FDFBF7;         /* fond de page — jamais de blanc pur */
  --skv-sable:#F4F1EA;         /* sections alternées, zones média */
  --skv-sable-fonce:#EDE7DC;
  --skv-filet:#EAE6DF;         /* toutes les bordures 1px */
  --skv-carte:#FFFFFF;         /* surfaces posées, jamais fond de page */
  --skv-encre:#2C2825;         /* texte — noir brun, jamais #000 */
  --skv-encre-prof:#22211E;    /* teinte unique des ombres */
  --skv-encre-douce:#5A544F;
  --skv-encre-sourde:#9A948C;
  --skv-encre-inverse:#D8D4CE; /* texte courant sur vert profond */

  /* les deux voix */
  --skv-affiche:'Product Sans','General Sans',system-ui,Arial,sans-serif;
  --skv-texte:'General Sans',system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;

  /* angles francs : 4 agit, 6 choisit, 12 contient, 2 tamponne */
  --skv-r-action:4px;
  --skv-r-choix:6px;
  --skv-r-contenant:12px;
  --skv-r-tampon:2px;

  /* ombres — teintées encre profonde, jamais noires, jamais au repos */
  --skv-ombre-repos:0 10px 30px rgba(34,33,30,.06);
  --skv-ombre-levee:0 18px 44px rgba(34,33,30,.13);
  --skv-ombre-flottante:0 6px 22px rgba(34,33,30,.22);

  /* une seule courbe pour tout ce qui bouge */
  --skv-courbe:cubic-bezier(.16,1,.3,1);

  /* rythme vertical des sections */
  --skv-section:clamp(3.75rem,8vw,7.5rem);
}

/* ---- B. Fontes auto-hébergées ------------------------------------------- */
/* woff2 en médiathèque depuis le 19 août (45 Ko à deux), TTF d'avril en repli. */
@font-face{font-family:'General Sans';src:url('https://koadbooth.fr/wp-content/uploads/2026/08/generalsans-var.woff2') format('woff2'),url('https://koadbooth.fr/wp-content/uploads/2026/04/GeneralSans-Variable.ttf') format('truetype');font-weight:200 700;font-style:normal;font-display:swap}
@font-face{font-family:'Product Sans';src:url('https://koadbooth.fr/wp-content/uploads/2026/08/productsans-black.woff2') format('woff2'),url('https://koadbooth.fr/wp-content/uploads/2026/04/ProductSans-Black.ttf') format('truetype');font-weight:500 900;font-style:normal;font-display:swap}
/* alias : les familles des vieux réglages rendent les nouveaux fichiers,
   aucun réglage oublié ne retombe en police système */
@font-face{font-family:'Alexandria';src:url('https://koadbooth.fr/wp-content/uploads/2026/08/generalsans-var.woff2') format('woff2'),url('https://koadbooth.fr/wp-content/uploads/2026/04/GeneralSans-Variable.ttf') format('truetype');font-weight:200 700;font-style:normal;font-display:swap}
@font-face{font-family:'Inter';src:url('https://koadbooth.fr/wp-content/uploads/2026/08/generalsans-var.woff2') format('woff2'),url('https://koadbooth.fr/wp-content/uploads/2026/04/GeneralSans-Variable.ttf') format('truetype');font-weight:200 700;font-style:normal;font-display:swap}
@font-face{font-family:'Caveat';src:url('https://koadbooth.fr/wp-content/uploads/2026/08/generalsans-var.woff2') format('woff2'),url('https://koadbooth.fr/wp-content/uploads/2026/04/GeneralSans-Variable.ttf') format('truetype');font-weight:200 700;font-style:normal;font-display:swap}
@font-face{font-family:'Roboto';src:url('https://koadbooth.fr/wp-content/uploads/2026/08/generalsans-var.woff2') format('woff2'),url('https://koadbooth.fr/wp-content/uploads/2026/04/GeneralSans-Variable.ttf') format('truetype');font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:'Roboto Slab';src:url('https://koadbooth.fr/wp-content/uploads/2026/08/generalsans-var.woff2') format('woff2'),url('https://koadbooth.fr/wp-content/uploads/2026/04/GeneralSans-Variable.ttf') format('truetype');font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:'Plus Jakarta Sans';src:url('https://koadbooth.fr/wp-content/uploads/2026/08/generalsans-var.woff2') format('woff2'),url('https://koadbooth.fr/wp-content/uploads/2026/04/GeneralSans-Variable.ttf') format('truetype');font-weight:200 800;font-style:normal;font-display:swap}
@font-face{font-family:'Unbounded';src:url('https://koadbooth.fr/wp-content/uploads/2026/08/productsans-black.woff2') format('woff2'),url('https://koadbooth.fr/wp-content/uploads/2026/04/ProductSans-Black.ttf') format('truetype');font-weight:400 900;font-style:normal;font-display:swap}
@font-face{font-family:'Playfair Display';src:url('https://koadbooth.fr/wp-content/uploads/2026/08/productsans-black.woff2') format('woff2'),url('https://koadbooth.fr/wp-content/uploads/2026/04/ProductSans-Black.ttf') format('truetype');font-weight:400 900;font-style:normal;font-display:swap}

/* ---- C. Les deux voix ---------------------------------------------------
   L'affiche porte l'émotion ; General Sans porte la transaction.
   L'affiche ne touche JAMAIS un prix, un bouton, un titre de carte produit. */
body{font-family:var(--skv-texte);color:var(--skv-encre);background:var(--skv-creme)}
h1,h2,.page-title,.entry-title{
  font-family:var(--skv-affiche);font-weight:900;letter-spacing:-.015em}
h1,.page-title{line-height:1.1}
h2{line-height:1.16}
button,input,select,textarea{font-family:var(--skv-texte)}

/* sur-titre de section : cuivre encre nu, capitales espacées */
.skv-eyebrow{font-size:.75rem;font-weight:600;letter-spacing:.125em;
  text-transform:uppercase;color:var(--skv-cuivre-encre)}

/* annotation (ex-manuscrite) : italique terre cuite, une par section max */
.skv-annotation{font-family:var(--skv-texte);font-style:italic;font-weight:500;
  font-size:clamp(1.02rem,1.5vw,1.2rem);letter-spacing:.01em;
  color:var(--skv-terre);line-height:1.4}

/* prix : General Sans 700, chiffres alignés */
.skv-prix{font-family:var(--skv-texte);font-weight:700;
  font-variant-numeric:tabular-nums;color:var(--skv-foret-fonce)}

/* ---- D. Composants ------------------------------------------------------ */
/* bouton plein — UN SEUL vert plein par écran */
.skv-bouton{display:inline-flex;align-items:center;justify-content:center;
  min-height:44px;padding:1em 2.25em;border-radius:var(--skv-r-action);
  background:var(--skv-foret);color:#fff;border:2px solid var(--skv-foret);
  font-family:var(--skv-texte);font-size:.95rem;font-weight:600;cursor:pointer;
  transition:background .25s var(--skv-courbe),transform .25s var(--skv-courbe)}
.skv-bouton:hover{background:var(--skv-foret-fonce);border-color:var(--skv-foret-fonce);
  transform:translateY(-2px)}

/* fantôme — se remplit au survol */
.skv-bouton--fantome{background:transparent;color:var(--skv-foret)}
.skv-bouton--fantome:hover{background:var(--skv-foret);color:#fff;border-color:var(--skv-foret)}

/* sollicitation (devis, promotion) : la terre cuite, jamais en même temps
   que le vert plein sur un même écran */
.skv-bouton--terre{background:transparent;color:var(--skv-terre-fonce);border-color:var(--skv-terre)}
.skv-bouton--terre:hover{background:var(--skv-terre);color:#fff}

/* carte : plate au repos, soulevée au survol, filet qui FONCE (pas de vert) */
.skv-carte{background:var(--skv-carte);border:1px solid var(--skv-filet);
  border-radius:var(--skv-r-contenant);
  transition:border-color .2s,transform .25s var(--skv-courbe),box-shadow .25s var(--skv-courbe)}
.skv-carte:hover{border-color:#CFC8BC;transform:translateY(-4px);
  box-shadow:var(--skv-ombre-levee)}

/* puce de choix (filtre, option) */
.skv-puce{display:inline-flex;align-items:center;gap:.5rem;min-height:40px;
  padding:0 .95rem;border:1.5px solid var(--skv-filet);border-radius:var(--skv-r-choix);
  background:var(--skv-carte);color:var(--skv-foret-fonce);
  font-size:.84rem;font-weight:600;cursor:pointer;transition:border-color .18s,background .18s,color .18s}
.skv-puce:hover{border-color:var(--skv-foret)}
.skv-puce.est-choisie{background:var(--skv-foret-voile);border:2px solid var(--skv-foret);color:var(--skv-foret)}

/* tampon (badge, pastille d'état) : angles 2px, jamais de pilule,
   ombre neutre — jamais de halo coloré */
.skv-tampon{display:inline-block;padding:.35em .85em;border-radius:var(--skv-r-tampon);
  background:var(--skv-cuivre);color:#fff;font-size:.68rem;font-weight:700;
  letter-spacing:.08em;text-transform:uppercase;transform:rotate(-3deg);
  box-shadow:0 4px 10px rgba(34,33,30,.22),inset 0 1px 0 rgba(255,255,255,.16)}

/* champ */
.skv-champ{background:var(--skv-carte);border:1.5px solid var(--skv-filet);
  border-radius:var(--skv-r-action);padding:1em 1.4em;font-size:16px;color:var(--skv-encre)}
.skv-champ:focus{outline:2px solid var(--skv-foret);outline-offset:1px;border-color:var(--skv-foret)}

/* focus visible partout — jamais supprimé.
   Deux anneaux empilés : trait d'encre collé à l'élément, halo crème derrière.
   Aucune couleur unique ne tient sur les deux fonds du site (il faudrait une
   luminance <= 0,2886 pour 3:1 sur la crème et >= 0,2996 pour 3:1 sur le vert
   forêt : l'intervalle est vide). Là, jamais moins de 8,7:1, où que ce soit.
   Le !important passe devant les 70 règles de composants, qui n'en ont pas —
   dont 57 en cuivre à 2,41:1 et 13 en outline:none. Offset à zéro pour ne pas
   être rogné par un parent en overflow:hidden. */
:focus-visible{outline:2px solid var(--skv-encre-prof) !important;
  outline-offset:0 !important;box-shadow:0 0 0 4px var(--skv-creme) !important}

/* jauge de progression : remplissage en transform, JAMAIS en width animé */
.skv-jauge{height:6px;background:var(--skv-sable-fonce);border-radius:99px;overflow:hidden}
.skv-jauge i{display:block;height:100%;width:100%;background:var(--skv-foret);
  border-radius:99px;transform:scaleX(0);transform-origin:left;
  transition:transform .5s var(--skv-courbe)}
/* usage JS : jauge.style.transform = 'scaleX(' + (part entre 0 et 1) + ')' */

/* bandeau de réassurance : la seule inversion pleine largeur */
.skv-bandeau-sombre{background:var(--skv-foret-fonce);color:var(--skv-encre-inverse)}
.skv-bandeau-sombre h2,.skv-bandeau-sombre h3{color:#fff}
.skv-bandeau-sombre .skv-eyebrow{color:var(--skv-cuivre-clair)}

/* ---- E. Garde-fous ------------------------------------------------------ */
/* pas d'animation de mise en page : ni width, ni height, ni padding.
   transform + opacity uniquement. */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:.01ms !important;animation-duration:.01ms !important}
  .skv-carte:hover,.skv-bouton:hover{transform:none}
}


/* ============================================================================
   PONT KOADBOOTH — angles francs sur l'existant
   ----------------------------------------------------------------------------
   19 août 2026. La peau ci-dessus pose les jetons ; ce pont applique la règle
   « 4 agit, 6 choisit, 12 contient, 2 tamponne » aux composants déjà en place,
   par sélecteurs explicites relevés sur les 43 pages du site. Le !important
   est assumé : chaque widget porte son rayon en dur, et on ne recolle pas
   43 widgets pour changer un rayon.
   Restent volontairement tels quels : les cercles (50 %), les jauges et
   pistes de progression, l'image du héros de l'accueil (coin signature),
   le widget WhatsApp, le badge d'ancrage du prix, la navigation.
   ========================================================================== */

/* ---- 4 px : tout ce qui agit — boutons, champs, envois ------------------- */
.kbz-btn,.kce-btn,.kcg-btn,.kdev-cta,.kdev-submit,.kem-submit,.kfr-btn,.kl-btn,
.kl-card-cta,.kml-btn,.knav-cta,.knav-tel,.koc-btn,.koc-sc-cta,.koc-sc-b,.kp-btn,
.kpc-btn,.kpl-btn,.kps-b,.kps-clear,.krn-btn,.ksb-btn,.kv-btn,.kx-btn,.kyv-btn,
.kex-btn,.kss-btn,.kti-btn,.kpm-btn,.kag-btn,.kra-btn,.kce-bar a,.kbz-bar a,
.kfr-bar a,.kp-bar a,.kpl-bar a,.kv-bar a,.kx-bar a,.kyv-bar a,.kx-mbtn,.kp-mbtn,
.kbz-mbtn,.krl-btn,.ksl-btn,.klc-btn,.kor-btn,.kop-btn,.krl-ext a,.ksl-ext a,
.krl-lire,.ksl-lire,.krn-lnk,.ksb-lnk,.kcg-pill,.kml-pill,.kpc-pill,
.kbl-btn,.kbl-load,
.kdi .kdi-btn,.kdi .kdi-reset,.ken .ken-btn,.kmb .kmb-btn,.kmb .kmb-reset,
.kpa .kpa-b,.kpr-b,.kps2-b,
.kdev-field input,.kdev-field select,.kdev-field textarea,
.kem-f input,.kem-f select,.kem-f textarea,
.krn-f input,.krn-f select,.krn-f textarea,
.ksb-f input,.ksb-f select,.ksb-f textarea,
.kbz-field input,.kbz-field select,.kbz-field textarea,
.kfr-field input,.kfr-field select,.kfr-field textarea,
.kp-field input,.kp-field select,.kp-field textarea,
.kpl-field input,.kpl-field select,.kpl-field textarea,
.kb-dispo-form input,.kct-f input,.kct-f select,.kct-f textarea,
.kdi .kdi-ch input,.ken .ken-age input,.kpa .kpa-ch input,.kpa .kpa-ch select,
.kps2-ch input,.kps2-ch select,.kcg-srch input,.kps-search input,
.ke-bar button,.ke-btn,.ke-sim-fields input,.ke-sim-fields select,
.kfr-exit-acts button,.kfr-exit-acts a {
	border-radius: var(--skv-r-action) !important;
}

/* ---- 6 px : les choix — puces, options, segments, onglets ---------------- */
.kbl-chip,.kl-chip,.kmb .kmb-opt,.kmb .kmb-mois button,.kct-path,.kct-zl a,
.kps-c,.kex-crit,.koc-mv > button,.koc-hub a,.kb-orient-opts button,
.klc-seg button,.klc-opts button,.kop-opts button,.krn-opts button,
.ksb-opts button,.kb-segment-price {
	border-radius: var(--skv-r-choix) !important;
}

/* ---- 12 px : tout ce qui contient — cartes, panneaux, images ------------- */
.kcg-id,.kcg-clair,.kcg-ec,.kcg-mtoc,.kcg-vide,.kml-note,.kml-f,
.kpc-note,.kpc-tw,.kpc-base,.kpc-d,.kpc-pub,
.kdi .kdi-tldr,.kdi .kdi-toc,.kdi .kdi-note,.kdi .kdi-warn,.kdi .kdi-franc,
.kdi .kdi-grille,.kdi .kdi-sim,.kdi .kdi-res,.kdi .kdi-img img,.kdi .kdi-next a,
.kdi .kdi-kpi div,
.ken .ken-tldr,.ken .ken-toc,.ken .ken-note,.ken .ken-warn,.ken .ken-franc,
.ken .ken-frise,.ken .ken-calc,.ken .ken-cres,.ken .ken-alerte,
.ken .ken-img img,.ken .ken-next a,
.kmb .kmb-tldr,.kmb .kmb-toc,.kmb .kmb-note,.kmb .kmb-warn,.kmb .kmb-franc,
.kmb .kmb-comp,.kmb .kmb-test,.kmb .kmb-res,.kmb .kmb-verdict,
.kmb .kmb-img img,.kmb .kmb-next a,
.kvh-note,.kvh-memo,.kvh-img img,.kvh-tldr,.kvh-toc,.kvh-franc,.kvh-next a,
.kor-franc,.kor-img,.kop-img,.kpc-slide,
.krl-toc,.ksl-toc,.krl-lieu,.ksl-lieu,.krl-offres,.ksl-offres,
.krl-img,.ksl-img,.krl-fiche,.ksl-fiche,.krl-conseil,.ksl-conseil,
.krl-oc,.ksl-oc,.klc-toc,.klc-case,.klc-tool,.klc-vd,.klc-franc,.klc-img,
.klc-tw,.klc-res,.klc-diag,.kpc-diag,.kex-check,.kss-check,
.klc-exit-card,.kpc-exit-card,.kce-slider,.kl-slider,.kv-slider,
.kbl-card,.kbl-feat,.kbl-state,.kbl-box,.kbl-skel-card,.kbl-ate img,
.kct-card,.kct-msg-in,.kb-estim-out,.kb-blog-card,.kb-review,
.kb .kb-atelier-main,.kb .kb-shop-front,.kb .kb-shop-back,.kb-exit,
.kb-gal-item,.koc-dc,.koc-res,.koc-fbox,.koc-md,.koc-sc-c,.koc-inc-c,
.koc-cfg-p,.koc-duo-f,.kpa.kpa,.kps2,.kpr,.koad-ff-host {
	border-radius: var(--skv-r-contenant) !important;
}

/* les encarts à filet gauche gardent leur gauche à vif */
.krl-note,.ksl-note,.klc-note,.kor-note,.kop-note,.kpc-note,
.krl-mid,.ksl-mid,.klc-mid,.kor-mid,.kop-mid,.kpc-mid,
.kor-err,.kop-err,.koc-fmsg,.kb-dispo-msg,.kb-orient-out,.koc-no-c {
	border-radius: 0 var(--skv-r-contenant) var(--skv-r-contenant) 0 !important;
}

/* ---- 2 px : les tampons — badges, étiquettes, surlignages ---------------- */
.kbl-badge,.kbl-skel,.koc-tag,.koc-tl .koc-tag,.kb-badge,
.kdi .kdi-tag,.kpb-duo-tag,.kcg-tbd,.kml-tbd,.kpc-tbd,mark {
	border-radius: var(--skv-r-tampon) !important;
}

/* ---- Les colles : rien ne passe sous la barre de navigation ------------- */
/* 19 aout 2026, au soir. La barre du menu est fixe (75 px en large, 65 sous
   680 px, releves au rendu) et sept panneaux recapitulatifs collants
   etaient regles a top:20px, quatre barres a top:0 : au defilement, tous
   glissaient dessous. Un jeton, et chaque colle s'y accroche. Le rail du
   blog s'empile sous SA barre de filtres (72 px), d'ou son decalage plus
   grand. Les deux rails deja regles a 100 et 120 px passent au-dessus de
   la barre sans correction : on n'y touche pas. */
:root{ --skv-en-tete:76px; }
@media (max-width:680px){ :root{ --skv-en-tete:66px; } }
/* Vue connectee seulement : la barre d'administration WordPress (32 px,
   46 sous 783 px) pousse le menu d'autant — releve le 19 aout : le menu
   passe a top:32px et finit a 107 px. Les visiteurs ne sont pas concernes. */
body.admin-bar{ --skv-en-tete:108px; }
@media (max-width:782px){ body.admin-bar{ --skv-en-tete:112px; } }

.kdev-recap,.ke-sim-recap,.kv-roi-out,.kce-out,
.kbz-out,.kp-out,.kx-out {
	top: calc(var(--skv-en-tete) + 20px) !important;
}
.koc-nav,.kps-filtres,.kbl-filters {
	top: var(--skv-en-tete) !important;
}
.kbl-side {
	top: calc(var(--skv-en-tete) + 82px) !important;
}

/* Connecte a l'administration : la barre d'admin decale le menu de 32 px
   (46 sous 783 px — regle du widget de menu), donc les colles aussi. Les
   visiteurs ne sont pas concernes. Pose sur body : pour les descendants,
   la valeur du body l'emporte sur celle du :root. */
body.admin-bar { --skv-en-tete: 108px; }
@media (max-width:782px){ body.admin-bar { --skv-en-tete: 122px; } }
@media (max-width:680px){ body.admin-bar { --skv-en-tete: 112px; } }

/* Le champ de recherche du blog avait echappe au pont : c'etait la
   derniere pilule du site hors badge d'ancrage. Un champ agit : 4 px. */
.kbl-search input { border-radius: var(--skv-r-action) !important; }

/* ============================================================================
   FINITIONS — 20 aout 2026
   ----------------------------------------------------------------------------
   Passe de relecture sur l'accueil, le blog, un article et la page contact,
   en 1280 px et en 375 px. Contrastes calcules, pas juges a l'oeil.
   Ce qui suit ne corrige que des defauts mesures : rien d'esthetique.
   ========================================================================= */

/* Le cuivre porte de l'encre, jamais du blanc.
   Blanc sur #C89B7B : 2,49:1 — sous le seuil AA de 4,5:1, et c'est le bouton
   de devis du blog, donc le plus clique. Encre #22211E sur le meme fond :
   6,46:1. Le pied de page fait deja comme ca (.kfoot-act-dev), on aligne.
   La regle d'origine porte un !important, il en faut un ici aussi. */
.kbl-btn.kbl-btn-copper {
	color: var(--skv-encre-prof, #22211E) !important;
}

/* Angles restes hors du systeme.
   Releve sur les quatre gabarits : 3 px sur les actions et les champs,
   5 px sur les blocs de la page contact, 10 px sur le bandeau cookies.
   Rappel : 4 agit, 6 choisit, 12 contient, 2 tamponne. */
.kbl-btn,
.kfoot .kfoot-act,
.kct-dl,
.kct-msg-b {
	border-radius: var(--skv-r-action) !important;
}

/* Le fichier traite deja les champs comme des actions (4 px), pas comme des
   choix : on s'y tient, sinon la page contact serait la seule a 6 px. */
.kct-mf input,
.kct-mf textarea,
.kct-mf select,
.kct-btn,
.kvh-btn,
.kpb-btn,
.kfr-ext a,
.kfr-lire,
.kpb-duo-pr,
.koc-f input,
.koc-f select,
.koc-f textarea,
.koc-dc input {
	border-radius: var(--skv-r-action) !important;
}

.kct-seg button,
.kpb-seg button,
.kpm-seg button,
.kti-seg button,
.kpb-opts button {
	border-radius: var(--skv-r-choix) !important;
}

/* Les 51 conteneurs restes a 5 px ou 10 px : sommaires, reponses courtes,
   memos, verdicts, panneaux de simulateur, cartes « pour aller plus loin ».
   Chacun recoit ce que le pont donne deja a ses freres de meme suffixe :
   .kex-toc s'aligne sur les sept autres -toc, .kop-next sur les quatre
   autres -next, et ainsi de suite. Les orphelins sans frere (-us, -verd,
   -panel, -aide, -col, -key...) sont tous des blocs qui contiennent : 12 px. */
.kct-st,
.kct-cc,
.kct-reo,
.kct-zc,
.kct-recap,
.kex-next, .kex-toc, .kex-us, .kex-verd, .kex-vsc,
.kfr-lieu, .kfr-offres, .kfr-toc,
.klc-next,
.koc-av-c, .koc-dev, .koc-duo2-i, .koc-fx-c, .koc-mo-rc img,
.kop-memo, .kop-next, .kop-place, .kop-sel, .kop-tldr, .kop-toc,
.kor-memo, .kor-next, .kor-tldr, .kor-toc,
.kpb-aide, .kpb-arg, .kpb-duo-c, .kpb-loc-i, .kpb-panel,
.kpb-prof, .kpb-rc, .kpb-res, .kpb-sim,
.kpc-col, .kpc-next, .kpc-tldr, .kpc-toc, .kpc-us, .kpc-verdict,
.kpm-ff, .kpm-key, .kpm-next, .kpm-sim, .kpm-toc,
.kps-d, .kps-vide,
.kss-ex, .kss-next, .kss-toc, .kss-us, .kss-verd,
.kti-case, .kti-fc, .kti-next, .kti-sim, .kti-tldr, .kti-toc,
.kb-exit {
	border-radius: var(--skv-r-contenant) !important;
}

/* Volontairement laisses de cote, ce ne sont pas des panneaux :
   les pistes de curseurs (.kpb-sim / .kpm-sim / .kti-sim / .kb-estim
   input[type=range], .krn-range, .ksb-range) et les jauges (.klc-bar,
   .koc-prog span), ou un angle de 12 px sur 6 px de haut n'aurait pas de
   sens ; et .kwa-btn, la pastille WhatsApp, qui joue le badge d'ancrage
   -- le seul endroit ou la DA autorise encore la pilule. */

/* Bandeau cookies de Blocksy : angles de la maison, et son vert #4A6B46
   n'est pas le notre. Deux verts a l'ecran, ca se voit. */
#cookie-notification .container,
.cookie-notification .container {
	border-radius: var(--skv-r-contenant) !important;
}
.ct-cookies-accept-button,
.ct-cookies-decline-button {
	border-radius: var(--skv-r-action) !important;
	min-height: 40px;
}
.ct-cookies-accept-button {
	background: var(--skv-foret) !important;
	border-color: var(--skv-foret) !important;
}

/* Cibles tactiles.
   Le critere 2.5.8 demande 24 px. Deux elements passent dessous :
   « Lire l'article » du blog (21 px de haut) et les cases a cocher des
   formulaires (16 a 17 px). Les autres commandes tiennent les 24 px sans
   atteindre les 44 px confortables : on elargit la zone de frappe sans
   toucher au dessin, par un pseudo-element centre. Aucune des cibles
   visees n'avait deja un ::after, verifie avant d'ecrire. */
.kbl-more,
.kwa-x,
.kb-hero-minilink,
.knav-logo,
.kfoot-soc a {
	position: relative;
}
.kbl-more::after,
.kwa-x::after,
.kb-hero-minilink::after,
.knav-logo::after,
.kfoot-soc a::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 100%;
	min-width: 44px;
	height: 100%;
	min-height: 44px;
}

.kct-f input[type="checkbox"],
.kct-f input[type="radio"],
.kct-mcons input[type="checkbox"],
.kct-mf input[type="checkbox"],
.ff-el-form-check input[type="checkbox"],
.ff-el-form-check input[type="radio"] {
	min-width: 24px;
	min-height: 24px;
}


/* ============================================================================
   SUR-TITRES DE SECTION — 21 aout 2026
   ----------------------------------------------------------------------------
   116 sur-titres de section etaient composes en cuivre decoratif #C89B7B sur
   creme ou sable, en 11-12 px : 2,41:1 et 2,21:1, tres en dessous des 4,5:1
   exiges pour du texte de cette taille. Mesure refaite a la main sur trois
   pages avant correction.

   Le site avait deja la bonne convention, mais pas partout : sept familles
   (kct, kdi, ken, kmb, kor, kts, kvh) emploient un jeton --kX-copper-tx en
   #96603B ou #7E4C2B, lisible. Les quatorze autres employaient --kX-copper,
   qui est la teinte DECORATIVE — celle que la DA interdit explicitement en
   texte sur fond clair.

   On ne redefinit pas --kX-copper : il sert aussi a des filets et des fonds,
   ou il est parfaitement legitime. On ne corrige que les sur-titres, et
   uniquement des quatorze familles fautives : les sept deja conformes
   restent a 6,87:1, verifie apres coup.

   Classe doublee parce que les regles de page portent !important a
   specificite (0,1,0) : a importance egale, c'est la specificite qui tranche.
   Resultat mesure : 5,19:1 sur creme, 4,76:1 sur sable. */
.kcm-kick.kcm-kick, .kcm-kicker.kcm-kicker,
.kex-kick.kex-kick, .kex-kicker.kex-kicker,
.kfr-kick.kfr-kick, .kfr-kicker.kfr-kicker,
.kgl-kick.kgl-kick, .kgl-kicker.kgl-kicker,
.klc-kick.klc-kick, .klc-kicker.klc-kicker,
.kop-kick.kop-kick, .kop-kicker.kop-kicker,
.kpb-kick.kpb-kick, .kpb-kicker.kpb-kicker,
.kpc-kick.kpc-kick, .kpc-kicker.kpc-kicker,
.kpm-kick.kpm-kick, .kpm-kicker.kpm-kicker,
.krl-kick.krl-kick, .krl-kicker.krl-kicker,
.ksl-kick.ksl-kick, .ksl-kicker.ksl-kicker,
.ksm-kick.ksm-kick, .ksm-kicker.ksm-kicker,
.kss-kick.kss-kick, .kss-kicker.kss-kicker,
.kti-kick.kti-kick, .kti-kicker.kti-kicker {
	color: var(--skv-cuivre-encre) !important;
}

/* Les sections sombres passent le sur-titre en blanc : on repose la regle
   apres, a (0,3,0), pour qu'elle garde la main. */
.ink .kcm-kick.kcm-kick, .ink .kcm-kicker.kcm-kicker,
.ink .kex-kick.kex-kick, .ink .kex-kicker.kex-kicker,
.ink .kfr-kick.kfr-kick, .ink .kfr-kicker.kfr-kicker,
.ink .kgl-kick.kgl-kick, .ink .kgl-kicker.kgl-kicker,
.ink .klc-kick.klc-kick, .ink .klc-kicker.klc-kicker,
.ink .kop-kick.kop-kick, .ink .kop-kicker.kop-kicker,
.ink .kpb-kick.kpb-kick, .ink .kpb-kicker.kpb-kicker,
.ink .kpc-kick.kpc-kick, .ink .kpc-kicker.kpc-kicker,
.ink .kpm-kick.kpm-kick, .ink .kpm-kicker.kpm-kicker,
.ink .krl-kick.krl-kick, .ink .krl-kicker.krl-kicker,
.ink .ksl-kick.ksl-kick, .ink .ksl-kicker.ksl-kicker,
.ink .ksm-kick.ksm-kick, .ink .ksm-kicker.ksm-kicker,
.ink .kss-kick.kss-kick, .ink .kss-kicker.kss-kicker,
.ink .kti-kick.kti-kick, .ink .kti-kicker.kti-kicker {
	color: #FFFFFF !important;
}

/* ============================================================================
   BLOC AVIS GOOGLE — 21 aout 2026
   ----------------------------------------------------------------------------
   Habillage du shortcode [koad_avis] rendu par l'extrait PHP du meme nom.
   Le bloc ne s'affiche que s'il y a de vrais avis : pas de squelette, pas de
   "avis a venir". Contrastes calcules, pas juges : sur-titre cuivre-encre
   4,76:1 sur sable, etoiles 5,40:1 sur blanc, date 7,03:1 sur blanc.

   Aucun selecteur d'element a l'interieur de .kav : les regles composant
   restent a (0,1,0) et rien ne vient les ecraser par un .kav p a (0,1,1).
   Ce piege a deja coute trois corrections sur ce site. */

.kav {
	background: var(--skv-sable);
	border-top: 1px solid var(--skv-filet);
	border-bottom: 1px solid var(--skv-filet);
	padding: var(--skv-section, clamp(3.75rem, 8vw, 7.5rem)) 0;
}
.kav-in {
	max-width: 1280px;
	margin: 0 auto;
	padding: 0 clamp(24px, 4vw, 36px); /* plancher aligne sur les 24 px des conteneurs de page */
}
.kav-kick {
	font-family: var(--skv-texte);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .125em;
	text-transform: uppercase;
	color: var(--skv-cuivre-encre);
	margin: 0 0 10px;
}
.kav-t {
	font-family: var(--skv-affiche);
	font-weight: 900;
	font-size: clamp(1.7rem, 3.4vw, 2.8rem);
	line-height: 1.2;
	letter-spacing: -.01em;
	color: var(--skv-encre);
	margin: 0 0 12px;
	text-wrap: balance;
}
.kav-syn {
	font-family: var(--skv-texte);
	font-size: 1rem;
	color: var(--skv-encre-douce);
	margin: 0 0 34px;
}
.kav-syn strong {
	color: var(--skv-encre);
	font-weight: 700;
	font-variant-numeric: tabular-nums;
}
.kav-sep { color: var(--skv-cuivre-encre); padding: 0 6px; }

.kav-liste {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
}
.kav-c {
	background: var(--skv-carte);
	border: 1px solid var(--skv-filet);
	border-radius: var(--skv-r-contenant);
	padding: 24px;
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 14px;
}
.kav-et { display: inline-flex; gap: 3px; }
.kav-e { width: 16px; height: 16px; fill: var(--skv-filet); }
.kav-e.on { fill: var(--skv-cuivre-encre); }

.kav-q {
	font-family: var(--skv-texte);
	font-size: 1rem;
	line-height: 1.65;
	color: var(--skv-encre);
	margin: 0;
	border: 0;
	padding: 0;
	quotes: none;
	flex: 1;
}
.kav-b {
	font-family: var(--skv-texte);
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 4px 10px;
	border-top: 1px solid var(--skv-filet);
	padding-top: 14px;
}
.kav-n { font-size: .95rem; font-weight: 600; color: var(--skv-encre); }
.kav-d { font-size: .88rem; color: var(--skv-encre-douce); }

.kav-src {
	font-family: var(--skv-texte);
	font-size: .95rem;
	margin: 26px 0 0;
}
.kav-src a {
	color: var(--skv-foret);
	font-weight: 600;
	text-decoration: none;
	border-bottom: 1px solid var(--skv-cuivre);
	padding-bottom: 1px;
	transition: border-color .25s var(--skv-courbe);
}
.kav-src a:hover { border-bottom-color: var(--skv-foret); }

@media (max-width: 980px) { .kav-liste { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) { .kav-liste { grid-template-columns: 1fr; } }
@media (prefers-reduced-motion: reduce) { .kav-src a { transition: none; } }


/* ============================================================================
   FINITIONS — 22/08/2026
   ----------------------------------------------------------------------------
   1. Encadres : on retire le filet d accent pose sur un seul cote.
   2. Messages d etat : la couleur passe par le contour complet, pas par un trait.
   3. Page contact : on releve le plancher de lisibilite.
   4. Tableaux : ils tiennent dans un ecran de telephone, sans avoir a glisser.
   ========================================================================== */

/* ---- 1. ENCADRES ----------------------------------------------------------
   Soixante-trois blocs portaient exactement le meme filet vertical colle a
   gauche. Repete a cette echelle, ce n est plus une intention de mise en page :
   c est une signature de gabarit. On assume le conteneur — contour complet au
   filet, rayon 12 px, celui que la charte reserve a ce qui « contient ». */
.kag-note, .kag-pull, .kap-birth-pull, .kavp-note, .kb-atelier-quote,
.kb-orient-out, .kb-price-anchor, .kb-why-quote, .kce-note, .kce-pull,
.kcm-mid, .kcm-note, .kct-reco, .kdi .kdi-note, .kdi .kdi-tldr, .kem-recap,
.ken .ken-cres, .ken .ken-note, .ken .ken-tldr, .kex-mid, .kex-note,
.kfr-mid, .kfr-note, .kfr-season, .kfr-story-pull, .kgl-mid, .kgl-note,
.klc-mid, .klc-note, .kmb .kmb-note, .kmb .kmb-tldr, .kmb .kmb-verdict,
.kop-mid, .kop-note, .kor-mid, .kor-note, .kpb-note, .kpc-mid, .kpc-note,
.kpi-note, .kpi-pull, .kpm-mid, .kpm-note, .kra-note, .kra-pull,
.krl-mid, .krl-note, .krn-sig, .krn-spot-item, .ksb-sig, .ksb-spot-item,
.ksl-mid, .ksl-note, .ksm-mid, .ksm-note, .kss-mid, .kss-note,
.kti-mid, .kti-note, .kts .kts-note, .kts .kts-tldr, .kvh-mid, .kvh-note {
	border: 1px solid var(--skv-filet) !important;
	border-radius: var(--skv-r-contenant) !important;
}

/* ---- 2. MESSAGES D ETAT ---------------------------------------------------
   Ici le trait de gauche portait une information : vert = c est bon, terre =
   ca coince. On ne peut donc pas se contenter de l enlever. La couleur passe
   au contour complet et a un fond tres pale : meme signal, sans le tic. */
.kb-dispo-msg.ok, .kct-mrep.ok, .kdi .kdi-res.ok, .kmb .kmb-res.ok,
.krn-fmsg.ok, .ksb-fmsg.ok {
	border: 1px solid var(--skv-foret) !important;
	background: var(--skv-foret-voile) !important;
	border-radius: var(--skv-r-contenant) !important;
}
.kb-dispo-msg.ko, .kct-mrep.ko, .kdi .kdi-res.non, .kmb .kmb-res.ko,
.krn-fmsg.ko, .ksb-fmsg.ko {
	border: 1px solid var(--skv-terre) !important;
	background: rgba(140, 90, 79, .06) !important;
	border-radius: var(--skv-r-contenant) !important;
}

/* ---- 3. PAGE CONTACT ------------------------------------------------------
   Cette page etait la seule ecrite entierement en pixels, avec douze reperes
   entre 11 et 13 px. On repasse en rem — la taille suit alors les reglages du
   visiteur — et on releve le plancher sans toucher a la hierarchie. */
/* Trois reperes rendaient encore a 10,5 et 11,5 px : sous le seuil ou un
   texte cesse d etre confortable, meme pour une etiquette. */
.kct-heye, .kct-path-i, .kct-reco-l {
	font-size: .8rem !important;
}
.kct-cc-l, .kct-kick, .kct-msg-e, .kct-recap-t, .kct-stept {
	font-size: .8rem !important;
}
.kct-pf span, .kct-st-d {
	font-size: .86rem !important;
}
.kct-msg-n, .kct-path-p em, .kct-recap dt, .kct-ro span, .kct-state-n {
	font-size: .92rem !important;
}

/* ---- 4. TABLEAUX SUR TELEPHONE --------------------------------------------
   Les comparatifs Original / Signature debordaient : il fallait les faire
   glisser lateralement pour lire la derniere colonne, ce que personne ne fait.
   On fixe la repartition des colonnes, on autorise la cesure, et on rend au
   conteneur son debordement visible : le tableau tient dans l ecran. */
@media (max-width: 760px) {
	.elementor-widget-html [class*="table-wrap"],
	.elementor-widget-html [class$="-tw"],
	.elementor-widget-html .kcm-tw,
	.elementor-widget-html .klc-tw {
		overflow-x: visible !important;
	}
	.elementor-widget-html table {
		table-layout: fixed !important;
		min-width: 0 !important;
		width: 100% !important;
		font-size: .84rem !important;
	}
	.elementor-widget-html table th,
	.elementor-widget-html table td {
		padding: 9px 7px !important;
		overflow-wrap: anywhere;
		hyphens: auto;
	}
}

/* ---- 5. CENTRAGE ---------------------------------------------------------
   Ce paragraphe etait borne a 620 px sans marges automatiques : dans un
   conteneur de 1280 px il se collait a gauche, decale de 310 px par rapport
   au titre et aux boutons qu il accompagne. Seul cas du site, verifie page
   par page. */
/* Classe doublee : le CSS de la page pose deja margin:26px 0 0 !important,
   a specificite egale et plus loin dans le document. On passe devant en
   doublant la classe, et on preserve sa marge haute. */
.kb-final-tel.kb-final-tel {
	margin: 26px auto 0 !important;
}

/* ---- 6. MAILLAGE INTERNE -------------------------------------------------
   Composant unique, pose en fin de page sur celles qui manquaient de liens
   sortants. Meme grammaire que le reste : pastille a 6 px, filet, cuivre au
   survol. */
.kmail { background: var(--skv-sable, #F4F1EA); padding: 44px 0; }
.kmail-in { max-width: 1220px; margin: 0 auto; padding: 0 24px; }
.kmail-k { display: flex; align-items: center; gap: 12px; font-size: .72rem;
	font-weight: 600; letter-spacing: .2em; text-transform: uppercase;
	color: var(--skv-cuivre-encre, #8A6244); margin: 0 0 14px; }
.kmail-k::after { content: ""; flex: 1; height: 1px; background: var(--skv-filet, #EAE6DF); }
.kmail h2 { font-family: var(--skv-affiche); font-size: clamp(1.35rem, 2.3vw, 1.8rem);
	margin: 0 0 18px; color: var(--skv-encre-prof, #22211E); }
.kmail-l { display: flex; flex-wrap: wrap; gap: 10px; }
.kmail-l a { display: inline-block; padding: 10px 16px; border-radius: var(--skv-r-choix, 6px);
	background: #fff; border: 1px solid var(--skv-filet, #EAE6DF);
	color: var(--skv-encre, #2C2825) !important; text-decoration: none; font-size: .92rem;
	transition: border-color .18s ease, color .18s ease; }
.kmail-l a:hover { border-color: var(--skv-foret, #3A4E3A); color: var(--skv-foret, #3A4E3A) !important; }

/* ---- 7. FINITIONS MOBILE — 22/08/2026 -------------------------------------
   Releve d un audit des 48 pages a 375 px de large. Aucune ne debordait
   horizontalement ; restaient deux defauts reels.

   Les classes sont doublees a dessein : plusieurs pages posent ces valeurs
   avec !important dans leur propre CSS, declare plus loin dans le document.
   A specificite egale, c est le dernier qui gagne — doubler la classe passe
   devant sans avoir a toucher aux 48 pages une par une. */

/* Mentions legales et notes de bas de bloc : elles tombaient entre 11,5 et
   12,5 px. On ne touche pas a la hierarchie, on releve le plancher. */
.fine.fine, .kb-estim-note.kb-estim-note, .kbz-legal.kbz-legal,
.kbz-zone-note.kbz-zone-note, .kdev-fine.kdev-fine, .kdev-hint.kdev-hint,
.ke-fine.ke-fine, .ke-hint.ke-hint, .kem-hint.kem-hint, .kfr-legal.kfr-legal,
.koc-dc-note.koc-dc-note, .koc-res-n.koc-res-n, .koc-sw-n.koc-sw-n,
.kp-help-note.kp-help-note, .kp-legal.kp-legal, .kpb-disc.kpb-disc,
.kpl-legal.kpl-legal, .krn-out-note.krn-out-note, .ksb-out-note.ksb-out-note,
.kv-roi-note.kv-roi-note, .kx-legal.kx-legal, .kyv-legal.kyv-legal {
	font-size: .8rem !important;
	line-height: 1.5;
}

/* Zones tactiles : huit liens de type bloc mesuraient 21 a 23 px de haut.
   Le seuil AA (WCAG 2.5.8) est de 24 px. Les liens en ligne dans un
   paragraphe en sont exemptes : on ne les touche pas. */
@media (max-width: 760px) {
	.kb-hero-minilink.kb-hero-minilink, .kbl-more.kbl-more,
	.kdi-reset.kdi-reset, .kmb-reset.kmb-reset, .koc-duo-l.koc-duo-l,
	.kp-use-link.kp-use-link, .kts-reset.kts-reset, .kx-use-link.kx-use-link {
		min-height: 24px;
		padding-top: 3px;
		padding-bottom: 3px;
	}
}

/* Un dernier tableau debordait de 20 px : du contenu insecable dans une
   cellule imbriquee, que la regle posee sur th et td ne rattrapait pas. */
@media (max-width: 760px) {
	.elementor-widget-html table th *,
	.elementor-widget-html table td * {
		overflow-wrap: anywhere;
		word-break: break-word;
		max-width: 100%;
	}
}

/* Filet de securite tactile : certains liens n ont aucune classe a viser
   (enfants directs de cartes). min-height est sans effet sur un lien en
   ligne, cette regle ne touche donc que les liens de type bloc ou flex —
   ceux que le seuil AA concerne. */
@media (max-width: 760px) {
	.elementor-widget-html a,
	.elementor-widget-html button,
	.kfoot a,
	.kfoot button {
		min-height: 24px;
	}
}

/* Exception assumee : le tableau des traitements de donnees compte quatre
   colonnes et des termes juridiques longs (« précontractuelles »). A 78 px
   de colonne, la cesure couperait ces termes en plein milieu. Pour celui-la
   seulement, le glissement lateral reste preferable a une bouillie. */
@media (max-width: 760px) {
	.kpc-tw.kpc-tw {
		overflow-x: auto !important;
		-webkit-overflow-scrolling: touch;
	}
}

/* ---- 8. ALIGNEMENT DU BLOC D'AVIS -----------------------------------------
   Les pages du site n'emploient pas toutes la meme gouttiere sur telephone :
   28, 30, 34 ou 47 px selon la page. Le bloc d'avis, lui, est global et posait
   le meme retrait partout — d'ou un decrochage de 4 a 6 px sur quatre pages.
   On recale ces quatre-la pour que le bord du bloc tombe pile sur celui du
   texte. Valeurs mesurees, pas estimees : le conteneur Elementor commence a
   10 px, donc retrait vise = bord du texte moins 10. */
@media (max-width: 760px) {
	.home .kav-in,
	.page-id-2985 .kav-in {
		padding-left: 20px !important;
		padding-right: 20px !important;
	}
	.page-id-3748 .kav-in,
	.page-id-3756 .kav-in {
		padding-left: 18px !important;
		padding-right: 18px !important;
	}
}

/* ---- 9. BANDEAU COOKIES ----------------------------------------------------
   Remplace la banniere de Blocksy, qui n'etait qu'informative. Celle-ci pilote
   reellement le consentement (mode consentement Google v2, cf. extrait 3958).
   Grammaire de la charte : creme, filet, rayon 12 pour le contenant, 4 pour
   les boutons, ombre flottante, courbe signature. Aucun verrou de defilement :
   l'ancienne bloquait la page, ce qui est un defaut, pas une contrainte legale.
   ========================================================================== */
.kck {
	position: fixed;
	z-index: 9999;
	left: 20px;
	bottom: 20px;
	width: min(460px, calc(100vw - 40px));
	background: var(--skv-creme, #FDFBF7);
	border: 1px solid var(--skv-filet, #EAE6DF);
	border-radius: var(--skv-r-contenant, 12px);
	box-shadow: var(--skv-ombre-flottante, 0 6px 22px rgba(34, 33, 30, .22));
	padding: 22px 24px;
	font-family: 'General Sans', 'Inter', -apple-system, 'Segoe UI', sans-serif;
	color: var(--skv-encre, #2C2825);
	transform: translateY(16px);
	opacity: 0;
	transition: transform .45s var(--skv-courbe, cubic-bezier(.16, 1, .3, 1)), opacity .45s ease;
}
.kck.kck-on { transform: translateY(0); opacity: 1; }

.kck-k {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: .68rem;
	font-weight: 600;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: var(--skv-cuivre-encre, #8A6244);
	margin: 0 0 10px;
}
.kck-k::after { content: ""; flex: 1; height: 1px; background: var(--skv-filet, #EAE6DF); }

.kck-t { margin: 0 0 16px; font-size: .93rem; line-height: 1.55; color: var(--skv-encre-douce, #5A544F); }
.kck-t a { color: var(--skv-cuivre-encre, #8A6244); text-decoration: underline; text-underline-offset: 2px; }
.kck-t a:hover { color: var(--skv-foret, #3A4E3A); }

.kck-b { display: flex; flex-wrap: wrap; gap: 10px; }
.kck-b button {
	flex: 1 1 auto;
	min-height: 24px;
	padding: 11px 20px;
	border-radius: var(--skv-r-action, 4px);
	font: inherit;
	font-size: .92rem;
	font-weight: 600;
	cursor: pointer;
	border: 1px solid transparent;
	transition: background .18s ease, border-color .18s ease, color .18s ease;
}
.kck-oui { background: var(--skv-terre, #8C5A4F); border-color: var(--skv-terre, #8C5A4F); color: #fff; }
.kck-oui:hover { background: #75463d; border-color: #75463d; }
.kck-non { background: transparent; border-color: var(--skv-filet, #EAE6DF); color: var(--skv-foret, #3A4E3A); }
.kck-non:hover { border-color: var(--skv-foret, #3A4E3A); background: rgba(58, 78, 58, .05); }

@media (max-width: 560px) {
	.kck { left: 12px; right: 12px; bottom: 12px; width: auto; padding: 18px 18px 20px; }
	.kck-b button { flex: 1 1 100%; }
}
@media (prefers-reduced-motion: reduce) {
	.kck { transition: none; }
}