/* ===============================
   GENERAL THEME TWEAKS
   =============================== */

/* Remove page title on category archives */
.archive-header { display: none; }

/* Featured slider area background */
.featured-content-posts .post .grid-text,
.featured-content-posts .slide-navs a,
.featured-content-title {
  background: rgba(37, 37, 107, 0.78);
}

/* Active/hover menu & category border color */
.main-navigation ul li.current-menu-item,
.sort-list .current-menu-item,
.main-navigation ul li:hover { border-color: #39FF14; }

/* Footer color */
.site-footer { background: #24256a; }

/* Hero pager tip color */
#hero-pager .pager-tip { border-bottom-color: #24256a; }

/* Category link colors */
.grid-cats a,
.index-posts .grid-cats a,
.sort-list .current-menu-item a { color: #24256a; }

/* Category menu title border */
.category-menu-title { border-color: #39FF14; }

/* Title colors */
#calendar_wrap,
#content .wp-playlist-current-item .wp-playlist-item-title,
#content .wp-playlist-item .wp-playlist-caption,
.category-wrap .featured-content-title,
.entry-header .entry-title a,
.error404 .entry-header .entry-title a,
.full-post-header .entry-title a,
.grid-wrapper .grid-post .entry-title a,
.grid-wrapper .grid-post .entry-title a:hover,
.jetpack-testimonial-shortcode .testimonial-entry .testimonial-entry-title a,
h1, h2, h3, h4, h5, h6, .site-title a { color: #39FF14; }

/* Hide blog posts on home */
.home .featured-content-wrapper { margin-bottom: 0; }
.home .hfeed { display: none; }

/* Slider typography and spacing */
.featured-content-posts .post .entry-title { font-size: 2em; }
div.entry-excerpt p { font-size: .75em; }
.featured-content-posts .post .container { padding-top: 10%; padding-bottom: 10%; }
@media only screen and (max-width: 600px) {
  .featured-content-posts .post .container { padding-top: 60%; padding-bottom: 10%; }
}

/* Global link color (kept as-is; broad selector) */
a { color: #FFFFFF; }

/* Countdown styles */
.wpcdt-countdown-section { display: flex; justify-content: center; gap: 15px; }
.wpcdt-countdown-section .wpcdt-countdown-number {
  color: #FFD700 !important; font-weight: bold; font-size: 2em;
  text-shadow: 2px 2px 8px rgba(255, 215, 0, 0.8);
}
.wpcdt-countdown-section .wpcdt-countdown-label {
  color: #FF0000 !important; font-size: 1.5em; font-weight: bold;
}
@media only screen and (max-width: 768px) {
  .wpcdt-countdown-section .wpcdt-countdown-number { font-size: 1.5em; }
  .wpcdt-countdown-section .wpcdt-countdown-label { font-size: 1.2em; }
}

/* Estenson Racing logo sizing (header) */
html body img.custom-logo,
html body .custom-logo-link img.custom-logo {
  height: 110px !important; max-height: 110px !important;
  width: auto !important; max-width: none !important;
  display: inline-block; vertical-align: middle; margin-right: 16px;
}
html body .custom-logo-link,
html body .site-branding,
html body #masthead,
html body .site-header,
html body .header,
html body .branding,
html body .header-logo {
  display: inline-flex; align-items: center;
  height: auto !important; max-height: none !important; overflow: visible !important;
}
html body .site-header, html body #masthead { min-height: 110px; }
@media (max-width: 768px) {
  html body img.custom-logo,
  html body .custom-logo-link img.custom-logo { height: 70px !important; max-height: 70px !important; }
}

/* Primary navigation bar background */
nav.nav,
nav.nav > ul.menu,
nav.nav #primary-menu,
nav.nav ul.sub-menu {
  background-color: #3858e9 !important; background-image: none !important;
}
/* Remove any overlay layer on the nav */
nav.nav::before, nav.nav::after { content: none !important; background: none !important; }
/* Ensure header wrappers don’t override the nav background */
header.site-header, #masthead, .site-header .header-inner { background: transparent !important; }
/* Link colors on the blue bar */
nav.nav a { color: #ffffff !important; }
nav.nav .menu > li > a:hover,
nav.nav .menu > li.current-menu-item > a { color: #39FF14 !important; }
/* Mobile nav open state */
nav.nav.is-open, nav.nav.open, nav.nav.nav--open { background-color: #3858e9 !important; }


/* ===============================
   SPONSOR STRIP (ESS) — PRONOUNCED BARS + LIFTED TITLE + STATIC GRID
   =============================== */

/* Remove fallback text line */
.ess-offseason { display: none !important; }

/* Tweakables */
.ess-sponsor-strip {
  --barH: 8px;
  --barColor: #3858e9;
  --barGlow: rgba(56, 88, 233, 0.55);
  --stripBg: rgba(10, 12, 40, 0.65);

  /* tile & spacing variables */
  --tileH: 88px;   /* row height */
  --logoH: 72px;   /* max logo height */
  --gap: 28px;     /* original gap (we’ll halve it in the grid) */

  position: relative;
  padding-top: calc(var(--barH) + 12px);
  padding-bottom: calc(var(--barH) + 12px);
  background: var(--stripBg);
  border-radius: 10px;
  box-shadow: 0 10px 24px rgba(0,0,0,0.25);
  overflow: visible; /* to allow lifted title */
  /* Lifted title offset */
  --titleOffset: 40px;
  margin-top: calc(12px + var(--titleOffset));
}

/* Top & bottom bars */
.ess-sponsor-strip::before,
.ess-sponsor-strip::after {
  content: ""; position: absolute; left: 0; right: 0; height: var(--barH);
  background: var(--barColor);
  box-shadow: 0 0 10px var(--barGlow), 0 0 20px var(--barGlow);
  z-index: 1;
}
.ess-sponsor-strip::before { top: 0; }
.ess-sponsor-strip::after  { bottom: 0; }

/* Title above the strip */
.ess-sponsor-strip .ess-title {
  position: absolute; top: calc(-1 * var(--titleOffset)); left: 0; right: 0;
  margin: 0; text-align: center; line-height: 1.2; color: #39FF14 !important;
  font-weight: 700; z-index: 3; pointer-events: none;
}

/* Keep content above bars */
.ess-sponsor-strip .ess-row,
.ess-sponsor-strip .ess-marquee,
.ess-sponsor-strip .ess-belt,
.ess-sponsor-strip .ess-logo { position: relative; z-index: 2; }

/* Make the marquee area static (no mask/overflow tricks) */
.ess-marquee {
  position: relative !important;
  height: auto !important;
  overflow: visible !important;
  -webkit-mask-image: none !important;
          mask-image: none !important;
}

/* Hide any duplicate/clone belts; target only the first real belt/track */
.ess-marquee .ess-belt--dup,
.ess-marquee [class*="--dup"],
.ess-marquee .ess-belt:not(:first-of-type),
.ess-marquee .ess-track:not(:first-of-type) { display: none !important; }

/* Five-column centered grid with half spacing, constrained width */
.ess-marquee > :is(.ess-belt, .ess-track):first-of-type {
  display: grid !important;
  grid-template-columns: repeat(5, 1fr) !important;
  gap: calc(var(--gap) / 2) !important;
  justify-content: center !important;
  justify-items: center !important;
  align-items: center !important;
  max-width: 80% !important;
  margin: 0 auto !important;
  transform: none !important;
  animation: none !important;
  position: static !important;
  will-change: auto !important;
  backface-visibility: visible !important;
}

/* Logo tiles & images */
.ess-logo {
  width: 100% !important;
  height: var(--tileH) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
  line-height: 0 !important;
}
.ess-logo img {
  display: block !important;
  max-width: 100% !important;
  max-height: var(--logoH) !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain !important;
  filter: none !important;
  opacity: 1 !important;
  margin: 0 !important;
}

/* Responsive tuning */
@media (max-width: 980px)  {
  .ess-sponsor-strip { --tileH: 80px; --logoH: 64px; --gap: 24px; }
  .ess-marquee > :is(.ess-belt, .ess-track):first-of-type {
    grid-template-columns: repeat(3, 1fr) !important;
    max-width: 90% !important;
  }
}
@media (max-width: 600px)  {
  .ess-sponsor-strip { --tileH: 72px; --logoH: 56px; --gap: 20px; --titleOffset: 32px; }
  .ess-marquee > :is(.ess-belt, .ess-track):first-of-type {
    grid-template-columns: repeat(2, 1fr) !important;
    max-width: 95% !important;
  }
}

/* Spacing below countdown into strip */
.hero-countdown + .ess-sponsor-strip { margin-top: 12px; }
/* Slightly smaller bars on phones */
@media (max-width: 600px) { .ess-sponsor-strip { --barH: 6px; } }
