
:root{
  --bg:#0b0c10;
  --fg:#ffffff;
  --muted:rgba(255,255,255,.7);
  --card:rgba(0,0,0,.4);
  --stroke:rgba(255,255,255,.12);
  --accent:#ff4d4f;
  --grad1: rgba(0,153,255,.18);
  --grad2: rgba(255,0,128,.12);
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
  color:var(--fg);
  background: var(--bg);
  background-image:
    radial-gradient(60rem 40rem at top right, var(--grad1), transparent),
    radial-gradient(60rem 40rem at bottom left, var(--grad2), transparent);
}

.container{max-width:1100px;margin:0 auto;padding:24px 20px 80px}

.nav{
  max-width:1100px;margin:0 auto;
  padding:18px 20px;
  display:flex;align-items:center;justify-content:space-between;
  color:var(--muted);
}
.brand{display:flex;align-items:center;gap:10px}
.logo{
  width:36px;height:36px;border-radius:12px;
  display:grid;place-items:center;
  background:rgba(255,255,255,.08);
  border:1px solid var(--stroke);
  font-weight:800;
}
.program{font-size:14px;opacity:.7}

.hero{margin-top:14px;text-align:center}
.hero h1{
  font-weight:700;line-height:1.2;margin:0 auto;
  font-size: clamp(28px, 4vw, 44px);
  max-width: 980px;
}
.hero h1 em{font-style:italic;opacity:.9}
.hero h1 strong{font-weight:800}
.hero .sub{
  margin:14px auto 0;
  max-width:800px;
  color:var(--muted);
  font-size: clamp(16px, 2.2vw, 20px);
}

.video-card{
  margin:28px auto 0;
  background:var(--card);
  border:1px solid var(--stroke);
  border-radius:16px;
  overflow:hidden;
  box-shadow:0 20px 60px rgba(0,0,0,.35);
  max-width:900px;
}
.video-wrap{position:relative;width:100%;aspect-ratio:16/9;background:#000}
.video-wrap iframe{position:absolute;inset:0;width:100%;height:100%}
.deadline{
  margin:0;padding:14px;
  text-align:center;
  color:var(--muted);
  border-top:1px solid var(--stroke);
  font-size:14px;
}

.cta{margin:22px 0 0;text-align:center}
.btn{
  display:inline-block;
  background:var(--accent);
  color:#fff;text-decoration:none;
  padding:16px 26px;border-radius:16px;
  font-weight:700;box-shadow:0 10px 30px rgba(255,77,79,.35);
  transition:.2s transform ease,.2s filter ease;
}
.btn:hover{transform:translateY(-1px);filter:brightness(1.05)}
.cta-sub{margin:8px 0 0;color:var(--muted);font-size:14px}

.authority{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:12px;margin:28px auto 0;max-width:900px;
}
.pill{
  text-align:center;padding:12px 16px;border-radius:12px;
  background:rgba(255,255,255,.06);
  border:1px solid var(--stroke);
  color:rgba(255,255,255,.85);
  font-size:14px;
}

.footer{
  text-align:center;color:rgba(255,255,255,.5);
  padding:28px 16px;border-top:1px solid var(--stroke);
  margin-top:48px;font-size:12px;
}
