/* Campaign layout, form states, consent controls, and optional motion. */
@font-face {
  font-family: Assistant;
  src: url(./assistant-variable.woff) format("woff");
  font-weight: 200 800;
  font-display: swap;
}

:root {
  color-scheme: light;
  /* Display P3 artwork is exported into sRGB, including these campaign swatches. */
  --deep-green: #032e2a;
  --lime: #a5d288;
  --salmon: #f69889;
  --white: #fff;
  --ink: #072e2a;
  --danger: #64172d;
  font-family: Assistant, Arial, sans-serif;
  color: var(--white);
  background: var(--deep-green);
}

*, *::before, *::after { box-sizing: border-box; }
/* Keep the banner in its own bottom row, outside the content scroll area. */
html { scroll-padding-block-end: var(--cookie-safe-area, 0px); }
body { display: flex; flex-direction: column; min-block-size: 100svh; margin: 0; }
/* One content scroll area above a consent row. The consent interface cannot
   paint over an input, call target or legal line while it remains visible. */
body:has(#main-content) { display: grid; grid-template-rows: minmax(0, 1fr) auto; block-size: 100svh; overflow: hidden; }
#main-content { min-block-size: 0; width: min(100%, 1920px); margin-inline: auto; container-type: inline-size; overflow: auto; scroll-padding-block: 8px; }
/* R39: viewport width selects the artboard scale. A short window may scroll
   vertically; consent must not narrow or crop the approved artwork. */
img { display: block; max-width: 100%; height: auto; }
button, input { font: inherit; }
a, button { touch-action: manipulation; }
a:focus-visible, button:focus-visible, input:focus-visible, #lead-form:focus-visible {
  outline: 3px solid currentColor;
  outline-offset: 3px;
}
.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}
.hero { position: relative; overflow-x: clip; }
.hero-art { display: block; overflow: hidden; }
@supports (overflow: clip) {
  .hero-art { overflow: clip; }
}
.hero-photo {
  width: 100%;
  block-size: auto;
  aspect-ratio: 640 / 476;
  object-fit: cover;
  object-position: center top;
}
.partners { position: absolute; top: 12.184874%; left: 0; width: 29.53125%; }
.partners img, .agency-mark img, .green-logo img { width: 100%; }
.agency-mark { position: absolute; top: 33.193277311%; left: 1.25%; width: clamp(9px, 2.65625cqw, 17px); }

