/* ─────────────────────────────────────────
   SPONSORS & PARTNERS — Page-specific Styles
   EEST NJT Racing Circuit
   Tier system lives in the FROZEN css/racing-enhancements.css;
   this file page-scopes every V3 fix via .njt-partners-section overrides.
   Canonical section headers migrate to .njt-section__header (components.css).
───────────────────────────────────────── */

/* ═══════════════════════════════════════
   0A. WIDTH NORMALIZATION — Match Header (1400px)
   Header inner: max-width 1400px, 32px side padding.
   All sections use container--wide (1400px) + 32px padding.
═══════════════════════════════════════ */
.sp-stats,
.sp-why-partner,
.sp-packages,
.sp-circuit-teaser,
.sp-final-cta,
.njt-partners-section,
.njt-section {
  padding-left: 0;
  padding-right: 0;
}
.sp-stats .container.container--wide,
.sp-why-partner .container.container--wide,
.sp-packages .container.container--wide,
.sp-circuit-teaser .container.container--wide,
.sp-final-cta .container.container--wide,
.njt-partners-section .container.container--wide,
.njt-section .container.container--wide {
  padding-left: 32px;
  padding-right: 32px;
}

/* Marquee — full bleed, no container needed */

/* Canonical section subtitle (page-local — sits under .njt-section__title) */
.sp-section-subtitle {
  font-family: var(--font-body);
  font-size: 1rem;
  color: var(--text-white-60);
  max-width: 700px;
  margin: 12px auto 0;
  line-height: 1.6;
}

/* ═══════════════════════════════════════
   0B. HERO SECTION (moved in from the inline <style> block — §3.1)
═══════════════════════════════════════ */
.sp-hero-parallax {
  position: relative;
  min-height: max(700px, 100vh);   /* A14: was `height: 100vh` — hero must be able to grow */
  display: flex;
  align-items: safe center;   /* A14: `safe` — when the content is taller than the hero box, plain `center` overflows the PADDING edge in BOTH directions and puts the breadcrumb under the fixed header. `safe` falls back to start-alignment in exactly that case and never overflows the top. */
  justify-content: center;
  overflow: hidden;
  background: var(--racing-plum);
  margin-top: calc(var(--header-h, 80px) * -1);
  padding-top: var(--hero-pad-top);
  /* A14 — the arithmetic, because it is not obvious. The hero is pulled up by
     `margin-top: -var(--header-h)` so its artwork runs behind the fixed header, so
     content starts at (padding-top − header-h) from the VIEWPORT top, not from the
     section top. A `padding-top: var(--header-h)` therefore puts content at y=0 —
     directly under the header — which is why the breadcrumb was unclickable
     (`elementFromPoint` returned `.site-header__inner`). It has to be header-h TWICE
     plus the gap: once to cancel the negative margin, once to clear the header. */
}

/* Background image — full colour (normal blend), plum scrim handles legibility.
   §3.1 fix: was mix-blend-mode:luminosity @0.45 (grayscale-ish). The golden-hour
   panorama must sell trackside inventory in its real environment, in full colour. */
.sp-hero-parallax__bg {
  position: absolute;
  inset: -10%;
  background-image: url('../assets/01-hero/HERO-001_golden-hour-track-panorama.jpg');
  background-size: cover;
  background-position: center;
  opacity: 1;
  animation: sp-hero-slowPan 30s infinite alternate linear;
  z-index: 0;
}

/* Plum gradient scrim — effective ~0.55 behind the centred content block */
.sp-hero-parallax__overlay {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(42,0,24,0.60) 0%, rgba(42,0,24,0.42) 45%, rgba(42,0,24,0.85) 100%),
    radial-gradient(ellipse at 50% 55%, rgba(42,0,24,0.35) 0%, transparent 70%);
  z-index: 1;
}

