@font-face {
	font-family: "Montserrat-Regular";
	src: url("/templates/rostsayt-4/fonts/Montserrat-Regular.ttf") format("truetype");
	font-weight: 400;
}

@font-face {
    font-family: "Montserrat-Medium";
    src: url("/templates/rostsayt-4/fonts/Montserrat-Medium.ttf") format("truetype");
	font-weight: 500;
}

@font-face {
    font-family: "Montserrat-SemiBold";
    src: url("/templates/rostsayt-4/fonts/Montserrat-SemiBold.ttf") format("truetype");
	font-weight: 700;
}


/* Настройки шаблона */
:root, body {font-size: 10px;}
@media screen and (min-width: 576px) {
	:root, body {font-size: 12px;}
}
@media screen and (min-width: 768px) {
	:root, body {font-size: 12px;}
}
@media screen and (min-width: 992px) {
	:root, body {font-size: 14px;}
}
@media screen and (min-width: 1200px) {
	:root, body {font-size: 16px;}
}

:root {
	/* --bebas: "BebasNeue-Regular", sans-serif; */
	--white: #FEF8EC;
	--orange: #DC8E60;
	--salar: #83B5B6;
	--dark: #332F26;
}

.main-upcoming .owl-item, .main-upcoming .owl-stage {display: flex !important;}

.mr-auto {margin-right: auto !important;}

.rounded-5 {border-radius: 1.75rem !important;}
.rounded-6 {border-radius: 3.125rem !important;}


.bg-salar {background-color: var(--salar);}
.bg-orange {background-color: var(--orange);}
.bg-blur {backdrop-filter: blur(13px); -webkit-backdrop-filter: blur(13px);}

.btn-salar {background-color: var(--salar); color:	var(--white);}
.btn-salar:hover {background-color: transparent !important; color: var(--salar) !important; border: 1px solid var(--salar);}
.btn-salar:hover svg path {stroke:var(--salar);}

.btn-blur {
	background-color: #fff3;
	border-color: var(--white) !important; 
	color: var(--white) !important;
	backdrop-filter: blur(13px) !important;
    -webkit-backdrop-filter: blur(13px) !important; /* Для поддержки в Safari */
}

.btn-outline-light {background-color: transparent !important;}

.border-white {border-color: var(--white) !important;}
.border-orange {border-color: var(--orange) !important;}
.border-salar {border-color: var(--salar) !important;}

.text-white {color: var(--white) !important;}
.text-orange {color: var(--orange) !important;}


.box-shadow-salar {box-shadow: 0 0 18.4px 0 var(--salar); }


.line-clamp-3 {
    display: -webkit-box;
    -webkit-line-clamp: 3; /* Количество строк */
	padding-bottom: 11px;
    -webkit-box-orient: vertical;  
    overflow: hidden;
    /* Чтобы текст не "прилипал", можно добавить фиксированную высоту строки */
    /* line-height: 1.4;  */
}


.cart-dizyan {height: 416px;}
.choose-dizyan {height: 288px;}

.col-sm-6:not(.col-xl-4) .line-clamp-3 {padding-bottom: 24px;}

/* Элементы */
html {width: calc(100% + calc(100vw - 100%)); overflow-x: hidden;}
body {display: flex; flex-direction: column; margin: 0 auto; max-width: 1920px; color: var(--dark); outline: 1px solid #ddd; overflow-x: hidden;
	font-family: 'Montserrat-Medium', sans-serif; font-weight: 400; font-style: normal; background: var(--white) !important;
}
#middle main  {overflow: inherit;}
*::before {pointer-events: none;}
@media (min-width: 1400px) {.container {max-width: 1297px;}}
@media screen and (min-width: 1920px) {.bg-color::before {margin-left: -960px;}}


h1, .h1 {font-size: 3.25rem !important; font-family: 'Montserrat-Medium', sans-serif !important; font-weight: 500 !important;}
h2, .h2 {font-size: 2.5rem !important; font-family: 'Montserrat-Medium', sans-serif !important; font-weight: 500 !important;}
h3, .h3 {font-size: 1.5rem !important; font-family: 'Montserrat-Medium', sans-serif !important; font-weight: 500 !important;}
h4, .h4 {}
h4, .h4 {}
h5, .h5 {font-size: 1.25rem !important; font-family: 'Montserrat-Medium', sans-serif !important; font-weight: 500 !important;}
h5.h5-bold, .h5-bold {font-size: 1.25rem !important; font-family: 'Montserrat-SemiBold', sans-serif !important; font-weight: 500 !important;}
h6, .h6 {font-size: 1rem !important; font-family: 'Montserrat-Medium', sans-serif !important; font-weight: 500 !important;}

