:root{
      --bg:#07090d;
      --bg-soft:#0d1118;
      --card:#10151e;
      --card-2:#141a24;
      --text:#f5f7fb;
      --muted:#9da7b6;
      --line:rgba(255,255,255,.09);
      --accent:#8ee3ff;
      --accent-2:#f4c7ff;
      --accent-3:#d7ff9a;
      --max:1240px;
      --radius:26px;
      --shadow:0 24px 80px rgba(0,0,0,.34);
    }

    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;
      font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
      background:
        radial-gradient(circle at 10% -4%, rgba(84,122,255,.11), transparent 30%),
        radial-gradient(circle at 95% 4%, rgba(214,102,255,.10), transparent 27%),
        var(--bg);
      color:var(--text);
      line-height:1.5;
    }

    a{color:inherit;text-decoration:none}
    button{font:inherit}
    .container{width:min(var(--max), calc(100% - 40px));margin-inline:auto}

    /* NAV */
    .nav-wrap{
      position:sticky;top:0;z-index:50;
      backdrop-filter:blur(18px);
      background:rgba(7,9,13,.74);
      border-bottom:1px solid rgba(255,255,255,.06);
    }
    .nav{
      min-height:78px;
      display:flex;align-items:center;justify-content:space-between;gap:24px;
    }
    .brand{
      display:flex;align-items:center;gap:12px;
      font-weight:800;letter-spacing:-.04em;font-size:1.35rem;
    }
    .brand-mark{
      width:34px;height:34px;border-radius:10px;position:relative;overflow:hidden;
      background:linear-gradient(135deg,var(--accent),var(--accent-2) 55%,var(--accent-3));
      box-shadow:0 0 30px rgba(142,227,255,.16);
    }
    .brand-mark:before{
      content:"";
      position:absolute;inset:8px 9px 8px 12px;
      clip-path:polygon(0 0,100% 50%,0 100%);
      background:#071016;border-radius:2px;
    }
    .nav-links{display:flex;align-items:center;gap:28px;color:#cbd3df;font-size:.95rem}
    .nav-links a{position:relative}
    .nav-links a:hover{color:#fff}
    .nav-links a.active{color:#fff}
    .nav-links a.active:after{
      content:"";
      position:absolute;left:0;right:0;bottom:-12px;height:2px;border-radius:99px;
      background:linear-gradient(90deg,var(--accent),var(--accent-2));
    }
    .nav-cta{
      display:inline-flex;align-items:center;justify-content:center;
      padding:12px 18px;border-radius:999px;
      border:1px solid rgba(255,255,255,.12);
      background:#fff;color:#0b0d10;font-weight:750;
    }
    .menu-btn{display:none;background:none;border:0;color:#fff;font-size:1.5rem}

    /* HERO */
    .page-hero{
      padding:86px 0 54px;
      overflow:hidden;
    }
    .hero-grid{
      display:grid;
      grid-template-columns:1.1fr .9fr;
      gap:70px;
      align-items:end;
    }
    .eyebrow{
      display:inline-flex;align-items:center;gap:9px;
      padding:7px 12px;
      border:1px solid var(--line);
      background:rgba(255,255,255,.04);
      border-radius:999px;
      color:#c8d1df;
      font-size:.82rem;
      letter-spacing:.04em;
      text-transform:uppercase;
    }
    .dot{
      width:8px;height:8px;border-radius:50%;
      background:var(--accent);box-shadow:0 0 18px rgba(142,227,255,.8);
    }
    h1{
      margin:18px 0 16px;
      font-size:clamp(3.3rem,7vw,6.4rem);
      line-height:.91;
      letter-spacing:-.07em;
    }
    .gradient-text{
      background:linear-gradient(90deg,#fff 0%,#9fe9ff 40%,#e7c8ff 76%,#eaffc8 100%);
      -webkit-background-clip:text;background-clip:text;color:transparent;
    }
    .hero-copy{
      max-width:700px;
      color:var(--muted);
      font-size:clamp(1rem,1.55vw,1.15rem);
      margin:0;
    }
    .hero-note{
      padding:22px 24px;
      border:1px solid var(--line);
      border-radius:22px;
      background:rgba(255,255,255,.035);
      color:#bcc5d0;
    }
    .hero-note strong{display:block;color:#fff;margin-bottom:7px}
    .hero-note p{margin:0}

    /* FEATURED */
    .featured-section{padding:26px 0 72px}
    .featured{
      position:relative;
      min-height:620px;
      border-radius:34px;
      border:1px solid rgba(255,255,255,.09);
      overflow:hidden;
      background:
        radial-gradient(circle at 70% 18%, rgba(255,201,151,.42), transparent 18%),
        linear-gradient(160deg,#536879 0%,#243543 46%,#0b1217 100%);
      box-shadow:var(--shadow);
    }
    .featured:before{
      content:"";
      position:absolute;inset:auto 0 0;height:62%;
      background:#101a20;
      clip-path:polygon(0 67%,15% 45%,28% 60%,41% 28%,55% 58%,70% 18%,84% 50%,100% 32%,100% 100%,0 100%);
      opacity:.9;
    }
    .featured:after{
      content:"";
      position:absolute;inset:0;
      background:linear-gradient(90deg,rgba(3,6,9,.82) 0%,rgba(3,6,9,.42) 42%,rgba(3,6,9,.08) 70%);
    }
    .featured-content{
      position:relative;z-index:2;
      min-height:620px;
      display:flex;flex-direction:column;justify-content:flex-end;
      padding:54px;
      max-width:670px;
    }
    .featured-label{
      display:inline-flex;align-items:center;gap:8px;
      color:#d5dce6;text-transform:uppercase;letter-spacing:.12em;font-size:.78rem;font-weight:800;
      margin-bottom:12px;
    }
    .featured h2{
      margin:0;
      font-size:clamp(2.5rem,5vw,4.8rem);
      line-height:.95;
      letter-spacing:-.055em;
    }
    .featured p{color:#c0c8d2;max-width:560px;margin:16px 0 24px}
    .featured-actions{display:flex;flex-wrap:wrap;gap:12px}
    .btn{
      display:inline-flex;align-items:center;justify-content:center;gap:10px;
      min-height:50px;padding:0 20px;border-radius:999px;
      border:1px solid transparent;font-weight:750;
      transition:.2s ease;
    }
    .btn-primary{background:#fff;color:#0b0d10}
    .btn-secondary{border-color:rgba(255,255,255,.14);background:rgba(255,255,255,.04);color:#fff}
    .btn:hover{transform:translateY(-2px)}
    .featured-index{
      position:absolute;top:34px;right:38px;z-index:2;
      font-size:5.6rem;line-height:1;font-weight:800;letter-spacing:-.07em;
      color:rgba(255,255,255,.11);
    }

    /* LIBRARY */
    .library{padding:72px 0 92px}
    .section-head{
      display:flex;align-items:end;justify-content:space-between;gap:30px;
      margin-bottom:28px;
    }
    .section-kicker{
      color:var(--accent);
      text-transform:uppercase;
      letter-spacing:.12em;
      font-size:.78rem;
      font-weight:800;
    }
    h2.section-title{
      font-size:clamp(2.2rem,4.2vw,4rem);
      line-height:.96;
      letter-spacing:-.052em;
      margin:9px 0 0;
    }
    .section-copy{max-width:520px;color:var(--muted)}

    .filters{
      display:flex;flex-wrap:wrap;gap:10px;
      margin:0 0 30px;
    }
    .filter-btn{
      border:1px solid var(--line);
      background:rgba(255,255,255,.025);
      color:#aeb7c4;
      padding:10px 14px;
      border-radius:999px;
      cursor:pointer;
      transition:.2s ease;
    }
    .filter-btn:hover,
    .filter-btn.active{
      color:#071016;
      background:#fff;
      border-color:#fff;
    }

    .video-grid{
      display:grid;
      grid-template-columns:repeat(3,1fr);
      gap:18px;
    }
    .video-card{
      position:relative;
      min-height:560px;
      border-radius:28px;
      border:1px solid rgba(255,255,255,.08);
      overflow:hidden;
      background:var(--card);
      box-shadow:0 15px 50px rgba(0,0,0,.14);
      transition:transform .25s ease,border-color .25s ease,opacity .2s ease;
    }
    .video-card:hover{
      transform:translateY(-5px);
      border-color:rgba(255,255,255,.16);
    }
    .video-card.hidden{display:none}
    .video-art{position:absolute;inset:0}
    .video-art:after{
      content:"";position:absolute;inset:0;
      background:linear-gradient(180deg,rgba(0,0,0,.02) 30%,rgba(0,0,0,.77) 100%);
    }
    .art-1{
      background:
        radial-gradient(circle at 70% 18%,rgba(255,220,178,.5),transparent 18%),
        linear-gradient(145deg,#5a6b7c,#293a48 52%,#0b1217);
    }
    .art-2{
      background:
        radial-gradient(circle at 40% 22%,rgba(153,211,255,.38),transparent 20%),
        linear-gradient(150deg,#2f4b60,#172833 58%,#091014);
    }
    .art-3{
      background:
        radial-gradient(circle at 55% 20%,rgba(238,174,255,.34),transparent 19%),
        linear-gradient(150deg,#553545,#271b25 58%,#0d0a0d);
    }
    .art-4{
      background:
        radial-gradient(circle at 65% 18%,rgba(198,235,163,.35),transparent 18%),
        linear-gradient(145deg,#475439,#222d1d 60%,#0b0f09);
    }
    .art-5{
      background:
        radial-gradient(circle at 48% 18%,rgba(177,199,255,.34),transparent 19%),
        linear-gradient(150deg,#3b4960,#1a2432 58%,#0b0f15);
    }
    .art-6{
      background:
        radial-gradient(circle at 55% 17%,rgba(255,188,149,.32),transparent 17%),
        linear-gradient(145deg,#5d463d,#2a211d 60%,#100c0a);
    }
    .art-7{
      background:
        radial-gradient(circle at 38% 16%,rgba(200,226,255,.33),transparent 19%),
        linear-gradient(150deg,#425668,#1d2d3a 58%,#0b1015);
    }
    .art-8{
      background:
        radial-gradient(circle at 62% 17%,rgba(228,195,255,.28),transparent 18%),
        linear-gradient(145deg,#4d4056,#241d2b 58%,#0d0a10);
    }
    .art-9{
      background:
        radial-gradient(circle at 55% 17%,rgba(223,240,170,.3),transparent 18%),
        linear-gradient(150deg,#4c5634,#202718 58%,#0b0e08);
    }
    .silhouette{
      position:absolute;left:0;right:0;bottom:0;height:54%;
      background:#10181d;
      clip-path:polygon(0 70%,15% 48%,29% 62%,44% 30%,58% 57%,72% 22%,84% 50%,100% 36%,100% 100%,0 100%);
      opacity:.88;
    }
    .play{
      position:absolute;left:22px;top:22px;z-index:2;
      width:48px;height:48px;border-radius:50%;
      display:grid;place-items:center;
      background:rgba(255,255,255,.9);
      color:#080a0d;
      box-shadow:0 12px 36px rgba(0,0,0,.28);
      font-size:1rem;
    }
    .video-number{
      position:absolute;right:20px;top:18px;z-index:2;
      color:rgba(255,255,255,.38);font-weight:800;font-size:1rem;
    }
    .video-meta{
      position:absolute;z-index:2;left:24px;right:24px;bottom:24px;
    }
    .video-meta small{
      color:#c1cad5;text-transform:uppercase;letter-spacing:.11em;font-size:.72rem;
    }
    .video-meta h3{
      margin:6px 0 7px;
      font-size:1.5rem;
      letter-spacing:-.025em;
    }
    .video-meta p{margin:0;color:#adb7c3;font-size:.92rem}
    .video-tags{display:flex;flex-wrap:wrap;gap:7px;margin-top:14px}
    .video-tag{
      font-size:.72rem;
      padding:6px 9px;border-radius:999px;
      border:1px solid rgba(255,255,255,.11);
      background:rgba(0,0,0,.18);
      color:#c7cfda;
    }

    /* DISCOVERY */
    .discovery{padding:0 0 92px}
    .discover-card{
      border-radius:34px;
      border:1px solid var(--line);
      background:
        radial-gradient(circle at 13% 22%,rgba(132,219,255,.10),transparent 31%),
        radial-gradient(circle at 86% 0%,rgba(236,188,255,.10),transparent 27%),
        #0d1118;
      padding:58px;
      display:grid;
      grid-template-columns:1fr auto;
      align-items:center;
      gap:40px;
    }
    .discover-card h2{
      margin:8px 0 12px;
      font-size:clamp(2.3rem,4vw,4rem);
      line-height:.96;
      letter-spacing:-.052em;
    }
    .discover-card p{margin:0;color:var(--muted);max-width:700px}
    .platform-list{display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end}
    .platform-link{
      padding:12px 15px;border:1px solid var(--line);
      border-radius:999px;color:#d0d7e1;background:rgba(255,255,255,.03);
    }
    .platform-link:hover{background:#fff;color:#0a0d11}

    /* FOOTER */
    footer{padding:50px 0 34px;color:#8c96a5}
    .footer-grid{
      display:grid;grid-template-columns:1.2fr .8fr .8fr .8fr;gap:36px;
      padding-bottom:42px;border-bottom:1px solid var(--line);
    }
    .footer-brand p{max-width:360px}
    .footer-col h4{color:#dbe2eb;margin:0 0 14px}
    .footer-col a{display:block;margin:9px 0;color:#8f99a8}
    .footer-col a:hover{color:#fff}
    .footer-bottom{
      display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;
      padding-top:24px;font-size:.88rem;
    }

    .reveal{
      opacity:0;
      transform:translateY(24px);
      transition:opacity .7s ease,transform .7s ease;
    }
    .reveal.in{opacity:1;transform:none}

    @media (max-width:980px){
      .nav-links{display:none}
      .menu-btn{display:block}
      .nav-links.open{
        display:flex;position:absolute;left:20px;right:20px;top:78px;
        flex-direction:column;align-items:stretch;
        background:#0d1118;padding:18px;border:1px solid var(--line);border-radius:18px;
      }
      .hero-grid{grid-template-columns:1fr;gap:30px}
      .featured,.featured-content{min-height:540px}
      .video-grid{grid-template-columns:1fr 1fr}
      .section-head{align-items:start;flex-direction:column}
      .discover-card{grid-template-columns:1fr}
      .platform-list{justify-content:flex-start}
      .footer-grid{grid-template-columns:1fr 1fr}
    }

    @media (max-width:640px){
      .container{width:min(100% - 28px,var(--max))}
      .nav{min-height:70px}
      .page-hero{padding:54px 0 38px}
      h1{font-size:clamp(3.25rem,18vw,5.1rem)}
      .featured{min-height:500px}
      .featured-content{min-height:500px;padding:30px 24px}
      .featured-index{font-size:3.8rem;right:20px;top:20px}
      .library{padding:58px 0 74px}
      .video-grid{grid-template-columns:1fr}
      .video-card{min-height:560px}
      .discover-card{padding:38px 24px}
      .footer-grid{grid-template-columns:1fr}
    }

/* WordPress bridge: content/media only; source design rules above remain unchanged. */
.admin-bar .nav-wrap{top:32px}
.hv-poster-media{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.hv-poster-media + .silhouette{display:none}
.video-art.hv-image:after,.poster.hv-image:after{z-index:1}
.video-card[href]{color:inherit}
.video-card .play,.video-card .video-number,.video-card .video-meta{z-index:2}
.featured.hv-featured-image{background-size:cover;background-position:center}
.featured.hv-featured-image:before{background:linear-gradient(90deg,rgba(7,9,13,.95) 0%,rgba(7,9,13,.74) 48%,rgba(7,9,13,.28) 100%)}
.video-frame iframe,.video-frame video,.video-shell iframe,.video-shell video{width:100%;height:100%;border:0;object-fit:cover;display:block}
.hv-pagination a,.hv-pagination span{color:inherit}
.hv-wp-content p:first-child{margin-top:0}
@media (max-width:782px){.admin-bar .nav-wrap{top:46px}}
.brand-logo{height:34px;width:auto;max-width:150px;object-fit:contain;display:block}
.featured.hv-featured-image:before{display:none!important}
.featured.hv-featured-image:after{background:linear-gradient(90deg,rgba(3,6,9,.86) 0%,rgba(3,6,9,.48) 46%,rgba(3,6,9,.12) 74%)!important}
.pagination .nav-links{display:flex!important;position:static!important;background:none!important;border:0!important;padding:0!important;flex-direction:row!important}