/* Ambient glowing orbs */
.sp-hero-parallax__glow {
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
  z-index: 1;
  mix-blend-mode: screen;
}
.sp-hero-parallax__glow--gold {
  width: 500px; height: 500px;
  background: rgba(255,215,0,0.08);
  filter: blur(150px);
  top: -15%; right: -5%;
  animation: sp-hero-float 18s infinite alternate ease-in-out;
}
.sp-hero-parallax__glow--magenta {
  width: 600px; height: 600px;
  background: rgba(212,0,121,0.15);
  filter: blur(120px);
  bottom: -20%; left: -10%;
  animation: sp-hero-float 22s infinite alternate-reverse ease-in-out;
}

/* Floating particles */
.sp-hero-parallax__particles {
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
}
.sp-hero-parallax__particle {
  position: absolute;
  bottom: -10px;
  width: 3px; height: 3px;
  background: #FFD700;
  border-radius: 50%;
  opacity: 0;
  animation: sp-hero-particle-rise linear infinite;
}

/* Ghost kinetic text */
.sp-hero-parallax__kinetic {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 100vw;
  text-align: center;
  font-family: var(--font-display, 'Prompt', sans-serif);
  font-size: 18vw;
  font-weight: 900;
  font-style: italic;
  line-height: 1;
  letter-spacing: 0.04em;
  color: transparent;
  -webkit-text-stroke: 1.5px rgba(255,215,0,0.06);
  background: linear-gradient(180deg, rgba(255,215,0,0.05) 0%, rgba(212,0,121,0.03) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  white-space: nowrap;
  z-index: 2;
  pointer-events: none;
  -webkit-user-select: none;
  user-select: none;
  animation: sp-hero-kinetic-breathe 20s infinite alternate ease-in-out;
}

/* Content layer */
.sp-hero-parallax__content {
  position: relative;
  z-index: 10;
  text-align: center;
  padding: 0 2rem;
  max-width: 960px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
}

/* Breadcrumb */
.sp-hero-parallax__breadcrumb {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 1.5rem;
  font-family: var(--font-heading, 'Prompt', sans-serif);
  font-size: 0.8125rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.sp-hero-parallax__breadcrumb a {
  color: rgba(255,215,0,0.8);
  text-decoration: none;
  transition: color 0.3s;
}
.sp-hero-parallax__breadcrumb a:hover { color: #FFD700; }
.sp-hero-parallax__breadcrumb-sep {
  color: rgba(255,255,255,0.3);
  font-size: 0.75rem;
}
.sp-hero-parallax__breadcrumb-current { color: rgba(255,255,255,0.7); }

/* Badge — now the eyebrow ABOVE the H1 (§3.1: was below subtitle + pulsing) */
.sp-hero-parallax__badge {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  background: rgba(255,215,0,0.9);
  color: #000;
  font-family: var(--font-heading, 'Prompt', sans-serif);
  font-weight: 700;
  font-size: 0.75rem;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  padding: 0.5rem 1.25rem;
  border-radius: var(--radius-pill);
  margin-bottom: 1.25rem;
}
.sp-hero-parallax__badge-dot {
  width: 6px; height: 6px;
  background: #000;
  border-radius: 50%;
}

/* Title */
.sp-hero-parallax__title {
  font-family: var(--font-display, 'Prompt', sans-serif);
  font-style: italic;
  font-size: var(--text-display-xl);   /* A5 / CONVENTIONS #19 — was clamp(3rem, 6vw, 4.5rem) */
  font-weight: 900;
  /* line-height deleted (A30) — components.css §38a governs this h1. */
  margin-bottom: 1.25rem;
  letter-spacing: -0.025em;
  color: #fff;
  max-width: 100%;
  text-shadow: 0 4px 20px rgba(0,0,0,0.55), 0 0 40px rgba(255,215,0,0.15);
}

/* Subtitle */
.sp-hero-parallax__subtitle {
  font-family: var(--font-body, 'Bai Jamjuree', sans-serif);
  font-size: clamp(0.95rem, 1.6vw, 1.15rem);
  color: rgba(255,255,255,0.82);
  font-weight: 400;
  line-height: 1.7;
  max-width: 620px;
  margin: 0 auto 2rem;
}

/* CTA actions */
.sp-hero-parallax__actions {
  display: inline-flex;
  gap: 16px;
  flex-wrap: wrap;
  justify-content: center;
}

/* Scroll indicator */
.sp-hero-parallax__scroll {
  position: absolute;
  bottom: 2rem;
  left: 50%;
  transform: translateX(-50%);
  z-index: 10;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
}
.sp-hero-parallax__scroll-text {
  font-family: var(--font-heading, 'Prompt', sans-serif);
  font-size: 0.625rem;
  font-weight: 600;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.4);
}
.sp-hero-parallax__scroll-line {
  width: 1px; height: 40px;
  background: linear-gradient(to bottom, rgba(255,215,0,0.6), transparent);
  animation: sp-hero-scroll-pulse 2s ease-in-out infinite;
}

/* Accent line at bottom */
.sp-hero-parallax__accent-line {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 3px;
  background: linear-gradient(90deg, transparent, #FFD700 30%, #D40079 70%, transparent);
  z-index: 10;
}

/* ── Hero animations ── */
@keyframes sp-hero-slowPan {
  0% { transform: scale(1) translate(0, 0); }
  100% { transform: scale(1.08) translate(-2%, 1%); }
}
@keyframes sp-hero-float {
  0% { transform: translate(0, 0) scale(1); }
  100% { transform: translate(30px, -30px) scale(1.1); }
}
@keyframes sp-hero-particle-rise {
  0% { transform: translateY(0) scale(0); opacity: 0; }
  10% { opacity: 0.8; transform: translateY(-10vh) scale(1); }
  90% { opacity: 0.3; }
  100% { transform: translateY(-85vh) scale(0.3); opacity: 0; }
}
@keyframes sp-hero-kinetic-breathe {
  0% { transform: translate(-50%, -50%) scale(1); opacity: 1; }
  50% { transform: translate(-50%, -50%) scale(1.02); opacity: 0.6; }
  100% { transform: translate(-50%, -50%) scale(1); opacity: 1; }
}
@keyframes sp-hero-scroll-pulse {
  0%, 100% { opacity: 1; transform: scaleY(1); }
  50% { opacity: 0.4; transform: scaleY(0.6); transform-origin: top; }
}

/* ═══════════════════════════════════════
   1. IMPACT STATS SECTION (§3.3)
═══════════════════════════════════════ */
.sp-stats {
  position: relative;
  padding: var(--section-pad) 0;
  background: var(--section-gradient);
  overflow: hidden;
}

.sp-stats__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
}

.sp-stat-card {
  position: relative;
  text-align: center;
  padding: 32px 20px;
  background: rgba(0, 0, 0, 0.4);
  backdrop-filter: blur(var(--blur-card));
  -webkit-backdrop-filter: blur(var(--blur-card));
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: var(--radius-lg);
  transition: all 0.4s var(--ease-spring);
}

.sp-stat-card:hover {
  transform: translateY(-6px);
  border-color: rgba(255, 215, 0, 0.2);
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.4), 0 0 30px rgba(255, 215, 0, 0.05);
}

/* Unified icon container (§3.3 ↔ §3.6: ONE spec — 48px gold ring) */
.sp-stat-card__icon,
.sp-benefit-card__icon {
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: rgba(255, 215, 0, 0.08);
  border: 1px solid rgba(255, 215, 0, 0.15);
  color: var(--gold);
  transition: all 0.3s ease;
}
.sp-stat-card__icon { margin: 0 auto 16px; }
.sp-benefit-card__icon { margin-bottom: 20px; }

/* §3.3: number scale up to media-kit weight (was clamp(...,40px)) */
.sp-stat-card__number {
  font-family: var(--font-display);
  font-weight: 900;
  font-size: clamp(40px, 4.5vw, 64px);
  color: var(--gold);
  line-height: 1;
  margin-bottom: 8px;
}

.sp-stat-card__label {
  font-family: var(--font-body);
  font-size: 0.85rem;
  color: var(--text-white-60);
  line-height: 1.4;
}

/* ═══════════════════════════════════════
   2. WHY PARTNER SECTION (§3.6)
═══════════════════════════════════════ */
.sp-why-partner {
  position: relative;
  padding: var(--section-pad) 0;
  overflow: hidden;
}

.sp-why-partner__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

.sp-benefit-card {
  position: relative;
  padding: 36px 28px;
  background: rgba(0, 0, 0, 0.35);
  backdrop-filter: blur(var(--blur-card));
  -webkit-backdrop-filter: blur(var(--blur-card));
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: var(--radius-lg);
  transition: all 0.4s var(--ease-spring);
  overflow: hidden;
}

.sp-benefit-card::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--gold), transparent);
  opacity: 0;
  transition: opacity 0.4s ease;
}

