/* VOZAYA 0.19.05 — EXACT REFERENCE WHEEL LAYOUT
   Matches the user's supplied preview reference:
   labels/icons physically oriented with wedges and large ASK over VOZAYA. */

/* TRUE wedge-centre coordinates */
.early-access-hero .piece-eat{--mark-x:50%!important;--mark-y:19.2%!important}
.early-access-hero .piece-nightlife{--mark-x:70.8%!important;--mark-y:29.2%!important}
.early-access-hero .piece-events{--mark-x:80.0%!important;--mark-y:50%!important}
.early-access-hero .piece-wellness{--mark-x:70.8%!important;--mark-y:70.8%!important}
.early-access-hero .piece-style{--mark-x:50%!important;--mark-y:80.0%!important}
.early-access-hero .piece-property{--mark-x:29.2%!important;--mark-y:70.8%!important}
.early-access-hero .piece-travel{--mark-x:20.0%!important;--mark-y:50%!important}
.early-access-hero .piece-experiences{--mark-x:29.2%!important;--mark-y:29.2%!important}

/* Common mark stack */
.early-access-hero .vozaya-category-mark{
  position:absolute!important;
  left:var(--mark-x)!important;
  top:var(--mark-y)!important;
  transform-origin:center center!important;
  z-index:31!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:.12rem!important;
  width:28%!important;
  min-width:0!important;
  margin:0!important;
  padding:0!important;
  text-align:center!important;
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
  color:#f4d28a!important;
  filter:
    drop-shadow(0 2px 2px rgba(0,0,0,.80))
    drop-shadow(0 0 6px rgba(244,204,126,.15))!important;
}
.early-access-hero .join-wheel-canvas.icons-locked-open .vozaya-category-mark{
  opacity:1!important;
  visibility:visible!important;
}

/* Let JS own the physical angle. Do not counter-rotate in CSS. */
.early-access-hero .piece-eat .vozaya-category-mark,
.early-access-hero .piece-nightlife .vozaya-category-mark,
.early-access-hero .piece-events .vozaya-category-mark,
.early-access-hero .piece-wellness .vozaya-category-mark,
.early-access-hero .piece-style .vozaya-category-mark,
.early-access-hero .piece-property .vozaya-category-mark,
.early-access-hero .piece-travel .vozaya-category-mark,
.early-access-hero .piece-experiences .vozaya-category-mark{
  /* runtime engine applies exact physical angle */
}

/* Icon weight and size like the reference */
.early-access-hero .vozaya-category-icon{
  width:40px!important;
  height:40px!important;
  display:grid!important;
  place-items:center!important;
  flex:0 0 40px!important;
  background:none!important;
  border:0!important;
  box-shadow:none!important;
  border-radius:0!important;
}
.early-access-hero .vozaya-category-icon svg{
  width:35px!important;
  height:35px!important;
  display:block!important;
  fill:none!important;
  stroke:#f3cf82!important;
  stroke-width:2.08!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
  overflow:visible!important;
  filter:
    drop-shadow(0 1px 0 rgba(255,255,255,.26))
    drop-shadow(0 2px 2px rgba(57,31,6,.78))
    drop-shadow(0 0 4px rgba(244,204,126,.12))!important;
}

/* Name above/below icon according to reference composition */
.early-access-hero .vozaya-category-label{
  font-size:clamp(.57rem,.67vw,.70rem)!important;
  line-height:1!important;
  font-weight:950!important;
  letter-spacing:.015em!important;
  white-space:nowrap!important;
  color:#f4d18b!important;
  -webkit-text-stroke:.16px rgba(92,52,10,.75)!important;
  text-shadow:
    0 1px 0 rgba(255,255,255,.34),
    0 2px 0 rgba(108,61,12,.62),
    0 3px 3px rgba(0,0,0,.82)!important;
}

/* Reference has label before icon on upper half and sides. */
.early-access-hero .piece-eat .vozaya-category-label,
.early-access-hero .piece-nightlife .vozaya-category-label,
.early-access-hero .piece-events .vozaya-category-label,
.early-access-hero .piece-travel .vozaya-category-label,
.early-access-hero .piece-experiences .vozaya-category-label{
  order:-1!important;
}

