:root{
  /* шкала */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;

  /* флюидный интервал между секциями */
  --space-section: clamp(32px, 6vw, 80px);

  --panel:#f6f8f9;
  --surface:#fff;
  --text:#111;
  --muted:#667085;
  --accent:#03d3dd;
  --ring: rgba(3,211,221,.45);
  --header-height: 88px;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

/* контейнер страницы */
.container{
  max-width: 1200px;
  padding-inline: 16px;
  margin-inline: auto;
}

/* секции верхнего уровня */
.section{
  background: var(--panel);
  border-radius: 16px;
  padding: var(--space-6);
}

/* отступ ТОЛЬКО между соседними секциями */
.section + .section{
  margin-block-start: var(--space-section);
}

/* вариации плотности */
.section--tight + .section{ margin-block-start: clamp(24px, 4vw, 48px); }
.section--loose + .section{ margin-block-start: clamp(40px, 8vw, 120px); }

/* внутренний ритм: стек */
.stack{ display:flex; flex-direction:column; gap: var(--space-5); }

/* анти-коллапс: у типографики внутри секций нет внешних марджинов */
.section :where(h1,h2,h3,h4,h5,h6,p,ul,ol,figure){ margin: 0; }
.section :where(.stack > * + *){ /* на случай, если не хочешь отдельный класс */
  /* оставить, если не используешь .stack */
}

/* универсальная вертикальная «прослойка» для редких мест */
.space-y-6 > * + * { margin-top: var(--space-6); }

/* лёгкий разделитель по модификатору */
.section--divided{
  position: relative;
  padding-top: calc(var(--space-6) + 16px);
}
.section--divided::before{
  content:"";
  position:absolute;
  inset: 0 auto auto 0;
  height: 16px; width: 100%;
  top: 0;
  background: linear-gradient(to bottom, rgba(0,0,0,.06), transparent);
  border-top-left-radius: 16px; border-top-right-radius:16px;
}

/* карточки внутри секции строим через gap, не margin */
.card-grid{ display:grid; gap: var(--space-5); }
@media (min-width: 960px){ .card-grid{ grid-template-columns: repeat(3,1fr); } }

/* доступность для кнопок (раз уж рядом): */
.btn:focus{ outline: 3px solid var(--ring); outline-offset: 2px; }

/* адаптив секций */
@media (max-width: 768px){
  .section{ padding: var(--space-5); }
}
/* Общие стили */
body {
    font-family: 'Inter', sans-serif;
    color: #2B2B2B;
    background-color: white;
    margin: 0;
    padding: 0;
    line-height: 1.6;
}

main {
    padding-top: var(--header-height);
}

.page-about main {
    padding-top: calc(var(--header-height) + 32px);
}

/* --- Стили для новой шапки сайта --- */
.site-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 5000;
    min-height: var(--header-height);
    background: rgba(255, 255, 255, 0.85);
    backdrop-filter: blur(12px);
    box-shadow: 0 1px 12px rgba(0, 0, 0, 0.05);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.3s ease, box-shadow 0.3s ease;
}

.site-header .container {
    max-width: 1280px;
    width: 100%;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    padding: 0 32px;
    gap: 20px;
    min-height: var(--header-height);
}

/* 2. Логотип и типографика */
.logo {
    display: flex;
    align-items: center;
    gap: 12px;
    justify-self: start;
}

.logo img {
    height: 40px;
}

.logo span {
    font-family: 'Montserrat', sans-serif;
    font-weight: 600; /* Semibold */
    font-size: 18px;
    color: #0b1220;
    letter-spacing: 0.3px;
}

.logo-text {
    display: flex;
    flex-direction: column;
}

.logo-title {
    font-family: 'Montserrat', sans-serif;
    font-weight: 600;
    font-size: 18px;
    color: #0b1220;
    letter-spacing: 0.3px;
}

.logo-phone {
    font-size: 16px;
    font-weight: 700;
    color: #0b1220;
    text-decoration: none;
    white-space: nowrap;
}

/* 3. Навигация */
.nav {
    display: flex;
    gap: 40px;
    justify-content: center;
    justify-self: center;
}

.nav a {
    font-family: 'Inter', sans-serif;
    font-weight: 500;
    font-size: 16px;
    color: #0b1220;
    text-decoration: none;
    position: relative;
    padding-bottom: 4px;
    transition: color 0.2s ease;
    text-align: center;
}

.nav a:hover {
    color: #03d3dd;
}

.nav a::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 0;
    height: 2px;
    background: #03d3dd;
    transition: width 0.2s ease;
}

.nav a:hover::after,
.nav a.active::after {
    width: 100%;
}

.nav a.active {
    color: #03d3dd;
}

/* 4. Кнопки и действия */
.actions {
    display: flex;
    align-items: center;
    gap: 24px;
    justify-self: end;
    flex-shrink: 0;
}

.phone {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 18px;
    font-weight: 700;
    color: #0b1220;
    text-decoration: none;
    transition: color 0.2s ease;
    white-space: nowrap;
}

.phone:hover {
    color: #03d3dd;
}

.phone-icon {
    stroke: currentColor;
}

.nav-call-button{
    display: none;
    white-space: nowrap;
}

@media (max-width: 768px){
    .nav-call-button{
        display: none;
    }

    .site-header .actions{
        margin-left: 0;
    }
}

@media (max-width: 640px){
    .nav-call-button{
        display: inline-flex;
        align-items: center;
        justify-content: center;
        padding: 4px 12px !important;
        font-size: 18px !important;
        line-height: 1.1;
        border-radius: 999px;
        height: 32px;
        flex-shrink: 0;
        box-shadow: 0 2px 8px rgba(3, 211, 221, 0.3);
        max-width: 120px;
        margin-right: 8px;
    }
}

.btn-primary {
    background: radial-gradient(circle at 30% 120%, #05e0ef, #03d3dd 70%);
    color: #fff;
    border: none;
    border-radius: 999px;
    padding: 12px 26px;
    font-weight: 600;
    font-size: 16px;
    cursor: pointer;
    transition: all 0.15s ease;
    box-shadow: 0 4px 14px rgba(3, 211, 221, 0.3);
}

.btn-primary:hover {
    background: #02bccc;
    transform: translateY(-1px);
    box-shadow: 0 6px 20px rgba(3, 211, 221, 0.4);
}


/* 7. Мобильная версия (заготовка) */
.burger-menu {
    display: none; /* Скрываем на десктопе */
    flex-direction: column;
    justify-content: space-around;
    width: 24px;
    height: 24px;
    background: transparent;
    border: none;
    cursor: pointer;
    padding: 0;
    z-index: 10;
    position: relative;
    align-items: center;
    color: #0b1220;
    transition: width 0.2s ease, height 0.2s ease;
    flex-shrink: 0;
}

.burger-menu span {
    width: 24px;
    height: 2px;
    background: #0b1220;
    border-radius: 10px;
    transition: all 0.3s linear;
    position: relative;
    transform-origin: center;
}

.burger-menu__close-icon {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 24px;
    height: 24px;
    pointer-events: none;
    opacity: 0;
    transform: translate(-50%, -50%) scale(0.65);
    transform-origin: center;
    transition: opacity 0.2s ease, transform 0.2s ease;
}

.burger-menu__close-icon rect {
    fill: currentColor;
}

.burger-menu.is-active span:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
}

.burger-menu.is-active span:nth-child(2) {
    opacity: 0;
}

.burger-menu.is-active span:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
}


h1, h2, h3 {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
}

@media (min-width: 769px) {
    h2 {
        font-size: 1.25em;
        line-height: 1.35;
    }
}

.section-title {
    text-align: center;
    font-size: 1.25em;
    margin-bottom: 40px;
}

main > *:not(section[class]) {
    padding: 60px 20px;
    max-width: 1200px;
    margin: 0 auto;
}
main > section:not(.section):not(.full-width-bg) {
    padding: 60px 20px;
    max-width: 1200px;
    margin: 0 auto;
}

main > .prices-section {
    padding-top: 12px;
}

/* Кнопки */
.cta-button {
    padding: 15px 30px;
    border: none;
    border-radius: 5px;
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    cursor: pointer;
    font-size: 1em;
}

.cta-button.primary {
    background-color: #03d3dd;
    color: white;
}

.cta-button.primary:hover {
    opacity: 0.9;
}

.cta-button.secondary {
    background-color: #F5F6F8;
    color: #2B2B2B;
    border: 1px solid #03d3dd;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.cta-button.secondary:hover {
    background-color: #e0e0e0;
}

.consent-checkbox{
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 14px;
    color: #2B2B2B;
    margin: 12px 0 0;
    user-select: none;
}

.consent-checkbox input[type="checkbox"]{
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
}

.consent-checkbox__box{
    width: 18px;
    height: 18px;
    border: 2px solid #03d3dd;
    border-radius: 6px;
    background: #fff;
    transition: background-color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
    flex-shrink: 0;
    display: inline-block;
    position: relative;
}

.consent-checkbox input[type="checkbox"]:focus-visible + .consent-checkbox__box{
    box-shadow: 0 0 0 3px rgba(3, 211, 221, 0.25);
}

.consent-checkbox input[type="checkbox"]:checked + .consent-checkbox__box{
    background-color: #03d3dd;
    border-color: #03d3dd;
}

.consent-checkbox__box::after{
    content: "";
    position: absolute;
    width: 6px;
    height: 12px;
    border-right: 2px solid #fff;
    border-bottom: 2px solid #fff;
    top: 0;
    left: 5px;
    transform: rotate(45deg);
    opacity: 0;
    transition: opacity 0.2s ease;
}

.consent-checkbox input[type="checkbox"]:checked + .consent-checkbox__box::after{
    opacity: 1;
}

.consent-checkbox__text{
    line-height: 1.45;
}

.consent-checkbox--modal{
    font-size: 0.9em;
    color: #4a4a4a;
    margin-top: -5px;
    gap: 8px;
}

.consent-checkbox--modal .consent-checkbox__box{
    width: 16px;
    height: 16px;
}

.consent-checkbox--modal .consent-checkbox__box::after{
    width: 5px;
    height: 10px;
    left: 4px;
    top: -0.5px;
}

/* Hero секция */
.hero {
    background-image: url('assets/hero-background.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    padding: 60px 20px; /* Увеличим отступы для лучшего вида */
    text-align: center;
    position: relative;
    color: #2B2B2B; /* Сделаем текст темным для контраста */
}

.hero::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(255, 255, 255, 0.75); /* Осветляющий слой */
    z-index: 1;
}

.hero > * {
    position: relative;
    z-index: 2; /* Выносим контент поверх затемняющего слоя */
}

.hamburger-menu {
    position: fixed;
    top: 20px;
    left: 20px;
    width: 40px;
    height: 30px;
    background: none;
    border: none;
    cursor: pointer;
    z-index: 1001;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
}

.hamburger-menu span {
    display: block;
    width: 100%;
    height: 4px;
    background-color: #2B2B2B;
    border-radius: 2px;
    transition: transform 0.3s ease, opacity 0.3s ease;
}

.main-nav {
    position: fixed;
    top: 0;
    left: -100%; /* Скрыто за экраном */
    width: 300px;
    height: 100%;
    background-color: white;
    box-shadow: 2px 0 10px rgba(0,0,0,0.1);
    transition: left 0.4s ease;
    z-index: 1000;
    padding-top: 80px;
}

.main-nav.is-open {
    left: 0;
}

.main-nav ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column; /* Вертикальное меню */
    align-items: center;
    gap: 25px;
}

.main-nav a {
    text-decoration: none;
    color: #2B2B2B;
    font-weight: 700;
}

.hero-content {
    max-width: 800px;
    margin: 0 auto;
}

.hero-title {
    font-size: 3em;
    margin-bottom: 20px;
}

@media (min-width: 769px){
  .page-home .hero,
  .page-vyvod .hero,
  .page-kodirovanie .hero,
  .page-snyatie-pohmelya .hero{
    padding-top: calc(var(--header-height) + 40px);
  }
}

.hero-title .hero-location{
    display: inline-flex;
    align-items: center;
    gap: 12px;
    font-size: 0.6em;
    text-transform: none;
    font-weight: 600;
    margin-block: 16px;
    padding-block: 4px;
}

.hero-title .hero-location img{
    width: 72px;
    height: auto;
}

.hero-title .hero-location__text{
    display: inline-block;
    line-height: 1.4;
}

h2.hero-subtitle {
    font-family: 'Inter', sans-serif;
    font-weight: 400;
}

.hero-subtitle {
    font-size: 1.4em;
    margin-bottom: 30px;
    color: #2B2B2B;
}

.hero-buttons {
    display: flex;
    justify-content: center;
    gap: 20px;
    margin-bottom: 20px;
}

.hero-cta-note {
    font-size: 0.9em;
    margin-bottom: 4px;
}

/* Секция Услуги (Новые стили) */
.services {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

.service-card {
    position: relative; /* Для позиционирования контента */
    border-radius: 20px;
    box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.05);
    padding: 30px;
    display: flex;
    flex-direction: column;
    /* justify-content: flex-end; */ /* Этот стиль мешал выравниванию, закомментировал */
    border: 2px solid transparent;
    transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
    min-height: 400px; /* Задаем высоту карточки */
    overflow: hidden; /* Скрываем все, что выходит за пределы */
    color: white; /* Делаем текст белым */
}

.service-card:hover {
    transform: translateY(-10px); /* Эффект приподнимания */
    box-shadow: 0px 8px 20px rgba(0, 0, 0, 0.1);
    border-color: #03d3dd; /* Рамка цвета тиффани */
}

/* Уникальные стили для карточек */
.service-card:nth-child(2) { /* Снятие похмелья */
    background: linear-gradient(to bottom, white, #f0fdfa);
}

.service-card:nth-child(3) { /* Кодирование */
    border: 2px solid #03d3dd;
}

.service-card__icon {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}

.service-card__icon img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* Масштабируем изображение */
    transition: transform 0.4s ease;
}

/* Смещаем фон для первой карточки, чтобы люди были по центру */
.service-card:nth-child(1) .service-card__icon img {
    object-position: 30% 50%; /* Сдвигаем по горизонтали */
}

.service-card:hover .service-card__icon img {
    transform: scale(1.05); /* Легкое увеличение при наведении */
}

/* Затемняющий слой для читаемости текста */
.service-card::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%; /* Градиент на всю высоту */
    background: linear-gradient(to top, rgba(0,0,0,0.55), rgba(0,0,0,0.05));
    z-index: 2;
    transition: background 0.3s ease;
}

.service-card:hover::after {
    background: linear-gradient(to top, rgba(0,0,0,0.65), rgba(0,0,0,0.1));
}

/* Выносим весь контент поверх фона и затемнения */
.service-card__title,
.service-card__subtitle,
.service-card__benefits-list,
.service-card__price,
.service-card__accent-line,
.service-card__cta {
    position: relative;
    z-index: 3;
    text-shadow: 0px 1px 6px rgba(0, 0, 0, 0.5);
    color: #fff; /* Устанавливаем белый цвет для всех текстовых элементов */
}

.service-card__title {
    font-family: 'Montserrat', sans-serif;
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 10px;
}

.service-card__subtitle {
    font-size: 1em;
    margin-bottom: 20px;
    font-weight: 500;
}

.service-card__benefits-list {
    list-style: none;
    padding: 0;
    margin: 0 0 20px 0;
    font-size: 16px;
    line-height: 1.5;
    font-weight: 500;
    flex-grow: 1; /* Заставляем список растягиваться, выталкивая кнопку вниз */
    min-height: 150px; /* Гарантированная минимальная высота для выравнивания */
}

.service-card__benefits-list li {
    margin-bottom: 10px;
    padding-left: 25px;
    position: relative;
}

.service-card__benefits-list li::before {
    content: '✓';
    color: #03d3dd;
    position: absolute;
    left: 0;
    font-weight: 700;
}

.service-card__price {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    font-size: 2em;
    margin: 20px 0;
}

.service-card__accent-line {
    color: #03d3dd; /* Акцентный цвет тиффани */
    font-size: 0.9em;
    margin-bottom: 20px;
    text-align: center;
    font-weight: 700;
}

.service-card__cta {
    margin-top: auto;
    width: 100%;
    box-sizing: border-box;
}


/* Секция Опасность */
.danger {
    background-color: #2B2B2B;
    color: white;
    text-align: center;
    font-size: 1.2em;
    font-weight: 700;
    max-width: none;
    padding: 60px 20px;
    margin-bottom: 60px;
}

/* Секция "Выход есть" (Новый дизайн) */
.solution-new {
    position: relative;
    padding: 80px 0;
    background-image: url('assets/Lucid_Origin_A_professional_doctor_in_a_teal_Tiffany_medical_u_1.jpg');
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    color: #2B2B2B;
    text-align: center;
    overflow: hidden;
    max-width: none;
}

.solution-new::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(255, 255, 255, 0.7);
    z-index: 1;
}

.solution-new__content {
    position: relative;
    z-index: 2;
    max-width: 900px;
    margin: 0 auto;
    padding: 0 20px;
}

.solution-new__title {
    font-family: 'Montserrat', sans-serif;
    font-size: 1.4em;
    font-weight: 700;
    line-height: 1.3;
    margin-bottom: 20px;
}

.solution-new__title span {
    display: block;
    font-size: 0.7em;
    font-weight: 400;
    color: #6c757d;
}

.solution-new__subtitle {
    font-size: 1.2em;
    margin-bottom: 40px;
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}

.solution-new__benefits {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 25px;
    text-align: left;
    margin-bottom: 40px;
}

.benefit-item {
    display: flex;
    align-items: center;
    gap: 15px;
    background: rgba(255, 255, 255, 0.8);
    padding: 20px;
    border-radius: 12px;
    border: none;
}

.benefit-item__icon {
    flex-shrink: 0;
}

.benefit-item p {
    margin: 0;
    line-height: 1.5;
}

.solution-new .cta-button.primary {
    padding: 18px 35px;
    font-size: 1.1em;
    margin-bottom: 20px;
    border-radius: 12px;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.solution-new .cta-button.primary:hover {
    transform: scale(1.05);
    box-shadow: 0 0 25px rgba(3, 211, 221, 0.7);
}

/* Адаптация для мобильных */
@media (max-width: 768px) {
    .solution-new__title {
        font-size: 2.2em;
    }

    .solution-new__benefits {
        display: flex !important;
        flex-direction: column;
        width: 100%;
        gap: 16px;
    }

    .solution-new__benefits .benefit-item {
        width: 100%;
        flex-direction: column;
        align-items: flex-start;
        text-align: left;
        margin: 0;
        box-sizing: border-box;
    }
}

/* Секция Решение */
.solution {
    text-align: center;
}

.solution ul {
    list-style: none;
    padding: 0;
    max-width: 600px;
    margin: 30px auto;
    text-align: left;
}

.solution li {
    margin-bottom: 15px;
    padding-left: 25px;
    position: relative;
}

.solution li::before {
    content: '✓';
    color: #03d3dd;
    position: absolute;
    left: 0;
    font-weight: 700;
}

/* Секция Отзывы */
.reviews {
    position: relative; /* База для позиционирования стрелок */
    padding: 0 60px; /* Добавляем место по бокам для стрелок */
    margin-bottom: 60px;
}

.reviews .slider-container {
    /* display: flex; - Убираем, т.к. JS управляет отображением */
    max-width: 800px; /* Ограничиваем ширину для лучшего вида */
    margin: 0 auto;
}

.review-card {
    background-color: #F5F6F8;
    padding: 30px 30px 30px 30px;
    border-radius: 15px;
    text-align: left; /* Выравниваем текст по левому краю */
    display: none; /* Изначально скрываем, JS покажет нужный */
    flex-direction: column;
    position: relative; /* Для позиционирования аватарки */
}

.review-card__content {
    display: flex;
    flex-direction: column;
    padding-right: 80px; /* Отступ под аватарку */
}

.review-card__photo-wrapper {
    position: absolute;
    top: 20px;
    right: 20px;
}

.review-card__photo {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    object-fit: cover; /* Масштабирует изображение */
}

.review-photo {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    margin: 0 auto 15px;
}

.review-card__text {
    font-style: italic;
    border: none;
    margin: 0 0 15px 0;
    flex-grow: 1; /* Позволяет тексту занимать доступное пространство */
}

.review-card__author {
    font-weight: 700;
    font-style: italic;
    color: #6c757d; /* Менее заметный цвет */
    margin-top: auto; /* Прижимает автора к низу карточки */
}

.slider-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 56px;
    height: 56px;
    background-color: #FFFFFF;
    border-radius: 50%;
    box-shadow: 0 4px 12px rgba(0, 196, 179, 0.25);
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    border: none;
    transition: background-color 0.3s ease, box-shadow 0.3s ease;
    z-index: 10;
}

.slider-arrow svg {
    transition: transform 0.3s ease;
}

.slider-arrow:hover {
    background-color: rgba(0, 196, 179, 0.1);
}

.slider-arrow.slider-prev:hover svg {
    transform: translateX(-2px);
}