.sp-benefit-card:hover::after { opacity: 1; }

.sp-benefit-card:hover {
  transform: translateY(-6px);
  border-color: rgba(255, 215, 0, 0.15);
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.4);
}

.sp-benefit-card:hover .sp-benefit-card__icon {
  background: rgba(255, 215, 0, 0.12);
  border-color: rgba(255, 215, 0, 0.3);
  transform: scale(1.08);
}

.sp-benefit-card__title {
  font-family: var(--font-heading);
  font-weight: 700;
  font-size: 1.1rem;
  color: var(--text-white);
  margin-bottom: 8px;
}

.sp-benefit-card__desc {
  font-family: var(--font-body);
  font-size: 0.88rem;
  color: var(--text-white-60);
  line-height: 1.6;
}

/* §3.6 — the EVIDENCE card: real trackside-branding photo outsells six icon cards.
   Spans 2×2 so the 6-card grid reads with zero orphans. */
.sp-benefit-card--evidence {
  grid-column: span 2;
  grid-row: span 2;
  padding: 0;
  min-height: 360px;
  display: flex;
  align-items: flex-end;
  background: #000;
}
.sp-benefit-card__photo {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
}
/* Scrim stays ≤0.55 across the banners (upper 2/3) so the photo budget renders; only
   the caption band darkens (G6: overlays ≤0.55 over the visible subject). */
