/* Pricing page specific styles */
.pricing-hero { padding-block: var(--space-12); position: relative; overflow: hidden; }
.pricing-hero .hero__inner { display: grid; grid-template-columns: 1.2fr 1fr; gap: var(--space-10); align-items: center; }
.pricing-hero .hero__content p { color: #e8edf6; max-width: 60ch; }
.pricing-hero .hero__actions { display: flex; gap: var(--space-4); margin-block: var(--space-6); }
.pricing-hero .hero__bullets { display: grid; gap: var(--space-2); color: #e8edf6; }
.pricing-hero .hero__bullets .fa-circle-check { color: #fff; }
.pricing-hero .hero__media img { border-radius: var(--radius-2xl); box-shadow: var(--shadow-lg); }

.section { padding-block: var(--space-12); }
.h4 { font-size: var(--font-size-xl); font-weight: 700; margin-block: var(--space-5) var(--space-3); }

.table-wrap { overflow-x: auto; }
.extras-grid { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }

.promo { position: relative; }
.promo .promo__code { display: flex; align-items: center; gap: var(--space-4); margin-top: var(--space-4); }
.promo code { background: var(--gray-100); border: 1px solid var(--gray-200); padding: 0.35rem 0.5rem; border-radius: var(--radius-sm); font-weight: 600; }

.compare-card .compare-actions { display: flex; align-items: center; gap: var(--space-4); margin-top: var(--space-5); }
.compare-card .help-text { color: var(--gray-600); margin-top: var(--space-4); }
.compare-result { margin-top: var(--space-6); padding: var(--space-6); background: var(--gray-50); border: 1px solid var(--gray-200); border-radius: var(--radius-lg); }

.payments { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: var(--space-2); }
.payments li { display: flex; align-items: center; gap: var(--space-3); }
.trust img { border-radius: var(--radius-lg); margin-top: var(--space-4); }

.seasonal-media img, .loyalty-media img { border-radius: var(--radius-lg); box-shadow: var(--shadow-md); }

.support .support__cta { display: flex; gap: var(--space-4); align-items: center; }

.muted { color: var(--gray-600); }

/* Responsive */
@media (max-width: 900px) {
  .pricing-hero .hero__inner { grid-template-columns: 1fr; }
  .pricing-hero .hero__media { order: -1; }
}

/* Cap certain grids to a maximum of 3 columns on wide screens */
@media (min-width: 1100px) {
  .extras-grid { grid-template-columns: repeat(3, 1fr); }
  .payments { grid-template-columns: repeat(3, 1fr); }
}