/* ============================================================
   ResidenceSafe — Homepage v2 · "The Certified Document"
   Composed entirely from the --rs-* token system in shared.css.
   The page reads as the certified dossier the product produces.
   ============================================================ */

/* ---- Local rhythm tokens, derived from the DS scale ---- */
.v2-hero,
.v2-reject,
.v2-fields,
.v2-flow,
.v2-privacy,
.v2-audience,
.v2-faq,
.v2-countries,
.v2-seals,
.v2-final,
.v2-plans,
.v2-stakes,
.v2-compare,
.v2-defensible,
.v2-tech,
.v2-layers,
.v2-compliance,
.v2-about,
.v2-values,
.v2-team,
.v2-scenarios,
.v2-por,
.v2-colophon,
.v2-quickfacts {
  --v2-gutter: clamp(20px, 5vw, 64px);
  --v2-rule: 1px solid var(--rs-border-default);
  font-family: var(--rs-font-sans);
}

.v2-wrap {
  width: 100%;
  max-width: var(--rs-content-wide);
  margin-inline: auto;
  padding-inline: var(--v2-gutter);
}
.v2-wrap-narrow {
  width: 100%;
  max-width: var(--rs-content-reading);
  margin-inline: auto;
  padding-inline: var(--v2-gutter);
}

/* ---- Shared type ---- */
.v2-h2 {
  font-family: var(--rs-font-display);
  font-weight: var(--rs-weight-semibold);
  font-size: clamp(28px, 3.6vw, 44px);
  line-height: 1.12;
  letter-spacing: var(--rs-tracking-tight);
  color: var(--rs-fg-primary);
  text-wrap: balance;
}
.v2-h2--invert { color: var(--rs-fg-inverse); }

.v2-kicker {
  font-family: var(--rs-font-mono);
  font-size: var(--rs-text-xs);
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--rs-ink-600);
  margin-bottom: var(--rs-space-4);
}
.v2-lead {
  font-size: clamp(17px, 1.4vw, 19px);
  line-height: var(--rs-leading-relaxed);
  color: var(--rs-fg-secondary);
  max-width: 60ch;
  text-wrap: pretty;
}
.v2-section-head { margin-bottom: clamp(40px, 5vw, 64px); }
.v2-section-head .v2-h2 { margin-bottom: var(--rs-space-5); }

/* ---- Brand lockup tints ---- */
.v2-brand { color: var(--rs-fg-inverse); font-weight: 700; }
.v2-brand-dark { color: var(--rs-fg-primary); font-weight: 700; }
.v2-brand-white { color: var(--rs-fg-inverse); font-weight: 700; }
.v2-brand-em { color: var(--rs-ink-400); font-style: italic; font-weight: 700; }

/* ---- Links ---- */
.v2-link {
  color: var(--rs-ink-600);
  font-weight: var(--rs-weight-semibold);
  text-decoration: none;
  border-bottom: 1px solid var(--rs-ink-a30);
  transition: border-color var(--rs-duration-base) var(--rs-ease-standard), color var(--rs-duration-base) var(--rs-ease-standard);
}
.v2-link:hover { color: var(--rs-ink-700); border-color: var(--rs-ink-600); }
.v2-link-arrow {
  display: inline-flex;
  align-items: center;
  gap: var(--rs-space-2);
  min-height: 44px;
  color: var(--rs-ink-600);
  font-weight: var(--rs-weight-semibold);
  text-decoration: none;
  transition: gap var(--rs-duration-base) var(--rs-ease-standard), color var(--rs-duration-base) var(--rs-ease-standard);
}
.v2-link-arrow:hover { color: var(--rs-ink-700); gap: var(--rs-space-3); }
.v2-link-arrow svg { transition: transform var(--rs-duration-base) var(--rs-ease-standard); }
.v2-link-arrow:hover svg { transform: translateX(2px); }

/* ---- Buttons ---- */
.v2-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--rs-space-2);
  min-height: 48px;
  padding: 0 var(--rs-space-8);
  border-radius: var(--rs-radius-pill);
  font-size: var(--rs-text-base);
  font-weight: var(--rs-weight-semibold);
  text-decoration: none;
  border: 1.5px solid transparent;
  cursor: pointer;
  transition: background-color var(--rs-duration-base) var(--rs-ease-standard),
              border-color var(--rs-duration-base) var(--rs-ease-standard),
              color var(--rs-duration-base) var(--rs-ease-standard),
              box-shadow var(--rs-duration-base) var(--rs-ease-standard);
}
.v2-btn-primary {
  background: var(--rs-ink-600);
  color: var(--rs-fg-inverse);
  box-shadow: var(--rs-shadow-ink);
}
.v2-btn-primary:hover {
  background: var(--rs-ink-700);
  color: var(--rs-fg-inverse);
}
.v2-btn-ghost {
  background: transparent;
  color: var(--rs-ink-600);
  border-color: var(--rs-border-default);
}
.v2-btn-ghost:hover { border-color: var(--rs-ink-600); color: var(--rs-ink-700); }
.v2-btn-ghost-dark {
  background: transparent;
  color: var(--rs-fg-primary);
  border-color: var(--rs-border-default);
}
.v2-btn-ghost-dark:hover { border-color: var(--rs-ink-600); color: var(--rs-ink-700); }

/* ============================================================
   HERO
   ============================================================ */
.v2-hero {
  position: relative;
  background: var(--rs-midnight-900);
  color: var(--rs-fg-inverse);
  padding: clamp(120px, 14vh, 168px) 0 0;
  overflow: hidden;
}
/* faint ledger grid in the ground — atmospheric, not decorative noise */
.v2-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(var(--rs-white-04) 1px, transparent 1px),
    linear-gradient(90deg, var(--rs-white-04) 1px, transparent 1px);
  background-size: 64px 64px;
  mask-image: radial-gradient(120% 90% at 70% 0%, #fff 0%, transparent 70%);
  -webkit-mask-image: radial-gradient(120% 90% at 70% 0%, #fff 0%, transparent 70%);
  pointer-events: none;
}
.v2-hero-grid {
  position: relative;
  width: 100%;
  max-width: var(--rs-content-wide);
  margin-inline: auto;
  padding-inline: var(--v2-gutter);
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  gap: clamp(40px, 5vw, 80px);
  align-items: center;
}
.v2-hero-lede { max-width: 34rem; min-width: 0; }
.v2-filemark {
  display: inline-flex;
  align-items: center;
  gap: var(--rs-space-2);
  font-family: var(--rs-font-mono);
  font-size: var(--rs-text-xs);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--rs-ink-200);
  background: var(--rs-ink-a15);
  border: 1px solid var(--rs-ink-a25);
  padding: 7px 14px;
  border-radius: var(--rs-radius-pill);
  margin-bottom: var(--rs-space-6);
}
.v2-hero-title {
  font-family: var(--rs-font-display);
  font-weight: var(--rs-weight-semibold);
  font-size: clamp(32px, 4.2vw, 50px);
  line-height: 1.1;
  letter-spacing: var(--rs-tracking-tight);
  color: var(--rs-fg-inverse);
  text-wrap: balance;
  margin-bottom: var(--rs-space-6);
}
.v2-em { color: var(--rs-ink-300); }
.v2-hero-text {
  font-size: clamp(17px, 1.5vw, 20px);
  line-height: 1.6;
  color: var(--rs-white-85);
  margin-bottom: var(--rs-space-8);
  max-width: 40ch;
}
/* inline links inside a midnight hero need a light blue, not the
   dark action blue (which is near-invisible on midnight) */
.v2-hero-text .v2-deeplink-inline {
  color: var(--rs-ink-200);
  text-decoration-color: var(--rs-ink-400);
}
.v2-hero-text .v2-deeplink-inline:hover { color: #fff; }
.v2-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--rs-space-4);
  align-items: center;
}
.v2-hero .v2-btn-ghost {
  color: var(--rs-fg-inverse);
  border-color: var(--rs-white-25);
}
.v2-hero .v2-btn-ghost:hover { border-color: var(--rs-white-50); color: var(--rs-fg-inverse); }

/* ---- Two-phone app composition ---- */
.v2-hero-shot {
  display: flex;
  justify-content: center;
  align-items: center;
}
.v2-hero-shot img {
  width: auto;
  max-width: 100%;
  max-height: 540px;
  filter: drop-shadow(0 30px 60px var(--rs-dark-a30));
  display: block;
}
/* Hero artifact variant: the Certified Presence Report image (a document reads
   wider than a phone, so lift the height cap and frame it). Used by LP heroes. */
.v2-hero-shot--doc img {
  max-height: none;
  width: 100%;
  max-width: 560px;
  border: 1px solid var(--rs-border-default);
  border-radius: 12px;
  filter: drop-shadow(0 24px 60px var(--rs-dark-a30));
}
/* Split hero: lede + a visual (record or app shot). Reusable across audience
   and landing pages so each doesn't ship its own grid CSS. */
.v2-hero--page.v2-hero--split .v2-wrap {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(32px, 5vw, 64px);
  align-items: center;
}
@media (max-width: 900px) {
  .v2-hero--page.v2-hero--split .v2-wrap { grid-template-columns: 1fr; }
}