.sp-benefit-card--evidence::after {
  content: '';
  position: absolute;
  inset: 0;
  top: 0;
  height: auto;
  background: linear-gradient(180deg, rgba(42,0,24,0.10) 0%, rgba(42,0,24,0.48) 55%, rgba(21,0,16,0.93) 100%);
  opacity: 1;
  z-index: 1;
}
.sp-benefit-card__evidence-body {
  position: relative;
  z-index: 2;
  margin-top: auto;
  padding: 32px 28px;
  width: 100%;
}
.sp-benefit-card__caption {
  margin-top: 12px;
  font-family: var(--font-body);
  font-size: 0.72rem;
  letter-spacing: 0.02em;
  color: var(--text-white-60);
  border-left: 2px solid var(--gold);
  padding-left: 10px;
  line-height: 1.5;
}

/* ═══════════════════════════════════════
   3. SPONSORSHIP PACKAGES (§3.7)
═══════════════════════════════════════ */
.sp-packages {
  position: relative;
  padding: var(--section-pad) 0;
  background: var(--section-gradient);
  overflow: hidden;
}

.sp-packages__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  align-items: stretch;
}

.sp-package-card {
  position: relative;
  padding: 40px 28px;
  background: rgba(0, 0, 0, 0.4);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: var(--radius-lg);
  text-align: center;
  transition: all 0.4s var(--ease-spring);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.sp-package-card--featured {
  padding-top: 48px;                /* §3.7: clear the "แนะนำ" tab from the tier title */
  border-color: rgba(255, 215, 0, 0.25);
  background:
    repeating-linear-gradient(45deg, transparent, transparent 12px, rgba(255,215,0,0.015) 12px, rgba(255,215,0,0.015) 13px),
    radial-gradient(ellipse at 50% 0%, rgba(255,215,0,0.06) 0%, transparent 60%),
    rgba(0, 0, 0, 0.5);
  transform: scale(1.03);
}

.sp-package-card:hover {
  transform: translateY(-8px);
  border-color: rgba(255, 215, 0, 0.3);
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.5), 0 0 40px rgba(255, 215, 0, 0.06);
}

