/*
 * Custom CSS
 */
@font-face {
    font-family: 'Bulatov';  /* Задайте название для вашего шрифта */
    src: url('../fonts/Bulatov.otf') format('opentype'); /* Указываем, что это OpenType */
}

@import url("../fonts/CirceRounded/stylesheet.css");

@font-face {
font-family: 'CirceRounded';
src: url('../fonts/CirceRounded/CirceRounded-Regular5.woff2') format('woff2'),
url('../fonts/CirceRounded/CirceRounded-Regular5.woff') format('woff'),
url('../fonts/CirceRounded/CirceRounded-Regular5.ttf') format('truetype');
font-weight: 200;
font-style: normal;
font-display: swap;
}

@font-face {
font-family: 'BebasNeueCyrillic';
src: url('../fonts/BebasNeueCyrillic/BebasNeueCyrillic.woff2') format('woff2'),
url('../fonts/BebasNeueCyrillic/BebasNeueCyrillic.woff') format('woff'),
url('../fonts/BebasNeueCyrillic/BebasNeueCyrillic.ttf') format('truetype');
font-weight: 400;
font-style: normal;
font-display: swap;
}



body {
    font-family:'CirceRounded'; /* Примените шрифт к body или другому элементу */
}

        html, body {
            overflow-x: hidden;
            width: 100%;
            margin: 0;
            padding: 0;
        }
        
        .container-fluid {
            padding-right: 15px;
            padding-left: 15px;
            margin-right: auto;
            margin-left: auto;
            width: 100%;
            overflow-x: hidden;
        }
        
        /* Для всех row внутри container-fluid */
        .container-fluid .row {
            margin-right: 0;
            margin-left: 0;
        }

body {
	min-height: 100vh;
	display: grid;
	grid-template-rows: 1fr auto;
	margin: 0;
}

.footer {
	grid-row: 2;

}


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

.block-content {
margin: 50px 100px;
}

.title-w {
color: #FFF;
font-size: 3.5rem;
font-family: 'BebasNeueCyrillic';
margin-top: 40px;
}

@media (max-width: 768px) {
.title-w {
font-size: 1.5rem;
}
}

.page-bg {
 background-image: url("../img/bg-page.webp");
background-size: cover;
}

.center {
text-align: center;
}

.title-w {
text-align: center;
font-size: 3.5rem;
font-family: 'BebasNeueCyrillic';
color: #FFF; 
text-transform: uppercase;   
}

.subtitle-w {
font-size: 2rem;
font-family: 'BebasNeueCyrillic';
color: #FFF; 
text-transform: uppercase;   
}

.yelow {
color: rgba(242, 196, 29, 1);
}
.grid-3col {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
}

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

@media (max-width: 768px) {

.title-w {
font-size: 1.5rem!important;  
}

.subtitle-w {
font-size: 1.2rem!important;  
}

.page-w {
font-size: 1rem!important;  
}

.w-50 {
width: 100%!important;
}

.page-carusel img {
margin-left: 0!important;
}

.block-content {
  margin: 50px 10px;
}

.page-carusel {
  margin: 50px 0px;
}

}

/*Страницы*/

.yel-subtitle {
  color: rgba(242, 196, 29, 1);
  font-size: 2.5rem;
  text-transform: uppercase;
  font-family: 'BebasNeueCyrillic';
}

.page-w {
color: rgba(255, 255, 255, 1);
font-size: 2rem;    
}

.page-carusel{
 margin: 50px 20px;   
}

.page-carusel img{
 margin-left: 25%;
 border: 5px solid #fff;
 border-radius: 10px;  
}

.page-strelka img{
 width: 30%!important;   
 margin-left: 100px;
}


/*Хедер*/

header .top-1 {
 background-image: url("../img/bg-header.webp");
 color: aliceblue;
 padding: 10px 100px;
}

.top-1 .logo {
width: 100%;  
}