/* Bottom three: icon first, label below, matching the reference. */
.early-access-hero .piece-wellness .vozaya-category-label,
.early-access-hero .piece-style .vozaya-category-label,
.early-access-hero .piece-property .vozaya-category-label{
  order:2!important;
}

/* Tiny per-piece optical nudges, only the contents. */
.early-access-hero .piece-eat .vozaya-category-mark{margin-top:1px!important}
.early-access-hero .piece-nightlife .vozaya-category-mark{margin-left:1px!important}
.early-access-hero .piece-events .vozaya-category-mark{margin-left:-1px!important}
.early-access-hero .piece-wellness .vozaya-category-mark{margin-top:-1px!important}
.early-access-hero .piece-style .vozaya-category-mark{margin-top:-1px!important}
.early-access-hero .piece-property .vozaya-category-mark{margin-left:1px!important}
.early-access-hero .piece-travel .vozaya-category-mark{margin-left:1px!important}
.early-access-hero .piece-experiences .vozaya-category-mark{margin-left:1px!important}

/* Centre circle to match reference: ASK large, VOZAYA directly below. */
.early-access-hero .vozaya-new-hub{
  place-content:center!important;
}
.early-access-hero .vozaya-ask-overlay{
  position:absolute!important;
  left:50%!important;
  top:43.8%!important;
  transform:translate(-50%,-50%)!important;
  z-index:42!important;
  pointer-events:none!important;
  font-family:Georgia,"Times New Roman",serif!important;
  font-size:clamp(1.45rem,2.35vw,2.15rem)!important;
  line-height:.95!important;
  font-weight:400!important;
  letter-spacing:.025em!important;
  color:#e9c777!important;
  text-shadow:
    0 1px 0 rgba(255,255,255,.20),
    0 2px 2px rgba(0,0,0,.68),
    0 0 10px rgba(225,185,100,.10)!important;
}
.early-access-hero .vozaya-new-hub .hub-brand{
  transform:translateY(1.05rem)!important;
  font-size:clamp(.88rem,1.4vw,1.28rem)!important;
  letter-spacing:.12em!important;
  color:#e9c777!important;
  font-weight:500!important;
}
.early-access-hero .vozaya-new-hub small{
  transform:translateY(.98rem)!important;
  margin-top:.30rem!important;
  font-size:clamp(.24rem,.34vw,.31rem)!important;
  letter-spacing:.22em!important;
  opacity:.72!important;
}

/* Keep the same dark-glass centre circle; only copy proportions change. */
.early-access-hero .join-wheel-center::after{
  width:92%!important;
  height:92%!important;
}

/* Closing/closed remains icon-only. */
.early-access-hero .join-wheel-canvas.wheel-closing-clean .vozaya-category-label,
.early-access-hero .join-wheel-canvas.wheel-closed-clean .vozaya-category-label{
  opacity:0!important;
  visibility:hidden!important;
}

/* Responsive equivalents */
@media(max-width:760px){
  .early-access-hero .vozaya-category-mark{width:30%!important;gap:.09rem!important}
  .early-access-hero .vozaya-category-icon{width:31px!important;height:31px!important;flex-basis:31px!important}
  .early-access-hero .vozaya-category-icon svg{width:27px!important;height:27px!important}
  .early-access-hero .vozaya-category-label{font-size:.43rem!important}
  .early-access-hero .vozaya-ask-overlay{
    top:43.8%!important;
    font-size:1.30rem!important;
  }
  .early-access-hero .vozaya-new-hub .hub-brand{
    transform:translateY(.82rem)!important;
    font-size:.76rem!important;
  }
  .early-access-hero .vozaya-new-hub small{
    transform:translateY(.78rem)!important;
    font-size:.22rem!important;
  }
}
@media(max-width:430px){
  .early-access-hero .vozaya-category-mark{width:31%!important}
  .early-access-hero .vozaya-category-icon{width:27px!important;height:27px!important;flex-basis:27px!important}
  .early-access-hero .vozaya-category-icon svg{width:24px!important;height:24px!important}
  .early-access-hero .vozaya-category-label{font-size:.355rem!important}
  .early-access-hero .vozaya-ask-overlay{font-size:1.05rem!important}
  .early-access-hero .vozaya-new-hub .hub-brand{
    transform:translateY(.70rem)!important;
    font-size:.66rem!important;
  }
}
