/* Tenfold — /onboarding-kit (VA Onboarding Kit sales page)
   Page-specific styles. Shared tokens and components come from base.css.
   Mockups use a scale unit (--u) so the illustrated files stay crisp HTML
   and shrink proportionally with their panel. */

/* ---------- Shared page bits ---------- */
.kit-eyebrow {
  font-size: 12px;
  letter-spacing: 0.08em;
  color: var(--color-graphite);
  font-weight: 400;
}
.kit-h2 {
  font-weight: 500;
  font-size: clamp(36px, 4.2vw, 60px);
  line-height: 1.034;
  letter-spacing: -0.035em;
  color: var(--color-ink);
}
.kit-num { color: var(--color-graphite); letter-spacing: 0.06em; }
main p, main blockquote { text-wrap: pretty; }
main h1, main h2 { text-wrap: balance; }

/* Big CTA button (design: 56px tall) */
.kit-btn { height: 56px; padding-inline: 28px; gap: 10px; font-size: 17px; }

.kit-price { display: flex; align-items: baseline; flex-wrap: wrap; column-gap: 16px; row-gap: 4px; }
.kit-price__amount {
  font-size: 56px; font-weight: 500; line-height: 1; letter-spacing: -0.04em; color: var(--color-ink);
}
.kit-price__note { color: var(--color-graphite); }

.kit-buy__actions { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; }
.kit-assure {
  display: flex; align-items: flex-start; gap: 8px;
  font-size: 15px; font-weight: 500; line-height: 20px; color: var(--color-graphite);
}
.kit-assure svg { flex-shrink: 0; margin-top: 3px; color: var(--color-ink); }

/* Section header: title left, aside right */
.kit-split-head {
  display: flex; align-items: flex-end; justify-content: space-between; gap: 40px;
}
.kit-split-head > div { display: flex; flex-direction: column; gap: 20px; max-width: 640px; }
.kit-split-head__aside {
  max-width: 400px; text-align: right;
  font-size: 20px; line-height: 30px; color: var(--color-graphite);
}

