/* ============================================================
   Partners Page  (partners-page.php)
   Design frames: desktop 1512px, mobile 393px. Fluid values are
   clamp()s interpolated between those two widths.
   ============================================================ */

.vw-partners {
    --vwpt-orange: #EF6D1B;
    --vwpt-orange-line: #EA6424;
    --vwpt-eyebrow: #E9A159;
    --vwpt-ink: #1D1616;
    --vwpt-btn: #191613;
    --vwpt-grey: #F2F2F2;
    --vwpt-card-border: #D0D0D0;

    background: var(--vwpt-grey);
    color: var(--vwpt-ink);
    font-family: 'Saans-Regular', 'Saans-Regular-fb', Arial, sans-serif;
    overflow: hidden;
}

.vw-partners__container {
    width: min(1148px, 100% - 48px);
    margin: 0 auto;
}

/* Light page background: the white mobile burger icon must be dark here.
   Same fix responsive.css applies for .inner-page / comparison-page, but keyed
   to the template so it works whatever slug the page gets. */
.page-template-partners-page .desk-header .navbar-toggler-icon {
    filter: invert(1);
}

/* ------------------------------------------------------------
   Hero
   ------------------------------------------------------------ */
.vw-partners-hero {
    /* header is position:absolute - this padding clears the floating navbar */
    padding-top: clamp(102px, calc(74.25px + 7.06vw), 181px);
    text-align: center;
}

.vw-partners-hero__eyebrow {
    margin: 0;
    font-family: 'Saans-Regular', 'Saans-Regular-fb', Arial, sans-serif;
    font-weight: 400;
    font-size: clamp(14px, calc(11.89px + 0.536vw), 20px);
    line-height: 1.25;
    text-transform: uppercase;
    color: var(--vwpt-eyebrow);
}

.vw-partners-hero__title {
    margin: clamp(16px, calc(14.6px + 0.357vw), 20px) 0 0;
    font-family: 'Saans-Medium', 'Saans-Medium-fb', Arial, sans-serif;
    font-weight: 500;
    font-size: clamp(44px, calc(34.17px + 2.502vw), 72px);
    line-height: 1.1;
    letter-spacing: -0.004em;
    color: var(--vwpt-ink);
}

.vw-partners-hero__underline {
    display: block;
    width: clamp(72px, calc(62.2px + 2.5vw), 100px);
    height: clamp(2px, 0.2vw, 3px);
    margin: clamp(14px, calc(13.3px + 0.179vw), 16px) auto 0;
    background: var(--vwpt-orange-line);
    border-radius: 2px;
}

.vw-partners-hero__intro,
.vw-partners-why__text {
    margin: 0 auto;
    font-family: 'Saans-Light', 'Saans-Light-fb', Arial, sans-serif;
    font-weight: 300;
    font-size: clamp(18px, calc(15.19px + 0.715vw), 26px);
    line-height: clamp(30px, calc(24.03px + 1.519vw), 47px);
    letter-spacing: 0.003em;
    color: var(--vwpt-ink);
}

.vw-partners-hero__intro {
    margin-top: clamp(24px, calc(20.1px + 0.983vw), 35px);
}

/* ------------------------------------------------------------
   Partner logos
   ------------------------------------------------------------ */
.vw-partners-logos {
    padding-top: clamp(24px, calc(13.46px + 2.681vw), 54px);
}

.vw-partners-logos__grid {
    --vwpt-cols: 4;
    --vwpt-gap: 20px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center; /* centres the incomplete last row */
    gap: var(--vwpt-gap);
    margin: 0;
    padding: 0;
    list-style: none;
}

.vw-partners-logos__item {
    flex: 0 0 calc((100% - (var(--vwpt-cols) - 1) * var(--vwpt-gap)) / var(--vwpt-cols));
    min-width: 0;
    margin: 0;
    list-style: none;
}

.vw-partners-logos__card {
    display: flex;
    align-items: center;
    justify-content: center;
    height: clamp(88px, calc(85.2px + 0.715vw), 96px);
    background: #fff;
    border: 1px solid var(--vwpt-card-border);
    border-radius: 12px;
    box-sizing: border-box;
    overflow: hidden;
}

