/* ===================================================================
   ALKAMELT v2 — alkameltus.com  (Tailwind CSS via CDN + this small
   supplemental stylesheet for things Tailwind utilities alone can't
   cleanly express: FAQ accordion transitions, pricing-card image
   box, and the Neutralizing Fizz keyframes.)
   Palette : teal-950 #0B2E30 | teal-900 #0F4C4F | terra-600 #E07A3F
   Type    : 'Open Sans'
=================================================================== */

html { scroll-behavior: smooth; }

/* pricing card bottle image: fixed box so all three tiers align */
.pk-img { height: 172px; width: auto; max-width: min(140px,100%); object-fit: contain; margin: 8px auto 16px; }

/* FAQ accordion */
.faq-body { max-height: 0; overflow: hidden; transition: max-height .28s ease; }
.faq-btn::after { content: '+'; font-size: 1.4rem; color: #C8632B; transition: transform .2s; }
.faq-row.on .faq-btn::after { transform: rotate(45deg); }

/* mobile sticky bar shown via JS on small screens */
@media (max-width: 1023px) {
  #stickyBar.show { display: flex; }
  body.has-sticky { padding-bottom: 68px; }
}

/* Neutralizing Fizz signature animation */
.fizz-bubble { opacity: 0; transform: translateY(6px) scale(.4); transition: opacity .5s ease, transform .6s ease; }
.fizz-bubble.on { opacity: 1; transform: translateY(0) scale(1); }
.fizz-ring { stroke-dasharray: 220; stroke-dashoffset: 220; transition: stroke-dashoffset 1.1s ease; }
.fizz-ring.on { stroke-dashoffset: 0; }