/* ============================================================
   KOVERI — Design system (vanilla CSS, mobile-first)
   Couleurs en variables CSS · animations en CSS pur · zéro JS.
   ============================================================ */

/* ─── 1 ─ TOKENS ──────────────────────────────────────────── */
:root {
  /* Couleurs */
  --c-cream:  #F5F0E8;
  --c-ink:    #111111;
  --c-lime:   #C1F11E;
  --c-orange: #FF5C00;
  --c-white:  #FFFFFF;

  /* Bg variantes (tints des couvertures ok/non ok) */
  --c-ok-bg:  #F1FBD9;
  --c-no-bg:  #FFEDE2;

  /* Typographie */
  --font-display: 'Outfit', system-ui, sans-serif;
  --font-body:    'Outfit', system-ui, sans-serif;
  --font-logo:    'Fredoka', system-ui, sans-serif;

  /* Bordure carte (toutes les cards ont un trait noir 1.5px) */
  --border-ink: 1.5px solid var(--c-ink);

  /* Rayons */
  --r-card: 20px;
  --r-card-lg: 24px;
  --r-pill: 999px;

  /* Layout */
  --wrap-max: 1280px;
  --wrap-pad: 22px;

  /* Animation des points du logo (peut être surchargé en desktop) */
  --dot-fall: 48px;
  --dot-fall-orange: 54px;
}

/* ─── 2 ─ RESET LÉGER ─────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  font-family: var(--font-body);
  color: var(--c-ink);
  background: var(--c-cream);
  line-height: 1.4;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; cursor: pointer; border: 0; background: none; padding: 0; }
ul { list-style: none; padding: 0; margin: 0; }
img, svg { display: block; max-width: 100%; }
h1, h2, h3, h4, p { margin: 0; }

/* ─── 3 ─ GRAIN PAPIER (subtil) ───────────────────────────── */
.k-grain { position: relative; }
.k-grain::before {
  content: '';
  position: fixed; inset: 0;
  pointer-events: none;
  z-index: 9999;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 0.55 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
  opacity: 0.06;
  mix-blend-mode: multiply;
}

/* ─── 4 ─ LAYOUT ──────────────────────────────────────────── */
.k-wrap {
  max-width: var(--wrap-max);
  margin: 0 auto;
  padding-left: var(--wrap-pad);
  padding-right: var(--wrap-pad);
}

/* ─── 5 ─ WORDMARK ────────────────────────────────────────── */
.k-wordmark {
  font-family: var(--font-logo);
  font-weight: 600;
  font-size: 32px;
  letter-spacing: -0.02em;
  line-height: 1;
  color: var(--c-ink);
  display: inline-flex;
  align-items: flex-end;
  position: relative;
  user-select: none;
}
.k-wordmark--inverse { color: var(--c-cream); }

/* The 'i' slot — narrow (just stem width), the dots overhang and float above x-height */
.k-wm-i {
  position: relative;
  display: inline-block;
  width: 0.30em;
  height: 1em;
  margin-left: 0.02em;
}
.k-wm-stem {
  position: absolute;
  left: 50%; bottom: 0;
  width: 0.30em; height: 0.62em;
  transform: translateX(-50%);
  background: currentColor;
  border-radius: 0.15em;
}
.k-wm-dot {
  position: absolute;
  bottom: 0.76em;            /* stem (0.62) + lift (0.14) */
  width: 0.72em; height: 0.72em;
  border-radius: 50%;
  transform-origin: center;
}
.k-wm-dot--lime {
  background: var(--c-lime);
  /* center 0.18em left of slot.center → left edge -0.39em from slot left */
  left: -0.39em;
  z-index: 2;
}
.k-wm-dot--orange {
  background: var(--c-orange);
  /* center 0.18em right of slot.center → left edge -0.03em */
  left: -0.03em;
  z-index: 3;
}

