/* =========================================================
   SITE FOOTER
========================================================= */

.site-footer {
    width: 100%;

    padding:
        var(--section-spacing)
        0
        0;

    color:
        #b7b7b7;

    background:
        #222222;

    border-top:
        3px solid
        var(--service-primary);
}


/* =========================================================
   INNER
========================================================= */

.site-footer__inner {
    width: 100%;

    margin-inline: auto;
}


/* =========================================================
   GRID
========================================================= */

.site-footer__grid {
    display: grid;

    grid-template-columns:
        190px
        minmax(220px, 1.25fr)
        minmax(190px, 0.8fr)
        minmax(220px, 1fr);

    align-items: start;

    column-gap: 52px;
    row-gap: 36px;

    width: 100%;
}


/* =========================================================
   BRAND
========================================================= */

.site-footer__brand {
    min-width: 0;
}


.site-footer__logo {
    display: inline-flex;

    width: 100%;
    max-width: 180px;

    align-items: center;
}


.site-footer__logo-image {
    display: block;

    width: auto;
    max-width: 100%;
    height: 60px;

    object-fit: contain;
    object-position: left center;
}


.site-footer__logo-text {
    color:
        #ffffff;

    font-size: 24px;
    line-height: 1.2;
    font-weight: 700;
}


/* =========================================================
   INFO
========================================================= */

.site-footer__info {
    min-width: 0;

    color:
        #a9a9a9;

    font-size: 14px;
    line-height: 1.65;
}


.site-footer__text,
.site-footer__travel {
    color:
        #a9a9a9;
}


.site-footer__text p,
.site-footer__travel p {
    margin: 0;
}


.site-footer__text p + p,
.site-footer__travel p + p {
    margin-top: 7px;
}


.site-footer__travel {
    margin-top: 10px;
}


/* =========================================================
   COLUMN
========================================================= */

.site-footer__column {
    min-width: 0;
}


/* =========================================================
   TITLE
========================================================= */

.site-footer__title {
    margin:
        0
        0
        16px;

    color:
        #ffffff;

    font-size: 20px;
    line-height: 1.3;
    font-weight: 700;

    text-align: left;
}


/* =========================================================
   CONTACT ROW
========================================================= */

.site-footer__contact-row {
    display: grid;

    grid-template-columns:
        38px
        minmax(0, 1fr);

    align-items: start;

    gap: 12px;

    margin-bottom: 16px;
}


.site-footer__contact-row:last-child {
    margin-bottom: 0;
}


/* =========================================================
   ICON
========================================================= */

.site-footer__icon {
    display: flex;

    width: 38px;
    height: 38px;

    align-items: center;
    justify-content: center;

    color:
        #ffffff;

    background:
        var(--service-primary);

    border-radius:
        50%;
}


.site-footer__icon svg {
    width: 16px;
    height: 16px;
}


/* =========================================================
   SCHEDULE
========================================================= */

.site-footer__schedule {
    padding-top: 1px;

    color:
        #b7b7b7;

    font-size: 14px;
    line-height: 1.55;
}


.site-footer__schedule p {
    margin: 0;
}


.site-footer__schedule p + p {
    margin-top: 4px;
}


.site-footer__schedule strong {
    color:
        #ffffff;
}


/* =========================================================
   PHONES
========================================================= */

.site-footer__phones {
    display: flex;

    flex-direction: column;

    gap: 4px;

    padding-top: 1px;
}


.site-footer__phone {
    color:
        #d0d0d0;

    font-size: 16px;
    line-height: 1.35;
    font-weight: 600;

    white-space: nowrap;

    transition:
        color
        var(--transition-fast);
}


.site-footer__phone:hover {
    color:
        var(--service-primary);
}


/* =========================================================
   EMAIL
========================================================= */

.site-footer__email {
    min-width: 0;

    align-self: center;

    color:
        #b7b7b7;

    font-size: 16px;
    line-height: 1.4;

    overflow-wrap: anywhere;

    transition:
        color
        var(--transition-fast);
}


.site-footer__email:hover {
    color:
        var(--service-primary);
}


/* =========================================================
   BOTTOM
========================================================= */

.site-footer__bottom {
    width: 100%;

    margin-top: 42px;

    padding:
        17px
        0;

    color:
        #777777;

    border-top:
        1px solid
        rgba(255, 255, 255, 0.08);

    font-size: 14px;
    line-height: 1.4;

    text-align: center;
}


/* =========================================================
   SMALL DESKTOP
========================================================= */

@media (max-width: 1100px) {

    .site-footer__grid {
        grid-template-columns:
            170px
            minmax(0, 1.25fr)
            minmax(170px, 0.8fr)
            minmax(200px, 1fr);

        column-gap: 32px;
    }


    .site-footer__logo {
        max-width: 160px;
    }

}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 900px) {

    .site-footer__grid {
        grid-template-columns:
            repeat(
                2,
                minmax(0, 1fr)
            );

        column-gap: 32px;
        row-gap: 38px;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 600px) {

    .site-footer__grid {
        grid-template-columns:
            1fr;

        row-gap: 30px;
    }


    .site-footer__logo {
        max-width: 170px;
    }


    .site-footer__logo-image {
        height: 54px;
    }


    .site-footer__title {
        font-size: 18px;
    }


    .site-footer__info {
        font-size: 14px;
    }


    .site-footer__bottom {
        margin-top: 32px;
    }

}