.slider-arrow.slider-next:hover svg {
    transform: translateX(2px);
}

.slider-arrow:active {
    background-color: #E0F8F6;
}

.slider-arrow:active svg {
    transform: scale(1.1);
}

.slider-prev {
    left: 0;
}

.slider-next {
    right: 0;
}

/* Секция Гарантии (Новые стили) */
.proof {
    background: linear-gradient(to bottom, white, rgba(0, 200, 179, 0.05));
}

.section-subtitle {
    text-align: center;
    max-width: 700px;
    margin: -20px auto 40px;
    font-size: 1.1em;
    color: #6c757d;
}

.prices-section .section-subtitle {
    margin-top: 30px;
}

.proof-items {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 24px;
    justify-content: center;
    margin-bottom: 50px;
}

.proof-item {
    display: flex;
    align-items: flex-start;
    gap: 18px;
    width: 100%;
    background-color: white;
    padding: 24px;
    border-radius: 20px;
    text-align: left;
    box-shadow: 0px 4px 12px rgba(0,0,0,0.05);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.proof-item__content {
    flex: 1;
}

.proof-item:hover {
    transform: translateY(-5px);
    box-shadow: 0px 8px 20px rgba(0,0,0,0.08);
}

.proof-item__content h3 {
    font-family: 'Montserrat', sans-serif;
    font-size: 1.2em;
    margin: 0 0 10px 0;
}

.proof-item__content p {
    margin: 0;
    margin-bottom: 10px;
}

.proof-icon {
    max-width: 50px;
    flex-shrink: 0;
    margin: 0;
    transition: transform 0.3s ease, filter 0.2s ease;
}

.proof-item:hover .proof-icon {
    transform: scale(1.1);
    filter: drop-shadow(0 0 4px rgba(0, 191, 179, 0.5));
}

.proof-cta {
    text-align: center;
}

.proof-cta p {
    font-size: 1.2em;
    font-weight: 700;
    margin-bottom: 20px;
}

.license-info {
    text-align: center;
    background-color: #F5F6F8;
    padding: 20px;
    border-radius: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
    max-width: 500px;
    margin: 0 auto;
}

.license-qr {
    max-width: 80px;
}

/* Секция Как мы работаем */
.how-it-works .steps {
    display: flex;
    justify-content: space-between;
    list-style: none;
    padding: 0;
    counter-reset: steps-counter;
}

.how-it-works .step {
    flex-basis: 22%;
    text-align: center;
    position: relative;
    padding-top: 40px;
}

.how-it-works .step::before {
    counter-increment: steps-counter;
    content: counter(steps-counter);
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 30px;
    height: 30px;
    background-color: #03d3dd;
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
}

/* Секция Анонимность */
.anonymity {
    text-align: center;
    background-color: #F5F6F8;
}

.anonymity-emblem {
    max-width: 100px;
    margin-bottom: 20px;
}

/* Секция CTA-форма */
.cta-form {
    background-color: #E8FBF9;
    text-align: center;
    padding: 60px 20px;
    max-width: none;
    margin: 60px 0;
}

.cta-form .section-title {
    color: #2B2B2B;
}

.cta-form form {
    display: flex;
    justify-content: center;
    gap: 15px;
    margin: 30px 0;
}

.cta-form input[type="text"],
.cta-form input[type="tel"] {
    padding: 15px;
    border: 1px solid #ccc;
    border-radius: 12px;
    width: 250px;
    font-size: 1em;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.cta-form select,
.cta-form textarea {
    padding: 15px;
    border: 1px solid #ccc;
    border-radius: 12px;
    font-size: 1em;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.cta-form textarea {
    min-height: 120px;
    resize: vertical;
}

.cta-form input[type="tel"]:focus,
.cta-form select:focus,
.cta-form textarea:focus {
    border-color: rgba(3, 211, 221, 0.6);
    box-shadow: 0 0 0 3px rgba(3, 211, 221, 0.15);
    outline: none;
}

.cta-form--full form {
    width: min(100%, 640px);
    margin: 30px auto 0;
    flex-direction: column;
    align-items: stretch;
}

.cta-form--full input[type="tel"],
.cta-form--full select,
.cta-form--full textarea {
    width: 100%;
}

.cta-form--full .cta-button {
    border-radius: 12px;
    padding: 16px;
    font-size: 1.1em;
}

.cta-form--full .modal-consent {
    margin-top: 4px;
    align-items: center;
    gap: 10px;
    width: 100%;
}

.cta-form .cta-button.primary {
    background-color: #03d3dd;
    color: white;
}

/* Футер */
.contacts {
    background-color: #2B2B2B;
    color: white;
    padding: 40px 20px;
    display: flex;
    justify-content: space-around;
    align-items: center;
}

.contact-info .phone-number {
    color: white;
    text-decoration: none;
    font-size: 1.5em;
    font-weight: 700;
    display: block;
    margin-bottom: 15px;
}

.messengers {
    display: flex;
    gap: 15px;
    margin-bottom: 15px;
}

.messengers img {
    width: 30px;
}

.legal-info {
    text-align: right;
    font-size: 0.9em;
}

.legal-info a {
    color: #F5F6F8;
    text-decoration: none;
    display: block;
    margin-bottom: 10px;
}

/* Адаптация для мобильных устройств */
@media (max-width: 768px) {

    /* Общие изменения */
    body {
        font-size: 16px; /* Базовый размер шрифта для мобильных */
        padding-bottom: 70px; /* Отступ для фиксированной кнопки "Позвонить" */
    }

    .section-title {
        font-size: 1.6em;
    }

    main > section {
        padding: 40px 15px;
    }

    /* Кнопка "Позвонить" - фиксированная */
    /* Стилизуем ссылку с телефоном в футере как фиксированную кнопку */
    .contact-info .phone-number {
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        background-color: #03d3dd;
        color: white;
        text-align: center;
        padding: 15px;
        font-size: 1.2em;
        z-index: 1000;
        margin: 0;
        border-radius: 0;
        text-decoration: none;
    }

    /* Меню */
    .main-nav ul {
        flex-direction: column;
        gap: 15px;
    }

    /* Hero секция */
    .hero-title {
        font-size: 2.2em;
    }

    .hero-subtitle {
        font-size: 1em;
    }

    .hero-buttons {
        flex-direction: column;
        gap: 15px;
    }

    /* Крупные CTA-кнопки */
    .cta-button {
        padding: 18px 30px;
        font-size: 1.1em;
        width: 100%;
        box-sizing: border-box;
    }

    /* Слайдер для Услуг */
    .services {
        display: flex;
        flex-direction: column;
        gap: 20px;
        overflow: visible;
        scroll-snap-type: none;
        -webkit-overflow-scrolling: auto;
        padding: 0 0 20px 0;
    }


    .service-card {
        scroll-snap-align: unset;
        font-size: 18px;
    }


    /* Секция Решение */
    .solution ul {
        padding: 0 10px;
    }

    /* Слайдер для Отзывов */
    
    .reviews .slider-container {
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        padding-bottom: 20px;
        justify-content: flex-start;
        gap: 15px;
    }

    .review-card {
        flex: 0 0 90%;
        scroll-snap-align: center;
        min-height: unset; /* Сбрасываем высоту на мобильных */
    }

    .slider-arrow {
        width: 44px;
        height: 44px;
        box-shadow: none;
        display: none; /* Скрываем стрелки на мобильных, управление свайпом */
    }

    /* Секция Гарантии */
    .proof-items {
        grid-template-columns: 1fr;
        gap: 15px;
    }
    
    .license-info {
        flex-direction: column;
        text-align: center;
    }

    /* Секция Как мы работаем */
    .how-it-works .steps {
        flex-direction: column;
        gap: 40px;
    }

    .motivation-cards {
        grid-template-columns: 1fr;
        max-width: 100%;
    }

    .motivation-card {
        width: 100%;
    }

    /* CTA-форма */
    .cta-form form {
        flex-direction: column;
        align-items: stretch;
    }

    .cta-form input[type="text"],
    .cta-form input[type="tel"] {
        width: 100%;
        box-sizing: border-box;
    }

    /* Футер */
    .contacts {
        flex-direction: column;
        text-align: center;
        gap: 20px;
    }

    .legal-info {
        text-align: center;
    }
}

@media (max-width: 768px) {
    .service-card::after {
        background: linear-gradient(to top, rgba(0,0,0,0.65), rgba(0,0,0,0.15));
    }
}

/* Стили для UX-фишек */

/* Стили для виджета чата */
.chat-widget {
    position: fixed;
    bottom: calc(-24px + env(safe-area-inset-bottom));
    left: 50%;
    transform: translateX(-50%);
    z-index: 1000;
}

.chat-widget__toggle {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background-color: #03d3dd;
    border: none;
    font-size: 28px;
    cursor: pointer;
    box-shadow: 0 4px 10px rgba(0,0,0,0.2);
    margin: 0 auto;
    display: block;
}

.chat-widget__window {
    position: absolute;
    bottom: 80px;
    left: 50%;
    width: 320px;
    background-color: white;
    border-radius: 15px;
    box-shadow: 0 5px 20px rgba(0,0,0,0.15);
    overflow: hidden;
    transform: translateX(-50%) scale(0.8);
    opacity: 0;
    transition: transform 0.3s ease, opacity 0.3s ease;
    transform-origin: bottom center;
    display: none;
}

.chat-widget__window.is-open {
    display: block;
    transform: translateX(-50%) scale(1);
    opacity: 1;
}

.chat-widget__header {
    background-color: #03d3dd;
    color: white;
    padding: 20px;
    text-align: center;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.chat-widget__close {
    position: absolute;
    top: 12px;
    left: 12px;
    width: 32px;
    height: 32px;
    border: none;
    background: transparent;
    color: #ffffff;
    cursor: pointer;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.chat-widget__close-icon {
    width: 20px;
    height: 20px;
    pointer-events: none;
}



.chat-widget__header h3 {
    margin: 0 0 5px 0;
    font-size: 1.2em;
}

.chat-widget__header p {
    margin: 0;
    font-size: 0.9em;
}

.chat-widget__body {
    padding: 20px;
}

.chat-widget__form {
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: 100%;
    max-width: 260px;
    margin: 0 auto;
}

.chat-widget__form input {
    padding: 12px;
    border: 1px solid #ccc;
    border-radius: 5px;
    width: 100%;
}

.chat-widget__form button {
    width: 100%;
}

@media (max-width: 768px) {
    .contact-info .phone-number {
        position: static;
        background-color: transparent;
        color: white;
        padding: 0;
        font-size: 1.5em;
        z-index: auto;
        margin-bottom: 15px;
    }

    body {
        padding-bottom: 0;
    }
}


/* Стили для страницы "Вывод из запоя" */

.hero-service {
    background-image: url('assets/hero-background.jpg'); /* Вы можете заменить на другое изображение */
    background-color: #f4f8f7;
    color: #2B2B2B;
    padding: 80px 20px;
}

.hero-service::before {
    background-color: rgba(255, 255, 255, 0.75); /* Осветляющий слой */
}

.hero-premium-hangover::before {
    background-color: transparent !important; /* Убираем осветляющий слой для этой страницы */
}


.service-features {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
    max-width: 800px;
    margin: 30px auto;
    text-align: left;
}

.feature-item {
    display: flex;
    align-items: center;
    gap: 15px;
}

.feature-icon {
    width: 24px;
    height: 24px;
    background-color: #03d3dd;
    border-radius: 50%;
    flex-shrink: 0;
    /* Можно добавить иконку через background-image или псевдоэлемент */
}

.prices-section {
    background-color: transparent;
}

.price-cards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

.price-card {
    background-color: transparent;
    padding: 30px;
    border-radius: 15px;
    box-shadow: 0px 4px 12px rgba(0,0,0,0.05);
    text-align: center;
    border: 2px solid transparent;
    display: flex;
    flex-direction: column;
}

.price-card.popular {
    border-color: #03d3dd;
    transform: scale(1.05);
}

.prices-section--vyvod .price-cards .price-card {
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-blend-mode: lighten;
}

.prices-section--vyvod .price-cards .price-card:nth-child(1) {
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.75), rgba(255, 255, 255, 0.75)),
        url('assets/1.jpg');
}

.prices-section--vyvod .price-cards .price-card:nth-child(2) {
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.75), rgba(255, 255, 255, 0.75)),
        url('assets/2.jpg');
}

.prices-section--vyvod .price-cards .price-card:nth-child(3) {
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.75), rgba(255, 255, 255, 0.75)),
        url('assets/3.jpg');
}

.price-card h3 {
    font-size: 1.5em;
    margin-bottom: 15px;
}

.price-card-description {
    margin-bottom: 20px;
}

.price-card-composition-title {
    font-weight: 700;
    margin-bottom: 5px;
}

.price-card-composition {
    margin-bottom: 20px;
    min-height: 60px;
}

.price-card-composition {
    list-style: none;
    padding: 0;
    text-align: left;
    margin: 20px 0;
    flex-grow: 1;
}

.price-card-composition li {
    padding-left: 20px;
    position: relative;
    margin-bottom: 8px;
}

.price-card-composition li::before {
    content: '✓';
    color: #03d3dd;
    position: absolute;
    left: 0;
}

.service-card .price-card-note {
    position: relative;
    z-index: 3;
    font-size: 0.9em;
    color: #fff;
    margin-top: 15px;
    text-shadow: 0px 1px 6px rgba(0, 0, 0, 0.5);
}

.price-card-note {
    font-size: 0.9em;
    color: #6c757d;
    margin-top: 20px;
}


.price-card-price {
    font-size: 2em;
    font-weight: 700;
    margin-bottom: 20px;
}

.danger-section {
    background-color: white;
    text-align: center;
    max-width: 800px;
}

.danger-section ul {
    list-style: none;
    padding: 0;
    margin: 20px 0;
    display: inline-block;
    text-align: left;
}

.danger-section li {
    padding-left: 25px;
    position: relative;
    margin-bottom: 10px;
}

.danger-section li::before {
    content: '❗';
    position: absolute;
    left: 0;
}

.danger-conclusion {
    font-weight: 700;
    color: #03d3dd;
}

.procedure-section {
    background-color: #F5F6F8;
}

.steps-container {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 40px;
    text-align: center;
}

.step-item .step-number {
    width: 50px;
    height: 50px;
    background-color: #03d3dd;
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5em;
    font-weight: 700;
    margin: 0 auto 20px;
}

.composition-section {
    max-width: 900px;
}

.composition-list {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin-top: 30px;
}

.composition-list ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.composition-list li {
    padding-left: 25px;
    position: relative;
    margin-bottom: 15px;
}

.composition-list li::before {
    content: '✓';
    color: #03d3dd;
    position: absolute;
    left: 0;
    font-weight: 700;
}

.guarantees-section {
    background-color: #F5F6F8;
}

.guarantee-items {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    text-align: center;
}

.final-cta-section {
    text-align: center;
    background-color: #2B2B2B;
    color: white;
}

.final-cta-section .section-title {
    color: white;
}

.phone-number-cta {
    font-size: 2em;
    font-weight: 700;
    color: #03d3dd;
    text-decoration: none;
    display: inline-block;
    vertical-align: middle;
    margin-left: 20px;
}

@media (max-width: 1023px) {
    .price-cards {
        grid-template-columns: 1fr 1fr;
    }
    .price-cards .price-card:last-child {
        grid-column: 1 / -1;
        max-width: 50%;
        margin: 0 auto;
    }
}

@media (max-width: 768px) {
    .service-features, .steps-container, .composition-list, .guarantee-items {
        grid-template-columns: 1fr;
    }
    .price-cards {
        grid-template-columns: 1fr;
    }
    .price-cards .price-card:last-child {
        max-width: 100%;
    }
}
/* Стили для карточки-ссылки */
.service-card--link-wrapper {
    position: relative;
}

.service-card__link {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 4; /* Поверх всего, кроме кнопки */
}

.service-card--link-wrapper .service-card__cta {
    position: relative;
    z-index: 5; /* Выносим кнопку поверх ссылки */
}
/* Стили для 5-шаговой инфографики */
.steps-container-five {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 20px;
    text-align: center;
}

.step-item-five {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.step-number-five {
    width: 60px;
    height: 60px;
    border: 3px solid #03d3dd;
    color: #03d3dd;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2em;
    font-weight: 700;
    margin-bottom: 20px;
}

.step-item-five h3 {
    font-size: 1.1em;
    margin-bottom: 10px;
}

/* Стили для блока "Мотивация" */
.motivation-section {
    background: linear-gradient(180deg,#FFFFFF 0%,#F7FFFE 100%);
    text-align: center;
}

.motivation-cards {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
    justify-content: center;
    max-width: 820px;
    width: 100%;
    margin: 40px auto;
}

.motivation-card {
    display: flex;
    align-items: flex-start;
    gap: 18px;
    width: 100%;
    background-color: white;
    padding: 24px;
    border-radius: 15px;
    box-shadow: 0px 4px 12px rgba(0,0,0,0.05);
    text-align: left;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.motivation-card__content {
    flex: 1;
}

.motivation-card:hover {
    transform: translateY(-5px);
    box-shadow: 0px 8px 20px rgba(0,0,0,0.08);
}

.motivation-card-icon {
    width: 44px;
    height: 44px;
    flex-shrink: 0;
    margin: 0;
    object-fit: contain;
    transition: transform 0.3s ease;
}

.motivation-card:hover .motivation-card-icon {
    transform: scale(1.1);
}

.motivation-card__content h3 {
    font-size: 1.2em;
    margin: 0 0 12px 0;
}

.motivation-card__content p {
    color: #6c757d;
    line-height: 1.6;
    margin: 0;
}

.motivation-cta {
    margin-top: 30px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    text-align: center;
}

.motivation-cta .cta-button {
    vertical-align: middle;
}

.motivation-cta p {
    margin: 0;
}

@media (max-width: 768px) {
    .motivation-cards {
        display: flex;
        flex-direction: column;
        gap: 16px;
        align-items: center;
    }

    .motivation-card {
        flex-direction: column;
        align-items: center;
        text-align: center;
        padding: 20px;
        max-width: 420px;
    }

    .motivation-card-icon {
        margin-bottom: 12px;
    }

    .motivation-card__content {
        text-align: center;
    }
}

header.hero-vyvod-iz-zapoya + main .prices-section {
    margin-top: -24px;
    padding-top: 32px;
}

header.hero-vyvod-iz-zapoya + main .prices-section + section {
    margin-top: 40px;
}

/* Стили для блока "Срочный вызов" */
.urgent-call-section {
    position: relative;
    background-image: url('assets/Lucid_Realism_hyperrealistic_cinematic_photo_dark_medical_room_1.jpg');
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    padding: 60px 0; /* Убираем боковые отступы, чтобы фон растянулся */
    max-width: none; /* Снимаем ограничение ширины */
}

.urgent-call-section::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(255, 255, 255, 0.8); /* Белый фильтр осветления */
    z-index: 1;
}

.urgent-call-section .container {
    position: relative;
    z-index: 2;
}

.urgent-call-section .section-title,
.urgent-call-section .section-subtitle,
.urgent-call-section .symptoms-list h3 {
    color: #2B2B2B;
}

.urgent-call-section .symptoms-list li {
    background-color: rgba(255, 255, 255, 0.7);
    color: #2B2B2B;
    border-left: 4px solid #03d3dd;
    padding: 15px;
    border-radius: 5px;
}

.urgent-call-section .danger-info .danger-text-block,
.urgent-call-section .danger-info .solution-text-block {
    background-color: rgba(0, 0, 0, 0.6);
    color: white;
    padding: 20px;
    border-radius: 10px;
}

.urgent-call-section .danger-info .danger-title,
.urgent-call-section .danger-info .solution-title {
    color: #03d3dd;
}

.urgent-call-section .danger-info p {
    color: #f0f0f0;
}

.urgent-call-content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 50px;
    align-items: flex-start;
}

.symptoms-list ul {
    list-style: none;
    padding: 0;
    margin-top: 20px;
}

.symptoms-list li {
    padding-left: 35px;
    position: relative;
    margin-bottom: 15px;
    font-size: 1.1em;
}

.symptoms-list li::before {
    content: '✓'; /* Замените на иконки */
    color: #03d3dd;
    position: absolute;
    left: 0;
    font-size: 1.5em;
    line-height: 1;
}

.danger-info img {
    width: 100%;
    border-radius: 15px;
    margin-bottom: 20px;
}

.danger-text-block {
    margin-bottom: 20px;
}

.danger-title {
    color: #d9534f; /* Красный цвет для опасности */
}

.solution-title {
    color: #03d3dd;
}

.danger-info .cta-button {
    width: 100%;
}

@media (max-width: 768px) {
    .urgent-call-content {
        grid-template-columns: 1fr;
    }
}
/* Стили для информационных блоков */
.info-section {
    background-color: #fff;
}

.info-section__content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 50px;
    align-items: center;
}

