/* =====================================================================
   TrueLink — Responsive Fix for Ecosystem & Experience Centres
   File: tl-responsive-fix.css
   Purpose: Full responsiveness for tablet and mobile devices ONLY.
   Desktop styles (> 1024px) remain completely untouched and fallback to final-polish.css
   ===================================================================== */

/* ─── TABLET LANDSCAPE (821px–1024px) ─── */
@media (min-width: 821px) and (max-width: 1024px) {
    body.page-ecosystem .premium-content-stack,
    body.page-experience-centres .premium-content-stack {
        gap: 32px !important;
        padding: clamp(38px, 5vw, 56px) 0 !important;
    }

    body.page-ecosystem :is(.premium-content__grid, .premium-editorial),
    body.page-experience-centres :is(.premium-content__grid, .premium-editorial) {
        width: min(calc(100% - 32px), 960px) !important;
        border-radius: 20px !important;
        margin-inline: auto !important;
    }

    body.page-ecosystem .premium-editorial,
    body.page-experience-centres .premium-editorial {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    }

    body.page-ecosystem .premium-content__grid,
    body.page-experience-centres .premium-content__grid {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    }

    body.page-ecosystem .premium-content__visual,
    body.page-experience-centres .premium-content__visual,
    body.page-ecosystem .premium-editorial__visual,
    body.page-experience-centres .premium-editorial__visual {
        min-height: 300px !important;
    }

    body.page-ecosystem .premium-content__image,
    body.page-experience-centres .premium-content__image,
    body.page-ecosystem .premium-content__image img,
    body.page-experience-centres .premium-content__image img {
        min-height: 300px !important;
        height: 100% !important;
    }

    body.page-ecosystem .premium-content__copy,
    body.page-experience-centres .premium-content__copy,
    body.page-ecosystem .premium-editorial__content,
    body.page-experience-centres .premium-editorial__content {
        padding: clamp(24px, 3vw, 36px) !important;
    }

    body.page-ecosystem :is(.premium-content__copy, .premium-editorial__content) h2,
    body.page-experience-centres :is(.premium-content__copy, .premium-editorial__content) h2 {
        font-size: clamp(24px, 3vw, 34px) !important;
        max-width: 100% !important;
    }

    body.page-ecosystem :is(.premium-content__copy, .premium-editorial__content) p,
    body.page-experience-centres :is(.premium-content__copy, .premium-editorial__content) p {
        font-size: 14px !important;
        line-height: 1.55 !important;
    }

    body.page-ecosystem .premium-editorial__points li,
    body.page-experience-centres .premium-editorial__points li {
        min-height: 62px !important;
        padding: 12px 14px !important;
    }

    body.page-ecosystem .premium-editorial__points p,
    body.page-experience-centres .premium-editorial__points p {
        font-size: 13px !important;
    }

    body.page-ecosystem .premium-editorial__prose p,
    body.page-experience-centres .premium-editorial__prose p {
        font-size: 14px !important;
        margin-top: 18px !important;
    }
}

