html,
body {
    max-width: 100%;
    overflow-x: hidden;
}

body.menu-open {
    overflow: hidden;
}

img {
    display: block;
    max-width: 100%;
}

.grayscale-img {
    filter: grayscale(100%);
    transition: filter 0.5s ease;
}
.group:hover .grayscale-img {
    filter: grayscale(0%);
}
.glass-panel {
    background: rgba(255, 255, 255, 0.05);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}
.reveal {
    opacity: 0;
    transform: translateY(30px);
    transition: all 0.8s ease-out;
}
.reveal.active {
    opacity: 1;
    transform: translateY(0);
}
.reveal-left {
    opacity: 0;
    transform: translateX(-50px);
    transition: all 0.8s ease-out;
}
.reveal-left.active {
    opacity: 1;
    transform: translateX(0);
}
.reveal-right {
    opacity: 0;
    transform: translateX(50px);
    transition: all 0.8s ease-out;
}
.reveal-right.active {
    opacity: 1;
    transform: translateX(0);
}

/* Pricing section helpers */
.pricing-card { /* fallback visual */
    background-clip: padding-box;
}
.most-popular {
    background: linear-gradient(180deg, rgba(255,255,255,0.9), rgba(255,255,255,0.85));
}

/* Subtle hover animation for badges/buttons */
.pricing-card .badge,
.pricing-card .btn {
    transition: transform 0.18s ease, box-shadow 0.18s ease;
}
.pricing-card:hover .badge,
.pricing-card:hover .btn {
    transform: translateY(-2px);
}

@media (max-width: 768px) {
    /* tighter spacing on mobile */
    .pricing-card { padding: 1.25rem; }
}

/* Pricing tabs and cards */
.pricing-tab[aria-selected="true"] {
    background: linear-gradient(90deg, rgba(59,130,246,0.12), rgba(29,78,216,0.06));
    border-color: rgba(59,130,246,0.22);
    box-shadow: 0 4px 14px rgba(59,130,246,0.06);
}
.pricing-tab { transition: color 260ms cubic-bezier(0.22,1,0.36,1), background 260ms cubic-bezier(0.22,1,0.36,1), transform 200ms ease; }
.tab-content { opacity: 0; transform: translateY(12px); transition: opacity 420ms cubic-bezier(0.22,1,0.36,1), transform 420ms cubic-bezier(0.22,1,0.36,1); }
.tab-content.active { opacity: 1; transform: translateY(0); }
.card { background-clip: padding-box; }
.price-original { text-decoration: line-through; color: #6b7280; }
.savings-badge { font-weight: 600; }
.badge, .pill { display: inline-block; }
.most-popular { box-shadow: 0 20px 40px rgba(13, 34, 86, 0.06); }

/* Small responsive tweaks for the new pricing grid */
@media (max-width: 1024px) {
    .tab-contents .card { min-height: 240px; }
}

@media (max-width: 640px) {
    .tab-contents { padding: 0 8px; }
    .tab-content { grid-template-columns: 1fr; }
}

/* Desktop spacing tweaks for 4-up layout */
@media (min-width: 768px) {
    .tab-content { gap: 1.5rem; }
    .tab-contents { padding-left: 0.5rem; padding-right: 0.5rem; }
    .tab-contents .card { padding: 1.25rem; }
}

@media (min-width: 1024px) {
    .tab-content { gap: 2rem; }
    .tab-contents { max-width: 92rem; }
    .tab-contents .card { min-height: 300px; display: flex; flex-direction: column; justify-content: space-between; }
}

/* Small visual polish */
.card h3 { margin-bottom: 0.25rem; }
.card .btn { box-shadow: 0 6px 18px rgba(15, 23, 42, 0.08); }