/* Logo dot animation — sit, fall, bounce on the badge, snap back */
@keyframes k-fall-lime {
  0%, 10%  { transform: translate(0, 0)                            rotate(0deg); }
  28%      { transform: translate(-1px, var(--dot-fall, 48px))     rotate(120deg); }
  38%      { transform: translate(-1px, calc(var(--dot-fall) - 18px)) rotate(150deg); }
  50%      { transform: translate(-2px, calc(var(--dot-fall) + 2px)) rotate(190deg); }
  58%      { transform: translate(-2px, calc(var(--dot-fall) + 2px)) rotate(190deg); }
  80%      { transform: translate(0, -6px)                         rotate(355deg); }
  90%      { transform: translate(0, 3px)                          rotate(365deg); }
  100%     { transform: translate(0, 0)                            rotate(360deg); }
}
@keyframes k-fall-orange {
  0%, 14%  { transform: translate(0, 0)                                  rotate(0deg); }
  32%      { transform: translate(10px, var(--dot-fall-orange, 54px))    rotate(-130deg); }
  42%      { transform: translate(13px, calc(var(--dot-fall-orange) - 18px)) rotate(-165deg); }
  54%      { transform: translate(15px, calc(var(--dot-fall-orange) + 2px)) rotate(-205deg); }
  62%      { transform: translate(15px, calc(var(--dot-fall-orange) + 2px)) rotate(-205deg); }
  83%      { transform: translate(0, -5px)                               rotate(-360deg); }
  92%      { transform: translate(0, 3px)                                rotate(-370deg); }
  100%     { transform: translate(0, 0)                                  rotate(-360deg); }
}
.k-wordmark--animate .k-wm-dot--lime {
  animation: k-fall-lime 2.6s 0.4s both cubic-bezier(0.5, 0.05, 0.55, 1.05);
}
.k-wordmark--animate .k-wm-dot--orange {
  animation: k-fall-orange 2.8s 0.55s both cubic-bezier(0.5, 0.05, 0.55, 1.05);
}
@media (prefers-reduced-motion: reduce) {
  .k-wordmark--animate .k-wm-dot { animation: none; }
}

/* ─── 6 ─ EYEBROW (with two-circle motif) ─────────────────── */
.k-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-family: var(--font-body);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--c-ink);
  margin-bottom: 18px;
}
.k-eyebrow--lime { color: var(--c-lime); }
.k-twocircles { width: 28px; height: 14px; flex-shrink: 0; }

/* ─── 7 ─ BADGE (small pill with status dot) ──────────────── */
.k-badge {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 7px 14px 7px 10px;
  background: var(--c-white);
  border: var(--border-ink);
  border-radius: var(--r-pill);
  font-size: 12.5px;
  font-weight: 500;
  margin-bottom: 22px;
}
.k-badge__dot {
  width: 16px; height: 16px;
  border-radius: 50%;
  background: var(--c-lime);
  border: var(--border-ink);
}

/* ─── 8 ─ PILL (cliquables, catégories) ───────────────────── */
.k-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 16px;
  border-radius: var(--r-pill);
  font-size: 14px;
  font-weight: 500;
  white-space: nowrap;
}
.k-pill--lime    { background: var(--c-lime);  color: var(--c-ink);   border: var(--border-ink); }
.k-pill--outline { background: transparent;    color: var(--c-cream); border: 1.5px solid var(--c-cream); }
.k-pill--ink     { background: var(--c-ink);   color: var(--c-cream); border: var(--border-ink); }

.k-pill__icon { font-size: 15px; }

/* ─── 9 ─ CTA BUTTON ──────────────────────────────────────── */
.k-cta {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 18px 18px 18px 22px;
  border-radius: var(--r-pill);
  font-family: var(--font-body);
  font-weight: 600;
  font-size: 16px;
}
.k-cta--ink { background: var(--c-ink); color: var(--c-white); }

.k-cta__puck {
  width: 28px; height: 28px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.k-cta__puck svg { width: 16px; height: 16px; }
.k-cta__puck--lime  { background: var(--c-lime);  color: var(--c-ink); }
.k-cta__puck--cream { background: var(--c-cream); color: var(--c-ink); }

/* ─── 10 ─ TAG (inline highlight inside headlines) ─────────── */
.k-tag {
  background: var(--c-lime);
  color: var(--c-ink);
  padding: 0.04em 0.22em 0.06em;
  border-radius: 0.16em;
  /* keep multi-word tags together — don't let them split across lines */
  white-space: nowrap;
}
.k-tag--lime { background: var(--c-lime); color: var(--c-ink); }
.k-tag--ink  { background: var(--c-ink);  color: var(--c-lime); }

/* ─── 11 ─ CARD ───────────────────────────────────────────── */
.k-card {
  background: var(--c-white);
  border: var(--border-ink);
  border-radius: var(--r-card);
  padding: 18px;
}

/* ─── 12 ─ AVATAR ─────────────────────────────────────────── */
.k-avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px; height: 32px;
  border-radius: 50%;
  border: var(--border-ink);
  font-size: 16px;
  flex-shrink: 0;
}
.k-avatar--lg {
  width: 64px; height: 64px;
  background: var(--c-cream);
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 22px;
  letter-spacing: -0.02em;
}
.k-avatar--lime  { background: var(--c-lime); }
.k-avatar--cream { background: var(--c-cream); }
.k-avatar--white { background: var(--c-white); }

