*{
    outline:none;
}
:root {
  --link-color: #09ADEA;
  --link-hover-color: #0090C6;
  --light-blue-bg: #F7FBFC;
  --blue-bg:#F5F8FA;
  --text-grey: #777;
}
HTML, BODY{
    margin:0;
    padding:0;
    background:#fff;
    color:#414042;
    font-family: "Rubik", sans-serif;
    font-optical-sizing: auto;
    font-style: normal;
    font-size:16px;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;    
}
P:has(a[href$='joomla-gallery']) {
    display:none;
    }
A{
    text-decoration:none;
    color:var(--link-color);
}
A:HOVER{
    color:var(--link-hover-color);
}
.gray{
    background:#F5F6F7;
}
.lock{
    overflow:hidden;
}
H1, H2, H3, H4, H5, H6, P{
    margin:0;
    padding:0;
}
P{
    margin-bottom:24px;
    font-size:16px;
    line-height:24px;
}
/* MOBILE */
#menu-mobile{
    padding:8px 0;
    color: #333;
    text-align: left;
    background: #fff;
    opacity: 1;
    position: fixed;
    top: 0;
    left: -100%;
    height: 100%;
    z-index: 9999;
    width: 100%;
    overflow: scroll;
    transition: all 0.2s ease-in-out;
}
#menu-mobile .nav{
    display:block;
}
#menu-mobile UL{
    padding:0;
    margin:0;
    list-style:none;
}
#menu-mobile LI{
    display:block;
    padding:0;
    margin:0;
    list-style:none;  
    border-bottom:1px solid #E9F0F7;
}
#menu-mobile LI A,
#menu-mobile .nav-header{
    display:block;
    padding:12px 20px;
    margin:0;
    list-style:none;    
    text-decoration:none;
    font-size:20px;
    font-weight:450;
    line-height:30px;
    color:#414241;
}
#menu-mobile .mod-menu__sub{
    display:none;
}
#menu-mobile .mod-menu__heading{
    display:flex;
    align-items:center;
}
#menu-mobile .mod-menu__sub LI A{
    padding-left:36px;
    font-size:16px;
}
#menu-mobile .mod-menu__heading::after{
    font-family:"Material Symbols Outlined";
    font-variation-settings:'FILL' 1,'wght' 400,'GRAD' 0, 'opsz' 20;
    font-size:20px;
    color:#414241;
    margin:0px;
    content:'\e5cf';
}
#menu-mobile .open .mod-menu__heading::after{
    font-family:"Material Symbols Outlined";
    font-variation-settings:'FILL' 1,'wght' 400,'GRAD' 0, 'opsz' 20;
    font-size:20px;
    color:#414241;
    margin:0px;
    content:'\e5ce';
}
#menu-mobile .open{
    background:#F5F9FC;
}
.redcross{
    display:inline-block;
    margin-right:20px;
}
.phylosophy{
    margin-top:100px;
}
.phylosophy,
.phylosophy P{
    font-size:18px;
    color:#fff;
}
.phylosophy P STRONG{
    font-size:38px;
}
HEADER .title{
    display:inline-block;
    color:#fff;
}
HEADER .title H2{
    text-transform:uppercase;
    font-size:16px;
}
/* HEADER */
HEADER{
    border-bottom:1px solid #E9F0F7;
    background-image:url('../images/cover.jpg');
    background-size:cover;
}
HEADER .overlay{
    width:100%;
    height:100%;
    background:rgba(0,0,0,0.4);
    padding:30px 0 60px 0;
    min-height:400px;
}
HEADER .slogan{
    font-weight:500;
    line-height:20px;
    margin-bottom:12px;
}
HEADER .logo IMG{
    max-width:100%;
}
HEADER .mobile A {
    display:inline-block;
}
HEADER .mobile A .material-symbols-outlined {
  color:#fff;
  font-size:36px;
  font-variation-settings:
  'FILL' 0,
  'wght' 300,
  'GRAD' 0,
  'opsz' 32
}
HEADER .mobile A.close-menu .material-symbols-outlined{
    color:#000;
}
HEADER .anonymous{
    padding:6px 12px;
    background-color:#E0FFED;
    border-radius:50px;
    border:1px solid #00EB5E;
    color:#00D957;
    display:inline-flex;
    align-items:center;
    font-size:13px;
    line-height:16px;
}
HEADER .anonymous::before{
    font-family:"Material Symbols Outlined";
    font-variation-settings:'FILL' 1,'wght' 400,'GRAD' 0, 'opsz' 20;
    font-size:13px;
    color:#00D957;
    margin-right:4px;
    content:'\e897';
}
HEADER .phone {
    margin-bottom:12px;    
}
HEADER .phone A{
    font-weight: 600;
    font-size: 24px;
    line-height: 26px;
    letter-spacing: 0.02em;
    color:#fff;
    text-decoration:none;
    display:inline-block;
    margin-bottom:12px;
    border-bottom:1px solid rgba(255,255,255,0.2);
    transition:all 0.2s ease;
}
HEADER .phone A:hover{
    border-bottom:1px solid rgba(255,255,255,1.0);
}
HEADER .address{
    font-size: 14px;
    line-height: 24px;
    letter-spacing: 0.02em;
    color:#fff;
}
HEADER .address P{
  font-size:22px;
  font-weight:600;
  line-height:28px;
}
HEADER .address-link A{
    font-size: 14px;
    line-height: 24px;
    text-decoration:none;
    display:inline-block;
    border-bottom:1px solid rgba(255,255,255,0.2);
    transition:all 0.2s ease;
    color:#fff;
}
HEADER .address-link A:hover{
    border-bottom:1px solid rgba(255,255,255,1.0);
}