/* ─── TABLET PORTRAIT (601px–820px) ─── */
@media (min-width: 601px) and (max-width: 820px) {
    body.page-ecosystem .premium-content-stack,
    body.page-experience-centres .premium-content-stack {
        gap: 24px !important;
        padding: 32px 0 48px !important;
    }

    body.page-ecosystem :is(.premium-content__grid, .premium-editorial),
    body.page-experience-centres :is(.premium-content__grid, .premium-editorial) {
        width: min(calc(100% - 28px), 580px) !important;
        grid-template-columns: 1fr !important;
        border-radius: 18px !important;
        margin-inline: auto !important;
        display: grid !important;
    }

    body.page-ecosystem .premium-content__visual,
    body.page-experience-centres .premium-content__visual,
    body.page-ecosystem .premium-editorial__visual,
    body.page-experience-centres .premium-editorial__visual {
        order: -1 !important;
        min-height: 240px !important;
        height: auto !important;
        position: static !important;
        top: auto !important;
    }

    body.page-ecosystem .premium-content__image,
    body.page-experience-centres .premium-content__image {
        min-height: 240px !important;
        height: 240px !important;
        aspect-ratio: 16 / 9 !important;
        border-radius: 18px 18px 0 0 !important;
    }

    body.page-ecosystem .premium-content__image img,
    body.page-experience-centres .premium-content__image img {
        min-height: 240px !important;
        height: 100% !important;
    }

    body.page-ecosystem .premium-content__copy,
    body.page-experience-centres .premium-content__copy,
    body.page-ecosystem .premium-editorial__content,
    body.page-experience-centres .premium-editorial__content {
        order: 2 !important;
        padding: 28px 24px 30px !important;
        width: 100% !important;
    }

    body.page-ecosystem :is(.premium-content__copy, .premium-editorial__content) h2,
    body.page-experience-centres :is(.premium-content__copy, .premium-editorial__content) h2 {
        max-width: 100% !important;
        font-size: clamp(26px, 5vw, 36px) !important;
        line-height: 1.08 !important;
    }

    body.page-ecosystem :is(.premium-content__copy, .premium-editorial__content) p,
    body.page-experience-centres :is(.premium-content__copy, .premium-editorial__content) p {
        max-width: 100% !important;
        font-size: 15px !important;
        line-height: 1.58 !important;
    }

    body.page-ecosystem .premium-editorial__points,
    body.page-experience-centres .premium-editorial__points {
        grid-template-columns: 1fr !important;
        gap: 10px !important;
        margin-top: 20px !important;
    }

    body.page-ecosystem .premium-editorial__points li,
    body.page-experience-centres .premium-editorial__points li {
        min-height: 64px !important;
        padding: 14px 16px !important;
    }

    body.page-ecosystem .premium-editorial__prose p,
    body.page-experience-centres .premium-editorial__prose p {
        font-size: 14.5px !important;
        margin-top: 16px !important;
    }

    /* Flip order reset on tablet */
    body.page-ecosystem .premium-content--flip .premium-content__visual,
    body.page-experience-centres .premium-content--flip .premium-content__visual {
        order: -1 !important;
    }

    body.page-ecosystem .premium-content--flip .premium-content__copy,
    body.page-experience-centres .premium-content--flip .premium-content__copy {
        order: 2 !important;
    }
}

