:root {
    --fBenton:  'BentonSans', 'Helvetica Neue', Helvetica, sans-serif;
    --fGuardian: 'Guardian Egyptian Web', serif;
    --Amex-Dark-Gray: #333;
    --Amex-Dark-Blue: #00175A;
    --Amex-Blue: #006FCF;
    --Amex-Blue-Tint-10: #F1F3F5;
    --Amex-Gray-100: #D9D9D9;
}

.subnav {
    position: relative;
}

.nowrap {
    white-space: nowrap;
}

section {
    width: initial;
    max-width: initial;
}

body {
    background: #fff;
}

body {
    font-family: var(--fBenton);
}
p {
    font-family: var(--fBenton);
    font-size: calc(1.8rem * .625);
    font-style: normal;
    font-weight: 400;
    line-height: calc(2.8rem * .625);
    color: var(--Amex-Dark-Gray);
}

p:last-of-type {
    margin-bottom: 0;
}

/* Accessibility */
[data-fouc] {
    opacity: 0;
}

.sr-only:not(:focus):not(:active) {
    clip: rect(0 0 0 0); 
    clip-path: inset(50%);
    height: 1px;
    overflow: hidden;
    position: absolute;
    white-space: nowrap; 
    width: 1px;
}

@media (prefers-reduced-motion: reduce) {
    [data-fouc] {
        opacity: 1;
    }
}

/* Utilities */
.relative { position: relative; }

.py-lg { padding-block: calc(6rem * .625); }

.pt-lg { padding-top: calc(6rem * .625); }

.py-md { padding-block: calc(4rem * .625); }

.my-lg { margin-block: calc(6rem * .625); }     

.my-30 { margin-block: calc(3rem * .625); }

.mb-lg { margin-bottom: calc(6rem * .625); }

.c-amex-blue { color: var(--Amex-Blue); }
.c-amex-dark-blue { color: var(--Amex-Dark-Blue); }

.bg-amex-dark-blue { background: var(--Amex-Dark-Blue); }
.bg-amex-blue { background: var(--Amex-Blue); }

