
.m5tl-page {
    --navy:#072f3d;
    --green:#08715c;
    --muted:#687f87;
    --line:#d7e4e0;
    --soft:#f6faf8;

    background:#fff;
}


.m5tl-shell {
    width:min(
        1180px,
        calc(100% - 48px)
    );

    margin:0 auto;
}


.m5tl-page h1,
.m5tl-page h2,
.m5tl-page h3 {
    color:var(--navy);
}


.m5tl-eyebrow,
.m5tl-index {
    margin:0 0 16px;

    color:#607b82;

    font-size:10px;

    font-weight:850;

    letter-spacing:.15em;
}


/* HERO */

.m5tl-hero {
    padding:87px 0 76px;

    background:
        linear-gradient(
            135deg,
            #fbfdfc,
            #edf6f2
        );
}


.m5tl-hero h1 {
    max-width:960px;

    margin:0;

    font-size:
        clamp(
            46px,
            5vw,
            69px
        );

    line-height:1;

    letter-spacing:-.045em;
}


.m5tl-lead {
    max-width:880px;

    margin:
        25px 0 0;

    color:var(--muted);

    font-size:14px;

    line-height:1.78;
}


/* GENERAL */

.m5tl-section {
    padding:67px 0;
}


.m5tl-soft {
    background:var(--soft);
}


.m5tl-two {
    display:grid;

    grid-template-columns:
        .8fr
        1.2fr;

    gap:90px;
}


.m5tl-section h2,
.m5tl-dark h2,
.m5tl-contact h2 {
    margin:0 0 30px;

    font-size:
        clamp(
            34px,
            3.6vw,
            50px
        );

    line-height:1.06;

    letter-spacing:-.04em;
}


.m5tl-subsection {
    display:grid;

    grid-template-columns:
        minmax(180px,.6fr)
        minmax(0,1.4fr);

    gap:55px;

    padding:
        25px 0;

    border-top:
        1px solid
        var(--line);
}


.m5tl-subsection:last-child {
    border-bottom:
        1px solid
        var(--line);
}


.m5tl-subsection h3 {
    margin:0;

    font-size:16px;

    line-height:1.35;
}


.m5tl-subsection p {
    margin:
        0 0 14px;

    color:var(--muted);

    font-size:13px;

    line-height:1.75;
}


.m5tl-subsection a {
    color:var(--green);
}


/* DARK */

.m5tl-dark {
    padding:
        70px 0 77px;

    background:var(--navy);
}


.m5tl-dark
.m5tl-eyebrow {
    color:#79aa9e;
}


.m5tl-dark h2,
.m5tl-dark h3 {
    color:#fff;
}


.m5tl-dark-grid {
    display:grid;

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

    margin-top:13px;

    border-top:
        1px solid
        rgba(255,255,255,.19);
}


.m5tl-dark-grid article {
    min-height:190px;

    padding:
        27px 30px 27px 0;

    border-right:
        1px solid
        rgba(255,255,255,.13);

    border-bottom:
        1px solid
        rgba(255,255,255,.13);
}


.m5tl-dark-grid h3 {
    margin:
        0 0 12px;

    font-size:15px;
}


.m5tl-dark-grid p,
.m5tl-dark-copy p {
    margin:
        0 0 17px;

    color:#bed0d2;

    font-size:13px;

    line-height:1.75;
}


.m5tl-dark
.m5tl-two h2 {
    margin:0;
}


/* CONTACT */

.m5tl-contact {
    padding:
        72px 0 78px;

    background:
        linear-gradient(
            135deg,
            #eef7f3,
            #fbfdfc
        );
}


.m5tl-contact h2 {
    margin:0;
}


.m5tl-contact-copy p {
    max-width:740px;

    margin:
        0 0 15px;

    color:var(--muted);

    font-size:14px;

    line-height:1.7;
}


.m5tl-contact-copy a {
    display:inline-block;

    color:var(--green);

    font-size:
        clamp(
            20px,
            2.6vw,
            33px
        );

    font-weight:750;

    line-height:1.2;

    text-decoration:none;

    word-break:break-word;
}


.m5tl-contact-copy a:hover {
    text-decoration:underline;
}


/* RESPONSIVE */

@media (max-width:900px) {

    .m5tl-two,
    .m5tl-subsection {
        grid-template-columns:1fr;

        gap:24px;
    }


    .m5tl-dark-grid {
        grid-template-columns:1fr;
    }

}


@media (max-width:620px) {

    .m5tl-shell {
        width:min(
            100% - 32px,
            1180px
        );
    }


    .m5tl-hero {
        padding:
            57px 0 51px;
    }


    .m5tl-hero h1 {
        font-size:40px;
    }


    .m5tl-section,
    .m5tl-dark,
    .m5tl-contact {
        padding:52px 0;
    }


    .m5tl-subsection {
        padding:
            20px 0;
    }

}

