/* kit-article.css — les styles de lecture du kit article.
 *
 * Posé par site dans /assets/<slug>/kit-article.css, jamais dans un chemin
 * commun : deux sites du parc ne doivent pas se relier en une requête.
 *
 * Tout est porté par la racine .ka-grille que pose KitArticle.astro. Rien ne
 * fuit hors de l'article : un thème qui aurait ses propres styles de article
 * garde les siens ailleurs.
 *
 * Les `!important` de la section « lecture » ne sont pas un tic : la plupart
 * des thèmes habillés imposent la taille de leurs titres en `!important`
 * (astro-citrus le fait) et les H2/H3 sortent alors à la taille du texte
 * courant, illisibles. C'est le défaut constaté le 24/09 sur la démo. Ils sont
 * cantonnés aux propriétés de lecture, jamais à la mise en page.
 *
 * Les couleurs viennent des jetons du site (da.css) : --c-primaire-texte,
 * --c-texte, --c-bord, --c-doux, --c-surface. Aucune teinte en dur.
 */

/* ───────────────────────── mise en page ───────────────────────── */

/* Le kit se règle sur la largeur de SON conteneur : posé dans la colonne étroite
   d'un thème qui a déjà sa barre latérale, il passe en une colonne. */
.ka-cadre { container-type: inline-size; }

.ka-grille {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--e6, 1.5rem);
  align-items: start;
  margin-block: var(--e5, 1.25rem) var(--e8, 4rem);
  font-family: var(--f-texte, system-ui, sans-serif);
  color: var(--c-texte, #1a1a1a);
}

.ka-corps {
  min-width: 0;
  max-width: var(--largeur, 68ch);
}

/* Sous 1100 px, la colonne n'a plus la place d'être une colonne : elle passe
   SOUS l'article, dans l'ordre du document (corps, puis colonne). C'est ce que
   demande la barre latérale du chantier : sur un téléphone, la lecture d'abord,
   le sommaire, les plus lus et l'appel à l'action ensuite. */
.ka-cote { display: block; }

@container (min-width: 1000px) {
  .ka-grille {
    /* la colonne de l'article occupe TOUT l'espace jusqu'à la sidebar, 48 px d'écart au plus (Cedia 27/09 :
       « le texte ne remplit pas la largeur de sa box », trou de 300 px à côté de « Sur cette page ») ; une
       ligne plus longue se compense par la police (18 px) et l'interligne (1,7), jamais par du vide */
    grid-template-columns: minmax(0, 1fr) minmax(15rem, 18rem);
    gap: 3rem;
  }
  .ka-grille > .ka-corps { max-width: none; font-size: 1.125rem; }
  .ka-cadre .ka-corps :is(p, li):not(.ka-tete *) { line-height: 1.7; }
  .ka-cadre .ka-corps :is(.ka-reponse, table, ul, ol, figure) { max-width: none; }
  /* la colonne s'étire sur toute la hauteur de l'article : sinon le bloc collant n'a
     aucune course et la sidebar reste en haut (retour Cedia 25/09) */
  .ka-grille > .ka-cote { align-self: stretch; }
  .ka-cote-in { position: sticky; top: calc(var(--ka-haut, var(--header-h, 72px)) + var(--e4, 1rem)); }
}

/* ───────────────────────── progression de lecture ───────────────────────── */