a.vw-partners-logos__card {
    transition: border-color .25s ease, box-shadow .25s ease;
}

a.vw-partners-logos__card:hover,
a.vw-partners-logos__card:focus-visible {
    border-color: var(--vwpt-orange);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
}

/* Logo files are exported @2x on a 440px-wide canvas -> 220px on a 272px card */
.vw-partners-logos__img {
    display: block;
    width: 80.9%;
    max-width: 220px;
    height: auto;
    max-height: 70%;
    object-fit: contain;
}

/* ------------------------------------------------------------
   Why It Matters
   ------------------------------------------------------------ */
.vw-partners-why {
    padding: clamp(111px, calc(112.35px - 0.089vw), 112px) 0 clamp(63px, calc(53.52px + 2.413vw), 90px);
    text-align: center;
}

.vw-partners-why .vw-partners__container {
    width: min(1190px, 100% - 48px);
}

.vw-partners-why__title {
    margin: 0;
    font-family: 'Saans-Medium', 'Saans-Medium-fb', Arial, sans-serif;
    font-weight: 500;
    font-size: clamp(40px, calc(28.76px + 2.86vw), 72px);
    line-height: 1.1;
    letter-spacing: -0.004em;
    color: var(--vwpt-ink);
}

.vw-partners-why__text {
    margin-top: clamp(25px, calc(17.27px + 1.966vw), 47px);
}

/* ------------------------------------------------------------
   CTA band
   ------------------------------------------------------------ */
.vw-partners-cta {
    padding: clamp(56px, calc(48.98px + 1.787vw), 76px) 0 clamp(56px, calc(48.62px + 1.877vw), 77px);
    background: var(--vwpt-orange);
    color: #fff;
    text-align: center;
}

.vw-partners-cta .vw-partners__container {
    width: min(1190px, 100% - 48px);
}

.vw-partners-cta__title {
    margin: 0 auto;
    max-width: 1100px;
    font-family: 'Saans-Medium', 'Saans-Medium-fb', Arial, sans-serif;
    font-weight: 500;
    font-size: clamp(40px, calc(28.76px + 2.86vw), 72px);
    line-height: clamp(44px, calc(32.06px + 3.038vw), 78px);
    letter-spacing: -0.004em;
    color: #fff;
}

.vw-partners-cta__text {
    margin: clamp(25px, calc(16.57px + 2.145vw), 49px) auto 0;
    font-family: 'Saans-Light', 'Saans-Light-fb', Arial, sans-serif;
    font-weight: 300;
    font-size: clamp(17px, calc(14.54px + 0.626vw), 24px);
    line-height: clamp(29px, calc(25.84px + 0.804vw), 38px);
    letter-spacing: 0;
    color: #fff;
}

.vw-partners-cta__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: clamp(280px, calc(229px + 12.96vw), 425px);
    min-height: clamp(59px, calc(48.5px + 2.68vw), 89px);
    margin-top: clamp(24px, calc(15.57px + 2.145vw), 48px);
    padding: 10px 32px;
    border-radius: 999px;
    background: var(--vwpt-btn);
    color: #fff;
    font-family: 'Saans-Regular', 'Saans-Regular-fb', Arial, sans-serif;
    font-weight: 400;
    font-size: clamp(20px, calc(16.49px + 0.894vw), 30px);
    line-height: 1.2;
    text-decoration: none;
    box-sizing: border-box;
    transition: none; /* overrides the global a{transition:.5s} - no hover effect by design */
}

.vw-partners-cta__btn:hover,
.vw-partners-cta__btn:focus {
    background: var(--vwpt-btn);
    color: #fff;
}

/* ------------------------------------------------------------
   Responsive grid
   ------------------------------------------------------------ */
@media (max-width: 900px) {
    .vw-partners-logos__grid {
        --vwpt-cols: 3;
        --vwpt-gap: 16px;
    }
}

@media (max-width: 600px) {
    .vw-partners-logos__grid {
        --vwpt-cols: 2;
    }

    /* mobile frame sets the CTA heading tighter so it breaks in 3 lines */
    .vw-partners-cta__title {
        letter-spacing: -0.017em;
    }
}