/* Homepage partners section (concept 2): centered heading, two moving rows of logo tiles, CTA. */
.sanam-partners-section {
    padding: clamp(64px, 8vw, 104px) 20px clamp(56px, 7vw, 92px) !important;
    background: #f8f1e8;
    text-align: center;
    overflow: hidden;
}

.sanam-partners-section > .e-con-inner,
.sanam-partners-section {
    align-items: center !important;
    gap: 14px;
}

.sanam-partners-eyebrow .elementor-heading-title {
    display: inline-flex;
    padding: 6px 16px;
    border: 1px solid #e3caab;
    border-radius: 999px;
    background: #fff;
    color: #662627;
    font: 600 14px/1.6 var(--sanam-font-ui);
}

.sanam-partners-title .elementor-heading-title {
    margin: 0;
    color: #662627;
    font: 600 clamp(32px, 4.2vw, 52px)/1.3 var(--sanam-font-heading);
}

.sanam-partners-intro {
    max-width: 560px;
    margin-inline: auto;
    color: #61524a !important;
    font: 600 17px/1.9 var(--sanam-font-text);
}

.sanam-partners-intro p { margin: 0; color: inherit !important; }

/* Logos: a wrapped grid until the script builds the rows (also the reduced-motion layout). */
.sanam-partners-marquee {
    width: calc(100% + 40px);
    margin-inline: -20px;
    margin-block: 30px 34px;
}

.sanam-partners-marquee:not(.is-moving),
.sanam-partners-marquee:not(.is-moving) > .e-con-inner {
    display: flex !important;
    flex-flow: row wrap !important;
    justify-content: center !important;
    gap: 16px !important;
    max-width: 1160px;
    margin-inline: auto;
}

.sanam-partners-marquee:not(.is-moving) .sanam-partner,
.sanam-marquee-tile {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 210px !important;
    height: 120px;
    box-sizing: border-box;
    padding: 16px 24px;
    background: #fff;
    border: 1px solid #f2e7d9;
    border-radius: 20px;
}

.sanam-partners-marquee .sanam-partner img,
.sanam-marquee-tile img {
    width: auto !important;
    max-width: 100% !important;
    max-height: 80px !important;
    object-fit: contain;
}

.sanam-partners-marquee.is-moving > .elementor-widget,
.sanam-partners-marquee.is-moving > .e-con-inner > .elementor-widget {
    display: none !important;
}

.sanam-partners-marquee.is-moving,
.sanam-partners-marquee.is-moving > .e-con-inner {
    display: block !important;
}

.sanam-marquee {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 18px;
    -webkit-mask-image: linear-gradient(to left, transparent 0, #000 10%, #000 90%, transparent 100%);
    mask-image: linear-gradient(to left, transparent 0, #000 10%, #000 90%, transparent 100%);
}

.sanam-marquee-row {
    overflow: hidden;
    direction: ltr; /* the track starts at the left edge so the -50% loop lines up */
}

.sanam-marquee-track {
    display: flex;
    width: max-content;
    direction: ltr;
    animation: sanam-marquee var(--sanam-marquee-duration, 60s) linear infinite;
}

.sanam-marquee-track > .sanam-marquee-tile { margin-right: 18px; }
.sanam-marquee-row--reverse .sanam-marquee-track { animation-direction: reverse; }
.sanam-marquee-row:hover .sanam-marquee-track,
.sanam-marquee-row:focus-within .sanam-marquee-track { animation-play-state: paused; }

/* Draggable rows (partners-marquee.js moves them; the CSS animation stays as the no-JS fallback). */
.sanam-partners-marquee.is-draggable .sanam-marquee-track { animation: none; will-change: transform; }
.sanam-partners-marquee.is-draggable .sanam-marquee-row { cursor: grab; touch-action: pan-y; user-select: none; -webkit-user-select: none; }
.sanam-partners-marquee.is-draggable .sanam-marquee-row.is-dragging { cursor: grabbing; }
.sanam-partners-marquee.is-draggable .sanam-marquee-tile img { -webkit-user-drag: none; pointer-events: none; }

@keyframes sanam-marquee {
    from { transform: translateX(0); }
    to { transform: translateX(-50%); }
}

.sanam-partners-cta .elementor-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 50px;
    padding: 12px 28px;
    border-radius: 999px;
    background: #662627 !important;
    color: #fcf8f3 !important;
    font: 600 16px/1.5 var(--sanam-font-ui);
}

.sanam-partners-cta .elementor-button:hover { background: #521e1f !important; }

@media (max-width: 767px) {
    .sanam-partners-marquee:not(.is-moving) .sanam-partner,
    .sanam-marquee-tile {
        width: 150px !important;
        height: 92px;
        padding: 12px 16px;
        border-radius: 16px;
    }

    .sanam-partners-marquee .sanam-partner img,
    .sanam-marquee-tile img { max-height: 60px !important; }

    .sanam-marquee-track > .sanam-marquee-tile { margin-right: 12px; }
    .sanam-marquee { gap: 12px; }
}
