html {
    color: #000000;
    font-family: 'Gill Sans Nova', 'serif';
    font-weight: 400;
    font-style: normal;
}

.container {
    max-width: 968px;
    margin: 0 auto;
}

.main {
    padding-top: 150px;
}

.title {
    color: #000;

    text-align: center;
    font-size: 28px;
    font-style: normal;
    font-weight: 800;
    letter-spacing: 0.168px;
}

.t-26 {
    color: #000;

    text-align: center;
    font-size: 26px;
    font-style: normal;
    font-weight: 800;
    letter-spacing: 0.168px;
}

.text {
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: 25px;
    letter-spacing: 0.108px;
}

.divider {
    height: 1px;
    background-color: black;
    margin-top: 25px;
    margin-bottom: 40px;
}

.main {
    text-align: center;
}

.main h2 {
    margin: 0 auto 85px;
    padding-top: 50px;
    line-height: 25px;
    font-size: 22px;
    text-transform: uppercase;
}

.city-block {
    background-color: #FAFAFA;
    text-transform: uppercase;
    display: flex;
    justify-content: center;
    align-content: center;
    padding: 10px 0;
    font-weight: 600;
}

.m-45 {
    margin-top: 45px;
    margin-bottom: 45px;
}

.shops-grid-wrap {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 30px 0;
}

.shop-item {
    width: calc(100%/3 - 20px);
}

.item-head {
    color: #000;
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 25px;
    letter-spacing: 0.12px;
    text-transform: uppercase;

    padding-bottom: 10px;
}

.item-text {
    color: #000;
    font-size: 18px;
    font-style: normal;
    font-weight: 300;
    line-height: 25px;
    letter-spacing: 0.108px;

    padding-bottom: 5px;
}

.solo-block {
    margin: 0 auto;
}

.two {
    gap: 0 30px;
    justify-content: unset;
}

.t-line {
    color: #000;
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
    line-height: 30px;
    letter-spacing: 0.12px;
    text-transform: uppercase;
    text-decoration: underline;

    padding-bottom: 20px;
}

.regions {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-template-rows: 0.7fr 1fr 1fr 0.7fr 0.4fr 0.4fr;
    gap: 30px 15px;
    grid-auto-flow: row;
    grid-template-areas:
    "voron kazan krasn"
    "novosib ekb st-p"
    "novosib ekb st-p"
    "samara omsk st-p"
    "nn rostov krasnyarsk"
    "nn rostov sochi"
    "tumen ufa .";
}

.regions2 {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    grid-template-rows: 0.2fr 0.2fr 0.5fr;
    gap: 30px 15px;
    grid-auto-flow: row;
    grid-template-areas:
    "ekb2 kazan2 krasn2"
    "ekb2 ufa2 omsk2"
    "sochi2 nn2 .";
}

.st-p { grid-area: st-p; }
.voron { grid-area: voron; }
.kazan { grid-area: kazan; }
.kazan2 { grid-area: kazan2; }
.krasn { grid-area: krasn; }
.krasn2 { grid-area: krasn2; }
.novosib { grid-area: novosib; }
.ekb { grid-area: ekb; }
.ekb2 { grid-area: ekb2; }
.samara { grid-area: samara; }
.omsk { grid-area: omsk; }
.krasnyarsk { grid-area: krasnyarsk; }
.rostov { grid-area: rostov; }
.nn { grid-area: nn; }
.nn2 { grid-area: nn2; }
.sochi { grid-area: sochi; }
.sochi2 { grid-area: sochi2; }
.tumen { grid-area: tumen; }
.ufa { grid-area: ufa; }

.reg-flex {
    display: flex;
    flex-direction: column;
    gap: 30px 0;
}

.w-325 {
    width: 325px;
}

.pt-50 {
    padding-top: 50px;
}

.h-16 {
    font-size: 16px;
}

.last {
    flex: auto;
    padding-bottom: 50px;
    padding-left: 30px;
}

.long {
    width: 35%;
}

@media (max-width: 980px) {
    .container {
        max-width: 350px;
        margin: 0 auto;
    }

    .main {
        padding-top: 50px;
    }

    .divider {
        margin-top: 20px;
        margin-bottom: 30px;
    }

    .m-45 {
        margin-top: 25px;
        margin-bottom: 25px;
    }

    .t-26 {
        font-size: 18px;
    }

    .main h2 {
        padding-top: 30px;
        font-size: 14px;
        text-align: justify;
        margin: 0 auto 45px;
    }
    .title {
        font-size: 24px;
    }
    .text {
        text-align: justify;
        font-size: 14px;
        line-height: 20px;
    }

    .shops-grid-wrap {
        justify-content: center;
        gap: 30px 0;
    }
    .shop-item {
        width: 75%;
    }

    .regions, .regions2 {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 20px 15px;
    }

    .w-85 {
        width: 85%;
    }

    .regions > div {
        width: 75%;
    }

    .last {
        flex: unset;
        padding-left: 0;
    }

    .w-m-94 {
        width: 94%;
    }
}