/* =========================================================================
   Kara skin v3 — HOME (statique). Palette de travail « encre nuit ».
   100% piloté par les tokens : aucune couleur en dur (les alphas dérivent
   d'un token via color-mix). La repalettisation finale reste gratuite.
   ========================================================================= */

/* -------------------------------------------------------------------------
   Contexte SOMBRE : .kara-home re-scope les rôles sémantiques en nuit.
   Tous les composants de base héritent automatiquement (titres, liens…).
   ------------------------------------------------------------------------- */
.kara-home {
  --ks-bg:        var(--ks-forest);
  --ks-fg:        var(--ks-on-dark);
  --ks-ink:       var(--ks-on-dark);       /* titres en crème */
  --ks-ink-soft:  color-mix(in srgb, var(--ks-on-dark) 82%, var(--ks-on-dark-soft)); /* crème adouci sur vert */
  --ks-muted:     var(--ks-on-dark-soft);  /* acier */
  --ks-surface:   var(--ks-surface-dark);
  --ks-line:      var(--ks-line-dark);
  --ks-link:      var(--ks-mint);          /* or clair sur sombre (9.25:1) */
  --ks-link-hover:var(--ks-paper);

  background: var(--ks-forest);
  color: var(--ks-on-dark);
}
.kara-home .ks-hairline { border-color: color-mix(in srgb, var(--ks-on-dark) 14%, transparent); }

/* Conteneur + sections (l'espace comme luxe) */
.kara-home .kh-wrap { width: 100%; max-width: var(--ks-container); margin-inline: auto; padding-inline: var(--ks-gutter); }
.kara-home .kh-wrap--narrow { max-width: 940px; }
.kara-home .kh-section { padding-block: var(--ks-space-8); }
.kara-home .kh-section--alt { background: var(--ks-forest-2); }
.kara-home .kh-head { max-width: 60ch; margin-bottom: var(--ks-space-7); }
.kara-home .kh-head h2 { margin: 0 0 var(--ks-space-4); }
.kara-home .kh-head p { color: var(--ks-on-dark-soft); margin: 0; font-size: var(--ks-fs-lead); line-height: var(--ks-lh-snug); }
.kara-home .kh-eyebrow { display:block; font-size: var(--ks-fs-kicker); font-weight: var(--ks-fw-semibold); letter-spacing: var(--ks-ls-kicker); text-transform: uppercase; color: var(--ks-mint); margin-bottom: var(--ks-space-3); }

@media (min-width: 768px) {
  .kara-home .kh-section { padding-block: var(--ks-space-9); }
}

/* -------------------------------------------------------------------------
   HEADER / NAV (token-only ; réutilise les classes JS .ks-burger/.ks-mobile-nav)
   ------------------------------------------------------------------------- */
.kara-home .kh-header { position: sticky; top: 0; z-index: 100; background: color-mix(in srgb, var(--ks-forest) 90%, transparent); backdrop-filter: blur(8px); border-bottom: 1px solid color-mix(in srgb, var(--ks-on-dark) 10%, transparent); transition: background var(--ks-dur) var(--ks-ease-out), box-shadow var(--ks-dur) var(--ks-ease-out); }
/* Condense au scroll : on n'anime QUE background + ombre (zéro layout). */
.kara-home .kh-header.is-condensed { background: color-mix(in srgb, var(--ks-forest) 96%, transparent); box-shadow: 0 8px 28px color-mix(in srgb, var(--ks-forest) 65%, transparent); }
.kara-home .kh-bar { display: flex; align-items: center; justify-content: space-between; gap: var(--ks-space-5); padding-block: var(--ks-space-4); }
.kara-home .kh-brand { display: inline-flex; align-items: baseline; gap: .5ch; font-family: var(--ks-font-display); color: var(--ks-on-dark); text-decoration: none; line-height: 1; }
.kara-home .kh-brand b { font-weight: var(--ks-fw-semibold); font-size: 1.55rem; letter-spacing: var(--ks-ls-heading); }
.kara-home .kh-brand span { font-family: var(--ks-font-body); font-size: var(--ks-fs-kicker); font-weight: var(--ks-fw-medium); letter-spacing: .14em; text-transform: uppercase; color: var(--ks-on-dark-soft); }
.kara-home .kh-nav { display: none; }
.kara-home .kh-nav ul { display: flex; align-items: center; gap: var(--ks-space-6); margin: 0; padding: 0; list-style: none; }
.kara-home .kh-nav a { position: relative; display: inline-flex; align-items: center; min-height: var(--ks-tap-min); color: var(--ks-on-dark); font-size: var(--ks-fs-sm); font-weight: var(--ks-fw-medium); text-decoration: none; }
.kara-home .kh-nav a::after { content:""; position:absolute; left:0; bottom:9px; width:100%; height:1.5px; background: var(--ks-mint); transform: scaleX(0); transform-origin: left; transition: transform var(--ks-dur) var(--ks-ease-out); }
.kara-home .kh-nav a:hover::after, .kara-home .kh-nav a[aria-current="page"]::after { transform: scaleX(1); }
.kara-home .kh-header-actions { display: flex; align-items: center; gap: var(--ks-space-3); }
.kara-home .kh-header-actions .ks-btn { display: none; }

