:root {

    --primary-color: #fc0959;

    --primary-rgb: 252, 9, 89;

    --secondary-color: #c00040;

    --secondary-rgb: 192, 0, 64;

    --passive-color: #f6f7ff;

    --light-color: #66768c;

    --dark-color:  #0f172a;

    --primary-gradient: linear-gradient(135deg, #1a365d 0%, #2d5aa0 100%);

    --secondary-gradient: linear-gradient(90deg,var(--primary-color) 0%, var(--secondary-color) 100%);

    --footer-primary: #758799;--footer-secondary: #15304c;--footer-bg: #02021a;

    --gap: 30px;

}



::selection {background-color: var(--primary-color); color: #fff; }

body {font-family: "Inter", sans-serif;line-height: 1.4; color: var(--dark-color); overflow: hidden auto;}

img {max-width: 100%;color: transparent;}

h1 {font-size: 2.3rem;}

h2 {font-size: 2.1rem;} 

h3 {font-size: 1.9rem;} 

h4 {font-size: 1.7rem;} 

h5 {font-size: 1.5rem;} 

h6 {font-size: 1.3rem;}

h1, h2, h3, h4, h5, h6 {margin-bottom: 15px;}

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 {border-radius: 25px;background: var(--primary-color);border: unset;padding: 10px 30px;color: #fff;box-shadow: unset !important;transition: 0.3s ease all;}

.btn:hover { background: var(--secondary-color);color: #fff;}

.page-top {
    background: var(--secondary-color);
    padding: 60px 0 30px 0;
    margin: 0 0 25px 0;
    color: var(--passive-color);
}
.page-top .breadcrumb-item.active {
    color: var(--passive-color);
}

.page-top .breadcrumb-item i {
    color: var(--passive-color);
}

.breadcrumb-item+.breadcrumb-item::before{
      color: var(--passive-color);
}


#sticky-contact {position: fixed;right: 10px;bottom: 10px;z-index: 3;list-style: none;padding: 0;margin: 0;}

#sticky-contact > li > a {display: block;background: var(--bs-success);color: #fff;font-size: 30px;line-height: 1;padding: 10px;border-radius: 5px;}

#sticky-contact ul {padding: 0 0 10px 0;margin: 0; display: grid;gap: 10px;position: absolute;opacity: 0;visibility: hidden; bottom: 100%;list-style: none;transition: 0.3s ease all;}

#sticky-contact ul li{transform: translateY(10px);opacity: 0;transition: 0.3s ease all;}

#sticky-contact ul li a {display: block;position: relative; background: #597695;color: #fff;font-size: 30px;line-height: 1;padding: 10px;border-radius: 5px;}

#sticky-contact li:hover ul , #sticky-contact.show li ul{opacity: 1;visibility: visible;}

#sticky-contact li:hover ul li , #sticky-contact.show li ul li{transform: translateY(0px);opacity: 1;}

#sticky-contact ul li a::before {content: attr(data-text);opacity: 0; font-size: 16px;position: absolute;right:calc(100% + 5px);background: #597695;padding: 10px;top: 50%;transform: translate(0 , -50%);border-radius: 5px;white-space: nowrap;}
#sticky-contact ul li a::after {content: "";opacity: 0; position: absolute;left: -6px;top: 50%;border-color: transparent;border-style: solid;border-width: 8px 0 8px 5px;border-left-color: #646982;transform: translate(0, -50%);}
#sticky-contact ul li:hover a::before, #sticky-contact ul li:hover a::after {opacity: 1;}
#sticky-contact > li:hover > a {background: var(--primary-color);}


.btn-primary {background: transparent;border: 1px solid;padding: 10px 30px;color: var(--primary-color);box-shadow: unset !important;transition: 0.3s ease all;}

.btn-primary:hover { background: var(--primary-color);color: #fff; border-color: var(--primary-color);}



.btn-wp {display: flex;align-items: center;gap: 10px; width: fit-content; background-color: #25D366;color: white;font-size: 16px;font-weight: 500;padding: 12px 24px;border-radius: 24px;text-decoration: none;box-shadow: 0 2px 8px var(--dark-color);transition: all 0.3s ease;border: none;cursor: pointer;}

.btn-wp:hover {background-color: #128C7E;box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);transform: translateY(-2px);color: #fff;}

.btn-wp:active {transform: translateY(0);box-shadow: 0 2px 6px var(--dark-color);}

.btn-wp i {font-size: 18px;}



.cookies { position: fixed; z-index: 9; max-width: 370px; width: 100% ; 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;}



.fancybox__thumbs .carousel__slide .fancybox__thumb::after {border-color: var(--primary-color);}



#back-to-top {display: none;position: fixed;color: #fff; right: 15px;bottom: 15px;background: rgba(var(--primary-rgb), 0.5);font-size: 24px;padding: 10px;border-radius: 10px;cursor: pointer;transition: 0.3s ease all;z-index: 5;}

#back-to-top:hover {background: rgba(var(--primary-rgb), 1);}

#back-to-top.show {display: block;}



.container {max-width: 1300px;}

.container-fluid {max-width: 1900px;padding: 0 15px; margin: 0 auto;}



header {position: sticky;padding: 0px 0;width: 100%; top: 0;z-index: 4;background: #fff;box-shadow: 0 0 30px -30px var(--dark-color);transition: 0.5s ease all;}

header > .container {display: flex;gap: 50px; align-items: center;justify-content: space-between;position: relative;z-index: 1;}

header ul {margin: 0;padding: 0;list-style: none;}

header .logo img {width: auto;height: 80px;transition: 0.3s ease all;}



header .social {display: flex;gap: 15px; font-size: 18px;}



header.sticky {padding: 0px 0; box-shadow: 0 0 30px -20px var(--dark-color);}

header.sticky .logo img {filter: unset;} 



#menu {flex: 1;}

#menu .mobilMenu {display: none;}

#menu > .menu {display: flex;flex-wrap: wrap;height: 50px;gap: 0 5px; justify-content: center; align-items: center;margin: 0;padding: 0;transition: 0.3s ease all;}

#menu .menu > li {list-style: none;height: 100%;}

#menu .menu > li > a{display: flex;gap: 10px; color: var(--dark-color); align-items: center; position: relative;z-index: 1;padding: 0 20px; height: 100%;transition: 0.3s ease all;}

#menu .menu > li.drop-down > a > i {display: none;}

#menu .menu > li:hover > a {background: rgba(var(--primary-rgb), 0.1);color: var(--primary-color);border-radius: 15px;}



.sticky #menu .menu > li > a {color: var(--dark-color);}



#menu .menu .drop-down:not(.mega, .mega2){position: relative;}

#menu .menu .drop-down .sub-item {opacity: 0; visibility: hidden; position: absolute;left: 0;top: 100%; background:var(--passive-color);padding: 10px;border-radius: 10px;min-width: 200px; box-shadow: 0 5px 30px -25px var(--dark-color);}

#menu .menu .drop-down .sub-item::before {content: "";position: absolute;inset: 0;z-index: -1;top: -20px; }

#menu .menu .drop-down .sub-item ul > li > a {display: block;border-radius: 10px; line-height: 1;padding: 15px;background: transparent;transition: 0.3s ease all;}

#menu .menu .drop-down .sub-item ul > li:hover > a {background: rgba(var(--primary-rgb), 0.1);color: var(--primary-color);}





/* Mega Menü Tablı */

#menu .menu .drop-down.mega2 .sub-item {display: grid;grid-template-columns: 1fr 3fr;gap: 30px;}

#menu .menu .drop-down.mega2 .sub-item .nav-link {padding: 0; }

#menu .menu .drop-down.mega2 .sub-item .nav-link.active {background: transparent;}

#menu .menu .drop-down.mega2 .sub-item .nav-link a{background: #fff;color: var(--secondary-color);line-height: unset;}

#menu .menu .drop-down.mega2 .sub-item .nav-link.active a{background: rgba(var(--primary-rgb), 0.2);color: var(--primary-color);}

#menu .menu .drop-down.mega2 .sub-item .tab-content {flex: 1;background: #fff;border-radius: 10px;}

#menu .menu .drop-down.mega2 .sub-item .right {display: grid;grid-template-columns: repeat(3, 1fr);gap: 20px;padding: 20px;}

#menu .menu .drop-down.mega2 .sub-item .right .item {display: block;padding: 0;background: transparent;}

#menu .menu .drop-down.mega2 .sub-item .right .image{position: relative;z-index: 1;overflow: hidden;border-radius: 10px;box-shadow: 0 0 5px -4px var(--dark-color);}

#menu .menu .drop-down.mega2 .sub-item .right .image::before {content: "";position: absolute;width: 200%;height: 0%;left: 50%;top: 50%;background: rgba(255,255,255,0.3);transform: translate(-50%,-50%) rotate(-45deg);z-index: 1;}

#menu .menu .drop-down.mega2 .sub-item .right .image img{width: 100%;height: 100%;aspect-ratio: 5 / 3;object-fit: cover; transition: 1s ease all;}

#menu .menu .drop-down.mega2 .sub-item .right .text{padding: 10px;font-weight: 500;}



#menu .menu .drop-down.mega2 .sub-item .right .item:hover{background: var(--passive-color);}

#menu .menu .drop-down.mega2 .sub-item .right .item:hover .image::before {height: 250%;transition: all 600ms linear !important;background-color: transparent;}

#menu .menu .drop-down.mega2 .sub-item .right .item:hover .image img{ transform: scale(1.05);object-position: bottom;}

/* Mega Menü Tablı */



#menu .menu .drop-down:hover .sub-item {z-index: 1; top: calc(100% + 20px);opacity: 1;visibility: visible;transition: 0.5s ease all;}

#menu .menu .drop-down:is(.mega, .mega2) .sub-item{width: 100%;}

#menu .menu .drop-down:is(.mega, .mega2) .sub-item .nav {gap: 5px;}

#menu .menu .drop-down:is(.mega, .mega2) .sub-item ul .more a {display: flex;align-items: center;background: var(--primary-color);color: #fff;padding: 30px 15px;text-align: center;justify-content: center;gap: 15px;}

#menu .menu .drop-down:is(.mega, .mega2) .sub-item ul .more:hover a {background: var(--secondary-color);}



header .language {display: flex;gap: 10px;}





.home-slider .slider{position: relative;z-index: 1;padding-bottom: 30px;}

.home-slider .slider::after {content: ""; position: absolute; inset: 0;z-index: -1;  background: var(--slider-bg) no-repeat;background-size: cover;background-position: center;opacity: 0.3;}

.home-slider .slider:not(.slick-slider) .item:nth-child(n+2) { display: none;}

.home-slider .slider div { height: 100%;}

.home-slider .item { position: relative; z-index: 1; border: unset;overflow: hidden;}

.home-slider .item .container { display: grid;grid-template-columns: repeat(2, 1fr);gap: 50px; padding: 30px 15px; align-items: center;}

.home-slider .item .image {padding: 10px;border-radius: 15px;background: #fff; box-shadow: 0 0 30px -25px var(--dark-color);}

.home-slider .item img { width: 100%; height: 100%; aspect-ratio: 4 / 3; object-fit: cover;border-radius: 15px;}

.home-slider .item video { width: 100%; height: 100%; object-fit: cover;}

.home-slider .item .text {display: flex;flex-direction: column;height: fit-content;padding: 30px; }

.home-slider .item .date span  {background: var(--primary-color);color: #fff;line-height: 1;font-size: 14px;padding: 5px 10px;border-radius: 10px;}

.home-slider .item .title { display: block;margin-top: 10px; font-size: 2.3rem; font-weight: 600; margin-bottom: 30px; transform: translate(0, 50px);opacity: 0;}

.home-slider .item .desc { display: block;font-size: 20px; font-weight: 300; color: var(--light-color); transform: translate(0, 50px);opacity: 0;}

.home-slider .item .go {margin-top: 20px; opacity: 0; transform: translate(0, 50px);}

.home-slider .item .btn { position: relative;font-size: 18px; background: var(--primary-color);padding: 10px 30px;border-radius: 25px; padding-right: 40px; border: unset;}

.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 .slick-active .title {opacity: 1; transform: translate(0, 0); transition-delay: 0.6s; transition-duration: 0.6s;}

.home-slider .slick-active .desc {opacity: 1; transform: translate(0, 0); transition-delay: 1s; transition-duration: 0.8s;}

.home-slider .slick-active .go { opacity: 1; transition-delay: 1.2s; transition-duration: 1.4s; transform: translate(0px, 0);}



.home-slider .item .btn:hover { background: var(--secondary-color);}

.home-slider .item .btn:hover i { right: -5px;}



.home-slider .slick-dots { position: absolute; bottom: 10px; width: fit-content; margin: auto; padding: 0 15px; left: 0; right: 0; display: flex; list-style: none; gap: 10px;}

.home-slider .slick-dots li {padding: 10px;border-radius: 50%;border: 1px solid transparent;transition: 0.3s ease all;cursor: pointer;}

.home-slider .slick-dots button {display: block;padding: 0;font-size: 0;width: 8px;height: 8px;background: var(--bs-gray-300);border-radius: 50%;border: unset;}

.home-slider .slick-dots .slick-active ,.home-slider .slick-dots li:hover{border-color: var(--primary-color);}

.home-slider .slick-dots li:is(.slick-active, :hover) button {background: var(--primary-color);}





section {margin: 50px 0;}

section .head {margin: 0 auto 30px auto;} 

section .head.text-left {margin: 0 auto 30px 0;text-align: left;} 

section .head .big-title {line-height: 1;letter-spacing: 1.5px;border-radius: 20px;background: var(--bs-gray-200);padding: 10px 15px;font-size: 14px;display: inline-block;color: var(--light-color);margin-bottom: 5px;}

section .head .description{display: block;font-size: 30px;font-weight: 600;color: var(--dark-color);transition-duration: .5s;margin: 0;}

section .head.text-left .big-title::before{right: unset;}





.items { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--gap); width: 100%;}

.items .item a { display: block; background: #fff; height: 100%; border-radius: 10px; box-shadow: 0 0 20px -18px var(--dark-color); transition: 0.3s ease all;}

.items .item .image { position: relative; z-index: 1; overflow: hidden; border-radius: 10px;}

.items .item .image img { width: 100%; height: 100%; aspect-ratio: 4/3; object-fit: cover;}

.items .item .image::before { content: ""; z-index: 0; position: absolute; background: var(--dark-color); opacity: 0; transition: 0.3s ease all; inset: 0;}

.items .item .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;}

.items .item .text { display: block; padding: 20px 15px;}

.items .item .date {display: inline-block;margin-bottom: 5px;background: var(--primary-color);color: #fff;line-height: 1;font-size: 14px;padding: 5px 10px;border-radius: 10px;}

.items .item .title {  overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical;margin-bottom: 5px;}

.items .item .description {display: block;font-size: 14px;color: var(--bs-gray-600);margin-bottom: 10px;}

.items .item .text .show{display: block;}

.items .item:hover a { color: var(--primary-color); box-shadow: 0 10px 20px -18px var(--dark-color);}

.items .item:hover .image::before { opacity: 0.5;}

.items .item:hover .image::after { opacity: 1; right: 20px; transition-delay: 0.2s; transition-duration: 0.3s;}



:is(.content-carousel-widget, .category-carousel-widget) .container { position: relative;}

:is(.content-carousel-widget, .category-carousel-widget) .items.slick-slider { display: block;margin-bottom: 100px;}

:is(.content-carousel-widget, .category-carousel-widget) .items.slick-slider .slick-track {margin: 0;}

:is(.content-carousel-widget, .category-carousel-widget) .items.slick-slider .slick-list{margin: 0 -10px;}

:is(.content-carousel-widget, .category-carousel-widget) .items.slick-slider .item {margin: 10px;}



:is(.content-carousel-widget, .category-carousel-widget) .items.slick-slider .item { height: auto;}

:is(.content-carousel-widget, .category-carousel-widget) .items.slick-slider .item a { height: 100%;}

:is(.content-carousel-widget, .category-carousel-widget) .slick-arrow::before { display: inline-block; font-family: bootstrap-icons !important; font-size: 20px;}

:is(.content-carousel-widget, .category-carousel-widget) .slick-next::before { content: "\f285";}

:is(.content-carousel-widget, .category-carousel-widget) .slick-prev::before { content: "\f284";}

:is(.content-carousel-widget, .category-carousel-widget) .slick-arrow.slick-disabled { opacity: 0.3;}



:is(.content-carousel-widget, .category-carousel-widget) .slick-arrow {
    position: absolute;
    z-index: 1;
    overflow: hidden;
    font-size: 0;
    box-shadow: 0 0 30px -15px var(--dark-color);
    background: transparent;
    color: var(--primary-color);
    width: 25px;
    height: 78px;
    transition: 0.3s ease all;
    -webkit-transition: 0.3s ease all;
    -moz-transition: 0.3s ease all;
    top: 35%;
    transform: translate(0, -50%);
    border: 1px solid;
}

:is(.content-carousel-widget, .category-carousel-widget) .slick-arrow:hover { background: var(--primary-color); color: #fff;}

:is(.content-carousel-widget, .category-carousel-widget) .slick-prev { left: 0px;}

:is(.content-carousel-widget, .category-carousel-widget) .slick-next { right: 0px;}



.video-widget {background: var(--dark-color);color: #fff;margin: 70px 0;}

.video-widget .container {display: grid;grid-template-columns: repeat(2, 1fr); gap: 30px;align-items: center;}

.video-widget .text {padding: 30px 0;}

.video-widget .text .description {font-weight: 100;color: #fff;}



.video-widget .video{position: relative;margin: -30px 0;}

.video-widget .video img{width: 100%;height: 100%;object-fit: cover;transform: scale(1); transition: 1s ease all;border-radius: 10px;filter: grayscale(1);}

.video-widget .video a {display: block;position: relative;z-index: 1; width: 100%;height: 100%;}



.video-widget .video .play{display: flex;align-items: center;justify-content: center;color: var(--primary-color);font-size: 30px;position: absolute;z-index: 3;width: 100px;height: 100px;top: 50%;right: 50%;border-radius: 100%;background: #fff; transform: translate(50% , -50%);}

.video-widget .video .play::before{content: "";position: absolute;z-index: -1; inset: 0; border-radius: 50%;background: #fff;margin: 10px;transition: 5s ease;-webkit-animation: waves 2.5s infinite;animation: waves 2.5s infinite; -webkit-animation-delay: 0.1s;animation-delay: 0.1s;}

.video-widget .video .play::after {content: "";position: absolute;z-index: -1; inset: 0; border-radius: 50%;background: #fff;margin: 10px;transition: 5s ease; -webkit-animation: waves 2.5s linear 0.7s infinite;animation: waves 2.5s linear 0.7s infinite;}



.video-widget .video:hover img{filter: grayscale(0);}







.slogan-widget {position: relative;z-index: 1; padding: 50px 0; background-size: cover; background-attachment: fixed;}

.slogan-widget .head {text-align: center;}

.slogan-widget::before{content: ""; position: absolute; z-index: -1; inset: 0; background: var(--dark-color); opacity: 0.5;}

.slogan-widget .slogan {max-width: 800px; margin: 0 auto; text-align: center; color: #fff; font-size: 26px;}



.accordion.faq .accordion-item {border: unset;border-radius: 15px;background: var(--bs-gray-100);}

.accordion.faq .accordion-item:not(:last-child) {margin-bottom: 30px;}

.accordion.faq .accordion-item .accordion-button:not(.collapsed) {color: var(--primary-color);}

.accordion.faq .accordion-item .accordion-button {font-size: 20px;font-weight: 600;border: unset;box-shadow: unset;background: unset;padding:20px 30px;}

.accordion.faq .accordion-item .accordion-body {padding: 15px 30px;}



.gallery-widget .images .image:nth-child(n + 7) {display: none;}

.gallery-widget .images {grid-template-rows: repeat(4 , 1fr);}

.gallery-widget .images .image {grid-row: 2 span;}

.gallery-widget .images .image:first-child {grid-row: 4 span; grid-column: 2 span;}

.gallery-widget .images .image:nth-child(4) {grid-row: 3 span;}

.gallery-widget .images .more {grid-row: 1 span; display: flex;justify-content: center;align-items: center;background: var(--primary-color);color: #fff;border-radius: 5px;transition: 0.3s ease all;}

.gallery-widget .images .more:hover {background: var(--secondary-color);}



.gallery .images .image:first-child{grid-column: 2 span; grid-row: 2 span;}





.about-widget {padding: 50px 0;background: linear-gradient(270deg, var(--secondary-color) 0%, var(--secondary-color) calc(50% - 15vw), #fff calc(50% - 15vw), #fff 100%);background-position: right;background-size: 0;background-repeat: no-repeat;}

.about-widget.aos-animate {background-size: 100%;}

.about-widget .container {display: grid;grid-template-columns: repeat(2, 1fr);align-items: center;gap: 100px;padding: 0;}

.about-widget .left {flex: 1;}

.about-widget .left .clearfix {font-size: 22px;color: var(--light-color);font-weight: 200;}

.about-widget .image {order: 2;}

.about-widget .image::after {content: "";background-image: radial-gradient(#FFF 1px, rgba(0, 0, 0, 0) 2px);background-size: 1rem 1rem;position: absolute;left: 0px;bottom: 50px;width: 100px;height: 160px;z-index: -1;opacity: 0.7;animation: leftRightTop 8s infinite;}

.about-widget .image img {width: 100%;object-fit: cover;border-radius: 5px;}



.category-grid-widget .items {margin-bottom: 50px;}



.category-carousel-widget .items .item .image .show {display: none;}

.contact-widget .contact-form {order: 2;}







footer .top {background: var(--primary-color);color: #fff;text-align: center;padding: 20px 0;}

footer .top .b {display: block;font-size: 20px;margin-bottom: 10px;}

footer .top ul {display: flex;flex-wrap: wrap; gap: var(--gap); margin: 0;padding: 0;justify-content: center;}

footer .top ul a {display: block; color: #fff;}

footer .top ul a i {font-size: 14px;}

footer .top ul li:hover a {color: var(--primary-color);}



footer .bottom{padding: 0px; background:#fff; position: relative; z-index: 1;}

footer .bottom .container {position: relative;padding: 40px 60px;}

footer .footer-top {margin: 15px 0;}

footer .boxes {display: flex;flex-wrap: wrap; gap: var(--gap);color: var(--dark-color);font-size: 15px;}

footer .boxes .box {flex: 1;}

footer .boxes .box span.b {display: block;font-weight: 600; font-size: 18px;margin-bottom: 20px;position: relative;width: max-content;}

footer .boxes a{display: block;color: var(--dark-color);width: max-content;max-width: 100%;padding: 3px 0; transition: 0.3s ease all;}

footer .boxes a:hover{color: var(--primary-color); transition: 0.3s ease all;}

footer .boxes ul{margin: 0;padding: 0;list-style: none;}

footer .boxes .logo img{width: auto; height: 50px;}

footer .boxes p {font-size: 14px;color: var(--light-color);margin: 0;}

footer .boxes .left .social {display: flex;flex-wrap: wrap;font-size: 24px;gap: 20px;margin-top: 20px;}

footer .boxes .contact {display: grid;gap: 10px; margin: 15px 0;}

footer .boxes .contact li {display: flex;gap: 10px;}

footer .boxes .contact li i{color: var(--primary-color);}

footer .boxes .right li a{overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;}

footer .box.full {flex: unset;display: flex;flex-wrap: wrap; gap: 20px; justify-content: space-between; width: 100%; border-top: 2px solid var(--passive-color);padding-top: 20px;}

footer .box.full ul {display: flex;font-size: 14px;gap: 0 40px;}







@media (max-width: 1366px) {



}



@media (max-width: 1200px) {

    :root{ --gap:20px; }

    

    

}



@media (max-width: 992px) {

    header  .language,

    header .social { display: none;}

    header .logo { z-index: 1;}

    header .logo img,header .logo svg { height: 70px;}

    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: var(--dark-color); 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(--dark-color); top: 80px; 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% - 80px); visibility: visible; transition: 0.3s ease all; -webkit-transition: 0.3s ease all; -moz-transition: 0.3s ease all;}

    .sticky #menu>ul { top: 70px; height: calc(100% - 70px);}

    #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(--primary-color);}

    #menu .menu .sub::before { display: none;}

    #menu .menu li.drop-down .sub-item { display: none; padding: 10px 0; width: 100% !important; 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.drop-down .sub-item ul { opacity: 1; visibility: visible; transform: unset;}

    #menu .menu li.drop-down .sub-item li { transform: unset; opacity: 1;}

    #menu .menu li.drop-down .sub-item li a { display: block; line-height: 1.3; padding: 5px 10px; color: #fff;}

    #menu .menu li.drop-down.show .sub-item { display: block;}

    #menu .menu>li.drop-down>a>i {display: flex;position: absolute;right: 5px;font-size: 16px;transform: rotate(-90deg);transition: 0.3s ease all;}

    #menu .menu>li.drop-down.show>a>i { transform: rotate(0deg); transition: 0.3s ease all;}

    #menu .menu li.drop-down:hover .sub-item { transition: unset; -webkit-transition: unset; -moz-transition: unset;}

    #menu .menu li.drop-down .sub-item li:hover>a { background: unset; color: var(--primary-color);}

    #menu .menu .mega .sub-item { padding: 0;}

    #menu .menu .mega .sub-item .container { display: block; max-height: unset; padding: 0;}

    #menu .menu .mega .sub-item .container>ul { grid-template-columns: repeat(2, 1fr); gap: 30px; transform: unset; visibility: visible; opacity: 1; width: 100%;}

    #menu .menu .mega .sub-item .container>.image { display: none;}

    #menu .menu .mega .sub-item .sub-child>ul>li ul { padding: 10px; margin-bottom: 10px;}

    #menu .menu .mega .sub-item>.left { display: block; padding: 0;}

    #menu .menu .mega .sub-item>.left>ul { display: block; opacity: 1; visibility: visible; transform: unset;}

    #menu .menu .mega .sub-item>.left>ul li>a { display: block; padding: 3px; color: var(--dark-color);}

    #menu .menu .mega .sub-item>.right { display: none;}

    header #menu .language,

    header #menu .social { display: flex; margin-top: 15px; padding-left: 0; border: unset; }

   

    #menu .menu>li>a,header .social>li>a { border-radius: 0;}

    #menu,header .social { flex: unset;}



    #menu .menu .drop-down.mega2 .sub-item {display: none;}

    #menu .menu .drop-down.show .sub-item {display: block;}

    #menu .menu .drop-down.mega2 .sub-item .nav{}

    #menu .menu .drop-down.mega2 .sub-item .nav-link a,#menu .menu .drop-down.mega2 .sub-item .nav-link.active a {background: transparent; color: #fff;padding: 5px 10px;}

    #menu .menu .drop-down.mega2 .sub-item .tab-content {display: none;}



   

    header .social>li>a {color: #fff;}

    header.sticky .mobilMenu span{ color: var(--dark-color);}

   

    .home-slider .item .container {grid-template-columns: repeat(1, 1fr);gap: 10px;  padding: 15px;}

    .home-slider .item .text {padding: 10px;}

    .home-slider .item .title {font-size: 1.3rem;margin: 10px 0;}

    .home-slider .item .desc {font: 15px sans-serif;}



    section .head .description {font-size: 20px;}



    #product-nav {gap: 5px;}

    #product-nav .nav-link {padding: 5px;font-size: 15px;}



    section .head {margin: 0 auto 20px auto;}

    section .head.text-left {margin: 0 auto 20px 0;}

      .about-widget {
        padding: 40px 0;
        background: #fff; /* mobilde sade */
    }

    .about-widget .container {
        grid-template-columns: 1fr;   /* tek kolon */
        gap: 30px;                    /* boşluk küçüldü */
        padding: 0 16px;              /* yanlardan nefes */
    }

}



@media (max-width: 768px) {

    .products.slick-slider {padding: 0;}

    .products.slick-slider .slick-list {margin: 0 -5px;padding-right: 25vw;}

    .products.slick-slider .product {margin: 5px;}



    .home-about {background: linear-gradient(180deg, var(--primary-color) 0%, var(--primary-color) 150px, transparent 150px, transparent 100%);}

    .home-about .container {grid-template-columns: repeat(1 , 1fr);gap: 10px;padding: 15px;}

    .home-about .image {order: -1;}



    .works {grid-template-columns: repeat(2, 1fr);gap: 10px; align-items: unset;}

    .works .image {display: none;}

    .works .work {flex-direction: column;gap: 10px;padding: 5px;}



    .home-items .items.slick-slider {padding: 0;}



    #bize-yazin {flex: unset;}



    .references {gap: 10px;}



    footer .bottom .container {padding: 20px 15px;}

    footer .boxes .left .social {gap: 10px;}



    .categories,

    .products ,

    .blogs{grid-template-columns: repeat(2, 1fr);gap: 10px;}




    .pages .page .box {grid-template-columns: repeat(1 , 1fr); gap: 15px;}

    .pages .page .box .text {padding: 0;}

    .pages .page:nth-child(2n+1) .box .image,

    .pages .page .box .image {order: -1; padding: 0;}



    .services {grid-template-columns: repeat(2, 1fr); gap: 10px;}

    .services .service .text .title {font-size: 1.1rem;color: var(--dark-color);}



    .news {grid-template-columns: repeat(2, 1fr); gap: 10px;}

    .home-news .news .new:nth-child(2) {order: -1;}



    .home-news .news .new:nth-child(2) .title {font-size: 20px;}



    .page-top {display: none;}

    .page-detail {padding: 30px 0;}

      .about-widget {
        padding: 40px 0;
        background: #fff; /* mobilde sade */
    }

    .about-widget .container {
        grid-template-columns: 1fr;   /* tek kolon */
        gap: 30px;                    /* boşluk küçüldü */
        padding: 0 16px;              /* yanlardan nefes */
    }


}



@media (max-width: 576px) {    

    .cookies {max-width: calc(100% - 20px);}



    .contact-page {margin:15px 0;}

    .contact-page .title {font-size: 20px;}

    .contact-page .container .left {text-align: left;}

    

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

      .about-widget {
        padding: 40px 0;
        background: #fff; /* mobilde sade */
    }

    .about-widget .container {
        grid-template-columns: 1fr;   /* tek kolon */
        gap: 30px;                    /* boşluk küçüldü */
        padding: 0 16px;              /* yanlardan nefes */
    }
    
}



/* ===== CLEAN SLIDER ===== */
.bw-slider-clean {
    width: 100%;
    position: relative;
    margin: 0;
    max-height: 635px;
}
.slider-container {
    position: relative;
    width: 100%;
    height: 650px;
    overflow: hidden;
}

/* Slide Item */
.slider-item {
    position: relative;
    height: 650px;
}

/* Image */
.slider-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
}

.slider-image img {
    width: 100%;
}

.image-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, rgb(0 0 0 / 54%) 0%, rgb(0 0 0 / 8%) 50%, transparent 100%);
}

/* Content */
.slider-content {
    position: relative;
    z-index: 2;
    height: 100%;
    display: flex;
    align-items: center;
    padding: 0 15%;
}

.content-box {
    max-width: 650px;
}

/* Title */
.slide-title {
    font-size: 42px;
    font-weight: 600;
    color: #fff;
    line-height: 1.2;
    margin-bottom: 20px;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

/* Description */
.slide-description {
    margin-bottom: 30px;
}

.slide-description p {
    font-size: 18px;
    line-height: 1.6;
    color: rgba(255,255,255,0.9);
    max-width: 500px;
}

/* Yellow Button */
.slider-button {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 14px 32px;
    background:var(--primary-color);
    color: var(--passive-color);
    font-size: 15px;
    font-weight: 600;
    text-decoration: none;
    border-radius: 4px;
    transition: all 0.3s ease;
    border: none;
    cursor: pointer;
}

.slider-button:hover {
    background:var(--primary-color);
    transform: translateY(-2px);
    box-shadow: 0 5px 15px rgba(255, 193, 7, 0.3);
}

.slider-button:active {
    transform: translateY(0);
}

/* Navigation */
.slider-nav {
    position: absolute;
    bottom: 30px;
    left: 8%;
    right: 8%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    z-index: 10;
}

/* Arrows */
.nav-arrow {
    width: 40px;
    height: 40px;
    background: rgba(255,255,255,0.15);
    border: 1px solid rgba(255,255,255,0.3);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
}

.nav-arrow:hover {
    background: rgba(255,255,255,0.25);
    border-color: rgba(255,255,255,0.5);
}

/* Dots */
.slider-dots {
    display: flex;
    gap: 8px;
}

.slider-dots .slick-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: rgba(255,255,255,0.3);
    border: none;
    padding: 0;
    cursor: pointer;
    transition: all 0.3s ease;
}

.slider-dots .slick-active {
    background: var(--primary-color);
    transform: scale(1.2);
    color: var(--passive-color);
}

/* Responsive */
@media (max-width: 1200px) {
    .slider-content {
        padding: 0 6%;
    }
    
    .slider-nav {
        left: 6%;
        right: 6%;
    }
}

@media (max-width: 992px) {
    .slider-container,
    .slider-item {
        height: 550px;
    }
    
    .slide-title {
        font-size: 36px;
    }
    
    .slider-content {
        padding: 0 5%;
    }
    
    .slider-nav {
        left: 5%;
        right: 5%;
    }
}

@media (max-width: 768px) {
    .slider-container,
    .slider-item {
        height: 450px;
    }
    

    .slider-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.slider-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}



    .slider-content {
        text-align: center;
        padding: 0 4%;
    }
    
    .content-box {
        margin: 0 auto;
    }
    
    .slide-title {
        font-size: 30px;
    }
    
    .slide-description p {
        font-size: 16px;
    }
    
    .image-overlay {
        background: linear-gradient(
            to top,
            rgba(0,0,0,0.6) 0%,
            rgba(0,0,0,0.3) 50%,
            transparent 100%
        );
    }
    
    .slider-nav {
        flex-direction: column;
        gap: 20px;
        bottom: 20px;
    }
    
    .slider-dots {
        order: 1;
    }
    
    .nav-arrow {
        order: 2;
        position: absolute;
        bottom: 0;
    }
    
    .prev-arrow {
        left: 10px;
    }
    
    .next-arrow {
        right: 10px;
    }
}

@media (max-width: 480px) {
    .slider-container,
    .slider-item {
        height: 400px;
    }
    
    .slide-title {
        font-size: 26px;
    }
    
    .slider-button {
        padding: 12px 24px;
        font-size: 14px;
    }
}



/* --- 1. GENEL IZGARA (GRID) YAPISI --- */
.categories {
  display: grid;
  grid-template-columns: repeat(4, 1fr); /* Masaüstünde 4'lü yan yana */
  gap: 20px; /* Kutular arası boşluk */
  margin-bottom: 30px;
}

/* --- 2. KART TASARIMI --- */
.category {
  background: #fff;
  border-radius: 10px; /* Kart köşelerini yuvarla */
  box-shadow: 0 4px 6px rgba(0,0,0,0.1); /* Hafif gölge ekle */
  transition: transform 0.3s ease, box-shadow 0.3s ease; /* Hareket animasyonu */
  overflow: hidden; /* Taşmaları gizle */
  border: 1px solid #eee; /* İnce çerçeve */
}

/* Kartın üzerine gelince (Hover) */
.category:hover {
  transform: translateY(-5px); /* Kartı hafifçe yukarı kaldır */
  box-shadow: 0 10px 15px rgba(0,0,0,0.15); /* Gölgeyi belirginleştir */
}

/* Linkin altındaki çizgiyi kaldır */
.category a {
  text-decoration: none;
  display: block; /* Tüm alanı tıklanabilir yap */
}

/* --- 3. GÖRSEL AYARLARI --- */
.category .image {
  width: 100%;
  height: 180px; /* Görseller için sabit yükseklik */
  overflow: hidden;
}

.category .image img {
  width: 100%;
  height: 100%;
  object-fit: cover; /* Resmi kutuya sığdır (ezilmeden) */
  display: block;
}

/* --- 4. YAZI ALANI TASARIMI (Görünüm İyileştirme) --- */
.category .text {
  padding: 15px; /* Yazı etrafına iç boşluk */
  text-align: center; /* Yazıyı ortala */
  background-color: #fff;
}

.category .text span {
  font-size: 16px;
  font-weight: 600; /* Yazıyı kalınlaştır */
  color: #333; /* Koyu gri yazı rengi */
  display: block;
}

/* Hover durumunda yazı rengi değişsin */
.category:hover .text span {
  color: #007bff; /* Mavi (veya sitenizin ana rengi) */
}

/* --- 5. MOBİL VE TABLET AYARLARI (Responsive) --- */

/* Tabletler (Ekran genişliği 992px ve altı) */
@media (max-width: 992px) {
  .categories {
    grid-template-columns: repeat(3, 1fr); /* 3'lü yan yana düşür */
  }
}

/* Küçük Tabletler ve Büyük Telefonlar (768px ve altı) */
@media (max-width: 768px) {
  .categories {
    grid-template-columns: repeat(2, 1fr); /* 2'li yan yana düşür */
    gap: 15px; /* Boşluğu biraz azalt */
  }
  
  .category .image {
    height: 150px; /* Mobilde görsel boyunu biraz kısabiliriz */
  }
}

/* Mobil Telefonlar (480px ve altı) */
@media (max-width: 480px) {
  .categories {
    grid-template-columns: repeat(1, 1fr); /* Mobilde tek sütun (alt alta) */
  }
  
  .category .image {
    height: 200px; /* Tek sütun olduğu için görseli büyütebiliriz */
  }
}

/* --- MOBİL DÜZELTME KODLARI --- */

@media (max-width: 768px) {
  /* Orijinal grid-4'teki !important'ı ezmek için burada zorluyoruz */
  .grid-4 {
    grid-template-columns: repeat(2, 1fr) !important; /* Mobilde 2 sütun yap */
    gap: 10px !important; /* Aralarındaki boşluğu ayarla */
  }

  /* Kartların yüksekliğini mobilde biraz kısalım ki çok yer kaplamasın */
  .category .image {
    height: 120px !important; /* Görsel yüksekliği */
  }

  /* Yazı alanını düzenle */
  .category .text {
    padding: 8px !important; /* İç boşluğu azalt */
  }

  .category .text span {
    font-size: 13px !important; /* Yazı fontunu mobilde bir tık küçült */
    line-height: 1.3;
  }
}

/* Eğer çok küçük ekranlarda (eski telefonlar) tek sütun olsun isterseniz: */
@media (max-width: 380px) {
  .grid-4 {
    grid-template-columns: 1fr !important; /* Tek sütun */
  }
}