/* ─── LARGE PHONE / SMALL TABLET (431px–600px) ─── */
@media (min-width: 431px) and (max-width: 600px) {
    body.page-ecosystem .premium-content-stack,
    body.page-experience-centres .premium-content-stack {
        gap: 22px !important;
        padding: 28px 0 42px !important;
    }

    body.page-ecosystem :is(.premium-content__grid, .premium-editorial),
    body.page-experience-centres :is(.premium-content__grid, .premium-editorial) {
        width: calc(100% - 24px) !important;
        max-width: 520px !important;
        grid-template-columns: 1fr !important;
        border-radius: 16px !important;
        margin-inline: auto !important;
        display: grid !important;
    }

    body.page-ecosystem .premium-content__visual,
    body.page-experience-centres .premium-content__visual,
    body.page-ecosystem .premium-editorial__visual,
    body.page-experience-centres .premium-editorial__visual {
        order: -1 !important;
        min-height: 200px !important;
        height: auto !important;
        position: static !important;
        top: auto !important;
    }

    body.page-ecosystem .premium-content__image,
    body.page-experience-centres .premium-content__image {
        min-height: 200px !important;
        height: 200px !important;
        aspect-ratio: 16 / 9 !important;
        border-radius: 16px 16px 0 0 !important;
    }

    body.page-ecosystem .premium-content__image img,
    body.page-experience-centres .premium-content__image img {
        min-height: 200px !important;
        height: 100% !important;
    }

    body.page-ecosystem .premium-content__copy,
    body.page-experience-centres .premium-content__copy,
    body.page-ecosystem .premium-editorial__content,
    body.page-experience-centres .premium-editorial__content {
        order: 2 !important;
        padding: 22px 18px 24px !important;
        width: 100% !important;
    }

    body.page-ecosystem :is(.premium-content__copy, .premium-editorial__content) h2,
    body.page-experience-centres :is(.premium-content__copy, .premium-editorial__content) h2 {
        max-width: 100% !important;
        font-size: clamp(23px, 6vw, 32px) !important;
        line-height: 1.1 !important;
        margin-bottom: 12px !important;
    }

    body.page-ecosystem :is(.premium-content__copy, .premium-editorial__content) p,
    body.page-experience-centres :is(.premium-content__copy, .premium-editorial__content) p {
        max-width: 100% !important;
        font-size: 14px !important;
        line-height: 1.55 !important;
    }

    body.page-ecosystem .premium-editorial__points,
    body.page-experience-centres .premium-editorial__points {
        grid-template-columns: 1fr !important;
        gap: 9px !important;
        margin-top: 18px !important;
    }

    body.page-ecosystem .premium-editorial__points li,
    body.page-experience-centres .premium-editorial__points li {
        min-height: 58px !important;
        padding: 12px 14px !important;
        border-radius: 12px !important;
        grid-template-columns: 30px 1fr !important;
        gap: 12px !important;
    }

    body.page-ecosystem .premium-editorial__points span,
    body.page-experience-centres .premium-editorial__points span {
        width: 30px !important;
        height: 30px !important;
        font-size: 9px !important;
    }

    body.page-ecosystem .premium-editorial__points p,
    body.page-experience-centres .premium-editorial__points p {
        font-size: 13px !important;
    }

    body.page-ecosystem .premium-editorial__prose p,
    body.page-experience-centres .premium-editorial__prose p {
        font-size: 14px !important;
        margin-top: 14px !important;
    }

    /* Flip order reset */
    body.page-ecosystem .premium-content--flip .premium-content__visual,
    body.page-experience-centres .premium-content--flip .premium-content__visual {
        order: -1 !important;
    }

    body.page-ecosystem .premium-content--flip .premium-content__copy,
    body.page-experience-centres .premium-content--flip .premium-content__copy {
        order: 2 !important;
    }
}

