/* =============================================================================
   Round 3 preview, film version: the home page (/).
   Port of Home.dc.html from the Claude Design project (the revision that parks
   the film and setup sections). Tokens and shared components live in
   r3film.css.
   ============================================================================= */

.rf-home-vh {
  position: absolute; width: 1px; height: 1px; overflow: hidden;
  clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap;
}

/* ---- Shared pieces ------------------------------------------------------------ */
.rf-home-stack { display: flex; flex-direction: column; gap: clamp(36px, 5vw, 56px); }
.rf-home-stack--tight { gap: clamp(32px, 4vw, 48px); }
.rf-home-stack--wide { gap: clamp(48px, 6vw, 80px); }
.rf-home-intro { display: flex; flex-direction: column; gap: 16px; max-width: 760px; }
.rf-home-intro--plans { max-width: 820px; }
.rf-home-intro--remember { gap: 18px; }
.rf-home-intro--remember .rf-home-sub { max-width: 40ch; }
.rf-home-intro--day { gap: 14px; }

.rf-home-h2 {
  font-weight: 700;
  font-size: clamp(36px, 5vw, 60px);
  line-height: 1.05;
  letter-spacing: -0.02em;
  text-wrap: balance;
}
.rf-home-h2--deep { color: var(--blueberry-deep); }
.rf-home-h2--mid { font-size: clamp(34px, 4.6vw, 56px); }
.rf-home-h2--narrow { font-size: clamp(34px, 4.6vw, 56px); max-width: 18ch; }
.rf-home-h2--big { font-size: clamp(40px, 6vw, 72px); line-height: 1.02; letter-spacing: -0.025em; }
.rf-home-h2-sm { font-weight: 700; font-size: clamp(30px, 3.6vw, 42px); line-height: 1.08; text-wrap: balance; }
.rf-home-sub { font-size: clamp(19px, 1.6vw, 22px); max-width: 44ch; text-wrap: pretty; }

.rf-home-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.rf-home-actions .rf-btn { line-height: 1.55; }
.rf-home-more { font-family: var(--font-head); font-weight: 600; font-size: 19px; align-self: flex-start; }
.rf-home-more--sm { font-size: 18px; }

