/* ==========================================================
   PLANET PROVENCE CAROUSELS — V2.7
   ========================================================== */

.ppc-viewport,
.ppc-viewport *,
.ppc-carousel,
.ppc-carousel * { box-sizing: border-box; }

/* VIEWPORT */
.ppc-viewport {
    position: relative;
    width: 100%;
    max-width: 100vw;
    overflow: visible;
}
.ppc-viewport[data-ppc-ready="1"] {
    width: var(--ppc-width) !important;
    max-width: var(--ppc-width) !important;
}
.ppc-viewport--left[data-ppc-ready="1"] { margin-left: var(--ppc-shift) !important; }
.ppc-viewport--right[data-ppc-ready="1"] { margin-right: 0 !important; }

/* SWIPER — les slides restent toujours coupées au bord du carousel */
.ppc-carousel {
    position: relative;
    width: 100%;
    max-width: 100%;
    overflow: hidden !important;
}
.ppc-carousel .swiper-wrapper { align-items: stretch; }
.ppc-carousel .swiper-slide {
    width: clamp(240px, 24vw, 350px);
    height: auto;
    flex-shrink: 0;
}

/* CARTE */
.ppc-card {
    position: relative;
    display: block;
    width: 100%;
    height: 470px;
    overflow: hidden;
    background: #252823;
    text-decoration: none !important;
    direction: ltr;
}
.ppc-card__image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .7s cubic-bezier(.2,.7,.2,1);
}
.ppc-card__shade {
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(180deg, rgba(0,0,0,0) 35%, rgba(0,0,0,.10) 55%, rgba(0,0,0,.68) 100%);
}
.ppc-card__content {
    position: absolute;
    z-index: 2;
    left: 26px;
    right: 26px;
    bottom: 24px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    direction: ltr;
    text-align: left;
    color: #fff;
}
.ppc-card__title {
    display: block;
    max-width: 100%;
    margin-bottom: 16px;
    font-family: "Cormorant Garamond", Georgia, serif;
    font-size: clamp(32px, 2.35vw, 44px);
    line-height: .98;
    font-weight: 500;
    color: #fff;
}
.ppc-card__cta {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    font-family: "Manrope", Arial, sans-serif;
    font-size: 12px;
    line-height: 1;
    font-weight: 700;
    letter-spacing: .06em;
    color: #fff;
}
.ppc-card__arrow {
    display: inline-block;
    font-size: 18px;
    line-height: 1;
    transition: transform .25s ease;
}

/* FONDUS — uniquement au bord extérieur */
.ppc-carousel::before,
.ppc-carousel::after {
    content: "";
    position: absolute;
    z-index: 5;
    top: 0;
    bottom: 0;
    width: 130px;
    pointer-events: none;
    display: none;
}
.ppc-viewport--right .ppc-carousel::after {
    display: block;
    right: 0;
    background: linear-gradient(270deg, rgba(255,255,255,.92) 0%, rgba(255,255,255,.65) 25%, rgba(255,255,255,.25) 60%, rgba(255,255,255,0) 100%);
}
.ppc-viewport--left .ppc-carousel::before {
    display: block;
    left: 0;
    background: linear-gradient(90deg, rgba(255,255,255,.92) 0%, rgba(255,255,255,.65) 25%, rgba(255,255,255,.25) 60%, rgba(255,255,255,0) 100%);
}
.ppc-edge-fade { display: none; }

/* FLÈCHES — hors du conteneur Swiper dans le HTML */
.ppc-nav {
    position: absolute;
    z-index: 10;
    top: 50%;
    transform: translateY(-50%);
    width: 44px;
    height: 64px;
    padding: 0;
    border: 0;
    background: transparent;
    color: #252823;
    text-shadow: 0 1px 2px rgba(255,255,255,.8);
    font-family: Arial, sans-serif;
    font-size: 42px;
    line-height: 1;
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
}
.ppc-nav span { display: block; line-height: 1; transform: translateY(-2px); }
.ppc-nav.swiper-button-disabled { opacity: .25; visibility: visible; pointer-events: none; }

@media (min-width: 981px) {
    /* Carousel vers la droite : flèche intérieure à gauche, extérieure dans le fondu droit */
    .ppc-viewport--right .ppc-nav--prev { left: -55px !important; right: auto !important; }
    .ppc-viewport--right .ppc-nav--next { right: 12px !important; left: auto !important; }

    /* Carousel vers la gauche : logique inversée */
    .ppc-viewport--left .ppc-nav--prev { left: 12px !important; right: auto !important; }
    .ppc-viewport--left .ppc-nav--next { right: -55px !important; left: auto !important; }
}

/* PAS DE PAGINATION */
.ppc-pagination,
.ppc-carousel .swiper-pagination,
.ppc-carousel .swiper-pagination-bullet,
.ppc-carousel .swiper-pagination-bullets { display: none !important; }

/* HOVER */
@media (hover: hover) {
    .ppc-card:hover .ppc-card__image { transform: scale(1.045); }
    .ppc-card:hover .ppc-card__arrow { transform: translateX(5px); }
}

/* TABLETTE */
@media (max-width: 980px) {
    .ppc-carousel .swiper-slide { width: clamp(250px, 55vw, 390px); }
    .ppc-card { height: 435px; }
    .ppc-card__title { font-size: 38px; }
    .ppc-carousel::before,
    .ppc-carousel::after { width: 100px; }
    .ppc-nav--prev { left: 6px !important; right: auto !important; }
    .ppc-nav--next { right: 6px !important; left: auto !important; }
}

/* MOBILE */
@media (max-width: 767px) {
    .ppc-carousel .swiper-slide { width: min(80vw, 330px); }
    .ppc-card { height: 390px; }
    .ppc-card__content { left: 22px; right: 22px; bottom: 24px; }
    .ppc-card__title { font-size: 34px; }
    .ppc-carousel::before,
    .ppc-carousel::after { width: 70px; }
    .ppc-nav { width: 34px; height: 54px; font-size: 36px; }
}
