/* ============================================================
   Logo Img Testimonial — styles
   ============================================================ */

/* ── Elementor widget host containment ───────────────────── */
/* These rules ensure the widget NEVER bleeds outside its column,
   including when this widget sits inside an inner section/column. */
.elementor-widget-logo_img_testimonial,
.elementor-widget-logo_img_testimonial .elementor-widget-container {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    /* overflow hidden here clips the left/right bleed */
    overflow: hidden;
}

/* Inner sections/columns clip their own content too, so a carousel
   nested inside a column never paints over a sibling column. */
.elementor-column .elementor-widget-logo_img_testimonial,
.elementor-element.elementor-column > .elementor-widget-wrap {
    max-width: 100%;
}

/* ── Wrapper ─────────────────────────────────────────────── */
.pct-wrapper {
    position: relative;
    width: 100%;
    max-width: 100%;
    min-width: 0; /* prevents flex/grid parent columns (inner sections)
                     from letting this stretch past their own width */
    box-sizing: border-box;
}

/* ── Grid / Masonry ──────────────────────────────────────── */
.pct-grid-wrap {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}
.pct-masonry-grid {
    grid-template-columns: repeat(3, 1fr);
    align-items: start;
}

/* ── Card ────────────────────────────────────────────────── */
.pct-card {
    background: #fff;
    border-radius: 16px;
    padding: 32px;
    position: relative;
    display: flex;
    flex-direction: column;
    height: 100%;
    box-sizing: border-box;
    transition: box-shadow 0.25s ease, transform 0.25s ease;
}
.pct-card:hover { transform: translateY(-3px); }

/* ── Person image ────────────────────────────────────────── */
.pct-person-image-wrap { margin-bottom: 16px; }
.pct-person-img {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    object-fit: cover;
    display: block;
}

/* ── Logo ────────────────────────────────────────────────── */
.pct-logo { margin-bottom: 16px; }
.pct-logo img { max-width: 100px; height: auto; display: block; }

/* ── Person image positions ──────────────────────────────── */
.pct-img-pos-top-left   .pct-person-image-wrap { align-self: flex-start; }
.pct-img-pos-top-center .pct-person-image-wrap { align-self: center; }
.pct-img-pos-top-right  .pct-person-image-wrap { align-self: flex-end; }
.pct-img-pos-bottom-left   { flex-direction: column-reverse; }
.pct-img-pos-bottom-left   .pct-person-image-wrap { align-self: flex-start; margin-top: 16px; margin-bottom: 0; }
.pct-img-pos-bottom-center { flex-direction: column-reverse; }
.pct-img-pos-bottom-center .pct-person-image-wrap { align-self: center; margin-top: 16px; margin-bottom: 0; }
.pct-img-pos-bottom-right  { flex-direction: column-reverse; }
.pct-img-pos-bottom-right  .pct-person-image-wrap { align-self: flex-end; margin-top: 16px; margin-bottom: 0; }

.pct-img-pos-inline-left .pct-author-wrap,
.pct-img-pos-inline-right .pct-author-wrap {
    display: flex; align-items: center; gap: 12px;
}
.pct-img-pos-inline-left  .pct-person-image-wrap { margin-bottom: 0; flex-shrink: 0; }
.pct-img-pos-inline-right .pct-person-image-wrap { margin-bottom: 0; flex-shrink: 0; }
.pct-img-pos-inline-left  .pct-author-wrap { flex-direction: row; }
.pct-img-pos-inline-right .pct-author-wrap { flex-direction: row-reverse; }
.pct-img-pos-inline-left  .pct-card > .pct-person-image-wrap,
.pct-img-pos-inline-right .pct-card > .pct-person-image-wrap,
.pct-img-pos-inline-left  .pct-card > .pct-inline-image-logo > .pct-person-image-wrap,
.pct-img-pos-inline-right .pct-card > .pct-inline-image-logo > .pct-person-image-wrap { display: none; }

/* ── Logo positions ──────────────────────────────────────── */
.pct-logo-pos-top-right   .pct-logo { align-self: flex-end; }
.pct-logo-pos-top-center  .pct-logo { align-self: center; }
.pct-logo-pos-top-left    .pct-logo { align-self: flex-start; }
.pct-logo-pos-bottom-right  .pct-logo { align-self: flex-end;   order: 99; margin-top: auto; padding-top: 16px; margin-bottom: 0; }
.pct-logo-pos-bottom-center .pct-logo { align-self: center;     order: 99; margin-top: auto; padding-top: 16px; margin-bottom: 0; }
.pct-logo-pos-bottom-left   .pct-logo { align-self: flex-start; order: 99; margin-top: auto; padding-top: 16px; margin-bottom: 0; }

/* ── Logo inline with person image ───────────────────────── */
/* Places the company logo right next to the person photo, with
   a gap between them (gap size controlled by the "Space Between
   Image & Logo" Elementor control). */
.pct-inline-image-logo {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 16px;
}
.pct-inline-image-logo .pct-person-image-wrap,
.pct-inline-image-logo .pct-logo {
    margin-bottom: 0;
    flex-shrink: 0;
}

