*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,sans-serif;
  background:#000;
  color:#f0eaef;
  padding-top:60px;
}
a{color:inherit;text-decoration:none}

/* ── Shared top bar ── */
.site-nav{
  position:fixed;top:0;left:0;right:0;z-index:100;
  display:flex;align-items:center;justify-content:space-between;
  padding:18px 32px;
  background:rgba(6,6,16,.6);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  border-bottom:1px solid rgba(255,255,255,.06);
}
.site-nav-brand{
  font-size:15px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  background:linear-gradient(135deg,#c8b8ff,#91b9ff,#e48dbc);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;
}
.site-nav-links{
  display:flex;align-items:center;gap:6px;
}
.site-nav-menu{
  position:relative;
}
.site-nav-menu:after{
  content:"";
  position:absolute;
  left:-10px;
  right:-10px;
  top:100%;
  height:14px;
}
.site-nav-menu-trigger,
.site-nav-links a{
  border:0;
  font:inherit;
  appearance:none;
  -webkit-appearance:none;
}
.site-nav-menu-trigger{
  display:flex;
  align-items:center;
  gap:6px;
  background:transparent;
  font-size:13px;font-weight:500;
  color:rgba(255,255,255,.4);
  padding:6px 14px;
  border-radius:999px;
  transition:color .2s, background .2s;
  cursor:pointer;
}
.site-nav-links a{
  display:block;
  font-size:13px;font-weight:500;
  color:rgba(255,255,255,.48);
  padding:8px 10px;
  border-radius:10px;
  transition:color .2s, background .2s;
}
.site-nav-menu-trigger:hover,
.site-nav-menu.open .site-nav-menu-trigger,
.site-nav-menu:focus-within .site-nav-menu-trigger{
  color:rgba(255,255,255,.85);
  background:rgba(255,255,255,.06);
}
.site-nav-menu-trigger.active{
  color:#fff;
  background:rgba(255,255,255,.1);
}
.site-nav-dropdown{
  position:absolute;
  top:calc(100% + 8px);
  left:50%;
  min-width:178px;
  padding:8px;
  border-radius:16px;
  background:rgba(12,12,25,.9);
  border:1px solid rgba(255,255,255,.1);
  box-shadow:0 24px 70px rgba(0,0,0,.45);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateX(-50%) translateY(-6px);
  transition:opacity .18s ease, transform .18s ease, visibility .18s ease;
  will-change:opacity,transform;
}
.site-nav-menu:hover .site-nav-dropdown,
.site-nav-menu.open .site-nav-dropdown,
.site-nav-menu:focus-within .site-nav-dropdown{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translateX(-50%) translateY(0);
}
.site-nav-dropdown a:hover,
.site-nav-dropdown a.active{
  color:#fff;
  background:rgba(255,255,255,.08);
}
.site-nav-right{
  display:flex;align-items:center;gap:20px;
}

/* ── Copyright ── */
.site-copyright{
  padding:32px;
  text-align:center;
  font-size:12px;
  color:rgba(255,255,255,.2);
  background:#000;
}

/* ── Shared page hero (for sub-pages) ── */
.page-hero{
  text-align:center;
  padding:60px 32px 48px;
  max-width:720px;
  margin:0 auto;
}
.page-hero h1{
  font-size:clamp(36px,6vw,56px);
  font-weight:700;
  letter-spacing:-.04em;
  line-height:.95;
  color:#fff;
  margin-bottom:12px;
}
.page-hero p{
  font-size:16px;
  line-height:1.7;
  color:rgba(255,255,255,.4);
  max-width:440px;
  margin:0 auto;
}

/* ── Coming soon state ── */
.coming-soon-body{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  min-height:40vh;
  text-align:center;
  padding:0 32px;
}
.coming-soon-body .icon{font-size:48px;margin-bottom:16px;opacity:.6}
.coming-soon-body p{
  font-size:15px;
  color:rgba(255,255,255,.35);
  max-width:360px;
  line-height:1.6;
}

@media(max-width:768px){
  .site-nav{padding:14px 18px}
  .site-nav-menu-trigger{font-size:12px;padding:5px 10px}
  .site-nav-dropdown{left:auto;right:0;transform:translateY(-6px)}
  .site-nav-menu:hover .site-nav-dropdown,
  .site-nav-menu.open .site-nav-dropdown,
  .site-nav-menu:focus-within .site-nav-dropdown{transform:translateY(0)}
  .page-hero{padding:40px 20px 32px}
}