/* NAVIGATION */
.navigation {
    padding: 20px 0;
    border-bottom: 1px solid #E9F0F7;
}

A.primary,
A.secondary {
    border-radius: 6px;
    font-size: 14px;
    line-height: 20px;
    padding: 8px 16px;
    margin-left: 12px;
    transition: all 0.2s ease-in-out;
    font-weight: 500;
    display: inline-block;
}

A.primary {
    color: #fff;
    background-color: #09ADEA;
}

A.primary:HOVER {
    background-color: #0FBEFF;
}

A.secondary {
    color: #09ADEA;
    background-color: #E7F8FF;
    border: 1px solid #E7F8FF;
}

A.secondary:HOVER {
    background-color: #D0F2FF;
    border: 1px solid #09ADEA;
}

.menu .nav-item {
    margin-right: 40px;
    position: relative;
}

.menu .nav-item,
.menu .nav-item A {
    color: #414042;
    font-size: 14px;
    letter-spacing: 0.02em;
    line-height: 20px;
    text-transform: uppercase;
    display: inline-block;
    transition: all 0.2s ease-in-out;
}

.menu .active,
.menu A:HOVER,
.menu .nav-item.active .active A,
.menu .nav-item.active>A {
    color: #09ADEA;
}

.menu .parent {
    position: relative;
}

.menu .nav-header {
    display: flex;
    align-items: center;
    transition: all 0.2s ease-in-out;
    cursor: pointer;
}

.menu .mod-menu__sub {
    padding: 8px 4px;
    background: #fff;
    box-shadow: 2px 2px 12px rgba(11, 53, 69, 0.1);
    border-radius: 8px;
    text-transform: none;
    position: absolute;
    top: 100%;
    left: 0;
    width: 320px;
    display: none; /* Важно: изначально скрыто */
    z-index: 9999;
}

/* Подменю третьего уровня и выше */
.menu .mod-menu__sub .mod-menu__sub {
    top: -8px;
    left: calc(100% + 5px);
    margin-left: -4px;
    display: none; /* Важно: вложенные подменю тоже скрыты */
}

.menu .mod-menu__sub .parent > .nav-header {
    padding-right: 24px; /* Расширяем область для hover */
}

/* 3. Плавное исчезновение с задержкой (если нужно) */
.menu .mod-menu__sub {
    transition: opacity 0.2s, visibility 0.2s;
    pointer-events: auto; /* Важно: позволяет взаимодействовать с подменю */
}
.parent:hover > .mod-menu__sub {
    opacity: 1;
    visibility: visible;
    transition-delay: 0.1s; /* Задержка перед закрытием */
}

.menu .mod-menu__sub .nav-item,
.menu .mod-menu__sub .nav-item A {
    margin-right: 0;
    text-transform: none;
    font-weight: 450;
    font-size: 14px; /* Добавляем явный размер шрифта */
    letter-spacing: 0.02em; /* Добавляем межбуквенное расстояние */
/*     line-height: 20px; /* Добавляем высоту строки */
/*    padding: 12px 16px; /* Добавляем отступы как у обычных пунктов */
    display: block; /* Делаем блочными */
    width: 100%; /* Занимаем всю ширину */
}

/* Убираем разницу в стилях для пунктов с подменю */
.menu .mod-menu__sub .nav-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 12px 16px;
}

.menu .mod-menu__sub LI {
    display: block;
    position: relative;
}

.menu .mod-menu__sub LI A {
    padding: 12px 16px;
    display: block;
}