/* ── Quote Icon ──────────────────────────────────────────── */
.pct-quote-icon { font-size: 36px; line-height: 1; color: #1a1a2e; margin-bottom: 12px; display: block; }

/* ── Quote Text ──────────────────────────────────────────── */
.pct-quote-text { margin-bottom: 24px; flex: 1; }
.pct-quote-text p { margin: 0; }

/* ── Author ──────────────────────────────────────────────── */
.pct-author-wrap { margin-top: auto; }
.pct-author-name { font-weight: 700; color: #1a1a2e; font-size: 15px; }
.pct-author-name.pct-has-divider { display: flex; align-items: center; gap: 10px; }
.pct-author-name.pct-has-divider::before {
    content: '';
    display: inline-block;
    width: 28px; height: 2px;
    background-color: #1a1a2e;
    flex-shrink: 0;
}
.pct-author-designation { color: #777; font-size: 13px; margin-top: 2px; }

/* ── Carousel wrapper ────────────────────────────────────── */
.pct-carousel {
    /* Space for arrows below + dots */
    padding-bottom: 56px;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
    position: relative;
}

/*
 * THE KEY FIX for left/right overflow into neighboring sections:
 * The swiper must clip slides on BOTH sides at all times — including
 * mid-transition when the carousel sits inside an inner Elementor
 * section/column. overflow:hidden + min-width:0 stops the swiper from
 * ever reporting/using a width wider than its actual column, which is
 * what let slides bleed over neighboring columns when clicking Next.
 * Do NOT use overflow:visible — that causes left/right bleed.
 */
.pct-carousel .swiper {
    overflow: hidden;  /* clips partial slides on left AND right */
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
}

.pct-carousel .swiper-slide { height: auto; }
.pct-carousel .pct-card     { height: 100%; }

/* ── Dots ────────────────────────────────────────────────── */
.pct-carousel .swiper-pagination {
    position: absolute;
    bottom: 10px;
    left: 0;
    width: 100%;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    pointer-events: none;
}
.pct-carousel .swiper-pagination-bullet {
    pointer-events: all;
    background: #ccc;
    opacity: 1;
    width: 8px; height: 8px;
    border-radius: 50%;
    transition: all 0.2s;
    margin: 0 !important;
}
.pct-carousel .swiper-pagination-bullet-active {
    background: #1a1a2e;
    width: 20px;
    border-radius: 4px;
}

/* ── Arrows ──────────────────────────────────────────────── */
/*
 * Arrows sit on OPPOSITE edges of the carousel, vertically centered
 * over the slide area (classic left/right slider arrows) — not
 * side-by-side. The slide area height is everything above the
 * reserved bottom padding (dots), so we center against that area
 * using top:50% with a transform that excludes the bottom padding.
 */
.pct-btn-prev,
.pct-btn-next {
    position: absolute;
    top: calc(50% - 28px); /* 28px ≈ half of the reserved 56px bottom padding, keeps arrows centered on the slide area, not the whole wrapper incl. dots */
    transform: translateY(-50%);
    z-index: 10;
    width: 40px; height: 40px;
    border-radius: 50%;
    border: 1px solid #e5e5e5;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    color: #1a1a2e;
    box-shadow: 0 2px 8px rgba(0,0,0,0.10);
    transition: background 0.2s, box-shadow 0.2s;
    flex-shrink: 0;
}
.pct-btn-prev { left: 8px; }
.pct-btn-next { right: 8px; }
.pct-btn-prev:hover,
.pct-btn-next:hover { box-shadow: 0 4px 16px rgba(0,0,0,0.16); }
.pct-btn-prev.swiper-button-disabled,
.pct-btn-next.swiper-button-disabled { opacity: 0.3; pointer-events: none; }

/* hide Swiper's default arrows (we use custom ones) */
.pct-carousel .swiper-button-prev,
.pct-carousel .swiper-button-next { display: none !important; }

/* ── Responsive ──────────────────────────────────────────── */
@media (max-width: 1024px) {
    .pct-grid-wrap { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 767px) {
    .pct-grid-wrap { grid-template-columns: 1fr; }
}

/* ── Masonry ─────────────────────────────────────────────── */
.pct-masonry-col { display: flex; flex-direction: column; gap: 24px; }

/* ── Editor placeholder ──────────────────────────────────── */
.elementor-editor-active .pct-wrapper:empty::after {
    content: 'Add testimonials in the widget controls.';
    display: block; padding: 20px; color: #aaa; text-align: center;
}


/* ===== Patch: column overflow fix ===== */
.elementor-widget-logo_img_testimonial,
.elementor-widget-logo_img_testimonial *{
    box-sizing:border-box;
}
.elementor-widget-logo_img_testimonial{
    overflow:hidden !important;
    max-width:100% !important;
}
.elementor-widget-logo_img_testimonial .swiper,
.elementor-widget-logo_img_testimonial .swiper-wrapper{
    max-width:100% !important;
}
.elementor-widget-logo_img_testimonial .swiper-slide{
    overflow:hidden;
}

/* ===== Patch: arrows side-by-side ===== */
.pct-btn-prev,
.pct-btn-next{
    top:auto !important;
    bottom:10px !important;
    transform:none !important;
}
.pct-btn-next{
    right:10px !important;
    left:auto !important;
}
.pct-btn-prev{
    right:60px !important;
    left:auto !important;
}