.ka-progres {
  position: fixed;
  inset: 0 0 auto 0;
  height: 4px;
  background: transparent;
  z-index: 200;
  pointer-events: none;
}
.ka-progres-jauge {
  display: block;
  height: 100%;
  width: 0;
  background: var(--c-primaire, #333);
  transition: width .1s linear;
}

.ka-restant:empty { display: none; }
.ka-restant {
  position: fixed;
  right: 16px;
  bottom: 16px;
  z-index: 200;
  margin: 0;
  padding: .4rem .8rem;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--c-sur-primaire, #fff) !important;
  background: var(--c-primaire, #222) !important;
  border-radius: 999px;
  box-shadow: 0 4px 14px rgba(0, 0, 0, .15);
  opacity: 0;
  transition: opacity .2s;
  pointer-events: none;
}
.ka-restant[data-ka-actif] { opacity: .92; }

/* ───────────────────────── en-tête : note et crédibilité ───────────────────────── */

.ka-entete {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--e3, .75rem) var(--e5, 1.25rem);
  margin: 0 0 var(--e6, 1.5rem);
  padding-bottom: var(--e4, 1rem);
  border-bottom: 1px solid var(--c-bord, #e5e5e5);
}

.ka-note-box { display: flex; align-items: center; gap: .5rem; }
.ka-etoiles { display: inline-flex; gap: 2px; color: var(--c-primaire, #333); }
.ka-etoile { width: 1.05em; height: 1.05em; display: block; }
.ka-note-t { margin: 0; font-size: .85rem; color: var(--c-texte-2, #555); }
.ka-note-v { font-size: 1rem; color: var(--c-texte, #1a1a1a); }
.ka-note-sur { margin-inline: .25rem .5rem; }
.ka-note-n { white-space: nowrap; }

.ka-stats {
  display: flex;
  flex-wrap: wrap;
  gap: var(--e2, .5rem) var(--e4, 1rem);
  margin: 0;
  padding: 0;
  list-style: none;
  font-size: .82rem;
  color: var(--c-texte-2, #555);
}
.ka-stat { display: inline-flex; align-items: center; gap: .35rem; }
.ka-ico { width: 1em; height: 1em; flex: none; }
.ka-stat-v { font-weight: 700; color: var(--c-texte, #1a1a1a); }

.ka-maj {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  margin: 0;
  font-size: .8rem;
  font-weight: 600;
  color: var(--c-primaire-texte, #333);
}
.ka-maj-haut { flex-basis: 100%; }
.ka-cta .ka-ico, .ka-auteur .ka-ico, .ka-lies .ka-ico { vertical-align: -.15em; }

/* ───────────────────────── sommaire ───────────────────────── */

.ka-sommaire {
  padding: var(--e4, 1rem);
  background: var(--c-surface, #fafafa);
  border: 1px solid var(--c-bord, #e5e5e5);
  border-radius: var(--r-carte, 8px);
}
.ka-som-titre {
  display: flex;
  align-items: center;
  gap: .4rem;
  margin: 0 0 var(--e3, .75rem);
  font-family: var(--f-titre, inherit);
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--c-texte-2, #555);
}
.ka-som-liste { margin: 0; padding: 0; list-style: none; counter-reset: none; }
.ka-som-l { margin: 0; }
.ka-som-n3 .ka-som-a { padding-left: var(--e5, 1.25rem); font-size: .82rem; }
.ka-som-a {
  display: flex;
  gap: .5rem;
  padding: .3rem .4rem;
  border-radius: var(--r-bouton, 6px);
  font-size: .86rem;
  line-height: 1.35;
  color: var(--c-texte-2, #555);
  text-decoration: none;
}
.ka-som-a:hover { background: var(--c-doux, #eee); color: var(--c-sur-doux, #111); }
.ka-som-a[aria-current="true"] {
  color: var(--c-primaire-texte, #333);
  font-weight: 600;
  background: var(--c-doux, #eee);
}
.ka-som-num {
  flex: none;
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  font-size: .72rem;
  line-height: 1.6;
  color: var(--c-primaire-texte, #333);
  opacity: .8;
}

@container (max-width: 999px) {
  /* La colonne est sous l'article : c'est elle qui se détache du corps, pas
     chacun de ses blocs. */
  .ka-cote { margin-top: var(--e6, 1.5rem); }
  .ka-som-a { padding-block: .35rem; }
}

/* ───────────────────────── appel à l'action ───────────────────────── */

.ka-cta {
  margin-top: var(--e4, 1rem);
  padding: var(--e4, 1rem);
  background: var(--c-doux, #f2f2f2);
  border-radius: var(--r-carte, 8px);
  color: var(--c-sur-doux, #111);
}
.ka-cta-t {
  margin: 0 0 .3rem;
  font-family: var(--f-titre, inherit);
  font-weight: var(--f-graisse-titre, 700);
  font-size: 1rem;
}
.ka-cta-p { margin: 0 0 .75rem; font-size: .85rem; }
.ka-cta-b {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .5rem .9rem;
  font-size: .85rem;
  font-weight: 600;
  text-decoration: none;
  color: var(--btn-texte, #fff);
  background: var(--btn-fond, #333);
  border: var(--btn-bord, 0 solid transparent);
  border-radius: var(--r-bouton, 6px);
}
.ka-cta-b .ka-ico { width: 1em; height: 1em; }

/* ───────────────────────── encadré auteur ───────────────────────── */

.ka-auteur {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr);
  gap: var(--e4, 1rem);
  margin: var(--e8, 4rem) 0 var(--e6, 1.5rem);
  padding: var(--e5, 1.25rem);
  background: var(--c-surface, #fafafa);
  border: 1px solid var(--c-bord, #e5e5e5);
  border-radius: var(--r-carte, 8px);
}
.ka-auteur-img {
  width: 72px;
  height: 72px;
  object-fit: cover;
  border-radius: 50%;
  background: var(--c-doux, #eee);
}
.ka-auteur-vide {
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--c-texte-2, #555);
}
.ka-auteur-vide .ka-ico { width: 2rem; height: 2rem; }
.ka-auteur-corps { min-width: 0; }
.ka-auteur-k {
  display: flex;
  align-items: center;
  gap: .35rem;
  margin: 0 0 .2rem;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--c-texte-2, #555);
}
.ka-auteur-n {
  margin: 0;
  font-family: var(--f-titre, inherit);
  font-weight: var(--f-graisse-titre, 700);
  font-size: 1.1rem;
}
.ka-auteur-r { margin: .1rem 0 .15rem; font-size: .82rem; color: var(--c-primaire-texte, #333); font-weight: 600; }
/* La spécialité reste affichée sous le rôle : la phrase dit la personne, la
   spécialité dit le domaine, et l'encadré ne perd pas ce que la bio disait. */
.ka-auteur-s { margin: 0 0 .5rem; font-size: .8rem; color: var(--c-texte-2, #555); }
.ka-auteur-b { margin: 0 0 .6rem; font-size: .88rem; line-height: 1.55; color: var(--c-texte-2, #555); }
.ka-auteur-lien {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  font-size: .85rem;
  font-weight: 600;
  color: var(--c-primaire-texte, #333);
}
.ka-auteur-lien .ka-ico { width: 1em; height: 1em; }

/* ───────────────────────── articles liés ───────────────────────── */

.ka-lies { margin-top: var(--e8, 4rem); }
.ka-lies-t {
  display: flex;
  align-items: center;
  gap: .45rem;
  margin: 0 0 var(--e4, 1rem);
  font-family: var(--f-titre, inherit);
  font-weight: var(--f-graisse-titre, 700);
  font-size: 1.15rem;
}
.ka-lies-liste {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: var(--e4, 1rem);
  margin: 0;
  padding: 0;
  list-style: none;
}
.ka-lie { margin: 0; }
.ka-lie-a {
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: hidden;
  text-decoration: none;
  color: inherit;
  background: var(--carte-fond, #fff);
  border: var(--carte-bord, 1px solid var(--c-bord, #e5e5e5));
  border-radius: var(--r-carte, 8px);
  box-shadow: var(--o-carte, none);
}
.ka-lie-a:hover { box-shadow: var(--o-survol, none); }
.ka-lie-img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; display: block; }
.ka-lie-corps { display: flex; flex-direction: column; gap: .35rem; padding: var(--e3, .75rem); }
.ka-lie-t {
  font-family: var(--f-titre, inherit);
  font-size: .95rem;
  font-weight: var(--f-graisse-titre, 700);
  line-height: 1.3;
  color: var(--carte-encre, #1a1a1a);
}
.ka-lie-m { font-size: .76rem; color: var(--carte-encre-2, #666); }

/* ───────────────────────── plus lus cette semaine ─────────────────────────
   Second bloc du même conteneur sticky, sous le sommaire : même cadre que lui,
   même surface, pour que la colonne se lise comme un seul objet. */

.ka-plus-lus {
  margin-top: var(--e4, 1rem);
  padding: var(--e4, 1rem);
  background: var(--c-surface, #fafafa);
  border: 1px solid var(--c-bord, #e5e5e5);
  border-radius: var(--r-carte, 8px);
}
.ka-pl-titre {
  display: flex;
  align-items: center;
  gap: .4rem;
  margin: 0 0 var(--e3, .75rem);
  font-family: var(--f-titre, inherit);
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--c-texte-2, #555);
}
.ka-pl-liste { margin: 0; padding: 0; list-style: none; }
.ka-pl-l { margin: 0; border-top: 1px solid var(--c-bord, #e5e5e5); }
.ka-pl-l:first-child { border-top: 0; }
.ka-pl-a {
  display: flex;
  gap: .6rem;
  padding: .55rem 0;
  text-decoration: none;
  color: inherit;
}
.ka-pl-a:hover .ka-pl-t { color: var(--c-primaire-texte, #333); }
.ka-pl-num {
  flex: none;
  font-family: var(--f-titre, inherit);
  font-style: italic;
  font-size: 1.15rem;
  font-weight: 800;
  line-height: 1.15;
  color: var(--c-primaire-texte, #333);
  opacity: .55;
}
.ka-pl-corps { display: flex; flex-direction: column; gap: .2rem; min-width: 0; }
.ka-pl-t { font-size: .85rem; font-weight: 600; line-height: 1.3; }
.ka-pl-m {
  display: inline-flex;
  align-items: center;
  gap: .3rem;
  font-size: .72rem;
  color: var(--c-texte-2, #555);
}
.ka-pl-m .ka-ico { width: .95em; height: .95em; }

/* ───────────────────────── bloc de vote ───────────────────────── */

.ka-vote {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: var(--e5, 1.25rem);
  align-items: center;
  margin: var(--e8, 4rem) 0 var(--e6, 1.5rem);
  padding: var(--e5, 1.25rem) var(--e6, 1.5rem);
  background: var(--c-doux, #f2f2f2);
  border: 1px solid var(--c-bord, #e5e5e5);
  border-radius: var(--r-carte, 8px);
}
.ka-vote-sur {
  margin: 0 0 .2rem;
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--c-primaire-texte, #333);
}
.ka-vote-t {
  margin: 0 0 .6rem;
  font-family: var(--f-titre, inherit);
  font-size: 1.2rem;
  font-weight: var(--f-graisse-titre, 700);
  color: var(--c-sur-doux, #111);
}
.ka-vote-courant { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; }
.ka-vote-courant .ka-etoiles { color: var(--c-primaire, #333); }
.ka-vote-resume {
  margin: 0;
  font-size: .85rem;
  color: var(--c-sur-doux, #111);
  opacity: .75;
}
.ka-vote-resume b { font-weight: 700; opacity: 1; }
.ka-vote-sur5 { margin-inline: .2rem .6rem; }
.ka-vote-action {
  text-align: center;
  padding-left: var(--e4, 1rem);
  border-left: 1px dashed var(--c-bord, #e5e5e5);
}
.ka-vote-lab { display: block; font-size: .82rem; font-weight: 600; margin-bottom: .5rem; color: var(--c-sur-doux, #111); opacity: .8; }
/* Ordre 5 → 1 dans le DOM, remis à l'endroit par row-reverse : le survol et
   l'état « voté » du bouton cliqué éclairent, par sélecteur de voisins, les
   étoiles qui le suivent dans le DOM, donc celles qui sont à sa gauche. */
.ka-vote-etoiles { display: inline-flex; flex-direction: row-reverse; gap: 2px; justify-content: center; }
.ka-vote-etoile {
  padding: 3px;
  background: transparent;
  border: 0;
  cursor: pointer;
  color: color-mix(in srgb, var(--c-texte, #1a1a1a) 22%, transparent);
  transition: transform .15s, color .15s;
}
.ka-vote-etoile svg { width: 26px; height: 26px; display: block; fill: currentColor; }
.ka-vote-etoiles .ka-vote-etoile:hover,
.ka-vote-etoiles .ka-vote-etoile:hover ~ .ka-vote-etoile,
.ka-vote-etoile.ka-vote-fait,
.ka-vote-etoile.ka-vote-fait ~ .ka-vote-etoile { color: var(--c-primaire, #333); }
.ka-vote-etoile:hover { transform: scale(1.12); }
.ka-vote-etoile:focus-visible { outline: 2px solid var(--c-primaire-texte, #333); outline-offset: 2px; }
.ka-vote-merci {
  min-height: 1.2em;
  margin: .5rem 0 0;
  font-size: .84rem;
  font-weight: 600;
  color: var(--c-primaire-texte, #333);
}

/* ───────────────────────── commentaires ───────────────────────── */

.ka-com {
  margin-top: var(--e8, 4rem);
  padding-top: var(--e6, 1.5rem);
  border-top: 1px solid var(--c-bord, #e5e5e5);
}
.ka-com-t {
  display: flex;
  align-items: center;
  gap: .45rem;
  margin: 0 0 var(--e3, .75rem);
  font-family: var(--f-titre, inherit);
  font-weight: var(--f-graisse-titre, 700);
  font-size: 1.15rem;
}
.ka-com-vide { margin: 0 0 var(--e5, 1.25rem); font-size: .9rem; color: var(--c-texte-2, #555); }
.ka-com-form { display: block; }
/* Pot de miel : hors écran, jamais caché en display:none (un robot le repère). */
.ka-com-miel {
  position: absolute;
  left: -9999px;
  top: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
  opacity: 0;
  pointer-events: none;
}
.ka-com-champs { display: grid; grid-template-columns: 1fr 1fr; gap: 0 var(--e4, 1rem); }
.ka-com-ch { display: flex; flex-direction: column; gap: .25rem; margin: 0 0 var(--e4, 1rem); }
.ka-com-ch label { font-size: .82rem; font-weight: 600; color: var(--c-texte-2, #555); }
.ka-com-ch input,
.ka-com-ch textarea {
  width: 100%;
  padding: .55rem .7rem;
  font: inherit;
  font-size: .92rem;
  color: var(--c-texte, #1a1a1a);
  background: var(--c-surface, #fff);
  border: 1px solid var(--c-bord, #e5e5e5);
  border-radius: var(--r-bouton, 6px);
}
.ka-com-ch textarea { resize: vertical; min-height: 7rem; }
.ka-com-ch input:focus,
.ka-com-ch textarea:focus { outline: 2px solid var(--c-primaire, #333); outline-offset: 1px; }
.ka-com-consentement { display: flex; gap: .5rem; align-items: flex-start; margin: 0 0 var(--e4, 1rem); font-size: .84rem; color: var(--c-texte-2, #555); }
.ka-com-consentement input { margin-top: .2rem; flex: none; }
.ka-com-consentement a { color: var(--lien-couleur, var(--c-primaire-texte, #333)); }
.ka-com-statut { min-height: 1.2em; margin: 0 0 var(--e3, .75rem); font-size: .88rem; font-weight: 600; color: var(--c-texte-2, #555); }
.ka-com-statut[data-ka-etat="ok"] { color: var(--c-primaire-texte, #333); }
.ka-com-envoyer {
  padding: .6rem 1.1rem;
  font: inherit;
  font-size: .9rem;
  font-weight: 600;
  color: var(--c-sur-primaire, #fff);
  background: var(--c-primaire, #333);
  border: 0;
  border-radius: var(--r-bouton, 6px);
  cursor: pointer;
}
.ka-com-envoyer:hover { filter: brightness(1.08); }

/* ───────────────────────── lecture du corps ───────────────────────── */

.ka-corps p:not(.ka-tete *) {
  margin: 0 0 var(--e4, 1rem) !important;
  font-size: 1.02em !important;
  line-height: 1.72 !important;
}

/* Le défaut constaté : les H2/H3 du thème prennent la taille du texte courant. */
html body .ka-corps h2,
html body .ka-corps h3,
html body .ka-corps h4 {
  font-family: var(--f-titre, inherit) !important;
  font-weight: var(--f-graisse-titre, 700) !important;
  color: var(--c-texte, #1a1a1a) !important;
  line-height: 1.25 !important;
  scroll-margin-top: calc(var(--header-h, 72px) + var(--e4, 1rem));
}
html body .ka-corps h2 {
  font-size: clamp(1.35rem, 1.1rem + 1vw, 1.7rem) !important;
  margin: var(--e8, 3rem) 0 var(--e4, 1rem) !important;
  padding-bottom: .35rem;
  border-bottom: 2px solid var(--c-bord, #e5e5e5);
}
html body .ka-corps h2::before {
  content: "";
  display: inline-block;
  width: .42em;
  height: .42em;
  margin-right: .5rem;
  vertical-align: .08em;
  border-radius: 50%;
  background: var(--c-primaire, #333);
}
html body .ka-corps h3 {
  font-size: clamp(1.1rem, .98rem + .6vw, 1.28rem) !important;
  margin: var(--e6, 2rem) 0 var(--e3, .75rem) !important;
}
html body .ka-corps h4 {
  font-size: 1em !important;
  margin: var(--e5, 1.25rem) 0 var(--e2, .5rem) !important;
}
/* Le premier titre n'a pas à repousser le haut de l'article. */
html body .ka-entete + h2, html body .ka-entete + h3, html body .ka-grille h2:first-child, html body .ka-grille h3:first-child {
  margin-top: 0 !important;
}

.ka-corps ul:not(.ka-tete *), .ka-corps ol:not(.ka-tete *) {
  margin: 0 0 var(--e4, 1rem) !important;
  padding-left: 1.4em !important;
  line-height: 1.7 !important;
}
.ka-corps li:not(.ka-tete *) { margin-bottom: .4em !important; }
.ka-corps li:not(.ka-tete *)::marker { color: var(--c-primaire-texte, #333); font-weight: 700; }

.ka-corps blockquote {
  margin: var(--e6, 2rem) 0 !important;
  padding: var(--e3, .75rem) 0 var(--e3, .75rem) var(--e5, 1.25rem) !important;
  border-left: 4px solid var(--c-primaire, #333) !important;
  font-family: var(--f-titre, inherit);
  font-size: 1.15em !important;
  font-style: italic;
  line-height: 1.5 !important;
  color: var(--c-texte, #1a1a1a) !important;
}
.ka-corps blockquote p:last-child { margin-bottom: 0 !important; }

/* Tableaux : le kit est le seul endroit qui les style (la référence n'en a aucun). */
.ka-corps table {
  width: 100% !important;
  border-collapse: collapse !important;
  margin: var(--e5, 1.25rem) 0 !important;
  font-size: .92em !important;
}
.ka-corps th, .ka-corps td {
  padding: .55rem .7rem !important;
  border: 1px solid var(--c-bord, #e5e5e5) !important;
  text-align: left;
  vertical-align: top;
}
.ka-corps th {
  background: var(--c-doux, #f2f2f2) !important;
  color: var(--c-sur-doux, #111) !important;
  font-family: var(--f-titre, inherit);
  font-weight: var(--f-graisse-titre, 700);
}
.ka-corps tbody tr:nth-child(even) td { background: var(--c-fond-2, #fafafa); }
/* Le défilement horizontal est posé par le JavaScript, qui enveloppe le
   tableau : passer le tableau lui-même en `display:block` casserait
   l'alignement entre l'en-tête et les lignes. */
.ka-tableau {
  margin: var(--e5, 1.25rem) 0;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.ka-tableau table { margin: 0 !important; min-width: 34rem; }

.ka-corps img { max-width: 100%; height: auto; border-radius: var(--r-image, 8px); }
.ka-corps pre {
  margin: var(--e5, 1.25rem) 0 !important;
  padding: var(--e4, 1rem) !important;
  overflow-x: auto;
  background: var(--c-fond-2, #f5f5f5) !important;
  border: 1px solid var(--c-bord, #e5e5e5);
  border-radius: var(--r-carte, 8px) !important;
  font-size: .9em !important;
}
.ka-corps code {
  padding: .1em .35em;
  background: var(--c-doux, #f2f2f2);
  border-radius: 4px;
  font-size: .92em;
}
.ka-corps pre code { padding: 0; background: none; }
.ka-corps hr {
  margin: var(--e8, 4rem) auto !important;
  border: 0;
  border-top: 1px solid var(--c-bord, #e5e5e5);
  width: 40%;
}
.ka-corps a:not(.ka-tete *) {
  color: var(--lien-couleur, var(--c-primaire-texte, #333)) !important;
  text-decoration: var(--lien-deco, underline) !important;
  text-underline-offset: .18em;
}

/* Encadrés produits par la rédaction (`> **À retenir**` ou blockquote seul). */
.ka-encadre {
  margin: var(--e6, 2rem) 0;
  padding: var(--e4, 1rem) var(--e5, 1.25rem);
  background: var(--c-doux, #f2f2f2);
  border-left: 4px solid var(--c-primaire, #333);
  border-radius: 0 var(--r-carte, 8px) var(--r-carte, 8px) 0;
  color: var(--c-sur-doux, #111);
}
.ka-encadre-t {
  margin: 0 0 .35rem;
  font-family: var(--f-titre, inherit);
  font-weight: var(--f-graisse-titre, 700);
}
.ka-encadre p:last-child { margin-bottom: 0; }

@media (max-width: 760px) {
  /* Le bloc de vote et les deux champs côte à côte n'ont plus la place : le
     vote passe sous la note (filet horizontal au lieu du filet vertical). */
  .ka-vote { grid-template-columns: 1fr; gap: var(--e4, 1rem); }
  .ka-vote-action {
    padding-left: 0;
    padding-top: var(--e4, 1rem);
    border-left: 0;
    border-top: 1px dashed var(--c-bord, #e5e5e5);
  }
  .ka-com-champs { grid-template-columns: 1fr; }
}

@media (max-width: 640px) {
  .ka-auteur { grid-template-columns: 56px minmax(0, 1fr); }
  .ka-auteur-img { width: 56px; height: 56px; }
  .ka-lies-liste { grid-template-columns: 1fr; }
  .ka-restant { right: 12px; bottom: 12px; }
}

@media (prefers-reduced-motion: reduce) {
  .ka-progres-jauge, .ka-restant { transition: none; }
}

/* Un seul sommaire par page : si le thème a déjà le sien, celui du kit se retire. */
html:has(:is([class~="toc"], [class*="toc-"], [class*="-toc"], [id~="toc"], [class*="sommaire"]):not([class*="ka-"])) .ka-sommaire {
  display: none;
}

/* Un seul encadré auteur : celui du kit (bas d'article, près des commentaires, portrait de la page
   auteur). Un second encadré posé par le builder dans la mise en page est masqué (Cedia 25-26/09). */
.ka-auteur:not([data-ka="auteur"]) { display: none !important; }
/* Le portrait devient un lien vers la page auteur après le build (normalise_theme) : le lien ne doit
   ni s'étirer sur la hauteur de l'encadré ni prendre le fond des liens du thème (bloc vert sous un
   portrait carré, revue-auto-moto 26/09). */
.ka-auteur > a:first-child { display: block; align-self: start; width: 72px; height: 72px; padding: 0; margin: 0;
  border-radius: 50%; overflow: hidden; background: none !important; box-shadow: none !important; line-height: 0; text-decoration: none; }
/* margin: 0 : la typographie d'article du thème (prose, img { margin: 2em 0 }) décalait le portrait
   de 32 px dans son rond, qui n'en montrait qu'une ellipse. */
.ka-auteur .ka-auteur-img { margin: 0 !important; max-width: none; }
.ka-auteur > a:first-child .ka-auteur-img { width: 100%; height: 100%; border-radius: 50%; display: block; }
@media (max-width: 640px) { .ka-auteur > a:first-child { width: 56px; height: 56px; } }

/* Kit posé dans la colonne étroite d'un thème SANS barre latérale (max-w-3xl/4xl) : le cadre faisait
   moins de 1000 px et le sommaire, les plus lus et l'appel tombaient SOUS l'article (auto-moto-magazine,
   guide-voiture-moto, Cedia 26/09). Sur grand écran, le cadre sort de la colonne du thème, centré.
   Un thème qui a déjà sa barre latérale (un <aside> enfant d'un ancêtre) garde le kit dans sa colonne. */
@media (min-width: 1100px) {
  .ka-cadre { --ka-l: min(78rem, calc(100vw - 4rem)); width: var(--ka-l); max-width: none;
    margin-inline: calc((100% - var(--ka-l)) / 2); }
  :where(:has(> aside:not(.ka-cote))) .ka-cadre { width: auto; margin-inline: 0; }
}
/* Encadré auteur sans portrait : le texte prenait la colonne de 72 px du portrait, un mot par ligne
   (auto-moto-magazine 26/09). */
.ka-auteur:not(:has(.ka-auteur-img)) { grid-template-columns: minmax(0, 1fr); }

/* colonne du kit rangée dans la colonne du thème (kit-article.js colonneDuTheme) */
.ka-grille.ka-sans-cote { grid-template-columns: minmax(0, 1fr) !important; }
.ka-cote-theme { margin-top: 1.5rem; position: static; }

/* ── « À lire aussi » : cinq mises en forme, tirées par NDD (Cedia 26/09) ── */
.ka-lies--numerotee .ka-lies-liste { display: block; border-top: 1px solid var(--c-bord, #e5e5e5); }
.ka-lies--numerotee .ka-lie-a { flex-direction: row; align-items: baseline; gap: 1rem; padding: .9rem 0;
  background: none; border: 0; border-bottom: 1px solid var(--c-bord, #e5e5e5); border-radius: 0; box-shadow: none; }
.ka-lies--numerotee .ka-lie-n { font-family: var(--f-titre, inherit); font-weight: 800; font-size: 1.6rem; line-height: 1;
  color: var(--c-primaire, #333); min-width: 2.2ch; }
.ka-lies--numerotee .ka-lie-corps { padding: 0; }
.ka-lies--vignettes .ka-lies-liste { grid-template-columns: 1fr; }
.ka-lies--vignettes .ka-lie-a { flex-direction: row; align-items: center; }
.ka-lies--vignettes .ka-lie-img { width: 132px; flex: none; aspect-ratio: 4 / 3; }
/* défilant (Cedia 27/09 : à 1440 px il se confondait avec les cartes) : bande de fiches COUCHÉES (vignette
   carrée à gauche, titre à droite), chacune ≥ 38 % du conteneur, qui déborde toujours et défile ; le bord
   droit s'estompe pour montrer la suite. Contrôle socle:lies-rendu-distinct (défile, une rangée, fiche en ligne). */
.ka-lies--defilant .ka-lies-liste { display: flex; gap: var(--e3, .75rem); overflow-x: auto; scroll-snap-type: x mandatory;
  padding-bottom: .75rem; scrollbar-width: thin; -webkit-mask-image: linear-gradient(90deg, #000 82%, transparent);
  mask-image: linear-gradient(90deg, #000 82%, transparent); }
.ka-lies--defilant .ka-lie { flex: 0 0 max(300px, 38%); scroll-snap-align: start; }
.ka-lies--defilant .ka-lie-a { flex-direction: row; align-items: center; height: 100%; }
.ka-lies--defilant .ka-lie-img { width: 88px; aspect-ratio: 1; flex: none; }
.ka-lies--une-plus-deux .ka-lies-liste { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); }
.ka-lies--une-plus-deux .ka-lie:first-child { grid-row: span 2; }
.ka-lies--une-plus-deux .ka-lie:not(:first-child) .ka-lie-a { flex-direction: row; }
.ka-lies--une-plus-deux .ka-lie:not(:first-child) .ka-lie-img { width: 40%; flex: none; aspect-ratio: 1; }
@media (max-width: 640px) {
  .ka-lies--une-plus-deux .ka-lies-liste { grid-template-columns: 1fr; }
  .ka-lies--une-plus-deux .ka-lie:first-child { grid-row: auto; }
  .ka-lies--vignettes .ka-lie-img { width: 96px; }
}

/* En-tête d'article sur toute la largeur article + colonne (Cedia 26/09, dirigeant-entreprise : titre et
   image de 704 px au-dessus d'une zone de 1248 px). Le thème pose fil d'Ariane, rubrique, titre, chapô et
   image dans le slot « tete » du KitArticle : <KitArticle><div slot="tete">…</div><Content /></KitArticle>. */
.ka-cadre .ka-tete { margin: 0 0 var(--e6, 2rem); }
.ka-cadre .ka-tete > *, .ka-cadre .ka-tete h1, .ka-cadre .ka-tete figure { max-width: none; width: 100%; margin-inline: 0; }
.ka-cadre .ka-tete figure img { width: 100%; height: auto; max-height: 560px; object-fit: cover; }

/* « La réponse rapide » : la réponse courte du rédacteur en encadré sous le titre, à la manière d'un chapô,
   aux couleurs du site, jamais un fond criard (Cedia 27/09). Posé au build (astro_site.encadre_reponse). */
.ka-reponse { margin: 0 0 var(--e6, 2rem); padding: var(--e4, 1rem) var(--e5, 1.25rem);
  border-left: 4px solid var(--c-primaire, currentColor); border-radius: var(--r-carte, 8px);
  background: color-mix(in srgb, var(--c-primaire, #444) 6%, var(--c-fond, transparent)); }
.ka-reponse-t { margin: 0 0 .35rem; font-family: var(--f-titre, inherit); font-weight: 700; font-size: .8rem;
  letter-spacing: .06em; text-transform: uppercase; color: var(--c-primaire-texte, var(--c-primaire, inherit)); }
.ka-cadre .ka-reponse-p { margin: 0; font-size: 1.08em; line-height: 1.6; }

/* Pastille des minutes restantes rangée en tête de la colonne collante (kit-article.js restantEnPlace,
   Cedia 29/09) : un en-tête de colonne, pas une bulle qui flotte dans le vide. */
.ka-restant.ka-restant-cote {
  position: static; opacity: 1; box-shadow: none; pointer-events: auto;
  display: flex; align-items: center; justify-content: center; gap: .5rem;
  width: 100%; padding: .55rem .9rem; border-radius: var(--r-carte, 7px); text-align: center;
}
.ka-restant.ka-restant-cote::before {
  content: ""; width: .85rem; height: .85rem; flex: none; border: 2px solid currentColor; border-radius: 50%;
  background: linear-gradient(currentColor, currentColor) 50% 25% / 2px 40% no-repeat;
}
.ka-cote-in > .ka-restant-cote { margin: 0 !important; flex-shrink: 0; }

/* ── Réparation du 29/09 (kit sidebar sur les vrais thèmes) ──
   1. Cadre en collision avec une colonne du thème (kit-article.js cadreSansCollision) : il reste dans la
      colonne du thème, en une colonne, la sidebar passe sous l'article. */
.ka-cadre.ka-cadre-colonne { width: auto !important; max-width: 100% !important; margin-inline: 0 !important; }
/* 2. Les styles de prose du kit (.ka-corps ul/li/h2) habillaient aussi les blocs du kit posés dans le corps :
      puces orange et retrait sur les cartes « À lire aussi », pastille et filet sous leur titre
      (maison-bien-etre.com 29/09). Les blocs du kit gardent leur propre dessin. */
html body .ka-corps :is(.ka-lies, .ks-inline-related, .ka-vote, .ka-com, .ka-auteur) :is(ul, ol) {
  list-style: none !important; padding-left: 0 !important; margin: 0 !important; }
html body .ka-corps :is(.ka-lies, .ks-inline-related, .ka-vote, .ka-com, .ka-auteur) li { margin: 0 !important; }
html body .ka-corps :is(.ka-lies, .ks-inline-related, .ka-vote, .ka-com, .ka-auteur) li::marker { content: none; }
html body .ka-corps :is(.ka-lies, .ks-inline-related, .ka-vote, .ka-com, .ka-auteur) li::before { content: none !important; display: none !important; }
html body .ka-corps :is(.ka-lies-t, .ka-vote-t, .ka-com-t) {
  font-size: 1.15rem !important; margin: 0 0 var(--e4, 1rem) !important; padding-bottom: 0 !important; border-bottom: 0 !important; }
html body .ka-corps :is(.ka-lies-t, .ka-vote-t, .ka-com-t)::before { content: none !important; display: none !important; }
/* 3. La couleur des liens du thème (.markdown-body a, bleu) passait sur les boutons et cartes du kit. */
.ka-cadre :where(a).ka-cta-b, .ka-cadre :where(a).ka-cta-b:hover { color: var(--btn-texte, #fff); text-decoration: none; }
.ka-cadre :where(a).ka-lie-a, .ka-cadre :where(a).ka-lie-a:hover { color: inherit; text-decoration: none; }
.ka-cadre .ka-lie-a .ka-lie-t { color: var(--c-texte, inherit); }
/* 4. Image mise en avant posée par le kit quand la tête du thème n'en montre aucune. */
.ka-cadre .ka-une { margin: var(--e4, 1rem) 0 0; }
.ka-cadre .ka-une img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover;
  border-radius: var(--r-carte, 8px); }
.ka-cadre :where(a).ka-som-a { color: var(--c-texte-2, #555); }
.ka-cadre :where(a).ka-som-a:hover { color: var(--c-sur-doux, #111); }
.ka-cadre :where(a).ka-som-a[aria-current="true"] { color: var(--c-primaire-texte, #333); }
/* Liens nus de la tête du thème (rubrique, étiquette) : couleur du site, pas le bleu des liens du thème. */
.ka-cadre .ka-tete a:not([class]) { color: var(--c-primaire-texte, inherit); }
/* Rubrique de la tête ramenée à son libellé par KitArticle : couleur du site, pas le bleu des liens. */
.ka-cadre .ka-tete a[data-ka-rubrique] { color: var(--c-primaire-texte, inherit); text-decoration: none; }
/* Tête posée dans la colonne du texte (sidebar à gauche) : pas de marge haute en plus. */
.ka-corps > .ka-tete:first-child { margin-top: 0; }
/* Titre coupé au milieu d un mot (classe break-all du thème, maison-bien-etre 390 px) : coupure aux mots. */
.ka-cadre .ka-tete :is(h1, h2) { word-break: normal !important; overflow-wrap: break-word; hyphens: manual; }


.ka-grille {scroll-margin-top:0}
.ks-table {max-width:100%;overflow-x:auto}
.ka-cote-in .ka-lies {margin-bottom:1rem}
.ks-block {border:1px solid var(--c-bord,#ddd);border-radius:var(--r-carte,7px);padding:1rem;margin-bottom:1rem;color:var(--c-texte,#333);background:var(--c-surface,#fff)}
.ks-block-title {font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:var(--c-texte-2,#555);margin:0 0 1rem;line-height:1.5}
.ks-search-label {display:block;font-size:.8rem;margin-bottom:.4rem}
.ks-search-row {display:flex;gap:.4rem}.ks-search-row input {min-width:0;width:100%;border:1px solid var(--c-bord,#ddd);border-radius:4px;padding:.6rem;font:inherit;font-size:.875rem;background:var(--c-surface,#fff)}
.ks-search-row button {flex:none;background:var(--c-primaire,#333);color:var(--c-sur-primaire,#fff);padding:.4rem .7rem;border-radius:4px;font-size:1.4rem;cursor:pointer}
#ks-search-results {font-size:.8rem}#ks-search-results p {margin:.7rem 0}#ks-search-results ul {list-style:none;padding:0;margin:0}#ks-search-results li {padding:.5rem 0;border-top:1px solid var(--c-bord,#ddd)}#ks-search-results a:hover {text-decoration:underline}
.ks-recent ul {display:grid;grid-template-columns:1fr 1fr;gap:1rem .8rem;list-style:none;padding:0;margin:0}
.ks-recent a {display:block}.ks-recent img {display:block;aspect-ratio:1;width:100%;height:auto;object-fit:cover;border-radius:4px;margin-bottom:.5rem}.ks-recent a span {font-size:.8rem;font-weight:600;line-height:1.4;display:block}.ks-recent a:hover span {text-decoration:underline}
.ks-recent[data-layout="list"] ul {grid-template-columns:1fr}.ks-recent[data-layout="list"] a {display:grid;grid-template-columns:70px 1fr;align-items:center;gap:.75rem}.ks-recent[data-layout="list"] img {width:70px;height:70px;margin:0}
.ks-carousel-dots {display:none}.ks-recent[data-layout="carousel"] ul {grid-template-columns:1fr}.ks-recent[data-layout="carousel"] .ks-slide-hidden {display:none}.ks-recent[data-layout="carousel"] .ks-carousel-dots {display:flex;justify-content:center;gap:10px;margin-top:12px}.ks-carousel-dots button {width:26px;height:26px;padding:8px;border:0;background:transparent;cursor:pointer;border-radius:50%}.ks-carousel-dots button:before {content:'';display:block;width:10px;height:10px;border-radius:50%;background:#c5c8bf}.ks-carousel-dots button[aria-current="true"]:before {background:var(--c-primaire,#888900)}.ks-carousel-dots button:focus-visible {outline:2px solid var(--c-primaire,#888900);outline-offset:2px}.ks-recent[data-layout="carousel"] ul {touch-action:pan-y}
.ks-categories ul {padding:0;margin:0;list-style:none}.ks-categories li+li {border-top:1px solid var(--c-bord,#ddd)}.ks-categories a {display:flex;align-items:center;justify-content:space-between;gap:.6rem;padding:.7rem 0;font-size:.83rem;font-weight:600}.ks-categories[data-layout="list"] li:last-child a {padding-bottom:0}.ks-category-count {min-width:1.7rem;text-align:center;border-radius:4px;background:var(--c-surface-2,#f1f1e4);font-size:.75rem;padding:.15rem .35rem;font-variant-numeric:tabular-nums}
.ks-follow-socials {display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;max-width:288px;margin:0 auto 14px}.ks-follow-socials a,.ks-follow-socials button {display:flex;align-items:center;justify-content:center;width:100%;max-width:36px;aspect-ratio:1;border:0;border-radius:50%;padding:0;background:var(--c-primaire,#888900);color:var(--c-sur-primaire,#fff);cursor:pointer;transition:background .18s}.ks-follow-socials svg {width:48%;height:48%;fill:currentColor}.ks-follow-socials a:hover,.ks-follow-socials button:hover,.ks-follow-socials a:focus-visible,.ks-follow-socials button:focus-visible {background:var(--c-texte,#20251d);color:var(--c-surface,#fff)}.ks-follow-socials :focus-visible,.ks-follow-news:focus-visible {outline:2px solid #2d81e0;outline-offset:3px}.ks-follow-news {display:block;width:100%;padding:11px 10px;border:0;border-radius:6px;color:white;background:linear-gradient(110deg,#4285f4,#1a73e8);font:600 .8rem/1.4 inherit;cursor:pointer}.ks-follow-news:hover {background:linear-gradient(110deg,#2671ec,#1558b0)}.ks-follow-hint,#ks-follow-note {font-size:.67rem;line-height:1.5;color:var(--c-texte-2,#666);margin:10px 0 0}
.ks-author-content {display:grid;grid-template-columns:72px minmax(0,1fr);gap:14px;align-items:start}.ks-author-photo {width:72px;height:72px;aspect-ratio:1;object-fit:cover;border-radius:0}.ks-author[data-shape="rounded"] .ks-author-photo {border-radius:12px}.ks-author[data-shape="round"] .ks-author-photo {border-radius:50%}.ks-author-text h3 {font-size:1rem;line-height:1.3;margin:0 0 4px;font-weight:700}.ks-author-role {font-size:.75rem;color:var(--c-texte-2,#555);margin:0 0 10px}.ks-author-bio {font-size:.8rem;line-height:1.6;margin:0 0 12px}.ks-author-more {font-size:.77rem;font-weight:600;text-decoration:underline}.ks-author[data-layout="top"] .ks-author-content {display:flex;flex-direction:column;align-items:center;text-align:center}.ks-author[data-layout="top"] .ks-author-photo {width:108px;height:108px}
.ks-rating-content {display:grid;grid-template-columns:1fr 1fr;gap:12px;align-items:center;text-align:center}.ks-rating-score {display:flex;flex-direction:column;align-items:center;gap:3px}.ks-rating-score>strong {font-size:1.65rem;line-height:1.2}.ks-rating-score small {font-size:.8rem;font-weight:400;margin-left:3px}.ks-rating-stars {justify-self:start;position:relative;display:inline-block;color:#d7d8d0;font-size:19px;line-height:1.3;letter-spacing:1px;white-space:nowrap}.ks-rating-stars-fill {position:absolute;left:0;top:0;overflow:hidden;color:#bd9419}.ks-rating-votes {font-size:.7rem;color:var(--c-texte-2,#555)}.ks-rating-readers {border-left:1px solid var(--c-bord,#ddd);display:flex;flex-direction:column;gap:3px;padding:8px 0 8px 12px}.ks-rating-readers strong {font-size:1.25rem}.ks-rating-readers span {font-size:.75rem;color:var(--c-texte-2,#555)}.ks-rating-note {font-size:.65rem;color:var(--c-texte-2,#666);text-align:center;margin:14px 0 0;line-height:1.4}.ks-rating[data-layout="stacked"] .ks-rating-content {grid-template-columns:1fr;gap:14px}.ks-rating[data-layout="stacked"] .ks-rating-readers {border-left:0;border-top:1px solid var(--c-bord,#ddd);padding:14px 0 0}
.ks-google {margin:1rem 0}.ks-google-link {display:flex;flex-direction:column;gap:16px;padding:16px 18px;border:1px solid #dfe6ee;border-radius:10px;background:#fff;text-decoration:none;transition:background .18s,border-color .18s,box-shadow .18s}
.ks-google-copy {display:flex;gap:12px;align-items:flex-start}.ks-google-copy>img {flex:none;width:26px;height:26px;margin-top:2px}.ks-google-copy strong {display:block;color:#16212e;font-size:15.5px;line-height:1.4;font-weight:700}.ks-google-copy strong+span {display:block;margin-top:5px;font-size:13px;color:#5b6b7c;line-height:1.5}
.ks-google-button {display:flex;align-items:center;justify-content:center;gap:8px;border-radius:6px;background:#2d81e0;color:#fff;padding:10px 12px;font-size:13px;font-weight:600;transition:background .18s}
.ks-google-link:hover,.ks-google-link:focus-visible {border-color:#2d81e0;background:#fbfdff;box-shadow:0 2px 10px rgba(45,129,224,.12)}.ks-google-link:hover .ks-google-button,.ks-google-link:focus-visible .ks-google-button {background:#1f6ac0}.ks-google-link:focus-visible {outline:2px solid #2d81e0;outline-offset:3px}
.ka-cote-in [hidden], [data-sidebar-block][hidden] {display:none!important}
.ka-cote-in .ka-lies {margin-top:1.5rem;padding-top:1.5rem;border-top:1px solid var(--c-bord,#ddd)}
.ka-cote-in .ka-lies-liste {display:grid;grid-template-columns:1fr;gap:1rem}
.ka-cote-in .ka-lie-a {display:grid;grid-template-columns:72px 1fr;gap:.7rem;align-items:center}
.ka-cote-in .ka-lie-img {width:72px;height:64px;object-fit:cover;border-radius:4px}
.ka-cote-in .ka-lie-corps {padding:0}.ka-cote-in .ka-lie-t {font-size:.875rem;line-height:1.4}
.ka-cote-in .ka-lie-m {font-size:.7rem;margin-top:.25rem}
#ks-contact {cursor:pointer} #ks-contact-note {font-size:.8rem;margin-top:.7rem}

@media(prefers-reduced-motion:reduce) {html {scroll-behavior:auto!important}.ks-google-link,.ks-google-button,.ks-follow-socials a,.ks-follow-socials button {transition:none}}

.ks-inline-related {margin:32px 0;min-width:0;max-width:100%;scroll-margin-top:0}
.ks-inline-related[hidden] {display:none!important}
.ks-inline-related .ka-lies {margin:0;min-width:0;max-width:100%}
.ks-inline-related .ka-lies-liste {max-width:100%;min-width:0}
.ks-inline-related .ka-lie {min-width:0}
.ks-inline-related .ka-lie-img {height:auto}
.ks-inline-related:not([hidden]) + h2 {margin-top:0!important}
/* Shared spacing: the container owns the only 16px interval between visible blocks. */
.ka-cote-in {display:flex;flex-direction:column;gap:16px}
.ka-cote-in > [data-sidebar-block] {margin:0!important;flex-shrink:0;min-width:0}
.ka-cote-in .ka-lies {padding:16px;border:1px solid var(--c-bord,#ddd);border-radius:var(--r-carte,7px);background:var(--c-surface,#fff)}
/* Sommaire */
.ka-sommaire[data-layout="simple"] .ka-som-num,.ka-sommaire[data-layout="timeline"] .ka-som-num {display:none}
.ka-sommaire[data-layout="simple"] .ka-som-a {display:block;padding:8px 0}
.ka-sommaire[data-layout="numbered"] .ka-som-a {display:grid;grid-template-columns:28px minmax(0,1fr);gap:10px;align-items:start}
.ka-sommaire[data-layout="numbered"] .ka-som-num {display:flex;justify-content:center;align-items:center;min-height:26px;border-radius:5px;background:var(--c-surface-2,#f2f2e7);font-size:12px}
.ka-sommaire[data-layout="timeline"] .ka-som-l {border:0;margin:0;padding:0}
.ka-sommaire[data-layout="timeline"] .ka-som-a {display:block;border-left:2px solid var(--c-bord,#ddd);border-radius:0;padding:9px 0 9px 14px;margin:0}
.ka-sommaire[data-layout="timeline"] .ka-som-actif {border-left-color:var(--c-primaire,#888900);background:var(--c-surface-2,#f2f2e7);font-weight:700}
/* Popular */
.ks-popular-image {display:none}
.ka-plus-lus[data-layout="simple"] .ka-pl-num {display:none}
.ka-plus-lus[data-layout="simple"] .ka-pl-a {display:block}
.ka-plus-lus[data-layout="numbered"] .ka-pl-a {display:grid;grid-template-columns:44px minmax(0,1fr);gap:12px;align-items:start}
.ka-plus-lus[data-layout="numbered"] .ka-pl-num {font-size:30px;line-height:1.1;font-weight:800;color:var(--c-texte-2,#555);opacity:1}
.ka-plus-lus[data-layout="featured"] .ka-pl-l:first-child {padding-bottom:16px}
.ka-plus-lus[data-layout="featured"] .ka-pl-l:first-child .ka-pl-a {display:block}
.ka-plus-lus[data-layout="featured"] .ka-pl-l:first-child .ka-pl-num {display:none}
.ka-plus-lus[data-layout="featured"] .ks-popular-image {display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;border-radius:5px;margin-bottom:10px}
.ka-plus-lus[data-layout="featured"] .ka-pl-l:first-child .ka-pl-t {font-size:1rem;font-weight:750;line-height:1.4}
/* Contact */
.ka-cote-in .ka-cta[data-layout] {padding:18px;border:1px solid var(--c-bord,#ddd);border-radius:var(--r-carte,7px);background:var(--c-surface,#fff);color:var(--c-texte,#20251d)}
.ka-cta[data-layout] .ka-cta-t,.ka-cta[data-layout] .ka-cta-p {color:inherit}
.ka-cta[data-layout="simple"] {text-align:left}
.ka-cta[data-layout="simple"] .ka-cta-b {width:auto;display:inline-flex}
.ka-cote-in .ka-cta[data-layout="border"] {border-left:5px solid var(--c-primaire,#888900);border-radius:0;text-align:left;padding-left:16px}
.ka-cta[data-layout="border"] .ka-cta-b {display:flex;justify-content:space-between;width:100%;background:transparent;color:var(--c-texte,#20251d);border:1px solid var(--c-bord,#ddd)}
.ka-cote-in .ka-cta[data-layout="tinted"] {background:var(--c-surface-2,#f2f2e7);text-align:center;padding:26px 20px}
.ka-cta[data-layout="tinted"] .ka-cta-t {font-size:1.25rem;line-height:1.3}
.ka-cta[data-layout="tinted"] .ka-cta-b {display:flex;justify-content:center;width:100%}
/* Related */
.ka-cote-in .ka-lies[data-layout="featured"] .ka-lie:first-child .ka-lie-a {display:block}
.ka-cote-in .ka-lies[data-layout="featured"] .ka-lie:first-child .ka-lie-img {width:100%;height:auto;aspect-ratio:16/10;margin-bottom:10px}
.ka-cote-in .ka-lies[data-layout="featured"] .ka-lie:first-child .ka-lie-t {font-size:1rem;font-weight:750}
.ka-cote-in .ka-lies[data-layout="featured"] .ka-lie:not(:first-child) .ka-lie-img,.ka-cote-in .ka-lies[data-layout="text"] .ka-lie-img {display:none}
.ka-cote-in .ka-lies[data-layout="featured"] .ka-lie:not(:first-child) .ka-lie-a,.ka-cote-in .ka-lies[data-layout="text"] .ka-lie-a {display:block}
.ka-cote-in .ka-lies[data-layout="text"] .ka-lie {box-shadow:none;border-radius:0;padding:0 0 12px;border-bottom:1px solid var(--c-bord,#ddd)}
.ka-cote-in .ka-lies[data-layout="text"] .ka-lie:last-child {padding-bottom:0;border-bottom:0}
.ka-cote-in .ka-lies[data-layout="text"] .ka-lie-a,.ka-cote-in .ka-lies[data-layout="text"] .ka-lie-a:hover,.ka-cote-in .ka-lies[data-layout="text"] .ka-lie-a:focus-visible {box-shadow:none}
/* Search */
.ks-search-button-label {display:none}
[data-sidebar-block="search"][data-layout="pill"] .ks-search-row {border:1px solid var(--c-bord,#ddd);padding:4px;border-radius:99px;align-items:center}
[data-sidebar-block="search"][data-layout="pill"] input {border:0;background:transparent;padding-left:12px;border-radius:99px}
[data-sidebar-block="search"][data-layout="pill"] button {border-radius:50%;width:36px;height:36px;padding:0}
[data-sidebar-block="search"][data-layout="full"] .ks-search-row {flex-direction:column;gap:8px}
[data-sidebar-block="search"][data-layout="full"] button {display:flex;justify-content:center;align-items:center;gap:8px;width:100%;font-size:.9rem;padding:9px}
[data-sidebar-block="search"][data-layout="full"] .ks-search-button-label {display:inline}
/* Categories */
.ks-categories[data-layout="pills"] ul {display:flex;flex-wrap:wrap;gap:8px}
.ks-categories[data-layout="pills"] li {border:0}
.ks-categories[data-layout="pills"] a {border:1px solid var(--c-bord,#ddd);padding:7px 10px;border-radius:24px;font-size:.75rem}
.ks-categories[data-layout="pills"] .ks-category-count {background:transparent;padding:0;min-width:14px}
.ks-categories[data-layout="grid"] ul {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.ks-categories[data-layout="grid"] li {border:1px solid var(--c-bord,#ddd);border-radius:6px;background:var(--c-surface-2,#f2f2e7)}
.ks-categories[data-layout="grid"] a {display:flex;flex-direction:column-reverse;align-items:start;justify-content:flex-end;gap:6px;height:100%;padding:12px;font-size:.75rem}
.ks-categories[data-layout="grid"] .ks-category-count {font-size:1.3rem;background:transparent;padding:0;text-align:left}
/* Google */
.ks-google[data-layout="compact"] .ks-google-link {flex-direction:row;align-items:center;gap:10px;padding:14px}
.ks-google[data-layout="compact"] .ks-google-copy {align-items:center;gap:9px}
.ks-google[data-layout="compact"] .ks-google-copy strong {font-size:13px}
.ks-google[data-layout="compact"] .ks-google-copy strong+span,.ks-google[data-layout="compact"] .ks-google-button-label {display:none}
.ks-google[data-layout="compact"] .ks-google-button {flex:none;width:32px;height:32px;border-radius:50%;padding:0}
.ks-google[data-layout="tinted"] .ks-google-link {background:#f1f6fd;padding:22px 18px}
.ks-google[data-layout="tinted"] .ks-google-copy {flex-direction:column;align-items:center;text-align:center;gap:12px}
.ks-google[data-layout="tinted"] .ks-google-copy>img {width:36px;height:36px}
.ks-google[data-layout="tinted"] .ks-google-link:hover {background:#eaf2fd}
/* Rating */
.ks-rating[data-layout="tinted"] {background:var(--c-surface-2,#f2f2e7)}
.ks-rating[data-layout="tinted"] .ks-rating-content {grid-template-columns:1fr;gap:18px}
.ks-rating[data-layout="tinted"] .ks-rating-score {display:grid;grid-template-columns:1fr 1fr;gap:4px 8px;text-align:left}
.ks-rating[data-layout="tinted"] .ks-rating-score>strong {grid-row:span 2;font-size:2.1rem;color:var(--c-texte,#20251d)}
.ks-rating[data-layout="tinted"] .ks-rating-readers {flex-direction:row;align-items:baseline;justify-content:space-between;border-left:0;border-top:1px solid var(--c-bord,#ddd);padding:14px 0 0}
.ks-rating[data-layout="tinted"] .ks-rating-readers strong {font-size:1.65rem;color:var(--c-texte,#20251d)}
/* Follow */
.ks-social-label {display:none}
.ks-follow[data-layout="buttons"] .ks-follow-socials {grid-template-columns:1fr;max-width:none;gap:7px}
.ks-follow[data-layout="buttons"] .ks-follow-socials>a,.ks-follow[data-layout="buttons"] .ks-follow-socials>button {max-width:none;aspect-ratio:auto;border-radius:5px;justify-content:flex-start;gap:12px;padding:9px 13px}
.ks-follow[data-layout="buttons"] .ks-follow-socials svg {width:18px;height:18px}
.ks-follow[data-layout="buttons"] .ks-social-label {display:block;font-size:.8rem;font-weight:600}
.ks-follow[data-layout="grid"] .ks-follow-socials {grid-template-columns:repeat(3,minmax(0,1fr));max-width:none;gap:8px}
.ks-follow[data-layout="grid"] .ks-follow-socials>a,.ks-follow[data-layout="grid"] .ks-follow-socials>button {max-width:none;aspect-ratio:auto;border-radius:6px;flex-direction:column;gap:8px;padding:12px 4px}
.ks-follow[data-layout="grid"] .ks-follow-socials svg {width:22px;height:22px}
.ks-follow[data-layout="grid"] .ks-social-label {display:block;font-size:.68rem;font-weight:600}

/* Keep the ticker one line, including reduced-motion themes that otherwise wrap. */
#main-header [data-defile] .kv-piste {flex-wrap:nowrap;width:max-content}
#main-header [data-defile] {min-width:0;max-height:44px;overflow:hidden}
.ks-action {width:100%;border:1px solid var(--c-bord,#ddd);border-radius:6px;padding:10px 12px;background:var(--c-surface-2,#f2f2e7);color:var(--c-texte,#222);font:600 .8rem/1.4 inherit;cursor:pointer}
.ks-action:hover {background:var(--c-primaire,#ddd);color:var(--c-sur-primaire,#222)}
.ks-share-links {display:flex;gap:8px;justify-content:center;margin-bottom:12px;flex-wrap:wrap}
.ks-share-links a {display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;background:var(--c-primaire,#ddd);color:var(--c-sur-primaire,#222)}
.ks-share-links svg {width:17px;height:17px;fill:currentColor}.ks-share-links a:last-child svg {fill:none}
.ks-share-links a:hover {background:var(--c-texte,#222);color:var(--c-surface,#fff)}
.ks-share-links a span {display:none}
.ks-share[data-layout="buttons"] .ks-share-links {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.ks-share[data-layout="buttons"] .ks-share-links a {width:auto;height:auto;min-height:40px;gap:8px;border-radius:5px;padding:10px 5px;font-size:.75rem}
.ks-share[data-layout="buttons"] .ks-share-links a span {display:inline}
.ks-share[data-layout="compact"] {display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.ks-share[data-layout="compact"] .ks-block-title {margin:0;flex:1}
.ks-share[data-layout="compact"] .ks-share-links {display:none}
.ks-share[data-layout="compact"] .ks-action {width:auto}
#ks-share-feedback {font-size:.75rem;margin:10px 0 0;width:100%}
#ks-copy-fallback {width:100%;font-size:.72rem;padding:8px;margin-top:8px;border:1px solid var(--c-bord,#ddd)}
.ks-reading-progress {display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-bottom:12px}
.ks-reading-ring strong {font-size:1rem;font-variant-numeric:tabular-nums}
.ks-reading-caption {font-size:.7rem;color:var(--c-texte-2,#555)}
.ks-reading-track {width:100%;height:5px;border-radius:5px;overflow:hidden;background:var(--c-bord,#ddd)}
.ks-reading-track span {display:block;height:100%;width:calc(var(--reading-progress,0)*1%);background:var(--c-primaire,#ddd)}
.ks-reading-controls {display:flex;align-items:center;gap:6px}
.ks-reading-controls button {background:var(--c-surface-2,#f2f2e7);border:1px solid var(--c-bord,#ddd);border-radius:5px;color:var(--c-texte,#222);font-size:.85rem;font-weight:600;min-height:34px;min-width:34px;padding:5px;cursor:pointer}
.ks-reading-controls button:disabled {opacity:.4;cursor:default}
.ks-reading-controls output {flex:1;text-align:center;font-size:.75rem;font-variant-numeric:tabular-nums}
.ks-reading[data-layout="card"] .ks-reading-progress {display:grid;grid-template-columns:1fr auto;gap:10px;padding:14px;background:var(--c-surface-2,#f2f2e7);border-radius:6px}
.ks-reading[data-layout="card"] .ks-reading-ring {grid-column:2;grid-row:1}
.ks-reading[data-layout="card"] .ks-reading-caption {grid-column:1;grid-row:1}
.ks-reading[data-layout="card"] .ks-reading-track {grid-column:1/-1;height:8px}
.ks-reading[data-layout="circle"] .ks-reading-progress {flex-direction:column;gap:10px;margin:0 0 16px}
.ks-reading[data-layout="circle"] .ks-reading-ring {display:grid;place-items:center;width:104px;height:104px;border-radius:50%;background:conic-gradient(var(--c-primaire,#ddd) calc(var(--reading-progress,0)*1%),var(--c-bord,#ddd) 0);position:relative}
.ks-reading[data-layout="circle"] .ks-reading-ring:before {content:'';position:absolute;inset:9px;border-radius:50%;background:var(--c-surface,#fff)}
.ks-reading[data-layout="circle"] .ks-reading-ring strong {position:relative;font-size:1.5rem}
.ks-reading[data-layout="circle"] .ks-reading-track {display:none}
.ks-about-content {display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px}
.ks-about-content img {width:64px;height:64px;object-fit:contain;flex:none}
.ks-about h3 {font-size:1rem;font-weight:700;line-height:1.35;margin:0 0 9px}
.ks-about p {font-size:.8rem;line-height:1.65;margin:0}
.ks-about-link {display:block;font-size:.77rem;font-weight:600;text-decoration:underline;margin-top:14px}
.ks-about[data-layout="left"] .ks-about-content {flex-direction:row;align-items:start;text-align:left;gap:12px}
.ks-about[data-layout="left"] .ks-about-content img {width:44px;height:44px}
.ks-about[data-layout="tinted"] {background:var(--c-surface-2,#f2f2e7);border-left:4px solid var(--c-primaire,#ddd)}
.ks-about[data-layout="tinted"] .ks-about-content {align-items:start;text-align:left}
.ks-about[data-layout="tinted"] .ks-about-content img {width:38px;height:38px}
.ks-about[data-layout="tinted"] .ks-about-link {border-top:1px solid var(--c-bord,#ddd);padding-top:12px}
.ks-archives-accordion,.ks-archives-select {display:none}
.ks-archives[data-layout="accordion"] .ks-archives-list,.ks-archives[data-layout="select"] .ks-archives-list {display:none}
.ks-archives[data-layout="accordion"] .ks-archives-accordion,.ks-archives[data-layout="select"] .ks-archives-select {display:block}
.ks-archives ul {padding:0;margin:8px 0 0;list-style:none}
.ks-archives li {border-top:1px solid var(--c-bord,#ddd);font-size:.77rem;line-height:1.5}
.ks-archives li a {display:block;padding:9px 0}
.ks-archives a:hover {text-decoration:underline}
.ks-archive-month h3 {display:flex;justify-content:space-between;align-items:center;font-size:.85rem;font-weight:700;margin:0}
.ks-archive-month h3 span {background:var(--c-surface-2,#f2f2e7);padding:3px 7px;border-radius:4px}
.ks-archive-month+.ks-archive-month {margin-top:20px}
.ks-archives summary {cursor:pointer;padding:10px 0;font-size:.82rem;font-weight:600}
.ks-archives summary span {float:right;font-size:.7rem;color:var(--c-texte-2,#555);font-weight:400}
.ks-archives details+details {border-top:1px solid var(--c-bord,#ddd)}
.ks-archives-select label {display:block;font-size:.75rem;margin-bottom:7px}
#ks-archive-month {width:100%;min-width:0;border:1px solid var(--c-bord,#ddd);background:var(--c-surface,#fff);color:var(--c-texte,#222);padding:9px;border-radius:5px;font-size:.8rem}
.ks-discover-link {display:block}
.ks-discover-link>img {display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;border-radius:5px;margin-bottom:12px}
.ks-discover-category {display:block;font-size:.65rem;letter-spacing:.06em;text-transform:uppercase;color:var(--c-texte-2,#555);margin-bottom:5px}
.ks-discover h3 {font-size:1rem;line-height:1.4;font-weight:700;margin:0 0 10px}
.ks-discover p {font-size:.8rem;line-height:1.6;margin:0 0 12px}
.ks-discover-cta {font-size:.75rem;font-weight:600;text-decoration:underline}
.ks-discover-link:hover h3 {text-decoration:underline}
.ks-discover[data-layout="horizontal"] .ks-discover-link {display:grid;grid-template-columns:80px minmax(0,1fr);gap:12px;align-items:start}
.ks-discover[data-layout="horizontal"] .ks-discover-link>img {width:80px;height:80px;aspect-ratio:1;margin:0}
.ks-discover[data-layout="horizontal"] h3 {font-size:.85rem}
.ks-discover[data-layout="horizontal"] p {display:none}
.ks-discover[data-layout="text"] {background:var(--c-surface-2,#f2f2e7)}
.ks-discover[data-layout="text"] .ks-discover-link>img {display:none}
.ks-discover[data-layout="text"] h3 {font-size:1.12rem}
.ks-share :focus-visible,.ks-reading :focus-visible,.ks-archives :focus-visible,.ks-discover :focus-visible,.ks-about :focus-visible {outline:2px solid var(--c-texte,#222);outline-offset:3px}

/* Bounded settings drawer; its header always remains reachable. */
/* Production layout: persistent side, bounded sticky scroll, no preview controls. */
.ks-sidebar {display:flex;flex-direction:column;gap:16px;min-width:0}
.ks-sidebar>* {flex-shrink:0;margin:0!important;min-width:0;box-sizing:border-box}
.ks-sidebar [hidden] {display:none!important}
.ks-sidebar .ka-sommaire {display:block!important}
.ks-sidebar :is(h2,h3,p,a,span) {overflow-wrap:anywhere}
.ks-google-g {font:bold 28px Arial;color:#4285f4;flex:none}
.ks-initials {display:grid;place-items:center;background:var(--c-surface-2,#eee);font-weight:700}
.ks-inline-related {margin:32px 0;min-width:0;max-width:100%}
.ks-inline-related .ka-lies[data-variante="defilant"] .ka-lie {flex:0 0 70%;min-width:0;max-width:none}
.ks-inline-related .ka-lies[data-variante="une-plus-deux"] .ka-lies-liste {grid-template-columns:1.6fr 1fr}
.ks-inline-related .ka-lies[data-variante="une-plus-deux"] .ka-lie:first-child {grid-row:auto}
.ks-table {max-width:100%;overflow:auto}
@container (min-width:1000px) {
 [data-sidebar-side="left"] {grid-template-columns:minmax(15rem,18rem) minmax(0,1fr)}
 [data-sidebar-side="left"]>.ka-cote {grid-column:1;grid-row:1}
 [data-sidebar-side="left"]>.ka-corps {grid-column:2;grid-row:1}
 .ks-sidebar {position:sticky;top:var(--ks-top,100px);max-height:calc(100dvh - var(--ks-top,100px) - 16px);overflow-y:auto;scrollbar-width:thin;padding-right:8px;overscroll-behavior:contain}
}
.ka-cote-theme .ks-sidebar {position:sticky;top:var(--ks-top,100px);max-height:calc(100dvh - var(--ks-top,100px) - 16px);overflow-y:auto;scrollbar-width:thin}
@media(max-width:767px) {.ks-inline-related .ka-lies[data-variante="une-plus-deux"] .ka-lies-liste {grid-template-columns:1fr}.ks-sidebar {max-height:none;overflow:visible}}

/* les puces de prose du thème (ul li disc) débordaient à gauche des cartes « À lire aussi » (maison-bien-etre 29/09) */
.ka-cote-in ul,.ka-cote-in ol{list-style:none!important;padding-left:0!important;margin-left:0!important}
.ka-cote-in li{list-style:none!important;margin-left:0!important}
.ka-cote-in li::marker{content:none}

/* Réparation 29/09 : cartes de la sidebar « À lire aussi » (featured/vignettes), texte collé au bord. */
.ka-cote-in .ka-lies[data-layout="featured"] .ka-lie-corps {padding:.65rem .8rem .75rem}
.ka-cote-in .ka-lies[data-layout="thumbnails"] .ka-lie-corps {padding:.5rem .6rem .5rem 0}
.ka-cote-in .ka-lies .ka-lie-a {color:inherit;text-decoration:none}
/* Sidebar sous l'article (tablette) : deux colonnes plutôt que des blocs pleine largeur étirés. */
@container (min-width:640px) and (max-width:999.98px) {
 .ka-cote-in.ks-sidebar {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;gap:16px}
 .ka-cote-in.ks-sidebar > .ka-restant-cote {grid-column:1/-1}
}

/* sommaire repliable et court (Cedia 29/09 : « sidebar trop longue », « pouvoir le fermer ») : titres H2 seuls
   dans la colonne, liste bornée à 45 % de l'écran, le titre replie la liste (kit-article.js sommaireRepliable) */
.ka-cote-in .ka-sommaire .ka-som-n3 {display:none}
.ka-cote-in .ka-som-liste {max-height:45vh;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin}
.ka-cote-in .ka-som-titre[role="button"] {cursor:pointer;user-select:none;display:flex;align-items:center;gap:.4rem}
.ka-cote-in .ka-som-titre[role="button"]::after {content:"";margin-left:auto;width:.5rem;height:.5rem;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);transition:transform .2s}
.ka-cote-in .ka-sommaire.ka-som-ferme .ka-som-titre::after {transform:rotate(-135deg)}
.ka-cote-in .ka-sommaire.ka-som-ferme .ka-som-liste {display:none}

/* colonne plus haute que l'écran (kit-article.js colonneCollante, Cedia 29/09) : aucun défilement interne, la
   colonne suit la page ; la pastille et le sommaire (en fin de colonne) restent collés en haut */
.ka-cote-in.ka-cote-longue {position:static!important;max-height:none!important;overflow:visible!important;height:100%;padding-right:0}
.ka-cote-in.ka-cote-longue > .ka-cote-colle {position:sticky;top:var(--ks-top,calc(var(--ka-haut,var(--header-h,72px)) + 1rem));display:flex;flex-direction:column;gap:16px;z-index:2}
.ka-cote-colle > * {margin:0!important}
