/* ── Package card stagger entrance on scroll ──────────────── */
.pkg-card {
  opacity: 0;
  transform: translateY(20px) scale(0.96);
  transition-property: opacity, transform !important;
  transition-duration: 0.8s !important;
  transition-timing-function: cubic-bezier(0.22,1,0.36,1) !important;
  pointer-events: none;
}
.pkg-card.visible {
  opacity: 1; transform: none; pointer-events: auto;
}
.pkg-card.visible {
  transition-property: transform, box-shadow, border-color;
  transition-duration: 0.32s;
  transition-timing-function: cubic-bezier(0.34,1.56,0.64,1);
}
.pkg-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 20px 48px rgba(0,0,0,0.10);
  border-color: rgba(232,75,30,0.35) !important;
}
.pkg-card.popular {
  border-color: rgba(232,75,30,0.55) !important;
  box-shadow: 0 12px 40px rgba(232,75,30,0.16);
}
.pkg-card.popular:hover { box-shadow: 0 24px 56px rgba(232,75,30,0.22); }

/* ── Filter tab transition ────────────────────────────────── */
.filter-tab {
  border-radius: 9999px; padding: 9px 24px;
  font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em;
  cursor: pointer; border: 1.5px solid transparent;
  transition: background 0.22s ease, color 0.22s ease, border-color 0.22s ease,
              transform 0.22s cubic-bezier(0.34,1.56,0.64,1),
              box-shadow 0.22s ease;
  display: inline-flex; align-items: center; gap: 6px;
}
.filter-tab.active {
  background: #E84B1E; color: #fff; border-color: #E84B1E;
  box-shadow: 0 4px 16px rgba(232,75,30,0.30);
}
.filter-tab:not(.active) { background: transparent; color: #192B3C; border-color: rgba(25,43,60,0.18); }
.filter-tab:not(.active):hover { border-color: #E84B1E; color: #E84B1E; transform: translateY(-2px); }
.filter-tab:active { transform: scale(0.96); }

/* ── Provider section filter transition ────────────────────── */
.provider-section {
  transition: opacity 0.35s ease, transform 0.35s ease;
}

/* ── Browse Plans glass button ─────────────────────────────── */
.browse-glass:hover {
  background: rgba(0,0,0,0.52) !important;
  border-color: rgba(255,255,255,0.30) !important;
  box-shadow: 0 12px 40px rgba(0,0,0,0.32), inset 0 1px 0 rgba(255,255,255,0.14) !important;
}
.browse-glass:focus-visible {
  outline: 2px solid rgba(255,255,255,0.50);
  outline-offset: 2px;
}

/* ── Mobile responsive ────────────────────────────────────── */
@media (max-width: 639px) {
  /* Provider header: slightly smaller on mobile but still generous */
  .provider-header-row .provider-logo {
    max-width: 240px !important;
  }
  .provider-chip {
    font-size: 13px !important;
    padding: 8px 18px !important;
  }
  .provider-chip i {
    width: 15px !important;
    height: 15px !important;
  }
  /* Filter tabs: compact on mobile */
  .filter-tab {
    padding: 7px 16px;
    font-size: 12px;
    gap: 4px;
  }
  /* Pricing section: less padding */
  #pricing { padding-top: 4rem; padding-bottom: 4rem; }
}

/* ── Reduce motion (page-specific additions) ──────────────── */
@media (prefers-reduced-motion: reduce) {
  .pkg-card { transition: none; opacity: 1; transform: none; }
}
