/**
 * Maritime LNG landing page — component-scoped styles.
 * LNG List Card (solutions-design-for-you): copied from jt-gnp-style.css.
 */

/* LNG List Card — desktop grid (jt-gnp-style.css lines 6–71) */
.JTgpRow3ContentRight {
    margin-left: 0px;
    max-width: 58.33333%;
    flex: auto;
}

.JTgpRow3ContentRight > div {
    margin: 0px 0px 0px -30%;
    width: 130%;

    margin: 0px 0px 0px -20%;
    width: 120%;
}

.JTgpRow3ContentRight > div > div {
    padding-right: 0px;
}

.JTgpRow3ContentRight > div > div > .card-list {
    justify-content: center;
}

.JTgpRow3ContentRight > div > div > .card-list .card-item {
    width: calc(33.33333%);

    width: 100%;
    max-width: 100%;

    padding-bottom: 35px;
    margin-bottom: 0px;
}

.JTgpRow3ContentRight > div > div > .card-list .card-item > .card-container,
.JTgpRow3ContentRight > div > div > .card-list .card-item .card-body {
    height: 100%;
}

.JTgpRow3ContentRight > div > div > .card-list .card-item:nth-child(2n+1) {
    padding-left: 1rem;
    padding-right: 0rem;
}

.JTgpRow3ContentRight > div > div > .card-list .card-item .card-content {
    font-size: 14px;
    line-height: 15px;
}

.JTgpRow3ContentRight > div > div > .card-list .card-item .card-body .card-title {
    font-size: 12px;
    line-height: 14px;
    margin-bottom: 30px;
}

.JTgpRow3ContentRight > div > div > .card-list .card-item .card-body .card-title::before {
    bottom: -13px;
}

.JTgpRow3ContentRight .card-wrapper {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.JTgpRow3ContentRight .card-wrapper .card-list {
    width: calc(33.33333%);
}

/* LNG List Card — mobile (jt-gnp-style.css lines 206–211, 303–322) */
@media screen and (max-width: 600px) {
    #solutions-design-for-you,
    #solutions-design-for-you-1 {
        top: auto !important;
        height: auto;
        padding-top: 135px;
        padding-bottom: 80px;
    }

    .JTgpRow3ContentRight {
        max-width: 100%;
    }

    .JTgpRow3ContentRight > div {
        margin: 0px 0px 0px 0%;
        width: 100%;
    }

    .JTgpRow3ContentRight .card-wrapper {
        margin-top: 30px;
    }

    .JTgpRow3ContentRight .card-wrapper .card-list {
        display: block;
        width: 100%;
    }
}

/* Gas maritime: use the full-width, non-rotated section decoration. */
#solutions-design-for-you::before {
    left: 0 !important;
    right: 0 !important;
    transform: none !important;
}