@import url('https://fonts.googleapis.com/css2?family=Sofia+Sans+Condensed:ital,wght@0,1..1000;1,1..1000&display=swap');
:root{--system-font:"Sofia Sans Condensed",sans-serif;;--primary:#D22333;--accent:#9AAD5D;--light-green:#F5F7EE;--shadow:rgba(0,0,0,0.2) 0 0 10px;--black:#000;--white:#fff;--big-shadow:#C9D4D9 0 0 90px;--grey:#A1A1A1;--silver:#F5F5F5;}

html {overflow-x:hidden;}
iframe {vertical-align: middle;}
body,html{font-family:var(--system-font);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;min-height: 100%;}
.small-shadow {box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.1);}
.primary-text {color: var(--primary);}
.white-text, .light-text {color: var(--white);}
.primary {background-color: var(--primary);}
.accent {background-color: var(--accent);}
.white {background-color: var(--white);}
.black {background-color: var(--black);}
.black-text {color: var(--black);}
.silver {background-color: var(--silver);}
.mh100p {min-height: 100%;}
.mask {background-color: var(--black); opacity: 0.6;position: absolute;top:0;left:0;width: 100%; height: 100%;}
body{font-family:var(--system-font);font-size:16px;font-weight:500;-webkit-animation:fadeinout .3s ease-in 1 forwards;animation:fadeinout .3s ease-in 1 forwards;}
@-webkit-keyframes fadeinout{0%{opacity:0}
100%{opacity:1}
;}
@keyframes fadeinout{0%{opacity:0}
100%{opacity:1}
;}
.flex-col{float:none !important;flex-direction:row;}
.flex-row{display:flex;}
.flex1 {flex: 1;}
.v-center{top:50%;position:relative;transform:translateY(-50%);}
.vcenter-items {align-items: center;}
.lngbar{position:absolute;top:15px;right:60px;z-index:30;-o-transition:all .2s linear;-moz-transition:all .2s linear;-webkit-transition:all .2s linear;transition:all .2s linear;}
.lngbar .lng{width:30px;height:30px;text-align:center;line-height:30px;color:var(--white);font-weight:600;background-color:var(--accent); font-size: 0.9em;}
.lngbar ul{list-style:none;position:absolute;top:30px;left:0;background-color:var(--silver);width:30px;text-align:center;opacity:0;height:0px;overflow:hidden;-o-transition:all .2s ease;-moz-transition:all .2s ease;-webkit-transition:all .2s ease;}
.lngbar ul.open{opacity:100;-o-transition:all .2s ease;-moz-transition:all .2s ease;-webkit-transition:all .2s ease;height:auto;}
.lngbar ul li{color:#000;cursor:pointer;height:30px;line-height:30px;-o-transition:all .2s ease;-moz-transition:all .2s ease;-webkit-transition:all .2s ease;}
.lngbar ul li:hover{color:var(--black);background-color:var(--primary);-o-transition:all .2s ease;-moz-transition:all .2s ease;-webkit-transition:all .2s ease;}
.lngbar ul li:hover a{color:var(--white);}
.lngbar ul li a{text-decoration:none;color:#000;font-size:0.8em;font-weight:400;}
.lngbar .select{border-color:var(--primary) transparent;border-style:solid solid none;border-width:5px 5px medium;height:5px;right:-12px;position:absolute;top:12px;width:0;text-decoration:none;color:var(--black);}
.editable {display: contents;}
.cmspage .wraper {margin: auto;}
.cmspage p {margin-bottom: 10px;}
.cmspage ul, .cmspage ol {margin-bottom: 10px; padding-left: 20px; line-height: 1.5;}
.cmspage h2 {margin-bottom: 30px;}
.cmspage h3 {margin-bottom: 15px; font-size: 1.4em; font-weight: 700;}
.cmspage table {border: solid 1px var(--silver); border-collapse: collapse; width: 100%; margin-bottom: 20px;}
.cmspage table  td {padding: 10px; border: solid 1px var(--silver);}
.bg-center-top {background-position: center top;}

.gallery-home-slick .slick-track .slick-slide, .testimonial-slider .slick-track .slick-slide {margin-inline: 5px;}
.gallery-home-slick .custom-prev::after {content: url('/public/images/arrow-white-left.svg'); display: block; width: 40px; height: 40px;cursor:pointer}
.gallery-home-slick .custom-next::after{content: url('/public/images/arrow-white-right.svg');display: block; width: 40px; height: 40px;cursor:pointer}
.gallery-home-slick .custom-prev:hover::after {content: url('/public/images/arrow-red-left.svg');display: block; width: 40px; height: 40px;}
.gallery-home-slick .custom-next:hover::after{content: url('/public/images/arrow-red-right.svg');display: block; width: 40px; height: 40px;}

.gallery-home-slick  .custom-next{position: absolute;bottom: -75px;right: calc(50% - 50px)}
.gallery-home-slick   .custom-prev{position: absolute;bottom: -75px;left: calc(50% - 50px)}
.no-margin-row > *{margin-left: 0 !important}
.breadcrumbs span:last-of-type {color: var(--accent);}


.slick-track {
    /* Enable Flexbox for the track */
    display: flex !important;
    /* Optional: ensures items stretch to fill the height */
    align-items: stretch;
}

.slick-slide {
    /* Override Slick's default height and inherit from the track */
    height: inherit !important;
    /* Important for inner content to fill the slide */
    display: flex !important;
}

.slick-slide img {
    /* Ensures the image fills the entire height of the slide */
    height: 100%;
    /* Ensures the image covers the area without distortion/stretching */
    width: 100%; /* Optional, if you want full width */
    object-fit: cover; 
    /* The 'cover' value fills the slide while maintaining aspect ratio, 
       potentially cropping parts of the image. Use 'contain' if you 
       want the full image visible, which may leave empty space. */
}


#gallery-page .gallery div[class^="col-25"]:nth-child(4n + 1) {margin-left: 0;}


        /* Custom styles for the menu button (hamburger) */
        .menu-call {
            cursor: pointer;
            display: flex; /* Always visible now */
            flex-direction: column;
            justify-content: space-around;
            width: 30px;
            height: 25px;
            z-index: 50; /* Above the menu */
            transition: transform 0.3s ease-in-out;
        }

        .bar {
            width: 100%;
            height: 3px;
            /* Changed to white to contrast with the new dark header */
            background-color: white; 
            border-radius: 10px;
            transition: all 0.3s ease;
        }

        /* Styles when the menu is open (Hamburger animation remains centered) */
        .menu-call.open .bar:nth-child(1) {
            transform: rotate(-45deg) translate(-5px, 6px);
        }
        .menu-call.open .bar:nth-child(2) {
            opacity: 0;
        }
        .menu-call.open .bar:nth-child(3) {
            transform: rotate(45deg) translate(-5px, -6px);
        }

        /* Menu styling - START HIDDEN ON THE LEFT (applies to all screens) */
        .menu {
            z-index: 20;
            /* Start off-screen (to the left) */
            transform: translateX(-100%); 
            transition: transform 0.3s ease-in-out;
        }
        

        .menu.open {
            /* Slide in to 0 position */
            transform: translateX(0);
        }

                #mainMenu li > ul {
                display: none;

            }

            /* Клас за показване */
            #mainMenu li > ul.show {
                display: block;
            }
        /* Remove desktop-specific overrides */


        #mainMenu {text-align: center; font-size: 20px;}
        #mainMenu > ul {display: flex;flex-direction: column;gap: 40px;}
        #mainMenu  ul li a {width: 100%;}
        #mainMenu > ul > li:has(ul.show) {background: var(--light-green)}
        #mainMenu  ul li a:hover  {background: var(--accent);display: block;}


        .slick-list {
            padding-bottom: 20px;
        }
        

        .slick-dots li.slick-active button:before {font-size:10px }
        
        /* The Active Dot (Red) */
        .slick-dots li.slick-active button:before { color: var(--primary)!important ;}


        .slick-track {
            display: flex !important;
        }
        #gallery-home-slick .slick-slide {
            height: inherit !important;
            padding: 0 10px; /* Gap between slides */
        }

        /* Custom Dots Styling to match the image (Red active, Black inactive) */
        .slick-dots {
            bottom: -40px;
        }
        
        .slick-dots li {
            margin: 0 4px;
        }

        .slick-dots li button:before {
            font-size: 20px;
            opacity: 1; 
            color: var(--black);
            transition: all 0.3s ease;
        }

        .slick-dots li.slick-active button:before {
            color: var(--primary); /* Tailwind red-500 */
            opacity: 1;
        }

        
@media (max-width:1360px){
  #gallery-page .gallery div[class*="col-"] {
        width: 48%;
    }
    #gallery-page .gallery div[class^="col-25"]:nth-child(2n + 1) {margin-left: 0;}
}

@media (max-width:900px){

    .responsive-row {flex-direction: column;gap: 10px; }
    .responsive-row > * {width: 100% !important;margin-left: 0 !important;}

    .wraper {
        min-width: auto;
    }

       #gallery-page .gallery div[class*="col-"] {
        width: 100%;
        margin-left: 0;
    }
    #gallery-page .gallery div[class^="col-"] {margin-left: 0;}


}
