/* ─────────────────────────────────────────────────────────────────
   block-icons-text — clean grid (W9-A6 rebuild)
   - Mobile-first: 1col / 2col ≥640px / 3col ≥992px
   - 48px icon (currentColor), h3 title, 1-line description
   - Hover: card lifts 2px, icon recolours to --hover-token
   - No water-fill / bubble / autoplay cycling
   ───────────────────────────────────────────────────────────── */

/* Image / SVG scaling guards */
.block-icons-text img,
.block-icons-text svg {
  max-width: 100%;
  height: auto;
}

/* ── Grid (mobile-first 1-up) ─────────────────────────────── */
.block-icons-text .icons-text-grid {
  list-style: none;
  margin: 0;
  padding: var(--ds-space-3, 12px) 0 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--ds-space-4, 16px);
}

.block-icons-text .icons-text-card-wrapper {
  display: block;
  list-style: none;
}

/* ── Link wrapper (when href present) ─────────────────────── */
.block-icons-text .icons-text-card-link {
  text-decoration: none;
  color: inherit;
  display: block;
  height: 100%;
  border-radius: var(--ds-radius, 8px);
  outline: none;
}

.block-icons-text .icons-text-card-link:focus-visible {
  /* Senior-UX 2026-05-07: high-contrast token-driven focus ring. */
  outline: none;
  box-shadow: var(--ds-focus-ring);
}

/* ── Card ─────────────────────────────────────────────────── */
.block-icons-text .icons-text-card {
  /* Senior-UX 2026-05-07: token-driven backgrounds (was #fff hex), AARP tap floor. */
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  text-align: left;
  padding: var(--ds-space-5, 24px);
  background: var(--scheme-card-bg, var(--ds-paper));
  color: var(--scheme-card-fg, var(--ds-ink));
  border-radius: var(--ds-radius, 8px);
  border: 1px solid var(--scheme-rule, rgba(0, 0, 0, 0.08));
  box-shadow: var(--ds-shadow-sm, 0 1px 2px rgba(14, 15, 12, 0.06));
  transition: transform 200ms var(--ds-ease, ease-out),
              box-shadow 200ms var(--ds-ease, ease-out),
              border-color 150ms var(--ds-ease, ease-out);
  height: 100%;
  cursor: default;
  min-height: var(--ds-touch-target, 48px);
}

.block-icons-text .icons-text-card.is-clickable { cursor: pointer; }

.block-icons-text .icons-text-card-link:hover .icons-text-card,
.block-icons-text .icons-text-card-link:focus-visible .icons-text-card,
.block-icons-text .icons-text-card.is-clickable:hover {
  transform: translateY(-2px);
  box-shadow: var(--ds-shadow-md, 0 8px 24px rgba(14, 15, 12, 0.08));
  border-color: color-mix(in srgb, var(--hover-token, var(--ds-cta)) 35%, transparent);
}

/* ── Icon container ───────────────────────────────────────── */
.block-icons-text .icons-text-icon {
  /* Senior-UX 2026-05-07: token-driven default ink (was #1a1a1a). */
  position: relative;
  width: calc(var(--icon-size, 48px) + 16px);
  height: calc(var(--icon-size, 48px) + 16px);
  min-width: var(--ds-touch-target, 48px);
  min-height: var(--ds-touch-target, 48px);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 0 var(--ds-space-4, 16px) 0;
  border-radius: var(--ds-radius, 8px);
  background: color-mix(in srgb, var(--hover-token, var(--ds-cta)) 8%, transparent);
  color: var(--ds-ink);
  transition: background 200ms var(--ds-ease, ease-out),
              color 150ms var(--ds-ease, ease-out);
  flex-shrink: 0;
}

.block-icons-text .icons-text-icon img,
.block-icons-text .icons-text-icon svg {
  width: var(--icon-size, 48px);
  height: var(--icon-size, 48px);
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  color: inherit;
  fill: none;
  stroke: currentColor;
  transition: color 150ms var(--ds-ease, ease-out);
}

/* Hover: icon recolours to --hover-token (CTA orange by default) */
.block-icons-text .icons-text-card-link:hover .icons-text-icon,
.block-icons-text .icons-text-card-link:focus-visible .icons-text-icon,
.block-icons-text .icons-text-card.is-clickable:hover .icons-text-icon {
  background: color-mix(in srgb, var(--hover-token, var(--ds-cta)) 16%, transparent);
  color: var(--hover-token, var(--ds-cta));
}

