:root{
  /* Palette from your images */
  --ink:#070b12;
  --midnight:#131b21;
  --slate:#29313a;
  --teal:#44606a;
  --violet:#27194a;
  --indigo:#362b65;
  --space:#140e2b;
  --lavender:#4f3c80;
  --silver:#abb2cc;
  --accent:#ab8bff; /* calculated neon accent for glows */
}

*{ box-sizing:border-box; }
html,body{ height:100%; }
body{
  margin:0;
  font-family:"Outfit",system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
  color:#e9ecf4;
  background:
    radial-gradient(1200px 800px at 10% -10%, rgba(79,60,128,.35), transparent 60%),
    radial-gradient(1200px 800px at 90% 10%, rgba(54,43,101,.35), transparent 60%),
    linear-gradient(160deg, var(--space), var(--violet) 40%, var(--midnight));
  line-height:1.6;
}

.container{
  width:min(1100px, 92vw);
  margin-inline:auto;
}

/* Hero */
.hero{
  position:relative;
  min-height:92vh;
  display:grid;
  place-items:center;
  text-align:center;
  overflow:hidden;
}

.hero__media{
  position:absolute; inset:0; z-index:-2; overflow:hidden;
}

.hero__video{
  width:100%; height:100%;
  object-fit:cover;
  filter:contrast(1.05) saturate(1.1) brightness(.9);
}

.hero__overlay{
  position:absolute; inset:0; z-index:1;
  background:
    radial-gradient(60% 60% at 50% 40%, rgba(20,14,43,.0), rgba(20,14,43,.55) 70%),
    linear-gradient(180deg, rgba(19,27,33,.25), rgba(19,27,33,.75));
  backdrop-filter: blur(.5px);
}

.hero__content{ position:relative; z-index:2; padding:4rem 0; }

.brand{
  font-size: clamp(2.8rem, 6vw, 5rem);
  letter-spacing:.02em;
  margin:0 0 .3rem;
  font-weight:700;
  text-shadow: 0 0 22px rgba(171,139,255,.35);
}

.tagline{
  margin:0 0 1.8rem;
  font-weight:300;
  color:var(--silver);
}

.cta{
  display:flex;
  flex-wrap:wrap;
  gap:.9rem;
  justify-content:center;
}

.btn{
  --bg: linear-gradient(135deg, var(--indigo), var(--violet));
  --glow: 0 0 22px rgba(171,139,255,.35);
  padding:.9rem 1.2rem;
  border-radius:999px;
  background:var(--bg);
  border:1px solid rgba(171,139,255,.35);
  color:white; text-decoration:none; font-weight:600;
  box-shadow: var(--glow);
  transition: transform .15s ease, box-shadow .2s ease, filter .2s ease;
}
.btn:hover{ transform:translateY(-1px); filter:brightness(1.08); box-shadow:0 0 30px rgba(171,139,255,.55); }

.btn--alt{
  --bg: linear-gradient(135deg, var(--teal), var(--slate));
}

.btn--ghost{
  background:transparent;
  border:1px solid rgba(171,139,255,.35);
  color:#e9ecf4;
}

/* Sections */
.section{ padding:3.5rem 0; }
.bio{
  margin:0 auto;
  max-width:60ch;
  color:#dfe4f3;
  opacity:.9;
  text-align:center;
}

/* Video embed */
.section--video h2{
  margin:0 0 1rem;
  font-size: clamp(1.6rem, 3vw, 2rem);
  text-align:center;
}

.embed{
  position:relative;
  aspect-ratio:16/9;
  width:100%;
  border-radius:18px;
  overflow:hidden;
  box-shadow: 0 20px 60px rgba(0,0,0,.45), 0 0 0 1px rgba(171,139,255,.2) inset;
  background:linear-gradient(135deg, rgba(54,43,101,.35), rgba(19,27,33,.6));
}
.embed iframe{
  position:absolute; inset:0; width:100%; height:100%; border:0;
}

.caption{
  margin:.8rem 0 0;
  text-align:center;
  color:var(--silver);
}

/* Footer */
.footer{
  padding:2.2rem 0;
  border-top:1px solid rgba(171,139,255,.18);
  background:linear-gradient(180deg, rgba(19,27,33,.4), rgba(19,27,33,.65));
  text-align:center;
  color:#cfd6ea;
}

/* Reduced motion: tone down large effects */
@media (prefers-reduced-motion: reduce){
  .btn{ transition:none; }
}
