/********** Стоматологические туры в Хэйхэ — кастомные стили **********/
/* База адаптирована из шаблона DentCare (HTML Codex), переработана и локализована. */

:root {
    --primary: #06A3DA;     /* основной (бирюзово-синий) */
    --secondary: #F57E57;   /* акцент (коралловый) */
    --light: #EEF9FF;
    --dark: #091E3E;
}

/* Шрифты: Rubik — текст, Montserrat — заголовки/бренд. Self-hosted (vendor/fonts), с системным фолбэком. */
body {
    font-family: 'Rubik', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
        "Helvetica Neue", Arial, "Noto Sans", sans-serif;
    color: #555;
}

h1, h2, h3, h4, h5, h6, .navbar-brand, .brand-name, .btn, .section-title h5 {
    font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
        "Helvetica Neue", Arial, "Noto Sans", sans-serif;
}

h1, h2, .font-weight-bold { font-weight: 700 !important; }
h3, h4, .font-weight-semi-bold { font-weight: 600 !important; }
h5, h6, .font-weight-medium { font-weight: 500 !important; }

.text-primary { color: var(--primary) !important; }
.bg-primary { background-color: var(--primary) !important; }
.bg-light { background-color: var(--light) !important; }
.bg-dark { background-color: var(--dark) !important; }

.btn { font-weight: 600; transition: .5s; }
.btn-primary, .btn-secondary { color: #FFFFFF; }
.btn-primary { background: var(--primary); border-color: var(--primary); }
.btn-secondary { background: var(--secondary); border-color: var(--secondary); }
.btn-primary:hover { background: var(--secondary); border-color: var(--secondary); }
.btn-secondary:hover { background: var(--primary); border-color: var(--primary); }

.btn-square { width: 36px; height: 36px; }
.btn-sm-square { width: 28px; height: 28px; }
.btn-lg-square { width: 46px; height: 46px; }
.btn-square, .btn-sm-square, .btn-lg-square {
    padding-left: 0; padding-right: 0; text-align: center;
}

/* Спиннер загрузки */
#spinner {
    opacity: 0; visibility: hidden;
    transition: opacity .5s ease-out, visibility 0s linear .5s;
    z-index: 99999;
}
#spinner.show {
    transition: opacity .5s ease-out, visibility 0s linear 0s;
    visibility: visible; opacity: 1;
}

.back-to-top { position: fixed; display: none; right: 45px; bottom: 45px; z-index: 99; }

