/* =========================================================
   VIDA AI — INSIGHTS
   ========================================================= */


/* =========================================================
   TYPOGRAPHY LOCK — keeps Insights aligned with VIDA hierarchy
   ========================================================= */

.insights-page,
.insight-article-page {
    --insights-title-size: clamp(3rem, 5.8vw, 6.75rem);
    --insights-title-leading: 0.98;
    --insights-title-weight: 200;
    --insights-title-tracking: 0.04em;

    --insights-support-size: clamp(1rem, 1.35vw, 1.35rem);
    --insights-support-leading: 1.55;
    --insights-support-weight: 300;
    --insights-support-tracking: 0.015em;
}

/* =========================================================
   01. INTRODUCTION
   ========================================================= */

.insights-intro {
    background: #1e2d48;
    color: #ffffff;
}

.insights-intro__inner {
    width: min(100% - 80px, 1500px);
    margin: 0 auto;
    padding: 150px 0 160px;

    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(320px, 0.65fr);
    gap: 80px;
    align-items: center;
}

.insights-intro__title {
    max-width: 900px;
    margin: 0;

    font-size: var(--insights-title-size);
    line-height: var(--insights-title-leading);
    font-weight: var(--insights-title-weight);
    font-variation-settings: "wght" var(--insights-title-weight);
    letter-spacing: var(--insights-title-tracking);
    word-spacing: normal;
    text-transform: uppercase;
}

.insights-intro__statement {
    width: 100%;
    max-width: 460px;
    margin: 0;
    justify-self: end;

    font-size: var(--insights-support-size);
    line-height: var(--insights-support-leading);
    font-weight: var(--insights-support-weight);
    font-variation-settings: "wght" var(--insights-support-weight);
    letter-spacing: var(--insights-support-tracking);
    text-transform: uppercase;
}


/* =========================================================
   02. COLLECTION
   ========================================================= */

.insights-collection {
    background: #dbdde0;
    color: #1e2d48;
}

.insights-collection__inner {
    width: min(100% - 80px, 1500px);
    margin: 0 auto;
}

.insight-card {
    position: relative;

    display: grid;
    grid-template-columns: 1fr 1fr;
    width: 100%;
    min-height: 680px;

    border-bottom: 1px solid rgba(30, 45, 72, 0.22);
    overflow: hidden;

    cursor: pointer;
}

.insight-card:first-child {
    border-top: 1px solid rgba(30, 45, 72, 0.22);
}

.insight-card__link {
    display: flex;
    width: 100%;
    height: 100%;

    color: inherit;
    text-decoration: none;
}

.insight-card__link::after {
    content: "";

    position: absolute;
    inset: 0;

    z-index: 5;
}

.insight-card__content {
    display: flex;
    flex-direction: column;
    justify-content: center;

    width: 100%;
    min-height: 680px;
    padding: 90px 8vw;
}

.insight-card__title {
    max-width: 800px;
    margin: 0;

    font-size: clamp(2.4rem, 4vw, 4.7rem);
    line-height: 1.02;
    font-weight: 200;
    font-variation-settings: "wght" 200;
    letter-spacing: 0.035em;
    word-spacing: normal;
    text-transform: uppercase;
}

.insight-card__description {
    max-width: 420px;
    margin: 34px 0 0;

    font-size: var(--insights-support-size);
    line-height: var(--insights-support-leading);
    font-weight: var(--insights-support-weight);
    font-variation-settings: "wght" var(--insights-support-weight);
    letter-spacing: var(--insights-support-tracking);
    text-transform: uppercase;
}


/* ---------------------------------------------------------
   INDEX IMAGES
   --------------------------------------------------------- */

.insight-card__image {
    position: relative;
    width: 100%;
    height: 100%;
    min-height: 680px;
    margin: 0;
    overflow: hidden;
}

.insight-card__photo {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: transform 700ms ease;
}



@media (hover: hover) {
    .insight-card:hover .insight-card__photo {
        transform: scale(1.015);
    }
}


/* =========================================================
   03. PRINCIPLE
   ========================================================= */

.insights-principle {
    background: #ffffff;
    color: #1e2d48;
}

.insights-principle__inner {
    width: min(100% - 80px, 1500px);
    margin: 0 auto;
    padding: 140px 0;

    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(300px, 0.6fr);
    gap: 90px;
    align-items: center;
}