.menu .mod-menu__sub LI A:HOVER {
    background: #F5F9FC;
    color: #09ADEA;
}

.menu .nav-header:HOVER {
    color: #09ADEA;
}

.menu .nav-header::after {
    font-family: "Material Symbols Outlined";
    font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 20;
    font-size: 20px;
    margin-left: 4px;
    content: '\e5c5';
    transition: all 0.2s ease-in-out;
}

/* Стрелка для подменю */
.menu .mod-menu__sub .nav-header::after {
    content: '\e5cc';
    font-size: 18px;
  	color: inherit;  
}

/* При наведении на пункт с подменю */
.menu .mod-menu__sub .nav-header:hover,
.menu .mod-menu__sub .nav-header:hover::after {
    color: #09ADEA;
    background: #F5F9FC;
}

.menu .nav-header:HOVER::after {
    color: #09ADEA;
}
/* Убираем стандартное поведение для всех вложенных подменю */
.menu .parent .mod-menu__sub {
    display: none;
}
/* Показываем подменю при наведении */
.menu .parent:HOVER > .mod-menu__sub,
.menu .mod-menu__sub .parent:HOVER > .mod-menu__sub {
    display: block;
}
/* Разрешаем показ только для непосредственного подменю при наведении */
.menu .parent:hover > .mod-menu__sub {
    display: block;
}


