/* ==========================================================================
   HostRyze — Furnished Finder page (furnished-finder.html) only.
   Small adjustments on top of css/styles.css + css/pages.css. Two surfaces only.
   ========================================================================== */

/* Hero: the form carries its own kicker (label + title + sub) and more copy lines than the home hero */
.phero .audit .label { margin-bottom: 8px; }
.phero__sub strong { font-weight: 700; }
.phero .ticks { max-width: 60ch; }

/* Emphasis inside a muted lede keeps the full surface colour */
.lede strong { color: var(--fg); font-weight: 700; }

/* "Why we contacted you": copy left, vacancy card right, the quotes run under both (source order kept) */
.mathsec .quotes { grid-column: 1 / -1; margin-top: 0; max-width: 60ch; }
.mathsec > .reveal .lede:first-of-type { margin-top: 20px; }

/* Compact calculators: unit after a typed value ("$5,000 /month") */
.dial__unit { font-size: 0.55em; font-weight: 600; letter-spacing: 0; margin-left: 6px; color: rgba(var(--fgc), 0.72); }
.calc__eq { display: inline-block; margin-right: 6px; font-weight: 800; color: rgba(var(--fgc), 0.5); }
.calc__out .result__big .result__tag { font-weight: 600; letter-spacing: 0; margin-left: 4px; color: rgba(var(--fgc), 0.72); }
.calc .dial__val[data-calc-out] { min-width: 4ch; text-align: right; }
.calc__out .result__tag span { font-weight: 700; color: var(--fg); }

/* Worked examples from the source ("$7,500/month, 2 empty months → $15,000"): hairline rows, figure right-aligned */
.examples { margin-top: 18px; max-width: 60ch; border-top: 1px solid rgba(var(--fgc), 0.2); }
.examples li { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: baseline; column-gap: 14px; padding: 12px 0; border-bottom: 1px solid rgba(var(--fgc), 0.2); }
.examples span { font-size: 1rem; line-height: 1.4; color: rgba(var(--fgc), 0.8); }
.examples i { font-style: normal; color: rgba(var(--fgc), 0.5); }
.examples b { font-size: clamp(1.2rem, 1.7vw, 1.5rem); font-weight: 800; font-stretch: 94%; letter-spacing: -0.03em; line-height: 1; text-align: right; font-variant-numeric: tabular-nums; }
.examples + .lede { margin-top: 18px; }
.calc .examples { max-width: none; margin-top: clamp(16px, 2.6vh, 22px); }

/* Fee calculator ("Run your own numbers"): traditional cost left, HostRyze fixed fee right */
.calc__out--vs { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--gap); }
.calc__out--vs > div + div { padding-left: var(--gap); border-left: 1px solid rgba(var(--fgc), 0.2); }
.calc__out--vs .result__k { font-size: 0.95rem; color: rgba(var(--fgc), 0.72); }
.calc__out--vs .result__big { font-size: clamp(2rem, 3.2vw, 3rem); margin: 8px 0 6px; }
.calc__out--vs .result__tag { font-size: 0.95rem; }
.calc__out--vs p.result__tag { color: rgba(var(--fgc), 0.8); }

/* Forms: "Phone or email (one is enough)" — one visible group label; the two field labels stay for assistive tech */
.fgroup { margin-bottom: 0; }
.fgroup__k { display: block; font-size: 0.9rem; font-weight: 600; margin-bottom: 6px; }
.fgroup__k small { font-weight: 500; color: rgba(var(--fgc), 0.65); margin-left: 6px; }
.f--quiet { position: relative; }
.f--quiet > span { position: absolute; width: 1px; height: 1px; margin: 0; padding: 0; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0; }

/* Results: the four source metric cards (label, big figure, one line), then the video block under its own heading */
.stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--gap); margin-top: var(--stack); }
.stats li { padding-top: 18px; border-top: 1.5px solid var(--fg); }
.stats__k { font-size: 0.9rem; font-weight: 600; color: rgba(var(--fgc), 0.72); margin-bottom: 10px; }
.stats b { display: block; font-size: clamp(2.2rem, 3.6vw, 3.4rem); font-weight: 800; font-stretch: 92%; letter-spacing: -0.04em; line-height: 1; font-variant-numeric: tabular-nums; margin-bottom: 12px; overflow-wrap: anywhere; }
.stats li > p:last-child { font-size: 0.98rem; line-height: 1.45; color: rgba(var(--fgc), 0.8); max-width: 32ch; }
.cases--work { margin-top: var(--stack); padding-top: var(--stack); border-top: 1px solid rgba(var(--fgc), 0.2); }
.cases--work .cases__head .lede { margin-top: 14px; font-size: 1rem; }

/* Trusted-by: the logo wall follows its own heading, so drop the divider .clients carries on the home page */
.clientsec .clients { margin-top: 0; padding-top: 0; border-top: 0; }
.clientsec .clients__sm img { height: 30px; }   /* Beckon: 76×41 source, never upscale */

/* How it works: "Step 1" is text, not a digit, so it gets a calmer size; struck-through vague praise in step 2 */
.steps--3 .step__n { font-size: clamp(1.6rem, 2.4vw, 2.2rem); letter-spacing: -0.03em; margin-bottom: clamp(14px, 2.4vh, 24px); }
.steps--3 .step .list { max-width: 26ch; }
.step__strike { color: rgba(var(--fgc), 0.5); font-weight: 600; margin-bottom: 10px; }
.step__strike s { text-decoration-thickness: 1.5px; }

/* Still your property */
.control__k { font-weight: 700; margin: 18px 0 6px; }
.control .list { max-width: 36ch; }
.control .closing { margin-top: 24px; }

/* Final form: copy column spacing + alternative contact row under the form */
.ffcta .cta__fine { margin-bottom: 14px; }
.ffcta .xs { max-width: 34em; }
.ffcta .closing { margin-top: 22px; }
.cta__alt { margin-top: clamp(18px, 3vh, 26px); }
.cta__alt p { font-weight: 600; margin-bottom: 10px; color: rgba(var(--fgc), 0.85); }

/* One last thing: centred closing block */
.last__in { text-align: center; max-width: 52rem; margin-inline: auto; }
.last__in h2 { margin-inline: auto; }
.last__in .lede { margin: 18px auto 0; }
.last__cta { margin-top: clamp(22px, 3.6vh, 32px); }
.last__alt { margin-top: 16px; font-size: 0.95rem; color: rgba(var(--fgc), 0.75); }
.last__alt a { font-weight: 700; text-underline-offset: 4px; }

/* ---------- Responsive ---------- */
@media (max-width: 900px) {
  .mathsec .quotes { max-width: none; }
  .stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .examples { max-width: none; }
}
@media (max-width: 640px) {
  .phero__sub + .phero__sub { margin-top: 10px; }
  .stats { grid-template-columns: 1fr; gap: 20px; }
  .stats li > p:last-child { max-width: none; }
  .calc__out--vs { grid-template-columns: 1fr; gap: 16px; }
  .calc__out--vs > div + div { padding-left: 0; border-left: 0; padding-top: 16px; border-top: 1px solid rgba(var(--fgc), 0.2); }
  .steps--3 .step { display: block; }                    /* keep text labels ("Step 1") above the heading on phones */
  .steps--3 .step__n { font-size: 1.25rem; margin-bottom: 8px; }
  .steps--3 .step .list, .control .list { max-width: none; }
  .steps--3 .step .list li { padding: 6px 0; }
  .last__cta .btn { width: 100%; }
  .cta__alt .links a { background: none; }
}