@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@600;700;800&family=Playfair+Display:wght@700;800&family=Poppins:wght@400;500;600&display=swap');

.cust-testimonials-section {
    --cust-bg: #140404;
    --cust-maroon: #4a0606;
    --cust-maroon-2: #2e0303;
    --cust-gold: #e0a93b;
    --cust-gold-soft: #f6d98a;
    --cust-cream: #fffdf8;
    --cust-cream-2: #f4e3c1;
    background: radial-gradient(ellipse at top,#2a0808 0%,var(--cust-bg) 60%,#0d0202 100%);
    overflow: hidden;
}

/* ===== HERO HEADER ===== */
.cust-hero {
    text-align: center;
    max-width: 1000px;
    margin: 0 auto 30px;
    padding: 0 10px;
}

.cust-badge {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 10px 26px;
    border-radius: 50px;
    background: linear-gradient(180deg,#4a0606,#2e0303);
    border: 1.5px solid rgba(224,169,59,.75);
    box-shadow: 0 0 16px rgba(224,169,59,.25);
    font: 700 12.5px 'Cinzel',serif;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: var(--cust-gold-soft);
}

.cust-badge-dot {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: #22c55e;
    box-shadow: 0 0 8px #22c55e;
    flex: 0 0 9px;
}

.cust-hero-title {
    font-family: 'Playfair Display',serif;
    font-weight: 800;
    line-height: 1.2;
    font-size: clamp(28px,4.6vw,52px);
    color: #fbe6b8;
    margin: 22px 0 0;
}

    .cust-hero-title .cust-gold-line {
        display: block;
        background: linear-gradient(180deg,#f0c35a 0%,#c58b2a 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        color: transparent;
    }

.cust-divider {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    margin: 18px 0 22px;
}

    .cust-divider::before, .cust-divider::after {
        content: "";
        width: 70px;
        height: 1px;
        background: linear-gradient(90deg,transparent,var(--cust-gold));
    }

    .cust-divider::after {
        background: linear-gradient(270deg,transparent,var(--cust-gold));
    }

    .cust-divider svg {
        width: 22px;
        height: 22px;
        stroke: var(--cust-gold);
        fill: none;
        stroke-width: 1.8;
        stroke-linecap: round;
    }

.cust-hero-desc {
    font: 500 15.5px/1.85 'Poppins',sans-serif;
    color: var(--cust-gold-soft);
    max-width: 820px;
    margin: 0 auto 20px;
}

.cust-quota {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    max-width: 100%;
    padding: 9px 22px;
    border-radius: 50px;
    background: rgba(74,6,6,.55);
    border: 1px solid rgba(224,169,59,.6);
    font: 400 12.5px/1.5 'Poppins',sans-serif;
    color: #f5e9d0;
    text-align: left;
}

    .cust-quota b {
        font-weight: 700;
        color: #fff;
    }

    .cust-quota svg {
        width: 17px;
        height: 17px;
        flex: 0 0 17px;
        stroke: var(--cust-gold);
        fill: none;
        stroke-width: 2.2;
        stroke-linecap: round;
        stroke-linejoin: round;
    }

.cust-features {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 14px;
    margin-top: 26px;
}

.cust-feature {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 9px 20px;
    border-radius: 50px;
    background: rgba(60,12,12,.6);
    border: 1px solid rgba(224,169,59,.45);
    font: 500 12.5px 'Poppins',sans-serif;
    color: #f5e9d0;
}

    .cust-feature svg {
        width: 17px;
        height: 17px;
        flex: 0 0 17px;
        stroke: var(--cust-gold);
        fill: none;
        stroke-width: 2;
        stroke-linecap: round;
        stroke-linejoin: round;
    }

.cust-carousel-wrapper {
    position: relative;
    padding: 0 46px;
}

.cust-track-outer {
    overflow: hidden;
    padding: 44px 0 34px;
}

.cust-track {
    display: flex;
    transition: transform .55s cubic-bezier(.22,.8,.3,1);
    will-change: transform;
}

.cust-testimonial-item {
    flex: 0 0 20%;
    padding: 0 10px;
    box-sizing: border-box;
}

/* Arch card */
.cust-testimonial-card {
    position: relative;
    height: 100%;
    box-sizing: border-box;
    border: 1.5px solid var(--cust-gold);
    border-radius: 130px 130px 24px 24px;
    background: linear-gradient(180deg,var(--cust-cream) 0%,var(--cust-cream-2) 100%);
    box-shadow: 0 0 22px rgba(255,185,60,.28),0 10px 24px rgba(0,0,0,.45);
    padding: 34px 14px 18px;
    text-align: center;
    overflow: visible;
    transition: box-shadow .3s,transform .3s;
}

    .cust-testimonial-card:hover {
        box-shadow: 0 0 30px rgba(255,195,70,.5),0 14px 28px rgba(0,0,0,.5);
        transform: translateY(-3px);
    }

/* Number badge */
.cust-num {
    position: absolute;
    top: -16px;
    left: 50%;
    transform: translateX(-50%);
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: radial-gradient(circle at 35% 30%,#7a0f0f,var(--cust-maroon-2));
    border: 2px solid var(--cust-gold);
    color: var(--cust-gold-soft);
    font: 700 14px/30px 'Cinzel',serif;
    text-align: center;
    box-shadow: 0 0 10px rgba(224,169,59,.55);
}

.cust-testimonial-screenshot {
    height: 230px;
    border-radius: 14px;
    overflow: hidden;
    border: 1.5px solid rgba(224,169,59,.7);
    background: #fff;
    box-shadow: 0 4px 12px rgba(74,6,6,.25);
}

.cust-testimonial-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top center;
    display: block;
}

/* Content pill */
.cust-testimonial-text {
    margin: 14px 0 0;
    padding: 9px 10px;
    font: 600 12.5px/1.45 'Cinzel',serif;
    letter-spacing: .4px;
    color: var(--cust-gold-soft);
    background: linear-gradient(180deg,#5a0909,var(--cust-maroon-2));
    border: 1px solid var(--cust-gold);
    border-radius: 6px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Dashed divider + verified line */
.cust-testimonial-card::after {
    content: "\2714  Verified Feedback";
    display: block;
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px dashed rgba(74,6,6,.45);
    font: 500 12.5px 'Poppins',sans-serif;
    color: #3b2a1a;
}

/* Arrows */
.cust-nav-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 3;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    cursor: pointer;
    background: linear-gradient(180deg,#5a0909,var(--cust-maroon-2));
    border: 1.5px solid var(--cust-gold);
    box-shadow: 0 0 12px rgba(224,169,59,.4);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
}

    .cust-nav-btn svg {
        width: 20px;
        height: 20px;
        fill: none;
        stroke: var(--cust-gold-soft);
        stroke-width: 2.5;
        stroke-linecap: round;
        stroke-linejoin: round;
    }

.cust-prev {
    left: 0;
}

.cust-next {
    right: 0;
}

.cust-nav-btn:hover {
    background: var(--cust-gold);
}

    .cust-nav-btn:hover svg {
        stroke: var(--cust-maroon-2);
    }

/* Dots */
.cust-dot {
    width: 10px;
    height: 10px;
    padding: 0;
    border-radius: 50%;
    border: 1px solid var(--cust-gold);
    background: transparent;
    cursor: pointer;
    transition: all .3s;
}

    .cust-dot.active {
        background: var(--cust-gold);
        width: 26px;
        border-radius: 6px;
    }

/* Responsive breakpoints matching Bootstrap grid structure */
@media (max-width:1199px) {
    .cust-testimonial-item {
        flex-basis: 25%
    }
}

@media (max-width:991px) {
    .cust-testimonial-item {
        flex-basis: 33.3333%
    }
}

@media (max-width:699px) {
    .cust-testimonial-item {
        flex-basis: 50%
    }

    .cust-carousel-wrapper {
        padding: 0 38px
    }

    .cust-badge {
        font-size: 10.5px;
        letter-spacing: 1px;
        padding: 9px 16px;
    }

    .cust-hero-desc {
        font-size: 14px
    }
}

@media (max-width:479px) {
    .cust-testimonial-item {
        flex-basis: 100%
    }
}