.kara-home .ks-burger { display: inline-flex; flex-direction: column; justify-content: center; gap: 5px; width: var(--ks-tap-min); height: var(--ks-tap-min); padding: 0; background: transparent; border: 1px solid color-mix(in srgb, var(--ks-on-dark) 28%, transparent); border-radius: var(--ks-radius-sm); cursor: pointer; }
.kara-home .ks-burger span { display: block; width: 20px; height: 2px; margin: 0 auto; background: var(--ks-on-dark); transition: transform var(--ks-dur) var(--ks-ease-out), opacity var(--ks-dur) var(--ks-ease-out); }
.kara-home .ks-burger[aria-expanded="true"] span:nth-child(1){ transform: translateY(7px) rotate(45deg); }
.kara-home .ks-burger[aria-expanded="true"] span:nth-child(2){ opacity: 0; }
.kara-home .ks-burger[aria-expanded="true"] span:nth-child(3){ transform: translateY(-7px) rotate(-45deg); }

.kara-home .ks-mobile-nav { position: fixed; inset: 0 0 0 auto; width: min(86vw, 360px); background: var(--ks-forest-2); padding: var(--ks-space-7) var(--ks-space-5) var(--ks-space-5); transform: translateX(100%); transition: transform var(--ks-dur-slow) var(--ks-ease-out); z-index: 200; display: flex; flex-direction: column; gap: var(--ks-space-2); box-shadow: var(--ks-shadow-3); overflow-y: auto; }
.kara-home .ks-mobile-nav.is-open { transform: translateX(0); }
.kara-home .ks-mobile-nav a { display: flex; align-items: center; min-height: var(--ks-tap-min); padding: var(--ks-space-3) 0; color: var(--ks-on-dark); font-family: var(--ks-font-display); font-size: var(--ks-fs-lead); text-decoration: none; border-bottom: 1px solid color-mix(in srgb, var(--ks-on-dark) 10%, transparent); }
.kara-home .ks-mobile-nav a:hover { color: var(--ks-mint); }
.kara-home .ks-mobile-nav .ks-btn { margin-top: var(--ks-space-4); }
.kara-home .ks-mobile-nav__close { align-self: flex-end; width: var(--ks-tap-min); height: var(--ks-tap-min); background: transparent; border: 1px solid color-mix(in srgb, var(--ks-on-dark) 28%, transparent); border-radius: var(--ks-radius-sm); color: var(--ks-on-dark); font-size: 1.5rem; cursor: pointer; }
.kara-home .ks-scrim { position: fixed; inset: 0; background: color-mix(in srgb, var(--ks-forest) 60%, transparent); opacity: 0; visibility: hidden; transition: opacity var(--ks-dur) var(--ks-ease-out), visibility var(--ks-dur); z-index: 150; }
.kara-home .ks-scrim.is-open { opacity: 1; visibility: visible; }