/* ─── STANDARD MOBILE (361px–430px) ─── */
@media (min-width: 361px) and (max-width: 430px) {
    body.page-ecosystem .premium-content-stack,
    body.page-experience-centres .premium-content-stack {
        gap: 18px !important;
        padding: 24px 0 36px !important;
    }

    body.page-ecosystem :is(.premium-content__grid, .premium-editorial),
    body.page-experience-centres :is(.premium-content__grid, .premium-editorial) {
        width: calc(100% - 20px) !important;
        max-width: 410px !important;
        grid-template-columns: 1fr !important;
        border-radius: 14px !important;
        margin-inline: auto !important;
        display: grid !important;
    }

    body.page-ecosystem .premium-content__visual,
    body.page-experience-centres .premium-content__visual,
    body.page-ecosystem .premium-editorial__visual,
    body.page-experience-centres .premium-editorial__visual {
        order: -1 !important;
        min-height: 180px !important;
        height: auto !important;
        position: static !important;
        top: auto !important;
    }

    body.page-ecosystem .premium-content__image,
    body.page-experience-centres .premium-content__image {
        min-height: 180px !important;
        height: 180px !important;
        aspect-ratio: 16 / 9 !important;
        border-radius: 14px 14px 0 0 !important;
    }

    body.page-ecosystem .premium-content__image img,
    body.page-experience-centres .premium-content__image img {
        min-height: 180px !important;
        height: 100% !important;
    }

    body.page-ecosystem .premium-content__copy,
    body.page-experience-centres .premium-content__copy,
    body.page-ecosystem .premium-editorial__content,
    body.page-experience-centres .premium-editorial__content {
        order: 2 !important;
        padding: 20px 16px 22px !important;
        width: 100% !important;
    }

    body.page-ecosystem :is(.premium-content__copy, .premium-editorial__content) h2,
    body.page-experience-centres :is(.premium-content__copy, .premium-editorial__content) h2 {
        max-width: 100% !important;
        font-size: clamp(22px, 6.5vw, 30px) !important;
        line-height: 1.1 !important;
        margin-bottom: 10px !important;
    }

    body.page-ecosystem :is(.premium-content__copy, .premium-editorial__content) p,
    body.page-experience-centres :is(.premium-content__copy, .premium-editorial__content) p {
        max-width: 100% !important;
        font-size: 13.5px !important;
        line-height: 1.52 !important;
    }

    body.page-ecosystem .premium-editorial__points,
    body.page-experience-centres .premium-editorial__points {
        grid-template-columns: 1fr !important;
        gap: 8px !important;
        margin-top: 16px !important;
    }

    body.page-ecosystem .premium-editorial__points li,
    body.page-experience-centres .premium-editorial__points li {
        min-height: 54px !important;
        padding: 11px 12px !important;
        border-radius: 11px !important;
        grid-template-columns: 28px 1fr !important;
        gap: 10px !important;
    }

    body.page-ecosystem .premium-editorial__points span,
    body.page-experience-centres .premium-editorial__points span {
        width: 28px !important;
        height: 28px !important;
        font-size: 9px !important;
    }

    body.page-ecosystem .premium-editorial__points p,
    body.page-experience-centres .premium-editorial__points p {
        font-size: 12.5px !important;
        line-height: 1.5 !important;
    }

    body.page-ecosystem .premium-editorial__prose p,
    body.page-experience-centres .premium-editorial__prose p {
        font-size: 13.5px !important;
        margin-top: 12px !important;
    }

    /* Flip order reset */
    body.page-ecosystem .premium-content--flip .premium-content__visual,
    body.page-experience-centres .premium-content--flip .premium-content__visual {
        order: -1 !important;
    }

    body.page-ecosystem .premium-content--flip .premium-content__copy,
    body.page-experience-centres .premium-content--flip .premium-content__copy {
        order: 2 !important;
    }
}

