/*
Theme Name: Doc Nikitin Theme
Author: Lev Barkov
Version: 1.5
*/

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&family=Lato:ital,wght@0,400;0,700;1,400&display=swap');

:root {
    --bg-color-primary: #CDDEF1;
    --bg-color-secondary: #EAEBF5;
    
    --header-gradient-start: #F44847;
    --header-gradient-end: #F19E57;
    --header-accent: #FF8A04;
    --header-dark: #292B32;
    --header-gray: #7C8498;
    --header-light-bg: #EFF4F7;
    --header-white: #FFFFFF;
    --header-border-btn: #FF8A04;
    
    --header-font-primary: 'Inter', sans-serif;
    --header-nav-font-size: 14px;
    --header-menu-font-size: 16px;
    
    --header-btn-shadow: 0px 7.9px 18px 0px rgba(243, 107, 77, 0.1), 0px 31.6px 31.6px 0px rgba(243, 107, 77, 0.09), 0px 72.2px 42.8px 0px rgba(243, 107, 77, 0.05);

    --footer-bg: #7C8498;
    --footer-bg-card: #666F84;
    --footer-text: #FFFFFF;
    --footer-text-muted: rgba(255, 255, 255, 0.6);
    --footer-font-primary: 'Inter', sans-serif;
    --footer-font-size-nav: 16px;
    --footer-font-size-contact: 16px;
    --footer-font-size-small: 12px;
    --footer-line-height-nav: 20px;
    --footer-line-height-small: 19px;
    --footer-tracking: -0.1504px;
    --footer-padding-top: 40px;
    --footer-padding-bottom: 35px;
    --footer-nav-item-gap: 19px;
    --footer-column-gap: 88px;
    --footer-social-gap: 8px;
    --footer-card-padding: 16px;
    --footer-border-radius: 21px;
    --footer-bottom-gap: 94px;
    --footer-bottom-top: 44px;
    --footer-logo-width: 140px;
    --footer-icon-size: 24px;
}

/* ==========================================================================
   ГЛОБАЛЬНЫЕ СТИЛИ (BODY & BACKGROUNDS)
   ========================================================================== */
body { 
    font-family: var(--header-font-primary); 
    background-color: var(--header-white);
    margin: 0;
    padding: 0;
    position: relative;
    z-index: 0;
    overflow-x: hidden; 
    padding-top: 0.1px;
    
    background-image:
        radial-gradient(925.5px circle at 0% -120px, var(--bg-color-primary) 0%, rgba(205, 222, 241, 0) 100%),
        radial-gradient(925.5px circle at 100% 1100px, var(--bg-color-primary) 0%, rgba(205, 222, 241, 0) 100%),
        radial-gradient(1267.5px circle at -700px 1900px, var(--bg-color-primary) 0%, var(--bg-color-primary) 50%, rgba(205, 222, 241, 0) 100%);
    background-repeat: no-repeat;
    background-size: 100% 100%;
}

body::after {
    content: "";
    position: absolute;
    top: 4167px; 
    left: 0;
    right: 0;
    bottom: 0;
    z-index: -1;
    pointer-events: none;
    background-image:
        radial-gradient(925.5px circle at 100% 925.5px, var(--bg-color-primary) 0%, rgba(205, 222, 241, 0) 100%),
        radial-gradient(1267.5px circle at -700px 1900px, var(--bg-color-primary) 0%, var(--bg-color-primary) 50%, rgba(205, 222, 241, 0) 100%);
    background-size: 100% 4000px;
    background-repeat: repeat-y;
}

h2 {
    font-family: 'Lato', sans-serif;
    font-size: 45px;
    line-height: 100%;
    font-weight: 400;
    text-transform: uppercase;
    margin: 0;
}

h3 {
    font-family: 'Lato', sans-serif;
    font-size: 38.72px;
    line-height: 100%;
    font-weight: 400;
    /* text-transform: uppercase; */
    margin: 0;
}

@media (max-width: 991.98px) {
    h2 { font-size: 34px; }
    h3 { font-size: 32px; }
}

@media (max-width: 45.98px) {
    h2 { font-size: 30px; }
    h3 { font-size: 28px; }
}
/* ==========================================================================
   ГЛОБАЛЬНЫЕ КЛАССЫ И КНОПКИ
   ========================================================================== */
@media (min-width: 992px) {
    .page-container {
        padding-left: calc(var(--bs-gutter-x, 1.5rem) * .5 + 40px);
        padding-right: calc(var(--bs-gutter-x, 1.5rem) * .5 + 40px);
    }
}

