.cursor-glow{
  position:fixed;
  top:0;
  left:0;
  width:120px;
  height:120px;
  border-radius:50%;
  pointer-events:none;
  transform:translate(-50%, -50%);
  background:radial-gradient(circle at center, rgba(255,8,8,.4) 0%, rgba(255,8,8,.16) 30%, rgba(255,8,8,0) 75%);
  filter:blur(8px);
  opacity:.9;
  mix-blend-mode:screen;
  z-index:9999;
  transition:width .18s ease, height .18s ease, opacity .18s ease, transform .18s ease;
}
.cursor-glow.hidden{opacity:0}

.nav{
  position:fixed;
  top:0;
  left:0;
  right:0;
  z-index:20;
  background:rgba(5,5,5,.88);
  backdrop-filter:blur(16px);
  border-bottom:1px solid var(--line);
}
.nav-inner{
  width:var(--max);
  max-width:1540px;
  margin:0 auto;
  padding:16px 0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
}
.brand{
  min-width:0;
  display:flex;
  align-items:center;
  gap:12px;
  font-weight:800;
  letter-spacing:0;
  white-space:nowrap;
}
.logo-img{height:40px;width:auto;flex:0 0 auto;object-fit:contain}
.brand small{font-weight:800;color:var(--red);letter-spacing:0}
.nav-links{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:20px;
  color:#9c9ca2;
  font-size:14px;
  font-weight:700;
}
.nav-links a{border-radius:10px}
.nav-links a:hover,.nav-links a.active{color:#fff}
.nav-cta{
  padding:10px 15px;
  border:1px solid rgba(255,8,8,.45);
  border-radius:999px;
  color:#fff;
  background:rgba(255,8,8,.08);
  cursor:pointer;
}
.nav-cta:hover{background:rgba(255,8,8,.18)}
.menu-btn{
  display:none;
  flex:0 0 auto;
  min-height:42px;
  background:#111;
  border:1px solid var(--line);
  color:#fff;
  border-radius:10px;
  padding:9px 13px;
  font-weight:800;
  cursor:pointer;
}

.actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:30px}
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  min-height:48px;
  max-width:100%;
  padding:0 18px;
  border-radius:10px;
  font-weight:900;
  text-align:center;
  border:1px solid var(--line);
  background:#121214;
  color:#fff;
  transition:transform .18s ease, border-color .18s ease, background .18s ease;
}
.btn.primary{background:var(--red);border-color:var(--red);color:#fff;box-shadow:0 18px 44px rgba(255,8,8,.22)}

.video-card{
  margin-top:34px;
  border:1px solid var(--line);
  border-radius:var(--radius);
  overflow:hidden;
  background:var(--panel);
  position:relative;
}
.video-box{aspect-ratio:16/9;background:#0d0d0e;position:relative;overflow:hidden}
.video-box video{width:100%;height:100%;object-fit:cover;opacity:.56}
.video-box:after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(255,8,8,.22),transparent 45%,rgba(0,0,0,.4))}
.play{
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  width:78px;
  height:78px;
  border-radius:50%;
  background:#fff;
  color:#050505;
  display:grid;
  place-items:center;
  font-size:28px;
  z-index:2;
}
.video-meta{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:15px 18px;
  border-top:1px solid var(--line);
}
.video-meta strong{font-size:14px}
.video-meta span{font-size:12px;color:var(--muted)}

.card{
  position:relative;
  min-width:0;
  background:linear-gradient(180deg,#111113,#09090a);
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:26px;
  min-height:210px;
  transition:transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.card .icon{
  width:44px;
  height:44px;
  border-radius:10px;
  background:rgba(255,8,8,.12);
  border:1px solid rgba(255,8,8,.28);
  display:grid;
  place-items:center;
  color:var(--red);
  font-weight:900;
  margin-bottom:28px;
}
.card h3{margin-bottom:12px}
.card p{font-size:.9375rem}

.mock-app{
  min-width:0;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:#09090a;
  overflow:hidden;
  box-shadow:0 20px 80px rgba(0,0,0,.4);
}
.mock-top{
  display:flex;
  justify-content:space-between;
  gap:12px;
  padding:14px 16px;
  border-bottom:1px solid var(--line);
  color:#aaa;
  font-size:12px;
}
.mock-top span{min-width:0}
.dot{width:8px;height:8px;border-radius:50%;background:#18d26b;display:inline-block;margin-right:7px}
.mock-body{padding:20px;display:grid;gap:14px}
.timeline{height:58px;border-radius:10px;background:linear-gradient(90deg,#171719 0 25%,#2d0b0b 25% 38%,#171719 38% 63%,#111d31 63% 100%);border:1px solid #232328}
.transcript{background:#111113;border:1px solid #222;border-radius:12px;padding:18px;color:#bdbdc4}
.transcript mark{background:rgba(255,8,8,.18);color:#fff;padding:2px 4px;border-radius:5px}
.caption-preview{
  aspect-ratio:16/8;
  border-radius:12px;
  background:url('https://images.unsplash.com/photo-1611162618071-b39a2ec055fb?auto=format&fit=crop&w=1000&q=80') center/cover;
  display:flex;
  align-items:end;
  justify-content:center;
  padding:22px;
  position:relative;
  overflow:hidden;
}
.caption-preview:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent,rgba(0,0,0,.8))}
.caption-preview strong{
  position:relative;
  z-index:1;
  max-width:100%;
  background:#fff;
  color:#000;
  padding:8px 12px;
  border-radius:9px;
  text-align:center;
}
