html { scroll-behavior: smooth; scroll-padding-top: 5.5rem; }

.logo-mark {
  position: relative; display: inline-flex; width: 2.1rem; height: 2.1rem; border-radius: .7rem;
  background: linear-gradient(135deg, #5b2163 0%, #2a0f2e 100%);
  box-shadow: 0 3px 10px rgba(42,15,46,.25);
}
.logo-mark span {
  position: absolute; inset: 0; margin: auto; width: 1.25rem; height: .55rem; border-radius: 999px;
  transform: rotate(-35deg);
  background: linear-gradient(90deg, #ffffff 50%, #f4a261 50%);
}

.mobile-menu { max-height: 0; overflow: hidden; transition: max-height .35s ease; }
.mobile-menu.open { max-height: 32rem; }

.hero-bg {
  background:
    radial-gradient(48rem 28rem at 95% 5%, rgba(244,162,97,.28), transparent 60%),
    radial-gradient(40rem 30rem at 0% 100%, rgba(153,66,160,.45), transparent 60%),
    linear-gradient(140deg, #1d0a20 0%, #3a1440 55%, #5b2163 100%);
}

.grain {
  background-image: radial-gradient(rgba(255,255,255,.10) 1px, transparent 1px);
  background-size: 22px 22px;
}

.pack-glow { filter: drop-shadow(0 24px 40px rgba(0,0,0,.35)); }

.card-lift { transition: transform .25s ease, box-shadow .25s ease; }
.card-lift:hover { transform: translateY(-4px); box-shadow: 0 18px 40px -12px rgba(42,15,46,.25); }

.faq-item .faq-body { max-height: 0; overflow: hidden; transition: max-height .35s ease; }
.faq-item.open .faq-body { max-height: 30rem; }
.faq-item .faq-icon { transition: transform .25s ease; }
.faq-item.open .faq-icon { transform: rotate(45deg); }

.dose-table th, .dose-table td { padding: .9rem 1rem; text-align: left; vertical-align: top; }
@media (max-width: 767px) {
  .dose-table thead { display: none; }
  .dose-table tr { display: block; padding: 1rem; border-bottom: 1px solid #f3e6f1; }
  .dose-table td { display: block; padding: .2rem 0; }
  .dose-table td[data-label]::before {
    content: attr(data-label) ": "; font-weight: 600; color: #7a3b80;
  }
}