/* Brown welcome CTA using the exact same rounded geometry as the social buttons.
   Scoped only to the welcome CTA: social buttons stay untouched. */
.world-home .welcome-copy .world-button{
  box-sizing:border-box!important;
  position:relative!important;
  isolation:isolate!important;
  display:inline-grid!important;
  place-items:center!important;
  overflow:visible!important;
  width:max-content!important;
  min-width:0!important;
  height:46px!important;
  min-height:46px!important;
  margin-top:16px!important;
  padding:0 22px!important;
  gap:0!important;
  border:0!important;
  outline:0!important;
  border-radius:17px!important;
  background:linear-gradient(180deg,#87521d 0%,#724116 100%)!important;
  box-shadow:none!important;
  color:#fff6dd!important;
  font-family:Rowdies,Nunito,system-ui,sans-serif!important;
  font-size:clamp(15px,.9vw,16px)!important;
  font-weight:700!important;
  letter-spacing:.004em!important;
  line-height:1!important;
  text-transform:uppercase!important;
  text-decoration:none!important;
  transform:none!important;
  transition:filter .15s ease,transform .15s ease!important;
}

/* No extra inner slab/ring. The social buttons also use the button itself as the fill. */
.world-home .welcome-copy .world-button::before{
  content:none!important;
  display:none!important;
}

/* Same ornamental frame asset and the same outer spacing/radius as the social buttons,
   recolored brown/gold only for this CTA. */
.world-home .welcome-copy .world-button::after{
  content:""!important;
  display:block!important;
  position:absolute!important;
  z-index:0!important;
  inset:-4px -5px!important;
  border-radius:21px!important;
  background:linear-gradient(180deg,#d1a04a 0%,#9b5d1c 100%)!important;
  -webkit-mask:url('./assets/world/community-button-frame.png?v=1') center/100% 100% no-repeat!important;
  mask:url('./assets/world/community-button-frame.png?v=1') center/100% 100% no-repeat!important;
  pointer-events:none!important;
  opacity:.96!important;
}

/* Keep the label above the decorative frame and remove the old arrow. */
.world-home .welcome-copy .world-button{
  z-index:1!important;
}
.world-home .welcome-copy .world-button > span{
  display:none!important;
}

/* Neutralize older hover/focus rules so the geometry never changes. */
.world-home .welcome-copy .world-button:hover,
.world-home .welcome-copy .world-button:focus,
.world-home .welcome-copy .world-button:focus-visible,
.world-home .welcome-copy .world-button:active{
  border:0!important;
  outline:0!important;
  border-radius:17px!important;
  box-shadow:none!important;
  background:linear-gradient(180deg,#87521d 0%,#724116 100%)!important;
}
.world-home .welcome-copy .world-button:hover{
  filter:brightness(1.05)!important;
  transform:translateY(-1px)!important;
}
.world-home .welcome-copy .world-button:focus,
.world-home .welcome-copy .world-button:focus-visible,
.world-home .welcome-copy .world-button:active{
  filter:none!important;
  transform:none!important;
}

@media(max-width:760px){
  .world-home .welcome-copy .world-button{
    height:39px!important;
    min-height:39px!important;
    margin-top:14px!important;
    padding:0 19px!important;
    border-radius:14px!important;
    font-size:14px!important;
  }
  .world-home .welcome-copy .world-button:hover,
  .world-home .welcome-copy .world-button:focus,
  .world-home .welcome-copy .world-button:focus-visible,
  .world-home .welcome-copy .world-button:active{
    border-radius:14px!important;
  }
  .world-home .welcome-copy .world-button::after{
    inset:-3px -4px!important;
    border-radius:18px!important;
  }
}

/* deploy-refresh: v9 */
