/* Capriastro /birth-chart/ landing (the page was /natal-chart/ until 2026-09-26) — [capriastro_natal_landing] (CD 2g-1 · 2g-2 · 2g-3 · D5b, 23 Sep 2026).
 *
 * The FORM and the RESULTS on this page are the calculator shortcode, so calculator.css owns them;
 * this file places the page around them: the hero row (the calculator beside the decorative wheel on
 * desktop — the D1 pattern, since the form state has no desktop sheet — stacked on a phone), then
 * "What you get", Questions and the "Go deeper" pair. Literal-free; every rule scoped `.cap-shell …`.
 */

.cap-shell .cap-nat { padding-bottom: var(--cap-space-xl); }

/* ─── hero row: the calculator (its own hero, `hero="landing"`) | the wheel ───────── */
.cap-shell .cap-nat__hero-row { display: grid; grid-template-columns: minmax(0, 1fr) var(--cap-col-wheel); gap: var(--cap-gutter); align-items: center; padding-right: var(--cap-page-x); }
.cap-shell .cap-nat__aside { display: flex; justify-content: center; padding-left: 0; padding-right: 0; }
.cap-shell .cap-nat__wheel { display: block; width: 100%; max-width: var(--cap-col-wheel); height: auto; }
.cap-shell .cap-nat .cap-calc { padding-top: var(--cap-space-hero-open); padding-bottom: var(--cap-space-hero-open); }
/* once a chart is on the page the results replace the hero + form (calculator.css) and "What you get" steps aside (2g-2) */
.cap-shell .cap-nat:has(.cap-results) .cap-nat__aside,
.cap-shell .cap-nat:has(.cap-results) .cap-nat__get { display: none; }
.cap-shell .cap-nat:has(.cap-results) .cap-nat__hero-row { display: block; padding-right: 0; }

/* ─── "what you get": three ✦ lines (2g-1) ──────────────────── */
.cap-shell .cap-nat__get { max-width: var(--cap-measure); padding-top: var(--cap-space-block-5); }
.cap-shell .cap-nat__bullets { list-style: none; margin: var(--cap-space-gap-6) 0 0; padding: 0; display: flex; flex-direction: column; gap: var(--cap-space-gap-3); font-family: var(--cap-font-ui); font-weight: 400; font-size: var(--cap-type-data); letter-spacing: var(--cap-track-label); text-transform: uppercase; line-height: var(--cap-leading-data); color: var(--cap-color-text-body); }
.cap-shell .cap-nat__bullet { display: flex; align-items: baseline; gap: var(--cap-space-gap-3); }   /* the ✦ is its own span (D5a); below 1280 it keeps the old one-space look */

/* ─── questions: the quiet heading over the 2px rule, then the hairline list ──────── */
.cap-shell .cap-nat__faq { max-width: var(--cap-measure); margin-top: var(--cap-space-band-close); }   /* D5b: the band → Questions 56 */
.cap-shell .cap-nat__faq .cap-faq__head { margin-bottom: 0; padding-bottom: var(--cap-space-chip-gap); padding-top: var(--cap-space-lg); }
.cap-shell .cap-nat__faq .cap-faq__a a { color: var(--cap-color-primary); text-decoration: underline; text-underline-offset: 3px; }

/* ─── go deeper: the reading card on ink + the poster card on white (2g-1) ─────────── */
.cap-shell .cap-nat__deeper-wrap { max-width: var(--cap-measure); margin-top: var(--cap-space-primary-air); display: flex; flex-direction: column; gap: var(--cap-space-gap-6); }
.cap-shell .cap-nat__deeper { display: grid; grid-template-columns: 1fr 1fr; gap: var(--cap-space-gap-6); align-items: start; }
.cap-shell .cap-nat__deeper-card { display: flex; flex-direction: column; align-items: flex-start; gap: var(--cap-space-chip-gap); padding: var(--cap-space-cell-x); color: var(--cap-color-text); }
.cap-shell .cap-nat__deeper-card--reading { border: var(--cap-border-hairline) solid var(--cap-color-line-halo); color: var(--cap-color-on-ink-heading); }
.cap-shell .cap-nat__deeper-icon { display: block; width: 86px; height: 52px; margin: var(--cap-space-gap-3) 0; }
.cap-shell .cap-nat__deeper-btn { margin-top: var(--cap-space-gap-1); }

