.whatsapp-cta {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  background: #25d366 !important;
  background-image: linear-gradient(135deg, #25d366, #128c7e) !important;
  color: #fff !important;
  box-shadow: 0 18px 38px rgba(37, 211, 102, 0.32) !important;
}

.whatsapp-cta:hover {
  filter: saturate(1.08) brightness(1.02);
}

.whatsapp-cta:disabled {
  opacity: 0.9;
}

.whatsapp-icon {
  width: 22px;
  height: 22px;
  flex: 0 0 auto;
  display: inline-block;
  background: #fff;
  mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16.02 3C8.84 3 3 8.72 3 15.77c0 2.42.7 4.78 2.02 6.83L3.7 29l6.62-1.73a13.2 13.2 0 0 0 5.7 1.3C23.2 28.57 29 22.84 29 15.77S23.2 3 16.02 3Zm0 23.4c-1.82 0-3.6-.48-5.17-1.39l-.37-.22-3.93 1.03 1.05-3.76-.25-.39a10.5 10.5 0 0 1-1.73-5.9c0-5.84 4.84-10.6 10.8-10.6 5.94 0 10.78 4.76 10.78 10.6 0 5.86-4.84 10.63-10.78 10.63Zm5.92-7.96c-.32-.16-1.9-.92-2.2-1.03-.3-.1-.52-.16-.74.16-.22.31-.85 1.03-1.04 1.24-.19.2-.38.23-.7.08-.32-.16-1.36-.49-2.58-1.56-.95-.83-1.6-1.86-1.78-2.18-.19-.31-.02-.48.14-.64.14-.14.32-.37.48-.55.16-.19.21-.32.32-.53.1-.21.05-.39-.03-.55-.08-.16-.74-1.75-1.01-2.4-.27-.63-.54-.54-.74-.55h-.63c-.22 0-.55.08-.85.39-.3.31-1.12 1.08-1.12 2.64s1.15 3.07 1.31 3.28c.16.21 2.27 3.39 5.5 4.76.77.32 1.37.52 1.84.66.77.24 1.48.2 2.04.12.62-.09 1.9-.76 2.17-1.5.27-.73.27-1.36.19-1.5-.08-.13-.3-.21-.62-.37Z'/%3E%3C/svg%3E")
    center / contain no-repeat;
  -webkit-mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16.02 3C8.84 3 3 8.72 3 15.77c0 2.42.7 4.78 2.02 6.83L3.7 29l6.62-1.73a13.2 13.2 0 0 0 5.7 1.3C23.2 28.57 29 22.84 29 15.77S23.2 3 16.02 3Zm0 23.4c-1.82 0-3.6-.48-5.17-1.39l-.37-.22-3.93 1.03 1.05-3.76-.25-.39a10.5 10.5 0 0 1-1.73-5.9c0-5.84 4.84-10.6 10.8-10.6 5.94 0 10.78 4.76 10.78 10.6 0 5.86-4.84 10.63-10.78 10.63Zm5.92-7.96c-.32-.16-1.9-.92-2.2-1.03-.3-.1-.52-.16-.74.16-.22.31-.85 1.03-1.04 1.24-.19.2-.38.23-.7.08-.32-.16-1.36-.49-2.58-1.56-.95-.83-1.6-1.86-1.78-2.18-.19-.31-.02-.48.14-.64.14-.14.32-.37.48-.55.16-.19.21-.32.32-.53.1-.21.05-.39-.03-.55-.08-.16-.74-1.75-1.01-2.4-.27-.63-.54-.54-.74-.55h-.63c-.22 0-.55.08-.85.39-.3.31-1.12 1.08-1.12 2.64s1.15 3.07 1.31 3.28c.16.21 2.27 3.39 5.5 4.76.77.32 1.37.52 1.84.66.77.24 1.48.2 2.04.12.62-.09 1.9-.76 2.17-1.5.27-.73.27-1.36.19-1.5-.08-.13-.3-.21-.62-.37Z'/%3E%3C/svg%3E")
    center / contain no-repeat;
}

.next-step-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  background: #0097a7 !important;
  background-image: linear-gradient(135deg, #00b8c8, #006f7a) !important;
  animation: none !important;
  box-shadow: 0 18px 38px rgba(0, 151, 167, 0.28) !important;
}

.next-step-button:hover {
  filter: saturate(1.08) brightness(1.02);
}

.next-step-icon {
  width: 22px;
  height: 22px;
  flex: 0 0 auto;
  display: inline-block;
  background: #fff;
  mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20Zm.7 5.3 4 4a1 1 0 0 1 0 1.4l-4 4a1 1 0 1 1-1.4-1.4l2.3-2.3H8a1 1 0 1 1 0-2h5.6l-2.3-2.3a1 1 0 0 1 1.4-1.4Z'/%3E%3C/svg%3E")
    center / contain no-repeat;
  -webkit-mask: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20Zm.7 5.3 4 4a1 1 0 0 1 0 1.4l-4 4a1 1 0 1 1-1.4-1.4l2.3-2.3H8a1 1 0 1 1 0-2h5.6l-2.3-2.3a1 1 0 0 1 1.4-1.4Z'/%3E%3C/svg%3E")
    center / contain no-repeat;
}

.card-cta {
  cursor: pointer;
  outline: none;
}

.card-cta:focus-visible {
  box-shadow:
    0 0 0 3px rgba(255, 255, 255, 0.95),
    0 0 0 6px rgba(0, 151, 167, 0.52),
    0 18px 45px rgba(18, 18, 18, 0.08) !important;
}

.age-gate-overlay {
  position: fixed;
  inset: 0;
  z-index: 120;
  display: grid;
  place-items: center;
  padding: 18px;
  background: rgba(18, 18, 18, 0.52);
  backdrop-filter: blur(7px);
  -webkit-backdrop-filter: blur(7px);
}

.age-gate-overlay[hidden] {
  display: none !important;
}

.age-gate-dialog {
  position: relative;
  width: min(100%, 360px);
  border: 1px solid rgba(37, 211, 102, 0.22);
  border-radius: 24px;
  padding: 24px 18px 18px;
  background: #fff;
  color: #171717;
  text-align: center;
  box-shadow: 0 28px 80px rgba(0, 0, 0, 0.24);
  animation: ageGateIn 0.22s ease-out both;
}

.age-gate-dialog.is-denied {
  animation: ageGateShake 0.22s ease-out both;
}

.age-gate-close {
  position: absolute;
  top: 10px;
  right: 10px;
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border-radius: 999px;
  background: #f4f4f5;
  color: #525252;
  font-size: 24px;
  line-height: 1;
  cursor: pointer;
}

.age-gate-close:focus-visible,
.age-gate-action:focus-visible {
  outline: 3px solid rgba(0, 151, 167, 0.44);
  outline-offset: 3px;
}

.age-gate-kicker {
  display: inline-flex;
  margin-bottom: 12px;
  border-radius: 999px;
  background: #e8f8ee;
  padding: 6px 12px;
  color: #128c7e;
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.age-gate-dialog h2 {
  margin: 0;
  color: #171717;
  font-size: 24px;
  line-height: 1.18;
  font-weight: 900;
}

.age-gate-dialog p {
  margin: 10px 0 0;
  color: #525252;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.55;
}

.age-gate-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin-top: 18px;
}

.age-gate-action {
  display: inline-flex;
  min-height: 48px;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  font-size: 15px;
  font-weight: 900;
  cursor: pointer;
  transition:
    transform 0.18s,
    filter 0.18s,
    box-shadow 0.18s;
}

.age-gate-action:active {
  transform: scale(0.97);
}

.age-gate-yes {
  background: linear-gradient(135deg, #25d366, #128c7e);
  color: #fff;
  box-shadow: 0 16px 34px rgba(37, 211, 102, 0.28);
}

.age-gate-no {
  border: 1px solid #e5e5e5;
  background: #f8faf9;
  color: #3f3f46;
}

.age-gate-message {
  margin-top: 14px !important;
  border-radius: 14px;
  background: #fff1f2;
  padding: 10px 12px;
  color: #be123c !important;
  font-size: 13px !important;
}

@keyframes ageGateIn {
  from {
    opacity: 0;
    transform: translateY(12px) scale(0.97);
  }

  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes ageGateShake {
  0%,
  100% {
    transform: translateX(0);
  }

  35% {
    transform: translateX(-6px);
  }

  70% {
    transform: translateX(6px);
  }
}