.campaign { width: 100%; padding: clamp(14px, 3.9cqw, 25px) 0 16px; }
.offer { width: 86.40625%; text-align: center; margin: 0 auto; }
.offer-headline { position: relative; padding-block-start: 5.25%; }
.offer h1 { margin: 0; line-height: 1; }
.offer h1 picture { display: block; }
.offer, .lead-card, .design-disclaimer { letter-spacing: 0.005em; }
.offer h1 img { width: 100%; }
.offer-kicker {
  position: absolute;
  inset-block-start: 0;
  inset-inline-start: 0;
  width: max-content;
  max-width: 100%;
  margin: 0;
  text-align: right;
  color: var(--salmon);
  font-size: clamp(16px, 4.6875cqw, 30px);
  line-height: 1;
  font-weight: 800;
  transform-origin: right top;
  scale: .78 1.15;
}
.offer-kicker span { display: block; }
.offer-first {
  margin: 0.28em 0 0;
  font-size: clamp(17px, 6.05cqw, 39px);
  font-weight: 800;
  line-height: 1.03;
  scale: 1 1.18;
}
/* The final inline digits reserve the original width and remain readable to AT. */
.offer-count { position: relative; }
.offer-count[data-counting] .offer-count-final { opacity: 0; }
.offer-count-running {
  position: absolute;
  inset-block-start: 0;
  inset-inline: 0;
  direction: ltr;
  text-align: center;
  font-variant-numeric: tabular-nums;
  pointer-events: none;
}
.offer-details {
  margin: calc(0.18em + min(2.9cqw, 19px)) 0 0;
  font-size: clamp(14px, 4.48cqw, 28.75px);
  line-height: 1.105;
}
.offer-line { display: block; }
.fold-cta { display: none; }
.offer-details bdi { font-family: inherit; }
.lead {
  position: relative;
  z-index: 1;
  width: 74%;
  max-width: 469px;
  margin: clamp(20px, 6.1cqw, 39px) auto 0;
}
.lead-card {
  --field-height: clamp(44px, 8.28cqw, 53px);
  --checkbox-size: 17px;
  --field-gap: clamp(12px, 4.22cqw, 27px);
  --logo-extra: clamp(0px, 2.97cqw, 19px);
  --logo-gap: clamp(14px, 3.9cqw, 25px);
  min-block-size: min(125.625cqw, 804px);
  padding: clamp(16px, 4.85cqw, 31px) clamp(16px, 5.94cqw, 38px) 24px;
  color: var(--ink);
  background: var(--lime);
  text-align: center;
  border-radius: 2px;
}
.green-logo {
  display: block;
  width: calc(100% + var(--logo-extra));
  margin: 0 calc(var(--logo-extra) / -2) var(--logo-gap);
}
.lead-card h2 { font-size: clamp(16px, 3.44cqw, 22px); line-height: 1.15; margin: 0; text-wrap: balance; }
.lead-intro {
  min-block-size: clamp(0px, 13.44cqw, 86px);
  margin: 3px 0 15px;
  line-height: 1.16;
  text-wrap: balance;
  font-size: clamp(16px, 3.6cqw, 23px);
}
.field { margin-bottom: var(--field-gap); }
.field input {
  display: block;
  width: 100%;
  min-height: var(--field-height);
  padding: 8px clamp(12px, 3.75cqw, 24px);
  font-size: clamp(1rem, 3.6cqw, 1.44rem);
  line-height: 1.15;
  letter-spacing: inherit;
  color: var(--ink);
  background: var(--white);
  border: 1px solid transparent;
  border-radius: 0;
}
.field input:is([type="tel"], [type="email"]) { text-align: end; direction: ltr; }
.field input::placeholder {
  color: var(--ink);
  font-family: Assistant, Arial, sans-serif;
  font-weight: 700;
  opacity: 1;
}
.field input[aria-invalid="true"] { border-color: var(--danger); }
.field-error {
  display: block;
  color: var(--danger);
  font-size: 0.84rem;
  font-weight: 700;
  text-align: right;
}
.field-error:not(:empty) { margin: 3px 0 4px; }
.consent-row {
  display: flex;
  align-items: flex-start;
  gap: 7px;
  min-block-size: clamp(0px, 15.3cqw, 98px);
  margin: 10px 0 2px;
  text-align: right;
  font-size: clamp(0.8rem, 2.5cqw, 1rem);
  line-height: 1.3;
}
/* Keep the native control and its states while matching the outlined PSD checkbox. */
.consent-row input {
  appearance: none;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  inline-size: var(--checkbox-size);
  block-size: var(--checkbox-size);
  margin: 0;
  border: 2px solid currentColor;
  color: var(--ink);
  background: transparent;
  accent-color: var(--ink);
}
.consent-row input:checked { color: var(--white); background: var(--ink); border-color: var(--ink); }
.consent-row input:checked::after {
  content: "";
  inline-size: 8px;
  block-size: 5px;
  border: solid currentColor;
  border-width: 0 0 2px 2px;
  transform: translateY(-1px) rotate(-45deg);
}
.consent-row input:focus-visible { outline-color: var(--ink); }
@media (forced-colors: active) {
  .consent-row input { appearance: auto; }
  .consent-row input:checked::after { content: none; }
}
.submit, .call-link {
  min-height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.35em;
  width: 100%;
  color: var(--ink);
  font-size: clamp(1rem, 3.6cqw, 1.44rem);
  font-weight: 800;
  line-height: 1.15;
  letter-spacing: inherit;
  cursor: pointer;
}
.submit { min-height: clamp(44px, 8.75cqw, 56px); margin: 9px -1px 0; width: calc(100% + 2px); border: 2px solid var(--deep-green); background: transparent; }
.submit span { font-family: Assistant, Arial, sans-serif; }
/* Preserve the label position when the reference layout optically scales its arrow. */
.cta-arrow { position: relative; inset-inline-start: var(--cta-arrow-offset, 0px); scale: var(--cta-arrow-scale, 1); flex: 0 0 auto; color: var(--white); }
.submit:focus-visible:not(:disabled), .submit:active:not(:disabled, [aria-disabled="true"]) {
  color: var(--white);
  background: var(--ink);
  outline-color: var(--deep-green);
}
.call-link:focus-visible, .call-link:active { text-decoration: underline; }
.submit:is(:disabled, [aria-disabled="true"]) { opacity: 0.65; cursor: default; }
.call-link { min-height: var(--field-height); background: var(--salmon); text-decoration: none; }
.form-status { margin: 8px 0 0; font-size: 0.88rem; line-height: 1.4; font-weight: 700; }
.form-status:empty { margin: 0; }
.form-status[data-state="error"] { color: var(--danger); }
.lead-footer { text-align: center; font-size: 0.82rem; line-height: 1.45; margin-top: 10px; }
.lead-footer p { margin: 0; }
.lead-footer:has(.design-disclaimer) { margin-top: clamp(10px, 4.38cqw, 28px); }
.design-disclaimer { color: var(--white); font-size: clamp(0.75rem, 2.35cqw, 0.9375rem); line-height: 1.2; font-weight: 700; }
.preview-notice { color: #d7e8e5; font-size: 0.75rem; padding-block: 3px; }
.lead-footer a, .cookie-banner a, .privacy-page a { color: inherit; text-underline-offset: 3px; }

.skip-link {
  position: fixed;
  inset-block-start: 8px;
  inset-inline-start: 8px;
  z-index: 5;
  padding: 12px;
  color: var(--ink);
  background: var(--white);
  transform: translateY(-200%);
}
.skip-link:focus { transform: none; }
.legal-links {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  column-gap: 14px;
}
.legal-links :is(a, button):not([hidden]) {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
}
.legal-links button {
  padding: 0;
  color: inherit;
  background: none;
  border: 0;
  text-decoration: underline;
  text-underline-offset: 3px;
  cursor: pointer;
}

.cookie-banner {
  position: relative;
  inset-block-end: 0;
  order: 1;
  z-index: 3;
  gap: 8px;
  inline-size: 100%;
  max-block-size: 60svh;
  margin: 8px 0 0;
  padding: 10px clamp(12px, 2cqw, 24px) max(10px, env(safe-area-inset-bottom));
  overflow: auto;
  overscroll-behavior: contain;
  color: var(--white);
  background: var(--deep-green);
  border-block-start: 2px solid var(--lime);
  box-shadow: 0 -4px 16px rgb(0 22 19 / 20%);
}
.cookie-banner .cookie-actions button {
  color: var(--white);
  background: transparent;
  border-color: var(--lime);
}
.cookie-banner #cookie-accept { color: var(--ink); background: var(--lime); }
.cookie-banner .cookie-actions button:hover { color: var(--ink); background: var(--salmon); }

.cookie-banner:not([hidden]),
html[data-cookie-pending] .cookie-banner { display: grid; }
.cookie-banner h2, .cookie-dialog h2 { font-size: 1rem; line-height: 1.25; margin: 0; }
.cookie-banner p { margin: 3px 0 0; font-size: 0.85rem; line-height: 1.35; }
.cookie-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.cookie-actions button {
  flex: 1 0 auto;
  min-height: 44px;
  padding: 7px 10px;
  color: var(--ink);
  background: var(--white);
  border: 1px solid var(--ink);
  border-radius: 3px;
  font-size: 0.9rem;
  font-weight: 700;
  cursor: pointer;
}
.cookie-actions button:hover { background: var(--lime); }
.cookie-dialog {
  position: fixed;
  inset: auto 0 0;
  margin: 0 auto max(12px, env(safe-area-inset-bottom));
  width: min(90cqw, 530px);
  max-height: min(40svh, 360px);
  padding: 14px;
  overflow: auto;
  color: var(--ink);
  background: var(--white);
  border: 1px solid var(--ink);
  border-radius: 4px;
  font-size: .875rem;
  line-height: 1.4;
}
.cookie-dialog::backdrop { background: rgb(0 22 19 / 16%); }
.cookie-dialog p { margin: 8px 0 10px; }
.cookie-dialog fieldset { min-width: 0; margin: 0 0 10px; padding: 0; border: 0; }
.cookie-dialog label {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  cursor: pointer;
}
.cookie-dialog input { flex: 0 0 auto; width: 18px; height: 18px; accent-color: var(--ink); }
.privacy-page { max-width: 72ch; margin: auto; padding: 24px; line-height: 1.6; overflow-wrap: anywhere; }

/* Tune the full-width mobile artboard while allowing short phones to reflow. */
@media (min-width: 481px) and (max-width: 760px) {
  .offer-first { position: relative; inset-block-start: 4px; scale: 1 1.25; }
  .offer-details { scale: 1 1.11; }
  .lead { left: -.5px; }
  .lead-card { --checkbox-size: 21px; --logo-extra: clamp(0px, 2.82cqw, 18px); padding-inline: clamp(28px, 5.625cqw, 36px) clamp(29px, 6.09375cqw, 39px); }
  .lead-card h2 { font-size: clamp(19px, 3.72cqw, 23.8px); line-height: 1.065; position: relative; inset-block-start: 4px; scale: 1 1.26; }
  .lead-intro { font-size: clamp(20px, 3.56cqw, 22.8px); line-height: 1.6; margin-block-end: 14px; }
  .lead-intro span { display: inline-block; scale: 1 1.2; }
  .consent-row { margin-block-start: 18px; min-block-size: clamp(0px, 14.05cqw, 90px); }
  .submit { margin-block-start: 10px; font-size: clamp(1.125rem, 4.15cqw, 1.66rem); }
  .lead-footer:has(.design-disclaimer) { margin-block-start: clamp(24px, 5cqw, 32px); }
  .design-disclaimer { font-size: clamp(.75rem, 2.23cqw, .892rem); line-height: 1.26; }
}

/* Fit measured ink bounds at the mobile design scale while preserving natural wraps. */
@media (min-width: 600px) and (max-width: 760px) {
  .campaign { padding-block-end: 12px; }
  .offer-first { inset-block-start: 6px; left: 1px; scale: 1.037 1.37; }
  .offer-details {
    font-family: Assistant, Arial, sans-serif;
    font-weight: 450;
    scale: 1.105 1.1;
  }
  /* Reserve the loaded mixed-font line box before Assistant finishes loading. */
  .offer-line:first-child { position: relative; min-block-size: calc(1lh + 1px); inset-block-start: -2px; left: 2px; }
  .offer-line:last-child { position: relative; inset-block-start: -5px; left: 3px; scale: .967 .96; }
  /* Reserve the approved offer line height above the card during font loading. */
  .lead { margin-block-start: calc(clamp(20px, 6.1cqw, 39px) - 1px); }
  /* R25: measured PSD ink bounds; keep the existing accessible line box. */
  .lead-card h2 { inset-block-start: 6px; font-weight: 600; scale: 1.005089 1.364087; }
  .lead-intro span { position: relative; inset-block-start: 10px; font-weight: 600; scale: 1.042862 1.573; }
  .lead-intro span:last-child { left: -1px; scale: 1.044742 1.554348; }
  .field input { padding: 5px 22px 11px; }
  .field input::placeholder { font-size: 1.08em; letter-spacing: -.04em; font-weight: 800; }
  .call-link span { position: relative; inset-block-start: -2px; scale: .85 1.42; }
  .submit { --cta-arrow-offset: 12px; --cta-arrow-scale: 1.38 1.2; }
  .submit span { position: relative; left: -1px; scale: 1.19 1.03; font-weight: 700; }
  .consent-row label { max-inline-size: 285px; line-height: 1.5; }
  .design-disclaimer { line-height: 1.34; }
  .design-disclaimer span { display: inline; }
}

/* Narrow phones reflow the consent instead of reserving the PSD's desktop-sized text block. */
@media (max-width: 480px) {
  .fold-cta {
    display: flex;
    align-items: center;
    justify-content: center;
    width: min(100%, 296px);
    min-height: 44px;
    margin: 12px auto 0;
    padding: 8px 14px;
    border: 1px solid var(--lime);
    color: var(--white);
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.2;
    text-decoration: none;
  }
  .cookie-banner .cookie-actions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
  .cookie-banner .cookie-actions button { min-width: 0; padding: 5px 4px; font-size: .825rem; line-height: 1.25; }
  .lead-card { --field-gap: 10px; --logo-gap: 12px; min-block-size: 0; padding-block-end: 16px; }
  .lead-intro { min-block-size: 0; margin-block-end: 12px; }
  .consent-row { min-block-size: 0; }
}
@media (max-width: 400px) {
  .lead { width: clamp(74%, 296px, 82%); }
}
@media (min-width: 761px) {
  .hero-photo { aspect-ratio: 1920 / 677; }
  .partners { top: 12.998523%; width: 18.28125%; }
  .agency-mark { top: calc(100% + 16px); left: 0.78125%; width: clamp(12px, 0.885416667cqw, 17px); }
  .campaign {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(260px, 25.4%);
    gap: 6cqw;
    align-items: start;
    width: 86%;
    max-width: 1650px;
    margin: 0 auto;
    padding: clamp(12px, 1.2cqw, 28px) 0 16px;
  }
  .offer { width: min(100%, 36.615cqw); max-width: 720px; margin-inline: min(2.19cqw, 42px) auto; }
  .offer-headline { padding-block-start: 3.27%; }
  .offer-kicker { inset-block-start: -.20em; font-size: clamp(17px, 1.8cqw, 35px); scale: .85 1.15; }
  .offer-first { position: relative; inset-block-start: 3px; font-size: clamp(17px, 2.625cqw, 50.4px); line-height: 0.98; scale: 1.12 1.6; }
  .offer-details { margin-top: clamp(10px, 1.55cqw, 30px); font-size: clamp(15px, 1.9cqw, 36.5px); line-height: 1.035; }
  .lead { width: auto; max-width: none; margin: 0; }
  .lead-card {
    --field-height: 44px;
    --field-gap: clamp(12px, 1.15cqw, 22px);
    --logo-extra: clamp(0px, 0.73cqw, 14px);
    --logo-gap: clamp(14px, 1.3cqw, 25px);
    min-block-size: min(34.375cqw, 660px);
    padding: clamp(16px, 2.865cqw, 55px) clamp(16px, 1.56cqw, 30px) 24px;
  }
  .field input { font-size: clamp(1rem, 1.04cqw, 1.25rem); padding-inline: clamp(12px, 1cqw, 19px); }
  .lead-card h2 { font-size: clamp(16px, 1cqw, 19px); }
  .lead-intro { min-block-size: clamp(0px, 4.32cqw, 83px); font-size: clamp(15px, 1.2cqw, 23px); }
  .consent-row { min-block-size: clamp(0px, 3.75cqw, 72px); font-size: clamp(0.8rem, 0.78cqw, 0.9375rem); }
  .submit { min-height: 44px; font-size: clamp(1rem, 1.15cqw, 1.375rem); }
  .call-link { display: none; }
  .lead-footer:has(.design-disclaimer) { margin-top: 14px; }
  .design-disclaimer { font-size: 0.75rem; }
  .legal-links :is(a, button):not([hidden]) { min-height: 28px; }
  .cookie-banner { grid-template-columns: minmax(0, 1fr) auto; align-items: center; }
  .cookie-dialog { left: 16px; right: auto; margin-inline: 0; }
}
@media (min-width: 1051px) {
  .campaign { width: 79.0625%; gap: clamp(30px, 10cqw, 230px); padding-block-end: 1px; }
  .lead-footer:has(.design-disclaimer) { margin-top: 20px; }
}

/* Keep the readable intermediate-width form below the photograph. The PSD's
   overlapping card is safe once its left column clears the original subjects. */
@media (min-width: 1200px) {
  .lead { margin-block-start: clamp(-375px, -20cqw, -155px); }
}


/* Align the desktop reference with readable type and natural form growth. */
@media (min-width: 1500px) {
  .campaign { grid-template-columns: minmax(0, 1fr) minmax(260px, 25.37%); }
  .offer-first { inset-block-start: 4px; left: -1px; scale: 1.12 1.6; }
  .offer-details { scale: 1.13 1.13; }
  .offer-line:first-child { scale: 1.006 .97; translate: 1px -1px; }
  .offer-line:last-child { position: relative; inset-block-start: 5px; left: 1px; scale: .965 .94; }
  .lead-card { --logo-extra: 15px; padding-inline-end: 31px; }
  .green-logo { margin-inline-start: -7px; }
  /* R25: licensed Assistant fits this PSD heading more closely than the fallback. */
  .lead-card h2 { font-family: Assistant, Arial, sans-serif; font-weight: 600; font-size: 19.75px; line-height: 22px; position: relative; inset-block-start: 6px; scale: 1.184184 1.4656; }
  .lead-intro { font-size: 21px; line-height: 30px; }
  .submit { --cta-arrow-offset: 10px; --cta-arrow-scale: 1.15 1; min-height: 46px; margin-block-start: 8px; }
  .submit span { position: relative; left: -3px; scale: 1.15 1.04; }
  .lead-intro span { display: inline-block; position: relative; inset-block-start: 10px; left: -1px; scale: 1 1.24; }
  .lead-intro span:first-child { scale: 1 1.34; }
  .field input { padding: 6px 18px 10px; }
  .field input::placeholder { font-size: 1.08em; letter-spacing: -.04em; font-weight: 650; }
  .consent-row label { max-inline-size: 248px; line-height: 1.5; }
  /* Keep every approved disclaimer word while matching its lighter PSD strokes. */
  .design-disclaimer { font-weight: 400; line-height: 1.29; scale: 1.059077 .962963; }
  .design-disclaimer span { display: inline; }
}

/* R34 retains the complete R33 1920x677 / 640x476 artwork. Short desktop
   windows scale the whole canvas together, then compact only readable type
   and card whitespace. The photograph itself never receives a new crop. */
/* Keep input and button targets at44px while reducing optical type scaling
   and excess card whitespace only when the desktop canvas is constrained. */
@media (min-width: 1200px) {
  @container (max-width: 1840px) {
    .lead { margin-block-start: -24cqw; }
    .lead-card { --field-gap: 8px; --logo-extra: 0px; --logo-gap: 8px; min-block-size: 0; padding: 16px; }
    .green-logo { width: min(100%, 264px); margin-inline: auto; }
    .lead-card h2 { font-size: clamp(16px, 1cqw, 18px); line-height: 1.2; font-weight: 700; inset-block-start: 0; scale: 1; }
    .lead-intro { min-block-size: 0; margin: 4px 0 12px; font-size: clamp(15px, 1.13cqw, 18px); line-height: 1.3; }
    .lead-intro span { display: block; position: static; scale: 1; }
    .consent-row { min-block-size: 0; margin-block-start: 8px; font-size: .8rem; line-height: 1.35; }
    .submit { min-height: 44px; margin-block-start: 8px; font-size: 1rem; }
    .submit span { left: 0; scale: 1; }
    .lead-footer:has(.design-disclaimer) { margin-block-start: 8px; }
    .design-disclaimer { scale: 1; line-height: 1.3; }
    .offer-first { inset-block-start: 3px; left: 0; font-size: clamp(18px, 2.625cqw, 50.4px); line-height: 1.05; scale: 1.12 1.6; }
    .offer-details { margin-block-start: .75em; font-size: clamp(16px, 1.9cqw, 36.5px); line-height: 1.18; scale: 1.13 1; }
    .offer-line:first-child, .offer-line:last-child { inset-block-start: 0; left: 0; scale: 1; translate: none; }
  }
}

@media (hover: hover) {
  .submit:hover:not(:disabled, [aria-disabled="true"]) { color: var(--white); background: var(--ink); }
  .call-link:hover { text-decoration: underline; }
}

/* Short laptop windows need a little less card whitespace, not a photo crop
   or smaller input targets. Keep the entire legal footer above the banner. */
@media (min-width: 1200px) and (max-height: 800px) {
  @container (max-width: 1840px) {
    .lead { margin-block-start: -24.3cqw; }
    .lead-card { --field-gap: 6px; --logo-gap: 6px; padding-block: 12px; }
    .green-logo { width: min(100%, 220px); }
    .lead-intro { margin-block-end: 8px; }
    .lead-footer:has(.design-disclaimer) { margin-block-start: 6px; }
  }
}

/* CSS hover and parallax motion follow the same preference as entrance enhancement. */
@media (prefers-reduced-motion: no-preference) {
  .hero-photo { transform: translate3d(0, var(--hero-parallax, 0px), 0); }
  .submit:not(:disabled), .call-link { transition: box-shadow .22s ease, transform .24s ease; }
  .submit:active:not(:disabled, [aria-disabled="true"]), .call-link:active { transform: translateY(1px); }
  .cta-arrow { transition: transform .24s ease; }
  .submit:focus-visible:not(:disabled) .cta-arrow { transform: translateX(-4px); }
}
@media (prefers-reduced-motion: no-preference) and (hover: hover) {
  .submit:hover:not(:active, :disabled, [aria-disabled="true"]), .call-link:hover:not(:active) { transform: translateY(-2px); box-shadow: 0 6px 18px rgb(1 32 25 / 16%); }
  .submit:hover:not(:disabled, [aria-disabled="true"]) .cta-arrow { transform: translateX(-4px); }
}