@media (max-width: 1279px) {
  .cap-shell .cap-nat__hero-row { grid-template-columns: minmax(0, 1fr); padding-right: 0; }
  .cap-shell .cap-nat__aside { display: none; }   /* the wheel beside the form is decoration: hidden below 1280 (owner 2026-09-30) */
  .cap-shell .cap-nat__get, .cap-shell .cap-nat__faq, .cap-shell .cap-nat__deeper-wrap { max-width: none; }   /* the full content width, page margins only */
  .cap-shell .cap-nat .cap-calc { padding-top: var(--cap-space-band-close); padding-bottom: 0; }
  .cap-shell .cap-nat__aside { padding: var(--cap-space-section-head-above) var(--cap-page-x-mid) var(--cap-space-xl); }
  .cap-shell .cap-nat__wheel { max-width: 400px; }
}

@media (max-width: 699px) {
  /* 2g-1: the hero centred at step 14, the form, the icon under it (the calculator prints it), then the sections */
  .cap-shell .cap-nat { padding-bottom: var(--cap-space-block-5); }
  .cap-shell .cap-nat .cap-calc { padding-top: var(--cap-space-block-4); padding-bottom: 0; }   /* 2g-1 (28 Sep): 20 from the header rule to the icon */
  .cap-shell .cap-nat__aside { display: none; }
  .cap-shell .cap-nat__get { padding-top: var(--cap-space-block-5); }
  .cap-shell .cap-nat__bullets { font-size: var(--cap-type-eyebrow-card); font-weight: 500; line-height: var(--cap-leading-data); color: var(--cap-color-text); }
  .cap-shell .cap-nat__deeper { grid-template-columns: 1fr; }
  .cap-shell .cap-nat__deeper-card { align-items: stretch; }
  .cap-shell .cap-nat__deeper-btn { align-self: stretch; }
}

/* D5b, the 24 Sep revision (desktop 1280+): once a chart is on the page, Questions runs the sheet's 760 (the inset's
   own padding added back) and the landing's "Go deeper" pair steps aside — D5b closes on Questions. The phone keeps it. */
@media (min-width: 1280px) {
  .cap-shell .cap-nat:has(.cap-results) .cap-nat__faq { max-width: none; }   /* the 760 column of the block below the hero (D5a/D5b) */
  .cap-shell .cap-nat:has(.cap-results) .cap-nat__deeper-wrap { display: none; }
  .cap-shell .cap-nat:has(.cap-results) .cap-calc { padding-bottom: 0; }   /* the band → Questions is the faq's own 56 (the sheet's 55) */
}

/* ═══ D5a (26 Sep, desktop 1280+): the form state ═══════════════════════════════════════════════════════════════
   The hero is the home hero's stack, LEFT-aligned (eyebrow → card 280.5 on both sheets), one ✦ before the eyebrow.
   Under it ONE block: "What you get" + Questions in the 760 column under a hairline, "Go deeper" in the 440 rail — the
   reading card alone: two report pages on the raised-ink band (210), the eyebrow, the headline, a full-width button.
   The phone keeps 2g-1 (centred hero, the icon card + the poster card). */
