:root {
    --theme-color: #263d59;
    --heading-color: #11213B;
    --theme-transition: all .25s cubic-bezier(.4,0,.2,1);
    --theme-transition-long: all .45s cubic-bezier(.4,0,.2,1);
    --theme-radius: 8px;
    --theme-radius-big: 12px;
    --body-font: "Manrope", sans-serif;
    --heading-font: "Cal Sans", sans-serif;
    --body-color: #59585d;
    --white-color: #fff;
    --bg-gray-color: #f6f6f6;
    --bs-gutter-x: 2.5rem!important;
}

a, svg {transition: var(--theme-transition); color: var(--theme-color); text-decoration: none;}
a:hover {color: var(--theme-color-lighter); text-decoration: none;}
.noselect, img, .theme-button, button {-webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;}
*:focus {outline: none!important; box-shadow: none!important;}
::-moz-selection {color: #fff; background-color: var(--theme-color); text-fill-color: initial;}
::selection {color: #fff; background-color: var(--theme-color); -webkit-text-fill-color: initial; text-fill-color: initial;}
.theme-button:focus {text-decoration: none;}
.first-cta ul li a {background: var(--theme-color)!important;}
.list-style-no {list-style: none; padding: 0; margin: 0;}
.checkout label:has(input) {cursor: pointer;}
a.no {color: var(--theme-color); font-size: 20px;}
label {font-weight: 400; margin-bottom: 0;}
footer ul li {opacity: 1; line-height: 1.6em;}
footer .details p.title::before {display: none;}
footer .visa {width: auto;}
.form-control:focus {border-color: inherit; outline: 0; -webkit-box-shadow: none; box-shadow: none;}
.nav-link:focus-visible, .nav-link:focus {box-shadow: none;}{margin-right: 15px;}
.overlay:before, .overlay-after:after {content: ''; position: absolute; display: block; height: 100%; width: 100%; top: 0; left: 0; pointer-events: none;}

.container {--bs-gutter-x: 2.5rem;}
.row {--bs-gutter-x: 2.5rem;}

html, body {font-size: 16px; line-height: 1.5; overflow: unset; scroll-behavior: auto !important;}
body {font-family: var(--body-font); color: var(--body-color); background: var(--bg-gray-color); transition: none;}
/*body:not(.home, .project, .projekti, .strucni-tim) {padding-top: 143px;}*/
h1, h2, h3, h4, h5, h6 {color: var(--heading-color); font-family: var(--heading-font); font-weight: 400;}
h1 {font-size: 40px; margin-bottom: 32px;}
p {font-size: 17px;}
.text-gray-8 {color: #fff8;}

.section-title {font-size: 36px; line-height: 1.2; color: var(--heading-color); margin-bottom: 24px;}
.section-subtitle {border: 1px solid #7272722E; border-radius: 24px; padding: 3px 13px 3px 10px; color: var(--alt-color); font-weight: 500; text-transform: uppercase; font-size: 12px;}
.theme-radius {border-radius: var(--theme-radius);}
.theme-radius-big {border-radius: var(--theme-radius-big);}
.page-subtitle {color: #fff8; letter-spacing: .3px; font-weight: 300; font-size: 20px;}

header {position: fixed; top: 0; left:0; right:0; background: transparent; transition: var(--theme-transition);}
body.politika-privatnosti, body.uslovi-koriscenja {padding-top: 142px;}
body.politika-privatnosti header, body.uslovi-koriscenja header {background: var(--theme-color);}
.home header {background: #11213b6e;}

header .logo img {height: 100px;}
header .navbar {transition: var(--theme-transition); padding: 16px 0;}
header .navbar .navbar-brand img {height: 80px; filter: brightness(0) invert(1); transition: var(--theme-transition);}

header .header-icons svg {width: 20px; height: 20px; fill: var(--theme-color); margin-left: 8px;}
header .search-icon svg {fill: var(--white-color);}
header .search-icon-mob {right: 64px;}
header .search-icon-mob svg {width: 40px; height: 40px;}
    
.hamburger {background: none; border: none; cursor: pointer; padding: 0;}
.hamburger svg rect {fill: var(--white-color); transition: all 0.4s ease;}
.hamburger:hover svg rect:nth-child(1) {transform: translateY(24px) translateX(-1px) rotate(45deg);}
.hamburger:hover svg rect:nth-child(2) {opacity: 0;}
.hamburger:hover svg rect:nth-child(3) {transform: translateY(-28px) translateX(7px) rotate(-45deg);}
.hamburger svg rect {transform-origin: center;}

.offcanvas .offcanvas-header img {max-width: 100px;}
.offcanvas .offcanvas-header .text-reset svg {fill: #f3b0b0;}

.nav-up {top: -143px;}
header.header-shadow {box-shadow: 0 5px 10px -5px #aaa; box-shadow: rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px; backdrop-filter: blur(3px); background: #11213bab;}

.mega-service-item svg {width: 40px; min-width: 40px; height: 40px; display: block; fill: var(--theme-color);}
.mega-title {display: block; font-weight: 500; color: var(--heading-color); font-size: 16px;}


@media (min-width: 768px) {
    header .navbar .navbar-brand img {height: 100px;}
    h1 {font-size: 50px;}
    .section-title {font-size: 44px;}
}

@media (min-width: 992px) {
    h1 {font-size: 60px;}
    .section-title {font-size: 50px;}
    .offcanvas {visibility : visible; position : relative; background : none; border : none; justify-content : end; color : red;}
    header .navbar-expand-lg .navbar-nav .nav-link {position: relative; color: var(--white-color); transition: var(--theme-transition); font-size: 17px; padding: 8px; white-space: nowrap;}
    header .navbar-nav .nav-link.active, header .navbar-nav .nav-link.show, header .navbar-nav .nav-link:hover {color: var(--white-color);}
    header .navbar-expand-lg .navbar-nav .nav-link svg {fill: #fff;}
    header .navbar-nav .dropdown {position: relative;}
    header .navbar-nav .dropdown.megamenu {}
    header .navbar-nav .dropdown:after {content: ''; position:absolute; top: 50%; right: -8px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13.3 11.6' fill='%23fff'%3E%3Cpath d='M0 5.8c0-.4.4-.8.8-.8h9.6L6.9 1.4c-.3-.3-.3-.9 0-1.2s.9-.3 1.2 0l5 5c.3.3.3.8 0 1.2l-5 5c-.3.3-.9.3-1.2 0s-.3-.9 0-1.2l3.6-3.6H.8c-.4 0-.8-.3-.8-.8'/%3E%3C/svg%3E");;
        width: 12px; height: 11px; transform: translateY(-50%) rotate(90deg); margin-left: 4px; margin-top: 0; line-height: 11px; background-size: 12px 11px; background-repeat: no-repeat; background-position: center center;
        border: none; vertical-align: unset; transition: var(--theme-transition); transform-origin: center;
    }
    header .navbar-nav .nav-item.dropdown:hover:after {transform: translateY(-50%) rotate(-90deg);}
    header .dropdown-toggle:after {display: none;}
    header .navbar-expand-lg .navbar-nav .dropdown-menu {background: var(--bg-gray-color); border: none; margin-top: 50px;}
    header .navbar-expand-lg .navbar-nav .dropdown-menu .dropdown-menu:hover {background: transparent;}
    header .navbar .dropdown:not(.megamenu) .dropdown-menu {display:block !important; opacity:0; transform:translateY(10px); visibility:hidden; transition:opacity .2s ease, transform .2s ease; width: 200px; 
        padding: 16px; border-radius: 0 0 8px 8px; box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px;}
    header .navbar .dropdown:not(.megamenu) .dropdown-menu.show {opacity: 1; transform:translateY(0); visibility: visible;}
    header .navbar .dropdown:not(.megamenu) .dropdown-menu li .dropdown-item {padding: 10px; color: var(--heading-color);}
    header .navbar .dropdown:not(.megamenu) .dropdown-menu li .dropdown-item.active {background: transparent;}
    
    header .megamenu-content a.dropdown-link {display:block; padding: 2px 0; color:var(--bs-body-color); text-decoration: none;}
    header .megamenu-content a.dropdown-link:hover {color:var(--bs-primary);}
    header .navbar .dropdown.megamenu .dropdown-menu {display:block!important; position: fixed; width:100vw; left:0; top: 92px; border:none; opacity:0; transform: translate(0, 10px); visibility:hidden; 
        transition:opacity .25s ease, transform .25s ease; background: var(--bg-gray-color); box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px; border-radius: 0 0 16px 16px;}
    header .navbar .dropdown.megamenu .dropdown-menu.show {opacity: 1; transform: translate(0, 0); visibility: visible;}

    header .navbar .dropdown:before {content: ""; position: absolute; top: 100%; left: 0; width: calc(100% + 18px); height: 60px; background: transparent;}
    
    header .navbar-nav .nav-link:not(.dropdown-toggle):before, .navbar-nav .nav-link:not(.dropdown-toggle):after, .navbar .megamenu .dropdown-menu .mega-service-item:before, .navbar .megamenu .dropdown-menu .mega-service-item:after {content: ""; position: absolute;  background-color: #ffffffa1; transition: var(--theme-transition);}
    header .navbar-nav .nav-link:not(.dropdown-toggle):before, .navbar .megamenu .dropdown-menu .mega-service-item:before {bottom: -15px; left: 0; width: 2px; height: 0;}
    header .navbar-nav .nav-link:not(.dropdown-toggle):after, .navbar .megamenu .dropdown-menu .mega-service-item:after {bottom: 0; left: -15px; width: 0; height: 2px;}
    header .navbar-nav .nav-link:not(.dropdown-toggle):hover:before, .navbar-nav .nav-link:not(.dropdown-toggle).active:before, .navbar .megamenu .dropdown-menu .mega-service-item:hover:before, .navbar .megamenu .dropdown-menu .mega-service-item.active:before {height: 100%;}
    header .navbar-nav .nav-link:not(.dropdown-toggle):hover:after, .navbar-nav .nav-link:not(.dropdown-toggle).active:after, .navbar .megamenu .dropdown-menu .mega-service-item:hover:after, .navbar .megamenu .dropdown-menu .mega-service-item.active:after {width: 100%;}
    header .navbar .megamenu .dropdown-menu .mega-service-item:before, .navbar .megamenu .dropdown-menu .mega-service-item:after {background-color: var(--theme-color);}
    header .navbar-nav .dropdown-menu .nav-link.dropdown-item:not(.dropdown-toggle):before, .navbar-nav .dropdown-menu .nav-link.dropdown-item:not(.dropdown-toggle):after {background-color: var(--theme-color);}
    
    header .navbar-nav .nav-link.dropdown-toggle:before {content: ''; position: absolute; left: 50%; top: 100%; height: 0; width: 1px; background: var(--bg-gray-color); transition: .5s;}
    header .navbar-nav .dropdown:hover .nav-link.dropdown-toggle:before {height: 60px;}
    
    header .navbar-nav .dropdown-menu .mega-service-item svg {width: 100px; min-width: 100px; height: 100px;}
    header .navbar-nav .dropdown-menu .mega-title {font-size: 17px;}
}

@media (max-width : 991px) {
    .offcanvas {width : 400px!important; max-width: 75%!important;}
    .offcanvas-start-lg {top : 0; left : 0; border-right : 1px solid rgba(0, 0, 0, .2); transform : translateX(-100%);}
    header .navbar-expand-lg .navbar-nav {min-height: 100%;}
    header .navbar-expand-lg .navbar-nav .nav-link {font-size: 19px;}
    header .navbar-expand-lg .navbar-nav .nav-link, header .navbar-expand-lg .dropdown-item, header .navbar-expand-lg .mega-service-item {position: relative; border-bottom: 1px solid #263d5933; color: var(--theme-color);}
    header .navbar-expand-lg .navbar-nav .nav-link.active, header .navbar-expand-lg .dropdown-item.active, header .navbar-expand-lg .mega-service-item.active {background: transparent; padding-left: 10px; font-weight: 600;}
    header .navbar-expand-lg .mega-service-item.active .mega-title {font-weight: 600;}
    header .navbar-expand-lg .navbar-nav .nav-link:not(.dropdown-toggle):before, header .navbar-expand-lg .dropdown-item:before, header .navbar-expand-lg .mega-service-item:before, header .navbar-expand-lg .navbar-nav .nav-link:not(.dropdown-toggle):after, header .navbar-expand-lg .dropdown-item:after, header .navbar-expand-lg .mega-service-item:after {content: ""; position: absolute;  background-color: var(--theme-color); transition: var(--theme-transition);}
    header .navbar-expand-lg .navbar-nav .nav-link:not(.dropdown-toggle):before, header .navbar-expand-lg .dropdown-item:before, header .navbar-expand-lg .mega-service-item:before {bottom: -15px; left: -5px; width: 1px; height: 0;}
    header .navbar-expand-lg .navbar-nav .nav-link:not(.dropdown-toggle):after, header .navbar-expand-lg .dropdown-item:after, header .navbar-expand-lg .mega-service-item:after {bottom: 0; left: -15px; width: 0; height: 1px;}
    header .navbar-expand-lg .navbar-nav .nav-link:not(.dropdown-toggle).active:before, header .navbar-expand-lg .dropdown-item.active:before, header .navbar-expand-lg .mega-service-item.active:before {height: 100%;}
    header .navbar-expand-lg .navbar-nav .nav-link:not(.dropdown-toggle).active:after, header .navbar-expand-lg .dropdown-item.active:after, header .navbar-expand-lg .mega-service-item.active:after {width: calc(100% + 15px);}
    header .navbar-expand-lg .navbar-nav .nav-item:has(.active) .dropdown-menu {display: block;}
    header .navbar-expand-lg .navbar-nav .dropdown-menu {border: 0;}
    header .navbar-expand-lg .navbar-nav .dropdown-menu:not(.megamenu-content) {padding: 0 10% 0 20px;}
    header .navbar-expand-lg .navbar-nav .header-social-icons li {margin-right: 0;}
    header .navbar-expand-lg .navbar-nav .header-social-icons a > svg {width: 30px; height: 30px; fill: var(--theme-color);}
}

.page-intro {height: 500px; background: url(/fajlovi/product/stambeno-poslovni-objekat-djordja-vajferta-29-30-689.jpg) no-repeat center center / cover;  background-attachment: fixed; background-position: 50% calc(50% - 80px);}
.page-intro:before {background: linear-gradient(360deg, #16202de6, #16202de6);}
.page-intro .page-intro-content {padding-top: 80px;}
@media screen and (min-width: 768px){
    .page-intro {height: 400px; background-position: 50% calc(50% - 280px);}
}
@media screen and (min-width: 992px){
    .page-intro {background-position: 50% calc(50% - 400px);}
}


.theme-color {color: var(--theme-color);}
.heading-color {color: var(--heading-color);}
.theme-button {display: inline-flex; align-items: center; border-radius: 30px; gap: 12px; padding: 9px 9px 9px 30px; font-family: var(--heading-font); font-weight: 400; line-height: 1; background: transparent;
    border: 1px solid var(--theme-color); color: var(--theme-color);}
.theme-button:after {content: ''; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23ffffff' class='bi bi-arrow-right-short' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M4 8a.5.5 0 0 1 .5-.5h5.793L8.146 5.354a.5.5 0 1 1 .708-.708l3 3a.5.5 0 0 1 0 .708l-3 3a.5.5 0 0 1-.708-.708L10.293 8.5H4.5A.5.5 0 0 1 4 8'/%3E%3C/svg%3E");
        background-color: var(--theme-color); background-size: 30px 30px; background-repeat: no-repeat; background-position: center; width: 40px; height: 40px; min-width: 40px; border-radius: 50%; transform: rotate(-45deg);
}
.theme-button, .theme-button:after {transition: var(--theme-transition);}
.theme-button:hover {background-color: var(--theme-color);}
.theme-button:hover:after {transform: rotate(0deg);}
.theme-button-alt {color: #fff; border-color: #fff;}
.theme-button-alt:hover {border-color: var(--theme-color);}
.theme-button-alt2 {background-color: var(--theme-color); border-color: var(--theme-color); color: #fff;}
.theme-button-alt2:after {background-color: #fff; fill: var(--theme-color); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23263d59' class='bi bi-arrow-right-short' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M4 8a.5.5 0 0 1 .5-.5h5.793L8.146 5.354a.5.5 0 1 1 .708-.708l3 3a.5.5 0 0 1 0 .708l-3 3a.5.5 0 0 1-.708-.708L10.293 8.5H4.5A.5.5 0 0 1 4 8'/%3E%3C/svg%3E");}
.theme-button-alt2:hover {background-color: transparent; color: var(--heading-color);}
.theme-button-alt2:hover:after {background-color: transparent;}

.theme-lines {position: relative;}
.theme-lines:before, .theme-lines:after {content: ''; position: absolute; top: 0; background: #e3e3e8; display: block;}
.theme-lines:before {width: 100%; height: 1px; left: 0;}
.theme-lines:after {width: 1px; height: 70px; right: 30px; transform: translateY(-10px);}

.theme-list {list-style-type: none; padding-left: 0;}
.theme-list li {display: flex; align-items: start; line-height: 1.8;}
.theme-list li:before {content: ''; display: inline-block; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23263d59' viewBox='0 0 738.1 646.2'%3E%3Cpath d='m0 321.2 86.5-82.6 196.9 223.5 14.3-22.3c.5-.8 54-84 132.4-180.3C529.4 137.6 625 48.1 707.2 0l30.9 14.5c-28 27.9-80.8 83.4-141.6 162.1C516.6 280 408 444.1 339.4 643.1l-78 3L0 321.2z'%3E%3C/path%3E%3C/svg%3E");
        background-repeat: no-repeat; background-size: 22px 20px; width: 22px; min-width: 22px; height: 20px; background-position: center center; margin-right: 16px;
}

.hover-button {background-color: var(--theme-color); transition: var(--theme-transition); border: 1px solid var(--theme-color);}
.hover-button svg {fill: #fff; transition: var(--theme-transition); width: 16px; height: 16px;}
.hover-button:hover {background-color: transparent;}
.hover-button:hover svg {fill: var(--theme-color);}

.hover-img img {transition: var(--theme-transition-long);}
.hover-img:hover img {transform: scale(1.1);}

.section-padding {padding-top: 48px; padding-bottom: 48px;}

.theme-select-custom {position: relative; display: inline-block;}
.theme-select-trigger {display: flex; align-items: center; gap: 12px; border-radius: 30px; padding: 10px 9px 10px 27px; font-family: var(--heading-font); font-weight: 400; line-height: 1; background: transparent; border: 1px solid var(--theme-color); color: var(--theme-color); cursor: pointer; transition: .25s;}
.theme-select-trigger:hover {background: rgba(0,0,0,0.02);}
.theme-select-arrow {width: 36px; height: 36px; border-radius: 50%; background-color: var(--theme-color); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23ffffff' class='bi bi-arrow-right-short' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M4 8a.5.5 0 0 1 .5-.5h5.793L8.146 5.354a.5.5 0 1 1 .708-.708l3 3a.5.5 0 0 1 0 .708l-3 3a.5.5 0 0 1-.708-.708L10.293 8.5H4.5A.5.5 0 0 1 4 8'/%3E%3C/svg%3E"); 
    background-size: 26px; background-repeat: no-repeat; background-position: center; transition: .25s;}
.theme-select-custom:hover .theme-select-arrow {transform: rotate(45deg);}
.theme-select-custom.open .theme-select-arrow {transform: rotate(90deg);}
.theme-select-options {position: absolute; top: calc(100% + 6px); left: 0; right: 0; background: #fff; border: 1px solid var(--theme-color); border-radius: 20px; list-style: none; padding: 8px 0; margin: 0;
    display: none; box-shadow: 0 10px 30px rgba(0,0,0,0.08); animation: fadeIn .2s ease; z-index: 99; width: fit-content;}
.theme-select-custom.open .theme-select-options {display: block;}
.theme-select-options li {padding: 10px 18px; cursor: pointer; font-family: var(--heading-font); color: var(--heading-color); transition: .2s; white-space: nowrap;}
.theme-select-options li:hover {background: var(--theme-color); color: #fff;}
.theme-select-options li.active {background: var(--theme-color); color: #fff;}

[class*='swiperProductBrand'] img {opacity: 1; height: 70px; transition: all .7s cubic-bezier(0.23, 1, 0.32, 1); filter: grayscale(1); will-change: transform;}
[class*='swiperProductBrand'] img:hover {transform: scale(1.2);}

@media (min-width : 768px) {
    .theme-lines:before {width: calc(100% + 200px);}
    .theme-lines:after {height: 200px; right: 0; transform: translateY(-30px);}
}

@media (min-width : 992px) {
    .section-padding {padding-top: 96px; padding-bottom: 96px;}
}

.project-item a:before {background: linear-gradient(0deg, #1a222e7a, transparent); height: 50%; top: auto; bottom: 0; z-index: 1; border-radius: 12px;}
.project-item a .img-wrap {min-height: 430px; display: flex; max-height: 470px;}
.project-item a .img-wrap img {object-fit: cover; min-height: 100%; width: 100%;}
.project-item .project-item-content {width: calc(100% - 48px);}
.project-item .project-item-content h3 {font-size: 36px; transition: .5s;}
.project-item .project-item-content p {color: #fff; opacity: 0; transition: .3s;}
.project-item a > small {right: 20px; top: 20px; color: var(--heading-color); background: #ffffff6e; padding: 5px 16px; border-radius: 30px; font-size: 13px; backdrop-filter: blur(3px);}
.project-item a:hover .project-item-content h3 {transform: translateY(-60px);}
.project-item a:hover .project-item-content p {opacity: 1; transition: .7s;}

.breadcrumb li, .breadcrumb a {color: #fff;}
.breadcrumb a {border-bottom: 1px solid transparent; transition: var(--theme-transition);}
.breadcrumb li {position: relative; display: inline-flex; align-items: center;}
.breadcrumb li:first-child:after {content: ""; display: inline-block; width:10px; height:10px; margin:0 8px; background-repeat:no-repeat; background-position:center; background-size:contain; opacity:0.7; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13.3 11.6' fill='%23fff'%3E%3Cpath d='M0 5.8c0-.4.4-.8.8-.8h9.6L6.9 1.4c-.3-.3-.3-.9 0-1.2s.9-.3 1.2 0l5 5c.3.3.3.8 0 1.2l-5 5c-.3.3-.9.3-1.2 0s-.3-.9 0-1.2l3.6-3.6H.8c-.4 0-.8-.3-.8-.8'/%3E%3C/svg%3E");}
.breadcrumb__item {display:inline-flex;align-items:center;font-size:14px;}
.breadcrumb__item:last-child::after {display:none;}
.breadcrumb a:hover {border-bottom-color: #fff;}


.swiper-wrapper {transition-timing-function: cubic-bezier(0.15, 0.85, 0.32, 1.2);}
.category-section .swiper-wrapper, .category-section .swiper-wrapper .swiper-slide {height: auto;}
.category-section .category-item {padding: 38px 40px; background: #263d590f; backdrop-filter: blur(3px); height: 100%;}
.category-section .category-item h3 {font-size: 26px;}
.category-section .category-item svg {width: 50px; min-width: 50px; height: 50px; fill: var(--theme-color);}
.category-section .category-item .item-desc svg {width: 14px; height: 14px; min-width: 14px; transform: rotate(-45deg);}
.category-section .category-item:hover .item-desc svg {transform: rotate(0deg);}
.category-section .item-desc {border-top: 1px solid #dedede; line-height: 1.5; color: var(--body-color);}

.swiper-buttons .swiper-button {position: relative; top: auto; left: auto; right: auto; width: 40px; height: 40px; margin: 0; border-radius: 50%;}
.swiper-buttons .swiper-button svg {width: 16px; height: 16px;}
.swiper-button-prev svg {transform: scale(-1);}

.team-section ul > li {line-height: 1.8; color: var(--heading-color);}
.team-section ul > li > svg {height: 20px; width: 22px; margin-right: 16px; fill: var(--theme-color);}
.team-section .team-logo {bottom: 50%; right: 50%; transform: translate(50%, 50%);}
.team-section .team-logo.visible {opacity: .1;}

.counter-item .counter-number {font-size: 50px; font-family: var(--heading-font); margin-bottom: 15px; padding-bottom: 10px; border-bottom: 1px solid #1C1C1D2E; display: block; color: var(--theme-color); width: 100%;}
.counter-item .counter-number-sufix:after {content: '+';}
.counter-item .counter-title {font-size: 22px; font-family: var(--heading-font); color: var(--heading-color);}


.form-control {width: 100%; padding: 14px 20px; height: 60px; font-size: 16px; font-size: 1rem; background-color: #ffffff; border: 1px solid rgba(159, 159, 164, 0.18); color: var(--theme-color);
    backdrop-filter: blur(29px); -webkit-background-clip: unset; -webkit-text-fill-color: var(--theme-color); border-radius: 24px; transition: var(--theme-transition);}
.form-control:focus, .form-control:hover {border-color: var(--theme-color);}
textarea.form-control {height: auto;}

.single-navigation .nav-item {color: var(--heading-color); width: 50%; height: auto; padding: 50px 7%; background: #d0d0d042; transition: var(--theme-transition);}
.single-navigation .nav-item:before {background: #ececec; height: 30px; top: 100%; z-index: -1;}
.single-navigation .nav-thumb img {width:100px; height:100px; min-width: 100px; object-fit:cover;}
.single-navigation .label {font-size: 18px; display:block; font-weight: 300;}
.single-navigation strong {font-size: 24px; display: block;}
.single-navigation svg {width: 40px; height: 40px; opacity: .1; fill: var(--theme-color);}
.single-navigation .nav-item.prev > svg {transform: scaleX(-1); margin-right: auto;}
.single-navigation .nav-item.next {border-left: 1px solid #e3e3e8;}
.single-navigation .nav-item.next > svg {margin-left: auto;}
.single-navigation .nav-item:hover {background: #dfe0e3;}
.single-navigation .nav-item:hover svg {opacity: 1;}
.single-navigation .nav-thumb svg {opacity: 1; width: 80px; height: 80px;}



@media screen and (min-width: 768px){
    .category-section .category-item h3 {font-size: 28px;}
    .category-section .category-item svg {width: 60px; min-width: 60px; height: 60px;}
    
    .counter-item .counter-number {font-size: 64px;}
    .counter-item .counter-title {font-size: 24px;}
}
@media screen and (min-width: 992px){
    .category-section .category-item h3 {font-size: 30px;  height: 90px;}
    .category-section .category-item svg {width: 70px; min-width: 70px; height: 70px;}
}

.blog-item .img-wrap {height: 320px;}
.blog-item .img-wrap img {width: 100%; min-height: 100%; object-fit: cover;}
.blog-item .img-wrap:before {background: linear-gradient(0deg, #1a222e7a, transparent); height: 50%; top: auto; bottom: 0; z-index: 1; border-radius: 12px;}
.blog-date span {color: var(--heading-color); background: #ffffff6e; padding: 5px 16px; border-radius: 30px; font-size: 13px; backdrop-filter: blur(3px);}
.blog-item .blog-content h3 {font-size: 26px;}

@media screen and (min-width: 768px){
    .blog-item .blog-content h3 {font-size: 30px;}
}



footer {min-height: 60dvh; border-radius: 30px 30px 0 0;}
footer .logo {min-width: 100px; width: 100px; height: auto;}
footer .middle p.title {font-family: var(--heading-font); font-weight: 400;}

footer ul li a {font-size: 16px; line-height: 2.5;}
footer ul li a:before {display: none;}
footer a {transition: var(--theme-transition); display: inline-flex;}
footer ul li a:hover {color: #4f6681;}

footer h6 {font-size: 18px; line-height: 2.5; color: #fff; font-family: var(--body-font); text-transform: uppercase;}
footer .footer-contact a {font-size: 16px; line-height: 1.3;}
footer .footer-contact a:hover {color: #fff;}
footer .footer-social-icons a {border: 1px solid var(--theme-color); padding: 14px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: #ffffffd9;}
footer .footer-social-icons svg {width: 20px; height: 20px; fill: var(--theme-color);}
footer .footer-social-icons a:hover {background-color: var(--theme-color);}
footer .footer-social-icons a:hover svg {fill: #fff;}

footer .bottom > .overlay:before {width: calc(100% - 24px); height: 1px; background: #fff3; top: -20px; left: 12px;}
footer .bottom p {font-size: 14px; color: #fff8; transition: var(--theme-transition);}
footer .bottom a {gap: 4px; align-items: end; color: #fff8;}
footer .bottom a:hover {color: #fff;}

@media screen and (min-width: 768px){
    .single-navigation .nav-item.next > svg {margin-left: 0; margin-right: auto;}
    .single-navigation .nav-item.prev > svg {margin-left: auto; margin-right: 0;}
    
    footer ul li a {font-size: 18px;}
}

.scrollToTop {display: none;}

@media screen and (min-width : 992px) {
    
    .scrollToTop {display: flex; align-items: center; justify-content: center; opacity: 0; pointer-events: none; transition: opacity .35s ease;}
    .scrollToTop svg {transform: rotate(-90deg);}
    .scrollToTop.visible {opacity: 1; pointer-events: auto;}
}


.search-box {backdrop-filter: blur(29px); background-color: rgb(255 255 255 / 53%);}
.search-box .hide-search-box i {color: var(--theme-color);}
.search-box .input {border: 2px solid var(--theme-color); border: none;}
.search-box .input:before, .search-box .input:after {content: ""; position: absolute;  background-color: var(--theme-color); transition: var(--theme-transition);}
.search-box .input:before {bottom: -15px; top: auto; left: 0; width: 2px; height: 100%;}
.search-box .input:after {bottom: 0; left: -15px; width: 100%; height: 2px;}
.search-box .input:hover:before {height: calc(100% + 50px);}
.search-box .input:hover:after {width: calc(100% + 50px);}

.search-box .input .button {right: 7px; top: 22px; width: 40px; border: 1px solid; display: flex; align-items: center; justify-content: center; background: var(--theme-color); border-radius: 50%; height: 40px; 
    transition: var(--theme-transition);}
.search-box .input .button input {position: absolute; width: 40px; height: 40px; border-radius: 50%;}
.search-box .input .button svg {position: absolute; fill: #fff; width: 20px; height: 20px; position: relative; min-width: 20px; pointer-events: none;}
.search-box .input .button:hover {background: transparent;}
.search-box .input .button:hover svg {fill: var(--theme-color);}
.search-box .input input::placeholder {color: var(--heading-color); font-size: 20px;}
@media screen and (min-width : 767px) {
    .search-box .input input {font-size: 23px;}
}
@media screen and (min-width : 992px) {
    .search-box .input input {font-size: 30px;}
}


@keyframes pulsing {0% {transform: scale(1); opacity: 1;} 100% {transform: scale(1.3); opacity: 0;}}
@keyframes fadeIn {from {opacity:0; transform: translateY(-4px);} to {opacity:1; transform: translateY(0);}}


.reveal {opacity: 0; transition: .6s ease;}
.reveal.visible {opacity: 1;}
.fade-up {transform: translateY(50px); opacity:0}
.fade-up.visible {transform: translateY(0); opacity:1}
.fade-in {opacity:0}
.fade-in.visible {opacity:1}
.fade-left {transform: translateX(-100px); opacity:0;}
.fade-left.visible {transform: translateX(0); opacity:1;}
.fade-right {transform: translateX(100px); opacity:0;}
.fade-right.visible {transform: translateX(0); opacity:1;}
.clip-reveal {opacity: 0; clip-path: inset(0 0 100% 0); transition: clip-path 1s cubic-bezier(0.23, 1, 0.32, 1), opacity 0.4s ease;}
.clip-reveal.visible {opacity: 1; clip-path: inset(0 0 0 0);}
.mask-reveal {opacity: 0; will-change: mask-position, opacity; transition: mask-position 2s cubic-bezier(0.23, 1, 0.32, 1), opacity .6s ease;}
.mask-reveal.visible {opacity: 1;}
.mask-soft {mask-image: linear-gradient(to bottom, black 60%, transparent 100%); mask-size: 100% 200%; mask-position: 0 100%;}
.mask-soft.visible {mask-position: 0 0;}
.mask-vertical {mask-image: linear-gradient(to bottom, transparent 0%, black 100%); mask-size: 100% 200%; mask-position: 0 0;}
.mask-vertical.visible {mask-position: 0 100%;}
.mask-horizontal {mask-image: linear-gradient(to right, transparent 0%, black 100%); mask-size: 200% 100%; mask-position: 0 0;}
.mask-horizontal.visible {mask-position: -100% 0;}
.mask-feather {mask-image: radial-gradient(circle, black 60%, transparent 100% ); mask-size: 200% 200%; mask-position: 50% 120%;}
.mask-feather.visible {mask-position: 50% 50%;}


.sticky {position: sticky; top: 100px;}
.text-decoration-underline:hover {text-decoration: none!important;}

.custom-cursor {position:fixed; top:0; left:0; width:90px; height:90px; padding: 4px; border-radius:50%; background:rgba(255,255,255,0.6); backdrop-filter:blur(3px); color:var(--theme-color); font-size: 15px;
    font-family: var(--heading-font); display:flex;  align-items:center; justify-content:center; pointer-events:none; transform:translate(-50%, -50%) scale(0); transition: transform 0.4s ease-out, opacity .3s ease-out;
    z-index: 99;}

button.fancybox-button svg {color: #fff;}

#copyNotice { position:fixed; left:50%; bottom:40px; transform:translateX(-50%) translateY(20px); background:#111; color:#fff; padding:14px 20px; border-radius:10px; font-size:14px; text-align:center; max-width:420px; line-height:1.4; opacity:0; pointer-events:none; transition:all .35s ease; z-index:99999; box-shadow: rgba(17, 12, 46, 0.25) 0px 18px 100px 0px; border: 1px solid #333;}
#copyNotice.active { opacity:1; transform:translateX(-50%) translateY(0); }