/* ========================================
   BMW USA — Section Headers
   Source: BUILD_PLAN §3.2 (Text Header)
   ======================================== */

.text-header {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  background: linear-gradient(to bottom, var(--bmw-bg-light), var(--bmw-white));
  overflow: hidden;
}

.text-header.height-xs { height: 48px; }
.text-header.height-s { height: 120px; }
.text-header.height-m { height: 110px; }
.text-header.height-t { height: 150px; }
.text-header.height-a { height: auto; padding: 24px 0; }

@media (min-width: 720px) {
  .text-header.height-m { height: 140px; }
}

@media (min-width: 960px) {
  .text-header.height-t { height: 185px; }
}

@media (min-width: 1200px) {
  .text-header.height-t { height: 262px; }
}

@media (min-width: 1440px) {
  .text-header.height-s { height: 170px; }
  .text-header.height-t { height: 204px; }
}

/* Section Header inner */
.section-header {
  width: 100%;
  max-width: 1600px;
  margin: 0 auto;
  padding: 0 24px;
  text-align: center;
}

.section-header__copy {
  max-width: 800px;
  margin: 0 auto;
}

.section-header__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-size: var(--eyebrow-1-size);
  font-weight: var(--eyebrow-1-weight);
  letter-spacing: var(--eyebrow-1-ls);
  line-height: var(--eyebrow-1-lh);
  text-transform: uppercase;
  color: var(--bmw-light-text);
  margin-bottom: 8px;
}

/* Section header title */
.section-header h2,
.section-header__title {
  font-size: var(--headline-3-size);
  font-weight: var(--headline-3-weight);
  color: var(--bmw-dark-text);
  line-height: 1.15;
  letter-spacing: -0.02em;
}

.section-header p,
.section-header__description {
  font-size: var(--body-default-size);
  color: var(--bmw-medium-text);
  margin-top: 12px;
  line-height: 1.6;
  max-width: 640px;
  margin-left: auto;
  margin-right: auto;
}

/* Dark variant */
.text-header--dark {
  background: var(--bmw-black);
}

.text-header--dark .section-header__title {
  color: var(--bmw-white);
}

.text-header--dark .section-header__description {
  color: rgba(255, 255, 255, 0.7);
}

.text-header--dark .section-header__eyebrow {
  color: rgba(255, 255, 255, 0.6);
}

/* Light-grey variant */
.text-header--light {
  background: var(--bmw-bg-light-grey);
}

/* Slim variant (no background) */
.text-header--slim {
  background: none;
  height: auto;
  padding: 24px 0;
}

/* Responsive */
@media (max-width: 767px) {
  .section-header h2,
  .section-header__title {
    font-size: 1.5rem;
  }
}