/* ---- The certified artifact (relocated to Four things) ---- */
.v2-doc { margin: 0; width: min(420px, 100%); perspective: 1400px; }
.v2-doc-sheet {
  position: relative;
  background: var(--rs-neutral-0);
  color: var(--rs-fg-primary);
  border-radius: var(--rs-radius-md);
  box-shadow: var(--rs-shadow-xl);
  padding: clamp(24px, 3vw, 34px);
  transform: rotateY(-9deg) rotateX(2deg);
  transform-origin: center right;
}
.v2-doc-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  padding-bottom: var(--rs-space-5);
  border-bottom: var(--v2-rule);
}
.v2-doc-org { display: flex; flex-direction: column; gap: var(--rs-space-2); }
.v2-doc-logo {
  display: block;
  width: auto;
  height: 27px;
}
.v2-doc-org-sub {
  font-family: var(--rs-font-sans);
  font-weight: 500;
  font-size: 11px;
  color: var(--rs-fg-tertiary);
  letter-spacing: 0;
}
.v2-doc-ref {
  font-family: var(--rs-font-mono);
  font-size: 11px;
  color: var(--rs-fg-tertiary);
  white-space: nowrap;
}
.v2-doc-fields {
  margin: 0;
  padding: var(--rs-space-5) 0;
}
.v2-doc-row {
  display: grid;
  grid-template-columns: 92px 1fr;
  gap: var(--rs-space-4);
  align-items: baseline;
  padding: 11px 0;
  border-bottom: 1px solid var(--rs-border-subtle);
}
.v2-doc-row dt {
  font-family: var(--rs-font-mono);
  font-size: 10.5px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--rs-fg-tertiary);
}
.v2-doc-row dd {
  font-size: 13.5px;
  font-weight: 500;
  color: var(--rs-fg-primary);
  margin: 0;
  display: flex;
  align-items: center;
  gap: var(--rs-space-2);
  flex-wrap: wrap;
}
.v2-doc-tick {
  width: 16px; height: 16px;
  border-radius: var(--rs-radius-pill);
  background: var(--rs-success-600);
  position: relative;
  flex-shrink: 0;
}
.v2-doc-tick::after {
  content: '';
  position: absolute;
  left: 5px; top: 3px;
  width: 4px; height: 7px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}
.v2-doc-note {
  font-family: var(--rs-font-mono);
  font-size: 10px;
  color: var(--rs-fg-tertiary);
  background: var(--rs-neutral-50);
  padding: 2px 6px;
  border-radius: var(--rs-radius-xs);
}
.v2-doc-hash { font-family: var(--rs-font-mono); font-size: 13px; color: var(--rs-ink-600); }
.v2-doc-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: var(--rs-space-5);
  border-top: var(--v2-rule);
}
.v2-doc-sig { display: flex; flex-direction: column; gap: 3px; }
.v2-doc-sig-label {
  font-family: var(--rs-font-mono);
  font-size: 10px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--rs-fg-tertiary);
}
.v2-doc-sig-val { font-size: 13px; font-weight: 600; color: var(--rs-fg-primary); }
.v2-doc-seal {
  flex-shrink: 0;
  position: relative;
  width: 76px;
  height: 76px;
}
.v2-doc-seal-ring { display: block; }
.v2-doc-seal-mark {
  position: absolute;
  top: 44%;
  left: 50%;
  width: 30px;
  height: 30px;
  transform: translate(-50%, -50%);
  pointer-events: none;
}

/* ---- Hero strip: blue band ---- */
.v2-hero-strip {
  margin-top: clamp(56px, 7vw, 88px);
  background: var(--rs-ink-600);
  text-align: center;
  padding: var(--rs-space-5) var(--v2-gutter);
  font-size: clamp(15px, 1.3vw, 17px);
  font-weight: var(--rs-weight-medium);
  color: var(--rs-white-90);
}
.v2-hero-strip a {
  display: inline-block;
  padding: 4px;
  color: var(--rs-fg-inverse);
  font-weight: var(--rs-weight-semibold);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.v2-hero-strip a:hover { color: var(--rs-ink-50); }

/* ============================================================
   REJECT — margin annotations
   ============================================================ */
.v2-reject { background: var(--rs-bg-canvas); padding: clamp(72px, 9vw, 112px) 0; }
.v2-reject-list {
  list-style: none;
  margin: 0;
  padding: 0;
  border-top: 2px solid var(--rs-fg-primary);
  counter-reset: reject;
}
.v2-reject-row {
  position: relative;
  display: grid;
  grid-template-columns: 2.4rem minmax(170px, 0.9fr) 1.6fr;
  grid-template-areas: "num name why";
  gap: clamp(12px, 3vw, 40px);
  align-items: baseline;
  padding: clamp(20px, 2.4vw, 30px) 0;
  padding-left: var(--rs-space-4);
  border-bottom: var(--v2-rule);
  counter-increment: reject;
  transition: background-color var(--rs-duration-base) var(--rs-ease-standard);
}
.v2-reject-row::before {
  content: counter(reject, decimal-leading-zero);
  grid-area: num;
  font-family: var(--rs-font-mono);
  font-size: var(--rs-text-sm);
  color: var(--rs-fg-tertiary);
  align-self: baseline;
}
.v2-reject-row:hover { background: var(--rs-neutral-50); }
.v2-reject-name {
  grid-area: name;
  position: relative;
  font-family: var(--rs-font-display);
  font-weight: var(--rs-weight-semibold);
  font-size: clamp(18px, 1.7vw, 23px);
  color: var(--rs-fg-primary);
  text-decoration: line-through;
  text-decoration-thickness: 1.5px;
  text-decoration-color: var(--rs-neutral-400);
}
.v2-reject-mark {
  grid-area: name;
  align-self: start;
  justify-self: start;
  margin-top: -1.15rem;
  font-family: var(--rs-font-mono);
  font-size: 9px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--rs-danger-600);
  white-space: nowrap;
}
.v2-reject-why { grid-area: why; }
.v2-reject-why {
  font-size: var(--rs-text-base);
  line-height: 1.55;
  color: var(--rs-fg-secondary);
}
.v2-reject-verdict {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--rs-space-5);
  margin-top: clamp(40px, 5vw, 64px);
}
.v2-verdict-text {
  font-family: var(--rs-font-display);
  font-weight: var(--rs-weight-semibold);
  font-size: clamp(22px, 2.6vw, 32px);
  letter-spacing: var(--rs-tracking-tight);
  color: var(--rs-fg-secondary);
}
.v2-verdict-em { color: var(--rs-fg-primary); }

/* ============================================================
   FIELDS — four sealed fields
   ============================================================ */
.v2-fields { background: var(--rs-bg-surface); padding: clamp(72px, 9vw, 112px) 0; }
.v2-fields-grid {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  border: var(--v2-rule);
  border-radius: var(--rs-radius-md);
  overflow: hidden;
}
.v2-field {
  position: relative;
  min-width: 0;
  padding: clamp(28px, 3vw, 40px);
  border-right: var(--v2-rule);
  border-bottom: var(--v2-rule);
  background: var(--rs-bg-surface);
  transition: background-color var(--rs-duration-base) var(--rs-ease-standard);
}
/* 2-col grid: drop the dividers that would double the container border */
.v2-field:nth-child(2n) { border-right: none; }
.v2-field:nth-last-child(-n+2) { border-bottom: none; }
.v2-field:hover { background: var(--rs-neutral-25); }
.v2-field-icon {
  display: grid;
  place-items: center;
  width: 52px; height: 52px;
  border-radius: var(--rs-radius-md);
  background: var(--rs-ink-a08);
  color: var(--rs-ink-600);
  margin-bottom: var(--rs-space-5);
}
.v2-field-icon svg { width: 26px; height: 26px; }
.v2-field--proof .v2-field-icon { background: var(--rs-success-50); color: var(--rs-success-600); }
.v2-field-tag {
  display: block;
  font-family: var(--rs-font-mono);
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--rs-ink-600);
  margin-bottom: var(--rs-space-2);
}
.v2-field--proof .v2-field-tag { color: var(--rs-success-600); }
.v2-field-title {
  font-family: var(--rs-font-display);
  font-weight: var(--rs-weight-semibold);
  font-size: clamp(19px, 1.8vw, 23px);
  line-height: 1.2;
  letter-spacing: var(--rs-tracking-snug);
  color: var(--rs-fg-primary);
  margin-bottom: var(--rs-space-3);
  text-wrap: balance;
}
.v2-field-body {
  font-size: var(--rs-text-base);
  line-height: 1.55;
  color: var(--rs-fg-secondary);
}
.v2-fields-proof-row {
  margin-top: clamp(48px, 6vw, 72px);
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: clamp(40px, 5vw, 72px);
  align-items: center;
}
.v2-fields-foot { max-width: 56ch; }
.v2-fields-foot p {
  font-size: var(--rs-text-base);
  line-height: 1.7;
  color: var(--rs-fg-secondary);
  margin-bottom: var(--rs-space-6);
}
.v2-fields-links {
  list-style: none;
  margin: 0;
  padding: 0;
  border-top: var(--v2-rule);
}
.v2-deeplink {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--rs-space-4);
  min-height: 52px;
  padding: var(--rs-space-3) 0;
  border-bottom: var(--v2-rule);
  color: var(--rs-fg-primary);
  font-family: var(--rs-font-display);
  font-weight: var(--rs-weight-medium);
  font-size: clamp(15px, 1.3vw, 17px);
  text-decoration: none;
  transition: color var(--rs-duration-base) var(--rs-ease-standard);
}
.v2-deeplink svg { color: var(--rs-ink-600); transition: transform var(--rs-duration-base) var(--rs-ease-standard); flex-shrink: 0; }
.v2-deeplink:hover { color: var(--rs-ink-700); }
.v2-deeplink:hover svg { transform: translateX(3px); }
/* The artifact in Four things: nearly flat, supporting role */
.v2-fields-proof-row .v2-doc { width: 100%; max-width: 420px; justify-self: center; }
.v2-fields-proof-row .v2-doc-sheet { transform: rotateY(-4deg); }

/* ============================================================
   FLOW — certified timeline
   ============================================================ */