@media (max-width: 768px) {
header .top-1 {
 padding: 10px 5px;
}

.navbar li {
font-size: 1rem!important;
background: rgba(242, 196, 29, 0)!important;
font-family:'CirceRounded'!important;
font-weight: bold;
padding: 0 30px;
}

.navbar-nav {
 background: rgba(255, 255, 255, 1)!important;
border-radius: 5px;
}
}


/*Navbar*/
#navbarNavAltMarkup a {
font-family: 'Bulatov';	
font-size: 1.5rem;
 background: rgba(242, 196, 29, 1);
 border-radius: 7px;
 margin: 0px 15px 15px 15px;
}

.navbar li {
font-family: 'Bulatov';	
font-size: 1.1rem;
 background: rgba(242, 196, 29, 1);
 border-radius: 7px;
 margin: 0px 10px 10px 10px;
}

.navbar .active {
 background: rgba(255, 255, 255, 1);
}


.navbar-toggler {
 background-color: #FFF!important;   
}



.top-contact {
display: grid;
grid-template-columns: 1fr 1fr;
height: 100%;
}

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

.top-contact-l {
	display: grid;
justify-content: start;
}

.top-contact-r {
	display: grid;
justify-content: center;
}

.top-contact-c {
display: grid;
justify-content: center;
align-content: end;
margin-bottom: 30px;
}

.top-contact-l a, .top-contact-r a {
color: #FFF;
font-size: 1.9rem;
text-decoration:none;
font-family: 'CirceRounded';
}

.contact-soc img {
margin: 0 10px;
}

.btn-pop {
background:rgba(252, 17, 43, 1);
font-family: 'Bulatov';	
font-size: 1.5rem;
color: #FFF;	
}

.btn-pop:hover {
background:rgba(232, 17, 43, 1);
font-family: 'Bulatov';	
font-size: 1.5rem;
color: #CCC;	
}


@media (max-width: 1768px) {
 .top-contact-l a, .top-contact-r a {
font-size: 1.1rem;
} 

.navbar li {
  font-size: 0.8rem;
} 

.contact-soc img {
width: 32px;
margin: 0 5px;
} 
}

@media (max-width: 1500px) {
.navbar li {
  margin: 0px 2px 5px 2px;
}

.btn-pop {
  font-size: 1rem;
}
}

@media (max-width: 992px) {
 .top-contact-l a, .top-contact-r a {
font-size: 0.9rem;
} 
.top-contact-l {
justify-content: center;
}

.top-contact-r {
justify-content: center;
} 

.contact-soc img {
width: 32px;
} 
}

@media (max-width: 1200px) {

 .top-contact-l a, .top-contact-r a {
font-size: 1rem;
} 

.contact-soc img {
width: 22px;
}
}


/*Главная страница*/
.bl-1 {
background-image: url("../img/bg-bl1.webp");
border: 2px solid #887c83;
}

.main-content img {
 width: 100%;   
}

.bord-l {
  border-right: 2px solid #887c83;
}
.bord-c {
  border-right: 2px solid #887c83;
}

.polosa {
 height: 62px;
 background-image: url("../img/new-star.webp");   
}

@media (max-width: 768px) {
.polosa {
  height: 32px;
  background-size: contain;
}

.bl-1 {
border: none;
}

.bord-l {
  border-right: none;
}
.bord-c {
  border-right: none;
}


}

.polosa-1 {

 height: 62px;
 background:rgba(242, 196, 29, 1);
 color: rgba(22, 11, 20, 1);
 font-family: 'Bulatov';	
font-size: 2rem;
justify-content: center;  
align-content: center;
text-align: center;
}

@media (max-width: 1670px) {
.polosa-1 {	
font-size: 1.5rem;
}
}

@media (max-width: 1300px) {
.polosa-1 {	
font-size: 1.3rem;
}
}



.bl-2 {
background-image: url("../img/bg-bl2.webp");
padding: 50px 100px;
background-size: cover;
}

.bl-2 .bl2-1 {
 color: rgba(255, 255, 255, 1);
 font-size: 5rem; 
 text-transform: uppercase;
 font-family: 'BebasNeueCyrillic'; 
  line-height: 1; 
}