@media (min-width: 1024px) {
  .kara-home .kh-nav { display: block; }
  .kara-home .ks-burger { display: none; }
  .kara-home .kh-header-actions .ks-btn { display: inline-flex; }
}

/* -------------------------------------------------------------------------
   1. HERO — typographique (le type EST l'image)
   ------------------------------------------------------------------------- */
.kara-home .kh-hero { padding-block: clamp(3rem, 1.5rem + 7vw, 7rem) var(--ks-space-9); }
.kara-home .kh-hero-grid { display: grid; gap: var(--ks-space-7); align-items: center; }
.kara-home .kh-hero h1 { font-size: var(--ks-fs-display); line-height: var(--ks-lh-tight); letter-spacing: var(--ks-ls-tight); margin: 0 0 var(--ks-space-5); text-wrap: balance; }
.kara-home .kh-hero h1 .accent { color: var(--ks-mint); font-style: italic; }
.kara-home .kh-hero .kh-sub { font-size: var(--ks-fs-lead); line-height: var(--ks-lh-snug); color: var(--ks-on-dark-soft); max-width: 52ch; margin: 0 0 var(--ks-space-6); }
.kara-home .kh-hero-cta { display: flex; flex-wrap: wrap; align-items: center; gap: var(--ks-space-4); }
.kara-home .kh-textlink { display: inline-flex; align-items: center; gap: .5ch; min-height: var(--ks-tap-min); color: var(--ks-mint); font-weight: var(--ks-fw-medium); text-decoration: none; }
.kara-home .kh-textlink::after { content: "\2192"; transition: transform var(--ks-dur) var(--ks-ease-out); }
.kara-home .kh-textlink:hover::after { transform: translateX(4px); }
/* Emplacement photo équipe (SEUL placeholder autorisé, clairement identifié) */
.kara-home .kh-photo-slot { position: relative; aspect-ratio: 4 / 5; border: 1px dashed color-mix(in srgb, var(--ks-on-dark) 26%, transparent); border-radius: var(--ks-radius-lg); display: grid; place-content: center; text-align: center; gap: var(--ks-space-2); padding: var(--ks-space-5); background: color-mix(in srgb, var(--ks-on-dark) 4%, transparent); }
.kara-home .kh-photo-slot b { font-family: var(--ks-font-display); color: var(--ks-on-dark); font-weight: var(--ks-fw-medium); }
.kara-home .kh-photo-slot span { font-size: var(--ks-fs-xs); color: var(--ks-on-dark-soft); }

@media (min-width: 900px) {
  .kara-home .kh-hero-grid { grid-template-columns: 1.35fr .9fr; gap: var(--ks-space-8); }
}

/* -------------------------------------------------------------------------
   2. BANDEAU FACTURE ÉLECTRONIQUE (hook timely, ton utile)
   ------------------------------------------------------------------------- */
.kara-home .kh-notice { background: var(--ks-forest-2); border-block: 1px solid color-mix(in srgb, var(--ks-mint) 22%, transparent); }
.kara-home .kh-notice .kh-wrap { display: grid; gap: var(--ks-space-4); padding-block: var(--ks-space-6); }
.kara-home .kh-notice .kh-flag { font-family: var(--ks-font-body); font-size: var(--ks-fs-kicker); font-weight: var(--ks-fw-semibold); letter-spacing: var(--ks-ls-kicker); text-transform: uppercase; color: var(--ks-mint); }
.kara-home .kh-notice .kh-date { color: var(--ks-on-dark); font-weight: var(--ks-fw-semibold); }
.kara-home .kh-notice p { margin: 0; max-width: 72ch; color: var(--ks-on-dark-soft); font-size: var(--ks-fs-body); line-height: var(--ks-lh-body); }
.kara-home .kh-notice p strong { color: var(--ks-on-dark); font-weight: var(--ks-fw-semibold); }
@media (min-width: 860px) {
  .kara-home .kh-notice .kh-wrap { grid-template-columns: auto 1fr; align-items: baseline; gap: var(--ks-space-6); }
}

/* -------------------------------------------------------------------------
   3. PREUVE — ruban de crédibilité (valeurs réelles)
   ------------------------------------------------------------------------- */