.insights-principle__statement {
    max-width: 800px;
    margin: 0;

    font-size: var(--insights-title-size);
    line-height: var(--insights-title-leading);
    font-weight: var(--insights-title-weight);
    font-variation-settings: "wght" var(--insights-title-weight);
    letter-spacing: var(--insights-title-tracking);
    word-spacing: 0.08em;
    text-transform: uppercase;
}

.insights-principle__support {
    width: 100%;
    max-width: 460px;
    margin: 0;

    font-size: var(--insights-support-size);
    line-height: var(--insights-support-leading);
    font-weight: var(--insights-support-weight);
    font-variation-settings: "wght" var(--insights-support-weight);
    letter-spacing: var(--insights-support-tracking);
    text-transform: uppercase;
}


/* =========================================================
   04. CTA
   ========================================================= */

.insights-cta {
    background: #dbdde0;
    color: #1e2d48;
}

.insights-cta__inner {
    width: min(100% - 80px, 1500px);
    margin: 0 auto;
    padding: 140px 0;

    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(300px, 0.6fr);
    gap: 90px;
    align-items: center;
}

.insights-cta__title {
    max-width: 800px;
    margin: 0;

    font-size: var(--insights-title-size);
    line-height: var(--insights-title-leading);
    font-weight: var(--insights-title-weight);
    font-variation-settings: "wght" var(--insights-title-weight);
    letter-spacing: var(--insights-title-tracking);
    word-spacing: normal;
    text-transform: uppercase;
}

.insights-cta__content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 30px;
}

.insights-cta__text {
    width: 100%;
    max-width: 460px;
    margin: 0;

    font-size: var(--insights-support-size);
    line-height: var(--insights-support-leading);
    font-weight: var(--insights-support-weight);
    font-variation-settings: "wght" var(--insights-support-weight);
    letter-spacing: var(--insights-support-tracking);
    text-transform: uppercase;
    text-align: left;
}

.insights-cta__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-width: 150px;
    padding: 14px 24px;

    border: 1px solid currentColor;

    color: inherit;
    background: transparent;
    text-decoration: none;

    font-size: 13px;
    font-weight: 400;
    line-height: 1;
    letter-spacing: 0.08em;
    text-transform: uppercase;

    transition:
        color 250ms ease,
        background-color 250ms ease,
        border-color 250ms ease,
        transform 250ms ease;
}

.insights-cta__button:hover,
.insights-cta__button:focus-visible {
    color: #ffffff;
    background: #1e2d48;
    border-color: #1e2d48;
    transform: translateY(-2px);
}


/* =========================================================
   05. INSIGHT ARTICLE
   ========================================================= */

.insight-article {
    color: #1e2d48;
}


/* ---------------------------------------------------------
   ARTICLE HERO
   --------------------------------------------------------- */

.insight-article__hero {
    background: #1e2d48;
    color: #ffffff;
}

.insight-article__hero-inner {
    width: min(100% - 80px, 1500px);
    margin: 0 auto;
    padding: 150px 0 160px;

    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(300px, 0.6fr);
    gap: 90px;
    align-items: center;
}

.insight-article__title {
    max-width: 900px;
    margin: 0;

    font-size: clamp(2.4rem, 4vw, 4.7rem);
    line-height: 1.02;
    font-weight: 200;
    font-variation-settings: "wght" 200;
    letter-spacing: 0.035em;
    word-spacing: normal;
    text-transform: uppercase;
}

.insight-article__lead {
    max-width: 420px;
    margin: 0;

    font-size: var(--insights-support-size);
    line-height: var(--insights-support-leading);
    font-weight: var(--insights-support-weight);
    font-variation-settings: "wght" var(--insights-support-weight);
    letter-spacing: var(--insights-support-tracking);
}

.insight-article__lead p {
    margin: 0 0 28px;
}

.insight-article__lead p:last-child {
    margin-bottom: 0;
}


/* ---------------------------------------------------------
   ARTICLE SECTIONS
   --------------------------------------------------------- */

.insight-article__section {
    background: #ffffff;
    color: #1e2d48;
}

.insight-article__section--grey {
    background: #dbdde0;
}

.insight-article__section-inner {
    width: min(100% - 80px, 1500px);
    margin: 0 auto;
    padding: 140px 0;

    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(300px, 0.6fr);
    gap: 90px;
    align-items: center;
}