.info-section--reverse .info-section__content {
    grid-template-columns: 1fr 1fr; /* Можно поменять порядок колонок, если нужно */
}

.info-section__text {
    text-align: left;
}

.info-section__text .section-title {
    text-align: left;
}

.info-section__image img {
    width: 100%;
    border-radius: 15px;
}

.info-section__text ul {
    list-style: none;
    padding: 0;
    margin-top: 20px;
}

.info-section__text li {
    padding-left: 25px;
    position: relative;
    margin-bottom: 10px;
}

.info-section__text li::before {
    content: '✓';
    color: #03d3dd;
    position: absolute;
    left: 0;
}

@media (max-width: 768px) {
    .info-section__content, .info-section--reverse .info-section__content {
        grid-template-columns: 1fr;
    }
    .info-section__text .section-title {
        text-align: center;
    }
    .info-section__image {
        order: -1; /* Помещаем картинку сверху на мобильных */
    }
}
/* Стили для редизайна блока "Опасность промедления" v2.0 */
.danger-section.redesigned {
    background-color: #F9FAFB;
    text-align: center;
}

.complications-list {
    margin: 40px 0;
    max-width: 800px; /* Ограничиваем ширину для лучшей читаемости */
    margin-left: auto;
    margin-right: auto;
}

.complication-item {
    display: flex;
    align-items: center;
    gap: 20px;
}

.complication-item:not(:last-child) {
    margin-bottom: 24px;
}

.complication-item__icon {
    width: 40px;
    height: 40px;
    background-color: #03d3dd; /* Placeholder */
    flex-shrink: 0;
    /* Сюда нужно будет добавить SVG иконки */
}

.complication-item__text h4 {
    margin: 0 0 5px 0;
    font-size: 1.2em;
    font-weight: 600; /* Полужирный */
}

.complication-item__text p {
    margin: 0;
}

.final-accent {
    max-width: 100%;
    margin: 40px auto;
    padding: 25px;
    border-radius: 12px;
    background-color: rgba(0, 200, 179, 0.1);
    display: flex;
    align-items: center;
    gap: 20px;
    text-align: left;
}

.final-accent__icon {
    width: 40px;
    height: 40px;
    background-color: #03d3dd; /* Placeholder */
    border-radius: 50%;
    flex-shrink: 0;
    /* Сюда нужно будет добавить иконку "Внимание" */
}

.final-accent p {
    margin: 0;
    font-weight: 500;
}

.danger-section.redesigned .cta-button {
    margin-top: 20px;
}

@media (max-width: 992px) {
    /* Медиа-запросы для списка не требуются, он уже адаптивен */
}

@media (max-width: 576px) {
    /* Медиа-запросы для списка не требуются, он уже адаптивен */
}
/* --- Стили для страницы "Кодирование от алкоголизма" --- */

/* Блок 1: Hero Section */
.hero-coding {
    background-image: url('assets/hero-background.jpg'); /* Используем то же фоновое изображение или можно заменить на новое */
    color: #2B2B2B;
}

.hero-coding::before {
    background-color: rgba(255, 255, 255, 0.75); /* Осветляющий слой */
}

.hero-features {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 15px 25px;
    max-width: 800px;
    margin: 30px auto;
    text-align: left;
}

.feature-item-coding {
    display: flex;
    align-items: center;
    gap: 10px;
}

.feature-icon-coding {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    flex-shrink: 0;
    border: 2px solid #03d3dd;
    background-color: rgba(3, 211, 221, 0.08);
    position: relative;
}

.feature-icon-coding::after {
    content: '';
    position: absolute;
    top: 4px;
    left: 6px;
    width: 8px;
    height: 14px;
    border-right: 2px solid #03d3dd;
    border-bottom: 2px solid #03d3dd;
    transform: rotate(45deg);
}

.feature-item-coding span {
    font-size: 1em;
}

/* Блок 2: Методы и цены */
.methods-section {
    background-color: #F9FAFB;
}

.method-cards {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 30px;
    align-items: start;
}

.method-card {
    background-color: white;
    padding: 30px;
    border-radius: 15px;
    box-shadow: 0px 4px 12px rgba(0,0,0,0.05);
    display: flex;
    flex-direction: column;
    border: 1px solid #E5E7EB;
}

.method-card h3 {
    font-size: 1.5em;
    margin-bottom: 15px;
    color: #2B2B2B;
}

.method-card p {
    flex-grow: 1;
    margin-bottom: 15px;
}

.method-price {
    font-size: 2em;
    font-weight: 700;
    margin: 10px 0 20px 0;
}

.method-card .cta-button {
    margin-top: auto;
}

/* Блок 3: Важное условие (Callout) */
.callout-section {
    background-color: rgba(0, 200, 179, 0.1); /* Светлый фон цвета тиффани */
    padding: 40px;
    border-radius: 15px;
    max-width: 900px;
    margin: 60px auto;
}

.callout-content {
    display: flex;
    align-items: center;
    gap: 30px;
}

.callout-icon {
    width: 50px;
    height: 50px;
    background-color: #03d3dd; /* Иконка "Внимание" */
    border-radius: 50%;
    flex-shrink: 0;
    /* Сюда можно добавить SVG иконку */
}

.callout-text h2 {
    margin-top: 0;
    font-size: 1.8em;
}

.callout-text .cta-button {
    margin-top: 20px;
}

/* Блок 4: Как проходит процедура */
.procedure-steps-section {
    background-color: #F9FAFB;
}

.steps-list {
    max-width: 800px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 30px;
}

.step-item-vertical {
    display: flex;
    align-items: flex-start;
    gap: 25px;
}

.step-icon {
    width: 40px;
    height: 40px;
    background-color: #03d3dd;
    border-radius: 50%;
    flex-shrink: 0;
    /* Сюда можно добавить номер шага или иконку */
}

.step-text h3 {
    margin: 0 0 10px 0;
    font-size: 1.3em;
}

.step-text p {
    margin: 0;
}

/* Блок 5: Противопоказания */
.contraindications-section {
    max-width: 900px;
    margin: 60px auto;
}

.contraindications-list {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin-top: 30px;
}

.contraindications-list ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.contraindications-list li {
    padding-left: 30px;
    position: relative;
    margin-bottom: 15px;
}

.contraindications-list li::before {
    content: '✕'; /* Иконка крестика */
    color: #d9534f; /* Красный цвет */
    position: absolute;
    left: 0;
    font-weight: 700;
    font-size: 1.2em;
}

/* Адаптация для мобильных */
@media (max-width: 768px) {
    .hero-features {
        grid-template-columns: 1fr;
    }
    .callout-content {
        flex-direction: column;
        text-align: center;
    }
    .contraindications-list {
        grid-template-columns: 1fr;
    }
}
/* --- Стили для страницы "Снятие похмелья" (Премиум-Медицина) --- */

/* Общие премиум-настройки */
body {
    background-color: #FFFFFF;
    color: #222222;
}

.premium-section {
    padding: 80px 20px;
    border-bottom: 1px solid #F0F0F0;
}

/* Блок 1: Hero Section */
.hero-snyatie-pohmelya {
    background-image: url('assets/price3.jpg');
}

.hero-premium-hangover > * {
    position: relative;
    z-index: 2;
}


.hero-utp-list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
    max-width: 700px;
    margin: 40px auto;
    text-align: left;
    color: #2B2B2B;
}

.utp-item {
    display: flex;
    align-items: center;
    gap: 15px;
}

.utp-icon {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    border: 2px solid #03d3dd;
    background-color: rgba(3, 211, 221, 0.12);
    flex-shrink: 0;
    position: relative;
}

.utp-icon::before {
    content: '';
    position: absolute;
    width: 12px;
    height: 6px;
    border-left: 3px solid #03d3dd;
    border-bottom: 3px solid #03d3dd;
    transform: rotate(-45deg);
    top: 9px;
    left: 8px;
}

/* Блок 2: Идентификация угрозы */
.threat-section {
    background-color: #FFFFFF;
    max-width: 800px;
    margin: 60px auto;
    text-align: center;
}

.threat-list {
    display: flex;
    flex-direction: column;
    gap: 24px;
    margin: 40px 0;
}

.threat-item {
    display: flex;
    align-items: center;
    gap: 15px;
    font-size: 1.1em;
    font-weight: 500;
}

.threat-icon {
    width: 24px;
    height: 24px;
    background-color: #D9534F; /* Красный */
    border-radius: 50%;
    flex-shrink: 0;
}

.threat-conclusion {
    font-size: 1.2em;
    font-weight: 700;
    padding: 20px;
    background-color: #F9FAFB;
    border-left: 5px solid #03d3dd;
    text-align: left;
}

/* Блок 3: Опасные сигналы */
.danger-signals-section {
    background-color: #F9FAFB;
}

.danger-list {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 32px;
    max-width: 900px;
    margin: 0 auto;
}

.danger-item {
    display: flex;
    align-items: flex-start;
    gap: 20px;
}

.danger-icon {
    width: 40px;
    height: 40px;
    background-color: #D9534F; /* Красный */
    border-radius: 8px;
    flex-shrink: 0;
}

.danger-text h4 {
    margin: 0 0 8px 0;
    font-size: 1.3em;
}

.danger-text p {
    margin: 0;
}

/* Блок 6: Процесс */
.process-premium-section {
    background-color: #FFFFFF;
    text-align: center;
}

.process-steps-premium {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 20px;
    margin-top: 40px;
}

.step-premium {
    text-align: center;
}

.step-number-premium {
    width: 50px;
    height: 50px;
    border: 2px solid #03d3dd;
    color: #03d3dd;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.8em;
    font-weight: 700;
    margin: 0 auto 20px;
}

/* Блок 7: Состав */
.composition-premium-section {
    background-color: #F9FAFB;
}

.composition-cards-premium {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 30px;
}

.composition-card-premium {
    background-color: #FFFFFF;
    padding: 30px;
    border-radius: 12px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.07);
}

.comp-icon {
    width: 40px;
    height: 40px;
    background-color: #03d3dd;
    border-radius: 8px;
    margin-bottom: 20px;
}

/* Блок 10: Лицензия */
.license-premium-section {
    text-align: center;
}
.license-image-placeholder {
    width: 200px;
    height: 280px;
    background-color: #F0F0F0;
    margin: 20px auto;
    border: 1px solid #ccc;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Блок 13: Финальный CTA */
.final-cta-premium-section {
    background-color: #F0FFFF;
    border-left: 5px solid #03d3dd;
    padding: 40px;
    border-radius: 8px;
    text-align: center;
}

/* Адаптация */
@media (max-width: 768px) {
    .hero-utp-list, .danger-list, .process-steps-premium {
        grid-template-columns: 1fr;
    }
}

/* --- Стили для "Живой Ленты" (Эффект присутствия) --- */
#live-feed-notification {
    position: fixed;
    bottom: 20px;
    left: 20px;
    background-color: #FFFFFF;
    border: 1px solid #E5E7EB;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    padding: 16px;
    display: flex;
    align-items: center;
    gap: 12px;
    z-index: 2000;
    transform: translateY(150%);
    opacity: 0;
    transition: transform 0.5s ease-out, opacity 0.5s ease-out;
    max-width: 350px;
}

#live-feed-notification.show {
    transform: translateY(0);
    opacity: 1;
}

#live-feed-icon {
    flex-shrink: 0;
}

#live-feed-icon svg {
    width: 24px;
    height: 24px;
    color: #03d3dd; /* Цвет "Тиффани" */
}

#live-feed-text {
    font-size: 14px;
    color: #000000;
    line-height: 1.4;
}

/* Адаптивность: скрываем на мобильных */
@media (max-width: 767px) {
    #live-feed-notification {
        display: none;
    }
}
/* --- Lead Magnet Section --- */
.lead-magnet {
    background-color: #F9FAFB;
    padding: 60px 20px;
}

.lead-magnet__content {
    display: grid;
    grid-template-columns: 300px 1fr;
    gap: 50px;
    align-items: center;
    max-width: 1000px;
    margin: 0 auto;
}

.lead-magnet__cover {
    width: 100%;
    aspect-ratio: 3 / 4;
    background-color: white;
    border-radius: 10px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
    padding: 30px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
}

.cover-title {
    font-family: 'Manrope', 'Arial', sans-serif;
    font-size: 2.2em;
    font-weight: 800;
    color: #2B2B2B;
    margin: 20px 0;
    line-height: 1.2;
}

.cover-accent-line {
    width: 50px;
    height: 4px;
    background-color: #03d3dd; /* Tiffany color */
    margin: 20px auto 0;
}

.lead-magnet__form-container h2 {
    font-family: 'Manrope', 'Arial', sans-serif;
    font-size: 2.5em;
    color: #2B2B2B;
    margin-top: 0;
    margin-bottom: 10px;
}

.lead-magnet__subtitle {
    font-family: 'Inter', sans-serif;
    font-size: 1.2em;
    font-weight: 700;
    margin-bottom: 20px;
    color: #2B2B2B;
}

.lead-magnet__form-container p {
    font-family: 'Inter', sans-serif;
    color: #2B2B2B;
}

.lead-magnet__form {
    display: flex;
    gap: 10px;
    margin-top: 25px;
    margin-bottom: 10px;
}

.lead-magnet__form input {
    flex-grow: 1;
    padding: 15px;
    border: 1px solid #ccc;
    border-radius: 5px;
    font-size: 1em;
    font-family: 'Inter', sans-serif;
}

.lead-magnet__form input:focus {
    outline: none;
    border-color: #03d3dd; /* Tiffany color */
    box-shadow: 0 0 0 2px rgba(10, 186, 181, 0.2);
}

.lead-magnet__form .cta-button {
    background-color: #03d3dd; /* Tiffany color */
    flex-shrink: 0;
}

.lead-magnet__note {
    font-size: 0.8em;
    color: #6c757d;
}

/* Responsive */
@media (max-width: 768px) {
    .lead-magnet__content {
        grid-template-columns: 1fr;
        text-align: center;
    }

    .lead-magnet__cover {
        margin: 0 auto 40px;
        max-width: 280px;
    }

    .lead-magnet__form {
        flex-direction: column;
    }
    
    .lead-magnet__form-container h2 {
        font-size: 2em;
    }
}

/* --- Стили для блока "Юридическая Гарантия Анонимности" --- */
.legal-guarantee {
    background-color: #F9FAFB;
    border-radius: 8px;
    padding: 40px;
    border-left: 5px solid #03d3dd;
    max-width: 900px;
    margin: 60px auto;
}

.legal-guarantee h2 {
    font-family: 'Montserrat', sans-serif;
    font-size: 2em;
    color: #2B2B2B;
    margin-top: 0;
    margin-bottom: 10px;
}

.legal-guarantee h3 {
    font-family: 'Inter', sans-serif;
    font-size: 1.2em;
    color: #2B2B2B;
    font-weight: 400;
    margin-bottom: 30px;
}

.legal-guarantee ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.legal-guarantee li {
    display: flex;
    align-items: center;
    gap: 15px;
    font-size: 1.1em;
    line-height: 1.5;
}

.guarantee-icon {
    width: 28px;
    height: 28px;
    color: #03d3dd;
    flex-shrink: 0;
}

.legal-guarantee a {
    color: #03d3dd;
    text-decoration: underline;
    font-weight: 500;
}

.legal-guarantee a:hover {
    text-decoration: none;
}
/* --- STYLES FOR NEW SITE FOOTER --- */

:root {
    --footer-bg-light: #F6F9FC;
    --footer-bg-dark: #1F2428;
    --footer-text-light: #000;
    --footer-text-secondary-light: #4A4A4A;
    --footer-text-dark: #FFFFFF;
    --footer-accent-color: #03d3dd; /* Tiffany */
    --footer-divider-color: #E6EEF0;
    --footer-container-width: 1140px;
}

/* --- 1. Pre-footer CTA Section --- */
.pre-footer-cta {
    background-color: #FFFFFF;
    padding: 32px 0;
    border-top: 1px solid var(--footer-divider-color);
}

.pre-footer-cta .container {
    max-width: var(--footer-container-width);
    margin: 0 auto;
    padding: 0 20px;
}

.pre-footer-cta__content {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
}

.pre-footer-cta__title {
    font-size: 14px;
    font-weight: 700;
    color: var(--footer-text-light);
    margin: 0 0 8px 0;
}

.pre-footer-cta__subtitle {
    font-size: 17px;
    color: var(--footer-text-secondary-light);
    margin: 0;
}

.pre-footer-cta__actions {
    display: flex;
    align-items: center;
    gap: 24px;
}

.pre-footer-cta__buttons {
    display: flex;
    gap: 12px;
}

.pre-footer-cta__buttons .cta-button {
    border-radius: 12px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.pre-footer-cta__buttons .cta-button:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 15px rgba(0, 0, 0, 0.15);
}

.pre-footer-cta__buttons .cta-button.primary {
    background-color: var(--footer-accent-color);
    color: white;
}

.pre-footer-cta__buttons .cta-button.secondary {
    background-color: #FFFFFF;
    border: 1px solid var(--footer-divider-color);
    color: var(--footer-text-secondary-light);
}

.pre-footer-cta__phone {
    font-size: 22px;
    font-weight: 700;
    color: var(--footer-text-light);
    text-decoration: none;
}

@media (max-width: 768px) {
    .pre-footer-cta__title {
        font-size: 22px;
    }
}

/* --- 2. Main Footer Section --- */
.site-footer {
    background-color: var(--footer-bg-light);
    padding: 56px 0 0;
    color: var(--footer-text-secondary-light);
}

.site-footer .container {
    max-width: var(--footer-container-width);
    margin: 0 auto;
    padding: 0 20px;
}

.site-footer__main {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
    padding-bottom: 40px;
}

.site-footer__title {
    font-size: 18px;
    font-weight: 700;
    color: var(--footer-text-light);
    margin: 0 0 20px 0;
}

.site-footer__content p,
.site-footer__content a,
.site-footer__content li {
    font-size: 16px;
    line-height: 1.6;
}

.site-footer__list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.site-footer__list li:not(:last-child) {
    margin-bottom: 10px;
}

.site-footer__list a {
    text-decoration: none;
    color: var(--footer-text-secondary-light);
    transition: text-shadow 0.2s ease, color 0.2s ease;
}

.site-footer__list a:hover {
    color: var(--footer-accent-color);
    text-decoration: underline;
    text-shadow: 0 0 1px rgba(0,0,0,.1);
}

.site-footer__list a:focus {
    outline: 2px solid var(--footer-accent-color);
    outline-offset: 2px;
    border-radius: 2px;
}

/* Column 1 Specifics */
.site-footer__brand-name {
    font-weight: 700;
    color: var(--footer-text-light);
}

.site-footer__phone {
    display: block;
    font-size: 1.2em;
    font-weight: 700;
    color: var(--footer-text-light);
    text-decoration: none;
    margin: 16px 0;
}

.site-footer__messengers {
    display: flex;
    gap: 16px;
    margin-bottom: 16px;
}

.site-footer__messengers a svg {
    width: 28px;
    height: 28px;
    fill: var(--footer-text-secondary-light);
    transition: fill 0.2s ease;
}

.site-footer__messengers a:hover svg {
    fill: var(--footer-accent-color);
}

.site-footer__disclaimer--small {
    font-size: 0.9em;
    opacity: 0.8;
}

/* Column 4 Specifics */
.site-footer__legal-details {
    font-size: 0.9em;
    opacity: 0.8;
    margin: 16px 0;
}

.site-footer__email {
    color: var(--footer-text-secondary-light);
    text-decoration: none;
}
.site-footer__email:hover {
    color: var(--footer-accent-color);
}

/* Bottom Disclaimer */
.site-footer__bottom-disclaimer {
    text-align: center;
    padding: 20px 0;
    font-size: 14px;
    border-top: 1px solid var(--footer-divider-color);
    border-bottom: 1px solid var(--footer-divider-color);
}

/* --- 3. Copyright Bar --- */
.site-footer__copyright-bar {
    padding: 20px 0;
}

.site-footer__copyright-bar .container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 14px;
}

.site-footer__legal-links {
    display: flex;
    gap: 20px;
}

.site-footer__legal-links a {
    text-decoration: none;
    color: var(--footer-text-secondary-light);
}

.site-footer__legal-links a:hover {
    color: var(--footer-accent-color);
    text-decoration: underline;
}

.secondary-footer{
    background-color: #fff;
    border-top: 1px solid var(--footer-divider-color);
    padding: 12px 0;
}

.secondary-footer .container{
    max-width: var(--footer-container-width);
    margin: 0 auto;
    padding: 0 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    flex-wrap: wrap;
}

.secondary-footer__label{
    font-size: 14px;
    color: var(--footer-text-secondary-light);
}

.secondary-footer__link{
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: var(--footer-text-light);
    text-decoration: none;
    font-weight: 600;
}

.secondary-footer__link img{
    max-height: 32px;
    width: auto;
    display: block;
}

.secondary-footer__link:hover{
    color: var(--footer-accent-color);
}