/* Polaroid prints and gingham tape */
.rf-home-print {
  margin: 0;
  position: relative;
  background: var(--paper);
  color: var(--ink);
  padding: 12px 12px 18px;
  box-shadow: 0 1px 2px rgba(36, 48, 71, .08), 0 14px 30px rgba(36, 48, 71, .12);
}
.rf-home-img-4x3 { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.rf-home-tape {
  position: absolute;
  height: 26px;
  width: 88px;
  background-color: rgba(250, 245, 238, .88);
  background-image: linear-gradient(90deg, rgba(86, 96, 190, .42) 50%, transparent 50%),
                    linear-gradient(rgba(86, 96, 190, .42) 50%, transparent 50%);
  background-size: 10px 10px;
}
.rf-home-tape--c { top: -12px; left: 50%; margin-left: -44px; transform: rotate(-3deg); }
.rf-home-tape--tilt { transform: rotate(4deg); }
.rf-home-tape--m5 { transform: rotate(-5deg); }
.rf-home-tape--p2 { transform: rotate(2deg); }
.rf-home-tape--p3 { transform: rotate(3deg); }
.rf-home-tape--product { width: 96px; margin-left: -48px; transform: rotate(-2deg); }
.rf-home-tape--m4 { transform: rotate(-4deg); }

.rf-home-cap { padding: 14px 4px 0; font-size: 18px; line-height: 1.55; }
.rf-home-cap--hero {
  display: flex; flex-wrap: wrap; gap: 10px;
  align-items: center; justify-content: center;
  line-height: 1.35;
}
.rf-home-cap--col { display: flex; flex-direction: column; gap: 2px; line-height: 1.4; }
.rf-home-cap--product { padding: 6px 4px 0; font-size: 17px; }
/* Each caption opens with a bold phrase (Design). */
.rf-home-lead-in { font-family: var(--font-head); font-weight: 600; color: var(--blueberry-deep); }

/* Small raspberry hearts */
.rf-home-heart { flex: none; color: var(--raspberry-deep); }
.rf-home-heart--cap { transform: rotate(-8deg); }

.rf-home-tilt-a { transform: rotate(-1.5deg); }
.rf-home-tilt-b { transform: rotate(1.2deg); }
.rf-home-tilt-c { transform: rotate(-0.8deg); }
.rf-home-tilt-d { transform: rotate(1.8deg); }
.rf-home-tilt-e { transform: rotate(1.6deg); }
.rf-home-tilt-f { transform: rotate(-2deg); }

/* ---- Hero ------------------------------------------------------------------------ */
.rf-home-hero {
  padding-inline: var(--gutter);
  padding-block: clamp(40px, 7vw, 96px) clamp(56px, 8vw, 112px);
}
.rf-home-hero__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 460px), 1fr));
  gap: clamp(40px, 6vw, 80px);
  align-items: center;
}
.rf-home-hero__copy { display: flex; flex-direction: column; gap: 24px; }
.rf-home-hero__title {
  font-weight: 700;
  font-size: clamp(44px, 6.4vw, 80px);
  line-height: 1.02;
  letter-spacing: -0.025em;
  color: var(--ink);
  text-wrap: balance;
}
.rf-home-hero__accent { color: var(--blueberry); }
.rf-home-hero__lead { font-size: clamp(20px, 2vw, 24px); line-height: 1.45; max-width: 30ch; text-wrap: pretty; }
.rf-home-checks { list-style: none; margin: 4px 0 8px; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.rf-home-checks li { display: flex; gap: 12px; align-items: flex-start; }
.rf-home-checks__tick {
  flex: none; width: 28px; height: 28px; margin-top: 1px; border-radius: 50%;
  background: var(--sage); color: var(--ink);
  display: flex; align-items: center; justify-content: center;
}
.rf-home-hero .rf-btn { min-height: 52px; padding-inline: 28px; }
.rf-home-hero .rf-btn--outline { padding-inline: 24px; }

.rf-home-hero__prints {
  position: relative;
  width: 100%; max-width: 640px; justify-self: center;
  padding-block: 28px 12px;
  padding-inline: clamp(8px, 3vw, 36px);
}
.rf-home-print--hero {
  padding: 14px 14px 18px;
  transform: rotate(1.6deg);
  z-index: 1;
  box-shadow: 0 1px 2px rgba(36, 48, 71, .08), 0 18px 40px rgba(36, 48, 71, .14);
}
/* Square crop of the 2:1 hero photo, held on the child (Design). */
.rf-home-img-hero { width: 100%; aspect-ratio: 1 / 1; object-fit: cover; object-position: 56% 50%; }
.rf-home-hero__stars {
  position: absolute; top: -6px; right: -4px; z-index: 4;
  width: clamp(84px, 10vw, 132px); height: auto;
  transform: rotate(8deg);
  pointer-events: none;
}
.rf-home-bubble {
  position: absolute; left: 0; top: clamp(56px, 7vw, 84px); z-index: 4;
  margin: 0;
  display: flex; flex-direction: column; align-items: flex-start;
  transform: rotate(-4deg);
}
.rf-home-bubble__text {
  background: var(--raspberry);
  color: var(--ink);
  font-family: var(--font-head); font-weight: 600;
  font-size: clamp(18px, 1.8vw, 23px); line-height: 1.2;
  padding: 12px 20px;
  border-radius: 22px;
  box-shadow: 0 6px 16px rgba(36, 48, 71, .18);
}
.rf-home-bubble__tail {
  width: 18px; height: 18px;
  margin: -10px 0 0 30px;
  background: var(--raspberry);
  transform: rotate(45deg);
}
.rf-home-heart--float {
  position: absolute; z-index: 4;
  left: clamp(-4px, 1vw, 14px); bottom: 22%;
  transform: rotate(12deg);
}

/* ---- Remember ---------------------------------------------------------------------- */
.rf-home-notes {
  list-style: none; margin: 0;
  display: grid;
  gap: clamp(20px, 3vw, 32px);
  padding-block: 8px; padding-inline: 4px;
}
.rf-home-note {
  position: relative;
  min-height: 170px;
  padding: 34px 24px 28px;
  color: var(--ink);
  font-family: var(--font-head); font-weight: 600; font-size: 24px; line-height: 1.2;
  text-wrap: balance;
  box-shadow: 0 12px 24px rgba(20, 24, 70, .28);
}
.rf-home-note::before {
  content: "";
  position: absolute; top: 10px; left: 50%; margin-left: -8px;
  width: 16px; height: 16px; border-radius: 50%;
  background: var(--raspberry-deep);
  box-shadow: 0 2px 3px rgba(0, 0, 0, .3);
}
.rf-home-note--petal { background: var(--petal); transform: rotate(-2deg); }
.rf-home-note--sun { background: var(--sunshine); transform: rotate(1.5deg); }
.rf-home-note--cloud { background: var(--cloud); transform: rotate(-1deg); }
.rf-home-note--oat { background: var(--oat); transform: rotate(2deg); }
.rf-home-note--sage { background: var(--sage); transform: rotate(2deg); }
.rf-home-note--sun::before,
.rf-home-note--oat::before,
.rf-home-note--sage::before { background: var(--blueberry-deep); }

/* ---- A day ---------------------------------------------------------------------------- */
.rf-home-kidline {
  font-family: var(--font-head); font-weight: 600;
  font-size: clamp(22px, 2.2vw, 28px); line-height: 1.2;
  color: var(--raspberry-deep);
}
/* The kid's line is the section heading now, in a Raspberry speech bubble
   (Design, RULING-jessica-review-of-r3-v3-2026-09-28: "A day with
   Smalltalk" is removed and the quote carries the section). */
/* Canvas 2026-09-29: the bubble hugs its text on two lines and leans a little,
   instead of stretching across the intro on one line. */
.rf-home-kidbubble { align-self: flex-start; display: flex; flex-direction: column; align-items: flex-start; transform: rotate(-2deg); margin-bottom: 6px; }
.rf-home-kidbubble__text {
  margin: 0; background: var(--raspberry); color: var(--ink);
  font-family: var(--font-head); font-weight: 700;
  font-size: clamp(30px, 3.8vw, 46px); line-height: 1.1; letter-spacing: -0.02em;
  padding-block: 16px; padding-inline: 26px; border-radius: 20px;
  box-shadow: 0 6px 16px rgba(36, 48, 71, .18);
  width: fit-content; max-width: 100%; box-sizing: border-box;
}
.rf-home-kidbubble__tail { width: 20px; height: 20px; background: var(--raspberry); transform: rotate(45deg); margin: -11px 0 0 36px; }
.rf-home-day {
  display: grid;
  gap: clamp(28px, 3vw, 40px) clamp(20px, 2.4vw, 32px);
  align-items: start;
}
.rf-home-drop { margin-top: 18px; }
/* The village opens the day section (RULING-village-on-home-and-how-it-works-2026-10-20, V1). */
.rf-home-village {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr));
  gap: clamp(36px, 6vw, 80px);
  align-items: center;
  padding-bottom: clamp(24px, 5vw, 72px);
  scroll-margin-top: 80px;
}
.rf-home-village__copy { display: flex; flex-direction: column; gap: 18px; }
.rf-home-village__lead { max-width: 40ch; }
.rf-home-village__gate { max-width: 44ch; text-wrap: pretty; }
.rf-home-village__link { font-family: var(--font-head); font-weight: 600; font-size: 19px; align-self: flex-start; }
/* ---- What smalltalk sounds like ---------------------------------------------------- */
.rf-home-sounds {
  padding-inline: clamp(16px, 3vw, 40px);
  padding-block: 0 clamp(56px, 7vw, 96px);
}
.rf-home-sounds__panel {
  max-width: 1320px; margin: 0 auto;
  background: var(--blueberry); color: var(--oat);
  border-radius: clamp(24px, 3vw, 40px);
  padding-block: clamp(48px, 6vw, 88px);
  padding-inline: clamp(20px, 4vw, 64px);
  display: flex; flex-direction: column; align-items: center;
  gap: clamp(28px, 3.4vw, 44px);
}
.rf-home-sounds__title {
  font-weight: 700; font-size: clamp(32px, 4vw, 48px); line-height: 1.1; letter-spacing: -0.02em;
  text-align: center; text-wrap: balance;
}
.rf-home-sounds__list {
  list-style: none; margin: 0; padding: 0;
  display: flex; flex-wrap: wrap; justify-content: center;
  gap: 22px 18px;
  max-width: 960px;
}
.rf-home-says {
  position: relative;
  background: var(--rf-home-says-bg);
  color: var(--ink);
  font-family: var(--font-head); font-weight: 500;
  font-size: clamp(18px, 1.6vw, 21px); line-height: 1.25;
  padding: 12px 22px;
  border-radius: 16px;
  box-shadow: 0 6px 14px rgba(20, 24, 70, .22);
}
.rf-home-says::after {
  content: "";
  position: absolute; bottom: -6px;
  width: 14px; height: 14px;
  background: var(--rf-home-says-bg);
  transform: rotate(45deg);
}
.rf-home-says--l::after { left: 22px; }
.rf-home-says--r::after { right: 22px; }
.rf-home-says--cloud { --rf-home-says-bg: var(--cloud); }
.rf-home-says--sun { --rf-home-says-bg: var(--sunshine); }
.rf-home-says--petal { --rf-home-says-bg: var(--petal); }
.rf-home-says--oat { --rf-home-says-bg: var(--oat); }
.rf-home-says--sage { --rf-home-says-bg: var(--sage); }
.rf-home-says--n15 { transform: rotate(-1.5deg); }
.rf-home-says--n12 { transform: rotate(-1.2deg); }
.rf-home-says--n10 { transform: rotate(-1deg); }
.rf-home-says--n08 { transform: rotate(-0.8deg); }
.rf-home-says--p08 { transform: rotate(0.8deg); }
.rf-home-says--p10 { transform: rotate(1deg); }
.rf-home-says--p12 { transform: rotate(1.2deg); }
.rf-home-says--p14 { transform: rotate(1.4deg); }

