/* ==========================================================================
   Warranty Page (slug `warranty`)
   Scoped to body.cb-warranty — opted in via the body_class filter in
   functions.php. Scoped by slug, not page ID, because page IDs differ between
   local and production (see CLAUDE.md → Page editing workflow). Tokens,
   .pill-btn, .section-wrap and the header treatment come from
   _design-system.css (body.cb-ds); the Astra above-header bar is hidden via
   the cb-no-above-header opt-in.

   This page has no hero, so it keeps the site-wide 139px header clearance
   from _header.css and js/cb-ds-header.js drives the Book Estimate reveal.

   On !important: Spectra's per-post stylesheet (uag-css-<id>.css) targets the
   inner wrap at specificity (0,5,0) —
   `.wp-block-uagb-container.uagb-is-root-container.alignfull.uagb-block-<id> >
   .uagb-container-inner-blocks-wrap` — which outranks any body-class selector
   we can reasonably write. _design-system.css already uses !important on
   .section-wrap for the same reason.
   ========================================================================== */

/* --- Section rhythm ---
   Override the design-system spacing token rather than fighting
   `.section-wrap { padding: var(--section-py) var(--section-px) !important }`
   in _design-system.css. Same specificity as body.cb-ds, but this partial is
   enqueued last in $partials, so it wins on source order — no !important
   needed. 36px per side = 72px between sections (was 160px); the three
   sections are short policy copy and read as one document, not three blocks. */
body.cb-warranty {
  --section-py: 36px;
  --section-py-mobile: 28px;
}

/* Spectra blocks adopt the design-system fonts (not generalized into
   _design-system.css — it would override deliberate per-block fonts on
   existing pages). */
body.cb-warranty .section-wrap .uagb-heading-text {
  font-family: var(--heading-font);
}

/* Headings center over the content column; body copy stays left-aligned —
   long-form policy text is slower to read ragged-left. .section-wrap is a
   centering flex column (_design-system.css), which centers the block *box*
   but leaves its text at the inherited `start`; width:100% stops the block
   from shrink-wrapping so the centering is against the full measure. */
body.cb-warranty .section-wrap .wp-block-uagb-advanced-heading {
  width: 100%;
}

body.cb-warranty .section-wrap .uagb-heading-text {
  text-align: center;
}

/* --- Shared section rhythm ---
   .section-wrap supplies the vertical padding and centering. The design
   system's 1200px measure is too wide for long-form policy copy, so every
   section on this page is constrained to a comfortable reading width. */
body.cb-warranty .section-wrap .uagb-container-inner-blocks-wrap {
  max-width: 820px !important;
}

body.cb-warranty .section-wrap p {
  font-family: var(--body-font);
  line-height: 1.7;
}

/* --- Intro --- */
body.cb-warranty .warranty-intro .uagb-heading-text {
  margin-bottom: 16px;
}

body.cb-warranty .warranty-intro p {
  font-size: 1.05rem;
}

/* --- Coverage ---
   Two warranty types stacked. Takes the shared --section-py rhythm above; the
   gap between the two warranty types is set on the paragraph instead. */
body.cb-warranty .warranty-coverage .wp-block-uagb-advanced-heading + p {
  margin-bottom: 32px;
}

body.cb-warranty .warranty-coverage .uagb-heading-text {
  margin-bottom: 12px;
}

/* --- Exclusions ---
   Set apart from the coverage it qualifies: tinted panel with a left rule in
   the brand red. The tint is mixed from the brand color rather than taken from
   --ast-global-color-6, which is #ffffff on this site and would be invisible. */
body.cb-warranty .warranty-exclusions .uagb-container-inner-blocks-wrap {
  background: color-mix(in srgb, var(--ast-global-color-0) 4%, #ffffff);
  border-left: 4px solid var(--ast-global-color-0);
  border-radius: 6px;
  padding: 32px 36px !important;
}

body.cb-warranty .warranty-exclusions .uagb-heading-text {
  margin-bottom: 12px;
}

body.cb-warranty .warranty-exclusions p:last-child {
  margin-bottom: 0;
}

@media (max-width: 768px) {
  body.cb-warranty .warranty-exclusions .uagb-container-inner-blocks-wrap {
    padding: 24px 22px !important;
  }
}
