/* Identidade Taróloga Nair: roxo + azul-violeta, sem alterar a composição do modelo. */
:root {
  background: #12051f;
  --nair-accent: #6b44be;
}

body {
  background: linear-gradient(180deg, #12051ff5, #24103ff7), #12051f;
}

body::before {
  background-image:
    radial-gradient(circle at 12% 18%, rgba(107, 68, 190, 0.4) 0 1px, transparent 1.5px),
    radial-gradient(circle at 72% 26%, rgba(185, 151, 255, 0.3) 0 1px, transparent 1.5px),
    radial-gradient(circle at 38% 82%, rgba(107, 68, 190, 0.36) 0 1px, transparent 1.5px);
}

.hero-section {
  background:
    radial-gradient(circle at 22% 18%, rgba(107, 68, 190, 0.34), transparent 34%),
    radial-gradient(circle at 78% 12%, rgba(151, 71, 255, 0.34), transparent 38%),
    linear-gradient(135deg, #12051f, #291047 48%, #160726);
}

.hero-overlay {
  background:
    radial-gradient(circle at center, rgba(109, 72, 255, 0.18), transparent 42%),
    linear-gradient(180deg, #12051fb8, #210b39dc 54%, #12051ff5),
    linear-gradient(90deg, #12051fe6, #3a176682, #12051fe0);
}

.cta-button,
.floating-whatsapp {
  background: linear-gradient(135deg, #6b44be, #6b44be 30%, #854acb 62%, #9544cf 82%, #6b44be);
  background-size: 190% 190%;
  box-shadow:
    0 18px 54px #6b44be52,
    0 0 30px #9b4dff38,
    0 0 0 1px #eef7ff42 inset;
}

.cta-button:hover,
.floating-whatsapp:hover {
  box-shadow:
    0 24px 70px #6b44be66,
    0 0 38px #9b4dff52,
    0 0 0 1px #f3efff52 inset;
}

.mystic-frame,
.image-panel,
.service-card,
.testimonial-card,
.step-card {
  border-color: #6b44be52;
  background: linear-gradient(140deg, #6b44be18, #a14fff1f), #24103fd9;
  box-shadow:
    0 22px 80px #04071f8a,
    0 0 0 1px #9b75ff24 inset;
}

.section-wrap {
  background:
    linear-gradient(180deg, #12051f8a, #35145e66 52%, #12051fa6),
    radial-gradient(ellipse at top, rgba(107, 68, 190, 0.18), transparent 54%);
}

.floating-whatsapp-pulse::after {
  border-color: #6b44becc;
}

/* Preserve the original colors in Nair's personal tarot portrait. */
.image-panel img[src*="tarologa-nair-tarot"] {
  filter: none !important;
}

@media (max-width: 1023px) {
  .hero-overlay {
    background:
      linear-gradient(180deg, #12051fc9, #24103fe8 54%, #12051ffa),
      linear-gradient(90deg, #12051fd6, #35145e9e);
  }
}