.bl-2 .bl2-1 span {
 font-size: 7rem;    
}

.bl-2 .bl2-2 {
 color: rgba(242, 196, 29, 1);
 font-size: 2.5rem; 
 text-transform: uppercase;
 font-family: 'BebasNeueCyrillic';
 padding: 50px 0;  
}

@media (max-width: 768px) {
.bl-2 .bl2-2 {
 font-size: 1.5rem; 
}
}

.bl-2 .bl2-3 {
 color: rgba(255, 255, 255, 1);
 font-size: 1.5rem; 
 font-family: 'CirceRounded';
 padding: 50px 0;   
}

@media (max-width: 768px) {

.bl-2 {
padding: 5px;
}

.bl-2 .bl2-1 {

 font-size: 1.5rem; 
padding: 5px;
}

.bl-2 .bl2-1 span {
 font-size: 1.5rem;    
}

.bl-2 .bl2-2 {
 font-size: 1.2rem; 
padding: 5px; 
}

.bl-2 .bl2-3 {
 font-size: 1rem; 
 padding: 5px;  
}

}

.bl-3 {
background-image: url("../img/bg-bl3.webp");
padding: 50px 100px;
background-size: cover;
}

.bl3-title {
display: grid;
 color: rgba(255, 255, 255, 1);
 font-family: 'BebasNeueCyrillic';	
font-size: 5rem;
justify-content: center;  
align-content: center;
margin: 50px 0;   
}

@media (max-width: 768px) {
.bl-3 {
padding: 50px;
}

.bl3-title {
font-size: 1.5rem;   
}
}

.bl4-title {
 color: rgba(0, 0, 0, 1);
 font-family: 'BebasNeueCyrillic';	
font-size: 5rem;
text-align: center; 
}
.bl4-title span {
color: rgba(242, 196, 29, 1);
}

.bl3-deti {
text-align: center;
padding: 20px 30px;    
}

.ico-star {
 width: 100%; 
 text-align: center; 
}
.ico-star img {
 width: 150px;  
}

.deti-ino {
 color: rgba(242, 196, 29, 1);
 font-size: 2.5rem; 
 text-transform: uppercase;
 font-family: 'BebasNeueCyrillic';
 padding: 30px 0;
 text-align: center;
 line-height: 1;     
}

@media (max-width: 1300px) {

.deti-ino {
 font-size: 1.5rem;    
}

.bl3-btn .btn {
  font-size: 1.5rem!important;
}

.bl3-vzr {
  font-size: 1.4rem!important;
}

}

@media (max-width: 768px) {
.bl4-title {	
font-size: 1.5rem;
}

.deti-ino {
 font-size: 1rem;  
}

.ico-star img {
 width: 50px;  
}

}



.arrow-l {
display: grid;
justify-content: end;   
}

.arrow-l img {
width: 100px;
}

.arrow-r {
display: grid;
justify-content: start; 
}
.arrow-r img {
width: 150px;   
}

@media (max-width: 768px) {
.arrow-l {
display: none;
 
}
.arrow-r {
display: none;
 
}
}
.bl3-btn {
display: grid;
justify-content: center;
}

.bl3-btn .btn {
font-size: 3.5rem;
font-family: 'BebasNeueCyrillic';     
}

.bl3-vzr {
color:#FFF;
font-size: 2.4rem;    
}

.bl-3 img {
 border-radius: 10px;   
}

.bl-4 {
background:rgba(236, 234, 243, 1);
padding: 80px 0;
}

.bl4-subtitle {
text-align: center;
font-size: 3.5rem;
font-family: 'BebasNeueCyrillic';     
}

.bl4-txt {
text-align: center;
font-size: 1.5rem;     
}

.bl4-adres {
 text-align: center;
font-size: 2rem;    
}

@media (max-width: 1300px) {

.bl4-subtitle {
font-size: 1.5rem;     
}

.bl4-txt {
font-size: 1rem;     
}

.bl4-adres {
font-size: 1.2rem;    
}

}