/* ─── SMALL MOBILE (max-width: 360px) ─── */
@media (max-width: 360px) {
    body.page-ecosystem .premium-content-stack,
    body.page-experience-centres .premium-content-stack {
        gap: 16px !important;
        padding: 20px 0 32px !important;
    }

    body.page-ecosystem :is(.premium-content__grid, .premium-editorial),
    body.page-experience-centres :is(.premium-content__grid, .premium-editorial) {
        width: calc(100% - 16px) !important;
        grid-template-columns: 1fr !important;
        border-radius: 12px !important;
        margin-inline: auto !important;
        display: grid !important;
    }

    body.page-ecosystem .premium-content__visual,
    body.page-experience-centres .premium-content__visual,
    body.page-ecosystem .premium-editorial__visual,
    body.page-experience-centres .premium-editorial__visual {
        order: -1 !important;
        min-height: 160px !important;
        height: auto !important;
        position: static !important;
        top: auto !important;
    }

    body.page-ecosystem .premium-content__image,
    body.page-experience-centres .premium-content__image {
        min-height: 160px !important;
        height: 160px !important;
        aspect-ratio: 16 / 9 !important;
        border-radius: 12px 12px 0 0 !important;
    }

    body.page-ecosystem .premium-content__image img,
    body.page-experience-centres .premium-content__image img {
        min-height: 160px !important;
        height: 100% !important;
    }

    body.page-ecosystem .premium-content__copy,
    body.page-experience-centres .premium-content__copy,
    body.page-ecosystem .premium-editorial__content,
    body.page-experience-centres .premium-editorial__content {
        order: 2 !important;
        padding: 16px 14px 18px !important;
        width: 100% !important;
    }

    body.page-ecosystem :is(.premium-content__copy, .premium-editorial__content) h2,
    body.page-experience-centres :is(.premium-content__copy, .premium-editorial__content) h2 {
        max-width: 100% !important;
        font-size: clamp(20px, 6.5vw, 26px) !important;
        line-height: 1.12 !important;
        margin-bottom: 8px !important;
    }

    body.page-ecosystem :is(.premium-content__copy, .premium-editorial__content) p,
    body.page-experience-centres :is(.premium-content__copy, .premium-editorial__content) p {
        max-width: 100% !important;
        font-size: 13px !important;
        line-height: 1.48 !important;
    }

    body.page-ecosystem .premium-editorial__points,
    body.page-experience-centres .premium-editorial__points {
        grid-template-columns: 1fr !important;
        gap: 7px !important;
        margin-top: 14px !important;
    }

    body.page-ecosystem .premium-editorial__points li,
    body.page-experience-centres .premium-editorial__points li {
        min-height: 48px !important;
        padding: 10px 11px !important;
        border-radius: 10px !important;
        grid-template-columns: 26px 1fr !important;
        gap: 9px !important;
    }

    body.page-ecosystem .premium-editorial__points span,
    body.page-experience-centres .premium-editorial__points span {
        width: 26px !important;
        height: 26px !important;
        font-size: 8px !important;
    }

    body.page-ecosystem .premium-editorial__points p,
    body.page-experience-centres .premium-editorial__points p {
        font-size: 12px !important;
        line-height: 1.45 !important;
    }

    body.page-ecosystem .premium-editorial__prose p,
    body.page-experience-centres .premium-editorial__prose p {
        font-size: 13px !important;
        margin-top: 10px !important;
    }

    /* Flip order reset */
    body.page-ecosystem .premium-content--flip .premium-content__visual,
    body.page-experience-centres .premium-content--flip .premium-content__visual {
        order: -1 !important;
    }

    body.page-ecosystem .premium-content--flip .premium-content__copy,
    body.page-experience-centres .premium-content--flip .premium-content__copy {
        order: 2 !important;
    }
}

/* ─── GLOBAL FIXES FOR MOBILE/TABLET ONLY (max-width: 1024px) ─── */
@media (max-width: 1024px) {
    /* Ensure all images are responsive */
    body.page-ecosystem .premium-content__image img,
    body.page-experience-centres .premium-content__image img {
        max-width: 100% !important;
    }

    /* Content copy text should never overflow */
    body.page-ecosystem .premium-content__copy,
    body.page-experience-centres .premium-content__copy,
    body.page-ecosystem .premium-editorial__content,
    body.page-experience-centres .premium-editorial__content {
        min-width: 0 !important;
        overflow: hidden !important;
        word-wrap: break-word !important;
        overflow-wrap: break-word !important;
    }

    body.page-ecosystem .premium-editorial__heading h2,
    body.page-experience-centres .premium-editorial__heading h2 {
        word-wrap: break-word !important;
        overflow-wrap: break-word !important;
    }

    /* Fix: prevent horizontal scroll on any viewport */
    body.page-ecosystem,
    body.page-experience-centres {
        overflow-x: hidden !important;
    }

    body.page-ecosystem main,
    body.page-experience-centres main {
        overflow-x: hidden !important;
    }
}

/* ─── GLOBAL FIX FOR IMAGE CORNER OVERFLOW BUG (ALL DEVICES) ─── */
/* Fixes the issue where image corners stick out of the container during page load animations */
body.page-ecosystem :is(.premium-content__grid, .premium-editorial),
body.page-experience-centres :is(.premium-content__grid, .premium-editorial) {
    isolation: isolate !important;
    transform: translateZ(0) !important;
    -webkit-mask-image: -webkit-radial-gradient(white, black) !important;
    mask-image: radial-gradient(white, black) !important;
}

