/* Shared homepage header and footer; content styles stay page-specific. */
.site-header,.site-footer{--bg:#fff;--text:#151827;--muted:#5f6678;--border:#e7ebf3;--purple:#7446e8;--purple-dark:#5830bf;--purple-soft:#f3efff;--yellow:#d99516;--shadow:0 16px 46px rgba(22,27,45,.075);--shadow-soft:0 8px 25px rgba(22,27,45,.055);font-family:'Poppins',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;font-size:16px;line-height:1.72;color:var(--text)}
.site-header *,.site-footer *{box-sizing:border-box}
.site-header .container,.site-footer .container{width:min(1120px,calc(100% - 36px));margin-inline:auto}
.site-header a,.site-footer a{color:var(--purple);text-decoration:none;font-weight:700}
.site-header a:hover,.site-footer a:hover{text-decoration:underline}
.site-header img,.site-footer img{max-width:100%;height:auto;display:block}
.site-footer p{margin:0 0 13px;color:var(--muted)}
.site-header{position:sticky;top:0;z-index:60;background:rgba(255,255,255,.94);backdrop-filter:blur(14px);border-bottom:1px solid var(--border)}
.header-inner{height:72px;display:flex;align-items:center;justify-content:space-between;gap:18px}
.brand,.footer-brand{display:flex;align-items:center;gap:10px;color:var(--text);font-size:1.05rem;font-weight:900;letter-spacing:-.03em}
.brand span span{color:var(--yellow)}
.brand img,.footer-brand img{border-radius:13px;object-fit:contain;box-shadow:0 8px 22px rgba(116,70,232,.12)}
.site-nav{display:flex;align-items:center;gap:7px}
.site-nav a{color:var(--text);padding:10px 13px;border-radius:999px;font-size:.92rem;line-height:1.2;transition:background .18s ease,color .18s ease,box-shadow .18s ease}
.site-nav a:hover{background:var(--purple-soft);text-decoration:none;color:var(--purple)}
.site-nav .nav-cta{background:linear-gradient(135deg,var(--purple),#8a61ef);color:#fff;box-shadow:0 9px 22px rgba(116,70,232,.22)}
.site-nav .nav-cta:hover{background:linear-gradient(135deg,var(--purple-dark),var(--purple));color:#fff!important;text-decoration:none;box-shadow:0 11px 26px rgba(116,70,232,.28)}
.menu-toggle{display:none;border:1px solid var(--border);background:#fff;border-radius:12px;padding:8px 11px;font-size:1.2rem;color:var(--text)}
.site-footer{border-top:1px solid var(--border);background:#fbfcff;padding:34px 0 22px}
.footer-grid{display:grid;grid-template-columns:1.4fr .7fr .7fr;gap:26px}
.footer-grid strong{display:block;margin-bottom:10px}
.footer-grid a{display:block;margin:6px 0;color:var(--purple)}
.footer-brand{margin-bottom:10px}
.copyright{padding-top:18px;margin-top:22px;border-top:1px solid var(--border);color:var(--muted);font-size:.9rem}


@media (max-width:980px){.footer-grid{grid-template-columns:1fr 1fr}
}

@media (max-width:760px){.header-inner{height:66px}
.brand{font-size:1rem}
.site-nav{display:none;position:absolute;left:14px;right:14px;top:72px;background:#fff;border:1px solid var(--border);border-radius:18px;padding:12px;box-shadow:var(--shadow)}
.site-nav.is-open{display:grid}
.site-nav a{padding:12px}
.menu-toggle{display:block}
.footer-grid{grid-template-columns:1fr}
}
.site-header{background:rgba(255,255,255,.97);border-bottom:1px solid var(--cru-line);box-shadow:none}
.site-nav .nav-cta{background:var(--cru-blue);box-shadow:none}
.site-nav .nav-cta:hover{background:var(--cru-blue-dark);box-shadow:none}
.site-nav a{white-space:nowrap}


@media (max-width:900px){.site-header{backdrop-filter:none}
}
.footer-socials{
  display:flex;
  flex-wrap:wrap;
  gap:9px;
  margin-top:15px;
}
.footer-socials a{
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  margin:0;
  border:1px solid var(--border);
  border-radius:12px;
  background:#fff;
  color:var(--purple);
  box-shadow:var(--shadow-soft);
  transition:transform .18s ease,border-color .18s ease,background .18s ease;
}
.footer-socials a:hover{
  transform:translateY(-2px);
  border-color:#d9cff8;
  background:var(--purple-soft);
  text-decoration:none;
}
.footer-socials svg{
  width:20px;
  height:20px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.9;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.footer-socials .social-fill{
  fill:currentColor;
  stroke:none;
}
.footer-socials text{
  fill:currentColor;
  stroke:none;
  font-family:Arial,sans-serif;
}

@media(max-width:480px){.brand{min-width:0}
.brand>span{font-size:clamp(14px,4.3vw,20px)}
.footer-socials{flex-wrap:wrap}
}
.nav-guides{
  position:relative;
}
.nav-guides-toggle{
  display:inline-flex;
  align-items:center;
  gap:6px;
  color:var(--text);
  padding:10px 13px;
  border-radius:999px;
  font-size:.92rem;
  line-height:1.2;
  font-weight:700;
  cursor:pointer;
  user-select:none;
}
.nav-guides-toggle::after{
  content:"▾";
  font-size:.72rem;
  color:var(--purple);
}
.nav-guides:hover .nav-guides-toggle,
.nav-guides:focus-within .nav-guides-toggle{
  background:var(--purple-soft);
  color:var(--purple);
}
.nav-guides-menu{
  position:absolute;
  top:calc(100% + 10px);
  right:0;
  min-width:245px;
  padding:9px;
  border:1px solid var(--border);
  border-radius:16px;
  background:#fff;
  box-shadow:var(--shadow);
  opacity:0;
  visibility:hidden;
  transform:translateY(-6px);
  transition:opacity .18s ease,transform .18s ease,visibility .18s ease;
}
.nav-guides:hover .nav-guides-menu,
.nav-guides:focus-within .nav-guides-menu{
  opacity:1;
  visibility:visible;
  transform:translateY(0);
}
.nav-guides-menu a{
  display:block;
  padding:10px 12px;
  border-radius:11px;
  color:var(--text);
  font-size:.88rem;
  font-weight:700;
}
.nav-guides-menu a:hover{
  background:var(--purple-soft);
  color:var(--purple);
  text-decoration:none;
}


@media (max-width:760px){.nav-guides{
    position:static;
  }
.nav-guides-toggle{
    width:100%;
    justify-content:space-between;
    padding:12px;
  }
.nav-guides-menu{
    position:static;
    min-width:0;
    margin-top:4px;
    padding:4px 0 0 12px;
    border:0;
    border-left:2px solid var(--border);
    border-radius:0;
    box-shadow:none;
    opacity:1;
    visibility:visible;
    transform:none;
    background:transparent;
  }
.nav-guides-menu a{
    padding:9px 12px;
  }
}


@media(max-width:1000px){.header-inner{height:66px}
.menu-toggle{display:block;flex-shrink:0}
.site-nav{display:none;position:absolute;left:14px;right:14px;top:72px;background:#fff;border:1px solid var(--border,#e7ebf3);border-radius:18px;padding:12px;box-shadow:0 8px 25px #161b2d14}
.site-nav.is-open{display:grid}
.site-nav a{white-space:normal;padding:12px}
.nav-guides{width:100%}
.nav-guides-menu{position:static;min-width:0;width:100%;display:grid;opacity:1;visibility:visible;transform:none;box-shadow:none;border:0;padding:0 0 0 12px}
.nav-guides-toggle{width:100%}
}
.nav-guides{
  position:relative;
}
.nav-guides-toggle{
  display:inline-flex;
  align-items:center;
  gap:6px;
  color:var(--text);
  padding:10px 13px;
  border-radius:999px;
  font-size:.92rem;
  line-height:1.2;
  font-weight:700;
  cursor:pointer;
  user-select:none;
}
.nav-guides-toggle::after{
  content:"▾";
  font-size:.72rem;
  color:var(--purple);
}
.nav-guides:hover .nav-guides-toggle,
.nav-guides:focus-within .nav-guides-toggle{
  background:var(--purple-soft);
  color:var(--purple);
}
.nav-guides-menu{
  position:absolute;
  top:calc(100% + 10px);
  right:0;
  min-width:245px;
  padding:9px;
  border:1px solid var(--border);
  border-radius:16px;
  background:#fff;
  box-shadow:var(--shadow);
  opacity:0;
  visibility:hidden;
  transform:translateY(-6px);
  transition:opacity .18s ease,transform .18s ease,visibility .18s ease;
}
.nav-guides:hover .nav-guides-menu,
.nav-guides:focus-within .nav-guides-menu{
  opacity:1;
  visibility:visible;
  transform:translateY(0);
}
.nav-guides-menu a{
  display:block;
  padding:10px 12px;
  border-radius:11px;
  color:var(--text);
  font-size:.88rem;
  font-weight:700;
}
.nav-guides-menu a:hover{
  background:var(--purple-soft);
  color:var(--purple);
  text-decoration:none;
}


@media (max-width:760px){.nav-guides{
    position:static;
  }
.nav-guides-toggle{
    width:100%;
    justify-content:space-between;
    padding:12px;
  }
.nav-guides-menu{
    position:static;
    min-width:0;
    margin-top:4px;
    padding:4px 0 0 12px;
    border:0;
    border-left:2px solid var(--border);
    border-radius:0;
    box-shadow:none;
    opacity:1;
    visibility:visible;
    transform:none;
    background:transparent;
  }
.nav-guides-menu a{
    padding:9px 12px;
  }
}

/* Desktop-only Among Us 3D side environment */
@media (min-width:1200px){.site-footer{
    position:relative;
    z-index:1;
  }
}
.nav-guides{
  position:relative;
}
.nav-guides-toggle{
  display:inline-flex;
  align-items:center;
  gap:6px;
  color:var(--text);
  padding:10px 13px;
  border-radius:999px;
  font-size:.92rem;
  line-height:1.2;
  font-weight:700;
  cursor:pointer;
  user-select:none;
}
.nav-guides-toggle::after{
  content:"▾";
  font-size:.72rem;
  color:var(--purple);
}
.nav-guides:hover .nav-guides-toggle,
.nav-guides:focus-within .nav-guides-toggle{
  background:var(--purple-soft);
  color:var(--purple);
}
.nav-guides-menu{
  position:absolute;
  top:calc(100% + 10px);
  right:0;
  min-width:245px;
  padding:9px;
  border:1px solid var(--border);
  border-radius:16px;
  background:#fff;
  box-shadow:var(--shadow);
  opacity:0;
  visibility:hidden;
  transform:translateY(-6px);
  transition:opacity .18s ease,transform .18s ease,visibility .18s ease;
}
.nav-guides:hover .nav-guides-menu,
.nav-guides:focus-within .nav-guides-menu{
  opacity:1;
  visibility:visible;
  transform:translateY(0);
}
.nav-guides-menu a{
  display:block;
  padding:10px 12px;
  border-radius:11px;
  color:var(--text);
  font-size:.88rem;
  font-weight:700;
}
.nav-guides-menu a:hover{
  background:var(--purple-soft);
  color:var(--purple);
  text-decoration:none;
}


@media (max-width:760px){.nav-guides{
    position:static;
  }
.nav-guides-toggle{
    width:100%;
    justify-content:space-between;
    padding:12px;
  }
.nav-guides-menu{
    position:static;
    min-width:0;
    margin-top:4px;
    padding:4px 0 0 12px;
    border:0;
    border-left:2px solid var(--border);
    border-radius:0;
    box-shadow:none;
    opacity:1;
    visibility:visible;
    transform:none;
    background:transparent;
  }
.nav-guides-menu a{
    padding:9px 12px;
  }
}


@media(max-width:1000px){.header-inner{height:66px}
.menu-toggle{display:block;flex-shrink:0}
.site-nav{display:none;position:absolute;left:14px;right:14px;top:72px;background:#fff;border:1px solid var(--border,#e7ebf3);border-radius:18px;padding:12px;box-shadow:0 8px 25px #161b2d14}
.site-nav.is-open{display:grid}
.site-nav a{white-space:normal;padding:12px}
.nav-guides{width:100%}
.nav-guides-menu{position:static;min-width:0;width:100%;display:grid;opacity:1;visibility:visible;transform:none;box-shadow:none;border:0;padding:0 0 0 12px}
.nav-guides-toggle{width:100%}
}

@media(max-width:760px){.site-header .container,.site-footer .container{width:min(100% - 28px,1120px)}}
@media(max-width:430px){.site-header .container,.site-footer .container{width:min(100% - 22px,1120px)}}
.site-header,.site-footer{--cru-blue:#1d4ed8;--cru-blue-dark:#173da7;--cru-soft:#eef4ff;--cru-ink:#111827;--cru-muted:#5f6878;--cru-line:#e3e8f1}