.bg-bar-2 { background: #003886; }
.bg-bar-3 { background: #0059B2; }

.bg-amex-blue-08 { background: #ebf4fb; }

.bg-amex-blue-tint-10 { background: var(--Amex-Blue-Tint-10); }

.t-bold { font-weight: 700; }

.t-med { font-weight: 500; }

.t-center { text-align: center; }

@media (max-width: 767px) {
    .py-lg { padding-block: calc(4rem * .625) }
    .pt-lg { padding-top: calc(4rem * .625); }
    .py-md { padding-block: calc(2.5rem * .625); }
    .my-lg { margin-block: calc(4rem * .625); }
    .mb-lg { margin-bottom: calc(4rem * .625); }
}


.t-center {
    text-align: center;
}

@media (max-width: 767px) {
    .py-lg { padding-block: calc(4rem * .625); }
    .py-md { padding-block: calc(2.5rem * .625); }
    .my-lg { margin-block: calc(4rem * .625); }
    .mb-lg { margin-bottom: calc(4rem * .625); }
}



/* Typography */
h1, h2, h3, h4, h5 {
    margin: 0;
    padding: 0;
    border: 0;
}

h2 {
    font-family: var(--fBenton);
    font-size: calc(3rem * .625);
    font-style: normal;
    font-weight: 500;
    line-height: calc(3.8rem * .625);
    margin-bottom: calc(3rem * .625);
}

@media (max-width: 767px) {
    h2 {
        font-size: calc(2.4rem * .625);
        line-height: calc(3rem * .625);
    }
}

h3,
.h3 {
    font-size: calc(2.4rem * .625);
    line-height: calc(3.2rem * .625);
    font-weight: 500;
    margin-bottom: calc(2rem * .625);
}

@media (max-width: 767px) {
    h3,
    .h3 {
        font-size: calc(2rem * .625);
        line-height: calc(2.6rem * .625);
        margin-bottom: calc(1.5rem * .625);
    }
}

h4 {
    font-size: calc(2rem * .625);
    font-style: normal;
    font-weight: 500;
    line-height: calc(2.8rem * .625);
    border: initial;
}

@media (max-width: 767px) {
    h4 {
        font-size: calc(1.6rem * .625);
        font-style: normal;
        font-weight: 500;
        line-height: calc(2.2rem * .625);
    }
}

.data-h1 {
    font-family: var(--fBenton);
    font-size: calc(2.4rem * .625);
    font-style: normal;
    font-weight: 400;
    line-height: calc(3.2rem * .625);
    margin-bottom: calc(3rem * .625);
}

.data-h2,
.data-h1-sm {
    font-size: calc(2rem * .625);
    line-height: calc(2.7rem * .625);
    font-weight: 400;
}

@media (max-width: 1079px) {
    .data-h1,
    .data-h1-sm {
        font-size: calc(2rem * .625);
        line-height: calc(2.6rem * .625);
    }

    .data-h2 {
        font-size: calc(1.6rem * .625);
        line-height: calc(2.2rem * .625);
    }

}

/* Containers */
.container {
    margin-inline: auto;
    padding-inline: calc(2rem * .625);
    width: 100%;
}

    .container--narrow {
        max-width: 740px;
    }

    .container--lg {
        max-width: 1080px;
    }

    .container--xl {
        /* max-width: 1140px;
        padding-inline: calc(2rem * .625); */
        max-width: 1440px;
        padding-inline: calc(16rem * .625);
    }

    .container--wide-sm {
        max-width: 1240px;
    }

    .container--wide {
        max-width: 1480px;
    }

    /* @media (min-width: 1440px) {
        .container--xl {
            max-width: 1240px;
        }
    } */
    @media (max-width: 1079px) {
        .container--xl {
            padding-inline: 15%;
        }
    }

    @media (max-width: 991px) {
        .container--xl {
            padding-inline: calc(2rem * .625);
            max-width: 740px;
        }
    }

    .container--px-0 {
        padding-inline: 0;
    }

/* Component Share Button */
.c-share-button {
    position: absolute;
    top: 0;
    padding: 0;
    right: calc(2rem * .625);
    cursor: pointer;
    border: none;
    display: flex;
    align-items: center;
    gap: calc(0.6rem * .625);
    background: none;
}

.c-share-button .link-copied {
    opacity: 0;
    visibility: hidden;
    transition: all 0.2s ease-in;
    font-size: calc(1.2rem * .625);
}

.c-share-button .link-copied.show {
    opacity: 1;
    visibility: visible;
    transition: all 0.2s ease-in;
}


@media (max-width: 991px) {
    .c-share-button {
        position: relative;
        right: initial;
        margin-bottom: 0;
        display: flex;
        margin-left: auto;
        
    }
}

/* Component HR */
.c-hr {
    border: 0;
    height: 1px;
    background: #CDD1DD;
    margin-block: calc(4rem * .625);
}

@media (max-width: 767px) {
    .c-hr {
        margin-block: calc(2rem * .625);
    }
}

/* Component Blockquote */
.c-blockquote {
    display: flex;
    flex-flow: column;
    gap: calc(2rem * .625);
    position: relative;
}

    .c-blockquote__quote-wrapper {
        position: absolute;
        top: 0;
        left: 0;
        width: 24px;
        height: 16px;
    }

    .c-blockquote p {
        margin: 0;
        text-indent: 34px;
        font-size: calc(2.2rem * .625);
        line-height: calc(3.4rem * .625);
    }

    .c-blockquote__footer {
        display: grid;
    }

   .c-blockquote__author {
        font-size: calc(1.8rem * .625);
        line-height: calc(2.6rem * .625);
        font-weight: 500;
   }

   .c-blockquote__title {
        font-size: calc(1.6rem * .625);
        line-height: calc(2.4rem * .625);
        font-weight: 400;
   }

/* Section Hero */
.s-hero {
    width: 100%;
    height: 72vh;
    background-image: url(../img/gtt2025/hero-d.jpg?v=0);
    background-size: cover;
    background-position: center;
    color: #fff;
    display: flex;
    margin-top: -75px;
    padding-inline: calc(2rem * .625);
}

@media (max-width: 767px) {
    .s-hero {
        background-image: url(../img/gtt2025/hero-m.jpg?v=0);
    }
}

    .s-hero img {
        max-width: 100%;
    }

    .s-hero__content {
        display: flex;
        flex-flow: column;
        align-items: center;
        justify-content: center;
        max-width: 784px;
        margin-inline: auto;
        margin-top: 126px;
        margin-bottom: auto;
    }

    @media (max-width: 767px) {
        .s-hero__content {
            margin-top: 100px;
        }
    }

    .s-hero__logobox {
        background: rgba(11, 18, 18, 0.50);
        padding-inline: calc(2rem * .625);
        padding-block: calc(1.5rem * .625);
        margin-bottom: calc(4rem * .625);
    }

    @media (max-width: 767px) {
        .s-hero__logobox {
            margin-bottom: calc(2rem * .625);
        }
    }

    .s-hero h1 {
        text-align: center;
        text-shadow: 0px 2px 3px rgba(0, 0, 0, 0.15);
        font-family: var(--fBenton);
        font-size: calc(6rem * .625);
        font-style: normal;
        font-weight: 700;
        line-height: 116.667%;
        margin: initial;
        margin-bottom: calc(2rem * .625);
    }

    @media (max-width: 767px) {
        .s-hero h1 {
            font-size: calc(3.6rem * .625);
        }
    }

    .s-hero h2 {
        text-align: center;
        font-family: var(--fBenton);
        font-size: calc(2.4rem * .625);
        font-style: normal;
        font-weight: 500;
        line-height: 133.333%;
    }

    @media (max-width: 767px) {
        .s-hero h2 {
            font-size: calc(1.6rem * .625);
        }
    }

/* Section Header */
.s-header {
    border-bottom: 1px solid #DDD;
}
.s-header__nav {
    max-width: 1440px;
    padding-inline: calc(6rem * .625);
    padding-block: calc(3rem * .625);

    margin-inline: auto;
}

    .s-header__nav ul {
        display: grid;
        grid-template-columns: repeat(4, minmax(auto, 1fr));
        gap: calc(4rem * .625);
    }

    @media (max-width: 1199px) {
        

        .s-header__nav ul {
            grid-template-columns: repeat(2, minmax(auto, 1fr));
        }
    }

    @media (max-width: 767px) {
        .s-header__nav {
            padding-inline: calc(2rem * .625);
            padding-block: calc(2rem * .625);
        }
        .s-header__nav ul {
            grid-template-columns: repeat(1, minmax(auto, 1fr));
        }
    }

    .s-header__nav-link {
        display: flex;
        flex-flow: row;
        gap: calc(1.4rem * .625);
        align-items: center;
        font-size: clamp(1rem, 1.25vw + 0.25rem, 1.25rem);
        font-style: normal;
        font-weight: 500;
        line-height: 140%; 
        color: var(--Amex-Dark-Gray);
        text-decoration: none;
        height: 100%;
        transition: all 0.2s ease-in;
    }

    .s-header__nav-link:hover {
        text-decoration: underline;
        transition: all 0.2s ease-in;
    }

    .s-header__nav-link:hover .s-header__nav-img img {
        transform: scale(1.15);
        transition: all 0.2s ease-in;
    }

    .s-header__nav-img {
        width: 100%;
        height: 100%;
        max-width: 160px;
        overflow: hidden;
    }

    @media (max-width: 767px) {
        .s-header__nav-img {
            max-width: 90px;
            height: 100%;
        }
    }

    .s-header__nav-img img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        transition: all 0.2s ease-in;
    }

/* Component Mobile Nav */
.c-mobile-nav {
    display: grid;
    grid-template-columns: 1fr 42px;
    gap: calc(1.2rem * .625) calc(2rem * .625);
    background: #fff;
    position: sticky;
    top: 0;
    left: 0;
    right: 0;
    padding-top: calc(1.2rem * .625);
    z-index: 2;
}

    .c-mobile-nav__dropdown-header {
        display: grid;
        grid-template-columns: 1fr 42px;
        gap: calc(1.2rem * .625) calc(2rem * .625);
        background: #fff;
        padding-top: calc(1.2rem * .625);
        padding-bottom: calc(1.2rem * .625);
    }

    body.mobile-dropdown-open {
        overflow: hidden;
    }

    .c-mobile-nav__current {
        font-family: var(--fBenton);
        font-size: calc(1.4rem * .625);
        font-style: normal;
        font-weight: 500;
        line-height: calc(1.8rem * .625);
        grid-column: 1;
        padding-left: calc(2rem * .625);
        display: grid;
        perspective: 400px;
    }


    .c-mobile-nav__current .trend-name {
        grid-column: 1;
        grid-row: 1;
        visibility: hidden;
    }

    .c-mobile-nav__current .trend-name.active {
        visibility: visible;
    }

    .c-mobile-nav__menu-toggle {
        width: 22px;
        height: 22px;
        display: flex;
        align-items: center;
        justify-content: center;
        grid-column: 2;
        margin-right: calc(2rem * .625);
        border: none;
        background: none;
        padding: 0;
        cursor: pointer;
    }

    .c-mobile-nav__menu-icon {
        width: 22px;
    }
    .c-mobile-nav__close-icon {
        /* display: none; */
    }

    .c-mobile-nav__progress {
        position: relative;
        height: 5px;
        width: 100%;
        background: linear-gradient(180deg, #CDD1DD 0%, #E6E8EE 100%);
        display: grid;
        grid-column: 1 / -1;
        grid-row: 2;
    }

    .c-mobile-nav__progress-inner {
        background: linear-gradient(180deg, #0059B2 0%, #006FCF 100%);
        width: 0%;
    }
    .c-mobile-nav__dropdown {
        display: none;
        position: fixed;
        top: 0;
        width: 100%;
        background: #fff;
        z-index: 99;
    }

    .c-mobile-nav__dropdown.open {
        display: grid;
    }

    .c-mobile-nav__body {
        display: grid;
        gap: calc(3rem * .625);
        border-top: 1px solid #DDD;
        border-bottom: 1px solid #DDD;
        padding-top: calc(3rem * .625);
        padding-bottom: calc(3rem * .625);
        padding-inline: calc(2rem * .625);
    }

    .c-mobile-nav__dropdown-heading {
        color: #333;
        font-family: var(--fBenton);
        font-size: calc(1.8rem * .625);
        font-style: normal;
        font-weight: 700;
        line-height: calc(2.2rem * .625);
    }

    .c-mobile-nav__dropdown ul {
        display: grid;
        gap: calc(1.5rem * .625);
    }

    .c-mobile-nav__dropdown .s-header__nav-link:hover .s-header__nav-img img {
        transform: scale(1);
    }

    .c-mobile-nav__download {
        display: flex;
        height: 40px;
        padding: 8px 14px;
        justify-content: center;
        align-items: center;
        gap: 10px;
        align-self: stretch;
        border-radius: 4px;
        border: 1px solid var(--Amex-Blue);
        background: #FFF;
        color: var(--Amex-Blue);
        text-align: center;
        font-family: var(--fBenton);
        font-size: calc(1.3rem * .625);
        font-style: normal;
        font-weight: 400;
        line-height: calc(1.3rem * .625);
        letter-spacing: 0.3px;
        text-decoration: none;
    }

@media (min-width: 768px) {
    .c-mobile-nav {
        display: none;
    }
}

/* Section trend-intro */
.s-trend-intro h3:not(.h3) {
    font-size: calc(2rem * .625);
    font-style: normal;
    font-weight: 500;
    line-height: calc(2.8rem * .625);
    margin-bottom: calc(2rem * .625);
}

@media (max-width: 767px) {
    .s-trend-intro h3 {
        font-size: calc(1.6rem * .625);
        font-style: normal;
        font-weight: 500;
        line-height: calc(2.2rem * .625);
    }
}

.s-trend-intro__grid {
    max-width: 1440px;
    /* max-width: 1140px; */
    margin-inline: auto;
    display: grid;
    grid-template-columns: minmax(auto, 6fr) minmax(auto, 4fr);
    gap: calc(4rem * .625);
    padding-inline: 160px;
    color: var(--Amex-Dark-Blue);
}

    .s-trend-intro__grid .grid-item picture,
    .s-trend-intro__grid .grid-item img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
    .s-trend-intro__grid .grid-item--1 {
        display: grid;
        grid-column: 1 / span 1;
        grid-row: 1 / span 2;
    }

    @media (max-width: 1079px) {
        .s-trend-intro__grid .grid-item--1 {
            gap: calc(2rem * .625);
        }
    }

    .s-trend-intro__grid .grid-item--2,
    .s-trend-intro__grid .grid-item--3 {
        display: grid;
        grid-column: 2 / span 1;
        gap: calc(2rem * .625);
    }

    @media (max-width: 1079px) {
        .s-trend-intro__grid {
            grid-template-columns: 1fr;
            padding-inline: 15%;
        }

        .s-trend-intro__grid .grid-item {
            grid-column: 1 / -1;
        }
        .s-trend-intro__grid .grid-item--1 h4 {
            order: 1;
        }
    }

    @media (max-width: 991px) {
        .s-trend-intro__grid {
            padding-inline: calc(2rem * .625);
            max-width: 740px;
        }
    }

    @media (max-width: 767px) {
        .s-trend-intro__grid {
            padding-inline: calc(2rem * .625);
        }

        .s-trend-intro .data-h1 {
            margin-bottom: 0;
        }
    }

    .s-trend-intro__grid h4 {
        color: var(--Amex-Dark-Blue);
    }


/* Section The Trends */
.s-the-trends {
    position: relative;
}

/* Component Sidebar Nav */
.c-sidebar {
    position: sticky;
    top: 0px;
    left: 0;
    z-index: 2;
    padding-inline: 0;
}


    .c-sidebar__nav {
        width: 106px;
        padding: 6px;
        border-radius: 4px;
        border: 1px solid #EDEDED;
        background: #FFF;
        box-shadow: 0px 2px 6px 0px rgba(51, 51, 51, 0.15);
        float: left;
        margin-top: 60px;
        margin-left: 30px;
    }

    @media (max-width: 1079px) {
        .c-sidebar {
            padding-inline: calc(2rem * .625);
        }
        .c-sidebar__nav {
            margin-left: 0;
        }
    }

    @media (max-width: 991px) {
        .c-sidebar {
            display: none;
        }
    }

    .c-sidebar ul {
        display: flex;
        flex-flow: column;
        gap: calc(1rem * .625);
    }

    .c-sidebar__link,
    .c-sidebar__download {
        font-size: calc(1.3rem * .625);
        line-height: calc(1.9rem * .625);
        font-weight: 500;
        padding-inline: calc(0.6rem * .625);
        padding-block: calc(0.8rem * .625);
        display: block;
        text-decoration: none;
        color: var(--Amex-Dark-Gray);
        transition: all 0.2s ease-in;
    }

    .c-sidebar__link:hover,
    .c-sidebar__link:focus-visible {
        background: rgba(0, 111, 207, 0.08);
        transition: all 0.2s ease-in;
    }

    .c-sidebar__link.active {
        background: rgba(0, 111, 207, 0.08);
        transition: all 0.2s ease-in;
        color: var(--Amex-Dark-Blue);
    }

    .c-sidebar__download {
        color: #006FCF;
        font-size: calc(1.2rem * .625);
        line-height: calc(1.5rem * .625);
        display: flex;
        gap: calc(0.5rem * .625);
        padding-right: 3px;
    }

    .c-sidebar__download:hover,
    .c-sidebar__download:focus-visible {
        text-decoration: underline;
        transition: all 0.2s ease-in;
    }

/* Component Tint Box */
.c-tintbox {
    background: var(--Amex-Blue-Tint-10);
    padding: calc(3rem * .625);
}

@media (max-width: 767px) {
    .c-tintbox {
        padding: calc(2.5rem * .625);
        margin-inline: calc(-2rem * .625);
    }
}

/* Component Donut */
.c-donut {
    display: flex;
    flex-flow: row;
    align-items: center;
    gap: calc(2rem * .625);
    margin-bottom: calc(4rem * .625);
}

.c-donut:last-of-type {
    margin-bottom: 0;
}

.c-donut svg {
    width: 128px;
    margin: 10px;
    flex: 1 0 128px;
}


@media (max-width: 767px) {
    .c-donut {
        margin-bottom: calc(3rem * .625);
    }

    .c-donut svg {
        flex: 1 0 92px;
        width: 92px;
        margin: 0;
    }
}


/* Component Trend Hero */
.c-trend-hero {
    background-size: cover;
    background-position: top;
    height: 560px;
    display: flex;
    flex-flow:column;
    align-items: center;
    justify-content: center;
}

    .c-trend-hero--1 {
        background-image: url(../img/gtt2025/trend-hero-1-d.jpg?v=0);
    }

    .c-trend-hero--2 {
        background-image: url(../img/gtt2025/trend-hero-2-d.jpg?v=0);
    }

    .c-trend-hero--3 {
        background-image: url(../img/gtt2025/trend-hero-3-d.jpg?v=0);
    }

    .c-trend-hero--4 {
        background-image: url(../img/gtt2025/trend-hero-4-d.jpg?v=0);
    }

    .c-trend-hero h2 {
        color: #FFF;
        text-align: center;
        text-shadow: 0px 2px 3px rgba(0, 0, 0, 0.20);
        font-family: var(--fBenton);
        font-size: calc(7.2rem * .625);
        font-style: normal;
        font-weight: 700;
        line-height: calc(7.8rem * .625);
        padding-inline: calc(2.5rem * .625);
    }


    @media (max-width: 767px) {
        .c-trend-hero {
            height: 400px;
        }

        .c-trend-hero--1 {
            background-image: url(../img/gtt2025/trend-hero-1-m.jpg?v=0);
        }

        .c-trend-hero--2 {
            background-image: url(../img/gtt2025/trend-hero-2-m.jpg?v=0);
        }

        .c-trend-hero--3 {
            background-image: url(../img/gtt2025/trend-hero-3-m.jpg?v=0);
        }

        .c-trend-hero--4 {
            background-image: url(../img/gtt2025/trend-hero-4-m.jpg?v=0);
        }

        .c-trend-hero h2 {
            font-size: calc(4.8rem * .625);
            line-height: calc(5.4rem * .625);
        }
    }

/* Component Bar Charts */
.c-barcharts {
    display: grid;
    gap: calc(0.5rem * .625);
    margin-top: calc(2rem * .625);
}

    .c-barcharts__chart {
        display: flex;
        flex-flow: row;
    }

    .c-barcharts__img {
        flex: 0 0 100px;
        width: 100px;
        object-fit: cover;
    }

    .c-barcharts__bar {
        --max-percent: 100;
        --img-width: 100px;
        width: calc((100% - var(--img-width)) * (var(--bar-percent) / var(--max-percent)));
        color: #fff;
        padding-block: calc(2rem * .625);
        padding-inline: calc(1.5rem * .625);
        display: grid;
        grid-template-columns: 1fr min-content;
        gap: 5px 20px;
        align-items: center;
    }

    .c-barcharts__title {
        font-family: var(--fBenton);
        font-size: calc(2rem * .625);
        font-style: normal;
        font-weight: 500;
        line-height: calc(2.7rem * .625);
    }

    .c-barcharts__percent {
        font-family: var(--fBenton);
        font-size: calc(3rem * .625);
        font-style: normal;
        font-weight: 700;
        line-height: calc(3rem * .625);
        margin-left: auto;
        /* padding-left: calc(2rem * .625); */
    }

    .c-barcharts__desc {
        font-family: var(--fBenton);
        font-size: calc(1.3rem * .625);
        font-style: normal;
        font-weight: 500;
        line-height: calc(1.8rem * .625);
        grid-column: 1 / -1;
    }

    @media (max-width: 767px) {
        .c-barcharts__img {
            flex: 0 0 80px;
            width: 80px;
        }

        .c-barcharts__bar {
            --img-width: 80px;
            padding-inline: calc(1rem * .625);
            gap: 5px;
        }

        .c-barcharts__title {
            font-size: calc(1.2rem * .625);
            line-height: calc(1.4rem * .625);
        }

        .c-barcharts__percent {
            font-size: calc(1.8rem * .625);
            line-height: calc(2rem * .625);
        }
        .c-barcharts__desc {
            display: none;
        }
    }

/* Component Bar Chart Small */
.c-barchart-sm {
    display: grid;
    gap: calc(1rem * .625);
    margin-top: calc(2rem * .625);
    margin-bottom: calc(2rem * .625);
}

.c-barchart-sm:last-of-type {
    margin-bottom: calc(4rem * .625);
}

    .c-barchart-sm__header {
        display: flex;
        flex-flow: row;
        align-items: center;
        justify-content: space-between;
        gap: calc(1rem * .625);
    }

    .c-barchart-sm__percent {
        font-family: var(--fBenton);
        font-size: calc(2.4rem * .625);
        font-style: normal;
        font-weight: 700;
        line-height: calc(2.4rem * .625)
    }

    .c-barchart-sm__label {
        font-family: var(--fBenton);
        font-size: calc(1.4rem * .625);
        font-style: normal;
        font-weight: 500;
        line-height: calc(1.7rem * .625);
        color: #333;
    }

    .c-barchart-sm__bar {
        width: 100%;
        height: calc(3rem * .625);
        background: linear-gradient(180deg, #CDD1DD 0%, #E6E8EE 100%);
        display: grid;
        grid-template-columns: 1fr;
        grid-template-rows: 1fr;
    }

    .c-barchart-sm__inner {
        --bar-percent: 100%;
        width: var(--bar-percent);
    }

    .c-barchart-sm__inner--gradient-1 {
        background: linear-gradient(180deg, #00175A 0%, #003886 100%);
    }

    .c-barchart-sm__inner--gradient-2 {
        background: linear-gradient(180deg, #0059B2 0%, #006FCF 100%);
    }

/* Component Pull Stat */
.c-pull-stat {
    display: grid;
    grid-template-columns: 4fr 6fr;
    align-items: center;
    gap: calc(4rem * .625);
    margin-block: calc(6.5rem * .625);
    background: #ebf4fb;
    color: var(--Amex-Dark-Blue);
}

    .c-pull-stat__img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .c-pull-stat__txt {
        font-family: var(--fBenton);
        font-size: calc(3.2rem * .625);
        font-style: normal;
        font-weight: 400;
        line-height: calc(4.2rem * .625);
        padding-right: calc(6rem * .625);
        padding-block: calc(3rem * .625);
    }

    @media (max-width: 767px) {
        .c-pull-stat {
            grid-template-columns: 1fr;
            gap: 0;
            margin-inline: calc(-2rem * .625);
        }

        .c-pull-stat__txt {
            padding-inline: calc(2.5rem * .625);
            padding-block: calc(3rem * .625);
            font-size: calc(2.4rem * .625);
            line-height: calc(3.2rem * .625);
        }
    }

/* Component Related */
.c-related {
    display: grid;
    gap: calc(3rem * .625);
    grid-template-columns: 1fr 1fr;
    margin-top: calc(2rem * .625);
    margin-bottom: calc(8rem * .625);
}

    .c-related--1-item {
        grid-template-columns: max-content;
        justify-content: center;
        text-align: left;
    }

    .c-related__link {
        display: grid;
        grid-template-columns: 100px 1fr;
        gap: calc(2rem * .625);
        align-items: center;
        padding: calc(2rem * .625);
        position: relative;
        border: 1px solid var(--Amex-Gray-100);
        text-decoration: none;
        color: #333;
        font-size: calc(1.6rem * .625);
        font-style: normal;
        font-weight: 400;
        line-height: calc(2.4rem * .625);
        transition: all 0.2s ease-in;
    }
        .c-related__link:hover {
            text-decoration: underline;
            transition: all 0.2s ease-in;
        }
        .c-related__link:hover svg path {
            fill: #53565A;
            transition: all 0.2s ease-in;
        }
        @media (min-width: 768px) {
            .c-related__link:hover .c-related__img img {
                transform: scale(1.15);
                transition: all 0.2s ease-in;
            }
        }

    .c-related__img {
        overflow: clip;
        width: 100%;
    }
    .c-related__img img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        transform: scale(1);
        transition: all 0.2s ease-out;
    }

    .c-related__link svg {
        position: absolute;
        top: calc(1rem * .625);
        right: calc(1rem * .625);
        width: calc(1.4rem * .625);
        aspect-ratio: 1/1;
    }

    .c-related__link svg path  {
        transition: all 0.2s ease-in;
    }

    @media (max-width: 767px) {
        .c-related {
            grid-template-columns: 1fr;
            margin-inline: calc(-2rem * .625);
        }

        .c-related.slick-initialized .slick-slide {
            height: 100% !important;
            display: grid;
            margin: 0 5px;
        }

        .c-related .slick-track {
            height: 100%;
        }

        .c-related.slick-initialized .slick-list {
            margin: 0 0px;
        }
    }

    .past-reports {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 20px;
    }
    
        .past-report {
            width: 100%;
            max-width: 700px;
            margin-inline: auto;
            display: flex;
            align-items: center;
            background: #f8f8f8;
            border: 1px solid #e2e2e2;
            border-radius: 3px;
            padding: 5px;
            max-height: 240px;
        }
        
            .past-report img { width: 45%; height: 100%; object-fit: cover;}
            .past-report-text { width: 50%; margin-left: 4%; }
            .past-report-amex { font-weight: 500; color: #696F77; text-transform: uppercase; letter-spacing: 1px; margin-bottom: calc(1.5rem * .625); font-size: calc(1.1rem * .625);}
            .past-report-title { font-size: calc(2rem * .625); margin-bottom: 1.5em; font-weight: 500;}
            .past-report-cta { display: inline-block; background: #fff; text-decoration: none; color: var(--Amex-Blue); border-radius: 4px; border: 1px solid var(--Amex-Blue); padding: .75em 2em; margin-top: calc(2rem * .625);}

        @media (max-width: 991px) {
            .past-reports {
                grid-template-columns: 1fr;
            }


        }

        @media (max-width: 767px) {
            .past-report-amex {
                font-size: calc(1rem * .625);
                line-height: calc(1.1rem * .625);
                margin-bottom: calc(1.5rem * .625);
            }

            .past-report-cta {
                margin-top: calc(2rem * .625);
                margin-bottom: calc(0.8rem * .625);
                font-size: calc(1.3rem * .625);
            }
        }

/* Component Hover Cards */
.c-hover-cards {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: calc(0.2rem * .625);
    margin-block: calc(6.5rem * .625);
}

    .c-hover-cards__card {
        display: grid;
        grid-template-rows: 260px auto;
        overflow: hidden;
        position: relative;
    }

    .c-hover-cards__img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center;
        grid-column: 1;
        grid-row: 1;
    }

    .c-hover-cards__footer {
        display: flex;
        flex-flow: row;
        justify-content: space-between;
        gap: calc(1rem * .625);
        background: linear-gradient(180deg, #00175A 0%, #003886 100%);
        color: #fff;
        padding-block: calc(2rem * .625);
        padding-inline: calc(1.5rem * .625);
        grid-column: 1;
        grid-row: 2;
        cursor: pointer;
    }

    .c-hover-cards__footer:hover + .c-hover-cards__desc {
        /* display: flex;
        opacity: 1;
        height: 100%;
        transition: all 0.25s ease-in; 
        grid-column: 1 / -1;
        grid-row: 1 / -1; */
        transform: translateY(0);
        transition: 0.25s ease-in;
    }

    .c-hover-cards__footer span,
    .c-hover-cards__txt > span:first-of-type {
        font-size: calc(3rem * .625);
        line-height: calc(3rem * .625);
        font-weight: 700;
    }

    .c-hover-cards__footer img {
        margin-bottom: auto;
    }

    .c-hover-cards__desc {
        display: flex;
        flex-flow: row;
        gap: 10px;
        justify-content: space-between;
        padding: calc(1.5rem * .625);
        background: linear-gradient(180deg, #00175A 0%, #003886 100%);
        color: #fff;
        /* grid-column: 1; */
        /* grid-row: 2; */
        /* display: none; */
        /* opacity: 0; */
        /* height: 0; */
        pointer-events: none;
        transition: all 0.25s ease-in;
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        top: 0;
        transform: translateY(100%);
        transition: transform 0.25s ease-in;
    }

    .c-hover-cards__txt {
        font-family: var(--fBenton);
        font-size: calc(2.4rem * .625);
        font-style: normal;
        font-weight: 400;
        line-height: calc(3.2rem * .625);
        flex: 1 1 auto;
    }

    .c-hover-cards__txt span:not(:first-of-type) {
        font-weight: 500;
    }

    .c-hover-cards__desc img {
        margin-left: auto;
        margin-bottom: auto;
        width: 16px;
        flex: 0 0 16px;
    }

    @media (max-width: 1079px) {
        .c-hover-cards {
            grid-template-columns: 1fr;
        }

        .c-hover-cards__card {
            grid-template-rows: 227px auto;
            max-width: 440px;
            width: 100%;
            margin-inline: auto;
        }
    }


    @media (max-width: 767px) {
        .c-hover-cards {
            margin-block: calc(4rem * .625);
        }

        .c-hover-cards__footer span, 
        .c-hover-cards__txt > span:first-of-type {
            font-size: calc(2.4rem * .625);
            line-height: calc(2.4rem * .625);
        }

        .c-hover-cards__txt {
            font-size: calc(2rem * .625);
            line-height: calc(2.6rem * .625);
        }
    }

/* Component CTA Banner */
.c-cta-banner {
    background-image: url(../img/gtt2025/cta-banner.jpg?v=0);
    background-size: cover;
    background-position: bottom;
    margin-bottom: calc(6rem * .625);
    color: #fff;
}

    .c-cta-banner__container {
        display: grid;
        gap: calc(2rem * .625);
        padding-block: calc(8rem * .625);
    }

    .c-cta-banner h2 { 
        text-align: center;
        margin-bottom: 0;
    }

    .c-cta-banner a {
        border-radius: 4px;
        justify-content: center;
        display: flex;
        align-items: center;
        gap: 10px;
        flex-shrink: 0;
        padding-inline: calc(3.5rem * .625);
        padding-block: calc(1.5rem * .625);
        background: #fff;
        color: var(--Amex-Blue);
        font-size: calc(1.5rem * .625);
        font-style: normal;
        font-weight: 400;
        line-height: calc(1.5rem * .625);
        letter-spacing: 0.5px;
        text-decoration: none;
        margin-inline: auto;
        transition: all 0.2s ease-in;
    }

    .c-cta-banner a:hover {
        background: var(--Amex-Blue);
        color: #fff;
        transition: all 0.2s ease-in;
    }

@media (max-width: 767px) {
    .c-cta-banner {
        background-image: url(../img/gtt2025/cta-banner-m.jpg?v=0);
        margin-bottom: calc(4rem * .625);
        max-height: 340px;
        aspect-ratio: 1 / 1;
        display: flex;
        flex-flow: column;
        justify-content: center;
    }

    .c-cta-banner__container {
        padding-block: calc(5rem * .625);
        padding-inline: calc(2.5rem * .625);
    }
}


.s-methodology {
    margin-top: calc(6.5rem * .625);
}

@media (max-width: 767px) {
    .s-methodology {
        margin-top: calc(4rem * .625);
    }
}
.methodology { font-family: 'Helvetica Neue', Helvetica, sans-serif; font-size: calc(1.2rem * .625); line-height: 1.4em;}

.wst-footer {
    max-width: none;
}

.legal {
    max-width: 1240px;
    margin-inline: auto;
    margin-top: calc(8rem * .625);
    padding-inline: calc(2rem * .625);
}

@media (max-width: 767px) {
    .legal {
        margin-top: calc(4rem * .625);
    }
}