.sp-package-card--featured:hover {
  transform: scale(1.03) translateY(-8px);
}

.sp-package-card__badge {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  font-family: var(--font-heading);   /* mono retired */
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  padding: 6px 20px;
  border-radius: 0 0 var(--radius) var(--radius);
  background: linear-gradient(135deg, var(--gold), #FFC107);
  color: var(--black);
}

.sp-package-card__tier {
  font-family: var(--font-heading);
  font-weight: 700;
  font-size: 1.3rem;
  color: var(--text-white);
  margin-bottom: 6px;
  margin-top: 8px;
}

/* §3.7 — one-line positioning slot (reserved height keeps the three cards aligned) */
.sp-package-card__for {
  font-family: var(--font-body);
  font-size: 0.8rem;
  color: var(--text-white-60);
  line-height: 1.4;
  margin: 0 auto 14px;
  max-width: 24ch;
  min-height: 2.6em;
}

.sp-package-card__tier-accent {
  display: inline-block;
  width: 44px;
  height: 3px;
  border-radius: 2px;
  margin-bottom: 20px;
}

.sp-package-card__tier-accent--bronze { background: var(--tier-bronze); }
.sp-package-card__tier-accent--gold   { background: var(--gold); }
.sp-package-card__tier-accent--silver { background: var(--steel-400); }
/* §3.7 — Platinum reads distinct from Gold: white→gold gradient bar */
.sp-package-card__tier-accent--platinum {
  width: 56px;
  background: linear-gradient(90deg, rgba(255,255,255,0.95), var(--gold));
}

.sp-package-card__features {
  list-style: none;
  text-align: left;
  margin-bottom: 28px;
  flex: 1;
}

.sp-package-card__features li {
  font-family: var(--font-body);
  font-size: 0.85rem;
  color: var(--text-white-60);
  padding: 8px 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.04);
  display: flex;
  align-items: flex-start;
  gap: 10px;
}

.sp-package-card__features li:last-child { border-bottom: none; }

.sp-package-card__check {
  color: var(--gold);
  flex-shrink: 0;
  margin-top: 2px;
}

.sp-package-card .btn-cta { justify-content: center; }

/* ═══════════════════════════════════════
   4. LOGO MARQUEE (§3.2 — CRITICAL: white optical plates)
═══════════════════════════════════════ */
.sp-logo-marquee {
  padding: 36px 0;
  overflow: hidden;
  position: relative;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
  background: rgba(0, 0, 0, 0.2);
}

.sp-logo-marquee::before,
.sp-logo-marquee::after {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  width: 100px;
  z-index: 2;
  pointer-events: none;
}

.sp-logo-marquee::before {
  left: 0;
  background: linear-gradient(to right, var(--bg-dark), transparent);
}

.sp-logo-marquee::after {
  right: 0;
  background: linear-gradient(to left, var(--bg-dark), transparent);
}

.sp-logo-marquee__track {
  display: flex;
  align-items: center;
  gap: 40px;
  animation: tickerScroll 45s linear infinite;
  width: max-content;
}

/* §3.2 — true white plates: every paying brand's mark reads at full strength */
.sp-logo-marquee__item {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 64px;
  padding: 10px 20px;
  background: #fff;
  border-radius: 12px;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.sp-logo-marquee__item img {
  width: auto;
  max-width: 150px;
  object-fit: contain;
  opacity: 1;
  transition: none;
}

/* §3.2 — optical sizing classes applied per mark (aspect judged from each file) */
.sp-logo-marquee__item img.is-emblem  { height: 44px; }   /* square / stacked lockups */
.sp-logo-marquee__item img.is-wordmark { height: 26px; }  /* wide horizontal wordmarks */

.sp-logo-marquee__item:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(0,0,0,0.35);
}

.sp-logo-marquee__dot {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--gold);
  opacity: 0.4;
}

/* ═══════════════════════════════════════
   5. PARTNER TIERS — page-scoped fixes over FROZEN racing-enhancements.css (§3.4)
═══════════════════════════════════════ */