body.page-ecosystem :is(.premium-content__image, .premium-editorial__visual img),
body.page-experience-centres :is(.premium-content__image, .premium-editorial__visual img) {
    border-radius: 0 !important;
}

/* ─── GLOBAL FIX FOR BRAND MARQUEE SIZE ─── */
body section#trusted.tl-brand-v2,
body main section#trusted.tl-brand-v2,
body section#about-trusted.tl-brand-v2,
body main section#about-trusted.tl-brand-v2,
body section#premium-trusted.tl-brand-v2,
body main section#premium-trusted.tl-brand-v2,
body section.tl-brand-v2,
body main section.tl-brand-v2 {
    padding-top: clamp(20px, 2.5vw, 30px) !important;
    padding-bottom: clamp(10px, 2vw, 20px) !important;
}

body section#trusted.tl-brand-v2 .tl-brand-v2__viewport,
body main section#trusted.tl-brand-v2 .tl-brand-v2__viewport,
body section#about-trusted.tl-brand-v2 .tl-brand-v2__viewport,
body main section#about-trusted.tl-brand-v2 .tl-brand-v2__viewport,
body section#premium-trusted.tl-brand-v2 .tl-brand-v2__viewport,
body main section#premium-trusted.tl-brand-v2 .tl-brand-v2__viewport,
body section.tl-brand-v2 .tl-brand-v2__viewport,
body main section.tl-brand-v2 .tl-brand-v2__viewport {
    height: auto !important;
    min-height: 0 !important;
    padding-top: 15px !important;
    padding-bottom: 50px !important;
}

body section#trusted.tl-brand-v2 .tl-brand-v2__track,
body main section#trusted.tl-brand-v2 .tl-brand-v2__track,
body section#about-trusted.tl-brand-v2 .tl-brand-v2__track,
body main section#about-trusted.tl-brand-v2 .tl-brand-v2__track,
body section#premium-trusted.tl-brand-v2 .tl-brand-v2__track,
body main section#premium-trusted.tl-brand-v2 .tl-brand-v2__track,
body section.tl-brand-v2 .tl-brand-v2__track,
body main section.tl-brand-v2 .tl-brand-v2__track,
body section#trusted.tl-brand-v2 .tl-brand-v2__group,
body main section#trusted.tl-brand-v2 .tl-brand-v2__group,
body section#about-trusted.tl-brand-v2 .tl-brand-v2__group,
body main section#about-trusted.tl-brand-v2 .tl-brand-v2__group,
body section#premium-trusted.tl-brand-v2 .tl-brand-v2__group,
body main section#premium-trusted.tl-brand-v2 .tl-brand-v2__group,
body section.tl-brand-v2 .tl-brand-v2__group,
body main section.tl-brand-v2 .tl-brand-v2__group {
    gap: clamp(16px, 2.5vw, 32px) !important;
}

body section#trusted.tl-brand-v2 .tl-brand-v2__tile,
body main section#trusted.tl-brand-v2 .tl-brand-v2__tile,
body section#about-trusted.tl-brand-v2 .tl-brand-v2__tile,
body main section#about-trusted.tl-brand-v2 .tl-brand-v2__tile,
body section#premium-trusted.tl-brand-v2 .tl-brand-v2__tile,
body main section#premium-trusted.tl-brand-v2 .tl-brand-v2__tile,
body section.tl-brand-v2 .tl-brand-v2__tile,
body main section.tl-brand-v2 .tl-brand-v2__tile {
    min-height: clamp(60px, 5vw, 76px) !important;
    height: clamp(60px, 5vw, 76px) !important;
    padding: 6px 12px !important;
    border-radius: 12px !important;
    flex: 0 0 clamp(140px, 11vw, 190px) !important;
    width: clamp(140px, 11vw, 190px) !important;
    overflow: hidden !important;
}

