/* Contact page. */
.contact-page {
    background: #f5f7fa
}

.contact-hero {
    padding: 58px 0 94px;
    color: #fff;
    background: linear-gradient(105deg, rgba(2, 20, 48, .98), rgba(3, 39, 82, .9)), url('../i/banner.jpg') center/cover
}

.contact-hero .breadcrumbs,
.contact-hero .breadcrumbs a {
    color: rgba(255, 255, 255, .75)
}

.contact-hero h1 {
    margin: 16px 0 10px;
    font-size: clamp(2.3rem, 5vw, 4rem)
}

.contact-hero>div>p:last-child {
    max-width: 620px;
    color: rgba(255, 255, 255, .82)
}

.contact-hero .section-kicker {
    color: var(--tsl-yellow, #ffc400)
}

.contact-shell {
    position: relative;
    margin-top: -48px;
    padding-bottom: 70px
}

.contact-info {
    display: grid;
    grid-template-columns: .85fr 1fr 1.5fr;
    overflow: hidden;
    border-radius: 13px;
    background: #fff;
    box-shadow: 0 12px 35px rgba(4, 29, 67, .13)
}

.contact-info>a,
.contact-info>div {
    display: flex;
    min-width: 0;
    padding: 25px 28px;
    align-items: center;
    gap: 16px
}

.contact-info__icon {
    display: grid;
    width: 58px;
    height: 58px;
    flex: 0 0 58px;
    place-items: center;
    border-radius: 15px;
    background: linear-gradient(145deg, var(--tsl-navy, #041d43), #082f67);
    box-shadow: 0 8px 18px rgba(4, 29, 67, .18)
}

.contact-info__icon img {
    width: 36px;
    height: 36px;
    object-fit: contain
}

.contact-info__body {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 4px
}

.contact-info>*+* {
    border-left: 1px solid #e5e9ef
}

.contact-info__body>span {
    color: var(--tsl-red, #d20b12);
    font-size: .72rem;
    font-weight: 800;
    text-transform: uppercase
}

.contact-info strong {
    color: var(--tsl-navy, #041d43);
    font-size: .9rem;
    overflow-wrap: anywhere;
        font-family: 'Be Vietnam Pro Bold';
}

.contact-info small {
    color: #748095
}

.contact-grid {
    display: grid;
    grid-template-columns: 1.2fr .8fr;
    gap: 24px;
    margin-top: 28px
}

.contact-content,
.contact-aside {
    padding: 34px;
    border-radius: 13px;
    background: #fff;
    box-shadow: 0 7px 24px rgba(4, 29, 67, .06)
}

.contact-content h2,
.contact-aside h2 {
    margin-top: 0;
    color: var(--tsl-navy, #041d43)
}

.contact-content input:not([type=submit]),
.contact-content textarea,
.contact-content select {
    width: 100%;
    min-height: 48px;
    padding: 11px 13px;
    border: 1px solid #d3dae4;
    border-radius: 7px;
    margin-bottom: 15px;
    font: inherit
}

.contact-content textarea {
    height: 130px
}

.contact-content input:focus,
.contact-content textarea:focus {
    outline: 3px solid rgba(210, 11, 18, .12);
    border-color: var(--tsl-red, #d20b12)
}

.contact-content input[type=submit] {
    min-height: 46px;
    padding: 0 24px;
    border: 0;
    border-radius: 7px;
    background: var(--tsl-red, #d20b12);
    color: #fff;
    font-weight: 800;
    cursor: pointer
}

.contact-aside {
    color: #58667a;
    background: linear-gradient(145deg, #fff, #f1f4f8)
}

.contact-aside dl {
    margin: 0 0 25px
}

.contact-aside dt {
    margin-top: 17px;
    color: var(--tsl-navy, #041d43);
    font-size: .75rem;
    font-weight: 800;
    text-transform: uppercase
}

.contact-aside dd {
    margin: 4px 0 0;
    line-height: 1.55
}

.contact-aside a:not(.tsl-button) {
    color: var(--tsl-red, #d20b12)
}

@media(max-width:800px) {
    .contact-info {
        grid-template-columns: 1fr 1fr
    }

    .contact-info>*:last-child {
        grid-column: 1/-1;
        border-top: 1px solid #e5e9ef;
        border-left: 0
    }

    .contact-grid {
        grid-template-columns: 1fr
    }
}

@media(max-width:520px) {
    .contact-hero {
        padding: 38px 0 70px
    }

    .contact-info {
        grid-template-columns: 1fr
    }

    .contact-info>*+*,
    .contact-info>*:last-child {
        grid-column: auto;
        border-top: 1px solid #e5e9ef;
        border-left: 0
    }

    .contact-info>a,
    .contact-info>div { padding: 20px }

    .contact-content,
    .contact-aside {
        padding: 24px 19px
    }
}
