/* Design v2 "family planner on the kitchen table" (design review 11.10.2026, 06-tracking/operator-diagnose/2026-10-11-design-review-handy.md).
   Only active on pages with body class "v2"; the rest of the site keeps site.css until the switch.
   Handmade marks (pad, highlighter, ballpoint notes) stay in the content; price and buy areas stay plain and boxed (Baymard: perceived security). */
@font-face { font-family: "Bitter"; src: url("/assets/fonts/bitter-latin-700-800.woff2") format("woff2"); font-weight: 700 800; font-style: normal; font-display: swap; }
@font-face { font-family: "Atkinson Hyperlegible Next"; src: url("/assets/fonts/atkinson-hyperlegible-next-latin-400-700.woff2") format("woff2"); font-weight: 400 700; font-style: normal; font-display: swap; }
@font-face { font-family: "Shantell Sans"; src: url("/assets/fonts/shantell-sans-latin-400-500.woff2") format("woff2"); font-weight: 400 500; font-style: normal; font-display: swap; }

body.v2 {
  --v2-ink: #1D2433; --v2-ink-soft: #3E4558; --v2-muted: #6B7183; --v2-pen: #2349A8; --v2-pen-hover: #16337A;
  --v2-marker: #FFE14D; --v2-pad: #FFF7C7; --v2-rule: #B9CDEA; --v2-margin: #E58C7E; --v2-binding: #8E3B2E;
  --v2-overdue: #F6C9C1; --v2-week: #FFF1A8; --v2-alt: #F4F6F9; --v2-line: #D9DEE6; --v2-line-strong: #9AA3B5; --v2-buy: #B4532A; --v2-buy-hover: #9A4522;
  --v2-display: "Bitter", Georgia, serif; --v2-text: "Atkinson Hyperlegible Next", Verdana, sans-serif; --v2-hand: "Shantell Sans", "Comic Sans MS", cursive;
  background: #FFFFFF; color: var(--v2-ink); font-family: var(--v2-text); font-size: 19px; line-height: 1.5;
  /* the site's own tokens, re-pointed: every existing component takes on v2 without its own rule */
  --font-display: var(--v2-display); --font-text: var(--v2-text);
  --paper: #FFFFFF; --surface: #FFFFFF; --sand: #F4F6F9; --line: #D9DEE6;
  --ink: #1D2433; --ink-70: rgb(29 36 51 / .80); --ink-60: rgb(29 36 51 / .70);
  --teal-50: #FFF7C7; --teal-100: #EBCB86; --teal-700: #1D2433; --teal-800: #2349A8;
  --amber: #FFF1A8; --amber-line: #EBCB86; --red-bg: #F6C9C1;
  --radius-sm: 3px; --radius-md: 4px; --radius-pill: 6px;
  --shadow-card: none; --focus-ring: 0 0 0 3px rgb(35 73 168 / .35);
}
html:has(body.v2) { background: #FFFFFF; }
.v2 a { color: var(--v2-pen); }
.v2 a:hover { color: var(--v2-pen-hover); }

/* site header and footer */
.v2 .site-header { background: #FFFFFF; border-bottom: 1.5px solid var(--v2-ink); box-shadow: none; }
.v2 .brand span { font-family: var(--v2-display); font-weight: 800; letter-spacing: -0.2px; color: var(--v2-ink); }
.v2 .nav-toggle { background: transparent; border: 0; border-radius: 0; font: 700 17px/1 var(--v2-text); color: var(--v2-ink); text-decoration: underline; text-underline-offset: 4px; min-height: 44px; }
.v2 .site-footer { background: var(--v2-ink); color: #C6CBD6; }
.v2 .site-footer a, .v2 .site-footer h2, .v2 .site-footer .brand span { color: #FFFFFF; }
.v2 .site-footer h2 { margin: 0 0 8px; font: 700 18px/1.3 var(--v2-text); }

.v2 .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

/* layout */
.v2-wrap { max-width: 40rem; margin: 0 auto; padding: 0 18px; }
.v2-section { padding: 30px 0; border-top: 1.5px solid var(--v2-ink); }
.v2-section--alt { background: var(--v2-alt); }
.v2-section--first { border-top: 0; padding-top: 26px; }
.v2 h1, .v2-h1 { margin: 0 0 16px; font: 800 35px/1.14 var(--v2-display); letter-spacing: -0.4px; color: var(--v2-ink); }
.v2 h2, .v2-h2 { margin: 0 0 8px; font: 800 28px/1.2 var(--v2-display); color: var(--v2-ink); }
.v2 h3 { margin: 28px 0 8px; font: 700 22px/1.25 var(--v2-display); }
.v2-lede, .v2-soft { color: var(--v2-ink-soft); }
.v2-small { font-size: 17px; color: var(--v2-ink-soft); }
.v2-wrap p { margin: 0 0 16px; }

/* handwriting and highlighter */
.v2-hand { font-family: var(--v2-hand); color: var(--v2-pen); font-size: 19px; line-height: 1.4; }
.v2-kicker { margin: 0 0 6px; transform: rotate(-1.5deg); transform-origin: left; }
.v2-hl { position: relative; display: inline-block; }
.v2-hl > svg { position: absolute; left: -5px; top: 22%; width: calc(100% + 12px); height: 72%; }
.v2-hl > span { position: relative; }
.v2-hl--row > svg { left: -6px; top: -4px; width: calc(100% + 10px); height: calc(100% + 8px); }

/* legal pad */
.v2-pad { position: relative; margin: 0 4px 26px; border-radius: 2px; transform: rotate(-0.8deg); box-shadow: 0 1px 0 rgb(29 36 51 / .08), 0 14px 22px -14px rgb(29 36 51 / .45);
  background-color: var(--v2-pad); background-image: linear-gradient(90deg, transparent 38px, var(--v2-margin) 38px, var(--v2-margin) 39.5px, transparent 39.5px), repeating-linear-gradient(180deg, transparent 0, transparent 43px, var(--v2-rule) 43px, var(--v2-rule) 44px); }
.v2-pad--tilt-right { transform: rotate(0.7deg); }
.v2-pad__binding { height: 14px; background: var(--v2-binding); border-radius: 2px 2px 0 0; }
.v2-pad__body { padding: 10px 14px 6px 50px; line-height: 44px; }
.v2-pad__head { display: flex; justify-content: space-between; }
.v2-pad__row { display: flex; align-items: flex-start; gap: 10px; }
.v2-pad__row > svg { margin-top: 10px; }
.v2-pad__row > svg { flex: none; }
.v2-pad__row > span { flex: 1; }
.v2-pad__more { text-align: right; font-size: 17px; }
.v2-note { padding: 8px 16px 10px 52px; line-height: 44px; }
.v2-note p { margin: 0; line-height: 44px; }

/* buttons: square corners, tall; buy color only for buying */
.v2-btn { display: flex; align-items: center; justify-content: center; gap: 10px; min-height: 58px; padding: 0 20px; background: var(--v2-ink); color: #FFFFFF; border-radius: 6px; font: 700 19px/1.2 var(--v2-text); text-decoration: none; border: 0; }
.v2 .v2-btn, .v2 .v2-btn:hover { color: #FFFFFF; }
.v2-btn:hover { background: #0F1420; }
.v2-btn--buy { background: var(--v2-buy); }
.v2-btn--buy:hover { background: var(--v2-buy-hover); }
.v2-btn svg { flex: none; }
.v2-under { margin: 10px 0 0; text-align: center; font-size: 17px; color: var(--v2-ink-soft); }

/* situations */
.v2-situations { margin-top: 14px; }
.v2-situation { display: block; padding: 16px 0; border-bottom: 1px solid #C9D0DB; color: var(--v2-ink); text-decoration: none; }
.v2 .v2-situation { color: var(--v2-ink); }
.v2-situation:last-child { border-bottom: 0; }
.v2-situation__top { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; font-weight: 700; font-size: 20px; }
.v2-situation__top span { font-family: var(--v2-hand); color: var(--v2-pen); font-size: 22px; }
.v2-situation__text { display: block; color: var(--v2-ink-soft); font-size: 17px; }

/* the real sheet, readable */
.v2-sheet { background: #FFFFFF; border: 1.5px solid var(--v2-ink); border-radius: 3px; overflow: hidden; }
.v2-sheet__row { display: grid; grid-template-columns: 54px minmax(0, 1fr) 62px; font-size: 16px; line-height: 1.35; border-top: 1px solid var(--v2-line); }
.v2-sheet__row > span { padding: 9px 6px; }
.v2-sheet__row > span:first-child { padding-left: 10px; }
.v2-sheet__row--head { background: #2F5D62; color: #FFFFFF; font-size: 16px; font-weight: 700; border-top: 0; }
.v2-sheet__row--done { color: #8A90A0; text-decoration: line-through; }
.v2-sheet__row--overdue { background: var(--v2-overdue); }
.v2-sheet__row--week { background: var(--v2-week); }
.v2-margin-notes { display: flex; flex-direction: column; gap: 4px; margin-top: 14px; font-size: 18px; }
.v2-margin-notes span { display: flex; gap: 8px; }

/* checklist with drawn boxes */
.v2-checklist { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 10px; }
.v2-checklist li { display: flex; gap: 10px; align-items: flex-start; }
.v2-checklist svg { flex: none; margin-top: 2px; }

/* fair share bars */
.v2-box { border: 1.5px solid var(--v2-ink); border-radius: 3px; padding: 16px 14px 12px; background: #FFFFFF; }
.v2-box__meta { display: flex; justify-content: space-between; font-size: 16px; color: var(--v2-ink-soft); margin-bottom: 8px; }
.v2-bar { display: grid; grid-template-columns: 64px minmax(0, 1fr) 40px; align-items: center; gap: 8px; margin-bottom: 10px; }
.v2-bar i { display: block; height: 22px; background: var(--v2-marker); border-radius: 6px 3px 9px 4px; }
.v2-bar i.is-over { background: var(--v2-overdue); border-radius: 3px 9px 4px 8px; }

/* honest comparison */
.v2-compare { width: 100%; border-collapse: collapse; background: #FFFFFF; border: 1.5px solid var(--v2-ink); font-size: 17px; }
.v2-compare th, .v2-compare td { padding: 10px 6px; text-align: center; border-bottom: 1px solid var(--v2-line); }
.v2-compare th { border-bottom: 1.5px solid var(--v2-ink); }
.v2-compare th:first-child, .v2-compare td:first-child { text-align: left; padding-left: 12px; }
.v2-compare .yes { font-family: var(--v2-hand); color: var(--v2-pen); font-size: 20px; }
.v2-compare .no { color: var(--v2-muted); }

/* questions */
.v2-faq details { border-bottom: 1px solid #C9D0DB; padding: 14px 0; }
.v2-faq details:last-child { border-bottom: 0; }
.v2-faq summary { display: flex; justify-content: space-between; gap: 12px; font-weight: 700; font-size: 19px; cursor: pointer; list-style: none; }
.v2-faq summary::-webkit-details-marker { display: none; }
.v2-faq summary::after { content: "+"; color: var(--v2-pen); font-weight: 700; }
.v2-faq details[open] summary::after { content: "\2013"; }
.v2-faq p { margin: 8px 0 0; color: var(--v2-ink-soft); font-size: 18px; }

@media (min-width: 700px) {
  .v2 h1, .v2-h1 { font-size: 46px; }
  .v2 h2, .v2-h2 { font-size: 34px; }
}
@media (prefers-reduced-motion: no-preference) {
  .v2-btn { transition: background .15s; }
}
@media print { .v2-pad { transform: none; box-shadow: none; } }

/* ---------- illustrations (inline SVG partials, so the handwriting font applies) ---------- */
.v2-illo { display: block; width: 100%; height: auto; }
.v2-spot { display: block; width: 72px; height: 54px; flex: none; }
.v2-illo .ink, .v2-spot .ink { fill: none; stroke: var(--v2-ink); stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.v2-illo .ink-thin, .v2-spot .ink-thin { fill: none; stroke: var(--v2-ink); stroke-width: 1.5; stroke-linecap: round; }
.v2-illo .ink-soft, .v2-spot .ink-soft { fill: none; stroke: #C4A57A; stroke-width: 2; stroke-linecap: round; }
.v2-illo .pen, .v2-spot .pen { fill: none; stroke: var(--v2-pen); stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.v2-illo .hand, .v2-spot .hand { font-family: var(--v2-hand); fill: var(--v2-pen); }
.v2-illo .hand-ink, .v2-spot .hand-ink { font-family: var(--v2-hand); fill: var(--v2-ink); }
.v2-illo .ui, .v2-spot .ui { font-family: var(--v2-text); font-weight: 700; fill: var(--v2-ink); }
.v2-illo .ui--light { fill: #FFFFFF; }
.v2-situation--illo { display: grid; grid-template-columns: 72px minmax(0, 1fr); gap: 14px; align-items: start; }
.v2-figure { margin: 6px 0 22px; }

/* ---------- the move on one line (home example and quiz result) ---------- */
.v2 .timeline, .v2-timeline { list-style: none; margin: 14px 0 8px; padding: 0 0 0 26px; position: relative; max-width: 40rem; }
.v2 .timeline::before, .v2-timeline::before { content: ""; position: absolute; left: 8px; top: 8px; bottom: 8px; width: 2px; background: var(--v2-ink); border-radius: 2px; }
.v2 .timeline li, .v2-timeline li { position: relative; display: grid; gap: 1px; margin: 0 0 14px; padding: 0; }
.v2 .timeline li::before, .v2-timeline li::before { content: ""; position: absolute; left: -24px; top: 6px; width: 14px; height: 14px; border: 2px solid var(--v2-ink); border-radius: 50%; background: #FFFFFF; }
.v2 .timeline li.is-now::before, .v2-timeline li.is-now::before { background: var(--v2-marker); }
.v2 .timeline b, .v2-timeline b { font-size: 19px; }
.v2 .timeline span, .v2-timeline span { font-size: 16px; color: var(--v2-ink-soft); line-height: 1.4; }
.v2 .timeline .timeline__when, .v2-timeline .v2-timeline__when { font-family: var(--v2-hand); color: var(--v2-pen); font-size: 16px; }
.v2 .timeline li.is-now b, .v2-timeline li.is-now b { background: linear-gradient(transparent 45%, var(--v2-marker) 45%, var(--v2-marker) 92%, transparent 92%); }

/* ---------- quiz in v2 ---------- */
.v2.is-funnel .site-header { border-bottom: 1.5px solid var(--v2-ink); }
.v2 .quiz__intro .lede { color: var(--v2-ink-soft); }
.v2 .firstq { border: 1.5px solid var(--v2-ink); border-radius: 4px; box-shadow: none; background: #FFFFFF; }
.v2 .firstq h2 { font: 800 24px/1.2 var(--v2-display); }
.v2 .quiz__intro .firstq__opts button { min-height: 60px; border: 1.5px solid var(--v2-line-strong); border-radius: 4px; background: #FFFFFF; font: 700 19px/1.2 var(--v2-text); color: var(--v2-ink); }
.v2 .quiz__intro .firstq__opts button:hover { border-color: var(--v2-ink); background: var(--v2-pad); }
.v2 .quiz__back { border: 0; border-radius: 0; background: transparent; font: 700 17px/1 var(--v2-text); text-decoration: underline; text-underline-offset: 4px; }
.v2 .quiz__back:hover { background: transparent; color: var(--v2-pen); }
.v2 .quiz__count { font-size: 16px; color: var(--v2-ink-soft); }
.v2 .quiz__progress { height: 6px; background: var(--v2-line); border-radius: 3px; }
.v2 .quiz__progress span { background: var(--v2-pen); border-radius: 3px; }
.v2 .quiz__parts { display: flex; flex-wrap: wrap; gap: 4px 14px; list-style: none; margin: 8px 0 0; padding: 0; font-size: 16px; color: var(--v2-muted); }
.v2 .quiz__parts li { display: flex; align-items: center; gap: 6px; margin: 0; }
.v2 .quiz__parts li span { display: inline-grid; place-items: center; width: 20px; height: 20px; border: 1.5px solid currentColor; border-radius: 50%; font-size: 12px; font-weight: 700; }
.v2 .quiz__parts li.is-now { color: var(--v2-ink); font-weight: 700; }
.v2 .quiz__parts li.is-now span { background: var(--v2-marker); border-color: var(--v2-ink); }
.v2 .quiz__parts li.is-done { color: var(--v2-ink-soft); }
.v2 .quiz__parts li.is-done span { background: var(--v2-ink); border-color: var(--v2-ink); color: #FFFFFF; }
.v2 .q__title { font: 800 28px/1.2 var(--v2-display); letter-spacing: 0; }
.v2 .q__sub { color: var(--v2-ink-soft); }
.v2 .opt { min-height: 60px; border: 1.5px solid var(--v2-line-strong); border-radius: 4px; background: #FFFFFF; font-size: 18px; }
.v2 .opt:hover { border-color: var(--v2-ink); }
.v2 .opt[aria-checked="true"] { border: 2px solid var(--v2-ink); background: var(--v2-pad); }
.v2 .opt__mark { width: 26px; height: 26px; border: 0; border-radius: 0; box-shadow: none; background: transparent no-repeat center / 26px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26 26'%3E%3Cpath d='M13.2 2.6C19.6 2.4 23.8 7 23.4 13.4 23 19.8 18.6 23.6 12.6 23.4 6.6 23.2 2.4 18.8 2.8 12.6 3.2 6.8 7.4 2.8 13.8 3.2' fill='none' stroke='%231D2433' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E"); }
.v2 .opt[aria-checked="true"] .opt__mark { border: 0; box-shadow: none; background: transparent no-repeat center / 26px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26 26'%3E%3Cpath d='M13.2 2.6C19.6 2.4 23.8 7 23.4 13.4 23 19.8 18.6 23.6 12.6 23.4 6.6 23.2 2.4 18.8 2.8 12.6 3.2 6.8 7.4 2.8 13.8 3.2' fill='none' stroke='%231D2433' stroke-width='1.8' stroke-linecap='round'/%3E%3Cpath d='M13 8.2C16 8.2 18 10.4 17.8 13.2 17.6 16 15.6 17.9 12.8 17.8 10 17.6 8.2 15.6 8.3 12.8 8.4 10.2 10.4 8.2 13 8.2Z' fill='%232349A8'/%3E%3C/svg%3E"); }
.v2 .opt--multi .opt__mark { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26 26'%3E%3Cpath d='M4 5C9 3.6 16 4.2 22 4.6 22.6 10 22.2 16 21.6 21.8 15 22.6 9 22.2 4.4 21.6 3.6 15 3.8 10 4 5Z' fill='none' stroke='%231D2433' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E"); }
.v2 .opt--multi[aria-checked="true"] .opt__mark { background: transparent no-repeat center / 26px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26 26'%3E%3Cpath d='M4 5C9 3.6 16 4.2 22 4.6 22.6 10 22.2 16 21.6 21.8 15 22.6 9 22.2 4.4 21.6 3.6 15 3.8 10 4 5Z' fill='%23FFFFFF' stroke='%231D2433' stroke-width='1.8' stroke-linecap='round'/%3E%3Cpath d='M7 13.5C9 15 10.5 17 11.5 19 14 13 18 7.5 24.5 2.5' fill='none' stroke='%232349A8' stroke-width='2.6' stroke-linecap='round'/%3E%3C/svg%3E"); }
.v2 .q__date { background: var(--v2-alt); border-radius: 4px; }
.v2 .q__fb { color: var(--v2-pen); font-family: var(--v2-hand); font-weight: 400; font-size: 18px; }
.v2 .q__fb:not(:empty) { background: transparent; padding: 4px 2px; transform: rotate(-0.6deg); }
.v2 .q__next, .v2 .btn { border-radius: 6px; min-height: 56px; }
.v2 .btn--primary { background: var(--v2-ink); color: #FFFFFF; }
.v2 .btn--primary:hover { background: #0F1420; color: #FFFFFF; }
.v2 .btn--ghost { background: #FFFFFF; color: var(--v2-ink); border: 2px solid var(--v2-ink); }
.v2 .btn--buy { background: var(--v2-buy); }
.v2 .btn--buy:hover { background: var(--v2-buy-hover); }
.v2 .plancard { border: 0; border-radius: 2px; box-shadow: 0 12px 20px -14px rgb(29 36 51 / .45); transform: rotate(0.6deg);
  background-color: var(--v2-pad); background-image: linear-gradient(90deg, transparent 30px, var(--v2-margin) 30px, var(--v2-margin) 31.5px, transparent 31.5px); }
.v2 .plancard__head { background: var(--v2-binding); font: 400 17px/1.2 var(--v2-hand); }
.v2 .plancard__list li { padding-left: 42px; border-bottom: 1px solid var(--v2-rule); }
.v2 .plancard__list span { color: var(--v2-ink-soft); }
/* result */
.v2 .result h2 { font: 800 26px/1.2 var(--v2-display); }
.v2 .result__mirror { background: transparent; padding: 0; font: 400 20px/1.45 var(--v2-hand); color: var(--v2-pen); }
.v2 .dayblock { border: 1.5px solid var(--v2-ink); border-radius: 3px; background: #FFFFFF; }
.v2 .dayblock.is-now { background: var(--v2-pad); border-color: var(--v2-ink); }
.v2 .dayblock .day { font-weight: 700; }
.v2 .dayblock .day, .v2 .dayblock.is-now .day { background: transparent; border: 0; padding: 0; color: var(--v2-ink); }
.v2 .dayblock.is-now .day { background: linear-gradient(transparent 40%, var(--v2-marker) 40%, var(--v2-marker) 92%, transparent 92%); }
.v2 .dayblock__time { font-family: var(--v2-hand); color: var(--v2-pen); font-size: 16px; }
.v2 .stat { border: 0; border-top: 3px solid var(--v2-ink); border-radius: 0; padding: 8px 0 0; background: transparent; }
.v2 .stat b { font: 800 26px/1.1 var(--v2-display); color: var(--v2-ink); }
.v2 .heard { border: 1.5px solid var(--v2-ink); border-radius: 3px; }
.v2 .plan { border: 1.5px solid var(--v2-ink); border-radius: 4px; box-shadow: none; }
.v2 .plan--featured { border: 2px solid var(--v2-ink); }
.v2 .plan__badge { background: var(--v2-ink); border-radius: 3px; }
.v2 .plan__name, .v2 .plan__price { font-family: var(--v2-display); font-weight: 800; }
.v2 .plan li svg { color: var(--v2-pen); }
.v2 .nextsteps { background: var(--v2-alt); border-radius: 4px; }
.v2 .nextsteps li::before { background: transparent; color: var(--v2-pen); font: 400 24px/1 var(--v2-hand); }
.v2 .share { background: #FFFFFF; border: 1.5px dashed var(--v2-ink); border-radius: 4px; }
.v2 .result__warn, .v2 .note { border-radius: 3px; }
/* buttons are links: keep their text white over the v2 link color */
.v2 a.btn--buy, .v2 a.btn--buy:hover, .v2 a.btn--primary, .v2 a.btn--primary:hover { color: #FFFFFF; }
.v2 a.btn--ghost, .v2 a.btn--ghost:hover { color: var(--v2-ink); }
.v2 .timeline b, .v2-timeline b { justify-self: start; }
.v2 .timeline li.is-past b, .v2 .timeline li.is-past span:not(.timeline__when) { color: var(--v2-muted); }
/* phones: the plan-so-far card stays a legal pad with written lines, not chips */
@media (max-width: 999px) {
  .v2 .plancard { transform: rotate(0.4deg); }
  .v2 .plancard__list { display: block; padding: 4px 12px 8px 0; }
  .v2 .plancard__list li { display: flex; flex-wrap: wrap; gap: 4px 8px; border: 0; border-bottom: 1px solid var(--v2-rule); border-radius: 0; background: transparent; padding: 6px 0 6px 42px; }
  .v2 .plancard__list li:last-child { border-bottom: 0; }
  .v2 .plancard__list li:not(:nth-last-child(-n+3)) { display: none; }
}

/* ---------- real photos and real product pages, pasted in like snapshots ---------- */
.v2-snap { position: relative; margin: 20px auto 14px; padding: 8px 8px 0; max-width: 340px; background: #FFFFFF; transform: rotate(-1.6deg);
  box-shadow: 0 1px 2px rgb(29 36 51 / .18), 0 12px 20px -12px rgb(29 36 51 / .5); }
.v2-snap--right { transform: rotate(1.4deg); }
.v2-snap--small { max-width: 300px; }
.v2-snap::before { content: ""; position: absolute; top: -11px; left: 50%; width: 92px; height: 24px; transform: translateX(-50%) rotate(3deg); background: rgb(255 236 150 / .8); box-shadow: 0 1px 1px rgb(0 0 0 / .08); }
.v2-snap img { display: block; width: 100%; height: auto; }
.v2-snap figcaption { padding: 6px 4px 10px; font: 400 17px/1.3 var(--v2-hand); color: var(--v2-pen); }
.v2-pages { display: flex; gap: 16px; overflow-x: auto; scroll-snap-type: x mandatory; padding: 18px 6px 12px; margin: 0 -18px; padding-left: 18px; }
.v2-pages .v2-snap { flex: 0 0 62%; max-width: 240px; margin: 0; scroll-snap-align: center; }
.v2-pages img { cursor: zoom-in; }
/* every other photo on the site: printed with a white border, no rounded corners */
.v2 .photo { border-radius: 0; border: 8px solid #FFFFFF; box-shadow: 0 1px 2px rgb(29 36 51 / .18), 0 12px 20px -12px rgb(29 36 51 / .45); }
@media (prefers-reduced-motion: reduce) { .v2-snap, .v2-pad, .v2 .plancard { transform: none; } }

/* ---------- articles and guides ---------- */
.v2 .answer { position: relative; border-left: 0; border-radius: 2px; transform: rotate(-0.4deg); box-shadow: 0 12px 20px -14px rgb(29 36 51 / .45);
  background-color: var(--v2-pad); background-image: linear-gradient(90deg, transparent 22px, var(--v2-margin) 22px, var(--v2-margin) 23.5px, transparent 23.5px); padding-left: 38px; }
.v2 .answer__label { font: 400 18px/1.3 var(--v2-hand); color: var(--v2-pen); }
.v2 .plan-pointer { border: 1.5px solid var(--v2-ink); border-radius: 4px; }
.v2 .plan-pointer__go { color: var(--v2-pen); }
.v2 .plan-pointer:hover { border-color: var(--v2-pen); }
.v2 .product-box { position: relative; background: #FFFFFF; border: 2px solid var(--v2-ink); border-radius: 3px; box-shadow: 4px 4px 0 var(--v2-ink); }
.v2 .product-box::before { content: ""; position: absolute; top: -12px; right: 28px; width: 84px; height: 24px; transform: rotate(-4deg); background: rgb(255 236 150 / .85); }
.v2 .product-box h2, .v2 .product-box h3 { font: 800 22px/1.25 var(--v2-display); }
.v2 .toc, .v2 .note { background: var(--v2-alt); border-radius: 4px; }
.v2 .card, .v2 .post-card, .v2 .author-box { border-color: #C9D0DB; border-radius: 4px; }
.v2 .post-card:hover, .v2 a.card:hover { border-color: var(--v2-ink); }
.v2 .hl { background: linear-gradient(transparent 48%, var(--v2-marker) 48%, var(--v2-marker) 92%, transparent 92%); }
.v2 .lede { color: var(--v2-ink-soft); }
.v2 .faq details { border-color: #C9D0DB; }
.v2 .faq summary { font-weight: 700; }

/* ---------- key facts under the short answer (quotable, each with its source) ---------- */
.v2 .keyfacts { margin: 18px 0 22px; padding: 14px 16px 6px; border: 1.5px solid var(--v2-ink); border-radius: 4px; background: #FFFFFF; }
.v2 .keyfacts__label { margin: 0 0 6px; font: 700 15px/1.3 var(--v2-text); letter-spacing: .04em; text-transform: uppercase; color: var(--v2-ink-soft); }
.v2 .keyfacts ul { margin: 0; padding-left: 20px; }
.v2 .keyfacts li { margin: 0 0 8px; font-size: 17px; line-height: 1.45; }
.v2 .keyfacts cite { font-style: normal; color: var(--v2-ink-soft); font-size: 15px; }

/* ---------- state rules tables ---------- */
.v2 .state-rules th[scope="row"] { width: 32%; text-align: left; vertical-align: top; font-weight: 700; }
.v2 .state-rules td { vertical-align: top; font-size: 17px; line-height: 1.5; }
.v2 .state-rules td a { white-space: nowrap; }
/* On a phone the state tables read as cards: the row label on top, the text under it (the hub shows its column names via data-label). */
@media (max-width: 640px) {
  .v2 .state-rules, .v2 .state-rules tbody, .v2 .state-rules tr, .v2 .state-rules th, .v2 .state-rules td { display: block; width: auto; }
  .v2 .state-rules thead { display: none; }
  .v2 .state-rules tr { padding: 12px 0; border-bottom: 1px solid var(--line, #d9d4c7); }
  .v2 .state-rules th[scope="row"], .v2 .state-rules td { border: 0; padding: 2px 0; }
  .v2 .state-rules th[scope="row"] { width: auto; font-size: 18px; }
  .v2 .state-rules td[data-label]::before { content: attr(data-label) ": "; font-weight: 600; }
}

/* ---------- newsletter: Week 1 checklist on a legal pad, one field, one button ---------- */
.nl-box { position: relative; margin: 36px 0; padding: 22px 18px 16px; border-radius: 2px; background-color: var(--v2-pad);
  background-image: linear-gradient(90deg, transparent 22px, var(--v2-margin) 22px, var(--v2-margin) 23.5px, transparent 23.5px); padding-left: 38px;
  box-shadow: 0 12px 20px -14px rgb(29 36 51 / .45); transform: rotate(-0.3deg); }
.nl-box::before { content: ""; position: absolute; top: -11px; left: 50%; width: 92px; height: 24px; transform: translateX(-50%) rotate(-2deg); background: rgb(255 236 150 / .85); }
.nl-box__kicker { margin: 0 0 2px; font: 400 18px/1.3 var(--v2-hand); color: var(--v2-pen); }
.v2 .nl-box__title { margin: 0 0 8px; font: 800 24px/1.2 var(--v2-display); color: var(--v2-ink); }
.nl-box--compact { margin: 30px 0; padding-top: 18px; }
.nl-box--compact .nl-box__title { font: 700 19px/1.3 var(--v2-text); }
.nl-box p { margin: 0 0 12px; }
.nl-box__row { display: flex; flex-direction: column; gap: 10px; margin: 6px 0 10px; }
.nl-box__row input { min-height: 54px; padding: 0 14px; border: 1.5px solid var(--v2-ink); border-radius: 6px; background: #FFFFFF; font: 400 18px/1.2 var(--v2-text); color: var(--v2-ink); }
.nl-box__row input:focus-visible { outline: none; box-shadow: var(--focus-ring); }
.nl-box__row .v2-btn { width: 100%; cursor: pointer; }
.nl-box__row .v2-btn:disabled { opacity: .6; cursor: default; }
.v2 .nl-box__fine { font-size: 14px; line-height: 1.45; color: var(--v2-ink-soft); }
.nl-box__done { font: 400 19px/1.35 var(--v2-hand); color: var(--v2-pen); }
.nl-box.is-done .nl-box__row { display: none; }
.nl-hp { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.nl-after { margin: -18px 0 32px; font-size: 16px; color: var(--v2-ink-soft); }
@media (min-width: 600px) {
  .nl-box__row { flex-direction: row; }
  .nl-box__row input { flex: 1; }
  .nl-box__row .v2-btn { width: auto; flex: none; }
}
@media (prefers-reduced-motion: reduce) { .nl-box { transform: none; } }

/* ---------- partner sign-up ---------- */
.partner-join { display: grid; gap: 6px; max-width: 34rem; margin-top: 18px; }
.partner-join label { margin-top: 10px; font-weight: 700; }
.partner-join input:not([type="checkbox"]), .partner-join select { min-height: 54px; padding: 0 14px; border: 1.5px solid var(--v2-ink); border-radius: 6px; background: #FFFFFF; font: 400 18px/1.2 var(--v2-text); color: var(--v2-ink); }
.partner-join .partner-join__check { display: flex; gap: 10px; align-items: flex-start; font-weight: 400; margin: 14px 0 8px; }
.partner-join .partner-join__check input { width: 22px; height: 22px; margin-top: 3px; flex: none; }
.partner-join .v2-btn { margin-top: 6px; cursor: pointer; }

/* ---------- reviews ---------- */
.v2-reviews__list { display: grid; gap: 16px; }
.v2-review { margin: 0; padding: 16px 18px; background: #FFFFFF; border: 1.5px solid var(--v2-ink); border-radius: 4px; }
.v2-review__stars { margin: 0 0 6px; color: #B4532A; font-size: 18px; letter-spacing: 2px; }
.v2-review blockquote { margin: 0 0 8px; font-size: 18px; line-height: 1.5; }
.v2-review__missing { margin: 0 0 8px; color: var(--v2-ink-soft); font-size: 16px; }
.v2-review figcaption { font: 400 16px/1.35 var(--v2-hand); color: var(--v2-pen); }
.v2-reviews--mini { margin: 18px 0; }
@media (min-width: 960px) { .v2-reviews__list { grid-template-columns: repeat(3, minmax(0, 1fr)); } .v2-reviews--mini .v2-reviews__list { grid-template-columns: 1fr 1fr; } }

/* ---------- thank-you: share link ---------- */
.share-earn { margin: 32px 0; padding: 20px 18px; border: 2px solid var(--v2-ink); border-radius: 4px; background: #FFFFFF; box-shadow: 4px 4px 0 var(--v2-ink); }
.share-earn h2 { margin-top: 0; }
.share-earn .v2-btn { cursor: pointer; }
.share-earn__out span { word-break: break-all; }

/* ---------- download page: the first 15 minutes as three steps ---------- */
.dl-progress { margin: 0 0 32px; padding: 16px 16px 8px; border: 1.5px solid var(--v2-ink); border-radius: 4px; background: #FFFFFF; }
.dl-progress__head { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 12px; margin: 0 0 6px; }
.dl-progress__head span { font: 400 17px/1.3 var(--v2-hand); color: var(--v2-pen); }
.dl-progress ol { list-style: none; margin: 0; padding: 0; }
.dl-progress li { margin: 0; border-top: 1px solid var(--v2-line); }
.dl-progress button { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 52px; padding: 8px 0; border: 0; background: transparent; font: inherit; font-size: 18px; text-align: left; color: var(--v2-ink); cursor: pointer; }
.dl-progress button::before { content: ""; flex: none; width: 26px; height: 26px; background: no-repeat center / 26px url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26 26'%3E%3Cpath d='M4 5C9 3.6 16 4.2 22 4.6 22.6 10 22.2 16 21.6 21.8 15 22.6 9 22.2 4.4 21.6 3.6 15 3.8 10 4 5Z' fill='none' stroke='%231D2433' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E"); }
.dl-progress button[aria-checked="true"] { color: var(--v2-ink-soft); text-decoration: line-through; text-decoration-color: var(--v2-pen); }
.dl-progress button[aria-checked="true"]::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26 26'%3E%3Cpath d='M4 5C9 3.6 16 4.2 22 4.6 22.6 10 22.2 16 21.6 21.8 15 22.6 9 22.2 4.4 21.6 3.6 15 3.8 10 4 5Z' fill='%23FFF7C7' stroke='%231D2433' stroke-width='1.8' stroke-linecap='round'/%3E%3Cpath d='M7 13.5C9 15 10.5 17 11.5 19 14 13 18 7.5 24.5 2.5' fill='none' stroke='%232349A8' stroke-width='2.6' stroke-linecap='round'/%3E%3C/svg%3E"); }
.dl-progress button:focus-visible { outline: none; box-shadow: var(--focus-ring); }
/* day chips read like a date written in the planner, not a spaced capital label */
.v2 .day { font: 400 17px/1.25 var(--v2-hand); letter-spacing: 0; text-transform: none; color: var(--v2-pen); background: transparent; border: 0; padding: 0; }
.v2 .day--amber { color: var(--v2-ink); background: linear-gradient(transparent 42%, var(--v2-marker) 42%, var(--v2-marker) 94%, transparent 94%); }

/* ---------- desktop: the same blocks side by side (phones keep the order of the markup) ---------- */
/* hero proof: the real sheet (phones: Date + Task columns of the same screenshot); the drawn pad only next to it on wide screens */
.v2-snap--hero { max-width: 380px; margin: 22px auto 20px; transform: rotate(-1deg); }
.v2-hero__art .v2-pad { display: none; }
.v2-objections .v2-checklist { gap: 14px; }
.v2-objections .v2-checklist li { font-size: 18px; line-height: 1.45; }
.post-aside { display: none; }
@media (min-width: 960px) {
  .v2-wrap { max-width: 1160px; padding: 0 40px; }
  .v2-section { padding: 72px 0; }
  .v2-section--first { padding-top: 56px; }
  .v2 h1, .v2-h1 { font-size: 56px; line-height: 1.08; }
  .v2 h2, .v2-h2 { font-size: 38px; line-height: 1.15; }
  .v2-head { max-width: 42rem; margin-bottom: 28px; }
  .v2-wrap p { max-width: 42rem; }

  /* hero: words and button left, the plan on the table right */
  .v2-hero { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); grid-template-areas: "text art" "cta art"; column-gap: 72px; align-items: start; }
  .v2-hero__text { grid-area: text; }
  .v2-hero__cta { grid-area: cta; max-width: 30rem; }
  .v2-hero__cta .v2-under { text-align: left; }
  .v2-hero__art { grid-area: art; position: relative; padding-top: 8px; }
  .v2-snap--hero { display: flex; flex-direction: column-reverse; width: 92%; max-width: none; margin: 0 0 -84px auto; transform: rotate(1.6deg); }
  .v2-snap--hero::before { left: 82%; }
  .v2-snap--hero figcaption { padding: 2px 4px 8px; }
  .v2-hero__art .v2-pad { display: block; margin: 0 12% 0 0; }
  .v2-section.v2-objections { padding: 36px 0; }
  .v2-objections .v2-checklist { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px; max-width: none; }

  /* situations as three cards with their drawing on top */
  .v2-situations { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin-top: 0; }
  .v2-situation--illo { display: flex; flex-direction: column; gap: 14px; padding: 22px; border: 1.5px solid var(--v2-ink); border-radius: 4px; }
  .v2-situation--illo:last-child { border-bottom: 1.5px solid var(--v2-ink); }
  .v2-situation--illo:hover { background: var(--v2-pad); }
  .v2-situation--illo .v2-spot { width: 112px; height: 84px; }

  /* the move across the page */
  .v2-timeline { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 0 20px; padding: 34px 0 0; margin-top: 8px; max-width: none; }
  .v2-timeline::before { left: 0; right: 0; top: 8px; bottom: auto; width: auto; height: 2px; }
  .v2-timeline li::before { left: 0; top: -33px; }

  /* split sections */
  .v2-split { display: grid; column-gap: 64px; row-gap: 8px; align-items: start; }
  .v2-split__head { grid-area: head; }
  .v2-split__main { grid-area: main; min-width: 0; }
  .v2-split__side { grid-area: side; min-width: 0; }
  .v2-split--sheet { grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr); grid-template-areas: "head head" "main side"; }
  .v2-split--sheet .v2-split__side h3 { margin-top: 0; }
  .v2-split--sheet .v2-sheet__row { grid-template-columns: 64px minmax(0, 1fr) 80px; font-size: 17px; }
  .v2-split--share { grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); grid-template-areas: "side head" "side main"; }
  .v2-split--share .v2-snap { max-width: none; margin-top: 8px; }
  .v2-split--compare { grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); grid-template-areas: "head head" "main side"; }
  .v2-split--compare .v2-compare { margin-top: 0 !important; }
  .v2-split--faq { grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.6fr); grid-template-areas: "head main"; }
  .v2-split--faq .v2-split__head { position: sticky; top: 110px; }
  .v2-split--final { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-areas: "side main"; align-items: center; }
  .v2-split--final .v2-snap { max-width: 64%; margin: 0 0 -36px 22%; }

  /* guide pages next to each other instead of a swipe row */
  .v2-pages { overflow: visible; margin: 0; padding: 18px 0 8px; gap: 40px; justify-content: flex-start; }
  .v2-pages .v2-snap { flex: 1 1 0; max-width: 300px; }

  /* quiz and result on wide screens */
  .v2 .quiz__intro { gap: 72px; }
  .v2 .q__title { font-size: 34px; }
}

/* articles on wide screens: the plan stays in reach in the right margin while reading */
@media (min-width: 1180px) {
  .post-layout { display: grid; grid-template-columns: minmax(0, 760px) 300px; gap: 64px; justify-content: center; max-width: 1160px; margin: 0 auto; padding: 0 var(--space-4); }
  .post-layout > .container.narrow { max-width: none; margin: 0; padding: 0; }
  .post-aside { display: block; position: sticky; top: 104px; align-self: start; margin-top: 120px; }
  .post-aside__card { position: relative; padding: 22px 20px 18px; background: #FFFFFF; border: 2px solid var(--v2-ink); border-radius: 3px; box-shadow: 4px 4px 0 var(--v2-ink); }
  .post-aside__card::before { content: ""; position: absolute; top: -12px; left: 50%; width: 86px; height: 24px; transform: translateX(-50%) rotate(-3deg); background: rgb(255 236 150 / .85); }
  .post-aside__card .v2-hand { margin: 0 0 4px; font-size: 18px; }
  .post-aside__title { margin: 0 0 12px; font: 800 22px/1.25 var(--v2-display); }
  .post-aside__list { margin: 0 0 16px; padding: 0; list-style: none; display: grid; gap: 8px; font-size: 17px; }
  .post-aside__list li { display: flex; gap: 8px; align-items: flex-start; margin: 0; }
  .post-aside__list svg { flex: none; width: 20px; height: 20px; margin-top: 3px; }
  .post-aside .v2-btn { min-height: 52px; font-size: 17px; padding: 0 14px; }
  .post-aside__meta { margin: 8px 0 0; font-size: 16px; color: var(--v2-ink-soft); text-align: center; }
}
@media (min-width: 1180px) { .post-body .plan-pointer { display: none; } }
@media (min-width: 1000px) { .v2 .quiz.is-result .result { margin: 0 auto; } }

/* founding families note: a plain boxed line, not a banner */
.founding-note { margin: 16px 0 0; padding: 12px 14px; background: var(--v2-pad); border: 1.5px solid var(--v2-ink); border-radius: 3px; font-size: 17px; line-height: 1.45; color: var(--v2-ink); max-width: 40rem; }
.offer .founding-note { margin: 18px auto 0; }

/* review form */
.review-form { display: grid; gap: 20px; margin-top: 18px; max-width: 40rem; }
.review-form fieldset { border: 0; margin: 0; padding: 0; display: grid; gap: 8px; }
.review-form legend { font-weight: 700; font-size: 18px; margin-bottom: 4px; }
.review-form label { font-size: 18px; }
.review-form input[type="radio"] { width: 20px; height: 20px; margin-right: 8px; vertical-align: -3px; accent-color: var(--v2-pen); }
.review-stars { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.review-stars legend { grid-column: 1 / -1; }
.review-stars label { display: flex; align-items: center; justify-content: center; min-height: 52px; border: 1.5px solid var(--v2-line-strong); border-radius: 4px; }
.review-stars label:has(input:checked) { border: 2px solid var(--v2-ink); background: var(--v2-pad); }
