/**
 * Check Cards
 * Row of dark cards, each topped by a yellow badge circle that overhangs the
 * card's top edge. Repeater-driven: title + description per card.
 */

/* Strip Elementor container padding so the widget manages its own gutters. */
.elementor-column
  > .elementor-element-populated:has(.elementor-widget-agency-check-cards),
.e-con:has(> .e-con-inner > .elementor-widget-agency-check-cards),
.e-con:has(.elementor-widget-agency-check-cards) {
  --padding-top: 0px;
  --padding-right: 0px;
  --padding-bottom: 0px;
  --padding-left: 0px;
  padding: 0 !important;
}

.elementor-section:has(.elementor-widget-agency-check-cards),
.elementor-section:has(.elementor-widget-agency-check-cards) > .elementor-container,
.e-con:has(.elementor-widget-agency-check-cards) {
  max-width: 100% !important;
  width: 100% !important;
}

/* ── Brand tokens — same global-colour chain as icon-cards ───────────────── */
.aew-chkc {
  --aew-chkc-bg:        var(--e-global-color-aew-background, #F8F5F1);
  --aew-chkc-card-bg:   var(--e-global-color-aew-secondary-bg, #305B83);
  --aew-chkc-badge-bg:  var(--e-global-color-aew-cta, #F3C400);
  --aew-chkc-check:     var(--e-global-color-aew-text, #252F37);
  --aew-chkc-badge-border: var(--e-global-color-aew-secondary-bg, #305B83);
}

.aew-chkc *,
.aew-chkc *::before,
.aew-chkc *::after {
  box-sizing: border-box;
}

/* ── Section ─────────────────────────────────────────────────────────────── */
.aew-chkc {
  background-color: var(--aew-chkc-bg);
  width: 100%;
  padding-left: 40px;
  padding-right: 40px;
}

/* ── Inner wrapper ───────────────────────────────────────────────────────── */
.aew-chkc__inner {
  width: 100%;
  max-width: 1440px;
  margin: 0 auto;
  padding: 0;
}

/* ── Grid ────────────────────────────────────────────────────────────────── */
.aew-chkc__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  /* gap owned by grid_gap control */
  align-items: start;
}

/* ── Card wrapper — badge sits above, negative margin-bottom creates
   the overhang so it slides partially over the card's top edge ───────────── */
.aew-chkc__wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
}

/* ── Badge circle ────────────────────────────────────────────────────────── */
.aew-chkc__badge {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background-color: var(--aew-chkc-badge-bg);
  /* Blue ring around the circle (default; width/color editable via the Badge
     style controls). border-box keeps the circle its set size. */
  border: 4px solid var(--aew-chkc-badge-border);
  box-sizing: border-box;
  margin-bottom: -28px; /* overhang amount */
  flex: none;
}

/* ── Check icon ──────────────────────────────────────────────────────────── */
.aew-chkc__check {
  display: block;
  color: var(--aew-chkc-check);
}

/* ── Card ────────────────────────────────────────────────────────────────── */
/* baseline-exception: tall top pad clears the badge overhang */
/* padding owned by card_pad control; border-radius owned by card_radius control */
.aew-chkc__card {
  width: 100%;
  background-color: var(--aew-chkc-card-bg);
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 16px;
}

/* ── Title ───────────────────────────────────────────────────────────────── */
.aew-chkc__title {
  margin: 0;
  color: #FFFFFF;
  font-family: var(--aew-font-heading);
  font-weight: 700;
  font-size: 24px;
  line-height: 1.2;
}

/* ── Description ─────────────────────────────────────────────────────────── */
.aew-chkc__desc {
  margin: 0;
  color: rgba(255, 255, 255, 0.82);
  font-family: var(--aew-font-body, 'Poppins', sans-serif);
  font-weight: 400;
  font-size: 15px;
  line-height: 1.6;
}

/* ── Responsive: tablet ──────────────────────────────────────────────────── */
@media (max-width: 1024px) {
  /* card padding owned by card_pad control; title size by title_typo control */
  .aew-chkc__card {
    min-height: 0;
  }
}

/* ── Responsive: mobile — single column ──────────────────────────────────── */
@media (max-width: 768px) {
  .aew-chkc {
    padding-left: 16px;
    padding-right: 16px;
  }

  .aew-chkc__grid {
    grid-template-columns: 1fr;
    /* gap owned by grid_gap control */
  }

  /* badge mobile sizing stays CSS — structural */
  .aew-chkc__badge {
    width: 56px;
    height: 56px;
    margin-bottom: -24px;
  }

  /* card padding/radius owned by card_pad / card_radius controls;
     title & description sizes owned by title_typo / description_typo controls */
}