/* ─── 13 ─ SECTION BASE ───────────────────────────────────── */
.k-section {
  padding-top: 44px;
  padding-bottom: 44px;
  position: relative;
}
.k-section--tight    { padding-top: 0; }
.k-section--ink      { background: var(--c-ink);   color: var(--c-cream); }
.k-section--lime     { background: var(--c-lime);  color: var(--c-ink); }
.k-section--center   { text-align: center; }

/* ─── 14 ─ TYPOGRAPHIE TITRES ─────────────────────────────── */
.k-h2 {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 30px;
  line-height: 0.98;
  letter-spacing: -0.04em;
  margin-bottom: 22px;
  text-wrap: balance;
}
.k-h2--xl {
  font-size: 44px;
  letter-spacing: -0.045em;
}

/* ─── 15 ─ TOP BAR ────────────────────────────────────────── */
.k-topbar {
  position: relative;
  z-index: 100; /* above hero so falling dots paint on top */
  padding: 14px 0 8px;
}
.k-topbar__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.k-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  font-weight: 500;
  white-space: nowrap;
}
.k-link__arrow { width: 14px; height: 14px; }

/* ─── 16 ─ HERO ───────────────────────────────────────────── */
.k-hero {
  padding: 24px 0 28px;
}
.k-hero__title {
  font-family: var(--font-display);
  font-weight: 800;
  font-size: clamp(42px, 11vw, 64px);
  line-height: 1.0;
  letter-spacing: -0.045em;
  margin-bottom: 0;
  text-wrap: balance;
}
.k-hero__lead {
  font-size: 16px;
  line-height: 1.45;
  color: #3a3a3a;
  margin: 20px 0 24px;
  max-width: 540px;
}
.k-hero__actions {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.k-cta { width: 100%; }
@media (min-width: 720px) {
  .k-hero__actions { flex-direction: row; align-items: center; gap: 28px; flex-wrap: wrap; }
  .k-cta { width: auto; }
}

.k-social {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 12px;
  color: #666;
}
.k-social b { color: var(--c-ink); font-weight: 700; }
.k-avatars { display: flex; }
.k-avatars .k-avatar {
  width: 22px; height: 22px;
  margin-left: -8px;
  border: 1.5px solid var(--c-cream);
}
.k-avatars .k-avatar:first-child { margin-left: 0; }

/* ─── 17 ─ CATEGORIES ─────────────────────────────────────── */
.k-categories__head {
  display: grid;
  gap: 12px;
  margin-bottom: 22px;
}
.k-categories__sub {
  font-size: 14px;
  line-height: 1.45;
  color: rgba(245, 240, 232, 0.7);
  max-width: 480px;
}
.k-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

/* ─── 18 ─ STEPS ──────────────────────────────────────────── */
.k-steps {
  display: grid;
  gap: 12px;
}
.k-step { display: flex; gap: 14px; align-items: flex-start; }
.k-step__num {
  flex-shrink: 0;
  width: 48px; height: 48px;
  border-radius: 50%;
  border: var(--border-ink);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 14px;
  letter-spacing: -0.04em;
}
.k-step__num--lime  { background: var(--c-lime);  color: var(--c-ink); }
.k-step__num--ink   { background: var(--c-ink);   color: var(--c-cream); }
.k-step__num--white { background: var(--c-white); color: var(--c-ink); }

.k-step__title {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 16px;
  letter-spacing: -0.03em;
  margin-bottom: 4px;
}
.k-step__body {
  font-size: 13.5px;
  line-height: 1.4;
  color: #444;
}

/* ─── 19 ─ ANALYSIS CARD ──────────────────────────────────── */
.k-analysis { padding: 18px; }
.k-analysis__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 14px;
}
.k-analysis__label {
  display: block;
  font-size: 11px;
  font-weight: 500;
  color: #888;
  margin-bottom: 2px;
  letter-spacing: 0.04em;
}
.k-analysis__title {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 17px;
  letter-spacing: -0.03em;
}
.k-grade {
  width: 36px; height: 36px;
  border-radius: 50%;
  background: var(--c-lime);
  border: var(--border-ink);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-display);
  font-weight: 800;
  font-size: 14px;
  flex-shrink: 0;
}