/* §3.4-1 — kill grid orphans. Gold: 3 marks fill one row ≥769px. */
@media (min-width: 769px) {
  .njt-partners-section .njt-partner-tier--gold .njt-partner-tier__grid {
    grid-template-columns: repeat(3, 1fr);
  }
}
/* Silver: flex-wrap centred (7 marks → 4+3, trailing row auto-centres — no void). */
.njt-partners-section .njt-partner-tier--silver .njt-partner-tier__grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 16px;
}
.njt-partners-section .njt-partner-tier--silver .njt-partner-card-v2 {
  flex: 0 1 calc(25% - 12px);
  max-width: calc(25% - 12px);
}

/* §3.4-3 — solid tier keyline so Platinum / Gold / Silver separate at a squint.
   card has overflow:hidden → the bar follows the rounded top corners cleanly. */
.njt-partners-section .njt-partner-card-v2--platinum { --tier-line: var(--racing-yellow); }
.njt-partners-section .njt-partner-card-v2--gold     { --tier-line: var(--tier-gold); }
.njt-partners-section .njt-partner-card-v2--silver   { --tier-line: var(--steel-400); }
.njt-partners-section .njt-partner-card-v2::after {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: var(--tier-line, transparent);
  z-index: 2;
  pointer-events: none;
}

/* §3.4-3 — Gold tier hue → the minted --tier-gold token (retires the ad-hoc #C9A351) */
.njt-partners-section .njt-partner-tier--gold .njt-partner-tier__label { color: var(--tier-gold); }
.njt-partners-section .njt-partner-card-v2--gold .njt-partner-card-v2__role { color: var(--tier-gold); }
.njt-partners-section .njt-partner-card-v2--gold .njt-partner-card-v2__tier-badge {
  color: var(--tier-gold);
  background: rgba(201, 163, 81, 0.12);
  border-color: rgba(201, 163, 81, 0.35);
}

/* §3.4-4 — tier badges + roles → heading font + tracking (mono retired) */
.njt-partners-section .njt-partner-card-v2__tier-badge,
.njt-partners-section .njt-partner-card-v2__role {
  font-family: var(--font-heading);
  letter-spacing: 0.14em;
}

/* §3.4-2 — designed monogram lockups for the two marks with no real asset
   (SAG Racing, Coffee Track). 2-line Prompt-800 lockup on the same white plate. */
.njt-partner-card-v2__logo--monogram {
  box-shadow: inset 0 0 0 1px rgba(26, 5, 16, 0.10);
}
.sp-monogram {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  font-family: var(--font-heading);
  line-height: 1;
  text-align: center;
  padding: 4px;
}
.sp-monogram__mark {
  font-weight: 800;
  font-size: 1.4rem;
  letter-spacing: 0.01em;
  color: var(--ink);
}
.sp-monogram__word {
  font-weight: 700;
  font-size: 0.58rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
}
/* .sp-monogram--sag retired with the SAG Racing card (V4/G8, unsourced partner);
   the recipe is kept commented so the card can be restored verbatim if the
   operator supplies documentation:
   .sp-monogram--sag .sp-monogram__word { color: var(--steel-600); } */
.sp-monogram--coffee .sp-monogram__word  { color: var(--magenta); }

/* §3.5 — CREDENTIALS as a rail-labelled row (matches the tier rails, not floating pills) */
.njt-partner-tier--credentials { margin-top: 40px; }
.njt-partner-tier__label--credentials { color: var(--gold); }
.njt-partner-tier--credentials .njt-credential-badges-v2 { margin-top: 4px; }

/* ═══════════════════════════════════════
   6. EEST CIRCUIT SPONSOR-TEASER BAND (GOAL-V3 §G3 — fact-pack only, zero ฿/rates)
═══════════════════════════════════════ */
.sp-circuit-teaser {
  position: relative;
  overflow: hidden;
  padding: var(--section-pad) 0;
  border-top: 1px solid rgba(255, 215, 0, 0.1);
  border-bottom: 1px solid rgba(255, 215, 0, 0.1);
}
.sp-circuit-teaser__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}
.sp-circuit-teaser__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.sp-circuit-teaser::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(90deg, rgba(42,0,24,0.92) 0%, rgba(42,0,24,0.78) 45%, rgba(42,0,24,0.45) 100%);
}
.sp-circuit-teaser .container { position: relative; z-index: 2; }
.sp-circuit-teaser__inner { max-width: 660px; }
/* Eyebrow consolidated onto the canonical .njt-section__overline (R2 §Consolidation) —
   the page dialect was byte-identical bar a 2px margin. */