body section#trusted.tl-brand-v2 .tl-brand-v2__logo,
body main section#trusted.tl-brand-v2 .tl-brand-v2__logo,
body section#about-trusted.tl-brand-v2 .tl-brand-v2__logo,
body main section#about-trusted.tl-brand-v2 .tl-brand-v2__logo,
body section#premium-trusted.tl-brand-v2 .tl-brand-v2__logo,
body main section#premium-trusted.tl-brand-v2 .tl-brand-v2__logo,
body section.tl-brand-v2 .tl-brand-v2__logo,
body main section.tl-brand-v2 .tl-brand-v2__logo {
    max-height: 58px !important;
    max-width: 100% !important;
    transform: scale(1.9) !important; /* Significantly zoom in to bypass white space in JPEGs */
    object-fit: contain !important;
}

@media (max-width: 700px) {
    body section#trusted.tl-brand-v2 .tl-brand-v2__track,
    body main section#trusted.tl-brand-v2 .tl-brand-v2__track,
    body section#about-trusted.tl-brand-v2 .tl-brand-v2__track,
    body main section#about-trusted.tl-brand-v2 .tl-brand-v2__track,
    body section#premium-trusted.tl-brand-v2 .tl-brand-v2__track,
    body main section#premium-trusted.tl-brand-v2 .tl-brand-v2__track,
    body section.tl-brand-v2 .tl-brand-v2__track,
    body main section.tl-brand-v2 .tl-brand-v2__track,
    body section#trusted.tl-brand-v2 .tl-brand-v2__group,
    body main section#trusted.tl-brand-v2 .tl-brand-v2__group,
    body section#about-trusted.tl-brand-v2 .tl-brand-v2__group,
    body main section#about-trusted.tl-brand-v2 .tl-brand-v2__group,
    body section#premium-trusted.tl-brand-v2 .tl-brand-v2__group,
    body main section#premium-trusted.tl-brand-v2 .tl-brand-v2__group,
    body section.tl-brand-v2 .tl-brand-v2__group,
    body main section.tl-brand-v2 .tl-brand-v2__group {
        gap: 16px !important;
    }

    body section#trusted.tl-brand-v2 .tl-brand-v2__tile,
    body main section#trusted.tl-brand-v2 .tl-brand-v2__tile,
    body section#about-trusted.tl-brand-v2 .tl-brand-v2__tile,
    body main section#about-trusted.tl-brand-v2 .tl-brand-v2__tile,
    body section#premium-trusted.tl-brand-v2 .tl-brand-v2__tile,
    body main section#premium-trusted.tl-brand-v2 .tl-brand-v2__tile,
    body section.tl-brand-v2 .tl-brand-v2__tile,
    body main section.tl-brand-v2 .tl-brand-v2__tile {
        min-height: 52px !important;
        height: 52px !important;
        padding: 4px 10px !important;
        flex-basis: 130px !important;
        width: 130px !important;
        border-radius: 8px !important;
        overflow: hidden !important;
    }

    body section#trusted.tl-brand-v2 .tl-brand-v2__logo,
    body main section#trusted.tl-brand-v2 .tl-brand-v2__logo,
    body section#about-trusted.tl-brand-v2 .tl-brand-v2__logo,
    body main section#about-trusted.tl-brand-v2 .tl-brand-v2__logo,
    body section#premium-trusted.tl-brand-v2 .tl-brand-v2__logo,
    body main section#premium-trusted.tl-brand-v2 .tl-brand-v2__logo,
    body section.tl-brand-v2 .tl-brand-v2__logo,
    body main section.tl-brand-v2 .tl-brand-v2__logo {
        max-height: 42px !important;
        transform: scale(1.9) !important;
    }
}
/* --- FIX CITY DIALOG MODAL COLORS --- */
body.home-page #connected-ecosystem .city-dialog__panel time[data-city-date],
body.home-page #connected-ecosystem .city-dialog__panel .city-dialog__lead,
body.home-page #connected-ecosystem .city-dialog__panel h4,
body.home-page #connected-ecosystem .city-dialog__panel .city-dialog__grid li {
    color: #e2e8f0 !important;
}

