/* ==========================================================
   PRICING SWIPER — assets/css/pricing-slider.css
   Surcharges minimales pour que Swiper cohabite avec le CSS
   des plan-cards existant (pricing.css).
   ========================================================== */

/* Le conteneur swiper doit pouvoir déborder pour laisser
   entrevoir les cartes latérales (comme sur Opalt). */
.pricing-swiper.swiper {
    overflow: visible;
    padding: 40px 0;
}

/* Largeur fixe : les cartes ne se déforment jamais.
   Elles débordent de l'écran sur les côtés → on swipe. */
.pricing-swiper .swiper-slide {
    width: 350px;
    flex-shrink: 0;
}

/* La carte featured ne doit plus se décaler via translateY
   puisque c'est Swiper qui gère le positionnement. */
.pricing-swiper .plan-card.featured {
    transform: none;
}

/* Slide active (centrée) : légère élévation pour la distinguer,
   quelle que soit la carte. */
.pricing-swiper .swiper-slide-active .plan-card,
.pricing-swiper .swiper-slide-active.plan-card {
    box-shadow: 0 14px 40px rgba(20, 40, 90, 0.12);
}

/* Slides latérales : légèrement atténuées pour guider le regard
   vers la carte centrale. */
.pricing-swiper .swiper-slide:not(.swiper-slide-active) {
    opacity: 0.65;
    transition: opacity 0.3s ease;
}

.pricing-swiper .swiper-slide-active {
    opacity: 1;
}

/* ================= RESPONSIVE ================= */
/* @media (max-width: 1024px) {
    .pricing-swiper .swiper-slide {
        width: 45%;
    }
} */

@media (max-width: 640px) {
    .pricing-swiper .swiper-slide {
        width: 85%;
    }
}