/* ═══════════════════════════════════════════════════
   TaxLint — Price Quote v2 · "Open ledger"
   A big, open, editorial theme. Re-themes the sv- tokens
   (so the existing quote form inherits the new look) and
   adds an oversized grotesque hero on a faint hairline grid
   with monospace figures — because a quote is, after all,
   a number.
   ═══════════════════════════════════════════════════ */

/* Loaded after services.css + quote.css, so these win. */
.qzv2 {
  --sv-bg: #F7F7F4;
  --sv-bg-soft: #F1F1EC;
  --sv-bg-card: #FFFFFF;
  --sv-ink: #141414;
  --sv-ink-2: #56564F;
  --sv-ink-3: #8C8C83;
  --sv-border: #E5E4DC;
  --sv-border-2: #EEEDE6;
  --sv-accent: #234A33;
  --sv-accent-soft: #ECF1EE;
  --sv-accent-ink: #16331F;
  --sv-radius: 8px;
  --sv-radius-lg: 14px;
  /* The quote form's step titles use --sv-font-serif; route it to the grotesque
     so the whole page speaks one type voice. */
  --sv-font-serif: "Space Grotesk", "Albert Sans", sans-serif;

  --v2-display: "Space Grotesk", "Albert Sans", sans-serif;
  --v2-mono: "Space Mono", ui-monospace, monospace;
  --v2-line: #E5E4DC;
  --v2-gutter: clamp(20px, 5vw, 84px);

  background: var(--sv-bg);
  color: var(--sv-ink);
}

.qzv2 .sv-header { background: rgba(247,247,244,0.82); backdrop-filter: saturate(140%) blur(8px); }
.qzv2 .sv-nav-cta { background: var(--sv-ink); color: var(--sv-bg) !important; }

/* ── Page shell: a faint full-bleed ledger grid ── */
.qzv2-page { max-width: 1320px; margin: 0 auto; padding: 0 var(--v2-gutter); }

/* shared eyebrow — plain, tracked, no chip (open/editorial) */
.qzv2-eyebrow {
  display: inline-block; font-family: var(--sv-font);
  font-size: 12px; font-weight: 600; letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--sv-ink-3);
}

/* ── Hero (supporting band, sits below the form) ── */
.qzv2-hero { padding: clamp(40px, 6vw, 72px) 0 clamp(48px, 7vw, 88px); border-top: 1px solid var(--v2-line); }
.qzv2-grid {
  display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr);
  gap: clamp(24px, 4vw, 64px); align-items: end;
  border-bottom: 1px solid var(--v2-line);
  padding-bottom: clamp(40px, 6vw, 80px);
}
.qzv2-hero-main { position: relative; }
.qzv2-h1 {
  font-family: var(--v2-display); font-weight: 500;
  font-size: clamp(2.9rem, 8.5vw, 6.6rem); line-height: 0.96; letter-spacing: -0.035em;
  color: var(--sv-ink); margin: 18px 0 0;
}
.qzv2-hero-aside {
  padding-left: clamp(0px, 2.5vw, 40px);
  border-left: 1px solid var(--v2-line);
}
.qzv2-hero-aside p { font-size: clamp(1.0625rem, 1.5vw, 1.25rem); line-height: 1.55; color: var(--sv-ink-2); margin: 0; max-width: 34ch; }
@media (max-width: 820px) {
  .qzv2-grid { grid-template-columns: 1fr; gap: 28px; align-items: start; }
  .qzv2-hero-aside { border-left: none; padding-left: 0; padding-top: 22px; border-top: 1px solid var(--v2-line); }
}

/* mono stat strip — the signature: figures as figures */
.qzv2-stats {
  display: grid; grid-template-columns: repeat(4, 1fr);
  border-bottom: 1px solid var(--v2-line);
}
.qzv2-stat { display: flex; flex-direction: column; gap: 6px; padding: clamp(22px, 3vw, 36px) 0; border-left: 1px solid var(--v2-line); padding-left: clamp(14px, 2vw, 26px); }
.qzv2-stat:first-child { border-left: none; padding-left: 0; }
.qzv2-num { font-family: var(--v2-mono); font-size: clamp(1.4rem, 2.6vw, 2.1rem); font-weight: 700; color: var(--sv-accent); letter-spacing: -0.02em; }
.qzv2-stat-label { font-size: 13px; color: var(--sv-ink-3); letter-spacing: 0.01em; }
@media (max-width: 640px) { .qzv2-stats { grid-template-columns: 1fr 1fr; } .qzv2-stat:nth-child(odd) { border-left: none; padding-left: 0; } }

/* ── Form (now the lead block, above the fold) ── */
.qzv2-form { padding: clamp(36px, 6vw, 72px) 0 clamp(48px, 7vw, 88px); }
.qzv2-form-head { max-width: 760px; margin-bottom: clamp(26px, 3.5vw, 40px); }
.qzv2-form-h1 {
  font-family: var(--v2-display); font-weight: 500;
  font-size: clamp(2.2rem, 5.4vw, 3.9rem); line-height: 1.0; letter-spacing: -0.03em;
  color: var(--sv-ink); margin: 14px 0 0;
}
.qzv2-form-sub { font-size: clamp(1.0625rem, 1.4vw, 1.1875rem); line-height: 1.6; color: var(--sv-ink-2); margin: 16px 0 0; max-width: 60ch; }
.qzv2-mount { max-width: 1080px; }

/* Re-open the form to suit the airy theme: a hairline card, no heavy shadow. */
.qzv2 .qz-card { box-shadow: none; border: 1px solid var(--sv-border); border-radius: var(--sv-radius-lg); }
.qzv2 .qz-step-title { font-family: var(--v2-display); font-weight: 500; letter-spacing: -0.02em; }
.qzv2 .qz-readout { background: var(--sv-bg-soft); }
.qzv2 .qz-progress-step { font-family: var(--v2-mono); font-style: normal; font-size: 13px; }
.qzv2 .qz-estimate-amt { font-family: var(--v2-mono); font-weight: 700; }
.qzv2 .sv-btn-primary { background: var(--sv-ink); color: var(--sv-bg); }
.qzv2 .sv-btn-primary:hover { background: var(--sv-accent-ink); }

@media (prefers-reduced-motion: reduce) { .qzv2 .sv-header { backdrop-filter: none; } }
