/*
 * SHARED BLOCK STYLES
 * ─────────────────────────────────────────────────────────────────────────────
 * Reused across multiple ACF blocks.
 * Include this file in acf-blocks that need section headers & card grids.
 * ─────────────────────────────────────────────────────────────────────────────
 */

/* ── Section Header ────────────────────────────────────── */
.section-header {
  text-align:    center;
  max-width:     640px;
  margin:        0 auto var(--ls-space-12);
}

.section-header__eyebrow {
  font-size:      var(--ls-text-sm);
  font-weight:    var(--ls-font-weight-semibold);
  letter-spacing: var(--ls-tracking-wider);
  text-transform: uppercase;
  color:          var(--ls-color-primary-500);
  margin-bottom:  var(--ls-space-3);
}

.section-header__title {
  font-size:     var(--ls-text-3xl);
  font-weight:   var(--ls-font-weight-bold);
  margin-bottom: var(--ls-space-4);
  line-height:   var(--ls-leading-snug);
}

.section-header__intro {
  font-size:  var(--ls-text-lg);
  color:      var(--ls-color-text-muted);
  line-height: var(--ls-leading-relaxed);
  margin:     0;
}

.section--dark .section-header__title,
.section--dark .section-header__intro {
  color: var(--ls-color-text-inverse);
}

.section--dark .section-header__intro {
  color: rgba(255,255,255,0.7);
}

/* ── Card Grid shared block overrides ──────────────────── */
.card-grid-block__icon {
  padding:         var(--ls-space-6) var(--ls-space-6) 0;
  font-size:       2.5rem;
  color:           var(--ls-color-primary-500);
}

/* Responsive header */
@media (max-width: 768px) {
  .section-header { margin-bottom: var(--ls-space-8); }
  .section-header__title { font-size: var(--ls-text-2xl); }
  .section-header__intro { font-size: var(--ls-text-base); }
}