/* ─────────────────────────────────────────────────────────────────
   Block: CTA — final-close block on dark (ink) inner card.

   Default surrounding scheme is paper; the inner card is forced to
   ink so the final CTA always reads as the highest-contrast moment.
   The check-list `::before` SVG-glyph recipe lives in design-system.css
   (`.section .has-list-checked ul li::before`), so this module no
   longer ships its own — only block-unique behavior remains here.
   ───────────────────────────────────────────────────────────────── */

.block-cta {
  background: var(--scheme-bg);
  color: var(--scheme-fg);
  font-family: var(--ds-font-body);
}

/* Inner card — promoted to ink scheme for max contrast.
   Re-derive scheme tokens so descendants (eyebrow, checks, body)
   pick up ink-on-light values automatically. */
.block-cta .container > .row > .col-12 {
  background: var(--ds-ink);
  border-radius: var(--ds-radius-lg);
  padding: var(--ds-space-7) var(--ds-space-6);
  box-shadow: var(--ds-shadow-lg);
  position: relative;
  overflow: hidden;
  --scheme-bg: var(--ds-ink);
  --scheme-fg: #fff;
  --scheme-fg-soft: rgba(255, 247, 227, 0.85);
  --scheme-fg-mute: rgba(255, 247, 227, 0.65);
  --scheme-rule: var(--ds-rule-dark);
  --scheme-card-bg: rgba(255, 255, 255, 0.06);
  --scheme-card-fg: #fff;
  color: var(--scheme-fg);
}

@media (max-width: 768px) {
  .block-cta .container > .row > .col-12 {
    padding: var(--ds-space-6) var(--ds-space-5);
  }
}

/* Decorative ember + accent radial glow on the dark card (visual interest only) */
.block-cta .container > .row > .col-12::before,
.block-cta .container > .row > .col-12::after {
  content: "";
  position: absolute;
  pointer-events: none;
  border-radius: 50%;
}
.block-cta .container > .row > .col-12::before {
  left: -120px;
  bottom: -120px;
  width: 360px;
  height: 360px;
  background: radial-gradient(circle, rgba(227, 98, 24, 0.32), transparent 70%);
}
.block-cta .container > .row > .col-12::after {
  right: -100px;
  top: -100px;
  width: 280px;
  height: 280px;
  background: radial-gradient(circle, rgba(185, 73, 42, 0.22), transparent 70%);
}
.block-cta .container > .row > .col-12 > * {
  position: relative;
}

/* Column rebalance via CSS grid (sidesteps Bootstrap flex+gutter sizing issues
   that crushed list cols to 30px). One row on desktop, stacked on mobile. */
@media (min-width: 992px) {
  .block-cta .container > .row > .col-12 > .row {
    display: grid !important;
    grid-template-columns: 1.6fr 1fr 1fr 1fr;
    gap: var(--ds-space-5);
    align-items: center;
    margin: 0 !important;
  }
  .block-cta .container > .row > .col-12 > .row > .col-lg-4,
  .block-cta .container > .row > .col-12 > .row > .col-lg-3,
  .block-cta .container > .row > .col-12 > .row > .col-lg-2 {
    flex: unset !important;
    max-width: unset !important;
    width: auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}
@media (max-width: 991px) {
  .block-cta .container > .row > .col-12 > .row > div + div {
    margin-top: var(--ds-space-5);
  }
  .block-cta .container > .row > .col-12 > .row > .col-lg-2 {
    width: 100%;
    text-align: left !important;
  }
}

/* Title + subtitle — on dark.
   Tighter title size than default section h2 so the final CTA fits
   horizontally next to the two check columns and the button. */
.block-cta .section-title h1,
.block-cta .section-title h2,
.block-cta .section-title h3 {
  color: var(--scheme-fg);
  font-size: clamp(1.75rem, 3.2vw, 2.4rem);
  margin-bottom: var(--ds-space-3);
  line-height: 1;
  text-transform: uppercase;
}
.block-cta .section-title em {
  color: var(--ds-cta);
}
.block-cta .section-subtitle,
.block-cta .section-subtitle p {
  color: var(--scheme-fg-soft);
  font-size: var(--ds-fs-body);
}

/* Checked list — body padding + size only.
   Bullet glyph (`::before` moss-circle SVG) comes from design-system.css. */
.block-cta .has-list-checked ul {
  padding-left: 0;
  list-style: none;
  margin: 0;
}
.block-cta .has-list-checked li {
  color: var(--scheme-fg-soft);
  font-size: var(--ds-fs-body-sm);
  line-height: 1.45;
}
.block-cta .has-list-checked li strong {
  color: var(--scheme-fg);
}