.page-home{
  background:var(--color-primary-base);
  color:var(--color-text-hi);
  overflow-x:hidden;
}
.page-home .container{
  width:min(var(--container-max),100% - 2rem);
  margin-inline:auto;
}
.page-home .home-hero{
  position:relative;
  padding:var(--space-6) 0 var(--space-8);
  background:
    radial-gradient(ellipse at 82% 18%,rgba(45,156,219,.16),transparent 58%),
    radial-gradient(ellipse at 18% 82%,rgba(255,107,53,.10),transparent 58%),
    var(--color-primary-base);
}
.page-home .hero-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:var(--space-7);
  align-items:center;
}
.page-home .hero-copy{
  position:relative;
  z-index:2;
}
.page-home .hero-kicker{
  font-family:var(--font-data);
  font-size:.82rem;
  letter-spacing:.16em;
  color:var(--color-accent-neon);
  text-transform:uppercase;
  margin:0 0 var(--space-4);
}
.page-home .hero-copy h1{
  font-family:var(--font-display);
  font-size:clamp(2rem,7vw,3.8rem);
  line-height:1.06;
  letter-spacing:.02em;
  margin:0 0 var(--space-5);
  max-width:14em;
}
.page-home .hero-lead{
  font-size:1rem;
  line-height:1.8;
  color:var(--color-text-mid);
  margin:0 0 var(--space-6);
  max-width:46em;
}
.page-home .hero-actions{
  display:flex;
  flex-wrap:wrap;
  gap:var(--space-4);
  margin-bottom:var(--space-7);
}
.page-home .hero-metrics{
  list-style:none;
  padding:0;
  margin:0;
  display:flex;
  flex-wrap:wrap;
  gap:var(--space-6);
  border-top:1px solid rgba(255,255,255,.08);
  padding-top:var(--space-5);
}
.page-home .hero-metric__num{
  display:block;
  font-family:var(--font-data);
  font-size:1.35rem;
  font-weight:700;
  color:var(--color-accent-neon);
}
.page-home .hero-metric__label{
  display:block;
  font-size:.78rem;
  color:var(--color-text-mid);
  margin-top:2px;
}
.page-home .hero-canvas{
  position:relative;
  border-radius:var(--radius-md);
  overflow:hidden;
  box-shadow:0 24px 60px rgba(0,0,0,.4);
}
.page-home .hero-canvas::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,transparent 30%,rgba(10,31,68,.68));
  pointer-events:none;
  z-index:1;
}
.page-home .hero-image{
  display:block;
  width:100%;
  height:auto;
  max-width:100%;
  object-fit:cover;
}
.page-home .hero-wave{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  z-index:2;
  opacity:.85;
  pointer-events:none;
}
.page-home .hero-scanline{
  position:absolute;
  left:0;
  right:0;
  height:2px;
  z-index:3;
  background:linear-gradient(90deg,transparent,var(--color-accent-neon),transparent);
  animation:home-scan 4s ease-in-out infinite;
  pointer-events:none;
}
@keyframes home-scan{
  0%{top:5%;opacity:0}
  15%{opacity:.8}
  85%{opacity:.8}
  100%{top:92%;opacity:0}
}
.page-home .home-index{
  padding:var(--space-6) 0;
}
.page-home .index-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:var(--space-4);
}
.page-home .index-card{
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  grid-template-rows:auto auto;
  column-gap:var(--space-4);
  row-gap:2px;
  padding:var(--space-5);
  background:var(--color-primary-elevated);
  border:1px solid rgba(255,255,255,.06);
  border-radius:var(--radius-md);
  text-decoration:none;
  color:var(--color-text-hi);
  transition:border-color .3s var(--ease),transform .3s var(--ease),box-shadow .3s var(--ease);
}
.page-home .index-card:hover,
.page-home .index-card:focus-visible{
  border-color:var(--color-accent-neon);
  transform:translateY(-3px);
  box-shadow:0 12px 30px rgba(0,0,0,.28);
}
.page-home .index-card__num{
  grid-row:1 / 3;
  font-family:var(--font-display);
  font-size:2rem;
  line-height:.9;
  color:var(--color-accent-ember);
  opacity:.65;
}
.page-home .index-card__title{
  font-family:var(--font-display);
  font-size:1rem;
  letter-spacing:.02em;
  color:var(--color-text-hi);
}
.page-home .index-card__desc{
  font-size:.8rem;
  line-height:1.45;
  color:var(--color-text-mid);
}
.page-home .section-band{
  position:relative;
  padding:var(--space-8) 0;
  background:linear-gradient(180deg,var(--color-primary-base) 0%,var(--color-primary-elevated) 100%);
  border-top:1px solid rgba(45,156,219,.14);
  border-bottom:1px solid rgba(255,107,53,.2);
}
.page-home .section-band--dark{
  position:relative;
  padding:var(--space-8) 0;
  background:linear-gradient(160deg,var(--color-gradient-start) 0%,var(--color-gradient-end) 100%);
  border-top:1px solid rgba(57,255,20,.12);
  border-bottom:1px solid rgba(45,156,219,.18);
}
.page-home .section-head{
  display:flex;
  align-items:flex-start;
  gap:var(--space-4);
  margin-bottom:var(--space-6);
}
.page-home .section-index{
  font-family:var(--font-display);
  font-size:clamp(2.8rem,7vw,4.6rem);
  line-height:.85;
  color:var(--color-accent-neon);
  opacity:.3;
  flex-shrink:0;
}
.page-home .section-eyebrow{
  font-family:var(--font-data);
  font-size:.78rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--color-accent-ember);
  margin:0 0 2px;
}
.page-home .section-head h2{
  font-family:var(--font-display);
  font-size:clamp(1.6rem,4vw,2.4rem);
  line-height:1.1;
  margin:0;
  letter-spacing:.02em;
}
.page-home .section-more{
  margin-left:auto;
  align-self:flex-end;
  font-size:.85rem;
  color:var(--color-accent-sky);
  text-decoration:none;
  white-space:nowrap;
}
.page-home .section-more:hover{
  color:var(--color-accent-neon);
}
.page-home .filter-tabs{
  position:relative;
}
.page-home .filter-tabs > input[type="radio"]{
  position:absolute;
  width:1px;
  height:1px;
  opacity:0;
  pointer-events:none;
}
.page-home .filter-labels{
  display:flex;
  flex-wrap:wrap;
  gap:var(--space-3);
  padding:0;
  margin:0 0 var(--space-5);
}
.page-home .filter-labels label{
  display:inline-block;
  padding:.35rem 1rem;
  font-family:var(--font-data);
  font-size:.8rem;
  color:var(--color-text-mid);
  border:1px solid rgba(255,255,255,.12);
  border-radius:999px;
  cursor:pointer;
  transition:color .25s,border-color .25s,background .25s;
}
.page-home .filter-tabs #f-all:checked ~ .filter-labels label[for="f-all"],
.page-home .filter-tabs #f-football:checked ~ .filter-labels label[for="f-football"],
.page-home .filter-tabs #f-basketball:checked ~ .filter-labels label[for="f-basketball"],
.page-home .filter-tabs #f-tennis:checked ~ .filter-labels label[for="f-tennis"],
.page-home .filter-tabs #f-esports:checked ~ .filter-labels label[for="f-esports"]{
  color:var(--color-primary-base);
  border-color:var(--color-accent-neon);
  background:var(--color-accent-neon);
  font-weight:700;
}
.page-home .filter-tabs #f-football:checked ~ .video-grid .video-card:not([data-category="football"]),
.page-home .filter-tabs #f-basketball:checked ~ .video-grid .video-card:not([data-category="basketball"]),
.page-home .filter-tabs #f-tennis:checked ~ .video-grid .video-card:not([data-category="tennis"]),
.page-home .filter-tabs #f-esports:checked ~ .video-grid .video-card:not([data-category="esports"]){
  display:none;
}
.page-home .video-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:var(--space-5);
}
.page-home .video-card{
  display:grid;
  grid-template-rows:auto minmax(0,1fr);
  background:var(--color-primary-elevated);
  border:1px solid rgba(255,255,255,.06);
  border-radius:var(--radius-md);
  overflow:hidden;
  transition:transform .35s var(--ease),border-color .35s var(--ease),box-shadow .35s var(--ease);
}
.page-home .video-card:hover,
.page-home .video-card:focus-within{
  transform:translateY(-4px);
  border-color:rgba(57,255,20,.55);
  box-shadow:0 14px 32px rgba(0,0,0,.35),0 0 0 3px rgba(57,255,20,.08);
}
.page-home .video-card__thumb{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:150px;
  background:
    radial-gradient(circle at 30% 20%,rgba(255,255,255,.12),transparent 42%),
    linear-gradient(135deg,var(--vc-from, #0d3a5e),var(--vc-to, #1d5c8a));
}
.page-home .video-card[data-category="football"]{
  --vc-from:#0d3a5e;
  --vc-to:#1d5c8a;
}
.page-home .video-card[data-category="basketball"]{
  --vc-from:#5e2d12;
  --vc-to:#c24b1f;
}
.page-home .video-card[data-category="tennis"]{
  --vc-from:#124d3a;
  --vc-to:#2d9c6a;
}
.page-home .video-card[data-category="esports"]{
  --vc-from:#311a5e;
  --vc-to:#7b3bd6;
}
.page-home .video-card__play{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:50px;
  height:50px;
  border-radius:50%;
  background:rgba(10,31,68,.55);
  border:2px solid rgba(255,255,255,.85);
  transition:transform .3s var(--ease),border-color .3s var(--ease);
}
.page-home .video-card__play::after{
  content:"";
  margin-left:5px;
  border-left:12px solid #fff;
  border-top:8px solid transparent;
  border-bottom:8px solid transparent;
}
.page-home .video-card:hover .video-card__play{
  transform:scale(1.12);
  border-color:var(--color-accent-neon);
}
.page-home .video-card__body{
  padding:var(--space-5);
  display:grid;
  gap:var(--space-2);
  align-content:start;
}
.page-home .video-card__body h3{
  font-family:var(--font-display);
  font-size:1.05rem;
  letter-spacing:.02em;
  margin:0;
  line-height:1.2;
}
.page-home .video-card__body p{
  font-size:.84rem;
  line-height:1.55;
  color:var(--color-text-mid);
  margin:0;
}
.page-home .video-card__meta{
  font-family:var(--font-data);
  font-size:.74rem;
  letter-spacing:.03em;
  color:var(--color-text-low);
}
.page-home .home-tablet{
  padding:var(--space-8) 0;
}
.page-home .tablet-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:var(--space-7);
  align-items:center;
}
.page-home .tablet-visual{
  position:relative;
}
.page-home .tablet-visual img{
  display:block;
  width:100%;
  height:auto;
  max-width:100%;
  object-fit:cover;
  border-radius:var(--radius-md);
  box-shadow:0 18px 40px rgba(0,0,0,.35);
}
.page-home .tablet-glow{
  position:absolute;
  inset:0;
  border-radius:var(--radius-md);
  background:radial-gradient(ellipse at 82% 12%,rgba(57,255,20,.14),transparent 52%);
  pointer-events:none;
}
.page-home .tablet-lead{
  font-size:1rem;
  line-height:1.8;
  color:var(--color-text-mid);
  margin:0 0 var(--space-5);
}
.page-home .tablet-features{
  list-style:none;
  padding:0;
  margin:0 0 var(--space-6);
  display:grid;
  gap:var(--space-3);
}
.page-home .tablet-features li{
  position:relative;
  padding-left:1.6rem;
  line-height:1.5;
  font-size:.94rem;
}
.page-home .tablet-features li::before{
  content:"";
  position:absolute;
  left:2px;
  top:.55em;
  width:8px;
  height:8px;
  transform:rotate(45deg);
  background:var(--color-accent-neon);
}
.page-home .tablet-actions{
  display:flex;
  flex-wrap:wrap;
  gap:var(--space-4);
}
.page-home .home-panel .section-head{
  margin-bottom:var(--space-5);
}
.page-home .panel-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:var(--space-7);
}
.page-home .panel-stats{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:var(--space-4);
  align-content:start;
}
.page-home .panel-stat{
  padding:var(--space-5);
  background:rgba(18,42,74,.88);
  border:1px solid rgba(255,255,255,.08);
  border-radius:var(--radius-md);
  display:grid;
  gap:var(--space-2);
  transition:border-color .3s var(--ease),transform .3s var(--ease);
}
.page-home .panel-stat:hover{
  border-color:var(--color-accent-neon);
  transform:translateY(-2px);
}
.page-home .panel-stat--ember:hover{
  border-color:var(--color-accent-ember);
}
.page-home .panel-stat--sky:hover{
  border-color:var(--color-accent-sky);
}
.page-home .panel-visual{
  position:relative;
}
.page-home .panel-visual img{
  display:block;
  width:100%;
  height:auto;
  max-width:100%;
  object-fit:cover;
  border-radius:var(--radius-md);
  box-shadow:0 18px 44px rgba(0,0,0,.38);
}
.page-home .panel-svg{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  opacity:.35;
  pointer-events:none;
}
.page-home .panel-note{
  margin-top:var(--space-5);
  font-size:.92rem;
  line-height:1.8;
  color:var(--color-text-mid);
  max-width:64em;
}
.page-home .home-catalog{
  padding:var(--space-8) 0;
}
.page-home .catalog-wrap{
  position:relative;
  border-radius:var(--radius-md);
  overflow:hidden;
  border:1px solid rgba(255,255,255,.08);
}
.page-home .catalog-bg{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  opacity:.26;
  filter:saturate(.55) contrast(1.08);
}
.page-home .catalog-grid{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:1px;
  background:rgba(255,255,255,.05);
}
.page-home .catalog-item{
  padding:var(--space-5);
  background:rgba(10,31,68,.93);
  transition:background .3s var(--ease);
}
.page-home .catalog-item:hover{
  background:rgba(18,42,74,.97);
}
.page-home .catalog-item__index{
  display:block;
  font-family:var(--font-data);
  font-size:.74rem;
  letter-spacing:.1em;
  color:var(--color-accent-ember);
  margin-bottom:var(--space-2);
}
.page-home .catalog-item h3{
  font-family:var(--font-display);
  font-size:1rem;
  letter-spacing:.02em;
  margin:0 0 var(--space-2);
}
.page-home .catalog-item p{
  font-size:.78rem;
  line-height:1.55;
  color:var(--color-text-mid);
  margin:0;
}
.page-home .catalog-note{
  margin-top:var(--space-5);
  font-size:.94rem;
  line-height:1.8;
  color:var(--color-text-mid);
}
.page-home .catalog-action{
  margin-top:var(--space-5);
}
.page-home .home-trust{
  padding:var(--space-7) 0 var(--space-8);
  background:var(--color-primary-base);
  border-top:1px solid rgba(255,255,255,.06);
}
.page-home .trust-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:var(--space-5);
}
.page-home .trust-item{
  padding:var(--space-4);
  border-left:3px solid var(--color-accent-sky);
}
.page-home .trust-item:nth-child(2){
  border-left-color:var(--color-accent-neon);
}
.page-home .trust-item:nth-child(3){
  border-left-color:var(--color-accent-ember);
}
.page-home .trust-item:nth-child(4){
  border-left-color:var(--color-accent-sky);
}
.page-home .trust-item__value{
  display:block;
  font-family:var(--font-display);
  font-size:clamp(1.7rem,4vw,2.5rem);
  line-height:1.05;
  color:var(--color-text-hi);
}
.page-home .trust-item__label{
  display:block;
  margin-top:4px;
  font-size:.8rem;
  line-height:1.4;
  color:var(--color-text-mid);
}
.page-home .trust-note{
  margin-top:var(--space-6);
  font-size:.88rem;
  line-height:1.8;
  color:var(--color-text-mid);
  max-width:68em;
}
.page-home .trust-links{
  list-style:none;
  padding:0;
  margin:var(--space-5) 0 0;
  display:flex;
  flex-wrap:wrap;
  gap:var(--space-5);
}
.page-home .trust-links a{
  font-family:var(--font-data);
  font-size:.82rem;
  color:var(--color-text-mid);
  text-decoration:none;
  border-bottom:1px solid rgba(255,255,255,.14);
  transition:color .25s,border-color .25s;
}
.page-home .trust-links a:hover{
  color:var(--color-accent-neon);
  border-color:var(--color-accent-neon);
}
@media (min-width:768px){
  .page-home .hero-grid{
    grid-template-columns:minmax(0,5fr) minmax(0,7fr);
    gap:var(--space-8);
    min-height:calc(100vh - var(--header-height));
    padding-block:var(--space-4);
  }
  .page-home .hero-copy h1{
    font-size:clamp(2.4rem,4.2vw,3.8rem);
  }
  .page-home .index-grid{
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:var(--space-5);
  }
  .page-home .index-card{
    grid-template-columns:minmax(0,1fr);
    row-gap:var(--space-2);
  }
  .page-home .index-card__num{
    grid-row:auto;
    margin-bottom:var(--space-1);
  }
  .page-home .video-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:var(--space-5);
  }
  .page-home .tablet-grid{
    grid-template-columns:minmax(0,5fr) minmax(0,6fr);
    gap:var(--space-8);
  }
  .page-home .panel-grid{
    grid-template-columns:minmax(0,4fr) minmax(0,7fr);
    gap:var(--space-8);
    margin-top:var(--space-6);
  }
  .page-home .catalog-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .page-home .trust-grid{
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:var(--space-6);
  }
}
@media (min-width:1024px){
  .page-home .video-grid{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
  .page-home .catalog-grid{
    grid-template-columns:repeat(4,minmax(0,1fr));
  }
  .page-home .catalog-item{
    padding:var(--space-6);
  }
  .page-home .trust-note{
    max-width:52em;
  }
}
@media (prefers-reduced-motion:reduce){
  .page-home .hero-scanline,
  .page-home .hero-wave{
    animation:none;
  }
}