/* --- 4. Mobile Adaptation (Accordion) --- */
@media (max-width: 767px) {
    .pre-footer-cta__content,
    .pre-footer-cta__actions {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

    .pre-footer-cta__buttons {
        flex-direction: column;
        width: 100%;
    }
    
    .pre-footer-cta__buttons .cta-button {
        width: 100%;
    }

    .site-footer__main {
        grid-template-columns: 1fr;
    }

    .site-footer__column:not(:first-child) .site-footer__title {
        cursor: pointer;
        position: relative;
        padding-right: 25px;
    }

    .site-footer__column:not(:first-child) .site-footer__title::after {
        content: '+';
        position: absolute;
        right: 0;
        top: 50%;
        transform: translateY(-50%);
        font-size: 24px;
        font-weight: 300;
        transition: transform 0.3s ease;
    }

    .site-footer__column:not(:first-child) .site-footer__title.active::after {
        transform: translateY(-50%) rotate(45deg);
    }

    .site-footer__column:not(:first-child) .js-accordion-content {
        display: none;
        padding-top: 15px;
    }
    
    .site-footer__copyright-bar .container {
        flex-direction: column;
        gap: 15px;
        text-align: center;
    }

    .site-footer__legal-links {
        flex-direction: column;
        gap: 10px;
    }

    .secondary-footer .container{
        flex-direction: column;
        gap: 8px;
        text-align: center;
    }

    .secondary-footer__label{
        text-align: center;
    }
}

/* --- Dark Theme Variant --- */
.dark-theme .site-footer {
    background-color: var(--footer-bg-dark);
    color: var(--footer-text-dark);
}

.dark-theme .site-footer__title,
.dark-theme .site-footer__brand-name,
.dark-theme .site-footer__phone {
    color: var(--footer-text-dark);
}

.dark-theme .site-footer__list a,
.dark-theme .site-footer__email,
.dark-theme .site-footer__legal-links a,
.dark-theme .site-footer__legal-links span {
    color: var(--footer-text-dark);
    opacity: 0.8;
}

.dark-theme .site-footer__list a:hover,
.dark-theme .site-footer__email:hover,
.dark-theme .site-footer__legal-links a:hover {
    color: var(--footer-accent-color);
    opacity: 1;
}

.dark-theme .site-footer__messengers a svg {
    fill: var(--footer-text-dark);
}

.dark-theme .site-footer__bottom-disclaimer,
.dark-theme .site-footer__copyright-bar {
    border-color: rgba(255, 255, 255, 0.1);
}
/* --- NEW COMPARISON BLOCK V2 --- */
.comparison-v2 {
    padding: 60px 0;
    background-color: #F9FAFB; /* Мягкий серый фон-переход */
}

.comparison-v2 .container {
    max-width: 1140px;
    margin: 0 auto;
    padding: 0 20px;
}

.comparison-v2__header {
    text-align: center;
    margin-bottom: 40px;
}

.comparison-v2__title {
    font-family: 'Manrope', sans-serif;
    font-size: 20px;
    font-weight: 700;
    color: #000000;
    margin: 0 0 16px 0;
}

.comparison-v2__subtitle {
    font-family: 'Inter', sans-serif;
    font-size: 20px;
    color: #4A4A4A;
    max-width: 80%;
    margin: 0 auto;
}

.comparison-v2__content {
    display: flex;
    justify-content: center;
    gap: 0;
    position: relative;
}

.comparison-v2__divider {
    width: 1px;
    background-color: #D9E6E5;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
}

.comparison-v2__column {
    flex: 1;
    padding: 30px;
    border-radius: 12px;
}

.comparison-v2__column--risk {
    background-color: #FFF5F5;
}

.comparison-v2__column--salvation {
    background-color: #E6FFFA;
}

.comparison-v2__column-title {
    font-family: 'Manrope', sans-serif;
    font-size: 26px;
    font-weight: 700;
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0 0 24px 0;
}

.comparison-v2__column--risk .comparison-v2__column-title {
    color: #E53E3E;
}

.comparison-v2__column--salvation .comparison-v2__column-title {
    color: #03d3dd;
}

.comparison-v2__icon {
    font-size: 24px;
}

.comparison-v2__list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.comparison-v2__list li {
    font-family: 'Inter', sans-serif;
    font-size: 18px;
    line-height: 1.6;
    display: flex;
    align-items: center;
    gap: 10px;
}

.comparison-v2__list li:not(:last-child) {
    margin-bottom: 16px;
}

.comparison-v2__list li span {
    font-size: 24px;
}

/* Animation */
.fade-in-item {
    opacity: 0;
    transform: translateY(10px);
    transition: opacity 0.5s ease-out, transform 0.5s ease-out;
}

.fade-in-item.is-visible {
    opacity: 1;
    transform: translateY(0);
}

.comparison-v2__footer {
    text-align: center;
    margin-top: 40px;
}

.comparison-v2__footer p {
    font-size: 18px;
    line-height: 1.6;
    margin: 0 0 24px 0;
}

.comparison-v2__footer .cta-button {
    border-radius: 12px;
    background-color: #03d3dd;
    color: white;
    transition: background-color 0.3s ease, box-shadow 0.3s ease;
}

.comparison-v2__footer .cta-button:hover {
    background-color: #38d3c4;
    box-shadow: 0 6px 15px rgba(46, 213, 182, 0.4);
}

/* Mobile */
@media (max-width: 767px) {
    .comparison-v2__content {
        flex-direction: column;
        gap: 40px;
    }
    .comparison-v2__divider {
        display: none;
    }
    .comparison-v2__column {
        padding: 20px;
    }
    .comparison-v2__title {
        font-size: 28px;
    }
    .comparison-v2__subtitle {
        font-size: 18px;
        max-width: 100%;
    }
}
/* Стили для изображения в блоке "Наша миссия" */
.info-section__image img {
    width: 100%;
    height: auto;
    border-radius: 15px;
    object-fit: cover;
    display: block;
}
/* Фон для страницы "Вывод из запоя" */
.hero-vyvod-iz-zapoya {
    background-image: url('assets/Lucid_Origin_A_professional_doctor_in_a_teal_Tiffany_medical_u_0.jpg');
}

.hero.hero-service.hero-vyvod-iz-zapoya {
    padding-bottom: 13px;
}

@media (max-width: 768px) {
    .hero.hero-service.hero-vyvod-iz-zapoya {
        padding-bottom: 9px;
    }

    header.hero-vyvod-iz-zapoya + main .prices-section {
        margin-top: 20px;
        padding-top: 24px;
    }
}

/* Фон для страницы "Кодирование" */
.hero-coding {
    background-image: url('assets/Lucid_Origin_A_professional_doctor_in_a_teal_Tiffany_medical_u_0 (1).jpg');
    background-position: 30% 50%; /* Сдвигаем изображение влево */
}
/* --- Стили для страницы "Контакты" --- */

.contacts-hero {
    text-align: center;
    padding: 60px 20px;
}

.contacts-hero h1 {
    font-family: 'Manrope', sans-serif;
    font-size: 36px;
    font-weight: 700;
    color: #000000;
    margin-bottom: 16px;
}

.contacts-hero .subtitle {
    font-size: 18px;
    color: #4A4A4A;
    line-height: 1.7;
    max-width: 600px;
    margin: 0 auto;
}

.contact-buttons {
    padding: 0 20px 60px;
}

.contact-buttons__wrapper {
    display: flex;
    justify-content: center;
    gap: 20px;
    max-width: 900px;
    margin: 0 auto;
}

.contact-buttons .btn {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    height: 56px;
    padding: 0 25px;
    border-radius: 16px;
    font-size: 16px;
    font-weight: 700;
    text-decoration: none;
    box-shadow: 0 6px 18px rgba(0,0,0,0.06);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.contact-buttons .btn:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 22px rgba(0,0,0,0.1);
}

.contact-buttons .btn__icon {
    /* Предполагается, что иконки будут SVG или img. Размеры можно будет подстроить. */
    width: 24px;
    height: 24px;
}

.contact-buttons .btn--phone {
    background-color: #03d3dd;
    color: white;
    border: 2px solid #03d3dd;
}

.contact-buttons .btn--whatsapp {
    background-color: #03d3dd;
    color: white;
    border: 2px solid #03d3dd;
}

.contact-buttons .btn--telegram {
    background-color: white;
    color: #03d3dd;
    border: 2px solid #03d3dd;
}

.geography {
    padding: 60px 20px;
}

.geography__inner {
    background-color: #E6FFFA;
    padding: 40px;
    border-radius: 16px;
    text-align: center;
    max-width: 800px;
    margin: 0 auto;
}

.geography__title {
    font-size: 26px;
    font-weight: 700;
    color: #2B2B2B;
    margin: 0 0 10px 0;
}

.geography__subtitle {
    font-size: 18px;
    color: #2B2B2B;
    margin: 0 0 15px 0;
}

.geography__text {
    font-size: 15px;
    color: #6A6A6A;
    margin: 0;
}

.cta-contact {
    padding: 60px 20px;
    text-align: center;
}

.cta-contact p {
    font-size: 18px;
    line-height: 1.7;
    margin: 0 auto 25px;
    max-width: 600px;
}

.cta-contact .btn {
    display: inline-block;
    background-color: #03d3dd;
    color: white;
    padding: 16px 32px;
    border-radius: 14px;
    text-decoration: none;
    font-weight: 700;
    transition: background-color 0.2s ease, box-shadow 0.2s ease;
}

.cta-contact .btn:hover {
    background-color: #29b3a5;
    box-shadow: 0 6px 18px rgba(46, 196, 182, 0.4);
}

.legal-info {
    background-color: #F8FAFB;
    padding: 40px 20px;
    border-top: 1px solid #E5E7EB;
}

.legal-info__inner {
    max-width: 800px;
    margin: 0 auto;
    font-size: 15px;
    color: #6A6A6A;
    line-height: 1.6;
}

.legal-info__inner p {
    margin: 0 0 10px 0;
}

.legal-info__inner p:first-child {
    padding-left: 28px;
    position: relative;
}

.legal-info__inner p:first-child::before {
    content: '🔒';
    position: absolute;
    left: 0;
    top: 2px;
    font-size: 18px;
}

/* Адаптация для страницы "Контакты" */
@media (max-width: 768px) {
    .contacts-hero h1 {
        font-size: 32px;
    }

    .contact-buttons__wrapper {
        flex-direction: column;
        gap: 15px;
    }

    .geography__title {
        font-size: 22px;
    }

    .geography__subtitle {
        font-size: 16px;
    }
}
/* --- STYLES FOR "ABOUT US" PAGE --- */

/* 1. Hero Block */
.about-hero {
    background-color: #FFFFFF; /* White or light tiffany as per TZ */
    padding: 60px 20px;
}

.about-hero__content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 50px;
    align-items: center;
    max-width: 1200px;
    margin: 0 auto;
}

.about-hero__text h1 {
    font-family: 'Montserrat', sans-serif;
    font-size: 3em;
    margin-bottom: 20px;
}

.about-hero__subtitle {
    font-size: 1.2em;
    line-height: 1.6;
    margin-bottom: 30px;
}

.about-hero__image img {
    width: 100%;
    border-radius: 15px;
    object-fit: cover;
}

/* 2. Mission and Values */
.mission-values {
    text-align: center;
    padding: 60px 20px;
    background-color: #F9FAFB;
}

.mission-values .section-title {
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}

.mission-values__content {
    max-width: 700px;
    margin: 0 auto 40px;
    font-size: 1.1em;
    line-height: 1.7;
}

.mission-values__bullets {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
    max-width: 900px;
    margin: 0 auto;
    text-align: left;
}

.bullet-item {
    display: flex;
    align-items: center;
    gap: 15px;
    background-color: #FFFFFF;
    padding: 20px;
    border-radius: 10px;
}

.bullet-icon {
    font-size: 1.5em;
    color: #03d3dd;
}

.bullet-item p {
    margin: 0;
    font-weight: 500;
}

/* 3. Clinic Facts */
.clinic-facts {
    padding: 60px 20px;
}

.clinic-facts__content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 50px;
    align-items: center;
    max-width: 1200px;
    margin: 0 auto;
}

.clinic-facts__list {
    list-style: none;
    padding: 0;
    margin-top: 20px;
}

.clinic-facts__list li {
    font-size: 1.1em;
    margin-bottom: 15px;
}

.clinic-facts__image img {
    width: 100%;
    border-radius: 15px;
}

/* 4. Our Approach */
.our-approach {
    background-color: #F9FAFB;
    padding: 60px 20px;
    text-align: center;
}

.our-approach__text {
    max-width: 800px;
    margin: 0 auto 30px;
    font-size: 1.1em;
    line-height: 1.7;
}

.our-approach__quote {
    max-width: 700px;
    margin: 0 auto;
    padding: 20px;
    border-left: 4px solid #03d3dd;
    background-color: #FFFFFF;
    text-align: left;
    font-style: italic;
}

.our-approach__quote p {
    margin: 0;
}

.our-approach__quote footer {
    margin-top: 10px;
    font-weight: 700;
    color: #555;
}

/* 5. Team Section */
.team-section {
    padding: 60px 20px;
}

.team-cards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    max-width: 1000px;
    margin: 0 auto;
}

.team-card {
    text-align: center;
    background-color: #FFFFFF;
    padding: 20px;
    border-radius: 15px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.05);
}

.team-card img {
    width: 120px;
    height: 120px;
    border-radius: 50%;
    object-fit: cover;
    margin-bottom: 15px;
}

.team-card h3 {
    margin: 0 0 5px 0;
}

.team-card p {
    margin: 0;
    color: #6A6A6A;
}

/* 6. Geography Section */
.geography-section {
    padding: 60px 20px;
    background: linear-gradient(to bottom, rgba(46, 196, 182, 0.1), #FFFFFF);
    text-align: center;
}

.geography-section__content h2 {
    font-size: 2.2em;
}

/* 7. Final CTA */
.final-cta-about {
    padding: 60px 20px;
    text-align: center;
}

.final-cta-about h2 {
    font-size: 2.2em;
}

.final-cta-about p {
    font-size: 1.2em;
    margin-bottom: 30px;
}

.final-cta-about__buttons {
    display: flex;
    justify-content: center;
    gap: 20px;
}

/* 8. Legal Block */
.legal-block-about {
    background-color: #F8FAFB;
    padding: 30px 20px;
    text-align: center;
}

.legal-block-about p {
    margin: 5px 0;
    font-size: 14px;
    color: #6A6A6A;
}

/* --- ADAPTIVE STYLES --- */
@media (max-width: 768px) {
    .about-hero__content,
    .clinic-facts__content {
        grid-template-columns: 1fr;
        text-align: center;
    }

    .about-hero__image {
        order: -1; /* Image on top */
    }
    
    .about-hero__text h1 {
        font-size: 2.5em;
    }

    .mission-values__bullets,
    .team-cards {
        grid-template-columns: 1fr;
    }

    .final-cta-about__buttons {
        flex-direction: column;
        align-items: center;
    }

    .final-cta-about__buttons .cta-button {
        width: 100%;
        max-width: 300px;
    }
}
/* --- Стили для редизайна страницы "Контакты" --- */

/* Общий контейнер и главный элемент */
.contact-page-main {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.contact-container {
    width: 100%;
    max-width: 1040px;
    padding: 0 20px;
    box-sizing: border-box;
}

/* Блок 1: Hero-контакт */
.contact-hero-redesigned {
    background-color: #E8FBF9; /* Бледно-бирюзовый */
    width: 100%;
    padding: 80px 0;
    display: flex;
    justify-content: center;
    text-align: center;
}

.contact-hero-redesigned__title {
    font-family: 'Montserrat', sans-serif;
    font-size: 2.5em; /* ~40px */
    font-weight: 700;
    margin: 0 0 16px 0;
}

.contact-hero-redesigned__subtitle {
    font-size: 1.125em; /* 18px */
    line-height: 1.6;
    color: #6A6A6A;
    margin: 0 0 40px 0;
}

.contact-hero-redesigned__actions {
    display: flex;
    justify-content: center;
    gap: 20px;
}

/* --- Стили для кнопок на странице "Контакты" --- */

.contact-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 320px;
    min-height: 60px;
    padding: 10px 24px;
    border-radius: 12px;
    font-family: 'Montserrat', sans-serif;
    font-size: 1.1em;
    font-weight: 700;
    text-decoration: none;
    border: 2px solid transparent;
    transition: transform 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease, color 0.2s ease;
    cursor: pointer;
    box-sizing: border-box;
}

.contact-btn:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
}

/* Кнопка "Позвонить" */
.contact-btn--phone {
    background-color: #03d3dd; /* Tiffany */
    color: white;
}

/* Кнопка "WhatsApp" */
.contact-btn--whatsapp {
    background-color: white;
    color: #25D366; /* WhatsApp Green */
    border-color: #25D366;
}

.contact-btn--whatsapp:hover {
    background-color: #25D366;
    color: white;
}

/* Кнопка "Telegram" */
.contact-btn--telegram {
    background-color: white;
    color: #0088cc; /* Telegram Blue */
    border-color: #0088cc;
}

.contact-btn--telegram:hover {
    background-color: #0088cc;
    color: white;
}

/* --- Стили для блока "География" на странице "Контакты" --- */

.contact-geography {
    background-color: #F9FBFB; /* Светло-серый */
    width: 100%;
    padding: 60px 0;
    display: flex;
    justify-content: center;
}

.contact-geography__card {
    background-color: white;
    border-radius: 20px;
    padding: 40px;
    text-align: center;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.07);
    max-width: 960px;
}

.contact-geography__title {
    font-size: 22px;
    font-weight: 700;
    margin: 0 0 12px 0;
}

.contact-geography__subtitle {
    font-size: 16px;
    color: #6A6A6A;
    line-height: 1.6;
    margin: 0;
}

/* --- Стили для блока "Призыв к действию" --- */

.contact-cta {
    background-color: white;
    width: 100%;
    padding: 60px 0;
    display: flex;
    justify-content: center;
    text-align: center;
}

.contact-cta__text {
    font-size: 1.125em; /* 18px */
    line-height: 1.7;
    color: #2B2B2B;
    margin: 0 0 25px 0;
}

.contact-cta__btn {
    display: inline-block;
    background-color: #03d3dd; /* Tiffany */
    color: white;
    padding: 16px 32px;
    border-radius: 12px;
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    text-decoration: none;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.contact-cta__btn:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 20px rgba(46, 196, 182, 0.3);
}

/* --- Стили для блока "Конфиденциальность" --- */

.contact-privacy {
    background-color: #F6F9FA;
    width: 100%;
    padding: 40px 0;
    border-top: 1px solid #E6EAEA;
    display: flex;
    justify-content: center;
    text-align: center;
}

.contact-privacy .contact-container {
    max-width: 600px;
}

.contact-privacy__icon {
    font-size: 2em;
    margin-bottom: 16px;
}

.contact-privacy__text {
    font-size: 14px;
    color: #6A6A6A;
    line-height: 1.6;
    margin: 0;
}

.contact-privacy__disclaimer {
    display: block;
    margin-top: 10px;
    opacity: 0.8;
}

/* Общие отступы между блоками */
.contact-page-main > section:not(:last-child) {
    margin-bottom: 60px;
}

/* --- Адаптация для мобильных устройств --- */
@media (max-width: 768px) {
    .contact-hero-redesigned {
        padding: 60px 0;
    }

    .contact-hero-redesigned__actions {
        flex-direction: column;
        align-items: center;
    }

    .contact-btn {
        width: 100%;
        max-width: 320px; /* Ограничиваем максимальную ширину на мобильных */
    }

    .contact-geography {
        padding: 40px 0;
    }

    .contact-geography__card {
        padding: 30px;
    }

    .contact-page-main > section:not(:last-child) {
        margin-bottom: 40px;
    }
}
/* --- Threat Section --- */
.threat-section {
    background-color: #FAFBFB; /* Бледно-серый фон */
    padding: 80px 0;
}

.threat-section .container {
    max-width: 1140px;
    margin: 0 auto;
    padding: 0 15px;
}

.threat-section__header {
    text-align: center;
    margin-bottom: 40px;
}

.threat-section__header .section-title {
    font-size: 32px;
    color: #000;
    margin-bottom: 12px;
}

.threat-section__header .section-subtitle {
    font-size: 18px;
    color: #4A4A4A;
    max-width: 700px;
    margin: 0 auto;
    line-height: 1.6;
}

.threat-cards-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
    margin-bottom: 60px;
}

.threat-card {
    background-color: #F8FAFA;
    border-radius: 16px;
    padding: 24px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06);
    display: flex;
    align-items: flex-start;
    gap: 20px;
}