.cap-shell .cap-nat__pages, .cap-shell .cap-nat__deeper-h { display: none; }
@media (min-width: 1280px) {
  .cap-shell .cap-calc--landing .cap-calc__eyebrow::after { content: none; }
  .cap-shell .cap-nat__wheel { width: var(--cap-hero-wheel); max-width: none; flex: none; }   /* D5a: the home hero's wheel (radius 227.6 on both sheets) */
  .cap-shell .cap-nat__below { display: grid; grid-template-columns: minmax(0, var(--cap-measure-hero)) var(--cap-rail); gap: var(--cap-gutter-rail-product); align-items: start; }
  .cap-shell .cap-nat__main { border-top: var(--cap-border-hairline) solid var(--cap-color-line); }
  .cap-shell .cap-nat__get, .cap-shell .cap-nat__faq { max-width: none; }
  .cap-shell .cap-nat__get { padding-top: var(--cap-space-panel-pad); }
  .cap-shell .cap-nat__bullets { gap: var(--cap-space-md); text-transform: none; letter-spacing: var(--cap-track-data); font-size: var(--cap-type-card-title); line-height: var(--cap-leading-ui); }
  .cap-shell .cap-nat__bullet { display: flex; align-items: baseline; gap: var(--cap-space-gap-6); }
  .cap-shell .cap-nat__star { flex: none; color: var(--cap-color-primary); }
  .cap-shell .cap-nat__deeper-wrap { max-width: none; margin-top: 0; padding-top: calc(var(--cap-space-panel-pad) + var(--cap-border-hairline)); }
  .cap-shell .cap-nat__deeper { grid-template-columns: 1fr; }
  .cap-shell .cap-nat__deeper-card--poster { display: none; }
  .cap-shell .cap-nat__deeper-card--reading { padding: 0; gap: 0; align-items: stretch; border: 0; }
  .cap-shell .cap-nat__deeper-card--reading > .cap-lede, .cap-shell .cap-nat__deeper-card--reading .cap-nat__deeper-icon { display: none; }
  .cap-shell .cap-nat__pages { display: block; position: relative; height: var(--cap-report-band); overflow: hidden; background: var(--cap-color-ink-raised); }
  .cap-shell .cap-nat__pages img { position: absolute; display: block; width: 165px; height: 220px; object-fit: cover; object-position: 50% 0; background: var(--cap-color-bg); box-shadow: var(--cap-shadow-dark); }   /* the pages as the sign pages' rail card draws them (page-horoscopes-child.css) */
  .cap-shell .cap-nat__pages img:first-child { left: calc(50% - 145px); top: 30px; transform: rotate(-6deg); }
  .cap-shell .cap-nat__pages img + img { left: calc(50% - 20px); top: 46px; transform: rotate(5deg); }
  .cap-shell .cap-nat__deeper-card--reading > .cap-eyebrow { margin: var(--cap-gutter) var(--cap-gutter) 0; }
  .cap-shell .cap-nat__deeper-card--reading > .cap-eyebrow::before { content: "✦"; letter-spacing: 0; margin-right: var(--cap-space-gap-4); }   /* D5a: the ✦ ink 10 from the text (not two spaces) */
  .cap-shell .cap-nat__deeper-h { display: block; max-width: var(--cap-card-headline-measure); margin: var(--cap-space-md) var(--cap-gutter) 0; font-family: var(--cap-font-display-sm); font-weight: 800; font-size: var(--cap-type-h3-card); line-height: var(--cap-leading-tight); letter-spacing: var(--cap-track-tight); color: var(--cap-color-on-ink); }
  .cap-shell .cap-nat__deeper-card--reading .cap-nat__deeper-btn { align-self: stretch; justify-content: center; margin: var(--cap-space-block-4) var(--cap-gutter) var(--cap-gutter); padding: var(--cap-btn-pad-large); font-size: var(--cap-type-btn-large); letter-spacing: var(--cap-track-btn-large); line-height: var(--cap-leading-btn-large); }   /* D5a: 48 tall, 44.5 under the headline's last line */
  .cap-shell .cap-nat:has(.cap-results) .cap-nat__main { border-top: 0; }
  /* the form state's rhythm, measured on D5a (the results state keeps D5b's) */
  .cap-shell .cap-nat:not(:has(.cap-results)) .cap-calc { padding-bottom: calc(var(--cap-space-hero-open) + var(--cap-space-sm)); }   /* the trust row → the hairline 72, inside the hero row so the wheel centres where D5a puts it */
  .cap-shell .cap-nat__get { padding-top: var(--cap-space-lg); }
  .cap-shell .cap-nat__deeper-wrap { padding-top: calc(var(--cap-space-lg) + var(--cap-border-hairline)); }
  .cap-shell .cap-nat:not(:has(.cap-results)) .cap-nat__deeper-wrap { gap: calc(var(--cap-space-gap-6) + var(--cap-space-gap-5)); }   /* D5a: "Go deeper" → the card 22 */
  .cap-shell .cap-nat__bullets { margin-top: calc(var(--cap-space-gap-6) + var(--cap-space-gap-3)); }
  .cap-shell .cap-nat:not(:has(.cap-results)) .cap-nat__faq { margin-top: calc(var(--cap-space-band-close) + var(--cap-space-gap-5)); }
  .cap-shell .cap-nat .cap-nat__faq .cap-faq__head { padding-top: var(--cap-space-block-5); padding-bottom: var(--cap-space-sm); }
  .cap-shell .cap-nat .cap-nat__faq .cap-faq__q { padding: calc(var(--cap-space-row-pad) + var(--cap-border-hairline)) 0; }
  /* the open question carries a hairline above its answer (D5a, as the phone's 2g-1) */
  .cap-shell .cap-nat .cap-nat__faq .cap-faq__item[open] > .cap-faq__q { border-bottom: var(--cap-border-hairline) solid var(--cap-color-line); margin-bottom: var(--cap-space-md); }   /* the answer 16 under the question's rule, 20 above the next (D5a / D5b markup) */
  .cap-shell .cap-nat .cap-nat__faq .cap-faq__a { font-size: var(--cap-type-faq-answer); line-height: var(--cap-leading-body); padding-bottom: var(--cap-space-block-4); }
}