/* Cover */
.cover{
    padding: 80px 0 0;
    height: 660px;
    background: linear-gradient(0.06deg, #09ADEA -4.75%, #69CCF5 102.87%);
    overflow:hidden;
}
.cover H1{
    font-weight: 700;
    font-size: 52px;
    line-height: 64px;
    color: #fff;
    margin-bottom:40px;
}
.cover P{
    font-size: 30px;
    line-height: 42px;
    color: #fff;
    margin-bottom:40px;
}
.cover A.primary,
.cover A.secondary,
.about A.primary,
.about A.secondary{
    padding:12px 24px;
    display:inline-block;
    margin-right:24px;
    font-size:16px;
    line-height:24px;
    font-weight:500;
    margin-left:0;
}
.cover A.primary{
    color:#09ADEA;
    background-color:#fff;
    border:2px solid #fff;    
}
.cover A.primary:HOVER{
    background-color:rgba(255,255,255,.9);
}
.cover A.secondary:HOVER{
    background-color:rgba(255,255,255,.1);
}
.cover A.secondary{
    color:#fff;
    background-color:transparent;
    border:2px solid #fff;
}
.cover .image{
    width:100%;
    height:86%;
    background-image:url('../images/ambulance.webp');
    background-size:cover;
}
/*STEPS*/
.steps{
  padding:100px 0;
}
.steps H2{
  margin-bottom:60px;
}
.steps .count{
  	background: #F04438;
    color: #fff;
    width: 40px;
    text-align: center;
    padding: 8px;
    font-size: 20px;
    line-height:24px;
    font-weight:bold;
    border-radius: 3px;
    margin-bottom:4px;
}
.steps .step{
    font-size:13px;
    text-align:center;
    width:40px;
}
.steps H4{
  margin-bottom:8px;
  font-size:20px;
}
.steps .col-10 .text{
    font-size:14px;
    background:#f5f5f5;
    border-radius:3px;
    padding:16px 12px;
    height:100%;
}
.steps .row{
    height:100%;
}
.steps .text P{
    font-size:14px;
    line-height:135%;
    margin-bottom:0;
}
.steps .col-xl-3{
  margin-bottom:40px;
}
.steps .material-symbols-outlined {
    font-size:70px;
    margin-bottom:16px;
    color:#F04438;
    font-variation-settings:
        'FILL' 0,
        'wght' 300,
        'GRAD' 0,
        'opsz' 70
}
/* ADVANTAGE */
.advantages{
    padding:100px 0;
}
.advantages H2{
    margin-bottom:60px;
}
.advantages .item{
    padding:0 40px 60px 0;
}
.advantages .title{
    font-weight: 500;
    font-size: 18px;
    line-height: 28px;
    margin-bottom:6px;
}
.advantages .material-symbols-outlined {
    font-size:60px;
    color:#00D957;
    font-variation-settings:
        'FILL' 0,
        'wght' 300,
        'GRAD' 0,
        'opsz' 60
}
/* SERVICE */
.services{
    padding:100px 0;
}
.services H2{
    margin-bottom:40px;
}
.services .item{
    height:100%;
    background:#fff;
    border-radius:16px;
    padding:24px 24px 74px;
    position:relative;
}
.services .col-12{
    margin-bottom:24px;
}
.services .image{
    border-radius:9px;
    margin-bottom:20px;
    background-size:cover;
    background-color:#eee;
    height:200px;
}
.services .title{
    font-weight: 500;
    font-size: 20px;
    line-height: 28px;
    margin-bottom:12px;
}
.services .text{
    margin-bottom:12px;    
}
.services .link A{
    padding:8px 16px;
    border-radius:6px;
    display:block;
    text-align:center;
    font-weight:500;
    font-size:14px;
    color:#09ADEA;
    transition:all 0.2s ease-in-out;
    border:1px solid #CDEFFD;
    position:absolute;
    left:24px;
    right:24px;
    bottom:24px;
}
.services .link A:HOVER{
    border:1px solid #09ADEA;
    color:#fff;
    background:#09ADEA;
}

/* ABOUT */
.about{
    padding:100px 0;
}
.about H2{
    margin-bottom:40px;
}
.about P{
    margin-bottom:24px;
}
.about A.primary,
.about A.secondary{
    margin-left:0;
    margin-right:12px;
}
.about .image{
    padding-right:60px;
}
.about IMG{
    width:100%;
    max-width:540px;
    border-radius:24px;
}

/* STAF */
.staf{
    padding:100px 0;
}
.staf H2{
    margin-bottom:40px;
}
.staf .item{
    height:100%;
    background:#fff;
    border-radius:16px;
    padding:24px 24px 74px;
}
.staf .col-12{
    margin-bottom:24px;
}
.staf .image{
    border-radius:9px;
    margin-bottom:20px;
    background-size:cover;
    background-color:#eee;
    height:400px;
}
.staf .title{
    font-weight: 500;
    font-size: 20px;
    line-height: 28px;
    margin-bottom:8px;
}
.staf .job{
    margin-bottom:6px;   
    display:flex;
    align-items:center;    
}
.staf .job::before{
    font-family:"Material Symbols Outlined";
    font-variation-settings:'FILL' 0,'wght' 400,'GRAD' 0, 'opsz' 20;
    font-size:16px;
    margin-right:6px;
    content:'\e8f9';
}
.staf .experience{
    display:flex;
    align-items:center;
}
.staf .experience::before{
    font-family:"Material Symbols Outlined";
    font-variation-settings:'FILL' 0,'wght' 400,'GRAD' 0, 'opsz' 20;
    font-size:16px;
    margin-right:6px;
    content:'\e8b5';
}
/* FAQ */
.faq{
    padding:100px 0;
}
.faq H2{
    margin-bottom:40px;
}
.faq .question{
    background:#F5F6F7;
    transition:all 0.2s ease-in-out;
    cursor:pointer;
    margin-top:20px;
    font-weight:500;
    font-size:18px;
    line-height:24px;
    padding:16px 24px;
    border-radius:8px 8px 0 0;
    display:flex;
}
.faq .question::before{
    font-family:"Material Symbols Outlined";
    font-variation-settings:'FILL' 0,'wght' 400,'GRAD' 0, 'opsz' 24;
    font-size:20px;
    color:#414042;
    margin-right:12px;
    content:'\e15b';
}
.faq .question.collapsed{
    border-radius:8px;
}
.faq .question.collapsed::before{
    font-family:"Material Symbols Outlined";
    font-variation-settings:'FILL' 0,'wght' 400,'GRAD' 0, 'opsz' 24;
    font-size:20px;
    color:#414042;
    margin-right:12px;
    content:'\e145';
}
.faq .question:HOVER{
    color:#09ADEA;
    background:#E6ECF2;
}
.faq .answer{
    padding:16px 24px;
    border-left: 2px solid #F5F6F7;
    border-right: 2px solid #F5F6F7;
    border-bottom: 2px solid #F5F6F7;
    border-radius: 0 0 8px 8px;
}
/* FOOTER */
FOOTER{
    padding:80px 0 24px;
    background:#414042;
    color:#fff;
    text-align:center;
}
FOOTER .address{
    padding-bottom:24px;
}
FOOTER H2{
    margin-bottom:24px;
}
FOOTER .phone A{
    font-size:24px;
    font-weight:600;
    margin-bottom:8px;
}
FOOTER .copyright{
    margin-top:40px;
    color:#777;
}
/* PAGE */
.page{
    background:#fff;
    padding:100px 0;
}
.page IMG{
    width:100%;
    border-radius:12px;
}
.page H1{
    margin-bottom:32px;
}
.page H2{
    margin-bottom:20px;
}
.page .promo{
    margin-bottom:32px;
    border-radius:20px;
    padding:24px;
    background:#F5F9FC;
}
.page .promo H3{
    font-size:22px;
    font-weight:500;
    margin-bottom:24px;
}
.page .promo UL,
.page .promo LI{
    margin:0;
    padding:0;
    list-style:none;
}
.page .promo LI::before{
    font-family:"Material Symbols Outlined";
    font-variation-settings:'FILL' 1,'wght' 400,'GRAD' 0, 'opsz' 20;
    font-size:16px;
    color:#00D957;
    margin-right:6px;
    content:'\e86c';
}
.page .promo IMG{
    width:100%;
    border-radius:12px;
}
.page H3{
    margin-bottom:16px;
}
.page .price{
    border-radius:16px;
    padding:8px 24px;
    background:#F7FAFC;
}
.page .price DIV{
    padding:12px 0;
    border-bottom:1px solid #E9F0F7;
}
.page .price DIV:nth-last-child(-n+2){
    border:none;
}
.page .price DIV:nth-child(even){
    font-weight:500;
    text-align:right;
}
/* OFFERS */
.offers{
    padding-left:32px;
}
.offers .moduletable{
    padding:24px;
    background:#F7FAFC;
    border-radius:20px;      
}
.offers UL.nav{
    margin:0;
    list-style:none;
    display:block;
    padding:0;
}
.offers .nav LI{
    padding:8px 0;
    font-size:16px;
    font-weight:450;
    display:block;
    border-bottom:1px solid #f4f4f4;
}
.offers .nav LI.current A{
    opacity:0.5;
    color:#414342;
}
/* WIDGET */
.widget{
    display: block;
    width:60px;
    position:fixed;
    right:12px;
    bottom:50px;
}
.widget A{
    display:block;
    width:60px;
    height:60px;
    margin-top:12px;
    text-decoration:none;
    box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.15);
    background:#000;
    border-radius:8px;
    transition:all 0.2s ease-in-out;
}
.widget A:HOVER IMG{
    opacity:0.8;
}
.excluded{
    display:none;
}
BLOCKQUOTE{
  background:#E7F8FF;
  margin:30px 0;
  padding:30px;
  border:1px solid #D0EAF5;
  border-radius:16px;
}
BLOCKQUOTE P,
BLOCKQUOTE H2,
BLOCKQUOTE H3{
  margin:10px 0;
}
.promotion{
  font-size:20px;
}
UL.promotion LI{
  margin-bottom:16px;
}
SECTION.promo{
    padding-top:100px;
    padding-bottom:100px;
}
SECTION.promo H2{
  margin-bottom:60px;
}
SECTION.promo IMG{
    border-radius:12px;
    max-width:100%;
}
SECTION.promo .col-6{
    margin-bottom:20px;
}

