/* HUMAN MAXIMUS V149 — ABOUT US NAVIGATION
   Additive navigation only. No player or library logic changed. */

.hub-about-us-cta{
  min-height:42px;
  padding:0 18px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  flex:0 0 auto;
  border:1px solid rgba(211,196,224,.78);
  border-radius:14px;
  color:#f7f3fa;
  text-decoration:none;
  background:
    radial-gradient(circle at 20% 18%,rgba(198,132,255,.16),transparent 32%),
    linear-gradient(180deg,rgba(49,29,61,.96),rgba(18,12,24,.98));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.12),
    0 8px 20px rgba(0,0,0,.25);
  font-family:Inter,ui-sans-serif,system-ui,sans-serif;
  font-size:13px;
  line-height:1;
  font-weight:800;
  letter-spacing:.035em;
  white-space:nowrap;
  transition:transform 150ms ease,border-color 150ms ease,box-shadow 150ms ease,filter 150ms ease;
}
.hub-about-us-cta>span:first-child{
  width:20px;
  height:20px;
  display:grid;
  place-items:center;
  border:1px solid rgba(224,189,255,.48);
  border-radius:50%;
  color:#e7c8ff;
  font-size:12px;
  font-weight:900;
  background:rgba(132,59,186,.18);
}
.hub-about-us-cta:hover{
  transform:translateY(-2px);
  border-color:rgba(244,236,250,.96);
  color:#fff;
  filter:brightness(1.03);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.15),
    0 12px 26px rgba(0,0,0,.32),
    0 0 18px rgba(131,59,186,.12);
}
.hub-about-us-cta:active{transform:translateY(1px)}
.hub-about-us-cta:focus-visible{
  outline:3px solid rgba(202,144,244,.34);
  outline-offset:3px;
}

/* Keep the new item prominent in the responsive Explore menu. */
.vault-about-us{
  border-color:rgba(220,184,250,.62)!important;
  background:
    radial-gradient(circle at 14% 20%,rgba(181,104,237,.20),transparent 34%),
    linear-gradient(145deg,#351849,#120a19)!important;
}
.vault-about-us i{
  color:#efd8ff!important;
}

/* Existing top navigation already scrolls horizontally when space is limited.
   This keeps the pair together visually without forcing awkward wrapping. */
.hub-why-it-works-cta,
.hub-about-us-cta{
  flex-shrink:0;
}

@media(max-width:1180px){
  .hub-about-us-cta{
    padding-inline:14px;
    font-size:11px;
  }
}
@media(max-width:900px){
  /* The desktop row may be hidden by the existing responsive system;
     About Us remains available in the full mobile Explore menu. */
  .vault-about-us{
    min-height:64px!important;
  }
}