/* site v7: the two selling pages, /plumbers and /google-reviews (loaded after v7.css). Every rule sits under body.v7. */

/* hero: copy and form left, one figure card right */
.v7 .hero-split { padding: 56px 0 80px; }
.v7 .hero-grid-2 { display: grid; grid-template-columns: minmax(0, 1fr) 480px; gap: 56px; align-items: center; }
.v7 .hero-left h1 { max-width: none; }
.v7 .h1-long { font-size: 52px; line-height: 58px; }
.v7 .hero-left .lead { margin-top: 20px; margin-bottom: 24px; }
.v7 .stat-card { background: var(--ink); color: var(--paper); border-radius: 16px; padding: 40px; }
.v7 .stat-card .display { font-size: 88px; line-height: 80px; }
.v7 .stat-card .caption { margin: 24px 0 0; font-weight: 500; font-size: 20px; line-height: 28px; }   /* v7r3f ruling 3: moved from v7-plumbers.css; every page with a stat card loads this sheet */
.v7 .card-src { margin: 12px 0 0; font-size: 14px; line-height: 21px; color: var(--slate); }

/* offer band: three cards, the re-check text and the offer card with the form */
.v7 .cards3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin: 40px 0 48px; counter-reset: wc; }
.v7 .wcard { counter-increment: wc; background: var(--paper); color: var(--ink); border: 1px solid var(--rule); border-radius: 16px; padding: 28px; }
.v7 .wcard::before { content: counter(wc); display: block; font-weight: 800; font-stretch: 118%; font-size: 48px; line-height: 48px; color: var(--marine); margin-bottom: 12px; }
.v7 .wcard h3 { margin-bottom: 8px; text-wrap: balance; }   /* round 4 R18: no lone word on the last line of a step heading ("Every month, if you keep / it") */
.v7 .wcard p { margin: 0; color: var(--ink); }
.v7 .band-ink .wcard h3 { color: var(--ink); }   /* v7r3h: `.v7 .band-ink h3` sets the h3 colour directly (Paper), so inheriting from .wcard is not enough; this one is more specific */
.v7 .offer-grid { display: grid; grid-template-columns: minmax(0, 1fr) 560px; gap: 48px; align-items: start; }
.v7 .recheck h3 { margin-top: 0; font-size: 24px; line-height: 30px; }
.v7 .recheck p { margin-top: 8px; margin-bottom: 0; }
.v7 .recheck .step1 { font-weight: 500; margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--rule); }   /* round 4 R26: visibly apart from the re-check text above it */
.v7 .recheck .chip { display: inline-flex; max-width: 420px; margin-top: 16px; }
.v7 .offer-card { background: var(--paper); border: 1px solid var(--rule); border-radius: 16px; padding: 40px; }
.v7 .offer-card .price { margin: 0; font-weight: 500; font-size: 24px; line-height: 32px; }
.v7 .offer-card .pdf { margin: 8px 0 0; color: var(--slate-dk); }
.v7 .offer-card .join { margin-top: 24px; }
.v7 .offer-card .join-row { flex-direction: column; align-items: stretch; }
.v7 .offer-card .join-row input[type="email"] { width: 100%; }
.v7 .offer-card .join-row .btn { width: 100%; }
.v7 .terms { margin-top: 24px; padding-top: 20px; border-top: 1px solid var(--rule); font-size: 15px; line-height: 23px; color: var(--slate-dk); }
.v7 .terms p { margin: 0 0 8px; }

@media (max-width: 1240px) {
  .v7 .hero-grid-2 { grid-template-columns: minmax(0, 1fr) 420px; gap: 40px; }
  .v7 .offer-grid { grid-template-columns: minmax(0, 1fr) 480px; }
}

@media (max-width: 980px) {
  .v7 .hero-grid-2, .v7 .offer-grid { grid-template-columns: minmax(0, 1fr); }
  .v7 .cards3 { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 600px) {
  .v7 .hero-split { padding: 24px 0 48px; }
  .v7 .h1-long { font-size: 34px; line-height: 40px; }
  .v7 .stat-card { padding: 24px; }
  .v7 .stat-card .display { font-size: 64px; line-height: 60px; }
  .v7 .cards3 { gap: 16px; }
  .v7 .wcard { padding: 24px; }
  .v7 .offer-card { padding: 24px; }
  .v7 .offer-card .price { font-size: 22px; line-height: 28px; }
}