.v2-flow { background: var(--rs-bg-canvas); padding: clamp(72px, 9vw, 112px) 0; }
.v2-timeline {
  list-style: none;
  margin: 0 0 clamp(40px, 5vw, 56px);
  padding: 0;
  display: grid;
  gap: clamp(48px, 6vw, 80px);
}
.v2-step {
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: clamp(20px, 3vw, 44px);
  align-items: center;
}
.v2-step-marker {
  align-self: start;
  position: relative;
}
.v2-step-marker span {
  display: grid;
  place-items: center;
  width: 48px; height: 48px;
  border-radius: var(--rs-radius-pill);
  border: 1.5px solid var(--rs-ink-a30);
  background: var(--rs-ink-a06);
  font-family: var(--rs-font-mono);
  font-size: 15px;
  font-weight: 600;
  color: var(--rs-ink-600);
}
.v2-step-body { max-width: 46ch; }
.v2-step-title {
  font-family: var(--rs-font-display);
  font-weight: var(--rs-weight-semibold);
  font-size: clamp(20px, 2vw, 26px);
  line-height: 1.18;
  letter-spacing: var(--rs-tracking-snug);
  color: var(--rs-fg-primary);
  margin-bottom: var(--rs-space-3);
  text-wrap: balance;
}
.v2-step-body p {
  font-size: var(--rs-text-base);
  line-height: 1.6;
  color: var(--rs-fg-secondary);
}
.v2-step-shot {
  width: clamp(210px, 24vw, 300px);
  justify-self: end;
}
.v2-step-shot img {
  width: 100%;
  height: auto;
  display: block;
}
/* Zig-zag: on even steps the mockup moves to the left and the marker to the
   right, so the timeline alternates side instead of stacking the image right. */
.v2-step:nth-child(even) .v2-step-shot { order: 0; justify-self: start; }
.v2-step:nth-child(even) .v2-step-body { order: 1; }
.v2-step:nth-child(even) .v2-step-marker { order: 2; }
@media (max-width: 860px) {
  .v2-step:nth-child(even) .v2-step-shot,
  .v2-step:nth-child(even) .v2-step-body,
  .v2-step:nth-child(even) .v2-step-marker { order: 0; }
}
.v2-flow-cta {
  display: flex;
  flex-wrap: wrap;
  gap: var(--rs-space-4);
  justify-content: center;
  padding-top: clamp(24px, 3vw, 32px);
  border-top: var(--v2-rule);
}
/* Centered secondary button under a section (e.g. "See how each layer is
   protected", "All country guides"). No top border — used mid-section. */
.v2-section-cta {
  display: flex;
  justify-content: center;
  margin-top: clamp(32px, 4vw, 48px);
}

/* ============================================================
   PRIVACY — quiet peak
   ============================================================ */
.v2-privacy {
  background: var(--rs-midnight-900);
  color: var(--rs-fg-inverse);
  padding: clamp(88px, 11vw, 136px) 0;
  text-align: center;
}
.v2-privacy .v2-h2 { margin-bottom: var(--rs-space-8); }
.v2-privacy p {
  font-size: clamp(17px, 1.5vw, 20px);
  line-height: 1.7;
  color: var(--rs-white-70);
  margin-bottom: var(--rs-space-5);
}
.v2-privacy-pin {
  font-family: var(--rs-font-display);
  font-style: italic;
  font-weight: var(--rs-weight-medium);
  color: var(--rs-fg-inverse) !important;
  margin-top: var(--rs-space-2);
}

/* ============================================================
   AUDIENCE
   ============================================================ */
.v2-audience { background: var(--rs-bg-surface); padding: clamp(72px, 9vw, 112px) 0; }
.v2-audience-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(16px, 2vw, 24px);
}
.v2-aud-card {
  display: flex;
  flex-direction: column;
  padding: clamp(24px, 2.6vw, 34px);
  background: var(--rs-bg-canvas);
  border: var(--v2-rule);
  border-radius: var(--rs-radius-md);
  text-decoration: none;
  transition: border-color var(--rs-duration-base) var(--rs-ease-standard),
              box-shadow var(--rs-duration-base) var(--rs-ease-standard),
              transform var(--rs-duration-base) var(--rs-ease-standard);
}
.v2-aud-card:hover {
  border-color: var(--rs-ink-a30);
  box-shadow: var(--rs-shadow-md);
  transform: translateY(-3px);
}
.v2-aud-title {
  font-family: var(--rs-font-display);
  font-weight: var(--rs-weight-semibold);
  font-size: clamp(20px, 1.8vw, 24px);
  color: var(--rs-fg-primary);
  margin-bottom: var(--rs-space-4);
}
.v2-aud-card p {
  font-size: var(--rs-text-base);
  line-height: 1.55;
  color: var(--rs-fg-secondary);
  margin-bottom: var(--rs-space-6);
  flex-grow: 1;
}
.v2-aud-cta {
  font-weight: var(--rs-weight-semibold);
  color: var(--rs-ink-600);
}

/* ============================================================
   FAQ
   ============================================================ */
.v2-faq { background: var(--rs-bg-canvas); padding: clamp(72px, 9vw, 112px) 0; }
.v2-faq-list {
  border-top: var(--v2-rule);
}
.v2-faq-item {
  border-bottom: var(--v2-rule);
}
.v2-faq-q {
  list-style: none;
  cursor: pointer;
  display: flex;
  align-items: baseline;
  gap: 0.25ch;
  padding: clamp(18px, 2.2vw, 24px) 0;
  font-family: var(--rs-font-display);
  font-weight: var(--rs-weight-semibold);
  font-size: clamp(17px, 1.5vw, 20px);
  color: var(--rs-fg-primary);
}
.v2-faq-q::-webkit-details-marker { display: none; }
.v2-faq-q::after {
  content: '';
  flex-shrink: 0;
  margin-left: auto;
  align-self: center;
  width: 11px; height: 11px;
  border-right: 2px solid var(--rs-ink-600);
  border-bottom: 2px solid var(--rs-ink-600);
  transform: rotate(45deg);
  transition: transform var(--rs-duration-base) var(--rs-ease-standard);
}
.v2-faq-item[open] .v2-faq-q::after { transform: rotate(-135deg); }
.v2-faq-a {
  padding: 0 0 clamp(18px, 2.2vw, 24px);
  max-width: 68ch;
}
.v2-faq-a p {
  font-size: var(--rs-text-base);
  line-height: 1.65;
  color: var(--rs-fg-secondary);
}
.v2-faq-more { margin-top: clamp(28px, 3vw, 40px); }

/* ============================================================
   COUNTRIES
   ============================================================ */
.v2-countries { background: var(--rs-bg-surface); padding: clamp(72px, 9vw, 112px) 0; }
.v2-country-grid {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--rs-space-3);
}
.v2-country {
  display: flex;
  align-items: center;
  min-height: 56px;
  padding: var(--rs-space-2) var(--rs-space-5);
  white-space: nowrap;
  border: var(--v2-rule);
  border-radius: var(--rs-radius-md);
  font-family: var(--rs-font-display);
  font-weight: var(--rs-weight-medium);
  font-size: var(--rs-text-base);
  color: var(--rs-fg-primary);
  text-decoration: none;
  transition: border-color var(--rs-duration-base) var(--rs-ease-standard),
              color var(--rs-duration-base) var(--rs-ease-standard),
              background-color var(--rs-duration-base) var(--rs-ease-standard);
}
.v2-country-flag {
  font-size: 20px;
  line-height: 1;
  margin-right: var(--rs-space-3);
  flex-shrink: 0;
}
.v2-country:hover {
  border-color: var(--rs-ink-a30);
  background: var(--rs-ink-a06);
  color: var(--rs-ink-700);
}
.v2-countries-cta { margin-top: clamp(28px, 3vw, 40px); }

/* ============================================================
   SEALS
   ============================================================ */
.v2-seals { background: var(--rs-bg-canvas); padding: clamp(56px, 7vw, 80px) 0; border-top: var(--v2-rule); }
.v2-seals-label {
  text-align: center;
  font-family: var(--rs-font-mono);
  font-size: var(--rs-text-xs);
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--rs-fg-tertiary);
  margin-bottom: var(--rs-space-8);
}
.v2-seals-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: clamp(28px, 5vw, 64px);
}
.v2-seals-row img {
  height: 52px;
  width: auto;
  opacity: 0.78;
  transition: opacity var(--rs-duration-base) var(--rs-ease-standard);
}
.v2-seals-row a:hover img { opacity: 1; }

/* ============================================================
   FINAL CTA
   ============================================================ */
.v2-final {
  background: var(--rs-midnight-900);
  color: var(--rs-fg-inverse);
  padding: clamp(88px, 11vw, 136px) 0;
  text-align: center;
}
.v2-final-title { margin-bottom: var(--rs-space-6); max-width: 22ch; margin-inline: auto; }
.v2-final-sub {
  font-size: clamp(17px, 1.5vw, 19px);
  line-height: 1.6;
  color: var(--rs-white-70);
  max-width: 56ch;
  margin: 0 auto clamp(32px, 4vw, 44px);
}
.v2-final .v2-btn-ghost {
  color: var(--rs-fg-inverse);
  border-color: var(--rs-white-25);
}
/* Secondary "also for …" line under the CTA buttons. Its own top margin
   separates it from the actions; links are light blue (ink-200) so they
   stay legible on midnight — never the dark action blue. */
.v2-final-also {
  margin-top: clamp(24px, 3vw, 32px);
  font-size: var(--rs-text-sm);
  color: var(--rs-white-70);
}
.v2-final-also a {
  color: var(--rs-ink-200);
  text-decoration: none;
}
.v2-final-also a:hover { text-decoration: underline; }
.v2-final .v2-btn-ghost:hover { border-color: var(--rs-white-50); }
.v2-final-badges {
  display: flex;
  flex-wrap: wrap;
  gap: var(--rs-space-4);
  justify-content: center;
  margin-top: clamp(32px, 4vw, 44px);
}
.v2-final-badges img { height: 48px; width: auto; }

/* ============================================================
   MOTION — orchestrated reveals
   ============================================================ */
[data-reveal],
[data-reveal-item] {
  opacity: 0;
  transform: translateY(22px);
  transition: opacity var(--rs-duration-slower) var(--rs-ease-decelerate),
              transform var(--rs-duration-slower) var(--rs-ease-decelerate);
}
[data-reveal].is-in,
[data-reveal-item].is-in {
  opacity: 1;
  transform: none;
}
[data-reveal-item] { transition-delay: calc(var(--i, 0) * 70ms); }