/* ─── 2g-1, the 28 Sep sheet (phone only; D5a and the tablet unchanged) ──────────────────────────────────────────
   The icon opens the hero (calculator.css). "What you get" continues the hero with no rule — the phone's own three
   lines — then "Go deeper" (30 under it) BEFORE Questions (30 under the cards, on the 2px rule). The reading card: the
   eyebrow + line beside the report's cover (92.5 × 120, straight, top-right), the full-width violet button under them.
   The poster card: a 150 photo over the copy, the phone's line, the full-width ink button. */
.cap-shell .cap-nat__bullets--m, .cap-shell .cap-nat__cover, .cap-shell .cap-nat__poster-media, .cap-shell .cap-nat__line-m { display: none; }
@media (max-width: 699px) {
  .cap-shell .cap-nat__bullets--d, .cap-shell .cap-nat__line-d { display: none; }
  .cap-shell .cap-nat__bullets--m { display: flex; margin-top: var(--cap-space-gap-7); }   /* 12 under the label's 1.2 line box = 14 here (the sheet's label sits on a 20.4 line in a 1.45 block) */
  .cap-shell .cap-nat__line-m { display: inline; }
  .cap-shell .cap-nat__below { display: flex; flex-direction: column; }
  .cap-shell .cap-nat__main { display: contents; }
  .cap-shell .cap-nat__get { order: 1; }
  .cap-shell .cap-nat__deeper-wrap { order: 2; }
  .cap-shell .cap-nat__faq { order: 3; }

  .cap-shell .cap-nat__deeper-card--reading { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "eyebrow cover" "line cover" "btn btn"; column-gap: var(--cap-space-md); row-gap: var(--cap-space-gap-5); align-items: start; padding: var(--cap-space-block-4); }
  .cap-shell .cap-nat__deeper-card--reading > .cap-eyebrow { grid-area: eyebrow; }
  .cap-shell .cap-nat__deeper-card--reading > .cap-lede { grid-area: line; }
  .cap-shell .cap-nat__deeper-card--reading .cap-nat__deeper-icon { display: none; }
  .cap-shell .cap-nat__cover { grid-area: cover; display: block; width: var(--cap-mp-nat-cover-w); height: var(--cap-mp-nat-cover-h); background: var(--cap-color-bg); box-shadow: var(--cap-shadow-dark); overflow: hidden; }
  .cap-shell .cap-nat__cover img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 0; }
  .cap-shell .cap-nat__deeper-card--reading .cap-nat__deeper-btn { grid-area: btn; }

  .cap-shell .cap-nat__deeper-card--poster { padding: 0; gap: 0; overflow: hidden; }
  .cap-shell .cap-nat__poster-media { display: block; height: var(--cap-mp-nat-poster-img-h); background: var(--cap-color-bg-deep); }
  .cap-shell .cap-nat__poster-media img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 42%; }
  .cap-shell .cap-nat__deeper-card--poster > .cap-eyebrow { margin: var(--cap-space-md) var(--cap-space-block-4) 0; }
  .cap-shell .cap-nat__deeper-card--poster > .cap-lede { margin: var(--cap-space-gap-5) var(--cap-space-block-4) 0; }
  .cap-shell .cap-nat__deeper-card .cap-lede--card { font-size: var(--cap-type-lede); line-height: var(--cap-mp-leading-sub); }
  .cap-shell .cap-nat__deeper-card--poster .cap-lede--card { color: var(--cap-color-text-secondary); }
  .cap-shell .cap-nat:not(:has(.cap-results)) .cap-nat__faq { margin-top: var(--cap-space-block-6); }
  .cap-shell .cap-nat .cap-nat__get > .cap-section, .cap-shell .cap-nat .cap-nat__deeper-wrap > .cap-section, .cap-shell .cap-nat .cap-nat__faq .cap-faq__head .cap-section { display: block; line-height: var(--cap-leading-tight); }   /* the labels on their own 1.2 line (20.4), as the sheet sets them */
  .cap-shell .cap-nat .cap-nat__faq .cap-faq__head { line-height: var(--cap-leading-tight); }
  .cap-shell .cap-nat__deeper { gap: var(--cap-space-lg); }   /* the two cards 24 apart (the sheet's 12 + its own 12) */
  .cap-shell .cap-nat .cap-nat__faq .cap-faq__item[open] > .cap-faq__q { border-bottom: var(--cap-border-hairline) solid var(--cap-color-line); }
  .cap-shell .cap-nat .cap-nat__faq .cap-faq__a { padding-top: var(--cap-space-gap-6); }
  .cap-shell .cap-nat .cap-nat__faq .cap-faq-q { font-size: var(--cap-mp-type-gyr-faq-q); line-height: var(--cap-mp-leading-gyr-faq-q); letter-spacing: var(--cap-mp-track-gyr-faq-q); }
  .cap-shell .cap-nat .cap-nat__faq .cap-faq__a { font-size: var(--cap-mp-type-gyr-faq-a); line-height: var(--cap-mp-leading-sub); }
  .cap-shell .cap-nat__deeper-card--poster > .cap-nat__deeper-btn { margin: calc(var(--cap-space-gap-5) + var(--cap-space-gap-1)) var(--cap-space-block-4) var(--cap-space-block-4); }
}