.threat-card__icon-wrapper {
    flex-shrink: 0;
    width: 48px;
    height: 48px;
    background-color: #03d3dd; /* Тиффани */
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.threat-card__icon-placeholder {
    font-size: 24px;
}

.threat-card__content {
    text-align: left;
}

.threat-card__title {
    font-size: 18px;
    font-weight: 700;
    color: #000;
    margin: 0 0 8px 0;
}

.threat-card__text {
    font-size: 16px;
    color: #4A4A4A;
    line-height: 1.5;
    margin: 0;
}

.threat-cta-block {
    background-color: #E9FBF8; /* Очень светлый тиффани */
    border-radius: 16px;
    padding: 40px;
    text-align: center;
}

.threat-cta-block__text {
    font-size: 18px;
    color: #000;
    max-width: 600px;
    margin: 0 auto 24px auto;
    line-height: 1.6;
}

.threat-cta-block .cta-button.primary {
    background-color: #03d3dd;
    color: #fff;
    transition: box-shadow 0.3s ease;
}

.threat-cta-block .cta-button.primary:hover {
    box-shadow: 0 4px 12px rgba(46, 196, 182, 0.4);
}

/* --- Threat Section Responsive --- */
@media (max-width: 768px) {
    .threat-section {
        padding: 60px 0;
    }

    .threat-section .container {
        padding: 0 16px; /* Отступы по краям */
    }

    .threat-section__header .section-title {
        font-size: 26px; /* Уменьшенный заголовок */
    }

    .threat-section__header .section-subtitle {
        font-size: 16px;
    }

    .threat-cards-grid {
        grid-template-columns: 1fr; /* Карточки в один столбец */
        gap: 16px;
        margin-bottom: 40px;
    }

    .threat-card {
        padding: 20px;
    }

    .threat-cta-block {
        padding: 24px;
    }

    .threat-cta-block__text {
        font-size: 16px;
    }

    .threat-cta-block .cta-button.primary {
        width: 100%; /* Кнопка во всю ширину */
        padding: 16px;
        font-size: 16px;
    }
}
/* --- Results Section Reworked --- */
.results-section-reworked {
    background-color: #FAFBFB;
    padding: 80px 0;
    text-align: center;
}

.results-section-reworked .section-title {
    font-size: 34px;
    font-weight: 700;
    margin-bottom: 60px;
}

.results-section-reworked__content {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 60px;
    text-align: left;
    margin-bottom: 40px;
}

.results-section-reworked__visual {
    flex: 0 0 300px;
    text-align: center;
}

.results-section-reworked__circle {
    width: 200px;
    height: 200px;
    border-radius: 50%;
    background-color: #E5E5E5;
    margin: 0 auto 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    overflow: hidden;
}

.results-section-reworked__circle::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #03d3dd;
    clip-path: polygon(50% 0%, 100% 0%, 100% 100%, 50% 100%, 50% 50%); /* Примерно 82% */
    transform: rotate(-151deg); /* Поворот для 82% */
    opacity: 0.4;
}


.results-section-reworked__icon {
    font-size: 80px;
    color: #03d3dd;
    position: relative;
    z-index: 1;
}

.results-section-reworked__visual-caption {
    font-size: 15px;
    color: #4A4A4A;
    line-height: 1.6;
    max-width: 280px;
    margin: 0 auto;
}

.results-section-reworked__text-content {
    flex: 1;
    max-width: 600px;
}

.results-section-reworked__text-content p {
    font-size: 18px;
    line-height: 1.7;
    margin-bottom: 20px;
}

.results-section-reworked__disclaimer {
    font-size: 16px;
    color: #777;
    font-style: italic;
}

.results-section-reworked__footer-note {
    border-top: 1px solid #E5E5E5;
    padding-top: 40px;
    margin-top: 40px;
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}

.results-section-reworked__footer-note p {
    font-size: 16px;
    color: #4A4A4A;
    line-height: 1.6;
}

/* --- Responsive --- */
@media (max-width: 768px) {
    .results-section-reworked__content {
        flex-direction: column;
        gap: 40px;
        text-align: center;
    }

    .results-section-reworked__text-content {
        text-align: left;
    }
}
/* --- Steps Section --- */
.steps-section {
    position: relative;
    padding: 100px 0;
    background-image: url('assets/steps-bg-desktop.webp'); /* Путь к фоновому изображению */
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    color: #1A1A1A;
}

.steps-section__overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(255, 255, 255, 0.75);
    z-index: 1;
}

.steps-section .container {
    position: relative;
    z-index: 2;
    text-align: center;
}

.steps-section .section-title {
    font-size: 40px;
    font-weight: 700;
    color: #1A1A1A;
    margin-bottom: 60px;
}

.steps-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
    margin-bottom: 60px;
}

.step-card {
    background-color: rgba(255, 255, 255, 0.9);
    border-radius: 12px;
    padding: 30px;
    box-shadow: 0px 4px 12px rgba(0,0,0,0.1);
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.5s ease, transform 0.5s ease;
}

.step-card.is-visible {
    opacity: 1;
    transform: translateY(0);
}

.step-card__icon {
    font-size: 2em;
    margin-bottom: 15px;
}

.step-card__title {
    font-size: 1.2em;
    font-weight: 700;
    margin: 0 0 10px 0;
}

.step-card__text {
    font-size: 1em;
    color: #4A4A4A;
    margin: 0;
}

.steps-section__cta {
    margin-top: 40px;
}

/* --- Responsive --- */
@media (max-width: 992px) {
    .steps-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .steps-section {
        background-image: url('assets/steps-bg-mobile.webp');
    }
    .steps-grid {
        grid-template-columns: 1fr;
    }
}
/* --- Steps Section V2 --- */
.steps-section-v2 {
    position: relative;
    padding: 100px 0;
    background-image: url('assets/Lucid_Realism_ultrarealistic_professional_commercial_photo_for_2.jpg'); /* Путь к фоновому изображению */
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    color: #1A1A1A;
    max-width: none;
}

.steps-section-v2__overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(255, 255, 255, 0.6);
    z-index: 1;
}

.steps-section-v2 .container {
    position: relative;
    z-index: 2;
    text-align: center;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

.steps-section-v2 .section-title {
    font-size: 42px;
    font-weight: 700;
    color: #1A1A1A;
    margin-bottom: 60px;
    text-shadow: 0 0 15px white;
}

.steps-grid-v2 {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
    margin-bottom: 60px;
}

.step-card-v2 {
    background-color: rgba(255, 255, 255, 0.92);
    border-radius: 14px;
    padding: 30px;
    text-align: center;
    box-shadow: 0 4px 10px rgba(0,0,0,0.08);
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.5s ease, transform 0.5s ease;
}

.step-card-v2.is-visible {
    opacity: 1;
    transform: translateY(0);
}

.step-card-v2__icon {
    width: 50px;
    height: 50px;
    background-color: #03d3dd;
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5em;
    font-weight: 700;
    margin: 0 auto 20px;
}

.step-card-v2__title {
    font-size: 18px;
    font-weight: 700;
    margin: 0 0 10px 0;
}

.step-card-v2__text {
    font-size: 16px;
    color: #4A4A4A;
    line-height: 1.6;
    margin: 0;
}

.steps-section-v2__cta {
    margin-top: 40px;
}

.steps-section-v2__cta .cta-button {
    padding: 16px 32px;
    border-radius: 14px;
    background-color: #03d3dd;
    transition: box-shadow 0.3s ease;
}

.steps-section-v2__cta .cta-button:hover {
    box-shadow: 0 6px 18px rgba(3, 211, 221, 0.4);
}

/* --- Responsive --- */
@media (max-width: 992px) {
    .steps-grid-v2 {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .steps-section-v2 {
        background-image: url('assets/Lucid_Realism_ultrarealistic_professional_commercial_photo_for_2.jpg');
    }
    .steps-grid-v2 {
        grid-template-columns: 1fr;
    }
}
/* --- FAQ Section --- */
.faq-section {
    background-color: #fff;
    padding: 80px 0;
}

.faq-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
    display: grid;
    grid-template-columns: 1fr 2fr;
    gap: 60px;
    align-items: flex-start;
}

.faq-header .section-title {
    text-align: left;
}

.faq-header .section-subtitle {
    text-align: left;
    margin-left: 0;
    margin-right: 0;
    max-width: none;
}

.faq-header .cta-button {
    background-color: #1FC9C5;
    margin-top: 20px;
}

.faq-header .cta-button:hover {
    background-color: #18b5b1;
}

.faq-accordion {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.faq-item {
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    transition: border-color 0.3s ease;
}

.faq-item.active {
    border-color: #1FC9C5;
}

.faq-question {
    width: 100%;
    background: none;
    border: none;
    padding: 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
    text-align: left;
    font-size: 1.1em;
    font-weight: 700;
    font-family: 'Montserrat', sans-serif;
}

.faq-icon {
    transition: transform 0.3s ease;
}

.faq-item.active .faq-icon {
    transform: rotate(45deg);
}

.faq-answer {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.4s ease-out, padding 0.4s ease-out;
    padding: 0 20px;
}

.faq-answer p {
    margin: 0;
    padding-bottom: 20px;
    color: #4A4A4A;
    line-height: 1.6;
}

@media (max-width: 768px) {
    .faq-container {
        grid-template-columns: 1fr;
    }

    .faq-header {
        text-align: center;
    }

    .faq-header .section-title,
    .faq-header .section-subtitle {
        text-align: center;
    }
}
/* --- NEW DANGER SIGNALS SECTION STYLES --- */

/* Override for full-width background */
main > .danger-signals {
    max-width: none;
    padding: 0;
}

.danger-signals {
    position: relative;
    /* padding is now handled by the container and the rule above */
    background-image: url('assets/Lucid_Realism_hyperrealistic_bright_medical_room_scene_doctor__1.jpg'); /* ЗАМЕНИТЬ НА РЕАЛЬНОЕ ИЗОБРАЖЕНИЕ */
    background-size: cover;
    background-position: center;
    overflow: hidden;
    background-attachment: fixed;
}

/* Removed .danger-signals::before to show the background image clearly */

.danger-signals__container {
    position: relative;
    z-index: 2;
    max-width: 1160px; /* 1120px + 20px padding */
    margin: 0 auto;
    padding: 64px 20px; /* Added vertical padding here */
}

.danger-signals__title {
    font-family: 'Montserrat', sans-serif;
    font-size: 24px;
    font-weight: 600;
    color: #111;
    text-align: center;
    margin: 0 0 16px 0;
}

.danger-signals__subtitle {
    font-size: 20px;
    color: #4A4A4A;
    line-height: 1.6;
    text-align: center;
    max-width: 780px;
    margin: 0 auto 40px auto;
}

.danger-signals__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 32px;
    align-items: start;
}

/* Left Column: Symptoms Card */
.danger-signals__symptoms-card {
    background-color: #FFF;
    border: 1px solid #EAF7F6;
    border-radius: 16px;
    padding: 28px;
    box-shadow: 0 6px 18px rgba(0,0,0,.06);
}

.danger-signals__symptoms-card h3 {
    font-family: 'Montserrat', sans-serif;
    font-size: 20px;
    font-weight: 600;
    color: #111;
    margin: 0 0 20px 0;
}

.symptoms-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.symptom-item {
    display: flex;
    align-items: center;
    padding: 8px 16px;
    border-radius: 12px;
    background-color: #FFF;
    transition: background-color 0.2s ease;
    font-size: 18px;
    color: #1A1A1A;
    line-height: 1.5;
}

.symptom-item:hover {
    background-color: #F9FEFE;
}

.symptom-icon {
    flex-shrink: 0;
    width: 24px;
    height: 24px;
    margin-right: 12px;
    background-color: #03d3dd;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.symptom-icon::before {
    content: '✓';
    color: #FFF;
    font-weight: 700;
    font-size: 14px;
}

.danger-signals__symptoms-card .symptoms-list li::before {
    content: none; /* отключаем вторую галочку */
}

/* Right Column: Info Cards */
.danger-signals__info-column {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.info-card {
    background-color: #FFF;
    border: 1px solid #EAF7F6;
    border-radius: 16px;
    box-shadow: 0 6px 18px rgba(0,0,0,.06);
    display: flex;
    padding: 28px;
}

.info-card__accent-line {
    flex-shrink: 0;
    width: 4px;
    background-color: #03d3dd;
    border-radius: 2px;
    margin-right: 24px;
}

.info-card__content h4 {
    font-family: 'Montserrat', sans-serif;
    font-size: 20px;
    font-weight: 600;
    color: #111;
    margin: 0 0 12px 0;
}

.info-card__content p {
    font-size: 17px;
    color: #444;
    line-height: 1.65;
    margin: 0;
}

/* CTA Button */
.danger-signals__cta-container {
    text-align: center;
    margin-top: 40px;
}

.danger-signals__cta-button {
    min-width: 420px;
    min-height: 56px;
    border-radius: 16px;
    background-color: #03d3dd;
    color: #FFF;
    font-size: 18px;
    font-weight: 700;
    border: none;
    cursor: pointer;
    transition: background-color 0.2s ease, box-shadow 0.2s ease;
}

.danger-signals__cta-button:hover {
    background-color: #02c1ce;
    box-shadow: 0 10px 24px rgba(3, 211, 221, 0.25);
}

.danger-signals__cta-button:focus {
    outline: 2px solid #03d3dd;
    outline-offset: 2px;
}

/* --- RESPONSIVE STYLES --- */

/* Tablet */
@media (max-width: 1024px) {
    .danger-signals__grid {
        grid-template-columns: 1fr;
    }
    .danger-signals__info-column {
        order: -1; /* Move info column to the top */
    }
}

/* Mobile */
@media (max-width: 600px) {
    .danger-signals {
        padding: 40px 0;
    }
    .danger-signals__container {
        padding: 32px 24px;
    }
    .danger-signals__title {
        font-size: 32px;
    }
    .danger-signals__subtitle {
        font-size: 18px;
    }
    .danger-signals__symptoms-card,
    .info-card {
        padding: 24px;
    }
    .symptom-item {
        font-size: 16px;
    }
    .info-card__content p {
        font-size: 16px;
    }
    .danger-signals__cta-button {
        width: 100%;
        min-width: 0;
        display: inline-flex;
        justify-content: center;
        align-items: center;
        margin: 0 auto;
    }
    .danger-signals__cta-container {
        padding-bottom: 96px;
        display: flex;
        justify-content: center;
    }
    .danger-signals__cta-button.sticky {
        position: fixed;
        bottom: calc(16px + env(safe-area-inset-bottom));
        left: 16px;
        right: 16px;
        transform: none;
        margin: 0 auto;
        width: auto;
        max-width: 420px;
        border-radius: 16px;
        padding-bottom: 15px;
        padding-bottom: calc(15px + env(safe-area-inset-bottom));
        min-height: 56px;
        box-shadow: 0 12px 32px rgba(3, 211, 221, 0.28);
        z-index: 100;
    }
}
/* --- NEW THREATS SECTION V2 STYLES --- */

.threat-v2 {
    padding: 72px 0;
    background-color: #F9FAFB; /* Light gray background */
}

.threat-v2__container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 24px;
}

.threat-v2__main-grid {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 32px;
    align-items: stretch; /* Changed from start to stretch */
}

/* Left Column: Main Content */
.threat-v2__header {
    text-align: center;
    margin-bottom: 32px;
}

.threat-v2__title {
    font-family: 'Montserrat', sans-serif;
    font-size: 22px;
    font-weight: 700;
    color: #111;
    margin: 0 0 16px 0;
}

.threat-v2__subtitle {
    font-size: 18px;
    color: #4A4A4A;
    line-height: 1.6;
    max-width: 760px;
    margin: 0 auto 24px;
}

.threat-v2__cards-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    grid-auto-rows: 1fr; /* Equal height for cards */
}

.threat-v2-card {
    background-color: #FFF;
    border-radius: 16px;
    padding: 24px;
    box-shadow: 0 8px 20px rgba(0,0,0,.06);
    text-align: left;
    opacity: 0; /* For animation */
    transform: translateY(20px); /* For animation */
    transition: opacity 0.25s ease-out, transform 0.25s ease-out;
}

.threat-v2-card__icon {
    font-size: 24px;
    width: 48px;
    height: 48px;
    background-color: #E6FFFA;
    color: #03d3dd;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 16px;
}

.threat-v2-card__title {
    font-family: 'Montserrat', sans-serif;
    font-size: 18px;
    font-weight: 700;
    color: #111;
    margin: 0 0 8px 0;
}

.threat-v2-card__text {
    font-size: 16px;
    color: #4A4A4A;
    line-height: 1.6;
    margin: 0;
}

/* Right Column: Sticky CTA */
.threat-v2__cta-aside {
    position: sticky;
    top: 96px; /* Adjust based on header height */
}

.cta-card {
    background-color: #E9FBF8;
    border-radius: 16px;
    padding: 28px;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    box-sizing: border-box;
}

.cta-card__text {
    font-size: 17px;
    color: #223;
    line-height: 1.6;
    margin: 0 0 24px 0;
}

.cta-card__button {
    width: 100%;
    height: 52px;
    border-radius: 14px;
    background-color: #03d3dd;
    color: #FFF;
    font-size: 18px;
    font-weight: 700;
    border: none;
    cursor: pointer;
    transition: background-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

.cta-card__button:hover {
    background-color: #0EBEB0;
    box-shadow: 0 10px 24px rgba(0,196,179,.25);
    transform: scale(1.01);
}

/* --- RESPONSIVE STYLES --- */

/* Tablet */
@media (max-width: 1024px) {
    .threat-v2__main-grid {
        grid-template-columns: 1fr;
    }
    .threat-v2__cta-aside {
        position: static;
        margin-top: 32px;
    }
}

/* Mobile */
@media (max-width: 600px) {
    .threat-v2 {
        padding: 56px 0;
    }
    .threat-v2__container {
        padding: 0 20px;
    }
    .threat-v2__cards-grid {
        grid-template-columns: 1fr;
    }
    .cta-card__button {
        width: 100%;
    }
}
/* --- COMPOSITION SECTION V2 --- */
.composition-v2 {
    padding: 72px 0;
    background: linear-gradient(180deg, #FFFFFF 0%, #F7FFFE 100%);
}

.composition-v2__container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 24px;
}

.composition-v2__title {
    font-family: 'Montserrat', sans-serif;
    font-size: 24px;
    font-weight: 700;
    color: #111;
    text-align: center;
    margin: 0 0 16px 0;
}

.composition-v2__subtitle {
    font-size: 18px;
    color: #4A4A4A;
    line-height: 1.6;
    text-align: center;
    max-width: 760px;
    margin: 0 auto 48px auto;
}

.composition-v2__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}

.composition-v2-card {
    background-color: #FFFFFF;
    border-radius: 16px;
    padding: 22px;
    box-shadow: 0 8px 20px rgba(0,0,0,.06);
    display: flex;
    align-items: flex-start;
    gap: 16px;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.composition-v2-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 24px rgba(0,196,179,.18);
}

.composition-v2-card__icon {
    flex-shrink: 0;
    width: 48px;
    height: 48px;
    background-color: #03d3dd;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
}

.composition-v2-card__title {
    font-family: 'Montserrat', sans-serif;
    font-size: 18px;
    font-weight: 600;
    color: #111;
    margin: 0 0 8px 0;
}

.composition-v2-card__text {
    font-size: 15px;
    color: #4A4A4A;
    line-height: 1.6;
    margin: 0;
}

.composition-v2__footer {
    text-align: center;
    margin-top: 48px;
}

.composition-v2__cta-button {
    height: 48px;
    padding: 0 28px;
    border: none;
    border-radius: 14px;
    background-color: #03d3dd;
    color: #FFF;
    font-size: 16px;
    font-weight: 700;
    cursor: pointer;
    box-shadow: 0 10px 24px rgba(0,196,179,.2);
    transition: background-color 0.2s ease, box-shadow 0.2s ease;
}

.composition-v2__cta-button:hover {
    background-color: #02c1ce;
    box-shadow: 0 12px 28px rgba(0,196,179,.3);
}

.composition-v2__disclaimer {
    font-size: 14px;
    color: #6B6B6B;
    margin: 24px auto 0 auto;
    max-width: 600px;
    line-height: 1.5;
}

/* --- Responsive --- */
@media (max-width: 1024px) {
    .composition-v2__grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 600px) {
    .composition-v2 {
        padding: 56px 0;
    }
    .composition-v2__title {
        font-size: 32px;
    }
    .composition-v2__subtitle {
        font-size: 16px;
    }
    .composition-v2__grid {
        grid-template-columns: 1fr;
    }
}
/* --- NEW REAL RESULTS SECTION V2 --- */
.real-results-v2 {
    max-width: none; /* Override parent constraint for full-width background */
    position: relative;
    padding: 80px 0; /* 72-96px range */
    background-image: url('assets/Lucid_Origin_Hyperrealistic_cinematic_closeup_of_an_IV_drip_in_2.jpg');
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
}

.real-results-v2::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(255, 255, 255, 0.25); /* 25% white overlay */
    z-index: 1;
}

.real-results-v2__container {
    position: relative;
    z-index: 2;
    max-width: 1168px; /* 1120px + 2*24px padding */
    margin: 0 auto;
    padding: 0 24px;
}