/* Мигалка */
.menu .nav-item:nth-child(2) {
  position: relative; /* Делаем элемент относительно позиционированным */
  padding-left: 16px; /* Добавляем отступ слева для кружка */
}

.menu .nav-item:nth-child(2)::before {
  content: ''; /* Обязательно указываем content для псевдоэлемента */
  position: absolute; /* Абсолютное позиционирование */
  left: 0; /* Размещаем кружок слева */
  top: 50%; /* Выравниваем по вертикали */
  transform: translateY(-50%); /* Центрируем по вертикали */
  width: 10px; /* Ширина кружка */
  height: 10px; /* Высота кружка */
  background-color: red; /* Цвет кружка */
  border-radius: 50%; /* Делаем кружок круглым */
  animation: blink 0.5s infinite; /* Применяем анимацию */
}

.menu .nav-item:nth-child(2).active::before {
  display:none;
}

@keyframes blink {
  0%, 100% {
    opacity: 1; /* Полная видимость */
  }
  50% {
    opacity: 0; /* Полная прозрачность */
  }
}

.menu .nav-item.item-101{
  margin-right:24px;
}
#menu-mobile .item-103 {
  position: relative; /* Делаем элемент относительно позиционированным */
  padding-right: 16px; /* Добавляем отступ слева для кружка */
}
#menu-mobile .item-103::before {
  content: ''; /* Обязательно указываем content для псевдоэлемента */
  position: absolute; /* Абсолютное позиционирование */
  right: 20px; /* Размещаем кружок слева */
  top: 50%; /* Выравниваем по вертикали */
  transform: translateY(-50%); /* Центрируем по вертикали */
  width: 10px; /* Ширина кружка */
  height: 10px; /* Высота кружка */
  background-color: red; /* Цвет кружка */
  border-radius: 50%; /* Делаем кружок круглым */
  animation: blink 0.5s infinite; /* Применяем анимацию */
}
#menu-mobile .item-103.active::before {
  display:none;
}