/* Hero phones: settle in */
.v2-hero-shot {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity var(--rs-duration-hero) var(--rs-ease-decelerate),
              transform var(--rs-duration-hero) var(--rs-ease-decelerate);
}
.v2-hero-shot.is-in { opacity: 1; transform: none; }

/* ============================================================
   OVERDRIVE — "the document is sealed before your eyes"
   A single signature moment: the sheet settles, its fields are
   written in sequence, identity confirms, the hash settles, and
   the certification seal drops and stamps. Fires once on enter.
   ============================================================ */

/* 1 · the sheet settles in */
.v2-doc[data-reveal-artifact] {
  opacity: 0;
  transform: translateY(26px);
  transition: opacity var(--rs-duration-slower) var(--rs-ease-decelerate),
              transform var(--rs-duration-slower) var(--rs-ease-decelerate);
}
.v2-doc[data-reveal-artifact].is-in { opacity: 1; transform: none; }

/* 2 · each field row is written in, staggered after the sheet */
.v2-doc[data-reveal-artifact] .v2-doc-row {
  opacity: 0;
  clip-path: inset(0 100% 0 0);
  transition: opacity var(--rs-duration-base) var(--rs-ease-decelerate),
              clip-path var(--rs-duration-slow) var(--rs-ease-emphasized);
  transition-delay: calc(260ms + var(--row, 0) * 150ms);
}
.v2-doc[data-reveal-artifact].is-in .v2-doc-row {
  opacity: 1;
  clip-path: inset(0 0 0 0);
}

/* 3 · identity tick draws its check once its row is written */
.v2-doc[data-reveal-artifact] .v2-doc-tick {
  opacity: 0;
  transform: scale(0.4);
  transition: opacity var(--rs-duration-fast) var(--rs-ease-standard),
              transform var(--rs-duration-base) var(--rs-ease-emphasized);
  transition-delay: 560ms;
}
.v2-doc[data-reveal-artifact].is-in .v2-doc-tick { opacity: 1; transform: scale(1); }
.v2-doc[data-reveal-artifact] .v2-doc-tick::after {
  opacity: 0;
  transition: opacity var(--rs-duration-fast) var(--rs-ease-standard) 680ms;
}
.v2-doc[data-reveal-artifact].is-in .v2-doc-tick::after { opacity: 1; }

/* 4 · the hash settling (JS rolls the digits; this is the resting tint) */
.v2-doc-hash [data-doc-hash] { transition: color var(--rs-duration-base) var(--rs-ease-standard); }
.v2-doc-hash [data-doc-hash].is-rolling { color: var(--rs-ink-400); }

/* 5 · the seal drops and stamps */
.v2-doc-seal {
  opacity: 0;
  transform: scale(1.45) rotate(-14deg);
  transition: opacity var(--rs-duration-slow) var(--rs-ease-standard) 900ms,
              transform var(--rs-duration-slow) var(--rs-ease-emphasized) 900ms;
}
.v2-doc[data-reveal-artifact].is-in .v2-doc-seal { opacity: 1; transform: none; }

/* ============================================================
   FOCUS — visible, branded, keyboard-only
   ============================================================ */
.v2-btn:focus-visible,
.v2-link:focus-visible,
.v2-link-arrow:focus-visible,
.v2-deeplink:focus-visible,
.v2-aud-card:focus-visible,
.v2-country:focus-visible,
.v2-faq-q:focus-visible,
.v2-hero-strip a:focus-visible,
.v2-reject-why a:focus-visible {
  outline: 2px solid var(--rs-ink-500);
  outline-offset: 3px;
  border-radius: var(--rs-radius-xs);
}
/* on the midnight hero strip the ring needs a light contrast */
.v2-hero-strip a:focus-visible { outline-color: var(--rs-white-85); }

/* ============================================================
   I18N HARDENING — long unbreakable words (German compounds,
   long country/legal terms) must wrap, never overflow their box.
   ============================================================ */
.v2-hero-title,
.v2-h2,
.v2-field-title,
.v2-field-tag,
.v2-step-title,
.v2-aud-title,
.v2-faq-q,
.v2-reject-name,
.v2-deeplink,
.v2-country {
  /* break-word alone: it only breaks when a word truly can't fit (the
     long-German-term safety), while hyphens:auto was splitting ordinary
     English display headings mid-word ("use-ful"). */
  overflow-wrap: break-word;
}
.v2-reject-name { white-space: normal; }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 1023px) {
  .v2-hero { padding-top: clamp(100px, 12vh, 128px); }
  .v2-hero-grid { grid-template-columns: 1fr; gap: clamp(40px, 7vw, 56px); }
  .v2-hero-lede { max-width: none; }
  .v2-hero-text { max-width: 52ch; }
  .v2-audience-grid { grid-template-columns: 1fr; max-width: 520px; margin-inline: auto; }
  .v2-fields-proof-row { grid-template-columns: 1fr; gap: clamp(36px, 6vw, 56px); }
  .v2-fields-foot { max-width: none; }
  .v2-fields-proof-row .v2-doc-sheet { transform: none; }
}

@media (max-width: 767px) {
  .v2-reject-row { grid-template-columns: 1fr; gap: var(--rs-space-1); }
  .v2-fields-grid { grid-template-columns: 1fr; }
  .v2-field { border-right: none; border-bottom: var(--v2-rule); }
  .v2-field:last-child { border-bottom: none; }
  .v2-step { grid-template-columns: auto 1fr; }
  .v2-step-shot {
    grid-column: 1 / -1;
    justify-self: center;
    width: clamp(180px, 60vw, 240px);
    margin-top: var(--rs-space-2);
  }
  .v2-reject-verdict { flex-direction: column; align-items: flex-start; }
  .v2-country-grid { grid-template-columns: repeat(2, 1fr); }
  .v2-country { padding-inline: var(--rs-space-3); font-size: var(--rs-text-sm); }
}

@media (prefers-reduced-motion: reduce) {
  [data-reveal],
  [data-reveal-item],
  .v2-hero-shot,
  .v2-doc[data-reveal-artifact],
  .v2-doc[data-reveal-artifact] .v2-doc-row,
  .v2-doc[data-reveal-artifact] .v2-doc-tick,
  .v2-doc[data-reveal-artifact] .v2-doc-tick::after,
  .v2-doc-seal {
    opacity: 1 !important;
    transform: none !important;
    clip-path: none !important;
    transition: none !important;
  }
}

/* ============================================================
   PRICING PAGE — v2 plan cards + page hero
   (reuses v2 tokens; price internals (.price-amount, .check,
   .save-badge, .toggle-track) keep their pages.css styles)
   ============================================================ */

/* Page hero: lede only, no two-column image grid */
.v2-hero--page { padding-bottom: clamp(72px, 9vw, 112px); }
.v2-hero--page .v2-hero-lede { max-width: 46rem; }
/* page hero is single-column (lede only): a visible ledger grid that
   fades toward the lower-left where the text sits, so the midnight reads
   as ruled paper, not a flat block. */
.v2-hero--page::before {
  background-image:
    linear-gradient(rgba(255,255,255,0.14) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.14) 1px, transparent 1px);
  background-size: 52px 52px;
  mask-image: radial-gradient(120% 130% at 88% 12%, #fff 0%, rgba(255,255,255,0.45) 45%, transparent 80%);
  -webkit-mask-image: radial-gradient(120% 130% at 88% 12%, #fff 0%, rgba(255,255,255,0.45) 45%, transparent 80%);
}
/* node-network: drop any rigid grid, draw a connected node mesh.
   Shared canvas positioning across midnight sections. */
.v2-hero--net::before { display: none; }
.v2-net-canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 0;
}
.v2-hero--net .v2-wrap { position: relative; z-index: 1; }
/* privacy section needs to host the canvas + keep text above it */
.v2-privacy--net { position: relative; overflow: hidden; }
.v2-privacy--net .v2-wrap-narrow { position: relative; z-index: 1; }
/* final CTA sections host a canvas too */
.v2-final--net { position: relative; overflow: hidden; }
.v2-final--net .v2-wrap-narrow { position: relative; z-index: 1; }

/* Plans section */
.v2-plans {
  background: var(--rs-bg-surface);
  padding: clamp(56px, 7vw, 88px) 0 clamp(72px, 9vw, 112px);
}

/* Billing toggle — left-aligned, in the v2 rhythm */
.v2-billing-toggle {
  display: flex;
  align-items: center;
  gap: var(--rs-space-3);
  margin-bottom: clamp(32px, 4vw, 48px);
}

/* Plan grid: bordered cells, shared rules — not floating cards */
.v2-plan-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border: var(--v2-rule);
  border-radius: var(--rs-radius-md);
  overflow: hidden;
}
.v2-plan {
  position: relative;
  min-width: 0;
  display: flex;
  flex-direction: column;
  padding: clamp(28px, 3vw, 40px);
  background: var(--rs-bg-surface);
  border-right: var(--v2-rule);
  transition: background-color var(--rs-duration-base) var(--rs-ease-standard);
}
.v2-plan:last-child { border-right: none; }
.v2-plan:hover { background: var(--rs-neutral-25); }
.v2-plan--featured {
  background: var(--rs-ink-a06);
  padding-top: calc(clamp(28px, 3vw, 40px) + 16px);
}
.v2-plan--featured:hover { background: var(--rs-ink-a08); }