/* Mock UI primitives */
.kit-ico { display: inline-block; flex-shrink: 0; width: calc(14 * var(--u, 1px)); height: calc(14 * var(--u, 1px)); background: center / contain no-repeat; }
.kit-ico--lg { width: 16px; height: 16px; }
.kit-ico--doc { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='M3 1.5H8.5L11.5 4.5V12.5H3Z' fill='none' stroke='%2355575E' stroke-width='1.2' stroke-linejoin='round'/%3E%3Cpath d='M5 7H9.5M5 9.5H9.5' stroke='%2355575E' stroke-width='1.2'/%3E%3C/svg%3E"); }
.kit-ico--sheet { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Crect x='1.5' y='1.5' width='11' height='11' rx='2' fill='none' stroke='%2355575E' stroke-width='1.2'/%3E%3Cpath d='M1.5 5.2H12.5M1.5 8.8H12.5M5.5 5.2V12.5' stroke='%2355575E' stroke-width='1.2'/%3E%3C/svg%3E"); }
.kit-tick::before {
  content: ""; display: block; width: calc(12 * var(--u)); height: calc(12 * var(--u));
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='M2.5 7.2L5.6 10.2L11.5 3.8' fill='none' stroke='%230E0F12' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}
.kit-box {
  display: block; flex-shrink: 0; width: calc(20 * var(--u)); height: calc(20 * var(--u));
  border: 1.5px solid #C9C9C4; border-radius: calc(6 * var(--u)); background: #fff;
}
.kit-box--sm { width: calc(18 * var(--u)); height: calc(18 * var(--u)); border-radius: calc(5 * var(--u)); }
.kit-box.is-on {
  border-color: var(--color-ink);
  background: var(--color-ink) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='M2.5 7.2L5.6 10.2L11.5 3.8' fill='none' stroke='%23FFFFFF' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 62% no-repeat;
}

/* ---------- Hero ---------- */
.kit-hero { padding-block: 64px 112px; }
.kit-hero__inner {
  display: grid;
  grid-template-columns: minmax(0, 540px) minmax(0, 676px);
  justify-content: space-between; align-items: center; gap: 64px;
}
.kit-hero__copy { display: flex; flex-direction: column; }
.kit-hero__copy .kit-eyebrow { font-size: 13px; }
.kit-hero__title {
  padding-top: 24px;
  font-weight: 500; font-size: clamp(48px, 5.6vw, 80px); line-height: 1; letter-spacing: -0.04em;
}
.kit-hero__lede {
  padding-top: 28px; font-size: clamp(18px, 1.46vw, 21px); line-height: 1.476; color: var(--color-graphite);
}
.kit-buy {
  display: flex; flex-direction: column; gap: 24px;
  margin-top: 44px; padding-top: 28px; border-top: 1px solid var(--color-line);
}

/* Hero kit panel: a 676×660 artboard scaled by --u */
.kit-stage {
  --u: calc(100cqw / 676);
  container-type: inline-size;
  width: 100%; aspect-ratio: 676 / 660;
  overflow: hidden;
}
.kit-stage__art { position: absolute; inset: 0; }
.kit-stage__caption {
  position: absolute; left: 28px; right: 28px; bottom: calc(28 * var(--u));
}
.kit-filetype {
  display: flex; align-items: center; gap: calc(7 * var(--u));
  font-family: var(--font-mono); font-size: calc(10 * var(--u)); line-height: calc(12 * var(--u));
  letter-spacing: 0.06em; text-transform: uppercase; color: var(--color-graphite);
}

/* Google Doc card */
.kit-hdoc {
  position: absolute; left: calc(200 * var(--u)); top: calc(44 * var(--u));
  width: calc(290 * var(--u)); height: calc(392 * var(--u));
  display: flex; flex-direction: column; gap: calc(18 * var(--u));
  padding: calc(18 * var(--u)) calc(22 * var(--u));
  background: #fff; border: 1px solid var(--color-line); border-radius: calc(12 * var(--u));
  box-shadow: 0 1px 2px rgba(14, 15, 18, .04), 0 calc(20 * var(--u)) calc(48 * var(--u)) rgba(14, 15, 18, .08);
  rotate: -3.5deg; transform-origin: 0 0; overflow: hidden;
}
.kit-hdoc__head { display: flex; flex-direction: column; gap: calc(10 * var(--u)); }
.kit-hdoc__title, .kit-hsheet__title {
  font-size: calc(16 * var(--u)); line-height: calc(20 * var(--u)); font-weight: 600; letter-spacing: -0.01em;
}
.kit-hdoc__day { display: flex; flex-direction: column; gap: calc(7 * var(--u)); }
.kit-hdoc__day span { font-size: calc(12 * var(--u)); line-height: calc(16 * var(--u)); font-weight: 600; }
.kit-hdoc__day i { display: block; height: calc(5 * var(--u)); border-radius: 3px; background: var(--color-concrete-2); }
.kit-hdoc__day i:nth-of-type(2) { width: 86%; }
.kit-hdoc__day i:nth-of-type(3) { width: 62%; }

/* Google Sheet card */
.kit-hsheet {
  position: absolute; left: calc(348 * var(--u)); top: calc(172 * var(--u));
  width: calc(300 * var(--u)); height: calc(384 * var(--u));
  background: #fff; border: 1px solid var(--color-line); border-radius: calc(12 * var(--u));
  box-shadow: 0 1px 2px rgba(14, 15, 18, .04), 0 calc(20 * var(--u)) calc(48 * var(--u)) rgba(14, 15, 18, .08);
  rotate: 11deg; transform-origin: 0 0; overflow: hidden;
}
.kit-hsheet__head {
  display: flex; flex-direction: column; gap: calc(10 * var(--u));
  padding: calc(18 * var(--u)) calc(18 * var(--u)) calc(14 * var(--u));
}
.kit-hsheet__grid { border-top: 1px solid var(--color-line); }
.kit-hsheet__row {
  display: grid; grid-template-columns: calc(26 * var(--u)) 1fr calc(84 * var(--u)) calc(34 * var(--u));
  height: calc(30 * var(--u)); border-bottom: 1px solid var(--color-line);
  font-size: calc(12 * var(--u)); line-height: calc(16 * var(--u));
}
.kit-hsheet__row > span { display: flex; align-items: center; min-width: 0; white-space: nowrap; }
.kit-hsheet__row > span:nth-child(1) {
  justify-content: center; border-right: 1px solid var(--color-line);
  font-family: var(--font-mono); font-size: calc(9 * var(--u)); color: var(--color-faint);
}
.kit-hsheet__row > span:nth-child(2) { padding-left: calc(8 * var(--u)); }
.kit-hsheet__row > span:nth-child(3) { padding-left: calc(8 * var(--u)); border-left: 1px solid var(--color-line); color: var(--color-graphite); }
.kit-hsheet__row > span:nth-child(4) { justify-content: center; border-left: 1px solid var(--color-line); }
.kit-hsheet__row--head { height: calc(26 * var(--u)); background: var(--color-concrete); }
.kit-hsheet__row--head > span:nth-child(n+2) {
  font-family: var(--font-mono); font-size: calc(9 * var(--u)); letter-spacing: 0.06em;
  text-transform: uppercase; color: var(--color-graphite);
}

/* PDF cover */
.kit-pdf {
  position: absolute; left: calc(44 * var(--u)); top: calc(178 * var(--u));
  width: calc(300 * var(--u)); height: calc(400 * var(--u));
  display: flex; flex-direction: column; justify-content: space-between;
  padding: calc(26 * var(--u));
  background: var(--color-ink); border-radius: calc(10 * var(--u));
  box-shadow: 0 2px 4px rgba(14, 15, 18, .06), 0 calc(28 * var(--u)) calc(60 * var(--u)) rgba(14, 15, 18, .18);
  rotate: -5deg; transform-origin: 0 0; overflow: hidden;
}
.kit-pdf__top { display: flex; align-items: center; justify-content: space-between; }
.kit-pdf__top svg { width: calc(28 * var(--u)); height: calc(28 * var(--u)); }
.kit-pdf__top span, .kit-pdf__meta {
  font-family: var(--font-mono); font-size: calc(10 * var(--u)); line-height: calc(12 * var(--u));
  letter-spacing: 0.08em; text-transform: uppercase;
}
.kit-pdf__top span { color: var(--color-muted); }
.kit-pdf__bottom { display: flex; flex-direction: column; gap: calc(18 * var(--u)); }
.kit-pdf__title {
  color: #fff; font-size: calc(34 * var(--u)); line-height: calc(36 * var(--u)); font-weight: 500; letter-spacing: -0.03em;
}
.kit-pdf__meta { padding-top: calc(14 * var(--u)); border-top: 1px solid #2A2B30; color: #A3A5AB; }

/* ---------- Problem ---------- */
.kit-problem { padding-block: 40px 128px; }
.kit-problem__inner {
  display: grid; grid-template-columns: minmax(0, 600px) minmax(0, 600px);
  grid-template-areas: "figure copy";
  justify-content: space-between; align-items: center; gap: 80px;
}
.kit-problem__figure { grid-area: figure; display: flex; flex-direction: column; gap: 12px; }
.kit-problem__copy { grid-area: copy; }
.kit-problem__photo { aspect-ratio: 600 / 720; }
.kit-progress {
  position: absolute; left: 24px; bottom: 24px; width: min(272px, calc(100% - 48px));
  display: flex; flex-direction: column; gap: 12px;
  padding: 16px 18px; border-radius: 16px;
  box-shadow: 0 1px 2px rgba(14, 15, 18, .04), 0 8px 24px rgba(14, 15, 18, .05);
}
.kit-progress__meta {
  display: flex; justify-content: space-between; gap: 12px;
  font-size: 11px; line-height: 14px; color: var(--color-graphite);
}
.kit-progress__text { font-size: 16px; line-height: 22px; font-weight: 500; }
.kit-progress__bar { display: flex; gap: 4px; }
.kit-progress__bar i { flex: 1; height: 4px; border-radius: 2px; background: var(--color-concrete-2); }
.kit-progress__bar i.is-done { background: var(--color-ink); }

.kit-problem__title {
  padding-top: 20px;
  font-weight: 500; font-size: clamp(34px, 3.62vw, 52px); line-height: 1.077; letter-spacing: -0.035em;
}
.kit-problem__lede { padding-top: 24px; font-size: 19px; line-height: 29px; color: var(--color-graphite); }
.kit-fails { margin-top: 44px; border-bottom: 1px solid var(--color-line); }
.kit-fails li { display: flex; gap: 20px; padding-block: 22px; border-top: 1px solid var(--color-line); }
.kit-fails .kit-num { flex-shrink: 0; width: 28px; font-size: 13px; line-height: 24px; }
.kit-fails h3 { font-size: 18px; line-height: 24px; font-weight: 600; }
.kit-fails p { margin-top: 4px; font-size: 16px; line-height: 24px; color: var(--color-graphite); }

/* ---------- What's inside ---------- */
.kit-inside { padding-block: 24px 128px; }
.kit-inside__head { padding-bottom: 48px; border-bottom: 1px solid var(--color-line); }
.kit-inside__head > div { max-width: 600px; }
.kit-inside__head .kit-split-head__aside { max-width: 430px; }
.kit-files li {
  display: grid; grid-template-columns: 28px minmax(0, 460px) minmax(0, 1fr) 170px;
  align-items: center; gap: 20px;
  padding-block: 28px; border-bottom: 1px solid var(--color-line);
}
.kit-files .kit-num { font-size: 13px; line-height: 28px; }
.kit-files h3 { font-size: 26px; line-height: 28px; font-weight: 500; letter-spacing: -0.02em; }
.kit-files p { font-size: 16px; line-height: 24px; color: var(--color-graphite); }
.kit-format {
  justify-self: end;
  padding: 7px 11px; border-radius: var(--radius-pill); background: var(--color-concrete);
  font-size: 11px; line-height: 14px; letter-spacing: 0.04em; color: var(--color-ink); white-space: nowrap;
}

/* ---------- Kit preview ---------- */
.kit-preview { padding-bottom: 128px; }
.kit-preview__head {
  display: flex; flex-direction: column; align-items: center; gap: 20px;
  max-width: 720px; margin: 0 auto 56px; text-align: center;
}
.kit-preview__head .kit-h2 { max-width: 640px; }
.kit-preview__lede { max-width: 600px; font-size: 20px; line-height: 30px; color: var(--color-graphite); }

/* Default (< 1200px): cards flow in a grid at natural size (--u = 1px) */
.kit-preview__panel {
  --u: 1px;
  display: flex; flex-direction: column; gap: 32px;
  padding: 32px; overflow: hidden;
}
.kit-preview__art {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  grid-template-areas: "doc msg" "doc sheet";
  grid-template-rows: auto 1fr;
  align-items: start; gap: 24px;
}
.kit-pdoc { grid-area: doc; }
.kit-msg { grid-area: msg; justify-self: end; }
.kit-psheet { grid-area: sheet; }

.kit-pdoc, .kit-psheet {
  display: flex; flex-direction: column; overflow: hidden;
  background: #fff; border: 1px solid var(--color-line); border-radius: calc(14 * var(--u));
}
.kit-pdoc { box-shadow: 0 1px 2px rgba(14, 15, 18, .04), 0 calc(24 * var(--u)) calc(56 * var(--u)) rgba(14, 15, 18, .08); }
.kit-psheet { box-shadow: 0 1px 2px rgba(14, 15, 18, .04), 0 calc(28 * var(--u)) calc(64 * var(--u)) rgba(14, 15, 18, .10); }

.kit-window-bar {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  flex-shrink: 0; height: calc(48 * var(--u)); padding-inline: calc(20 * var(--u));
  border-bottom: 1px solid var(--color-line);
}
.kit-window-bar__name {
  display: flex; align-items: center; gap: calc(9 * var(--u)); min-width: 0;
  font-size: calc(14 * var(--u)); line-height: calc(18 * var(--u)); font-weight: 500;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.kit-window-bar__name .kit-ico { width: calc(16 * var(--u)); height: calc(16 * var(--u)); }
.kit-window-bar__type {
  flex-shrink: 0;
  font-family: var(--font-mono); font-size: calc(11 * var(--u)); line-height: calc(14 * var(--u));
  letter-spacing: 0.06em; text-transform: uppercase; color: var(--color-graphite);
}

/* First-Week Plan doc */
.kit-pdoc__intro {
  display: flex; flex-direction: column; gap: calc(8 * var(--u));
  padding: calc(36 * var(--u)) calc(48 * var(--u)) 0;
}
.kit-pdoc__title { font-size: calc(30 * var(--u)); line-height: calc(34 * var(--u)); font-weight: 500; letter-spacing: -0.025em; }
.kit-pdoc__meta, .kit-pdoc__day {
  font-family: var(--font-mono); font-size: calc(11 * var(--u)); line-height: calc(14 * var(--u));
  letter-spacing: 0.06em; text-transform: uppercase; color: var(--color-graphite);
}
.kit-pdoc__days { padding: calc(24 * var(--u)) calc(48 * var(--u)) calc(28 * var(--u)); }
.kit-pdoc__days li {
  display: flex; align-items: center; gap: calc(16 * var(--u));
  min-height: calc(58 * var(--u)); padding-block: calc(8 * var(--u));
  border-top: 1px solid var(--color-line);
}
.kit-pdoc__day { flex-shrink: 0; width: calc(56 * var(--u)); }
.kit-pdoc__task {
  display: flex; flex-direction: column; gap: calc(2 * var(--u)); flex: 1; min-width: 0;
  font-size: calc(13 * var(--u)); line-height: calc(18 * var(--u)); color: var(--color-graphite);
}
.kit-pdoc__task b { font-size: calc(15 * var(--u)); line-height: calc(20 * var(--u)); font-weight: 600; color: var(--color-ink); }

/* Access checklist sheet */
.kit-psheet__row {
  display: grid;
  grid-template-columns: calc(36 * var(--u)) minmax(0, 1fr) calc(130 * var(--u)) calc(110 * var(--u)) calc(48 * var(--u));
  min-height: calc(40 * var(--u)); border-bottom: 1px solid var(--color-line);
  font-size: calc(14 * var(--u)); line-height: calc(18 * var(--u)); color: var(--color-graphite);
}
.kit-psheet__row:last-child { border-bottom: 0; }
@media (max-width: 1199.98px) {
  .kit-psheet__row { grid-template-columns: 36px minmax(0, 1fr) 124px 48px; }
  .kit-psheet__row > span:nth-child(4) { display: none; }
}
.kit-psheet__row > span { display: flex; align-items: center; min-width: 0; padding-left: calc(12 * var(--u)); border-left: 1px solid var(--color-line); }
.kit-psheet__row > span:first-child {
  justify-content: center; padding-left: 0; border-left: 0; border-right: 1px solid var(--color-line);
  font-family: var(--font-mono); font-size: calc(10 * var(--u)); color: var(--color-faint);
}
.kit-psheet__row > span:nth-child(2) { border-left: 0; font-weight: 500; color: var(--color-ink); }
.kit-psheet__row > span:last-child { justify-content: center; padding-left: 0; }
.kit-psheet__row--head { min-height: calc(32 * var(--u)); background: var(--color-concrete); }
.kit-psheet__row--head > span {
  font-family: var(--font-mono); font-size: calc(10 * var(--u)); line-height: calc(12 * var(--u)); font-weight: 400;
  letter-spacing: 0.06em; text-transform: uppercase; color: var(--color-graphite);
}
.kit-psheet__row--head > span:nth-child(2) { color: var(--color-graphite); font-weight: 400; }

/* Message from the VA */
.kit-msg { display: flex; flex-direction: column; gap: calc(10 * var(--u)); width: calc(300 * var(--u)); max-width: 100%; }
.kit-msg__meta {
  display: flex; align-items: center; gap: calc(8 * var(--u)); padding-left: calc(4 * var(--u));
  font-family: var(--font-mono); font-size: calc(11 * var(--u)); line-height: calc(14 * var(--u));
  letter-spacing: 0.06em; text-transform: uppercase; color: var(--color-graphite);
}
.kit-msg__avatar {
  display: grid; place-items: center; flex-shrink: 0;
  width: calc(20 * var(--u)); height: calc(20 * var(--u)); border-radius: 50%;
  background: var(--color-ink); color: #fff;
  font-family: var(--font-display); font-size: calc(10 * var(--u)); font-weight: 600; letter-spacing: 0;
}
.kit-msg__bubble {
  padding: calc(16 * var(--u)) calc(18 * var(--u));
  background: #fff; border: 1px solid var(--color-line);
  border-radius: calc(4 * var(--u)) calc(16 * var(--u)) calc(16 * var(--u)) calc(16 * var(--u));
  box-shadow: 0 1px 2px rgba(14, 15, 18, .04), 0 calc(8 * var(--u)) calc(24 * var(--u)) rgba(14, 15, 18, .05);
  font-size: calc(16 * var(--u)); line-height: calc(23 * var(--u)); color: var(--color-ink);
}

/* ≥ 1200px: exact desktop composition on a 1280×760 artboard, scaled by --u */
@media (min-width: 1200px) {
  .kit-preview__panel {
    --u: calc(100cqw / 1280);
    container-type: inline-size;
    display: block; padding: 0; aspect-ratio: 1280 / 760;
  }
  .kit-preview__art { display: block; position: absolute; inset: 0; }
  .kit-pdoc, .kit-psheet, .kit-msg { position: absolute; }
  .kit-pdoc { left: calc(104 * var(--u)); top: calc(64 * var(--u)); width: calc(580 * var(--u)); height: calc(616 * var(--u)); }
  .kit-psheet { left: calc(660 * var(--u)); top: calc(216 * var(--u)); width: calc(520 * var(--u)); }
  .kit-msg { left: calc(864 * var(--u)); top: calc(72 * var(--u)); }
  .kit-pdoc__days { padding-bottom: 0; }
  .kit-pdoc__days li { height: calc(58 * var(--u)); padding-block: 0; }
  .kit-psheet__row { height: calc(40 * var(--u)); }
  .kit-psheet__row--head { height: calc(32 * var(--u)); }
  .kit-preview__caption { position: absolute; left: 32px; right: 32px; bottom: calc(32 * var(--u)); }
}

/* ---------- Who it's for ---------- */
.kit-who { padding-bottom: 128px; }
.kit-who .kit-split-head__aside { max-width: 380px; }
.kit-moments { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px; margin-top: 64px; }
.kit-moments li { display: flex; flex-direction: column; gap: 12px; padding-top: 28px; border-top: 1px solid var(--color-ink); }
.kit-moments .mono { color: var(--color-graphite); }
.kit-moments h3 { padding-top: 20px; font-size: 26px; line-height: 30px; font-weight: 500; letter-spacing: -0.02em; }
.kit-moments__body { font-size: 16px; line-height: 24px; color: var(--color-graphite); }

/* ---------- Testimonial ---------- */
.kit-proof { padding-bottom: 128px; }
.kit-proof__panel {
  display: flex; align-items: center; gap: 80px;
  padding: 80px; border-radius: var(--radius-md); background: var(--color-concrete);
}
.kit-portrait {
  flex: 0 0 420px; display: flex; flex-direction: column;
  padding: 10px; background: #fff; border: 1px solid var(--color-line); border-radius: 20px;
  box-shadow: 0 1px 2px rgba(14, 15, 18, .04), 0 16px 40px rgba(14, 15, 18, .06);
}
.kit-portrait__photo { aspect-ratio: 398 / 500; overflow: hidden; border-radius: 12px; background: var(--color-concrete-2); }
.kit-portrait__photo img { width: 100%; height: 100%; object-fit: cover; }
.kit-portrait__name { display: flex; flex-direction: column; gap: 6px; padding: 20px 14px 10px; }
.kit-portrait__name .mono { color: var(--color-graphite); }
.kit-portrait__who { font-size: 22px; line-height: 26px; font-weight: 600; letter-spacing: -0.015em; color: var(--color-ink); }
.kit-proof__body { flex: 1; min-width: 0; }
.kit-proof__quote { padding-top: 28px; }
.kit-proof__quote p {
  font-size: clamp(26px, 2.78vw, 40px); line-height: 1.15; font-weight: 500; letter-spacing: -0.03em; color: var(--color-ink);
}
.kit-proof__facts { margin-top: 48px; border-bottom: 1px solid var(--color-line); }
.kit-proof__facts li {
  display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 4px 16px;
  padding-block: 16px; border-top: 1px solid var(--color-line);
  font-size: 16px; line-height: 22px; font-weight: 500;
}
.kit-proof__facts .mono { color: var(--color-graphite); }

/* ---------- Buy (ink panel with cropped T) ---------- */
.kit-cta { padding-bottom: 128px; }
.kit-cta__panel {
  position: relative; overflow: hidden;
  padding: 88px 80px; border-radius: var(--radius-lg); background: var(--color-ink); color: #fff;
}
.kit-cta__copy { position: relative; z-index: 1; max-width: 660px; }
.kit-cta .kit-eyebrow { color: var(--color-muted); }
.kit-cta__title { padding-top: 20px; color: #fff; }
.kit-cta__list {
  display: grid; grid-template-columns: repeat(2, 260px); grid-auto-flow: column; grid-template-rows: repeat(4, auto);
  column-gap: 40px; row-gap: 12px; padding-top: 40px;
}
.kit-cta__list li {
  display: flex; align-items: center; gap: 10px; font-size: 15px; line-height: 20px;
}
.kit-cta__list li::before {
  content: ""; flex-shrink: 0; width: 14px; height: 14px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='M2.5 7.2L5.6 10.2L11.5 3.8' fill='none' stroke='%23A3A5AB' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}
.kit-cta__buy { display: flex; flex-direction: column; gap: 28px; padding-top: 40px; }
.kit-price--lg .kit-price__amount { font-size: clamp(64px, 6.1vw, 88px); line-height: 0.955; letter-spacing: -0.045em; color: #fff; }
.kit-cta .kit-price__note { color: #A3A5AB; }
.kit-cta .kit-assure { color: #A3A5AB; }
.kit-cta .kit-btn:focus-visible { outline-color: #fff; }
.kit-cta__mark {
  position: absolute; top: 96px; right: -210px; width: 760px; height: 760px; max-width: none;
}

/* ---------- FAQ ---------- */
.kit-faq { padding-block: 24px 144px; }
.kit-faq__inner { display: flex; justify-content: space-between; align-items: flex-start; gap: 64px; }
.kit-faq__head { flex: 0 0 420px; display: flex; flex-direction: column; align-items: flex-start; gap: 20px; }
.kit-faq__link { margin-top: 12px; font-size: 16px; line-height: 22px; min-height: 44px; }
.kit-faq__list { flex: 0 1 720px; min-width: 0; }
.kit-faq__list summary { justify-content: flex-start; gap: 20px; padding: 28px 0; }
.kit-faq__list summary::after { margin-left: auto; }
.kit-faq__list summary .kit-num { flex-shrink: 0; width: 28px; font-size: 13px; line-height: 28px; align-self: flex-start; }
.kit-faq__list summary h3 { font-size: 22px; line-height: 28px; font-weight: 500; letter-spacing: -0.015em; }
.kit-faq__list details > div { max-width: none; margin-top: -20px; padding: 0 56px 28px 48px; font-size: 17px; line-height: 26px; }

/* ---------- Footer additions ---------- */
.kit-footer { padding-top: 72px; }
.kit-footer__top {
  display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; flex-wrap: wrap;
  padding-bottom: 48px;
}
.kit-footer__cta { display: flex; flex-direction: column; align-items: flex-end; gap: 8px; }
.kit-footer__cta .mono { color: var(--color-muted); }
.kit-footer__cta-link { font-size: 20px; line-height: 28px; font-weight: 500; letter-spacing: -0.01em; color: #fff; }
.kit-footer__cta:hover .kit-footer__cta-link { color: rgba(255, 255, 255, .7); }
/* Hairline between the upsell row and the compact footer row (inset to the content width) */
.kit-footer .site-footer__bottom { position: relative; padding-top: 24px; }
.kit-footer .site-footer__bottom::before {
  content: ""; position: absolute; top: 0; left: var(--gutter); right: var(--gutter);
  border-top: 1px solid #2A2B30;
}

/* =========================================================
   Responsive
   ========================================================= */
@media (max-width: 1240px) {
  .kit-files li { grid-template-columns: 28px minmax(0, 340px) minmax(0, 1fr) 150px; }
  .kit-proof__panel { padding: 56px; gap: 56px; }
  .kit-portrait { flex-basis: 360px; }
  .kit-cta__mark { right: -320px; }
}

@media (max-width: 1024px) {
  .kit-hero { padding-block: 48px 96px; }
  .kit-hero__inner { grid-template-columns: minmax(0, 1fr); gap: 56px; }
  .kit-hero__copy { max-width: 600px; }
  .kit-stage { max-width: 676px; }

  .kit-problem { padding-block: 24px 96px; }
  .kit-problem__inner { grid-template-columns: minmax(0, 1fr); grid-template-areas: "copy" "figure"; gap: 56px; }
  .kit-problem__copy { max-width: 640px; }
  .kit-problem__figure { max-width: 600px; }

  .kit-inside, .kit-preview, .kit-who, .kit-proof, .kit-cta { padding-bottom: 96px; }
  .kit-faq { padding-bottom: 112px; }

  .kit-split-head { flex-direction: column; align-items: flex-start; gap: 20px; }
  .kit-split-head__aside { text-align: left; max-width: 560px; font-size: 18px; line-height: 28px; }

  .kit-files li {
    grid-template-columns: 28px minmax(0, 1fr) auto;
    grid-template-areas: "num title format" "num desc desc";
    row-gap: 8px; align-items: start; padding-block: 24px;
  }
  .kit-files .kit-num { grid-area: num; }
  .kit-files h3 { grid-area: title; font-size: 22px; }
  .kit-files p { grid-area: desc; }
  .kit-files .kit-format { grid-area: format; }

  .kit-moments { gap: 24px; margin-top: 48px; }
  .kit-moments h3 { padding-top: 8px; font-size: 22px; line-height: 28px; }

  .kit-proof__panel { padding: 40px; gap: 40px; }
  .kit-portrait { flex-basis: 340px; }

  .kit-cta__panel { padding: 64px 48px; }
  .kit-cta__copy { max-width: 600px; }
  .kit-cta__mark { top: 140px; right: -290px; width: 580px; height: 580px; }

  .kit-faq__inner { flex-direction: column; gap: 40px; }
  .kit-faq__head { flex-basis: auto; }
  .kit-faq__list { flex-basis: auto; width: 100%; }
}

@media (max-width: 820px) {
  .kit-preview__art { grid-template-columns: minmax(0, 1fr); grid-template-areas: "doc" "msg" "sheet"; }
  .kit-msg { justify-self: start; }

  .kit-moments { grid-template-columns: minmax(0, 1fr); gap: 32px; }

  .kit-proof__panel { flex-direction: column; align-items: stretch; gap: 40px; }
  .kit-proof__body { order: -1; }
  .kit-portrait { flex-basis: auto; width: 100%; max-width: 420px; }

  .kit-cta__panel { padding: 64px 48px 300px; }
  .kit-cta__mark { top: auto; bottom: -290px; right: -150px; width: 540px; height: 540px; }
}

@media (max-width: 640px) {
  .kit-hero { padding-block: 32px 72px; }
  .kit-hero__lede { padding-top: 20px; }
  .kit-buy { margin-top: 32px; padding-top: 24px; }
  .kit-price__amount { font-size: 48px; }
  .kit-stage__caption { left: 16px; right: 16px; font-size: 11px; }
  .kit-stage__caption span:last-child { display: none; }

  .kit-problem { padding-bottom: 72px; }
  .kit-problem__lede { font-size: 17px; line-height: 27px; }
  .kit-progress { left: 16px; bottom: 16px; width: calc(100% - 32px); max-width: 272px; }
  .kit-problem__figure .fig-caption { font-size: 11px; }

  .kit-inside, .kit-preview, .kit-who, .kit-proof, .kit-cta { padding-bottom: 72px; }
  .kit-faq { padding-bottom: 88px; }
  .kit-inside__head { padding-bottom: 32px; }
  .kit-files li { grid-template-columns: 24px minmax(0, 1fr); grid-template-areas: "num title" "num desc" "num format"; }
  .kit-files .kit-format { justify-self: start; margin-top: 4px; }
  .kit-files h3 { font-size: 20px; line-height: 26px; }

  .kit-preview__head { margin-bottom: 40px; }
  .kit-preview__lede { font-size: 18px; line-height: 28px; }
  .kit-preview__panel { padding: 16px; gap: 20px; }
  .kit-preview__art { gap: 16px; }
  .kit-msg { display: none; }
  .kit-window-bar { padding-inline: 14px; }
  .kit-pdoc__intro { padding: 24px 18px 0; }
  .kit-pdoc__title { font-size: 24px; line-height: 28px; }
  .kit-pdoc__days { padding: 16px 18px 12px; }
  .kit-pdoc__day { width: 44px; }
  .kit-pdoc__days li { gap: 12px; }
  .kit-psheet__row { grid-template-columns: 28px minmax(0, 1fr) 108px 40px; font-size: 13px; }
  .kit-psheet__row > span:nth-child(4) { display: none; }
  .kit-psheet__row > span { padding-left: 10px; }
  .kit-preview__caption { font-size: 11px; }

  .kit-proof__panel { padding: 24px; gap: 32px; }
  .kit-proof__facts { margin-top: 32px; }

  .kit-cta__panel { padding: 48px 24px 240px; border-radius: var(--radius-md); }
  .kit-cta__list { grid-template-columns: minmax(0, 1fr); grid-auto-flow: row; grid-template-rows: none; padding-top: 32px; }
  .kit-cta__mark { bottom: -190px; right: -110px; width: 400px; height: 400px; }

  .kit-faq__list summary { padding: 22px 0; gap: 14px; }
  .kit-faq__list summary .kit-num { width: 22px; }
  .kit-faq__list summary h3 { font-size: 19px; line-height: 26px; }
  .kit-faq__list details > div { margin-top: -14px; padding: 0 0 22px 36px; font-size: 16px; line-height: 25px; }

  .kit-footer { padding-top: 56px; }
  .kit-footer__top { flex-direction: column; align-items: flex-start; }
  .kit-footer__cta { align-items: flex-start; }
}

@media (max-width: 440px) {
  .kit-hide-sm { display: none; }
  .kit-psheet .kit-window-bar__type { display: none; }
}