/* ---- Pillars ----------------------------------------------------------------------------- */
.rf-home-pillars { padding-block: clamp(56px, 8vw, 104px); }
.rf-home-pillars__grid { display: grid; gap: 20px; }
/* Four-item rows go 1 / 2 / 4, never 3 + 1: auto-fit left the fourth note,
   photo or pillar alone on a second row at windows of about 830-1160px
   (iPad landscape, small laptops). Design, BRIEF-four-item-rows-2026-10-04,
   ruling DESIGN-REPLY-mobile-wraps-and-type-2026-10-04 section 2. */
.rf-home-notes, .rf-home-day, .rf-home-pillars__grid { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 540px)  { .rf-home-notes, .rf-home-day, .rf-home-pillars__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1080px) { .rf-home-notes, .rf-home-day, .rf-home-pillars__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.rf-home-pillar { background: var(--oat); border-radius: 20px; padding: 28px 26px; display: flex; flex-direction: column; gap: 8px; }
.rf-home-pillar h3 { font-weight: 600; font-size: 24px; line-height: 1.2; }

/* ---- The phone ------------------------------------------------------------------------------ */
.rf-home-phone {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr));
  gap: clamp(36px, 6vw, 80px);
  align-items: center;
}
.rf-home-print--product {
  background: #FFFFFF; /* the product photo's own ground is white (Design) */
  padding: 16px 16px 20px;
  transform: rotate(-1.2deg);
  max-width: 520px; width: 100%; justify-self: center;
  box-shadow: 0 1px 2px rgba(36, 48, 71, .08), 0 18px 40px rgba(36, 48, 71, .12);
}
.rf-home-print--product img { width: 100%; }
.rf-home-phone__copy { display: flex; flex-direction: column; gap: 24px; }
.rf-home-facts { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 18px; }
.rf-home-facts li { display: flex; flex-direction: column; gap: 2px; }
.rf-home-facts strong { font-family: var(--font-head); font-weight: 600; font-size: 22px; }