/* Плавающие кнопки мессенджеров (стек в правом нижнем углу) */
.float-btn {
    position: fixed; right: 45px; z-index: 99;
    width: 56px; height: 56px; border-radius: 50%;
    color: #fff; display: flex; align-items: center; justify-content: center;
    box-shadow: 0 4px 14px rgba(0,0,0,.25); transition: .3s; overflow: hidden;
}
.float-btn:hover { color: #fff; transform: scale(1.08); }
.float-tg  { bottom: 110px; background: #229ED9; font-size: 28px; }
.float-max { bottom: 175px; background: #fff; padding: 0; }
.float-max img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* Иконка MAX внутри текстовой кнопки (контакты) */
.max-ico { width: 22px; height: 22px; border-radius: 5px; vertical-align: middle; }

/* Кнопка-логотип MAX в подвале (квадрат со скруглением) */
.social-max {
    display: inline-flex; width: 46px; height: 46px; padding: 0; overflow: hidden;
    transition: .3s;
}
.social-max img { width: 100%; height: 100%; object-fit: cover; display: block; }
.social-max:hover { transform: scale(1.06); }

@media (max-width: 576px) {
    .float-btn, .back-to-top { right: 20px; }
    .float-tg  { bottom: 84px; }
    .float-max { bottom: 149px; }
}

.top-shape::before {
    position: absolute; content: ""; width: 35px; height: 100%;
    top: 0; left: -17px; background: var(--primary); transform: skew(40deg);
}

/* Навигация */
.navbar-light .navbar-nav .nav-link {
    padding: 30px 12px; font-size: 17px; color: var(--dark);
    outline: none; transition: .5s;
}
.sticky-top.navbar-light .navbar-nav .nav-link { padding: 20px 12px; }
.navbar-light .navbar-nav .nav-link:hover,
.navbar-light .navbar-nav .nav-link.active { color: var(--primary); }

@media (max-width: 991.98px) {
    .navbar-light .navbar-nav .nav-link,
    .sticky-top.navbar-light .navbar-nav .nav-link { padding: 10px 0; }
}

/* Карусель / hero */
.carousel-caption {
    top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(9, 30, 62, .80); z-index: 1;
}
@media (max-width: 576px) {
    .carousel-caption h5 { font-size: 14px; font-weight: 500 !important; }
    .carousel-caption h1 { font-size: 28px; font-weight: 600 !important; }
}
.carousel-control-prev, .carousel-control-next { width: 8%; }
.carousel-control-prev-icon, .carousel-control-next-icon { width: 3rem; height: 3rem; }

/* Заголовки секций (без декоративных чёрточек) */
.section-title h5 { display: inline-block; letter-spacing: 1px; }

/* Карточки услуг */
.service-item { transition: .5s; }
.service-item img, .service-item .bg-light,
.service-item .bg-light h5, .team-item .team-text { transition: .5s; }
.service-item:hover img { transform: scale(1.15); }
.team-item .team-text::after, .service-item .bg-light::after {
    position: absolute; content: ""; top: 50%; bottom: 0; left: 15px; right: 15px;
    border-radius: 100px / 15px; box-shadow: 0 0 15px rgba(0, 0, 0, .7);
    opacity: 0; transition: .5s; z-index: -1;
}
.team-item:hover .team-text::after, .service-item:hover .bg-light::after { opacity: 1; }

/* Иконка-кружок для блоков "почему мы" / "этапы" */
.feature-ico {
    width: 64px; height: 64px; border-radius: 50%;
    background: var(--light); color: var(--primary); font-size: 28px;
    display: flex; align-items: center; justify-content: center;
}
.step-num {
    width: 44px; height: 44px; border-radius: 50%;
    background: var(--primary); color: #fff; font-weight: 700; font-size: 18px;
    display: flex; align-items: center; justify-content: center; flex: 0 0 auto;
}

/* Предупреждение о противопоказаниях (ст. 24 38-ФЗ «О рекламе») */
.med-warning {
    display: inline-flex;
    align-items: center;
    font-size: 13px;
    font-weight: 600;
    color: var(--secondary);
    background: rgba(245, 126, 87, .1);
    border: 1px solid rgba(245, 126, 87, .35);
    border-radius: 8px;
    padding: 6px 14px;
}

/* Таблица цен */
.price-table th { background: var(--dark); color: #fff; }
.price-table tbody tr:hover { background: var(--light); }
.price-hl { color: #1a9c4f; font-weight: 700; }

/* Аккордеон FAQ */
.accordion-button:not(.collapsed) { color: var(--primary); background: var(--light); }
.accordion-button:focus { box-shadow: none; border-color: var(--primary); }

/* Формы */
.form-control:focus { border-color: var(--primary); box-shadow: 0 0 0 .15rem rgba(6,163,218,.15); }

/* Сообщение об успешной отправке */
#formAlert { display: none; }

/* Фото в hero-карусели — фиксированная высота, чтобы кадры не «прыгали» */
.hero-img {
    height: 620px;
    object-fit: cover;
    object-position: center;
}
@media (max-width: 768px) {
    .hero-img { height: 440px; }
}

/* Галерея клиники */
.gallery-item {
    position: relative;
    overflow: hidden;
    border-radius: 12px;
    box-shadow: 0 8px 24px rgba(9, 30, 62, .12);
}
.gallery-item img {
    width: 100%;
    height: 280px;
    object-fit: cover;
    display: block;
    transition: transform .6s ease;
}
.gallery-item:hover img { transform: scale(1.06); }
.gallery-item::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(9, 30, 62, .55), rgba(9, 30, 62, 0) 45%);
    pointer-events: none;
}
.gallery-cap {
    position: absolute;
    left: 18px;
    bottom: 16px;
    z-index: 2;
    color: #fff;
    font-weight: 600;
    font-size: 15px;
    display: inline-flex;
    align-items: center;
}
@media (max-width: 768px) {
    .gallery-item img { height: 220px; }
}

/* Логотип бренда в шапке и подвале */
.brand-logo {
    height: 50px; width: 50px; border-radius: 10px;
    object-fit: cover; flex: 0 0 auto;
}
.brand-text { line-height: 1.05; }
.brand-name {
    display: block; font-weight: 700; font-size: 22px; color: var(--primary);
}
.brand-sub {
    display: block; font-size: 12px; color: var(--dark); letter-spacing: .3px;
}
@media (max-width: 380px) {
    .brand-name { font-size: 18px; }
    .brand-sub { font-size: 11px; }
    .brand-logo { height: 42px; width: 42px; }
}

/* Фото-отзывы (до/после) */
.review-photo { position: relative; }
.review-photo img {
    width: 100%; height: 210px; object-fit: cover; display: block;
}
.review-badge {
    position: absolute; top: 12px; left: 12px;
    background: rgba(9, 30, 62, .82); color: #fff;
    font-size: 12px; font-weight: 600; padding: 4px 10px; border-radius: 20px;
    display: inline-flex; align-items: center;
}