* {
  font-family: 'Geist', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
    'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
    sans-serif;
  box-sizing: border-box;
}

html, body {
  margin: 0;
  padding: 0;
  overflow-x: hidden;
  width: 100%;
  background: #FFFFFF;
}

body {
  font-family: 'Geist', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
    'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
    sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  background: #FFFFFF;
}

code {
  font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
    monospace;
}

img {
  user-select: none;
  -webkit-user-select: none;
  -webkit-user-drag: none;
  -moz-user-select: none;
  -ms-user-select: none;
  pointer-events: auto;
}

::-webkit-scrollbar {
  width: 7px;
  background: #fff;
}

::-webkit-scrollbar-thumb {
  background: #27CAFC;
  -webkit-border-radius: 100px;
  border: 1px solid #27CAFC;
}

::-webkit-scrollbar-thumb:hover {
  background: #276EFC;
  -webkit-border-radius: 1px;
  border: 1px solid #f2911c;
}

/* ============================================
   Централизованное управление шрифтами
   ============================================ */

   :root {
    /* Основные размеры заголовков */
    --font-size-h1: 2.35vw;           /* Главные заголовки секций */
    --font-size-h2-5: 2.188vw;          /* Промежуточный размер */
    --font-size-h3: 1.667vw;            /* Заголовки третьего уровня */
    --font-size-h3-5: 2.083vw;          /* Промежуточный размер */
    --font-size-h4: 1.563vw;            /* Заголовки четвертого уровня */
    --font-size-h4-5: 1.875vw;          /* Промежуточный размер */
    --font-size-h5: 1.458vw;            /* Заголовки пятого уровня */
    --font-size-h6: 1.302vw;            /* Заголовки шестого уровня */
    --font-size-h7: 1.25vw;            /* Малые заголовки */
    --font-size-h8: 1.144vw;            /* Очень малые заголовки */
    --font-size-h9: 1.042vw;            /* Минимальные заголовки */
    --font-size-h9-5: 0.99vw;          /* Промежуточный размер */
  
    /* Основные размеры текста */
    --font-size-body: 0.938vw;          /* Обычный текст */
    --font: 0.938vw; /*для отдельных случаев*/
    --font-size-body-medium: 0.833vw;   /* Средний текст */
    --font-size-body-small: 0.729vw;    /* Малый текст */
    --font-size-body-xs: 0.677vw;      /* Очень малый текст */
    --font-size-body-xxs: 0.729vw;     /* Минимальный текст */
    --font-size-body-small-2: 0.781vw; /* Промежуточный малый текст */
  
    /* Размеры для кнопок */
    --font-size-button: 0.677vw;       /* Основная кнопка */
    --font-size-button-secondary: 0.625vw; /* Второстепенная кнопка */
  
    /* Веса шрифтов */
    --font-weight-light: 300;
    --font-weight-regular: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
  
    /* Высоты строк */
    --line-height-tight: 1.2;
    --line-height-normal: 1.4;
    --line-height-relaxed: 1.5;
    --line-height-loose: 1.6;
    --line-height-100: 100%;
    --line-height-120: 120%;
    --line-height-23: 1.198vw;
    --line-height-28: 1.458vw;
    --line-height-33: 1.719vw;
    --line-height-40: 2.083vw;
    --line-height-60: 3.125vw;
  }
  
  /* ============================================
     УТИЛИТАРНЫЕ КЛАССЫ ДЛЯ БЫСТРОГО ПРИМЕНЕНИЯ
     ============================================ */
  
  /* Заголовки */
  .text-h1 { font-size: 2.35vw; font-size: var(--font-size-h1); }
  .text-h2-5 { font-size: 2.188vw; font-size: var(--font-size-h2-5); }
  .text-h3 { font-size: 1.667vw; font-size: var(--font-size-h3); }
  .text-h3-5 { font-size: 2.083vw; font-size: var(--font-size-h3-5); }
  .text-h4 { font-size: 1.563vw; font-size: var(--font-size-h4); }
  .text-h4-5 { font-size: 1.875vw; font-size: var(--font-size-h4-5); }
  .text-h5 { font-size: 1.458vw; font-size: var(--font-size-h5); }
  .text-h6 { font-size: 1.302vw; font-size: var(--font-size-h6); }
  .text-h7 { font-size: 1.25vw; font-size: var(--font-size-h7); }
  .text-h8 { font-size: 1.144vw; font-size: var(--font-size-h8); }
  .text-h9 { font-size: 1.042vw; font-size: var(--font-size-h9); }
  .text-h9-5 { font-size: 0.99vw; font-size: var(--font-size-h9-5); }
  
  /* Текст */
  .text-body { font-size: 0.938vw; font-size: var(--font-size-body); }
  .text-body-medium { font-size: 0.833vw; font-size: var(--font-size-body-medium); }
  .text-body-small { font-size: 0.729vw; font-size: var(--font-size-body-small); }
  .text-body-xs { font-size: 0.677vw; font-size: var(--font-size-body-xs); }
  .text-body-xxs { font-size: 0.729vw; font-size: var(--font-size-body-xxs); }
  .text-body-small-2 { font-size: 0.781vw; font-size: var(--font-size-body-small-2); }
  
  /* Кнопки */
  .text-button { font-size: 0.677vw; font-size: var(--font-size-button); }
  .text-button-secondary { font-size: 0.625vw; font-size: var(--font-size-button-secondary); }
  
  /* Веса */
  .font-light { font-weight: 300; font-weight: var(--font-weight-light); }
  .font-regular { font-weight: 400; font-weight: var(--font-weight-regular); }
  .font-medium { font-weight: 500; font-weight: var(--font-weight-medium); }
  .font-semibold { font-weight: 600; font-weight: var(--font-weight-semibold); }
  .font-bold { font-weight: 700; font-weight: var(--font-weight-bold); }
  
  /* Высоты строк */
  .leading-tight { line-height: 1.2; line-height: var(--line-height-tight); }
  .leading-normal { line-height: 1.4; line-height: var(--line-height-normal); }
  .leading-relaxed { line-height: 1.5; line-height: var(--line-height-relaxed); }
  .leading-loose { line-height: 1.6; line-height: var(--line-height-loose); }
  .leading-100 { line-height: 100%; line-height: var(--line-height-100); }
  .leading-120 { line-height: 120%; line-height: var(--line-height-120); }
  .leading-33 { line-height: 1.719vw; line-height: var(--line-height-33); }
  .leading-40 { line-height: 2.083vw; line-height: var(--line-height-40); }
  .leading-60 { line-height: 3.125vw; line-height: var(--line-height-60); }
  
  
.header {
    width: 100%;
    margin: 0 auto;
    background: transparent;
    padding: 1.04vw 0 1.56vw 0;
    position: relative;
    overflow: visible;
}

.header-center-card {
    position: absolute;
    top: 10%;
    left: 89%;
    width: 100%;
    max-width: 19.79vw;
    background: #EBEBEB;
    border-radius: 1.04vw;
    padding: 0.52vw 1.3vw 1.04vw 1.3vw;
    z-index: 10;
}

.header-center-item {
    display: flex;
    align-items: flex-start;
    gap: 0.78vw;
    padding: 0.52vw 0;
    cursor: pointer;
}

.header-center-icon {
    flex-shrink: 0;
    margin-top: 0.21vw;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 0.68vw;
    height: 0.68vw;
}

.header-center-icon svg {
    width: 100%;
    height: 100%;
}

.header-center-content {
    flex: 1 1;
    text-align: left;
}

.header-center-title {
    font-size: var(--font-size-body);
    font-weight: 500;
    color: #000000;
    font-family: 'Geist', sans-serif;
    margin-bottom: 0.21vw;
    text-align: left;
}

.header-center-description {
    font-size: var(--font-size-body-small);
    font-weight: 300;
    color: #1A1A1ABF;
    font-family: 'Geist', sans-serif;
    line-height: 1.4;
    text-align: left;
}

.header-center-arrow {
    margin-top: 0.52vw;
    flex-shrink: 0;
    width: 0.94vw;
    height: 0.89vw;
}

.header-center-arrow svg {
    width: 100%;
    height: 100%;
    transition: transform 0.3s ease;
}

.header-center-item:hover .header-center-arrow svg {
    transform: rotate(40deg);
}

.header-center-divider {
    height: 0.052vw;
    background: #1a1a1a59;
    margin: 0;
    transform: scaleY(0.5);
    transform-origin: center;
}

.header-container {
    max-width: 100%;
    margin: 0 auto;
    padding: 0vw 10% 0.78vw 10%;
    display: flex;
    flex-direction: column;
    gap: 0;
    width: 100%;
    background: transparent;
    overflow: visible;
}

.header-top-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1.0vw;
    /* gap: 1.56vw; */
    width: 100%;
    overflow: visible;
    position: relative;
    background: transparent;
}


.header-logo {
    flex-shrink: 0;
}

.header-logo img {
    height: 2.4vw;
    width: 7.6vw;
}

.header-clinic-info {
    flex-shrink: 0;
    transform: translateX(-1vw);
}

.header-clinic-text {
    text-align: left;
    font-size: var(--font-size-body);
    color: #1A1A1ABF;
    font-weight: 300;
}

.header-location {
    display: flex;
    align-items: center;
    gap: 0.63vw;
    flex-shrink: 0;
    transform: translateX(-2vw);
}

.header-metro-icon {
    flex-shrink: 0;
}

.header-metro-icon img {
    width: 1.25vw;
    height: 1.46vw;
    margin-bottom: 0.52vw;
}

.header-address {
    display: flex;
    flex-direction: column;
}

.header-metro-text {
    text-align: left;
    font-size: var(--font-size-body);
    font-weight: 500;
    color: #000000;
    line-height: 1.2;
}

.header-street {
    text-align: left;
    font-size: var(--font-size-body-xxs);
    font-weight: 300;
    color: #1A1A1ABF;
    line-height: 1.2;
}

.header-calculator-btn {
    display: flex;
    align-items: center;
    gap: 1.3vw;
    padding: 1.04vw 1.6vw;
    border: 0.052vw solid #485B85;
    border-radius: 2.6vw;
    cursor: pointer;
    transition: all 0.3s ease;
    flex-shrink: 0;
    position: relative;
    overflow: hidden;
    background: #485B85;
    
    transform: translate(-4vw, -00.21vw)
}

.header-calculator-btn:hover {
    background: #FFFFFF;
}

.header-calculator-btn span {
    font-size: var(--font-size-button);
    color: #FFFFFF;
    font-weight: 500;
    line-height: 0.94vw;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    z-index: 2;
}

.header-calculator-btn:hover span {
    transform: translateX(min(2.0vw, 4.8vw));
    color: #485B85;
}

.header-calculator-btn-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    position: relative;
    z-index: 2;
    width: 0.63vw;
    height: 0.57vw;
}

.header-calculator-btn-icon svg {
    width: 100%;
    height: 100%;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.header-calculator-btn-icon svg {
    width: 100%;
    height: 100%;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.header-nav-wrapper {
    position: relative;
}

.header-nav-anchor {
    height: 0;
    transition: height 0.3s ease;
}

.header-nav {
    width: 100%;
    background: #FFF;
    border-radius: 0.55vw;
    position: relative;
    transition: margin-top 0.5s ease;
}

.header-nav.fixed {
    position: fixed;
    top: 0.52vw;
    left: 0;
    right: 0;
    z-index: 1000;
    width: 100%;
    max-width: 100%;
    margin: 0 auto;
    padding: 0 10%;
    box-sizing: border-box;
    background: transparent;
}

.header-nav.fixed .header-nav-container {
    width: 100%;
    background: #FFF;
    border-radius: 0.55vw;
}

.header-nav-container {
    width: 100%;
    padding: 1.1vw 1.56vw;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2.6vw;
    flex-wrap: wrap;
    background: rgba(235, 235, 235, 0.3);
    border-radius: 0.55vw;
}

.header-nav-item {
    display: flex;
    align-items: center;
    line-height: 1.55;
    gap: 0.7vw;
    font-size: var(--font-size-body);
    font-weight: 500;
    color: rgba(26, 26, 26, 0.75);
    text-decoration: none;
    font-family: 'Geist', sans-serif;
    transition: color 0.3s ease;
    cursor: pointer;
    position: relative;
    white-space: nowrap;
}

.header-nav-item:hover {
    color: #485B85;
}

.header-nav-item svg {
    width: 1.25vw;
    height: 1.25vw;
    flex-shrink: 0;
    transition: transform 0.3s ease;
}

.header-nav-item-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 1.25vw;
    height: 1.25vw;
    flex-shrink: 0;
}

.header-nav-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #485B85;
    color: #FFFFFF;
    font-size: 0.65vw;
    font-weight: 500;
    padding: 0.24vw 0.52vw;
    border-radius: 0.52vw;
    line-height: 1;
}

.header-calculator-btn-icon svg path {
    transition: fill 0.3s ease;
    fill: #FFFFFF;
}

.header-calculator-btn:hover .header-calculator-btn-icon svg {
    transform: translateX(max(-12.35vw, calc(-10% - 20.04vw))) rotate(40deg);
}

.header-calculator-btn:hover .header-calculator-btn-icon svg path {
    fill: #485B85;
}

/* Эффект блика для кнопки калькулятора */
.header-calculator-btn .flare {
    position: absolute;
    top: 0;
    height: 100%;
    width: 45px;
    transform: skewX(-45deg);
    animation: flareAnimation 3s infinite;
    left: -170%;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.9), #fff);
    filter: blur(0px);
    z-index: 1;
    pointer-events: none;
}

.header-contact-wrapper {
    display: flex;
    align-items: center;
    gap: 0.26vw;
    flex-shrink: 0;
    position: relative;
    overflow: visible;
}

@keyframes swing {
    0%, 100% {
        transform: rotate(-20deg);
    }
    50% {
        transform: rotate(30deg);
    }
}

@keyframes pulse {
    0% {
        transform: scale(0.5);
        opacity: 0;
    }
    50% {
        opacity: 1;
    }
    100% {
        transform: scale(0.55);
        opacity: 0;
    }
}

@keyframes pulse-border-phone {
    0% {
        transform: translate(-50%, -50%) translateZ(0) scale(1);
        opacity: 1;
    }
    100% {
        transform: translate(-50%, -50%) translateZ(0) scale(1.5);
        opacity: 0;
    }
}

.header-phone-icon {
    width: 2.86vw;
    height: 2.86vw;
    border-radius: 50%;
    background: #485B85;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    position: relative;
    z-index: 100;
    overflow: visible;
    box-sizing: content-box;
}

.header-phone-icon:hover::before {
    content: "";
    position: absolute;
    z-index: 0;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    display: block;
    width: 2.86vw;
    height: 2.86vw;
    background: #485B85;
    border-radius: 50%;
    animation: pulse-border-phone 1500ms ease-out infinite;
}

.header-phone-icon:hover::after {
    content: "";
    position: absolute;
    z-index: 1;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    display: block;
    width: 2.86vw;
    height: 2.86vw;
    background: #485B85;
    border-radius: 50%;
    transition: all 200ms;
    background-color: rgba(72, 91, 133, 0.9);
}

.header-phone-icon svg {
    width: 1.04vw;
    height: 1.04vw;
    transform-origin: center;
    animation: swing 2s ease-in-out infinite;
    position: relative;
    z-index: 3;
}

.header-phone-icon-fixed {
    width: 4vw;
    height: 4vw;
    border-radius: 50%;
    background: #485B85;
    display: flex;
    align-items: center;
    justify-content: center;
    position: fixed;
    bottom: 2vw;
    
    /* ФИКС: Делаем значение еще меньше, чтобы сдвинуть кнопку ПРАВЕЕ */
    right: 0.6vw !important; 
    
    z-index: 1000;
    overflow: visible;
    cursor: pointer;
    box-shadow: 0 0.26vw 0.78vw rgba(0, 0, 0, 0.2);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    box-sizing: content-box;
}

.header-phone-icon-fixed:hover {
    transform: scale(1.1);
}

.header-phone-icon-fixed:hover::before {
    content: "";
    position: absolute;
    z-index: 0;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    display: block;
    width: 4vw;
    height: 4vw;
    background: #485B85;
    border-radius: 50%;
    animation: pulse-border-phone 1500ms ease-out infinite;
}

.header-phone-icon-fixed:hover::after {
    content: "";
    position: absolute;
    z-index: 1;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    display: block;
    width: 4vw;
    height: 4vw;
    background: #485B85;
    border-radius: 50%;
    transition: all 200ms;
    background-color: rgba(72, 91, 133, 0.9);
}

.header-phone-icon-fixed svg {
    width: 1.46vw;
    height: 1.46vw;
    transform-origin: center;
    animation: swing 2s ease-in-out infinite;
    position: relative;
    z-index: 3;
}

.header-contact-block {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.78vw;
    padding: 0.21vw 0.23vw 0.21vw 1.56vw;
    background: #EBEBEB;
    border-radius: 2.6vw;
    flex-shrink: 0;
    margin-right: 0.26vw;
}

.header-phone-info {
    display: flex;
    flex-direction: column;
}

.header-phone-number {
    text-align: right;
    font-size: 1.04vw;
    font-weight: 500;
    color: #000000;
    line-height: 0.94vw;
}

.header-phone-hours {
    font-size: var(--font-size-body-xxs);
    color: #1A1A1ABF;
    line-height: 100%;
    text-align: right;
    margin-top: 0.26vw;
    font-weight: 300;
    position: relative;
}

.header-avatar {
    width: 2.6vw;
    height: 2.6vw;
    border-radius: 50%;
    overflow: hidden;
    flex-shrink: 0;
}

.header-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.header-menu-btn {
    display: flex;
    align-items: center;
    gap: 0.52vw;
    padding: 0.83vw 1.51vw 0.83vw 1.51vw;
    border-radius: 2.6vw;
    background: #485B85;
    border: 0.063vw solid #2E3D58;
    cursor: pointer;
    transition: all 0.3s ease;
    flex-shrink: 0;
}

.header-menu-btn span {
    font-size: var(--font-size-body);
    color: #FFFFFF;
    font-weight: 500;
}

.header-menu-icons {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.header-menu-icons svg {
    width: 1.56vw;
    height: 0.78vw;
}

.header-menu-bottom-line {
    transform-origin: left center;
    transition: transform 0.3s ease;
}

.header-menu-btn:hover {
    background: #FFFFFF;
    border-color: #485B85;
}

.header-menu-btn:hover span {
    color: #485B85;
}

.header-menu-btn:hover .header-menu-icons svg rect {
    fill: #485B85;
}

.header-menu-btn:hover .header-menu-bottom-line {
    transform: scaleX(1.2) translateX(-0.25vw);
}

.header_nuv {
    display: flex;
    align-items: stretch;
    justify-content: space-between;
    gap: 2.6vw;
    padding: 0 10% 0 10%;
}

.header_nuv-left {
    flex: 0 0 42vw;
    position: relative;
}

.header_nuv-left-text {
    width: 38.02vw;
    font-weight: 700;
    font-size: 2.61vw;
    line-height: 3.925vw;
    color: #000000;
    text-align: left;
    text-transform: uppercase;
}

.header_nuv-left-text span {
    color: #485B85;
    text-decoration: underline;
    text-decoration-thickness: 0.16vw;
    text-underline-offset: 0.26vw;
}

.header_nuv-left-text-description {
    width: 30.21vw;
    font-weight: 300;
    font-size: var(--font-size-h8);
    line-height: 1.72vw;
    text-align: left;
    color: #1A1A1ABF;
    margin-top: 0.78vw;
}

.header_nuv-left-buttons {
    display: flex;
    gap: 0.78vw;
    margin-top: 1.56vw;
    align-items: center;
}

.header_nuv-btn {
    padding: 1.46vw 2.08vw;
    border-radius: 2.6vw;
    font-weight: 600;
    border: none;
    font-size: var(--font-size-body-xxs);
    font-weight: 500;
    line-height: 0.99vw;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    font-family: 'Geist', sans-serif;
}

.header_nuv-btn-1 {
    padding: 0.31vw 0.31vw 0.31vw 1.56vw;
    border-radius: 2.6vw;
    border: 0.052vw solid #2E3D58;
    font-weight: 700;
    font-size: var(--font-size-button);
    line-height: 0.89vw;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 1.56vw;
    font-family: 'Geist', sans-serif;
    position: relative;
    overflow: hidden;
}

.header_nuv-btn-secondary {
    background: #E2E2E2B2 !important;
    color: #000000;
    border: 0.052vw solid #E0E0E0;
}

.header_nuv-btn-secondary:hover {
    background: #FFFFFF;
}

.header_nuv-btn-primary {
    background: #485B85;
    color: #FFFFFF;
}

.header_nuv-btn-primary span {
    color: #FFFFFF;
    transition: color 0.3s ease, transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.header_nuv-btn-primary:hover span {
    color: #485B85;
    transform: translateX(min(3.65vw, 15.31vw));
}

.header_nuv-btn-icon {
    width: 3.125vw;
    height: 3.125vw;
    border-radius: 50%;
    background: #FFFFFF;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    position: relative;
    z-index: 2;
}

.header_nuv-btn-icon svg {
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.header_nuv-btn-1:hover .header_nuv-btn-icon svg {
    transform: translateX(max(-10.1vw, calc(-10% - 15.56vw))) rotate(40deg);
}

.header_nuv-btn-1::after {
    content: '';
    position: absolute;
    right: 0.31vw;
    top: 50%;
    transform: translateY(-50%);
    width: 3.125vw;
    height: 3.125vw;
    border-radius: 50%;
    background: #FFFFFF;
    transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 0;
    pointer-events: none;
}

.header_nuv-btn-1:hover::after {
    width: 41.67vw;
    height: 41.67vw;
    right: -20.83vw;
    top: 50%;
    transform: translateY(-50%);
}

.header_nuv-btn-1 span {
    position: relative;
    z-index: 3;
}

.header_nuv-btn-icon svg {
    width: 0.73vw;
    height: 0.63vw;
}

/* Эффект блика для кнопки "Записаться на приём" */
.header_nuv-btn-1 .flare {
    position: absolute;
    top: 0;
    height: 100%;
    width: 45px;
    transform: skewX(-45deg);
    animation: flareAnimation 3s infinite;
    left: -170%;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.9), #fff);
    filter: blur(0px);
    z-index: 1;
    pointer-events: none;
}

@keyframes flareAnimation {
    0% {
        left: -170%;
    }
    50% {
        left: 170%;
    }
    100% {
        left: 170%;
    }
}

.header_nuv-left-about {
    display: flex;
    align-items: center;
    gap: 0.78vw;
    margin-top: 2.6vw;
}

.header_nuv-tooth-icon {
    width: 1.56vw;
    height: 1.56vw;
    border-radius: 50%;
    background: #485B85;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.header_nuv-tooth-icon svg {
    width: 0.78vw;
    height: 0.73vw;
}

.header_nuv-about-text {
    font-size: var(--font-size-body);
    font-weight: 300;
    color: #1A1A1ABF;
    font-family: 'Geist', sans-serif;
}

.header_nuv-ratings {
    display: flex;
    gap: 0.52vw;
    margin-top: 2.6vw;
    align-items: center;
}



.header_nuv-rating-card {
    height: 3.5vw;
    background: #FFFFFF;
    border: 1px solid rgba(215, 215, 215, 1);
    /* box-shadow: 0 0 0 0.026vw rgba(235, 235, 235, 1); */
    border-radius: 0.63vw;
    padding: 0.63vw;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 0.42vw;
    transition: transform 0.3s ease;
    cursor: pointer;
}

.header_nuv-rating-card:hover {
    transform: scale(1.05);
}

.header_nuv-rating-icon {
    width: auto;
    height: 1.09vw;
    object-fit: contain;
    flex-shrink: 0;
    align-self: flex-start;
}

.header_nuv-rating-logo-text {
    font-size: var(--font-size-h9);
    font-weight: 700;
    color: #2E3D58;
    font-family: 'Geist', sans-serif;
    flex-shrink: 0;
    line-height: 1;
}

.header_nuv-rating-content {
    display: flex;
    flex-direction: column;
    gap: 0.21vw;
    align-items: flex-start;
    width: 100%;
}

.header_nuv-rating-title {
    font-size: var(--font-size-body-small);
    font-weight: 600;
    color: #000000;
    font-family: 'Geist', sans-serif;
    line-height: 1.2;
}

.header_nuv-rating-stars {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.21vw;
}

.header_nuv-rating-value {
    font-size: var(--font);
    font-weight: 700;
    color: #000000;
    font-family: 'Geist', sans-serif;
    margin-right: 0.21vw;
}

.header_nuv-rating-stars svg {
    width: 0.94vw;
    height: 0.89vw;
    flex-shrink: 0;
}

.header_nuv-right {
    flex: 1 1;
    display: flex;
    justify-content: flex-start;
    margin-top: 1.15vw;
}

.header_nuv > div:last-child {
    flex: 1 1;
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    align-self: stretch;
}

.header_nuv-doctor-image {
    width: 100%;
    max-width: 100%;
    height: 100%;
    max-height: 100%;
    border-radius: 1.04vw;
    overflow: hidden;
    flex-shrink: 0;
    display: flex;
    align-items: flex-end;
}

.header_nuv-doctor-image img {
    width: 100%;
    max-width: 100%;
    height: 100%;
    max-height: 47.45vw;
    display: block;
    object-fit: cover;
    object-position: center 30%;
    border-radius: 1.04vw;
}

.header_nuv-carousel-wrapper {
    display: flex;
    align-items: center;
    gap: 1.56vw;
}

.header_nuv-carousel {
    position: relative;
    width: 100%;
    height: 15.63vw;
    overflow: hidden;
    border-radius: 1.56vw;
}

.header_nuv-carousel-slides {
    display: flex;
    height: 100%;
}

.header_nuv-carousel-slide {
    width: 100%;
    min-width: 100%;
    height: 100%;
    flex-shrink: 0;
}

.header_nuv-carousel-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: opacity 0.3s ease-in-out;
}

.header_nuv-carousel-dots-wrapper {
    position: relative;
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
    padding: 0.21vw 0;
}

.header_nuv-carousel-line {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: 0.42vw;
    background: linear-gradient(180deg, #485B85 0%, rgba(72, 91, 133, 0.8) 100%);
    border-radius: 0.1vw;
    z-index: 0;
    pointer-events: none;
    box-shadow: 0 0 0.21vw rgba(72, 91, 133, 0.3);
    opacity: 0;
}

.header_nuv-carousel-line-animating {
    animation: slideLine 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

@keyframes slideLine {
    0% {
        top: 0.52vw;
        top: var(--prev-top, 0.52vw);
        opacity: 1;
    }
    100% {
        top: 0.52vw;
        top: var(--current-top, 0.52vw);
        opacity: 1;
    }
}

.header_nuv-carousel-dots {
    display: flex;
    flex-direction: column;
    gap: 0.26vw;
    position: relative;
    z-index: 2;
}

.header_nuv-carousel-dot {
    width: 0.26vw;
    height: 0.26vw;
    border-radius: 50%;
    border: none;
    background: rgba(0, 0, 0, 0.3);
    cursor: pointer;
    transition: all 0.3s ease;
    padding: 0;
    position: relative;
    z-index: 2;
}

.header_nuv-carousel-dot.active {
    background: #000000;
    height: 0.52vw;
}

@media (max-width: 780px) {
    /* Скрываем навигацию */
    .header-nav-wrapper,
    .header-nav {
        display: none;
    }
    
    /* В шапке оставляем только лого и кнопку меню */
    .header-top-row {
        justify-content: space-between;
    }
    
    .header-clinic-info,
    .header-location,
    .header-calculator-btn,
    .header-contact-wrapper .header-phone-icon,
    .header-contact-wrapper .header-contact-block {
        display: none;
    }
    
    .header-contact-wrapper {
        display: flex;
        align-items: center;
    }
    
    /* Размеры лого */
    .header-logo img {
        width: 24.26vw;
        height: 7.71vw;
    }
    
    /* Размеры кнопки меню */
    .header-menu-btn {
        padding: 2.7vw 4.76vw;
        gap: 1.94vw;
        border-radius: 6.41vw;
    }
    
    .header-top-row {
        margin-bottom: 2.6vw;
    }

    .header-menu-btn span {
        font-size: 3.1vw;
        font-weight: 500;
    }
    
    .header-menu-icons svg {
        width: 5.26vw;
        height: 2.28vw;
    }
    
    .header-menu-bottom-line {
        transform-origin: right center;
        transition: transform 0.3s ease;
    }

    .header-menu-btn:hover .header-menu-bottom-line {
        transform: scaleX(1.2) translateX(0.0vw);
    }
    
    /* Изменяем порядок элементов в header_nuv */
    .header_nuv {
        flex-direction: column;
        gap: 6.36vw;
        padding: 0 2.56vw;
        position: relative;
    }
    
    /* Фотография и блок - первый порядок */
    .header_nuv > div:last-child {
        order: 1;
        width: 100%;
        position: relative;
    }
    
    .header_nuv-doctor-image {
        width: 100%;
        height: 128.21vw;
        max-height: 128.21vw;
        position: relative;
        border-radius: 2.2vw;
    }
    
    .header_nuv-doctor-image img {
        width: 100%;
        height: 100%;
        max-height: 128.21vw;
        object-fit: cover;
    }
    
    /* Блок header-center-card позиционируем на фотографии */
    .header_nuv {
        position: relative;
    }
    
    .header-center-item {
        gap: 1.3vw;
    }
    
    .header_nuv-left .header-center-card {
        position: absolute;
        top: -51.9vw;
        bottom: auto;
        right: 1.4svw;
        left: auto;
        max-width: calc(100% - 5.13vw);
        width: 65vw;
        /* min-width: 25.641vw; */
        z-index: 10;
        padding: 1.7vw 4.22vw 2.6vw 3.32vw;
        border-radius: 1.7vw;
    }
    
    .header-center-title {
        font-size: 3.1vw;
        margin-bottom: 0.9vw;
    }
    
    .header-center-description {
        font-size: 2.3vw;
    }
    
    .header-center-icon {
        width: 2.1vw;
        height: 2.1vw;
        margin-top: 1.1vw;
    }
    
    .header-center-arrow {
        width: 3.5vw;
        height: 2.7vw;
        margin-top: 1.5vw;
    }
    
    /* Заголовок и подзаголовок с кнопками - второй порядок */
    .header_nuv-left {
        order: 2;
        flex: none;
        width: 100%;
        position: relative;
    }
    
    .header_nuv-left-text {
        width: 100%;
        font-size: 6.37vw;
        font-weight: 700;
        line-height: 8.33vw;
    }
    
    .header_nuv-left-text span {
        text-decoration-thickness: 0.26vw;
        text-underline-offset: 0.64vw;
    }
    
    .header_nuv-left-text-description {
        width: 100%;
        font-size: 3.85vw;
        font-weight: 300;
        line-height: 5.77vw;
        margin-top: 3.72vw;
    }
    
    .header_nuv-left-buttons {
        display: flex;
        flex-direction: row;
        gap: 1.92vw;
        margin-top: 3.85vw;
        align-items: center;
        width: 100%;
    }
    
    .header_nuv-btn {
        padding: 5.38vw 5.13vw;
        border-radius: 6.41vw;
        font-weight: 600;
        /* border: none; */
        font-size: 2.82vw;
        line-height: 2.44vw;
        cursor: pointer;
        transition: all 0.3s ease;
        display: flex;
        align-items: center;
        font-family: 'Geist', sans-serif;
        width: 40%;
        justify-content: center;
    }
    
    .header_nuv-btn-1 {
        padding: 0.77vw 0.77vw 0.77vw 3.21vw;
        border-radius: 6.41vw;
        border: 0.13vw solid #2E3D58;
        font-weight: 500;
        font-size: 2.82vw;
        line-height: 2.18vw;
        cursor: pointer;
        transition: all 0.3s ease;
        display: flex;
        align-items: center;
        gap: 3.85vw;
        font-family: 'Geist', sans-serif;
        position: relative;
        overflow: hidden;
        width: 60%;
        justify-content: space-between;
    }
    
    .header_nuv-btn-icon {
        width: 11.54vw;
        height: 11.54vw;
        border-radius: 50%;
        background: #FFFFFF;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        position: relative;
        z-index: 2;
        margin-left: auto;
    }
    
    .header_nuv-btn-icon svg {
        transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
        width: 2.31vw;
        height: 1.79vw;
    }
    
    /* Стили для анимации синей кнопки */
    .header_nuv-btn-primary {
        background: #485B85;
        color: #FFFFFF;
    }

    .header_nuv-btn-1.header_nuv-btn-primary {
        font-weight: 700;
        padding-left: 6.41vw;
    }

    .header_nuv-btn-primary span {
        color: #FFFFFF;
        transition: color 0.3s ease, transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
        position: relative;
        z-index: 3;
    }

    .header_nuv-btn-primary:hover span {
        color: #485B85;
        transform: translateX(13.474vw);
    }
    
    /* Подгоняем псевдоэлемент ::after под размер белого круга */
    .header_nuv-btn-1::after {
        content: '';
        position: absolute;
        right: 0.77vw;
        top: 50%;
        transform: translateY(-50%);
        width: 11.54vw;
        height: 11.54vw;
        border-radius: 50%;
        background: #FFFFFF;
        transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
        z-index: 0;
        pointer-events: none;
    }
    
    .header_nuv-btn-1:hover::after {
        width: 200vw;
        height: 200vw;
        right: -100vw;
        top: 50%;
        transform: translateY(-50%);
    }

    .header_nuv-btn-1:hover .header_nuv-btn-icon svg {
        transform: translateX(-42.028vw) rotate(40deg);
    }
    
    .header_nuv-left-about {
        display: flex;
        align-items: center;
        gap: 2.56vw;
        margin-top: 14vw;
        margin-bottom: 2.56vw;
    }
    
    .header_nuv-tooth-icon {
        width: 7.05vw;
        height: 7.05vw;
        border-radius: 50%;
    background: #485B85;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
    }
    
    .header_nuv-tooth-icon svg {
        width: 3.21vw;
        height: 3.21vw;
    }
    
    .header_nuv-about-text {
        font-size: 3.21vw;
    }
    
    /* Карусель - третий порядок */
    .header_nuv-right {
        order: 3;
        width: 100%;
        margin-top: 0;
        position: relative;
    }
    
    .header_nuv-carousel-wrapper {
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 0;
        position: static;
    }
    
    .header_nuv-carousel {
        min-height: 51.28vw;
        height: 51.28vw;
        border-radius: 2.564vw;
        border: 0.128vw solid rgba(215, 215, 215, 1);
        order: 1;
        width: 100%;
    }
    
    
    .header_nuv-carousel-dots {
        flex-direction: row;
        gap: 0.64vw;
    }
    
    .header_nuv-carousel-dot {
        width: 0.77vw;
        height: 0.77vw;
    }
    
    .header_nuv-carousel-dot.active {
        width: 2.05vw;
        height: 0.77vw;
        border-radius: 12.82vw;
    }
    
    .header_nuv-ratings {
        order: 4;
        width: 100%;
        margin-top: 0;
        display: flex;
        flex-wrap: wrap;
        gap: 2.56vw;
        align-items: flex-start;
        position: relative;
        padding-top: 2.56vw;
    }
    
    .header_nuv-rating-card {
        width: 29.5vw;
        height: 12.87vw;
        padding: 1.03vw 1.67vw;
        border-radius: 1.03vw;
        gap: 0.77vw;
        order: 1;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    
    .header_nuv-rating-icon {
        height: 3.2vw;
        display: block;
        margin-left: 10%;
    }
    
    .header_nuv-rating-content {
        display: flex;
        flex-direction: column;
        gap: 0.21vw;
        align-items: center;
        justify-content: center;
        width: 100%;
    }
    
    .header_nuv-rating-value {
        font-size: 3.2vw;
        margin-right: 0.51vw;
    }
    
    .header_nuv-rating-stars {
        gap: 0.38vw;
        justify-content: center;
    }
    
    .header_nuv-rating-stars svg {
        width: 2.6vw; /* Было 2.05vw - увеличили звездочки */
        height: 2.4vw;
    }
    
    
    

    .header_nuv-carousel-dots-wrapper {
        position: absolute !important;
        top: calc(51.28vw + 10.36vw + 11.67vw + 2.56vw + 1.3vw) !important;
        left: 50% !important;
        right: auto !important;
        transform: translateX(-50%) !important;
        margin-top: 0 !important;
        flex-direction: row;
        padding: 0;
        width: auto;
        min-width: 20vw;
        justify-content: center;
        align-items: center;
        display: flex !important;
        flex-shrink: 0;
        z-index: 100 !important;
        visibility: visible !important;
        opacity: 1 !important;
        pointer-events: auto !important;
        background: transparent;
    }
    
    .header_nuv-carousel-dots {
        display: flex !important;
        visibility: visible !important;
    }
    
    .header_nuv-carousel-dot {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
    
    
    
    .header {
        padding: 3.2vw 0 7.69vw 0;
    }

    @media (min-width: 2201px) {
    /* ... остальные стили ... */

    .header-phone-icon-fixed {
        width: 3.5vw;
        height: 3.5vw;
        bottom: 1.75vw;
        
        /* ФИКС: Еще правее для больших экранов */
        right: 0.5vw !important; 
    }

    .header-phone-icon-fixed svg {
        width: 1.27vw;
        height: 1.27vw;
    }
}

    .header-phone-icon-fixed:hover::before {
        width: 9.38vw;
        height: 9.38vw;
    }

    .header-phone-icon-fixed:hover::after {
        width: 9.38vw;
        height: 9.38vw;
    }
}

@media (max-width: 2200px) {
    .header_nuv {
        padding: 0 2.6vw 0 2.6vw;
    }

    .header-container {
        padding: 0 2.6vw 0.5vw 2.6vw;
        /* padding-top: 10px; */
    }
    .header-nav.fixed {
        padding: 0 2.6vw 0vw 2.6vw;
    }
}

@media (min-width: 2201px) {
    .header-top-row {
        gap: 1.2vw;
    }
    
    .header-clinic-text {
        font-size: 0.82vw;
    }
    
    .header-logo img {
        height: 2.1vw;
        width: 6.64vw;
    }

    .header-location {
        gap: 0.55vw;
    }

    .header-metro-icon img {
        width: 1.09vw;
        height: 1.27vw;
    }

    .header-metro-text {
        font-size: 0.82vw;
    }

    .header-street {
        font-size: 0.64vw;
    }

    .header-calculator-btn {
        gap: 1.14vw;
        padding: 0.91vw 1.41vw;
        border: 0.052vw solid #485B85;
        border-radius: 2.27vw;
        margin: 0;
    }

    .header-calculator-btn span {
        font-size: 0.59vw;
        line-height: 0.94vw;
    }

    .header-calculator-btn:hover span {
        transform: translateX(min(2.0vw, 4.8vw));
    }

    .header-calculator-btn-icon {
        width: 0.55vw;
        height: 0.5vw;
    }

    .header-calculator-btn:hover .header-calculator-btn-icon svg {
        transform: translateX(max(-12.35vw, calc(-10% - 11.04vw))) rotate(40deg);
    }

    .header-contact-wrapper {
        gap: 0.23vw;
    }

    .header-phone-icon {
        width: 2.5vw;
        height: 2.5vw;
    }

    .header-phone-icon svg {
        width: 0.91vw;
        height: 0.91vw;
    }

    .header-contact-block {
        gap: 0.68vw;
        padding: 0.18vw 0.2vw 0.18vw 1.36vw;
        border-radius: 2.27vw;
    }

    .header-phone-number {
        font-size: 0.91vw;
    }

    .header-phone-hours {
        font-size: 0.64vw;
    }

    .header-avatar {
        width: 2.27vw;
        height: 2.27vw;
    }

    .header-menu-btn {
        gap: 0.45vw;
        padding: 0.73vw 1.32vw;
        border-radius: 2.27vw;
    }
    
    .header-menu-btn span {
        font-size: 0.82vw;
        }

    .header-menu-icons svg {
        width: 1.36vw;
        height: 0.68vw;
    }

    .header-phone-icon-fixed {
        width: 3.5vw;
        height: 3.5vw;
        bottom: 1.75vw;
        right: 3.25vw; /* <-- Идеальная середина для больших мониторов */
    }

    .header-phone-icon-fixed svg {
        width: 1.27vw;
        height: 1.27vw;
    }
}



/* =========================================
   ИДЕАЛЬНАЯ НАВИГАЦИЯ СЛАЙДЕРА (Адаптивная)
   ========================================= */
.header_nuv-ratings-nav {
  display: flex !important;
  align-items: center !important;
  gap: 0.78vw !important; /* ~15px на ПК */
  position: relative;
  z-index: 10;
}

.header_nuv-ratings-counter {
  font-size: 0.83vw !important; /* ~16px */
  font-weight: 500 !important;
  margin-right: 0.52vw !important; /* ~10px */
  color: #1A1A1A;
}

/* Кнопка */
.header_nuv-nav-btn {
  position: relative !important;
  width: 3.125vw !important; /* ~60px на ПК */
  height: 3.125vw !important; 
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  border-radius: 50%;
  cursor: pointer;
  transition: transform 0.3s ease, filter 0.3s ease !important; 
}

/* Эффект при наведении (hover) - красивое увеличение */
.header_nuv-nav-btn:hover {
  transform: scale(1.08) !important;
  filter: drop-shadow(0 4px 6px rgba(0,0,0,0.08));
}

.header_nuv-nav-btn:active {
  transform: scale(0.95) !important;
}

/* Кольцо прогресса: заставляем SVG тянуться за кнопкой */
.header_nuv-nav-progress {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  z-index: 1 !important;
}

/* Сама стрелка */
.header_nuv-nav-arrow {
  position: relative !important;
  width: 0.52vw !important; /* ~10px */
  height: 0.78vw !important; /* ~15px */
  z-index: 2 !important;
}

/* Делаем стрелку ярче при наведении */
.header_nuv-nav-btn:hover .header_nuv-nav-arrow path {
  stroke-opacity: 1 !important;
  transition: stroke-opacity 0.3s ease;
}

/* =========================================
   МОБИЛЬНАЯ АДАПТАЦИЯ (для экранов < 780px)
   ========================================= */
@media (max-width: 780px) {
  .header_nuv-ratings-nav {
    gap: 2.03vw !important; 
    width: 100% !important;
    order: 2 !important; 
    justify-content: flex-end !important;
    margin-top: 3.86vw !important;
    margin-left: 0 !important;
  }
  
  .header_nuv-ratings-counter {
    font-size: 2.56vw !important; 
    margin-right: 1vw !important;
  }
  
  .header_nuv-nav-btn {
    width: 12vw !important; /* Было 8vw - увеличили кликабельную область */
    height: 12vw !important; /* Было 8vw */
  
  }
  
  .header_nuv-nav-arrow {
    width: 2vw !important; /* Было 1.5vw - сделали саму стрелку покрупнее */
    height: 3.2vw !important; /* Было 2.5vw */
  }
}

.header-nav{
  display: none !important;
}



/* =========================================
   ПОЛНОЭКРАННОЕ ВОЛНОВОЕ МЕНЮ (ФИРМЕННЫЙ СТИЛЬ)
   ========================================= */
.fullscreen-menu-wrapper {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  z-index: 9999;
  pointer-events: none;
}

.fullscreen-menu-wrapper.active {
  pointer-events: auto;
}

.menu-transition-svg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}

.fullscreen-menu-content {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  opacity: 0;
  transform: translateY(2vw);
}

/* СТИЛИ ДЛЯ ВИДЕО-АВАТАРА */
.header-avatar-video {
    width: 100%;
    height: 100%;
    object-fit: cover; /* Идеально заполняет контейнер, обрезая лишнее */
    display: block;
    border-radius: inherit; /* Наследует скругление от родительского .header-avatar */
}



/* Крестик строго в vw (адаптируется вместе с экраном, не съезжает при зуме) */
.close-menu-btn {
  position: absolute;
  
  /* ФИКС: Твои точные размеры (19.24px сверху и 27.5px справа) */
  top: 0 !important;     
  right: 1.43vw !important;   
  
  background: transparent;
  border: none;
  color: #FFFFFF;
  
  font-family: 'Geist', sans-serif;
  font-weight: 100;
  font-size: 4.43vw;     /* Аналог 85.12px */
  line-height: 5.76vw;   /* Аналог 110.65px */
  
  width: 2.5vw;          /* Аналог 48px */
  height: 5.78vw;        /* Аналог 111px */
  transform: rotate(45deg); 
  opacity: 1;
  
  cursor: pointer;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.3s ease, color 0.3s ease;
  z-index: 10;
}

.close-menu-btn:hover {
  color: #FFFFFF;
  transform: rotate(45deg) scale(1.03); 
}

/* Блок со ссылками строго по размерам из Figma в vw */
.fullscreen-nav-links {
  display: flex;
  flex-direction: column;
  width: 61.46vw;       /* Аналог 1180px */
  height: 38.8vw;       /* Аналог 745px */
  max-width: 90vw; 
  gap: 1.04vw;          /* Аналог 20px */
  justify-content: center; 
  text-align: center;
  margin: 0 auto;
}

/* Новая типографика: Geist Bold 50px (переведено в vw) */
.fullscreen-nav-links a {
  color: #FFFFFF;
  font-family: 'Geist', sans-serif;
  font-weight: 700;        /* По ТЗ: Bold */
  font-style: normal;
  font-size: 2.60vw;       /* Аналог 50px */
  line-height: 3.39vw;     /* Аналог 65px */
  text-transform: uppercase;
  text-decoration: none;
  position: relative;
  transition: transform 0.3s ease;
  display: inline-block;
  width: -webkit-fit-content;
  width: fit-content;
  margin: 0 auto;
}

/* Красивое подчеркивание при наведении */
.fullscreen-nav-links a::after {
  content: '';
  position: absolute;
  bottom: -0.5vw;
  left: 0;
  width: 0;
  height: 0.2vw;
  background: #FFFFFF;
  transition: width 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  border-radius: 0.1vw;
}

.fullscreen-nav-links a:hover {
  transform: scale(1.03);
}

.fullscreen-nav-links a:hover::after {
  width: 100%;
}

/* =========================================
   МОБИЛЬНАЯ АДАПТАЦИЯ МЕНЮ (< 780px)
   ========================================= */
@media (max-width: 780px) {
  .fullscreen-menu-content {
    transform: translateY(5vw);
  }
  
  .close-menu-btn {
    top: 5vw;
    right: 5vw;
    font-size: 10vw;
    width: 6vw;
    height: 12vw;
  }
  .fullscreen-nav-links {
    width: 100%;
    height: auto;
    gap: 4vw;
  }
  .fullscreen-nav-links a {
    font-size: 7vw;
    line-height: 1.2;
  }
  
  .fullscreen-nav-links a::after {
    bottom: -1.5vw;
    height: 0.6vw;
  }
}




/* =========================================
   1. ЖЕЛЕЗОБЕТОННЫЙ СЕРЫЙ ЦВЕТ ДЛЯ КНОПКИ
   ========================================= */
.header_nuv-btn.header_nuv-btn-secondary {
    background-color: #E2E2E2B2 !important;
}

/* =========================================
   2. СТИЛИ И АНИМАЦИИ ГАЛЕРЕИ (ЖЕСТКО В VW)
   ========================================= */
.gallery-modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: rgba(15, 15, 15, 0.95);
    -webkit-backdrop-filter: blur(8px);
            backdrop-filter: blur(8px);
    z-index: 999999;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.4s ease, visibility 0.4s ease;
}

.gallery-modal-overlay.open {
    opacity: 1;
    visibility: visible;
}

.gallery-modal-container {
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

/* ИСПРАВЛЕНО: Убрали vh! Теперь пропорции фотки и кнопок намертво связаны */
.gallery-image-wrapper {
    width: 75vw;
    height: 43vw; /* МАГИЯ ЗДЕСЬ: Жестко привязали высоту к ширине экрана */
    display: flex;
    justify-content: center;
    align-items: center;
}

.gallery-main-image {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    border-radius: 0.63vw; 
    box-shadow: 0 0.52vw 2.08vw rgba(0,0,0,0.5); 
}

/* =========================================
   АНИМАЦИИ ГАЛЕРЕИ (ВЛЕВО/ВПРАВО)
   ========================================= */
.gallery-main-image.slide-next {
    animation: slideInFromRight 0.35s cubic-bezier(0.25, 0.8, 0.25, 1) forwards;
}

.gallery-main-image.slide-prev {
    animation: slideInFromLeft 0.35s cubic-bezier(0.25, 0.8, 0.25, 1) forwards;
}

@keyframes slideInFromRight {
    0% { opacity: 0; transform: translateX(2.6vw); } 
    100% { opacity: 1; transform: translateX(0); }
}

@keyframes slideInFromLeft {
    0% { opacity: 0; transform: translateX(-2.6vw); } 
    100% { opacity: 1; transform: translateX(0); }
}

/* =========================================
   КНОПКИ И СЧЕТЧИК (Только vw)
   ========================================= */
.gallery-close-btn {
    position: absolute;
    top: 1.56vw; 
    right: 2.08vw; 
    background: none;
    border: none;
    color: rgba(255,255,255,0.7);
    font-size: 1.82vw; 
    cursor: pointer;
    z-index: 10;
    transition: color 0.3s ease, transform 0.25s ease !important;
}

.gallery-close-btn:hover {
    color: white !important;
    transform: scale(1.15) !important;
}

.gallery-nav-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(255, 255, 255, 0.1);
    border: 0.052vw solid rgba(255,255,255,0.2); 
    color: white;
    font-size: 2.08vw; 
    width: 3.125vw; 
    height: 3.125vw; 
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: all 0.25s ease !important;
    z-index: 10;
}

.gallery-nav-btn:hover {
    background: rgba(255, 255, 255, 0.25) !important;
    transform: translateY(-50%) scale(1.1) !important;
}

.gallery-nav-btn.prev { left: 5vw; padding-bottom: 0.26vw; } /* Заменили % на vw */
.gallery-nav-btn.next { right: 5vw; padding-bottom: 0.26vw; } /* Заменили % на vw */

.gallery-counter {
    position: absolute;
    bottom: 1.56vw; 
    color: rgba(255,255,255,0.6);
    font-size: 0.83vw; 
    font-family: 'Geist', sans-serif;
    letter-spacing: 0.1vw; 
}

/* =========================================
   3. АДАПТИВ ГАЛЕРЕИ ДЛЯ ТЕЛЕФОНОВ (< 780px)
   ========================================= */
@media (max-width: 780px) {
    .gallery-image-wrapper {
        width: 100vw;
        height: 70vh; /* На мобилке оставляем vh, так как экраны вертикальные */
        padding: 0 2.5vw;
        box-sizing: border-box;
    }
    .gallery-main-image {
        border-radius: 2vw;
    }
    .gallery-nav-btn {
        width: 12vw;
        height: 12vw;
        font-size: 8vw;
        border: 0.2vw solid rgba(255,255,255,0.2);
    }
    .gallery-nav-btn.prev { left: 2vw; }
    .gallery-nav-btn.next { right: 2vw; }
    .gallery-close-btn { 
        top: 4vw; 
        right: 4vw; 
        font-size: 8vw; 
    }
    .gallery-counter { 
        bottom: 5vw; 
        font-size: 4vw;
    }
}
/* Модальное окно с согласием на обработку персональных данных */
.kvis-privacy-modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5);
  z-index: 10000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2vw;
  box-sizing: border-box;
}

.kvis-privacy-modal {
  background: #FFFFFF;
  border-radius: 1.04vw;
  max-width: 60vw;
  max-height: 90vh;
  width: 100%;
  position: relative;
  display: flex;
  flex-direction: column;
  box-shadow: 0 0 60px rgba(0, 0, 0, 0.3);
}

.kvis-privacy-modal-close {
  position: absolute;
  top: 1.04vw;
  right: 1.04vw;
  background: transparent;
  border: none;
  cursor: pointer;
  padding: 0.52vw;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 10001;
  transition: opacity 0.3s ease;
}

.kvis-privacy-modal-close:hover {
  opacity: 0.7;
}

.kvis-privacy-modal-close svg {
  width: 1.25vw;
  height: 1.25vw;
}

.kvis-privacy-modal-content {
  padding: 2.6vw;
  overflow-y: auto;
  flex: 1 1;
  scrollbar-width: thin;
  scrollbar-color: rgba(17, 47, 85, 0.3) transparent;
}

.kvis-privacy-modal-content::-webkit-scrollbar {
  width: 0.52vw;
}

.kvis-privacy-modal-content::-webkit-scrollbar-track {
  background: transparent;
  margin: 1.04vw 0;
}

.kvis-privacy-modal-content::-webkit-scrollbar-thumb {
  background: rgba(17, 47, 85, 0.3);
  border-radius: 0.26vw;
  -webkit-transition: background 0.3s ease;
  transition: background 0.3s ease;
}

.kvis-privacy-modal-content::-webkit-scrollbar-thumb:hover {
  background: rgba(17, 47, 85, 0.5);
}

.kvis-privacy-modal-title {
  font-size: 1.56vw;
  font-weight: 700;
  color: #1A1A1A;
  margin: 0 0 1.56vw 0;
  font-family: 'Geist', sans-serif;
}

.kvis-privacy-modal-text {
  font-size: 0.83vw;
  line-height: 1.5;
  color: #1A1A1A;
  font-family: 'Geist', sans-serif;
}

.kvis-privacy-modal-text p {
  margin: 0 0 1.04vw 0;
}

.kvis-privacy-modal-text ul {
  margin: 0 0 1.04vw 0;
  padding-left: 1.56vw;
}

.kvis-privacy-modal-text li {
  margin: 0 0 0.52vw 0;
}

.kvis-privacy-modal-text strong {
  font-weight: 700;
}


.googing {
    width: 100%;
    background: #EBEBEB;
    /* Сверху 3.65vw (70px), справа 2.6vw (50px), снизу 5.2vw (100px), слева 2.6vw (50px) */
    padding: 3.65vw 2.6vw 5.2vw 2.6vw; 
    box-sizing: border-box;
}

.googing-container {
    width: 100%;
    margin: 0 auto;
}

/* =========================================
   ВЕРХНИЙ БЛОК (Заголовок 1 + Описание 1)
   ========================================= */
.googing-header {
    text-align: left;
    
    /* Отступ ровно 50px до нижнего контента */
    margin-bottom: 2.6vw !important; 
    
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.googing-main-title {
    font-family: 'Geist', sans-serif;
    font-weight: 700;
    font-size: 2.344vw; /* 45px в vw */
    line-height: 3.385vw; /* 65px в vw */
    color: #000000;
    text-align: left;
    text-transform: uppercase;
    vertical-align: middle;
    margin-bottom: 0.52vw;
}

.googing-main-title span {
    text-decoration: underline;
    -webkit-text-decoration-style: solid;
            text-decoration-style: solid;
    -webkit-text-decoration-skip: ink;
            text-decoration-skip-ink: auto;
    color: #485B85; 
}

.googing-main-description {
    font-family: 'Geist', sans-serif;
    font-weight: 300;
    font-size: 1.146vw; /* 22px в vw */
    line-height: 1.719vw; /* 33px в vw */
    color: #1A1A1ABF; 
    text-align: left;
    max-width: 60vw;
}

/* =========================================
   КОНТЕНТ (Блоки по 895px = 46.61vw)
   ========================================= */
.googing-content {
    display: flex;
    justify-content: space-between;
    gap: 1.04vw; 
    width: 100%;
    align-items: stretch;
}

/* --- ЛЕВАЯ ЧАСТЬ (895x706, gap 10, radius 20) --- */
.googing-left {
    width: 46.614vw; /* 895px в vw */
    height: 36.77vw; /* 706px в vw */
    flex-shrink: 0;
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 0.52vw; /* 10px в vw */
    opacity: 1;
    border-radius: 1.041vw; /* 20px в vw */
}

.googing-doctor-image {
    width: 100%;
    height: 100%;
    background: #E0E0E0;
    border-radius: 1.041vw;
    overflow: hidden;
    position: relative;
}

.googing-doctor-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 30%;
    display: block;
}

.googing-play-button {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 4.17vw;
    height: 4.17vw;
    background: #FFFFFF;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 10;
    transition: transform 0.3s ease;
    box-sizing: content-box;
}

.googing-play-button::before {
    content: "";
    position: absolute;
    z-index: 0;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    display: block;
    width: 4.17vw;
    height: 4.17vw;
    background: #FFFFFF;
    border-radius: 50%;
    animation: pulse-border 1500ms ease-out infinite;
}

.googing-play-button::after {
    content: "";
    position: absolute;
    z-index: 1;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    display: block;
    width: 4.17vw;
    height: 4.17vw;
    background: #FFFFFF;
    border-radius: 50%;
    transition: all 200ms;
}

.googing-play-button:hover::after {
    background-color: #f5f5f5;
}

.googing-play-button:hover {
    transform: translate(-50%, -50%) scale(1.1);
}

.googing-play-button svg {
    width: 1.16vw;
    height: 1.4vw;
    transform: translateX(0.1vw);
    position: relative;
    z-index: 3;
}

@keyframes pulse-border {
    0% { transform: translate(-50%, -50%) translateZ(0) scale(1); opacity: 1; }
    100% { transform: translate(-50%, -50%) translateZ(0) scale(1.5); opacity: 0; }
}

.googing-doctor-info {
    background: rgba(255, 255, 255, 0.5);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(10px);
    border-radius: 1.04vw;
    padding: 0.26vw;
    display: flex;
    flex-direction: column;
    gap: 0.42vw;
    position: absolute;
    bottom: 0.8vw;
    right: 0.8vw;
    border: 0.03vw solid rgba(255, 255, 255, 1);
    border-top: 0.1vw solid rgba(255, 255, 255, 1);
}

.googing-doctor-info-card {
    background: #FFFFFF;
    padding: 0.52vw 1.25vw;
    gap: 1.56vw;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-radius: 0.78vw;
}

.googing-doctor-name {
    font-size: var(--font-size-h5);
    text-align: left;
    font-weight: 700;
    color: rgba(25, 25, 25, 1);
    font-family: 'Geist', sans-serif;
    margin-bottom: 0.26vw;
}

.googing-doctor-title {
    font-size: var(--font-size-body-small);
    font-weight: 400;
    text-align: left;
    color: #666666;
    font-family: 'Geist', sans-serif;
}

.googing-doctor-contact {
    width: 3.125vw;
    height: 3.125vw;
    background: rgba(46, 61, 88, 1);
    border-radius: 2.6vw;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.googing-doctor-contact svg {
    width: 1.2vw;
    height: 0.94vw;
}

/* --- ПРАВАЯ ЧАСТЬ (895x706, padding 30, space-between, radius 20) --- */
.googing-right {
    width: 46.614vw; /* 895px в vw */
    height: 36.77vw; /* 706px в vw */
    flex-shrink: 0;
}

.googing-form-card {
    width: 100%;
    height: 100%;
    background: #FFFFFF;
    border-radius: 1.041vw; /* 20px в vw */
    padding: 1.562vw; /* 30px в vw. Это и есть ваш отступ в 30px сверху! */
    display: flex;
    flex-direction: column;
    justify-content: space-between; /* Распределяем элементы по высоте */
    box-sizing: border-box;
    opacity: 1;
}

.googing-form-title {
    font-family: 'Geist', sans-serif;
    font-weight: 700;
    font-size: 2.083vw; 
    line-height: 2.708vw; 
    text-transform: uppercase;
    text-align: left;
    color: #000;
    margin: 0 0 1.562vw 0; /* <-- Задали отступ снизу 30px */
    vertical-align: middle;
}

.googing-form-description {
    font-family: 'Geist', sans-serif;
    font-weight: 300;
    font-size: 1.146vw; 
    line-height: 1.719vw; 
    color: #1A1A1ABF; 
    text-align: left;
    margin: 0 0 1.562vw 0; /* <-- Задали отступ снизу 30px */
}

/* =========================================
   КНОПКИ
   ========================================= */
.googing-form-buttons {
    display: flex;
    gap: 1.04vw;
    margin: 0 0 0.52vw 0; /* <-- Задали отступ снизу 10px */
    align-items: center;
    justify-content: flex-start;
    width: 100%;
}

.googing-btn {
    padding: 1.46vw 2.08vw;
    border-radius: 5.2vw;
    font-weight: 600;
    font-size: var(--font-size-button-secondary);
    line-height: 0.99vw;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    font-family: 'Geist', sans-serif;
}

.btn-position-aware {
    position: relative;
    overflow: hidden;
    z-index: 1;
}

.btn-position-aware .wave-span {
    position: absolute;
    width: 0;
    height: 0;
    background: #1A1A1A;
    border-radius: 50%;
    transform: translate(-50%, -50%);
    transition: width 0.6s ease-out, height 0.6s ease-out;
    z-index: -1;
}

.btn-position-aware:hover .wave-span {
    width: 300%;
    padding-top: 300%;
}

.btn-position-aware .btn-text {
    position: relative;
    z-index: 2;
    transition: color 0.3s ease;
}

.btn-position-aware:hover .btn-text {
    color: #fff !important;
}

.googing-btn-secondary {
    background: #E2E2E2B2 !important; /* Теперь этот цвет сработает на 100% */
    color: #000000;
    border: none; /* Убираем бордер, если он не нужен */
}

/* НАСТРОЙКИ ТЕКСТА КНОПКИ (ИЗ FIGMA) */
.googing-btn-secondary .btn-text {
    font-family: 'Geist', sans-serif !important;
    font-weight: 600 !important; /* SemiBold */
    font-size: 0.625vw !important; /* 12px */
    line-height: 0.873vw !important; /* 16.77px */
    letter-spacing: 0 !important;
    vertical-align: middle !important;
    
    /* В Figma 'background' для текста означает его цвет (color) */
    color: #191919 !important; 
}

/* Ховер эффект, чтобы кнопка реагировала на мышку */
.googing-btn-secondary:hover {
    background: #D0D0D0 !important; 
}

.googing-btn-1 {
    padding: 0.31vw 0.31vw 0.31vw 1.56vw;
    border-radius: 2.6vw;
    border: 0.052vw solid #2E3D58;
    font-weight: 700;
    font-size: var(--font-size-button);
    line-height: 0.89vw;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 1.56vw;
    font-family: 'Geist', sans-serif;
    position: relative;
    overflow: hidden;
}

.googing-btn-primary {
    background: #485B85;
    color: #FFFFFF;
}

.googing-btn-primary span {
    color: #FFFFFF;
    transition: color 0.3s ease, transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    z-index: 3;
}

.googing-btn-primary:hover span {
    color: #485B85;
    transform: translateX(min(3.65vw, 15.31vw));
}

.googing-btn-icon {
    width: 3.125vw;
    height: 3.125vw;
    border-radius: 50%;
    background: #FFFFFF;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    position: relative;
    z-index: 2;
}

.googing-btn-icon svg {
    width: 0.73vw;
    height: 0.63vw;
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.googing-btn-1 .flare {
    position: absolute;
    top: 0;
    height: 100%;
    width: 45px;
    transform: skewX(-45deg);
    animation: flareAnimation 3s infinite;
    left: -170%;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.9), #fff);
    filter: blur(0px);
    z-index: 1;
    pointer-events: none;
}

@keyframes flareAnimation {
    0% { left: -170%; }
    50% { left: 170%; }
    100% { left: 170%; }
}

.googing-btn-1:hover .googing-btn-icon svg {
    transform: translateX(max(-12.7vw, calc(-10% - 30.56vw))) rotate(40deg);
}

.googing-btn-1::after {
    content: '';
    position: absolute;
    right: 0.31vw;
    top: 50%;
    transform: translateY(-50%);
    width: 3.125vw;
    height: 3.125vw;
    border-radius: 50%;
    background: #FFFFFF;
    transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 0;
    pointer-events: none;
}

.googing-btn-1:hover::after {
    width: 41.67vw;
    height: 41.67vw;
    right: -20.83vw;
    top: 50%;
    transform: translateY(-50%);
}

/* =========================================
   ЧЕКБОКС И ОПИСАНИЕ СНИЗУ
   ========================================= */
.googing-form-checkbox {
    display: flex;
    align-items: center;
    gap: 0.53vw;
    
    /* Добавляем отступ 10px слева (0.52vw). Сверху, справа и снизу - 0 */
    margin: 0 0 0 0.52vw; 
    
    justify-content: flex-start;
    width: 100%;
}

.googing-form-checkbox input[type="checkbox"] {
    width: 0.78vw;
    height: 0.78vw;
    border-radius: 0.2vw;
    border: 0.052vw solid #EBEBEB;
    background: #EBEBEB;
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    position: relative;
    flex-shrink: 0;
    margin: 0;
}

.googing-form-checkbox input[type="checkbox"]:checked {
    background: rgba(72, 91, 133, 1);
    border-color: rgba(46, 61, 88, 1);
}

.googing-form-checkbox input[type="checkbox"]:checked::after {
    content: '';
    position: absolute;
    left: 50%;
    top: 50%;
    width: 0.12vw;
    height: 0.38vw;
    border: solid white;
    border-width: 0 0.16vw 0.16vw 0;
    transform: translate(-50%, -60%) rotate(45deg);
}

.googing-form-checkbox label {
    font-size: var(--font-size-body-small);
    font-weight: 400;
    color: #666666;
    font-family: 'Geist', sans-serif;
    cursor: pointer;
    text-align: left;
}

.googing-form-disclaimer {
    font-size: var(--font-size-body-small);
    font-weight: 300;
    color: #1A1A1ABF;
    font-family: 'Geist', sans-serif;
    text-align: left;
    width: 100%;
    margin-top: auto; /* <-- Эта строка обязательно должна быть, она прижмет текст к самому низу карточки */
}

.googing-privacy-link {
  color: #485B85;
  text-decoration: underline;
  text-underline-offset: 0.2vw;
  cursor: pointer;
  transition: color 0.3s ease;
}

.googing-privacy-link:hover {
  color: #112F55;
}

/* =========================================
   АДАПТИВ (MOBILE)
   ========================================= */
@media (max-width: 780px) {
    .googing {
        padding: 10vw 5vw 12vw 5vw;
    }

    .googing-header {
        margin-bottom: 6vw;
    }

    .googing-main-title {
        width: 100%;
        font-size: 7vw;
        line-height: 1.2;
        margin-bottom: 3vw;
    }

    .googing-main-title span {
        text-decoration-thickness: 0.4vw;
        text-underline-offset: 1vw;
    }

    .googing-main-description {
        width: 100%;
        font-size: 4vw;
        line-height: 1.4;
        max-width: 100%;
    }

    .googing-content {
        display: flex;
        flex-direction: column;
        gap: 12vw; /* Отступ между карточкой врача и карточкой формы */
    }

    .googing-left {
        width: 100%;
        height: auto;
    }

    .googing-doctor-image {
        height: 100vw;
        border-radius: 4vw;
    }

    .googing-play-button {
        width: 16vw;
        height: 16vw;
    }

    .googing-play-button::before,
    .googing-play-button::after {
        width: 16vw;
        height: 16vw;
    }

    .googing-play-button svg {
        width: 4vw;
        height: 5vw;
    }

    .googing-doctor-info {
        padding: 1vw;
        border-radius: 3vw;
        bottom: -5vw;
        left: 3vw;
        right: 3vw;
    }

    .googing-doctor-info-card {
        padding: 3vw 4vw;
        border-radius: 2vw;
        gap: 2vw;
    }

    .googing-doctor-name {
        font-size: 4vw;
        line-height: 1.2;
        margin-bottom: 1vw;
    }

    .googing-doctor-title {
        font-size: 3vw;
        line-height: 1.2;
    }

    .googing-doctor-contact {
        width: 10vw;
        height: 10vw;
        border-radius: 50%;
    }

    .googing-doctor-contact svg {
        width: 4vw;
        height: 3vw;
    }

    .googing-right {
        width: 100%;
        height: auto;
    }

    .googing-form-card {
        width: 100%;
        height: auto;
        padding: 6vw 5vw;
        border-radius: 4vw;
    }

    .googing-form-title {
        width: 100%;
        font-size: 6.5vw;
        line-height: 1.2;
        margin-bottom: 4vw;
    }

    /* На мобилке скрываем теги <br />, чтобы текст естественно переносился */
    .googing-form-description br {
        display: none;
    }

    .googing-form-description {
        width: 100%;
        font-size: 4vw;
        line-height: 1.4;
        margin-bottom: 6vw;
    }

    /* Настраиваем колонку для кнопок */
    .googing-form-buttons {
        flex-direction: column;
        gap: 3vw;
        margin-bottom: 5vw;
    }

    /* Мобильная СЕРАЯ кнопка (На всю ширину) */
    .googing-btn-secondary {
    width: 11.979vw !important; 
    height: 3.75vw !important; 
    padding: 0.729vw 2.083vw !important; 
    border-radius: 6.718vw !important; 
    
    /* ТВОЙ ЦВЕТ В ФОРМАТЕ RGBA (Эквивалент #E2E2E2B2) */
    background: rgba(226, 226, 226, 0.7) !important; 

    /* ВАЖНО: Если кнопка с этим цветом всё ещё кажется белой из-за 
       белого фона карточки, раскомментируй строку ниже (это 100% серый цвет без прозрачности): */
    /* background: #E2E2E2 !important; */
    
    color: #000000 !important;
    border: none !important;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
}

    /* Мобильная СИНЯЯ кнопка (На всю ширину) */
    .googing-btn-1 {
        width: 100%;
        height: 15vw;
        border-radius: 10vw;
        padding: 0 2vw 0 6vw;
        font-size: 3.8vw;
        gap: 2vw;
        box-sizing: border-box;
    }

    .googing-btn-icon {
        width: 11vw;
        height: 11vw;
        position: absolute;
        right: 2vw;
    }

    .googing-btn-icon svg {
        width: 3vw;
        height: 3vw;
    }
    
    .googing-btn-1::after {
        right: 2vw;
        width: 11vw;
        height: 11vw;
    }

    .googing-form-checkbox {
        gap: 3vw;
        margin-bottom: 4vw;
        align-items: flex-start;
    }

    .googing-form-checkbox input[type="checkbox"] {
        width: 5vw;
        height: 5vw;
        border-radius: 1vw;
        margin-top: 0.5vw;
    }

    .googing-form-checkbox input[type="checkbox"]:checked::after {
        width: 1.2vw;
        height: 2.2vw;
        border-width: 0 0.4vw 0.4vw 0;
        transform: translate(-50%, -60%) rotate(45deg);
    }

    .googing-form-checkbox label {
        font-size: 3.5vw;
        line-height: 1.4;
    }

    .googing-form-disclaimer {
        font-size: 3vw;
        margin-top: 2vw;
        line-height: 1.4;
    }

    .googing-privacy-link {
        text-underline-offset: 0.6vw;
    }
}
@font-face {
  font-family: 'Geist-Static';
  /* Точное название файла с пробелами: */
  src: url("../../static/media/Geist%20Black%20Regular.f75f4db3ade55ce9fb26.ttf") format('truetype'); 
  font-weight: 900;
  font-style: normal;
}

.usluga-container {
  width: 100%;
  padding: 2.5vw 10% 4vw 10%;
  background-color: white;
  box-sizing: border-box;
  overflow: hidden;
}



.usluga-content {
  width: 100%;
}

.usluga-title {
  font-size: var(--font-size-h1);
  font-weight: 700;
  line-height: 3.925vw;
  color: #000000;
  text-align: left;
  text-transform: uppercase;
  font-family: 'Geist', sans-serif;
  margin: 0;
}

.usluga-title span {
  color: #485B85;
  text-decoration: underline;
  text-decoration-thickness: 0.16vw;
  text-underline-offset: 0.26vw;
}

.usluga-description {
  font-size: var(--font-size-h6);
  font-weight: 300;
  line-height: 1.72vw;
  color: #1A1A1ABF;
  text-align: left;
  font-family: 'Geist', sans-serif;
  margin-top: 0.52vw;
  margin-bottom: 0;
}

.usluga-cards {
  display: flex;
  gap: 0.521vw;
  justify-content: center;
  align-items: stretch;
  width: 100%;
  overflow: hidden;
  margin-top: 2.6vw;
}

.usluga-card {
  flex: 1 1; /* НОВОЕ: 1 доля ширины. Намертво фиксирует ширину блока от дерганий */
  height: min(46.875vw, 70vh); /* Умная высота: не больше 70% от высоты экрана */
  /* max-height: 800px; Жесткий лимит высоты для гигантских мониторов */
  border-radius: 1.042vw;
  overflow: hidden;
  cursor: pointer;
  transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
  position: relative;
  background-color: #f5f5f5;
  border: 0.052vw solid rgba(25, 25, 25, 0.35);
}

.usluga-card.active {
  flex: 4.02 1; /* НОВОЕ: Активная карточка занимает в 4 раза больше места */
}

/* .usluga-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.12);
} */

/* .usluga-card.active:hover {
   box-shadow: 0 16px 40px rgba(38, 150, 110, 0.3); 
} */

.usluga-card-image-wrapper {
  width: 100%;
  height: 100%;
  position: relative;
  overflow: hidden;
  
}

.usluga-card-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
  /* border: 1px solid rgba(25, 25, 25, 0.35); */
}

.usluga-card:nth-child(2) .usluga-card-image {
  object-position: 65% center;
}

.usluga-card:nth-child(3) .usluga-card-image {
  object-position: 40% center;
}

.usluga-card:hover .usluga-card-image {
  transform: scale(1.1);
}

.usluga-card-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: transparent;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}

.usluga-card.active:first-child .usluga-card-overlay {
  display: flex; 
}


.usluga-card-label {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) rotate(-90deg);
  transform-origin: center center;

  /* Вызываем наш подключенный шрифт: */
  font-family: 'Geist-Static', sans-serif !important; 
  font-weight: 900 !important;
  
  font-size: 4.375vw !important; 
  line-height: 1.33 !important;  
  letter-spacing: 0 !important;  
  text-transform: uppercase !important;
  text-align: center;
  white-space: nowrap;

  /* Настройки цвета и тонкой обводки: */
  color: rgba(255, 255, 255, 0.6) !important;
  -webkit-text-stroke: 0.01vw #FFFFFF !important;

  filter: drop-shadow(0px 0px 0.52vw rgba(0, 0, 0, 0.15)) !important;
  pointer-events: none;
  transition: opacity 0.5s ease, transform 0.5s ease;
  opacity: 1; 
  visibility: visible;
  z-index: 2;
}

.usluga-card:nth-child(1) .usluga-card-label,
.usluga-card:nth-child(2) .usluga-card-label,
.usluga-card:nth-child(3) .usluga-card-label {
  font-size: 3.28vw !important; 
}

/* Слово "ПРОФИЛАКТИКА" длиннее, оно может наехать на кружок "04". Слегка уменьшаем. */
.usluga-card:nth-child(4) .usluga-card-label {
  font-size: 2.8vw !important; 
}

/* Корректировка ТОЛЬКО для самого длинного слова, чтобы оно влезло в карточку */
.usluga-card:nth-child(5) .usluga-card-label {
  font-size: 2.3vw !important; 
}

.usluga-card:nth-child(5) .usluga-card-main-title {
  font-size: 3.5vw; 
}

.usluga-card.active .usluga-card-label {
  opacity: 0;
  visibility: hidden;
  transform: translate(-50%, -50%) rotate(-90deg) scale(0.9); 
}

.usluga-card-number {
  position: absolute;
  bottom: 1.042vw;
  left: 50%;
  transform: translateX(-50%);
  width: 3.802vw;
  height: 3.802vw;
  background-color: #FFFFFF;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.938vw;
  font-weight: 500;
  color: #000000;
  font-family: 'Geist', sans-serif;
  z-index: 5;
  transition: opacity 0.4s ease;
  opacity: 1;
}

.usluga-card.active .usluga-card-number {
  opacity: 0;
  pointer-events: none;
}



.usluga-card-main-title {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  
  font-family: 'Geist', sans-serif;
  font-weight: 900;
  
  /* Визуально на макете этот текст больше 63px, ставлю ~90px (4.7vw) */
  font-size: 4.7vw; 
  letter-spacing: 0; /* Межбуквенного интервала тут визуально нет */
  
  color: #FFFFFF; /* Здесь СПЛОШНОЙ белый цвет без прозрачности */
  text-align: center;
  z-index: 5;
  
  /* ВАЖНО: Убедись, что тут НЕТ text-transform: uppercase, 
     так как на макете написано "Имплантация" */
  white-space: nowrap;

  opacity: 0;
  visibility: hidden;
  transition: opacity 0.5s ease 0.2s, transform 0.5s ease 0.2s;
}

.usluga-card.active .usluga-card-main-title {
  opacity: 1;
  visibility: visible;
  transform: translate(-50%, -50%) scale(1);
}

.usluga-card-buttons-wrapper {
  position: absolute;
  bottom: 1.042vw;
  left: 0;
  right: 0;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  padding: 0 1.042vw;
  z-index: 6;
  gap: 1.563vw;

  opacity: 0;
  visibility: hidden;
  transform: translateY(20px); /* Появление снизу вверх */
  transition: opacity 0.5s ease 0.3s, transform 0.5s ease 0.3s;
}

.usluga-card.active .usluga-card-buttons-wrapper {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.usluga-card-buttons-left {
  display: flex;
  flex-direction: column;
  gap: 0.521vw;
  flex: 1 1;
  min-width: 0; /* НОВОЕ: Обязательно для ограничения ширины */
}

.usluga-card:nth-child(2).active .usluga-card-buttons-left {
  max-width: 75%;
}

.usluga-card:nth-child(2).active .usluga-card-button-text {
  font-size: 0.7vw;
  padding: 0.4vw 0.6vw;
  
}

/* --- КАРТОЧКА 1: Имплантация --- */
.usluga-card:nth-child(1) .usluga-card-image {
  object-position: 50% 20%; /* X (по горизонтали) Y (по вертикали) для свернутого вида */
}
.usluga-card:nth-child(1).active .usluga-card-image {
  object-position: 50% 15%; /* Корректировка, когда карточка развернута */
}

/* --- КАРТОЧКА 2: Эстетика --- */
.usluga-card:nth-child(2) .usluga-card-image {
  object-position: 65% 25%;
}
.usluga-card:nth-child(2).active .usluga-card-image {
  object-position: 50% 30%; 
}

/* --- КАРТОЧКА 3: Лечение --- */
.usluga-card:nth-child(3) .usluga-card-image {
  object-position: 40% 20%;
}
.usluga-card:nth-child(3).active .usluga-card-image {
  object-position: 50% 25%;
}

/* --- КАРТОЧКА 4: Профилактика --- */
.usluga-card:nth-child(4) .usluga-card-image {
  object-position: 50% 10%;
}
.usluga-card:nth-child(4).active .usluga-card-image {
  object-position: 50% 15%;
}

/* --- КАРТОЧКА 5: Детская стоматология --- */
.usluga-card:nth-child(5) .usluga-card-image {
  object-position: 50% 15%;
}
.usluga-card:nth-child(5).active .usluga-card-image {
  object-position: 50% 20%;
}

/* УЗКИЕ КАРТОЧКИ (Сброс до базовых значений) */
.usluga-card:nth-child(1) .usluga-card-image { object-position: 50% 20%; } 
.usluga-card:nth-child(2) .usluga-card-image { object-position: 50% 20%; } 
.usluga-card:nth-child(3) .usluga-card-image { object-position: 50% 20%; } 
.usluga-card:nth-child(4) .usluga-card-image { object-position: 50% 20%; } 
.usluga-card:nth-child(5) .usluga-card-image { object-position: 50% 20%; }

.usluga-card-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  /* Добавили object-position в анимацию! */
  transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1), object-position 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.usluga-card:nth-child(2).active .usluga-card-buttons-left {
  gap: 0.3vw;
}

.usluga-card:nth-child(2).active .usluga-card-buttons-row {
  gap: 0.3vw;
}

.usluga-card:nth-child(4).active .usluga-card-buttons-wrapper {
  align-items: center;
}

.usluga-card:nth-child(4).active .usluga-card-button-text {
  font-size: 0.8vw;
  padding: 0.5vw 0.7vw;
  
}

.usluga-card:nth-child(4).active .usluga-card-buttons-left {
  gap: 0.4vw;
}

.usluga-card:nth-child(4).active .usluga-card-buttons-row {
  gap: 0.4vw;
}

.usluga-card-buttons-row {
  display: flex;
  flex-direction: row;
  gap: 0.521vw;
  width: 100%;
  min-width: 0; /* НОВОЕ: Защита от распирания строки */
}

.usluga-card-button-text {
  background-color: rgba(255, 255, 255, 0.7);
  backdrop-filter: blur(1.563vw);
  -webkit-backdrop-filter: blur(1.563vw);
  color: rgba(26, 26, 26, 0.75);
  padding: 0.625vw 1.25vw;
  border-radius: 0.521vw;
  font-size: 0.938vw;
  font-weight: 300;
  border: 0.052vw solid rgba(255, 255, 255, 1);
  cursor: pointer;
  font-family: 'Geist', sans-serif;
  flex: 1 1;
  text-align: center;
  white-space: nowrap;
  overflow: hidden;
  /* overflow: hidden; */
 text-overflow: ellipsis;
  transition: all 0.4s ease;
  min-width: 0;
}

.usluga-card:nth-child(2).active .usluga-card-button-text {
  padding: 0.625vw 0.833vw;
}

.usluga-card-button-text:hover {
  background-color: #FFFFFF;
  color: #000000;
  border-color: #FFFFFF;
  /* Добавляем мягкое свечение */
  box-shadow: 0 0.2vw 1.5vw rgba(255, 255, 255, 0.8);
  
}
.usluga-card-button-details {
  padding: 0.31vw 0.31vw 0.31vw 1.56vw;
  border-radius: 2.6vw;
  border: none;
  font-weight: 500;
  font-size: var(--font-size-body);
  line-height: 0.89vw;
  cursor: pointer;
  transition: all 0.3s ease;
  display: flex;
  align-items: center;
  gap: 1.56vw;
  font-family: 'Geist', sans-serif;
  position: relative;
  overflow: hidden;
  background: #FFFFFF;
  flex-shrink: 0;
  
  /* ДОБАВЬ ВОТ ЭТИ ДВЕ СТРОЧКИ ДЛЯ ФИКСА БЕЛОЙ ЛИНИИ: */
  transform: translateZ(0);
  -webkit-mask-image: -webkit-radial-gradient(white, black);
}

.usluga-card-button-details span {
  color: rgba(25, 25, 25, 1);
  position: relative;
  z-index: 3;
  transition: color 0.3s ease, transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.usluga-card-button-details:hover span {
  color: #FFFFFF;
  transform: translateX(3.65vw);
}

.usluga-card-button-icon {
  width: 3.13vw;
  height: 3.13vw;
  border-radius: 50%;
  background: rgba(17, 47, 85, 1);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
  z-index: 2;
}

.usluga-card-button-icon svg {
  width: 0.73vw;
  height: 0.63vw;
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.usluga-card-button-details:hover .usluga-card-button-icon svg {
  transform: translateX(-8.1vw) rotate(40deg);
}

.usluga-card-button-details::after {
  content: '';
  position: absolute;
  right: 0.31vw;
  top: 50%;
  transform: translateY(-50%);
  width: 3.13vw;
  height: 3.13vw;
  border-radius: 50%;
  background: rgba(17, 47, 85, 1);
  transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
  z-index: 0;
  pointer-events: none;
}

.usluga-card-button-details:hover::after {
  width: 41.67vw;
  height: 41.67vw;
  right: -20.83vw;
  top: 50%;
  transform: translateY(-50%);
}

/* Эффект блика для кнопки */
.usluga-card-button-details .flare {
  display: none;
}

/* --- УМЕНЬШЕННЫЙ МАСШТАБ ВЕРТИКАЛЬНОГО ТЕКСТА --- */

/* 1. "ИМПЛАНТАЦИЯ" (1 карточка) */
.usluga-container .usluga-card:nth-child(1) .usluga-card-label {
  font-size: 1.8vw !important; 
}

/* 2. "ЭСТЕТИКА" (2 карточка) */
.usluga-container .usluga-card:nth-child(2) .usluga-card-label {
  font-size: 2.4vw !important; 
}

/* 3. "ЛЕЧЕНИЕ" (3 карточка) */
.usluga-container .usluga-card:nth-child(3) .usluga-card-label {
  font-size: 2.4vw !important; 
}

/* 4. "ПРОФИЛАКТИКА" (4 карточка) */
.usluga-container .usluga-card:nth-child(4) .usluga-card-label {
  font-size: 2vw !important; 
}

/* 5. "ДЕТСКАЯ СТОМАТОЛОГИЯ" (5 карточка) — самое длинное слово */
.usluga-container .usluga-card:nth-child(5) .usluga-card-label {
  font-size: 1.5vw !important; 
}

@keyframes flareAnimation {
  0% {
    left: -170%;
  }
  50% {
    left: 170%;
  }
  100% {
    left: 170%;
  }
}

@media (max-width: 2200px) {
  .usluga-container {
    padding: 2.5vw 2.6vw 4vw 2.6vw;
  }
}

@media (max-width: 780px) {
  .usluga-container {
    padding: 0 2.6vw 12.821vw 2.6vw;
  }

  .usluga-title {
    width: 100%;
    font-size: 5.77vw;
    font-weight: 700;
    line-height: 8.33vw;
    margin-bottom: 0;
  }

  .usluga-title span {
    text-decoration-thickness: 0.26vw;
    text-underline-offset: 0.64vw;
  }

  .usluga-description {
    width: 100%;
    font-size: 3.333vw;
    font-weight: 300;
    line-height: 4.73vw;
    margin-top: 0;
    padding-top: 1.282vw;
    margin-bottom: 6.41vw;
  }

  .usluga-cards {
    flex-direction: column;
  }

 .usluga-card {
    width: 100%;
    height: 22.051vw;
    max-height: none; /* Отключаем десктопный лимит */
    border-radius: 2.564vw;
    flex: none !important; /* ВАЖНО: Отключаем флекс-пропорции на мобилках */
  }

  .usluga-card.active {
    width: 100%;
    height: 109.615vw;
    max-height: none; /* Отключаем десктопный лимит */
    border-radius: 2.564vw;
    flex: none !important; /* ВАЖНО: Отключаем флекс-пропорции на мобилках */
  }

  .usluga-card-label {
    top: 50%;
    left: 2%;
    transform: translateY(-50%) rotate(-0deg);
    transform-origin: center center;
  }

  .usluga-card:nth-child(1) .usluga-card-label,
  .usluga-card:nth-child(2) .usluga-card-label,
  .usluga-card:nth-child(3) .usluga-card-label,
  .usluga-card:nth-child(4) .usluga-card-label {
    font-size: 7.692vw;
  }

  .usluga-card:nth-child(5) .usluga-card-label {
    font-size: 5.0vw;
  }

  .usluga-card-number {
    bottom: auto;
    top: 50%;
    right: 2.564vw;
    left: auto;
    transform: translateY(-50%);
    width: 9.359vw;
    height: 9.359vw;
    font-size: 2.308vw;
  }

  .usluga-card-main-title {
    font-size: 10.897vw;
  }

  .usluga-card:nth-child(5) .usluga-card-main-title {
    font-size: 7.092vw;
  }

  .usluga-card-button-text {
    font-size: 2.308vw;
    padding: 1.282vw 1.25vw;
    border-radius: 1.282vw;
    transition: all 0.5s ease;
  }

  .usluga-card-buttons-row {
    gap: 1.282vw;
  }

  .usluga-card-button-details {
    font-size: 2.564vw;
    border-radius: 19.231vw;
    padding-left: 4.359vw;
    gap: 4.359vw;
  }

  .usluga-card-button-details::after {
    right: 0.77vw;
    width: 8.718vw;
    height: 8.718vw;
    border-radius: 19.231vw;
  }

  .usluga-card-button-details:hover::after {
    width: 120vw;
    height: 120vw;
    right: -60vw;
  }

  .usluga-card-button-icon {
    width: 8.718vw;
    height: 8.718vw;
  }

  .usluga-card-button-icon svg {
    width: 2.051vw;
    height: 1.667vw;
  }

  .usluga-card-button-details:hover span {
    transform: translateX(8.974vw);
  }

  .usluga-card-button-details:hover .usluga-card-button-icon svg {
    transform: translateX(-21.821vw) rotate(40deg);
  }

  .usluga-card.active .usluga-card-buttons-left {
    gap: 1.282vw;
  }

  .usluga-card.active .usluga-card-buttons-row {
    gap: 1.282vw;
  }

  .usluga-card.active .usluga-card-button-text {
    font-size: 2.308vw;
    padding: 1.282vw 1.25vw;
  }

  .usluga-card:nth-child(2).active .usluga-card-buttons-left,
  .usluga-card:nth-child(4).active .usluga-card-buttons-left {
    max-width: 100%;
    gap: 1.282vw;
  }

  .usluga-card:nth-child(2).active .usluga-card-button-text {
    font-size: 1.795vw;
    padding: 1.282vw 1.25vw;
    border-radius: 1.282vw;
  }

  .usluga-card:nth-child(4).active .usluga-card-button-text {
    font-size: 2.308vw;
    padding: 1.282vw 1.25vw;
    border-radius: 1.282vw;
  }

  .usluga-card:nth-child(2).active .usluga-card-buttons-row,
  .usluga-card:nth-child(4).active .usluga-card-buttons-row {
    gap: 1.282vw;
  }
}

@media (min-width: 2200px) {
  .usluga-card {
    max-width: 10vw;
    width: min(11.458vw, 9.091vw);
    max-height: 43.636vw;
    height: min(46.875vw, 43.636vw);
  }
  
  .usluga-card.active {
    max-width: 40.909vw;
    width: min(46.875vw, 40.909vw);
  }
  
  .usluga-card-label {
    font-size: calc(3.281vw + (100vw - 2200px) / 30 * 0.03281);
  }
  
  .usluga-card:nth-child(1) .usluga-card-label,
  .usluga-card:nth-child(2) .usluga-card-label,
  .usluga-card:nth-child(3) .usluga-card-label,
  .usluga-card:nth-child(4) .usluga-card-label {
    font-size: calc(3.281vw + (100vw - 2200px) / 30 * 0.03281);
  }
  
  .usluga-card:nth-child(5) .usluga-card-label {
    font-size: calc(2.448vw + (100vw - 2200px) / 30 * 0.02448);
  }
  
  .usluga-card:nth-child(5) .usluga-card-main-title {
    font-size: calc(2.8vw + (100vw - 2200px) / 30 * 0.028);
  }
  
  .usluga-card:nth-child(2).active .usluga-card-button-text {
    font-size: calc(0.7vw + (100vw - 2200px) / 30 * 0.007);
    padding: calc(0.4vw + (100vw - 2200px) / 30 * 0.004) calc(0.6vw + (100vw - 2200px) / 30 * 0.006);
  }
  
  .usluga-card:nth-child(2).active .usluga-card-buttons-left {
    gap: calc(0.3vw + (100vw - 2200px) / 30 * 0.003);
  }
  
  .usluga-card:nth-child(2).active .usluga-card-buttons-row {
    gap: calc(0.3vw + (100vw - 2200px) / 30 * 0.003);
  }
  
  .usluga-card:nth-child(4).active .usluga-card-button-text {
    font-size: calc(0.8vw + (100vw - 2200px) / 30 * 0.008);
    padding: calc(0.5vw + (100vw - 2200px) / 30 * 0.005) calc(0.7vw + (100vw - 2200px) / 30 * 0.007);
  }
  
  .usluga-card:nth-child(4).active .usluga-card-buttons-left {
    gap: calc(0.4vw + (100vw - 2200px) / 30 * 0.004);
  }
  
  .usluga-card:nth-child(4).active .usluga-card-buttons-row {
    gap: calc(0.4vw + (100vw - 2200px) / 30 * 0.004);
  }
  
  .usluga-card-number {
    bottom: calc(1.042vw + (100vw - 2200px) / 30 * 0.01042);
    width: calc(3.802vw + (100vw - 2200px) / 30 * 0.03802);
    height: calc(3.802vw + (100vw - 2200px) / 30 * 0.03802);
    font-size: calc(0.938vw + (100vw - 2200px) / 30 * 0.00938);
  }
  
  .usluga-card-main-title {
    font-size: calc(4.427vw + (100vw - 2200px) / 30 * 0.04427);
  }
  
  .usluga-card-buttons-wrapper {
    bottom: calc(1.042vw + (100vw - 2200px) / 30 * 0.01042);
    padding: 0 calc(1.042vw + (100vw - 2200px) / 30 * 0.01042);
    gap: calc(1.563vw + (100vw - 2200px) / 30 * 0.01563);
  }
  
  .usluga-card-buttons-left {
    gap: calc(0.521vw + (100vw - 2200px) / 30 * 0.00521);
  }
  
  .usluga-card-buttons-row {
    gap: calc(0.521vw + (100vw - 2200px) / 30 * 0.00521);
  }
  
  .usluga-card-button-text {
    padding: calc(0.625vw + (100vw - 2200px) / 30 * 0.00625) calc(1.25vw + (100vw - 2200px) / 30 * 0.0125);
    border-radius: calc(0.521vw + (100vw - 2200px) / 30 * 0.00521);
    font-size: calc(0.938vw + (100vw - 2200px) / 30 * 0.00938);
    border-width: calc(0.052vw + (100vw - 2200px) / 30 * 0.00052);
  }
  
  .usluga-card:nth-child(2).active .usluga-card-button-text {
    padding: calc(0.625vw + (100vw - 2200px) / 30 * 0.00625) calc(0.833vw + (100vw - 2200px) / 30 * 0.00833);
  }
  
 
  
  .usluga-card-button-details {
    padding: calc(0.31vw + (100vw - 2200px) / 30 * 0.0031) calc(0.31vw + (100vw - 2200px) / 30 * 0.0031) calc(0.31vw + (100vw - 2200px) / 30 * 0.0031) calc(1.56vw + (100vw - 2200px) / 30 * 0.0156);
    border-radius: calc(2.6vw + (100vw - 2200px) / 30 * 0.026);
    line-height: calc(0.89vw + (100vw - 2200px) / 30 * 0.0089);
    gap: calc(1.56vw + (100vw - 2200px) / 30 * 0.0156);
  }
  
  .usluga-card-button-details:hover span {
    transform: translateX(calc(3.65vw + (100vw - 2200px) / 30 * 0.0365));
  }
  
  .usluga-card-button-icon {
    width: calc(3.13vw + (100vw - 2200px) / 30 * 0.0313);
    height: calc(3.13vw + (100vw - 2200px) / 30 * 0.0313);
  }
  
  .usluga-card-button-icon svg {
    width: calc(0.73vw + (100vw - 2200px) / 30 * 0.0073);
    height: calc(0.63vw + (100vw - 2200px) / 30 * 0.0063);
  }
  
  .usluga-card-button-details::after {
    right: calc(0.31vw + (100vw - 2200px) / 30 * 0.0031);
    width: calc(3.13vw + (100vw - 2200px) / 30 * 0.0313);
    height: calc(3.13vw + (100vw - 2200px) / 30 * 0.0313);
  }
  
  .usluga-card-button-details:hover::after {
    width: calc(41.67vw + (100vw - 2200px) / 30 * 0.4167);
    height: calc(41.67vw + (100vw - 2200px) / 30 * 0.4167);
    right: calc(-20.83vw - (100vw - 2200px) / 30 * 0.2083);
  }
  
  .usluga-card-button-details:hover .usluga-card-button-icon svg {
    transform: translateX(calc(-8.1vw - (100vw - 2200px) / 30 * 0.081)) rotate(40deg);
  }
}

.skils-container {
  width: 100%;
  /* 5.2vw = 100px, 2.6vw = 50px */
  padding: 5.2vw 2.6vw !important; 
  background-color: white;
  box-sizing: border-box;
}

.skils-content {
  /* max-width: 1920px; */
  margin: 0 auto;
  width: 100%;
  /* padding: 0 50px; */
  box-sizing: border-box;
}

.skils-top-header {
  display: grid;
  grid-template-columns: 50% 50%;
  grid-gap: 3.125vw;
  gap: 3.125vw;
  align-items: flex-start;
  /* 2.6vw = ровно 50px отступа вниз */
  margin-bottom: 2.6vw !important; 
}

.skils-top-left {
  display: flex;
  flex-direction: column;
}

.skils-top-right {
  display: flex;
  flex-direction: column;
  padding-top: 1.04vw;
  padding-right: 1.4vw; /* Добавили ровно 27px от правого края */
}

.skils-header {
  display: flex !important;
  justify-content: space-between !important;
  align-items: stretch;
  gap: 2.6vw;
}

.skils-left {
  flex: 1 1; /* Левая колонка с текстом займет всё оставшееся место */
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
}

.skils-title {
  /* width: 38.02vw; */
  font-size: var(--font-size-h1);
  font-weight: 700;
  color: #000000;
  line-height: 3.425vw;
  margin: 0;
  text-align: left;
  text-transform: uppercase;
}

.skils-title-highlight {
  color: #485B85;
  text-decoration: underline;
  text-decoration-thickness: 0.16vw;
  text-underline-offset: 0.41vw;
}

.skils-title span {
  color: #485B85;
  text-decoration: underline;
  text-decoration-thickness: 0.16vw;
  text-underline-offset: 0.21vw;
}

.skils-subtitle {
  font-family: 'Geist', sans-serif !important;
  font-weight: 300 !important; /* Light */
  font-size: 1.146vw !important; /* 22px */
  line-height: 1.719vw !important; /* 33px */
  letter-spacing: 0 !important;
  color: #1A1A1ABF !important;
  margin: 0;
  text-align: left;
}

.skils-fears-list {
  display: flex;
  flex-direction: column;
  margin-top: 1.56vw; /* Добавили 30px. В сумме с 50px от заголовка получается ровно 80px */
  gap: 1.56vw;
  flex: 1 1;
}

.skils-fear-item {
  display: flex;
  gap: 2.6vw;
  align-items: flex-start;
}

.skils-fear-icon-wrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
  flex-shrink: 0;
}

.skils-fear-icon {
  width: 3.8vw;
  height: 3.8vw;
  border-radius: 0.8vw;
  background: rgba(17, 47, 85, 1);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.skils-fear-icon svg {
  width: 1.46vw;
  height: 1.46vw;
  object-fit: contain;
}

.skils-fear-connector {
  width: 1.5px;
  height: 3.49vw;
  margin-top: 0.52vw;
  background-image: radial-gradient(circle, #2E3D58 0.75px, transparent 0.75px);
  background-size: 1.5px 4.5px;
  background-repeat: repeat-y;
  background-position: center;
}

.skils-fear-content {
  flex: 1 1;
  padding-top: 0.21vw;
}

.skils-fear-title {
  font-size: var(--font-size-h6);
  font-weight: 500;
  color: rgba(25, 25, 25, 1);
  margin: 0 0 0.52vw 0;
  line-height: 1.3;
  text-align: left;
}

.skils-fear-description {
  /* width: 37.24vw; */
  font-size: var(--font-size-h8);
  font-weight: 300;
  color: #1A1A1ABF;
  margin: 0;
  line-height: 1.72vw;
  text-align: left;
}

.skils-right {
  width: 52.08vw !important; /* 1000px */
  height: 45.52vw !important; /* 874px */
  flex-shrink: 0;
  position: relative;
  
  /* Уменьшили отрицательный отступ, чтобы картинка опустилась ниже. 
     Если нужно еще ниже — ставь -1vw или 0. Если чуть выше — -2vw */
  margin-top: -1.5vw !important; 
  
  /* Прижатие к правому краю оставляем, оно работает верно */
  margin-right: -2.6vw !important; 
}

/* 3. Настройки контейнера картинки (радиус 30px, паддинг 20px, gap 10px) */
.skils-image-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  border-radius: 1.56vw !important; /* 30px */
  padding: 1.04vw !important; /* 20px */
  box-sizing: border-box;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  gap: 0.52vw !important; /* 10px */
  /* background-color: #F8F8F8; <-- Раскомментируй, если под паддингом нужен фоновый цвет */
}

.skils-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: 1.04vw !important; /* Слегка скругляем саму картинку внутри паддинга */
}

.skils-info-card {
  width: 34.65vw;
  position: absolute;
  
  /* Отступы слева и снизу по 20px (1.04vw) */
  bottom: 2.08vw !important; /* С учетом паддинга родителя делаем отступ чуть больше, чтобы визуально было ровно */
  left: 2.08vw !important; 
  transform: none !important; /* Обязательно убираем старое центрирование translateX(-50%) */
  
  background: rgba(255, 255, 255, 0.5);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-radius: 1.04vw;
  border: 1px solid rgba(255, 255, 255, 0.5);
  border-top: 2px solid rgba(255, 255, 255, 1);
  padding: 0.26vw;
  display: flex;
  flex-direction: column;
  gap: 0.42vw;
  z-index: 10;
}

.skils-info-card-inner {
  background: #FFFFFF;
  padding: 0.52vw 0.52vw 0.52vw 1vw;
  gap: 1.56vw;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-radius: 0.8vw;
}

.skils-info-card-content {
  flex: 1 1;
  display: flex;
  flex-direction: column;
  gap: 0;
}

.skils-info-card-text {
  font-size: var(--font-size-h5);
  font-weight: 700;
  color: rgba(25, 25, 25, 1);
  margin: 0 0 0.52vw 0;
  line-height: 1.4;
  text-align: left;
}

.skils-info-card-subtext {
  font-size: var(--font-size-body-medium);
  font-weight: 300;
  color: #1A1A1ABF;
  margin: 0;
  line-height: 1.4;
  text-align: left;
}

.skils-info-card-icon {
  width: 4.69vw;
  height: 4.69vw;
  border-radius: 0.8vw;
  background: rgba(17, 47, 85, 1);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  cursor: pointer;
}

.skils-info-card-icon svg {
  width: 2.5vw;
  height: 2.5vw;
}

.skils-tip {
  display: flex;
  gap: 0.8vw;
  align-items: flex-start;
  padding: 1.04vw 0vw 1.04vw 1.04vw;
  border-radius: 1.04vw;
}

.skils-tip-icon {
  flex-shrink: 0;
  width: 1.6vw;
  height: 1.6vw;
  display: flex;
  align-items: center;
  justify-content: center;
}

.skils-tip-icon svg {
  width: 100% !important;
  height: 100% !important;
}

.skils-tip-icon svg .skils-exclamation-mark {
  transform: scale(0.5);
  transform-origin: center;
}

.skils-tip-text {
  width: 100%;
  font-size: var(--font-size-h8);
  font-weight: 300;
  color: rgba(26, 26, 26, 0.75);
  margin: 0;
  line-height: 1.46vw;
  text-align: left;
  font-family: 'Geist', sans-serif;
}



@media (max-width: 780px) {
  .skils-container {
    padding: 3.846vw 2.6vw 8.333vw 2.6vw;
  }

  .skils-fear-icon {
    width: 8.3vw;
    height: 8.3vw;
    border-radius: 1.5vw;
  }

  .skils-fear-icon svg {
    width: 3.1vw;
    height: 3.1vw;
  }

  .skils-fear-connector {
    width: 2px;
    height: 8.846vw;
    margin-top: 1.4vw;
  }

  .skils-tip {
    padding: 6.41vw 0vw 2.5vw 0vw; /* Уменьшили нижний отступ (было 10.256vw) */
    gap: 2vw;
  }

  .skils-tip-icon {
    width: 3.8vw;
    height: 3.8vw;
  }

  .skils-tip-text {
    font-size: 3.333vw;
    line-height: 4.2vw;
  }

  .skils-fear-item {
    gap: 5vw;
  }

  .skils-fear-title {
    font-size: 4.487vw;
    font-weight: 700;
    margin-bottom: 1.3vw;
  }

  .skils-fears-list {
    gap: 3.846vw;
  }

  .skils-title {
    width: 100%;
    font-size: 5.77vw;
    font-weight: 700;
    line-height: 8.33vw;
  }

  .skils-title span,
  .skils-title-highlight {
    text-decoration-thickness: 0.26vw;
    text-underline-offset: 0.64vw;
  }

  .skils-subtitle {
    width: 100%;
    font-size: 3.333vw;
    font-weight: 300;
    line-height: 4.73vw;
    margin-top: 0;
  }

  .skils-fear-description {
    font-size: 3.333vw;
    line-height: 4.2vw;
  }

  .skils-top-header {
    display: flex;
    flex-direction: column;
    gap: 2.56vw;
    margin-bottom: 0;
  }

  .skils-top-left {
    width: 100%;
  }

  .skils-top-right {
    width: 100%;
    padding-top: 0;
  }

  .skils-header {
    display: flex;
    flex-direction: column;
    gap: 2.6vw;
  }

  .skils-left {
    width: 100%;
    order: 1;
  }

  .skils-right {
    width: 100%;
    order: 2;
    height: 128.21vw;
  }

  .skils-image-wrapper {
    height: 128.21vw;
    width: 100%;
    border-radius: 2.564vw;
  }

  .skils-image {
    border-radius: 2.564vw;
  }

  .skils-info-card {
    width: 84.615vw;
    padding: 0.641vw;
    border-radius: 2.564vw;
    left: 50%;
    transform: translateX(-50%);
    bottom: 1.8vw;
  }

  .skils-info-card-inner {
    padding: 1.026vw 2.564vw;
    gap: 3.846vw;
    border-radius: 1.923vw;
  }

  .skils-info-card-text {
    font-size: 3.462vw;
  }

  .skils-info-card-icon {
    width: 11.538vw;
    height: 11.538vw;
    border-radius: 1.923vw;
  }

  .skils-info-card-icon svg {
    width: 5.128vw;
    height: 5.128vw;
  }
}
.treatment-warning-container {
    width: 100%;
    /* Сверху 0, справа 2.6vw (50px), снизу 2.6vw (как было), слева 2.6vw (50px) */
    padding: 0 2.6vw 2.6vw 2.6vw; 
    background-color: #FFFFFF;
    box-sizing: border-box;
}

.treatment-warning-content {
    margin: 0 auto;
    width: 100%;
}

.treatment-warning-title {
    font-size: var(--font-size-h1);
    font-weight: 700;
    color: #000000;
    line-height: 3.4vw;
    margin: 0 0 1.56vw 0;
    text-align: left;
    text-transform: uppercase;
    font-family: 'Geist', sans-serif;
}

.treatment-warning-title-highlight {
    color: #485B85;
    text-decoration: underline;
    text-decoration-thickness: 0.16vw;
    text-underline-offset: 0.26vw;
}

.treatment-warning-intro {
    font-size: var(--font-size-h6);
    font-weight: 300;
    color: #1A1A1ABF;
    line-height: 2.08vw;
    margin: 0;
    text-align: left;
    font-family: 'Geist', sans-serif;
}

.treatment-warning-intro-highlight {
    text-decoration: underline;
    text-decoration-thickness: 0.052vw;
    text-underline-offset: 0.16vw;
    font-weight: 500;
}

.treatment-warning-main {
    display: grid;
    grid-template-columns: 1fr 1fr; /* Было 50% 50%. Теперь колонки не будут ломать ширину экрана */
    grid-gap: 3.125vw;
    gap: 3.125vw;
    align-items: stretch;
}

.treatment-warning-left {
    display: flex;
    flex-direction: column;
    gap: 1.56vw;
}

.treatment-warning-title {
    margin-bottom: 0;
}

.treatment-warning-intro {
    margin-bottom: 0;
}

.treatment-warning-carousel-wrapper {
    display: flex;
    align-items: center;
    gap: 1.56vw;
}

.treatment-warning-carousel {
    position: relative;
    width: 100%;
    height: 20.83vw;
    overflow: hidden;
    border-radius: 1.56vw;
}

.treatment-warning-carousel-slides {
    display: flex;
    height: 100%;
}

.treatment-warning-carousel-slide {
    width: 100%;
    min-width: 100%;
    height: 100%;
    flex-shrink: 0;
}

.treatment-warning-carousel-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.treatment-warning-carousel-dots-wrapper {
    position: relative;
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
    padding: 0.21vw 0;
}

.treatment-warning-carousel-dots {
    display: flex;
    flex-direction: column;
    gap: 0.26vw;
    position: relative;
    z-index: 2;
}

.treatment-warning-carousel-dot {
    width: 0.26vw;
    height: 0.26vw;
    border-radius: 50%;
    border: none;
    background: rgba(0, 0, 0, 0.3);
    cursor: pointer;
    transition: all 0.3s ease;
    padding: 0;
    position: relative;
    z-index: 2;
}

.treatment-warning-carousel-dot.active {
    background: #000000;
    height: 0.52vw;
}

.treatment-warning-carousel-line {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: 0.42vw;
    background: linear-gradient(180deg, #485B85 0%, rgba(72, 91, 133, 0.8) 100%);
    border-radius: 0.1vw;
    z-index: 0;
    pointer-events: none;
    box-shadow: 0 0 0.21vw rgba(72, 91, 133, 0.3);
    opacity: 0;
}

.treatment-warning-carousel-line-animating {
    animation: slideLine 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

@keyframes slideLine {
    0% {
        top: 0.52vw;
        top: var(--prev-top, 0.52vw);
        opacity: 1;
    }
    100% {
        top: 0.52vw;
        top: var(--current-top, 0.52vw);
        opacity: 1;
    }
}

.treatment-warning-right {
    display: flex;
    flex-direction: column;
    gap: 2.08vw;
    padding-right: 0vw; /* Убрали отступ, чтобы дать тексту больше ширины */
    height: 100%;
}

.treatment-warning-reasons-list {
    display: flex;
    flex-direction: column;
    gap: 2.08vw;
}

.treatment-warning-reason-item {
    display: flex;
    gap: 2.46vw;
    align-items: flex-start;
}

.treatment-warning-reason-number-wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
    flex-shrink: 0;
    gap: 1.04vw;
}

.treatment-warning-reason-number {
    width: 3.8vw;
    height: 3.8vw;
    border-radius: 0.8vw;
    background: rgba(17, 47, 85, 1);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--font-size-h6);
    font-weight: 700;
    color: #FFFFFF;
    font-family: 'Geist', sans-serif;
    flex-shrink: 0;
}

.treatment-warning-reason-connector {
    width: 0.078vw;
    height: 3.36vw;
    /* margin-top: 10px; */
    background-image: radial-gradient(circle, #2E3D58 0.75px, transparent 0.75px);
    background-size: 1.5px 4.5px;
    background-repeat: repeat-y;
    background-position: center;
}

.treatment-warning-reason-content {
    flex: 1 1;
    padding-top: 0.52vw;
}

.treatment-warning-reason-title {
    font-size: var(--font-size-h6);
    font-weight: 500;
    color: rgba(25, 25, 25, 1);
    margin: 0 0 0.52vw 0;
    line-height: 1.72vw;
    text-align: left;
    font-family: 'Geist', sans-serif;
    /* text-decoration: underline; */
    text-decoration-thickness: 0.052vw;
    text-underline-offset: 0.16vw;
}

.treatment-warning-reason-description {
    font-size: var(--font-size-h8);
    font-weight: 300;
    color: #1A1A1ABF;
    margin: 0;
    line-height: 1.72vw;
    text-align: left;
    font-family: 'Geist', sans-serif;
    width: 37.65vw;
}

.treatment-warning-reason-description strong {
    font-weight: 700;
    color: rgba(26, 26, 26, 0.75);
    text-decoration: underline;
    text-decoration-thickness: 0.06vw;
    text-underline-offset: 0.10vw;
}

.treatment-warning-tip {
    display: flex;
    gap: 0.8vw;
    align-items: flex-start;
    padding: 1.04vw 0 0 0; /* Убрали отступы по бокам, оставили только сверху */
    border-radius: 1.04vw;
    margin-top: auto;
}



.treatment-warning-tip-icon {
    flex-shrink: 0;
    width: 1.6vw;
    height: 1.6vw;
    display: flex;
    align-items: center;
    justify-content: center;
}

.treatment-warning-tip-icon svg {
    width: 100%;
    height: 100%;
}

.treatment-warning-tip-icon svg .treatment-warning-exclamation-mark {
    transform: scale(0.5);
    transform-origin: center;
}

.treatment-warning-tip-icon svg path {
    stroke-width: 0.1vw;
}

.treatment-warning-tip-text {
    width: 100%; 
    font-size: 1.05vw; /* Чуть уменьшили шрифт (примерно 20px вместо 22px) */
    font-weight: 300;
    color: #1A1A1ABF;
    margin: 0;
    line-height: 1.4; /* Слегка уплотнили строки */
    text-align: left;
    font-family: 'Geist', sans-serif;
    letter-spacing: -0.01vw; /* Минимальное сужение межбуквенного интервала */
}

.treatment-warning-tip-text strong {
    font-weight: 300;
    color: rgba(26, 26, 26, 0.75);
}

@media (max-width: 2200px) {

.treatment-warning-container {
    padding: 4.2vw 2.6vw 2.6vw 2.6vw;
}

}

@media (max-width: 780px) {
  .treatment-warning-container {
    padding: 4.2vw 2.6vw 8.974vw 2.6vw;
  }

  .treatment-warning-main {
    display: flex;
    flex-direction: column;
  }

  .treatment-warning-title {
    width: 100%;
    font-size: 5.77vw;
    font-weight: 700;
    line-height: 8.33vw;
    margin-bottom: 0;
  }

  .treatment-warning-title-highlight {
    text-decoration-thickness: 0.26vw;
    text-underline-offset: 0.64vw;
  }

  .treatment-warning-left {
    gap: 0;
  }

  .treatment-warning-intro {
    width: 100%;
    font-size: 3.333vw;
    font-weight: 300;
    line-height: 4.73vw;
    margin-top: 0;
    padding-top: 2.564vw;
    margin-bottom: 6.41vw;
  }

  .treatment-warning-carousel {
    height: 40.385vw;
  }

  .treatment-warning-carousel-wrapper {
    flex-direction: column;
    gap: 2.564vw;
  }

  .treatment-warning-carousel-dots-wrapper {
    position: relative;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 0;
    width: 100%;
    order: 2;
  }

  .treatment-warning-carousel-dots {
    display: flex;
    flex-direction: row;
    gap: 0.64vw;
    position: relative;
    z-index: 2;
  }

  .treatment-warning-carousel-dot {
    width: 0.77vw;
    height: 0.77vw;
    border-radius: 50%;
  }

  .treatment-warning-carousel-dot.active {
    width: 2.05vw;
    height: 0.77vw;
    border-radius: 12.82vw;
    background: #000000;
  }

  .treatment-warning-main {
    gap: 6.41vw;
  }

  .treatment-warning-reason-number {
    width: 9.359vw;
    height: 9.359vw;
    font-size: 3.205vw;
    border-radius: 1.923vw;
  }

  .treatment-warning-reason-number-wrapper {
    gap: 3.846vw;
  }

  .treatment-warning-reason-connector {
    height: 8.205vw;
    background-image: radial-gradient(circle, #2E3D58 0.096vw, transparent 0.096vw);
    background-size: 0.192vw 0.577vw;
  }

  .treatment-warning-reason-item {
    gap: 3.846vw;
  }

  .treatment-warning-reason-title {
    font-size: 4.487vw;
    font-weight: 700;
    margin-bottom: 1.282vw;
    line-height: 6.41vw;
  }

  .treatment-warning-reason-description {
    width: 100%;
    font-size: 3.333vw;
    font-weight: 300;
    line-height: 5.128vw;
  }

  .treatment-warning-right {
    gap: 6.41vw;
  }

  .treatment-warning-tip {
    padding: 0;
    gap: 1.923vw;
  }

  .treatment-warning-tip-icon {
    width: 3.846vw;
    height: 3.846vw;
  }

  .treatment-warning-tip-icon svg {
    width: 120%;
    height: 120%;
  }

  .treatment-warning-tip-text {
    width: 100%;
    font-size: 3.333vw;
    line-height: 5.128vw;
    font-weight: 300;
  }
}

.reviews {
  width: 100%;
  background: #FFFFFF;
  padding: 1.04vw 0 4.17vw 0;
}

.reviews-container {
  width: 100%;
  max-width: 100vw;
  margin: 0 auto;
  padding: 0 10%;
}

.reviews-header {
  margin-bottom: 2.6vw;
  display: grid;
  grid-template-columns: 1fr auto;
  grid-gap: 7.81vw;
  gap: 7.81vw;
  align-items: flex-start;
}

.reviews-header-left {
  display: flex;
  flex-direction: column;
  gap: 0.5vw;
}

.reviews-title {
  font-size: var(--font-size-h1);
  font-weight: 700;
  line-height: 3.13vw;
  color: #000000;
  text-align: left;
  margin: 0;
  font-family: 'Geist', sans-serif;
  text-transform: uppercase;
}

.reviews-title-highlight {
  color: #485B85;
  text-decoration: underline;
  text-decoration-thickness: 0.16vw;
  text-underline-offset: 0.26vw;
}

.reviews-description {
  width: 49.17vw;
  font-size: var(--font-size-h8);
  font-weight: 300;
  line-height: 1.72vw;
  color: rgba(26, 26, 26, 0.75);
  text-align: left;
  margin: 0;
  font-family: 'Geist', sans-serif;
}

.reviews-header-stats {
  display: flex;
  gap: 0;
  border-radius: 0.5vw;
  overflow: hidden;
  border: 0.052vw solid rgba(215, 215, 215, 1);
}

.reviews-stat-item {
  background: #FFFFFF;
  padding: 0.68vw 0.26vw;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  /* gap: 0.52vw; */
  border-right: 0.052vw solid rgba(46, 61, 88, 0.1);
}

.reviews-stat-item:last-child {
  border-right: none;
}

.reviews-stat-item-active {
  background: #485B85;
}

.reviews-stat-value {
  width: 8vw;
  font-size: 1.72vw;
  font-weight: 700;
  line-height: 1;
  color: #485B85;
  font-family: 'Geist', sans-serif;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.reviews-stat-item-active .reviews-stat-value {
  color: #FFFFFF;
}

.reviews-stat-item:first-child .reviews-stat-value,
.reviews-stat-item:last-child .reviews-stat-value {
  color: rgba(17, 47, 85, 1);
}

.reviews-stat-label {
  font-size: 0.73vw;
  font-weight: 300;
  color: rgba(26, 26, 26, 0.75);
  text-align: center;
  font-family: 'Geist', sans-serif;
}

.reviews-stat-item-active .reviews-stat-label {
  color: rgba(255, 255, 255, 0.9);
}

.reviews-carousel-wrapper {
  position: relative;
  margin-bottom: 3.13vw;
  overflow-x: hidden;
  overflow-y: visible;
}

.reviews-carousel-dots-wrapper-bottom {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 1.56vw;
  padding: 0.21vw 0;
}

.reviews-carousel-dots-bottom {
  display: flex;
  flex-direction: row;
  gap: 0.26vw;
  position: relative;
  z-index: 2;
}

.reviews-carousel-dot-bottom {
  width: 0.26vw;
  height: 0.26vw;
  border-radius: 50%;
  border: none;
  background: rgba(0, 0, 0, 0.3);
  cursor: pointer;
  transition: all 0.3s ease;
  padding: 0;
  position: relative;
  z-index: 2;
}

.reviews-carousel-dot-bottom.active {
  background: #000000;
  width: 0.5vw;
  height: 0.26vw;
  border-radius: 0.13vw;
}

.reviews-carousel {
  width: 100%;
  overflow-x: hidden;
  overflow-y: visible;
  position: relative;
  /* padding: 1.04vw 0; */
}

.reviews-carousel-slides {
  display: flex;
  width: 100%;
  align-items: stretch;
  scrollbar-width: none; /* Скрывает скролл в Firefox */
  -ms-overflow-style: none; /* Скрывает скролл в IE и Edge */
}

/* Скрывает скролл в Chrome, Safari и Opera */
.reviews-carousel-slides::-webkit-scrollbar {
  display: none;
}

.reviews-carousel-slide {
  width: calc(100% / 3);
  min-width: calc(100% / 3);
  flex-shrink: 0;
  display: flex;
  overflow: visible;
  padding: 0.5vw 0.63vw;
  box-sizing: border-box;
}

.otzov-card {
  background: white;
  border-radius: 1.04vw; /* Радиус 20px */
  padding: 1.56vw; /* Отступы 30px */
  box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.1); /* Тень 30px */
  display: flex;
  flex-direction: column;
  gap: 1.04vw; /* Gap 20px */
  height: 23.44vw !important; /* Высота 450px */
  position: relative;
  width: 100%;
  box-sizing: border-box;
  user-select: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
}

.otzov-card-header {
  display: flex;
  flex-direction: column;
}

.otzov-user-info {
  display: flex;
  align-items: flex-start;
  gap: 0.63vw;
}

.otzov-user-photo {
  width: 3.13vw;
  height: 3.13vw;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
  border: 0.1vw solid rgba(17, 47, 85, 1);
}

.otzov-user-details {
  display: flex;
  flex-direction: column;
  flex: 1 1;
  width: 100%;
}

.otzov-header-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  gap: 0.83vw;
}

.otzov-user-name-wrapper {
  display: flex;
  flex-direction: column;
  gap: 0.31vw;
  text-align: left;
  /* flex: 1; */
}

.otzov-user-name {
  font-size: var(--font-size-h6);
  font-weight: 500;
  color: rgba(46, 61, 88, 1);
  margin: 0;
  flex-shrink: 0;
}

.otzov-user-rating {
  display: flex;
  align-items: center;
  gap: 0.42vw;
}

.otzov-rating-value {
  font-size: var(--font-size-body);
  font-weight: 700;
  color: #000000;
  font-family: 'Geist', sans-serif;
}

.otzov-rating-stars {
  display: flex;
  align-items: center;
  gap: 0.21vw;
}

.otzov-rating-stars svg {
  width: 0.94vw;
  height: 0.89vw;
  flex-shrink: 0;
}

.otzov-platform-rating {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.31vw;
  flex-shrink: 0;
}

.otzov-platform-badge {
  border: 0.052vw solid #E0E0E0;
  border-radius: 0.52vw;
  padding: 0.42vw 0.83vw;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  background: #FFFFFF;
}

.otzov-platform-badge-top {
  display: flex;
  align-items: center;
  gap: 0.4vw;
  margin-bottom: 0.2vw;
}

.otzov-platform-badge-icon {
  height: 1.04vw;
  width: auto;
  object-fit: contain;
}

.otzov-platform-badge-name {
  font-size: 0.83vw;
  font-weight: 600;
  color: #000000;
  font-family: 'Geist', sans-serif;
}

.otzov-platform-badge-bottom {
  display: flex;
  align-items: center;
  gap: 0.2vw;
}

.otzov-platform-badge-rating {
  font-size: 0.83vw;
  font-weight: 700;
  color: #000000;
  font-family: 'Geist', sans-serif;
}

.otzov-platform-badge-stars {
  display: flex;
  align-items: center;
  gap: 0.15vw;
}

.otzov-platform-badge-stars svg {
  width: 0.83vw;
  height: 0.83vw;
}

/* .otzov-platform-rating .reviews-rating-card {
  width: 8.33vw;
  height: 3.13vw;
} */

.otzov-review-text {
  /* padding: 0.52vw; */
  font-size: var(--font-size-body-medium);
  font-weight: 300;
  color: rgba(26, 26, 26, 0.75);
  line-height: 1.46vw;
  margin: 0;
  flex: 1 1;
  text-align: left;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 8;
  line-clamp: 8;
  -webkit-box-orient: vertical;
  text-overflow: ellipsis;
}

/* Дополнительные стили для Яндекс Карты */
.otzov-platform-yandex {
  color: #FF0000;
}

.otzov-platform-yandex span {
  color: #FF0000;
  font-weight: 600;
}

.otzov-yandex-icon {
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Навигация */
.reviews-navigation {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 0;
  margin-bottom: 0;
  gap: 1.04vw;
}

.reviews-carousel-dots-wrapper {
  display: flex;
  align-items: center;
  gap: 0.42vw;
}

.reviews-carousel-dots {
  display: flex;
  gap: 0.42vw;
}

.reviews-carousel-dot {
  width: 0.42vw;
  height: 0.42vw;
  border-radius: 50%;
  border: none;
  background: #E0E0E0;
  cursor: pointer;
  transition: all 0.3s ease;
  padding: 0;
}

.reviews-carousel-dot:hover {
  background: #B0B0B0;
}

.reviews-carousel-dot.active {
  background: #485B85;
  width: 1.25vw;
  border-radius: 0.21vw;
}

.reviews-nav-controls {
  display: flex;
  align-items: center;
  gap: 0.78vw;
}

.reviews-slide-counter {
  font-size: var(--font-size-body);
  font-weight: 500;
  color: rgba(0, 0, 0, 1);
  font-family: 'Geist', sans-serif;
}

.reviews-nav-btn {
  width: 3.13vw;
  height: 3.13vw;
  border-radius: 50%;
  border: none;
  background: #FFFFFF;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.3s ease;
  padding: 0;
  position: relative;
}

.reviews-nav-btn:hover {
  background: #485B85;
}

.reviews-nav-btn:hover svg:not(.reviews-nav-progress):not(.reviews-nav-arrow) path {
  stroke: #FFFFFF;
  stroke-opacity: 1;
}

.reviews-nav-btn:hover .reviews-nav-arrow path {
  stroke: #FFFFFF;
  stroke-opacity: 1;
}

.reviews-nav-btn:hover .reviews-nav-progress circle:nth-child(2) {
  stroke: #ffffff !important;
}

.reviews-nav-btn:hover .reviews-nav-progress circle:first-child {
  stroke: #485B85 !important;
}

.reviews-nav-progress {
  position: absolute;
  top: 0;
  left: 0;
  width: 3.13vw;
  height: 3.13vw;
  z-index: 2;
}

.reviews-nav-progress circle {
  transition: stroke 0.3s ease;
  stroke-width: 0.1vw !important;
}

.reviews-nav-arrow {
  position: relative;
  z-index: 1;
  width: 0.52vw;
  height: 0.78vw;
}

.reviews-nav-arrow path {
  transition: stroke 0.3s ease, stroke-opacity 0.3s ease;
}

.reviews-nav-btn svg:not(.reviews-nav-progress):not(.reviews-nav-arrow) {
  width: 0.52vw;
  height: 0.78vw;
}

.reviews-nav-btn svg:not(.reviews-nav-progress):not(.reviews-nav-arrow) path {
  transition: stroke 0.3s ease, stroke-opacity 0.3s ease;
}

/* Рейтинги платформ - стили из Header */
.reviews-platforms {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.52vw;
  margin-top: 2.6vw;
}

.reviews-platforms-top {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 1.56vw;
  width: 100%;
  flex-wrap: wrap;
  /* margin-bottom: 1.56vw; */
}

.reviews-platforms .reviews-navigation {
  margin-bottom: 0;
  margin-top: 0;
}

.reviews-platforms-text {
  margin-top: 0;
  margin-bottom: 0;
  text-align: left;
  font-size: var(--font-size-body);
  font-weight: 300;
  color: rgba(26, 26, 26, 0.75);
  font-family: 'Geist', sans-serif;
}

.reviews-buttons {
  display: flex;
  align-items: center;
  gap: 1.04vw;
}

/* ЭФФЕКТ POSITION AWARE ДЛЯ КНОПКИ ЗАГРУЗКИ */
.reviews-upload-video-btn {
  position: relative;
  overflow: hidden;
  padding: 1.46vw 2.08vw;
  border-radius: 2.6vw;
  border: 0.052vw solid #E0E0E0;
  font-weight: 600;
  font-size: var(--font-size-button-secondary);
  line-height: 0.99vw;
  cursor: pointer;
  display: flex;
  align-items: center;
  font-family: 'Geist', sans-serif;
  background: #EBEBEB;
  color: #000000;
  transition: color 0.4s ease-in-out;
  z-index: 1;
}

.reviews-upload-video-btn:hover {
  color: #FFFFFF;
}

.reviews-upload-video-btn .btn-text {
  position: relative;
  z-index: 2;
  pointer-events: none;
}

.reviews-upload-video-btn .hover-effect {
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  border-radius: 50%;
  background-color: #485B85;
  transition: width 0.4s ease-in-out, height 0.4s ease-in-out;
  transform: translate(-50%, -50%);
  z-index: -1;
  pointer-events: none;
}

.reviews-upload-video-btn:hover .hover-effect {
  width: 30vw;
  height: 30vw;
}

.reviews-ratings {
  display: flex;
  flex-direction: column;
  gap: 1.04vw;
  align-items: flex-start;
  margin: 0;
}

.reviews-ratings-cards {
  display: flex;
  gap: 0.52vw;
  align-items: center;
}

.reviews-rating-card {
  /* width: 8.33vw;
  height: 3.13vw; */
  background: #FFFFFF;
  border: 0.03vw solid #D7D7D7;
  border-radius: 0.63vw;
  padding: 0.5vw 0.8vw;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 0.25vw;
  transition: transform 0.3s ease;
  cursor: pointer;
}

.reviews-rating-card:hover {
  transform: scale(1.05);
}

.reviews-rating-icon {
  width: auto;
  height: 1.09vw;
  object-fit: contain;
  flex-shrink: 0;
  align-self: flex-start;
}

.reviews-rating-content {
  display: flex;
  flex-direction: column;
  gap: 0.21vw;
  align-items: flex-start;
  width: 100%;
}

.reviews-rating-stars {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.21vw;
}

.reviews-rating-value {
  font-size: var(--font-size-body);
  font-weight: 700;
  color: #000000;
  font-family: 'Geist', sans-serif;
  margin-right: 0.21vw;
}

.reviews-rating-stars svg {
  width: 0.94vw;
  height: 0.89vw;
  flex-shrink: 0;
}

.reviews-platforms-text {
  padding-right: 3.13vw;
  font-size: var(--font-size-body);
  font-weight: 300;
  color: rgba(26, 26, 26, 0.75);
  margin: 0;
  text-align: center;
  font-family: 'Geist', sans-serif;
}


.reviews-leave-review-btn {
  padding: 0.31vw 0.31vw 0.31vw 1.56vw;
  border-radius: 2.6vw;
  border: 0.052vw solid #2E3D58;
  font-weight: 600;
  font-size: var(--font-size-button);
  line-height: 0.89vw;
  cursor: pointer;
  transition: all 0.3s ease;
  display: flex;
  align-items: center;
  gap: 1.56vw;
  font-family: 'Geist', sans-serif;
  position: relative;
  overflow: hidden;
  background: #485B85;
}

.reviews-leave-review-btn span {
  color: #FFFFFF;
  transition: color 0.3s ease, transform 0.8s cubic-bezier(0.4, 0, 0.2, 1);
  position: relative;
  z-index: 3;
  flex: 1 1; /* Заставляет текст занять всё свободное место */
  text-align: center; /* Центрирует текст */
}

.reviews-leave-review-btn:hover span {
  color: #485B85;
  transform: translateX(3.5vw);
}

.reviews-leave-review-btn-icon {
  width: 3.13vw;
  height: 3.13vw;
  border-radius: 50%;
  background: #FFFFFF;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
  z-index: 2;
  margin-left: auto;
}

.reviews-leave-review-btn-icon svg {
  transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
  width: 0.73vw;
  height: 0.63vw;
}

.reviews-leave-review-btn:hover .reviews-leave-review-btn-icon svg {
  transform: translateX(-8.1vw) rotate(40deg);
}

.reviews-leave-review-btn::after {
  content: '';
  position: absolute;
  right: 0.31vw;
  top: 50%;
  transform: translateY(-50%);
  width: 3.13vw;
  height: 3.13vw;
  border-radius: 50%;
  background: #FFFFFF;
  transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
  z-index: 0;
  pointer-events: none;
}

.reviews-leave-review-btn:hover::after {
  width: 41.67vw;
  height: 41.67vw;
  right: -20.83vw;
  top: 50%;
  transform: translateY(-50%);
}

/* Эффект блика для кнопки */
.reviews-leave-review-btn .flare {
  position: absolute;
  top: 0;
  height: 100%;
  width: 45px;
  transform: skewX(-45deg);
  animation: flareAnimation 3s infinite;
  left: -170%;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.9), #fff);
  filter: blur(0px);
  z-index: 1;
  pointer-events: none;
}

@keyframes flareAnimation {
  0% {
    left: -170%;
  }
  50% {
    left: 170%;
  }
  100% {
    left: 170%;
  }
}

.reviews-leave-review-btn-icon svg path {
  fill: #485B85;
  transition: fill 0.3s ease;
}

@media (max-width: 2200px) {
  .reviews-container {
    padding: 0 2.6vw;
  }
}

@media (min-width: 2200px) {
  .reviews-header-stats {
    max-width: 30vw;
  }
  
  .reviews-stat-value {
    font-size: 1.8vw;
    width: 7vw;
  }
  
  .reviews-stat-item {
    padding: 0.6vw 0.2vw;
  }
  
  .reviews-stat-label {
    font-size: 0.65vw;
  }
}

@media (max-width: 780px) {
  .reviews {
    padding-top: 12.82vw;
    padding-bottom: 0;
  }

  .reviews-header {
    display: flex;
    flex-direction: column;
    gap: 3.85vw;
    margin-bottom: 12.82vw;
  }

  .reviews-header-left {
    order: 1;
    gap: 1.28vw;
  }

  .reviews-header-stats {
    order: 2;
    width: 100%;
    border-radius: 1.28vw;
  }

  .reviews-title {
    width: 100%;
    font-size: 5.77vw;
    font-weight: 700;
    line-height: 8.33vw;
  }

  .reviews-title-highlight {
    text-decoration-thickness: 0.26vw;
    text-underline-offset: 0.64vw;
  }

  .reviews-description {
    font-size: 3.33vw;
    line-height: 5.13vw;
    margin: 0;
    width: 100%;
  }

  .reviews-stat-item {
    padding: 2.82vw 0.64vw;
    flex: 1 1;
    min-width: 0;
    box-sizing: border-box;
  }

  .reviews-stat-value {
    font-size: 5.13vw;
    line-height: 5.13vw;
    width: auto;
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
  }

  .reviews-stat-label {
    font-size: 2.56vw;
    line-height: 3.85vw;
  }

  .reviews-carousel-slide {
    width: 100%;
    min-width: 100%;
    padding: 1.28vw 2.56vw;
  }

  .otzov-card {
    padding: 3.85vw;
    border-radius: 2.56vw;
    gap: 2.56vw;
    height: auto !important;
    min-height: 60vw;
    box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.1); /* Тень 30px */
  }

  .otzov-user-info {
    gap: 2.05vw;
  }

  .otzov-user-photo {
    width: 9.36vw;
    height: 9.36vw;
    border: 0.26vw solid rgba(17, 47, 85, 1);
  }

  .otzov-user-name {
    font-size: 3.33vw;
    line-height: 4.49vw;
  }

  .otzov-user-rating {
    gap: 1.03vw;
  }

  .otzov-rating-value {
    font-size: 2.31vw;
    line-height: 3.08vw;
  }

  .otzov-rating-stars {
    gap: 0.51vw;
  }

  .otzov-rating-stars svg {
    width: 2.31vw;
    height: 2.18vw;
  }

  .otzov-review-text {
    font-size: 2.56vw;
    line-height: 4.1vw;
    -webkit-line-clamp: 10;
    line-clamp: 10;
  }

  .otzov-platform-rating {
    gap: 0.9vw;
  }

  .reviews-platforms-top {
    justify-content: flex-start;
    gap: 0;
  }

  .reviews-ratings {
    width: 100%;
    flex: 1 1;
    gap: 2.56vw;
  }

  .reviews-platforms-text {
    padding: 0;
    font-size: 3.33vw;
    line-height: 5.13vw;
    margin-bottom: 8.97vw;
  }

  .reviews-upload-video-btn {
    font-size: 2.31vw;
    line-height: 1.92vw;
    padding: 4.36vw 5.13vw;
    border-radius: 16.54vw;
  }

  .reviews-upload-video-btn:hover .hover-effect {
    width: 100vw;
    height: 100vw;
  }

  .reviews-leave-review-btn {
    font-size: 2.31vw;
    line-height: 1.92vw;
    width: 45.64vw;
    border-radius: 19.23vw;
    padding: 0.77vw 0.77vw 0.77vw 3.85vw;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2.05vw;
    position: relative;
    overflow: hidden;
  }

  .reviews-leave-review-btn::after {
    right: 0.77vw;
    width: 8.85vw;
    height: 8.85vw;
  }

  .reviews-leave-review-btn:hover::after {
    width: 102.56vw;
    height: 102.56vw;
    right: -51.28vw;
  }

  .reviews-leave-review-btn:hover .reviews-leave-review-btn-icon svg {
    transform: translateX(max(-34.7vw, calc(-15% - 40.56vw))) rotate(40deg);
  }

  .reviews-leave-review-btn:hover span {
    transform: translateX(max(18.7vw, calc(-10% - 35.56vw)));
  }

  .reviews-leave-review-btn-icon {
    width: 8.85vw;
    height: 8.85vw;
    flex-shrink: 0;
    margin-left: auto;
  }

  .reviews-leave-review-btn-icon svg {
    width: 2.2vw;
    height: 2vw;
  }

  .reviews-ratings-cards {
    justify-content: space-between;
    width: 100%;
    gap: 0;
  }

  .reviews-rating-card {
    width: 29.5vw;
    height: 12.87vw;
    padding: 1.03vw 1.67vw;
    border-radius: 1.03vw;
    /* gap: 0.77vw; */
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .reviews-rating-card .reviews-rating-icon {
    height: 2.56vw;
    display: block;
    margin-left: 18%;
  }

  .reviews-rating-card .reviews-rating-content {
    display: flex;
    flex-direction: column;
    gap: 0.21vw;
    align-items: center;
    justify-content: center;
    width: 100%;
  }

  .reviews-rating-card .reviews-rating-value {
    font-size: 2.56vw;
    margin-right: 0.51vw;
  }

  .reviews-rating-stars {
    margin-top: 0.77vw;
  }

  .reviews-rating-card .reviews-rating-stars {
    gap: 0.38vw;
    justify-content: center;
  }

  .reviews-rating-card .reviews-rating-stars svg {
    width: 2.05vw;
    height: 1.92vw;
  }

  .otzov-platform-badge {
    border-radius: 1.5vw;
    padding: 1vw 2vw;
  }
  
  .otzov-platform-badge-top {
    gap: 1vw;
    margin-bottom: 0.5vw;
  }
  
  .otzov-platform-badge-icon {
    height: 3.5vw;
  }
  
  .otzov-platform-badge-name {
    font-size: 2.5vw;
  }
  
  .otzov-platform-badge-bottom {
    gap: 1vw;
  }
  
  .otzov-platform-badge-rating {
    font-size: 2.5vw;
  }
  
  .otzov-platform-badge-stars {
    gap: 0.5vw;
  }
  
  .otzov-platform-badge-stars svg {
    width: 2.3vw;
    height: 2.3vw;
  }

  .reviews-carousel-dots-bottom {
    display: flex;
    flex-direction: row;
    gap: 0.64vw;
  }

  .reviews-carousel-dot-bottom {
    width: 0.77vw;
    height: 0.77vw;
    border-radius: 50%;
  }

  .reviews-carousel-dot-bottom.active {
    width: 2.05vw;
    height: 0.77vw;
    border-radius: 12.82vw;
  }

  .reviews-container {
    position: relative;
  }

  .reviews-carousel-wrapper {
    position: relative;
    margin-bottom: 20.51vw;
  }

  .reviews-platforms-top {
    position: relative;
  }

  .reviews-platforms-top .reviews-navigation {
    position: absolute;
    top: -18vw; /* Чуть приподняли блок, так как сами кнопки стали выше */
    right: 0 !important; /* Жестко прижимаем к правому краю экрана/контейнера */
    left: auto !important; /* Сбрасываем старые 85% */
    transform: none !important; /* Убираем сдвиг, который выталкивал кнопки за экран */
    width: auto;
    margin-top: 0;
  }

  .reviews-carousel-dots-wrapper-bottom {
    position: relative;
    margin-bottom: 2.56vw;
  }

  .reviews-nav-controls {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    width: 100%;
    gap: 2.03vw;
  }

  .reviews-slide-counter {
    font-size: 3.59vw;
  }

  .reviews-nav-btn {
    width: 12vw !important; 
    height: 12vw !important;
  }

  .reviews-nav-progress {
    width: 100%;
    height: 100%;
  }
  .reviews-nav-arrow {
    width: 2.6vw !important; 
    height: 4vw !important; 
  }

  .reviews-nav-btn svg:not(.reviews-nav-progress):not(.reviews-nav-arrow) {
    width: 2.6vw !important;
    height: 4vw !important;
  }
}
.guarantee-faq {
  width: 100%;
  background: #FFFFFF;
  padding: 1.04vw 0 4.17vw 0;
}

.guarantee-faq-container {
  width: 100%;
  /* max-width: 1920px; */
  margin: 0 auto;
  padding: 0 10%;
}

.guarantee-faq-content {
  display: grid;
  grid-template-columns: 1.8fr 1fr;
  grid-gap: 1.56vw;
  gap: 1.56vw;
  align-items: stretch; /* Возвращаем автоматическое выравнивание */
}

/* Левая секция - Текст и FAQ */
.guarantee-faq-left {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.guarantee-faq-title {
  font-weight: 700;
  font-size: var(--font-size-h1);
  line-height: 3.13vw;
  color: #000000;
  text-align: left;
  text-transform: uppercase;
  margin: 0 0 1.04vw 0;
  font-family: 'Geist', sans-serif;
}

.guarantee-faq-title span {
  color: #485B85;
  text-decoration: underline;
  text-decoration-thickness: 0.16vw;
  text-underline-offset: 0.26vw;
}

.guarantee-faq-description {
  width: 38.17vw;
  font-weight: 300;
  font-size: var(--font-size-h8);
  line-height: 1.72vw;
  text-align: left;
  color: #1A1A1ABF;
  margin: 0 0 1.56vw 0;
  font-family: 'Geist', sans-serif;
}

.guarantee-faq-grid {
  display: flex;
  flex-direction: column;
  gap: 0.52vw;
  height: 44vw; /* Фиксируем высоту, чтобы блок вообще не двигался */
}

.guarantee-faq-card {
  background-color: #f6f6f6;
  border-radius: 1.3vw;
  padding: 1.25vw;
  display: flex;
  flex-direction: column;
  gap: 0;
  cursor: pointer;
  overflow: hidden;
  transition: flex 0.6s cubic-bezier(0.4, 0, 0.2, 1), background-color 0.3s ease;
  flex: 1 1; /* Закрытая карточка */
}

.guarantee-faq-card.open {
  background-color: #f6f6f6;
  flex: 3 1; /* Открытая карточка плавно забирает место у остальных */
}

.guarantee-faq-card:hover {
  background-color: #eeeeee;
}

.guarantee-faq-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.78vw;
  width: 100%;
  flex-shrink: 0; /* Обязательно добавь это свойство */
}

.guarantee-faq-text {
  font-size: var(--font-size-body);
  text-align: left;
  color: rgba(25, 25, 25, 1);
  margin: 0;
  line-height: var(--line-height-23);
  font-weight: var(--font-weight-medium);
  font-family: 'Geist', sans-serif;
}

.guarantee-faq-icon-wrapper {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.guarantee-faq-icon {
  width: 2.14vw;
  height: 2.14vw;
  border-radius: 50%;
  background: #FFFFFF;
  /* border: 0.052vw solid #485B85; */
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.3s ease;
}

.guarantee-faq-icon svg {
  width: 0.73vw;
  height: 0.73vw;
  flex-shrink: 0;
}

.guarantee-faq-card.open .guarantee-faq-icon {
  transform: rotate(45deg);
}

.guarantee-faq-accordion {
  opacity: 0;
  pointer-events: none;
  margin-top: 0;
  transition: opacity 0.3s ease;
}

.guarantee-faq-card.open .guarantee-faq-accordion {
  opacity: 1;
  pointer-events: auto;
  margin-top: 1vw;
  transition: opacity 0.6s ease 0.2s, margin-top 0.6s ease;
}

.guarantee-faq-answers {
  width: 55.17vw;
  display: flex;
  flex-direction: column;
  gap: 0.63vw;
}

.guarantee-faq-answer {
  display: flex;
  align-items: flex-start;
  gap: 0.52vw;
}

.guarantee-faq-answer-icon {
  color: #485B85;
  font-weight: 700;
  font-size: var(--font-size-body-medium);
  flex-shrink: 0;
  font-family: 'Geist', sans-serif;
}

.guarantee-faq-answer-text {
  font-size: var(--font-size-body);
  color: rgba(26, 26, 26, 0.65);
  line-height: var(--line-height-28);
  text-align: left;
  font-family: 'Geist', sans-serif;
  font-weight: var(--font-weight-light);
}

/* Правая секция - фото врача */
.guarantee-faq-right {
  display: flex;
  flex-direction: column;
  height: 100%; /* Теперь высота будет в точности равна левому блоку */
}

.guarantee-faq-doctor-image {
  position: relative;
  width: 100%;
  height: 100%;
  border-radius: 1.04vw;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.guarantee-faq-doctor-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: absolute;
  top: 0;
  left: 0;
}

.guarantee-faq-doctor-play-button {
  position: absolute;
  top: 45%;
  left: 43%;
  /* transform: translate(-50%, -50%); */
  width: 4.17vw;
  height: 4.17vw;
  background: #FFFFFF;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 10;
  transition: transform 0.3s ease;
  box-sizing: content-box;
}

.guarantee-faq-doctor-play-button::before {
  content: "";
  position: absolute;
  z-index: 0;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  display: block;
  width: 4.17vw;
  height: 4.17vw;
  background: #FFFFFF;
  border-radius: 50%;
  animation: pulse-border 1500ms ease-out infinite;
}

.guarantee-faq-doctor-play-button::after {
  content: "";
  position: absolute;
  z-index: 1;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  display: block;
  width: 4.17vw;
  height: 4.17vw;
  background: #FFFFFF;
  border-radius: 50%;
  transition: all 200ms;
}

.guarantee-faq-doctor-play-button:hover::after {
  background-color: #f5f5f5;
}

.guarantee-faq-doctor-play-button:hover {
  transform: translate(-50%, -50%) scale(1.1);
}

.guarantee-faq-doctor-play-button svg {
  width: 1.16vw;
  height: 1.4vw;
  transform: translateX(0.1vw);
  position: relative;
  z-index: 3;
}

@keyframes pulse-border {
  0% {
    transform: translate(-50%, -50%) translateZ(0) scale(1);
    opacity: 1;
  }
  100% {
    transform: translate(-50%, -50%) translateZ(0) scale(1.5);
    opacity: 0;
  }
}

.guarantee-faq-form {
  width: 96%;
  position: absolute;
  bottom: 1vw;
  left: 0.9vw;
  right: 0;
  background: rgba(255, 255, 255, 0.5);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-radius: 1.04vw;
  border: 0.03vw solid rgba(255, 255, 255, 1);
  border-top: 0.108vw solid rgba(255, 255, 255, 1);
  padding: 0.26vw;
  display: flex;
  flex-direction: column;
  gap: 0.42vw;
  z-index: 10;
  box-sizing: border-box;
}

.guarantee-faq-form-inner {
  background: #FFFFFF;
  padding: 0.52vw 1vw 0.52vw 1vw;
  gap: 0.5vw;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-radius: 0.8vw;
}

.guarantee-faq-form-content {
  flex: 1 1;
  display: flex;
  flex-direction: column;
  gap: 0.25vw;
}

.guarantee-faq-form-title {
  font-size: var(--font-size-body);
  font-weight: 500;
  color: rgba(25, 25, 25, 1);
  margin: 0;
  line-height: 1.4;
  text-align: left;
  font-family: 'Geist', sans-serif;
}

.guarantee-faq-form-description {
  font-size: var(--font-size-body-small);
  font-weight: 300;
  color: #1A1A1ABF;
  margin: 0;
  line-height: 1.4;
  text-align: left;
  font-family: 'Geist', sans-serif;
}

.guarantee-faq-form-input {
  width: 100%;
  padding: 0.52vw 0.78vw;
  border: 0.052vw solid #E0E0E0;
  border-radius: 0.52vw;
  font-size: var(--font-size-body);
  font-family: 'Geist', sans-serif;
  background: #FFFFFF;
  color: #000000;
  outline: none;
  transition: border-color 0.3s ease;
  box-sizing: border-box;
}

.guarantee-faq-form-input:focus {
  border-color: #485B85;
}

.guarantee-faq-form-input::placeholder {
  color: rgba(26, 26, 26, 0.5);
}

.guarantee-faq-form-icon {
  width: calc(3.15vw - 5px);
  height: calc(3.15vw - 5px);
  border-radius: 0.8vw;
  background: rgba(17, 47, 85, 1);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  cursor: pointer;
  transition: background 0.3s ease;
}

.guarantee-faq-form-icon:hover {
  background: rgba(14, 38, 70, 1);
}

.guarantee-faq-form-icon svg {
  width: 1.2vw;
  height: 0.94vw;
}

@media (max-width: 2200px) {
  .guarantee-faq-container  {
    padding: 0 2.6vw;
  }
}

@media (max-width: 780px) {
  .guarantee-faq {
    padding-top: 12.82vw;
    padding-bottom: 0;
  }

  .guarantee-faq-content {
    display: flex;
    flex-direction: column;
  }

  .guarantee-faq-left {
    order: 1;
  }

  .guarantee-faq-right {
    order: 2;
  }

  .guarantee-faq-title {
    width: 100%;
    font-size: 5.77vw;
    font-weight: 700;
    line-height: 8.33vw;
    margin-bottom: 2.56vw;
  }

  .guarantee-faq-title span {
    text-decoration-thickness: 0.26vw;
    text-underline-offset: 0.64vw;
  }

  .guarantee-faq-description {
    font-size: 3.33vw;
    line-height: 5.13vw;
    margin-bottom: 8.97vw;
    width: 100%;
  }

 .guarantee-faq-card {
    height: auto;
    min-height: 15.38vw;
    padding: 3.85vw;
  }

  .guarantee-faq-card.open {
    flex: 3 1;
    height: auto;
    padding: 3.85vw;
  }
  
  .guarantee-faq-card.open .guarantee-faq-accordion {
    margin-top: 4.5vw;
  }

  .guarantee-faq-text {
    font-size: 3.85vw;
    line-height: 6.41vw;
  }

  .guarantee-faq-icon-wrapper {
    width: 7.69vw;
    height: 7.69vw;
  }

  .guarantee-faq-icon {
    width: 7.69vw;
    height: 7.69vw;
  }

  .guarantee-faq-icon svg {
    width: 2.56vw;
    height: 2.56vw;
  }

  .guarantee-faq-accordion {
    font-size: 3.33vw;
    line-height: 5.13vw;
  }

  .guarantee-faq-card.open .guarantee-faq-accordion {
    padding-top: 6.41vw;
  }

 .guarantee-faq-grid {
    height: 160vw; /* Фиксируем высоту для телефона */
    gap: 1.28vw;
    max-height: none;
  }

  .guarantee-faq-card {
    flex: 1 1;
    height: auto;
    min-height: 0;
    padding: 3.85vw;
  }

  .guarantee-faq-answers {
    width: 100%;
  }

  .guarantee-faq-answer-text {
    font-size: 3.33vw;
    line-height: 5.13vw;
    width: 100%;
  }

  .guarantee-faq-card.open {
    flex: 3 1;
    height: auto;
    padding: 3.85vw 3.85vw 25vw 3.85vw; /* Верх, Право, НИЗ (увеличили), Лево */
  }

  .guarantee-faq-right {
    margin-top: 7.69vw;
  }

  .guarantee-faq-doctor-image {
    border-radius: 2.56vw;
  }

  .guarantee-faq-doctor-image {
    height: 115.38vw;
  }

  .guarantee-faq-doctor-image img {
    height: 115.38vw;
  }

  .guarantee-faq-doctor-play-button {
    width: 15.38vw !important;
    height: 15.38vw !important;
    box-sizing: content-box;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
  }

  .guarantee-faq-doctor-play-button::before,
  .guarantee-faq-doctor-play-button::after {
    width: 15.38vw !important;
    height: 15.38vw !important;
  }

  .guarantee-faq-doctor-play-button:hover {
    transform: translate(-50%, -50%) scale(1.1) !important;
  }

  .guarantee-faq-doctor-play-button svg {
    width: 3.46vw !important;
    height: 4.36vw !important;
    transform: translateX(0.1vw) !important;
  }

  .guarantee-faq-form {
    padding: 0.66vw;
    border-radius: 2.56vw;
    width: calc(100% - 2.62vw);
    left: 1.28vw;
    bottom: 1.26vw;
    /* gap: 0.64vw; */
  }

  .guarantee-faq-form-inner {
    border-radius: 1.92vw;
    /* Прописываем отступы: Верх, Право, Низ, Лево */
    padding: 1.5vw 2.5vw 3.5vw 2.5vw; /* Увеличили нижний отступ, чтобы приподнять контент */
    gap: 2.56vw;
    align-items: center;
  }

  .guarantee-faq-form-title {
    font-size: 3.85vw;
    line-height: 6.41vw;
    font-weight: 700;
  }

  .guarantee-faq-form-description {
    font-size: 2.56vw;
    line-height: 3.85vw;
  }

  .guarantee-faq-form-icon {
    width: 10.9vw;
    height: 10.9vw;
    border-radius: 1.92vw;
  }

  .guarantee-faq-form-icon svg {
    width: 3.08vw;
    height: 2.41vw;
  }
}
.konsultacia-container {
  width: 100%;
  /* Сверху 0, справа 2.6vw (50px), снизу 2.5vw (как было), слева 2.6vw (50px) */
  padding: 0 2.6vw 2.5vw 2.6vw; 
  box-sizing: border-box;
  background-color: white;
}

.konsultacia-content {
  width: 100%;
  height: 11.98vw !important;
  margin: 0 auto;
  background: #EBEBEB;
  border-radius: 1.04vw;
  /* ЖЕСТКО убираем внутренние отступы, чтобы блок не ломался */
  padding: 0 !important; 
  display: flex;
  /* Автоматически выравнивает фотку по центру, давая ровно по 10px сверху и снизу */
  align-items: center !important; 
  position: relative;
  overflow: hidden;
}

.konsultacia-doctor-image {
  flex-shrink: 0;
  width: 21.98vw !important;
  height: 10.94vw !important;
  border-radius: 0.52vw !important;
  border: 1px solid #FFFFFF !important;
  margin-left: 0.52vw !important; 
  
  /* ТОТ САМЫЙ ОТСТУП СПРАВА (10px) */
  margin-right: 0.52vw !important; 
  
  /* ОСТАВЛЯЕМ, ЧТОБЫ УГЛЫ ФОТО БЫЛИ КРУГЛЫМИ ПО РАМКЕ */
  overflow: hidden !important; 
}

.konsultacia-button {
  /* Если кнопка прилипает к правому краю серого контейнера, это отодвинет её на 10px */
  margin-right: 0.52vw !important; 
}

/* Убедись, что внутри картинки нет старых scaleX(-1) или поворотов */
.konsultacia-doctor-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  
  /* 50% по горизонтали (центр), 20% по вертикали (идеальная середина между макушкой и центром) */
  object-position: 50% 20%; 
  
  display: block;
  transition: transform 0.3s ease !important;
}

.konsultacia-doctor-image:hover {
  transform: none !important; 
}

.konsultacia-doctor-image:hover img {
  transform: scale(1.05) !important;
}

.konsultacia-text-block {
  display: flex;
  flex-direction: column;
  gap: 0.52vw !important; 
  margin-left: 3.46vw !important; 
  
  /* ОБНУЛЯЕМ ОТСТУП СВЕРХУ, чтобы родительский контейнер сам выровнял текст по центру */
  margin-top: 0 !important; 
  
  width: 46vw !important; 
  flex-shrink: 1 !important; 
  z-index: 2;
}

.konsultacia-title {
  font-size: 1.4vw; /* 27px */
  font-weight: 700;
  color: #191919;
  line-height: 1.82vw; /* 35px */
  margin: 0 !important;
  text-align: left;
  text-transform: uppercase;
  font-family: 'Geist', sans-serif;
  letter-spacing: 0;
}

.konsultacia-description {
  text-align: left;
  font-family: 'Geist', sans-serif !important;
  font-weight: 300 !important;
  font-size: 1.146vw !important; /* 22px */
  line-height: 1.719vw !important; /* 33px */
  color: #1A1A1ABF !important;
  margin: 0 !important;
  
  width: 100% !important; /* Занимает всю отведенную ширину родителя */
  max-width: none !important;
}


.konsultacia-button {
  padding: 0.31vw 0.31vw 0.31vw 1.56vw;
  border-radius: 2.6vw;
  border: 0.052vw solid #2E3D58;
  font-weight: 500;
  font-size: var(--font-size-button);
  line-height: 0.89vw;
  cursor: pointer;
  transition: all 0.3s ease;
  display: flex;
  align-items: center;
  gap: 1.56vw;
  font-family: 'Geist', sans-serif;
  position: relative;
  overflow: hidden;
  flex-shrink: 0;
  align-self: center !important; 
  margin-left: auto !important;  
  
  /* Слегка уменьшили отступ до картинки (было 2vw) */
  margin-right: 1vw !important;  
}

.konsultacia-btn-primary {
  background: #485B85;
  color: #FFFFFF;
}

.konsultacia-btn-primary span {
  color: #FFFFFF;
  transition: color 0.3s ease, transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  position: relative;
  z-index: 3;
}

.konsultacia-btn-primary:hover span {
  color: #485B85;
  transform: translateX(min(3.65vw, 15.31vw));
}

.konsultacia-btn-icon {
  width: 3.125vw;
  height: 3.125vw;
  border-radius: 50%;
  background: #FFFFFF;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
  z-index: 2;
}

.konsultacia-btn-icon svg {
  width: 0.73vw;
  height: 0.63vw;
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.konsultacia-button:hover .konsultacia-btn-icon svg {
  transform: translateX(max(-11.1vw, calc(-10% - 20.56vw))) rotate(40deg);
}

.konsultacia-button::after {
  content: '';
  position: absolute;
  right: 0.31vw;
  top: 50%;
  transform: translateY(-50%);
  width: 3.125vw;
  height: 3.125vw;
  border-radius: 50%;
  background: #FFFFFF;
  transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
  z-index: 0;
  pointer-events: none;
}

.konsultacia-button:hover::after {
  width: 41.67vw;
  height: 41.67vw;
  right: -20.83vw;
  top: 50%;
  transform: translateY(-50%);
}

/* Эффект блика для кнопки */
.konsultacia-button .flare {
  position: absolute;
  top: 0;
  height: 100%;
  width: 45px;
  transform: skewX(-45deg);
  animation: flareAnimation 3s infinite;
  left: -170%;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.9), #fff);
  filter: blur(0px);
  z-index: 1;
  pointer-events: none;
}

@keyframes flareAnimation {
  0% {
    left: -170%;
  }
  50% {
    left: 170%;
  }
  100% {
    left: 170%;
  }
}

@media (max-width: 2200px) { 
  .konsultacia-container {
    padding: 0 2.6vw 2.5vw 2.6vw;
  }
}

@media (max-width: 780px) {
  .konsultacia-container {
    padding: 0 2.6vw 12.821vw 2.6vw;
  }

  .konsultacia-content {
    flex-direction: column;
    align-items: stretch;
    padding: 2.564vw;
    gap: 0;
    border-radius: 2.564vw;
  }

  .konsultacia-doctor-image {
    order: 1;
    width: 100%;
    height: 44.872vw;
    margin-right: 0;
    margin-bottom: 3.846vw;
    border-radius: 2.564vw;
    max-width: none;
    min-width: 0;
  }

  .konsultacia-text-block {
    order: 2;
    gap: 0;
  }

  .konsultacia-title {
    font-size: 5.0vw;
    line-height: 7.051vw;
    font-weight: 600;
    margin-bottom: 3.846vw;
  }

  .konsultacia-description {
    font-size: 3.333vw;
    line-height: 5.128vw;
    margin-bottom: 3.846vw;
  }

  .konsultacia-button {
    order: 3;
    width: 45.641vw;
    font-size: 2.179vw;
    border-radius: 19.231vw;
    padding: 0.77vw 0.77vw 0.77vw 3.21vw;
    justify-content: space-between;
    margin-left: auto;
  }

  .konsultacia-btn-icon {
    width: 8.718vw;
    height: 8.718vw;
    border-radius: 19.231vw;
    margin-left: auto;
  }

  .konsultacia-btn-icon svg {
    width: 2.051vw;
    height: 1.667vw;
  }

  .konsultacia-button::after {
    right: 0.77vw;
    width: 8.718vw;
    height: 8.718vw;
    border-radius: 19.231vw;
  }

  .konsultacia-button:hover::after {
    width: 120vw;
    height: 120vw;
    right: -60vw;
  }

  .konsultacia-btn-primary:hover span {
    transform: translateX(10.974vw);
  }

  .konsultacia-button:hover .konsultacia-btn-icon svg {
    transform: translateX(-34.521vw) rotate(40deg);
  }
}
.contact {
  width: 100%;
  background: linear-gradient(to bottom, #EBEBEB 0%, #EBEBEB 50%, #FFFFFF 50%, #FFFFFF 100%);
  padding: 4.17vw 0;
}

.contact-container {
  width: 100%;
  max-width: 100vw;
  margin: 0 auto;
  padding: 0 10%;
}

.contact-title {
  font-weight: 600;
  font-size: var(--font-size-h1);
  line-height: 2.3vw;
  color: #000000;
  text-align: center;
  text-transform: uppercase;
  text-align: left;
  margin: 0 0 2.6vw 0;
  font-family: 'Geist', sans-serif;
}

.contact-title span {
  color: #485B85;
  text-decoration: underline;
  text-decoration-thickness: 0.16vw;
  text-underline-offset: 0.26vw;
}

.contact-content {
  width: 100%;
  padding: 0;
}

.contact-form-wrapper {
  background: rgba(255, 255, 255, 1);
  border-radius: 1.04vw;
  padding: 1vw;
  display: grid;
  grid-template-columns: 1fr 28.65vw;
  grid-gap: 1.56vw;
  gap: 1.56vw;
  align-items: stretch;
  box-shadow: 0 0 30px 0 rgba(0, 0, 0, 0.1);
}

.contact-left-section {
  display: flex;
  flex-direction: column;
  gap: 2.6vw;
  height: 100%;
  min-height: 0;
}

.contact-top-section {
  display: flex;
  gap: 1.56vw;
  align-items: stretch;
  /* flex: 1;
  min-height: 0;
  height: 100%; */
}

.contact-top-content {
  flex: 1 1;
  display: flex;
  flex-direction: column;
  gap: 1.04vw;
  min-height: 0;
  height: 100%;
}

.contact-form-bottom {
  display: flex;
  flex-direction: column;
  gap: 1.04vw;
}

.contact-form-image {
  flex-shrink: 0;
  width: 20.83vw;
  border-radius: 0.8vw;
  overflow: hidden;
  /* background: #485B85; */
  align-self: flex-start;
  max-height: 100%;
}

.contact-form-image img {
  width: 100%;
  height: auto;
  object-fit: cover;
  object-position: center 20%;
  display: block;
}

.contact-form-submit {
  display: flex;
  flex-direction: column;
  gap: 1.0vw;
}

.contact-form-checkbox {
  align-self: flex-start;
}

.contact-submit-btn {
  align-self: flex-end;
}

.contact-submit-btn {
  padding: 0.31vw 0.31vw 0.31vw 1.56vw;
  border-radius: 2.6vw;
  border: 0.052vw solid #2E3D58;
  font-weight: 500;
  font-size: var(--font-size-body);
  line-height: 0.89vw;
  cursor: pointer;
  transition: all 0.3s ease;
  display: flex;
  align-items: center;
  gap: 1.56vw;
  font-family: 'Geist', sans-serif;
  position: relative;
  overflow: hidden;
  flex-shrink: 0;
  /* margin-top: 1.04vw; */
  width: -webkit-fit-content;
  width: fit-content;
}

.contact-btn-primary {
  background: #485B85;
  color: #FFFFFF;
}

.contact-btn-primary span {
  color: #FFFFFF;
  transition: color 0.3s ease, transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  position: relative;
  z-index: 3;
}

.contact-btn-primary:hover span {
  color: #485B85;
  transform: translateX(min(3.65vw, 15.31vw));
}

.contact-btn-icon {
  width: 3.125vw;
  height: 3.125vw;
  border-radius: 50%;
  background: #FFFFFF;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
  z-index: 2;
}

.contact-btn-icon svg {
  width: 0.73vw;
  height: 0.63vw;
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.contact-submit-btn:hover .contact-btn-icon svg {
  transform: translateX(max(-12.8vw, calc(-10% - 30.56vw))) rotate(40deg);
}

/* Эффект блика для кнопки */
.contact-submit-btn .flare {
  position: absolute;
  top: 0;
  height: 100%;
  width: 45px;
  transform: skewX(-45deg);
  animation: flareAnimation 3s infinite;
  left: -170%;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.9), #fff);
  filter: blur(0px);
  z-index: 1;
  pointer-events: none;
}

@keyframes flareAnimation {
  0% {
    left: -170%;
  }
  50% {
    left: 170%;
  }
  100% {
    left: 170%;
  }
}

.contact-submit-btn::after {
  content: '';
  position: absolute;
  right: 0.31vw;
  top: 50%;
  transform: translateY(-50%);
  width: 3.125vw;
  height: 3.125vw;
  border-radius: 50%;
  background: #FFFFFF;
  transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
  z-index: 0;
  pointer-events: none;
}

.contact-submit-btn:hover::after {
  width: 41.67vw;
  height: 41.67vw;
  right: -20.83vw;
  top: 50%;
  transform: translateY(-50%);
}

.contact-phone-input-error {
  border-color: #FF0000;
}

/* Правая секция - Контакты */
.contact-right {
  grid-column: 2;
  background: rgba(17, 47, 85, 1);
  border-radius: 1.04vw;
  padding: 1.04vw 2.6vw;
  display: flex;
  flex-direction: column;
  gap: 1.56vw;
  width: 28.65vw;
  max-width: 28.65vw;
  flex-shrink: 0;
}

.contact-right-title {
  font-size: var(--font-size-h5);
  font-weight: 700;
  color: #FFFFFF;
  margin: 0;
  text-align: center;
  font-family: 'Geist', sans-serif;
}

.contact-info-cards {
  display: flex;
  flex-direction: column;
  gap: 0.78vw;
}

.contact-info-card {
  background: rgba(255, 255, 255, 0.26);
  -webkit-backdrop-filter: blur(10px);
          backdrop-filter: blur(10px);
  border-radius: 0.78vw;
  padding: 1vw 1.1vw;
  display: flex;
  gap: 1.1vw;
  align-items: center;
}

.contact-info-icon {
  flex-shrink: 0;
  width: 3.13vw;
  height: 3.13vw;
  display: flex;
  align-items: center;
  justify-content: center;
}

.contact-info-icon svg {
  width: 1.04vw;
  height: 1.04vw;
}

.contact-info-content {
  flex: 1 1;
  display: flex;
  flex-direction: column;
  /* gap: 0.26vw; */
  text-align: left;
}

.contact-info-label {
  font-size: var(--font-size-h9);
  font-weight: 600;
  color: rgba(255, 255, 255, 1);
  margin: 0;
  line-height: 1.56vw;
  font-family: 'Geist', sans-serif;
}

.contact-info-value {
  font-size: var(--font-size-body);
  font-weight: 300;
  color: rgba(255, 255, 255, 0.7);
  line-height: 1.72vw;
  margin: 0;
  text-decoration: none;
  font-family: 'Geist', sans-serif;
  transition: opacity 0.3s ease;
}

.contact-info-value:hover {
  opacity: 0.8;
}

.contact-social {
  display: flex;
  flex-direction: column;
  gap: 1.58vw;
  /* margin-top: 0.52vw; */
}

.contact-social-text {
  font-size: var(--font-size-body);
  font-weight: 300;
  color: rgba(255, 255, 255, 0.8);
  margin: 0;
  font-family: 'Geist', sans-serif;
}

.contact-social-icons {
  display: flex;
  gap: 1.8vw;
  align-items: center;
  justify-content: center;
}

.contact-social-icon {
  width: 2.6vw;
  height: 2.6vw;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.3s ease; /* Заменили background на transform */
  text-decoration: none;
}

.contact-social-icon:hover {
  background: transparent; /* Убрали серый фон */
  transform: scale(1.03); /* Добавили увеличение в 1.03 раза */
}

.contact-social-icon svg {
  width: 1.8vw;
  height: 1.8vw;
}

.contact-social-divider {
  width: 90%;
  height: 0.052vw;
  background: rgba(255, 255, 255, 0.3);
  margin-top: 2.1vw;
  margin-left: 5%;
}

.contact-hours {
  font-size: var(--font-size-body);
  font-weight: 300;
  color: rgba(255, 255, 255, 0.8);
  margin: 0;
  /* margin-top: 1.56vw; */
  font-family: 'Geist', sans-serif;
}

/* Стили для текста и карточек преимуществ */
.contact-promo-text {
  font-size: var(--font-size-h5);
  text-align: left;
  font-weight: 600;
  line-height: 1.82vw;
  margin: 0;
  font-family: 'Geist', sans-serif;
}

.contact-offer-cards {
  display: flex;
  flex-direction: column;
  gap: 1vw;
  margin-top: 1.5vw;
  flex: 1 1;
  min-height: 0;
  height: 100%;
}

.contact-offer-card {
  display: flex;
  align-items: center;
  gap: 1.05vw;
  padding: 1.04vw;
  background: rgba(255, 255, 255, 1);
  border-radius: 1vw;
  border: 1px solid #EBEBEB;
  flex: 1 1;
  min-height: 0;
}

.contact-offer-icon {
  width: 3.1vw;
  height: 3.1vw;
  background: rgba(17, 47, 85, 1);
  border-radius: 0.36vw;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.contact-offer-icon svg {
  width: 1.05vw;
  height: 1.05vw;
  object-fit: contain;
}

.contact-offer-icon-large svg {
  width: 1.62vw;
  height: 1.62vw;
  object-fit: contain;
}

.contact-offer-text {
  flex: 1 1;
  font-size: var(--font-size-body);
  font-weight: 500;
  color: rgba(26, 26, 26, 0.75);
  line-height: 1.5vw;
  text-align: left;
  font-family: 'Geist', sans-serif;
}

.contact-offer-checkbox {
  width: 2.34vw;
  height: 2.34vw;
  border-radius: 0.26vw;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  border: 0.13vw solid rgba(235, 235, 235, 1);
  background: white;
  box-sizing: border-box;
}

.contact-offer-checkbox.checked {
  background-color: rgba(72, 91, 133, 1);
  border: 0.13vw solid rgba(235, 235, 235, 1);
}

.contact-offer-checkbox svg {
  width: 0.55vw;
  height: 0.44vw;
}

/* Стили для инпутов */
.contact-inputs-section {
  display: flex;
  gap: 1.56vw; /* Расстояние 30px */
}

.contact-input {
  width: 100%;
  height: 4.17vw; /* Высота 80px */
  padding: 0 1.04vw; /* Отступы 20px */
  border: 0.052vw solid rgba(235, 235, 235, 1); /* Бордер 1px */
  border-radius: 1.04vw; /* Радиус 20px */
  font-size: var(--font-size-body);
  font-family: 'Geist', sans-serif;
  color: rgba(26, 26, 26, 0.75);
  background: white;
  box-sizing: border-box;
  outline: none;
  transition: border-color 0.3s ease;
}

.contact-input::placeholder {
  color: rgba(26, 26, 26, 0.5);
}

.contact-input:focus {
  border-color: #485B85;
}

.contact-input:-webkit-autofill,
.contact-input:-webkit-autofill:hover,
.contact-input:-webkit-autofill:focus,
.contact-input:-webkit-autofill:active {
  -webkit-box-shadow: 0 0 0 30px white inset !important;
  -webkit-text-fill-color: rgba(26, 26, 26, 0.75) !important;
  background-color: white !important;
  background: white !important;
}

.contact-phone-input-wrapper {
  display: flex;
  align-items: center;
  width: 100%;
  height: 4.17vw; /* Высота 80px */
  border: 0.052vw solid rgba(235, 235, 235, 1); /* Бордер 1px */
  border-radius: 1.04vw; /* Радиус 20px */
  overflow: hidden;
  background: white;
  transition: border-color 0.3s ease;
  box-sizing: border-box;
}

.contact-phone-input-wrapper:focus-within {
  border-color: #485B85;
}

.contact-phone-prefix {
  display: flex;
  align-items: center;
  gap: 0.52vw;
  padding: 0 1.04vw; /* Отступ 20px */
  background: white;
  flex-shrink: 0;
  position: relative;
  height: 100%;
}

.contact-phone-prefix::after {
  content: '';
  position: absolute;
  right: 0;
  top: 1vw;
  bottom: 1vw;
  width: 0.052vw;
  background: rgba(235, 235, 235, 1);
}

.contact-phone-prefix svg {
  width: 1.04vw;
  height: 0.78vw;
  flex-shrink: 0;
}

.contact-phone-prefix span {
  font-size: var(--font-size-body);
  font-family: 'Geist', sans-serif;
  color: rgba(25, 25, 25, 1);
  font-weight: 500;
}

.contact-phone-input {
  flex: 1 1;
  border: none;
  border-radius: 0;
  padding: 0 1.04vw; /* Отступ 20px */
  height: 100%;
}

.contact-phone-input:focus {
  border: none;
  outline: none;
}

.contact-phone-input:-webkit-autofill,
.contact-phone-input:-webkit-autofill:hover,
.contact-phone-input:-webkit-autofill:focus,
.contact-phone-input:-webkit-autofill:active {
  -webkit-box-shadow: 0 0 0 30px white inset !important;
  -webkit-text-fill-color: rgba(26, 26, 26, 0.75) !important;
  background-color: white !important;
  background: white !important;
}

/* Стили для чекбокса */
.contact-form-checkbox {
  display: flex;
  align-items: center;
  gap: 0.53vw;
  justify-content: flex-start;
  width: 100%;
}

.contact-form-checkbox input[type="checkbox"] {
  width: 0.78vw;
  height: 0.78vw;
  border-radius: 0.2vw;
  border: 0.052vw solid #EBEBEB;
  background: #EBEBEB;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  position: relative;
  flex-shrink: 0;
}

.contact-form-checkbox input[type="checkbox"]:checked {
  background: rgba(72, 91, 133, 1);
  border-color: rgba(46, 61, 88, 1);
}

.contact-form-checkbox input[type="checkbox"]:checked::after {
  content: '';
  position: absolute;
  left: 50%;
  top: 50%;
  width: 0.12vw;
  height: 0.38vw;
  border: solid white;
  border-width: 0 0.16vw 0.16vw 0;
  transform: translate(-50%, -60%) rotate(45deg);
}

.contact-form-checkbox label {
  font-size: var(--font-size-body-small);
  font-weight: 400;
  color: #666666;
  font-family: 'Geist', sans-serif;
  cursor: pointer;
}

@media (max-width: 2200px) {
  .contact-container {
    padding: 0 2.6vw;
  }
}

.kvis-privacy-link {
  color: rgba(26, 26, 26, 0.75);
  text-decoration: underline;
  cursor: pointer;
}

.kvis-privacy-link:hover {
  text-decoration: underline;
  color: rgba(26, 26, 26, 1);
}

@media (max-width: 780px) {
  .contact {
    padding-top: 12.82vw;
    padding-bottom: 12.82vw;
  }

  .contact-title {
    width: 100%;
    font-size: 5.77vw;
    font-weight: 700;
    line-height: 8.33vw;
    margin-bottom: 8.97vw;
  }

  .contact-title span {
    text-decoration-thickness: 0.26vw;
    text-underline-offset: 0.64vw;
  }

  .contact-form-wrapper {
    display: flex;
    flex-direction: column;
    gap: 0;
    grid-template-columns: 1fr;
    border-radius: 2.56vw;
    padding: 2.56vw;
  }

  .contact-left-section {
    order: 1;
    width: 100%;
    gap: 6.41vw;
  }

  .contact-right {
    order: 2;
    width: 100%;
    max-width: 100%;
    grid-column: 1;
  }

  .contact-top-section {
    flex-direction: column;
    gap: 0;
    width: 100%;
  }

  .contact-form-image {
    order: 1;
    width: 100%;
    margin-left: 0;
    margin-bottom: 3.85vw;
    border-radius: 1.92vw;
    height: 85.26vw;
    overflow: hidden;
  }

  .contact-form-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .contact-top-content {
    order: 2;
    width: 100%;
  }

  .contact-form-bottom {
    width: 100%;
    gap: 2.56vw;
  }

  .contact-inputs-section {
    flex-direction: column;
    gap: 3.85vw;
  }

  .contact-input.contact-name-input {
    order: 1;
  }

  .contact-phone-input-wrapper {
    order: 2;
  }

  .contact-input.contact-name-input {
    height: 12.82vw;
    padding: 0 3.85vw;
    font-size: 2.82vw;
    border-radius: 2.56vw;
  }

  .contact-phone-prefix {
    height: 100%;
    padding: 0 3.85vw;
    gap: 1.92vw;
  }

  .contact-phone-prefix span {
    font-size: 2.31vw;
    line-height: 3.59vw;
  }

  .contact-phone-prefix svg {
    width: 3.21vw;
    height: 2.18vw;
  }

  .contact-input.contact-phone-input {
    height: 100%;
    padding: 0 3.85vw;
    font-size: 2.82vw;
    border-radius: 0;
  }

  .contact-phone-input-wrapper {
    height: 12.82vw;
    border-radius: 2.56vw;
  }

  .contact-form-checkbox {
    display: flex;
    align-items: center;
    gap: 0.68vw;
    justify-content: flex-start;
    width: 100%;
  }

  .contact-form-checkbox input[type="checkbox"] {
    width: 1.92vw;
    height: 1.92vw;
    border-radius: 0.26vw;
    border: 0.067vw solid #EBEBEB;
    background: #EBEBEB;
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    position: relative;
    flex-shrink: 0;
  }

  .contact-form-checkbox input[type="checkbox"]:checked {
    background: rgba(72, 91, 133, 1);
    border-color: rgba(46, 61, 88, 1);
  }

  .contact-form-checkbox input[type="checkbox"]:checked::after {
    content: '';
    position: absolute;
    left: 50%;
    top: 50%;
    width: 0.15vw;
    height: 0.49vw;
    border: solid white;
    border-width: 0 0.21vw 0.21vw 0;
    transform: translate(-50%, -60%) rotate(45deg);
  }

  .contact-form-checkbox label {
    font-size: 2.31vw;
    line-height: 3.59vw;
    font-weight: 400;
    color: #666666;
    font-family: 'Geist', sans-serif;
    cursor: pointer;
    text-align: left;
  }

  .contact-promo-text {
    font-size: 3.46vw;
    line-height: 4.49vw;
  }

  .contact-top-content {
    gap: 2.56vw;
  }

  .contact-offer-card {
    padding: 3.85vw 2.56vw;
    gap: 2.56vw;
    border-radius: 2.56vw;
  }

  .contact-offer-icon {
    width: 7.69vw;
    height: 7.69vw;
    border-radius: 0.96vw;
  }

  .contact-offer-icon svg {
    width: 3.08vw;
    height: 3.08vw;
  }

  .contact-offer-icon-large svg {
    width: 3.85vw;
    height: 3.85vw;
  }

  .contact-offer-text {
    font-size: 2.56vw;
    line-height: 3.59vw;
  }

  .contact-offer-checkbox.checked {
    width: 5.13vw;
    height: 5.13vw;
    border-width: 0.32vw;
    border-radius: 0.90vw;
  }

  .contact-offer-checkbox.checked svg {
    width: 1.3vw;
    height: 1.45vw;
  }

  .contact-form-submit {
    gap: 2.56vw;
  }

  .contact-submit-btn.contact-btn-primary {
    font-size: 2.56vw;
    padding: 0.77vw 0.77vw 0.77vw 4.36vw;
    border-radius: 6.41vw;
    gap: 3.85vw;
    width: 46.79vw;
    box-sizing: border-box;
    margin-bottom: 12.82vw;
  }

  .contact-submit-btn.contact-btn-primary span {
    font-size: 2.56vw;
  }

  .contact-btn-icon {
    width: 8.72vw;
    height: 8.72vw;
    margin-left: auto;
  }

  .contact-btn-icon svg {
    width: 2.56vw;
    height: 2.18vw;
  }

  .contact-submit-btn::after {
    right: 0.77vw;
    width: 8.72vw;
    height: 8.72vw;
  }

  .contact-submit-btn:hover::after {
    width: 102.56vw;
    height: 102.56vw;
    right: -51.28vw;
  }

  .contact-submit-btn:hover .contact-btn-icon svg {
    transform: translateX(max(-36.7vw, calc(-10% - 40.56vw))) rotate(40deg);
  }

  .contact-submit-btn.contact-btn-primary:hover span {
    transform: translateX(max(11.7vw, calc(-10% - 30.56vw)));
  }

  .contact-right {
    border-radius: 2.56vw;
    padding: 2.56vw 6.41vw;
    gap: 3.85vw;
  }

  .contact-right-title {
    font-size: 4.49vw;
    line-height: 6.41vw;
  }

  .contact-info-cards {
    gap: 2.56vw;
  }

  .contact-info-card {
    border-radius: 2.56vw;
    padding: 3.21vw 2.56vw;
    gap: 2.56vw;
  }

  .contact-info-icon {
    width: 7.69vw;
    height: 7.69vw;
  }

  .contact-info-icon svg {
    width: 2.56vw;
    height: 2.56vw;
  }

  .contact-info-label {
    font-size: 2.56vw;
    line-height: 4.49vw;
  }

  .contact-info-value {
    font-size: 2.31vw;
    line-height: 4.49vw;
  }

  .contact-social-divider {
    margin-top: 5.13vw;
  }

  .contact-social-text {
    font-size: 2.18vw;
    line-height: 2.95vw;
  }

  .contact-social {
    gap: 3.85vw;
  }

  .contact-social-icon {
    width: 4.49vw;
    height: 4.49vw;
  }

  .contact-social-icon svg {
    width: 4.49vw;
    height: 4.49vw;
  }

  .contact-social-icons {
    gap: 5.13vw;
  }

  .contact-hours {
    font-size: 2.18vw;
    line-height: 2.95vw;
  }
}


.stoimost-container {
  width: 100%;
  padding: 0  10% 2.604vw 10%;
  box-sizing: border-box;
  background-color: #FFFFFF;
}

.stoimost-content {
  width: 100%;
  max-width: 100vw;
  margin: 0 auto;
  background: rgba(235, 235, 235, 1);
  border-radius: 1.042vw;
  padding: 0.521vw 0.781vw 0.521vw 2.604vw;
  display: flex;
  align-items: center;
  gap: 2.604vw;
  position: relative;
  overflow: hidden;
  min-width: 0;
}

.stoimost-woman-image {
  flex-shrink: 0;
  width: 18.021vw;
  height: 11.458vw;
  min-width: 14.583vw;
  max-width: 18.021vw;
  border-radius: 1.042vw;
  overflow: hidden;
  margin-left: -2.083vw;
  position: relative;
  z-index: 1;
  border: 0.15vw solid rgba(255, 255, 255, 1);
  transition: transform 0.3s ease;
}

.stoimost-woman-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 20%;
  display: block;
}

.stoimost-woman-image:hover {
  transform: translateX(3px);
}

.stoimost-text-block {
  flex: 1 1;
  display: flex;
  flex-direction: column;
  gap: 0.521vw;
  z-index: 2;
  min-width: 0;
}

.stoimost-title {
  text-align: left;
  font-size: var(--font-size-h5);
  font-weight: 700;
  color: #000000;
  margin: 0;
  line-height: 1.2;
  font-family: 'Geist', sans-serif;
}

.stoimost-description {
  text-align: left;
  font-size: var(--font-size-h8);
  font-weight: 300;
  color: #1A1A1ABF;
  margin: 0;
  line-height: 1.74vw;
  font-family: 'Geist', sans-serif;
}

.stoimost-button {
  padding: 0.313vw 0.313vw 0.313vw 1.563vw;
  border-radius: 2.604vw;
  border: 0.052vw solid #2E3D58;
  font-weight: 700;
  font-size: var(--font-size-button);
  line-height: 0.885vw;
  cursor: pointer;
  transition: all 0.3s ease;
  display: flex;
  align-items: center;
  gap: 1.563vw;
  font-family: 'Geist', sans-serif;
  position: relative;
  overflow: hidden;
  flex-shrink: 0;
}

.stoimost-btn-primary {
  background: #485B85;
  color: #FFFFFF;
}

.stoimost-btn-primary span {
  color: #FFFFFF;
  transition: color 0.3s ease, transform 0.8s cubic-bezier(0.4, 0, 0.2, 1);
  position: relative;
  z-index: 3;
}

.stoimost-btn-primary:hover span {
  color: #485B85;
  transform: translateX(3.567vw);
}

.stoimost-btn-icon {
  width: 3.125vw;
  height: 3.125vw;
  border-radius: 50%;
  background: #FFFFFF;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
  z-index: 2;
}

.stoimost-btn-icon svg {
  width: 0.73vw;
  height: 0.63vw;
  transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.stoimost-button:hover .stoimost-btn-icon svg {
  transform: translateX(-12.0vw) rotate(40deg);
}

.stoimost-button::after {
  content: '';
  position: absolute;
  right: 0.313vw;
  top: 50%;
  transform: translateY(-50%);
  width: 3.125vw;
  height: 3.125vw;
  border-radius: 50%;
  background: #FFFFFF;
  transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
  z-index: 0;
  pointer-events: none;
}

.stoimost-button:hover::after {
  width: 41.667vw;
  height: 41.667vw;
  right: -20.833vw;
  top: 50%;
  transform: translateY(-50%);
}

/* Эффект блика для кнопки */
.stoimost-button .flare {
  position: absolute;
  top: 0;
  height: 100%;
  width: 45px;
  transform: skewX(-45deg);
  animation: flareAnimation 3s infinite;
  left: -170%;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.9), #fff);
  filter: blur(0px);
  z-index: 1;
  pointer-events: none;
}

@keyframes flareAnimation {
  0% {
    left: -170%;
  }
  50% {
    left: 170%;
  }
  100% {
    left: 170%;
  }
}

@media (max-width: 2200px) { 
  .stoimost-container {
    padding: 0 2.6vw 4.2vw 2.6vw;
  }
}

@media (max-width: 780px) {
  .stoimost-container {
    padding-bottom: 12.82vw;
  }

  .stoimost-content {
    flex-direction: column;
    align-items: stretch;
    padding: 2.564vw;
    gap: 0;
    border-radius: 2.564vw;
  }

  .stoimost-woman-image {
    order: 1;
    width: 100%;
    height: 44.872vw;
    margin-left: 0;
    margin-bottom: 3.846vw;
    border-radius: 2.564vw;
    max-width: none;
    min-width: 0;
  }

  .stoimost-text-block {
    order: 2;
    gap: 0;
  }

  .stoimost-title {
    font-size: 5.0vw;
    line-height: 7.051vw;
    font-weight: 600;
    margin-bottom: 3.846vw;
  }

  .stoimost-description {
    font-size: 3.333vw;
    line-height: 5.128vw;
    margin-bottom: 3.846vw;
  }

  .stoimost-button {
    order: 3;
    width: 45.641vw;
    font-size: 2.179vw;
    border-radius: 19.231vw;
    padding: 0.77vw 0.77vw 0.77vw 3.21vw;
    justify-content: space-between;
    margin-left: auto;
  }

  .stoimost-btn-icon {
    width: 8.718vw;
    height: 8.718vw;
    border-radius: 19.231vw;
    margin-left: auto;
  }

  .stoimost-btn-icon svg {
    width: 2.051vw;
    height: 1.667vw;
  }

  .stoimost-button::after {
    right: 0.77vw;
    width: 8.718vw;
    height: 8.718vw;
    border-radius: 19.231vw;
  }

  .stoimost-button:hover::after {
    width: 120vw;
    height: 120vw;
    right: -60vw;
  }

  .stoimost-btn-primary:hover span {
    transform: translateX(8.974vw);
  }

  .stoimost-button:hover .stoimost-btn-icon svg {
    transform: translateX(-35.521vw) rotate(40deg);
  }
}
.why-choose-us-container {
  width: 100%;
  padding: 2.604vw 10%;
  box-sizing: border-box;
  background-color: #FFFFFF;
  display: flex;
  flex-direction: column;
  gap: 0;
}

.why-choose-us-title-top {
  display: none;
}

.why-choose-us-content {
  /* max-width: 1920px; */
  margin: 0 auto;
  width: 100%;
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-gap: 2.604vw;
  gap: 2.604vw;
  align-items: stretch;
  box-sizing: border-box;
}

.why-choose-us-left {
  display: flex;
  flex-direction: column;
  gap: 4.948vw;
  height: 100%;
}

.why-choose-us-left-content {
  display: flex;
  flex-direction: column;
  flex: 1 1;
  min-height: 0;
}

.why-choose-us-title {
  font-size: var(--font-size-h1);
  font-weight: 700;
  color: #000000;
  margin: 0;
  line-height: 1.2;
  font-family: 'Geist', sans-serif;
  text-align: left;
  margin-bottom: 2.604vw;
}

.why-choose-us-title-highlight {
  color: #485B85;
  text-decoration: underline;
  text-decoration-thickness: 0.156vw;
  text-underline-offset: 0.26vw;
}

.why-choose-us-items {
  display: flex;
  justify-content: center;
  flex-direction: column;
  flex: 1 1;
}

.why-choose-us-item {
  display: flex;
  align-items: center;
  padding: 1.563vw 0;
  gap: 1.563vw;
}

.why-choose-us-item:first-child {
  border-top: 0.052vw solid rgba(26, 26, 26, 0.3);
}

.why-choose-us-item-dots {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  margin-top: 0.26vw;
}

.why-choose-us-item-number {
  color: rgba(17, 47, 85, 1);
  font-size: var(--font-size-h1);
  font-weight: 700;
  line-height: 1;
  font-family: 'Geist', sans-serif;
}

.why-choose-us-item-content {
  flex: 1 1;
  display: flex;
  flex-direction: column;
  gap: 0.417vw;
}

.why-choose-us-item-title {
    text-align: left;
  font-size: var(--font-size-h6);
  font-weight: 500;
  color: rgba(25, 25, 25, 1);
  margin: 0;
  line-height: 1.3;
  font-family: 'Geist', sans-serif;
}

.why-choose-us-item-description {
  text-align: left;
  font-size: var(--font-size-h8);
  font-weight: 300;
  color: #1A1A1ABF;
  margin: 0;
  line-height: 1.6;
  font-family: 'Geist', sans-serif;
}

.why-choose-us-item-arrow {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  margin-top: 0.26vw;
}

.why-choose-us-item-arrow svg {
  width: 1.25vw;
  height: 1.042vw;
  transition: transform 0.3s ease;
}

.why-choose-us-item:hover .why-choose-us-item-arrow svg {
  transform: rotate(40deg);
}

.why-choose-us-right {
  display: flex;
  gap: 0.5vw;
  align-items: flex-end;
  height: 100%;
  /* width: 46.146vw; */
  flex-shrink: 0;
  box-sizing: border-box;
  overflow: hidden;
}

.why-choose-us-image {
  flex: 1 1;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  border-radius: 0.5vw;
  display: block;
  object-fit: cover;
  object-position: center center;
  box-sizing: border-box;
}

.why-choose-us-image-first-wrapper {
  flex: 1 1;
  height: 45.208vw;
  overflow: hidden;
  border-radius: 0.5vw;
  border: 0.062vw solid rgba(25, 25, 25, 1);
  position: relative;
}

.why-choose-us-image-first {
  height: 45.208vw;
  border: none;
}

.why-choose-us-image.why-choose-us-image-first {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: right center;
}

.why-choose-us-image-second-wrapper {
  flex: 1 1;
  height: 42.708vw;
  overflow: hidden;
  border-radius: 0.5vw;
  border: 0.062vw solid rgba(25, 25, 25, 1);
  position: relative;
}

.why-choose-us-image-second {
  height: 42.708vw;
  border: none;
  object-position: center 92%;
}

.why-choose-us-image.why-choose-us-image-second {
  width: 100%;
  height: 100%;
  transform: scale(1);
  transform-origin: center center;
}

.why-choose-us-item-divider {
  height: 0.052vw;
  background: rgba(26, 26, 26, 0.3);
  margin: 0;
  /* transform: scaleY(0.5); */
  transform-origin: center;
  width: 100%;
}

/* .why-choose-us-title {
  font-size: var(--font-size-h1);
} */

@media (max-width: 2200px) {
  .why-choose-us-container {
    padding: 2.604vw;
  }
}

@media (max-width: 780px) {
  .why-choose-us-container {
    padding: 12.82vw 2.6vw 6.41vw 2.6vw;
  }

  .why-choose-us-title.why-choose-us-title-top {
    width: 100%;
    font-size: 5.77vw;
    font-weight: 700;
    line-height: 8.33vw;
    margin-bottom: 6.41vw;
  }

  .why-choose-us-title-highlight {
    text-decoration-thickness: 0.26vw;
    text-underline-offset: 0.64vw;
  }

  .why-choose-us-content {
    display: flex;
    flex-direction: column;
    gap: 0;
  }

  .why-choose-us-right {
    order: 1;
    height: 105.13vw;
    gap: 1.28vw;
    margin-bottom: 6.41vw;
  }

  .why-choose-us-image-first-wrapper {
    /* flex: none; */
    height: 97.9vw;
    border-radius: 1.28vw;
  }

  .why-choose-us-image-second-wrapper {
    /* flex: none; */
    height: 105.0vw;
    border-radius: 1.28vw;
  }

  /* .why-choose-us-image-first {
    height: 52.56vw;
  }

  .why-choose-us-image-second {
    height: 52.56vw;
  } */

  .why-choose-us-left {
    order: 2;
  }

  .why-choose-us-item {
    padding: 3.85vw 0;
    gap: 3.85vw;
  }

  .why-choose-us-item-number {
    font-size: 5.77vw;
  }

  .why-choose-us-item-title {
    font-size: 3.59vw;
  }

  .why-choose-us-item-content {
    gap: 1.28vw;
  }

  .why-choose-us-item-description {
    font-size: 3.85vw;
  }

  .why-choose-us-item-arrow svg {
    width: 3.21vw;
    height: 2.56vw;
  }
}

@media (min-width: 2200px) {
  .why-choose-us-image.why-choose-us-image-first {
    transform: translateX(-0%);
  }
  
  .why-choose-us-image.why-choose-us-image-second {
    transform: scale(1.2) translate(8%, -4%);
  }
}

.smiles-container {
  width: 100%;
  /* max-width: 105.208vw; */
  margin: 0 auto;
  padding: 4.167vw 10%;
  box-sizing: border-box;
  background-color: #FFFFFF;
}

.smiles-title {
  text-align: left;
  font-size: var(--font-size-h1);
  font-weight: 700;
  color: #000000;
  margin: 0 0 2.604vw 0;
  line-height: 1.2;
  font-family: 'Geist', sans-serif;
}


/* Контейнеры для блоков Проблема / Решение */
.smiles-problem,
.smiles-solution {
  text-align: left;
  display: flex;
  flex-direction: column;
  gap: 0.5vw;
  align-items: flex-start;
}

/* ГЛАВНЫЙ КЛАСС ДЛЯ ЭФФЕКТА: обрезает всё, что падает вниз */
.smiles-text-line {
  position: relative;
  overflow: hidden;
  width: 13.021vw;
  display: block; /* Блок жестко облегает текст по высоте */
}

/* Обертка для строк описания, чтобы они шли слитно */
.smiles-text-group {
  display: flex;
  flex-direction: column;
}

/* Заголовок (вместо старого strong) */
.smiles-text-title {
  font-size: var(--font-size-h5);
  font-weight: 700;
  color: rgba(17, 47, 85, 1);
  font-family: 'Geist', sans-serif;
  margin: 0;
  display: block;
  width: 100%;
}

/* Текст описания (вместо старого p и span) */
.smiles-text-desc {
  width: 100%;
  font-size: var(--font-size-body);
  font-weight: 300;
  color: #1A1A1ABF;
  margin: 0;
  line-height: 1.6;
  font-family: 'Geist', sans-serif;
  display: block;
}

.smiles-title-highlight {
  color: #485B85;
  text-decoration: underline;
  text-decoration-thickness: 0.156vw;
  text-underline-offset: 0.26vw;
}

.smiles-content {
  display: grid;
  grid-template-columns: 73% 27%;
  height: 41.667vw;
  grid-gap: 1.563vw;
  gap: 1.563vw;
  align-items: stretch;
}

.smiles-panel {
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

/* Левая панель */
.smiles-panel-left {
  background: #EBEBEB;
  border-radius: 1.563vw;
  padding: 1.563vw;
  display: flex;
  flex-direction: column;
  height: 100%;
}

.smiles-main-content {
  display: flex;
  /* gap: 1.042vw; */
  align-items: stretch;
  /* margin-bottom: 20px; */
  flex: 1 1;
  min-height: 0;
}

.smiles-panel-right {
  background: #FFFFFF;
  border-radius: 1.042vw;
  padding: 0;
  margin-right: 1.563vw;
}

.smiles-top-section {
  display: flex;
  gap: 2.448vw;
  align-items: stretch;
  flex: 0 0 62%;
  min-height: 0;
}

/* Карусель */
.smiles-carousel-wrapper {
  display: flex;
  align-items: center;
  gap: 1.563vw;
  flex: 0 0 50%;
  height: 100%;
}

.smiles-carousel {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
  border-radius: 1.563vw;
}

.smiles-carousel-slides {
  display: flex;
  height: 100%;
}

.smiles-carousel-slide {
  width: 100%;
  min-width: 100%;
  height: 100%;
  flex-shrink: 0;
}

.smiles-carousel-slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: opacity 0.3s ease-in-out;
  display: block;
}

.smiles-carousel-dots-wrapper {
  position: relative;
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  padding: 0.208vw 0;
}

.smiles-carousel-line {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  width: 0.417vw;
  background: linear-gradient(180deg, #485B85 0%, rgba(72, 91, 133, 0.8) 100%);
  border-radius: 0.104vw;
  z-index: 0;
  pointer-events: none;
  box-shadow: 0 0 0.208vw rgba(72, 91, 133, 0.3);
  opacity: 0;
}

.smiles-carousel-line-animating {
  animation: slideLine 0.8s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

@keyframes slideLine {
  0% {
    top: 0.521vw;
    top: var(--prev-top, 0.521vw);
    opacity: 1;
  }
  100% {
    top: 0.521vw;
    top: var(--current-top, 0.521vw);
    opacity: 1;
  }
}

.smiles-carousel-dots {
  display: flex;
  flex-direction: column;
  gap: 0.26vw;
  position: relative;
  z-index: 2;
}

.smiles-carousel-dot {
  width: 0.26vw;
  height: 0.26vw;
  border-radius: 50%;
  border: none;
  background: rgba(0, 0, 0, 0.3);
  cursor: pointer;
  transition: all 0.3s ease;
  padding: 0;
  position: relative;
  z-index: 2;
}

.smiles-carousel-dot.active {
  background: #000000;
  height: 0.521vw;
}

.smiles-panel-text {
  display: flex;
  flex-direction: column;
  gap: 0.781vw;
  flex: 0 0 39%;
  justify-content: space-between;
  /* min-height: 100%; */
}

.smiles-text-content {
  display: flex;
  flex-direction: column;
  gap: 2.6vw;
  flex: 1 1;
  justify-content: center;
}



.smiles-problem strong,
.smiles-solution strong {
  font-size: var(--font-size-h5);
  font-weight: 700;
  color: rgba(17, 47, 85, 1);
  font-family: 'Geist', sans-serif;
  position: relative;
  display: block;
}




.smiles-problem p,
.smiles-solution p {
  width: 13.021vw;
  font-size: var(--font-size-body);
  font-weight: 300;
  color: #1A1A1ABF;
  margin: 0;
  line-height: 1.6;
  font-family: 'Geist', sans-serif;
  position: relative;
  display: block;
}

.smiles-text-span {
  display: block;
  position: relative;
}


.smiles-navigation {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.781vw;
  margin-top: auto;
}

.smiles-nav-btn {
  width: 3.13vw;
  height: 3.13vw;
  border-radius: 50%;
  border: 0.052vw solid rgba(0, 0, 0, 0.2) !important;
  background: #FFFFFF !important;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.3s ease;
  padding: 0;
  position: relative;
}

.smiles-nav-btn:hover {
  transform: scale(1.08) !important;
  box-shadow: 0 0.2vw 0.5vw rgba(0,0,0,0.08) !important;
  background: #FFFFFF !important; /* Запрещаем синий фон */
}

.smiles-nav-btn:active {
  transform: scale(0.95) !important;
}

.smiles-nav-btn:hover .smiles-nav-arrow path,
.smiles-nav-btn:hover svg:not(.smiles-nav-progress):not(.smiles-nav-arrow) path {
  stroke: #1A1A1A !important;
  stroke-opacity: 0.75 !important;
}

.smiles-nav-btn:hover .smiles-nav-arrow path {
  stroke: #FFFFFF;
  stroke-opacity: 1;
}

.smiles-nav-btn:hover .smiles-nav-progress circle:nth-child(2) {
  stroke: #ffffff !important;
}

.smiles-nav-btn:hover .smiles-nav-progress circle:first-child {
  stroke: #485B85 !important;
}

.smiles-nav-progress {
  position: absolute;
  top: 0;
  left: 0;
  width: 3.125vw;
  height: 3.125vw;
  z-index: 2;
}

.smiles-nav-progress circle {
  transition: stroke 0.3s ease;
  stroke-width: 0.104vw !important;
}

.smiles-nav-arrow {
  position: relative;
  z-index: 1;
  width: 0.521vw;
  height: 0.781vw;
}

.smiles-nav-arrow path {
  transition: stroke 0.3s ease, stroke-opacity 0.3s ease;
}

.smiles-nav-btn svg:not(.smiles-nav-progress):not(.smiles-nav-arrow) {
  width: 0.521vw;
  height: 0.781vw;
}

.smiles-nav-btn svg:not(.smiles-nav-progress):not(.smiles-nav-arrow) path {
  transition: stroke 0.3s ease, stroke-opacity 0.3s ease;
}

.smiles-slide-counter {
  font-size: var(--font-size-body);
  font-weight: 500;
  color: #2E3D58;
  font-family: 'Geist', sans-serif;
}

.smiles-mouth-section {
  display: flex;
  flex-direction: column;
  gap: 0;
  flex: 0 0 38%;
  align-self: center;
  margin-left: auto;
  margin-right: auto;
  height: auto;
  background-color: rgba(255, 255, 255, 0.65);
  border-radius: 1vw;
  padding: 0.5vw;
}

.smiles-mouth-section-content {
  background-color: #ffffff;
  border-radius: 0.5vw;
  padding: 0.5vw 0.5vw 1vw 0.5vw;
}

.smiles-mouth-images {
  display: flex;
  flex-direction: column;
  gap: 0.25vw;
  margin-bottom: 1.85vw;
  padding: 0.25vw;
  background-color: #000000;
  border-radius: 0.25vw;
}

.smiles-mouth-before,
.smiles-mouth-after {
  /* width: 475px; */
  height: 11.021vw;
  border-radius: 0.8vw;
  border: 0.05vw solid rgba(255, 255, 255, 0.4);
  overflow: hidden;
  flex-shrink: 0;
}

.smiles-mouth-before img,
.smiles-mouth-after img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.smiles-panel-info {
  display: flex;
  flex-direction: column;
  gap: 0.417vw;
  margin-top: 0;
}

.smiles-panel-info-main {
  padding: 0 1.083vw;
  font-size: 0.99vw;
  font-weight: 500;
  color: #000000;
  margin: 0;
  line-height: 1.4vw;
  letter-spacing: 0%;
  text-align: center;
  font-family: 'Geist', sans-serif;
}

.smiles-panel-info-small {
  padding: 0 2.083vw;
  font-size: var(--font-size-body);
  font-weight: 300;
  color: #1A1A1ABF;
  margin: 0;
  line-height: 100%;
  letter-spacing: 0%;
  text-align: center;
  font-family: 'Geist', sans-serif;
}

.smiles-panel-right-image-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
}

.smiles-panel-right img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.googing-play-button {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 4.17vw;
  height: 4.17vw;
  background: #FFFFFF;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 10;
  transition: transform 0.3s ease;
  box-sizing: content-box;
}

.googing-play-button::before {
  content: "";
  position: absolute;
  z-index: 0;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  display: block;
  width: 4.17vw;
  height: 4.17vw;
  background: #FFFFFF;
  border-radius: 50%;
  animation: pulse-border 1500ms ease-out infinite;
}

.googing-play-button::after {
  content: "";
  position: absolute;
  z-index: 1;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  display: block;
  width: 4.17vw;
  height: 4.17vw;
  background: #FFFFFF;
  border-radius: 50%;
  transition: all 200ms;
}

.googing-play-button:hover::after {
  background-color: #f5f5f5;
}

.googing-play-button:hover {
  transform: translate(-50%, -50%) scale(1.1);
}

.googing-play-button svg {
  width: 1.16vw;
  height: 1.4vw;
  transform: translateX(0.1vw);
  position: relative;
  z-index: 3;
}

@keyframes pulse-border {
  0% {
    transform: translate(-50%, -50%) translateZ(0) scale(1);
    opacity: 1;
  }
  100% {
    transform: translate(-50%, -50%) translateZ(0) scale(1.5);
    opacity: 0;
  }
}

@media (max-width: 2200px) {
  .smiles-container {
    padding: 4.167vw 2.604vw;
  }
}

@media (max-width: 780px) {
  .smiles-container {
    padding: 12.821vw 2.6vw 0 2.6vw;
  }

  .smiles-title {
    width: 100%;
    font-size: 5.77vw;
    font-weight: 700;
    line-height: 8.33vw;
    margin-bottom: 6.41vw;
  }

  .smiles-title-highlight {
    text-decoration-thickness: 0.26vw;
    text-underline-offset: 0.64vw;
  }

  .smiles-content {
    display: flex;
    flex-direction: column;
    height: auto;
    gap: 0;
  }

  .smiles-panel-left {
    display: flex;
    flex-direction: column;
    order: 1;
    border-radius: 2.564vw;
  }

  .smiles-panel-right {
    order: 2;
    margin-right: 0;
    margin-top: 3.846vw;
  }

  .smiles-panel-right-image-wrapper {
    height: 115.38vw;
    border-radius: 2.56vw;
    overflow: hidden;
  }

  .smiles-panel-right-image-wrapper .googing-play-button {
    width: 15.38vw;
    height: 15.38vw;
    box-sizing: content-box;
  }

  .smiles-panel-right-image-wrapper .googing-play-button::before,
  .smiles-panel-right-image-wrapper .googing-play-button::after {
    width: 15.38vw;
    height: 15.38vw;
  }

  .smiles-panel-right-image-wrapper .googing-play-button svg {
    width: 3.46vw;
    height: 4.36vw;
  }

  .smiles-main-content {
    display: flex;
    flex-direction: column;
    gap: 0;
  }

  .smiles-top-section {
    display: flex;
    flex-direction: column;
    flex: none;
    gap: 0;
  }

  .smiles-carousel-wrapper {
    order: 1;
    flex: none;
    height: auto;
    width: 100%;
    flex-direction: column;
    gap: 6.41vw;
    align-items: stretch;
  }

  .smiles-carousel {
    border-radius: 2.564vw;
    height: 120vw;
    min-height: 115vw;
    overflow: hidden;
  }

  .smiles-carousel-slides {
    height: 100%;
    width: 100%;
  }

  .smiles-carousel-slide {
    width: 100%;
    min-width: 100%;
    height: auto;
    min-height: 115vw;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .smiles-carousel-slide img {
    width: 100%;
    height: auto;
    min-height: 115vw;
    object-fit: contain;
    object-position: center;
    display: block;
  }

  .smiles-carousel-dots-wrapper {
    position: static;
    transform: none;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 0;
    width: 100%;
    margin-bottom: 3.846vw;
  }

  .smiles-carousel-dots {
    display: flex;
    flex-direction: row;
    gap: 0.64vw;
  }

  .smiles-carousel-dot {
    width: 0.77vw;
    height: 0.77vw;
    border-radius: 50%;
  }

  .smiles-carousel-dot.active {
    width: 2.05vw;
    height: 0.77vw;
    border-radius: 12.82vw;
  }

  .smiles-panel-text {
    order: 2;
    flex: none;
    display: flex;
    flex-direction: column;
  }

  .smiles-text-content {
    order: 1;
    margin-bottom: 3.846vw;
    gap: 6.41vw;
  }

  .smiles-problem,
  .smiles-solution {
    gap: 2.5vw; /* Аккуратный отступ между заголовком и текстом */
  }

  /* Защита от тормозов и обрезания букв на телефонах */
  .smiles-text-line {
    width: 100%;
    /* Форсируем аппаратное ускорение (GPU) для телефонов: */
    will-change: transform, opacity;
    transform: translateZ(0);
    -webkit-transform: translateZ(0);
    /* Добавляем микро-отступ снизу, чтобы не обрезались хвостики у букв "р" и "у": */
    padding-bottom: 1vw; 
    margin-bottom: -1vw; /* Компенсируем отступ, чтобы верстка не съехала */
  }
 

  .smiles-problem strong,
  .smiles-solution strong {
    font-size: 4.487vw;
  }

 .smiles-text-title {
    font-size: 5.5vw !important; 
    line-height: 1.2 !important;
  }
  .smiles-problem p,
  .smiles-solution p {
    width: 100%;
  }

  .smiles-text-span {
    font-size: 3.333vw;
  }

  .smiles-text-desc {
    font-size: 3.8vw !important; 
    line-height: 1.4 !important;
    width: 100% !important;
    color: #1A1A1ABF !important;
    white-space: normal !important;
  }

 .smiles-navigation {
    order: 2;
    margin-top: 0;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    width: 100%;
    gap: 2.5vw;
  }

  smiles-nav-btn {
    width: 9.359vw;
    height: 9.359vw;
    /* ВАЖНО: возвращаем границу, так как круга загрузки больше нет */
    border: 0.2vw solid rgba(0, 0, 0, 0.2) !important; 
    background: #FFFFFF !important;
    position: relative;
  }

  .smiles-nav-progress {
    display: none !important; /* Жестко скрываем кольцо прогресса, если оно там осталось */
  }

  .smiles-nav-arrow {
    width: 2.051vw;
    height: 3.077vw;
  }

  .smiles-nav-btn svg:not(.smiles-nav-progress):not(.smiles-nav-arrow) {
    width: 2.051vw;
    height: 3.077vw;
  }

  .smiles-nav-btn svg,
  .smiles-nav-btn .smiles-nav-arrow {
    width: 2.2vw !important;
    height: 3.5vw !important;
    position: static !important;
  }

  .smiles-nav-btn {
    width: 10.5vw !important;
    height: 10.5vw !important;
    border-radius: 50% !important;
    border: 0.25vw solid rgba(0, 0, 0, 0.08) !important; /* Аккуратная серая рамка */
    background: #FFFFFF !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    position: relative;
    padding: 0 !important;
    transition: transform 0.3s ease !important; /* Анимация нажатия */
  }

  .smiles-nav-btn:active {
    transform: scale(0.95) !important;
  }

  .smiles-slide-counter {
    font-size: 3.6vw;
    font-weight: 400;
    color: #1A1A1A;
    margin-right: 1.5vw;
  }

  .smiles-mouth-section {
    order: 3;
    flex: none;
    margin: 0;
    margin-bottom: 3.846vw;
    margin-top: 5vw;
    border-radius: 1.282vw;
    padding: 1.28vw;
    width: 100%;
  }

  .smiles-panel-info {
    gap: 1.282vw;
  }

  .smiles-panel-info-main {
    padding: 0 1.385vw;
    font-size: 4.487vw;
    font-weight: 700;
    line-height: 6.41vw;
    text-align: left;
  }

  .smiles-mouth-section-content {
    border-radius: 0.641vw;
    padding: 1.03vw;
    width: 100%;
    /* margin-top: 10vw; */
  }

  .smiles-mouth-images {
    gap: 1.28vw;
    margin-bottom: 2.372vw;
    padding: 1.28vw;
    border-radius: 1.28vw;
    width: 100%;
  }

  .smiles-mouth-before,
  .smiles-mouth-after {
    width: 100%;
    height: 45.513vw;
    border-radius: 1.026vw;
    border: 0.064vw solid rgba(255, 255, 255, 0.4);
  }

  .smiles-panel-info-small {
    padding: 0 1.385vw;
    font-size: 3.333vw;
    text-align: left;
  }

  
}
.medicated-sleep {
    width: 100%;
    background: rgba(235, 235, 235, 1);
    padding: 4.17vw 0;
}

.medicated-sleep-container {
    width: 100%;
    max-width: 105.21vw;
    margin: 0 auto;
}

.medicated-sleep-container {
    width: 100%;
    padding: 0;
}

.medicated-sleep-header {
    margin-bottom: 3.13vw;
    padding: 0 10%;
}

.medicated-sleep-title {
    font-size: var(--font-size-h1);
    font-weight: 600;
    line-height: 3.39vw;
    color: #000000;
    text-align: left;
    text-transform: uppercase;
    margin-bottom: 1.56vw;
}

.medicated-sleep-title span {
    color: #485B85;
    text-decoration: underline;
    -webkit-text-decoration-color: #485B85;
            text-decoration-color: #485B85;
    text-decoration-thickness: 0.16vw;
    text-underline-offset: 0.34vw;
}

.medicated-sleep-description {
    font-family: 'Geist', sans-serif;
    font-size: 1.146vw; /* 22px */
    font-weight: 300;
    line-height: 1.719vw; /* 33px */
    letter-spacing: 0%;
    color: rgba(26, 26, 26, 0.75);
    text-align: left;
    width: 95%;
}
.medicated-sleep-content {
    display: flex;
    align-items: stretch;
    justify-content: space-between;
    gap: 1.04vw;
    width: 100%;
    padding: 0 10%;
}

.medicated-sleep-cards-left,
.medicated-sleep-cards-right {
    display: flex;
    flex-direction: column;
    gap: 1.04vw;
    flex: 1 1;
    min-width: 0;
}

.medicated-sleep-center-image {
    flex: 1 1;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 0;
}

.medicated-sleep-center-image img {
    width: 100%;
    height: 100%;
    max-height: 100%;
    border-radius: 1.04vw;
    object-fit: cover;
}

.medicated-sleep-card {
    background: #FFFFFF;
    border-radius: 1.04vw;
    padding: 1.56vw;
    display: flex;
    flex-direction: column;
    gap: 1.56vw;
    position: relative;
    flex: 1 1;
    min-height: 0;
}

.medicated-sleep-consultation {
    width: 100%;
    padding: 1.04vw 10% 0 10%;
    box-sizing: border-box;
    /* background-color: #EBEBEB; */
    margin-top: 0;
}

.medicated-sleep-consultation-content {
    background: #FFFFFF;
    border-radius: 1.04vw;
    padding: 0.52vw 2.6vw 0.52vw 1.56vw;
    display: flex;
    align-items: center;
    gap: 2.6vw;
    position: relative;
    overflow: hidden;
    min-width: 0;
}

.medicated-sleep-consultation-text-block {
    flex: 1 1;
    display: flex;
    flex-direction: column;
    gap: 0.52vw;
    z-index: 2;
    min-width: 0;
}

.medicated-sleep-consultation-title {
    text-align: left;
    font-size: 1.406vw;
    font-weight: 700;
    color: #000000;
    margin: 0;
    line-height: 1.2;
    font-family: 'Geist', sans-serif;
    text-transform: uppercase;
}

.medicated-sleep-consultation-description {
    text-align: left;
    font-size: var(--font-size-h8);
    font-weight: 300;
    color: #1A1A1ABF;
    margin: 0;
    line-height: 1.6;
    font-family: 'Geist', sans-serif;
}

.medicated-sleep-consultation-button {
    padding: 0.31vw 0.31vw 0.31vw 1.56vw;
    border-radius: 2.6vw;
    border: 0.052vw solid #2E3D58;
    font-weight: 700;
    font-size: var(--font-size-button);
    line-height: 0.89vw;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 1.56vw;
    font-family: 'Geist', sans-serif;
    position: relative;
    overflow: hidden;
    flex-shrink: 0;
}

.medicated-sleep-consultation-btn-primary {
    background: #485B85;
    color: #FFFFFF;
}

.medicated-sleep-consultation-btn-primary span {
    color: #FFFFFF;
    transition: color 0.3s ease, transform 0.8s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    z-index: 3;
}

.medicated-sleep-consultation-btn-primary:hover span {
    color: #485B85;
    transform: translateX(3.5vw);
}

.medicated-sleep-consultation-btn-icon {
    width: 3.13vw;
    height: 3.13vw;
    border-radius: 50%;
    background: #FFFFFF;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    position: relative;
    z-index: 2;
}

.medicated-sleep-consultation-btn-icon svg {
    width: 0.73vw;
    height: 0.63vw;
    transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Эффект блика для кнопки */
.medicated-sleep-consultation-button .flare {
    position: absolute;
    top: 0;
    height: 100%;
    width: 45px;
    transform: skewX(-45deg);
    animation: flareAnimation 3s infinite;
    left: -170%;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.9), #fff);
    filter: blur(0px);
    z-index: 1;
    pointer-events: none;
}

@keyframes flareAnimation {
    0% {
        left: -170%;
    }
    50% {
        left: 170%;
    }
    100% {
        left: 170%;
    }
}

.medicated-sleep-consultation-button:hover .medicated-sleep-consultation-btn-icon svg {
    transform: translateX(-11.9vw) rotate(40deg);
}

.medicated-sleep-consultation-button::after {
    content: '';
    position: absolute;
    right: 0.31vw;
    top: 50%;
    transform: translateY(-50%);
    width: 3.13vw;
    height: 3.13vw;
    border-radius: 50%;
    background: #FFFFFF;
    transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 0;
    pointer-events: none;
}

.medicated-sleep-consultation-button:hover::after {
    width: 41.67vw;
    height: 41.67vw;
    right: -20.83vw;
    top: 50%;
    transform: translateY(-50%);
}

.medicated-sleep-consultation-doctors-image {
    flex-shrink: 0;
    width: 30.36vw;
    height: 11.46vw;
    min-width: 14.58vw;
    max-width: 30.36vw;
    border-radius: 1.04vw;
    overflow: hidden;
    margin-right: -2.08vw;
    position: relative;
    z-index: 1;
    transition: transform 0.3s ease;
}

.medicated-sleep-consultation-doctors-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}

.medicated-sleep-consultation-doctors-image:hover {
    transform: translateX(-3px);
}

.medicated-sleep-card-icon {
    align-self: flex-start;
}

.medicated-sleep-card-icon svg {
    width: 1.67vw;
    height: 1.67vw;
}

.medicated-sleep-card-content {
    display: flex;
    flex-direction: column;
    gap: 0.52vw;
}

.medicated-sleep-card-title {
    font-family: 'Geist', sans-serif;
    font-size: 1.302vw; /* 25px */
    font-weight: 500;
    line-height: 100%;
    letter-spacing: 0%;
    color: rgba(25, 25, 25, 1);
    text-align: left;
    display: flex;
    align-items: center; /* Выравнивание по вертикали (Middle) */
}

.medicated-sleep-card-description {
    font-family: 'Geist', sans-serif;
    font-size: 1.146vw; /* 22px */
    font-weight: 300;
    line-height: 1.719vw; /* 33px */
    letter-spacing: 0%;
    color: rgba(26, 26, 26, 0.75);
    text-align: left;
}

.medicated-sleep-card-arrow {
    align-self: flex-end;
    margin-top: auto;
}

.medicated-sleep-card-arrow svg {
    width: 1.172vw;
    height: 0.938vw;
}

@media (max-width: 2200px) {
  .medicated-sleep-consultation {
    padding: 1.04vw 2.6vw 0 2.6vw;
  }
  .medicated-sleep-content {
    padding: 0 2.6vw;
  }
  .medicated-sleep-header {
    padding: 0 2.6vw;
  }
}

@media (max-width: 780px) {
  .medicated-sleep {
    padding: 12.82vw 0;
  }

  .medicated-sleep-title {
    width: 100%;
    font-size: 5.77vw;
    font-weight: 700;
    line-height: 8.33vw;
    margin-bottom: 3.85vw;
  }

  .medicated-sleep-title span {
    text-decoration-thickness: 0.26vw;
    text-underline-offset: 0.64vw;
  }

  .medicated-sleep-description {
    font-size: 3.33vw;
    line-height: 5.13vw;
  }

  .medicated-sleep-header {
    margin-bottom: 6.41vw;
  }

  .medicated-sleep-content {
    flex-direction: column;
    gap: 2.56vw;
  }

  .medicated-sleep-center-image {
    order: 1;
    flex: none;
    height: 44.87vw;
    border-radius: 2.56vw;
    overflow: hidden;
  }

  .medicated-sleep-center-image img {
    height: 100%;
    border-radius: 2.56vw;
  }

  .medicated-sleep-cards-left {
    order: 2;
    gap: 2.56vw;
  }

  .medicated-sleep-cards-right {
    order: 3;
    gap: 2.56vw;
  }

  .medicated-sleep-card {
    padding: 3.85vw;
    gap: 3.85vw;
    border-radius: 2.56vw;
  }

  .medicated-sleep-card-icon {
    width: 4.10vw;
    height: 4.10vw;
  }

  .medicated-sleep-card-icon svg {
    width: 4.10vw;
    height: 4.10vw;
  }

  .medicated-sleep-card-title {
    font-size: 3.59vw;
  }

  .medicated-sleep-card-content {
    gap: 1.28vw;
  }

  .medicated-sleep-card-description {
    font-size: 3.33vw;
    line-height: 5.13vw;
  }

  .medicated-sleep-card-arrow svg {
    width: 3.85vw;
    height: 3.08vw;
  }

  .medicated-sleep-consultation {
    padding-top: 6.41vw;
  }

  .medicated-sleep-consultation-content {
    flex-direction: column;
    align-items: stretch;
    padding: 2.564vw;
    gap: 0;
    border-radius: 2.564vw;
  }

  .medicated-sleep-consultation-doctors-image {
    order: 1;
    width: 100%;
    height: 44.872vw;
    margin-left: 0;
    margin-right: 0;
    margin-bottom: 3.846vw;
    border-radius: 2.564vw;
    max-width: none;
    min-width: 0;
  }

  .medicated-sleep-consultation-text-block {
    order: 2;
    gap: 0;
  }

  .medicated-sleep-consultation-title {
    font-size: 5.0vw;
    line-height: 7.051vw;
    font-weight: 600;
    margin-bottom: 3.846vw;
  }

  .medicated-sleep-consultation-description {
    font-size: 3.333vw;
    line-height: 5.128vw;
    margin-bottom: 3.846vw;
  }

  .medicated-sleep-consultation-button {
    order: 3;
    width: 45.641vw;
    font-size: 2.179vw;
    border-radius: 19.231vw;
    padding: 0.77vw 0.77vw 0.77vw 3.21vw;
    justify-content: space-between;
    margin-left: auto;
  }

  .medicated-sleep-consultation-btn-icon {
    width: 8.718vw;
    height: 8.718vw;
    border-radius: 19.231vw;
    margin-left: auto;
  }

  .medicated-sleep-consultation-btn-icon svg {
    width: 2.051vw;
    height: 1.667vw;
  }

  .medicated-sleep-consultation-button::after {
    right: 0.77vw;
    width: 8.718vw;
    height: 8.718vw;
    border-radius: 19.231vw;
  }

  .medicated-sleep-consultation-button:hover::after {
    width: 120vw;
    height: 120vw;
    right: -60vw;
  }

  .medicated-sleep-consultation-btn-primary:hover span {
    transform: translateX(8.974vw);
  }

  .medicated-sleep-consultation-button:hover .medicated-sleep-consultation-btn-icon svg {
    transform: translateX(-35.521vw) rotate(40deg);
  }
}
.guarantees {
    width: 100%;
    background: #FFFFFF;
    padding: 1.0vw 0 4.17vw 0;
}

.guarantees-container {
    width: 100%;
    max-width: 100vw;
    margin: 0 auto;
    padding: 0 10%;
}

.guarantees-top {
    display: grid;
    grid-template-columns: 1fr 29.06vw;
    grid-gap: 7.81vw;
    gap: 7.81vw;
    margin-bottom: 2.6vw;
    align-items: stretch;
}

.guarantees-left {
    display: flex;
    flex-direction: column;
    gap: 1.04vw;
}

.guarantees-small-title {
    font-size: var(--font-size-h8);
    font-weight: 300;
    color: rgba(26, 26, 26, 0.75);
    text-align: left;
    font-family: 'Geist', sans-serif;
    display: flex;
    align-items: center;
    gap: 0.52vw;
}

.guarantees-small-title-bar {
    width: 0.21vw;
    height: 1.25vw;
    background: rgba(46, 61, 88, 1);
    flex-shrink: 0;
}

.guarantees-main-title {
    font-size: var(--font-size-h1);
    text-transform: uppercase;
    font-weight: 700;
    line-height: 3.4vw;
    color: #000000;
    text-align: left;
    font-family: 'Geist', sans-serif;
}

.guarantees-main-title span {
    text-decoration: underline;
    text-decoration-thickness: 0.16vw;
    text-underline-offset: 0.26vw;
    color: #485B85;
}

.guarantees-description {
    font-size: var(--font-size-h6);
    font-weight: 300;
    line-height: 2.1vw;
    color: rgba(26, 26, 26, 0.75);
    text-align: left;
    font-family: 'Geist', sans-serif;
    margin-top: auto;
}

.guarantees-right {
    display: flex;
    flex-direction: column;
    gap: 0;
    align-self: flex-end;
}

.guarantees-item {
    display: flex;
    flex-direction: column;
    gap: 0.52vw;
    padding: 0.78vw 0;
}

.guarantees-item:nth-child(2) {
    padding: 0;
}

.guarantees-item-content-wrapper {
    display: flex;
    align-items: center;
    gap: 2.08vw;
    padding: 0 1.04vw;
}

.guarantees-item-icon {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.guarantees-item-icon svg {
    width: 2.45vw;
    height: 2.86vw;
}

.guarantees-item-text {
    display: flex;
    flex-direction: column;
    gap: 0.56vw;
    flex: 1 1;
}

.guarantees-years {
    font-size: var(--font-size-h1);
    font-weight: 700;
    color: #485B85;
    text-align: left;
    text-transform: uppercase;
    font-family: 'Geist', sans-serif;
    line-height: 1.2;
    padding-top: 0.5vw;
}

.guarantees-item-description {
    font-size: var(--font-size-body);
    font-weight: 300;
    color: #1A1A1ABF;
    text-align: left;
    font-family: 'Geist', sans-serif;
}

.guarantees-divider {
    height: 1px;
    background: #e9e9e9;
    margin-top: 0.52vw;
}

.guarantees-consultation {
    width: 100%;
    box-sizing: border-box;
    background-color: #f5f5f5;
    border-radius: 1.04vw;
}

.guarantees-consultation-content {
    background: transparent;
    padding: 0.52vw; /* Ровно 10px со всех сторон */
    display: flex;
    align-items: center;
    gap: 2.6vw; /* Ровно 50px */
    position: relative;
    overflow: hidden;
    min-width: 0;
    min-height: 15.2vw; /* Те самые 292px высоты */
}

.guarantees-consultation-doctor-image {
    flex-shrink: 0;
    height: 14.16vw; /* Высота картинки (272px) */
    min-width: 26.0vw;
    max-width: 26.0vw;
    border-radius: 0.8vw; /* Те же 20px скругления для гармонии */
    overflow: hidden;
    margin-left: 0; /* Убрали отрицательный отступ! */
    position: relative;
    z-index: 1;
    transition: transform 0.3s ease;
}

.guarantees-consultation-doctor-image:hover {
    transform: translateX(3px);
}

.guarantees-consultation-doctor-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 30%;
    display: block;
}

.guarantees-consultation-text-block {
    /* flex: 1; */
    width: 46.3vw;
    display: flex;
    flex-direction: column;
    gap: 0.52vw;
    z-index: 2;
    min-width: 0;
}

.guarantees-consultation-title {
    text-align: left;
    font-size: var(--font-size-h3-5);
    font-weight: 700;
    color: #000000;
    margin: 0;
    line-height: 1.2;
    font-family: 'Geist', sans-serif;
    text-transform: uppercase;
}

.guarantees-consultation-description {
    text-align: left;
    font-size: var(--font-size-h8);
    font-weight: 300;
    color: #1A1A1ABF;
    margin: 0;
    line-height: 1.72vw;
    font-family: 'Geist', sans-serif;
}

.guarantees-consultation-button {
    padding: 0.31vw 0.31vw 0.31vw 1.56vw;
    border-radius: 2.6vw;
    border: 0.052vw solid #2E3D58;
    font-weight: 500;
    font-size: var(--font-size-button);
    line-height: 0.89vw;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 1.56vw;
    font-family: 'Geist', sans-serif;
    position: relative;
    overflow: hidden;
    flex-shrink: 0;
}

.guarantees-consultation-btn-primary {
    background: #485B85;
    color: #FFFFFF;
}

.guarantees-consultation-btn-primary span {
    color: #FFFFFF;
    transition: color 0.3s ease, transform 0.8s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    z-index: 3;
}

.guarantees-consultation-btn-primary:hover span {
    color: #485B85;
    transform: translateX(4.17vw);
}

.guarantees-consultation-btn-icon {
    width: 3.13vw;
    height: 3.13vw;
    border-radius: 50%;
    background: #FFFFFF;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    position: relative;
    z-index: 2;
}

.guarantees-consultation-btn-icon svg {
    width: 0.73vw;
    height: 0.63vw;
    transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.guarantees-consultation-button:hover .guarantees-consultation-btn-icon svg {
    transform: translateX(-10.42vw) rotate(40deg);
}

.guarantees-consultation-button::after {
    content: '';
    position: absolute;
    right: 0.31vw;
    top: 50%;
    transform: translateY(-50%);
    width: 3.13vw;
    height: 3.13vw;
    border-radius: 50%;
    background: #FFFFFF;
    transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 0;
    pointer-events: none;
}

.guarantees-consultation-button:hover::after {
    width: 41.67vw;
    height: 41.67vw;
    right: -20.83vw;
    top: 50%;
    transform: translateY(-50%);
}

@media (max-width: 2200px) { 
.guarantees-container {
    padding: 0 2.6vw;
}
}

@media (min-width: 2200px) {
    .guarantees-top {
        grid-template-columns: 1fr 22vw;
    }
}

@media (max-width: 780px) {
    .guarantees {
        padding-top: 3.85vw;
        padding-bottom: 0;
    }

    .guarantees-top {
        display: flex;
        flex-direction: column;
        margin-bottom: 6.41vw;
    }

    .guarantees-left {
        order: 1;
        gap: 2.56vw;
    }

    .guarantees-right {
        order: 2;
    }

    .guarantees-small-title {
        gap: 1.28vw;
    }

    .guarantees-small-title span {
        font-size: 3.21vw;
    }

    .guarantees-small-title-bar {
        width: 0.38vw;
        height: 5.13vw;
    }

    .guarantees-main-title {
        width: 100%;
        font-size: 5.77vw;
        font-weight: 700;
        line-height: 8.33vw;
        /* margin-bottom: 3.85vw; */
    }

    .guarantees-main-title span {
        text-decoration-thickness: 0.26vw;
        text-underline-offset: 0.64vw;
    }

    .guarantees-description {
        font-size: 3.33vw;
        line-height: 5.13vw;
    }

    .guarantees-right {
        align-self: center;
    }

    .guarantees-item {
        gap: 2.56vw;
    }

    .guarantees-item-icon {
        width: 6.79vw;
        height: 8.08vw;
    }

    .guarantees-item-icon svg {
        width: 6.79vw;
        height: 8.08vw;
    }

    .guarantees-item-content-wrapper {
        gap: 4.49vw;
    }

    .guarantees-years {
        font-size: 6.67vw;
        line-height: 9.62vw;
    }

    .guarantees-item-description {
        font-size: 2.56vw;
        line-height: 3.85vw;
    }

    .guarantees-item-text {
        gap: 1.41vw;
    }

    .guarantees-consultation-content {
        flex-direction: column;
        align-items: stretch;
        padding: 2.564vw;
        gap: 0;
        border-radius: 2.56vw;
    }

    .guarantees-consultation-doctor-image {
        order: 1;
        width: 100%;
        height: 44.872vw;
        margin-left: 0;
        margin-right: 0;
        margin-bottom: 3.846vw;
        border-radius: 2.564vw;
        max-width: none;
        min-width: 0;
    }

    .guarantees-consultation-text-block {
        order: 2;
        gap: 0;
        width: 100%;
    }

    .guarantees-consultation-title {
        font-size: 5.0vw;
        line-height: 7.051vw;
        font-weight: 600;
        margin-bottom: 3.846vw;
    }

    .guarantees-consultation-description {
        font-size: 3.333vw;
        line-height: 5.128vw;
        margin-bottom: 3.846vw;
    }

    .guarantees-consultation-button {
        order: 3;
        width: 45.641vw;
        font-size: 2.179vw;
        border-radius: 19.231vw;
        padding: 0.77vw 0.77vw 0.77vw 3.21vw;
        justify-content: space-between;
        margin-left: auto;
    }

    .guarantees-consultation-btn-icon {
        width: 8.718vw;
        height: 8.718vw;
        border-radius: 19.231vw;
        margin-left: auto;
    }

    .guarantees-consultation-btn-icon svg {
        width: 2.051vw;
        height: 1.667vw;
    }

    .guarantees-consultation-button::after {
        right: 0.77vw;
        width: 8.718vw;
        height: 8.718vw;
        border-radius: 19.231vw;
    }

    .guarantees-consultation-button:hover::after {
        width: 120vw;
        height: 120vw;
        right: -60vw;
    }

    .guarantees-consultation-btn-primary:hover span {
        transform: translateX(8.974vw);
    }

    .guarantees-consultation-button:hover .guarantees-consultation-btn-icon svg {
        transform: translateX(-35.521vw) rotate(40deg);
    }
}
.personal-guarantee {
    width: 100%;
    background: #FFFFFF;
    padding: 4.17vw 0;
}

.personal-guarantee-container {
    width: 100%;
    max-width: 100vw;
    margin: 0 auto;
    padding: 0 10%;
}

.personal-guarantee-content {
    display: grid;
    grid-template-columns: 0.8fr 0.8fr 0.8fr;
    grid-gap: 1.56vw;
    gap: 1.56vw;
    align-items: stretch;
}

/* Левая секция */
.personal-guarantee-left {
    display: flex;
    flex-direction: column;
    height: 100%;
}

/* .personal-guarantee-left > *:not(:last-child) {
    margin-bottom: 1.55vw;
} */

.personal-guarantee-name {
    font-size: var(--font-size-body);
    font-weight: 500;
    color: rgba(25, 25, 25, 1);
    text-align: left;
    font-family: 'Geist', sans-serif;
    display: flex;
    align-items: center;
    gap: 0.52vw;
    position: relative;
    margin-bottom: 0.52vw;
    padding: 0.52vw;
}

.personal-guarantee-name span {
    transition: opacity 0.3s ease;
}

.personal-guarantee-name:hover span {
    opacity: 0;
}

.personal-guarantee-name::after {
    content: 'Основатель, главный врач, хирург, имплантолог';
    position: absolute;
    left: calc(0.52vw + 0.21vw + 0.52vw);
    opacity: 0;
    transition: opacity 0.3s ease;
    white-space: nowrap;
}

.personal-guarantee-name:hover::after {
    opacity: 1;
}

.personal-guarantee-name-bar {
    width: 0.21vw;
    height: 1.25vw;
    background: rgba(46, 61, 88, 1);
    flex-shrink: 0;
}

.personal-guarantee-title-wrapper {
    display: flex;
    align-items: flex-start;
    gap: 0.78vw;
    position: relative;
}

.personal-guarantee-badge {
    width: 2.08vw;
    height: 2.08vw;
    border-radius: 50%;
    background: #485B85;
    color: #FFFFFF;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--font-size-h6);
    font-weight: 700;
    font-family: 'Geist', sans-serif;
    flex-shrink: 0;
    margin-top: 0.26vw;
}

.personal-guarantee-title {
    font-size: 2.1vw;
    font-weight: 600;
    line-height: 3.13vw;
    color: #000000;
    text-align: left;
    font-family: 'Geist', sans-serif;
    text-transform: uppercase;
    flex: 1 1;
    margin-bottom: 1.55vw;
}

.personal-guarantee-title span {
    text-decoration: underline;
    text-decoration-thickness: 0.16vw;
    text-underline-offset: 0.26vw;
    color: #485B85;
}

.personal-guarantee-description {
    font-size: var(--font-size-h8);
    font-weight: 300;
    line-height: 1.72vw;
    color: rgba(26, 26, 26, 0.75);
    text-align: left;
    font-family: 'Geist', sans-serif;
    margin-bottom: 1.56vw;
}

.personal-guarantee-button {
    padding: 0.31vw 0.31vw 0.31vw 1.56vw;
    border-radius: 2.6vw;
    border: 0.052vw solid #2E3D58;
    font-weight: 700;
    font-size: var(--font-size-button);
    line-height: 0.89vw;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 1.56vw;
    font-family: 'Geist', sans-serif;
    position: relative;
    overflow: hidden;
    flex-shrink: 0;
    align-self: flex-start;
}

.personal-guarantee-btn-primary {
    background: #485B85;
    color: #FFFFFF;
}

.personal-guarantee-btn-primary span {
    color: #FFFFFF;
    transition: color 0.3s ease, transform 0.8s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    z-index: 3;
}

.personal-guarantee-btn-primary:hover span {
    color: #485B85;
    transform: translateX(3.5vw);
}

.personal-guarantee-btn-icon {
    width: 3.13vw;
    height: 3.13vw;
    border-radius: 50%;
    background: #FFFFFF;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    position: relative;
    z-index: 2;
}

.personal-guarantee-btn-icon svg {
    width: 0.73vw;
    height: 0.63vw;
    transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Эффект блика для кнопки */
.personal-guarantee-button .flare {
    position: absolute;
    top: 0;
    height: 100%;
    width: 45px;
    transform: skewX(-45deg);
    animation: flareAnimation 3s infinite;
    left: -170%;
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.9), #fff);
    filter: blur(0px);
    z-index: 1;
    pointer-events: none;
}

@keyframes flareAnimation {
    0% {
        left: -170%;
    }
    50% {
        left: 170%;
    }
    100% {
        left: 170%;
    }
}

.personal-guarantee-button:hover .personal-guarantee-btn-icon svg {
    transform: translateX(-10.1vw) rotate(40deg);
}

.personal-guarantee-button::after {
    content: '';
    position: absolute;
    right: 0.31vw;
    top: 50%;
    transform: translateY(-50%);
    width: 3.13vw;
    height: 3.13vw;
    border-radius: 50%;
    background: #FFFFFF;
    transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 0;
    pointer-events: none;
}

.personal-guarantee-button:hover::after {
    width: 41.67vw;
    height: 41.67vw;
    right: -20.83vw;
    top: 50%;
    transform: translateY(-50%);
}

.personal-guarantee-stats {
    display: flex;
    gap: 0.5vw;
    flex-wrap: wrap;
    margin-top: auto;
}

.personal-guarantee-stat-item {
    background: #f5f5f5;
    border-radius: 0.52vw;
    padding: 0.8vw 0.26vw;
    display: flex;
    flex-direction: column;
    gap: 0.25vw;
    flex: 1 1;
    min-width: 7.81vw;
}

.personal-guarantee-stat-value {
    text-align: center;
    font-size: 1.823vw;
    font-weight: 600;
    color: rgba(25, 25, 25, 1);
    font-family: 'Geist', sans-serif;
    line-height: 2.08vw;
}

.personal-guarantee-stat-label {
    text-align: center;
    font-size: 0.73vw;
    font-weight: 300;
    color: rgba(144, 144, 144, 1);
    font-family: 'Geist', sans-serif;
}

/* Средняя секция - фото врача */
.personal-guarantee-center {
    display: flex;
    justify-content: center;
    align-items: stretch;
    height: 100%;
}

.personal-guarantee-doctor-image {
    position: relative;
    width: 100%;
    max-width: 29.06vw;
    border-radius: 1.04vw;
    overflow: hidden;
    height: 100%;
    min-height: 100%;
}

.personal-guarantee-doctor-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.personal-guarantee-doctor-image .googing-play-button {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 4.17vw;
    height: 4.17vw;
    background: #FFFFFF;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 10;
    transition: transform 0.3s ease;
    box-sizing: content-box;
}

.personal-guarantee-doctor-image .googing-play-button::before {
    content: "";
    position: absolute;
    z-index: 0;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    display: block;
    width: 4.17vw;
    height: 4.17vw;
    background: #FFFFFF;
    border-radius: 50%;
    animation: pulse-border 1500ms ease-out infinite;
}

.personal-guarantee-doctor-image .googing-play-button::after {
    content: "";
    position: absolute;
    z-index: 1;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    display: block;
    width: 4.17vw;
    height: 4.17vw;
    background: #FFFFFF;
    border-radius: 50%;
    transition: all 200ms;
}

.personal-guarantee-doctor-image .googing-play-button:hover::after {
    background-color: #f5f5f5;
}

.personal-guarantee-doctor-image .googing-play-button:hover {
    transform: translate(-50%, -50%) scale(1.1);
}

.personal-guarantee-doctor-image .googing-play-button svg {
    width: 1.16vw;
    height: 1.4vw;
    transform: translateX(0.1vw);
    position: relative;
    z-index: 3;
}

@keyframes pulse-border {
    0% {
        transform: translate(-50%, -50%) translateZ(0) scale(1);
        opacity: 1;
    }
    100% {
        transform: translate(-50%, -50%) translateZ(0) scale(1.5);
        opacity: 0;
    }
}

.personal-guarantee-doctor-image .skils-info-card {
    /* Изменяем ширину на относительную, чтобы она всегда вписывалась в фото */
    width: calc(100% - 1.04vw); 
    position: absolute;
    bottom: 0.52vw;
    /* Центрируем плашку */
    left: 50%;
    transform: translateX(-50%);
    
    background: rgba(255, 255, 255, 0.5);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-radius: 1.04vw;
    border: 0.03vw solid rgba(255, 255, 255, 1);
    border-top: 0.108vw solid rgba(255, 255, 255, 1);
    padding: 0.26vw;
    display: flex;
    flex-direction: column;
    gap: 0.42vw;
    z-index: 10;
}

.personal-guarantee-doctor-image .skils-info-card-inner {
    background: #FFFFFF;
    padding: 0.52vw 0.52vw 0.52vw 1vw;
    gap: 1.56vw;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-radius: 0.8vw;
}

.personal-guarantee-doctor-image .skils-info-card-content {
    flex: 1 1;
    display: flex;
    flex-direction: column;
    gap: 0;
}

.personal-guarantee-doctor-image .skils-info-card-text {
    font-size: var(--font-size-body);
    width: 90%;
    font-weight: 500;
    color: rgba(25, 25, 25, 1);
    margin: 0 0 0.25vw 0;
    line-height: 1.4;
    text-align: left;
}

.personal-guarantee-doctor-image .skils-info-card-subtext {
    font-weight: 300;
    color: #1A1A1ABF;
    margin: 0;
    line-height: 1.4;
    text-align: left;
}

.personal-guarantee-doctor-image .skils-info-card-icon {
    width: 4.69vw;
    height: 4.69vw;
    border-radius: 0.8vw;
    background: rgba(17, 47, 85, 1);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    cursor: pointer;
}

.personal-guarantee-doctor-image .skils-info-card-icon svg {
    width: 2.5vw;
    height: 2.5vw;
}

/* Правая секция - гарантии */
.personal-guarantee-right {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.personal-guarantee-item:not(:last-child) {
    margin-bottom: 1.56vw;
}

/* .personal-guarantee-item:last-child {
    margin-top: auto;
} */

.personal-guarantee-item {
    background: #F5F5F5;
    border-radius: 1.04vw;
    padding: 0.52vw;
    display: flex;
    gap: 1.04vw;
    height: 100%;
    align-items: flex-start;
}

.personal-guarantee-item-icon {
    width: 3.15vw;
    height: 3.15vw;
    border-radius: 50%;
    background: rgba(17, 47, 85, 1);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    align-self: flex-start;
}

.personal-guarantee-item-icon svg {
    width: 1.72vw;
    height: 1.72vw;
}

.personal-guarantee-item-content {
    flex: 1 1;
    display: flex;
    flex-direction: column;
    gap: 0.52vw;
    justify-content: flex-start;
}

.personal-guarantee-item-title {
    font-size: var(--font-size-h6);
    font-weight: 500;
    color: rgba(25, 25, 25, 1);
    text-align: left;
    font-family: 'Geist', sans-serif;
    line-height: 1.2;
}

.personal-guarantee-item-description {
    font-size: var(--font-size-body);
    font-weight: 300;
    color: rgba(26, 26, 26, 0.75);
    text-align: left;
    font-family: 'Geist', sans-serif;
    line-height: 1.46vw;
}

@media (max-width: 2200px) {
    .personal-guarantee-container {
        padding: 0 2.6vw;
    }
}

@media (max-width: 780px) {
    .personal-guarantee {
        padding: 12.82vw 0 0 0;
    }

    .personal-guarantee-content {
        display: flex;
        flex-direction: column;
        gap: 6.41vw;
    }

    .personal-guarantee-center {
        order: 1;
        border-radius: 2.56vw;
        overflow: hidden;
    }

    .personal-guarantee-doctor-image {
        border-radius: 2.56vw;
        overflow: hidden;
    }

    .personal-guarantee-doctor-image {
        width: 100%;
        max-width: 100%;
        height: 115.38vw;
    }

    .personal-guarantee-doctor-image .googing-play-button {
        width: 15.38vw;
        height: 15.38vw;
        box-sizing: content-box;
    }

    .personal-guarantee-doctor-image .googing-play-button::before,
    .personal-guarantee-doctor-image .googing-play-button::after {
        width: 15.38vw;
        height: 15.38vw;
    }

    .personal-guarantee-doctor-image .googing-play-button svg {
        width: 3.46vw;
        height: 4.36vw;
    }

    .personal-guarantee-doctor-image .skils-info-card {
        width: calc(100% - 6vw) !important; 
        left: 3vw !important; 
        bottom: 3vw !important; 
        padding: 0.64vw !important;
        border-radius: 2.5vw !important;
        box-sizing: border-box !important;
        transform: none !important; /* Убиваем конфликт с файлом Skils.css */
    }

    .personal-guarantee-doctor-image .skils-info-card-inner {
        padding: 1.03vw 2.56vw;
        border-radius: 1.28vw;
    }

    .personal-guarantee-doctor-image .skils-info-card-text {
        font-size: 2.82vw;
        line-height: 4.49vw;
        margin-bottom: 0.64vw;
    }

    .personal-guarantee-doctor-image .skils-info-card-subtext {
        font-size: 2.56vw;
    }

    .personal-guarantee-left {
        order: 2;
    }

    .personal-guarantee-stats {
        order: 1;
    }

    .personal-guarantee-button {
        order: 2;
    }

    .personal-guarantee-right {
        order: 3;
        margin-bottom: 6.41vw;
    }

    .personal-guarantee-item {
        padding: 1.28vw;
        margin-bottom: 4.3vw !important; /* !important гарантирует, что отступ применится */
        gap: 2.56vw;
        border-radius: 2.56vw;
    }

    .personal-guarantee-item-icon {
        width: 7.69vw;
        height: 7.69vw;
    }

    .personal-guarantee-item-icon svg {
        width: 3.59vw;
        height: 3.59vw;
    }

    .personal-guarantee-item-title {
        font-size: 4.49vw;
        line-height: 6.41vw;
    }

    .personal-guarantee-item-description {
        font-size: 3.33vw;
        line-height: 5.13vw;
    }

    .personal-guarantee-item-content {
        gap: 1.28vw;
    }

    .personal-guarantee-name {
        font-size: 2.82vw;
        gap: 1.28vw;
        margin-bottom: 1.28vw;
    }

    .personal-guarantee-name-bar {
        width: 0.38vw;
        height: 4.49vw;
    }

    .personal-guarantee-title {
        width: 100%;
        font-size: 5.77vw;
        font-weight: 700;
        line-height: 8.33vw;
        margin-bottom: 2.56vw;
    }

    .personal-guarantee-title span {
        text-decoration-thickness: 0.26vw;
        text-underline-offset: 0.64vw;
    }

    .personal-guarantee-description {
        font-size: 3.33vw;
        line-height: 5.13vw;
        margin-bottom: 6.41vw;
    }

    .personal-guarantee-stats {
        gap: 3.85vw;
        margin-bottom: 8.97vw;
    }

    .personal-guarantee-stat-item {
        padding: 2.82vw 0.64vw;
        gap: 0.64vw;
        border-radius: 1.28vw;
    }

    .personal-guarantee-stat-value {
        font-size: 5.13vw;
        line-height: 5.13vw;
    }

    .personal-guarantee-stat-label {
        font-size: 2.56vw;
        line-height: 3.85vw;
    }

    .personal-guarantee-button {
        padding: 0.77vw 0.7vw 0.77vw 1.92vw;
        border-radius: 6.41vw;
        font-size: 2.18vw;
        line-height: 2.18vw;
        gap: 3.85vw;
        width: 43.59vw;
        box-sizing: border-box;
        align-self: flex-end;
    }

    .personal-guarantee-button.personal-guarantee-btn-primary {
        padding-left: 4.36vw;
    }

    .personal-guarantee-button.personal-guarantee-btn-primary:hover span {
        transform: translateX(max(10.8vw, calc(-10% - 35.56vw)));
    }

    .personal-guarantee-button:hover .personal-guarantee-btn-icon svg {
        transform: translateX(max(-33.7vw, calc(-15% - 40.56vw))) rotate(40deg);
    }

    .personal-guarantee-btn-icon {
        width: 7.69vw;
        height: 7.69vw;
        flex-shrink: 0;
        margin-left: auto;
    }

    .personal-guarantee-btn-icon svg {
        width: 2.05vw;
        height: 1.79vw;
        transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
    }

    .personal-guarantee-button span {
        transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
    }

    .personal-guarantee-button::after {
        right: 0.77vw;
        width: 7.69vw;
        height: 7.69vw;
    }

    .personal-guarantee-button:hover::after {
        width: 102.56vw;
        height: 102.56vw;
        right: -51.28vw;
    }
}
@media (min-width: 2201px) {
    .personal-guarantee-doctor-image .skils-info-card {
        width: 24.6vw;
    }
    
    .personal-guarantee-doctor-image .skils-info-card-text {
        font-size: 0.9vw;
    }
    
    .personal-guarantee-doctor-image .skils-info-card-subtext {
        font-size: 0.8vw;
    }

    
}
.installment-container {
  background-color: #FFFFFF;
  padding: 1.04vw 10% 4.17vw 10%;
  width: 100%;
  max-width: 100vw;
  margin: 0 auto;
  box-sizing: border-box;
  overflow-x: hidden;
}

.installment-header {
  margin-bottom: 2.6vw;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.52vw;
}

.installment-title {
  width: calc(50% - 0.26vw);
  font-size: var(--font-size-h1);
  font-weight: 600;
  color: #000000;
  margin: 0;
  line-height: 3.13vw;
  text-transform: uppercase;
  flex-shrink: 0;
  text-align: left;
}

.installment-title span {
  color: #485B85;
  text-decoration: underline;
  text-decoration-thickness: 0.16vw;
  text-underline-offset: 0.26vw;
}

.installment-subtitle {
  width: calc(50% - 0.26vw);
  font-size: var(--font-size-h8);
  font-weight: 300;
  color: #1A1A1ABF;
  margin: 0;
  line-height: 1.72vw;
  text-align: left;
  flex-shrink: 0;
}

.installment-card {
  min-height: 20.83vw;
  display: flex;
  border-radius: 1.04vw;
  overflow: hidden;
  background: rgba(17, 47, 85, 1);
  padding: 1vw 1vw 1vw 1.5vw;
  /* box-shadow: 0 0.21vw 0.63vw rgba(0, 0, 0, 0.1); */
  gap: 0;
  position: relative;
  box-sizing: border-box;
  /* border: 0.052vw solid rgba(255, 255, 255, 0.2); */
}

.installment-card-left {
  /* background-color: #485B85; */
  /* padding: 3.13vw; */
  display: flex;
  flex-direction: column;
  gap: 1.56vw;
  /* border-radius: 1.04vw 0 0 1.04vw; */
  flex: 0 0 45%;
  padding-right: 1.56vw;
  box-sizing: border-box;
  overflow: hidden;
  /* align-items: center; */
  justify-content: center;
  text-align: left;
}

.installment-card-title {
  font-size: 2.2vw;
  font-weight: 700;
  color: #FFFFFF;
  margin: 0;
  line-height: 3.4vw;
  text-align: left;
  text-transform: uppercase;
}

.installment-card-description {
  width: 90%;
  font-size: var(--font-size-h6);
  color: rgba(255, 255, 255, 0.7);
  font-weight: 300;
  margin: 0;
  line-height: 2.08vw;
  text-align: left;
  opacity: 0.9;
}

.installment-button {
  padding: 0.31vw 0.31vw 0.31vw 1.56vw;
  border-radius: 2.6vw;
  border: 0.052vw solid rgba(245, 245, 245, 1);
  font-weight: 700;
  font-size: var(--font-size-body);
  line-height: 0.89vw;
  font-weight: 500;
  cursor: pointer;
  transition: all 0.3s ease;
  display: flex;
  align-items: center;
  gap: 1.56vw;
  font-family: 'Geist', sans-serif;
  position: relative;
  overflow: hidden;
  background: #FFFFFF;
  width: -webkit-fit-content;
  width: fit-content;
}

.installment-button span {
  color: rgba(25, 25, 25, 1);
  position: relative;
  z-index: 3;
  transition: color 0.3s ease, transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.installment-button:hover span {
  color: #FFFFFF;
  transform: translateX(3.65vw);
}

.installment-button-icon {
  width: 3.13vw;
  height: 3.13vw;
  border-radius: 50%;
  background: rgba(17, 47, 85, 1);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
  z-index: 2;
}

.installment-button-icon svg {
  width: 0.73vw;
  height: 0.63vw;
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.installment-button:hover .installment-button-icon svg {
  transform: translateX(-10.75vw) rotate(40deg);
}

.installment-button::after {
  content: '';
  position: absolute;
  right: 0.31vw;
  top: 50%;
  transform: translateY(-50%);
  width: 3.13vw;
  height: 3.13vw;
  border-radius: 50%;
  background: rgba(17, 47, 85, 1);
  transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
  z-index: 0;
  pointer-events: none;
}

.installment-button:hover::after {
  width: 41.67vw;
  height: 41.67vw;
  right: -20.83vw;
  top: 50%;
  transform: translateY(-50%);
}

.installment-card-right {
  background-color: #FFFFFF;
  height: 34.5vw;
  padding: 1.04vw;
  display: flex;
  flex-direction: column;
  gap: 1.56vw;
  border-radius: 0.8vw;
  flex: 0 0 55%;
  position: relative;
  box-sizing: border-box;
  overflow: hidden;
  align-items: center;
  justify-content: center;
}

.installment-card-right-title {
  font-family: 'Geist', sans-serif;
  font-size: 1.406vw; /* 27px */
  font-weight: 700;
  line-height: 1.823vw; /* 35px */
  color: rgba(25, 25, 25, 1);
  margin: 0;
  margin-top: 4vw;
  text-align: center;
  display: flex;
  align-items: center; /* Выравнивание по вертикали (Middle) */
  justify-content: center; /* Выравнивание по горизонтали (Center) */
}

.installment-stats {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9.17vw;
  /* flex: 1; */
  flex-wrap: wrap;
  margin-top: 2vw;
}

.installment-stat-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.78vw;
}

.installment-stat-value {
  font-size: 11.46vw;
  font-weight: 700;
  line-height: 1;
  color: rgba(25, 25, 25, 1);
}

.installment-stat-label {
  font-size: 2.6vw;
  color: rgba(25, 25, 25, 1);
  font-weight: 700;
  text-transform: uppercase;
  text-align: center;
}

.installment-card-bottom-text {
  font-family: 'Geist', sans-serif;
  font-size: 0.938vw; /* 18px */
  font-weight: 300;
  line-height: 1.458vw; /* 28px */
  color: rgba(26, 26, 26, 0.75);
  margin: 0;
  margin-top: auto;
  text-align: center;
}

@media (max-width: 2200px) {
  .installment-container  {
    padding: 1.04vw 2.6vw 4.17vw 2.6vw;
  }
}

@media (max-width: 780px) {
  .installment-container {
    padding-top: 12.82vw;
    padding-bottom: 0;
  }

  .installment-card {
    padding: 2.56vw;
    flex-direction: column;
  }

  .installment-card-left {
    order: 1;
    align-items: center;
    text-align: center;
    padding-right: 0;
  }

  .installment-card-right {
    order: 2;
  }

  .installment-card {
    border-radius: 2.56vw;
  }

  .installment-card-title {
    font-size: 5.13vw;
    line-height: 8.33vw;
    text-align: center !important; 
  }

  .installment-card-description {
    font-size: 3.33vw;
    line-height: 5.13vw;
    margin-bottom: 2.31vw;
    width: 100%;
    text-align: center !important; 
  }

  .installment-button {
    font-size: 2.56vw;
    padding: 0.77vw 0.7vw 0.77vw 1.92vw;
    border-radius: 6.41vw;
    gap: 3.85vw;
    width: 43.59vw;
    box-sizing: border-box;
    margin-bottom: 12.82vw;
    margin-left: auto;
    margin-right: auto;
  }

  .installment-button span {
    flex: 1 1; /* Заставляет текст занять всё свободное место между краем и иконкой */
    text-align: center;
  }

  .installment-button-icon {
    width: 7.69vw;
    height: 7.69vw;
    margin-left: auto;
  }

  .installment-button-icon svg {
    width: 2.05vw;
    height: 1.79vw;
  }

  .installment-button::after {
    right: 0.77vw;
    width: 7.69vw;
    height: 7.69vw;
  }

  .installment-button:hover::after {
    width: 102.56vw;
    height: 102.56vw;
    right: -51.28vw;
  }

  .installment-button:hover .installment-button-icon svg {
    transform: translateX(max(-33.7vw, calc(-15% - 40.56vw))) rotate(40deg);
  }

  .installment-button:hover span {
    transform: translateX(max(15.2vw, calc(-10% - 35.56vw)));
  }

  .installment-card-right {
    border-radius: 1.92vw;
    height: 78.21vw;
    padding: 9.87vw 2.56vw 7.69vw 2.56vw;
  }

  .installment-card-right-title {
    margin: 0;
    font-size: 3.46vw;
  }

  .installment-stat-value {
    font-size: 19.23vw;
  }

  .installment-stats {
    margin-top: 5.13vw;
  }

  .installment-stat-label {
    font-size: 4.49vw;
  }

  .installment-card-bottom-text {
    margin-top: 3.85vw;
    font-size: 3.33vw;
    line-height: 5.13vw;
  }
}
.kvis-container {
  width: 100%;
  
  /* Отступы: 5.2vw (100px) сверху и снизу, 2.6vw (50px) слева и справа */
  padding: 5.2vw 2.6vw; 
  
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: rgba(255, 255, 255, 1);
}

.kvis-card {
  background: rgba(255, 255, 255, 1);
  border: 0.062vw solid rgba(235, 235, 235, 1);
  border-radius: 1.05vw;
  padding: 1.6vw;
  width: 100%;
  max-width: 100%;
  min-height: 28.125vw;
  box-shadow: 0 0 3.125vw rgba(0, 0, 0, 0.1);
  display: flex;
  flex-direction: column;
}

.kvis-content-wrapper {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  flex: 1 1;
  min-height: 0;
}

.kvis-content-wrapper.kvis-two-columns {
  display: grid;
  grid-template-columns: 1fr 0fr;
  grid-gap: 2.6vw;
  gap: 2.6vw;
  align-items: stretch;
  height: 100%;
  min-height: 0;
}

.kvis-content-wrapper.kvis-two-columns.kvis-step-6 {
  grid-template-columns: 0fr 1fr;
}

.kvis-content-wrapper.kvis-two-columns.kvis-step-6 .kvis-form-section {
  order: 2;
}

.kvis-content-wrapper.kvis-two-columns.kvis-step-6 .kvis-image-section-right {
  order: 1;
}

.kvis-form-section {
  display: flex;
  flex-direction: column;
  flex: 1 1;
  min-height: 0;
  height: 100%;
  overflow: hidden;
  position: relative;
}

.kvis-form-content {
  opacity: 1;
  transform: translateY(0);
  transition: opacity 0.4s ease, transform 0.4s ease;
}

.kvis-form-content.fade-out,
.kvis-discount-text-wrapper.fade-out {
  opacity: 0;
  transform: translateY(-0.52vw);
  transition: opacity 0.3s ease, transform 0.3s ease;
}

.kvis-form-content.fade-in,
.kvis-discount-text-wrapper.fade-in {
  opacity: 1;
  transform: translateY(0);
  transition: opacity 0.3s ease, transform 0.3s ease;
}

.kvis-image-section {
  display: flex;
  flex-direction: column;
  gap: 0.83vw;
  position: relative;
  align-items: flex-start;
}

.kvis-doctor-image-wrapper {
  position: relative;
  width: 25.5vw;
  height: 42.5vw;
  border-radius: 0.82vw;
  overflow: hidden;
  background-color: #f0f0f0;
}

.kvis-doctor-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 0.82vw;
}

.kvis-play-button {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 4.17vw;
  height: 4.17vw;
  background: #FFFFFF;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 10;
  transition: transform 0.3s ease;
  box-sizing: content-box;
}

.kvis-play-button::before {
  content: "";
  position: absolute;
  z-index: 0;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  display: block;
  width: 4.17vw;
  height: 4.17vw;
  background: #FFFFFF;
  border-radius: 50%;
  animation: pulse-border 1500ms ease-out infinite;
}

.kvis-play-button::after {
  content: "";
  position: absolute;
  z-index: 1;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  display: block;
  width: 4.17vw;
  height: 4.17vw;
  background: #FFFFFF;
  border-radius: 50%;
  transition: all 200ms;
}

.kvis-play-button:hover::after {
  background-color: #f5f5f5;
}

.kvis-play-button:hover {
  transform: translate(-50%, -50%) scale(1.1);
}

.kvis-play-button svg {
  width: 1.16vw;
  height: 1.35vw;
  transform: translateX(0.1vw);
  position: relative;
  z-index: 3;
}

@keyframes pulse-border {
  0% {
    transform: translate(-50%, -50%) translateZ(0) scale(1);
    opacity: 1;
  }
  100% {
    transform: translate(-50%, -50%) translateZ(0) scale(1.5);
    opacity: 0;
  }
}


.kvis-calculator-title {
  font-size: var(--font-size-h1);
  font-weight: var(--font-weight-bold);
  color: #000;
  text-align: left;
  margin-bottom: 0.83vw;
  line-height: var(--line-height-tight);
  margin-top: 0;
}

.kvis-calculator-title-main {
  color: #1a1a1a;
}

.kvis-calculator-title-underline {
  color: #485B85;
  text-decoration: underline;
  text-decoration-thickness: 0.16vw;
  text-underline-offset: 0.26vw;
}

.kvis-calculator-subtitle {
  font-size: var(--font-size-h8);
  font-weight: var(--font-weight-light);
  color: rgba(26, 26, 26, 0.75);
  text-align: left;
  margin-bottom: 3.1vw;
  line-height: var(--line-height-light);
  margin-top: 0;
}

.kvis-title {
  font-size: var(--font-size-h5);
  font-weight: var(--font-weight-medium);
  color: #000;
  text-align: left;
  margin-bottom: 2.57vw;
  line-height: var(--line-height-normal);
  margin-top: 0;
}

.kvis-options-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-gap: 0.83vw;
  gap: 0.83vw;
  margin-bottom: 2.6vw;
}

.kvis-option {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding: 1.56vw 1.01vw;
  border: 0.05vw solid #e0e0e0;
  border-radius: 0.52vw;
  cursor: pointer;
  transition: background-color 0.3s ease;
  background: white;
}

.kvis-option:hover {
  background-color: #EBEBEB;
}

.kvis-option:hover .kvis-checkbox {
  border: 0.052vw solid rgba(25, 25, 25, 0.2);
}

.kvis-radio-wrapper {
  margin-right: 0.63vw;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.kvis-radio {
  width: 1.04vw;
  height: 1.04vw;
  border: 0.1vw solid #9e9e9e;
  border-radius: 50%;
  background: white;
  position: relative;
  flex-shrink: 0;
}

.kvis-radio.checked-radio {
  border-color: #4caf50;
}

.kvis-radio-inner {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 0.52vw;
  height: 0.52vw;
  border-radius: 50%;
  background-color: #4caf50;
}

.kvis-checkbox {
  width: 1.6vw;
  height: 1.6vw;
  border-radius: 0.26vw;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  background: rgba(235, 235, 235, 1);
  box-sizing: border-box;
  border: 0.052vw solid transparent;
  transition: border-color 0.3s ease;
}

.kvis-checkbox.checked {
  position: relative;
}

.kvis-checkbox.checked::before {
  content: '';
  position: absolute;
    top: 0.26vw;
    left: 0.26vw;
    right: 0.26vw;
    bottom: 0.26vw;
  background-color: rgba(72, 91, 133, 1);
    border-radius: 0.16vw;
  z-index: 0;
}

.kvis-checkbox.checked svg {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 1;
  width: 0.469vw;
  height: 0.365vw;
  flex-shrink: 0;
}

.kvis-option-text {
  font-size: var(--font-size-body);
  font-weight: 500;
  color: rgba(25, 25, 25, 1);
  flex: 1 1;
  text-align: left;
  line-height: var(--line-height-normal);
}

.kvis-navigation {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.63vw;
  margin-top: auto;
  /* padding-top: 1.04vw; */
}

.kvis-navigation.kvis-navigation-step6 {
    display: flex !important;
    flex-direction: row !important;
    justify-content: space-between !important;
    align-items: center !important;
    width: 100% !important;
    margin-top: 2.0vw !important; /* Уменьшили отступ с 6vw до 1vw, чтобы поднять кнопки */
  }

.kvis-btn-back {
  padding: 1.46vw 3.35vw;
  border-radius: 2.6vw;
  font-weight: 600;
  border: 0.052vw solid #E0E0E0;
  font-size: var(--font-size-h9-5);
  font-weight: 500;
  line-height: 0.99vw;
  cursor: pointer;
  transition: all 0.3s ease;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Geist', sans-serif;
  background: #EBEBEB;
  color: #000000;
  flex-shrink: 0;
  box-sizing: border-box;
}

.kvis-btn-back:hover:not(:disabled) {
  background: #FFFFFF;
}

.kvis-btn-back:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

/* --- Ссылка "Назад" на 6-м шаге (Десктоп) --- */
.kvis-btn-back-step6 {
  font-size: 0.938vw !important; /* Сделали аккуратный десктопный размер */
  font-weight: 500 !important;
  color: rgba(26, 26, 26, 0.75) !important;
  text-decoration: underline !important;
  text-underline-offset: 0.2vw !important; /* Аккуратное подчеркивание */
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
  height: auto !important;
  flex-shrink: 0 !important;
  cursor: pointer;
  transition: color 0.3s ease !important;
}

.kvis-btn-back-step6:hover:not(:disabled) {
  background: transparent !important;
  color: #485B85 !important; /* При наведении делаем фирменным синим */
}
.kvis-next-wrapper {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0.63vw;
}

.kvis-btn-next {
  /* Стили из header_nuv-btn-1 */
  padding: 0.31vw 0.31vw 0.31vw 1.56vw;
  border-radius: 2.6vw;
  border: 0.052vw solid #2E3D58;
  font-weight: 500;
  font-size: var(--font-size-h9-5) !important;
  line-height: 0.89vw;
  cursor: pointer;
  transition: all 0.3s ease;
  display: flex;
  align-items: center;
  gap: 1.56vw;
  font-family: 'Geist', sans-serif;
  position: relative;
  overflow: hidden;
}

.kvis-btn-next.header_nuv-btn-primary {
  background: #485B85;
  color: #FFFFFF;
}

.kvis-btn-next.header_nuv-btn-primary span {
  color: #FFFFFF;
  transition: color 0.3s ease, transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  position: relative;
  z-index: 3;
}

.kvis-btn-next.header_nuv-btn-primary:hover span {
  color: #485B85;
  transform: translateX(min(3.65vw, 15.31vw));
}

.kvis-btn-next .header_nuv-btn-icon {
  width: 3.125vw;
  height: 3.125vw;
  border-radius: 50%;
  background: #FFFFFF;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
  z-index: 2;
}

.kvis-btn-next .header_nuv-btn-icon svg {
  width: 0.73vw;
  height: 0.63vw;
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  transform: rotate(40deg);
}

.kvis-btn-next:hover .header_nuv-btn-icon svg {
  transform: translateX(max(-11.0vw, calc(-10% - 5.96vw))) rotate(40deg);
}

.kvis-btn-next::after {
  content: '';
  position: absolute;
  right: 0.31vw;
  top: 50%;
  transform: translateY(-50%);
  width: 3.125vw;
  height: 3.125vw;
  border-radius: 50%;
  background: #FFFFFF;
  transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
  z-index: 0;
  pointer-events: none;
}

.kvis-btn-next:hover::after {
  width: 41.67vw;
  height: 41.67vw;
  right: -20.83vw;
  top: 50%;
  transform: translateY(-50%);
}

/* Эффект блика для кнопок */
.kvis-btn-next .flare {
  position: absolute;
  top: 0;
  height: 100%;
  width: 45px;
  transform: skewX(-45deg);
  animation: flareAnimation 3s infinite;
  left: -170%;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.9), #fff);
  filter: blur(0px);
  z-index: 1;
  pointer-events: none;
}

@keyframes flareAnimation {
  0% {
    left: -170%;
  }
  50% {
    left: 170%;
  }
  100% {
    left: 170%;
  }
}

/* Стили для кнопки ОТПРАВИТЬ */
.kvis-btn-submit .header_nuv-btn-icon svg {
  transform: rotate(40deg);
}

.kvis-btn-submit:hover .header_nuv-btn-icon svg {
  transform: translateX(max(-20.0vw, calc(-10% - 16.4vw))) rotate(40deg);
}

.kvis-discount-message {
  display: flex;
  gap: 1.1vw;
  align-items: center;
  flex: 1 1;
}

.kvis-discount-text-wrapper {
    flex: 1 1;
  }

.kvis-discount-icon {
  flex-shrink: 0 !important; /* ЗАПРЕТ на превращение в кляксу */
  width: 1.6vw !important;
  height: 1.6vw !important;
  min-width: 18px !important; /* Чтобы на маленьких экранах не исчезла */
  min-height: 18px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: relative !important;
}

.kvis-discount-icon svg {
  width: 100% !important;
  height: 100% !important;
  display: block !important;
}

/* Убираем "кляксу" — удаляем лишние трансформации */
.kvis-exclamation-mark {
  transform: none !important; /* Убираем scale(0.5), который всё портил */
}

/* Настраиваем конкретно восклицательный знак внутри синего круга */
.kvis-exclamation-icon .kvis-exclamation-mark path,
.kvis-exclamation-icon .kvis-exclamation-mark circle {
  stroke: none !important; /* Здесь обводка не нужна, только заливка */
}

.kvis-discount-text {
  font-size: var(--font-size-h9-5);
  font-weight: 300;
  color: #1A1A1ABF;
  margin: 0;
  line-height: 1.46vw;
  text-align: left;
  font-family: 'Geist', sans-serif;
}

.kvis-discount-dynamic {
  display: flex;
  flex-direction: column;
  gap: 0.2vw;
}

.kvis-discount-current {
  font-size: var(--font-size-h6);
  font-weight: 500;
  color: #1A1A1A;
  margin: 0;
  line-height: 1.46vw;
  text-align: left;
  font-family: 'Geist', sans-serif;
}

.kvis-discount-hint {
  font-size: var(--font-size-h9-5);
  font-weight: 300;
  color: rgba(25, 25, 25, 1);
  margin: 0;
  line-height: 1.46vw;
  text-align: left;
  font-family: 'Geist', sans-serif;
}

.kvis-progress-bar-container {
  position: absolute;
  bottom: 0.6vw;
  left: 0.6vw;
  right: 0.6vw;
  z-index: 10;
}

.kvis-progress-bar {
  width: 100%;
  height: 2.8vw;
  border-radius: 0.6vw;
  background: rgba(255, 255, 255, 0.85);
  position: relative;
  overflow: visible;
  display: flex;
  align-items: center;
  box-shadow: 0 0.1vw 0.26vw rgba(0, 0, 0, 0.1);
}

.kvis-progress-bar-fill {
  height: calc(100% - 0.21vw);
  background-color: rgba(17, 47, 85, 1);
  background-image: repeating-linear-gradient(
    -45deg,
    rgba(255, 255, 255, 0.3),
    rgba(255, 255, 255, 0.3) 2px,
    transparent 0.1vw,
    transparent 0.42vw
  );
  background-size: 0.59vw 0.59vw;
  background-position: 0 0;
  animation: progressBarStripes 1s linear infinite;
  border-radius: 0.6vw;
  transition: width 0.8s ease;
  position: absolute;
    left: 0.1vw;
    top: 0.1vw;
  z-index: 1;
}

@keyframes progressBarStripes {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: 0.59vw 0.59vw;
  }
}

.kvis-progress-text {
  font-size: var(--font-size-body);
  font-weight: 700;
  font-family: 'Geist', sans-serif;
  white-space: nowrap;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  z-index: 2;
  pointer-events: none;
  width: 100%;
  text-align: center;
}

.kvis-progress-text-black {
  color: #000000;
  position: relative;
  white-space: nowrap;
  display: inline-block;
}

.kvis-progress-text-white {
  color: #FFFFFF;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  text-align: center;
  white-space: nowrap;
  z-index: 10;
  -webkit-clip-path: inset(0 calc(100% - var(--progress)) 0 0);
          clip-path: inset(0 calc(100% - var(--progress)) 0 0);
  display: flex;
  align-items: center;
  justify-content: center;
}

.kvis-enter-hint {
  font-size: var(--font-size-body-xxs);
  color: #9e9e9e;
  margin-top: 0.21vw;
}

/* Блок "Готово!" для шага 6 */
.kvis-image-section-right {
  order: 1;
}

.kvis-ready-bar-container {
  position: absolute;
  bottom: 0.6vw;
  left: 0.6vw;
  right: 0.6vw;
  z-index: 10;
}

.kvis-ready-bar {
  width: 100%;
  height: 2.8vw;
  border-radius: 0.6vw;
  background-color: rgba(17, 47, 85, 1);
  background-image: repeating-linear-gradient(
    -45deg,
    rgba(255, 255, 255, 0.3),
    rgba(255, 255, 255, 0.3) 2px,
    transparent 0.1vw,
    transparent 0.42vw
  );
  background-size: 0.59vw 0.59vw;
  background-position: 0 0;
  animation: progressBarStripes 1s linear infinite;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.83vw;
  padding: 0 1.04vw;
  box-shadow: 0 0.1vw 0.26vw rgba(0, 0, 0, 0.1);
  border: 0.1vw solid rgb(255, 255, 255);
  box-sizing: border-box;
}

.kvis-ready-text {
  font-size: var(--font-size-body);
  font-weight: 500;
  color: #FFFFFF;
  font-family: 'Geist', sans-serif;
  white-space: nowrap;
}

.kvis-ready-bar svg {
  flex-shrink: 0;
  width: 1.15vw;
  height: 1.15vw;
}

/* Финальный шаг */
.kvis-final-step {
  display: flex;
  flex-direction: column;
  margin-bottom: 0;
}

.kvis-final-left {
  display: flex;
  flex-direction: column;
  gap: 0.5vw;
  text-align: left;
}

.kvis-final-title {
  font-size: 2.04vw;
  font-weight: 600;
  color: #000;
  line-height: 2.9vw;
  margin: 0;
}

.kvis-promo-text {
  font-size: var(--font-size-h8);
  font-weight: 300;
  color: rgba(26, 26, 26, 0.75);
  margin: 0;
  line-height: var(--line-height-relaxed);
}

.kvis-offer-cards {
  display: flex;
  flex-direction: column;
  gap: 1vw;
  margin-top: 1.4vw;
}

.kvis-offer-card {
  display: flex;
  align-items: center;
  gap: 1.05vw;
  padding: 1.04vw;
  background: rgba(255, 255, 255, 1);
  border-radius: 1vw;
  border: 0.052vw solid rgba(235, 235, 235, 1);
}

.kvis-offer-icon {
  width: 3.1vw;
  height: 3.1vw;
  background: rgba(17, 47, 85, 1);
  border-radius: 0.36vw;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.kvis-offer-icon svg {
  /* width: 100%; */
  /* height: 100%; */
  width: 1.05vw;
  height: 1.05vw;
  object-fit: contain;
}

.kvis-offer-text {
  flex: 1 1;
  font-size: var(--font-size-body);
  font-weight: 500;
  color: rgba(26, 26, 26, 0.75);
  line-height: 1.5vw;
  text-align: left;
}

.kvis-offer-checkbox {
  width: 2.34vw;
  height: 2.34vw;
  border-radius: 0.26vw;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  border: 0.13vw solid rgba(235, 235, 235, 1);
  background: white;
  box-sizing: border-box;
}

.kvis-offer-checkbox.checked {
  background-color: rgba(72, 91, 133, 1);
  border: 0.13vw solid rgba(235, 235, 235, 1);
}

.kvis-offer-checkbox svg {
  width: 0.55vw;
  height: 0.44vw;
}

/* Инпуты для шага 6 */
.kvis-inputs-section {
  display: flex;
  /* flex-direction: column; */
  gap: 1.53vw;
  margin-top: 1.56vw;
}

.kvis-input {
  width: 100%;
  padding: 1.04vw 1.25vw;
  border: 0.052vw solid rgba(235, 235, 235, 1);
  border-radius: 1vw;
  font-size: var(--font-size-body);
  font-family: 'Geist', sans-serif;
  color: rgba(26, 26, 26, 0.75);
  background: white;
  box-sizing: border-box;
  outline: none;
  transition: border-color 0.3s ease;
}

.kvis-input::placeholder {
  color: rgba(26, 26, 26, 0.5);
}

.kvis-input:focus {
  border-color: #485B85;
}

/* Убираем синий фон при автозаполнении */
.kvis-input:-webkit-autofill,
.kvis-input:-webkit-autofill:hover,
.kvis-input:-webkit-autofill:focus,
.kvis-input:-webkit-autofill:active {
  -webkit-box-shadow: 0 0 0 1.56vw white inset !important;
  -webkit-text-fill-color: rgba(26, 26, 26, 0.75) !important;
  background-color: white !important;
  background: white !important;
}

.kvis-phone-input:-webkit-autofill,
.kvis-phone-input:-webkit-autofill:hover,
.kvis-phone-input:-webkit-autofill:focus,
.kvis-phone-input:-webkit-autofill:active {
  -webkit-box-shadow: 0 0 0 1.56vw white inset !important;
  -webkit-text-fill-color: rgba(26, 26, 26, 0.75) !important;
  background-color: white !important;
  background: white !important;
}

.kvis-phone-input-wrapper {
  display: flex;
  width: 100%;
  border: 0.052vw solid rgba(235, 235, 235, 1);
  border-radius: 1vw;
  overflow: hidden;
  background: white;
  transition: border-color 0.3s ease;
}

.kvis-phone-input-wrapper:focus-within {
  border-color: #485B85;
}

.kvis-phone-prefix {
  display: flex;
  align-items: center;
  gap: 0.52vw;
  padding: 1.04vw 1.25vw;
  background: white;
  flex-shrink: 0;
  position: relative;
}

.kvis-phone-prefix::after {
  content: '';
  position: absolute;
  right: 0;
  top: 0.22vw;
  bottom: 0.22vw;
  width: 0.052vw;
  background: rgba(235, 235, 235, 1);
}

.kvis-phone-prefix svg {
  width: 1.04vw;
  height: 0.78vw;
  flex-shrink: 0;
  border: 0.064vw solid rgba(25, 25, 25, 0.411);
}

.kvis-phone-prefix span {
  font-size: var(--font-size-body);
  font-family: 'Geist', sans-serif;
  color: rgba(25, 25, 25, 1);
  font-weight: 500;
}

.kvis-phone-input {
  flex: 1 1;
  border: none;
  border-radius: 0;
  padding: 1.04vw 1.25vw;
}

.kvis-phone-input:focus {
  border: none;
  outline: none;
}

.kvis-final-right {
  display: flex;
  flex-direction: column;
  gap: 1.04vw;
}

.kvis-messenger-title {
  font-size: var(--font-size-body-medium);
  font-weight: var(--font-weight-semibold);
  color: #000;
  margin: 0 0 1.04vw 0;
  text-align: center;
}

.kvis-messenger-buttons {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-gap: 0.63vw;
  gap: 0.63vw;
  margin-bottom: 1.04vw;
}

.kvis-phone-btn {
  grid-column: 1;
}

.kvis-messenger-btn {
  padding: 0.63vw 0.83vw;
  border: 0.05vw solid #e0e0e0;
  border-radius: 0.52vw;
  background: #f5f5f5;
  cursor: pointer;
  transition: all 0.2s ease;
  font-size: var(--font-size-body-medium);
  font-weight: var(--font-weight-medium);
  display: flex;
  align-items: center;
  gap: 0.63vw;
  text-align: left;
}

.kvis-messenger-btn:hover {
  border-color: #4caf50;
  background-color: #f9f9f9;
}

.kvis-messenger-icon-circle {
  width: 2.08vw;
  height: 2.08vw;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.kvis-viber-icon {
  background-color: #8b5cf6;
}

.kvis-whatsapp-icon {
  background-color: #25d366;
}

.kvis-phone-icon {
  background-color: #e91e63;
}

.kvis-messenger-text {
  color: #333;
  font-weight: 500;
}

.kvis-messenger-btn.active {
  border-color: #4caf50;
  background-color: white;
}

.kvis-viber-btn.active .kvis-viber-icon {
  background-color: #8b5cf6;
}

.kvis-whatsapp-btn.active .kvis-whatsapp-icon {
  background-color: #25d366;
}

.kvis-phone-btn.active .kvis-phone-icon {
  background-color: #e91e63;
}

.kvis-checkbox-label {
  display: flex;
  align-items: flex-start;
  gap: 0.63vw;
  cursor: pointer;
  font-size: var(--font-size-body-small);
  color: #666;
  line-height: var(--line-height-relaxed);
  text-align: left;
  justify-content: flex-start;
}

.kvis-checkbox-input {
  width: 1.04vw;
  height: 1.04vw;
  margin-top: 0.1vw;
  cursor: pointer;
  flex-shrink: 0;
}

.kvis-checkbox-text {
  text-align: left;
}

/* Чекбокс согласия из Googing */
.googing-form-checkbox {
  display: flex;
  align-items: start;
  gap: 0.53vw;
  justify-content: flex-start;
  width: 40vw;
  margin-bottom: 0;
}

.googing-form-checkbox input[type="checkbox"] {
  width: 0.78vw;
  height: 0.78vw;
  border-radius: 0.2vw;
  border: 0.052vw solid #EBEBEB;
  background: #EBEBEB;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  position: relative;
  flex-shrink: 0;
}

.googing-form-checkbox input[type="checkbox"]:checked {
  background: rgba(72, 91, 133, 1);
  border-color: rgba(46, 61, 88, 1);
}

.layout-fade-out {
  opacity: 0;
  transform: scale(0.99);
  transition: opacity 0.4s cubic-bezier(0.4, 0, 0.2, 1), transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.layout-fade-in {
  opacity: 1;
  transform: scale(1);
  transition: opacity 0.4s cubic-bezier(0.4, 0, 0.2, 1), transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.googing-form-checkbox input[type="checkbox"]:checked::after {
  content: '';
  position: absolute;
  left: 50%;
  top: 50%;
  width: 0.12vw;
  height: 0.38vw;
  border: solid white;
  border-width: 0 0.16vw 0.16vw 0;
  transform: translate(-50%, -60%) rotate(45deg);
}

.googing-form-checkbox label {
  font-size: var(--font-size-body-small);
  font-weight: 400;
  color: rgba(26, 26, 26, 0.75);
  font-family: 'Geist', sans-serif;
  cursor: pointer;
}

.kvis-privacy-link {
  color: rgba(26, 26, 26, 0.75);
  text-decoration: underline;
}

.kvis-privacy-link:hover {
  text-decoration: underline;
}

.kvis-disclaimer {
  font-size: var(--font-size-body-xxs);
  color: #9e9e9e;
  margin: 0;
  margin-top: auto;
}

@media (max-width: 2200px) {
  .kvis-container  {
    padding: 4.17vw 2.6vw;
  }
}

@media (min-width: 2200px) {
  .kvis-calculator-title-main {
    font-size: 2.2vw;
  }
  .kvis-calculator-title-underline {
    font-size: 2.2vw;
  }
  .kvis-final-title {
    font-size: 1.6vw;
    line-height: 2.4vw;
  }
}

/* Модальное окно с согласием на обработку персональных данных */
.kvis-privacy-modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5);
  z-index: 10000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2vw;
  box-sizing: border-box;
}

.kvis-privacy-modal {
  background: #FFFFFF;
  border-radius: 1.04vw;
  max-width: 60vw;
  max-height: 90vh;
  width: 100%;
  position: relative;
  display: flex;
  flex-direction: column;
  box-shadow: 0 0 60px rgba(0, 0, 0, 0.3);
}

.kvis-privacy-modal-close {
  position: absolute;
  top: 1.04vw;
  right: 1.04vw;
  background: transparent;
  border: none;
  cursor: pointer;
  padding: 0.52vw;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 10001;
  transition: opacity 0.3s ease;
}

.kvis-privacy-modal-close:hover {
  opacity: 0.7;
}

.kvis-privacy-modal-close svg {
  width: 1.25vw;
  height: 1.25vw;
}

.kvis-privacy-modal-content {
  padding: 2.6vw;
  overflow-y: auto;
  max-height: 90vh;
}

.kvis-privacy-modal-title {
  font-size: var(--font-size-h3);
  font-weight: 600;
  color: #000000;
  margin: 0 0 1.56vw 0;
  font-family: 'Geist', sans-serif;
}

.kvis-privacy-modal-text {
  font-size: var(--font-size-body);
  font-weight: 300;
  color: #1A1A1A;
  line-height: 1.6;
  font-family: 'Geist', sans-serif;
}

.kvis-privacy-modal-text p {
  margin: 0 0 1.04vw 0;
}

.kvis-privacy-modal-text p:last-child {
  margin-bottom: 0;
}

.kvis-privacy-modal-text strong {
  font-weight: 600;
  color: #000000;
}

.kvis-privacy-modal-text ul {
  margin: 1.04vw 0;
  padding-left: 2.08vw;
}

.kvis-privacy-modal-text li {
  margin-bottom: 0.52vw;
}

.kvis-privacy-modal-text li:last-child {
  margin-bottom: 0;
}

@media (max-width: 780px) {


/* =========================================
     ИДЕАЛЬНЫЕ КНОПКИ (Далее, Назад, Получить расчет)
     ========================================= */

  /* Контейнер кнопок (выравниваем вправо) */
  .kvis-next-wrapper {
    order: 2;
    width: 100%;
    display: flex;
    justify-content: flex-end; /* Прижимаем кнопку вправо, как на макете */
    align-items: center;
    gap: 3vw;
    margin-top: 0; 
  }

  /* --- 1. Серая кнопка "Назад" --- */
  .kvis-btn-back {
    height: 11vw !important; /* Жесткая высота */
    padding: 0 6vw !important;
    border-radius: 13vw !important;
    font-size: 2.82vw !important;
    font-weight: 500 !important;
    border: 0.2vw solid #E0E0E0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: #EBEBEB !important;
    color: #000000 !important;
    box-sizing: border-box !important;
  }

  /* --- 2. Синие кнопки (База) --- */
  .kvis-btn-next.header_nuv-btn-1.header_nuv-btn-primary {
    width: auto !important;
    height: 11vw !important; /* Точно такая же высота, как у кнопки Назад */
    padding: 1vw 1vw 1vw 6vw !important; /* Отступы формируют каемочку */
    border-radius: 13vw !important;
    border: none !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    box-sizing: border-box !important;
    gap: 4vw !important;
  }

  /* Текст внутри синих кнопок */
  .kvis-btn-next.header_nuv-btn-1.header_nuv-btn-primary span {
    font-size: 2.82vw !important;
    font-weight: 500 !important;
    line-height: 1 !important;
    color: #FFFFFF !important;
  }

  /* Белый кружок */
 .kvis-btn-next.header_nuv-btn-1.header_nuv-btn-primary .header_nuv-btn-icon {
    width: 9vw !important; /* Уменьшили: 11vw - 2vw (отступы) = 9vw */
    height: 9vw !important;
    border-radius: 50% !important;
    background: #FFFFFF !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
    margin: 0 !important;
  }

  /* Стрелочка ровно вправо (поворот на 45 градусов) */
  .kvis-btn-next.header_nuv-btn-1.header_nuv-btn-primary .header_nuv-btn-icon svg {
    width: 3.5vw !important;
    height: 3.5vw !important;
    transform: rotate(45deg) !important; 
  }

  /* Анимация при наведении */
  .kvis-btn-next.header_nuv-btn-1.header_nuv-btn-primary:hover span {
    color: #FFFFFF !important; /* Текст остается белым */
    transform: translateX(0) !important; /* Не сдвигается */
  }

  .kvis-btn-next.header_nuv-btn-1.header_nuv-btn-primary:hover .header_nuv-btn-icon svg {
    transform: rotate(45deg) !important;
  }

  /* Эффект заливки (белая волна при наведении) */
  .kvis-btn-next.header_nuv-btn-1.header_nuv-btn-primary::after {
    width: 9vw !important; 
    height: 9vw !important;
    right: 1vw !important;
  }
  .kvis-btn-next.header_nuv-btn-1.header_nuv-btn-primary:hover::after {
    width: 11vw !important; /* Оставляем размер кружка стандартным */
    height: 11vw !important;
    right: 1vw !important;
  }

  /* --- 3. Финальная кнопка "Получить расчет" (6 шаг) --- */
  .kvis-btn-next.kvis-btn-submit.header_nuv-btn-1.header_nuv-btn-primary {
    width: 68% !important; /* Сделали поуже (было 76%) */
    height: 11vw !important; /* Синхронизируем высоту с остальными */
    padding: 1vw 1vw 1vw 3.5vw !important;
    margin: 0 !important;
  }

  /* Чуть уменьшаем текст, чтобы он влез в одну строку */
  .kvis-btn-next.kvis-btn-submit.header_nuv-btn-1.header_nuv-btn-primary span {
    font-size: 2.82vw !important; /* Чуть уменьшили текст, чтобы влез в узкую кнопку */
    white-space: nowrap !important;
    text-align: center;
    flex: 1 1;
  }

  /* --- 4. Ссылка "Назад" на 6-м шаге --- */
  .kvis-btn-back-step6 {
    font-size: 2.82vw !important;
    font-weight: 400 !important;
    color: rgba(26, 26, 26, 0.75) !important; /* Тот самый нужный серый цвет */
    text-decoration: underline !important;
    text-underline-offset: 0.6vw !important;
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
    height: 11vw !important; /* Синхронизируем высоту с синей кнопкой */
    display: flex !important;
    align-items: center !important; /* Идеально центрируем по вертикали */
    flex-shrink: 0 !important;
  }



  .kvis-container {
    padding: 12.82vw 1.923vw 8.97vw 1.923vw;
  }

  .kvis-card {
    padding: 2.564vw;
    border-radius: 2.564vw;
  }

  .kvis-content-wrapper.kvis-two-columns {
    display: flex;
    flex-direction: column;
    gap: 6.41vw;
  }

  .kvis-content-wrapper.kvis-two-columns.kvis-step-6 {
    flex-direction: column;
  }

  .kvis-content-wrapper.kvis-two-columns.kvis-step-6 .kvis-form-section {
    order: 2;
  }

  .kvis-content-wrapper.kvis-two-columns.kvis-step-6 .kvis-image-section-right {
    order: 1;
  }

  .kvis-image-section-right .kvis-doctor-image-wrapper,
  .kvis-image-section.kvis-image-section-right .kvis-doctor-image-wrapper {
    position: relative;
  }

  .kvis-image-section-right .kvis-play-button,
  .kvis-image-section.kvis-image-section-right .kvis-play-button {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 15.38vw;
    height: 15.38vw;
    z-index: 10;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .kvis-image-section-right .kvis-play-button::before,
  .kvis-image-section-right .kvis-play-button::after,
  .kvis-image-section.kvis-image-section-right .kvis-play-button::before,
  .kvis-image-section.kvis-image-section-right .kvis-play-button::after {
    width: 15.38vw;
    height: 15.38vw;
  }

  .kvis-image-section-right .kvis-play-button svg,
  .kvis-image-section.kvis-image-section-right .kvis-play-button svg {
    width: 3.46vw;
    height: 4.36vw;
  }

  .kvis-image-section {
    order: 1;
    width: 100%;
  }

  .kvis-form-section {
    order: 2;
  }

  .kvis-doctor-image-wrapper {
    width: 100%;
    height: 116.67vw;
    border-radius: 1.923vw;
  }

  .kvis-doctor-image {
    border-radius: 1.923vw;
  }

  .kvis-play-button {
    width: 15.38vw;
    height: 15.38vw;
  }

  .kvis-play-button::before,
  .kvis-play-button::after {
    width: 15.38vw;
    height: 15.38vw;
  }

  .kvis-play-button svg {
    width: 3.46vw;
    height: 4.36vw;
  }

  .kvis-progress-bar-container {
    bottom: 1.282vw;
    left: 1.282vw;
    right: 1.282vw;
  }

  .kvis-progress-bar {
    height: 7.179vw;
    border-radius: 1.282vw;
  }

  .kvis-progress-bar-fill {
    height: calc(100% - 0.513vw);
    border-radius: 1.026vw;
    background-image: repeating-linear-gradient(
      -45deg,
      rgba(255, 255, 255, 0.3),
      rgba(255, 255, 255, 0.3) 0.51vw,
      transparent 0.51vw,
      transparent 1.15vw
    );
    background-size: 1.67vw 1.67vw;
    animation: progressBarStripesMobile 1s linear infinite;
    position: absolute;
    left: 0.256vw;
    top: 0.256vw;
  }

  @keyframes progressBarStripesMobile {
    0% {
      background-position: 0 0;
    }
    100% {
      background-position: 1.67vw 1.67vw;
    }
  }

  .kvis-progress-text {
    font-size: 3.077vw;
    font-weight: 700;
  }

  .kvis-ready-bar-container {
    bottom: 1.282vw;
    left: 1.282vw;
    right: 1.282vw;
  }

  .kvis-ready-bar {
    height: 7.179vw;
    border-radius: 1.282vw;
    background-image: repeating-linear-gradient(
      -45deg,
      rgba(255, 255, 255, 0.3),
      rgba(255, 255, 255, 0.3) 0.51vw,
      transparent 0.51vw,
      transparent 1.15vw
    );
    background-size: 1.67vw 1.67vw;
    animation: progressBarStripesMobile 1s linear infinite;
    gap: 3.85vw;
  }

  .kvis-ready-text {
    font-size: 3.077vw;
    font-weight: 700;
  }

  .kvis-ready-bar svg {
    width: 3.33vw;
    height: 3.33vw;
  }

  .kvis-calculator-title {
    width: 100%;
    font-size: 5.77vw;
    font-weight: 700;
    line-height: 8.33vw;
    margin-bottom: 0;
  }

  .kvis-calculator-title-underline {
    text-decoration-thickness: 0.26vw;
    text-underline-offset: 0.64vw;
  }

  .kvis-calculator-subtitle {
    width: 100%;
    font-size: 3.59vw;
    font-weight: 300;
    line-height: 4.23vw;
    margin-top: 2.56vw;
    margin-bottom: 0;
  }

  .kvis-title {
    margin-top: 10.26vw;
    margin-bottom: 6.41vw;
    font-size: 4.10vw;
    font-weight: 500;
  }

  .kvis-option {
    padding: 3.85vw 2.56vw;
    border-radius: 2.564vw;
  }

  .kvis-radio-wrapper {
    margin-right: 2.564vw;
  }

  .kvis-checkbox {
    width: 5.13vw;
    height: 5.13vw;
    border-radius: 0.641vw;
  }

  .kvis-checkbox.checked svg {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 1.54vw;
    height: 1.15vw;
  }

  .kvis-checkbox.checked::before {
    width: 3.33vw;
    height: 3.33vw;
    top: 50%;
    left: 50%;
    right: auto;
    bottom: auto;
    transform: translate(-50%, -50%);
    border-radius: 0.641vw;
  }

  .kvis-option-text {
    font-size: 2.82vw;
    font-weight: 500;
  }

  .kvis-options-grid {
    grid-template-columns: 1fr;
    gap: 2.564vw;
    margin-bottom: 6.41vw;
  }

  .kvis-navigation {
    display: flex;
    flex-direction: column; /* Главное исправление! */
    align-items: stretch;
    gap: 5vw; /* Расстояние между текстом и кнопками */
    width: 100%;
  }

  .kvis-navigation.kvis-navigation-step6 {
    display: flex;
    margin-top: 6.41vw;
  }

  .kvis-discount-message {
    order: 1;
    width: 100%;
    display: flex;
    align-items: center;
    gap: 2vw !important; /* Уменьшили отступ от иконки */
  }

  .kvis-btn-next.header_nuv-btn-1.header_nuv-btn-primary:active {
    transform: scale(0.97) !important;
    transition: transform 0.1s ease !important;
  }

  /* --- ОТКЛЮЧЕНИЕ СДВИГОВ И МАСШТАБА ДЛЯ МОБИЛЬНЫХ --- */
  .kvis-form-content,
  .kvis-form-content.fade-out,
  .kvis-form-content.fade-in,
  .kvis-discount-text-wrapper.fade-out,
  .kvis-discount-text-wrapper.fade-in,
  .layout-fade-out,
  .layout-fade-in {
    transform: none !important;
  }

  

  .kvis-discount-icon {
    width: 3.846vw !important;
    height: 3.846vw !important;
    border-radius: 50%;
    overflow: hidden;
    padding: 0;
    margin: 0;
  }

  .kvis-discount-icon svg {
    width: 110% !important;
    height: 110% !important;
  }

  .kvis-discount-text {
    font-family: 'Geist', sans-serif !important;
    font-weight: 300 !important;
    font-size: 2.6vw !important; /* Идеальный размер, чтобы влезло в 1 строку */
    line-height: 1.5 !important; /* Line height 30px для 20px - это 1.5 */
    letter-spacing: 0 !important;
    color: rgba(25, 25, 25, 1) !important;
    white-space: nowrap !important; /* Жестко запрещаем перенос на новую строку */
    width: 100% !important;
    margin: 0 !important;
  }

  .kvis-btn-next {
    width: auto;
    padding: 0.77vw 0.77vw 0.77vw 3.21vw;
    border-radius: 6.41vw;
    font-size: 3.21vw;
    line-height: 2.18vw;
    gap: 3.85vw;
  }

  .kvis-btn-next .header_nuv-btn-icon {
    width: 7.69vw;
    height: 7.69vw;
  }

  .kvis-btn-next .header_nuv-btn-icon svg {
    width: 2.05vw;
    height: 1.79vw;
  }

  .kvis-btn-next::after {
    right: 0.77vw;
    width: 7.69vw;
    height: 7.69vw;
  }

  .kvis-btn-next:hover::after {
    width: 102.56vw;
    height: 102.56vw;
    right: -51.28vw;
  }

  .kvis-btn-next.header_nuv-btn-primary:hover span {
    transform: translateX(8.24vw);
  }

  .kvis-btn-next:hover .header_nuv-btn-icon svg {
    transform: translateX(-16.103vw) rotate(40deg);
  }

  

  

  /* Уменьшенная и аккуратная стрелочка вправо */
  .kvis-btn-next.header_nuv-btn-1.header_nuv-btn-primary .header_nuv-btn-icon svg {
    width: 2.2vw !important; /* Было 3.5vw */
    height: 2.2vw !important; /* Было 3.5vw */
    transform: rotate(45deg) !important; 
  }

  

  

  

  .kvis-btn-submit.header_nuv-btn-primary:hover span {
    transform: translateX(8.974vw);
  }

  .kvis-btn-submit:hover .header_nuv-btn-icon svg {
    transform: rotate(45deg) !important;
  }

 

  .kvis-discount-dynamic {
    gap: 0.5vw;
  }

  .kvis-discount-current {
    font-size: 2.82vw;
    line-height: 3.59vw;
  }

  .kvis-discount-hint {
    font-size: 2.31vw;
    line-height: 3.08vw;
  }

  .kvis-final-title {
    font-size: 5.0vw;
    font-weight: 600;
    line-height: 7.05vw;
    margin-bottom: 2.56vw;
  }

  .kvis-promo-text {
    font-size: 3.33vw;
    font-weight: 300;
    line-height: 5.13vw;
  }

  .kvis-offer-cards {
    gap: 2.56vw;
    margin-top: 6.41vw;
  }

  .kvis-offer-card {
    gap: 2.69vw;
    padding: 2.67vw;
    border-radius: 2.56vw;
  }

  .kvis-offer-icon {
    width: 7.95vw;
    height: 7.95vw;
    border-radius: 0.92vw;
  }

  .kvis-offer-icon svg {
    width: 2.69vw;
    height: 2.69vw;
  }

  .kvis-offer-text {
    font-size: 2.82vw;
    font-weight: 500;
    line-height: 3.85vw;
  }

  .kvis-offer-checkbox {
    width: 6vw;
    height: 6vw;
    border-radius: 0.67vw;
    border: 0.33vw solid rgba(235, 235, 235, 1);
  }

  .kvis-offer-checkbox.checked {
    border: 0.33vw solid rgba(235, 235, 235, 1);
  }

  .kvis-offer-checkbox svg {
    width: 1.41vw;
    height: 1.13vw;
  }

  .kvis-inputs-section {
    flex-direction: column;
    gap: 3.85vw;
    margin-top: 6.41vw;
  }

  .kvis-input {
    padding: 2.67vw 3.21vw;
    border-radius: 2.56vw;
    font-size: 2.31vw;
  }

  .kvis-input.kvis-name-input {
    font-size: 2.56vw;
  }

  .kvis-phone-input-wrapper {
    border-radius: 2.56vw;
  }

  .kvis-phone-prefix {
    padding: 2.67vw 3.21vw;
    gap: 1.33vw;
  }

  .kvis-phone-prefix span {
    font-size: 2.31vw;
    font-weight: 500;
  }

  .kvis-phone-prefix svg {
    width: 3.21vw;
    height: 2.41vw;
  }

  .kvis-phone-input {
    padding: 2.67vw 3.21vw;
    font-size: 2.56vw;
  }

  .kvis-checkbox-label {
    gap: 1.61vw;
    font-size: 1.79vw;
    line-height: 2.56vw;
  }

  

  .googing-form-checkbox {
    gap: 1.36vw;
    width: 100%;
    margin-top: 2.56vw;
  }

  .googing-form-checkbox input[type="checkbox"] {
    width: 2vw;
    height: 2vw;
    border-radius: 0.51vw;
    border: 0.13vw solid #EBEBEB;
  }

  .googing-form-checkbox input[type="checkbox"]:checked {
    border: 0.13vw solid rgba(46, 61, 88, 1);
  }

  .googing-form-checkbox input[type="checkbox"]:checked::after {
    content: '';
    position: absolute;
    left: 50%;
    top: 50%;
    width: 0.38vw;
    height: 0.77vw;
    border: solid white;
    border-width: 0 0.26vw 0.26vw 0;
    transform: translate(-50%, -60%) rotate(45deg);
  }

  .googing-form-checkbox label {
    font-size: 2.56vw;
    line-height: 2.56vw;
  }
}

/* =========================================
   РАЗМЕРЫ ИЗ FIGMA С АДАПТАЦИЕЙ В VW (Desktop)
   ========================================= */
@media (min-width: 781px) {
  /* gap: 30px */
  .kvis-inputs-section {
    gap: 1.563vw !important;
  }

  /* width: 590px, height: 80px, border-radius: 20px, border-width: 1px */
  .kvis-input.kvis-name-input,
  .kvis-phone-input-wrapper {
    width: 30.729vw !important;
    height: 4.167vw !important;
    border-radius: 1.042vw !important;
    border-width: 0.052vw !important;
  }

  /* padding: 20px */
  .kvis-input.kvis-name-input {
    padding: 1.042vw !important;
  }

  /* Внутренние отступы для телефона (padding 20px) */
  .kvis-phone-prefix {
    padding: 0 1.042vw !important;
    height: 100% !important;
  }

  .kvis-phone-input {
    padding: 0 1.042vw !important;
    height: 100% !important;
    border: none !important;
  }

  /* Шрифт: 18px, line-height: 28px */
  .kvis-btn-next.kvis-btn-submit span {
    font-family: 'Geist', sans-serif !important;
    font-weight: 500 !important;
    font-size: 0.938vw !important;
    line-height: 1.458vw !important;
    letter-spacing: 0% !important;
    vertical-align: middle !important;
  }
}

.footer {
  width: 100%;
  background: #FFFFFF;
  padding: 2.6vw 0 1.5vw 0;
}

.footer-container {
  width: 100%;
  max-width: 100vw;
  margin: 0 auto;
  padding: 0 10%;
  box-sizing: border-box;
}

.footer-content {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 2.6vw;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

/* Общие стили для блоков */
.footer-block {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

/* Блок 1 - Логотип */
.footer-logo-block {
  flex-shrink: 0;
}

.footer-logo {
  flex-shrink: 0;
}

.footer-logo img {
  width: 11.51vw;
  height: 3.65vw;
  object-fit: contain;
}

/* Блок 2 - Описание клиники */
.footer-description-block {
  flex-shrink: 0;
}

.footer-clinic-description {
  font-size: var(--font-size-body);
  font-weight: 300;
  color: rgba(26, 26, 26, 0.75);
  margin: 0.52vw 0;
  font-family: 'Geist', sans-serif;
  line-height: 1.25vw;
  text-align: left;
}

/* Блок 3 - Локация */
.footer-location-block {
  flex-shrink: 0;
  gap: 0.52vw;
}

.footer-location-title {
  font-size: var(--font-size-body);
  font-weight: 500;
  color: rgba(0, 0, 0, 1);
  margin: 0.52vw 0 0 0;
  font-family: 'Geist', sans-serif;
  text-align: left;
}

.footer-location-address {
  font-size: var(--font-size-body);
  font-weight: 300;
  color: rgba(26, 26, 26, 0.75);
  margin: 0 0 0.52vw 0;
  font-family: 'Geist', sans-serif;
  text-align: left;
}

/* Блок 4 - Контакты */
.footer-contact-block {
  flex-shrink: 0;
  gap: 0.52vw;
}

.footer-contact-title {
  font-size: var(--font-size-body);
  font-weight: 500;
  color: rgba(25, 25, 25, 1);
  margin: 0.52vw 0 0 0;
  font-family: 'Geist', sans-serif;
  text-align: left;
}

.footer-contact-phone {
  font-size: var(--font-size-body);
  font-weight: 300;
  color: rgba(26, 26, 26, 0.75);
  text-decoration: none;
  font-family: 'Geist', sans-serif;
  transition: color 0.3s ease;
  text-align: left;
  margin: 0 0 0.52vw 0;
}

.footer-contact-phone:hover {
  color: #485B85;
}

/* Блок 5 - Форма экстренной записи */
.footer-form-block {
  flex-shrink: 1;
  min-width: 0;
  max-width: 28.65vw;
  width: 100%;
}

.footer-emergency {
  display: flex;
  flex-direction: column;
  gap: 2.5vw;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

.footer-emergency-title {
  font-size: var(--font-size-body);
  font-weight: 700;
  margin: 0;
  font-family: 'Geist', sans-serif;
  line-height: 1.5;
  text-align: left;
  
}

.footer-emergency-question {
  color: #485B85;
}

.footer-emergency-text {
  color: #485B85;
}

.footer-emergency-form {
  display: flex;
  flex-direction: column;
  gap: 0.98vw;
  margin-top: -1.5vw; /* Добавлено: подтягивает форму с инпутом вверх. Подбери значение на глаз (например от -1vw до -2.5vw) */
}

.footer-phone-input-wrapper {
  display: flex;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  border: 0.052vw solid #EBEBEB;
  border-radius: 4.5vw;
  overflow: hidden;
  background: white;
  transition: border-color 0.3s ease;
  gap: 0.26vw;
  padding: 0.26vw;
  align-items: center;
  box-sizing: border-box;
}

.footer-phone-input-wrapper:focus-within {
  border-color: #485B85;
}

.footer-phone-prefix {
  display: flex;
  align-items: center;
  gap: 0.52vw;
  padding: 1.04vw 1.25vw;
  background: white;
  flex-shrink: 0;
  position: relative;
  border-radius: 4.5vw;
}

.footer-phone-prefix::after {
  content: '';
  position: absolute;
  right: 0;
  top: 0.22vw;
  bottom: 0.22vw;
  width: 0.052vw;
  background: #EBEBEB;
}


.footer-phone-prefix svg {
  width: 1.04vw;
  height: 0.78vw;
  flex-shrink: 0;
}

.footer-phone-prefix span {
  font-size: var(--font-size-body);
  font-family: 'Geist', sans-serif;
  color: rgba(25, 25, 25, 1);
  font-weight: 500;
}

.footer-phone-input {
  flex: 1 1;
  min-width: 0;
  border: none;
  border-radius: 0.78vw;
  padding: 1.04vw 1.25vw;
  font-size: var(--font-size-button);
  font-family: 'Geist', sans-serif;
  color: rgba(26, 26, 26, 0.75);
  background: white;
  outline: none;
  transition: border-color 0.3s ease;
}

.footer-phone-input::placeholder {
  color: rgba(26, 26, 26, 0.5);
}

.footer-phone-input:focus {
  border: none;
  outline: none;
}

/* .footer-phone-input-error {
  border-color: rgba(235, 235, 235, 1);
} */

.footer-submit-btn {
  height: 3.48vw; /* Fixed 66.78px */
  width: -webkit-fit-content;
  width: fit-content; /* Hug 210.68px */
  padding: 0 2.32vw; /* Right и Left 44.52px */
  border-radius: 4.64vw; /* Radius 89.04px */
  border: 0.046vw solid #2E3D58; /* Border 0.89px */
  gap: 1.39vw; /* Gap 26.71px */
  font-weight: 500;
  font-size: var(--font-size-body);
  cursor: pointer;
  transition: all 0.3s ease;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Geist', sans-serif;
  position: relative;
  overflow: hidden;
  background: transparent;
  color: #485B85;
}

.footer-submit-btn:hover {
  background: #FFFFFF;
}

.footer-btn-primary {
  background: #485B85;
  color: #FFFFFF;
}

.footer-btn-primary span {
  font-size: var(--font-size-button);
  color: #FFFFFF;
  font-weight: 500;
  line-height: 0.94vw;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  position: relative;
  z-index: 2;
}

.footer-btn-primary:hover span {
  transform: translateX(min(2.2vw, 4.8vw));
  color: #485B85;
}

.footer-btn-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
  z-index: 2;
  width: 0.63vw;
  height: 0.57vw;
}

.footer-btn-icon svg {
  width: 100%;
  height: 100%;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}



.footer-btn-icon svg path {
  fill: #FFFFFF;
  transition: fill 0.3s ease, transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.footer-submit-btn:hover .footer-btn-icon svg {
  transform: translateX(max(-5.35vw, calc(-10% - 20.04vw))) rotate(40deg);
}

.footer-submit-btn:hover .footer-btn-icon svg path {
  fill: #485B85;
}

/* Эффект блика для кнопки */
.footer-submit-btn .flare {
  position: absolute;
  top: 0;
  height: 100%;
  width: 45px;
  transform: skewX(-45deg);
  animation: flareAnimation 3s infinite;
  left: -170%;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.9), #fff);
  filter: blur(0px);
  z-index: 1;
  pointer-events: none;
}

@keyframes flareAnimation {
  0% {
    left: -170%;
  }
  50% {
    left: 170%;
  }
  100% {
    left: 170%;
  }
}


.footer-form-checkbox {
  display: flex;
  gap: 0.53vw;
  justify-content: flex-start;
  margin-top: 0.52vw; /* Добавлено: опускает блок на ~10px вниз */
}

.footer-form-checkbox input[type="checkbox"] {
  width: 0.78vw;
  height: 0.78vw;
  border-radius: 0.2vw;
  border: 0.052vw solid #EBEBEB;
  background: #EBEBEB;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  position: relative;
  flex-shrink: 0;
}

.footer-form-checkbox input[type="checkbox"]:checked {
  background: rgba(72, 91, 133, 1);
  border-color: rgba(46, 61, 88, 1);
}

.footer-form-checkbox input[type="checkbox"]:checked::after {
  content: '';
  position: absolute;
  left: 50%;
  top: 50%;
  width: 0.12vw;
  height: 0.38vw;
  border: solid white;
  border-width: 0 0.16vw 0.16vw 0;
  transform: translate(-50%, -60%) rotate(45deg);
}

.footer-form-checkbox label {
  text-align: left;
  font-size: var(--font-size-body-small);
  font-weight: 400;
  color: #666666;
  font-family: 'Geist', sans-serif;
  cursor: pointer;
}

/* Нижняя секция - Услуги и платежные системы */
.footer-bottom {
  margin-top: 3.13vw;
  padding-top: 3.13vw;
  border-top: 0.052vw solid rgba(235, 235, 235, 1);
}

.footer-services {
  display: flex;
  justify-content: space-between;
  gap: 2.0vw;
}

.footer-services-column {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  flex: 1 1;
}

.footer-services-title {
  font-size: var(--font-size-body);
  font-weight: 500;
  color: rgba(0, 0, 0, 1);
  margin: 0 0 1.04vw 0;
  font-family: 'Geist', sans-serif;
  text-align: left;
}

.footer-services-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0.52vw;
}

.footer-services-list li {
  font-size: var(--font-size-body);
  font-weight: 300;
  color: rgba(26, 26, 26, 0.75);
  font-family: 'Geist', sans-serif;
  text-align: left;
  line-height: 1.5;
}

.footer-payment-column {
  flex: 0 0 auto;
  min-width: 15.63vw;
}

.footer-payment-logos {
  display: flex;
  /* flex-direction: column; */
  gap: 0.78vw;
  margin-top: 1.04vw;
}

.footer-payment-logo {
  width: 4.95vw;
  height: 3.18vw;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.footer-payment-logo svg {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.footer-payment-logo-visa {
  /* width: 3.8vw;
  min-height: 0.83vw; */
  height: auto;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  background: #485B85;
  border-radius: 0.52vw;
  padding: 0.78vw 1.04vw;
  box-sizing: border-box;
}

/* Нижняя секция - Юридическая информация, QR код и информация о компании */
.footer-legal {
  margin-top: 3.13vw;
  padding-top: 3.13vw;
  border-top: 0.052vw solid rgba(235, 235, 235, 1);
}

.footer-legal-content {
  display: flex;
  justify-content: space-between;
  align-items: center; /* Выравнивание всего контента по центру по вертикали */
  gap: 2.6vw;
  width: 100%;
}



.footer-legal-warning,
.footer-company-name {
  width: 100%;
  font-family: 'Geist', sans-serif;
  font-weight: 500;
  font-size: 0.94vw; /* Эквивалент 18px */
  line-height: 1.46vw; /* Эквивалент 28px */
  letter-spacing: 0;
  color: rgba(25, 25, 25, 0.5); /* Цвет 25,25,25 + Opacity 50% */
  margin: 0;
  text-align: left;
}

.footer-legal-disclaimer,
.footer-company-details {
  width: 100%;
  font-family: 'Geist', sans-serif;
  font-weight: 300;
  font-size: 0.73vw; /* Эквивалент 14px */
  line-height: 1.09vw; /* Эквивалент 21px */
  letter-spacing: 0;
  color: rgba(26, 26, 26, 0.5); /* Цвет 26,26,26 + Opacity 50% */
  margin: 0;
  text-align: left;
}

.footer-legal-center {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  gap: 0.52vw;
}

.footer-qr-code {
  width: 6.56vw;
  height: 6.56vw;
  display: flex;
  align-items: center;
  justify-content: center;
}

.footer-qr-code svg {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.footer-qr-text {
  font-family: 'Geist', sans-serif;
  font-weight: 300;
  font-size: 0.73vw; /* Эквивалент 14px */
  line-height: 1.09vw; /* Эквивалент 21px */
  letter-spacing: 0;
  color: rgba(25, 25, 25, 0.5); /* Цвет 25,25,25 + Opacity 50% */
  margin: 0;
  text-align: center;
}

.footer-legal-left, 
.footer-legal-right {
  flex: 1 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  max-width: 36.98vw; /* Эквивалент 710px */
  gap: 0.52vw; /* Небольшой отступ между заголовком и текстом, чтобы они не слипались */
}

.footer-legal-right {
  align-items: flex-start; /* Прижимаем контент правой колонки к левому краю */
}



/* Блок 3 - Подписка (Экстренная запись) */
/* Блок 3 - Подписка (Экстренная запись) */
.footer-subscribe {
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  gap: 2.6vw; /* Увеличенный отступ (~50px) для визуального разделения */
  max-width: 26vw;
}

.footer-company-director {
  font-size: var(--font-size-body-small);
  font-weight: 300;
  color: rgba(26, 26, 26, 0.75);
  margin: 0;
  font-family: 'Geist', sans-serif;
  line-height: 1.5;
  text-align: right;
}

@media (max-width: 2200px) {
  .footer-container {
    padding: 0 2.6vw;
  }
}

@media (min-width: 2201px) {
  .footer-form-block {
    max-width: 550px;
  }
  
  .footer-content {
    max-width: 100%;
    overflow: hidden;
    gap: 1.5vw;
  }
  
  .footer-emergency-form {
    gap: 0.4vw;
  }
  
  .footer-phone-input-wrapper {
    gap: 0.26vw;
    padding: 0.26vw;
  }
  
  .footer-phone-prefix {
    gap: 0.52vw;
    padding: 1.04vw 1.25vw;
  }
  
  .footer-phone-input {
    padding: 1.04vw 1.25vw;
    font-size: var(--font-size-button);
  }
  
  .footer-submit-btn {
    padding: 0.31vw 0.31vw 0.31vw 1.56vw;
    gap: 1.56vw;
    font-size: var(--font-size-body);
    line-height: 0.89vw;
  }
  
  .footer-btn-icon {
    width: 3.125vw;
    height: 3.125vw;
  }
  
  .footer-btn-icon svg {
    width: 0.73vw;
    height: 0.63vw;
  }
  
  .footer-submit-btn::after {
    width: 3.125vw;
    height: 3.125vw;
    right: 0.31vw;
  }
}

.kvis-privacy-link {
  color: rgba(26, 26, 26, 0.75);
  text-decoration: underline;
  cursor: pointer;
}

.kvis-privacy-link:hover {
  text-decoration: underline;
  color: rgba(26, 26, 26, 1);
}

@media (max-width: 780px) {
  .footer {
    padding-top: 0;
    padding-bottom: 6.41vw;
  }

  .footer-content {
    flex-direction: column;
    align-items: stretch;
  }

  .footer-logo-block,
  .footer-description-block,
  .footer-location-block,
  .footer-contact-block {
    display: none;
  }

  .footer-form-block {
    max-width: 100%;
    width: 100%;
  }

  .footer-emergency {
    gap: 2.56vw;
  }

  .footer-emergency-form {
    gap: 2.31vw;
  }

  .footer-emergency-title {
    justify-content: center !important; /* Главное исправление для флекс-контейнера */
    text-align: center !important;
    width: 100% !important;
    font-size: 2.3vw; 
    line-height: 5.13vw;
    margin-bottom: 3.85vw;
  }
  

  /* 1. Центрируем заголовок "Острая боль..." и поднимаем форму чуть выше */
  .footer-emergency-title {
    text-align: center !important;
    width: 100% !important;
    margin-bottom: 1.5vw !important; /* Уменьшили отступ (было 3.85vw), чтобы поднять форму */
  }

  /* 2. Центрируем саму форму целиком (инпут и галочка выровняются по центру экрана) */
  .footer-emergency-form {
    display: flex;
    flex-direction: column;
    align-items: center; 
    gap: 2.5vw;
  }

  /* 3. Настраиваем и сужаем белую плашку (контейнер для телефона и кнопки) */
  .footer-phone-input-wrapper {
    display: flex !important;
    position: relative !important;
    width: 85% !important; /* Сузили всё поле (было 100%) */
    margin: 0 auto !important; /* Выровняли его ровно по центру */
    border: 0.13vw solid rgba(235, 235, 235, 1) !important;
    border-radius: 12.82vw !important;
    background: white !important;
    padding: 0 !important;
    align-items: center !important;
    box-sizing: border-box !important;
  }
  /* 4. Центрируем набираемый текст внутри поля */
  .footer-phone-input {
    flex: 1 1 !important;
    min-width: 0 !important;
    border: none !important;
    background: transparent !important;
    /* Делаем огромный отступ справа (35vw), чтобы текст номера не залезал под кнопку */
    padding: 3.33vw 30vw 3.33vw 2.56vw !important; 
    font-size: 2.31vw !important;
    text-align: center !important; /* Центрируем вводимые цифры */
  }

  /* 5. Настраиваем кнопку "Записаться" (без вылетов за экран!) */
  .footer-submit-btn {
    position: absolute !important;
    right: 0.5vw !important; /* Прижали кнопку ближе к правому краю инпута */
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: auto !important;
    height: 90% !important; /* Высота теперь занимает почти 100% поля ввода */
    padding: 0 5.5vw !important; /* Увеличили внутренние отступы, чтобы кнопка стала шире */
    margin: 0 !important;
    border-radius: 10vw !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    z-index: 10 !important;
  }

  /* 6. Центрируем галочку и текст согласия */
  .footer-form-checkbox {
    justify-content: center !important; /* Выстраивает галочку и текст по центру */
    width: 100%;
  }

  .footer-form-checkbox label {
    text-align: center !important;
  }

  

 

  .footer-phone-input-wrapper:focus-within {
    border-color: #485B85;
  }

  .footer-phone-prefix {
    display: flex;
    align-items: center;
    gap: 1.92vw;
    padding: 3.33vw 2.56vw;
    background: white;
    flex-shrink: 0;
    position: relative;
    border-radius: 0;
  }

  .footer-phone-prefix::after {
    content: '';
    position: absolute;
    right: 0;
    top: 0.77vw;
    bottom: 0.77vw;
    width: 0.13vw;
    background: #EBEBEB;
  }

  .footer-phone-prefix svg {
    width: 3.21vw;
    height: 2.18vw;
    flex-shrink: 0;
  }

  .footer-phone-prefix span {
    font-size: 2.31vw;
    line-height: 3.59vw;
  }

  

  .footer-form-checkbox {
    display: flex;
    align-items: center;
    gap: 0.68vw;
    justify-content: flex-start;
    width: 100%;
    margin-top: 0.52vw;
  }

  .footer-form-checkbox input[type="checkbox"] {
    width: 1.92vw;
    height: 1.92vw;
    border-radius: 0.26vw;
    border: 0.067vw solid #EBEBEB;
    background: #EBEBEB;
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    position: relative;
    flex-shrink: 0;
  }

  .footer-form-checkbox input[type="checkbox"]:checked {
    background: rgba(72, 91, 133, 1);
    border-color: rgba(46, 61, 88, 1);
  }

  .footer-form-checkbox input[type="checkbox"]:checked::after {
    content: '';
    position: absolute;
    left: 50%;
    top: 50%;
    width: 0.15vw;
    height: 0.49vw;
    border: solid white;
    border-width: 0 0.21vw 0.21vw 0;
    transform: translate(-50%, -60%) rotate(45deg);
  }

  .footer-form-checkbox label {
    font-size: 2.31vw;
    line-height: 3.59vw;
    font-weight: 400;
    color: #666666;
    font-family: 'Geist', sans-serif;
    cursor: pointer;
    text-align: left;
  }



  .footer-submit-btn.footer-btn-primary span {
    font-size: 1.79vw;
    line-height: 2.56vw;
  }

  .footer-btn-icon {
    width: 1.79vw;
    height: 1.41vw;
  }

  .footer-btn-icon svg {
    width: 1.79vw;
    height: 1.41vw;
  }

  .footer-submit-btn.footer-btn-primary:hover .footer-btn-icon svg {
    transform: translateX(max(-16.7vw, calc(-10% - 30.56vw))) rotate(40deg);
  }

  .footer-submit-btn.footer-btn-primary:hover span {
    transform: translateX(max(8.7vw, calc(-10% - 30.56vw)));
  }

  .footer-bottom {
    margin-top: 3.85vw;
    padding-top: 6.41vw;
    padding-bottom: 0;
  }

  .footer-services {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 2.56vw;
    gap: 2.56vw;
  }

  .footer-services-column {
    height: 38.46vw;
    background: rgba(245, 245, 245, 1);
    border-radius: 2.56vw;
    padding: 2.56vw;
  }

  .footer-services-title {
    font-size: 2.31vw;
    line-height: 3.59vw;
    margin-bottom: 1.28vw;
  }

  .footer-services-list {
    font-size: 2.31vw;
    line-height: 3.59vw;
    gap: 1.28vw;
  }

  .footer-services-list li {
    font-size: 2.31vw;
    line-height: 3.59vw;
  }

  .footer-payment-logo {
    width: 12.05vw;
    height: 7.69vw;
  }

  .footer-payment-logo svg {
    width: 100%;
    height: 100%;
  }

  .footer-legal {
    margin-top: 3.85vw;
    padding-top: 6.41vw;
  }

  .footer-legal-content {
  display: flex;
  justify-content: space-between;
  gap: 2.6vw;
  align-items: center; /* Центрирование всех элементов по вертикали */
}

  .footer-legal-center {
    display: none;
  }

  .footer-legal-left {
    order: 1;
    gap: 1.28vw;
  }

  .footer-legal-warning {
    font-size: 2.31vw;
    line-height: 3.59vw;
    width: 100%;
  }

  .footer-legal-disclaimer {
    font-size: 1.79vw;
    line-height: 2.69vw;
    width: 100%;
  }

  .footer-legal-right {
    order: 2;
    align-items: flex-start;
    gap: 1.28vw;
  }

  .footer-company-name {
    font-size: 2.31vw;
    line-height: 3.59vw;
    width: 100%;
    margin-right: 0;
  }

  .footer-company-details {
    font-size: 1.79vw;
    line-height: 2.69vw;
    width: 100%;
  }
}



/* Нижний блок - Темно-синий фон с контактами */
.footer-bottom-dark {
  width: 100%;
  padding: 3.13vw 10% 1.0vw 10%;
  background: rgba(17, 47, 85, 1);
  box-sizing: border-box;
}

.footer-bottom-dark-content {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 2.6vw;
  margin-bottom: 2.6vw;
}

.footer-bottom-dark-left {
  /* flex: 1; */
  display: flex;
  flex-direction: column;
  gap: 0.3vw;
}

.footer-bottom-dark-title {
  font-size: 1.15vw;
  font-weight: 500;
  color: rgba(255, 255, 255, 1);
  margin: 0;
  font-family: 'Geist', sans-serif;
  line-height: 1.3;
  text-align: left;
}

.footer-bottom-dark-subtitle {
  font-family: 'Geist', sans-serif;
  font-weight: 300;
  font-size: 0.94vw; /* Эквивалент 18px */
  line-height: 1.46vw; /* Эквивалент 28px */
  letter-spacing: 0;
  color: rgba(255, 255, 255, 0.7); /* Цвет по дизайну */
  margin: 0;
  text-align: left;
}

.footer-bottom-dark-center {
  flex: 1 1;
  display: flex;
  justify-content: space-between;
  /* flex-direction: column; */
  gap: 1.56vw;
}

.footer-bottom-dark-info-block {
  display: flex;
  flex-direction: column;
  gap: 0.52vw;
}

.footer-bottom-dark-info-title {
  font-size: 0.94vw;
  font-weight: 300;
  color: rgba(255, 255, 255, 0.75);
  margin: 0;
  font-family: 'Geist', sans-serif;
  text-align: left;
}

.footer-bottom-dark-info-title-large {
  font-size: 1.15vw;
  font-weight: 500;
  color: rgba(255, 255, 255, 1);
}

.footer-bottom-dark-info-value,
.footer-bottom-dark-info-link {
  font-family: 'Geist', sans-serif;
  font-weight: 300;
  font-size: 0.94vw; /* Эквивалент 18px */
  line-height: 1.46vw; /* Эквивалент 28px */
  letter-spacing: 0;
  color: rgba(255, 255, 255, 0.7); /* Цвет по дизайну */
  margin: 0;
  text-decoration: none;
  text-align: left;
  transition: color 0.3s ease;
}

.footer-bottom-dark-info-value:hover,
.footer-bottom-dark-info-link:hover {
  color: #FFFFFF;
}

.footer-bottom-dark-right {
  flex-shrink: 0;
}

.footer-bottom-dark-contact-wrapper {
  display: flex;
  align-items: center;
  gap: 0.26vw;
  flex-shrink: 0;
  position: relative;
  overflow: visible;
}

@keyframes footer-bottom-dark-swing {
  0%, 100% {
    transform: rotate(-20deg);
  }
  50% {
    transform: rotate(30deg);
  }
}

@keyframes footer-bottom-dark-pulse {
  0% {
    transform: scale(0.8);
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  100% {
    transform: scale(1.1);
    opacity: 0;
  }
}

@keyframes pulse-border-phone-footer {
  0% {
    transform: translate(-50%, -50%) translateZ(0) scale(1);
    opacity: 1;
  }
  100% {
    transform: translate(-50%, -50%) translateZ(0) scale(1.5);
    opacity: 0;
  }
}

.footer-bottom-dark-phone-icon {
  width: 2.86vw;
  height: 2.86vw;
  border-radius: 50%;
  background: #FFFFFF;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
  z-index: 100;
  overflow: visible;
  box-sizing: content-box;
}

.footer-bottom-dark-phone-icon:hover::before {
  content: "";
  position: absolute;
  z-index: 0;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  display: block;
  width: 2.86vw;
  height: 2.86vw;
  background: #FFFFFF;
  border-radius: 50%;
  animation: pulse-border-phone-footer 1500ms ease-out infinite;
}

.footer-bottom-dark-phone-icon:hover::after {
  content: "";
  position: absolute;
  z-index: 1;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  display: block;
  width: 2.86vw;
  height: 2.86vw;
  background: #FFFFFF;
  border-radius: 50%;
  transition: all 200ms;
  background-color: rgba(255, 255, 255, 0.9);
}

.footer-bottom-dark-phone-icon svg {
  width: 1.04vw;
  height: 1.04vw;
  transform-origin: center;
  animation: footer-bottom-dark-swing 2s ease-in-out infinite;
  position: relative;
  z-index: 3;
}

.footer-bottom-dark-phone-icon svg path {
  fill: #485B85;
}

.footer-bottom-dark-contact-block {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.78vw;
  padding: 0.21vw 0.23vw 0.21vw 1.56vw;
  background: #FFFFFF;
  border-radius: 2.6vw;
  flex-shrink: 0;
  margin-right: 0.26vw;
}

.footer-bottom-dark-phone-info {
  display: flex;
  flex-direction: column;
}

.footer-bottom-dark-phone-number {
  text-align: left;
  font-size: 1.04vw;
  font-weight: 500;
  color: #000000;
  line-height: 0.94vw;
}

.footer-bottom-dark-phone-hours {
  font-size: var(--font-size-body-xxs);
  color: #1A1A1ABF;
  line-height: 100%;
  text-align: left;
  margin-top: 0.26vw;
  font-weight: 300;
  position: relative;
}

.footer-bottom-dark-avatar {
  width: 2.6vw;
  height: 2.6vw;
  border-radius: 50%;
  overflow: hidden;
  flex-shrink: 0;
}

.footer-bottom-dark-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.footer-bottom-dark-links {
  display: flex;
  justify-content: space-between; /* Распределяем элементы по всей ширине линии */
  align-items: center;
  gap: 1.5vw;
  padding-top: 1.56vw; /* Отступ текста от верхней линии */
  border-top: 0.052vw solid rgba(255, 255, 255, 0.2);
  flex-wrap: wrap; /* Для подстраховки на узких экранах */
  width: 100%;
}

.footer-bottom-dark-link {
  font-family: 'Geist', sans-serif;
  font-weight: 300;
  font-size: 0.73vw; /* Эквивалент 14px */
  line-height: 1.09vw; /* Эквивалент 21px */
  letter-spacing: 0;
  color: rgba(255, 255, 255, 0.7); /* Цвет по дизайну */
  margin: 0;
  text-decoration: none;
  text-align: center; /* Выравнивание по центру, как в ТЗ */
  transition: color 0.3s ease;
}

.footer-bottom-dark-link:hover {
  color: #FFFFFF;
}

@media (max-width: 2200px) {
  .footer-bottom-dark {
    padding: 3.13vw 2.6vw 2.0vw 2.6vw;
  }
}

@media (max-width: 780px) {
  .footer-bottom-dark-content {
    display: none;
  }

  .footer-bottom-dark-links {
    padding: 6.41vw;
    flex-direction: column;
    gap: 6.41vw;
  }

  .footer-bottom-dark-link {
    font-size: 1.79vw;
  }
}


.modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1000;
  padding: 1.042vw;
}


/* --- КЛЮЧЕВЫЕ КАДРЫ (АНИМАЦИИ) --- */
@keyframes fadeInOverlay {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes fadeOutOverlay {
  from { opacity: 1; }
  to { opacity: 0; }
}

@keyframes scaleInModal {
  from { 
    opacity: 0; 
    transform: scale(0.95) translateY(20px); 
  }
  to { 
    opacity: 1; 
    transform: scale(1) translateY(0); 
  }
}

@keyframes scaleOutModal {
  from { 
    opacity: 1; 
    transform: scale(1) translateY(0); 
  }
  to { 
    opacity: 0; 
    transform: scale(0.95) translateY(20px); 
  }
}

/* --- ПРИМЕНЕНИЕ АНИМАЦИЙ К БЛОКАМ --- */

/* НОВЫЙ ВАРИАНТ: Мягкий блюр как на макете */
.modal-overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.5); /* Чуть темнее фон для контраста */
  backdrop-filter: blur(5px); /* <--- УМЕНЬШИЛИ ДО 5px */
  -webkit-backdrop-filter: blur(5px);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1000;
  padding: 1.042vw;
}

/* Анимация ПРИ ЗАКРЫТИИ для фона */
.modal-overlay.closing {
  animation: fadeOutOverlay 0.4s ease-out forwards;
}

.modal-content {
  background: white;
  border-radius: 1.04vw; 
  padding: 0;
  width: 68vw; 
  height: auto; /* Окно теперь облегает контент */
  max-width: 90vw;
  position: relative;
  box-shadow: 0 0 2.08vw 0 rgba(0, 0, 0, 0.1); 
  overflow: hidden;
  display: flex;
}

/* Анимация ПРИ ЗАКРЫТИИ для карточки */
.modal-content.closing {
  animation: scaleOutModal 0.4s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

/* БАЗОВЫЕ ОТСТУПЫ */
.modal-wrapper {
  display: flex;
  
  /* ФИКС 1: СТРОГО 50 ПИКСЕЛЕЙ (2.6vw) между левым видео/фото и правым текстом */
  gap: 2.6vw !important; 
  
  /* ФИКС 2: Уменьшили отступ СПРАВА (до 4.5vw). 
     Теперь дыра между текстом "Перезвоним за 2 минуты" и кнопкой выйти исчезнет! */
  padding: 1.04vw 4.5vw 1.04vw 1.04vw !important; 
  
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  align-items: stretch;
}

/* ИНДИВИДУАЛЬНАЯ НАСТРОЙКА ДЛЯ ВТОРОГО ПОПАПА */
.modal-content.type-emergency .modal-wrapper {
  /* Для "Острой боли" делаем отступ справа чуть больше (5.5vw), 
     чтобы длинная строчка текста не врезалась в крестик */
  padding-right: 5.5vw !important; 
}

.modal-image-block {
  flex: 1 1;
  min-width: 0;
  overflow: hidden;
  border-radius: 0.521vw;
}

.modal-image-block video,
.modal-image-block img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: inherit;
}

.modal-form-block {
  display: flex;
  flex-direction: column;
  
  /* ФИКС: Отключаем резиновую ширину. Блок теперь строго равен переменной */
  flex: none !important; 
  width: var(--form-width) !important;
  
  height: auto; 
  justify-content: flex-start;
  text-align: left; 
}





.modal-close {
  position: absolute;
  
  /* Стоит аккуратно с краю: по 20 пикселей сверху и справа */
  top: 1.04vw !important;
  right: 1.04vw !important; 
  
  width: 2.5vw; 
  height: 2.5vw; 
  background: #F6F6F6; 
  border: none;
  border-radius: 50%; 
  color: #a0a0a0; 
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0; 
  box-sizing: border-box; 
  transition: all 0.3s ease; 
  z-index: 1001;
}

.modal-close svg {
  width: 1.1vw; 
  height: 1.1vw;
  display: block;
  margin: auto; 
}

.modal-close svg {
  /* Вместо 45% используем точные vw, чтобы избежать дробных пикселей */
  width: 1.1vw; 
  height: 1.1vw;
  display: block;
  margin: auto; /* Дополнительная гарантия математического центра */
}

/* Эффект при наведении (Ховер) */
.modal-close:hover {
  background: #EBEBEB; 
  color: #2E3D58; 
  transform: rotate(90deg); 
}


.modal-title {
  font-family: 'Geist', sans-serif;
  font-weight: 600; 
  font-size: 2.08vw; 
  line-height: 2.86vw; 
  color: rgba(17, 47, 85, 1);
  margin: 0 0 0.52vw 0 !important; 
  text-align: left !important; 
  
  /* ФИКС: Базовая ширина по инпутам, но разрешаем растягиваться под длинный текст */
  min-width: 27.86vw !important; 
  width: -webkit-max-content !important; 
  width: max-content !important; 
  padding-right: 0 !important; 
  
  /* Строго 1 строка, НИКАКОЙ обрезки троеточием */
  white-space: nowrap !important; 
  overflow: visible !important; 
  display: block; 
}

.modal-description,
.modal-description span {
  font-family: 'Geist', sans-serif;
  font-weight: 200; 
  font-size: 1.146vw; 
  line-height: 1.719vw; 
  color: #1A1A1A; 
  text-align: left !important; 
  margin: 0 0 1.56vw 0 !important; 
  
  /* Идеальная ширина */
  width: var(--form-width) !important; 
  max-width: var(--form-width) !important;
  
  /* Строго 3 строки */
  display: -webkit-box !important;
  -webkit-line-clamp: 3 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  white-space: normal !important; 
}

.modal-form {
  display: flex;
  flex-direction: column;
  margin: 0; 
  gap: 0; 
  flex-grow: 1; 
  
  /* Идеальная ширина */
  width: var(--form-width) !important;
  max-width: var(--form-width) !important; 
}

/* Стили для инпутов и кнопок из Footer */

/* 1. Железобетонно одинаковые обертки для обоих полей */
.modal-form .footer-name-input-wrapper,
.modal-form .footer-phone-input-wrapper {
  display: flex;
  
  /* Идеальная ширина */
  width: var(--form-width) !important; 
  max-width: var(--form-width) !important;
  
  height: 4.16vw; 
  border-radius: 1.04vw; 
  border: 0.052vw solid rgba(25, 25, 25, 0.2); 
  background: white;
  transition: border-color 0.3s ease;
  align-items: center;
  box-sizing: border-box;
  padding: 0 1.04vw; 
  overflow: hidden;
}

/* БАЗОВОЕ ОКНО ("Перезвоним за 2 минуты") */
.modal-content {
  background: white;
  border-radius: 1.04vw; 
  padding: 0;
  
  /* ФИКС: Немного сузили окно (до 65vw), чтобы крестик "приехал" ближе к тексту */
  width: 65vw; 
  
  height: auto; 
  max-width: 90vw;
  position: relative;
  box-shadow: 0 0 2.08vw 0 rgba(0, 0, 0, 0.1); 
  overflow: hidden;
  display: flex;
  
  --form-width: 27.86vw; 
}

/* УВЕЛИЧЕННОЕ ОКНО ("Беспокоит острая зубная боль?") */
.modal-content.type-emergency {
  --form-width: 33vw; 
  /* Оставляем широким, чтобы влез длинный текст */
  width: 73vw !important; 
}

.modal-form .footer-name-input-wrapper:focus-within,
.modal-form .footer-phone-input-wrapper:focus-within {
  border-color: #485B85;
}

.modal-form .footer-phone-input-wrapper {
  margin-bottom: 1.04vw !important; /* Ровно 10px до блока с согласием */
}

/* Отступ 10px (0.52vw) между первым и вторым полем */
.modal-form .footer-name-input-wrapper {
  margin-bottom: 0.52vw !important; /* Добавил !important, чтобы точно перебить всё остальное */
}

.modal-form .footer-name-input {
  width: 100%;
  height: 100%; /* Растягиваем на всю высоту 80px */
  border: none;
  outline: none;
  background: transparent;
  font-family: 'Geist', sans-serif;
  font-weight: 300;
  font-size: 1.04vw;
  color: rgba(26, 26, 26, 0.75);
  padding: 0; /* Убрали старые отступы */
}

.modal-form .footer-phone-prefix {
  display: flex;
  align-items: center;
  gap: 0.52vw;
  padding: 0 0.52vw 0 0; /* Оставляем только отступ справа до полоски */
  height: 100%;
  background: transparent;
  flex-shrink: 0;
  position: relative;
}

.modal-form .footer-phone-prefix::after {
  content: '';
  position: absolute;
  right: 0;
  top: 15%;
  bottom: 15%;
  width: 0.052vw;
  background: #EBEBEB;
}

.modal-form .footer-phone-input {
  flex: 1 1;
  min-width: 0;
  height: 100%; /* Растягиваем на всю высоту */
  border: none;
  outline: none;
  background: transparent;
  font-family: 'Geist', sans-serif;
  font-weight: 300;
  font-size: 1.04vw;
  color: rgba(26, 26, 26, 0.75);
  padding: 0 0 0 1.04vw; /* Отступ слева от разделителя */
}

.modal-form .footer-name-input::placeholder,
.modal-form .footer-phone-input::placeholder {
  font-weight: 300;
  font-size: 1.04vw;
  line-height: 1.56vw;
  color: rgba(26, 26, 26, 0.75);
}





.modal-form .footer-phone-prefix svg {
  width: 1.04vw;
  height: 0.78vw;
  flex-shrink: 0;
}

.modal-form .footer-phone-prefix span {
  font-family: 'Geist', sans-serif;
  font-weight: 300; /* Меняем с 500 на 300, чтобы совпадало с вводом */
  font-size: 1.04vw; /* 20px */
  line-height: 1.56vw; /* 30px */
  color: rgba(26, 26, 26, 0.75);
  vertical-align: middle;
}



.modal-form .googing-form-checkbox {
  display: flex;
  align-items: center;
  gap: 0.53vw;
  justify-content: flex-start;
  width: 100%;
  margin-left: 0.52vw !important; /* Тот самый сдвиг на +10px слева */
  margin-bottom: 1.04vw !important; /* Отступ 20px до кнопки */
  box-sizing: border-box;
}

.modal-form .googing-form-checkbox input[type="checkbox"] {
  width: 0.78vw;
  height: 0.78vw;
  border-radius: 0.2vw;
  border: 0.052vw solid #EBEBEB;
  background: #EBEBEB;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  position: relative;
  flex-shrink: 0;
}

.modal-form .googing-form-checkbox input[type="checkbox"]:checked {
  background: rgba(72, 91, 133, 1);
  border-color: rgba(46, 61, 88, 1);
}

.modal-form .googing-form-checkbox input[type="checkbox"]:checked::after {
  content: '';
  position: absolute;
  left: 50%;
  top: 50%;
  width: 0.12vw;
  height: 0.38vw;
  border: solid white;
  border-width: 0 0.16vw 0.16vw 0;
  transform: translate(-50%, -60%) rotate(45deg);
}

.modal-form .googing-form-checkbox label {
  font-size: var(--font-size-body-small);
  font-weight: 400;
  color: #666666;
  font-family: 'Geist', sans-serif;
  cursor: pointer;
  text-align: left;
}

.modal-form .googing-btn-1 {
  padding: 0.31vw 0.31vw 0.31vw 1.56vw;
  border-radius: 2.6vw;
  border: 0.052vw solid #2E3D58;
  font-weight: 500;
  font-size: var(--font-size-button);
  line-height: 0.89vw;
  cursor: pointer;
  transition: all 0.3s ease;
  display: flex;
  align-items: center;
  gap: 1.56vw;
  font-family: 'Geist', sans-serif;
  position: relative;
  overflow: hidden;
  width: 16.625vw;
  justify-content: space-between;
}

.modal-form .googing-btn-primary {
  margin-top: 0 !important; /* Убрали пружину */
  margin-bottom: 0 !important;
  align-self: flex-end !important; 
}

.modal-form .googing-btn-primary span {
  color: #FFFFFF;
  transition: color 0.3s ease, transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  position: relative;
  z-index: 3;
  font-family: 'Geist', sans-serif;
  
  /* УМЕНЬШИЛИ ЖИРНОСТЬ БЕЛОГО ТЕКСТА (было 400, стало 300) */
  font-weight: 300 !important; 
  font-size: 0.938vw;    
  line-height: 1.458vw;
}

.modal-form .googing-btn-primary:hover span {
  color: #485B85;
  transform: translateX(min(4.3vw, 15.31vw));
}

.modal-form .googing-btn-icon {
  width: 3.125vw;
  height: 3.125vw;
  border-radius: 50%;
  background: #FFFFFF;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
  z-index: 2;
}

.modal-form .googing-btn-icon svg {
  width: 0.73vw;
  height: 0.63vw;
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.modal-form .googing-btn-1 .flare {
  position: absolute;
  top: 0;
  height: 100%;
  width: 2.344vw;
  transform: skewX(-45deg);
  animation: flareAnimation 3s infinite;
  left: -170%;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.9), #fff);
  filter: blur(0px);
  z-index: 1;
  pointer-events: none;
}

@keyframes flareAnimation {
  0% {
    left: -170%;
  }
  50% {
    left: 170%;
  }
  100% {
    left: 170%;
  }
}

.modal-form .googing-btn-1:hover .googing-btn-icon svg {
  transform: translateX(max(-12.7vw, calc(-10% - 30.56vw))) rotate(40deg);
}

.modal-form .googing-btn-1::after {
  content: '';
  position: absolute;
  right: 0.31vw;
  top: 50%;
  transform: translateY(-50%);
  width: 3.125vw;
  height: 3.125vw;
  border-radius: 50%;
  background: #FFFFFF;
  transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
  z-index: 0;
  pointer-events: none;
}

.modal-form .googing-btn-1:hover::after {
  width: 41.67vw;
  height: 41.67vw;
  right: -20.83vw;
  top: 50%;
  transform: translateY(-50%);
}

.modal-form .googing-btn-1:disabled {
  cursor: not-allowed;
  opacity: 1;
}

.modal-form .googing-btn-1:disabled .googing-btn-primary span {
  opacity: 0.5;
}


/* Добавим стиль для видео на десктопе (так как мы убрали его из JS) */
.modal-video {
  width: 100%;
  height: 100%;
  object-fit: cover; /* Идеально заполняет блок, обрезая лишнее, как фоновая картинка */
  display: block;
  border-radius: 0.52vw;
}

/* =========================================
   ИДЕАЛЬНАЯ МОБИЛЬНАЯ АДАПТАЦИЯ (До 780px)
   ========================================= */
@media (max-width: 780px) {
  .modal-overlay {
    padding: 4vw !important;
  }

  .modal-content {
    max-width: 100% !important;
    width: 100% !important;
    height: auto !important; /* Автовысота, чтобы вместить весь контент */
    border-radius: 4vw !important;
  }

  .modal-wrapper {
    flex-direction: column !important;
    padding: 0 !important; 
    gap: 0 !important;
    height: auto !important;
  }

  /* --------------------------
     1. ВИДЕО / КАРТИНКА (Возвращаем красивые отступы)
  -------------------------- */
  .modal-image-block {
    width: 100% !important;
    height: auto !important; 
    order: -1 !important; /* Видео строго сверху */
    padding: 2.5vw 2.5vw 0 2.5vw !important; 
    box-sizing: border-box !important;
    border-radius: 0 !important;
  }

  .modal-video,
  .modal-image-block video {
    border-radius: 3vw !important; 
    width: 100% !important;
    aspect-ratio: 1.6 / 1 !important; /* Идеальные пропорции для телефона */
    object-fit: cover !important;
    display: block !important;
  }

  /* Крестик закрытия */
  .modal-close {
    top: 4vw !important;
    right: 4vw !important;
    width: 7vw !important;
    height: 7vw !important;
    padding: 1.5vw !important;
    background: rgba(255, 255, 255, 0.9) !important;
    z-index: 10 !important;
  }

  /* --------------------------
     БЛОК С КОНТЕНТОМ И ТЕКСТАМИ
  -------------------------- */
  .modal-form-block {
    padding: 4vw 2.5vw 6vw 2.5vw !important; 
    height: auto !important;
  }

  /* --------------------------
     2. ЗАГОЛОВОК (Разрешаем перенос текста!)
  -------------------------- */
.modal-title {
  font-family: 'Geist', sans-serif;
  font-weight: 600; 
  font-size: 2.08vw; 
  line-height: 2.86vw; 
  color: rgba(17, 47, 85, 1);
  margin: 0 0 0.52vw 0 !important; 
  text-align: left !important; 
  
  /* Идеальная ширина в зависимости от типа попапа */
  width: var(--form-width) !important; 
  max-width: var(--form-width) !important;
  padding-right: 0 !important; 
  
  /* Строго 1 строка */
  white-space: nowrap !important; 
  overflow: hidden !important; 
  display: block; 
}
  /* --------------------------
     ФОРМА И ИНПУТЫ (Возвращаем красивые размеры)
  -------------------------- */
  .modal-form {
    gap: 3.5vw !important;
    align-items: stretch !important; 
  }

  .modal-form .footer-name-input-wrapper,
  .modal-form .footer-phone-input-wrapper {
    width: 100% !important;
    height: 14vw !important; 
    border-radius: 2.5vw !important; 
    border: 0.2vw solid #EBEBEB !important; 
    padding: 0 !important; 
    display: flex !important;
    align-items: center !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
    background: white !important;
  }



  /* Отступ 15px (0.78vw) между первым и вторым полем */
.modal-form .footer-name-input-wrapper {
  margin-bottom: 0.78vw; 
}

/* Отступ 10px (0.52vw) от второго поля до чекбокса */
.modal-form .footer-phone-input-wrapper {
  margin-bottom: 0.52vw; 
}

  .modal-form .footer-name-input {
    width: 100% !important;
    height: 100% !important; 
    border: none !important;
    background: transparent !important;
    text-align: left !important;
    padding: 0 4vw !important; 
    font-size: 3.8vw !important;
    line-height: normal !important;
    box-sizing: border-box !important;
  }

  .modal-form .footer-phone-prefix {
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
    padding: 0 2vw 0 4vw !important;
    gap: 2vw !important;
    background: transparent !important;
    border-radius: 0 !important;
  }

  .modal-form .footer-phone-prefix::after {
    top: 25% !important;
    bottom: 25% !important;
    width: 0.2vw !important;
    background: #EBEBEB !important;
  }

  .modal-form .footer-phone-prefix span {
    font-size: 3.8vw !important;
    line-height: normal !important;
  }

  .modal-form .footer-phone-prefix svg {
    width: 5vw !important;
    height: 3.5vw !important;
  }

  .modal-form .footer-phone-input {
    flex: 1 1 !important;
    min-width: 0 !important; 
    height: 100% !important;
    border: none !important;
    background: transparent !important;
    text-align: left !important;
    padding: 0 4vw 0 2vw !important;
    font-size: 3.8vw !important;
    line-height: normal !important;
    box-sizing: border-box !important;
  }

  .modal-form .footer-name-input::placeholder,
  .modal-form .footer-phone-input::placeholder {
    font-size: 3.8vw !important;
    line-height: normal !important;
  }

  /* --------------------------
     ЧЕКБОКС
  -------------------------- */
 /* Отступ 10px (0.52vw) от чекбокса до кнопки */
.modal-form .googing-form-checkbox {
  display: flex;
  align-items: center;
  gap: 0.53vw;
  justify-content: flex-start;
  width: 100%;
  margin-left: 0.52vw !important; /* Сдвиг на 10px слева */
  margin-bottom: 1.04vw !important; /* Строгий отступ 20px до кнопки */
  box-sizing: border-box;
}

  .modal-form .googing-form-checkbox input[type="checkbox"] {
    width: 4.5vw !important;
    height: 4.5vw !important;
    border-radius: 1vw !important;
    margin-top: 0 !important;
    border: 0.2vw solid #EBEBEB !important;
  }

  .modal-form .googing-form-checkbox input[type="checkbox"]:checked::after {
    width: 1.2vw !important;
    height: 2.2vw !important;
    border-width: 0 0.5vw 0.5vw 0 !important;
  }

  .modal-form .googing-form-checkbox label {
    font-size: 2.9vw !important;
    line-height: 1.4 !important;
  }

  /* --------------------------
     КНОПКА ОТПРАВКИ
  -------------------------- */
  .modal-form .googing-btn-primary {
    width: auto !important;
    align-self: flex-end !important;
    border-radius: 10vw !important;
    padding: 1vw 1vw 1vw 5vw !important;
    margin-top: 1vw !important;
  }

  .modal-form .googing-btn-primary span {
    font-size: 3.0vw !important; 
    font-weight: 500 !important;
  }

  .modal-form .googing-btn-primary::after {
    width: 9vw !important;
    height: 9vw !important;
    right: 1vw !important;
  }

  .modal-form .googing-btn-icon {
    width: 9vw !important;
    height: 9vw !important;
    margin-left: 3vw !important;
  }

  .modal-form .googing-btn-icon svg {
    width: 2.5vw !important;
    height: 2.5vw !important;
  }
}
.carousel-container {
  width: 100%;
  padding: 2.6vw 0;
  box-sizing: border-box;
  background-color: rgba(235, 235, 235, 1);
  position: relative;
  overflow: hidden;
  user-select: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
}

.carousel-slides-wrapper {
  width: 100%;
  position: relative;
  overflow: hidden;
  height: 15.625vw;
  display: flex;
  align-items: center;
}

.carousel-slides-track {
  display: flex;
  gap: 2.6vw;
  width: -webkit-fit-content;
  width: fit-content;
  user-select: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
}

.carousel-wrapper {
  width: 50vw;
  height: 15.625vw;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  border-radius: 1vw;
  background-color: #fff;
  overflow: hidden;
}

.carousel-slide {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  gap: 0;
  padding: 0.26vw;
  box-sizing: border-box;
}

.carousel-slide-image {
  width: 15.625vw;
  height: 15.1vw;
  flex-shrink: 0;
  overflow: hidden;
  /* border-radius: 30px; */
}

.carousel-slide-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: 0.8vw;
}

.carousel-slide-content {
  flex: 1 1;
  height: 15.1vw;
  background: #FFFFFF;
  padding: 1.04vw;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 1.56vw;
  border-radius: 1.56vw;
  box-sizing: border-box;
}

.carousel-slide-text {
  display: flex;
  flex-direction: column;
  gap: 0.52vw;
  flex: 1 1;
}

.carousel-slide-title {
  text-align: left;
  font-size: var(--font-size-h8);
  font-weight: 600;
  color: #000000;
  margin: 0;
  line-height: 1.3;
  font-family: 'Geist', sans-serif;
}

.carousel-slide-subtitle {
  text-align: left;
  font-size: var(--font-size-body-small-2);
  font-weight: 300;
  color: #1A1A1ABF;
  margin: 0;
  line-height: 1.46vw;
  font-family: 'Geist', sans-serif;
}

.carousel-slide-button {
  padding: 1.46vw 3.65vw;
  border-radius: 2.6vw;
  background: #485B85;
  position: relative;
  overflow: hidden;
  border: 0.052vw solid #2E3D58;
  color: #FFFFFF;
  font-size: 0.8vw;
  font-weight: 700;
  cursor: pointer;
  font-family: 'Geist', Medium;
  text-transform: uppercase;
  flex-shrink: 0;
  transition: all 0.3s ease;
  height: -webkit-fit-content;
  height: fit-content;
}

.carousel-slide-button:hover {
  background: #FFFFFF;
  color: #485B85;
}

/* Эффект блика для кнопки */
.carousel-slide-button .flare {
  position: absolute;
  top: 0;
  height: 100%;
  width: 45px;
  transform: skewX(-45deg);
  animation: flareAnimation 3s infinite;
  left: -170%;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.9), #fff);
  filter: blur(0px);
  z-index: 1;
  pointer-events: none;
}

@keyframes flareAnimation {
  0% {
    left: -170%;
  }
  50% {
    left: 170%;
  }
  100% {
    left: 170%;
  }
}

.carousel-btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 2.6vw;
  height: 2.6vw;
  border: none;
  border-radius: 50%;
  background-color: rgba(255, 255, 255, 0.9);
  color: #333;
  font-size: var(--font-size-h9);
  cursor: pointer;
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 0.21vw 0.78vw rgba(0, 0, 0, 0.15);
  transition: all 0.3s ease;
}

.carousel-btn:hover {
  background-color: #00a651;
  color: #fff;
  transform: translateY(-50%) scale(1.1);
}

.carousel-btn-prev {
  left: 1.04vw;
}

.carousel-btn-next {
  right: 1.04vw;
}

.carousel-dots {
  display: flex;
  gap: 0.63vw;
  margin-top: 1.56vw;
}

.carousel-dot {
  width: 0.63vw;
  height: 0.63vw;
  border: none;
  border-radius: 50%;
  background-color: #ccc;
  cursor: pointer;
  transition: all 0.3s ease;
}

.carousel-dot:hover {
  background-color: #999;
}

.carousel-dot.active {
  background-color: #00a651;
  transform: scale(1.2);
}

@media (max-width: 780px) {
  .carousel-slides-wrapper {
    height: 33.205vw;
  }

  .carousel-slides-track {
    gap: 2.564vw;
  }

  .carousel-wrapper {
    width: 115.38vw;
    height: 33.205vw;
    border-radius: 2.564vw;
  }

  .carousel-slide {
    padding: 0.641vw;
    height: 37.82vw;
  }

  .carousel-slide-image {
    width: 38.462vw;
    height: 31.923vw;
  }

  .carousel-slide-image img {
    border-radius: 1.923vw;
  }

  .carousel-slide-content {
    height: 31.923vw;
    padding: 1.564vw 1.282vw 3.846vw 2.52vw;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1.923vw;
    border-radius: 1.282vw;
  }

  .carousel-slide-text {
    gap: 1.28vw;
  }

  .carousel-slide-title {
    font-size: 3.85vw;
    font-weight: 700;
    line-height: 5.77vw;
  }

  .carousel-slide-subtitle {
    font-size: 2.95vw;
    font-weight: 300;
    line-height: 4.49vw;
  }

  .carousel-slide-button {
    padding: 3.33vw 10.26vw;
    border-radius: 16.667vw;
    font-size: 2.56vw;
    font-weight: 500;
    align-self: flex-end;
    margin-left: auto;
    margin-top: auto;
  }
  
  .carousel-slide-content {
    align-items: flex-start;
  }
  
  .carousel-container {
    padding: 12.82vw 0;
  }
}

.profile-cards-section {
  width: 100%;
  /* Ровно 100px сверху и 100px снизу */
  padding-top: 100px;
  padding-bottom: 100px;
  background: rgba(245, 245, 245, 1);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.profile-cards-content {
  width: 100%;
  /* Ровно 50px по бокам */
  padding-left: 50px;
  padding-right: 50px;
  margin-bottom: 2.6vw;
  box-sizing: border-box;
}

.profile-cards-title {
  font-size: var(--font-size-h1);
  font-weight: 700;
  line-height: 3.925vw;
  color: #000000;
  text-align: left;
  text-transform: uppercase;
  font-family: 'Geist', sans-serif;
  margin: 0;
}

.profile-cards-title span {
  color: #485B85;
  text-decoration: underline;
  text-decoration-thickness: 0.16vw;
  text-underline-offset: 0.26vw;
}

.profile-cards-description {
  font-size: var(--font-size-h6);
  font-weight: 300;
  line-height: 1.72vw;
  color: #1A1A1ABF;
  text-align: left;
  font-family: 'Geist', sans-serif;
  margin-top: 0.52vw;
  margin-bottom: 0;
}

.profile-cards-carousel-wrapper {
  position: relative;
  overflow-x: hidden;
  overflow-y: visible;
  width: 100%;
  /* Ровно 50px по бокам для карусели */
  padding-left: 50px;
  padding-right: 50px;
  box-sizing: border-box;
}

.profile-cards-carousel {
  width: 100%;
  overflow-x: hidden;
  overflow-y: visible;
  position: relative;
  box-sizing: border-box;
  padding: 0;
  /* Для удобного скролла ручками */
  cursor: grab;
  touch-action: pan-y;
}

.profile-cards-carousel:active {
  cursor: grabbing;
}

.profile-cards-carousel-slides {
  display: flex;
  width: 100%;
  align-items: stretch; /* Возвращаем stretch */
  padding: 0;

  will-change: transform;
  transform: translateZ(0);
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
}

.profile-cards-carousel-slide {
  width: calc(100% / 4);
  min-width: calc(100% / 4);
  flex-shrink: 0;
  display: block; /* Ставим block, чтобы aspect-ratio рассчитал точную высоту */
  overflow: visible;
  padding: 0 0.5vw;
  box-sizing: border-box;
}

.profile-cards-carousel-slide .card {
  width: 100%;
}

.cards {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  width: 100%;
  padding: 0 10%;
  gap: 0.604vw;
}

.card {
  /* width: 20vw;
  height: 57vh; */
  /* width: 440px;
  height: vh; */
  width: 21.771vw;
  /* Убрали жесткую высоту и привязали жесткие пропорции из макета */
  height: auto;
  aspect-ratio: 417.5 / 700;

  background: #D1D6DC;
  border: 4px solid #FFFFFF;
  border-radius: 20px;
  padding-top: 20px;
  flex-shrink: 0;
  position: relative;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  cursor: pointer;
  box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.05);
  transition: box-shadow 0.4s ease-in-out;
  /* Убираем align-self и flex-базисы, чтобы флекс-контейнер не сплющивал карточку */
  flex: none; 
}



.card-image {
  width: 100%;
  height: 100%; /* Default fills the card in normal state */
  object-fit: cover;
  transition: all 0.4s ease-in-out;
  position: absolute; /* Image is the base layer */
  top: 0;
  left: 0;
}

.card-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 40%; /* Затенение только сверху для рейтинга */
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0) 100%);
  z-index: 2;
  pointer-events: none;
}

.card-bottom-overlay {
  display: none !important; /* Полностью убиваем черный нижний слой */
}

/* 

1920   358
100    x

21000/1920

*/

.card-bottom-content {
  position: absolute;
  bottom: 0; 
  left: 0;
  width: 100%;
  height: 26.64vw;
  padding: 1vw 1.56vw; /* 20px сверху/снизу, 30px по бокам */
  border-radius: 1vw;
  
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  justify-content: flex-start; /* Прижимаем всё к верху */
  gap: 0 !important; /* Убиваем любой автоматический отступ между элементами */
  
  background: rgba(25, 25, 25, 0.1) !important; 
  backdrop-filter: blur(30px) !important;
  -webkit-backdrop-filter: blur(30px) !important;
  
  transition: transform 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  
  /* Сдвигаем вниз на 218px. Это оставит ровно 20px пустого места под лайками! */
  transform: translateY(15.93vw);
}

.card:hover .card-bottom-content {
  transform: translateY(0);
}

.card-top-info {
  display: flex;
  flex-direction: column;
  gap: 0 !important; /* Строго выключаем Flex-отступы */
  margin: 0;
  padding: 0;
}

.card-name-row {
  display: flex;
  align-items: center;
  gap: 0.781vw; /* ЗАМЕНИЛИ CLAMP */
  max-width: 100%;
}

.card-name {
  font-weight: 700;
  color: #FFFFFF;
  font-family: 'Geist', sans-serif;
  text-align: left;
  margin: 0;
  line-height: 28px; /* ВАЖНО: обрезаем невидимые поля сверху и снизу текста */
}

.card-verified-icon {
  width: 1.198vw;
  height: 1.198vw;
  flex-shrink: 0;
}

.card-specialization {
  font-family: 'Geist', sans-serif;
  font-weight: 300;
  letter-spacing: 0;
  color: rgba(255, 255, 255, 0.7); /* Это и есть #FFFFFFB2 */
  text-align: left;
  margin: 0;
  height: 2.5em;
  margin-top: 5px; /* Идеальные 5px от имени */
}

.card-stats {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 10px;
  max-width: 100%;
  margin: 0;
  margin-top: 15px; /* Идеальные 15px от специализации */
}

.card-rating {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0.521vw; /* ЗАМЕНИЛИ CLAMP */
  background: rgb(255 255 255 / 20%);
  backdrop-filter: blur(0.521vw);
  -webkit-backdrop-filter: blur(0.521vw);
  padding: 0.365vw 0.521vw; /* ЗАМЕНИЛИ CLAMP */
  border-radius: 5.208vw;
  flex-shrink: 0;
}

.card-rating-value {
  font-size: 0.938vw; /* ЗАМЕНИЛИ CLAMP */
  font-weight: 700;
  color: #FFFFFF;
  font-family: 'Geist', sans-serif;
  line-height: 100%;
  white-space: nowrap;
}

.card-rating-stars {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0.052vw;
}

.card-rating-stars svg {
  width: 0.677vw;
  height: 0.677vw;
}

.card-likes {
  display: flex;
  flex-direction: row;
  align-items: center;
  font-size: 0.938vw;
  gap: 0.21vw; /* ЗАМЕНИЛИ CLAMP */
  background: rgb(255 255 255 / 20%);
  backdrop-filter: blur(0.521vw);
  -webkit-backdrop-filter: blur(0.521vw);
  padding: 0.365vw 0.521vw; /* ЗАМЕНИЛИ CLAMP */
  border-radius: 5.208vw;
  flex-shrink: 0;
  overflow: hidden;
}

/* Красивая анимация проставления лайка для цифр */
/* ДОБАВИТЬ ЭТОТ БЛОК */
@keyframes counterRoll {
  0% {
    transform: translateY(100%);
    opacity: 0;
  }
  100% {
    transform: translateY(0);
    opacity: 1;
  }
}

/* Окошко барабана, скрывающее текст, который выкатывается за его пределы */
.card-likes-window {
  display: inline-flex;
  align-items: center;
  height: 0.938vw; /* Жестко фиксируем высоту под размер шрифта */
  overflow: hidden; 
  position: relative;
}

/* Сама цифра */
.card-likes-value {
  font-family: 'Geist', sans-serif;
  font-weight: 700;
  letter-spacing: 0;
  color: #FFFFFF;
  vertical-align: middle;
  white-space: nowrap;
  display: inline-block;
}
/* Анимация механического барабана (выкат снизу вверх) */
@keyframes drumRoll {
  0% { transform: translateY(150%); }
  100% { transform: translateY(0); }
}

/* Класс, который JS вешает на 300мс при клике */
.card-likes-value.animating {
  animation: drumRoll 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}





.card-likes-text {
  font-family: 'Geist', sans-serif;
  font-weight: 300;
  letter-spacing: 0;
  color: #FFFFFF; /* Белый цвет 100% */
  vertical-align: middle;
  white-space: nowrap;
}

.card-description {
  font-family: 'Geist', sans-serif;
  font-weight: 300;
  letter-spacing: 0;
  color: rgba(255, 255, 255, 0.7); 
  text-align: left;
  margin: 0;
  margin-top: 20px; /* Ровно 20px вниз от блока лайков */
}

/* When profile card is hovered, expand the description inside the overlay */
.profile-card:hover .card-description {
  max-height: 1000px; /* Arbitrary large value to allow auto-height transition */
  opacity: 1;
  margin-top: 1vw; /* Gap between specialization and description from Figma */
}



.card-appointment-button {
  border-radius: 50px;
  border: 1px solid rgba(72, 91, 133, 1);
  font-weight: 500;
  line-height: 1;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
  font-family: 'Geist', sans-serif;
  position: relative;
  background: #FFFFFF;
  -webkit-mask-image: -webkit-radial-gradient(white, black);
  width: 100%;
  box-sizing: border-box;
  flex-shrink: 0;
  padding: 6px 6px 6px 30px;
  min-height: 60px;
  transition: all 0.3s ease;
  
  /* Магическое свойство: выталкивает кнопку в самый низ шторки */
  margin-top: 30px;
}

.card-appointment-button:hover {
  /* Перекрываем бордер синим цветом при наведении, чтобы скрыть белую границу баг */
  border-color: rgba(72, 91, 133, 1);
  box-shadow: inset 0 0 0 0.2vw rgba(72, 91, 133, 1);
}

.card-appointment-button span {
  color: rgba(25, 25, 25, 1);
  position: relative;
  z-index: 3;
  transition: color 0.3s ease, transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.card-appointment-button:hover span {
  color: #FFFFFF;
  transform: translateX(4.95vw);
}

.card-appointment-button-icon {
  width: 3.13vw;
  height: 3.13vw;
  border-radius: 50%;
  background: rgba(72, 91, 133, 1);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
  z-index: 2;
}

.card-appointment-button-icon svg {
  width: 1.042vw;
  height: 1.042vw;
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.card-appointment-button:hover .card-appointment-button-icon svg {
  transform: translateX(-13.6vw) rotate(40deg);
}

.card-appointment-button::after {
  content: '';
  position: absolute;
  right: 0.31vw;
  top: 50%;
  transform: translateY(-50%);
  width: 3.13vw;
  height: 3.13vw;
  border-radius: 50%;
  background: rgba(72, 91, 133, 1);
  transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
  z-index: 0;
  pointer-events: none;
}

.card-appointment-button:hover::after {
  width: 41.67vw;
  height: 41.67vw;
  right: -20.83vw;
  top: 50%;
  transform: translateY(-50%);
}

.card-top-elements {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1.042vw 1.302vw;
  z-index: 10;
}

.card-status-badge {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  background: rgba(255, 255, 255, 0.3);
  backdrop-filter: blur(0.521vw);
  -webkit-backdrop-filter: blur(0.521vw);
  padding: 0.313vw 0.821vw;
  border-radius: 2.083vw;
  border: 0.052vw solid rgba(245, 245, 245, 1);
  position: relative;
  z-index: 10;
  pointer-events: auto; /* Включили реакцию на мышь */
  -webkit-user-select: none;
          user-select: none;
  gap: 0.521vw;
  box-shadow: 0 0.208vw 0.521vw rgba(0, 0, 0, 0.1);
  transition: transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275); /* Добавили плавность */
}

.card:hover .card-status-badge {
  /* Срабатывает когда курсор на плашке (через hover на card или саму плашку) */
}

.card-status-badge:hover {
  transform: scale(1.05);
}

.card:hover {
  box-shadow: 0px 10px 30px rgba(0, 0, 0, 0.15);
}

.card-status-badge .card-status-text {
  font-size: 0.729vw;
  line-height: 1.458vw;
  font-weight: 500;
  color: #ffffff;
}

.card-status-badge .card-status-dot {
  width: 0.417vw;
  height: 0.417vw;
  margin-right: 0;
  position: relative;
  background: mediumseagreen;
  border-radius: 50%;
}

.card-status-badge .card-status-dot.online::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 0.521vw;
  height: 0.521vw;
  background: mediumseagreen;
  border-radius: 50%;
  animation: pulse 1s cubic-bezier(0, 0, 0.25, 1) infinite;
}

@keyframes pulse {
  from {
    transform: translate(-50%, -50%) scale(1);
    opacity: 1;
  }
  to {
    transform: translate(-50%, -50%) scale(2.5);
    opacity: 0;
  }
}

.card-favorite-button {
  display: flex;
  justify-content: center;
  align-items: center;
  background: rgba(255, 255, 255, 0.3);
  backdrop-filter: blur(0.781vw);
  -webkit-backdrop-filter: blur(0.781vw);
  border-radius: 50%;
  border: clamp(0.05vw, 0.078vw, 0.15vw) solid rgba(245, 245, 245, 1);
  position: relative;
  z-index: 10;
  cursor: pointer;
  transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  padding: clamp(0.7vw, 1.042vw, 2vw);
  box-shadow: 0 clamp(0.2vw, 0.391vw, 0.8vw) clamp(0.4vw, 0.781vw, 1.5vw) rgba(0, 0, 0, 0.15);
}

.card-favorite-button:hover {
  background: rgba(255, 255, 255, 0.6);
  /* Немного увеличили скейл при наведении по задаче */
  transform: scale(1.15);
}

/* Состояние "лайкнуто" (белый фон) */
.card-favorite-button.liked {
  background: #FFFFFF;
}

.card-favorite-button svg {
  width: clamp(0.8vw, 1.198vw, 2.4vw);
  height: clamp(0.7vw, 1.042vw, 2.1vw);
  display: block;
}

.card:hover .card-image {
  filter: grayscale(0%);
}

/* Карусель навигация */
.profile-cards-navigation {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 1.56vw;
  padding: 0 10%;
  position: relative;
}

.profile-cards-carousel-dots-wrapper {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0.21vw 0;
}

.profile-cards-carousel-dots {
  display: flex;
  flex-direction: row;
  gap: 0.26vw;
  position: relative;
  z-index: 2;
}

.profile-cards-carousel-dot {
  width: 0.26vw;
  height: 0.26vw;
  border-radius: 50%;
  border: none;
  background: rgba(0, 0, 0, 0.3);
  cursor: pointer;
  transition: all 0.3s ease;
  padding: 0;
  position: relative;
  z-index: 2;
}

.profile-cards-carousel-dot.active {
  background: #000000;
  width: 0.5vw;
  height: 0.26vw;
  border-radius: 0.13vw;
}

.profile-cards-nav-controls {
  display: flex;
  align-items: center;
  gap: 0.78vw;
  margin-left: auto;
}

.profile-cards-slide-counter {
  font-size: var(--font-size-body);
  font-weight: 500;
  color: rgba(0, 0, 0, 1);
  font-family: 'Geist', sans-serif;
}

.profile-cards-nav-btn {
  width: 3.13vw;
  height: 3.13vw;
  border-radius: 50%;
  border: 0.052vw solid rgba(0, 0, 0, 0.2);
  background: #FFFFFF;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.3s ease;
  padding: 0;
  position: relative;
}

.profile-cards-nav-btn:hover {
  background: #485B85;
  border-color: #485B85;
}

.profile-cards-nav-btn:hover svg:not(.profile-cards-nav-progress):not(.profile-cards-nav-arrow) path {
  stroke: #FFFFFF;
  stroke-opacity: 1;
}

.profile-cards-nav-btn:hover .profile-cards-nav-arrow path {
  stroke: #FFFFFF;
  stroke-opacity: 1;
}

/* Скрытие прогресс бара на кнопке */
.profile-cards-nav-progress {
  display: none !important;
}

.profile-cards-nav-arrow {
  position: relative;
  z-index: 1;
  width: 0.521vw;
  height: 0.781vw;
}

.profile-cards-nav-arrow path {
  transition: stroke 0.3s ease, stroke-opacity 0.3s ease;
}

.profile-cards-nav-btn svg:not(.profile-cards-nav-progress):not(.profile-cards-nav-arrow) {
  width: 0.677vw;
  height: 1.042vw;
}

.profile-cards-nav-btn svg:not(.profile-cards-nav-progress):not(.profile-cards-nav-arrow) path {
  transition: stroke 0.3s ease, stroke-opacity 0.3s ease;
}

.profile-card {
  /* Плавная анимация изменения высоты карточки! */
  transition: height 0.4s ease-in-out, box-shadow 0.4s ease-in-out;
  
  /* Высота карточки в нормальном состоянии (подбери точное vw под макет) */
  height: 420px; 
  
  overflow: hidden; /* Скрываем вылезающее описание */
  position: relative; /* База для позиционирования оверлея */
  border-radius: 1vw; /* Закругления из Figma */
  border: 1px solid #DBDBDB; /* Тонкая рамка из Figma */
  
  /* Легкая тень карточки из Figma */
  box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.05); 
  
  /* CRUCIAL: это позволяет карточке расти вниз, не растягивая соседей по ряду */
  align-self: flex-start; 
  
  flex-grow: 0; 
  
  flex-shrink: 0; 
  
  flex-basis: calc(33.333% - 1.5vw); /* Responsive 3-column with gap */
  box-sizing: border-box;
  cursor: pointer;

  
}

.profile-card:hover {
  /* Высота карточки в раскрытом состоянии (высота картинки + высота всего текста с запасом) */
  height: 750px; 
  
  /* Тень при наведении из Figma (более выраженная) */
  box-shadow: 0px 10px 30px rgba(0, 0, 0, 0.1); 
}

@media (max-width: 2200px) {
  .profile-cards-content {
    padding-left: 2.6vw;
    padding-right: 2.6vw;
  }
  .profile-cards-carousel-wrapper {
    padding-left: 2.6vw;
    padding-right: 2.6vw;
  }
  .profile-cards-navigation {
    padding-left: 2.6vw;
    padding-right: 2.6vw;
  }
}

@media (max-width: 780px) {

  .profile-cards-section {
    padding: 50px 0 20px 0; /* Уменьшили нижний отступ с 5.2vw до 20px */
  }
  .profile-cards-title {
    width: 100%;
    font-size: 5.77vw;
    font-weight: 700;
    line-height: 8.33vw;
    margin-bottom: 0;
  }

  .profile-cards-carousel-wrapper {
    padding-left: 0;
    padding-right: 0;
  }

  .profile-cards-title span {
    text-decoration-thickness: 0.26vw;
    text-underline-offset: 0.64vw;
  }

  .profile-cards-description {
    width: 100%;
    font-size: 3.333vw;
    font-weight: 300;
    line-height: 4.73vw;
    margin-top: 2.564vw;
    margin-bottom: 6.41vw;
  }

 .profile-cards-carousel-slides {
    gap: 6.41vw; 
    align-items: stretch;
  }

  .profile-cards-carousel-slide {
    width: 76.923vw;
    min-width: 76.923vw;
    padding: 0;
    flex-shrink: 0;
    display: block;
  }

  

  .profile-cards-carousel-slide .card {
    width: 100%;
    height: auto;
    aspect-ratio: 417.5 / 700;
    border-radius: 2.564vw;
  }

  .card-top-elements {
    padding: 4.744vw 3.846vw;
  }

  .card-status-badge {
    padding: 0.9vw 2.564vw;
    gap: 1.282vw;
    border-radius: 15.385vw;
  }

  .card-status-badge .card-status-text {
    font-size: 3.2vw;
    line-height: 4.5vw;
  }

  .card-status-badge .card-status-dot {
    width: 1.282vw;
    height: 1.282vw;
  }

  .card-status-badge .card-status-dot.online::after {
    width: 1.282vw;
    height: 1.282vw;
  }

  .card-favorite-button {
    width: 9.487vw;
    height: 9.487vw;
    padding: 0;
  }

  .card-likes-window {
    height: 4.5vw; /* Увеличено с 3.5vw, чтобы вместить новый размер шрифта */
}

  .card-favorite-button svg {
    width: 3.59vw;
    height: 3.205vw;
  }

  .card-bottom-content {
    border-radius: 3.077vw;
  }

  .card-name {
    font-size: 5.5vw; /* Увеличено с 4.487vw */
  }

  .card-verified-icon {
    width: 4.487vw;
    height: 4.487vw;
  }

  .card-name-row {
    gap: 2.564vw;
  }

  .card-specialization {
    font-size: 3.5vw; /* Увеличено с 2.564vw */
    margin-bottom: 3vw;
}

  .card-stats {
    gap: 1.282vw;
  }

  .card-rating {
    padding: 1.026vw 1.667vw;
    gap: 1.282vw;
    border-radius: 6.41vw;
  }

  .card-rating-value {
    font-size: 3.205vw;
  }

  .card-rating-stars svg {
    width: 1.538vw;
    height: 1.538vw;
  }

  .card-image {
  /* ... твои стили ... */
  will-change: filter; /* Подсказываем браузеру заранее про ЧБ эффект */
}

 .card {
    width: 100%;
    height: auto;
    aspect-ratio: 417.5 / 700;
    border-radius: 2.564vw;
  }

  .card-likes {
    padding: 1.026vw 1.667vw;
    gap: 0.513vw;
    border-radius: 6.41vw;
  }

  .card-likes-value {
    font-size: 3.205vw;
  }

  .card-likes-text {
    font-size: 3vw; /* Увеличено с 2.436vw */
}

  .card-stats {
    margin-bottom: 2vw; /* Уменьшили с 3.205vw, чтобы описание подтянулось выше */
  }

  .card-description {
    font-size: 3.5vw; /* Увеличено с 2.564vw */
    line-height: 4.8vw; /* Сделали межстрочный интервал свободнее */
}

  .card-bottom-content {
    padding: 3.205vw;
  }

  .card-appointment-button {
    width: 45.641vw;
    border-radius: 19.231vw;
    padding-left: 4.359vw;
    gap: 4.359vw;
    margin-left: auto;
    margin-right: 0;
    font-size: 2.564vw;
    line-height: 3.5vw;
  }

  .card-appointment-button-icon {
    width: 9.231vw;
    height: 9.231vw;
    border-radius: 19.231vw;
  }

  .card-appointment-button-icon svg {
    width: 3.59vw;
    height: 3.333vw;
  }

  .card-appointment-button::after {
    right: 0.77vw;
    width: 9.231vw;
    height: 9.231vw;
    border-radius: 19.231vw;
  }

  .card-appointment-button:hover::after {
    width: 120vw;
    height: 120vw;
    right: -60vw;
  }

  .card-appointment-button:hover span {
    transform: translateX(10.1vw);
  }

  .card-appointment-button:hover .card-appointment-button-icon svg {
    transform: translateX(-34.821vw) rotate(40deg);
  }

  .profile-cards-navigation {
    flex-direction: column;
    align-items: center;
    gap: 3.846vw;
    margin-top: 6.41vw;
  }

  .profile-cards-carousel-dots-wrapper {
    position: static;
    transform: none;
    order: 1;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 0;
    width: 100%;
  }

  .profile-cards-carousel-dots {
    display: flex;
    flex-direction: row;
    gap: 0.64vw;
  }

  .profile-cards-carousel-dot {
    width: 0.77vw;
    height: 0.77vw;
    border-radius: 50%;
  }

  .profile-cards-carousel-dot.active {
    width: 2.05vw;
    height: 0.77vw;
    border-radius: 12.82vw;
  }

  .profile-cards-nav-controls {
    order: 2;
    margin-left: 0;
    justify-content: flex-end;
    width: 100%;
    gap: 2.03vw;
  }

  .profile-cards-nav-btn {
    width: 9.359vw;
    height: 9.359vw;
    border: none;
    background: #FFFFFF;
    position: relative;
  }

  .profile-cards-nav-btn:hover {
    background: #485B85;
  }

  .profile-cards-nav-btn:hover .profile-cards-nav-arrow path {
    stroke: #FFFFFF;
    stroke-opacity: 1;
  }

  .profile-cards-nav-arrow {
    position: relative;
    z-index: 1;
    width: 2.051vw;
    height: 3.077vw;
  }

  .profile-cards-nav-btn svg:not(.profile-cards-nav-progress):not(.profile-cards-nav-arrow) {
    width: 2.051vw;
    height: 3.077vw;
  }

  .profile-cards-slide-counter {
    font-size: 3.59vw;
    font-weight: 300;
  }
}

@media (min-width: 1921px) {
  .card-bottom-content {
    padding: 21px 30px;
    gap: 15px;
  }
  
  .card-name-row {
    gap: 15px;
  }
  
  .card-name {
    font-size: calc(27px + (100vw - 1920px) / 3 * 0.01406);
  }
  
  .card-specialization {
    font-size: calc(18px + (100vw - 1920px) / 3 * 0.00938);
  }
  
  .card-stats {
    gap: 10px;
  }
  
  .card-rating {
    gap: 10px;
    padding: 7px 10px;
  }
  
  .card-rating-value {
    /* Было 18px и 0.00938. Сделали базу 22px и ускорили рост */
    font-size: calc(22px + (100vw - 1920px) / 3 * 0.012); 
  }
  
  .card-likes {
    gap: 4px;
    padding: 7px 10px;
  }
  
  .card-likes-value {
    font-size: calc(22px + (100vw - 1920px) / 3 * 0.012);
  }
  
  .card-likes-text {
    font-size: calc(14px + (100vw - 1920px) / 3 * 0.00729);
  }
  
  .card-description {
    font-size: calc(18px + (100vw - 1920px) / 3 * 0.00938);
  }
  
  .card-bottom-content {
    padding: 21px 30px;
  }
  
  .card-top-info {
    gap: 15px;
  }
  
  .card-appointment-button {
    padding: 6px 6px 6px 30px;
    font-size: calc(17px + (100vw - 1920px) / 3 * 0.0089);
    line-height: calc(17px + (100vw - 1920px) / 3 * 0.0089);
    gap: 30px;
    margin-top: 0;
  }
}
.location {
  width: 100%;
  background: #FFFFFF;
  padding: 4.17vw 0;
}

.location-container {
  width: 100%;
  max-width: 100vw;
  margin: 0 auto;
  padding: 0 10%;
}

.location-top-header {
  font-size: var(--font-size-body);
  font-weight: 500;
  color: rgba(25, 25, 25, 1);
  text-align: left;
  font-family: 'Geist', sans-serif;
  display: flex;
  align-items: center;
  gap: 0.52vw;
  margin-bottom: 0.52vw;
}

.location-header {
  display: flex;
  gap: 3.125vw;
  align-items: flex-start;
  margin-bottom: 2.6vw;
}

.location-top-header-bar {
  width: 0.21vw;
  height: 1.25vw;
  background: rgba(46, 61, 88, 1);
  flex-shrink: 0;
}

.location-title {
  font-size: var(--font-size-h1);
  font-weight: 700;
  color: #000000;
  line-height: 3.425vw;
  margin: 0;
  text-align: left;
  text-transform: uppercase;
  font-family: 'Geist', sans-serif;
}

.location-title-highlight {
  color: #485B85;
  text-decoration: underline;
  text-decoration-thickness: 0.16vw;
  text-underline-offset: 0.41vw;
}

.location-title {
  flex: 1 1;
}

.location-description {
  width: 47.08vw;
  font-size: var(--font-size-h8);
  font-weight: 300;
  color: rgba(26, 26, 26, 0.75);
  line-height: 1.719vw;
  margin: 0;
  text-align: left;
  font-family: 'Geist', sans-serif;
  padding-top: 1.04vw;
}

.location-content {
  display: flex;
  gap: 1.1vw;
  height: 31.25vw;
  align-items: stretch;
}

.location-video-main {
  width: 33.333vw;
  flex-shrink: 0;
}

.location-videos-secondary {
  width: 33.333vw;
  display: flex;
  flex-direction: column;
  gap: 1.1vw;
  flex-shrink: 0;
}

.location-info-cards {
  width: 26.042vw;
  display: flex;
  flex-direction: column;
  gap: 1.1vw;
  flex-shrink: 0;
}

.location-video-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  background: #f5f5f5;
  border-radius: 1.042vw;
  border: 0.052vw solid rgba(25, 25, 25, 0.3);
  overflow: hidden;
}

.location-video-image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 1;
}

.location-video-main {
  display: flex;
}

.location-video-main .location-video-wrapper {
  width: 100%;
  height: 100%;
}

.location-video-secondary {
  flex: 1 1;
  display: flex;
  min-height: 0;
}

.location-video-secondary .location-video-wrapper {
  width: 100%;
  height: 100%;
}

.location-video-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  padding: 1.042vw;
  z-index: 3;
}

.location-video-badge {
  display: flex;
  align-items: center;
  gap: 0.82vw;
  background: rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(1.042vw);
  -webkit-backdrop-filter: blur(1.042vw);
  padding: 0.521vw;
  border-radius: 0.521vw;
  width: -webkit-fit-content;
  width: fit-content;
}

.location-video-badge-icon {
  width: 1.563vw;
  height: 1.563vw;
  border-radius: 0.156vw;
  background: #FFFFFF;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  box-sizing: border-box;
}

.location-video-badge-icon img {
  width: 0.729vw;
  height: 0.938vw;
  object-fit: contain;
}

.location-video-badge span {
  font-size: 0.938vw;
  font-weight: 500;
  color: #FFFFFF;
  font-family: 'Geist', sans-serif;
  white-space: nowrap;
}

.location-video-bottom {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 1.042vw;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.042vw;
  z-index: 3;
}

.location-video-text {
  width: 15vw;
  text-align: left;
  color: #FFFFFF;
  font-size: 0.729vw;
  font-weight: 300;
  line-height: 1.4;
  font-family: 'Geist', sans-serif;
  /* flex: 1; */
}

.location-video-play-button {
  flex-shrink: 0;
  cursor: pointer;
}

.location-video-play-button svg {
  width: 3.125vw;
  height: 3.125vw;
}

.guarantee-faq-play-button {
  position: relative;
  width: 4.17vw;
  height: 4.17vw;
  background: #FFFFFF;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: transform 0.3s ease;
  box-sizing: content-box;
  flex-shrink: 0;
  z-index: 4;
}

.location-video-bottom .guarantee-faq-play-button {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  bottom: auto !important;
  right: auto !important;
  transform: none !important;
}

.guarantee-faq-play-button::before {
  content: "";
  position: absolute;
  z-index: 0;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  display: block;
  width: 4.17vw;
  height: 4.17vw;
  background: #FFFFFF;
  border-radius: 50%;
  animation: pulse-border 1500ms ease-out infinite;
}

.guarantee-faq-play-button::after {
  content: "";
  position: absolute;
  z-index: 1;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  display: block;
  width: 4.17vw;
  height: 4.17vw;
  background: #FFFFFF;
  border-radius: 50%;
  transition: all 200ms;
}

.guarantee-faq-play-button:hover::after {
  background-color: #f5f5f5;
}

.guarantee-faq-play-button:hover {
  transform: scale(1.1);
}

.guarantee-faq-play-button svg {
  width: 1.16vw;
  height: 1.4vw;
  transform: translateX(0.1vw);
  position: relative;
  z-index: 3;
}

@keyframes pulse-border {
  0% {
    transform: translate(-50%, -50%) translateZ(0) scale(1);
    opacity: 1;
  }
  100% {
    transform: translate(-50%, -50%) translateZ(0) scale(1.5);
    opacity: 0;
  }
}

.location-video-main .location-video-bottom {
  display: flex;
}

.location-video-secondary .location-video-bottom {
  display: none;
}

.location-video-bottom .guarantee-faq-play-button:hover {
  transform: scale(1.1) !important;
}

.location-video-secondary .guarantee-faq-play-button {
  position: absolute !important;
  top: 78% !important;
  left: 90% !important;
  transform: translate(-50%, -50%) !important;
  transform-origin: center center !important;
  z-index: 3;
  width: 4.17vw !important;
  height: 4.17vw !important;
  background: #FFFFFF !important;
  border-radius: 50% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  transition: transform 0.3s ease !important;
  box-sizing: content-box !important;
}

.location-video-secondary .guarantee-faq-play-button::before {
  content: "" !important;
  position: absolute !important;
  z-index: 0 !important;
  left: 50% !important;
  top: 50% !important;
  transform: translate(-50%, -50%);
  display: block !important;
  width: 4.17vw !important;
  height: 4.17vw !important;
  background: #FFFFFF !important;
  border-radius: 50% !important;
  animation: pulse-border 1500ms ease-out infinite !important;
}

.location-video-secondary .guarantee-faq-play-button::after {
  content: "" !important;
  position: absolute !important;
  z-index: 1 !important;
  left: 50% !important;
  top: 50% !important;
  transform: translate(-50%, -50%) !important;
  display: block !important;
  width: 4.17vw !important;
  height: 4.17vw !important;
  background: #FFFFFF !important;
  border-radius: 50% !important;
  transition: all 200ms !important;
}

.location-video-secondary .guarantee-faq-play-button:hover::after {
  background-color: #f5f5f5 !important;
}

.location-video-secondary .guarantee-faq-play-button:hover {
  transform: translate(-50%, -50%) scale(1.1) !important;
}

.location-video-secondary .guarantee-faq-play-button:active {
  transform: translate(-50%, -50%) scale(1.05) !important;
}

.location-info-card {
  background: #FFFFFF;
  border-radius: 1.042vw;
  padding: 1.56vw 1.1vw;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1.56vw;
  border: none;
  box-shadow: 0 0 0.521vw rgba(0, 0, 0, 0.07);
  cursor: pointer;
  transition: all 0.3s ease;
  flex: 1 1;
  min-height: 0;
}

.location-info-card:hover {
  transform: translateY(-0.26vw);
  box-shadow: 0 0.521vw 1.563vw rgba(0, 0, 0, 0.1);
}

.location-info-card-content {
  flex: 1 1;
  display: flex;
  flex-direction: column;
  gap: 0.25vw;
}

.location-info-card-title {
  font-size: var(--font-size-body);
  font-weight: 500;
  color: rgba(25, 25, 25, 1);
  margin: 0;
  text-align: left;
  font-family: 'Geist', sans-serif;
}

.location-info-card-description {
  font-size: var(--font-size-body);
  font-weight: 300;
  color: rgba(26, 26, 26, 0.65);
  margin: 0;
  text-align: left;
  line-height: 1.46vw;
  font-family: 'Geist', sans-serif;
}

.location-info-card-icon {
  width: 3.125vw;
  height: 3.125vw;
  border-radius: 50%;
  background: #FFFFFF;
  border: 0.052vw solid rgba(17, 47, 85, 1);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: transform 0.3s ease;
}

.location-info-card:hover .location-info-card-icon {
  transform: translateX(0.26vw);
}

.location-info-card-icon svg {
  width: 0.677vw;
  height: 0.677vw;
}

.location-map-section {
  width: 100%;
  margin-top: 1.17vw;
}

.location-map-info {
  position: absolute;
  top: 0.58vw;
  right: 0.58vw;
  display: flex;
  flex-direction: row;
  gap: 0.52vw;
  z-index: 10;
  flex-wrap: wrap;
  max-width: 60vw;
  justify-content: flex-end;
}

.location-map-info-item {
  display: flex;
  align-items: center;
  gap: 0.52vw;
  padding: 0.52vw;
  background: rgba(255, 255, 255, 0.85);
  border-radius: 0.521vw;
  font-size: var(--font-size-body);
  font-weight: 300;
  color: rgba(25, 25, 25, 1);
  font-family: 'Geist', sans-serif;
}

.location-map-info-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.location-map-info-icon svg {
  width: 1.042vw;
  height: 1.042vw;
}

.location-map {
  width: 100%;
  height: 31.25vw;
  border-radius: 1.042vw;
  border: 0.052vw solid rgba(25, 25, 25, 0.3);
  overflow: hidden;
  position: relative;
}

.location-panorama-section {
  width: 100%;
  margin-top: 1.17vw;
}

.location-panorama-content {
  width: 100%;
  max-width: 100vw;
  margin: 0 auto;
  background: rgba(245, 245, 245, 1);
  border-radius: 1.042vw;
  border: 0.052vw solid rgba(25, 25, 25, 0.3);
  padding: 0.521vw 0.781vw 0.521vw 2.604vw;
  display: flex;
  align-items: center;
  gap: 2.604vw;
  position: relative;
  overflow: hidden;
  min-width: 0;
}

.location-panorama-image {
  flex-shrink: 0;
  width: 20.833vw;
  height: 9.115vw;
  min-width: 14.583vw;
  max-width: 20.833vw;
  border-radius: 1.042vw;
  overflow: hidden;
  margin-left: -2.083vw;
  position: relative;
  z-index: 1;
  border: 0.15vw solid rgba(255, 255, 255, 1);
  transition: transform 0.3s ease;
}

.location-panorama-image:hover {
  transform: translateX(3px);
}

.location-panorama-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 20%;
  display: block;
}

.location-panorama-text-block {
  flex: 1 1;
  display: flex;
  flex-direction: column;
  gap: 0.521vw;
  z-index: 2;
  min-width: 0;
}

.location-panorama-title {
  text-align: left;
  font-size: 1.406vw;
  font-weight: 700;
  color: #000000;
  margin: 0;
  line-height: 1.2;
  font-family: 'Geist', sans-serif;
}

.location-panorama-description {
  text-align: left;
  font-size: var(--font-size-h8);
  font-weight: 300;
  color: #1A1A1ABF;
  margin: 0;
  line-height: 1.74vw;
  font-family: 'Geist', sans-serif;
}

.location-panorama-button {
  padding: 0.313vw 0.313vw 0.313vw 1.563vw;
  border-radius: 2.604vw;
  border: 0.052vw solid #2E3D58;
  font-weight: 700;
  font-size: var(--font-size-button);
  line-height: 0.885vw;
  cursor: pointer;
  transition: all 0.3s ease;
  display: flex;
  align-items: center;
  gap: 1.563vw;
  font-family: 'Geist', sans-serif;
  position: relative;
  overflow: hidden;
  flex-shrink: 0;
  background: #485B85;
  color: #FFFFFF;
}

.location-panorama-button span {
  color: #FFFFFF;
  transition: color 0.3s ease, transform 0.8s cubic-bezier(0.4, 0, 0.2, 1);
  position: relative;
  z-index: 3;
}

.location-panorama-button:hover span {
  color: #485B85;
  transform: translateX(3.567vw);
}

.location-panorama-btn-icon {
  width: 3.125vw;
  height: 3.125vw;
  border-radius: 50%;
  background: #FFFFFF;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
  z-index: 2;
}

.location-panorama-btn-icon svg {
  width: 0.73vw;
  height: 0.63vw;
  transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.location-panorama-button:hover .location-panorama-btn-icon svg {
  transform: translateX(-10.417vw) rotate(40deg);
}

.location-panorama-button::after {
  content: '';
  position: absolute;
  right: 0.313vw;
  top: 50%;
  transform: translateY(-50%);
  width: 3.125vw;
  height: 3.125vw;
  border-radius: 50%;
  background: #FFFFFF;
  transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
  z-index: 0;
  pointer-events: none;
}

.location-panorama-button:hover::after {
  width: 41.667vw;
  height: 41.667vw;
  right: -20.833vw;
  top: 50%;
  transform: translateY(-50%);
}

/* Эффект блика для кнопки */
.location-panorama-button .flare {
  position: absolute;
  top: 0;
  height: 100%;
  width: 45px;
  transform: skewX(-45deg);
  animation: flareAnimation 3s infinite;
  left: -170%;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.9), #fff);
  filter: blur(0px);
  z-index: 1;
  pointer-events: none;
}

@keyframes flareAnimation {
  0% {
    left: -170%;
  }
  50% {
    left: 170%;
  }
  100% {
    left: 170%;
  }
}

@media (max-width: 2200px) {
  .location-container {
    padding: 0 2.6vw;
  }
}

@media (min-width: 2200px) {
  .location-video-main {
    width: min(30.0vw, 30vw);
  }

  .location-videos-secondary {
    width: min(26.0vw, 30vw);
  }

  .location-info-cards {
    width: min(22.042vw, 23.5vw);
  }
}

@media (max-width: 780px) {
  .location {
    padding-top: 12.82vw;
    padding-bottom: 0;
  }

  .location-top-header {
    gap: 1.28vw;
  }

  .location-top-header span {
    font-size: 3.21vw;
    margin-top: 1.28vw;
  }

  .location-top-header-bar {
    width: 0.38vw;
    height: 5.13vw;
  }

  .location-header {
    flex-direction: column;
    gap: 2.56vw;
    margin-bottom: 8.97vw;
  }

  .location-title {
    order: 1;
  }

  .location-description {
    order: 2;
  }

  .location-title {
    width: 100%;
    font-size: 5.77vw;
    font-weight: 700;
    line-height: 8.33vw;
    /* margin-bottom: 2.56vw; */
  }

  .location-title-highlight {
    text-decoration-thickness: 0.26vw;
    text-underline-offset: 0.64vw;
  }

  .location-description {
    font-size: 2.82vw;
    line-height: 4.23vw;
    padding-top: 0;
    width: 100%;
  }

  .location-content {
    flex-direction: column;
    height: auto;
    align-items: stretch;
    gap: 2.56vw;
  }

  .location-video-main {
    order: 1;
    width: 100%;
    height: auto;
    min-height: 50vw;
  }

  .location-video-wrapper {
    height: 76.92vw;
    border-radius: 2.56vw;
  }

  .location-video-image {
    height: 76.92vw;
  }

  .location-video-main .location-video-wrapper {
    height: 76.92vw;
  }

  .location-videos-secondary {
    order: 2;
    width: 100%;
    flex-direction: column;
    height: auto;
    gap: 2.56vw;
  }

  .location-video-secondary {
    height: auto;
    min-height: 76.92vw;
    flex: none;
  }

  .location-video-secondary .location-video-wrapper {
    height: 76.92vw;
  }

  .location-video-secondary:nth-child(1) {
    order: 1;
  }

  .location-video-secondary:nth-child(2) {
    order: 2;
  }

  .location-info-cards {
    order: 3;
    width: 100%;
    height: auto;
    gap: 2.56vw;
    margin-bottom: 1.22vw;
  }

  .location-info-card {
    padding: 7.95vw 2.56vw;
    border-radius: 2.56vw;
    gap: 3.85vw;
    border: 0.13vw solid rgba(215, 215, 215, 1);
    box-shadow: 0 0 2.56vw 0 rgba(0, 0, 0, 0.07);
  }

  .location-info-card-content {
    gap: 1.28vw;
  }

  .location-info-card-title {
    font-size: 3.59vw;
  }

  .location-info-card-description {
    font-size: 2.56vw;
    line-height: 3.85vw;
  }

  .location-info-card-icon {
    width: 7.69vw;
    height: 7.69vw;
  }

  .location-info-card-icon svg {
    width: 1.79vw;
    height: 1.41vw;
  }

  .location-video-overlay {
    padding: 2.56vw;
  }

  .location-video-badge {
    padding: 1.54vw;
    gap: 2.31vw;
    border-radius: 1.54vw;
  }

  .location-video-badge-icon {
    width: 4.62vw;
    height: 4.62vw;
  }

  .location-video-badge-icon img {
    width: 2.18vw;
    height: 2.69vw;
  }

  .location-video-badge span {
    font-size: 2.82vw;
  }

  .location-video-text {
    font-size: 2.56vw;
    line-height: 3.85vw;
    width: auto;
  }

  .location-video-bottom {
    padding: 2.56vw;
  }

  .guarantee-faq-play-button {
    width: 11.54vw !important;
    height: 11.54vw !important;
    margin-top: 9.28vw;
    margin-left: 1.28vw;
  }

  .guarantee-faq-play-button::before {
    width: 11.54vw !important;
    height: 11.54vw !important;
  }

  .guarantee-faq-play-button::after {
    width: 11.54vw !important;
    height: 11.54vw !important;
  }

  .guarantee-faq-play-button svg {
    width: 2.56vw !important;
    height: 3.21vw !important;
  }

  .location-video-secondary .guarantee-faq-play-button {
    width: 11.54vw !important;
    height: 11.54vw !important;
  }

  .location-video-secondary .guarantee-faq-play-button::before {
    width: 11.54vw !important;
    height: 11.54vw !important;
  }

  .location-video-secondary .guarantee-faq-play-button::after {
    width: 11.54vw !important;
    height: 11.54vw !important;
  }

  .location-video-secondary .guarantee-faq-play-button svg {
    width: 2.56vw !important;
    height: 3.21vw !important;
  }

  .location-map {
    height: 128.21vw;
    border-radius: 2.56vw;
  }

  .map-widget-map-component {
    height: 128.21vw !important;
  }

  .location-map-info {
    max-width: none;
  }

  .location-map-info-item {
    font-size: 2.31vw;
    line-height: 3.59vw;
    padding: 1.28vw;
  }

  .location-panorama-section {
    margin-top: 2.56vw;
  }

  .location-panorama-content {
    flex-direction: column;
    align-items: stretch;
    padding: 2.564vw;
    gap: 0;
    border-radius: 2.564vw;
  }

  .location-panorama-image {
    order: 1;
    width: 100%;
    height: 44.872vw;
    margin-left: 0;
    margin-right: 0;
    margin-bottom: 3.846vw;
    border-radius: 2.564vw;
    max-width: none;
    min-width: 0;
  }

  .location-panorama-text-block {
    order: 2;
    gap: 0;
  }

  .location-panorama-title {
    font-size: 5.0vw;
    line-height: 7.051vw;
    font-weight: 600;
    margin-bottom: 3.846vw;
  }

  .location-panorama-description {
    font-size: 3.333vw;
    line-height: 5.128vw;
    margin-bottom: 3.846vw;
  }

  .location-panorama-button {
    order: 3;
    width: 45.641vw;
    font-size: 2.179vw;
    border-radius: 19.231vw;
    padding: 0.77vw 0.77vw 0.77vw 3.21vw;
    justify-content: space-between;
    margin-left: auto;
  }

  .location-panorama-btn-icon {
    width: 8.718vw;
    height: 8.718vw;
    border-radius: 19.231vw;
    margin-left: auto;
  }

  .location-panorama-btn-icon svg {
    width: 2.051vw;
    height: 1.667vw;
  }

  .location-panorama-button::after {
    right: 0.77vw;
    width: 8.718vw;
    height: 8.718vw;
    border-radius: 19.231vw;
  }

  .location-panorama-button:hover::after {
    width: 120vw;
    height: 120vw;
    right: -60vw;
  }

  .location-panorama-button:hover .location-panorama-btn-icon svg {
    transform: translateX(max(-34.7vw, calc(-10% - 40.56vw))) rotate(40deg);
  }

  .location-panorama-button:hover span {
    transform: translateX(max(13.3vw, calc(-10% - 30.56vw)));
  }
}


/* =========================================
   ОСНОВНОЙ КОНТЕЙНЕР (Стили как в Guarantees)
   ========================================= */
.gallery-main {
  width: 100%;
  background: #FFFFFF;
  padding: 1.0vw 0 4.17vw 0;
  font-family: 'Geist', sans-serif;
  overflow: hidden; 
}

.gallery-container {
  width: 100%;
  max-width: 100vw;
  margin: 0 auto;
  padding: 0 10%;
  box-sizing: border-box;
}

/* =========================================
   ЗАГОЛОВОК (Копия логики Guarantees)
   ========================================= */
.gallery-header {
  display: flex;
  flex-direction: column;
  gap: 1.04vw;
  margin-bottom: 2.6vw;
}

.guarantees-small-title {
  font-size: var(--font-size-h8);
  font-weight: 300;
  color: rgba(26, 26, 26, 0.75);
  text-align: left;
  font-family: 'Geist', sans-serif;
  display: flex;
  align-items: center;
  gap: 0.52vw;
}

.guarantees-small-title-bar {
  width: 0.21vw;
  height: 1.25vw;
  background: rgba(46, 61, 88, 1);
  flex-shrink: 0;
}

.guarantees-main-title {
  font-size: var(--font-size-h1);
  text-transform: uppercase;
  font-weight: 700;
  line-height: 3.4vw;
  color: #000000;
  text-align: left;
  font-family: 'Geist', sans-serif;
}

.guarantees-main-title span {
  text-decoration: underline;
  text-decoration-thickness: 0.16vw;
  text-underline-offset: 0.26vw;
  color: #485B85;
}

.guarantees-description {
  font-size: var(--font-size-h6);
  font-weight: 300;
  line-height: 2.1vw;
  color: rgba(26, 26, 26, 0.75);
  text-align: left;
  font-family: 'Geist', sans-serif;
  max-width: 70vw;
}

/* =========================================
   СЕРЫЙ БЛОК ГАЛЕРЕИ (Дизайн guarantees-consultation)
   ========================================= */
.gallery-gray-block {
  width: 100%;
  box-sizing: border-box;
  background-color: #EBEBEB;
  border-radius: 1.04vw;
  padding: 2.6vw; /* Отступ внутри серого блока. За счет него можно листать страницу вниз! */
  position: relative;
  overflow: hidden;
}

/* =========================================
   ОКНО ГАЛЕРЕИ (БЕЗ ЗАВИСИМОСТИ ОТ СКРОЛЛА)
   ========================================= */
.gallery-window {
  position: relative;
  width: 100%;
  height: 35vw; /* Гибкая высота галереи на десктопе */
  min-height: 400px;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  overflow: hidden; 
  cursor: grab;
  -webkit-user-select: none;
          user-select: none;
  border-radius: 1.04vw;
}

.gallery-window:active {
  cursor: grabbing;
}

.col-scroll__box {
  display: flex;
  flex-direction: column;
  margin: 0 1vw;
}

.col-scroll__list {
  display: flex;
  flex-direction: column;
  will-change: transform;
}

.col-scroll__item {
  margin: 0;
  padding-bottom: 2vw; 
  display: flex;
  flex-direction: column;
  align-items: center;
}

.col-scroll__img {
  aspect-ratio: 6/7;
  height: auto;
  object-fit: cover;
  width: 22vw;
  border-radius: 0.78vw;
  box-shadow: 0 0.52vw 1.56vw rgba(0, 0, 0, 0.05);
  pointer-events: none; 
}

.col-scroll__title {
  margin: 1vw 0 1.5vw 0;
  font-family: 'Geist', sans-serif;
  font-weight: 500;
  font-size: 0.94vw;
  color: #1A1A1A;
  text-align: center;
}

/* =========================================
   МЕДИАЗАПРОСЫ (Синхронизировано с Guarantees)
   ========================================= */
@media (max-width: 2200px) { 
  .gallery-container {
      padding: 0 2.6vw;
  }
}

@media (max-width: 780px) {
  .gallery-main {
      padding-top: 6vw;
      padding-bottom: 6vw;
  }

  .gallery-header {
      gap: 3vw;
      margin-bottom: 5vw;
  }

  .guarantees-small-title {
      gap: 2vw;
  }

  .guarantees-small-title span {
      font-size: 3.5vw;
  }

  .guarantees-small-title-bar {
      width: 0.6vw;
      height: 4.5vw;
  }

  .guarantees-main-title {
      width: 100%;
      font-size: 6.5vw;
      line-height: 1.2;
  }

  .guarantees-main-title span {
      text-decoration-thickness: 0.4vw;
      text-underline-offset: 0.8vw;
  }

  .guarantees-description {
      font-size: 3.5vw;
      line-height: 1.4;
      max-width: 100%;
  }

  /* Настройки серого блока для мобилки - делаем компактнее */
  .gallery-gray-block {
      border-radius: 4vw;
      padding: 4vw 2vw; /* Уменьшили внутренние отступы, чтобы блок не казался огромным */
      margin-bottom: 2vw;
  }

  /* Окно самой галереи */
  .gallery-window {
      height: 45vh; /* Уменьшили высоту, чтобы блок не растягивался на весь экран */
      min-height: 320px; /* Снизили минимальную высоту */
      border-radius: 3vw;
  }

  .col-scroll__box {
      margin: 0 1.5vw;
  }

  /* Прячем 3ю колонку на телефоне, оставляем только 2 */
  .col-scroll__box:nth-child(3) {
      display: none;
  }

  .col-scroll__img {
      width: 42vw; /* Картинки занимают оптимальную ширину в 2 колонки */
      border-radius: 3vw;
  }

  .col-scroll__item {
      padding-bottom: 4vw; /* Уменьшили расстояние между фото по вертикали */
  }

  .col-scroll__title {
      font-size: 3vw;
      margin: 1.5vw 0 2vw 0;
  }
}
/* =========================================
   BLOG CAROUSEL (PERFECTLY CENTERED MASK)
   ========================================= */

.blog-section {
  width: 100%; 
  max-width: 100vw;
  display: flex;
  
  /* ФИКС: Глобальные отступы по краям экрана (50px = 2.6vw) */
  padding: 0 2.6vw 5.2vw 2.6vw !important;
  
  background-color: #FFFFFF;
  box-sizing: border-box;
  overflow-x: hidden; 
  font-family: 'Inter', sans-serif; 
}

.blog-interactive-area {
  position: relative;
  
  /* ФИКС: Ширина контейнера (100vw минус два отступа по 2.6vw) */
  width: 94.8vw !important; 
  
  height: 41.67vw; 
  margin: 0 auto; 
  overflow: visible; /* Чтобы убедиться, что ничего не обрезается */
}

.blog-title-container {
  position: absolute;
  top: 0;
  left: 0;
  
  /* ФИКС: Ширина равна ширине маленькой картинки под ней */
  width: 13.02vw !important; 
  
  /* ФИКС: Высота высчитана так, чтобы до картинки оставалось ровно 40.5px (2.1vw) */
  height: 21.34vw !important; 
  
  display: flex;
  
  /* Прижимаем текст к низу этого контейнера */
  align-items: flex-end !important; 
  justify-content: center; 
  z-index: 0;
}

.blog-vertical-text {
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  display: flex;
  flex-direction: row; 
  align-items: center; 
  white-space: nowrap;
  height: -webkit-max-content;
  height: max-content;
  gap: 1vw; 
}

.blog-word-black {
  font-family: 'Geist', sans-serif;
  font-weight: 900;
  font-size: 2.65vw; /* 51px */
  line-height: 3.38vw; /* 65px */
  color: #121212;
  text-transform: uppercase;
  letter-spacing: 0;
  vertical-align: middle;
}

.blog-word-blue {
  font-family: 'Geist', sans-serif;
  font-weight: 900;
  font-size: 2.65vw; /* 51px */
  line-height: 3.38vw; /* 65px */
  color: #485B85;
  text-transform: uppercase;
  letter-spacing: 0;
  vertical-align: middle;
  
  /* ФИКС: Убираем старую границу, из-за которой текст съезжал с оси */
  border-left: none; 
  padding-left: 0; 
  
  /* Применяем родное подчеркивание по твоим настройкам */
  text-decoration: underline;
  -webkit-text-decoration-style: solid;
          text-decoration-style: solid;
  -webkit-text-decoration-skip: ink;
          text-decoration-skip-ink: auto;
  
  /* ИЗМЕНИТЬ: делаем ближе к тексту (было 0.26vw) */
  text-underline-offset: 0.1vw; 
  
  /* ДОБАВИТЬ: делаем линию тоньше (например, около 2px) */
  text-decoration-thickness: 0.15vw;
}

.blog-gallery-track {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.blog-track-item {
  overflow: hidden;
  will-change: left, top, width, height; 
  cursor: pointer;
}

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

.blog-info-panel {
  position: absolute;
  top: 0;
  
  /* ФИКС: Выровняли ровно по левому краю первой картинки после большой */
  left: 50.51vw !important; 
  
  right: 0;
  height: 24vw;
  display: flex;
  flex-direction: column;
 
  pointer-events: none; 
}

.blog-controls {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 0.78vw;
  pointer-events: auto; 
  position: relative;
  z-index: 20;
}

.blog-counter-text {
  font-family: 'Geist', sans-serif;
  font-weight: 500;
  font-size: 0.94vw; /* 18px */
  line-height: 100%;
  letter-spacing: 0%;
  vertical-align: middle;
  color: #000000;
  
  /* margin-right удален, чтобы работал только gap из .blog-controls */
}

.blog-arrow-btn {
  width: 3.2vw;
  height: 3.2vw;
  border-radius: 50%;
  border: 1px solid rgba(0, 0, 0, 0.15);
  background: #FFFFFF;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.3s ease;
  padding: 0;
}

.blog-arrow-btn svg {
  width: 0.5vw;
  height: auto;
}

.blog-arrow-btn:hover {
  border-color: #485B85;
}

.blog-arrow-btn:active {
  transform: scale(0.95);
}

.blog-text-wrapper {
  margin-top: 3vw;
  flex-grow: 1;
  pointer-events: auto; 
  position: relative;
  z-index: 0;
}

.blog-text-content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  text-align: left; 
}

/* МАСКА ДЛЯ АНИМАЦИИ КАЖДОЙ СТРОЧКИ */
.blog-text-mask {
  overflow: hidden; 
  display: block;
  width: 100%;
  position: relative;
}

/* Отступ 20px (1.04vw) после тега */
.tag-mask { 
  margin-bottom: 1.04vw !important; 
}

/* Строки заголовка идут без внешних отступов */
.title-mask { 
  margin-bottom: 1.04vw !important; 
}

/* Строки описания идут плотно друг к другу (их раздвигает line-height) */
.desc-mask { 
  margin-bottom: 0 !important; 
}

.blog-highlight-tag {
  font-family: 'Geist', sans-serif;
  font-weight: 600; /* SemiBold */
  font-size: 2.6vw; /* 50px */
  line-height: 3.125vw; /* 60px */
  color: #485B85;
  text-transform: uppercase;
  letter-spacing: 0;
  margin: 0;
  display: block;
}

.blog-main-heading {
  font-family: 'Geist', sans-serif;
  font-weight: 900; /* Black */
  font-size: 2.6vw; /* 50px */
  line-height: 3.125vw; /* 60px */
  color: #191919;
  text-transform: uppercase;
  letter-spacing: 0;
  margin: 0;
  display: block;
}

.blog-description-text {
  font-family: 'Geist', sans-serif;
  font-weight: 300; /* Light */
  font-size: 1.15vw; /* 22px */
  line-height: 1.72vw; /* 33px */
  color: #1A1A1ABF;
  letter-spacing: 0;
  margin: 0;
  max-width: 100%;
  display: block;
}


/* =========================================
   АДАПТАЦИЯ ДЛЯ ТЕЛЕФОНОВ (MOBILE)
   ========================================= */
@media (max-width: 768px) {
  .blog-section { 
    padding: 12vw 5vw; 
  }
  
  .blog-interactive-area {
    width: 100%;
    height: auto;
    display: flex;
    flex-direction: column;
    /* Разрешаем контенту идти вниз */
    overflow: visible; 
  }

  /* РАСТВОРЯЕМ КОНТЕЙНЕР, ЧТОБЫ МЕНЯТЬ МЕСТАМИ ВЛОЖЕННЫЕ БЛОКИ */
  .blog-info-panel {
    display: contents; 
  }

  /* 1. ЗАГОЛОВОК НАВЕРХУ */
  .blog-title-container {
  position: absolute;
  top: 0;
  left: 0;
  
  /* ФИКС: Ширина равна ширине маленькой картинки под ней */
  width: 13.02vw !important; 
  
  /* ФИКС: Высота высчитана так, чтобы до картинки оставалось ровно 40.5px (2.1vw) */
  height: 21.34vw !important; 
  
  display: flex;
  
  /* Прижимаем текст к низу этого контейнера */
  align-items: flex-end !important; 
  justify-content: center; 
  
  /* ========================================= */
  /* НОВЫЕ НАСТРОЙКИ (ЭФФЕКТ БЕЛОЙ ШТОРКИ)     */
  /* ========================================= */
  z-index: 30; /* Поднимаем контейнер с текстом выше картинок */
  background-color: #FFFFFF; /* Делаем фон непрозрачным белым */
}

  /* 2. КНОПКИ (ТЕПЕРЬ НАД ФОТОГРАФИЯМИ) */
  .blog-controls {
    position: relative;
    display: flex;
    justify-content: flex-start; /* Прижимаем всё к левому краю */
    align-items: center;
    gap: 3vw; /* Расстояние между кнопками */
    width: 100%;
    margin-bottom: 4vw;
    order: 2; 
  }

  /* 3. КАРУСЕЛЬ КАРТИНОК */
  .blog-gallery-track {
    position: relative;
    height: 90vw; 
    width: 100%;
    margin-bottom: 6vw;
    border-radius: 4vw;
    overflow: hidden; /* Обрезает боковые картинки */
    order: 3; 
  }

  /* 4. ТЕКСТ (ТЕПЕРЬ ПОД ФОТОГРАФИЯМИ) */
  .blog-text-wrapper {
    position: relative;
    margin-top: 0;
    width: 100%;
    order: 4; 
  }

  /* ИСПРАВЛЕНИЕ "БЛОГ О ЗУБАХ" НА МОБИЛЬНЫХ */
  .blog-vertical-text {
    writing-mode: horizontal-tb;
    transform: none;
    align-items: center; /* Центруем слова друг с другом */
    gap: 2vw;
  }

  .blog-word-blue {
    border-left: none; /* Убираем десктопную границу */
    padding-left: 0;
    font-size: 7vw;
    position: relative; /* Чтобы линия встала ровно под текстом */
  }

  /* Рисуем линию снизу псевдоэлементом, чтобы она не сдвигала само слово вверх! */
  .blog-word-blue::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: -0.5vw;
    width: 100%;
    height: 0.8vw;
    background-color: #485B85;
  }

  .blog-word-black { 
    font-size: 7vw; 
  }

  .blog-track-item { border-radius: 3vw; }

  /* Размеры навигации */
  .blog-counter-text { font-size: 4vw; }
  .blog-arrow-btn { width: 12vw; height: 12vw; }
  .blog-arrow-btn svg { width: 2vw; }
  
  /* Отступы на мобилке */
  .blog-counter-text { 
    font-size: 4vw; 
    margin-left: auto; 
  }

  .title-mask { margin-bottom: 1vw; }
  .desc-mask { margin-bottom: 0.5vw; }

  /* Увеличенные шрифты для телефона */
  .blog-highlight-tag { font-size: 4.5vw; }
  .blog-main-heading { font-size: 6.5vw; }
  .blog-description-text { font-size: 4vw; max-width: 100%; }
}
.App {
  text-align: center;
}

.App-logo {
  height: 40vmin;
  pointer-events: none;
}

@media (prefers-reduced-motion: no-preference) {
  .App-logo {
    animation: App-logo-spin infinite 20s linear;
  }
}

.App-header {
  background-color: #282c34;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-size: calc(10px + 2vmin);
  color: white;
}

.App-link {
  color: #61dafb;
}

@keyframes App-logo-spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}


/* =========================================
   КАСТОМНЫЙ СКРОЛЛБАР ДЛЯ ВСЕГО САЙТА
   ========================================= */

/* Поддержка для Firefox */
html {
  scrollbar-width: thin;
  scrollbar-color: #485B85 transparent;
}

/* Настройки для Chrome, Safari, Edge, Яндекс */
::-webkit-scrollbar {
  width: 16px; /* Делаем общую зону чуть шире для эффекта расширения */
  background-color: transparent;
}

::-webkit-scrollbar-track {
  background-color: transparent;
}

/* 1. Обычное состояние (тонкий ползунок) */
::-webkit-scrollbar-thumb {
  background-color: #485B85; /* Фирменный синий */
  border-radius: 10px;
  /* Забираем 6px с каждой стороны прозрачной рамкой, остается 4px видимой части */
  border: 6px solid rgba(255, 255, 255, 0); 
  background-clip: padding-box;
}

/* 2. При наведении мыши (средний ползунок) */
::-webkit-scrollbar-thumb:hover {
  background-color: #112F55; /* Темнеет */
  /* Уменьшаем рамку, видимая часть становится 10px */
  border: 3px solid rgba(255, 255, 255, 0); 
  background-clip: padding-box;
}

/* 3. При зажатии и перетаскивании (самый широкий ползунок) */
::-webkit-scrollbar-thumb:active {
  background-color: #112F55;
  /* Оставляем минимальную рамку, видимая часть становится 14px */
  border: 1px solid rgba(255, 255, 255, 0); 
  background-clip: padding-box;
}


/* =========================================
   УНИВЕРСАЛЬНЫЙ ЭФФЕКТ: POSITION AWARE (Волна от курсора)
   ========================================= */
.btn-position-aware {
  position: relative;
  overflow: hidden;
  z-index: 1;
  /* background-color: transparent !important; - УДАЛЕНО */
}

/* Скрытая волна */
.btn-position-aware .wave-span {
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  border-radius: 50%;
  background-color: #485B85; /* Фирменный синий цвет клиники */
  transition: width 0.4s ease-in-out, height 0.4s ease-in-out;
  transform: translate(-50%, -50%);
  z-index: -1; /* Волна растекается ПОД текстом */
  pointer-events: none; /* Чтобы волна не блокировала клики */
}

/* Волна раскрывается при наведении */
.btn-position-aware:hover .wave-span {
  /* Делаем круг достаточно большим, чтобы покрыть прямоугольную кнопку */
  width: 40vw; 
  height: 40vw;
}

/* Текст кнопки */
.btn-position-aware .btn-text {
  position: relative;
  z-index: 2; /* Текст всегда ПОВЕРХ волны */
  transition: color 0.4s ease-in-out;
}

/* Меняем цвет текста на белый, когда под ним синяя волна */
.btn-position-aware:hover .btn-text {
  color: #FFFFFF !important;
}

/*# sourceMappingURL=main.29b11a1f.css.map*/