.rf-home-number {
  background: var(--petal);
  border-radius: 28px;
  padding: clamp(28px, 4vw, 48px);
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr));
  gap: clamp(24px, 4vw, 56px);
  align-items: center;
  scroll-margin-top: 90px;
}
.rf-home-number__copy { display: flex; flex-direction: column; gap: 10px; }
.rf-home-number__copy p { max-width: 40ch; }
.rf-home-number__form { display: flex; flex-wrap: wrap; gap: 10px 10px; }
.rf-home-number__input {
  flex: 1 1 220px; min-width: 0; height: 60px;
  border-radius: 16px; border: 2px solid var(--ink); background: var(--oat);
  padding-inline: 20px; padding-block: 0;
  font-family: var(--font-head); font-size: 26px; font-weight: 600; letter-spacing: .06em; color: var(--ink);
}
.rf-home-number__input::placeholder { color: rgba(36, 48, 71, .45); }
.rf-home-number__btn { height: 60px; padding-inline: 28px; }
.rf-home-number__result {
  flex: 1 1 100%;
  margin-top: 4px;
  background: var(--oat);
  border-radius: 16px;
  padding: 16px 20px;
  display: flex; flex-direction: column; gap: 10px;
  font-size: 17px;
}
.rf-home-number__result strong { font-family: var(--font-head); font-size: 20px; font-weight: 600; }
.rf-home-number__result .r3-sugs { display: flex; flex-wrap: wrap; gap: 8px; }
.rf-home-number__result .r3-sug {
  min-height: 44px; padding: 8px 16px;
  border: 2px solid var(--blueberry); border-radius: 999px;
  background: transparent; color: var(--blueberry-deep);
  font-family: var(--font-head); font-weight: 600; font-size: 18px; cursor: pointer;
}
.rf-home-number__result .r3-sug:hover { background: var(--cloud); }
.rf-home-number__result .r3-more { font-family: var(--font-head); font-weight: 600; font-size: 18px; color: var(--blueberry-deep); align-self: flex-start; }

