/**
 * Shared marketing section rhythm for Gutenberg-migrated pages.
 *
 * Classes (add via block Advanced → Additional CSS class(es)):
 *   .section-tag   — uppercase eyebrow (e.g. DAMAGE PROTECTION)
 *   .section-title — section H2
 *   .section-sub   — supporting copy under the title
 *   .section-intro — optional wrapper for tag + title + sub (often with .text-center)
 *
 * Section band padding uses global .section / .section-sm from style.css.
 * Page CSS (shipping.css, solutions.css, …) may override hero / dark-band variants.
 */

.section-tag {
  display: inline-block;
  font-size: var(--fs-xxs, 11px);
  font-weight: var(--fw-semibold, 600);
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--gold);
  margin: 0 0 12px;
}

.section-title {
  font-size: var(--fs-h2, clamp(28px, 3.8vw, 42px));
  font-weight: var(--fw-medium, 500);
  color: var(--navy);
  margin: 0 0 16px;
  line-height: 1.2;
}

.section-sub {
  font-size: var(--fs-body-lg, 17px);
  line-height: 1.7;
  color: var(--text-mid);
  max-width: 640px;
  margin: 0 0 48px;
}

.text-center .section-sub,
.section-intro.text-center .section-sub,
.section-intro .section-sub {
  margin-left: auto;
  margin-right: auto;
}

/* Wrapper for tag → title → sub stack */
.section-intro {
  margin: 0;
}

.section-intro .section-tag {
  margin-bottom: 12px;
}

.section-intro .section-title {
  margin-bottom: 16px;
}

.section-intro .section-sub {
  margin-bottom: 48px;
}

/* Consistent gap after intro before the first content grid/table */
.section-intro + * {
  margin-top: 0;
}

/* Vertical rhythm between successive .section bands (style.css already pads .section) */
.section + .section {
  /* padding handles separation; avoid double margin from block wrappers */
  margin-top: 0;
}