/* -------------------ШАПКА--------------------- */
.header {
    background-color: var(--header_bg);
    width: 100%;
}

.container {
    max-width: 1600px;
    width: 100%;
    padding: 0 15px;
    margin: 0 auto;
}

.header__inner {
    display: flex;
    justify-content: space-around;
    color: var(--header_text);
    gap: 200px;
    
}

/* ---Блок с логотипом и названием компании--- */
.block_logo {
    display: flex;
    justify-content: space-between;
    gap: 25px;
    padding: 20px 0;
}

.logo {
    background: var(--header_text);
    padding: 3px 6px;
    border-radius: 10px;
}

.header__title {
    margin-top: 15px;
    font-weight: 700;
    font-size: 21px;
}

/* ---Блок с навигацией и ссылкой на вк группу--- */
.nav_vk_block {
    display: flex;
    justify-content: space-around;
    padding: 20px 0;
    margin-top: 15px;
}
/* навигация */
.header__nav {
    font-weight: 500;
    margin-right: 30px;
    
    font-size: 17px;
}
.header__nav > *:not(:last-child) {
    margin-right: 20px;
}
.nav_link {
    transition: color .4s;
}
.nav_link:hover {
    color: #DC2626;
}
/* ссылка на вк в виде лого */
.vk_block_logo {
    cursor: pointer;
}

/* ------------------СЕКЦИЯ ПОД ШАПКОЙ(ИНТРО)------------------ */

/* сама секция */
.intro__section {
    width: 100%;
    background: var(--intro_bg);
    min-height: 600px;
}
/* блок с элементами(заголовок и текст)
выставляем элементы по центру секции друг под другом */
.central_content {
    display: flex;
    flex-direction: column;
    align-items: center;
}

/* заголовок МедиаСервис */
.intro_title {
    color: var(--header_bg);
    /* ExtraBold */
    font-weight: 800;
    font-size: 53px;
    margin-top: 8%;
}

.intro_text {
    color: #4B5563;
    width: 50%;
    text-align: center;
    padding: 5px 20px;
    margin-top: 15px;
    font-size: 25px;
    font-weight: 400;
}

/* красный лейбл с текстом */
.intro_label {
    background: linear-gradient(90deg, #e5191c 0%, #b91c1c 100%);
    font-weight: 600;
    font-size: 18px;
    padding: 15px 20px;
    
    border-radius: 50px;
    color: #FFFFFF;
    margin-top: 40px;
}

/* --------------------ДЛЯ КАЖДОЙ СЕКЦИИ СЕРВИСА------------------------- */

.service_section {
    background-color: var(--service_bg);
}

.service__container {
    padding: 80px 140px 0 100px;
}

.title_block {
    display: flex;
}

.service_title {
    font-weight: 700;
    font-size: 32px;
    text-decoration: underline;
    color: var(--header_bg);
    margin: 5px 0 0 10px;
}

.logo_service {
    background-color: var(--service_bg);
}

.service_grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    margin-top: 1%;
    grid-column-gap: 30px;
}

/* стилизация каждой карточки */
.service_card {
    border-radius: 12px;
    border-left: 3px solid var(--card_border);
    background-color: #FFFFFF;
    margin-top: 30px; 
}

.card__inner {
    padding: 25px 34px 20px 25px;
}

.card_title {
    font-weight: 700;
    color: var(--header_bg);
    padding: 10px 0;
    
    border-bottom: 1px solid #B4C0EF;
}

.card_text {
    line-height: 1.5;
    margin-top: 20px;
    font-weight: 400;
}

/* -------------------ОТДЕЛЬНАЯ СТИЛИЗАЦИЯ ДЛЯ НЕКОТОРЫХ СЕКЦИЙ СЕРВИСА--------------------- */

/* нижний текст под линией(только в секции АСУ-сервис) */
.down_text {
    color: #6B7280;
    font-size: 15px;
    font-weight: 400;
    font-style: italic;
    
    border-top: 1px solid #B4C0EF;
    margin-top: 7%;
    padding: 10px 0;
}

/* список в тексте(только для секций СВЯЗЬ-сервис и Метрология) */
.list {
    list-style-type: disc;
    padding: 5px 0 10px 30px;
}
.list li {
    margin-top: 15px
}

/* уменьшаем высоту карточки "дополнительные услуги" */
.small_card {
    height: 35%;
}

.metrology_card {
    width: 60%;
}

/* мин высота для секции метрологии */
.metrology_section {
    min-height: 640px;
}


/* --------------------------------СТИЛИЗАЦИЯ ПОДВАЛА-------------------------------- */

.footer {
    width: 100%;
    background-color: var(--footer_bg);
}

.footer_container {
    padding: 50px 50px;
}
.footer__inner {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 40px;
}

.footer_text {
    font-weight: 400;
    font-size: 16px;
    color: #cbd5e1;
    
    padding-left: 10px;
}

/* ----Блок МедиаСервис------ */
.ms_block, .services_block, .contacts_block {
    padding: 5px 10px 5px 15px;
    width: 100%;
}

.ms_title, .services_title, .contacts_title {
    font-weight: 600;
    color: #a5d0ff;
    font-size: 24px;
    
    padding: 3px 0 0 10px;
}

.footer__inner > *:not(:last-child) {
    margin-right: 20%;
}

.ms_text {
    margin-top: 15px;
}

/* -----Блок Услуги----- */

.service_link {
    font-weight: 400;
    font-size: 16px;
    
    transition: color .4s;
}

.services_block {
    color: #cbd5e1;
}

.services_list > * {
    margin-top: 15px;
}

.service_link:hover {
    color: #DC2626
}
/* Блок Контакты */

.contacts_list > * {
    margin-top: 15px;
}

/* Блок под подвалом(2023 год) */
.under_footer {
    margin: 6% auto 0 auto;
    border-top: 1px solid #334155;
    text-align: center;
    
    padding-top: 30px;
    font-weight: 400;
    font-size: 16px;
    color: #CBD5E1;
    
}