/* Acquisition page type — the shared stylesheet for the ad-matched landing pages
   generated by scripts/build-acq-pages.mjs.

   Why this file exists: every page of this shape used to carry its own copy of
   the same ~15 rules in an inline <style> block (public/pahrump-white-card.html
   is the surviving example). Fifteen more pages meant fifteen more copies, and a
   spacing fix would have to be made fifteen times. One stylesheet, one build
   script, one content file.

   Loaded AFTER site.css, which owns the tokens (--espresso, --taupe-ink,
   --hairline, --mist, --bronze) and all chrome (header, footer, .btn, .eyebrow,
   .container, .crumbs). Nothing here restyles chrome. */

.acq-main { padding: clamp(110px, 13vw, 156px) 0 clamp(72px, 9vw, 112px); }
.acq-wrap { max-width: 900px; }

.acq-lede {
  margin-top: 24px; max-width: 66ch;
  font-size: 1.18rem; line-height: 1.65; color: var(--taupe-ink);
}
.acq-lede strong { color: var(--espresso); font-weight: 500; }

.acq-sec { padding-top: clamp(52px, 7vw, 84px); }
.acq-sec h2 { max-width: 25ch; font-size: clamp(1.65rem, 3vw, 2.35rem); line-height: 1.15; }
.acq-sec p {
  margin-top: 16px; max-width: 68ch;
  color: var(--taupe-ink); font-size: 1.06rem; line-height: 1.7;
}
.acq-sec strong { color: var(--espresso); font-weight: 500; }
.acq-sec ul { margin-top: 16px; max-width: 68ch; padding-left: 20px; color: var(--taupe-ink); line-height: 1.7; }
.acq-sec li { margin-top: 8px; }

/* Key/value rows. The label column is the worker's own vocabulary — an employer
   name, a set of years — so it stays wide enough not to wrap on a phone. */
.acq-facts { margin-top: 28px; border-top: 1px solid var(--hairline); }
.acq-fact {
  display: grid; grid-template-columns: minmax(150px, 210px) 1fr; gap: 24px;
  padding: 21px 0; border-bottom: 1px solid var(--hairline);
}
.acq-fact__k { font-family: var(--display); font-weight: 500; color: var(--espresso); }
.acq-fact__v { color: var(--taupe-ink); line-height: 1.65; }
.acq-fact__v a { color: var(--espresso); }

.acq-callout {
  margin-top: 30px; padding: 25px;
  background: var(--mist); border-left: 2px solid var(--espresso);
}
.acq-callout p { margin: 0; }

/* The stronger variant, for the one thing on a page that is genuinely
   irreversible — accepting a RECA section 4 award, for instance. */
.acq-callout--weight { border-left-color: var(--bronze); background: var(--paper); border: 1px solid var(--hairline); border-left: 3px solid var(--bronze); }

.acq-faq { border-top: 1px solid var(--hairline); margin-top: 28px; }
.acq-faq details { border-bottom: 1px solid var(--hairline); }
.acq-faq summary { cursor: pointer; padding: 18px 0; font-size: 1.0625rem; font-weight: 500; color: var(--espresso); }
.acq-faq p { padding: 0 0 18px; margin-top: 0; max-width: 68ch; line-height: 1.65; }

.acq-next { margin-top: 20px; display: flex; flex-wrap: wrap; gap: 14px 26px; }
.acq-next a { color: var(--espresso); }

.acq-cta { margin-top: 34px; }
.acq-cta .btn { margin-right: 16px; }
.acq-cta__call { margin-top: 18px; font-size: 0.98rem; color: var(--taupe-ink); }
.acq-cta__call a { color: var(--espresso); }

@media (max-width: 700px) {
  .acq-fact { grid-template-columns: 1fr; gap: 7px; }
}