.insight-article__section-title {
    max-width: 800px;
    margin: 0;

    font-size: clamp(2.4rem, 4vw, 4.7rem);
    line-height: 1.02;
    font-weight: 200;
    font-variation-settings: "wght" 200;
    letter-spacing: 0.035em;
    word-spacing: normal;
    text-transform: uppercase;
}

.insight-article__copy {
    max-width: 460px;
}

.insight-article__copy p {
    margin: 0 0 28px;

    font-size: var(--vida-body-size);
    line-height: var(--vida-body-leading);
    font-weight: var(--vida-body-weight);
    font-variation-settings: "wght" var(--vida-body-weight);
    letter-spacing: normal;
}

.insight-article__copy p:last-child {
    margin-bottom: 0;
}


/* Reverse on desktop: copy left, heading right */

.insight-article__section-inner--reverse .insight-article__copy {
    order: 1;
    justify-self: start;
}

.insight-article__section-inner--reverse .insight-article__section-title {
    order: 2;
    justify-self: start;
}


/* ---------------------------------------------------------
   ARTICLE STATEMENT
   --------------------------------------------------------- */

.insight-article__statement-section {
    background: #ffffff;
    color: #1e2d48;
}

.insight-article__statement-inner {
    width: min(100% - 80px, 1500px);
    margin: 0 auto;
    padding: 160px 0;

    display: flex;
    justify-content: center;
}

.insight-article__statement {
    max-width: 1200px;
    margin: 0 auto;

    font-size: var(--insights-title-size);
    line-height: var(--insights-title-leading);
    font-weight: var(--insights-title-weight);
    font-variation-settings: "wght" var(--insights-title-weight);
    letter-spacing: var(--insights-title-tracking);
    word-spacing: 0.08em;
    text-transform: uppercase;
    text-align: center;
}


/* ---------------------------------------------------------
   ARTICLE CTA OVERRIDE
   --------------------------------------------------------- */

.insight-article-page .insights-cta__title {
    font-size: var(--insights-title-size);
    line-height: var(--insights-title-leading);
    font-weight: var(--insights-title-weight);
    font-variation-settings: "wght" var(--insights-title-weight);
}


/* =========================================================
   06. INSIGHT TRIPTYCH
   ========================================================= */

.insight-triptych {
    width: 100%;
    background: #ffffff;
    overflow: hidden;
}

.insight-triptych__inner {
    width: 100vw;
    max-width: none;

    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    padding: 120px 0;

    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0;
}

.insight-triptych__item {
    position: relative;
    min-width: 0;
    margin: 0;
    padding: 0;
    overflow: hidden;
}

.insight-triptych__image {
    display: block;
    width: 100%;
    height: 100%;
    aspect-ratio: 4 / 5;
    object-fit: cover;
}



/* =========================================================
   07. INSIGHT EDITORIAL IMAGE
   ========================================================= */

.insight-editorial-image {
    width: 100%;
    background: #ffffff;
    overflow: hidden;
}

.insight-editorial-image__figure {
    position: relative;

    width: 100vw;
    margin: 0;
    margin-left: calc(50% - 50vw);

    overflow: hidden;
}

.insight-editorial-image__image {
    display: block;
    width: 100%;
    height: auto;
}


/* =========================================================
   INSIGHT NAVIGATION — FIXED CIRCLES
   ========================================================= */

.insight-pagination {
    position: fixed;
    top: 50%;
    left: 0;
    right: 0;
    z-index: 50;

    width: 100%;

    pointer-events: none;

    transform: translateY(-50%);
}

.insight-pagination__circle {
    position: absolute;
    top: 0;

    display: block;

    width: 35px;
    height: 35px;

    border: 0;
    border-radius: 50%;

    background: rgba(30, 45, 72, 0.35);

    pointer-events: auto;

    transform: translateY(-50%);

    transition:
        background-color 300ms ease,
        transform 350ms ease;
}


/* LEFT */

.insight-pagination__circle--left {
    left: clamp(20px, 3vw, 54px);
}

.insight-pagination__circle--left:hover,
.insight-pagination__circle--left:focus-visible {
    background: #1e2d48;

    transform:
        translateY(-50%)
        translateX(-6px);
}


/* RIGHT */

.insight-pagination__circle--right {
    right: clamp(20px, 3vw, 54px);
}