/* BELOW 360 THE EYEBROW TAKES THE BOX'S FIRST LINE (owner 2026-10-06, round 36 follow-up): beside the sample cover
   "✦ THE FULL READING" broke onto two lines at 320 (one line from ~330 in Chrome — Safari's type is a hair wider). Below 360
   it runs the box's full width and the cover starts under it, beside the lede. 360 and up keep the sheet's layout. */
@media (max-width: 359px) {
  .cap-shell .cap-nat__deeper-card--reading { grid-template-areas: "eyebrow eyebrow" "line cover" "btn btn"; }
}

/* 2g-2 (28 Sep, phone): with a chart on the page the landing's go-deeper pair steps aside — the results carry "Go deeper",
   the band and the poster card; Questions 30 under the poster card */
@media (max-width: 699px) {
  .cap-shell .cap-nat:has(.cap-results) .cap-nat__deeper-wrap { display: none; }
  .cap-shell .cap-nat:has(.cap-results) .cap-nat__faq { margin-top: var(--cap-space-block-6); }
}

/* ═══ 700–1279 · THE TABLET SHEETS T6a (1024) / T6a-820 (1 Oct 2026), the form state ═══════════════════════════════════════
   The hero is the home's tablet hero (calculator.css) with the landing's own steps: the h1 balanced in 16ch, the lede 32 above
   the card, the button 24 under the helper; 48 above the icon, 56 under the caption. Then ONE column at 56 apart, in the
   phone's order — What you get · Go deeper · Questions: "What you get" on a rule (its three ✦ lines 18 · .02em, sentence case),
   "Go deeper" on a rule over the reading card alone (D5a's — the poster card is the phone's): the copy beside two report pages
   (280), the headline 30, the violet button hugging its label; Questions on the 2px rule. */
