/* ================================================
   StremioTV Main Stylesheet v1.0
   Fonts  : Outfit (800/700/500) + Lora (serif italic)
   Palette: #F5F7FF bg · #0A1535 navy · #0EA5E9 teal
   ================================================ */

/* Google Fonts are enqueued via functions.php */

:root {
  --bg:           #F5F7FF;
  --bg-alt:       #ECEFFE;
  --card:         #FFFFFF;
  --border:       #DDE2F0;
  --navy:         #0A1535;
  --navy-2:       #1B2C5E;
  --teal:         #0EA5E9;
  --teal-d:       #0284C7;
  --amber:        #F59E0B;
  --red:          #EF4444;
  --green:        #22C55E;
  --text:         #0A1535;
  --text-2:       #4E5B7B;
  --text-3:       #8B95B3;
  --grad-primary: linear-gradient(135deg,#0A1535 0%,#1B2C5E 100%);
  --grad-teal:    linear-gradient(135deg,#0EA5E9 0%,#38BDF8 100%);
  --grad-text:    linear-gradient(135deg,#0EA5E9,#6366F1);
  --shadow-xs:    0 1px 4px rgba(10,21,53,.06);
  --shadow-sm:    0 2px 10px rgba(10,21,53,.08);
  --shadow-md:    0 6px 28px rgba(10,21,53,.12);
  --shadow-lg:    0 16px 56px rgba(10,21,53,.16);
  --r-sm: 8px; --r-md: 14px; --r-lg: 20px; --r-xl: 28px;
  --nav-h:       68px;
  --section-py:  5.5rem;
  --ease:        cubic-bezier(.4,0,.2,1);
  --font-ui:    'Outfit', sans-serif;
  --font-serif: 'Lora', serif;
}

/* ── Reset ── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; font-size: 16px; }
body {
  font-family: var(--font-ui);
  background: var(--bg);
  color: var(--text);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
img { max-width: 100%; height: auto; display: block; }
a { text-decoration: none; color: inherit; }
button { font-family: var(--font-ui); cursor: pointer; }
ul, ol { list-style: none; }

/* ── WordPress alignment classes ── */
.alignleft  { float: left;  margin: 0 1.5rem 1rem 0; }
.alignright { float: right; margin: 0 0 1rem 1.5rem; }
.aligncenter{ display: block; margin: 1rem auto; text-align: center; }
.wp-caption { max-width: 100%; }
.wp-caption-text { font-size: .875rem; color: var(--text-3); margin-top: .4rem; }
.screen-reader-text { position: absolute; left: -9999em; }

/* ── Container ── */
.stv-container, .c { max-width: 1200px; margin: 0 auto; padding: 0 2rem; }

/* ── Section base ── */
.stv-section { padding: var(--section-py) 0; }
.stv-section--alt { background: var(--bg-alt); }
.stv-section--dark { background: var(--navy); }

/* ── Section header ── */
.stv-sh { text-align: center; margin-bottom: 3.5rem; }
.stv-sh__tag {
  display: inline-flex; align-items: center; gap: .4rem;
  padding: .28rem .875rem;
  background: rgba(14,165,233,.1); border: 1px solid rgba(14,165,233,.22);
  border-radius: 99px; font-size: .72rem; font-weight: 700;
  letter-spacing: .09em; text-transform: uppercase; color: var(--teal-d);
  margin-bottom: .875rem;
}
.stv-sh__tag--light { background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.2); color: rgba(255,255,255,.85); }
.stv-sh__h2 {
  font-family: var(--font-ui);
  font-size: clamp(1.875rem, 3.8vw, 2.875rem);
  font-weight: 800; color: var(--navy);
  line-height: 1.1; letter-spacing: -.03em; margin-bottom: .75rem;
}
.stv-sh__h2--light { color: #fff; }
.stv-sh__h2 .grad {
  background: var(--grad-text);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent;
  background-clip: text;
}
.stv-sh__p { font-size: 1rem; color: var(--text-2); max-width: 38rem; margin: 0 auto; line-height: 1.75; }
.stv-sh__p--light { color: rgba(255,255,255,.65); }

/* ── Scroll reveal ── */
[data-r] { opacity: 0; transform: translateY(18px); transition: opacity .65s var(--ease), transform .65s var(--ease); }
[data-r].on { opacity: 1; transform: none; }
[data-r][data-d="1"] { transition-delay: .1s; }
[data-r][data-d="2"] { transition-delay: .2s; }
[data-r][data-d="3"] { transition-delay: .3s; }
[data-r][data-d="4"] { transition-delay: .4s; }

/* ════════════════════════════
   NAVBAR
════════════════════════════ */
.stv-nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 1000;
  height: var(--nav-h);
  background: rgba(245,247,255,.92);
  backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
  border-bottom: 1px solid var(--border);
  transition: box-shadow .3s;
}
.stv-nav.scrolled { box-shadow: var(--shadow-md); }
.stv-nav__inner {
  max-width: 1200px; margin: 0 auto; padding: 0 2rem;
  height: 100%; display: flex; align-items: center; gap: 1.5rem;
}
.stv-nav__logo { display: flex; align-items: center; gap: .625rem; flex-shrink: 0; }
.stv-nav__logo img { height: 44px; width: auto; display: block; }
.stv-nav__logo-text { font-family: var(--font-ui); font-size: 1.2rem; font-weight: 800; color: var(--navy); letter-spacing: -.03em; }
.stv-nav__logo-text em { font-style: normal; color: var(--teal); }
.stv-nav__links { display: flex; gap: .125rem; margin-left: auto; }
.stv-nav__links a { display: block; padding: .4rem .9rem; font-size: .875rem; font-weight: 500; color: var(--text-2); border-radius: 7px; transition: color .2s, background .2s; }
.stv-nav__links a:hover, .stv-nav__links a.current-menu-item { color: var(--navy); background: rgba(10,21,53,.06); }
.stv-nav__links a.current-menu-item { font-weight: 700; color: var(--teal-d); }
.stv-nav__actions { display: flex; align-items: center; gap: .5rem; flex-shrink: 0; }
.btn-ghost { padding: .44rem 1.1rem; font-size: .875rem; font-weight: 600; color: var(--navy); border: 1.5px solid var(--border); border-radius: var(--r-sm); background: transparent; transition: .2s; }
.btn-ghost:hover { border-color: var(--navy); }
.btn-cta {
  display: inline-flex; align-items: center; gap: .4rem;
  padding: .5rem 1.25rem; font-size: .875rem; font-weight: 700;
  color: #fff; background: var(--navy); border-radius: var(--r-sm);
  border: none; transition: .2s; white-space: nowrap;
}
.btn-cta:hover { background: var(--navy-2); transform: translateY(-1px); box-shadow: var(--shadow-md); }
.stv-nav__burger { display: none; flex-direction: column; gap: 5px; padding: 4px; background: none; border: none; }
.stv-nav__burger span { display: block; width: 22px; height: 2px; background: var(--navy); border-radius: 2px; transition: .25s; }
.stv-nav__mobile { display: none; position: fixed; top: var(--nav-h); left: 0; right: 0; background: var(--card); border-bottom: 1px solid var(--border); padding: 1.25rem; flex-direction: column; gap: .25rem; z-index: 999; box-shadow: var(--shadow-lg); }
.stv-nav__mobile.open { display: flex; }
.stv-nav__mobile a { display: block; padding: .7rem .875rem; font-size: .925rem; font-weight: 500; color: var(--text-2); border-radius: var(--r-sm); transition: .2s; }
.stv-nav__mobile a:hover { background: var(--bg); color: var(--navy); }
.stv-nav__mobile .btn-cta { margin-top: .5rem; justify-content: center; padding: .75rem; }

/* ════════════════════════════
   HERO SLIDER
════════════════════════════ */
.stv-hero {
  padding-top: var(--nav-h);
  height: 100vh; min-height: 620px; max-height: 960px;
  position: relative; overflow: hidden;
}
.stv-hero__slider { position: relative; width: 100%; height: 100%; }
.stv-hero__slide {
  position: absolute; inset: 0;
  display: grid; grid-template-columns: 1fr 1fr;
  opacity: 0; visibility: hidden;
  transition: opacity 1.1s var(--ease), visibility 1.1s;
  pointer-events: none;
}
.stv-hero__slide.active { opacity: 1; visibility: visible; pointer-events: auto; }
.stv-hero__bg {
  position: absolute; inset: 0;
  background-size: cover; background-position: center;
  transform: scale(1.06); transition: transform 9s ease-out;
  will-change: transform;
}
.stv-hero__slide.active .stv-hero__bg { transform: scale(1); }
.stv-hero__overlay { position: absolute; inset: 0; pointer-events: none; }
.stv-hero__overlay--sport {
  background:
    linear-gradient(to right, rgba(5,12,38,.92) 0%, rgba(5,12,38,.55) 50%, rgba(5,12,38,.18) 100%),
    linear-gradient(to top, rgba(5,12,38,.95) 0%, transparent 55%);
}
.stv-hero__overlay--soccer {
  background:
    linear-gradient(to right, rgba(5,22,12,.94) 0%, rgba(5,22,12,.6) 50%, rgba(5,22,12,.18) 100%),
    linear-gradient(to top, rgba(5,14,43,.95) 0%, transparent 55%);
}
.stv-hero__overlay--movies {
  background:
    linear-gradient(to right, rgba(18,5,38,.93) 0%, rgba(18,5,38,.6) 50%, rgba(18,5,38,.18) 100%),
    linear-gradient(to top, rgba(5,14,43,.95) 0%, transparent 55%);
}
.stv-hero__inner { position: absolute; inset: 0; display: grid; grid-template-columns: 1fr 1fr; z-index: 5; }
.stv-hero__left { display: flex; flex-direction: column; justify-content: flex-end; padding: 0 3.5rem 4rem; color: #fff; }
.stv-hero__badge {
  display: inline-flex; align-items: center; gap: .5rem;
  padding: .3rem .875rem;
  background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.2);
  backdrop-filter: blur(8px); border-radius: 99px;
  font-size: .72rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  margin-bottom: 1.25rem; width: fit-content;
  opacity: 0; transform: translateY(12px);
  transition: opacity .5s .25s, transform .5s .25s;
}
.stv-hero__slide.active .stv-hero__badge { opacity: 1; transform: none; }
.stv-hero__badge--live { background: rgba(239,68,68,.2); border-color: rgba(239,68,68,.45); }
.stv-live-dot { width: 6px; height: 6px; border-radius: 50%; background: #EF4444; animation: livePulse 1.4s infinite; }
@keyframes livePulse { 0%,100% { opacity:1; transform:scale(1); } 50% { opacity:.4; transform:scale(.7); } }
.stv-hero__h1 {
  font-family: var(--font-ui);
  font-size: clamp(2.25rem, 4.5vw, 3.75rem);
  font-weight: 800; line-height: 1.05; letter-spacing: -.04em;
  margin-bottom: 1rem;
  opacity: 0; transform: translateY(22px);
  transition: opacity .7s .38s, transform .7s .38s;
}
.stv-hero__slide.active .stv-hero__h1 { opacity: 1; transform: none; }
.stv-hero__h1 em { font-style: normal; color: #7DD3FC; }
.stv-hero__slide:nth-child(2) .stv-hero__h1 em { color: #86EFAC; }
.stv-hero__slide:nth-child(3) .stv-hero__h1 em { color: #C4B5FD; }
.stv-hero__desc {
  font-size: 1.0625rem; color: rgba(255,255,255,.75); line-height: 1.7;
  max-width: 28rem; margin-bottom: 1.875rem;
  opacity: 0; transform: translateY(20px);
  transition: opacity .7s .52s, transform .7s .52s;
}
.stv-hero__slide.active .stv-hero__desc { opacity: 1; transform: none; }
.stv-hero__checks {
  display: flex; flex-direction: column; gap: .5rem; margin-bottom: 2rem;
  opacity: 0; transform: translateY(20px);
  transition: opacity .7s .6s, transform .7s .6s;
}
.stv-hero__slide.active .stv-hero__checks { opacity: 1; transform: none; }
.stv-hero__checks li { display: flex; align-items: center; gap: .6rem; font-size: .875rem; color: rgba(255,255,255,.78); }
.stv-hero__checks li::before {
  content: "✓";
  display: flex; align-items: center; justify-content: center;
  width: 18px; height: 18px; border-radius: 50%;
  background: rgba(14,165,233,.25); color: #7DD3FC;
  font-size: .65rem; font-weight: 800; flex-shrink: 0;
}
.stv-hero__cta {
  display: flex; align-items: center; gap: 1rem; flex-wrap: wrap;
  opacity: 0; transform: translateY(20px);
  transition: opacity .7s .72s, transform .7s .72s;
}
.stv-hero__slide.active .stv-hero__cta { opacity: 1; transform: none; }
.btn-hero { display: inline-flex; align-items: center; gap: .5rem; padding: .8rem 1.75rem; font-family: var(--font-ui); font-size: .9375rem; font-weight: 700; border-radius: var(--r-sm); transition: .2s; white-space: nowrap; border: none; }
.btn-hero--solid { background: #fff; color: var(--navy); }
.btn-hero--solid:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(0,0,0,.22); }
.btn-hero--solid-amber { background: #F59E0B; color: #fff; }
.btn-hero--solid-amber:hover { background: #D97706; transform: translateY(-2px); }
.btn-hero--solid-purple { background: #7C3AED; color: #fff; }
.btn-hero--solid-purple:hover { background: #6D28D9; transform: translateY(-2px); }
.btn-hero--ghost { font-size: .9375rem; font-weight: 600; color: rgba(255,255,255,.82); border-bottom: 1px solid rgba(255,255,255,.35); padding-bottom: 1px; transition: .2s; }
.btn-hero--ghost:hover { color: #fff; border-color: rgba(255,255,255,.8); }
.stv-hero__trust {
  display: flex; align-items: center; gap: 1.25rem; flex-wrap: wrap; margin-top: 1.5rem;
  opacity: 0; transform: translateY(20px);
  transition: opacity .7s .85s, transform .7s .85s;
}
.stv-hero__slide.active .stv-hero__trust { opacity: 1; transform: none; }
.stv-hero__trust-item { display: flex; align-items: center; gap: .4rem; font-size: .75rem; color: rgba(255,255,255,.5); }
.stv-hero__trust-item svg { width: 13px; height: 13px; flex-shrink: 0; }
.stv-hero__right { display: flex; align-items: center; justify-content: flex-end; padding: 0 2.5rem 0 1rem; position: relative; z-index: 5; }
.stv-hero__showcase { display: flex; flex-direction: column; gap: .7rem; width: 100%; max-width: 360px; padding-bottom: 5rem; }
.stv-hero__card-main { position: relative; border-radius: var(--r-md); overflow: hidden; border: 1.5px solid rgba(255,255,255,.15); box-shadow: 0 12px 40px rgba(0,0,0,.4); opacity: 0; transform: translateX(20px); transition: opacity .7s .5s, transform .7s .5s; }
.stv-hero__slide.active .stv-hero__card-main { opacity: 1; transform: none; }
.stv-hero__card-main img { width: 100%; height: 200px; object-fit: cover; object-position: center 20%; display: block; }
.stv-hero__card-main-overlay { position: absolute; inset: 0; background: linear-gradient(to top, rgba(0,0,0,.85) 0%, transparent 55%); }
.stv-hero__card-main-info { position: absolute; bottom: 0; left: 0; right: 0; padding: 1rem; }
.stv-hero__live-pill { display: inline-flex; align-items: center; gap: .35rem; padding: .2rem .6rem; background: rgba(239,68,68,.85); border-radius: 99px; font-size: .65rem; font-weight: 700; color: #fff; margin-bottom: .4rem; }
.stv-hero__card-main-title { font-size: .925rem; font-weight: 700; color: #fff; line-height: 1.2; }
.stv-hero__card-main-sub { font-size: .75rem; color: rgba(255,255,255,.65); margin-top: .2rem; }
.stv-hero__quality-pip { position: absolute; top: .75rem; right: .75rem; padding: .18rem .55rem; background: rgba(0,0,0,.6); border: 1px solid rgba(255,255,255,.25); border-radius: 4px; font-size: .62rem; font-weight: 800; color: #fff; letter-spacing: .06em; }
.stv-hero__poster-row { display: grid; grid-template-columns: repeat(4,1fr); gap: .55rem; opacity: 0; transform: translateX(20px); transition: opacity .7s .65s, transform .7s .65s; }
.stv-hero__slide.active .stv-hero__poster-row { opacity: 1; transform: none; }
.stv-hero__poster { position: relative; border-radius: var(--r-sm); overflow: hidden; border: 1.5px solid rgba(255,255,255,.12); box-shadow: 0 6px 16px rgba(0,0,0,.35); aspect-ratio: 2/3; transition: transform .25s, border-color .25s; }
.stv-hero__poster:hover { transform: scale(1.05); border-color: rgba(255,255,255,.4); }
.stv-hero__poster img { width: 100%; height: 100%; object-fit: cover; }
.stv-hero__poster-overlay { position: absolute; inset: 0; background: linear-gradient(to top, rgba(0,0,0,.75) 0%, transparent 50%); }
.stv-hero__poster-label { position: absolute; bottom: 0; left: 0; right: 0; padding: .5rem .4rem; font-size: .6rem; font-weight: 700; color: #fff; line-height: 1.2; }
.stv-hero__controls { position: absolute; bottom: 2rem; left: 50%; transform: translateX(-50%); display: flex; align-items: center; gap: 1rem; z-index: 20; }
.stv-hero__arrow { width: 40px; height: 40px; border-radius: 50%; background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.2); backdrop-filter: blur(8px); color: #fff; display: flex; align-items: center; justify-content: center; transition: .2s; }
.stv-hero__arrow:hover { background: rgba(255,255,255,.25); transform: scale(1.08); }
.stv-hero__dots { display: flex; align-items: center; gap: .5rem; }
.stv-hero__dot { width: 8px; height: 8px; border-radius: 99px; background: rgba(255,255,255,.35); border: none; transition: background .3s, width .35s; padding: 0; }
.stv-hero__dot.active { background: #fff; width: 26px; }
.stv-hero__progress { width: 110px; height: 2px; background: rgba(255,255,255,.18); border-radius: 99px; overflow: hidden; flex-shrink: 0; }
.stv-hero__progress-fill { height: 100%; background: #fff; border-radius: 99px; width: 0%; transition: width .12s linear; }
.stv-hero__counter { position: absolute; right: 2rem; top: 50%; transform: translateY(-50%); writing-mode: vertical-rl; display: flex; align-items: center; gap: .4rem; color: rgba(255,255,255,.45); font-size: .72rem; font-weight: 700; letter-spacing: .1em; z-index: 20; pointer-events: none; }
.stv-hero__counter-cur { color: #fff; font-size: 1.1rem; font-weight: 800; }
.stv-scroll-cue { position: absolute; bottom: 2rem; left: 3rem; display: flex; align-items: center; gap: .6rem; color: rgba(255,255,255,.4); font-size: .68rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; z-index: 20; pointer-events: none; }
.stv-scroll-line { width: 28px; height: 1px; background: rgba(255,255,255,.3); position: relative; overflow: hidden; }
.stv-scroll-line::after { content:''; position:absolute; top:0; left:-100%; width:100%; height:100%; background:rgba(255,255,255,.8); animation:scrollAnim 2s ease-in-out infinite; }
@keyframes scrollAnim { 0%{left:-100%} 100%{left:100%} }

/* ════════════════════════════
   STATS ROW
════════════════════════════ */
.stv-stats-row { background: var(--navy); padding: 1.625rem 0; }
.stv-stats-row__inner { max-width: 1200px; margin: 0 auto; padding: 0 2rem; display: flex; align-items: center; justify-content: space-evenly; flex-wrap: wrap; gap: 1.25rem; }
.stv-stats-row__item { display: flex; align-items: center; gap: .875rem; flex-shrink: 0; }
.stv-stats-row__icon { width: 38px; height: 38px; background: rgba(255,255,255,.08); border-radius: 10px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.stv-stats-row__icon svg { width: 18px; height: 18px; color: var(--teal); }
.stv-stats-row__num { font-family: var(--font-ui); font-size: 1.5rem; font-weight: 800; color: #fff; line-height: 1; letter-spacing: -.03em; }
.stv-stats-row__num span { color: var(--teal); }
.stv-stats-row__lbl { font-size: .72rem; color: rgba(255,255,255,.5); text-transform: uppercase; letter-spacing: .08em; margin-top: .1rem; }
.stv-stats-row__divider { width: 1px; height: 2.5rem; background: rgba(255,255,255,.1); flex-shrink: 0; }

/* ════════════════════════════
   VOD SCROLLING SECTION
════════════════════════════ */
.stv-vod { padding: var(--section-py) 0; background: var(--bg); overflow: hidden; }
.stv-vod-track-wrap { position: relative; overflow: hidden; }
.stv-vod-track-wrap::before, .stv-vod-track-wrap::after { content:''; position:absolute; top:0; bottom:0; width:5rem; z-index:2; pointer-events:none; }
.stv-vod-track-wrap::before { left:0; background:linear-gradient(to right,var(--bg),transparent); }
.stv-vod-track-wrap::after  { right:0; background:linear-gradient(to left,var(--bg),transparent); }
.stv-vod-track { display:flex; gap:.75rem; width:max-content; padding:.5rem 0; }
.stv-vod-track--fwd { animation: vodFwd 55s linear infinite; }
.stv-vod-track--rev { animation: vodRev 55s linear infinite; }
.stv-vod-track:hover { animation-play-state: paused; }
@keyframes vodFwd { 0%{transform:translateX(0)} 100%{transform:translateX(-33.333%)} }
@keyframes vodRev { 0%{transform:translateX(-33.333%)} 100%{transform:translateX(0)} }
.stv-vod-poster { position:relative; width:120px; flex-shrink:0; border-radius:var(--r-md); overflow:hidden; cursor:pointer; aspect-ratio:2/3; box-shadow:var(--shadow-sm); transition:transform .25s var(--ease),box-shadow .25s var(--ease); }
.stv-vod-poster:hover { transform:scale(1.06) translateY(-4px); box-shadow:var(--shadow-lg); z-index:5; }
.stv-vod-poster img { width:100%; height:100%; object-fit:cover; display:block; }
.stv-vod-poster__overlay { position:absolute; inset:0; background:linear-gradient(to top,rgba(10,21,53,.85) 0%,transparent 55%); opacity:0; transition:opacity .25s; display:flex; align-items:center; justify-content:center; }
.stv-vod-poster:hover .stv-vod-poster__overlay { opacity:1; }
.stv-vod-poster__play { width:42px; height:42px; background:rgba(255,255,255,.95); border-radius:50%; display:flex; align-items:center; justify-content:center; color:var(--navy); box-shadow:0 4px 16px rgba(0,0,0,.3); transform:scale(.8); transition:transform .2s; }
.stv-vod-poster:hover .stv-vod-poster__play { transform:scale(1); }

/* ════════════════════════════
   CHANNELS SECTION
════════════════════════════ */
.stv-channels { background: var(--bg-alt); }
.stv-channels__sub-label { text-align:center; font-size:.72rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--text-3); margin-bottom:1.375rem; }
.stv-league-row { display:flex; flex-wrap:wrap; justify-content:center; gap:.75rem; margin-bottom:3.5rem; }
.stv-league-tile { display:flex; align-items:center; justify-content:center; padding:.625rem 1.25rem; background:var(--card); border:1.5px solid var(--border); border-radius:var(--r-md); font-size:.8125rem; font-weight:700; color:var(--text-2); transition:.2s; box-shadow:var(--shadow-xs); }
.stv-league-tile:hover { border-color:rgba(14,165,233,.3); box-shadow:var(--shadow-sm); transform:translateY(-2px); color:var(--navy); }
.stv-league-tile--sm { padding:.5rem 1rem; font-size:.75rem; }
.stv-pill-scroller { overflow:hidden; position:relative; margin-bottom:.75rem; }
.stv-pill-scroller::before,.stv-pill-scroller::after { content:''; position:absolute; top:0; bottom:0; width:5rem; z-index:2; pointer-events:none; }
.stv-pill-scroller::before { left:0; background:linear-gradient(to right,var(--bg-alt),transparent); }
.stv-pill-scroller::after  { right:0; background:linear-gradient(to left, var(--bg-alt),transparent); }
.stv-pill-track { display:flex; gap:.625rem; width:max-content; }
.stv-pill-track--fwd { animation:scrollFwd 35s linear infinite; }
.stv-pill-track--rev { animation:scrollRev 35s linear infinite; }
.stv-pill-track:hover { animation-play-state:paused; }
@keyframes scrollFwd { 0%{transform:translateX(0)} 100%{transform:translateX(-33.333%)} }
@keyframes scrollRev { 0%{transform:translateX(-33.333%)} 100%{transform:translateX(0)} }
.stv-pill { display:inline-flex; align-items:center; gap:.45rem; padding:.5rem 1rem; background:var(--card); border:1px solid var(--border); border-radius:var(--r-sm); font-size:.78125rem; font-weight:600; color:var(--text-2); white-space:nowrap; flex-shrink:0; }
.stv-pill:hover { border-color:rgba(14,165,233,.3); color:var(--navy); }
.stv-pill-dot { width:7px; height:7px; border-radius:50%; flex-shrink:0; }
.stv-channels__stats { display:grid; grid-template-columns:repeat(4,1fr); gap:1.25rem; margin:3rem 0; }
.stv-channels__stat { background:var(--card); border:1px solid var(--border); border-radius:var(--r-lg); padding:1.625rem 1.25rem; text-align:center; transition:.2s; }
.stv-channels__stat:hover { box-shadow:var(--shadow-md); transform:translateY(-3px); }
.stv-channels__stat-icon { width:42px; height:42px; border-radius:var(--r-sm); background:rgba(14,165,233,.1); display:flex; align-items:center; justify-content:center; margin:0 auto .875rem; }
.stv-channels__stat-icon svg { width:20px; height:20px; color:var(--teal-d); }
.stv-channels__stat-val { font-family:var(--font-ui); font-size:1.625rem; font-weight:800; color:var(--navy); letter-spacing:-.03em; line-height:1; margin-bottom:.3rem; }
.stv-channels__stat-lbl { font-size:.8rem; color:var(--text-2); font-weight:500; }
.stv-channels__cta { text-align:center; margin-top:.5rem; }
.stv-channels__cta-note { font-size:.875rem; color:var(--text-3); margin-top:.875rem; }
.btn-primary { display:inline-flex; align-items:center; gap:.5rem; padding:.8rem 1.875rem; font-family:var(--font-ui); font-size:.9375rem; font-weight:700; color:#fff; background:var(--grad-primary); border-radius:var(--r-sm); border:none; box-shadow:0 4px 16px rgba(10,21,53,.2); transition:.2s; cursor:pointer; }
.btn-primary:hover { transform:translateY(-2px); box-shadow:0 8px 28px rgba(10,21,53,.28); }

/* ════════════════════════════
   PRICING
════════════════════════════ */
.stv-pricing { background:var(--bg); }
.stv-pricing__grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1.25rem; align-items:start; }
.stv-pricing__wrap { position:relative; }
.stv-pricing__best-badge { position:absolute; top:-13px; left:50%; transform:translateX(-50%); display:inline-flex; align-items:center; gap:.3rem; padding:.28rem .9rem; background:var(--teal); color:#fff; font-size:.68rem; font-weight:800; border-radius:99px; white-space:nowrap; box-shadow:0 3px 12px rgba(14,165,233,.4); letter-spacing:.06em; z-index:2; }
.stv-pricing__card { background:var(--card); border:1.5px solid var(--border); border-radius:var(--r-lg); padding:1.875rem; transition:.25s var(--ease); }
.stv-pricing__card:hover { border-color:rgba(14,165,233,.3); box-shadow:var(--shadow-md); transform:translateY(-4px); }
.stv-pricing__card.featured { background:var(--navy); border-color:var(--navy); }
.stv-pricing__card.featured:hover { border-color:var(--teal); box-shadow:0 16px 48px rgba(10,21,53,.3); }
.stv-pricing__name { font-size:.8125rem; font-weight:700; text-transform:uppercase; letter-spacing:.09em; color:var(--text-3); margin-bottom:.2rem; }
.stv-pricing__card.featured .stv-pricing__name { color:rgba(255,255,255,.55); }
.stv-pricing__period { font-size:.8125rem; color:var(--text-3); margin-bottom:1.375rem; }
.stv-pricing__card.featured .stv-pricing__period { color:rgba(255,255,255,.4); }
.stv-pricing__price { font-family:var(--font-ui); font-size:2.875rem; font-weight:800; color:var(--navy); line-height:1; letter-spacing:-.04em; margin-bottom:1.5rem; }
.stv-pricing__price sup { font-size:1.2rem; vertical-align:super; font-weight:700; }
.stv-pricing__price sub { font-size:.78rem; font-weight:500; color:var(--text-3); letter-spacing:0; }
.stv-pricing__card.featured .stv-pricing__price { color:#fff; }
.stv-pricing__card.featured .stv-pricing__price sub { color:rgba(255,255,255,.45); }
.stv-pricing__rule { width:100%; height:1px; background:var(--border); margin-bottom:1.5rem; }
.stv-pricing__card.featured .stv-pricing__rule { background:rgba(255,255,255,.1); }
.stv-pricing__features { display:flex; flex-direction:column; gap:.575rem; margin-bottom:1.875rem; }
.stv-pricing__features li { display:flex; align-items:center; gap:.6rem; font-size:.84375rem; color:var(--text-2); }
.stv-pricing__card.featured .stv-pricing__features li { color:rgba(255,255,255,.72); }
.stv-pricing__check { width:18px; height:18px; border-radius:50%; background:rgba(14,165,233,.12); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.stv-pricing__check svg { color:var(--teal); }
.stv-pricing__card.featured .stv-pricing__check { background:rgba(255,255,255,.1); }
.stv-pricing__card.featured .stv-pricing__check svg { color:#7DD3FC; }
.btn-order { display:flex; align-items:center; justify-content:center; width:100%; padding:.8125rem; font-family:var(--font-ui); font-size:.875rem; font-weight:700; border-radius:var(--r-sm); transition:.2s; cursor:pointer; border:none; }
.btn-order--outline { background:transparent; color:var(--navy); border:1.5px solid var(--border); }
.btn-order--outline:hover { border-color:var(--navy); background:rgba(10,21,53,.04); }
.btn-order--fill { background:var(--teal); color:#fff; box-shadow:0 4px 14px rgba(14,165,233,.35); }
.btn-order--fill:hover { background:var(--teal-d); transform:translateY(-2px); }
.btn-wa { display:flex; align-items:center; justify-content:center; gap:.4rem; width:100%; padding:.5rem; font-family:var(--font-ui); font-size:.78rem; font-weight:600; color:#16A34A; background:transparent; border:1px solid rgba(22,163,74,.25); border-radius:var(--r-sm); margin-top:.5rem; transition:.2s; cursor:pointer; }
.btn-wa:hover { background:rgba(22,163,74,.06); border-color:#16A34A; }
.stv-pricing__card.featured .btn-wa { color:#86EFAC; border-color:rgba(134,239,172,.2); }

/* ════════════════════════════
   TESTIMONIALS
════════════════════════════ */
.stv-testimonials { background:var(--navy); }
.stv-trust-badge { display:inline-flex; align-items:center; gap:.625rem; padding:.5rem 1.25rem; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.14); border-radius:99px; margin-bottom:3rem; font-size:.875rem; font-weight:600; color:rgba(255,255,255,.8); }
.stv-trust-badge__stars { color:#F59E0B; font-size:1rem; letter-spacing:.05em; }
.stv-testi-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.25rem; }
.stv-testi-card { background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.1); border-radius:var(--r-lg); padding:1.875rem; transition:.25s; }
.stv-testi-card:hover { background:rgba(255,255,255,.09); border-color:rgba(255,255,255,.18); transform:translateY(-2px); }
.stv-testi-quote { font-size:2.25rem; font-weight:800; color:rgba(14,165,233,.4); line-height:1; margin-bottom:.5rem; font-family:Georgia,serif; }
.stv-testi-text { font-family:var(--font-serif); font-style:italic; font-size:.9375rem; color:rgba(255,255,255,.72); line-height:1.8; margin-bottom:1.375rem; }
.stv-testi-footer { display:flex; justify-content:space-between; align-items:flex-end; border-top:1px solid rgba(255,255,255,.1); padding-top:1.125rem; }
.stv-testi-name { font-family:var(--font-ui); font-size:.875rem; font-weight:700; color:#fff; display:flex; align-items:center; gap:.5rem; }
.stv-testi-verified { font-size:.65rem; font-weight:700; color:var(--teal); background:rgba(14,165,233,.15); padding:.1rem .45rem; border-radius:99px; }
.stv-testi-loc { font-size:.78rem; color:rgba(255,255,255,.45); margin-top:.15rem; }
.stv-testi-stars { color:#F59E0B; font-size:.875rem; letter-spacing:.05em; }
.stv-testi-date { font-size:.72rem; color:rgba(255,255,255,.35); margin-top:.2rem; text-align:right; }
.stv-testi-join { text-align:center; margin-top:3rem; font-size:.9375rem; color:rgba(255,255,255,.5); }
.stv-testi-join strong { color:#fff; }

/* ════════════════════════════
   FREE TRIAL CTA
════════════════════════════ */
.stv-trial { background:var(--bg-alt); }
.stv-trial__card { max-width:52rem; margin:0 auto; background:var(--card); border:1px solid var(--border); border-radius:var(--r-xl); padding:4rem 3rem; text-align:center; box-shadow:var(--shadow-lg); position:relative; overflow:hidden; }
.stv-trial__card::before { content:''; position:absolute; top:0; left:0; right:0; height:3px; background:var(--grad-teal); }
.stv-trial__icon { width:60px; height:60px; border-radius:var(--r-lg); background:rgba(14,165,233,.1); display:flex; align-items:center; justify-content:center; margin:0 auto 1.5rem; }
.stv-trial__icon svg { width:28px; height:28px; color:var(--teal-d); }
.stv-trial__h2 { font-family:var(--font-ui); font-size:clamp(1.75rem,3.5vw,2.5rem); font-weight:800; color:var(--navy); letter-spacing:-.03em; line-height:1.1; margin-bottom:.875rem; }
.stv-trial__h2 .grad { background:var(--grad-teal); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.stv-trial__p { font-size:1rem; color:var(--text-2); line-height:1.75; max-width:32rem; margin:0 auto 2.25rem; }
.btn-trial { display:inline-flex; align-items:center; gap:.625rem; padding:.9375rem 2.25rem; font-family:var(--font-ui); font-size:1rem; font-weight:700; color:#fff; background:var(--grad-primary); border-radius:var(--r-md); border:none; box-shadow:0 6px 24px rgba(10,21,53,.22); transition:.2s; cursor:pointer; }
.btn-trial:hover { transform:translateY(-3px); box-shadow:0 12px 36px rgba(10,21,53,.3); }
.stv-trial__trust { display:flex; align-items:center; justify-content:center; gap:1.5rem; flex-wrap:wrap; margin-top:1.875rem; }
.stv-trial__trust-item { display:flex; align-items:center; gap:.4rem; font-size:.8125rem; color:var(--text-3); }
.stv-trial__trust-item svg { width:14px; height:14px; color:var(--teal-d); flex-shrink:0; }

/* ════════════════════════════
   FAQ
════════════════════════════ */
.stv-faq { background:var(--bg); }
.stv-faq__list { max-width:50rem; margin:0 auto; display:flex; flex-direction:column; gap:.625rem; }
.stv-faq__item { background:var(--card); border:1px solid var(--border); border-radius:var(--r-md); overflow:hidden; transition:border-color .2s; }
.stv-faq__item:hover { border-color:rgba(14,165,233,.3); }
.stv-faq__item.open { border-color:rgba(14,165,233,.4); }
.stv-faq__btn { width:100%; display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1.125rem 1.375rem; text-align:left; font-family:var(--font-ui); font-size:.9375rem; font-weight:600; color:var(--navy); background:none; border:none; cursor:pointer; transition:color .2s; }
.stv-faq__btn:hover { color:var(--teal-d); }
.stv-faq__icon { width:22px; height:22px; border-radius:50%; background:var(--border); display:flex; align-items:center; justify-content:center; flex-shrink:0; transition:background .2s,transform .25s; }
.stv-faq__icon svg { width:11px; height:11px; color:var(--text-2); }
.stv-faq__item.open .stv-faq__icon { background:var(--teal); transform:rotate(180deg); }
.stv-faq__item.open .stv-faq__icon svg { color:#fff; }
.stv-faq__body { max-height:0; overflow:hidden; transition:max-height .35s var(--ease); }
.stv-faq__item.open .stv-faq__body { max-height:300px; }
.stv-faq__body p { padding:0 1.375rem 1.25rem; font-size:.875rem; color:var(--text-2); line-height:1.75; }

/* ════════════════════════════
   FOOTER
════════════════════════════ */
.stv-footer { background:var(--navy); padding:4.5rem 0 2rem; }
.stv-footer__grid { display:grid; grid-template-columns:2.25fr 1fr 1fr 1fr; gap:3rem; margin-bottom:3.5rem; }
.stv-footer__logo-wrap { display:flex; align-items:center; gap:.625rem; margin-bottom:1.125rem; }
.stv-footer__logo-wrap img { height:40px; width:auto; }
.stv-footer__logo-text { font-family:var(--font-ui); font-size:1.05rem; font-weight:800; color:#fff; letter-spacing:-.03em; }
.stv-footer__logo-text em { font-style:normal; color:var(--teal); }
.stv-footer__brand p { font-size:.875rem; color:rgba(255,255,255,.42); line-height:1.75; max-width:22rem; margin-bottom:.5rem; }
.stv-footer__col h4 { font-family:var(--font-ui); font-size:.72rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:rgba(255,255,255,.45); margin-bottom:1.125rem; }
.stv-footer__col ul li a { font-size:.875rem; color:rgba(255,255,255,.48); transition:color .2s; display:block; padding:.2rem 0; }
.stv-footer__col ul li a:hover { color:#fff; }
.stv-footer__bottom { border-top:1px solid rgba(255,255,255,.08); padding-top:1.75rem; display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:.75rem; }
.stv-footer__bottom p { font-size:.8rem; color:rgba(255,255,255,.32); }
.stv-footer__bottom-links { display:flex; gap:1.5rem; flex-wrap:wrap; }
.stv-footer__bottom-links a { font-size:.8rem; color:rgba(255,255,255,.32); transition:color .2s; }
.stv-footer__bottom-links a:hover { color:rgba(255,255,255,.7); }

/* ════════════════════════════
   WA FLOAT BUTTON
════════════════════════════ */
.stv-wa-float { position:fixed; bottom:1.5rem; right:1.5rem; display:flex; align-items:center; gap:.5rem; padding:.625rem 1.125rem; background:#16A34A; color:#fff; font-family:var(--font-ui); font-size:.8125rem; font-weight:700; border-radius:99px; box-shadow:0 4px 20px rgba(22,163,74,.4); z-index:999; transition:.2s; cursor:pointer; }
.stv-wa-float:hover { transform:translateY(-3px); box-shadow:0 8px 28px rgba(22,163,74,.5); }
.stv-wa-float svg { width:19px; height:19px; flex-shrink:0; }

/* ════════════════════════════
   PAGE HERO (inner pages)
════════════════════════════ */
.stv-page-hero { padding:calc(var(--nav-h) + 3.5rem) 0 3rem; background:var(--grad-primary); position:relative; overflow:hidden; }
.stv-page-hero::before { content:''; position:absolute; inset:0; background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px); background-size:56px 56px; pointer-events:none; }
.stv-page-hero__inner { position:relative; z-index:2; max-width:52rem; margin:0 auto; text-align:center; }
.stv-page-hero__tag { display:inline-flex; align-items:center; gap:.4rem; padding:.28rem .875rem; background:rgba(255,255,255,.15); border:1px solid rgba(255,255,255,.25); border-radius:99px; font-size:.72rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:rgba(255,255,255,.9); margin-bottom:1rem; }
.stv-page-hero__title { font-family:var(--font-ui); font-size:clamp(1.75rem,4vw,3rem); font-weight:800; color:#fff; line-height:1.1; letter-spacing:-.03em; margin-bottom:.875rem; }
.stv-page-hero__title span { background:linear-gradient(135deg,#fff,rgba(255,255,255,.8)); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.stv-page-hero__sub { font-size:1rem; color:rgba(255,255,255,.8); max-width:36rem; margin:0 auto 1.75rem; line-height:1.7; }
.stv-page-hero__stats { display:flex; justify-content:center; gap:1.25rem; flex-wrap:wrap; margin-top:2rem; }
.stv-page-hero__stat { text-align:center; background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.2); border-radius:var(--r-md); padding:.75rem 1.25rem; backdrop-filter:blur(8px); }
.stv-page-hero__stat .num { display:block; font-family:var(--font-ui); font-size:1.5rem; font-weight:800; color:#fff; line-height:1; }
.stv-page-hero__stat .lbl { display:block; font-size:.68rem; color:rgba(255,255,255,.7); text-transform:uppercase; letter-spacing:.08em; margin-top:.25rem; }
.stv-page-hero__btns { display:flex; gap:.875rem; justify-content:center; flex-wrap:wrap; margin-top:1.5rem; }
.btn-hero-white { display:inline-flex; align-items:center; gap:.45rem; padding:.75rem 1.625rem; background:#fff; color:var(--navy); font-size:.9375rem; font-weight:700; border-radius:var(--r-sm); transition:.2s; border:none; }
.btn-hero-white:hover { transform:translateY(-2px); box-shadow:0 8px 24px rgba(0,0,0,.2); }
.btn-hero-outline { display:inline-flex; align-items:center; gap:.45rem; padding:.75rem 1.625rem; background:transparent; color:#fff; font-size:.9375rem; font-weight:700; border:2px solid rgba(255,255,255,.35); border-radius:var(--r-sm); transition:.2s; }
.btn-hero-outline:hover { border-color:#fff; background:rgba(255,255,255,.08); }
.btn-teal { display:inline-flex; align-items:center; gap:.5rem; padding:.8rem 1.875rem; font-family:var(--font-ui); font-size:.9375rem; font-weight:700; color:#fff; background:var(--teal); border-radius:var(--r-sm); border:none; box-shadow:0 4px 14px rgba(14,165,233,.35); transition:.2s; cursor:pointer; }
.btn-teal:hover { background:var(--teal-d); transform:translateY(-2px); }

/* ════════════════════════════
   RESPONSIVE
════════════════════════════ */
@media (max-width:1024px) {
  .stv-hero__right { display:none; }
  .stv-channels__stats { grid-template-columns:1fr 1fr; }
  .stv-pricing__grid { grid-template-columns:1fr 1fr; }
  .stv-testi-grid { grid-template-columns:1fr 1fr; }
  .stv-footer__grid { grid-template-columns:1fr 1fr 1fr; gap:2rem; }
}
@media (max-width:768px) {
  :root { --nav-h:64px; --section-py:4rem; }
  .stv-nav__links { display:none; }
  .stv-nav__actions .btn-ghost { display:none; }
  .stv-nav__burger { display:flex; }
  .stv-hero { max-height:none; height:100svh; }
  .stv-hero__left { padding:0 1.5rem 6rem; }
  .stv-hero__h1 { font-size:clamp(2rem,7vw,2.75rem); }
  .stv-hero__checks { display:none; }
  .stv-hero__counter, .stv-scroll-cue { display:none; }
  .stv-stats-row__divider { display:none; }
  .stv-stats-row__inner { justify-content:center; gap:1rem; }
  .stv-vod-poster { width:90px; }
  .stv-pricing__grid { grid-template-columns:1fr; }
  .stv-testi-grid { grid-template-columns:1fr; }
  .stv-trial__card { padding:2.5rem 1.5rem; }
  .stv-footer__grid { grid-template-columns:1fr 1fr; }
}
@media (max-width:480px) {
  .stv-footer__grid { grid-template-columns:1fr; }
  .stv-trial__trust { gap:1rem; }
  .stv-hero__controls { bottom:1.5rem; }
}

/* ════════════════════════════
   WORDPRESS BLOCK EDITOR
════════════════════════════ */
.wp-block-image img { max-width:100%; height:auto; border-radius:var(--r-md); }
.wp-block-quote { border-left:3px solid var(--teal); padding-left:1.25rem; font-family:var(--font-serif); font-style:italic; color:var(--text-2); }
.wp-block-separator { border:none; border-top:1px solid var(--border); margin:2rem 0; }
.entry-content h1,.entry-content h2,.entry-content h3 { font-family:var(--font-ui); font-weight:700; color:var(--navy); margin-bottom:.75rem; margin-top:1.5rem; }
.entry-content p { line-height:1.75; color:var(--text-2); margin-bottom:1rem; }
.entry-content a { color:var(--teal-d); text-decoration:underline; }
.entry-content ul,.entry-content ol { padding-left:1.5rem; margin-bottom:1rem; }
.entry-content ul { list-style:disc; }
.entry-content ol { list-style:decimal; }