.sp-circuit-teaser__status {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 5px 14px;
  border-radius: var(--radius-pill);
  background: rgba(255, 215, 0, 0.10);
  border: 1px solid rgba(255, 215, 0, 0.28);
  color: var(--gold);
  font-family: var(--font-heading);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  margin-bottom: 18px;
}
.sp-circuit-teaser__status::before {
  content: '';
  width: 7px; height: 7px;
  border-radius: 50%;
  background: var(--gold);
}
.sp-circuit-teaser__title {
  font-family: var(--font-display);
  font-weight: 900;
  font-style: italic;
  font-size: clamp(26px, 3.4vw, 40px);
  line-height: 1.2;      /* Thai wrapped-heading floor (LESSONS #2) */
  color: var(--text-white);
  margin-bottom: 14px;
}
.sp-circuit-teaser__lead {
  font-family: var(--font-body);
  font-size: 1rem;
  color: var(--text-white-80);
  line-height: 1.6;
  margin-bottom: 20px;
  max-width: 560px;
}
.sp-circuit-teaser__facts {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 28px;
}
.sp-circuit-teaser__fact {
  font-family: var(--font-heading);
  font-size: 0.8rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  color: var(--text-white);
  padding: 7px 14px;
  border-radius: var(--radius-pill);
  background: rgba(0, 0, 0, 0.35);
  border: 1px solid rgba(255, 255, 255, 0.12);
}
.sp-circuit-teaser__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  align-items: center;
}

/* ═══════════════════════════════════════
   7. FINAL PARTNERSHIP CTA (§3.8 — campaign pattern: photo-backed, dual CTA)
═══════════════════════════════════════ */
.sp-final-cta {
  position: relative;
  text-align: center;
  padding: 120px 0;   /* horizontal gutter carried by .container--wide (32px), so the box reaches the full 1400 header width — D6c */
  min-height: 460px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border-top: 1px solid rgba(255, 215, 0, 0.1);
  border-bottom: 1px solid rgba(255, 215, 0, 0.1);
}
.sp-final-cta__bg { position: absolute; inset: 0; z-index: 0; }
.sp-final-cta__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0.5;
  filter: saturate(0.9);
}
.sp-final-cta::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(180deg, rgba(42,0,24,0.72) 0%, rgba(0,0,0,0.5) 45%, rgba(42,0,24,0.80) 100%),
    radial-gradient(ellipse at 50% 50%, rgba(255,215,0,0.06) 0%, transparent 60%);
  pointer-events: none;
}
.sp-final-cta .container { position: relative; z-index: 2; width: 100%; }
.sp-final-cta__title {
  font-family: var(--font-heading);
  font-weight: 700;
  font-size: clamp(28px, 4.5vw, 44px);
  color: var(--text-white);
  margin-bottom: 16px;
}
.sp-final-cta__subtitle {
  font-family: var(--font-body);
  font-size: 16px;
  color: var(--text-white-80);
  margin: 0 auto 32px;
  max-width: 600px;
  line-height: 1.6;
}
.sp-final-cta__actions {
  display: flex;
  gap: 16px;
  justify-content: center;
  flex-wrap: wrap;
  margin-bottom: 20px;
}
.sp-final-cta__direct {
  font-family: var(--font-body);
  font-size: 0.9rem;
  color: var(--text-white-60);
}
.sp-final-cta__direct a {
  color: var(--gold);
  font-weight: 600;
  border-bottom: 1px solid rgba(255,215,0,0.3);
  transition: border-color 0.3s ease;
}
.sp-final-cta__direct a:hover { border-color: var(--gold); }