.real-results-v2__title {
    font-family: 'Montserrat', sans-serif;
    font-size: 22px;
    font-weight: 700;
    color: #111;
    text-align: center;
    margin: 0 0 16px 0;
}

.real-results-v2__subtitle {
    font-size: 18px;
    color: #4A4A4A;
    line-height: 1.6;
    text-align: center;
    max-width: 700px;
    margin: 0 auto 48px auto;
}

.real-results-v2__grid {
    display: flex; /* Changed to flex */
    justify-content: flex-start; /* Align to the left */
}

.real-results-v2__text-card {
    max-width: 600px; /* Limit card width */
    background-color: #FFFFFF;
    border-radius: 16px;
    padding: 32px;
    box-shadow: 0 8px 24px rgba(0,0,0,0.05);
}

.real-results-v2__text-card p {
    font-size: 17px;
    line-height: 1.6;
    color: #2B2B2B;
    margin: 0 0 1em 0;
}
.real-results-v2__text-card p:last-child {
    margin-bottom: 0;
}

.real-results-v2__text-card ul {
    list-style: none;
    padding: 0;
    margin: 1em 0;
    display: flex;
    flex-direction: column;
    gap: 0.5em;
}

.real-results-v2__text-card li {
    font-size: 17px;
    line-height: 1.6;
    padding-left: 28px;
    position: relative;
}

.real-results-v2__text-card li::before {
    content: '•';
    color: #03d3dd;
    position: absolute;
    left: 10px;
    font-size: 1.2em;
}

.tiffany-accent {
    color: #03d3dd;
    font-weight: 500;
}

.real-results-v2__disclaimer {
    font-size: 15px !important;
    color: #6A6A6A !important;
    margin-top: 24px !important;
}

/* CTA Button */
.real-results-v2__cta-container {
    text-align: center;
    margin-top: 48px;
}

/* Responsive */
@media (max-width: 768px) {
    .real-results-v2__grid {
        justify-content: center; /* Center on mobile */
    }
    .real-results-v2__title {
        font-size: 32px;
    }
}
/* --- Individual Selection Section --- */
.individual-selection-card {
    background: linear-gradient(180deg, #F9FFFD 0%, #EDFFFB 100%);
    border-radius: 16px;
    padding: 28px 40px;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.05);
    display: flex;
    align-items: flex-start;
    gap: 20px;
    transition: box-shadow 0.3s ease;
    height: 100%;
    grid-column: span 2;
}

.individual-selection-card:hover {
    box-shadow: 0 6px 20px rgba(0, 196, 179, 0.15);
}

.individual-selection-card__icon {
    flex-shrink: 0;
}

.individual-selection-card__content h3 {
    font-family: 'Montserrat', sans-serif;
    font-size: 1.2em;
    margin-top: 0;
    margin-bottom: 15px;
}

.individual-selection-card__content p {
    margin: 0 0 10px 0;
    line-height: 1.6;
}

.individual-selection-card__content p:last-child {
    margin-bottom: 0;
}
/* --- Стили для нового блока "4 шага к свободе" --- */
.steps-timeline-section {
    --steps-timeline-primary-color: #03d3dd; /* Tiffany */
    --steps-timeline-primary-light: #DFF7F4;
    --steps-timeline-primary-lighter: #EAF7F6;
    --steps-timeline-text-dark: #111;
    --steps-timeline-text-light: #444;
    --steps-timeline-bg-light: #E9FBF8;
    --steps-timeline-shadow: 0 8px 22px rgba(0,0,0,.06);
    --steps-timeline-shadow-hover: 0 14px 28px rgba(0,196,179,.14);

    background-color: #F9FAFB; /* Легкий фон для всей секции */
    padding: 80px 0;
    overflow-x: hidden; /* Предотвращение горизонтального скролла из-за анимаций */
}

.steps-timeline-container {
    position: relative;
    z-index: 2;
    max-width: 800px;
    margin: 0 auto;
    padding: 0 24px;
}

.timeline {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 24px;
    margin-top: 40px;
}

/* Вертикальная линия таймлайна */
.timeline::before {
    content: '';
    position: absolute;
    top: 22px; /* Начало от центра первого круга */
    bottom: 22px; /* Конец у центра последнего круга */
    left: 26px; /* Позиционирование по центру круга (52px / 2) */
    width: 2px;
    background-color: var(--steps-timeline-primary-light);
    z-index: 0;
}

.timeline-step {
    display: grid;
    grid-template-columns: 52px 1fr; /* Иконка/номер + контент */
    gap: 24px;
    align-items: start;
    position: relative;
    z-index: 1;
}

.timeline-step__number {
    width: 52px;
    height: 52px;
    border-radius: 50%;
    background-color: var(--steps-timeline-primary-color);
    color: #FFF;
    font-size: 18px;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.timeline-step:hover .timeline-step__number {
    transform: scale(1.06);
    box-shadow: 0 0 0 6px rgba(0,196,179,.10);
}

.timeline-step__card {
    background-color: #FFF;
    border-radius: 16px;
    border: 1px solid var(--steps-timeline-primary-lighter);
    padding: 22px;
    box-shadow: var(--steps-timeline-shadow);
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.timeline-step:hover .timeline-step__card {
    transform: translateY(-2px);
    box-shadow: var(--steps-timeline-shadow-hover);
    border-color: #CFF5F1;
}

.timeline-step__header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 12px;
}

.timeline-step__icon {
    width: 24px;
    height: 24px;
    color: var(--steps-timeline-primary-color);
}

.timeline-step__title {
    font-size: 20px;
    font-weight: 700;
    color: var(--steps-timeline-text-dark);
    margin: 0;
}

.timeline-step__title .subtitle {
    font-weight: 400;
    color: var(--steps-timeline-text-light);
}

.timeline-step__body p {
    font-size: 16px;
    color: var(--steps-timeline-text-light);
    line-height: 1.65;
    margin: 0;
}

.step-accordion {
    margin-top: 16px;
}

.step-accordion__toggle {
    background: none;
    border: none;
    color: var(--steps-timeline-primary-color);
    font-weight: 600;
    cursor: pointer;
    padding: 4px 0;
}

.step-accordion__content {
    overflow: hidden;
    transition: max-height 0.3s ease-out;
    font-size: 15px;
    color: var(--steps-timeline-text-light);
    line-height: 1.6;
    max-height: 0;
}

.step-accordion__content p {
    padding-top: 12px;
}

.steps-cta-banner {
    text-align: center;
    margin-top: 40px;
}

.steps-cta-banner__text {
    font-size: 17px;
    font-weight: 500;
    color: #223;
    margin: 0;
}


.steps-timeline-section__micro-copyright {
    text-align: center;
    font-size: 14px;
    color: #6A6A6A;
    margin-top: 24px;
}

.timeline-step {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 220ms ease-out, transform 220ms ease-out;
}

.timeline-step.is-visible {
    opacity: 1;
    transform: translateY(0);
}

@media (prefers-reduced-motion: reduce) {
    .timeline-step:hover .timeline-step__number,
    .timeline-step:hover .timeline-step__card,
    .steps-cta-banner__button {
        transition: none;
        transform: none;
    }
    .timeline-step {
        transition: none;
        opacity: 1;
        transform: none;
    }
}

/* --- Адаптация для блока "4 шага к свободе" --- */

@media (max-width: 1024px) {
    .steps-cta-banner {
        flex-direction: column;
        gap: 16px;
        text-align: center;
    }
}

@media (max-width: 600px) {
    .steps-timeline-section {
        padding: 64px 0;
    }

    .timeline::before {
        display: none;
    }

    .timeline-step {
        grid-template-columns: 1fr; /* Все в одну колонку */
        gap: 16px;
        text-align: center;
    }

    .timeline-step__number {
        width: 48px;
        height: 48px;
        font-size: 18px;
        margin: 0 auto; /* Центрирование */
    }
    
    .timeline-step:hover .timeline-step__number {
        transform: none;
        box-shadow: none;
    }

    .timeline-step__card {
        padding: 20px;
        text-align: left;
    }
    
    .timeline-step:hover .timeline-step__card {
        transform: none;
        box-shadow: var(--steps-timeline-shadow);
        border-color: var(--steps-timeline-primary-lighter);
    }

    .timeline-step__header {
        justify-content: center;
        text-align: center;
    }
    
    .timeline-step__title {
        font-size: 18px;
    }

    .steps-cta-banner {
        padding: 20px;
    }

    .steps-cta-banner__button {
        width: 100%;
    }
}
/* --- Styles for Hangover Risks Block (id=risks-hangover) --- */

#risks-hangover .cta-card {
    background-color: #E6FBFD;
}

#risks-hangover .threat-v2-card:hover {
    border-color: #03d3dd;
}

#risks-hangover .cta-button.primary {
    background-color: #03d3dd;
    color: #fff;
    border-radius: 16px;
    border: none;
}

#risks-hangover .cta-button.primary:hover {
    background-color: #02bccc;
}

#risks-hangover .cta-link.secondary {
    display: block;
    margin-top: 12px;
    text-align: center;
    color: #03d3dd;
    text-decoration: none;
    font-weight: 500;
}

#risks-hangover .cta-link.secondary:hover {
    text-decoration: underline;
}

.threat-v2__disclaimer {
    font-size: 14px;
    color: #6c757d;
    text-align: center;
    margin-top: 24px;
    padding: 0 16px;
}

/* Icons for the new block */
#risks-hangover .threat-v2-card__icon {
    font-size: 0; /* Hide fallback emoji */
    width: 48px;
    height: 48px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

.icon-dehydration {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%2303d3dd' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 2.69l5.66 5.66a8 8 0 1 1-11.31 0L12 2.69z'/%3E%3C/svg%3E");
}

.icon-heart {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%2303d3dd' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.84 4.61a5.5 5.5 0 0 0-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 0 0-7.78 7.78l1.06 1.06L12 21.23l7.78-7.78 1.06-1.06a5.5 5.5 0 0 0 0-7.78z'/%3E%3Cpolyline points='22 12 18 12 15 21 9 3 6 12 2 12'/%3E%3C/svg%3E");
}

.icon-stomach {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%2303d3dd' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 1.5c-5 0-9 4-9 9s4 9 9 9c4.42 0 8.1-3.13 8.8-7.25.22-1.25-.2-2.5-1-3.25s-1.9-1-3-1c-1.5 0-2.8.8-3.5 2-.7-1.2-2-2-3.5-2-1.1 0-2.1.5-2.8 1.25S6.25 10.25 6.5 11.5c.7 3.88 4.1 6.5 8.5 6.5'/%3E%3C/svg%3E");
}

.icon-anxiety {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%2303d3dd' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z'/%3E%3C/svg%3E");
}

/* Responsive font sizes for the new block title */
#risks-hangover .threat-v2__title {
    font-size: 20px;
    line-height: 1.3;
}

@media (max-width: 768px) {
    #risks-hangover .threat-v2__title {
        font-size: 20px;
        line-height: 1.4;
    }
}

/* Fix for text color in steps-section-v2 */
.steps-section-v2 .section-title,
.steps-section-v2 .section-subtitle {
    color: #1A1A1A !important;
}
/* --- CTA Band in Steps Section --- */
.cta-band {
    background-color: #E9FBF8; /* Very light Tiffany */
    border-radius: 16px;
    padding: 24px 32px;
    margin-top: 40px;
    border: 1px solid #DFF7F4;
}

.cta-band__inner {
    max-width: 800px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
}

.cta-band__text {
    flex-grow: 1; /* Позволяет текстовому блоку занять доступное место */
    font-size: 1.1em; /* 18px */
    font-weight: 500;
    color: #2B2B2B;
    margin: 0;
    line-height: 1.5;
    text-align: center; /* Выравнивает текст по центру */
}

.cta-band__text strong {
    font-weight: 700;
    display: block;
    margin-bottom: 4px;
}

.cta-band .cta-button {
    padding: 12px 24px;
    font-size: 1em;
    flex-shrink: 0; /* Prevent button from shrinking */
}


@media (max-width: 768px) {
    .cta-band {
        padding: 24px;
    }
    .cta-band__inner {
        flex-direction: column;
        text-align: center;
    }
    .cta-band__text {
        margin-bottom: 20px;
        text-align: center;
    }
    .cta-band .cta-button {
        width: 100%;
    }
}

/* --- Адаптация для шапки сайта --- */
@media (max-width: 1024px) {
    .site-header {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        z-index: 5000;
    }

    .site-header .container {
        padding: 0 24px;
    }

    .nav {
        display: none; /* Скрываем навигацию на планшетах и мобильных */
    }

    .actions .phone,
    .actions .search-btn {
        display: none; /* Скрываем телефон и поиск в actions */
    }

    .burger-menu {
        display: flex; /* Показываем бургер */
    }
}

@media (max-width: 1024px) {
    .site-header .container {
        display: flex;
        align-items: center;
        gap: 16px;
        flex-wrap: nowrap;
    }

    .logo {
        flex: 1 1 auto;
        min-width: 0;
        gap: 6px;
    }

    .site-header .actions{
        margin-left: 12px;
        gap: 12px;
    }

    .burger-menu {
        margin-left: auto;
        flex-shrink: 0;
    }

    .logo img{
        display: none;
    }
}

/* Стили для открытого мобильного меню */
.mobile-nav {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.97);
    backdrop-filter: blur(15px);
    z-index: 6000;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 32px;
    padding: 32px 24px 40px;
    transform: translateX(-100%);
    transition: transform 0.3s ease-in-out;
    overflow-y: auto;
}

.mobile-nav.is-open {
    transform: translateX(0);
}

.mobile-nav .nav {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 32px;
    margin-bottom: 40px;
}

.mobile-nav .nav a {
    font-size: 22px;
}

.mobile-nav .actions {
    flex-direction: column;
    gap: 20px;
    width: 100%;
    align-items: center;
}

.mobile-nav .phone {
    display: flex;
    font-size: 20px;
    align-items: center;
    gap: 10px;
}

.mobile-nav .btn-primary {
    padding: 14px 32px;
    font-size: 18px;
}

.mobile-nav__header {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
    padding-bottom: 16px;
    border-bottom: 1px solid rgba(11, 18, 32, 0.08);
}

.mobile-nav__close {
    width: 44px;
    height: 44px;
    border: none;
    background: rgba(11, 18, 32, 0.05);
    border-radius: 50%;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #0b1220;
    margin-right: 16px;
}

.mobile-nav__close-icon {
    width: 20px;
    height: 20px;
    pointer-events: none;
}

.mobile-nav__close:focus-visible {
    outline: 2px solid rgba(11, 18, 32, 0.35);
    outline-offset: 2px;
}

.mobile-nav__brand {
    display: flex;
    align-items: center;
    gap: 0;
    color: #0b1220;
    padding-left: 16px;
}

.mobile-nav__brand-logo {
    width: 48px;
    height: 48px;
    object-fit: contain;
}

.mobile-nav__brand-text {
    display: flex;
    flex-direction: column;
    line-height: 1.4;
    align-items: flex-start;
}

.mobile-nav__brand-name {
    font-weight: 700;
    font-size: 1rem;
}

.mobile-nav__brand-phone {
    color: #0b1220;
    font-weight: 600;
    text-decoration: none;
}
/* Анимация бургера */
.burger-menu.is-active span:nth-child(1) {
    transform: rotate(45deg) translate(5px, 5px);
}

.burger-menu.is-active span:nth-child(2) {
    opacity: 0;
}

.burger-menu.is-active span:nth-child(3) {
    transform: rotate(-45deg) translate(4px, -4px);
}

body.mobile-nav-open,
html.mobile-nav-open {
    overflow: hidden;
    height: 100%;
}

.burger-menu.is-active {
    width: 48px;
    height: 48px;
}

.burger-menu.is-active .burger-menu__close-icon {
    opacity: 1;
    transform: translate(-50%, -50%) scale(2);
}

.burger-menu.is-active span {
    opacity: 0;
    transform: none;
}
/* --- Стили для страницы "Снятие ломки" --- */

.hero-features {
    display: flex;
    justify-content: center;
    gap: 20px;
    margin-top: 20px;
    flex-wrap: wrap;
}

.hero-features span {
    background: rgba(255, 255, 255, 0.1);
    padding: 5px 15px;
    border-radius: 20px;
    font-size: 0.9em;
}


.proof .proof-icon {
    font-size: 2em;
}

.prices-section .price-card {
    border-radius: 20px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.08);
}

.cta-form form {
    display: flex;
    flex-direction: column;
    gap: 15px;
    max-width: 500px;
    margin: 30px auto 0;
}

.cta-form input[type="text"],
.cta-form input[type="tel"] {
    padding: 15px;
    border: 1px solid #ccc;
    border-radius: 20px;
}

.cta-form label {
    font-size: 0.9em;
    display: flex;
    align-items: center;
    gap: 10px;
}

.cta-button {
    border-radius: 56px;
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
    transition: all 0.2s ease;
}

.cta-button:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 15px rgba(0,0,0,0.15);
}

.cta-button.primary {
    background-color: #03d3dd;
    opacity: 1;
}

.cta-button.primary:hover {
    background-color: #02bccc;
}

@media (max-width: 768px) {
    .info-section__content {
        grid-template-columns: 1fr;
    }
}
/* Стили для полноширинного hero-блока */
.hero-fullwidth {
    max-width: none;
    padding-left: 0;
    padding-right: 0;
}

.hero-fullwidth .hero-content {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}
/* Фон для блока "Как проходит снятие ломки" */
.snyatie-lomki-steps-bg {
    background-image: url('assets/Lucid_Origin_A_professional_doctor_in_a_teal_Tiffany_medical_u_1.jpg');
}

/* Фон для страницы "Снятие ломки" */
.hero-snyatie-lomki {
    background-image: url('assets/price3.jpg');
    background-size: cover;
    background-position: center;
}
/* Исправление читаемости текста в блоке "Как проходит снятие ломки" */
.snyatie-lomki-steps-bg .steps-section-v2__overlay {
    background-color: rgba(255, 255, 255, 0.92); /* Максимально осветляем фон */
}

.snyatie-lomki-steps-bg .section-title {
    color: #0b1220 !important; /* Гарантированно черный цвет */
    text-shadow: none !important;
    position: relative; /* Выносим на передний план */
    z-index: 3;
}
/* --- Стили для аккордеона в блоке "Как проходит снятие ломки" --- */
.timeline-step__card {
    display: flex;
    flex-direction: column;
    padding-bottom: 20px; /* Базовый отступ */
}

.step-accordion__content {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.5s ease-in-out;
    position: relative;
}

.step-accordion__content p {
    padding-top: 15px;
    margin-bottom: 15px;
}

/* Градиентное затемнение */
.timeline-step__card .step-accordion__content::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 30px;
    background: linear-gradient(to top, white, transparent);
    pointer-events: none;
}

.step-accordion__toggle {
    background: none;
    border: none;
    color: #03d3dd;
    font-weight: 700;
    cursor: pointer;
    padding: 10px 0;
    margin-top: auto; /* Прижимает кнопку к низу */
    align-self: flex-start; /* Выравнивает по левому краю */
}
/* Стили для центральной кнопки в блоке шагов */
.steps-cta-banner {
    text-align: center;
    margin-top: 40px;
}

.steps-cta-banner .cta-button.primary {
    background-color: #03d3dd;
    color: white;
    opacity: 1;
    box-shadow: 0 4px 15px rgba(3, 211, 221, 0.4);
}

.steps-cta-banner .cta-button.primary {
    background-color: #03d3dd;
    color: white;
    opacity: 1;
    box-shadow: 0 4px 15px rgba(3, 211, 221, 0.4);
}