.kara-home .kh-proof .kh-wrap { display: flex; flex-wrap: wrap; gap: var(--ks-space-4) var(--ks-space-6); align-items: center; justify-content: center; padding-block: var(--ks-space-6); border-block: 1px solid var(--ks-line); text-align: center; }
.kara-home .kh-proof span { font-size: var(--ks-fs-sm); color: var(--ks-on-dark-soft); }
.kara-home .kh-proof b { font-family: var(--ks-font-display); font-weight: var(--ks-fw-medium); color: var(--ks-on-dark); }
.kara-home .kh-proof .sep { width: 4px; height: 4px; border-radius: 50%; background: var(--ks-mint); flex: none; }

/* -------------------------------------------------------------------------
   4. POURQUOI KARA — éditorial, alignement gauche
   ------------------------------------------------------------------------- */
.kara-home .kh-why-grid { display: grid; gap: var(--ks-space-6); }
.kara-home .kh-why-item { padding-top: var(--ks-space-5); border-top: 1px solid var(--ks-line); }
.kara-home .kh-why-item h3 { font-size: var(--ks-fs-h3); margin: 0 0 var(--ks-space-2); }
.kara-home .kh-why-item p { margin: 0; color: var(--ks-on-dark-soft); max-width: 54ch; line-height: var(--ks-lh-body); }
@media (min-width: 760px) { .kara-home .kh-why-grid { grid-template-columns: repeat(2, 1fr); gap: var(--ks-space-7) var(--ks-space-8); } }

/* -------------------------------------------------------------------------
   5. NOS 4 MÉTIERS — cartes sobres (zéro icône)
   6. SECTEURS — santé + BTP (cartes-liens)
   11. BUREAUX — NAP
   Carte générique sombre réutilisée :
   ------------------------------------------------------------------------- */
.kara-home .kh-cards { display: grid; gap: var(--ks-space-4); }
.kara-home .kh-card { display: flex; flex-direction: column; gap: var(--ks-space-3); padding: var(--ks-space-6); background: var(--ks-surface); border: 1px solid var(--ks-line); border-radius: var(--ks-radius-lg); }
.kara-home .kh-card h3 { font-size: var(--ks-fs-h4); margin: 0; }
.kara-home .kh-card p { margin: 0; color: var(--ks-on-dark-soft); font-size: var(--ks-fs-sm); line-height: var(--ks-lh-body); }
.kara-home a.kh-card { text-decoration: none; transition: border-color var(--ks-dur) var(--ks-ease-out), transform var(--ks-dur) var(--ks-ease-out), background var(--ks-dur) var(--ks-ease-out); }
.kara-home a.kh-card:hover { border-color: color-mix(in srgb, var(--ks-mint) 55%, transparent); transform: translateY(-3px); }
.kara-home a.kh-card .kh-more { margin-top: auto; color: var(--ks-mint); font-weight: var(--ks-fw-medium); font-size: var(--ks-fs-sm); display: inline-flex; gap: .5ch; }
.kara-home a.kh-card .kh-more::after { content: "\2192"; transition: transform var(--ks-dur) var(--ks-ease-out); }
.kara-home a.kh-card:hover .kh-more::after { transform: translateX(4px); }
.kara-home .kh-card .kh-tag { font-family: var(--ks-font-body); font-size: var(--ks-fs-xs); letter-spacing: .04em; color: var(--ks-mint); text-transform: uppercase; font-weight: var(--ks-fw-semibold); }
@media (min-width: 680px) { .kara-home .kh-cards--2 { grid-template-columns: repeat(2, 1fr); } .kara-home .kh-cards--4 { grid-template-columns: repeat(2, 1fr); } .kara-home .kh-cards--3 { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1040px) { .kara-home .kh-cards--4 { grid-template-columns: repeat(4, 1fr); } }

/* -------------------------------------------------------------------------
   7. HONORAIRES — 3 packs (« le plus choisi » accentué)
   ------------------------------------------------------------------------- */
.kara-home .kh-pricing-grid { display: grid; gap: var(--ks-space-4); }
.kara-home .kh-pack { display: flex; flex-direction: column; gap: var(--ks-space-3); padding: var(--ks-space-6); background: var(--ks-surface); border: 1px solid var(--ks-line); border-radius: var(--ks-radius-lg); }
.kara-home .kh-pack--featured { border-color: var(--ks-accent); background: color-mix(in srgb, var(--ks-accent) 9%, var(--ks-surface)); position: relative; }
.kara-home .kh-pack__flag { align-self: flex-start; font-size: var(--ks-fs-xs); font-weight: var(--ks-fw-semibold); letter-spacing: .04em; text-transform: uppercase; color: var(--ks-on-accent); background: var(--ks-accent); padding: .25rem .6rem; border-radius: var(--ks-radius-pill); }
.kara-home .kh-pack__name { font-family: var(--ks-font-display); font-size: var(--ks-fs-h4); margin: 0; }
.kara-home .kh-pack__price { font-family: var(--ks-font-display); font-size: var(--ks-fs-h2); color: var(--ks-mint); line-height: 1; }
.kara-home .kh-pack__price small { font-family: var(--ks-font-body); font-size: var(--ks-fs-sm); color: var(--ks-on-dark-soft); font-weight: var(--ks-fw-regular); }
.kara-home .kh-pack__desc { margin: 0; color: var(--ks-on-dark-soft); font-size: var(--ks-fs-sm); line-height: var(--ks-lh-body); }
.kara-home .kh-pack ul { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--ks-space-2); }
.kara-home .kh-pack li { position: relative; padding-left: 1.4em; font-size: var(--ks-fs-sm); color: var(--ks-on-dark-soft); }
.kara-home .kh-pack li::before { content: "\2713"; position: absolute; left: 0; color: var(--ks-mint); font-weight: 700; }
.kara-home .kh-pack .ks-btn { margin-top: auto; }
.kara-home .kh-pricing-note { margin: var(--ks-space-5) 0 0; font-size: var(--ks-fs-sm); color: var(--ks-on-dark-soft); }
@media (min-width: 860px) { .kara-home .kh-pricing-grid { grid-template-columns: repeat(3, 1fr); align-items: start; } }