.page-phone a {
color: #000;
text-decoration: none;
font-weight: bold;
font-size: 1.5rem;
}

.page-phone a:hover {
color: #CCCCCC;
}

.page-soc img {
width: 50px;
margin: 0 10px;
}


@media (max-width: 768px) {

    .bl3-btn .btn {
font-size: 1.5rem;    
}

.bl3-vzr {
font-size: 1rem;    
}

.bl4-subtitle {
font-size: 1.5rem;     
}

.bl4-adres {
font-size: 1rem;    
}
}

.block-7 .bl3-block {
border: 1px solid rgba(20, 20, 20, 0.5); 
padding: 20px 20px; 
}


p span {
color:rgba(242, 196, 29, 1);
}

        /*Страница Контакты*/

.contact {
color: #fff;
}

.contact .adr-fil {
font-size: 1.5rem;
}

.contact a {
color: #FFF;
}

.contact a:hover {
color: rgba(252, 17, 43, 1);
}

.page-eml a {
color:rgba(242, 196, 29, 1);
text-decoration: none;
font-weight: bold;
font-size: 1.5rem;
}

.page-eml a:hover {
color: rgba(252, 17, 43, 1);
}

/*Страница Соревнования*/

.left {
text-align: left;
}

.right {
text-align: right;
}

.left img, .right img {
width: 150px;
}

.bl4-txt span {
color: rgba(252, 17, 43, 1);
font-weight: bold;
}

.calendar img {
margin: 10px 0;
}

        /*Подвал*/
.bl-footer {
 background: rgba(22,11,20,1);  
} 
.footer-title {
color: #FFF;
text-align: center;
font-size: 3.5rem;
font-family: 'BebasNeueCyrillic';
margin-top: 40px;
}

.footer-phone {
text-align: center;    
}

.footer-phone a {
text-align: center;
color: #FFF;
font-size: 1.5rem; 
text-decoration: none;   
}

.footer-soc, .footer-logo {
 text-align: center;   
}

.footer-soc img {
 margin: 20px 10px;   
}

.footer-logo img {
 margin: 50px 0px; 
 width: 200px;  
}

@media (max-width: 768px) {
.footer-title {
font-size: 2.5rem;
}

}

 /* ===== Модальные окна ===== */

.modal-header {
  position: relative;
  justify-content: center;
}
.modal-header .btn-close {
  position: absolute;
  right: 1rem;
  top: 1rem;
  margin: 0;
}
.modal-title {
  text-align: center;
}
.modal-body {
  font-size: 18px;
}
.modal-body .form-control {
  font-size: 18px;
}

.soc-modal {
  display: flex;
  gap: 20px;
  align-items: center;
  margin-top: 24px;
}

.soc-modal img {
width: 30px!important;
 background: none!important;
}