.k-coverage {
  display: grid;
  gap: 8px;
  margin-bottom: 12px;
}
.k-coverage__row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid var(--c-ink);
  border-radius: 12px;
  font-size: 13px;
}
.k-coverage__row--ok { background: var(--c-ok-bg); }
.k-coverage__row--no { background: var(--c-no-bg); }
.k-coverage__icon {
  flex-shrink: 0;
  width: 20px; height: 20px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  line-height: 1;
}
.k-coverage__row--ok .k-coverage__icon { background: var(--c-lime); color: var(--c-ink); }
.k-coverage__row--ok .k-coverage__icon svg { width: 12px; height: 12px; }
.k-coverage__row--no .k-coverage__icon { background: var(--c-orange); color: var(--c-white); font-size: 13px; }
.k-coverage__name { flex: 1; font-weight: 500; }
.k-coverage__value { color: #555; font-size: 12px; }

.k-warning {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  background: var(--c-ink);
  color: var(--c-cream);
  border-radius: 14px;
  padding: 12px 14px;
}
.k-warning__icon {
  flex-shrink: 0;
  min-width: 22px; height: 22px;
  border-radius: 50%;
  background: var(--c-orange);
  color: var(--c-ink);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-display);
  font-weight: 800;
  font-size: 12px;
  margin-top: 1px;
}
.k-warning__text {
  font-size: 12.5px;
  line-height: 1.4;
}
.k-warning__text b { font-family: var(--font-display); letter-spacing: -0.02em; }