/* -------------------------------------------------------------------------
   8. CHIFFRES CLÉS — données comme graphisme (valeurs réelles, jamais 0)
   ------------------------------------------------------------------------- */
.kara-home .kh-figures-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--ks-space-6) var(--ks-space-4); border-top: 1px solid var(--ks-line); padding-top: var(--ks-space-7); }
.kara-home .kh-figure b { display: block; font-family: var(--ks-font-display); font-size: clamp(2.5rem, 1.6rem + 4vw, 4rem); line-height: 1; color: var(--ks-mint); font-variant-numeric: tabular-nums; }
.kara-home .kh-figure span { display: block; margin-top: var(--ks-space-3); color: var(--ks-on-dark-soft); font-size: var(--ks-fs-sm); line-height: var(--ks-lh-snug); }
@media (min-width: 860px) { .kara-home .kh-figures-grid { grid-template-columns: repeat(4, 1fr); } }

/* -------------------------------------------------------------------------
   11. BUREAUX — NAP
   ------------------------------------------------------------------------- */
.kara-home .kh-office { display: flex; flex-direction: column; gap: var(--ks-space-2); padding: var(--ks-space-6); background: var(--ks-surface); border: 1px solid var(--ks-line); border-radius: var(--ks-radius-lg); }
.kara-home .kh-office h3 { font-size: var(--ks-fs-h4); margin: 0 0 var(--ks-space-1); }
.kara-home .kh-office address { font-style: normal; color: var(--ks-on-dark-soft); font-size: var(--ks-fs-sm); line-height: var(--ks-lh-body); }
.kara-home .kh-office a { color: var(--ks-on-dark); text-decoration: none; font-weight: var(--ks-fw-medium); }
.kara-home .kh-office a:hover { color: var(--ks-mint); }
.kara-home .kh-office .kh-dir { margin-top: var(--ks-space-2); color: var(--ks-mint); font-size: var(--ks-fs-sm); font-weight: var(--ks-fw-medium); display: inline-flex; gap: .5ch; }
.kara-home .kh-office .kh-dir::after { content: "\2197"; }

