@import url('./animations.css');
    :root {--primary-color: #07055e;--secondary-color: #dc143c;--passive-color: #f6f7ff;--light-color: #dd4b68;--dark-color: #040922;--footer-primary: #758799;--footer-secondary: #15304c;--footer-bg: #071140;--gap: 30px;--container: 1300px;scroll-behavior: auto;}
    ::selection {background-color: var(--primary-color);color: #fff;}
    body {font-family: 'Source Sans Pro', sans-serif;line-height: 1.4;color: var(--bs-gray-600);background: var(--passive-color);overflow: hidden auto;}
    img {max-width: 100%;color: transparent;}
    h1 {font-size: 38px;}
    h2 {font-size: 34px;}
    h3 {font-size: 32px;}
    h4 {font-size: 28px;}
    h5 {font-size: 24px;}
    h6 {font-size: 20px;}
    h1,
    h2,
    h3,
    h4,
    h5,
    h6 {margin-bottom: 20px;}
    
    a {text-decoration: none;color: var(--dark-color);transition: 0.3s ease all;}
    a:hover {color: var(--secondary-color);transition: 0.3s ease all;}
    
    .btn {display: inline-block;padding: 10px 20px;border-radius: 25px;cursor: pointer;transition: 0.3s ease all;}
    .btn-primary {background: var(--primary-color);color: #fff;}
    .btn-primary:hover {background: var(--secondary-color);}
    
    .form-control:focus {box-shadow: unset;border-color: var(--primary-color);}
    .form-check-input:checked {background-color: var(--primary-color);border-color: var(--primary-color);}
    .fancybox__thumbs .carousel__slide .fancybox__thumb::after {border-color: var(--primary-color);}
    
    #back-to-top {display: flex;opacity: 0;visibility: hidden;bottom: 0;width: 50px;height: 50px;background: #fff;color: var(--secondary-color);font-size: 30px;line-height: 1;border-radius: 15px;position: fixed;right: 20px;z-index: 2;list-style: none;padding: 0;margin: 0;justify-content: center;align-items: center;box-shadow: 0 0 30px -10px var(--dark-color);}
    #back-to-top.show {bottom: 20px;opacity: 1;visibility: visible;transition: 0.3s ease all;}
    #back-to-top:hover {color: var(--secondary-color);}
    
    .cookies {position: fixed;z-index: 9999;max-width: 370px;width: 100% !important;bottom: 10px;left: 10px;border: unset;box-shadow: 0 0 50px -20px rgba(0, 0, 0, 0.5);}
    .cookies .card-body {padding: 10px;font-size: 0.9rem;}
    .cookies .card-body .agree {display: block;margin-top: 10px;}
    
    .container-fluid {max-width: 1920px;padding: 0 30px;}
    .container {max-width: 1300px;padding: 0 15px;}
    
    header {position: fixed;width: 100%;z-index: 4;padding: 20px 0;box-shadow: 0 2px 3px -3px white;transition: 0.5s ease all;}
    header .container {display: flex;justify-content: space-between;align-items: center;gap: 30px;}
    header .logo img,
    header .logo svg {width: auto;height: 40px;fill: #fff;transition: 0.5s ease all;}
    header.sticky {padding: 10px 0;background: #fff;box-shadow: 0 0 30px -20px var(--dark-color);}
    header.sticky .logo svg {fill: var(--dark-color);height: 30px;}
    header ul {list-style: none;margin: 0;padding: 0;}
   
    #menu {flex: 1;}
    #menu .menu {display: flex;flex-wrap: wrap;gap: 5px;justify-content: end;}
    #menu .menu>li>a {display: block;border-radius: 5px;background: transparent;color: #fff;line-height: 1;padding: 10px 15px;transition: 0.3s ease all;}
    #menu .menu>li:hover>a {background: #fff;color: var(--primary-color);}
    #menu .menu .sub {background: var(--passive-color);position: absolute;opacity: 0;visibility: hidden;min-width: 200px;width: fit-content;max-width: 300px;padding: 10px;top: calc(100% + 20px);border-radius: 10px;box-shadow: 0 0 25px -20px var(--dark-color);}
    #menu .menu .sub::before {content: "";position: absolute;inset: 0;z-index: -1;top: -20px;}
    #menu .menu .acilir {position: relative;z-index: 1;}
    #menu .menu .sub>ul>li>a {display: block;padding: 12px 18px;white-space: nowrap;color: var(--dark-color);background: transparent;border-radius: 10px;}
    #menu .menu .sub>ul>li:hover>a {background: rgb(0, 0, 0, 0.1);}
    #menu .menu>li:not(:nth-last-child(n+4)) .sub {right: 0;}
    #menu .menu .acilir:hover .sub {opacity: 1;visibility: visible;transition: 0.3s ease all;}
    header.sticky #menu .menu>li>a {color: var(--dark-color);}
    header.sticky #menu .menu>li:hover>a {background: var(--dark-color);color: #fff;}
    header #menu .menu>li.link>a {background: var(--secondary-color);color: #fff;}
    header #menu .menu>li.link:hover>a {background: var(--light-color);}

    header .language {display: flex;gap: 5px;border-left: 1px solid;padding-left: 30px;}
  
    .home-slider {height: 100vh;}
    .home-slider:not(.slick-slider) .item:nth-child(n+2) {display: none;}
    .home-slider div {height: 100%;}
    .home-slider .item {position: relative;z-index: 1;border: unset;}
    .home-slider .item img {width: 100%;height: 100%;object-fit: cover;}
    .home-slider .item video {width: 100%;height: 100%;object-fit: cover;}
    .home-slider .item .container {position: absolute;height: auto;left: 50%;top: 50%;transform: translate(-50%, -40%);z-index: 1;color: #fff;}
    .home-slider .item .text {max-width: 650px;padding: 15px 0;margin: 0 auto;text-align: center;}
    .home-slider .item::before {content: "";position: absolute;inset: 0;background: var(--dark-color);opacity: 0.8;}
    .home-slider .item div:is(.title, .desc) {overflow: hidden;width: 100%;margin-bottom: 25px;}
    .home-slider .item .title span {display: block;font-size: 46px;font-weight: 600;transform: translate(0, 100%);}
    .home-slider .item .title span b {display: inline-block;font-weight: 300;position: relative;}
    .home-slider .item .title span b::before {content: "";position: absolute;inset: 90% 100% 0 0;border-radius: 8px;background: var(--secondary-color);z-index: -1;opacity: 0.9;}
    .home-slider .item .desc span {display: block;font-size: 26px;font-weight: 300;transform: translate(0, 100%);}
    .home-slider .item .go {opacity: 0;transform: translateY(100px);}
    .home-slider .item .btn {position: relative;font-size: 18px;padding: 10px 40px;background: transparent;color: #fff;padding-right: 40px;border: 1px solid rgba(255, 255, 255, 0.5);}
    .home-slider .item .btn i {position: absolute;right: 10px;top: 50%;line-height: 1;transform: translate(0, -50%);transition: 0.5s ease all;}
    .home-slider .item .btn:hover {background: var(--light-color);border-color: var(--light-color);color: #fff;}
    .home-slider .item .btn:hover i {right: -5px;}
    .home-slider .slick-active .title span {transform: translate(0, 0);transition-delay: 0.7s;transition-duration: 0.6s;}
    .home-slider .slick-active .desc span {transform: translate(0, 0);transition-delay: 0.7s;transition-duration: 0.8s;}
    .home-slider .slick-active .title span b::before {inset: 90% 0 0 0%;transition-delay: 1.2s;transition-duration: 0.4s;}
    .home-slider .slick-active .go {opacity: 1;transition-delay: 1s;transition-duration: 0.8s;transform: translateY(0px);}
    .home-slider .slick-dots {position: absolute;bottom: 20px;width: var(--container);margin: auto;padding: 0 15px;left: 0;right: 0;display: flex;list-style: none;gap: 10px;}
    .home-slider .slick-dots button {display: block;padding: 0;font-size: 0;width: 14px;height: 14px;background: transparent;border-radius: 5px;border: 1px solid #fff;transition-delay: 0.3s;transition-duration: 0.3s;}
    .home-slider .slick-dots .slick-active button {border-color: var(--primary-color);width: 28px;}
    .slider {position: relative;overflow: hidden;}
    .slider .arrow {position: absolute;z-index: 1;display: flex;gap: 10px;bottom: 30px;}
    .slider .slick-arrow {display: block;padding: 0;border-radius: 10px;border: 1px solid rgba(255, 255, 255, 0.4);color: #fff;width: 44px;height: 44px;background: transparent;transition: 0.3s ease all;}
    .slider .slick-arrow::before {display: block;font-family: bootstrap-icons !important;line-height: 1;font-size: 24px;}
    .slick-prev::before {content: "\f284";}
    .slick-next::before {content: "\f285";}
    .slider .slick-arrow:hover {background: rgba(255, 255, 255, 0.1);}
   
    section {margin: 50px 0;}
    section .head {margin-bottom: 30px;}
    section .head .big-title {display: inline-block;position: relative;z-index: 1;line-height: 1;margin-bottom: 15px;color: var(--dark-color);font-size: 46px;font-weight: 600;}
    section .head .big-title::before {content: "";position: absolute;display: block;bottom: 0;left: 0;width: 0%;height: 10px;background: var(--primary-color);z-index: -1;opacity: 0.2;border-radius: 5px;transition-delay: 0.5s;transition-duration: 0.5s;}
    section .head.text-center .big-title::before {right: 0;margin: auto;}
    section .head .big-title.aos-animate::before {width: 50%;}
    
    .home-about {background: linear-gradient(90deg, rgb(255, 255, 255) 0%, rgb(255, 255, 255) 50%, rgba(255, 123, 123, 0) 50%, rgba(255, 0, 0, 0) 100%);margin: 0;padding: 50px 0;background-size: 0;transition: 0.5s ease all;background-repeat: no-repeat;}
    .home-about.aos-animate {background-size: 100%;}
    .home-about .container {display: grid;grid-template-columns: repeat(2, 1fr);gap: 30px;}
    .home-about .left {padding-right: 30px;}
    .home-about .right {position: sticky;padding-left: 30px;top: 15px;height: fit-content;}
    .home-about .right .description {font-size: 18px;}
    .home-about .right .btn {font-size: 18px;padding: 10px 30px;}
    
    .home-blogs {padding-bottom: 50px;}
    .home-blogs .container {position: relative;}
    
    .blogs {display: grid;grid-template-columns: repeat(3, 1fr);gap: var(--gap);width: 100%;}
    .home-blogs .blogs {grid-template-columns: repeat(4, 1fr);gap: var(--gap);}
    .home-blogs .blogs.slick-slider {display: block;}
    .home-blogs .blogs .slick-track {display: flex;gap: 20px;padding: 0 0 20px 0;}
    .home-blogs .blogs .slick-track::before,
    .home-blogs .blogs .slick-track::after {display: table;content: '';position: absolute;}
    .home-blogs .blogs.slick-slider .new {height: auto;}
    .home-blogs .blogs.slick-slider .new a {height: 100%;}
    .home-blogs .slick-arrow::before {display: inline-block;font-family: bootstrap-icons !important;font-size: 20px;}
    .home-blogs .slick-next::before {content: "\f285";}
    .home-blogs .slick-prev::before {content: "\f284";}
    .home-blogs .slick-arrow.slick-disabled {opacity: 0.3;}
    .home-blogs .btn-all {position: absolute;bottom: -60px;right: 15px;}
    .home-blogs .slick-arrow {position: absolute;z-index: 1;overflow: hidden;font-size: 0;box-shadow: 0 0 30px -15px var(--dark-color);background: #fff;color: var(--primary-color);border-radius: 10px;bottom: -60px;width: 50px;height: 50px;border: unset;transition: 0.3s ease all;-webkit-transition: 0.3s ease all;-moz-transition: 0.3s ease all;}
    .home-blogs .slick-arrow:hover {background: var(--primary-color);color: #fff;}
    .home-blogs .slick-prev {right: calc(50% + 5px);}
    .home-blogs .slick-next {left: calc(50% + 5px);}
    .blogs .blog a {display: block;background: #fff;height: 100%;border-radius: 10px;box-shadow: 0 0 20px -18px var(--dark-color);transition: 0.3s ease all;}
    .blogs .blog .image {position: relative;z-index: 1;overflow: hidden;border-radius: 10px;}
    .blogs .blog .image img {width: 100%;height: 100%;aspect-ratio: 4/3;object-fit: cover;}
    .blogs .blog .image::before {content: "";z-index: 0;position: absolute;background: var(--dark-color);opacity: 0;transition: 0.3s ease all;inset: 0;}
    .blogs .blog .image::after {content: "\f138";position: absolute;color: #fff;font-size: 24px;z-index: 1;right: 50%;opacity: 0;bottom: 20px;display: inline-block;font-family: bootstrap-icons !important;font-style: normal;font-weight: normal !important;font-variant: normal;text-transform: none;line-height: 1;vertical-align: -.125em;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;transition: 0.1s ease;}
    .blogs .blog .text {display: block;padding: 20px 15px;}
    .blogs .blog .date {display: block;margin-bottom: 5px;}
    .blogs .blog .title {font-size: 18px;font-weight: 600;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 3;-webkit-box-orient: vertical;}
    .blogs .blog:hover a {color: var(--primary-color);box-shadow: 0 10px 20px -18px var(--dark-color);}
    .blogs .blog:hover .image::before {opacity: 0.5;}
    .blogs .blog:hover .image::after {opacity: 1;right: 20px;transition-delay: 0.2s;transition-duration: 0.3s;}
    .home-gallery {padding: 50px 0;background: var(--primary-color);color: #fff;}
    .home-gallery .head .big-title {color: var(--passive-color);}
    .home-gallery .head .big-title::before {background: var(--passive-color);}
    .images {display: grid;grid-template-columns: repeat(4, 1fr);gap: 20px;}
    [data-fancybox="gallery"] {display: block;position: relative;overflow: hidden;border-radius: 10px;}
    [data-fancybox="gallery"]::before {content: "";position: absolute;z-index: 1;inset: 0;background: var(--dark-color);opacity: 0;transition: 0.3s ease all;}
    [data-fancybox="gallery"]::after {content: "\f3df";display: block;font-size: 24px;color: #fff;opacity: 0;visibility: hidden;position: absolute;left: 50%;top: 50%;transform: translate(-50%, -50%);z-index: 1;font-family: bootstrap-icons !important;transition-delay: 0.1s;transition-duration: 0.3s;}
    [data-fancybox="gallery"]:hover::before {opacity: 0.4;}
    [data-fancybox="gallery"]:hover::after {opacity: 1;visibility: visible;}
    
    .products {display: grid;grid-template-columns: repeat(3, 1fr);gap: 20px;}
    .products .product {position: relative;z-index: 1;display: block;background: #fff;border-radius: 10px;}
    .products .product .image {position: relative;height: 100%;z-index: 1;overflow: hidden;border-radius: 10px;}
    .products .product .image::before {content: "";z-index: 0;position: absolute;background: var(--dark-color);opacity: 0;transition: 0.3s ease all;inset: 0;}
    .products .product .image::after {content: "\f138";position: absolute;color: #fff;font-size: 24px;z-index: 1;right: 50%;opacity: 0;bottom: 20px;display: inline-block;font-family: bootstrap-icons !important;font-style: normal;font-weight: normal !important;font-variant: normal;text-transform: none;line-height: 1;vertical-align: -.125em;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;transition: 0.1s ease;}
    .products .product .image img {width: 100%;height: 100%;aspect-ratio: 4 / 3;object-fit: cover;}
    .products .product .text {position: absolute;z-index: 1;left: 10px;bottom: 10px;text-align: center;font-weight: 600;background: #fff;padding: 10px 15px;border-radius: 10px;max-width: calc(100% - 20px);}
    .products .product:hover .image::before {opacity: 0.5;}
    .products .product:hover .image::after {opacity: 1;right: 20px;transition-delay: 0.2s;transition-duration: 0.3s;}
    
    .home-services .services .service {transition: .6s ease all;}
    .services {display: flex;gap: 15px;height: 100%;width: 100%;aspect-ratio: 8 / 3;}
    .services .service {flex: 3;background-position: left !important;border-radius: 10px;transition: 0.5s ease-in-out all;background-size: cover !important;}
    .services .service a {display: block;height: 100%;position: relative;z-index: 1;overflow: hidden;border-radius: 10px;}
    .services .service a::before {content: "";position: absolute;inset: 0;background: var(--dark-color);opacity: 0.2;}
    .services .service .text {position: absolute;bottom: 15px;left: 15px;padding: 15px;color: #fff;font-size: 20px;border-radius: 10px;line-height: 1;overflow: hidden;z-index: 1;}
    .services .service .text :is(b, span) {display: block;white-space: nowrap;opacity: 0;transform: translate(0, 30px);}
    .services .service .text::before {content: "";position: absolute;inset: 0 100% 0 0;background: var(--secondary-color);z-index: -1;transition: 0.3s ease all;}
    .services .service.active {flex: 8;}
    .services .service.active .text :is(b, span) {opacity: 1;transform: translate(0, 0);transition-delay: .5s;transition-duration: 0.5s;}
    .services .service.active .text::before {inset: 0;transition-delay: .2s;transition-duration: 0.3s;}
    
    .home-team {background-color: #fff;background-image: url('../img/slider-bg.png');background-size: cover;background-repeat: no-repeat;padding: 50px 0;border-top: 2px solid var(--secondary-color);border-bottom: 2px solid var(--secondary-color);}
    .teams {display: grid;grid-template-columns: repeat(4, 1fr);gap: 30px;}
    .teams .user {position: relative;z-index: 1;display: flex;flex-wrap: wrap;flex-direction: column;justify-content: center;gap: 10px;cursor: pointer;text-align: center;overflow: hidden;border-radius: 15px;transition: 0.3s ease all;background: url('../img//user-bg.jpg') no-repeat;background-size: cover;aspect-ratio: 2 / 3;box-shadow: 0 0 30px -30px var(--dark-color);}
    .teams .user::before {content: "";position: absolute;inset: 0;background: var(--primary-color);opacity: 0.85;transition: 0.3s ease all;}
    .teams .user .user-head {transform: translate(0, 0%);transition: 0.5s ease all;}
    .teams .user .user-head .avatar {width: 150px;height: 150px;margin: auto;border-radius: 50%;overflow: hidden;aspect-ratio: 1 / 1;animation: circleAn 4s infinite;transition: 0.3s ease all;}
    .teams .user .user-head .avatar img {width: 100%;height: 100%;object-fit: cover;filter: grayscale(1);transition: 0.3s ease all;}
    .teams .user .user-body {opacity: 0;visibility: hidden;color: #fff;position: relative;z-index: 1;display: flex;flex-direction: column;transform: translate(0, 0px);transition-delay: 0.5s;transition-duration: 0.5s;}
    .teams .user .user-body .name {font-size: 20px;margin-bottom: 5px;}
    .teams .user .user-body .job {font-size: 14px;margin-bottom: 5px;}
    .teams .user:hover::before {background: var(--dark-color);}
    .teams .user:hover .user-head {transform: translate(0, -20px);}
    .teams .user:hover .user-head .avatar {animation: none;}
    .teams .user:hover .user-head .avatar img {filter: grayscale(0);}
    .teams .user:hover .user-body {opacity: 1;visibility: visible;transform: translate(0, 20px);transition-delay: 0.5s;transition-duration: 0.5s;}
    
    .pages {display: grid;gap: 50px;max-width: 1200px;margin: 0 auto;}
    .pages.files {grid-template-columns: repeat(2, 1fr);}
    .pages .page .box {display: grid;grid-template-columns: repeat(2, 1fr);gap: 50px;background: var(--bs-gray-100);color: var(--bs-gray-600);border-radius: 10px;transition: 0.3s ease all;}
    .pages .page .box .image {padding: 15px;}
    .pages .page .box .image img {display: block;border-radius: 10px;width: 100%;height: 100%;aspect-ratio: 4 / 3;object-fit: cover;}
    .pages .page .box .text {padding: 50px;}
    .pages .page .box .text .title {display: block;position: relative;color: var(--dark-color);margin-bottom: 15px;padding-bottom: 15px;font-size: 30px;}
    .pages .page .box .text .desc {font-size: 18px;}
    .pages .page .box .text .title::before {content: "";position: absolute;left: 0;display: block;width: 50px;height: 0;border-bottom: 1px solid var(--primary-color);bottom: 0px;}
    .pages .page:nth-child(2n + 1) .box .image {order: 2;}
    
    .home-about {padding: 50px 0;background: linear-gradient(90deg, var(--primary-color) 0%, var(--primary-color) calc(50% - 100px), transparent calc(50% - 100px), transparent 100%);}
    .home-about .container {gap: var(--gap);}
    .home-about .left {flex: 1;}
    .home-about .left img {width: 100%;border-radius: 10px;box-shadow: 0 0 15px -13px;}
    .home-about .right {flex: 1;padding: 0 30px;}
    .home-about .right .text {text-align: justify;font-size: 18px;font-weight: 300;color: var(--dark-color);}
    .home-about .right .text .btn {display: block;width: max-content;max-width: 100%;margin: 10px 0 0 auto;}
    .home-about .left .video:hover span {width: 100px;height: 100px;font-size: 50px;transition: 0.3s ease all;}
    .home-about .left .video:hover span::before,
    .home-about .left .video:hover span::after {animation: 0s;}
    
    .page-top {position: relative;overflow: hidden;padding: 135px 0 90px 0;color: #fff;text-align: center;background: url('../img/page-bg.jpg') no-repeat;background-size: 100%;background-attachment: fixed;z-index: 1;}
    .page-top::before {content: "";position: absolute;inset: 0;background: var(--dark-color);opacity: 0.8;z-index: -1;}
    .page-top .big-title {display: block;font-weight: 600;font-size: 48px;color: var(--primary-color);margin-bottom: 20px;}
    .page-top .desc {display: block;font-size: 20px;margin-bottom: 0px;}
    .page-top .breadcrumb {justify-content: center;margin: 0;}
    .page-top .breadcrumb .breadcrumb-item,
    
    .breadcrumb .breadcrumb-item a,
    .breadcrumb-item+.breadcrumb-item::before {color: #fff;}
    
    .page-detail .content {position: relative;z-index: 1;max-width: 1200px;margin: -60px auto 30px auto;background: #fff;padding: 30px;border-radius: 10px;box-shadow: 0 5px 30px -30px var(--dark-color);}
    .page-detail .gallery {display: grid;grid-template-columns: repeat(5, 1fr);gap: 10px;}
    .page-detail .gallery .image:nth-child(1) {grid-column: 2 span;grid-row: 2 span;}
    .page-detail .box {display: flex;flex-wrap: wrap;gap: var(--gap);}
    .page-detail .box .left {flex: 1;min-width: 200px;}
    .page-detail .box .left .image {position: relative;overflow: hidden;border-radius: 5px;margin-bottom: 15px;}
    .page-detail .box .left .pageMenu {display: block;position: sticky;top: 10px;padding: 0;margin: 0;}
    .page-detail .box .left .pageMenu li {display: block;list-style: none;font-weight: 500;margin-bottom: 3px;border-radius: 5px;overflow: hidden;}
    .page-detail .box .left .pageMenu li.active {background: var(--primary-color);padding: 10px;color: #fff;}
    .page-detail .box .left .pageMenu li a {display: block;color: var(--primary-color);background: #f8f8ff;padding: 10px;}
    .page-detail .box .left .pageMenu li:hover a {background: var(--primary-color);color: #fff;}
    .page-detail .box .right {flex: 4;}
    .map-iframe iframe {width: 100%;height: 100%;aspect-ratio: 3 / 1;border-radius: 15px;}
    .home-contact {padding: 50px 0;background: linear-gradient(270deg, var(--passive-color) 0%, var(--passive-color) calc(40% - 100px), transparent calc(40% - 100px), transparent 100%);margin: 50px 0 0 0;}
    .home-contact .container {display: flex;flex-wrap: wrap;gap: 50px;}
    .home-contact .container .left {flex: 4;}
    .home-contact .container .left b.b {display: block;font-size: 24px;margin-bottom: 15px;}
    .home-contact .container .left {font-size: 18px;font-weight: 300;text-align: justify;}
    .home-contact .container .right {flex: 3;}
    #bize-yazin {background-color: var(--primary-color);color: #fff;padding: 30px;border-radius: 10px;}
    #bize-yazin .form-check-label,
    #bize-yazin a {color: #fff;}
    #bize-yazin form {display: grid;grid-template-columns: repeat(2, 1fr);color: var(--dark-color);gap: 20px;color: var(--dark-color);}
    #bize-yazin form .full,
    #bize-yazin form .form-check {grid-column: 2 span;}
    #bize-yazin form .btn {display: block;color: #fff;border-color: #fff;width: 100%;max-width: 150px;margin: auto;}
    .contact-page .title {display: block;margin-bottom: 5px;color: var(--dark-color);font-weight: 600;font-size: 30px;}
    .contact-page .desc {}
    .contact-page ul {margin: 0;padding: 0;list-style: none;}
    .contact-page .sos {display: flex;flex-wrap: wrap;gap: 30px;}
    .contact-page .sos a {display: block;color: var(--primary-color);font-size: 24px;}
    .contact-page .sos li:hover a {color: var(--secondary-color);}
    .contact-page .con {display: grid;gap: 5px;}
    .contact-page .con span {display: flex;gap: 5px;color: var(--dark-color);}
    .contact-page .con span i {width: 30px;color: var(--primary-color);flex-shrink: 0;}
    footer {position: relative;z-index: 1;padding: 70px 0 30px;background: var(--footer-bg);color: var(--footer-primary);}
    footer::before {content: "";position: absolute;background-image: url("../img//footer-bg.png");background-repeat: no-repeat;background-size: cover;inset: 0;z-index: -1;opacity: .8;}
    footer .boxes {flex: 1;display: grid;grid-template-columns: repeat(4, 1fr);width: 100%;grid-gap: 50px;gap: 50px;}
    footer .boxes .box ul {display: grid;gap: 8px;padding: 0;margin: 0;list-style: none;}
    footer .boxes .box ul li {display: flex;gap: 5px;align-items: center;}
    footer .boxes .box ul li::before {content: "\f285";font-size: 14px;display: inline-block;font-family: bootstrap-icons !important;font-style: normal;font-weight: 400 !important;}
    footer a {color: #fff;}
    footer .boxes .box ul.sos {display: flex;list-style: none;gap: 20px;font-size: 24px;}
    footer .boxes .box ul.sos li::before {display: none;}
    .footer-info {padding-bottom: 20px;margin-bottom: 20px;border-bottom: 1px solid rgba(255, 255, 255, 0.2);}
    .footer-info .icon-box {display: flex;align-items: center;gap: 15px;}
    .footer-info .icon-box .icon {font-size: 40px;color: #fff;}
    .footer-info .icon-box .content b {display: block;color: #fff;font-weight: 800;font-size: 18px;}
    .footer-body {padding: 20px 0;}
    footer .footer-title {display: block;font-size: 24px;font-weight: 700;padding-bottom: 10px;margin-bottom: 30px;position: relative;color: #fff;line-height: 1.2;}
    footer .footer-title::before,
    footer .footer-title::after {content: "";position: absolute;bottom: 0;left: 0;height: 4px;border-radius: 20px;background: var(--light-color);background-size: 200%;}
    footer .footer-title::before {width: 15px;}
    footer .footer-title::after {width: 45px;left: 20px;}
    .footer-info .logo img {filter: brightness(0) invert(1);height: 30px;width: auto;}
    .footer-bottom {padding: 15px 0;background: var(--dark-color);font-size: 14px;}
    .footer-bottom a {color: #fff;}
    .footer-bottom .container {display: flex;justify-content: space-between;gap: 10px;align-items: center;}
    .footer-bottom .right ul {padding: 0;margin: 0;display: flex;list-style: none;gap: 15px;align-items: center;}
    #WAButton.floating-wpp {z-index: 2;}


/**/
@media (max-width: 1366px) {}

@media (max-width: 1200px) {
    :root { --gap: 20px;}
    body { font-size: 15px;}
    header .container{ gap: 20px;}
    header .container .language { padding-left: 20px;}
    header .logo img, header .logo svg { height: 30px;}
}

@media (max-width: 992px) {
    h1 { font-size: 22px;}
    h2 { font-size: 21px;}
    h3 { font-size: 20px;}
    h4 { font-size: 19px;}
    h5 { font-size: 18px;}
    h6 { font-size: 17px;}
    header { position: fixed;}
    header .container .language { display: none;}
    header .logo { z-index: 1;}
    header .logo img,header .logo svg { height: 30px;}
    header.sticky { background: #fff; box-shadow: 0 0 30px -20px var(--dark-color);}
   
    #menu .mobilMenu { display: flex; justify-content: flex-end; align-items: center; position: relative; width: 24px; height: 18px;}
    .mobilMenu span { display: block; width: 75%; height: 0; color: #fff; border-bottom: 2px solid; transition: 0.3s ease all; -webkit-transition: 0.3s ease all; -moz-transition: 0.3s ease all;}
    .mobilMenu span::before { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 0; border-bottom: 2px solid; transform: translateY(0); -webkit-transform: translateY(0); transition: 0.3s ease all; -webkit-transition: 0.3s ease all; -moz-transition: 0.3s ease all;}
    .mobilMenu span::after { content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: 0; border-bottom: 2px solid; transform: translateY(0); -webkit-transform: translateY(0); transition: 0.3s ease all; -webkit-transition: 0.3s ease all; -moz-transition: 0.3s ease all;}
    #menu.show .mobilMenu span { width: 0; transition: 0.3s ease all; -webkit-transition: 0.3s ease all; -moz-transition: 0.3s ease all;}
    #menu.show .mobilMenu span::before { transform: rotate(-45deg) translate(-2px, 8px); -webkit-transform: rotate(-45deg) translate(-2px, 8px);}
    #menu.show .mobilMenu span::after { transform: rotate(45deg) translate(-2px, -8px); -webkit-transform: rotate(45deg) translate(-2px, -8px);}
    #menu.show .mobilMenu span { width: 0; transition: 0.3s ease all; -webkit-transition: 0.3s ease all; -moz-transition: 0.3s ease all;}
    #menu.show .mobilMenu span::before { transform: rotate(-45deg) translate(-2px, 8px); -webkit-transform: rotate(-45deg) translate(-2px, 8px);}
    #menu.show .mobilMenu span::after { transform: rotate(45deg) translate(-2px, -8px); -webkit-transform: rotate(45deg) translate(-2px, -8px);}
    #menu>.menu { font-size: 16px; position: fixed; left: 0; background: var(--primary-color); top: 60px; width: 100%; visibility: hidden; height: 0; display: block; padding: 50px 20px 20px 20px; overflow: auto; transition: 0.3s ease all; -webkit-transition: 0.3s ease all; -moz-transition: 0.3s ease all;}
    #menu.show>ul { height: calc(100% - 60px); visibility: visible; transition: 0.3s ease all; -webkit-transition: 0.3s ease all; -moz-transition: 0.3s ease all;}
    .sticky #menu>ul { top: 50px; height: calc(100% - 50px);}
    #menu>.menu>li { flex: unset; width: 100%; height: auto; transition-delay: unset !important; opacity: 1 !important; transform: unset !important;}
    #menu>.menu>li>a { position: relative; color: #fff; padding: 15px 0; margin: auto; text-align: center;}
    header.sticky #menu .menu>li>a { color: #fff;}
    #menu .menu .tel { margin: 30px 0 15px 0;}
    #menu>.menu>li.right a { border: unset !important;}
    #menu .menu .con a { width: 100%; max-width: 250px;}
    #menu>.menu>li:not(:last-child)>a { border-bottom: 1px solid var(--passive-color);}
    #menu>.menu>li a::before { display: none;}
    #menu>.menu>li:hover>a { color: var(--secondary-color);}
    #menu .menu .sub::before { display: none;}
    #menu .menu li.acilir .sub { display: none; width: 100% !important; padding: 0; position: unset; background: unset; opacity: 1; visibility: visible; transform: unset; max-width: 100%; box-shadow: unset; transition: unset; -webkit-transition: unset; -moz-transition: unset;}
    #menu .menu li.acilir .sub ul { opacity: 1; visibility: visible; transform: unset;}
    #menu .menu li.acilir .sub li { transform: unset; opacity: 1;}
    #menu .menu li.acilir .sub li a { display: block; padding: 3px; color: var(--dark-color);}
    #menu .menu li.acilir.show .sub { display: block;}
    #menu .menu>li.acilir>a>i { display: flex; width: 36px; height: 36px; border-radius: 50%; justify-content: center; align-items: center; background: var(--passive-color); position: absolute; right: 5px; color: var(--primary-color); font-size: 16px; transform: rotate(-90deg); transition: 0.3s ease all;}
    #menu .menu>li.acilir.show>a>i { transform: rotate(0deg); transition: 0.3s ease all;}
    #menu .menu li.acilir:hover .sub { transition: unset; -webkit-transition: unset; -moz-transition: unset;}
    #menu .menu li.acilir .sub li:hover>a { background: unset; color: var(--primary-color);}
    #menu .menu .mega .sub { padding: 0;}
    #menu .menu .mega .sub .container { display: block; max-height: unset; padding: 0;}
    #menu .menu .mega .sub .container>ul { grid-template-columns: repeat(2, 1fr); gap: 30px; transform: unset; visibility: visible; opacity: 1; width: 100%;}
    #menu .menu .mega .sub .container>.image { display: none;}
    #menu .menu .mega .sub .sub-child>ul>li ul { padding: 10px; margin-bottom: 10px;}
    #menu .menu .mega .sub>.left { display: block; padding: 0;}
    #menu .menu .mega .sub>.left>ul { display: block; opacity: 1; visibility: visible; transform: unset;}
    #menu .menu .mega .sub>.left>ul li>a { display: block; padding: 3px; color: var(--dark-color);}
    #menu .menu .mega .sub>.right { display: none;}
    header #menu .language { display: flex; margin-top: 15px; padding-left: 0; border: unset; justify-content: center;}
    #menu .top-bar { display: flex; flex-wrap: wrap; justify-content: center; padding: 10px 0 0 0;}
    #menu .top-bar .search { flex: unset; width: 100%;}
    #menu .top-bar .search .form-group { width: 100%; background: var(--passive-color);}
    #menu .top-bar .search .form-group button { color: var(--dark-color);}
    #menu .top-bar .search input { color: var(--dark-color);}
    #menu .top-bar>li>a { color: var(--dark-color); opacity: 1;}
    #menu .top-bar>li.portal>a,.sticky #menu .top-bar>li.portal>a { color: #fff;}
    #menu .menu>li>a,header .social>li>a { border-radius: 0;}
    #menu,header .social { flex: unset;}
   
    header .social>li>a { padding: 10px;}
    header.sticky .mobilMenu span,header.sticky .social>li>a { color: var(--dark-color);}
   
    .home-slider { height: 70vh;}
    .home-slider .item { height: 100%;}
    .slider .arrow { display: none;}
    .home-slider .item .desc span { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;}
    .home-slider .item .title span { font-size: 30px;}
    .home-slider .item .desc span { font-size: 18px;}
}

@media (max-width: 768px) {
    :root { --gap: 15px;}
    .container { max-width: 100%; padding: 0 15px;}
    section { margin: 30px 0;}
    section .head { margin-bottom: 10px;}
    section .head .big-title { font-size: 36px;}
    .home-about { background: transparent; padding: 30px 0;}
    .home-about .container { grid-template-columns: repeat(1, 1fr);}
    .home-about .left { padding: 0;}
    .home-about .right { padding: 0;}
    .home-about .right .description,.home-about .right .btn { font-size: 16px;}
    .home-services { padding: 30px 0; margin: 0;}
    .services,.home-services .services,.images,.blogs { grid-template-columns: repeat(2, 1fr); gap: 10px;}
    .services .service .text { left: 5px; bottom: 5px; max-width: calc(100% - 10px);}
    footer .boxes { grid-template-columns: repeat(1, 1fr); gap: 30px;}
    .page-top { padding: 90px 0 60px 0;}
    .page-detail .content { margin: -30px auto 30px auto; padding: 10px;}
    .page-detail .gallery { grid-template-columns: repeat(3, 1fr);}
    .pages .page .box { grid-template-columns: repeat(1, 1fr); gap: 10px;}
    .pages .page .box .image { padding: 0px;}
    .pages .page .box .text { padding: 10px;}
    .pages .page:nth-child(2n+1) .box .image { order: unset;}
    .pages .page .box .text .title { margin-bottom: 5px; padding-bottom: 5px; font-size: 22px;}
    .pages .page .box .text .desc { font-size: 16px;}
    .blogs .blog .text { display: block; padding: 10px 5px;}
    .blogs .blog .title { font-size: 15px;}
    .home-contact { padding: 0; background: unset; margin: 30px 0;}
    .contact-page .title { font-size: 20px;}
    .map-iframe iframe { aspect-ratio: 3 / 2; border-radius: 5px;}
    #bize-yazin { padding: 20px;}


    .services, .teams {display: grid;grid-template-columns: repeat(2, 1fr);gap: 10px;}
    .services {aspect-ratio: unset;}
    .services .service.active, .services .service {flex:unset; aspect-ratio: 4 / 3;}
    .services .service .text {font-size: 15px;padding: 5px;border-radius: 5px;}
    .services .service .text span{display: none;}
    .services .service .text::before {inset: 0; }
    .services .service .text :is(b, span) {opacity: 1;transform: unset;}

    .teams .user .user-head .avatar {width: 100px;height: 100px;}
    .teams .user:hover .user-head {transform: unset;}    
    .teams .user .user-body {opacity: 1; visibility: visible; padding: 10px;transform: unset;}  
    .teams .user:hover .user-body {transform: unset;}  
    .teams .user .user-body .name {font-size: 16px;}

}


@media (max-width: 576px) {
    .cookies { width: calc(100% - 20px);}
    #menu .menu .mega .sub-menu .container>ul { gap: 10px;}

    .products { grid-template-columns: repeat(1, 1fr);}

}