.btn-primary-large { 
    display: inline-flex;
    justify-content: center;
    align-items: center;
    padding: 28px 40px; 
    border-radius: 100px; 
    border: none; 
    background: linear-gradient(90deg, #F44847 0%, #F19E57 100%); 
    font-family: 'Inter', sans-serif; 
    font-size: 21px; 
    color: #FFFFFF; 
    cursor: pointer; 
    text-decoration: none;
    box-shadow: 0 4px 16px rgba(244, 72, 71, 0.25); 
    white-space: nowrap;
    transition: 0.3s;
}

.btn-primary-large:hover { 
    transform: translateY(-2px); 
    color: #FFFFFF;
    box-shadow: 0 8px 24px rgba(244, 72, 71, 0.35); 
}

/* ==========================================================================
   ШАПКА (HEADER)
   ========================================================================== */
.header { 
    position: absolute; 
    top: 0; 
    left: 0; 
    right: 0; 
    z-index: 1050; 
    padding-top: 34px !important; 
    margin: 0 !important; 
}

.header__bar { 
    background: var(--header-white); 
    border-radius: 100px; 
    padding: 20px 40px; 
    box-shadow: 0 2px 20px rgba(0, 0, 0, 0.06); 
    display: flex; 
    justify-content: space-between; 
    align-items: center; 
    margin: 0 !important; 
}

.header__logo { 
    width: 62px; 
    height: 46px; 
    display: block; 
    flex-shrink: 0; 
}

.header__logo svg { 
    width: 100%; 
    height: 100%; 
    display: block; 
}

.header__menu-toggle { 
    display: flex; 
    align-items: center; 
    gap: 10px; 
    padding: 10px 20px; 
    border: none; 
    background: transparent; 
    cursor: pointer; 
}

.header__menu-text { 
    font-weight: 500; 
    font-size: var(--header-menu-font-size); 
    background: linear-gradient(to right, var(--header-gradient-start), var(--header-gradient-end)); 
    -webkit-background-clip: text; 
    -webkit-text-fill-color: transparent; 
}

.header__nav { 
    display: flex; 
    align-items: center; 
    gap: 30px; 
    list-style: none; 
    margin: 0; 
    padding: 0; 
}

.header__nav-link { 
    font-size: var(--header-nav-font-size); 
    color: var(--header-dark); 
    text-decoration: none; 
    transition: 0.2s; 
    white-space: nowrap; 
}

.header__nav-link:hover { 
    color: var(--header-accent); 
}

.header__phone { 
    display: flex; 
    align-items: center; 
    gap: 8px; 
    text-decoration: none; 
    color: var(--header-dark); 
    font-weight: 500; 
}

.header__phone:hover { 
    color: var(--header-accent); 
}

.header__button { 
    display: inline-flex; 
    align-items: center; 
    justify-content: center; 
    padding: 10px 30px; 
    border: 1px solid var(--header-border-btn); 
    border-radius: 112px; 
    background: transparent; 
    text-decoration: none; 
    color: var(--header-dark); 
    font-weight: 500; 
    transition: 0.25s all ease; 
}

.header__button:hover { 
    background: linear-gradient(to right, var(--header-gradient-start), var(--header-gradient-end)); 
    color: var(--header-white); 
    box-shadow: var(--header-btn-shadow); 
}

/* Offcanvas Меню */
.header .offcanvas { 
    width: 831px !important; 
    background: transparent !important; 
    border: none !important; 
}

.header__offcanvas-shape { 
    position: absolute; 
    top: 0; 
    left: 0; 
    width: 100%; 
    height: 100%; 
    z-index: 1; 
    pointer-events: none; 
    overflow: hidden; 
}

.header .offcanvas .header__close-btn { 
    position: absolute; 
    left: 15px; 
    top: 50%; 
    transform: translateY(-50%); 
    z-index: 10; 
    background: none; 
    border: none; 
    padding: 0; 
    width: 24px; 
    height: 24px; 
    display: flex; 
    align-items: center; 
    justify-content: center; 
    cursor: pointer; 
}

.offcanvas-header { 
    padding: 40px 32px 20px 120px; 
    z-index: 2; 
    position: relative; 
}

.offcanvas-body { 
    padding: 24px 32px 32px 152px; 
    z-index: 2; 
    position: relative; 
}

.header__button--offcanvas-header { 
    padding: 15px 30px; 
    background: linear-gradient(77deg, #F44847 0%, #F19E57 100%); 
    color: white; 
    border: none; 
    box-shadow: var(--header-btn-shadow); 
}

.header__nav--vertical { 
    flex-direction: column; 
    align-items: flex-start; 
    gap: 20px; 
}

.header__nav-heading { 
    font-weight: 600; 
    margin-bottom: 20px; 
    color: var(--header-dark); 
    font-size: 18px; 
}

.header__service-link { 
    color: var(--header-gray); 
    text-decoration: none; 
    display: block; 
    margin-bottom: 15px; 
}

.header__contact-section { 
    margin-top: auto; 
    padding-top: 32px; 
    border-top: 1px solid rgba(124, 132, 152, 0.1); 
}

.header__contact-item { 
    display: flex; 
    align-items: center; 
    gap: 10px; 
    padding: 16px; 
    border: 2px solid var(--header-light-bg); 
    border-radius: 21px; 
    text-decoration: none; 
    color: var(--header-dark); 
    font-weight: 500; 
    white-space: nowrap; 
}

.header__social-grid { 
    display: flex; 
    gap: 15px; 
}

.header__social-link { 
    padding: 12px; 
    border: 2px solid var(--header-light-bg); 
    border-radius: 21px; 
    transition: 0.2s; 
}

.header__social-link:hover { 
    border-color: var(--header-accent); 
}

@media (min-width: 992px) {
    .contact-row-wrapper { 
        display: flex !important; 
        flex-wrap: nowrap; 
        gap: 20px; 
        align-items: center; 
    }
}

@media (max-width: 991.98px) {

    .header { padding-top: 20px !important; } 
    .header__bar { border-radius: 100px; padding: 15px 30px; }
    .header .offcanvas { width: 100% !important; background: var(--header-white) !important; }
    .header__offcanvas-shape { display: none !important; }
    .header .offcanvas .header__close-btn { top: 20px; left: auto; right: 20px; transform: none; }
    /* Обнуляем огромные отступы, которые тянули всё вправо */
    .offcanvas-header, 
    .offcanvas-body { 
        padding: 20px !important; 
        text-align: center; 
    }

    /* Центрируем вертикальное меню */
    .header__nav--vertical { 
        align-items: center !important; 
        width: 100%;
    }

    /* Центрируем ссылки услуг */
    .header__service-link {
        text-align: center;
        width: 100%;
    }

    /* Центрируем иконки соцсетей и контакты */
    .contact-row-wrapper {
        justify-content: center !important;
        width: 100%;
    }

    .header__social-grid {
        justify-content: center;
    }

    .header__contact-item {
        justify-content: center;
        width: 100%;
        max-width: 320px; /* Чтобы кнопки контактов не были слишком длинными */
        margin: 0 auto;
    }
}

* Обнуляем огромные отступы, которые тянули всё вправо */
    .offcanvas-header, 
    .offcanvas-body { 
        padding: 20px !important; 
        text-align: center; 
    }
    
@media (max-width: 767.98px) {
    .header { padding-top: 0 !important; } 
    .header .container { max-width: 100% !important; padding-left: 0; padding-right: 0; }
    .header__bar { border-radius: 0; margin: 0; padding: 15px 20px; }
}

main, .site-main { padding-top: 140px; }
@media (max-width: 991.98px) { main, .site-main { padding-top: 110px; } }
@media (max-width: 767.98px) { main, .site-main { padding-top: 90px; } }

/* ==========================================================================
   ПОДВАЛ (FOOTER)
   ========================================================================== */
.footer { 
    background-color: var(--footer-bg); 
    padding-top: var(--footer-padding-top); 
    padding-bottom: var(--footer-padding-bottom); 
    overflow: hidden; 
    position: relative; 
    font-family: var(--footer-font-primary); 
    margin-top: 100px; 
}

.footer__main { margin-bottom: var(--footer-bottom-top); }
.footer__brand { display: flex; flex-direction: column; align-items: flex-start; }

.footer__logo { 
    width: var(--footer-logo-width); 
    margin-bottom: 39px; 
    display: block; 
}

.footer__logo svg { width: 100%; height: auto; }
.footer__logo svg path { fill: var(--footer-text); }

.footer__legal { 
    font-weight: 400; 
    font-size: var(--footer-font-size-small); 
    line-height: var(--footer-line-height-small); 
    color: var(--footer-text-muted); 
    text-transform: uppercase; 
}
.footer__legal p { margin: 0; }

.footer__nav { 
    display: flex; 
    gap: var(--footer-column-gap); 
    padding-top: 68px; 
}

.footer__nav-column { 
    display: flex; 
    flex-direction: column; 
    gap: var(--footer-nav-item-gap); 
    list-style: none; 
    margin: 0; 
    padding: 0; 
}

.footer__nav-link { 
    font-size: var(--footer-font-size-nav); 
    line-height: var(--footer-line-height-nav); 
    letter-spacing: var(--footer-tracking); 
    color: var(--footer-text); 
    text-decoration: none; 
    transition: opacity 0.2s; 
}

.footer__nav-link:hover { 
    opacity: 1; 
    color: var(--header-accent); 
}

.footer__aside { 
    display: flex; 
    flex-direction: column; 
    align-items: flex-end; 
    gap: var(--footer-social-gap); 
    padding-top: 13px; 
}

.footer__social { display: flex; gap: var(--footer-social-gap); }

.footer__social-link { 
    position: relative; 
    display: flex; 
    align-items: center; 
    justify-content: center; 
    padding: var(--footer-card-padding); 
    background-color: var(--footer-bg-card); 
    border-radius: var(--footer-border-radius); 
    text-decoration: none; 
    transition: background-color 0.2s, transform 0.2s; 
    flex-shrink: 0; 
}

.footer__social-link:hover { 
    background-color: #5a6376; 
    transform: translateY(-2px); 
}

.footer__social-icon { 
    width: var(--footer-icon-size); 
    height: var(--footer-icon-size); 
    flex-shrink: 0; 
    display: flex; 
    align-items: center; 
    justify-content: center;
}

.footer__social-icon svg path { fill: var(--footer-text); }

.footer__social-disclaimer { 
    position: absolute; 
    top: 7px; 
    right: -2px; 
    font-size: 14px; 
    color: var(--footer-text); 
}

.footer__contact-card { 
    display: flex; 
    align-items: center; 
    justify-content: flex-start; 
    gap: 10px; 
    padding: 16px; 
    width: 240px; 
    background-color: var(--footer-bg-card); 
    border-radius: var(--footer-border-radius); 
    text-decoration: none; 
    transition: background-color 0.2s; 
}

.footer__contact-card:hover { background-color: #5a6376; }

.footer__contact-icon { 
    width: var(--footer-icon-size); 
    height: var(--footer-icon-size); 
    flex-shrink: 0; 
    display: flex; 
    align-items: center; 
    justify-content: center; 
}

.footer__contact-icon svg path, 
.footer__contact-icon svg rect, 
.footer__contact-icon svg polyline, 
.footer__contact-icon svg circle { 
    stroke: #FFFFFF !important; 
    fill: transparent !important; 
}

.footer__social-icon svg path { 
    fill: #FFFFFF !important; 
    stroke: none !important; 
}

.footer__contact-text { 
    font-weight: 500; 
    font-size: var(--footer-font-size-contact); 
    color: var(--footer-text); 
    white-space: nowrap; 
}

.footer__bottom { 
    display: flex; 
    align-items: center; 
    justify-content: center; 
    gap: var(--footer-bottom-gap); 
    padding-top: var(--footer-bottom-top); 
    border-top: 1px solid rgba(255, 255, 255, 0.08); 
}

.footer__bottom-link { 
    font-size: var(--footer-font-size-small); 
    line-height: var(--footer-line-height-small); 
    color: var(--footer-text-muted); 
    text-decoration: none; 
    transition: color 0.2s; 
}

.footer__bottom-link:hover { color: var(--footer-text); }

@media (max-width: 991.98px) {
    .footer__nav { padding-top: 32px; gap: 48px; flex-wrap: wrap; }
    .footer__aside { flex-direction: row; align-items: center; justify-content: flex-start; flex-wrap: wrap; gap: 20px; padding-top: 32px; }
    .footer__bottom { gap: 30px; flex-wrap: wrap; justify-content: flex-start; }
}

@media (max-width: 575.98px) {
    .footer__brand { flex-direction: row; align-items: flex-end; justify-content: space-between; width: 100%; padding-left: 9px; padding-right: 9px; }
    .footer__logo { margin-bottom: 0; width: 110px; flex-shrink: 0; }
    .footer__legal { text-align: right; font-size: 10px; line-height: 1.4; padding-bottom: 2px; }
   /* Возвращаем 50px по бокам для шапки подвала (логотип и реквизиты) */
    .footer__brand { 
        flex-direction: row; 
        align-items: flex-end; 
        justify-content: space-between; 
        width: 100%; 
        padding-left: 50px; 
        padding-right: 50px; 
    }
    
    .footer__logo { margin-bottom: 0; width: 110px; flex-shrink: 0; }
    .footer__legal { text-align: right; font-size: 10px; line-height: 1.4; padding-bottom: 2px; }

    /* Возвращаем 50px по бокам для самого меню */
    .footer__nav { 
        display: grid; 
        grid-template-columns: 1fr 1fr; 
        row-gap: 35px; 
        column-gap: 10px; 
        padding-top: 40px; 
        padding-left: 50px;  /* Было 9px, стало 50px */
        padding-right: 50px; /* Было 9px, стало 50px */
    }
    
    .footer__nav > *:nth-child(2) {
        padding-left: 15%; 
    }

    .footer__nav > *:nth-child(3) {
        grid-column: 1 / 2;
    }
    .footer__nav-column { gap: 19px; }
    .footer__nav-link { font-weight: 400 !important; font-size: 14px; }
    .footer__aside { padding-top: 40px; width: 100%; display: flex; flex-direction: column; align-items: center; gap: 20px; }
    .footer__social { width: 100%; justify-content: center; gap: 15px; }
    .footer__contact-card { width: 100%; max-width: 240px; justify-content: center; }
    .footer__bottom { flex-direction: column; align-items: center; text-align: center; gap: 15px; padding-top: 24px; }
}

/* ==========================================================================
   ГЛОБАЛЬНЫЙ КОМПОНЕНТ ЗАГОЛОВКА (SECTION HEADER)
   ========================================================================== */
.section-header { 
    position: relative; 
    width: fit-content; 
    max-width: 100%; 
}

.section-header__title { 
    margin: 0; 
    text-transform: uppercase; 
    color: var(--header-dark); 
}

.section-header__main-row .section-header__meta { 
    margin-top: 0.35em; 
}

.section-header__meta { 
    display: inline-flex; 
    align-items: center; 
    gap: 15px; 
    flex-shrink: 1; 
}

.section-header__num { 
    font-family: 'Lato', sans-serif !important; 
    font-size: 16px; 
    font-style: normal !important; 
    color: #7C8498 !important; 
    line-height: 1; 
    flex-shrink: 0; 
}

.section-header__line { 
    display: inline-block; 
    width: 128px; 
    height: 1px; 
    background-color: #7C8498 !important; 
    opacity: 0.4; 
    flex-shrink: 1; 
    min-width: 30px; 
}

.section-header__row-bottom .section-header__num { 
    font-size: 20px; 
}

.section-header__row-top { 
    display: flex; 
    align-items: center; 
    flex-wrap: nowrap !important; 
}

.section-header__row-bottom { 
    display: flex; 
    align-items: center; 
    flex-wrap: wrap; 
}

.section-header__text { 
    white-space: normal; 
    word-break: keep-all; 
}

@media (max-width: 991.98px) { 
    .section-header__line { width: 60px; } 
    /* Отключаем жесткие колонки Flexbox для однострочных заголовков */
    .section-header__main-row {
        display: block !important; 
    }
    
    /* Если мета СЛЕВА (по умолчанию) */
    .section-header--meta-left .section-header__main-row .section-header__meta {
        float: left;
        margin-right: 15px;
        margin-top: 8px;
    }

    /* Если мета СПРАВА (как в Журнале Доктора) */
    .section-header--meta-right .section-header__main-row .section-header__meta {
        float: right;
        margin-left: 15px;
        margin-top: 8px;
    }
    
    /* Делаем текст строчным, чтобы он плавно обтекал float-элемент */
    .section-header__text {
        display: inline; 
    }
}

@media (max-width: 767.98px) { 
    .section-header__title { font-size: 30px !important; } 
 .section-header__title { 
        font-size: 30px !important; 
        
        /* Включаем переносы */
        -webkit-hyphens: auto;
        -moz-hyphens: auto;
        -ms-hyphens: auto;
        hyphens: auto;
        
        /* Тонкая настройка (чтобы не отрывать по 1-2 буквы) */
        -webkit-hyphenate-limit-chars: auto 3 3;
        -ms-hyphenate-limit-chars: auto 3 3;
        hyphenate-limit-chars: auto 3 3;
        
        overflow-wrap: break-word; 
        word-wrap: break-word;
    } 
    
    /* Скрываем жесткие переносы из PHP на мобилках */
    .section-header__text br {
        display: none;
    }
     .section-header__line {
        width: 30px; /* Уменьшаем в 2 раза от 60px */
        /* Сбрасываем min-width: 30px из основных стилей, 
           чтобы линия точно послушалась нового размера */
        min-width: unset; 
    }

}

/* --- ПРАВКА 2: Короткая линия для узких экранов (iPhone SE и т.д.) --- */
@media (max-width: 409.98px) {
    .section-header__line {
        width: 30px; /* Уменьшаем в 2 раза от 60px */
        /* Сбрасываем min-width: 30px из основных стилей, 
           чтобы линия точно послушалась нового размера */
        min-width: unset; 
    }
}
/* ==========================================================================
   СЕКЦИЯ УСЛУГИ (SERVICE HERO)
   ========================================================================== */
.service-hero {
    position: relative;
    padding-bottom: 30px;
}

.service-hero__main {
    position: relative;
    min-height: 600px;
    padding-top: 0; 
    padding-bottom: 120px; 
    display: flex;
    flex-direction: column;
}

/* Хлебные крошки */
.service-hero__breadcrumbs { 
    margin-bottom: 60px; 
}

.service-hero__breadcrumbs-list { 
    display: flex; 
    align-items: center; 
    gap: 10px; 
    list-style: none; 
    padding: 0; 
    margin: 0; 
}

.service-hero__breadcrumbs-item, 
.service-hero__breadcrumbs-link { 
    font-family: var(--header-font-primary, 'Lato', sans-serif); 
    font-size: 14px; 
    color: var(--header-gray, #7C8498); 
    text-decoration: none; 
    transition: 0.2s; 
}

.service-hero__breadcrumbs-link:hover { 
    color: var(--header-accent, #FF8A04); 
}

.service-hero__breadcrumbs-item--active { 
    pointer-events: none; 
}

.service-hero__breadcrumbs-separator { 
    display: flex; 
    align-items: center; 
}

/* Бейдж (01 + картинка) */
.service-hero__badge { 
    display: flex; 
    align-items: center; 
    gap: 20px; 
    margin-bottom: 30px; 
}

.service-hero__badge-number { 
    font-family: var(--header-font-primary, 'Lato', sans-serif); 
    font-size: 16px; 
    font-style: italic; 
    color: var(--header-gray, #7C8498); 
}

.service-hero__badge-line { 
    display: flex; 
}

.service-hero__badge-thumbnail { 
    width: 93px !important; 
    height: 93px !important; 
    border-radius: 12px; 
    overflow: hidden; 
    box-shadow: 0 4px 16px rgba(41, 43, 50, 0.08); 
    flex-shrink: 0; 
}

.service-hero__badge-thumbnail img { 
    width: 100%; 
    height: 100%; 
    object-fit: cover; 
    display: block; 
}

/* Заголовок и описание */
.service-hero__title { 
    font-family: 'Lato', sans-serif; 
    font-size: clamp(36px, 5vw, 60px); 
    font-weight: 400; 
    text-transform: uppercase; 
    color: var(--header-dark, #292B32); 
    line-height: 1.1; 
    margin-bottom: 24px; 
    margin-top: 0; 
}

.service-hero__description { 
    font-family: 'Lato', sans-serif; 
    font-size: 16px; 
    line-height: 1.5; 
    color: #4A4D57; 
    margin-bottom: 40px; 
    max-width: 480px; 
}

.service-hero__description p { 
    margin-bottom: 0; 
}

.service-hero__btn { 
    margin-bottom: 40px; 
    display: inline-flex; 
    width: fit-content; 
}

/* Картинка Доктора */
.service-hero__doctor { 
    position: absolute; 
    right: 0; 
    bottom: -40px; 
    width: 33.3333%; 
    height: 120%; 
    display: flex; 
    align-items: flex-end; 
    justify-content: center; 
    pointer-events: none; 
    z-index: 1; 
}

.service-hero__doctor img { 
    width: auto; 
    max-width: 100%; 
    max-height: 100%; 
    object-fit: contain; 
    object-position: bottom center; 
}

/* Плашка преимуществ */
.service-hero__features { 
    position: relative; 
    margin-top: -60px; 
    background-color: #ffffff; 
    border-radius: 30px; 
    padding: 40px; 
    box-shadow: 0 10px 40px rgba(41, 43, 50, 0.05); 
}

.service-hero__feature-divider { 
    position: absolute; 
    top: 50%; 
    transform: translateY(-50%); /* Идеально центрирует линию по вертикали */
    height: 150px; /* <--- МЕНЯЙ ЭТО ЗНАЧЕНИЕ. Сделай 180px или 200px, чтобы сделать её выше */
    width: 1px; /* Вернул стандартную толщину */
    background: linear-gradient(to bottom, #FFFFFF 0%, #E2E4EB 50%, #FFFFFF 100%); 
}

.service-hero__feature { 
    display: flex; 
    align-items: flex-start; 
    gap: 16px; 
    padding: 0 40px; 
}

.service-hero__feature-icon { 
    width: 42px; 
    height: 42px; 
    flex-shrink: 0; 
}

.service-hero__feature-icon img, 
.service-hero__feature-icon svg { 
    width: 100%; 
    height: 100%; 
    display: block; 
}

.service-hero__feature-title { 
    font-family: 'Inter', sans-serif; 
    font-size: 20px; 
    font-weight: 600; 
    color: var(--header-dark, #292B32); 
    margin: 0 0 8px 0; 
}

.service-hero__feature-subtitle { 
    font-family: 'Inter', sans-serif; 
    font-size: 14px; 
    line-height: 1.4; 
    color: var(--header-gray, #7C8498); 
    margin: 0; 
}

/* --- Адаптив для Секции Услуги --- */
@media (max-width: 991.98px) {
    .service-hero__main { 
        min-height: auto; 
        padding-bottom: 0; 
    }
    
    .service-hero__doctor { 
        position: relative; 
        width: 80%; 
        margin: 0 auto -20px auto; 
        bottom: auto; /* Сбрасываем десктопный отступ, чтобы он не улетел вниз */
        right: auto;
        height: 400px; 
        z-index: 1;
    }
    
    .service-hero__features { 
        margin-top: 0; 
        padding: 30px 20px; 
        z-index: 3;
    }
    
    .service-hero__feature-divider { 
        display: none !important; 
    }
    
    .service-hero__feature { 
        padding: 15px 0; 
    }
}

@media (max-width: 767.98px) {
    .service-hero__title {
        font-size: 30px !important;
    }

    .service-hero__btn.btn-primary-large {
        width: 100%;
        display: flex;
        justify-content: center;
        padding: 20px 30px !important;
        font-size: 18px !important;
    }
}

/* ==========================================================================
   КАРТОЧКИ УСЛУГ (АРХИВ С БЕЙДЖАМИ)
   ========================================================================== */
.service-card {
    background: var(--header-white);
    border-radius: 24px;
    padding: 35px 30px; /* Внутренние отступы карточки */
    border: 1px solid rgba(124, 132, 152, 0.15);
    display: flex;
    flex-direction: column;
    height: 100%;
    transition: 0.3s ease;
}

.service-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 40px rgba(41, 43, 50, 0.08);
    border-color: var(--header-accent);
}

.service-card__title {
    font-size: 24px;
    color: var(--header-dark);
    margin-bottom: 12px;
    text-transform: uppercase;
    font-family: 'Lato', sans-serif;
}

.service-card__desc {
    color: var(--header-gray);
    font-family: 'Inter', sans-serif;
    font-size: 15px;
    line-height: 1.5;
    margin: 0;
}

/* ==========================================================================
   ГЛАВНАЯ СТРАНИЦА (HOME HERO)
   ========================================================================== */
.home-hero__title {
    line-height: 1.2; /* Делаем строки чуть плотнее, чтобы заголовок смотрелся монолитно */
}

.home-hero__globe-icon {
    height: 0.9em; /* Иконка всегда будет ровно высотой с букву */
    width: auto;
    vertical-align: middle;
    margin-top: -0.1em; /* Небольшая корректировка для идеального выравнивания по базовой линии */
}

/* ==========================================================================
   УНИВЕРСАЛЬНЫЙ CTA БЛОК (CALL TO ACTION)
   ========================================================================== */
.cta-block {
    margin-top: 80px;
    margin-bottom: 80px;
}

.cta-block__left {
    background: var(--header-white);
    border-radius: 32px;
    padding: 65px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    box-shadow: 0 10px 40px rgba(41, 43, 50, 0.04); /* Легчайшая тень для объема */
}

.cta-block__right {
    /* Тот самый градиент из Figma */
    background: linear-gradient(180deg, #FFFFFF 0%, #EFF1FF 100%);
    border-radius: 32px;
    display: flex;
    align-items: flex-end; /* Прижимаем доктора к нижнему краю */
    justify-content: center;
    position: relative;
    overflow: hidden;
    min-height: 400px;
}

.cta-block__title {
  
    text-transform: uppercase;
    color: var(--header-dark);
    line-height: 1.1;
    margin: 0;
}

.cta-block__icon {
    height: 1.3em; /* Иконка всегда будет пропорциональна размеру шрифта */
    width: auto;
    vertical-align: middle;
    margin-top: -0.1em; /* Идеальное выравнивание по оптическому центру букв */
}

.cta-block__desc {
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    line-height: 1.5;
    color: var(--header-gray);
}

.cta-block__desc strong {
 color: var(--header-dark);
}
.cta-block__doctor-img {
    max-width: 90%; /* Чтобы доктор не упирался в края блока */
    height: auto;
    display: block;
    position: relative;
    z-index: 2;
}

/* Адаптив для телефонов и планшетов */
@media (max-width: 991.98px) {
    .cta-block {
        margin-top: 50px;
        margin-bottom: 50px;
    }
    .cta-block__left {
        padding: 40px 30px;
    }
    .cta-block__right {
        min-height: 350px;
    }
    .cta-block__btn {
        width: 100%;
        display: flex;
        justify-content: center;
    }
}

/* ==========================================================================
   УСЛУГИ НА ГЛАВНОЙ (СО СТИКИ-БЛОКОМ)
   ========================================================================== */
.home-services {
    margin: 80px 0;
}

/* Прилипающая левая колонка */
.home-services__sticky {
    position: sticky;
    top: 120px; /* Отступ от верхней границы экрана при скролле */
}

/* Квадратный блок с фоном */
.home-services__doctor-box {
    position: relative;
    width: 100%;
    aspect-ratio: 1 / 1; /* Жестко делаем квадратным */
    border-radius: 32px;
    background: radial-gradient(circle at bottom right, #FFCCA1 0%, rgba(246, 247, 252, 0) 70%), #F6F7FC;
    display: flex;
    align-items: flex-end; /* Прижимаем фото доктора к низу */
    justify-content: center;
    margin-top: 40px;
}

/* Доктор (торчит на 24px) */
.home-services__doctor-img {
    position: absolute;
    bottom: 0;
    max-width: 90%;
    /* Высота 100% от квадрата ПЛЮС 24px, которые вылезают наверх */
    height: calc(100% + 24px); 
    object-fit: contain;
    object-position: bottom center;
    z-index: 2;
}

/* Правая колонка: список карточек */
.home-services__list {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

/* Горизонтальная карточка услуги */
.home-services__card {
    display: flex;
    align-items: flex-start;
    gap: 30px;
    background: var(--header-white);
    border-radius: 24px;
    padding: 24px;
    box-shadow: 0 10px 40px rgba(41, 43, 50, 0.04);
    transition: 0.3s ease;
    border: 1px solid transparent;
}

.home-services__card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 40px rgba(41, 43, 50, 0.08);
    border-color: rgba(244, 72, 71, 0.2); /* Легкий оранжевый контур при наведении */
}

.home-services__card-img {
    width: 130px;
    height: 130px;
    flex-shrink: 0;
    border-radius: 16px;
    overflow: hidden;
    background-color: var(--bg-color-secondary);
}

.home-services__card-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.home-services__card-content {
    flex-grow: 1;
}

.home-services__card-title {
    font-family: 'Inter', sans-serif;
    font-size: 20px;
    font-weight: 600;
    color: var(--header-dark);
    /* text-transform; none; */

    margin: 0 0 8px 0;
}

.home-services__card-desc {
    font-family: 'Inter', sans-serif;
    font-size: 15px;
    line-height: 1.5;
    color: var(--header-gray);
    margin: 0 0 16px 0;
}

/* Ссылка и стрелочка */
.home-services__card-link {
    font-family: 'Inter', sans-serif;
    font-size: 14px;
    font-weight: 500;
    color: #F19E57; /* Под цвет твоей стрелочки */
    display: inline-flex;
    align-items: center;
    gap: 8px;
  
    letter-spacing: 0.5px;
}

.home-services__arrow {
    width: 12px;
    height: 12px;
    object-fit: contain;
    transition: transform 0.2s;
}

.home-services__card:hover .home-services__arrow {
    transform: translate(2px, -2px); /* Стрелочка дергается вверх-вправо при наведении */
}

/* Адаптив для планшетов и телефонов (Переработанный плиточный вид) */
@media (max-width: 991.98px) {
    .home-services {
        margin: 50px 0; /* Уменьшаем отступы секции на мобильных */
    }

    .home-services__sticky {
        position: relative; /* Отключаем залипание */
        top: 0;
    }
    
    /* 1. Настройка контейнера карточки: оставляем горизонтальный вид */
    .home-services__card {
        padding: 16px; /* Уменьшаем внутренние отступы */
        gap: 15px; /* Уменьшаем отступ между фото и текстом */
        flex-direction: row; /* Жестко сохраняем горизонтальный ряд */
        align-items: flex-start; /* Центрируем фото вертикально относительно текста */
    }
    
    /* 2. Левая колонка с фото (5/12 ширины) */
    .home-services__card-img {
        /* 5/12 = 41.666%. Используем calc, чтобы вычесть половину отступа */
        flex: 0 0 calc(41.666% - 7.5px); 
        max-width: calc(41.666% - 7.5px);
        
        /* Сбрасываем десктопные фиксированные размеры */
        width: auto; 
        height: auto; 
        
        /* Crucial: Гарантируем, что фото останется квадратным */
        aspect-ratio: 1 / 1; 
        border-radius: 12px; /* Чуть меньше скругление для маленькой карточки */
    }
    
    /* 3. Правая колонка с текстом (7/12 ширины) */
    .home-services__card-content {
        /* 7/12 = 58.333%. Вычитаем вторую половину отступа */
        flex: 0 0 calc(58.333% - 7.5px);
        max-width: calc(58.333% - 7.5px);
    }
    
    /* Уменьшаем шрифты, чтобы текст помещался */
    .home-services__card-title {
        font-size: 19px;
        margin-bottom: 4px;
        line-height: 23px;
    }
    
    .home-services__card-desc {
        font-size: 16px;
        line-height: 1.4;
        margin-bottom: 8px;
        /* Ограничиваем описание тремя строками, чтобы карточки были одной высоты */
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }
    
    .home-services__card-link {
        font-size: 16px;
    }
    
    .home-services__arrow {
        width: 10px;
        height: 10px;
    }
}

/* ==========================================================================
   ФИКС ДВОЙНЫХ ОТСТУПОВ (КОНТЕЙНЕР В КОНТЕЙНЕРЕ) НА МОБИЛЬНЫХ
   ========================================================================== */
@media (max-width: 991.98px) {
    .container .container {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
}

/* ==========================================================================
       ОБНОВЛЕННЫЙ АДАПТИВ (УМЕНЬШЕННОЕ ФОТО 4/12 К 8/12)
       ========================================================================== */

    /* 2. Левая колонка с фото (ТЕПЕРЬ 4/12 ширины) */
    .home-services__card-img {
        /* 4/12 = 33.333%. Используем calc, чтобы вычесть половину отступа */
        flex: 0 0 calc(33.333% - 7.5px); 
        max-width: calc(33.333% - 7.5px);
        
        /* Сбрасываем десктопные фиксированные размеры */
        width: auto; 
        height: auto; 
        
        /* Crucial: Гарантируем, что фото останется квадратным */
        aspect-ratio: 1 / 1; 
        border-radius: 12px; 
    }
    
    /* 3. Правая колонка с текстом (ТЕПЕРЬ 8/12 ширины) */
    .home-services__card-content {
        /* 8/12 = 66.666%. Вычитаем вторую половину отступа */
        flex: 0 0 calc(66.666% - 7.5px);
        max-width: calc(66.666% - 7.5px);
    }

    /* ==========================================================================
   СЕКЦИЯ ОБРАЗОВАНИЯ (ТАЙМЛАЙН)
   ========================================================================== */
.education-section {
    margin: 80px 0;
}

.education-item {
    margin-bottom: 40px;
    gap: 30px;
}

/* Последнему элементу убираем нижний отступ и границу */
.education-item:last-child {
    margin-bottom: 0;
}
.education-item:last-child .education-item__content-col {
    border-bottom: none;
    padding-bottom: 0;
}

/* Колонка с годом */
.education-item__year-col {
    display: flex;
    flex-direction: column;
    align-items: flex-end; /* Идеально прижимает "год" к правому краю цифр */
    width: 90px;
    flex-shrink: 0;
}

.education-item__year {
    font-family: 'Lato', sans-serif;
    font-weight: 300;
    font-size: 42px;
    line-height: 1;
    background: linear-gradient(90deg, #F44847 0%, #F19E57 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    margin-bottom: 4px;
}

.education-item__year-label {
    font-family: 'Inter', sans-serif;
    font-size: 13px;
    color: #b0b0b0;
    text-transform: lowercase;
}

/* Колонка с контентом */
.education-item__content-col {
    padding-bottom: 40px;
    border-bottom: 1px solid rgba(124, 132, 152, 0.15); /* Та самая серая линия */
}

.education-item__text {
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    line-height: 1.5;
    color: var(--header-dark);
    margin: 0 0 20px 0;
    max-width: 600px;
}

.education-item__meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 15px;
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    color: var(--header-dark);
}

.education-item__spec {
    font-weight: 700;
}

.education-item__qual {
    font-weight: 400;
}

.education-item__arrow {
    width: 14px;
    height: 14px;
    object-fit: contain;
}

/* ==========================================================================
   ВЕРТИКАЛЬНЫЙ CTA БЛОК (САЙДБАР)
   ========================================================================== */
.cta-vertical {
    background: var(--header-white);
    border-radius: 32px;
    box-shadow: 0 10px 40px rgba(41, 43, 50, 0.04);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    height: 100%;
}

.cta-vertical__content {
    padding: 40px 35px 0 35px;
}

.cta-vertical__title {
    font-family: 'Lato', sans-serif;
    font-size: clamp(24px, 2.5vw, 32px);
    font-weight: 400;
    line-height: 1.2;
    text-transform: uppercase;
    color: var(--header-dark);
    margin: 0;
}

.cta-vertical__icon {
    height: 1.5em;
    width: auto;
}

.cta-vertical__desc {
    font-family: 'Inter', sans-serif;
    font-size: 14px;
    line-height: 1.5;
    color: var(--header-gray);
}
.cta-vertical__desc p:last-child {
    margin-bottom: 0;
}

.cta-vertical__desc strong {
    color: var(--header-dark);
}

.cta-vertical__btn {
    width: 100%;
    display: flex;
    justify-content: center;
    padding: 20px !important;
    font-size: 16px !important;
}

.cta-vertical__image-wrapper {
    margin-top: auto;
    display: flex;
    justify-content: center;
    align-items: flex-end;
    padding-top: 30px;
}

.cta-vertical__doctor-img {
    width: 100%;
    height: auto;
    display: block;
}

/* Адаптив */
@media (max-width: 991.98px) {
    .education-item {
        flex-direction: column;
        gap: 15px;
    }
    .education-item__year-col {
        align-items: flex-start; /* На мобилке "год" выравниваем по левому краю */
        flex-direction: row;
        align-items: baseline;
        gap: 10px;
    }
}

/* ==========================================================================
   ТОЧЕЧНЫЕ ПРАВКИ: CTA И ОБРАЗОВАНИЕ
   ========================================================================== */

/* 1. Делаем линию у конверта в вертикальном CTA короче */
.cta-vertical__title .section-header__line {
    width: 40px !important;
    min-width: 40px !important;
}

/* 2. Оставляем число 06 справа в мобильной версии для блока Образование */
@media (max-width: 991.98px) {
    .education-header .section-header__main-row .section-header__meta {
        float: right !important; /* Прижимаем вправо */
        margin-left: 15px !important; /* Отступ от текста слева */
        margin-right: 0 !important; /* Убираем правый отступ */
    }
}

/* Выравнивание новой SVG стрелочки в таймлайне */
.education-item__arrow-svg {
    height: 1.1em; /* Размер стрелочки пропорционален шрифту */
    width: auto;
    vertical-align: middle;
    /* Легкая коррекция по оси Y, чтобы уголок стоял ровно */
    margin-top: -0.1em; 
}

/* ==========================================================================
   СЕКЦИЯ КОНТАКТЫ (ГЛАВНАЯ СТРАНИЦА)
   ========================================================================== */
.contacts-section {
    margin: 80px 0;
}

/* --- Галерея со свайпом --- */
.contacts-gallery {
    position: relative;
    border-radius: 32px;
    overflow: hidden;
    /* Фиксируем минимальную высоту, чтобы колонки смотрелись ровно */
    min-height: 400px;
}

.contacts-gallery__track {
    display: flex;
    width: 100%;
    height: 100%;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none; /* Скрываем скроллбар в Firefox */
    -ms-overflow-style: none; /* Скрываем скроллбар в IE/Edge */
}
.contacts-gallery__track::-webkit-scrollbar {
    display: none; /* Скрываем скроллбар в Chrome/Safari */
}

.contacts-gallery__slide {
    flex: 0 0 100%; /* Каждый слайд занимает 100% ширины контейнера */
    height: 100%;
    scroll-snap-align: center;
}

.contacts-gallery__slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Стрелочки галереи */
.contacts-gallery__arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 44px;
    height: 44px;
    background: linear-gradient(135deg, #F44847 0%, #F19E57 100%);
    border: none;
    border-radius: 50%;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(244, 72, 71, 0.3);
    z-index: 2;
    transition: transform 0.2s, background 0.2s;
}

.contacts-gallery__arrow:hover {
    transform: translateY(-50%) scale(1.05);
}

.contacts-gallery__arrow--prev { left: 20px; }
.contacts-gallery__arrow--next { right: 20px; }

/* --- Правая колонка: Информация --- */
.contacts-info__title {
    font-family: 'Inter', sans-serif;
    font-size: 20px;
    font-weight: 600;
    color: var(--header-dark);
    margin-bottom: 24px;
}

/* Карточка клиники */
.contact-card {
    background: var(--header-white);
    border-radius: 20px;
    padding: 24px;
    box-shadow: 0 10px 40px rgba(41, 43, 50, 0.04);
    display: flex;
    flex-direction: column;
}

.contact-card__title {
    font-family: 'Inter', sans-serif;
    font-size: 16px;
    font-weight: 600;
    color: var(--header-dark);
    margin: 0 0 8px 0;
}

.contact-card__address {
    font-family: 'Inter', sans-serif;
    font-size: 13px;
    color: var(--header-gray);
    line-height: 1.4;
    margin: 0 0 16px 0;
    flex-grow: 1; /* Прижимает ссылку "На карте" всегда к низу */
}

.contact-card__link {
    font-family: 'Inter', sans-serif;
    font-size: 14px;
    font-weight: 500;
    color: #F44847;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: opacity 0.2s;
}

.contact-card__link:hover {
    opacity: 0.8;
}

.contact-card__link-icon {
    margin-top: -2px;
}

/* Карточка (кнопка) действия: Телефон / Email */
.contact-action-card {
    background: var(--header-white);
    border-radius: 100px; /* Сильное скругление как у кнопки */
    padding: 16px 24px;
    box-shadow: 0 10px 40px rgba(41, 43, 50, 0.04);
    display: inline-flex;
    align-items: center;
    gap: 12px;
    text-decoration: none;
    transition: transform 0.2s, box-shadow 0.2s;
}

.contact-action-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 14px 40px rgba(41, 43, 50, 0.08);
}

.contact-action-card__icon {
    flex-shrink: 0;
}

.contact-action-card__text {
    font-family: 'Inter', sans-serif;
    font-size: 15px;
    font-weight: 500;
    color: var(--header-dark);
    white-space: nowrap;
}

/* Адаптив */
@media (max-width: 991.98px) {
    .contacts-section { margin: 50px 0; }
    .contacts-gallery { min-height: 300px; border-radius: 24px; }
    .contacts-info__group { margin-bottom: 40px !important; }
}

@media (max-width: 575.98px) {
    .contacts-gallery { min-height: 250px; }
    .contacts-gallery__arrow { width: 36px; height: 36px; }
    .contact-action-card { padding: 14px 20px; }
    .contact-action-card__text { font-size: 14px; }
}

/* Удерживаем число и линию справа для заголовка Контактов на мобильных */
@media (max-width: 991.98px) {
    .contacts-header .section-header__main-row .section-header__meta {
        float: right !important; 
        margin-left: 15px !important; 
        margin-right: 0 !important; 
    }
}

/* ==========================================================================
   ОТЗЫВЫ ПАЦИЕНТОВ (ГЛАВНАЯ СТРАНИЦА)
   ========================================================================== */

/* Контейнер трека со свайпом */
.social-reviews__slider {
    margin: 0 -15px; /* Компенсируем отступы контейнера для красивого скролла */
}

.social-reviews__track {
    display: flex;
    gap: 24px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none; /* Прячем скроллбар */
    padding: 15px; /* Даем место для теней карточек */
}

.social-reviews__track::-webkit-scrollbar {
    display: none;
}

/* Слайд (4 на экране ПК) */
.social-reviews__slide {
    flex: 0 0 calc(25% - 18px); /* 100% / 4 минус gap */
    scroll-snap-align: start;
}

/* Сама картинка-скриншот */
.social-reviews__img {
    width: 100%;
    height: auto;
    border-radius: 16px;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.06); /* Легкая тень как на макете */
    background-color: #fff;
    display: block;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.social-reviews__img:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

/* Оранжевые стрелки */
.social-reviews__arrow {
    width: 44px;
    height: 44px;
    background: #FF8A04;
    border: none;
    border-radius: 50%;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: transform 0.2s, background 0.2s;
}

.social-reviews__arrow:hover {
    transform: scale(1.05);
    background: #e07903;
}

/* Кнопка "Все отзывы" (Прозрачная с оранжевой обводкой) */
.btn-outline-primary-large {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    padding: 20px 50px;
    border-radius: 100px;
    border: 1px solid #FF8A04;
    background: transparent;
    font-family: 'Inter', sans-serif;
    font-size: 18px;
    color: var(--header-dark);
    text-decoration: none;
    transition: all 0.3s ease;
}

.btn-outline-primary-large:hover {
    background: #FF8A04;
    color: white;
    box-shadow: 0 8px 24px rgba(243, 107, 77, 0.2);
}

/* Адаптив */
@media (max-width: 991.98px) {
    /* На планшетах показываем по 3 карточки */
    .social-reviews__slide {
        flex: 0 0 calc(33.333% - 16px);
    }
}

@media (max-width: 767.98px) {
    /* На мобилках показываем 1 большую карточку + кусочек следующей */
    .social-reviews__slide {
        flex: 0 0 calc(85%);
    }
    .btn-outline-primary-large {
        width: 100%;
        padding: 20px;
    }
}

/* ==========================================================================
   ТОЧЕЧНЫЕ ПРАВКИ: ОТЗЫВЫ (ФИНАЛЬНЫЙ АДАПТИВ)
   ========================================================================= */

/* Убираем отступы у заголовка в этом блоке, так как их держит flex-шапка */
.social-reviews-header {
    margin-bottom: 0 !important;
}

/* Перемещение числа 07: ПК=справа, Моб=слева */
@media (max-width: 991.98px) {
    /* Для класса .social-reviews-header перебиваем дефолтное float:right */
    .social-reviews-header .section-header__main-row .section-header__meta {
        float: left !important; /* На мобилке "07" уходит налево */
        margin-right: 15px !important; /* Отступ от текста справа */
        margin-left: 0 !important; /* Убираем левый отступ */
        flex-direction: row-reverse !important; /* <--- ДОБАВИЛИ ЭТО (МЕНЯЕТ МЕСТАМИ) */
    }
}

/* ==========================================================================
   ГЛОБАЛЬНЫЕ МОДАЛЬНЫЕ ОКНА (ПОПАПЫ)
   ========================================================================== */

/* Переопределение стандартной обертки Bootstrap */
.custom-modal .modal-content {
    border: none;
    border-radius: 24px;
    overflow: hidden;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
}

.custom-modal__close {
    position: absolute;
    top: 24px;
    right: 24px;
    z-index: 10;
    color: #407CFF; /* Синий цвет крестика как на макете */
    opacity: 0.5;
    transition: opacity 0.2s;
}

.custom-modal__close:hover {
    opacity: 1;
}

/* Левая колонка (Фон доктора) */
.custom-modal__image-col {
    background: linear-gradient(180deg, #EBF3FF 0%, #FFF3EB 100%);
    position: relative;
    min-height: 600px;
}

.custom-modal__doctor-img {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    max-height: 95%; /* Чтобы доктор чуть выступал/не обрезался некрасиво */
    width: auto;
    object-fit: contain;
}

/* Правая колонка (Форма) */
.custom-modal__form-col {
    padding: 40px 50px;
    background-color: #ffffff;
}

.custom-modal__title {
    font-family: 'Inter', sans-serif;
    font-size: 24px;
    font-weight: 600;
    color: var(--header-dark);
}

/* --- Стилизация полей формы --- */
.input-with-icon {
    position: relative;
}

.input-with-icon .input-icon {
    position: absolute;
    left: 16px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 2;
}

.input-with-icon .form-control {
    padding: 16px 16px 16px 48px;
    border-radius: 12px;
    border: 1px solid #E5E7EB;
    font-family: 'Inter', sans-serif;
    font-size: 15px;
    color: var(--header-dark);
    transition: border-color 0.2s;
}

.input-with-icon .form-control:focus {
    border-color: #FF8A04;
    box-shadow: 0 0 0 3px rgba(255, 138, 4, 0.1);
    outline: none;
}

.input-with-icon .form-control::placeholder {
    color: #9CA3AF;
}

/* --- Стилизация чекбоксов --- */
.custom-form__label {
    font-family: 'Inter', sans-serif;
    font-size: 15px;
    font-weight: 500;
    color: var(--header-dark);
    margin-bottom: 16px;
}

.checkbox-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 20px;
    row-gap: 12px;
}

/* Кастомный чекбокс */
.custom-checkbox {
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    user-select: none;
}

.custom-checkbox input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}

.custom-checkbox .checkmark {
    width: 20px;
    height: 20px;
    border: 1px solid #D1D5DB;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: all 0.2s;
}

.custom-checkbox:hover input ~ .checkmark {
    border-color: #9CA3AF;
}

.custom-checkbox input:checked ~ .checkmark {
    background-color: #FF8A04;
    border-color: #FF8A04;
}

/* Галочка внутри чекбокса */
.custom-checkbox .checkmark:after {
    content: "";
    display: none;
    width: 5px;
    height: 10px;
    border: solid white;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
    margin-bottom: 2px;
}

.custom-checkbox input:checked ~ .checkmark:after {
    display: block;
}

.custom-checkbox .checkbox-text {
    font-family: 'Inter', sans-serif;
    font-size: 13px;
    color: var(--header-dark);
    line-height: 1.3;
}

/* Чекбокс согласия (мелкий текст) */
.custom-checkbox--privacy .checkbox-text {
    font-size: 11px;
    color: #6B7280;
}
.custom-checkbox--privacy .checkbox-text a {
    color: #6B7280;
    text-decoration: underline;
}

.custom-form__price {
    font-family: 'Inter', sans-serif;
    font-size: 14px;
    font-weight: 600;
    color: var(--header-dark);
}

/* Адаптив попапа */
@media (max-width: 991.98px) {
    .custom-modal__form-col {
        padding: 30px 20px;
    }
    .checkbox-grid {
        grid-template-columns: 1fr; /* На планшетах и телефонах чекбоксы в одну колонку */
    }
}

/* ==========================================================================
   СТИЛИ ДЛЯ МОДАЛЬНЫХ КАРТ
   ========================================================================== */
.custom-modal__map-wrapper {
    position: relative;
    padding-bottom: 56.25%; /* Пропорция 16:9 */
    height: 0;
    overflow: hidden;
    border-radius: 16px;
    background-color: #f3f4f6; /* Заглушка, пока грузится карта */
}

.custom-modal__map-wrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: none;
}

@media (max-width: 767.98px) {
    /* На телефонах делаем карту чуть более квадратной для удобства */
    .custom-modal__map-wrapper {
        padding-bottom: 75%; 
    }
}

/* ==========================================================================
   СТРАНИЦА: МОЯ КОМАНДА (Только уникальные стили карточек)
   ========================================================================== */

.team-member-block {
    margin-top: 60px;
}

.team-member-card {
    display: flex;
    flex-direction: column;
    align-items: center;
}

/* Скругленная фотография на сером фоне с ЖЕСТКИМИ ПРОПОРЦИЯМИ */
.team-member-card__photo {
    width: 100%;
    /* Добавили жесткую вертикальную пропорцию 3:4 (как на макете) */
    aspect-ratio: 6 / 7; 
    
    border-radius: 24px;
    overflow: hidden;
    margin-bottom: 20px;
    background-color: #F3F4F6; /* Серый фон-заглушка */
}

/* Убедись, что картинка внутри заполняет весь этот прямоугольник без искажений */
.team-member-card__photo img {
    width: 100%;
    height: 100%; /* Картинка тянется на всю высоту блока 3:4 */
    object-fit: cover; /* Идеально вписывается, обрезая лишнее */
    display: block;
}

/* Серая плашка с должностью */
.team-member-card__info {
    width: 100%;
    background: #F8F9FA;
    border-radius: 100px;
    padding: 16px 20px;
    text-align: center;
    margin-bottom: 16px;
}

.team-member-card__role {
    font-family: 'Inter', sans-serif;
    font-size: 15px;
    font-weight: 500;
    color: var(--header-dark);
    margin: 0;
}

/* Ссылка "Смотреть дипломы" */
.team-member-card__link {
    font-family: 'Inter', sans-serif;
    font-size: 14px;
    font-weight: 500;
    color: #F44847; 
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    transition: opacity 0.2s;
}

.team-member-card__link:hover {
    opacity: 0.8;
}

/* ==========================================================================
   ШИРОКОЕ ФОТО КОМАНДЫ (ПЕРЕОПРЕДЕЛЕНИЕ СТАНДАРТНОГО ДОКТОРА)
   ========================================================================== */

.team-hero__doctor {
    width: 58%; /* Занимает всю правую часть от текста до края */
    max-width: none !important; /* Снимаем ограничения одиночного фото */
    right: 0;
    display: flex;
    justify-content: flex-end; /* Прижимаем вправо */
}

.team-hero__doctor img {
    width: 100%;
    height: auto;
    object-fit: contain;
    object-position: bottom right; /* Картинка всегда стоит на нижней линии */
}

/* Адаптив для планшетов и мобилок */
@media (max-width: 991.98px) {
    .team-hero__doctor {
        position: relative !important; /* Ставим фото в общий поток под текст */
        width: 100%;
        margin-top: 30px;
        bottom: auto;
        right: auto;
    }
    .team-hero__doctor img {
        object-position: bottom center; /* Центрируем команду на телефоне */
    }
}

/* ==========================================================================
   БЛОГ (ЖУРНАЛ ДОКТОРА)
   ========================================================================== */

/* Сайдбар - Блок соцсетей */
.sidebar-block {
    background: #FFFFFF;
    border-radius: 32px;
    padding: 33px;
    box-shadow: 0 10px 40px rgba(41, 43, 50, 0.04);
}

.sidebar-block  h3 {
 font-size: 34px;
}
.sidebar-socials__btn {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    background: #F3F4F6;
    padding: 12px 24px;
    border-radius: 100px;
    color: var(--header-dark);
    text-decoration: none;
    font-weight: 500;
    font-family: 'Inter', sans-serif;
    font-size: 15px;
    transition: background 0.2s, transform 0.2s;
}

.sidebar-socials__btn:hover {
    background: #E5E7EB;
    color: var(--header-dark);
    transform: translateY(-2px);
}

.sidebar-socials__note {
    font-size: 11px;
    color: #9CA3AF;
    margin: 24px 0 0 0;
    font-family: 'Inter', sans-serif;
}

/* Размеры контейнера для иконок сайдбара */
.sidebar-socials__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    flex-shrink: 0;
}

.sidebar-socials__icon svg {
    width: 100%;
    height: 100%;
}

/* 1. Цветной Telegram */
.sidebar-socials__btn--tg .sidebar-socials__icon svg path {
    fill: #27A7E7 !important; /* Фирменный синий цвет Telegram */
}

/* 2. Цветной Instagram (Делаем градиент или фирменный оранжевый) */
.sidebar-socials__btn--ig .sidebar-socials__icon svg path {
    fill: #FF8A04 !important; /* Оранжевый цвет бренда */
}

/* 3. Цветной VK (если вдруг понадобится) */
.sidebar-socials__btn--vk .sidebar-socials__icon svg path {
    fill: #0077FF !important; /* Синий цвет ВКонтакте */
}

/* Убедимся, что stroke (обводки), если они есть, отключены, как в подвале */
.sidebar-socials__icon svg path,
.sidebar-socials__icon svg rect,
.sidebar-socials__icon svg circle {
    stroke: none !important;
}

/* Карточка поста в списке */
.blog-card {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.blog-card__img-wrap {
    border-radius: 24px;
    overflow: hidden;
    margin-bottom: 24px;
    aspect-ratio: 4 / 5;
    background: #F3F4F6;
    display: block;
}

.blog-card__img-wrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.4s ease;
}

.blog-card:hover .blog-card__img-wrap img {
    transform: scale(1.05);
}

.blog-card__date {
    font-family: 'Inter', sans-serif;
    font-size: 13px;
    color: #9CA3AF;
    margin-bottom: 12px;
}

.blog-card__title {
    font-family: 'Inter', sans-serif;
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 12px;
    line-height: 1.3;
}

.blog-card__title a {
    color: var(--header-dark);
    text-decoration: none;
    transition: color 0.2s;
}

.blog-card__title a:hover {
    color: #F44847;
}

.blog-card__excerpt {
    font-family: 'Inter', sans-serif;
    font-size: 15px;
    color: var(--header-gray);
    line-height: 1.5;
    margin-bottom: 24px;
}

/* Переиспользуем стиль тегов из услуг/клиентов */
.blog-card__tag {
    display: inline-block;
    padding: 8px 16px;
    border: 1px solid #E5E7EB;
    border-radius: 100px;
    font-family: 'Inter', sans-serif;
    font-size: 12px;
    text-transform: uppercase;
    color: var(--header-gray);
    letter-spacing: 0.5px;
}

/* Адаптив для сайдбара на телефонах */
@media (max-width: 991.98px) {
    .blog-sidebar {
        position: relative !important;
        top: 0 !important;
        margin-top: 40px;
    }
    .sidebar-block {
        padding: 30px;
    }
}

/* ==========================================================================
   ФИКС ПЕРЕНОСА СТРОК ДЛЯ ДЛИННЫХ ЗАГОЛОВКОВ (НА ВСЕХ ЭКРАНАХ)
   ========================================================================== */

/* 1. Отключаем жесткие колонки Flexbox (перебиваем класс d-flex из PHP) */
.section-header__main-row {
    display: block !important; 
}

/* 2. Делаем число и линию "плавающими" слева, чтобы текст их обтекал */
.section-header--meta-left .section-header__main-row .section-header__meta {
    float: left;
    margin-right: 24px;   /* Отступ от цифры до начала текста */
    margin-top: 0.25em;   /* Выравниваем линию ровно по центру первой строки */
}

/* 3. Делаем число и линию "плавающими" справа (для других блоков) */
.section-header--meta-right .section-header__main-row .section-header__meta {
    float: right;
    margin-left: 24px;
    margin-top: 0.25em;
}

/* 4. Заставляем сам текст вести себя как обычный абзац */
.section-header__text {
    display: inline; 
}

/* --- КАСТОМНЫЕ БЛОКИ ИЗ РЕДАКТОРА --- */
.editor-content .dn-orange-border {
    border: 1px solid #FF8A04;
    border-radius: 24px;
    padding: 32px 40px;
    background: #FFFFFF;
    margin: 40px 0 32px 0;
}

.editor-content .dn-gradient-box {
    background: linear-gradient(180deg, #F3F6FA 0%, #F9FBFC 100%);
    border-radius: 24px;
    padding: 32px 40px;
    margin-top: 40px;
    margin-bottom: 32px;
}

/* Адаптив для блоков */
@media (max-width: 767.98px) {
    .editor-content .dn-orange-border,
    .editor-content .dn-gradient-box {
        padding: 24px 20px;
    }
}

/* --- СТАНДАРТНАЯ ЦИТАТА (blockquote) --- */
.editor-content blockquote {
    position: relative;
    background: #FFFFFF;
    border: none; /* Убрали оранжевую рамку! */
    box-shadow: 0 10px 40px rgba(41, 43, 50, 0.04); /* Фирменная тень твоей темы */
    border-radius: 24px;
    padding: 32px 40px 32px 80px;
   margin: 40px 0 32px 0;
}

.editor-content blockquote::before {
    content: '';
    position: absolute;
    left: 32px;
    top: 36px;
    width: 24px;
    height: 24px;
    background-image: url('./template-parts/svg/double_quotes.svg'); 
    background-repeat: no-repeat;
    background-size: contain;
}

.editor-content blockquote p {
    margin: 0;
    font-size: 16px;
    color: var(--header-dark);
}

/* Адаптив цитаты перенеси в общий медиазапрос внизу, если его там нет: */
@media (max-width: 767.98px) {
    .editor-content blockquote {
        padding: 24px 20px 24px 55px;
    }
    .editor-content blockquote::before {
        left: 20px;
        top: 28px;
    }
}
/* --- Списки --- */
.editor-content ul {
    list-style: none;
    padding-left: 0;
    margin-bottom: 32px;
}

.editor-content ul li {
    position: relative;
    padding-left: 24px;
    margin-bottom: 16px;
    line-height: 1.6;
}

/* Оранжевая точка для неупорядоченного списка */
.editor-content ul li::before {
    content: '';
    position: absolute;
    left: 0;
    top: 10px;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background-color: #FF8A04; 
}

.editor-content ol {
    list-style: none;
    counter-reset: dn-counter;
    padding-left: 0;
    margin-bottom: 32px;
}

.editor-content ol li {
    position: relative;
    padding-left: 32px;
    margin-bottom: 16px;
    counter-increment: dn-counter;
    line-height: 1.6;
}

/* Серая курсивная цифра для нумерованного списка */
.editor-content ol li::before {
    content: counter(dn-counter);
    position: absolute;
    left: 0;
    top: 0;
    font-family: 'Inter', sans-serif;
    font-style: italic;
    font-size: 18px;
    color: #9CA3AF; 
}

/* --- Таблицы --- */
.editor-content table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 32px;
    background: #FFFFFF;
    border-radius: 16px;
    overflow: hidden;
}

.editor-content table th,
.editor-content table td {
    padding: 16px 24px;
    border-bottom: 1px solid #E5E7EB;
    text-align: left;
    font-size: 15px;
}

.editor-content table th {
    font-weight: 500;
    color: var(--header-dark);
    background: #F8F9FA;
}

.editor-content table tr:last-child td {
    border-bottom: none;
}

/* --- Заголовки внутри текста (Блог, Статьи) --- */
.editor-content h2 {
    margin: 56px 0 24px 0; /* Большой отступ сверху, средний снизу */
    line-height: 1.3;
}

.editor-content h3 {
    margin: 48px 0 20px 0;
    line-height: 1.3;
}

.editor-content h4 {
    font-family: 'Inter', sans-serif;
    font-size: 22px;
    font-weight: 600;
    margin: 40px 0 16px 0;
    line-height: 1.4;
    color: var(--header-dark);
}

/* Железобетонное правило: самый первый элемент в тексте не должен иметь отступа сверху, 
   чтобы контент начинался ровно по линии */
.editor-content > *:first-child {
    margin-top: 0 !important;
}

.section-paddin {
 padding: 40px 0px 40px 0px;
}

/* --- Дипломы и Сертификаты --- */
.diploma-img {
    width: 100%;
    aspect-ratio: 3 / 2; /* Пропорция листа А4 (вертикальная) */
    object-fit: cover;   /* Ровно заполняет прямоугольник */
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05); /* Легкая тень */
    background-color: #F8F9FA;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.diploma-img:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
}

/* Делаем ссылку-контейнер основой для позиционирования */
.header__social-link--inst {
    position: relative !important;
    display: inline-flex !important;
}

/* Выносим звездочку в правый верхний угол */
.header__social-link--inst .header__social-disclaimer {
    position: absolute !important;
    top: -6px;       /* Регулируй высоту здесь */
    right: -8px;     /* Регулируй вынос вправо здесь */
    color: #ff0000;  /* Красный цвет как в подвале */
    font-size: 14px; /* Размер шрифта */
    font-weight: 700;
    line-height: 1;
    pointer-events: none; /* Чтобы клик проходил сквозь звездочку на иконку */
}



/* Стили для текстового дисклеймера в мобильном меню */
.header__disclaimer-text {
    font-size: 12px;           /* Маленький размер шрифта */
    line-height: 1.2;
    color: #6c757d;            /* Серый цвет, чтобы не отвлекал */
    opacity: 0.8;
    padding: 0 15px;  

}

/* На мобильных устройствах центрируем текст */
@media (max-width: 991px) {
    .header__disclaimer-text {
        text-align: center;
        margin-top: 15px;
    }
}

/* Мобильное меню (хедер) — цветные иконки на белом фоне */
.header__social-icon {
    --vk-icon-bg: #0077FF;
    --vk-icon-color: #ffffff;
}

/* Подвал (футер) — белые иконки (например, на темном фоне) */
.footer__social-icon {
    --vk-icon-bg: #ffffff; /* Белый круг */
    --vk-icon-color: #333333; /* Темный логотип внутри или прозрачный */
}

/* Если в подвале нужен просто белый контур без круга */
.footer__social-icon svg rect {
    display: none; /* Скрываем синий круг в подвале */
}
.footer__social-icon svg path {
    fill: #ffffff; /* Делаем саму букву белой */
}

/* Контейнер для копирайта */
.footer__credits {
    text-align: center;
    padding-top: 20px;
    margin-top: 20px;
    border-top: 1px solid rgba(255, 255, 255, 0.05);
    /* Еле заметная линия-разделитель */
}

/* Ссылка с анимацией */
.footer__copyright-link {
    font-size: 13px;
    font-weight: 400;
    letter-spacing: 0.5px;
    text-decoration: none;
    display: inline-block;

    /* Создаем градиент, который будем двигать */
    background: linear-gradient(to right,
            #7C8498 0%,
            #7C8498 40%,
            #F19E57 50%,
            #7C8498 60%,
            #7C8498 100%);
    background-size: 200% auto;

    /* Маскируем градиент текстом */
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;

    /* Запускаем бесконечную анимацию перелива */
    animation: shine 4s linear infinite;
    transition: all 0.3s ease;
    opacity: 0.8;
}

/* Эффект при наведении */
.footer__copyright-link:hover {
    opacity: 1;
    transform: translateY(-1px);
    /* При ховере можно сделать текст чуть ярче */
    text-shadow: 0 0 15px rgba(241, 158, 87, 0.2);
}

/* Сама анимация движения градиента */
@keyframes shine {
    to {
        background-position: 200% center;
    }
}

/* На мобилках делаем чуть проще, чтобы не нагружать процессор */
@media (max-width: 767.98px) {
    .footer__credits {
        margin-top: 15px;
        padding-top: 15px;
    }
}