/* -------------------------------------------------------------------------
   12. CTA FINAL
   ------------------------------------------------------------------------- */
.kara-home .kh-cta { text-align: center; }
.kara-home .kh-cta .kh-wrap { padding-block: var(--ks-space-9); }
.kara-home .kh-cta h2 { font-size: var(--ks-fs-h1); margin: 0 auto var(--ks-space-4); max-width: 18ch; }
.kara-home .kh-cta p { color: var(--ks-on-dark-soft); margin: 0 auto var(--ks-space-6); max-width: 46ch; font-size: var(--ks-fs-lead); }

/* -------------------------------------------------------------------------
   13. FOOTER v3 (4 colonnes, token-only)
   ------------------------------------------------------------------------- */
.kara-home .kh-footer { background: var(--ks-forest-2); border-top: 1px solid var(--ks-line); }
.kara-home .kh-footer .kh-wrap { padding-block: var(--ks-space-8) var(--ks-space-5); }
.kara-home .kh-footer-cols { display: grid; grid-template-columns: 1fr; gap: var(--ks-space-6); padding-bottom: var(--ks-space-7); border-bottom: 1px solid var(--ks-line); }
.kara-home .kh-footer .kh-brand b { color: var(--ks-on-dark); }
.kara-home .kh-footer-tag { color: var(--ks-on-dark-soft); font-size: var(--ks-fs-sm); line-height: var(--ks-lh-body); max-width: 42ch; margin: var(--ks-space-4) 0 var(--ks-space-3); }
.kara-home .kh-footer-ord { color: var(--ks-muted); font-size: var(--ks-fs-xs); margin: 0; }
.kara-home .kh-footer h4 { color: var(--ks-on-dark); font-family: var(--ks-font-body); font-size: var(--ks-fs-kicker); letter-spacing: .12em; text-transform: uppercase; font-weight: var(--ks-fw-semibold); margin: 0 0 var(--ks-space-4); }
.kara-home .kh-footer-col a, .kara-home .kh-footer-col span { display: flex; align-items: center; min-height: var(--ks-tap-min-inline); color: var(--ks-on-dark-soft); text-decoration: none; padding: var(--ks-space-1) 0; font-size: var(--ks-fs-sm); }
.kara-home .kh-footer-col a:hover { color: var(--ks-mint); }
.kara-home .kh-footer-legal { display: flex; flex-wrap: wrap; gap: var(--ks-space-3) var(--ks-space-5); justify-content: space-between; align-items: center; padding-top: var(--ks-space-5); font-size: var(--ks-fs-xs); color: var(--ks-muted); }
.kara-home .kh-footer-legal nav { display: flex; flex-wrap: wrap; gap: var(--ks-space-2) var(--ks-space-5); }
.kara-home .kh-footer-legal a { color: var(--ks-muted); text-decoration: none; }
.kara-home .kh-footer-legal a:hover { color: var(--ks-mint); }
@media (min-width: 640px) { .kara-home .kh-footer-cols { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .kara-home .kh-footer-cols { grid-template-columns: 1.7fr 1fr 1fr 1.3fr; gap: var(--ks-space-7); } }

/* Sections préparées mais masquées (équipe, avis) tant qu'on n'a pas
   de vraies photos / vrais avis. Pas de cadre vide, pas de faux contenu. */
.kara-home [hidden] { display: none !important; }

/* =========================================================================
   Refonte v4_b — sections enrichies (avis réels, manifeste, statement).
   Token-only, contexte sombre hérité de .kara-home.
   ========================================================================= */

/* ---- AVIS « Nos clients parlent de nous » (haut de page) ---------------- */
.kara-home .kh-reviews-grid { display: grid; grid-template-columns: 1fr; gap: var(--ks-space-4); }
.kara-home .kh-review { display: flex; flex-direction: column; gap: var(--ks-space-3); padding: var(--ks-space-6); background: var(--ks-surface); border: 1px solid var(--ks-line); border-radius: var(--ks-radius-lg); }
.kara-home .kh-stars { color: var(--ks-mint); font-size: var(--ks-fs-sm); letter-spacing: .12em; }
.kara-home .kh-review blockquote { margin: 0; color: var(--ks-on-dark); font-size: var(--ks-fs-sm); line-height: var(--ks-lh-body); }
.kara-home .kh-review cite { display: block; margin-top: auto; font-style: normal; }
.kara-home .kh-review cite b { display: block; font-family: var(--ks-font-display); color: var(--ks-on-dark); font-weight: var(--ks-fw-medium); font-size: var(--ks-fs-body); }
.kara-home .kh-review cite span { font-size: var(--ks-fs-xs); color: var(--ks-on-dark-soft); }
.kara-home .kh-reviews-note { margin: var(--ks-space-5) 0 0; font-size: var(--ks-fs-sm); color: var(--ks-on-dark-soft); }
.kara-home .kh-reviews-note a { color: var(--ks-mint); text-decoration: none; }
@media (min-width: 680px)  { .kara-home .kh-reviews-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1040px) { .kara-home .kh-reviews-grid { grid-template-columns: repeat(3, 1fr); } }

/* ---- MANIFESTE « Notre métier » (éditorial + aparté faits) ------------- */
.kara-home .kh-manifesto-grid { display: grid; grid-template-columns: 1fr; gap: var(--ks-space-7); align-items: start; }
.kara-home .kh-manifesto .lead { font-family: var(--ks-font-display); font-size: var(--ks-fs-h3); line-height: var(--ks-lh-snug); color: var(--ks-on-dark); margin: 0 0 var(--ks-space-5); text-wrap: balance; }
.kara-home .kh-manifesto p { color: var(--ks-on-dark-soft); max-width: 60ch; line-height: var(--ks-lh-body); }
.kara-home .kh-sign { display: flex; align-items: center; gap: var(--ks-space-4); margin-top: var(--ks-space-6); padding-top: var(--ks-space-5); border-top: 1px solid var(--ks-line); }
.kara-home .kh-sign .mark { width: 44px; height: 44px; flex: none; display: grid; place-items: center; border-radius: 50%; background: var(--ks-surface); color: var(--ks-mint); font-family: var(--ks-font-display); font-size: 1.25rem; border: 1px solid var(--ks-line); }
.kara-home .kh-sign b { display: block; color: var(--ks-on-dark); font-size: var(--ks-fs-sm); }
.kara-home .kh-sign span { font-size: var(--ks-fs-xs); color: var(--ks-on-dark-soft); }
.kara-home .kh-aside { background: var(--ks-surface); border: 1px solid var(--ks-line); border-radius: var(--ks-radius-lg); padding: var(--ks-space-6); display: grid; gap: var(--ks-space-4); }
.kara-home .kh-aside .row b { display: block; font-family: var(--ks-font-display); color: var(--ks-on-dark); }
.kara-home .kh-aside .row span { font-size: var(--ks-fs-sm); color: var(--ks-on-dark-soft); }
.kara-home .kh-aside .row + .row { padding-top: var(--ks-space-4); border-top: 1px solid var(--ks-line); }
@media (min-width: 920px) { .kara-home .kh-manifesto-grid { grid-template-columns: 1.6fr 1fr; gap: var(--ks-space-8); } }

/* ---- STATEMENT plein cadre (moment typographique) ---------------------- */
.kara-home .kh-statement { background: var(--ks-forest-2); text-align: center; }
.kara-home .kh-statement .kh-wrap { padding-block: var(--ks-space-9); }
.kara-home .kh-statement h2 { font-size: var(--ks-fs-display); line-height: var(--ks-lh-tight); letter-spacing: var(--ks-ls-tight); margin: 0 auto var(--ks-space-5); max-width: 16ch; }
.kara-home .kh-statement h2 .accent { color: var(--ks-mint); font-style: italic; }
.kara-home .kh-statement p { color: var(--ks-on-dark-soft); max-width: 52ch; margin: 0 auto; font-size: var(--ks-fs-lead); line-height: var(--ks-lh-snug); }