/* Layout-only hover; theme colors stay in Tailwind/Bootstrap via Blade */
.pricing-card-hover {
  transition: box-shadow 0.4s cubic-bezier(0.22, 1, 0.36, 1), transform 0.4s cubic-bezier(0.22, 1, 0.36, 1);
}

@media (hover: hover) {
  .pricing-card-hover:hover {
    box-shadow: 0 22px 44px -18px rgba(15, 23, 42, 0.2);
  }

  .dark .pricing-card-hover:hover {
    box-shadow: 0 22px 44px -14px rgba(0, 0, 0, 0.5);
  }
}

@media (hover: hover) and (min-width: 640px) {
  .pricing-card-hover:hover {
    transform: translateY(-3px) scale(1.02);
  }
}

.pricing-card-hover:hover .pricing__btn {
  transform: scale(1.02);
}

.pricing__btn {
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}


/* comparison — plan matrix: layout and sizes only (no colors) */
.plan-matrix__eyebrow {
    font-size: 0.875rem;
    letter-spacing: 0.2em;
}

.plan-matrix__heading {
    letter-spacing: -0.025em;
}

.plan-matrix__shrink {
    min-width: 0;
}

.plan-matrix__frame {
    min-width: 46rem;
}

.plan-matrix__table {
    border-collapse: collapse;
    table-layout: fixed;
}

.plan-matrix__plan {
    width: 24%;
}

@media (min-width: 1024px) {
    .plan-matrix__aside.plan-matrix__aside {
        top: 7rem;
        z-index: 1;
    }
}