a {text-decoration:none; color:#000; transition: none;}
svg {flex-shrink: 0;}

/* Общие классы */
img[src="/images/icon/link.svg"] {
    width: 16px !important; /* или любое нужное значение */
    height: 16px !important;
}

/* Переопределения Bootstrap */
.btn {border-radius:0; padding:1rem; font-size:1.5rem;}
	
/* Шапка */
.home header .mod-header-all {display: none;}
.home header .navbar-toggler svg path {stroke: white;}
header .mod-header {display: none;}
.home header .mod-header {display: block;}

.mod-header-all img {width: 24px; height: 24px;}

.home header {
	backdrop-filter: blur(13px);
    -webkit-backdrop-filter: blur(13px); /* Для поддержки в Safari */
	background-color: rgba(51, 47, 38, .2);
	border-bottom: 1px solid var(--white);
	border-radius: 0 0 1.75rem 1.75rem;
}
header #top_menu {width:100%;}
header #top_menu > ul {justify-content:space-between; align-items: center; gap:8.67px}
header #top_menu > ul > li > a {font-size: 1rem; color: var(--dark); padding: 8px 6px;}
.home header #top_menu > ul > li > a {color: var(--white);}
/* header #top_menu > ul > li > a:hover {background-color: #83B5B6; color: var(--white) !important; border-radius: 1.75rem;} */
/* header #top_menu > ul > li > a >:hover {background-color: #83B5B6; color: var(--white) !important; border-radius: 1.75rem;}	 */
header ul.main-menu {order: 1;}
header ul.right-menu {order: 3;}
header .navbar-brand {padding: 0; margin: 0 1.5rem;}
header .navbar-brand img {width: 12.25rem;}
header.active {backdrop-filter: none;}
header .nav-item.parent .mod-menu__sub.js-active{display: block !important; position: static;}
/* header .nav-item.parent .mod-menu__sub.show-menu{display: block !important; position: static;} */




header .nav-item.parent.js-active a[tabindex="0"]::after {transform: rotate(180deg);
    transition: transform 0.3s ease;}

header .mod-menu__sub {background-color: var(--salar); border-radius: 16px; position: absolute; display: none; margin-top: 5px; width: 100%; max-width: 306px; border: 1px solid var(--white);}
header .mod-menu__sub.show-menu {display: block;}
header .mod-menu__sub > li > a {color: var(--white);  padding: 12px; display: block;}
header .mod-menu__sub > li:not(:first-child) > a {
    border-top: 1px solid var(--white);
}



.btn-salar:hover img {
    content: url("/images/icon/link_white.svg"); /* Укажите путь к новой картинке */
}

@media screen and (min-width: 1200px) {
	
header #top_menu > ul > li > a:hover {background-color: #83B5B6; color: var(--white) !important; border-radius: 1.75rem;}
	header.navbar > .container {flex-wrap:wrap; position:relative;}
	header.navbar-expand-xl .navbar-collapse {width:100%}
	header #header_items > * {margin-left:1rem;}
}
/* Подвал */
footer {}

/* Модули */

.breadcrumb {padding-left:0 !important;}

#middle {gap:1rem;}
#middle #left > * {width:200px;}
#middle #left ul {display:block; margin:0; padding:0;}
#middle #left ul li {display:block; margin:0 0 1rem; padding:0;}
#middle #right > * {width:200px;}


/* Главный баннер */
.mod-banner::before {
	background: var(--bg-image) no-repeat center var(--dark);
    background-size: cover;
    top: -16rem;
    margin-top: 0px;
    margin-bottom: 0px;
    z-index: -1;
}
.mod-banner .banner-item:hover {justify-content: space-between !important; background-color: var(--orange) !important; border: none !important;}
.mod-banner .banner-item:hover img {display: block !important;}

/* Формат занятий */
.mod-main-format .format-item:hover {background-color: var(--orange) !important; color: var(--white) !important;}
.mod-main-format .format-item:hover .format-item-desc {display: block !important;}
.mod-main-format .format-item:hover .one-stroke {fill: var(--white);}
.mod-main-format .format-item:hover svg path:not(.one-stroke) {stroke: var(--orange);}


/* Поводы, которые хочется запомнить */
.mod-main-events .content-block {border-radius: 0 0 1.75rem 1.75rem; margin-top: -2rem; padding-top: 150px;}

/* .main-events.owl-carousel .owl-stage-outer {overflow-y: visible !important;} */

/* Выделяем центральный слайд */
.main-events.owl-carousel .owl-item {
  opacity: 1;
  transform: scale(.8); /* Увеличиваем в размере */
  transition: transform 1s ease; 
}

.main-events.owl-carousel .owl-item.center {
  opacity: 1;
  transform: scale(1.3) !important; /* Увеличиваем в размере */
  z-index: 2; /* Выводим на передний план */
  margin: 0 28px !important;
}

/* Оранжевое свечение (как на картинке) */
.main-events.owl-carousel .owl-item.center .item{
  box-shadow: 0 0 50.2px 0 rgba(254, 248, 236, 1); 
  border-radius: 25px;
}

.main-events.owl-carousel{
    overflow: hidden; /* Обрезаем бока */
    padding-top: 80px;    /* Место для увеличенного центрального слайда сверху */
    padding-bottom: 80px; /* Место для тени и увеличения снизу */
    margin-top: -80px;    /* Компенсируем отступ, чтобы не сдвигать верстку */
}

.main-events.owl-carousel .owl-item.active::nth-child(1){transform: scale(.8);}
.main-events.owl-carousel .owl-item.active::nth-child(2){transform: scale(.6);}

/* Обертка, в которой ездят слайды */
.main-events.owl-carousel .owl-stage-outer {
    overflow: visible !important; /* Разрешаем вылет элементов за границы этой обертки */
}

/* Дополнительно: чтобы боковые слайды не перекрывали соседние блоки */
.main-events.owl-carousel .owl-stage {
    display: flex;
    align-items: center; /* Центрируем слайды по вертикали */
}

/* .main-events.owl-carousel .owl-item:not(.active){display: none !important;} */


/* Создайте своё первое изделие из глины */
.mod-main-create {background: var(--bg-image) center / cover no-repeat;}
.mod-main-create.py-100 {padding: 175px 0;}

/* Как проходит занятие */
.mod-main-what .what-item.row1{margin-top: 233px;}
.mod-main-what .what-item.row2{margin-top: -130px;}
.mod-main-what .what-item.row3{margin-top: 150px;}

.mod-main-what .arrow-one{top: 13rem;}
.mod-main-what .arrow-two{top: 30rem;}
.mod-main-what .arrow-three{top: 45rem;}

/* Ближайшие события */
.mod-main-upcoming {border: 1px solid var(--orange); box-shadow: 0 0 28.6px 0 #DC8E60;}
.mod-main-upcoming .upcoming-item::before {
	content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    bottom: 0;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 40.58%, rgba(0, 0, 0, 0.7) 100%);
    z-index: 1;
	border-radius: 1.75rem;
}


/* Авторские изделия */

.mod-main-author .author-item:hover {background-color: var(--orange) !important; color: var(--white) !important;}
.mod-main-author .author-item:hover .author-item-desc {display: block !important;}
.mod-main-author .author-item:hover .one-stroke {fill: var(--white);}
.mod-main-author .author-item:hover svg path:not(.one-stroke) {stroke: var(--orange);}



/* Отзывы наших гостей */
.mod-reviews .main-review .owl-item {display: flex;}
.mod-reviews .main-review .owl-stage {display: flex;}
.mod-reviews .main-review .owl-stage-outer {overflow: visible;}


/* Частый вопросы */
.mod-main-faq .faq-item.active .faq-otvet {display: block !important;}
.mod-main-faq .faq-item.active .faq-vopros {background-color: var(--orange); color: var(--white);}
.mod-main-faq .faq-item.active svg {transform: rotate(-90deg); transition: transform 0.3s ease;}
.mod-main-faq .faq-item svg {transform: rotate(0); transition: transform 0.3s ease;}
.mod-main-faq .faq-item.active .svg-fill {fill: var(--white);}
.mod-main-faq .faq-item.active .svg-stroke {stroke: var(--orange);}


/* Контакты */
.mod-contacts .contacts-item {cursor: pointer;}
.mod-contacts .contacts-item.active {background-color: var(--salar) !important; color: var(--white) !important;}
.mod-contacts .contacts-item.active .contacts-item-text {gap: 10px;} 
.mod-contacts .contacts-item.active .contacts-item-phone {display: flex !important; gap: 10px !important;} 
.mod-contacts .contacts-item.active svg .contacts-fill {fill: var(--white);}
.mod-contacts .contacts-item.active svg .contacts-stroke {stroke: var(--salar);}
.mod-contacts .contacts-item svg {transform: rotate(0); transition: transform 0.3s ease;}
.mod-contacts .contacts-item.active svg {transform: rotate(-90deg); transition: transform 0.3s ease;}


.mod-contacts .contacts-gallery.owl-carousel {display: none !important; 
	/* max-width: calc(100% - 9%); */
}
.mod-contacts .contacts-gallery.owl-carousel.active {display: block !important;}

.mod-contacts .nav-contacts-element {display: none;}
.mod-contacts .nav-contacts-element.active {display: block;}



/* Категории */
.category .category-item:hover {background-color: var(--orange) !important; color: var(--white) !important;}
.category .category-item:hover .category-item-desc {display: -webkit-box !important;}
.category .category-item:hover .one-stroke {fill: var(--white);}
.category .category-item:hover svg path:not(.one-stroke) {stroke: var(--orange);}
.category-item-desc span {font-size: 1.25rem; font-weight: bold;}


/* Сертификаты */
.mod-sert .sert-item {cursor: pointer;}
.mod-sert .sert-item .sert-vibor {display: block;}
.mod-sert .sert-item.active .sert-vibor {display: none;}
.mod-sert .sert-item.active {cursor: pointer; background: var(--orange) !important; color: var(--white) !important;}
.mod-sert .sert-item.active .sert-variants {display: flex !important; flex-direction: column !important; gap: 10px;}
.mod-sert .sert-item.active .sert-variants .sert-variant {cursor: pointer;}

.mod-sert .sert-item.active svg .fill {fill: var(--white);}
.mod-sert .sert-item.active svg .stroke {stroke: var(--orange);}
.mod-sert .sert-item svg {transform: rotate(0); transition: transform 0.3s ease;}
.mod-sert .sert-item.active svg {transform: rotate(-90deg); transition: transform 0.3s ease;}


/* Наша команда */
.mod-team .team-carousel .owl-stage {display: flex;}
.mod-team .team-carousel .owl-stage .owl-item {display: flex; flex: 1 1 0;}

.mod-lesson .lesson-carousel.owl-carousel .owl-stage-outer {overflow: visible;}


/* Правила посещения */
.rules-item:last-child {width: 100%;}

/* Подвал */
footer .mod-header button{background: var(--orange) !important;}
footer .nav-item.item-106 {display: none;}
footer .main-menu {display: grid; grid-template-columns: 1fr 1fr 1fr; column-gap: 9.125rem; row-gap: 1.5rem;}
footer .right-menu {display: grid; column-gap: 9.125rem; row-gap: 1.5rem;}
footer .all-menu {display: flex; gap: 9.125rem;}
footer .all-menu > ul > li > a:hover {background-color: #83B5B6; color: var(--white) !important; border-radius: 1.75rem;}
footer .all-menu > ul > li > a {padding: 8px 6px;}

footer .mod-menu__sub {display: none;}
/* Адаптация */


/* Детальная страница товара */
.other-products.owl-carousel .owl-stage-outer {overflow: visible !important;}

.all-masters.owl-carousel .owl-stage {display: flex;}
.all-masters.owl-carousel .owl-item {flex: 1 1 0; display: flex;}
.all-masters .category-item:hover img, .kwork-master .category-item:hover img{transform: scale(1.1);}

.category-item:hover .kwork-price{color: var(--white) !important;}

/* Анимации */

.delay-1 {-webkit-animation-delay:200ms;animation-delay:200ms}
.delay-2 {-webkit-animation-delay:400ms;animation-delay:400ms}
.delay-3 {-webkit-animation-delay:600ms;animation-delay:600ms}
.delay-4 {-webkit-animation-delay:800ms;animation-delay:800ms}
.delay-5 {-webkit-animation-delay:1000ms;animation-delay:1000ms}
.delay-6 {-webkit-animation-delay:1200ms;animation-delay:1200ms}
.delay-7 {-webkit-animation-delay:1400ms;animation-delay:1400ms}
.delay-8 {-webkit-animation-delay:1600ms;animation-delay:1600ms}
.delay-9 {-webkit-animation-delay:1800ms;animation-delay:1800ms}
.delay-10 {-webkit-animation-delay:2000ms;animation-delay:2000ms}

@keyframes opacity {
  0% {opacity: 0;}
  50% {opacity: 0.5;}
  100% {opacity: 1;}
} 


@media screen and (max-width: 1400px) {
	.cart-dizyan {height: 380px;}
	header #top_menu > ul > li > a {font-size: 0.79rem;}
	header #top_menu > ul {gap: 7.67px;}

	.mod-banner .banner-tab-content .banner-item {font-size: 1.05rem !important;}

}

@media screen and (max-width: 1200px) {

	.home header {
		backdrop-filter: none;
		-webkit-backdrop-filter: none; /* Для поддержки в Safari */
		background: none;
		border-bottom: none;
		border-radius: 0;
	}


	header .mod-menu__sub {display: none !important;}
header .nav-item.parent {position: relative;}

header .nav-item.parent a[tabindex="0"]::after {
    content: '';
    position: absolute;
    width: 24px;
    height: 24px;
    background-image: url('data:image/svg+xml;utf8,<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M6 14L12 8L18 14" stroke="%23FEF8EC" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>');
    background-repeat: no-repeat;
    background-size: contain;
    transition: transform 0.3s ease; /* Добавим плавности для поворота */
}


	header .nav-item.parent.js-active > a{background-color: #83B5B6; color: var(--white) !important; border-radius: 1.75rem; border: 1px solid #fff;}


	#navbar-content {
		position: absolute;
		width: 100%;
		left: 0;
		top: 0;
		padding: 24px;
		border-radius: 30px;
		backdrop-filter: blur(16.4px);
		background-color: #0005;
		border-bottom: 1px solid var(--white);
		border-radius: 0 0 1.75rem 1.75rem;
	}

	header #top_menu > ul { flex-direction: column;}
	header .mod-header .svg-icons, header .mod-header-all .svg-icons {gap: 24px; justify-content: center !important;}
	header .mod-header .header-button, header .mod-header-all .header-button {margin-left: auto; margin-right: auto;}
	header #top_menu > ul > li > a {font-size: 16px; text-align: center; color: var(--white) !important;}
header .mod-menu__sub > li > a {font-size: 16px; text-align: center;}
	.cart-dizyan {height: 380px;}

	.mod-banner .banner-tab-content {display: grid !important; grid-template-columns: 1fr 1fr;}
	.mod-banner .banner-tab-content .banner-item:last-child{grid-column: span 2;}


	footer .footer-content {flex-direction: column;}
	footer .all-menu > ul > li > a {font-size: 1.5rem;}
	footer .main-menu {grid-template-columns: 1fr; margin-bottom: 1.5rem;}
	footer .all-menu {text-align: center;}
	footer .right-menu {margin-bottom: 1.5rem;}
	footer .all-menu {display: block;}


	
	.contacts-iframe {
        width: 100% !important;
        height: auto !important;
        aspect-ratio: 1 / 1; /* Делает элемент квадратным */
    }

	
	.mod-banner .banner-tab-content .banner-item {font-size: 1.25rem !important;}

}

@media screen and (max-width: 992px) {
	.cart-dizyan {height: 325px;}
	.choose-dizyan {height: 260px;}
	.col-6 .line-clamp-3 {padding-bottom: 10px;}

	/* .mod-main-about .about-main-image {max-height: 350px;} */

	.mod-main-what .row-what-main {display: flex; flex-direction: column; justify-content: center;}

	.mod-main-what .what-item .what-item-row{display: flex; justify-content: center;}
	.mod-main-what .what-item.row1 {margin-top: 0;}
	.mod-main-what .what-item.row2 {margin-top: 0;}
	.mod-main-what .what-item.row3 {margin-top: 0;}
}

@media screen and (max-width: 768px) {
	
/* Главный баннер */
	.mod-banner::before {
		background: var(--bg-mobile-image) no-repeat center var(--dark);
	}

	.mod-banner .bg-blur {
		backdrop-filter: blur(5px);
		-webkit-backdrop-filter: blur(5px);
	}
	
	.cart-dizyan {height: 276px;}
	.choose-dizyan {height: 252px;}


	header #top_menu {margin-top: 70px;}
}

@media screen and (max-width: 576px) {
	.choose-dizyan {height: auto;}

	.mod-main-create .create-main-content, .mod-banner .banner-main-content {margin-left: auto !important; margin-right: auto !important;}
}



#ajax-form.show {display: block !important;}
#ajax-form .fos-studio-data.show {display: flex !important;}