/* "Most Popular" — a flush banner across the top of the featured cell */
.v2-plan-badge {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  padding: 5px 0;
  text-align: center;
  font-family: var(--rs-font-mono);
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--rs-fg-inverse);
  background: var(--rs-ink-600);
}
.v2-plan-name {
  font-family: var(--rs-font-display);
  font-weight: var(--rs-weight-semibold);
  font-size: var(--rs-text-lg);
  color: var(--rs-fg-primary);
  margin-bottom: var(--rs-space-1);
}
.v2-plan-desc {
  font-size: var(--rs-text-sm);
  color: var(--rs-fg-secondary);
  line-height: 1.5;
  margin-bottom: var(--rs-space-5);
  min-height: 40px;
}
.v2-plan-price {
  display: flex;
  align-items: baseline;
  gap: 2px;
  margin-bottom: var(--rs-space-1);
}
.v2-plan-features {
  list-style: none;
  margin: var(--rs-space-5) 0 var(--rs-space-6);
  padding: 0;
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  gap: var(--rs-space-2);
}
.v2-plan-features li {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: var(--rs-text-sm);
  color: var(--rs-fg-secondary);
  line-height: 1.5;
}
.v2-plan .v2-btn { width: 100%; }
.v2-plan-meta {
  margin-top: var(--rs-space-3);
  font-size: var(--rs-text-xs);
  color: var(--rs-fg-tertiary);
  text-align: center;
}

@media (max-width: 900px) {
  .v2-plan-grid { grid-template-columns: 1fr; }
  .v2-plan { border-right: none; border-bottom: var(--v2-rule); }
  .v2-plan:last-child { border-bottom: none; }
  .v2-plan-desc { min-height: 0; }
}

.v2-plan-note {
  max-width: 70ch;
  margin: var(--rs-space-5) 0 0;
  font-size: var(--rs-text-sm);
  color: var(--rs-fg-tertiary);
  line-height: var(--rs-leading-relaxed);
}

/* Enterprise band */
.v2-enterprise {
  margin: clamp(40px, 5vw, 64px) 0 0;
  padding: clamp(28px, 3vw, 40px);
  background: var(--rs-bg-canvas);
  border: var(--v2-rule);
  border-radius: var(--rs-radius-md);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--rs-space-8);
  flex-wrap: wrap;
}
.v2-enterprise-body { flex: 1 1 28rem; min-width: 0; }
.v2-enterprise-body h3 {
  font-family: var(--rs-font-display);
  font-weight: var(--rs-weight-semibold);
  font-size: var(--rs-text-lg);
  color: var(--rs-fg-primary);
  margin-bottom: var(--rs-space-2);
}
.v2-enterprise-body p {
  color: var(--rs-fg-secondary);
  line-height: var(--rs-leading-relaxed);
}
.v2-deeplink-inline {
  color: var(--rs-ink-600);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.v2-deeplink-inline:hover { color: var(--rs-ink-700); }

/* What's at stake */
.v2-stakes {
  background: var(--rs-bg-canvas);
  padding: clamp(72px, 9vw, 112px) 0;
}
.v2-stakes-list {
  margin: 0 0 clamp(40px, 5vw, 56px);
  padding: 0;
  list-style: none;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  border: var(--v2-rule);
  border-radius: var(--rs-radius-md);
  overflow: hidden;
  background: var(--rs-bg-surface);
}
.v2-stakes-list li {
  position: relative;
  padding: clamp(24px, 3vw, 32px) clamp(24px, 3vw, 32px) clamp(24px, 3vw, 32px) calc(clamp(24px, 3vw, 32px) + var(--rs-space-5));
  border-right: var(--v2-rule);
  border-bottom: var(--v2-rule);
  font-size: var(--rs-text-base);
  color: var(--rs-fg-secondary);
  line-height: var(--rs-leading-relaxed);
}
.v2-stakes-list li:nth-child(2n) { border-right: none; }
.v2-stakes-list li:nth-last-child(-n+2) { border-bottom: none; }
.v2-stakes-list li::before {
  content: "";
  position: absolute;
  left: clamp(24px, 3vw, 32px);
  top: calc(clamp(24px, 3vw, 32px) + 0.55em);
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--rs-ink-400);
}
@media (max-width: 640px) {
  .v2-stakes-list { grid-template-columns: 1fr; }
  .v2-stakes-list li { border-right: none; }
  .v2-stakes-list li:nth-last-child(-n+2):not(:last-child) { border-bottom: var(--v2-rule); }
}

/* Stakes footer: one sober closing line, not a face-off block */
.v2-stakes-foot {
  max-width: var(--rs-content-reading);
  margin: 0 auto;
  padding: clamp(20px, 2.5vw, 28px) clamp(28px, 4vw, 44px);
  background: var(--rs-bg-surface);
  border: var(--v2-rule);
  border-radius: var(--rs-radius-md);
  font-size: clamp(16px, 1.4vw, 18px);
  line-height: var(--rs-leading-relaxed);
  color: var(--rs-fg-primary);
  text-align: center;
}

/* Comparison table section wrapper */
.v2-compare {
  background: var(--rs-bg-surface);
  padding: clamp(72px, 9vw, 112px) 0;
}

/* Defensible: fields grid + certified document side by side */
.v2-defensible {
  background: var(--rs-bg-canvas);
  padding: clamp(72px, 9vw, 112px) 0;
}
.v2-defensible-row {
  display: grid;
  grid-template-columns: 1.45fr 0.9fr;
  gap: clamp(32px, 4vw, 56px);
  align-items: start;
}
.v2-defensible-row .v2-fields-grid {
  background: var(--rs-bg-surface);
}
.v2-defensible-row .v2-doc {
  position: sticky;
  top: clamp(80px, 12vh, 120px);
}
.v2-doc-caption {
  font-family: var(--rs-font-mono);
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--rs-fg-tertiary);
  margin-bottom: var(--rs-space-4);
  text-align: center;
}

/* Final CTA on midnight */
.v2-final {
  background: var(--rs-midnight-900);
  color: var(--rs-fg-inverse);
  padding: clamp(88px, 11vw, 136px) 0;
  text-align: center;
}
.v2-final .v2-wrap-narrow { text-align: center; }
.v2-final-text {
  margin: var(--rs-space-5) auto 0;
  max-width: 60ch;
  font-size: clamp(16px, 1.4vw, 18px);
  line-height: var(--rs-leading-relaxed);
  color: var(--rs-white-70);
}
.v2-final-actions {
  margin: clamp(28px, 4vw, 40px) 0 0;
  display: flex;
  gap: var(--rs-space-3);
  justify-content: center;
  flex-wrap: wrap;
}
.v2-btn-ghost-invert {
  background: transparent;
  color: var(--rs-fg-inverse);
  border-color: var(--rs-white-25);
}
.v2-btn-ghost-invert:hover {
  border-color: var(--rs-fg-inverse);
  color: var(--rs-fg-inverse);
}
.v2-final-badges {
  margin-top: clamp(28px, 4vw, 40px);
  display: flex;
  gap: var(--rs-space-3);
  justify-content: center;
  flex-wrap: wrap;
}

@media (max-width: 860px) {
  .v2-defensible-row { grid-template-columns: 1fr; }
  .v2-defensible-row .v2-doc { position: static; max-width: 420px; margin: 0 auto; }
  .v2-enterprise { flex-direction: column; align-items: flex-start; }
}

/* ============================================================
   HOW-IT-WORKS — section backgrounds (alternating rhythm)
   ============================================================ */
.v2-tech {
  background: var(--rs-bg-surface);
  padding: clamp(72px, 9vw, 112px) 0;
}
.v2-tech-cta {
  display: flex;
  justify-content: center;
  margin-top: clamp(64px, 8vw, 96px);
}

/* HOW-IT-WORKS timeline shots: the mockup reveals with a soft wipe
   distinct from the text's fade, plus a quiet lift on hover.
   Scoped to .v2-flow so the homepage timeline is untouched.
   No container overflow/frame — the wipe lives on the image itself. */
.v2-flow .v2-step-shot {
  transition: transform var(--rs-duration-base) var(--rs-ease-decelerate);
}
.v2-flow .v2-step-shot img {
  border-radius: var(--rs-radius-lg);
  transition: clip-path var(--rs-duration-slower) var(--rs-ease-decelerate),
              transform var(--rs-duration-slower) var(--rs-ease-decelerate),
              opacity var(--rs-duration-slower) var(--rs-ease-decelerate);
}
.v2-flow .v2-step[data-reveal-item] .v2-step-shot img {
  clip-path: inset(10% 0 0 0);
  transform: scale(1.05);
  opacity: 0;
}
.v2-flow .v2-step[data-reveal-item].is-in .v2-step-shot img {
  clip-path: inset(0 0 0 0);
  transform: scale(1);
  opacity: 1;
  transition-delay: calc(var(--i, 0) * 80ms + 160ms);
}
.v2-flow .v2-step-shot:hover {
  transform: translateY(-4px);
}
@media (prefers-reduced-motion: reduce) {
  .v2-flow .v2-step[data-reveal-item] .v2-step-shot img,
  .v2-flow .v2-step[data-reveal-item].is-in .v2-step-shot img {
    clip-path: none;
    transform: none;
    opacity: 1;
    transition: none;
  }
  .v2-flow .v2-step-shot:hover { transform: none; }
}

/* ============================================================
   HOW-WE-PROTECT-YOU — layer detail blocks + compliance
   ============================================================ */