/* Static-card hover (when no link wrapper) */
.block-icons-text .icons-text-card:not(.is-clickable):hover .icons-text-icon {
  color: var(--hover-token, var(--ds-cta));
}

/* ── Content ──────────────────────────────────────────────── */
.block-icons-text .icons-text-content {
  display: flex;
  flex-direction: column;
  gap: var(--ds-space-2, 8px);
  width: 100%;
}

.block-icons-text .icons-text-title {
  /* Senior-UX 2026-05-07: humanist sans, sentence-case h3 (≥24px) for word-shape
     legibility (Anton-uppercase fails older readers below 24px). Uses .ds-h3-humane
     equivalent via tokens. */
  font-family: var(--ds-font-body, 'DM Sans', sans-serif);
  font-size: var(--ds-fs-h3, 1.5rem);
  font-weight: 700;
  text-transform: none;
  letter-spacing: 0;
  color: var(--scheme-card-fg, var(--ds-ink));
  margin: 0;
  line-height: var(--ds-lh-display, 1.2);
  transition: color 150ms var(--ds-ease, ease-out);
}

.block-icons-text .icons-text-card-link:hover .icons-text-title,
.block-icons-text .icons-text-card-link:focus-visible .icons-text-title,
.block-icons-text .icons-text-card.is-clickable:hover .icons-text-title {
  color: var(--hover-token, var(--ds-cta));
}

.block-icons-text .icons-text-description {
  /* Senior-UX 2026-05-07: token line-height (1.6) and ink fallback (was #1a1a1a). */
  font-family: var(--ds-font-body, 'DM Sans', sans-serif);
  font-size: var(--ds-fs-body, 1.125rem);
  color: var(--scheme-fg-soft, color-mix(in srgb, var(--ds-ink) 75%, transparent));
  line-height: var(--ds-lh-body, 1.6);
  margin: 0;
}

.block-icons-text .icons-text-cta {
  /* Senior-UX 2026-05-07: ≥16px CTA label (was 0.875rem = 14px). */
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: var(--ds-space-2, 8px);
  font-family: var(--ds-font-body, 'DM Sans', sans-serif);
  font-size: var(--ds-fs-body-sm, 1rem);
  font-weight: 600;
  color: var(--hover-token, var(--ds-cta));
  letter-spacing: 0.01em;
  transition: gap 150ms var(--ds-ease, ease-out);
}

.block-icons-text .icons-text-cta svg {
  width: 14px;
  height: 14px;
  transition: transform 200ms var(--ds-ease, ease-out);
}

.block-icons-text .icons-text-card-link:hover .icons-text-cta svg,
.block-icons-text .icons-text-card-link:focus-visible .icons-text-cta svg {
  transform: translateX(4px);
}

/* ── Tablet: 2-up (≥640px) ───────────────────────────────── */
@media (min-width: 640px) {
  .block-icons-text .icons-text-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--ds-space-5, 24px);
  }
}

/* ── Desktop: 3-up (≥992px) ─────────────────────────────── */
@media (min-width: 992px) {
  .block-icons-text .icons-text-grid {
    grid-template-columns: repeat(var(--ds-cols-desktop, 3), minmax(0, 1fr));
  }
}

/* ── Reduced motion ───────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  .block-icons-text .icons-text-card,
  .block-icons-text .icons-text-icon,
  .block-icons-text .icons-text-icon img,
  .block-icons-text .icons-text-icon svg,
  .block-icons-text .icons-text-title,
  .block-icons-text .icons-text-cta,
  .block-icons-text .icons-text-cta svg {
    transition: none !important;
  }
  .block-icons-text .icons-text-card-link:hover .icons-text-card,
  .block-icons-text .icons-text-card.is-clickable:hover {
    transform: none;
  }
}


/* ── Bug fix 2026-05-07-bugs: defend against #features ul li::before global checkmark leak (theme.min.css). ── */
.block-icons-text .icons-text-grid li::before,
.block-icons-text .icons-text-card-wrapper::before {
  content: none !important;
  background: none !important;
  display: none !important;
}