.insight-pagination__circle--right:hover,
.insight-pagination__circle--right:focus-visible {
    background: #1e2d48;

    transform:
        translateY(-50%)
        translateX(6px);
}
@media (max-width: 800px) {

    .insight-pagination__circle {
        width: 20px;
        height: 20px;
    }

    .insight-pagination__circle--left {
        left: 14px;
    }

    .insight-pagination__circle--right {
        right: 14px;
    }

}

/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 800px) {

    /* INTRODUCTION */

    .insights-intro__inner {
        width: calc(100% - 40px);
        margin: 0 auto;
        padding: 90px 0 100px;
        display: block;
    }

    .insights-intro__title {
        width: 100%;
        max-width: 100%;
        margin: 0;

        word-spacing: normal;

        overflow-wrap: normal;
        word-break: normal;
    }

    .insights-intro__statement {
        width: 100%;
        max-width: 100%;
        margin: 60px 0 0;

    }



    .insights-intro__title,
    .insights-principle__statement,
    .insights-cta__title,
    .insight-article__section-title,
    .insight-article__statement {
        font-size: clamp(2.35rem, 10vw, 4rem);
        line-height: 1.02;
    }

    .insight-card__title {
        font-size: clamp(2.15rem, 9vw, 3.6rem);
        line-height: 1.03;
    }

    .insights-intro__statement,
    .insight-card__description,
    .insights-principle__support,
    .insights-cta__text {
        font-size: clamp(0.95rem, 4vw, 1.12rem);
        line-height: 1.55;
    }

    /* COLLECTION */

    .insights-collection__inner {
        width: calc(100% - 40px);
    }

    .insight-card {
        grid-template-columns: 1fr;
        min-height: 0;
    }

    .insight-card__image {
        min-height: 0;
        height: auto;
        aspect-ratio: 4 / 3;
    }

    .insight-card__photo {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .insight-card__link {
        width: 100%;
        height: auto;
    }

    .insight-card__content {
        min-height: 0;
        padding: 80px 20px;
    }

    .insight-card__title {
        max-width: 100%;
        margin: 0;

        word-spacing: normal;
    }

    .insight-card__description {
        max-width: 100%;
        margin-top: 30px;

    }

    .insight-card__content--reverse .insight-card__title {
        order: 1;
    }

    .insight-card__content--reverse .insight-card__description {
        order: 2;
    }

    .insight-card:nth-of-type(2) .insight-card__image {
        order: 1;
    }

    .insight-card:nth-of-type(2) .insight-card__link {
        order: 2;
    }


    /* PRINCIPLE */

    .insights-principle__inner {
        width: calc(100% - 40px);
        margin: 0 auto;
        padding: 100px 0;

        grid-template-columns: 1fr;
        gap: 44px;
        align-items: start;
    }

    .insights-principle__statement {
        max-width: 100%;
        margin: 0;

        word-spacing: 0.06em;
    }

    .insights-principle__support {
        max-width: 100%;
        margin: 0;

    }


    /* CTA */

    .insights-cta__inner {
        width: calc(100% - 40px);
        margin: 0 auto;
        padding: 100px 0;

        grid-template-columns: 1fr;
        gap: 44px;
        align-items: start;
    }

    .insights-cta__title,
    .insight-article-page .insights-cta__title {
        max-width: 100%;
        margin: 0;

        word-spacing: normal;
    }

    .insights-cta__content {
        align-items: stretch;
        gap: 28px;
    }

    .insights-cta__text {
        max-width: 100%;
        margin: 0;

        text-align: left;
    }

    .insights-cta__button {
        align-self: center;
        min-width: 170px;
        padding: 14px 24px;
        text-align: center;
    }


    /* ARTICLE */

    .insight-article__hero-inner,
    .insight-article__section-inner,
    .insight-article__statement-inner {
        width: calc(100% - 40px);
    }

    .insight-article__hero-inner {
        padding: 90px 0 100px;
        grid-template-columns: 1fr;
        gap: 50px;
        align-items: start;
    }

    .insight-article__title {
        max-width: 100%;
        margin: 0;

        font-size: clamp(2.15rem, 9vw, 3.6rem);
        line-height: 1.03;
        letter-spacing: 0.035em;
        word-spacing: normal;
    }

    .insight-article__lead {
        max-width: 100%;
        margin: 0;

        font-size: clamp(0.95rem, 4vw, 1.12rem);
        line-height: 1.55;
        letter-spacing: var(--insights-support-tracking);
    }

    .insight-article__section-inner {
        padding: 90px 0;
        grid-template-columns: 1fr;
        gap: 42px;
        align-items: start;
    }

    .insight-article__section-title {
        max-width: 100%;
        margin: 0;

        word-spacing: normal;
    }

    .insight-article__copy {
        max-width: 100%;
    }

    .insight-article__copy p {
        font-size: 1.125rem;
        line-height: 1.65;
        letter-spacing: 0.05em;
    }

    .insight-article__section-inner--reverse .insight-article__section-title {
        order: 1;
    }

    .insight-article__section-inner--reverse .insight-article__copy {
        order: 2;
    }

    .insight-article__statement-inner {
        display: block;
        padding: 100px 0;
    }

    .insight-article__statement {
        max-width: 100%;
        margin: 0;

        word-spacing: 0.06em;
        text-align: left;
    }


    /* TRIPTYCH */

    .insight-triptych__inner {
        width: 100vw;
        margin-left: calc(50% - 50vw);
        margin-right: calc(50% - 50vw);
        padding: 70px 0;

        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 0;
    }


    /* EDITORIAL IMAGE */

}


/* =========================================================
   VERY SMALL MOBILE
   ========================================================= */

@media (max-width: 380px) {

    .insights-intro__title {
        font-size: clamp(1.9rem, 8.2vw, 2.35rem);
        letter-spacing: 0.045em;
    }
}


/* =========================================================
   ARTICLE TYPOGRAPHY + WATERMARK ALIGNMENT
   Uses VIDA global conventions; legacy watermark classes are
   supported so existing article PHP remains safe.
   ========================================================= */

.insight-article__lead {
    font-size: var(--insights-support-size);
    line-height: var(--insights-support-leading);
    font-weight: var(--insights-support-weight);
    font-variation-settings: "wght" var(--insights-support-weight);
    letter-spacing: var(--insights-support-tracking);
    text-transform: uppercase;
}

/* Image wrappers provide the positioning context only. */
.insight-card__image,
.insight-triptych__item,
.insight-editorial-image__figure {
    position: relative;
}

/* Global class + backwards-compatible article classes.
   Size/offset/opacity come from the global VIDA variables. */
.insight-card__image > .vida-ai-watermark,
.insight-triptych__item > .vida-ai-watermark,
.insight-editorial-image__figure > .vida-ai-watermark,
.insight-card__watermark,
.insight-triptych__watermark,
.insight-editorial-image__watermark {
    position: absolute;
    right: var(--ai-watermark-offset, 3%);
    bottom: var(--ai-watermark-offset, 3%);
    z-index: 5;
    display: block;
    width: var(--ai-watermark-width, clamp(110px, 8vw, 150px));
    max-width: var(--ai-watermark-width, clamp(110px, 8vw, 150px));
    height: auto;
    margin: 0;
    padding: 0;
    opacity: var(--ai-watermark-opacity, 0.82);
    object-fit: contain;
    transform: none;
    pointer-events: none;
    user-select: none;
}

@media (max-width: 760px) {
    .insight-card__image > .vida-ai-watermark,
    .insight-triptych__item > .vida-ai-watermark,
    .insight-editorial-image__figure > .vida-ai-watermark,
    .insight-card__watermark,
    .insight-triptych__watermark,
    .insight-editorial-image__watermark {
        width: var(--ai-watermark-width, 64px);
        max-width: var(--ai-watermark-width, 64px);
        right: var(--ai-watermark-offset, 4%);
        bottom: var(--ai-watermark-offset, 4%);
    }
}
/* =========================================================
   GLOBAL TYPOGRAPHY ALIGNMENT
   Insights follows VIDA typography from styles-clean.css
   ========================================================= */

.insight-card__title,
.insights-principle__statement,
.insights-cta__title,
.insight-article__section-title,
.insight-article__statement {
    font-size: var(--editorial-h2-size);
    line-height: 1.18;
    font-weight: 200;
    font-variation-settings: "wght" 200;
    letter-spacing: var(--editorial-line-tracking);
    word-spacing: normal;
    text-transform: uppercase;
}
/* =========================================================
   INSIGHTS — CONTEXTUAL LINKS
   ========================================================= */

.insight-article__copy a {
    color: inherit;
    text-decoration: none;
    text-transform: uppercase;
    font-weight: inherit;
    transition: opacity 0.2s ease;
}

.insight-article__copy a:hover,
.insight-article__copy a:focus-visible {
    opacity: 0.6;
}