/* ---- Plans ------------------------------------------------------------------------------------- */
.rf-home-billing {
  display: flex; gap: 4px; align-self: flex-start;
  background: rgba(36, 48, 71, .28); border-radius: 999px; padding: 5px;
}
.rf-home-billing button {
  height: 48px; padding-inline: 24px; padding-block: 0;
  border: 0; border-radius: 999px;
  background: transparent; color: var(--oat);
  font-family: var(--font-head); font-weight: 600; font-size: 18px; cursor: pointer;
}
.rf-home-billing button[aria-pressed="true"] { background: var(--oat); color: var(--ink); }
.rf-home-plans {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr));
  gap: clamp(20px, 2.6vw, 32px);
}
.rf-home-plan {
  background: var(--oat); color: var(--ink);
  border-radius: 28px;
  padding: clamp(26px, 3vw, 40px);
  display: flex; flex-direction: column; gap: 22px;
}
.rf-home-plan a:not(.rf-btn) { color: var(--blueberry-deep); }
.rf-home-plan__head { display: flex; flex-direction: column; gap: 4px; }
.rf-home-plan__head h3 { font-weight: 700; font-size: 34px; color: var(--ink); margin-bottom: 2px; }
.rf-home-plan__price { font-family: var(--font-head); font-weight: 700; font-size: 48px; line-height: 1; }
.rf-home-plan__per { font-size: 22px; font-weight: 500; }
.rf-home-chip {
  align-self: flex-start;
  margin-top: 6px;
  background: var(--sage); color: var(--ink);
  border-radius: 10px; padding: 6px 12px;
  font-family: var(--font-head); font-weight: 600; font-size: 20px;
}
[data-billing-mode="monthly"] .rf-home-chip { background: var(--oat-deep); }
.rf-home-plan__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.rf-home-plan__list li { display: flex; gap: 12px; }
.rf-home-plan__list svg { flex: none; margin-top: 3px; color: var(--blueberry); }
.rf-home-plan__foot {
  margin-top: auto;
  display: flex; flex-direction: column; gap: 14px;
  border-top: 1px solid var(--rule);
  padding-top: 20px;
}
.rf-home-plan__limit { display: flex; gap: 10px; align-items: flex-start; }
.rf-home-plan__badge {
  flex: none; margin-top: 2px;
  background: var(--cloud); border-radius: 8px; padding: 3px 9px;
  font-family: var(--font-head); font-weight: 700; font-size: 15px; letter-spacing: .02em;
}
.rf-home-plan__btn { min-height: 56px; padding-block: 16px; }
.rf-home-fine {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr));
  gap: 12px 40px;
  font-size: 17px; line-height: 1.5;
}
.rf-home-fine strong { font-family: var(--font-head); font-weight: 600; }
.rf-home-fine a { font-weight: 600; }