.v2-layers {
  background: var(--rs-bg-canvas);
  padding: clamp(72px, 9vw, 112px) 0;
}
/* Two-column layers: text + product shot, alternating sides for rhythm */
.v2-layer {
  display: grid;
  grid-template-columns: 1.2fr 0.8fr;
  gap: clamp(32px, 5vw, 72px);
  align-items: center;
  padding: clamp(40px, 6vw, 72px) 0;
  border-top: var(--v2-rule);
}
.v2-layer:first-of-type { border-top: none; padding-top: 0; }
.v2-layer--reverse .v2-layer-col { order: 2; }
.v2-layer--reverse .v2-layer-shot { order: 1; }
.v2-layer-shot {
  justify-self: center;
  width: clamp(220px, 26vw, 300px);
}
.v2-layer-shot img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: var(--rs-radius-lg);
}
.v2-layer-glyph {
  display: grid;
  place-items: center;
  width: 56px;
  height: 56px;
  border-radius: var(--rs-radius-md);
  background: var(--rs-ink-a08);
  color: var(--rs-ink-600);
  margin-bottom: var(--rs-space-4);
}
.v2-layer-glyph i { font-size: 30px; line-height: 1; }
@media (max-width: 860px) {
  .v2-layer { grid-template-columns: 1fr; gap: var(--rs-space-6); }
  .v2-layer--reverse .v2-layer-col { order: 1; }
  .v2-layer--reverse .v2-layer-shot { order: 2; }
}
.v2-layer-head { margin-bottom: var(--rs-space-4); }
.v2-layer-tag {
  display: block;
  font-family: var(--rs-font-mono);
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--rs-ink-600);
  margin-bottom: var(--rs-space-2);
}
.v2-layer-title {
  font-family: var(--rs-font-display);
  font-weight: var(--rs-weight-semibold);
  font-size: clamp(22px, 2.4vw, 28px);
  letter-spacing: var(--rs-tracking-snug);
  color: var(--rs-fg-primary);
}
.v2-layer-text {
  font-size: clamp(16px, 1.4vw, 17px);
  line-height: var(--rs-leading-relaxed);
  color: var(--rs-fg-secondary);
  max-width: 68ch;
}
.v2-layer-specs {
  margin-top: var(--rs-space-4);
  border-bottom: none;
}
.v2-layer-specs .v2-faq-q {
  font-family: var(--rs-font-mono);
  font-size: var(--rs-text-sm);
  font-weight: var(--rs-weight-regular);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--rs-ink-600);
  padding: var(--rs-space-3) 0;
}
.v2-spec-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--rs-space-3);
}
.v2-spec-list li {
  position: relative;
  padding-left: var(--rs-space-5);
  font-size: var(--rs-text-sm);
  line-height: var(--rs-leading-relaxed);
  color: var(--rs-fg-secondary);
}
.v2-spec-list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.6em;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--rs-ink-400);
}
.v2-spec-list strong { color: var(--rs-fg-primary); font-weight: var(--rs-weight-semibold); }

.v2-compliance {
  background: var(--rs-bg-surface);
  padding: clamp(72px, 9vw, 112px) 0;
}
/* compliance logos sit in the field icon slot */
.v2-compliance .v2-field-icon {
  background: transparent;
  width: auto;
  height: 52px;
  justify-items: start;
  place-items: center start;
}
.v2-compliance .v2-field-icon img { width: auto; height: 36px; object-fit: contain; }

/* ============================================================
   ABOUT — origin prose, team row
   ============================================================ */
.v2-about {
  background: var(--rs-bg-surface);
  padding: clamp(72px, 9vw, 112px) 0;
}
.v2-prose p {
  font-size: clamp(16px, 1.4vw, 18px);
  line-height: var(--rs-leading-loose);
  color: var(--rs-fg-secondary);
  margin-bottom: var(--rs-space-5);
}
.v2-prose strong { color: var(--rs-fg-primary); font-weight: var(--rs-weight-semibold); }
.v2-prose-callout {
  padding: clamp(20px, 2.5vw, 28px) clamp(24px, 3vw, 32px);
  background: var(--rs-ink-a06);
  border-radius: var(--rs-radius-md);
  color: var(--rs-fg-primary) !important;
}
.v2-kicker--invert { color: var(--rs-ink-200); }

.v2-team {
  background: var(--rs-bg-canvas);
  padding: clamp(72px, 9vw, 112px) 0;
}
.v2-team-row {
  display: grid;
  grid-template-columns: 1fr 0.85fr;
  gap: clamp(32px, 5vw, 72px);
  align-items: center;
}
.v2-team-text p {
  font-size: clamp(15px, 1.3vw, 17px);
  line-height: var(--rs-leading-relaxed);
  color: var(--rs-fg-secondary);
  margin-bottom: var(--rs-space-4);
}
.v2-team-text strong { color: var(--rs-fg-primary); font-weight: var(--rs-weight-semibold); }
.v2-team-badges {
  display: flex;
  gap: var(--rs-space-4);
  align-items: center;
  margin-top: var(--rs-space-6);
}
.v2-team-visual img {
  width: 100%;
  height: auto;
  border-radius: var(--rs-radius-md);
}
@media (max-width: 860px) {
  .v2-team-row { grid-template-columns: 1fr; }
}

/* ============================================================
   COMPARE — scenarios, 3-col fields, privacy face-off
   ============================================================ */
.v2-scenarios {
  background: var(--rs-bg-canvas);
  padding: clamp(72px, 9vw, 112px) 0;
}
/* 3-column variant of the bordered cell grid */
.v2-fields-grid--3 { grid-template-columns: repeat(3, 1fr); }
.v2-fields-grid--3 .v2-field:nth-child(2n) { border-right: var(--v2-rule); }
.v2-fields-grid--3 .v2-field:nth-child(3n) { border-right: none; }
.v2-fields-grid--3 .v2-field:nth-last-child(-n+3) { border-bottom: none; }
/* 5-in-a-3-grid: the trailing row has two cells + an empty slot that reads as
   a dangling box. --span5 makes the 4th and 5th cells each take 1.5 columns so
   the last row fills the width evenly, no empty cell. */
.v2-fields-grid--3.v2-fields-grid--span5 .v2-field:nth-child(4),
.v2-fields-grid--3.v2-fields-grid--span5 .v2-field:nth-child(5) { grid-column: span 3; }
.v2-fields-grid--3.v2-fields-grid--span5 { grid-template-columns: repeat(6, 1fr); }
.v2-fields-grid--3.v2-fields-grid--span5 .v2-field:nth-child(-n+3) { grid-column: span 2; }
.v2-fields-grid--3.v2-fields-grid--span5 .v2-field:nth-child(4),
.v2-fields-grid--3.v2-fields-grid--span5 .v2-field:nth-child(5) { grid-column: span 3; }
.v2-fields-grid--3.v2-fields-grid--span5 .v2-field:nth-child(3) { border-right: none; }
.v2-fields-grid--3.v2-fields-grid--span5 .v2-field:nth-child(4) { border-right: var(--v2-rule); }
.v2-fields-grid--3.v2-fields-grid--span5 .v2-field:nth-child(5) { border-right: none; }
.v2-fields-grid--3.v2-fields-grid--span5 .v2-field:nth-last-child(-n+2) { border-bottom: none; }
.v2-fields-grid--3.v2-fields-grid--span5 .v2-field:nth-child(3) { border-bottom: var(--v2-rule); }
@media (max-width: 860px) {
  .v2-fields-grid--3 { grid-template-columns: 1fr; }
  .v2-fields-grid--3 .v2-field { border-right: none !important; border-bottom: var(--v2-rule) !important; }
  .v2-fields-grid--3 .v2-field:last-child { border-bottom: none !important; }
}

/* Privacy face-off: two sides, symmetric weight */
.v2-privacy-compare {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  border: var(--v2-rule);
  border-radius: var(--rs-radius-md);
  overflow: hidden;
  margin-bottom: var(--rs-space-6);
}
.v2-privacy-side {
  padding: clamp(28px, 3.5vw, 44px);
  background: var(--rs-bg-surface);
}
.v2-privacy-side--them { border-right: var(--v2-rule); }
.v2-privacy-side--us { background: var(--rs-ink-a06); }
.v2-privacy-side p {
  margin-top: var(--rs-space-3);
  font-size: var(--rs-text-sm);
  line-height: var(--rs-leading-relaxed);
  color: var(--rs-fg-secondary);
}
.v2-privacy-num {
  font-family: var(--rs-font-display);
  font-weight: var(--rs-weight-semibold);
  font-size: clamp(40px, 6vw, 60px);
  letter-spacing: var(--rs-tracking-snug);
  line-height: 1;
  color: var(--rs-fg-primary);
  margin-top: var(--rs-space-4);
}
.v2-privacy-num--danger { color: var(--rs-danger-600); }
.v2-privacy-unit {
  font-size: var(--rs-text-sm);
  color: var(--rs-fg-tertiary);
  margin-top: var(--rs-space-2);
}
@media (max-width: 700px) {
  .v2-privacy-compare { grid-template-columns: 1fr; }
  .v2-privacy-side--them { border-right: none; border-bottom: var(--v2-rule); }
}

/* ============================================================
   HOMEPAGE tweaks — 4-up fields, reject cards, audience question,
   countries in one row, Phosphor glyphs in field icons
   ============================================================ */

/* Phosphor <i> inside the round field-icon tile */
.v2-field-icon i { font-size: 26px; line-height: 1; }

/* Four fields in a single row */
.v2-fields-grid--4 { grid-template-columns: repeat(4, 1fr); }
.v2-fields-grid--4 .v2-field:nth-child(2n) { border-right: var(--v2-rule); }
.v2-fields-grid--4 .v2-field:nth-child(4n) { border-right: none; }
.v2-fields-grid--4 .v2-field:nth-last-child(-n+4) { border-bottom: none; }
@media (max-width: 980px) {
  .v2-fields-grid--4 { grid-template-columns: repeat(2, 1fr); }
  .v2-fields-grid--4 .v2-field:nth-child(2n) { border-right: none; }
  .v2-fields-grid--4 .v2-field:nth-child(odd) { border-right: var(--v2-rule); }
  .v2-fields-grid--4 .v2-field:nth-last-child(-n+2) { border-bottom: none; }
}
@media (max-width: 560px) {
  .v2-fields-grid--4 { grid-template-columns: 1fr; }
  .v2-fields-grid--4 .v2-field { border-right: none !important; border-bottom: var(--v2-rule) !important; }
  .v2-fields-grid--4 .v2-field:last-child { border-bottom: none !important; }
}