/* ─── FIX FOUNDER IMAGE BLENDING ─── */
.about-page .about-founder-card__portrait {
    -webkit-mask-image: radial-gradient(ellipse 75% 75% at 50% 50%, black 50%, transparent 100%) !important;
    mask-image: radial-gradient(ellipse 75% 75% at 50% 50%, black 50%, transparent 100%) !important;
}

/* ─── FIX RUBIKS CTA ALIGNMENT ─── */
.site-rubiks-cta__visual,
.premium-cta__visual {
    transform: translateY(-160px) !important;
}
@media (max-width: 760px) {
    .site-rubiks-cta__visual,
    .premium-cta__visual {
        transform: translateY(-100px) !important;
    }
}

/* ─── FIX GLOBAL HEADING SIZES & RESPONSIVENESS ─── */
body :is(h1, h2, h3, h4) {
    white-space: normal !important;
    word-break: break-word !important;
}

@media (max-width: 1024px) {
    body :is(.about-page, .premium-page, .home-page, .cases-page) h1 {
        font-size: clamp(28px, 6vw, 42px) !important;
    }
    body :is(.about-page, .premium-page, .home-page, .cases-page) h2 {
        font-size: clamp(24px, 5vw, 36px) !important;
    }
}

@media (max-width: 760px) {
    body :is(.about-page, .premium-page, .home-page, .cases-page) h1 {
        font-size: clamp(24px, 8vw, 32px) !important;
    }
    body :is(.about-page, .premium-page, .home-page, .cases-page) h2 {
        font-size: clamp(20px, 7vw, 26px) !important;
    }
}

/* --- FIX CONTAINER WIDTH & IMAGE JUMP ON ECOSYSTEM/EXPERIENCE --- */
@media (min-width: 1025px) {
    body.page-ecosystem :is(.premium-content__grid, .premium-editorial),
    body.page-experience-centres :is(.premium-content__grid, .premium-editorial),
    #page-content > .premium-content > .shell.premium-content__grid,
    #page-content > .premium-content .shell.premium-editorial {
        width: min(calc(100% - 40px), 1200px) !important;
        max-width: 1200px !important;
        margin-inline: auto !important;
    }

    body.page-ecosystem :is(.premium-content__visual, .premium-editorial__visual),
    body.page-experience-centres :is(.premium-content__visual, .premium-editorial__visual) {
        display: flex !important;
        flex-direction: column !important;
        height: auto !important;
        align-self: stretch !important;
    }

    body.page-ecosystem .premium-content__image,
    body.page-experience-centres .premium-content__image {
        display: flex !important;
        flex: 1 1 auto !important;
        position: relative !important;
        width: 100% !important;
        min-height: 0 !important;
        border-radius: 0 24px 24px 0 !important; /* Match card radius for right side */
        overflow: hidden !important;
    }

    body.page-ecosystem :is(.premium-content__image, .premium-editorial__visual) img,
    body.page-experience-centres :is(.premium-content__image, .premium-editorial__visual) img {
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
        display: block !important;
    }
}


/* --- FIX PREMIUM POINTS MAX 2 LINES --- */
.premium-points li,
.premium-editorial__points li {
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    font-size: 13px !important;
    line-height: 1.45 !important;
    padding-top: 14px !important;
    padding-bottom: 14px !important;
}


/* ─── FIX ECOSYSTEM & EXPERIENCE HERO MEDIA VISIBILITY ─── */
body.premium-page.page-ecosystem .premium-hero .premium-hero__media,
body.premium-page.page-experience-centres .premium-hero .premium-hero__media {
    display: block !important;
    opacity: 1 !important;
    mix-blend-mode: normal !important;
    z-index: 0 !important;
}
body.premium-page.page-ecosystem .premium-hero .premium-hero__media img,
body.premium-page.page-experience-centres .premium-hero .premium-hero__media img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    opacity: 1 !important;
}