/* ═══════════════════════════════════════
   8. RESPONSIVE
═══════════════════════════════════════ */
@media (max-width: 1024px) {
  .sp-stats__grid { grid-template-columns: repeat(2, 1fr); }
  .sp-packages__grid {
    grid-template-columns: 1fr;
    max-width: 480px;
    margin: 0 auto;
  }
  .sp-package-card--featured { transform: none; }
  .sp-package-card--featured:hover { transform: translateY(-8px); }
  .njt-partners-section .njt-partner-tier--silver .njt-partner-card-v2 {
    flex-basis: calc(50% - 8px);
    max-width: calc(50% - 8px);
  }
}

@media (max-width: 768px) {
  .sp-hero-parallax {
    height: auto;
    min-height: auto;
    padding-top: var(--hero-pad-top);
    padding-bottom: 80px;
  }
  .sp-hero-parallax__kinetic { font-size: 24vw; }
  /* A5: mobile font-size override removed — --text-display-xl already clamps to 40px here. */
  .sp-hero-parallax__subtitle { font-size: 0.9rem; }
  .sp-hero-parallax__glow--gold { width: 300px; height: 300px; }
  .sp-hero-parallax__glow--magenta { width: 350px; height: 350px; }
  .sp-hero-parallax__scroll { display: none; }
  .sp-hero-parallax__actions {
    flex-direction: column;
    align-items: stretch;
    width: 100%;
    max-width: 320px;
    margin-top: 1.5rem;
  }
  .sp-hero-parallax__actions .btn-cta { justify-content: center; }

  .sp-stats__grid { grid-template-columns: 1fr 1fr; gap: 16px; }
  .sp-stat-card { padding: 24px 16px; }
  .sp-why-partner__grid { grid-template-columns: 1fr; }
  /* Evidence card resets its 2×2 span in the single-column stack */
  .sp-benefit-card--evidence { grid-column: auto; grid-row: auto; min-height: 280px; }
}

@media (max-width: 640px) {
  .njt-partners-section .njt-partner-tier--silver .njt-partner-card-v2 {
    flex-basis: 100%;
    max-width: 100%;
  }
}

@media (max-width: 480px) {
  .sp-stats__grid { grid-template-columns: 1fr; }
}

/* ═══════════════════════════════════════
   9. REDUCED MOTION — honour prefers-reduced-motion sitewide hygiene
   (§3.2 requires the marquee to become a static centred wrap)
═══════════════════════════════════════ */
@media (prefers-reduced-motion: reduce) {
  .sp-logo-marquee::before,
  .sp-logo-marquee::after { display: none; }
  .sp-logo-marquee__track {
    animation: none;
    flex-wrap: wrap;
    justify-content: center;
    width: auto;
  }
  .sp-hero-parallax__bg,
  .sp-hero-parallax__glow,
  .sp-hero-parallax__particle,
  .sp-hero-parallax__kinetic,
  .sp-hero-parallax__scroll-line {
    animation: none !important;
  }
  .sp-hero-parallax__particles { display: none; }
}

/* ═══════════════════════════════════════════════════════════════════
   V4/G8 — SPONSORS ADDITIONS
   ═══════════════════════════════════════════════════════════════════ */

/* Thai display-break discipline: keep brand lockups and loanwords whole so the
   headings stop splitting mid-word at 390 ("พาร์ทเนอ|ร์", "EEST / Circuit"). */
.sp-nw { white-space: nowrap; }

/* Neutral (non-purchased) badge — used where the card is NOT a paid tier:
   Coffee Track is EEST's own café; FMSCT is the sanctioning federation.
   Deliberately quieter than the metal tiers so the paid tiers keep their value. */
.njt-partners-section .njt-partner-card-v2__tier-badge--neutral {
  color: var(--text-white-70, rgba(255, 255, 255, 0.7));
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(255, 255, 255, 0.18);
}
.njt-partners-section .njt-partner-card-v2--inhouse .njt-partner-card-v2__role {
  color: var(--text-white-60, rgba(255, 255, 255, 0.6));
}