#family {
 background: #FFF;
}

 /* ===== OWL карусель ===== */


        /* Слайдер на весь экран */
        .fullscreen-slider {
            width: 100vw;
            position: relative;
            display: flex;
            align-items: center;
            justify-content: center;
            background: #000000;
            padding: 20px 0;
        }

        .fullscreen-slider .owl-carousel {
            width: 100%;
            height: 100%;
            padding: 0 40px;
        }

        .fullscreen-slider .owl-stage-outer {
            height: 100% !important;
            display: flex;
            align-items: center;
        }

        .fullscreen-slider .owl-stage {
            height: 100% !important;
            display: flex !important;
            align-items: center;
        }

        .fullscreen-slider .owl-item {
            height: 100% !important;
            display: flex !important;
            align-items: center;
            justify-content: center;
            padding: 10px;
        }

        /* Карточка слайда */
        .fullscreen-slider .item {
            width: auto;
            height: 300px;
            max-height: 300px;
            position: relative;
            cursor: pointer;
            border-radius: 0px;
            overflow: hidden;
            transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
            border: 2px solid rgba(255, 255, 255, 0.05);
        }

        .fullscreen-slider .item:hover {
            transform: scale(1.03);
            box-shadow: 0 20px 60px rgba(0, 0, 0, 0.7);
            border-color: rgba(249, 115, 22, 0.3);
        }

        .fullscreen-slider .item img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            display: block;
            transition: transform 0.6s ease;
        }

        .fullscreen-slider .item:hover img {
            transform: scale(1.05);
        }

        /* Затемнение */
        .fullscreen-slider .item .overlay {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: linear-gradient(to top, rgba(0,0,0,0.7), transparent 50%);
            pointer-events: none;
        }

        /* Подпись внутри слайда */
        .fullscreen-slider .item .caption {
            position: absolute;
            bottom: 30px;
            left: 50%;
            transform: translateX(-50%);
            color: white;
            font-size: 1.1rem;
            font-weight: 500;
            text-shadow: 0 2px 20px rgba(0,0,0,0.8);
            background: rgba(0,0,0,0.5);
            backdrop-filter: blur(10px);
            padding: 10px 24px;
            border-radius: 40px;
            border: 1px solid rgba(255,255,255,0.1);
            pointer-events: none;
            white-space: nowrap;
            letter-spacing: 0.3px;
        }
        .fullscreen-slider .item .caption i {
            margin-right: 8px;
            color: #facc15;
        }

        /* Индикатор номера */
        .fullscreen-slider .item .slide-number {
            position: absolute;
            top: 16px;
            right: 20px;
            color: rgba(255,255,255,0.4);
            font-size: 0.8rem;
            font-weight: 300;
            background: rgba(0,0,0,0.3);
            backdrop-filter: blur(4px);
            padding: 4px 14px;
            border-radius: 20px;
            border: 1px solid rgba(255,255,255,0.05);
            pointer-events: none;
        }

        /* ===== СТРЕЛКИ ===== */
        .owl-theme .owl-nav [class*='owl-'] {
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            background: rgba(255, 255, 255, 0.08);
            backdrop-filter: blur(12px);
            color: white;
            width: 52px;
            height: 52px;
            border-radius: 50%;
            font-size: 24px;
            display: flex;
            align-items: center;
            justify-content: center;
            border: 1px solid rgba(255, 255, 255, 0.12);
            transition: all 0.3s ease;
            z-index: 10;
        }
        .owl-theme .owl-nav [class*='owl-']:hover {
            background: rgba(249, 115, 22, 0.6);
            transform: translateY(-50%) scale(1.1);
            border-color: #f97316;
        }
        .owl-theme .owl-nav .owl-prev {
            left: 10px;
        }
        .owl-theme .owl-nav .owl-next {
            right: 10px;
        }

        /* ===== ТОЧКИ ===== */
        .owl-theme .owl-dots {
            position: absolute;
            bottom: 20px;
            left: 50%;
            transform: translateX(-50%);
            display: flex;
            gap: 10px;
            z-index: 10;
        }
        .owl-theme .owl-dots .owl-dot span {
            background: rgba(255, 255, 255, 0.2);
            width: 12px;
            height: 12px;
            border-radius: 50%;
            transition: all 0.3s ease;
            border: 2px solid rgba(255, 255, 255, 0.05);
        }
        .owl-theme .owl-dots .owl-dot.active span,
        .owl-theme .owl-dots .owl-dot:hover span {
            background: #f97316;
            transform: scale(1.3);
            border-color: #f97316;
        }

        /* ===== МОДАЛЬНОЕ ОКНО ===== */
        .modal-overlay {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, 0.85);
            backdrop-filter: blur(12px);
            display: none;
            align-items: center;
            justify-content: center;
            z-index: 1000;
            padding: 30px;
            animation: fadeIn 0.3s ease;
        }
        .modal-overlay.active {
            display: flex;
        }

        .modal-content {
            position: relative;
            max-width: 90vw;
            max-height: 90vh;
            border-radius: 16px;
            overflow: hidden;
            box-shadow: 0 40px 80px rgba(0,0,0,0.8);
            animation: scaleIn 0.35s ease;
        }
        .modal-content img {
            width: 100%;
            height: auto;
            max-height: 85vh;
            object-fit: contain;
            display: block;
            background: #0a0e17;
        }

        .modal-close {
            position: absolute;
            top: 16px;
            right: 20px;
            background: rgba(0,0,0,0.6);
            backdrop-filter: blur(4px);
            color: white;
            border: none;
            font-size: 26px;
            width: 48px;
            height: 48px;
            border-radius: 50%;
            cursor: pointer;
            transition: 0.3s ease;
            z-index: 10;
            border: 1px solid rgba(255,255,255,0.1);
            display: flex;
            align-items: center;
            justify-content: center;
        }
        .modal-close:hover {
            background: #f97316;
            transform: rotate(90deg);
        }

        .modal-caption {
            position: absolute;
            bottom: 0;
            left: 0;
            right: 0;
            background: linear-gradient(to top, rgba(0,0,0,0.8), transparent);
            color: white;
            padding: 35px 24px 18px;
            font-size: 1.2rem;
            font-weight: 500;
        }
        .modal-caption i {
            margin-right: 10px;
            color: #facc15;
        }

        /* Анимации */
        @keyframes fadeIn {
            from { opacity: 0; }
            to { opacity: 1; }
        }
        @keyframes scaleIn {
            from { transform: scale(0.9); opacity: 0.5; }
            to { transform: scale(1); opacity: 1; }
        }

        /* ===== АДАПТИВ ===== */
        @media (max-width: 1024px) {
            .fullscreen-slider .item {
                height: 70vh;
                max-height: 70vh;
            }
            .fullscreen-slider .item .caption {
                font-size: 0.9rem;
                padding: 8px 18px;
                bottom: 20px;
            }
        }

        @media (max-width: 768px) {
            .fullscreen-slider .owl-carousel {
                padding: 0 30px;
            }
            .fullscreen-slider .item {
                height: 55vh;
                max-height: 55vh;
                border-radius: 14px;
            }
            .fullscreen-slider .item .caption {
                font-size: 0.8rem;
                padding: 6px 14px;
                bottom: 16px;
                white-space: normal;
                max-width: 90%;
                text-align: center;
            }
            .fullscreen-slider .item .slide-number {
                top: 10px;
                right: 12px;
                font-size: 0.7rem;
                padding: 2px 10px;
            }
            .owl-theme .owl-nav [class*='owl-'] {
                width: 38px;
                height: 38px;
                font-size: 16px;
            }
            .owl-theme .owl-nav .owl-prev { left: 4px; }
            .owl-theme .owl-nav .owl-next { right: 4px; }
            .owl-theme .owl-dots {
                bottom: 12px;
                gap: 6px;
            }
            .owl-theme .owl-dots .owl-dot span {
                width: 8px;
                height: 8px;
            }
            .modal-close {
                width: 38px;
                height: 38px;
                font-size: 20px;
                top: 10px;
                right: 12px;
            }
            .modal-caption {
                font-size: 0.9rem;
                padding: 25px 16px 14px;
            }
        }

        @media (max-width: 480px) {
            .fullscreen-slider .owl-carousel {
                padding: 0 20px;
            }
            .fullscreen-slider .item {
                height: 40vh;
                max-height: 40vh;
                border-radius: 10px;
            }
            .fullscreen-slider .item .caption {
                font-size: 0.7rem;
                padding: 4px 12px;
                bottom: 12px;
            }
            .owl-theme .owl-nav [class*='owl-'] {
                width: 30px;
                height: 30px;
                font-size: 12px;
            }
        }  
        

/*Кнопка для родителей и тренеров*/
      .vhod {
  margin-top: -60px;
  margin-right: 15px;
  position: fixed;
  z-index: 1000000;
  right: 0;
  bottom: 80px;
}

.vhod .btn {
border: solid 2px rgba(242, 196, 29, 1);
background: rgba(252, 17, 43, 1);
font-family: 'Bulatov';
font-size: 1.5rem;
color: #FFF;
}
