/* ============================================================
   Parnu Hotels – Kadence‑Native Carousel Styling
   ============================================================ */

/* Float option (responsive fix) */
.ph-carousel-float {
    float: left;
    width: min(380px, 45%);
    margin: 0 1.5rem 1rem 0;
}

/* Stack on mobile: below this width the carousel drops the float
   and goes full-width, so the text that follows it in the markup
   flows underneath instead of being squeezed into a narrow column
   beside it. */
@media (max-width: 600px) {
    .ph-carousel-float {
        float: none;
        width: 100%;
        margin: 0 0 1.5rem 0;
    }
}

/* Ensure Swiper fits inside the float */
.ph-carousel-float .ph-swing-carousel {
    width: 100% !important;
}

/* Force Swiper to behave correctly inside Kadence */
.ph-swing-carousel {
    max-width: 100% !important;
    overflow: hidden !important;
}

.ph-swing-carousel .swiper-wrapper {
    display: flex !important;
    width: 100% !important;
}

.ph-swing-carousel .swiper-slide {
    width: 100% !important;
    flex-shrink: 0 !important;
}

/* Kadence-native card styling */
.ph-swing-card {
    background: var(--global-palette9, #ffffff);
    border-radius: var(--global-border-radius, 12px);
    box-shadow: var(--global-shadow-sm, 0 2px 6px rgba(0,0,0,0.08));
    padding: var(--global-md-spacing, 1.5rem);
    transition: transform .35s ease, box-shadow .35s ease;
}

/* Hover lift */
.ph-swing-card:hover {
    transform: translateY(-4px);
}

/* Featured image styling */
.ph-swing-image img {
    border-radius: var(--global-border-radius, 12px);
    margin-bottom: var(--global-sm-spacing, 1rem);
    width: 100%;
    height: auto;
}

/* Title styling */
.ph-swing-content h3 {
    font-size: var(--global-h4-size, 1.25rem);
    font-weight: var(--global-heading-weight, 600);
    margin-bottom: var(--global-xs-spacing, 0.75rem);
    color: var(--global-palette3, #1a1a1a);
}

/* Excerpt styling */
.ph-swing-content p {
    font-size: var(--global-body-font-size, 1rem);
    line-height: var(--global-body-line-height, 1.6);
    color: var(--global-palette4, #444444);
}

/* ============================================================
   Swing‑In Animation
   ============================================================ */

.ph-swing-slide {
    transform-origin: left center;
}

.ph-swing-slide.swiper-slide-active .ph-swing-card {
    animation: phSwingIn 0.65s ease forwards;
}

@keyframes phSwingIn {
    0% {
        transform: rotate(-6deg) translateX(-40px);
        opacity: 0;
    }
    60% {
        transform: rotate(2deg) translateX(10px);
        opacity: 1;
    }
    100% {
        transform: rotate(0deg) translateX(0);
    }
}