/* ---- Promises ------------------------------------------------------------------------------------ */
.rf-home-promises {
  padding-inline: var(--gutter);
  padding-block: var(--section-pad) clamp(40px, 5vw, 64px);
}
.rf-home-split {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr));
  gap: clamp(36px, 6vw, 80px);
  align-items: center;
}
.rf-home-promises__copy { display: flex; flex-direction: column; gap: 28px; }
.rf-home-promise-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 18px; }
.rf-home-promise-list li { display: flex; gap: 14px; }
.rf-home-promise-list svg { flex: none; margin-top: 4px; color: var(--blueberry); }
.rf-home-promise-list strong { font-family: var(--font-head); font-weight: 600; font-size: 21px; }
.rf-home-print--side {
  max-width: 500px; width: 100%; justify-self: center;
  box-shadow: 0 1px 2px rgba(36, 48, 71, .08), 0 18px 40px rgba(36, 48, 71, .12);
}
.rf-home-print--on-blue { max-width: 520px; box-shadow: 0 20px 44px rgba(10, 14, 50, .35); }

/* ---- Emergency calls --------------------------------------------------------------------------------- */
.rf-home-emergency {
  padding-inline: var(--gutter);
  padding-block: 0 var(--section-pad);
}
.rf-home-emergency__card {
  max-width: 820px;
  background: var(--paper);
  border: 2px solid var(--cloud);
  border-radius: 24px;
  padding: clamp(24px, 3.4vw, 40px);
  display: flex; flex-direction: column; gap: 16px;
}
.rf-home-emergency__card p { font-size: 19px; line-height: 1.6; text-wrap: pretty; }
.rf-home-emergency__lead { font-family: var(--font-head); font-weight: 700; }
/* Sized for the four sentences it will hold (Design). */
.rf-home-emergency__held { min-height: 4.8em; background: var(--oat); }

/* ---- Closing -------------------------------------------------------------------------------------------- */
.rf-home-closing { padding-block: clamp(72px, 10vw, 136px); }
.rf-home-closing__copy { display: flex; flex-direction: column; gap: 22px; }
.rf-home-closing .rf-home-h2--big { font-size: clamp(42px, 6.4vw, 80px); }
.rf-home-closing .rf-home-sub { max-width: 40ch; }
.rf-home-closing .rf-btn { min-height: 56px; }
.rf-home-closing .rf-btn--outline-light { border-color: var(--oat); }
.rf-home-closing__note { font-size: 17px; }
.rf-home-closing .rf-home-print a { color: var(--blueberry-deep); }
.rf-home-closing__stars {
  position: absolute; top: -34px; right: -30px;
  width: clamp(76px, 8vw, 110px); height: auto;
  transform: rotate(-6deg);
  pointer-events: none;
}
/* Keep the stars inside the viewport on narrow screens, where the print is full-bleed. */
@media (max-width: 599px) {
  .rf-home-closing__stars { right: -8px; }
}

/* Design 2026-09-26 (second pass): the plans heading's second half is
   Sunshine; the closing offers "Send this page" on phones (where a share
   sheet exists) and "See how it works" on wide screens. Design's
   breakpoint is 960px, the same as the nav's. */
.rf-home-sun { color: var(--sunshine); }
.rf-home-deep { color: var(--blueberry-deep); }
.rf-home-sub--wide { max-width: 52ch; }
.rf-home-reframe {
  margin: 0; font-family: var(--font-head); font-weight: 600;
  font-size: clamp(24px, 2.8vw, 34px); line-height: 1.2; letter-spacing: -0.01em;
  max-width: 30ch; text-wrap: balance;
}
@media (min-width: 960px) { .rf-home-narrow-only { display: none !important; } }
@media (max-width: 959px) { .rf-home-wide-only { display: none !important; } }

/* Village is the plan to pick; Village Plus is "Coming soon" only (David,
   2026-09-28; Design RULING-jessica-review-of-r3-v3-2026-09-28 C2). */
.rf-home-plan--pick { box-shadow: 0 0 0 4px var(--sunshine); }
.rf-home-plan--soon { justify-content: center; }
.rf-home-plan__soon { font-family: var(--font-head); font-weight: 600; font-size: 24px; margin: 0; color: #555D6D; }

/* ---- Waitlist block (replaced Plans, 2026-10-02) ------------------------------------------------ */
.rf-home-join { align-items: start; }
.rf-home-join .rf-home-intro { display: flex; flex-direction: column; gap: 22px; }

/* The /waitlist/ form embedded in Home's "Get on the list" band (Mobbin round 4
   proposal). The band's text is Oat on Blueberry; the card is Paper, so it sets
   Ink back, or the labels and the consent line would be unreadable. */
.rf-home-waitlist { color: var(--ink); }