/* ==========================================
   Markets
========================================== */

.markets {

    background: #F5F5F5;

}

.markets .container {
    display: flex;
    flex-direction: column;
    gap: var(--space-section);
    padding-top: 80px;
}

/* ==========================================
   Market
========================================== */

.market {

    display: grid;

    grid-template-columns: repeat(2, 1fr);

    grid-template-areas:
        "image content";

    gap: var(--space-section);

    align-items: center;

}

.market--reverse {

    grid-template-areas:
        "content image";

}

/* ==========================================
   Areas
========================================== */

.market__media {

    grid-area: image;

}

.market__content {

    grid-area: content;

}

/* ==========================================
   Content
========================================== */

.market__content {

    display: flex;

    flex-direction: column;

    align-items: flex-start;

    gap: var(--space-lg);

}

.market__content p {

    max-width: 520px;

    line-height: 1.8;

}

.market__content .btn {

    margin-top: var(--space-sm);

}

/* ==========================================
   Images
========================================== */

.market__media {

    min-height: 420px;

    border-radius: var(--radius-card);

    background-size: cover;

    background-position: center;

    background-repeat: no-repeat;

}

/* ==========================================
   Background Images
========================================== */

.market__media--forex {

    background-image: url("../../../images/sections/MARKETS/forex.webp");

}

.market__media--indices {

    background-image: url("../../../images/sections/MARKETS/indices.webp");

}

.market__media--commodities {

    background-image: url("../../../images/sections/MARKETS/commodities.webp");

}

.market__media--shares {

    background-image: url("../../../images/sections/MARKETS/shares.webp");

}

.market__media--crypto {

    background-image: url("../../../images/sections/MARKETS/digital-assets.webp");

}

.market__content .section-header__title {
    max-width: 400px
}

.internal-hero__banner.\.markets__hero-banner {
    transform: scale(1.4) translateY(50px);
}