@media (min-width: 700px) and (max-width: 1279px) {
  .cap-shell .cap-nat:not(:has(.cap-results)) .cap-calc { padding-top: var(--cap-space-field-h); padding-bottom: var(--cap-space-band-close); }
  .cap-shell .cap-calc--landing .cap-calc__h1 { max-width: 16ch; text-wrap: balance; }
  .cap-shell .cap-calc--landing .cap-calc__intro { margin-bottom: var(--cap-space-sm); text-wrap: pretty; }
  .cap-shell .cap-nat .cap-calc--landing .cap-calc__submit { margin-top: var(--cap-space-gap-7); }   /* (0,4,0): calculator.css loads after this sheet */
  .cap-shell .cap-nat:not(:has(.cap-results)) .cap-nat__below { display: flex; flex-direction: column; gap: var(--cap-space-band-close); padding-bottom: var(--cap-space-hero-open); }
  .cap-shell .cap-nat__main { display: contents; }
  .cap-shell .cap-nat__get { order: 1; }
  .cap-shell .cap-nat__deeper-wrap { order: 2; }
  .cap-shell .cap-nat__faq { order: 3; }
  .cap-shell .cap-nat__get, .cap-shell .cap-nat__deeper-wrap { display: flex; flex-direction: column; gap: var(--cap-space-block-4); margin: 0; padding-top: var(--cap-space-section-head-above); border-top: var(--cap-border-hairline) solid var(--cap-color-line); }
  .cap-shell .cap-nat__get > .cap-section, .cap-shell .cap-nat__deeper-wrap > .cap-section { line-height: normal; }
  .cap-shell .cap-nat__bullets--d { margin: 0; gap: var(--cap-space-chip-gap); text-transform: none; font-size: var(--cap-type-card-title); letter-spacing: var(--cap-track-data); line-height: var(--cap-leading-lede-hero); color: var(--cap-color-text); }
  .cap-shell .cap-nat__bullet { gap: var(--cap-space-chip-gap); }
  .cap-shell .cap-nat__star { flex: none; color: var(--cap-color-primary); }
  .cap-shell .cap-nat__deeper { grid-template-columns: minmax(0, 1fr); gap: 0; }
  .cap-shell .cap-nat__deeper-card--poster { display: none; }
  .cap-shell .cap-nat__deeper-card--reading { display: grid; grid-template-columns: minmax(0, 1fr) var(--cap-nat-pages-col-mid); grid-template-rows: minmax(var(--cap-space-panel-pad), 1fr) auto auto auto minmax(var(--cap-space-panel-pad), 1fr); grid-template-areas: ". pages" "eyebrow pages" "head pages" "btn pages" ". pages"; padding: 0; gap: 0; border: 0; overflow: hidden; color: var(--cap-color-on-ink); }
  .cap-shell .cap-nat__deeper-card--reading > .cap-lede, .cap-shell .cap-nat__deeper-card--reading .cap-nat__deeper-icon, .cap-shell .cap-nat__deeper-card--reading .cap-nat__cover { display: none; }
  .cap-shell .cap-nat__deeper-card--reading > .cap-eyebrow { grid-area: eyebrow; margin: 0 var(--cap-space-panel-pad); font-size: var(--cap-type-eyebrow); letter-spacing: var(--cap-track-eyebrow); line-height: normal; }
  .cap-shell .cap-nat__deeper-card--reading > .cap-eyebrow::before { content: "✦"; letter-spacing: 0; margin-right: var(--cap-space-gap-4); }
  .cap-shell .cap-nat__deeper-h { grid-area: head; display: block; max-width: 18ch; margin: var(--cap-space-md) var(--cap-space-panel-pad) 0; font-family: var(--cap-font-display-sm); font-weight: 800; font-size: var(--cap-type-form-head); line-height: var(--cap-leading-form-head); letter-spacing: var(--cap-track-form-head); color: var(--cap-color-on-ink); text-wrap: pretty; }
  .cap-shell .cap-nat__deeper-card--reading .cap-nat__deeper-btn { grid-area: btn; justify-self: start; margin: var(--cap-space-block-5) var(--cap-space-panel-pad) 0; padding: var(--cap-btn-pad-large); font-size: var(--cap-type-btn-large); letter-spacing: var(--cap-track-btn-large); line-height: var(--cap-leading-btn-large); color: var(--cap-color-surface); }
  @media (hover: hover) { .cap-shell .cap-nat__deeper-card--reading:hover .cap-nat__deeper-btn { background: var(--cap-color-bg); color: var(--cap-color-text); } }   /* T6a: the card is the link — its hover turns the button cream */
  .cap-shell .cap-nat__pages { grid-area: pages; align-self: center; display: block; position: relative; height: var(--cap-nat-pages-h-mid); }
  .cap-shell .cap-nat__pages img { position: absolute; display: block; width: var(--cap-nat-page-w-mid); height: var(--cap-nat-page-h-mid); object-fit: cover; object-position: 50% 0; background: var(--cap-color-bg); box-shadow: var(--cap-shadow-dark); }
  .cap-shell .cap-nat__pages img:first-child { left: -1px; top: 20px; transform: rotate(-4deg); }
  .cap-shell .cap-nat__pages img + img { left: 80px; top: 40px; transform: rotate(5deg); }
  .cap-shell .cap-nat:not(:has(.cap-results)) .cap-nat__faq { margin-top: 0; }
  .cap-shell .cap-nat .cap-nat__faq .cap-faq__head { padding-top: var(--cap-space-block-5); padding-bottom: var(--cap-space-gap-6); line-height: normal; }
  .cap-shell .cap-nat .cap-nat__faq .cap-faq__head .cap-section { line-height: normal; }
  .cap-shell .cap-nat .cap-nat__faq .cap-faq__q { padding: var(--cap-space-row-pad) 0; }
  .cap-shell .cap-nat .cap-nat__faq .cap-faq-q { line-height: var(--cap-leading-faq-q-mid); }   /* T6a: the question on a 1.3 line (weight 500 stays — the owner's FAQ rule of 29 Sep) */
  .cap-shell .cap-nat .cap-nat__faq .cap-faq__item[open] > .cap-faq__q { border-bottom: var(--cap-border-hairline) solid var(--cap-color-line); }
  .cap-shell .cap-nat .cap-nat__faq .cap-faq__a { padding: var(--cap-space-md) 0 var(--cap-space-block-4); font-size: var(--cap-type-lede); line-height: var(--cap-leading-body); }
}

/* THE FOOTER GAP (owner 2026-10-02): from the last thing on the page to the footer, 64 from 700 up and 40 on a phone — the
   token's pair (--cap-space-footer-gap). Appended last so it wins over the page's earlier end spacing. */
.cap-shell .cap-nat { padding-bottom: var(--cap-space-footer-gap); }
@media (min-width: 700px) and (max-width: 1279px) {
  .cap-shell .cap-nat:not(:has(.cap-results)) .cap-nat__below { padding-bottom: 0; }   /* it added a second 64 */
}