/* Reject as a 3+3 card grid (replaces the row list) */
.v2-reject-grid {
  list-style: none; margin: 0; padding: 0;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border: var(--v2-rule);
  border-radius: var(--rs-radius-md);
  overflow: hidden;
}
.v2-reject-card {
  position: relative;
  padding: clamp(24px, 3vw, 36px);
  background: var(--rs-bg-surface);
  border-right: var(--v2-rule);
  border-bottom: var(--v2-rule);
  transition: background-color var(--rs-duration-base) var(--rs-ease-standard);
}
.v2-reject-card:nth-child(3n) { border-right: none; }
.v2-reject-card:nth-last-child(-n+3) { border-bottom: none; }
.v2-reject-card:hover { background: var(--rs-neutral-25); }
.v2-reject-card .v2-reject-mark {
  display: inline-block;
  font-family: var(--rs-font-mono);
  font-size: 10.5px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--rs-danger-600);
  text-decoration: line-through;
  margin-bottom: var(--rs-space-3);
}
.v2-reject-card .v2-reject-name {
  font-family: var(--rs-font-display);
  font-weight: var(--rs-weight-semibold);
  font-size: var(--rs-text-lg);
  color: var(--rs-fg-primary);
  margin: 0 0 var(--rs-space-2);
  text-decoration: line-through;
  text-decoration-color: var(--rs-neutral-300);
}
.v2-reject-card .v2-reject-why {
  font-size: var(--rs-text-sm);
  line-height: var(--rs-leading-relaxed);
  color: var(--rs-fg-secondary);
  margin: 0;
}
@media (max-width: 860px) { .v2-reject-grid { grid-template-columns: repeat(2, 1fr); }
  .v2-reject-card:nth-child(3n) { border-right: var(--v2-rule); }
  .v2-reject-card:nth-child(2n) { border-right: none; }
}
@media (max-width: 560px) { .v2-reject-grid { grid-template-columns: 1fr; }
  .v2-reject-card { border-right: none !important; }
}

/* Audience: the day-184 question as a graphic element */
.v2-audience-question {
  display: flex;
  align-items: center;
  gap: clamp(20px, 4vw, 44px);
  margin-bottom: clamp(40px, 5vw, 64px);
  padding-bottom: clamp(28px, 4vw, 44px);
  border-bottom: var(--v2-rule);
}
.v2-audience-daynum {
  font-family: var(--rs-font-display);
  font-weight: var(--rs-weight-semibold);
  font-size: clamp(64px, 12vw, 140px);
  line-height: 0.9;
  letter-spacing: var(--rs-tracking-tight);
  color: var(--rs-ink-a15);
  flex-shrink: 0;
}
.v2-audience-q {
  font-family: var(--rs-font-display);
  font-weight: var(--rs-weight-semibold);
  font-size: clamp(22px, 3vw, 34px);
  line-height: 1.2;
  letter-spacing: var(--rs-tracking-snug);
  color: var(--rs-fg-primary);
  text-wrap: balance;
}
@media (max-width: 560px) {
  .v2-audience-question { flex-direction: column; align-items: flex-start; gap: var(--rs-space-3); }
}

/* Countries: fit as many per row as the width allows (one row on wide) */
.v2-country-grid { grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); }

/* ============================================================
   COUNTRY GUIDE — v2 components (hero photo, quick facts,
   location map, tables, sources). Shared across all /country/*.
   ============================================================ */

/* Alternating section background (pairs with .v2-fields default surface) */
.v2-fields--alt { background: var(--rs-bg-canvas); }
.v2-defensible.v2-fields--alt,
.v2-faq.v2-fields--alt { background: var(--rs-bg-canvas); }

/* Odd-count grids: when the last row is incomplete (e.g. 5 in a 3-col grid),
   the trailing cell's dangling border reads as an empty box. Drop the
   right border on the true last child so the gap doesn't frame emptiness. */
.v2-fields-grid--3 .v2-field:last-child:nth-child(3n-2) { border-right: none; }

/* Hero: photo sits in the midnight hero beside the text. The hero keeps
   extra bottom padding so the quick-facts strip can overlap into it. */
.v2-country-hero { padding-bottom: clamp(96px, 12vw, 148px); }
.v2-country-updated {
  font-family: var(--rs-font-mono);
  font-size: var(--rs-text-xs);
  letter-spacing: 0.04em;
  color: var(--rs-white-70);
  margin: calc(-1 * var(--rs-space-2)) 0 var(--rs-space-4);
}
.v2-country-shot {
  border-radius: var(--rs-radius-lg);
  overflow: hidden;
  box-shadow: var(--rs-shadow-lg, 0 12px 32px rgba(11,14,32,0.28));
}
.v2-country-shot img { width: 100%; height: auto; display: block; }

/* Quick facts: card strip lifted up to overlap the bottom of the hero */
.v2-quickfacts {
  position: relative;
  z-index: 2;
  margin-top: clamp(-72px, -8vw, -110px);
  padding: 0 var(--v2-gutter) clamp(32px, 4vw, 56px);
}
.v2-quickfacts-inner {
  max-width: var(--rs-content-wide);
  margin-inline: auto;
  background: var(--rs-bg-surface);
  border: var(--v2-rule);
  border-radius: var(--rs-radius-lg);
  box-shadow: var(--rs-shadow-lg, 0 12px 32px rgba(11,14,32,0.10));
  padding: clamp(24px, 3vw, 36px);
}
.v2-quickfacts-label {
  font-family: var(--rs-font-mono);
  font-size: var(--rs-text-xs);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--rs-fg-tertiary);
  margin-bottom: var(--rs-space-5);
}
.v2-quickfacts-grid {
  list-style: none; margin: 0; padding: 0;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(16px, 2vw, 28px);
}
.v2-quickfact {
  display: grid;
  grid-template-columns: auto 1fr;
  grid-template-rows: auto auto;
  column-gap: var(--rs-space-3);
  row-gap: 2px;
  align-items: center;
}
.v2-quickfact-icon {
  grid-row: 1 / 3;
  display: grid; place-items: center;
  width: 42px; height: 42px;
  border-radius: var(--rs-radius-md);
  background: var(--rs-ink-a06);
  color: var(--rs-ink-600);
  font-size: 21px;
}
.v2-quickfact-label {
  font-size: var(--rs-text-xs);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--rs-fg-tertiary);
}
.v2-quickfact-value {
  font-family: var(--rs-font-display);
  font-weight: var(--rs-weight-semibold);
  font-size: clamp(15px, 1.5vw, 17px);
  color: var(--rs-fg-primary);
  line-height: 1.25;
}
.v2-quickfact-value small { font-weight: 400; font-size: 0.82em; color: var(--rs-fg-secondary); }

/* Location map: centered, framed in the brand tokens */
.v2-locmap {
  max-width: 560px;
  margin: 0 auto clamp(40px, 5vw, 64px);
  padding: clamp(20px, 3vw, 32px);
  background: var(--rs-bg-surface);
  border: var(--v2-rule);
  border-radius: var(--rs-radius-lg);
}
.v2-locmap svg { width: 100%; height: auto; display: block; }

/* Tax-rates prose spacing: keep the comparison bar clear of adjacent prose */
.v2-prose + .tax-compare,
.tax-compare + .v2-prose { margin-top: clamp(36px, 4.5vw, 56px); }

/* ---- Proof-of-record diagram: "what they see" vs "what you prove" ---- */
.v2-por {
  position: relative;
  background: var(--rs-midnight-900);
  color: var(--rs-fg-inverse);
  padding: clamp(80px, 10vw, 128px) 0;
  overflow: hidden;
}
.v2-por--net .v2-wrap { position: relative; z-index: 1; }
.v2-por-head { max-width: 60ch; margin: 0 auto clamp(40px, 5vw, 64px); text-align: center; }
.v2-privacy-lead-inv {
  font-size: clamp(17px, 1.6vw, 20px);
  line-height: 1.55;
  color: var(--rs-white-85);
  margin-top: var(--rs-space-4);
}
.v2-privacy-lead-inv em { color: var(--rs-ink-200); font-style: italic; }
.v2-por-grid {
  position: relative;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: clamp(20px, 3vw, 40px);
  align-items: stretch;
  max-width: var(--rs-content-default);
  margin-inline: auto;
}
.v2-por-col {
  background: var(--rs-white-04);
  border: 1px solid var(--rs-white-08);
  border-radius: var(--rs-radius-lg);
  padding: clamp(24px, 3vw, 36px);
}
.v2-por-col--you { background: var(--rs-ink-a15, rgba(46,84,224,0.15)); border-color: var(--rs-ink-a30); }
.v2-por-col-label {
  display: flex; align-items: center; gap: var(--rs-space-2);
  font-family: var(--rs-font-mono);
  font-size: var(--rs-text-xs);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--rs-white-70);
  margin-bottom: var(--rs-space-5);
}
.v2-por-col--you .v2-por-col-label { color: var(--rs-ink-200); }
.v2-por-col-label i { font-size: 18px; }
.v2-por-list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--rs-space-4); }
.v2-por-list li {
  font-size: var(--rs-text-sm);
  line-height: 1.55;
  color: var(--rs-white-85);
  padding-top: var(--rs-space-4);
  border-top: 1px solid var(--rs-white-08);
}
.v2-por-list li:first-child { padding-top: 0; border-top: none; }
.v2-por-list strong { color: #fff; font-weight: 600; }
.v2-por-vs {
  align-self: center;
  display: grid; place-items: center;
  width: 44px; height: 44px;
  border-radius: 999px;
  border: 1px solid var(--rs-white-15);
  font-family: var(--rs-font-mono);
  font-size: var(--rs-text-xs);
  color: var(--rs-white-70);
}
.v2-por-pin {
  max-width: 56ch;
  margin: clamp(40px, 5vw, 64px) auto 0;
  text-align: center;
  font-family: var(--rs-font-display);
  font-weight: var(--rs-weight-semibold);
  font-size: clamp(19px, 2.2vw, 26px);
  line-height: 1.3;
  color: #fff;
  text-wrap: balance;
}

/* ---- Horizontal deadline timeline ---- */
.v2-timeline-h {
  list-style: none; margin: 0; padding: 0;
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 1fr;
  gap: 0;
  position: relative;
  border-top: var(--v2-rule);
  margin-top: clamp(8px, 1vw, 16px);
}
.v2-thstep {
  display: flex;
  flex-direction: column;
  gap: var(--rs-space-3);
  padding: clamp(20px, 2.5vw, 28px) clamp(12px, 1.5vw, 20px) 0;
  border-right: var(--v2-rule);
  position: relative;
}
.v2-thstep:last-child { border-right: none; }
.v2-thstep-date {
  font-family: var(--rs-font-mono);
  font-size: var(--rs-text-sm);
  font-weight: 600;
  color: var(--rs-ink-600);
}
.v2-thstep-dot {
  width: 11px; height: 11px;
  border-radius: 999px;
  background: var(--rs-bg-surface);
  border: 2px solid var(--rs-ink-600);
  position: absolute;
  top: -6px; left: clamp(12px, 1.5vw, 20px);
}
.v2-thstep-body {
  font-size: var(--rs-text-sm);
  line-height: 1.5;
  color: var(--rs-fg-secondary);
}

/* ---- Colophon: sources + disclaimer, deliberately quiet ---- */
.v2-colophon { background: var(--rs-bg-canvas); padding: clamp(40px, 5vw, 64px) 0; border-top: var(--v2-rule); }
.v2-colophon-text {
  font-size: var(--rs-text-xs);
  line-height: 1.7;
  color: var(--rs-fg-tertiary);
  margin: 0 0 var(--rs-space-3);
}
.v2-colophon-text strong { color: var(--rs-fg-secondary); font-weight: 600; }
.v2-colophon-text a { color: var(--rs-fg-secondary); text-decoration: underline; text-underline-offset: 2px; }
.v2-colophon-text a:hover { color: var(--rs-ink-600); }

@media (max-width: 860px) {
  .v2-por-grid { grid-template-columns: 1fr; }
  .v2-por-vs { transform: rotate(90deg); }
  .v2-timeline-h { grid-auto-flow: row; grid-auto-columns: auto; border-top: none; }
  .v2-thstep {
    border-right: none;
    border-left: var(--v2-rule);
    padding: 0 0 clamp(20px, 3vw, 28px) clamp(20px, 3vw, 28px);
    flex-direction: row; align-items: baseline; gap: var(--rs-space-4);
  }
  .v2-thstep:last-child { padding-bottom: 0; }
  .v2-thstep-dot { top: 4px; left: -6px; }
  .v2-thstep-date { min-width: 5.5rem; flex-shrink: 0; }
  /* let the body wrap/shrink inside the flex row instead of overflowing */
  .v2-thstep-body { min-width: 0; flex: 1; }
}

@media (max-width: 767px) {
  .v2-quickfacts-grid { grid-template-columns: 1fr; gap: var(--rs-space-5); }
}

/* visually-hidden text for screen readers */
.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;
}