/* ─── 20 ─ "ON EST DE TON CÔTÉ" ────────────────────────────── */
.k-side { display: grid; gap: 22px; }
.k-side__lead {
  font-size: 15px;
  line-height: 1.45;
  max-width: 540px;
  margin-top: 0;
}
.k-side__list { display: grid; gap: 10px; }
.k-side__item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 16px;
  background: var(--c-cream);
  border: var(--border-ink);
  border-radius: var(--r-pill);
  font-size: 14px;
  font-weight: 500;
}
.k-side__check {
  flex-shrink: 0;
  width: 22px; height: 22px;
  border-radius: 50%;
  background: var(--c-ink);
  color: var(--c-lime);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.k-side__check svg { width: 13px; height: 13px; }

/* ─── 21 ─ LAWYER ─────────────────────────────────────────── */
.k-lawyer {
  position: relative;
  overflow: hidden;
  padding: 22px;
  border-radius: var(--r-card-lg);
}
.k-lawyer__sticker {
  position: absolute;
  top: -16px; right: -10px;
  transform: rotate(12deg);
  width: 72px;
}
.k-lawyer__inner { position: relative; }
.k-validated {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 5px 12px;
  background: var(--c-ink);
  color: var(--c-cream);
  border-radius: var(--r-pill);
  font-size: 11px;
  font-weight: 500;
  margin-bottom: 16px;
}
.k-validated svg { width: 12px; height: 12px; }
.k-lawyer__person {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 14px;
}
.k-lawyer__name {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 18px;
  letter-spacing: -0.03em;
}
.k-lawyer__role {
  font-size: 12px;
  color: #666;
}
.k-lawyer__quote {
  font-size: 14px;
  line-height: 1.5;
  font-style: italic;
  color: #222;
  margin: 0;
  max-width: 620px;
}

/* ─── 22 ─ FEATURES GRID ──────────────────────────────────── */
.k-features {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}
.k-feature {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 140px;
  padding: 16px;
}
.k-feature--lime { background: var(--c-lime); }
.k-feature__icon { width: 24px; height: 24px; color: var(--c-ink); }
.k-feature__title {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 15px;
  letter-spacing: -0.03em;
  margin-bottom: 4px;
}
.k-feature__body {
  font-size: 12.5px;
  line-height: 1.35;
  color: #444;
}

/* ─── 23 ─ TESTIMONIALS ───────────────────────────────────── */
.k-quotes {
  display: grid;
  gap: 12px;
}
.k-quote {
  background: var(--c-cream);
  color: var(--c-ink);
  border-radius: var(--r-card);
  padding: 18px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.k-quote__text {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: 15px;
  line-height: 1.4;
  letter-spacing: -0.02em;
  margin-bottom: 14px;
}
.k-quote__person {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 12px;
  font-weight: 500;
}

/* ─── 24 ─ NUMBERS ────────────────────────────────────────── */
.k-numbers {
  display: grid;
  gap: 10px;
}
.k-number {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 14px;
  padding: 20px 22px;
}
.k-number--ink  { background: var(--c-ink);  color: var(--c-cream); }
.k-number--lime { background: var(--c-lime); color: var(--c-ink); }
.k-number__value {
  font-family: var(--font-display);
  font-weight: 800;
  font-size: 44px;
  line-height: 1;
  letter-spacing: -0.05em;
}
.k-number__label {
  font-size: 13px;
  text-align: right;
  max-width: 160px;
  line-height: 1.25;
}

/* ─── 25 ─ FINAL CTA ──────────────────────────────────────── */
.k-final-title {
  font-family: var(--font-display);
  font-weight: 800;
  font-size: clamp(44px, 12vw, 72px);
  line-height: 0.98;
  letter-spacing: -0.05em;
  margin-bottom: 14px;
}
.k-final-lead {
  font-size: 15px;
  line-height: 1.45;
  max-width: 560px;
  margin: 0 auto 24px;
}
.k-section--center .k-cta { width: 100%; }
.k-final-fineprint {
  margin-top: 16px;
  font-size: 12px;
  color: #222;
}

/* ─── 26 ─ FOOTER ─────────────────────────────────────────── */
.k-footer { padding-top: 36px; padding-bottom: 26px; }
.k-footer__grid {
  display: grid;
  gap: 24px;
  margin-bottom: 22px;
}
.k-footer__desc {
  font-size: 13px;
  line-height: 1.5;
  color: #bbb;
  margin: 14px 0 0;
  max-width: 320px;
}
.k-footer__col {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.k-footer__head {
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: #888;
  margin-bottom: 6px;
}
.k-footer__col a {
  font-size: 13px;
  color: var(--c-cream);
  padding: 4px 0;
}
.k-footer__bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-top: 14px;
  font-size: 11px;
  color: #888;
  border-top: 1px solid rgba(245, 240, 232, 0.12);
}
.k-status { display: inline-flex; align-items: center; gap: 6px; }
.k-status__dot { width: 8px; height: 8px; border-radius: 50%; background: var(--c-lime); }


/* ============================================================
   RESPONSIVE — Tablette ≥ 720px
   ============================================================ */
@media (min-width: 720px) {
  :root {
    --wrap-pad: 40px;
  }
  .k-section { padding-top: 64px; padding-bottom: 64px; }

  .k-h2 { font-size: 44px; }
  .k-h2--xl { font-size: 72px; }
  .k-hero { padding: 48px 0 56px; }
  .k-hero__lead { font-size: 18px; }

  .k-steps,
  .k-features,
  .k-quotes,
  .k-numbers {
    grid-template-columns: repeat(2, 1fr);
  }

  .k-side {
    grid-template-columns: 1fr 1fr;
    align-items: center;
    gap: 48px;
  }
}

/* ============================================================
   RESPONSIVE — Desktop ≥ 1024px
   ============================================================ */
@media (min-width: 1024px) {
  :root {
    --wrap-pad: 64px;
    --dot-fall: 62px;
    --dot-fall-orange: 68px;
  }

  .k-section { padding-top: 96px; padding-bottom: 96px; }
  .k-section--tight { padding-top: 0; }

  .k-topbar { padding: 22px 0; }
  .k-wordmark { font-size: 36px; }

  .k-hero { padding: 64px 0 96px; }
  .k-hero__title { font-size: clamp(72px, 9vw, 128px); }
  .k-hero__lead { font-size: 22px; max-width: 640px; margin: 40px 0; }

  .k-h2    { font-size: clamp(48px, 5vw, 80px); }
  .k-h2--xl{ font-size: clamp(64px, 7vw, 112px); }

  .k-categories__head {
    grid-template-columns: 1fr 1fr;
    align-items: start;
    gap: 64px;
  }
  .k-categories__sub { font-size: 18px; line-height: 1.5; }

  .k-steps,
  .k-quotes,
  .k-numbers { grid-template-columns: repeat(3, 1fr); gap: 20px; }
  .k-features { grid-template-columns: repeat(4, 1fr); gap: 16px; }

  .k-step      { flex-direction: column; align-items: flex-start; gap: 20px; min-height: 240px; padding: 28px; }
  .k-step__num { width: 64px; height: 64px; font-size: 18px; }
  .k-step__title { font-size: 24px; }
  .k-step__body  { font-size: 16px; line-height: 1.5; }

  .k-analysis { max-width: 720px; margin: 0 auto; padding: 28px; }
  .k-analysis__title { font-size: 22px; }
  .k-grade { width: 52px; height: 52px; font-size: 18px; }
  .k-coverage__row { padding: 12px 16px; font-size: 15px; border-radius: 14px; }
  .k-coverage__icon { width: 24px; height: 24px; }
  .k-coverage__icon svg { width: 14px; height: 14px; }
  .k-coverage__value { font-size: 14px; }
  .k-warning { border-radius: 16px; padding: 14px 16px; }
  .k-warning__text { font-size: 14.5px; line-height: 1.45; }

  .k-side { grid-template-columns: 1.1fr 1fr; gap: 72px; }
  .k-side__lead { font-size: 18px; line-height: 1.5; }
  .k-side__item { padding: 16px 22px; font-size: 16px; gap: 12px; }
  .k-side__check { width: 26px; height: 26px; }
  .k-side__check svg { width: 14px; height: 14px; }

  .k-lawyer { max-width: 800px; margin: 0 auto; padding: 36px; border-radius: 28px; }
  .k-lawyer__sticker { width: 96px; top: -22px; right: -12px; }
  .k-avatar--lg { width: 84px; height: 84px; font-size: 28px; }
  .k-lawyer__name { font-size: 24px; }
  .k-lawyer__role { font-size: 14px; }
  .k-lawyer__quote { font-size: 17px; line-height: 1.55; }

  .k-feature { min-height: 200px; padding: 24px; }
  .k-feature__icon { width: 28px; height: 28px; }
  .k-feature__title { font-size: 20px; margin-bottom: 6px; }
  .k-feature__body { font-size: 14.5px; line-height: 1.45; }

  .k-quote { min-height: 280px; padding: 28px; border-radius: 24px; }
  .k-quote__text { font-size: 19px; }
  .k-quote__person .k-avatar { width: 40px; height: 40px; font-size: 18px; }

  .k-number { padding: 32px 28px; border-radius: 24px; gap: 18px; }
  .k-number__value { font-size: 72px; }
  .k-number__label { font-size: 15px; max-width: 200px; line-height: 1.3; }

  .k-final-title { font-size: clamp(72px, 9vw, 140px); max-width: 1100px; margin-left: auto; margin-right: auto; }
  .k-final-lead { font-size: 20px; max-width: 560px; }
  .k-cta { padding: 22px 28px 22px 36px; font-size: 18px; gap: 16px; }
  .k-cta__puck { width: 36px; height: 36px; }
  .k-cta__puck svg { width: 18px; height: 18px; }
  .k-section--center .k-cta { width: auto; }

  .k-footer { padding-top: 72px; padding-bottom: 36px; }
  .k-footer__grid {
    grid-template-columns: 1.4fr 1fr 1fr 1fr;
    gap: 32px;
    margin-bottom: 56px;
  }
  .k-footer__desc { font-size: 14px; line-height: 1.55; }
  .k-footer__col a { font-size: 14px; }
  .k-footer__bottom { padding-top: 22px; font-size: 12px; }

  .k-pill { padding: 12px 20px; font-size: 15px; gap: 10px; }
  .k-pill__icon { font-size: 17px; }

  .k-badge { padding: 8px 16px 8px 10px; font-size: 13px; margin-bottom: 36px; }
  .k-badge__dot { width: 18px; height: 18px; }
}