/* =========================================================
   TLPT HOME PAGE — OWNED SHELLS
   Loaded only by index.html after the shared compatibility layer.
   ========================================================= */

.home-page-hero{
  --site-page-hero-accent-rgb:255,184,28;
  --site-page-hero-secondary-rgb:34,197,94;
  margin:0;
}

.home-page-hero .site-page-hero-description{
  color:#f4cb65;
  font-weight:700;
  text-shadow:
    0 0 10px rgba(255,184,28,.20),
    0 0 22px rgba(255,184,28,.10);
}

.events-header-stack{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:14px;
  padding:14px 16px;
  border:1px solid rgba(244,114,182,.22);
  border-radius:18px;
  background:
    radial-gradient(circle at top right, rgba(244,114,182,.12), transparent 34%),
    radial-gradient(circle at left center, rgba(59,130,246,.08), transparent 26%),
    linear-gradient(180deg, rgba(20,26,34,.98), rgba(12,15,20,.99));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.04),
    0 10px 24px rgba(0,0,0,.20),
    0 0 18px rgba(244,114,182,.08);
  backdrop-filter:blur(2px);
}

.events-header-stack::before{
  content:none;
  display:none;
}

.league-ticker{
  position:relative;
  overflow:hidden;
  margin:4px 0 10px 0;
  padding:10px 0;
  border:1px solid rgba(255,255,255,.12);
  border-radius:16px;
  background:
    radial-gradient(circle at 10% 26%, rgba(239,68,68,.20), transparent 22%),
    radial-gradient(circle at 28% 18%, rgba(255,184,28,.20), transparent 22%),
    radial-gradient(circle at 48% 18%, rgba(34,197,94,.18), transparent 22%),
    radial-gradient(circle at 68% 20%, rgba(59,130,246,.20), transparent 22%),
    radial-gradient(circle at 88% 26%, rgba(168,85,247,.20), transparent 22%),
    linear-gradient(
      90deg,
      rgba(239,68,68,.08) 0%,
      rgba(255,184,28,.08) 25%,
      rgba(34,197,94,.08) 50%,
      rgba(59,130,246,.08) 75%,
      rgba(168,85,247,.08) 100%
    ),
    linear-gradient(180deg, rgba(18,24,32,.98), rgba(12,15,20,.99));
  color:#fff;
  font-weight:700;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.04),
    0 10px 22px rgba(0,0,0,.18),
    0 0 18px rgba(255,184,28,.08);
  -webkit-mask-image:linear-gradient(
    90deg,
    transparent 0,
    #000 44px,
    #000 calc(100% - 44px),
    transparent 100%
  );
  mask-image:linear-gradient(
    90deg,
    transparent 0,
    #000 44px,
    #000 calc(100% - 44px),
    transparent 100%
  );
  backdrop-filter:blur(2px);
}

.home-cluster-stack{
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:14px;
}

.home-cluster-stack-3{
  grid-template-columns:repeat(3, minmax(0,1fr));
}

.home-cluster-stack,
.home-cluster-stack-3{
  padding:16px;
  border:1px solid rgba(255,184,28,.16);
  border-radius:18px;
  background:
    linear-gradient(180deg, rgba(255,184,28,.08), rgba(255,184,28,.02)),
    linear-gradient(180deg, rgba(18,24,32,.98), rgba(12,15,20,.99));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.04),
    0 10px 22px rgba(0,0,0,.18);
}

.home-pulse-head{
  position:relative;
  justify-content:space-between !important;
  align-items:center;
  gap:16px;
  flex-wrap:nowrap;
  padding:14px 16px;
  border:1px solid rgba(239,68,68,.20);
  border-radius:18px;
  background:
    radial-gradient(circle at top right, rgba(239,68,68,.10), transparent 34%),
    radial-gradient(circle at left center, rgba(59,130,246,.08), transparent 24%),
    linear-gradient(180deg, rgba(20,26,34,.98), rgba(12,15,20,.99));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.04),
    0 10px 22px rgba(0,0,0,.18),
    0 0 16px rgba(239,68,68,.08);
}

@media (max-width:800px){
  .home-cluster-stack,
  .home-cluster-stack-3{
    grid-template-columns:1fr;
  }

  .home-pulse-head{
    flex-wrap:wrap;
    padding-left:12px;
    padding-right:12px;
  }
}

@media (max-width:640px){
  .events-header-stack{
    gap:12px;
  }
}