/* ============================================================
   LANDING /lp/ — conversion aids shared across country pages
   (hero pills, mid download band, price band Pack-Start-first,
   desktop QR, mobile sticky CTA coordinated with cookie banner).
   Moved here jul-2026 from per-page inline <style> to avoid
   duplicating the same CSS across every /lp/ landing.
   ============================================================ */
/* South Africa LP — conversion aids + grafted price band, on shared.css tokens.
   No new colours, no side-stripes, no gradients beyond the token set. */

/* ---- HERO actions (one primary CTA + store pills + fine print) ---- */
.sa-hero-actions { flex-wrap: wrap; gap: var(--rs-space-3); align-items: center; }
.sa-hero-cta { display: inline-flex; align-items: center; gap: var(--rs-space-2); }
.sa-store-pill {
  display: inline-flex; align-items: center; gap: var(--rs-space-2);
  background: var(--rs-midnight-800);
  border: 1px solid var(--rs-white-08);
  border-radius: var(--rs-radius-md);
  padding: 9px 15px;
  color: #fff; font-family: var(--rs-font-display);
  font-size: 14px; font-weight: var(--rs-weight-bold);
}
.sa-store-pill i { font-size: 20px; }
.sa-store-pill:hover { border-color: var(--rs-white-25, rgba(255,255,255,.25)); color: #fff; }
.sa-hero-fine {
  font-family: var(--rs-font-mono); font-size: 12px;
  color: var(--rs-white-60); margin: var(--rs-space-4) 0 0;
}

/* ---- MID-PAGE DOWNLOAD BAND ---- */
.sa-dlband {
  background: var(--rs-bg-surface);
  border-block: 1px solid var(--rs-border-default);
  padding: clamp(44px, 6vw, 72px) 0;
  text-align: center;
}
.sa-dlband-title {
  font-family: var(--rs-font-display);
  font-weight: var(--rs-weight-semibold);
  font-size: clamp(20px, 2.4vw, 26px);
  letter-spacing: var(--rs-tracking-snug);
  color: var(--rs-fg-primary);
  margin: 0 auto var(--rs-space-6);
  max-width: 28rem;
  text-wrap: balance;
}
.sa-dlband .v2-final-badges { display: flex; justify-content: center; gap: var(--rs-space-4); flex-wrap: wrap; }
.sa-dlband .v2-final-badges img { height: 48px; width: auto; }

/* ---- PRICE BAND (grafted from the redesign) ---- */
.sa-price { background: var(--rs-bg-surface); padding: clamp(48px, 7vw, 72px) 0; }
.sa-price-grid { display: grid; grid-template-columns: 1.15fr 1fr 1fr; gap: 14px; align-items: stretch; }
.sa-plan { background: var(--rs-bg-surface); border: 1px solid var(--rs-border-default); border-radius: var(--rs-radius-xl); padding: 26px; display: flex; flex-direction: column; }
.sa-plan--start { background: var(--rs-ink-50); border: 1.5px solid var(--rs-ink-400); }
.sa-plan-head { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; flex-wrap: wrap; }
.sa-plan-name { font-family: var(--rs-font-mono); font-size: 11px; font-weight: var(--rs-weight-semibold); letter-spacing: 0.14em; text-transform: uppercase; color: var(--rs-ink-600); }
.sa-plan:not(.sa-plan--start) .sa-plan-name { color: var(--rs-fg-secondary); display: block; margin-bottom: 10px; }
.sa-plan-badge { background: var(--rs-ink-600); color: #fff; font-family: var(--rs-font-mono); font-size: 9px; font-weight: var(--rs-weight-bold); letter-spacing: .06em; text-transform: uppercase; border-radius: var(--rs-radius-pill); padding: 3px 8px; }
.sa-plan-price { display: flex; align-items: baseline; gap: 6px; margin-bottom: 4px; }
.sa-plan-amt { font-family: var(--rs-font-display); font-weight: var(--rs-weight-black); font-size: 36px; color: var(--rs-midnight-900); letter-spacing: var(--rs-tracking-tight); }
.sa-plan-amt--sm { font-size: 32px; }
.sa-plan-per { font-size: 14px; color: var(--rs-fg-secondary); }
.sa-plan-note { font-family: var(--rs-font-mono); font-size: 11px; color: var(--rs-ink-600); margin: 0 0 10px; }
.sa-plan-desc { font-size: 14px; line-height: 1.55; color: var(--rs-fg-secondary); margin: 0 0 18px; }
.sa-plan-cta { margin-top: auto; text-align: center; }
.sa-plan-link { margin-top: auto; display: block; text-align: center; font-size: 14px; font-weight: var(--rs-weight-semibold); color: var(--rs-ink-600); padding: 12px; }
.sa-price-foot { font-size: 13px; line-height: 1.6; color: var(--rs-fg-tertiary); margin: 22px 0 0; max-width: 70ch; }

/* ---- QR (desktop bridge) ---- */
.sa-qr { display: none; }
@media (min-width: 901px) {
  .sa-qr { display: inline-flex; align-items: center; gap: var(--rs-space-4); margin-top: var(--rs-space-6); padding: var(--rs-space-4) var(--rs-space-5); background: var(--rs-white-10); border: 1px solid var(--rs-white-25, rgba(255,255,255,.25)); border-radius: var(--rs-radius-md); max-width: 30rem; text-align: left; }
  .sa-qr img { width: 92px; height: 92px; border-radius: var(--rs-radius-xs); background: #fff; padding: 4px; flex-shrink: 0; }
  .sa-qr span { color: var(--rs-white-85); font-size: 14px; line-height: 1.35; }
}

/* ---- STICKY BAR: mobile only, coordinated with the cookie banner ---- */
.sa-ctabar { display: none; }
@media (max-width: 900px) {
  .sa-ctabar {
    display: flex; align-items: center; justify-content: space-between;
    gap: var(--rs-space-4);
    position: fixed; left: 0; right: 0; bottom: 0;
    z-index: var(--rs-z-nav);
    padding: 10px 16px calc(10px + env(safe-area-inset-bottom));
    background: var(--rs-midnight-950);
    border-top: 1px solid var(--rs-ink-a25, rgba(30,64,175,.25));
  }
  .sa-ctabar-text { color: var(--rs-white-85); font-size: 14px; font-weight: var(--rs-weight-semibold); line-height: 1.2; }
  .sa-ctabar-btn { flex-shrink: 0; padding: 10px 22px; }

  /* price band → single column on phones, Pack Start on top.
     min-width:0 stops the grid track from overflowing the wrap's side
     padding, which was pushing the cards flush to the screen edge. */
  .sa-price-grid { grid-template-columns: minmax(0, 1fr); }
  .sa-plan { min-width: 0; }
  .sa-plan:not(.sa-plan--start) { display: grid; grid-template-columns: auto 1fr; grid-auto-rows: min-content; column-gap: 12px; align-items: baseline; }
  .sa-plan:not(.sa-plan--start) .sa-plan-desc { grid-column: 1 / -1; }
  .sa-plan:not(.sa-plan--start) .sa-plan-link { grid-column: 1 / -1; }
}

/* Hide the sticky bar while the cookie banner is open: it used to sit UNDER
   the banner (z 1000 vs 9999) → 0 clicks, and it must not obstruct consent.
   Isolated in @supports so browsers without :has() ignore ONLY this rule and
   never drop the price-band rules that used to follow it inside the media query. */
@supports selector(:has(*)) {
  @media (max-width: 900px) {
    body:has(#cb-banner.cb-show) .sa-ctabar { display: none; }
  }
}