:root{ --brand:#03d3dd; --chip-bg:#f6fdfd; --chip-brd:#cdeff3; --text:#0b1220; --muted:#4b5563; }
.trust-rail{
  display:flex; gap:10px; justify-content:center; margin-top:16px;
  overflow-x:auto; padding-bottom:2px; scrollbar-width:none;
}
.trust-rail::-webkit-scrollbar{ display:none; }
.chip{
  display:inline-flex; align-items:center; gap:8px;
  height:40px; padding:0 14px; border-radius:999px;
  background:var(--chip-bg); border:1px solid var(--chip-brd);
  color:var(--muted); font-size:14px; line-height:1; white-space:nowrap;
  transition:border-color .15s ease, transform .12s ease, box-shadow .15s ease;
}
.chip svg{ width:16px; height:16px; color:var(--brand); }
.chip:hover{ border-color:var(--brand); transform:translateY(-1px); box-shadow:0 6px 18px rgba(3,211,221,.15); }
@media (max-width:768px){ .chip{ height:36px; padding:0 12px; font-size:13px; } }

.glass-rail{
  margin-top:16px; padding:10px 12px; border-radius:16px;
  background:rgba(236,253,253,.6);
  backdrop-filter:blur(8px) saturate(120%);
  box-shadow:0 8px 24px rgba(11,18,32,.06);
}

:root{
  --brand:#03d3dd; --brand-hover:#02bccc;
  --text:#0b1220; --muted:#4b5563;
  --bg:#f6f8fb; --card:#fff; --brd:#e6e9ef;
  --icon-bg: rgba(3,211,221,.12);
}

.risk-section{ padding:64px 0; }
.risk-wrap{ max-width:1280px; margin:0 auto; padding:0 24px; display:grid; grid-template-columns:7fr 5fr; gap:32px; align-items: center; }

/* Левая колонка */
.risk-section h2{ margin:0 0 12px; font-size:40px; line-height:1.2; color:var(--text); font-weight:800; letter-spacing:.2px; }
.risk-lead{ margin:0 0 20px; font-size:18px; color:var(--muted); }

.risk-grid{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:12px; }
.risk-item{
  display:flex; align-items:flex-start; gap:12px;
  background:var(--card); border:1px solid var(--brd); border-radius:16px; padding:14px 16px;
  box-shadow:0 6px 18px rgba(11,18,32,.06); transition:transform .12s ease, border-color .12s ease, box-shadow .12s ease;
}
.risk-item:hover{ transform:translateY(-1px); border-color:#bfeff4; box-shadow:0 10px 24px rgba(3,211,221,.12); }
.risk-icon{ width:32px; height:32px; border-radius:50%; background:var(--icon-bg); display:inline-grid; place-items:center; color:var(--brand); flex:0 0 32px; }
.risk-icon svg{ width:18px; height:18px; }
.risk-text strong{ display:block; font-weight:700; color:var(--text); font-size:15px; }
.risk-text span{ display:block; font-size:13px; color:#5a6472; margin-top:2px; }

/* Правая колонка */
.risk-cta{
  align-self:center; padding:20px 22px; border-radius:20px;
  background:rgba(236,253,253,.75);
  backdrop-filter: blur(8px) saturate(120%);
  box-shadow:0 12px 28px rgba(11,18,32,.08);
}
.risk-cta h3{ margin:0 0 6px; font-size:20px; color:var(--text); }
.risk-cta p{ margin:0 0 14px; color:var(--muted); font-size:15px; }

.btn-primary{
  display:inline-flex; align-items:center; justify-content:center;
  height:52px; padding:0 22px; border-radius:999px; font-weight:700;
  color:#fff; background:var(--brand); text-decoration:none;
  box-shadow:0 12px 28px rgba(3,211,221,.35); transition:transform .2s ease, background-color .2s ease, box-shadow .2s ease; position:relative;
}
.btn-primary:hover{ background:var(--brand-hover); transform:translateY(-2px); box-shadow:0 14px 30px rgba(3,211,221,.45); }
.btn-primary:focus-visible{ outline:none; box-shadow:0 0 0 3px #fff, 0 0 0 6px var(--brand); }
.cta-link{ display:block; margin-top:10px; font-size:14px; color:var(--brand); text-decoration:none; }
.cta-link:hover{ text-decoration:underline; }

/* Мобилка */
@media (max-width:1024px){
  .risk-wrap{ grid-template-columns:1fr; gap:20px; }
  .risk-grid{ grid-template-columns:1fr 1fr; }
}
@media (max-width:560px){
  .risk-grid{ grid-template-columns:1fr; }
  .risk-section h2{ font-size:32px; }
}

/* Фон для страницы "Снятие ломки" */
.hero-snyatie-lomki {
    background-image: url('assets/price3.jpg');
    background-size: cover;
    background-position: center;
}

:root{
  --brand:#03d3dd; --brand-hover:#02bccc;
  --text:#0b1220; --muted:#4b5563;
  --bg:#f6f8fb; --card:#fff; --brd:#e6e9ef;
  --shadow:0 6px 18px rgba(11,18,32,.06);
}

.section{ padding:56px 0; }
.container{ max-width:1280px; margin:0 auto; padding:0 24px; }

/* ---------- БЛОК 1 ---------- */
.usp{
  background: linear-gradient(180deg,#f8feff 0%, var(--bg) 100%);
  border-radius:0;
  margin-top: 32px;
  max-width: none;
  padding-left: 0;
  padding-right: 0;
}
.usp h2{ margin:0 0 10px; font-size:36px; line-height:1.2; color:var(--text); font-weight:800; letter-spacing:.2px; }
.lead{ color:var(--muted); font-size:16px; margin:0 0 20px; }

.usp-grid{
  list-style:none; margin:0; padding:0;
  display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:16px;
}
.usp-card{
  display:flex; gap:12px; align-items:flex-start;
  background:var(--card); border:1px solid var(--brd); border-radius:18px; padding:16px;
  box-shadow:var(--shadow); transition:transform .12s ease, border-color .12s ease, box-shadow .12s ease;
}
.usp-card:hover{ transform:translateY(-1px); border-color:#bfeff4; box-shadow:0 10px 24px rgba(3,211,221,.12); }

.usp-icon{
  width:36px; height:36px; border-radius:50%;
  background: rgba(3,211,221,.12); color: var(--brand);
  display:grid; place-items:center; flex:0 0 36px;
}
.usp-icon svg{ width:20px; height:20px; }

.usp-content h3{ margin:0 0 4px; font-size:16px; color:var(--text); font-weight:700; }
.usp-content p{ margin:0 0 8px; color:var(--muted); font-size:14px; }

.more{
  margin-top:8px; color:#5a6472; font-size:13px;
}

/* CTA */
.usp-cta{ margin-top:18px; display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }
.btn-primary{
  display:inline-flex; align-items:center; justify-content:center;
  height:52px; padding:0 22px; border-radius:999px;
  color:#fff; background:var(--brand); text-decoration:none; font-weight:700;
  box-shadow:0 12px 28px rgba(3,211,221,.35);
  transition: transform .12s ease, background-color .12s ease, box-shadow .12s ease;
}
.btn-primary:hover{ background:var(--brand-hover); transform:translateY(-1px); }
.btn-primary:focus-visible{ outline:none; box-shadow:0 0 0 3px #fff, 0 0 0 6px var(--brand); }

.btn-ghost{
  display:inline-flex; align-items:center; justify-content:center;
  height:52px; padding:0 18px; border-radius:999px;
  color:var(--brand); background:transparent; border:1px solid var(--brand); text-decoration:none; font-weight:600;
}
.btn-ghost:hover{ background:rgba(3,211,221,.08); }

/* ---------- БЛОК 2 ---------- */
.trust{ background:var(--bg); border-radius:24px; }
.trust-grid{
  display:grid; grid-template-columns: 4fr 8fr; gap:24px; align-items:start;
}
.trust-left h2{ margin:0 0 8px; font-size:32px; color:var(--text); font-weight:800; }
.trust-left .lead{ margin:0 0 10px; }
.disclaimer{ font-size:12px; color:#6b7280; margin-top:8px; }

.facts{
  list-style:none; margin:0; padding:0;
  display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:12px;
}
.fact{
  background:#fff; border:1px solid var(--brd); border-radius:16px; padding:14px 16px; text-align:left;
  box-shadow:var(--shadow); transition:transform .12s ease, border-color .12s ease, box-shadow .12s ease;
}
.fact:hover{ transform:translateY(-1px); border-color:#bfeff4; box-shadow:0 10px 24px rgba(3,211,221,.12); }
.fact-icon{ font-size:20px; line-height:1; margin-bottom:6px; }
.fact-title{ font-weight:700; color:var(--text); font-size:15px; }
.fact-sub{ color:#5a6472; font-size:13px; margin-top:2px; }
.fact-link{ color:var(--brand); text-decoration:none; }
.fact-link:hover{ text-decoration:underline; }

/* ---------- Мобилка ---------- */
@media (max-width:1024px){
  .usp-grid{ grid-template-columns:1fr 1fr; }
  .trust-grid{ grid-template-columns:1fr; }
  .facts{ grid-template-columns:repeat(2, minmax(0,1fr)); }
}
@media (max-width:560px){
  .usp-grid{ grid-template-columns:1fr; }
  .facts{ grid-template-columns:1fr; }
  .usp h2{ font-size:28px; }
}

/* Стили для нового блока поддержки */
.support-block {
    padding: 40px 20px;
    background-color: #fff;
}

.support-block__container {
    max-width: 1200px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 50px;
    align-items: center;
}

.support-block__image-wrapper img {
    width: 100%;
    border-radius: 15px;
    display: block;
}

.support-block__title {
    font-family: 'Montserrat', sans-serif;
    font-size: 1.25em;
    font-weight: 700;
    margin-bottom: 20px;
}

.support-block__text {
    font-size: 1.1em;
    line-height: 1.6;
    margin-bottom: 30px;
}

.support-block__form {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.support-block__form input[type="text"],
.support-block__form input[type="tel"] {
    width: 100%;
    padding: 15px;
    border: 1px solid #ccc;
    border-radius: 8px;
    font-size: 1em;
    font-family: 'Inter', sans-serif;
    box-sizing: border-box;
}

.support-block__form .cta-button {
    width: 100%;
    padding: 16px;
    font-size: 1.1em;
}

/* Адаптация для мобильных */
@media (max-width: 768px) {
    .support-block__container {
        grid-template-columns: 1fr;
    }

    .support-block__image-wrapper {
        margin-bottom: 30px;
    }

    .support-block__title {
        font-size: 2em;
        text-align: center;
    }
}
/* --- Стили для нового слайдера "Методы лечения" --- */
:root{
  --accent:#03d3dd; --text:#111; --muted:#6b7280; --card:#fff; --bg:#f6f8f9; --ring:rgba(3,211,221,.45);
}

#methods{padding:32px 0;}
#methods h2{font-size:28px;margin:0 0 8px;}
.methods-sub{color:var(--muted);margin:0 0 16px; text-align: center;}

.carousel{position:relative;}
.car-track{
  display:grid; grid-auto-flow:column; grid-auto-columns:80%;
  gap:16px; overflow-x:auto; scroll-snap-type:x mandatory; padding:16px 16px 42px;
  -webkit-overflow-scrolling:touch; scrollbar-width:none;
}
.car-track::-webkit-scrollbar{display:none;}
.car-slide{scroll-snap-align:start; list-style-type: none;}
@media(min-width:480px){ .car-track{grid-auto-columns:48%;} }
@media(min-width:960px){ .car-track{grid-auto-columns:32%;} }

.method-card{
  background:var(--card); border-radius:16px; padding:20px; box-shadow:0 4px 18px rgba(0,0,0,.06);
  height:100%; display:flex; flex-direction:column; gap:12px;
  transition: transform 240ms ease-out, box-shadow 240ms ease-out;
  border: 1px solid #e5e7eb; /* Добавлена рамка */
}
.method-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 10px 20px rgba(0,0,0,.08);
}

.badge{display:inline-block; font-size:12px; padding:6px 10px; border-radius:999px; background:rgba(3,211,221,.15); color:#066; font-weight:600;}
.method-card h3{font-size:18px; margin:6px 0;}
.method-card p{color:var(--text); opacity:.9; margin:0; font-size: 15px; line-height: 1.6;}
.feat{margin:0; padding-left:18px; color:var(--muted); font-size:14px; line-height:1.6; flex-grow: 1;}
.feat li { margin-bottom: 4px; }

.method-card .cta-button.primary{
  align-self:center;
  margin-top: 16px; /* Отступ между списком и кнопкой */
  display:inline-block;
  padding:10px 14px;
  border-radius:12px;
  background:var(--accent);
  color:#fff;
  text-decoration:none;
  font-weight:700;
  box-shadow:0 2px 0 rgba(0,0,0,.06);
  transition:transform 240ms ease-out, box-shadow 240ms ease-out;
}
.method-card .cta-button.primary:hover{transform:translateY(-2px); box-shadow:0 10px 18px rgba(3,211,221,.25);}
.method-card .cta-button.primary:focus{outline:3px solid var(--ring); outline-offset:2px;}


/* Стили для .car-dots удалены */

.methods-footnote{color:var(--muted); font-size:12px; margin-top:8px; text-align: center;}

.method-fit{margin-top:24px; background:var(--bg); padding:24px; border-radius:16px; text-align: center;}
.method-fit h3{margin-top:0; font-size: 22px;}
.method-fit p { max-width: 600px; margin-left: auto; margin-right: auto; margin-bottom: 20px;}
.method-fit .btn--primary{
    background:var(--accent);
    color: #000;
    text-decoration: none;
    font-weight: 700;
    padding: 12px 24px;
    border-radius: 12px;
    display: inline-block;
    transition: transform 240ms ease-out, box-shadow 240ms ease-out;
}
.method-fit .btn--primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 18px rgba(3,211,221,.25);
}

/* --- Withdrawal Alert Section --- */
.withdrawal-alert {
    position: relative;
    padding: 80px 0;
    background-image: url('assets/clinik.jpg'); /* Убедитесь, что путь к файлу верный */
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    max-width: none;
}

.withdrawal-alert::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.1); /* Затемняющая маска 10% */
    backdrop-filter: blur(5px);
    z-index: 1;
}

.withdrawal-alert .container {
    position: relative;
    z-index: 2;
}

.withdrawal-alert .section-title,
.withdrawal-alert .section-subtitle {
    color: #fff;
    text-shadow: 0 1px 5px rgba(0,0,0,0.5);
}

.withdrawal-alert__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    margin-top: 40px;
}

.withdrawal-alert__card {
    background-color: #fff;
    border-radius: 16px;
    padding: 24px;
    box-shadow: 0 8px 25px rgba(0,0,0,0.1);
}

.withdrawal-alert__card h3 {
    font-family: 'Montserrat', sans-serif;
    font-size: 1.5em; /* ~24px */
    margin-top: 0;
    margin-bottom: 20px;
    padding-bottom: 10px;
    border-bottom: 3px solid #03d3dd;
    display: inline-block;
}

.withdrawal-alert__card h4 {
    font-family: 'Montserrat', sans-serif;
    font-size: 1.2em;
    margin-top: 24px;
    margin-bottom: 12px;
}

.withdrawal-alert__card p {
    line-height: 1.6;
    margin-bottom: 1em;
}

.withdrawal-alert .wide-card {
    grid-column: 1 / -1;
}

.symptoms-list,
.doctor-actions-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.symptoms-list li,
.doctor-actions-list li {
    padding-left: 30px;
    position: relative;
    margin-bottom: 12px;
    font-size: 16px;
    line-height: 1.6;
}

.symptoms-list li::before,
.doctor-actions-list li::before {
    content: '✓';
    position: absolute;
    left: 0;
    top: 0;
    color: #03d3dd;
    font-weight: 700;
    font-size: 1.2em;
}

.cta-buttons {
    margin-top: 24px;
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
}

.cta-buttons .cta-button {
    flex-grow: 1;
    text-align: center;
}

.cta-buttons .cta-button.primary {
    background-color: #03d3dd;
    color: #fff;
}

.cta-buttons .cta-button.secondary {
    background-color: transparent;
    color: #03d3dd;
    border: 2px solid #03d3dd;
}

.cta-buttons .cta-button:focus {
    outline: 3px solid rgba(3, 211, 221, .45);
    outline-offset: 2px;
}

.disclaimer {
    display: block;
    margin-top: 20px;
    font-size: 14px;
    color: #6c757d;
    text-align: center;
}

/* Responsive */
@media (max-width: 768px) {
    .withdrawal-alert__grid {
        grid-template-columns: 1fr;
    }

    .cta-buttons {
        flex-direction: column;
    }

    .cta-buttons .cta-button {
        width: 100%;
    }
}
/* --- Стили для блока "Возвращаем контроль и спокойствие" (двухколоночный) --- */
:root{
  --accent:#03d3dd; --text:#111; --muted:#667085;
  --surface:#fff; --panel:#f6f8f9; --ring:rgba(3,211,221,.45);
}

.calm-sxs{
  display:grid; grid-template-columns:minmax(0,1fr) 420px; gap:24px;
  background:var(--panel); border-radius:16px; padding:24px;
  align-items:start;
}
.calm-sxs__content > * + *{margin-top:14px;}
.calm-sxs h2{margin:0; font-size:28px; line-height:1.25;}
.calm-sxs__lead{margin:0; color:var(--muted);}

.calm-sxs__features{
  display:grid; grid-template-columns:repeat(3,1fr); gap:12px; list-style:none; padding:0; margin:0;
}
.fcard{
  background:var(--surface); border-radius:12px; padding:12px; box-shadow:0 2px 10px rgba(0,0,0,.06);
  display:grid; grid-template-columns:auto 1fr; column-gap:10px; row-gap:4px;
}
.fcard__icon{width:32px; height:32px; border-radius:8px; background:rgba(3,211,221,.15);} /* поставь svg внутрь при желании */
.fcard__title{margin:0; font-size:16px;}
.fcard__text{margin:0; color:var(--muted); font-size:14px; line-height:1.6;}

.calm-sxs__quote{
  margin:0; background:var(--surface); border-radius:12px; padding:14px 16px;
  box-shadow:0 2px 12px rgba(0,0,0,.06); border-left:4px solid var(--accent);
}
.calm-sxs__quote blockquote{margin:0 0 6px;}
.calm-sxs__quote figcaption{color:var(--muted); font-size:14px;}

.calm-sxs__cta{
  background:var(--surface); border-radius:12px; padding:12px 14px;
  box-shadow:0 2px 14px rgba(0,0,0,.06); display:flex; gap:12px; align-items:center; justify-content:space-between;
}
.calm-sxs__cta p{margin:0; color:var(--text); opacity:.9;}
.btns{display:flex; gap:10px; flex-wrap:wrap;}
.btn{display:inline-block; padding:12px 18px; border-radius:12px; font-weight:700; text-decoration:none; transition:transform .06s, box-shadow .2s;}
.btn--primary{background:var(--accent); color:#000; box-shadow:0 2px 0 rgba(0,0,0,.06);}
.btn--ghost{border:2px solid rgba(3,211,221,0.45); color:#03d3dd; background-color:rgba(3,211,221,0.08);}
.btn:focus{outline:3px solid var(--ring); outline-offset:2px;}

.calm-sxs__note{display:block; color:var(--muted); font-size:12px;}

.calm-sxs__media{
  margin:0; border-radius:16px; overflow:hidden; background:#eaecee;
  /* квадратный контейнер */
  aspect-ratio:1/1;
}
.calm-sxs__media img{width:100%; height:100%; object-fit:cover; object-position:center;}

@supports not (aspect-ratio:1/1){
  .calm-sxs__media{position:relative; padding-top:100%;}
  .calm-sxs__media img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover;}
}

@media (max-width: 1024px){
  .calm-sxs{grid-template-columns:1fr; padding:20px;}
  .calm-sxs__features{grid-template-columns:1fr;}
  .calm-sxs__media{order:-1; max-width:420px; justify-self:center; width:100%;}
  .calm-sxs__cta{flex-direction:column; align-items:stretch;}
  .btn{width:100%; text-align:center;}
}
/* Стили для растягивания фона на всю ширину */
.full-width-bg {
    max-width: none;
    padding-left: 0;
    padding-right: 0;
}
/* Стили для новых стрелок слайдера */
:root{
  --accent:#03d3dd;          /* фирменный */
  --arrow-bg:#fff;           /* фон кнопок */
  --shadow:0 8px 24px rgba(0,0,0,.12);
  --ring:rgba(3,211,221,.45);
}

/* контейнер слайдера должен быть position:relative; */
.carousel{ position:relative; }

/* базовая кнопка-стрелка сбоку */
.nav-arrow{
  position:absolute; top:50%; transform:translateY(-50%);
  width:48px; height:48px; border:0; border-radius:50%;
  background:var(--arrow-bg); box-shadow:var(--shadow); cursor:pointer;
  display:grid; place-items:center; z-index:5;
  transition:box-shadow .25s ease, transform .12s ease, opacity .2s ease;
  /* мягкое «дыхание», пока навигации нет */
  animation: floatIdle 3s ease-in-out infinite;
}

/* левый/правый края */
.nav-arrow--prev{ left:-12px; }
.nav-arrow--next{ right:-12px; }

/* SVG-иконка */
.nav-arrow svg{
  width:22px; height:22px; stroke:#0b0b0b; stroke-width:2; fill:none;
  transition: transform .25s ease;
}

/* подсветка акцентным ободком через псевдоэлемент */
.nav-arrow::after{
  content:""; position:absolute; inset:0;
  border-radius:inherit; box-shadow:0 0 0 0 rgba(3,211,221,.0);
  transition: box-shadow .25s ease;
}

/* hover/focus эффекты */
.nav-arrow:hover{ box-shadow:0 12px 28px rgba(3,211,221,.25); }
.nav-arrow:focus{ outline:3px solid var(--ring); outline-offset:2px; }
.nav-arrow:hover::after{ box-shadow:0 0 0 6px rgba(3,211,221,.10); }

/* лёгкий сдвиг стрелки при ховере */
.nav-arrow--prev:hover svg{ transform:translateX(-2px); }
.nav-arrow--next:hover svg{ transform:translateX( 2px); }

/* активное нажатие */
.nav-arrow:active{ transform:translateY(-50%) scale(.98); }

/* скрывать при «reduced motion» */
@media (prefers-reduced-motion: reduce){
  .nav-arrow{ animation:none; }
}

/* «дыхание» */
@keyframes floatIdle{
  0%,100%{ transform:translateY(-50%); }
  50%    { transform:translateY(calc(-50% - 2px)); }
}

/* Состояние «нельзя листать» на краях */
.nav-arrow.is-disabled{
  opacity:.35; cursor:default; pointer-events:none; animation:none;
}

/* адаптив: при маленькой ширине не залезать на контент */
@media (max-width: 480px){
  .nav-arrow--prev{ left:0; }
  .nav-arrow--next{ right:0; }
}

/* --- Стили для новых блоков "Это уже не похмелье" и "Опасные сигналы" --- */
:root{
  --accent:#03d3dd; --text:#111; --muted:#667085;
  --surface:#fff; --panel:#f6f8f9; --ring:rgba(3,211,221,.45);
  --space:clamp(24px, 5vw, 64px);
}

/* разделение секций */
.sec{background:var(--panel); border-radius:16px; padding:24px;}
.sec + .sec{margin-top:var(--space);}
.sec__header h2{margin:0 0 6px; font-size:28px; line-height:1.25;}
.sec__header--center { text-align: center; }
.lead{margin:0 0 14px; color:var(--muted);}

.grid-2{display:grid; grid-template-columns:1fr 1fr; gap:14px;}
.card{background:var(--surface); border-radius:12px; padding:16px; box-shadow:0 2px 12px rgba(0,0,0,.06);}
.card h3{margin:0 0 8px; font-size:18px;}
.advise{border-left:4px solid var(--accent);}

.checks{list-style:none; padding:0; margin:0; display:grid; gap:10px;}
.checks li{padding-left:26px; position:relative;}
.checks li::before{
  content:""; position:absolute; left:0; top:6px;
  width:12px; height:12px; border-radius:50%;
  background:var(--accent); box-shadow:0 0 0 4px rgba(3,211,221,.15) inset;
}

.bullets{margin:0; padding-left:18px; display:grid; gap:8px;}
.cta-row, .cta-slim{
  margin-top:14px; background:var(--surface); border-radius:12px;
  padding:12px 14px; box-shadow:0 2px 14px rgba(0,0,0,.06);
  display:flex; gap:12px; align-items:center; justify-content:space-between;
}

.note{display:block; margin-top:8px; font-size:12px; color:var(--muted);}

/* риски */
.risk-layout-grid { display: grid; grid-template-columns: 2fr 1fr; gap: 14px; align-items: center; }
.risk-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:12px;}
.risk{background:var(--surface); border-radius:12px; padding:14px; box-shadow:0 2px 12px rgba(0,0,0,.06); min-height:112px; position:relative;}
.risk__bar{position:absolute; left:0; top:0; width:100%; height:6px; border-top-left-radius:12px; border-top-right-radius:12px; background:var(--accent); opacity:.9;}
.risk h3{margin:10px 0 6px; font-size:16px;}
.risk p{margin:0; color:var(--muted);}

.cta-slim-vertical {
    display: flex;
    flex-direction: column;
    gap: 12px;
    align-items: center;
    justify-content: center;
    text-align: center;
}

@media (max-width: 960px){
  .grid-2{grid-template-columns:1fr;}
  .cta-row,.cta-slim{flex-direction:column; align-items:stretch;}
  .risk-layout-grid {grid-template-columns: 1fr;}
  .risk-grid{grid-template-columns:repeat(2, 1fr);}
}

@media (max-width: 600px) {
    .risk-grid{grid-template-columns:1fr;}
}
:root{
  --accent:#03d3dd; --text:#111; --muted:#667085;
  --warn:rgba(255,0,0,.12); --mint:rgba(3,211,221,.14);
  --panel-warm:linear-gradient(180deg,#f9fafb 0%, #f3f4f6 100%);
  --panel-cold:#f6f8f9;
}

/* секции */
.section{ border-radius:16px; padding:24px; }
.section + .section{ margin-top: clamp(32px,6vw,80px); }

/* тема Органы (Clinic) */
.theme-clinic{ background: var(--panel-cold); }
.card--outline{ background:transparent; border:1px solid #e5e7eb; border-radius:12px; padding:14px; position:relative; }
.card--outline::before{ content:""; position:absolute; left:0; top:0; bottom:0; width:4px; background:var(--accent); border-radius:12px 0 0 12px; }
.card--outline .ico{ width:28px; height:28px; border-radius:8px; background:var(--mint); margin-right:8px; }
.card--outline:hover{ box-shadow:0 0 0 2px rgba(3,211,221,.18) inset; }

/* общие мелочи */
.grid{ display:grid; gap:12px; }
.grid-3cols{ grid-template-columns: repeat(3,1fr); }
.card-title{ margin:0 0 6px; font-size:16px; }
.card-text{ margin:0; color:var(--muted); }
.btn{ display:inline-block; padding:12px 18px; border-radius:12px; font-weight:700; text-decoration:none; }
.btn--primary{ background:var(--accent); color:#000; }
.btn--ghost{ border:2px solid rgba(3,211,221,0.45); color:#03d3dd; background-color:rgba(3,211,221,0.08); }

@media (max-width: 1024px){
  .grid-3cols{ grid-template-columns:1fr; }
}
/* --- STYLES FOR CONTACTS PAGE --- */

.contact-hero {
  padding-top: 60px;
  padding-bottom: 60px;
  text-align: center;
}

.contact-hero .lead {
  max-width: 600px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 32px;
}

.cta-row {
  display: flex;
  justify-content: center;
  gap: 16px;
  flex-wrap: wrap;
}

.cta-row .btn {
  height: 60px;
  padding: 0 32px;
  border-radius: 16px;
  font-size: 16px;
  font-weight: 700;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  box-shadow: 0 8px 24px rgba(0,0,0,.12);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.cta-row .btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 28px rgba(0,0,0,.15);
}

.btn--call { background-color: #03d3dd; color: white; }
.btn--wa { background-color: #25D366; color: white; }
.btn--tg { background-color: #0088cc; color: white; }

.contact-hero .micro {
  margin-top: 24px;
  font-size: 14px;
  color: #667085;
}

.service-area .card {
  background-color: #fff;
  border-radius: 16px;
  padding: 32px;
  box-shadow: 0 8px 24px rgba(0,0,0,.08);
  text-align: center;
}

.chips {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
  list-style: none;
  padding: 0;
  margin: 24px 0;
}

.chips li {
  background-color: #f0fdfa;
  color: #0c6b67;
  padding: 8px 16px;
  border-radius: 99px;
  font-weight: 500;
  cursor: pointer;
}

.service-area img {
  max-width: 100%;
  margin-top: 24px;
  border-radius: 8px;
}

.contact-options .grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

.contact-options .opt {
  background-color: #fff;
  border-radius: 16px;
  padding: 24px;
  box-shadow: 0 8px 24px rgba(0,0,0,.08);
}

.callback {
  background-color: #f6f8f9;
  border-radius: 16px;
  padding: 32px;
}

#callback-form {
  display: grid;
  gap: 16px;
  max-width: 500px;
  margin: 24px auto 0;
}

#callback-form input,
#callback-form select,
#callback-form textarea {
  width: 100%;
  padding: 14px;
  border-radius: 8px;
  border: 1px solid #ccc;
  font-size: 16px;
}

#callback-form .agree {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
}

.address .card {
  background-color: #fff;
  border-radius: 16px;
  padding: 32px;
  box-shadow: 0 8px 24px rgba(0,0,0,.08);
}

.cta-bottom .cta-band {
  background-color: #03d3dd;
  color: white;
  border-radius: 16px;
  padding: 24px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
}

.sticky-bar {
  display: none;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: rgba(255, 255, 255, 0.9);
  backdrop-filter: blur(10px);
  padding: 16px;
  box-shadow: 0 -4px 12px rgba(0,0,0,.1);
  z-index: 100;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}

.sticky-bar .btn {
  height: 56px;
  border-radius: 16px;
  font-size: 16px;
  font-weight: 700;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

@media (max-width: 768px) {
  .cta-row {
    flex-direction: column;
  }
  .contact-options .grid {
    grid-template-columns: 1fr;
  }
  .cta-bottom .cta-band {
    flex-direction: column;
    text-align: center;
  }
  .sticky-bar {
    display: grid;
  }
}

@media (prefers-reduced-motion: reduce) {
  .btn {
    transition: none;
  }
}
.service-area {
    text-align: center;
}
.service-area .chips {
    display: grid;
    grid-template-columns: repeat(7, auto);
    justify-content: center;
    gap: 12px;
}

@media (max-width: 768px) {
    .service-area .chips {
        grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    }
}
.service-area-heading {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
}

.service-area-icon {
    width: 32px;
    height: 32px;
}

/* Модальное окно */
.modal {
    display: none; /* Скрыто по умолчанию */
    position: fixed; /* Оставаться на месте */
    z-index: 10000; /* Сильнее всех */
    left: 0;
    top: 0;
    width: 100%; /* Полная ширина */
    height: 100%; /* Полная высота */
    overflow: auto; /* Включить прокрутку, если содержимое слишком большое */
    background-color: rgba(0,0,0,0.6); /* Черный фон с прозрачностью */
    display: flex;
    align-items: center;
    justify-content: center;
}

.modal-content {
    background-color: #fefefe;
    margin: auto;
    padding: 30px;
    border-radius: 10px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.3);
    position: relative;
    max-width: 500px; /* Ограничить ширину модального окна */
    width: 90%;
    text-align: center;
}

.modal-content h2 {
    font-size: 2em;
    margin-bottom: 10px;
    color: #2B2B2B;
}

.modal-content p {
    font-size: 1.1em;
    color: #6c757d;
    margin-bottom: 5px;
}

.modal-content form {
    display: flex;
    flex-direction: column;
    gap: 15px;
    margin-top: 20px;
}

.modal-content input[type="text"],
.modal-content input[type="tel"] {
    padding: 12px;
    border: 1px solid #ccc;
    border-radius: 12px;
    font-size: 1em;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.modal-content input[type="text"]:focus,
.modal-content input[type="tel"]:focus {
    border-color: rgba(3, 211, 221, 0.6);
    box-shadow: 0 0 0 3px rgba(3, 211, 221, 0.15);
    outline: none;
}

.modal-content .cta-button {
    padding: 12px 20px;
    font-size: 1.1em;
    border-radius: 12px;
}

.modal-consent {
    font-size: 0.9em;
    color: #4a4a4a;
    text-align: left;
    margin-top: -5px;
}

.modal-consent__text {
    flex: 1;
    line-height: 1.4;
}

.cta-form--full .modal-consent__text {
    white-space: normal;
    flex: 1;
    min-width: 0;
}

.close-button {
    position: absolute;
    top: 10px;
    right: 20px;
    width: 36px;
    height: 36px;
    border: none;
    background: transparent;
    cursor: pointer;
    padding: 0;
}

.close-button::before,
.close-button::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 22px;
    height: 2.5px;
    background: #aaa;
    border-radius: 2px;
    transform-origin: center;
    transition: background 0.2s ease;
}

.close-button::before {
    transform: translate(-50%, -50%) rotate(45deg);
}

.close-button::after {
    transform: translate(-50%, -50%) rotate(-45deg);
}

.close-button:hover::before,
.close-button:hover::after,
.close-button:focus-visible::before,
.close-button:focus-visible::after {
    background: #000;
}

.close-button:focus-visible {
    outline: 2px solid rgba(3, 211, 221, 0.5);
    outline-offset: 2px;
}



/* ===== Плавная типографика заголовков ===== */
:root{
  /* базовые (десктопные) значения */
  --fluid: 2.4vw;
  --h1-min: 26px; --h1-max: 36px;
  --h2-min: 22px; --h2-max: 30px;
  --h3-min: 18px; --h3-max: 26px;
  --h4-min: 16px; --h4-max: 22px;
  --h5-min: 14px; --h5-max: 20px;
  --h6-min: 13px; --h6-max: 18px;
}

/* Плавный размер + адекватные межстрочные интервалы */
h1{ font-size: clamp(var(--h1-min), var(--fluid),              var(--h1-max)) !important; line-height: 1.15; }
h2{ font-size: clamp(var(--h2-min), calc(var(--fluid) - 0.6vw),  var(--h2-max)) !important; line-height: 1.20; }
h3{ font-size: clamp(var(--h3-min), calc(var(--fluid) - 1.2vw),  var(--h3-max)) !important; line-height: 1.25; }
h4{ font-size: clamp(var(--h4-min), calc(var(--fluid) - 1.8vw),  var(--h4-max)) !important; line-height: 1.30; }
h5{ font-size: clamp(var(--h5-min), calc(var(--fluid) - 2.4vw),  var(--h5-max)) !important; line-height: 1.35; }
h6{ font-size: clamp(var(--h6-min), calc(var(--fluid) - 3vw),  var(--h6-max)) !important; line-height: 1.40; }

@media (max-width: 768px){
  :root{
    --fluid: 6vw;
    --h1-min: 24px; --h1-max: 40px;
    --h2-min: 22px; --h2-max: 34px;
    --h3-min: 20px; --h3-max: 30px;
    --h4-min: 18px; --h4-max: 26px;
    --h5-min: 16px; --h5-max: 24px;
    --h6-min: 14px; --h6-max: 20px;
  }
}

/* Корректные переносы длинных русских слов */
html[lang="ru"]{
  -webkit-hyphens: auto;
  hyphens: auto;
}

@media (min-width: 769px){
  html[lang="ru"]{
    -webkit-hyphens: none;
    hyphens: none;
  }
}

html,
body{
  margin: 0;
}

@media (max-width: 600px){
  :root{
    --header-height: 88px;
  }

  body{
    padding-top: var(--header-height);
  }

  main{
    padding-top: 0;
  }

  .page-about main{
    padding-top: 0;
  }
}

/* Блок с кнопками */
.fab-messengers{
  position: fixed;
  right: clamp(12px, 3vw, 20px);
  bottom: calc(96px + env(safe-area-inset-bottom)); /* если снизу есть свой чат-виджет */
  display: flex;
  flex-direction: column;
  gap: 12px;
  z-index: 3000;
  pointer-events: none;
}

/* Кнопка-кружок: белая «таблетка» с цветной окантовкой */
.fab-btn{
  pointer-events: auto;
  inline-size: 56px; block-size: 56px;
  aspect-ratio: 1 / 1;
  border-radius: 50%;
  background: #fff;                 /* белый фон внутри */
  border: 2px solid currentColor;   /* цвет рамки берём из color */
  display: grid; place-items: center;
  box-shadow: 0 10px 24px rgba(0,0,0,.18);
  transition: transform .15s ease, box-shadow .15s ease;
}

/* PNG-иконка одинаково встаёт в круг */
.fab-btn img{
  display: block;
  width: 60%; height: 60%;          /* ровный визуальный вес для всех PNG */
  object-fit: contain;               /* на всякий пожарный */
  border-radius: 0;
}

/* Брендовые цвета окантовки */
.fab-wa  { color: #25D366; }         /* WhatsApp */
.fab-tg  { color: #229ED9; }         /* Telegram */
.fab-chat{ color: #00B3C7; }         /* твой чат/звонок */

/* Ховер/фокус (не мешает анимации) */
.fab-btn:hover, .fab-btn:focus-visible{
  transform: translateY(-1px) scale(1.03);
  box-shadow: 0 14px 28px rgba(0,0,0,.25);
  outline: 2px solid rgba(255,255,255,.6);
  outline-offset: 2px;
}

/* Мерцание: мягкое «кольцо» вокруг кнопки */
.fab-btn{ --glow: rgba(0,0,0,0); }   /* дефолт */
.fab-wa.anim  { --glow: rgba(37,211,102,.35); }
.fab-tg.anim  { --glow: rgba(34,158,217,.35); }
.fab-chat.anim{ --glow: rgba(0,179,199,.35); }

@keyframes ring {
  0%   { box-shadow: 0 10px 24px rgba(0,0,0,.18), 0 0 0 0 var(--glow); }
  70%  { box-shadow: 0 10px 24px rgba(0,0,0,.18), 0 0 0 16px rgba(0,0,0,0); }
  100% { box-shadow: 0 10px 24px rgba(0,0,0,.18), 0 0 0 0 rgba(0,0,0,0); }
}

.fab-btn.anim{
  animation: ring 2.8s ease-out infinite;
}
.fab-tg.anim  { animation-delay: .6s; }
.fab-chat.anim{ animation-delay: 1.2s; }

@media (prefers-reduced-motion: reduce){
  .fab-btn.anim{ animation: none; }
}

/* белые кружки без рамок */
.fab-btn{
  border: 0 !important;          /* убрали цветную окантовку */
  background: #fff;               /* белая «таблетка» внутри */
}

/* на всякий случай: PNG/иконки одинаково центрированы */
.fab-btn{ inline-size:56px; block-size:56px; border-radius:50%; }
.fab-btn img{ width:60%; height:60%; object-fit:contain; display:block; }

/* спрятать старую плавающую кнопку чата (поддержаны частые виджеты) */
.jivo-btn, .jivo-iframe-button,
.chatra__button, .tawk-button, .tawk-min-chat-icon,
.help-widget__button, .widget-chat__toggle,
[data-chat-open], .callback-bubble, .callback-bubble__toggle {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  width: 0 !important; height: 0 !important;
  margin: 0 !important; padding: 0 !important;
}

/* ===== Параметры FAB-кружков (чтобы не гадать в пикселях) ===== */
:root{
  --fab-size: 56px;     /* диаметр кружка */
  --fab-gap: 12px;      /* расстояние между кружками */
  --fab-margin: 16px;   /* отступ от края экрана */
}

/* 1) Опускаем стопку кружков ниже (к самому низу, с учётом вырезов на iPhone) */
.fab-messengers{
  right: var(--fab-margin);
  bottom: calc(var(--fab-margin) + env(safe-area-inset-bottom));
}

/* 2) Сдвигаем поп-ап формы левее от края на ширину FAB-кнопки,
      чтобы кружки ничего не перекрывали на мобиле */
@media (max-width: 600px){
  /* подставь правильный селектор твоей формы, если у тебя другой класс */
  .help-popup,
  .callback-widget,
  .callback-popup,
  .need-help,
  .request-call,
  .callback-form {
    position: fixed;            /* на всякий случай, чтобы не зависеть от потока */
    right: calc(var(--fab-size) + var(--fab-gap) + var(--fab-margin));
    bottom: calc(24px + env(safe-area-inset-bottom));
    left: auto;
    transform: none;            /* убираем возможное translateX из центровки */
    max-width: min(92vw, 360px);/* не шире экрана */
    z-index: 2500;
  }

  /* если внутри формы есть «хвостик-стрелочка» к правому краю — прячем */
  .help-popup::after,
  .callback-widget::after,
  .callback-popup::after { display: none; }
}

/* Хочешь чуть ближе к центру — просто добавь ещё отступ:
   right: calc(var(--fab-size) + var(--fab-gap) + var(--fab-margin) + 12px); */

@media (min-width: 992px) {
  .fab-messengers{
    right: calc(var(--fab-margin));
    bottom: calc(var(--fab-margin) + env(safe-area-inset-bottom));
  }

  .chat-widget{
    right: calc(var(--fab-margin) + var(--fab-size) + var(--fab-gap));
    bottom: calc(var(--fab-margin) + env(safe-area-inset-bottom));
    left: auto;
    transform: none;
  }

  .chat-widget__toggle{
    margin: 0;
    box-shadow: 0 10px 24px rgba(0,0,0,0.18);
  }

  .chat-widget__window{
    left: auto;
    right: 0;
    transform: translateY(0) scale(0.8);
    transform-origin: bottom right;
    bottom: calc(var(--fab-size) + var(--fab-gap));
  }

  .chat-widget__window.is-open{
    transform: translateY(0) scale(1);
  }
}

/* License page */
.license-page {
  padding: 80px 0;
}

.license-section {
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: 24px;
  align-items: center;
  width: 100%;
}

.license-gallery {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 24px;
  width: 100%;
  max-width: 680px;
  margin-inline: auto;
}

.license-gallery__item {
  display: block;
  max-width: 220px;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 12px 32px rgba(20, 33, 61, 0.12);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.license-gallery__item:hover,
.license-gallery__item:focus-visible {
  transform: translateY(-6px);
  box-shadow: 0 16px 40px rgba(20, 33, 61, 0.16);
}

.license-gallery__item img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: contain;
  background: #f5f7fb;
  padding: 12px;
}

@media (max-width: 1024px) {
  .license-gallery__item {
    max-width: 200px;
  }
}

@media (max-width: 768px) {
  .license-page {
    padding: 48px 0;
  }

  .license-gallery {
    gap: 16px;
  }

  .license-gallery__item {
    max-width: 160px;
  }
}

@media (max-width: 480px) {
  .license-gallery {
    gap: 12px;
  }

  .license-gallery__item {
    max-width: 140px;
  }

  .license-gallery__item img {
    padding: 8px;
  }
}