body {
	font-family: 'Roboto', sans-serif;
	transition: all 0.5s;
}
p {
	margin-bottom: 0px;
	font-size: 14px;
	color: #4a4a4a;
	line-height: 24px;
}
a {
	text-decoration: none!important;
}

.copyright-text {
	text-transform: uppercase;
}

.main-button a {
	background-color: #3a8bcd;
	border-radius: 5px;
	padding: 10px 15px;
	display: inline-block;
	color: #fff;
	font-size: 14px;
	text-transform: uppercase;
	font-weight: 300;
	letter-spacing: 0.4px;
	text-decoration: none;
	transition: all 0.5s;
}
.main-button a:hover {
	opacity: 0.7;
}
.section-heading {
	margin-top: 80px;
	margin-bottom: 40px;
}
.section-heading .line-dec {
	width: 30px;
	height: 5px;
	background-color: #3a8bcd;
}
.section-heading h1 {
	font-size: 22px;
	font-weight: 700;
	color: #1e1e1e;
	margin-top: 15px;
}

/* Pre Header Style */
#pre-header {
	background-color: #3a8bcd;
	text-align: center;
}
#pre-header span {
	color: #fff;
	font-size: 15px;
	padding: 10px 0px;
	display: inline-block;
}

/* Header Style */
.navbar .navbar-brand {
	text-align: center;
	width: 100%;
	position: relative;
	padding: 25px 0px;
}
.bg-dark {
	background-color: #fff!important;
	border-bottom: 1px solid #eee;
}
#navbarResponsive {
	z-index: 999;
	position: absolute;
	left: 50%;
	top: 105px;
	transform: translateX(-50%);
}
.navbar-dark .navbar-nav .nav-item {
	margin: 0px 15px;
}
.navbar-dark .navbar-nav .nav-link {
	text-transform: uppercase;
	font-size: 15px;
	font-weight: 700;
	color: #1e1e1e;
	transition: all 0.5s;
}
.navbar-dark .navbar-nav .nav-link:hover,
.navbar-dark .navbar-nav .active>.nav-link,
.navbar-dark .navbar-nav .nav-link.active,
.navbar-dark .navbar-nav .nav-link.show,
.navbar-dark .navbar-nav .show>.nav-link {
	color: #3a8bcd;
}
.navbar:after {
	width: 100%;
	height: 1px;
	background-color: #eee;
	content: '';
	position: absolute;
	left: 0;
	bottom: -52px;
}
.navbar-dark .navbar-toggler-icon {
	background-image: none;
}
.navbar-dark .navbar-toggler {
	border-color: #3a8bcd;
	background-color: #3a8bcd;	
	height: 50px;
	outline: none;
}
.navbar-dark .navbar-toggler-icon:after {
	content: '\f0c9';
	color: #FFF;
	font-size: 22px;
	line-height: 30px;
	font-family: 'FontAwesome';
}
/* Banner Style */
.banner {
    width: 85%;
    margin: 50px auto 0 auto;
    background-image: url(../images/banner-bg.jpg);
    
    /* DEĞİŞEN KISIM BURASI */
    background-size: 100% 100%; /* Resmi kutunun boyutlarına göre gerdirir/sığdırır */
    
    background-repeat: no-repeat;
    padding: 180px 0px;
    background-position: center center;
    border-radius: 50px;
    overflow: hidden;
}
.banner .caption {
	background-color: rgba(250,250,250,0.9);
	padding: 30px;
	max-width: 450px;
    /* Caption'ın köşeleri de uyumlu olsun istersen bunu da ekleyebilirsin (isteğe bağlı) */
    border-radius: 20px;
}
/* ... geri kalan kodların aynı ... */
.banner .caption h2 {
	margin-top: 0px;
	margin-bottom: 15px;
	font-size: 24px;
	font-weight: 700;
	color: #1e1e1e;
}
.banner .caption .line-dec {
	width: 30px;
	height: 5px;
	background-color: #3a8bcd;
}
.banner .caption p {
	margin-top: 15px;
	margin-bottom: 20px;
}

/* Yeni Banner Alanı Düzeni */
.main-banner-area {
    padding: 100px 0; /* Üstten alttan boşluk */
    background-color: #f7f7f7; /* Arka plan rengi */
    margin-top: 50px;
}

.main-title {
    font-size: 36px;
    font-weight: 800;
    color: #1e1e1e;
    margin-bottom: 20px;
}

.lead-text {
    font-size: 16px;
    color: #666;
    margin-bottom: 30px;
}

/* Sağdaki Resim Ayarı */
.right-image img {
    width: 100%;
    border-radius: 20px; /* Köşeleri ovalleştirir */
    box-shadow: 0 10px 30px rgba(0,0,0,0.1); /* Gölge ekler */
    object-fit: cover;
    height: 500px; /* Resmin yüksekliğini sabitler, istersen artır */
}

/* Akordiyon (Açılır Menü) Tasarımı */
.card {
    border: none !important;
    margin-bottom: 10px;
    background: transparent !important;
}

.card-header {
    background-color: white !important;
    border-radius: 10px !important;
    padding: 0;
    border: 1px solid #eee;
    box-shadow: 0 2px 5px rgba(0,0,0,0.05);
}

.card-header button {
    width: 100%;
    color: #333;
    font-weight: 600;
    text-decoration: none;
    padding: 15px 20px;
    font-size: 16px;
    display: flex;
    align-items: center;
}

.card-header button:hover {
    color: #3a8bcd; /* Mavi renk */
}

/* Açılan kısım */
.card-body {
    background-color: white;
    border-radius: 0 0 10px 10px;
    padding: 20px;
    font-size: 14px;
    color: #555;
    border: 1px solid #eee;
    border-top: none;
    line-height: 1.6;
}

/* Mobilde resim üste çıkmasın, altta kalsın diye */
@media (max-width: 991px) {
    .right-image {
        margin-top: 40px;
    }
}

/* Featured Style */
.featured-item {
    background: #ffffff; /* Beyaz arka plan */
    border-radius: 15px; /* Modern, yuvarlak köşeler */
    overflow: hidden;    /* Resim büyüdüğünde veya köşeler yuvarlandığında dışarı taşmasını engeller */
    box-shadow: 0 5px 15px rgba(0,0,0,0.08); /* Hafif, modern bir gölge */
    transition: all 0.3s ease; /* Tüm değişimler yumuşak olsun */
    border: 1px solid #f0f0f0; /* Çok ince, zarif bir çerçeve */
    margin-bottom: 20px; /* Alt alta gelirlerse yapışmasınlar */
}

/* 2. Resim Ayarları */
.featured-item img {
    width: 100%; /* Genişliği tam doldur */
    height: 220px; /* SABİT YÜKSEKLİK: Tüm resimler aynı boyda olacak */
    object-fit: cover; /* ÖNEMLİ: Resim bu alana sığmak için akıllıca kırpılır, sünmez/yamulmaz */
    transition: transform 0.5s ease; /* Zoom efekti için yumuşak geçiş */
}

/* 3. Metin Alanları Düzenlemesi */
.featured-item h4 {
    font-size: 18px;
    font-weight: 600;
    margin-top: 15px;
    padding: 0 15px; /* Yanlardan boşluk */
    color: #333;
}

.featured-item h6 {
    font-size: 14px;
    color: #3a8bcd; /* Senin tema rengin (mavi) */
    font-weight: 500;
    margin-bottom: 20px;
    padding: 0 15px; /* Yanlardan boşluk */
}

/* --- HOVER (Üzerine Gelince) EFEKTLERİ --- */

/* Kartın üzerine gelince kartı yukarı kaldır ve gölgeyi belirginleştir */
.featured-item:hover {
    transform: translateY(-10px); /* Kartı 10px yukarı iter */
    box-shadow: 0 15px 30px rgba(0,0,0,0.15); /* Gölgeyi derinleştirir */
}

/* Kartın üzerine gelince içindeki resmi hafifçe büyüt (Zoom Efekti) */
.featured-item:hover img {
    transform: scale(1.1); /* Resmi %10 büyütür */
}
.owl-theme .owl-dots {
	text-align: center;
	margin-top: 30px;
}
.owl-theme .owl-dots .owl-dot {
	outline: none;
}
.owl-theme .owl-dots .active span {
	background-color: #3a8bcd!important;
}
.owl-theme .owl-dots .owl-dot span {
	background-color: #aaa;
	width: 8px;
	height: 8px;
	display: inline-block;
	margin: 0px 5px;
	outline: none;
}



/* Subscribe Style */
.subscribe-form {
	background-color: #3a8bcd;
	padding: 80px 0px;
	text-align: center;
}
.subscribe-form .section-heading  {
	margin-top: 0px;
}
.subscribe-form .section-heading h1 {
	color: #fff;
}
.subscribe-form .section-heading .line-dec {
	background-color: #fff;
	margin: 0 auto;
}
.subscribe-form .main-content p {
	font-size: 17px;
	color: #fff;
	margin-bottom: 30px;
}
.subscribe-form .main-content form  {
	color: #fff;
	display: inline;
}
.subscribe-form .main-content form input {
	display: inline;
}
.subscribe-form .main-content form input {
	width: 100%;
	height: 46px;
	border: 1px solid #fff;
	background-color: transparent;
	padding-left: 15px;
	color: #fff;
	outline: none;
}
.subscribe-form .main-content form button:focus {
	color: #fff!important;
}
.subscribe-form .main-content form button {
	width: 100%;
	height: 45px;
	cursor: pointer;
	background-color: #fff;
	outline: none;
	border-radius: 5px;
	padding: 10px 15px;
	display: inline-block;
	color: #3a8bcd;
	font-size: 14px;
	text-transform: uppercase;
	font-weight: 300;
	letter-spacing: 0.4px;
	text-decoration: none;
	transition: all 0.5s;
	box-shadow: none;
	border: none;
}


/* Footer Style */
.footer {
	text-align: center;
}
.footer ul {
	padding: 0px;
	margin: 0px;
}
.footer ul li {
	list-style: none;
	display: inline-block;
}
.footer .logo img {
	max-width: 100%;
	margin-top: 60px;
	margin-bottom: 40px;
}
.footer .footer-menu {
	margin-bottom: 40px;
}
.footer .footer-menu ul li {
	margin: 0px 15px;
}
.footer .footer-menu a {
	font-size: 13px;
	color: #7a7a7a;
	text-transform: uppercase;
	transition: all 0.5s;
}
.footer .footer-menu a:hover {
	color: #3a8bcd;
	text-decoration: none;
}
.footer .social-icons {
	margin-bottom: 60px;
}
.footer .social-icons ul li {
	margin: 0px 10px;
}
.footer .social-icons a {
	width: 32px;
	height: 32px;
	color: #fff;
	background-color: #aaa;
	text-align: center;
	display: inline-block;
	line-height: 33px;
	border-radius: 50%;
	font-size: 13px;
	transition: all 0.5s;
}
.footer .social-icons a:hover {
	background-color: #3a8bcd;
}

/* Sub Footer Style */
.sub-footer {
	border-top: 1px solid #eee;
	text-align: center;
}
.sub-footer p {
	font-size: 12px;
	color: #7a7a7a;
	line-height: 60px;
}
.sub-footer a {
	color: #3a8bcd;
	text-decoration: none;
}

/* Featured Page Style */
.featured-page {
	margin-top: 130px;
	margin-bottom: 40px;
}
.featured-page .section-heading {
	margin-top: 0px;
	margin-bottom: 0px;
}
.featured-page #filters {
	margin-top: 15px;
	text-align: right;
}
.featured .featured-item {
	margin-bottom: 30px;
	text-decoration: none;
}
.featured .featured-item h4 {
	transition: all 0.5s;
}
.featured .featured-item:hover h4 {
	color: #3a8bcd;
}
#filter button {
	outline: none;
}
#filter .btn-primary.focus,
.btn-primary:focus {
	color: #3a8bcd!important;
	box-shadow: none!important;
}
#filters .btn-primary {
	color: #1e1e1e;
	border: none;
	font-size: 15px;
	font-weight: 700;
	background-color: transparent;
}
/* Isotope Transitions
------------------------------- */
.isotope,
.isotope .item {
  -webkit-transition-duration: 0.8s;
     -moz-transition-duration: 0.8s;
      -ms-transition-duration: 0.8s;
       -o-transition-duration: 0.8s;
          transition-duration: 0.8s;
}

.isotope {
  -webkit-transition-property: height, width;
     -moz-transition-property: height, width;
      -ms-transition-property: height, width;
       -o-transition-property: height, width;
          transition-property: height, width;
}

.isotope .item {
  -webkit-transition-property: -webkit-transform, opacity;
     -moz-transition-property:    -moz-transform, opacity;
      -ms-transition-property:     -ms-transform, opacity;
       -o-transition-property:         top, left, opacity;
          transition-property:         transform, opacity;
}

.page-navigation {
    width: 100%;
    text-align: center;
    display: block;
}

.page-navigation .container .row .col-md-12 {
    display: flex;
    justify-content: center;
    width: 100%;
}

.page-navigation ul {
    display: inline-flex; /* Kutuyu içeriği kadar yapar */
    justify-content: center; /* İçindekileri ortalar */
    align-items: center;
    text-align: center;
    border-top: 1px solid #eee;
    padding: 30px 0px 0px 0px;
    margin: 0px auto 80px auto; /* auto ile sağdan soldan ortalar */
    width: auto; /* %100 yerine auto yapıyoruz ki taşmasın */
    float: none;
}

.page-navigation ul li {
    display: inline-block;
    float: none; /* Sola yaslanmayı engeller */
    margin: 0 3px; /* Kutucuklar arasına mesafe */
}

.page-navigation ul li a {
    width: 40px;
    height: 40px;
    display: flex; /* İçindeki rakamı ortalamak için */
    justify-content: center;
    align-items: center;
    border: 1px solid #eee;
    border-radius: 5px;
    font-weight: 700;
    color: #1e1e1e;
    font-size: 15px;
    text-decoration: none;
    transition: all 0.5s;
}

.page-navigation ul li a:hover,
.page-navigation ul li.current-page a {
    background-color: #3a8bcd;
    border-color: #3a8bcd;
    color: #fff;
}



/* Single Product Style */
.single-product .product-slider {
	padding: 20px;
	border: 1px solid #eee!important;
	border-radius: 5px;
}
.flexslider {
	border: none!important;
}
#carousel {
	margin-top: 20px;
}
#carousel .slides li {
	width: 150px!important;
}
.single-product .right-content h4 {
	font-size: 17px;
	font-weight: 700;
	margin-top: 0px;
}
.single-product .right-content h6 {
	color: #3a8bcd;
	font-size: 17px;
	font-weight: 700;
	margin-top: 10px;
}
.single-product .right-content p {
	margin-top: 20px;
	margin-bottom: 30px;
}
.single-product .right-content span {
	font-size: 14px;
	color: #3a8bcd;
	font-weight: 500;
	display: inline-block;
	margin-bottom: 15px;
}
.single-product .right-content label {
	font-size: 14px;
	color: #4a4a4a;
}
.single-product .right-content .quantity-text {
	margin-left: 10px;
	width: 44px;
	height: 44px;
	line-height: 42px;
	font-size: 14px;
	font-weight: 700;
	color: #4a4a4a;
	display: inline-block;
	text-align: center;
	outline: none;
	border: 1px solid #eee;
}
.single-product .right-content .button {
	margin-left: 15px;
	cursor: pointer;
	background-color: #3a8bcd;
	outline: none;
	border-radius: 5px;
	padding: 10px 15px;
	display: inline-block;
	color: #fff;
	font-size: 14px;
	text-transform: uppercase;
	font-weight: 300;
	letter-spacing: 0.4px;
	text-decoration: none;
	transition: all 0.5s;
	box-shadow: none;
	border: none;
}
.single-product .right-content .down-content span {
	margin-bottom: 0px;
	display: inline-block;
	margin-left: 8px;
	color: #aaa;
}
.single-product .right-content .down-content span a {
	color: #aaa;
	font-weight: 400;
	margin-left: 4px;
	transition: all 0.5s;
}
.single-product .right-content .down-content span a:hover {
	color: #3a8bcd;
}
.single-product .right-content .down-content span a:hover i {
	background-color: #3a8bcd;
}
.single-product .right-content .down-content span a i {
	transition: all 0.5s;
	background-color: #aaa;
	width: 26px;
	height: 26px;
	display: inline-block;
	text-align: center;
	line-height: 26px;
	border-radius: 50%;
	color: #fff;
	font-size: 12px;
	margin-right: 5px;
}
.single-product .right-content .down-content .categories {
	border-top: 1px solid #eee;
	margin-top: 30px;
	padding: 10px 0px;
}
.single-product .right-content .down-content .share {
	border-top: 1px solid #eee;
	padding: 10px 0px;
}
.single-product .right-content .down-content h6 {
	font-size: 14px;
	color: #4a4a4a;
	font-weight: 400;
}



/* About Us Style */
.about-page {
	margin-top: 50px;
    margin-bottom: 80px;
}
.about-page .right-content h4 {
	font-size: 17px;
	font-weight: 700;
	margin-top: 0px;
	margin-bottom: 20px;
}
.about-page .left-image img {
	max-width: 100%;
}
.about-page .right-content span {
	display: inline-block;
	margin-left: 8px;
}
.about-page .right-content span a i {
	transition: all 0.5s;
	background-color: #aaa;
	width: 26px;
	height: 26px;
	display: inline-block;
	text-align: center;
	line-height: 26px;
	border-radius: 50%;
	color: #fff;
	font-size: 12px;
	margin-right: 5px;
}
.about-page .right-content .share {
	margin-top: 20px;
	border-top: 1px solid #eee;
	padding: 15px 0px;
}
.about-page .right-content h6 {
	font-size: 14px;
	color: #4a4a4a;
	font-weight: 400;
}
.about-page .right-content span a:hover i {
	background-color: #3a8bcd;
}




/* Contact Page Style */
.contact-page {
	margin-top: 50px;
    margin-bottom: 80px;
}
.contact-page .right-content input,
.contact-page .right-content textarea {
	border-radius: 0px;
	outline: none;
	box-shadow: none;
	font-size: 14px;
	margin-bottom: 30px;
}
.contact-page .right-content input {
	height: 44px;
	line-height: 44px;
}
.contact-page .right-content textarea {
	height: 200px;
	max-height: 280px;
}
.contact-page .right-content span {
	display: inline-block;
	margin-left: 8px;
}
.contact-page .right-content span a i {
	transition: all 0.5s;
	background-color: #aaa;
	width: 26px;
	height: 26px;
	display: inline-block;
	text-align: center;
	line-height: 26px;
	border-radius: 50%;
	color: #fff;
	font-size: 12px;
	margin-right: 5px;
}
.contact-page .right-content .share {
	margin-top: 30px;
	border-top: 1px solid #eee;
	padding: 15px 0px;
}
.contact-page .right-content h6 {
	font-size: 14px;
	color: #4a4a4a;
	font-weight: 400;
}
.contact-page .right-content span a:hover i {
	background-color: #3a8bcd;
}
.contact-page .right-content .button {
	cursor: pointer;
	background-color: #3a8bcd;
	outline: none;
	border-radius: 5px;
	padding: 10px 15px;
	display: inline-block;
	color: #fff;
	font-size: 14px;
	text-transform: uppercase;
	font-weight: 300;
	letter-spacing: 0.4px;
	text-decoration: none;
	transition: all 0.5s;
	box-shadow: none;
	border: none;
}






/* Responsive Style */
@media (max-width: 991px) {

	.banner {
		border-top: none;
		margin-top: 0px;
	}
	.navbar .navbar-brand {
		width: auto;
	}
	.navbar:after {
		display: none;
	}
	#navbarResponsive {
	    z-index: 99999;
	    position: absolute;
	    top: 96px;
	    width: 100%;
	    text-align: center;
	    background-color: rgba(250,250,250,0.95);
	    box-shadow: 0px 10px 10px rgba(0,0,0,0.1);
	}
	.navbar-dark .navbar-nav .nav-item {
		border-bottom: 1px solid #eee;
	}
	.navbar-dark .navbar-nav .nav-item:last-child {
		border-bottom: none;
	}
	.navbar-dark .navbar-nav .nav-link {
		padding: 15px 0px;
	}
	.featured-page #filters {
		text-align: right;
	} 
	.single-product .right-content {
		margin-top: 30px;
	}
	.about-page .right-content {
		margin-top: 30px;
	}
	.contact-page .right-content {
		margin-top: 30px;
	}
	.contact-page .right-content .col-md-6,
	.contact-page .right-content .col-md-12 {
		padding: 0px;
	}
	.featured-page {
		margin-top: 80px;
	}
	.about-page,
	.contact-page {
		margin-top: 0px;
	}

}

@media (max-width: 767px) {

	.subscribe-form .main-content form input.button {
		margin-top: 20px;
	}
	.featured-page #filters {
		margin-top: 15px;
		text-align: left;
	} 

}
.navbar-brand img {
    height: 150px; /* İstediğin boyut */
    width: auto;  /* Orantıyı koruması için */
}

.featured-item img {
    width: 100%;         /* Genişlik kutuya tam otursun */
    height: 300px;       /* Yükseklik hepsinde sabit olsun (İsteğine göre 250px veya 350px yapabilirsin) */
    object-fit: cover;   /* ÖNEMLİ: Resim sündürülmesin, kutuya sığmayan yerleri kessin */
}

/* "Bizi Takip Edin" yazısı ile ikonları hizalar */
.share h6 {
    display: flex;
    align-items: center;
    font-size: 16px;
    font-weight: 600;
}

/* İkonların olduğu kapsayıcı */
.share span {
    margin-left: 15px; /* Yazıdan uzaklaştırır */
}

/* İkon butonlarının genel ayarları */
.share span a {
    display: inline-flex;
    width: 40px;          /* Genişlik */
    height: 40px;         /* Yükseklik */
    background-color: #eee; /* Gri zemin */
    color: #333;          /* İkon rengi */
    border-radius: 50%;   /* Yuvarlak yapar */
    align-items: center;
    justify-content: center;
    margin-right: 5px;    /* Birbirinden uzaklaştırır */
    text-decoration: none;
    transition: all 0.3s ease; /* Yumuşak geçiş */
}

/* Üzerine gelince (Hover) ne olsun? */
.share span a:hover {
    background-color: #3a8bcd; /* Mavi renk (Wemex temana göre değiştir) */
    color: #fff; /* İkon beyaz olsun */
    transform: translateY(-3px); /* Hafif yukarı zıplasın */
}

/* Sertifikalar Alanı - Genişletme */
.certificates-section {
    border-bottom: 1px solid #ddd;
    background-color: #f8f9fa;
    padding-top: 50px !important;    /* Üstten boşluk artırıldı */
    padding-bottom: 50px !important; /* Alttan boşluk artırıldı */
}

/* Resim Stili - Büyütme */
.cert-thumb {
    width: auto;          /* Genişlik resme göre otomatik olsun */
    height: 160px;        /* Yükseklik 2 katına çıkarıldı (Eskisi 80px idi) */
    object-fit: contain;  /* KRİTİK AYAR: Resmi kesmeden (kırpmadan) kutuya sığdırır */
    
    background-color: #fff; /* Resimlerin arkası beyaz olsun, temiz dursun */
    border-radius: 5px;
    border: 1px solid #ddd;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1); /* Hafif gölge */
    cursor: pointer;
    transition: all 0.3s ease;
    
    /* Mobilde taşmaması için maksimum genişlik sınırı */
    max-width: 100%; 
}

.cert-thumb:hover {
    transform: scale(1.05); /* Üzerine gelince hafif büyüsün */
    border-color: #3a8bcd;
    box-shadow: 0 5px 15px rgba(0,0,0,0.2);
}


/* --- CAROUSEL ZORLA DÜZELTME BAŞLANGIÇ --- */

/* 1. Owl item içindeki Link etiketini düzelt */
.owl-carousel .owl-item a {
    display: block !important;
    width: 100% !important;
}

/* 2. Kartın kendisinin genişlik ayarını serbest bırak */
.featured-item {
    width: 100% !important; /* Genişlik %50 falan kaldıysa bunu %100 yapıp ezer */
    max-width: none !important; /* Maksimum genişlik sınırını kaldırır */
    margin: 0 auto !important; /* Sağa sola kaymayı engeller */
    display: block !important;
}

/* 3. Gereksiz paddingleri sıfırla */
.owl-carousel .owl-item {
    padding: 0 !important;
}

/* --- CAROUSEL ZORLA DÜZELTME BİTİŞ --- */

/* Kutuların genişlik inadını kıran kod */
#hizmetler-slider .featured-item {
    width: 100% !important; /* Genişliği serbest bırak */
    max-width: none !important;
    margin: 0 !important;
}

#hizmetler-slider .owl-item {
    width: auto !important; /* Owl Carousel hesaplamasına izin ver */
}

/* --- Hizmet Bölgeleri CSS --- */
.regions-section {
    padding: 60px 0;
    background-color: #fff;
    border-bottom: 1px solid #eee;
}

.region-card {
    background: #f9f9f9;
    padding: 20px;
    border-radius: 10px;
    text-align: center;
    transition: all 0.3s ease;
    border: 1px solid #eee;
    height: 100%; /* Kutuların boyunu eşitle */
}

.region-card:hover {
    transform: translateY(-5px); /* Üzerine gelince yukarı kalksın */
    box-shadow: 0 10px 20px rgba(0,0,0,0.1);
    background: #fff;
    border-color: #3a8bcd;
}

.region-card h5 {
    font-size: 18px;
    font-weight: 700;
    color: #1e1e1e;
    margin-bottom: 15px;
    border-bottom: 2px solid #3a8bcd; /* Şehrin altına çizgi */
    display: inline-block;
    padding-bottom: 5px;
}

.preview-list {
    list-style: none;
    padding: 0;
    margin: 0 0 15px 0;
    color: #666;
    font-size: 14px;
}

.preview-list li {
    margin-bottom: 5px;
}

.show-all-btn {
    font-size: 13px;
    font-weight: 600;
    color: #3a8bcd;
    text-decoration: none;
    cursor: pointer;
    transition: color 0.2s;
}

.show-all-btn:hover {
    color: #1e1e1e;
    text-decoration: underline;
}

/* Modal içi düzenleme */
.modal-title {
    color: #3a8bcd;
    font-weight: 700;
}

/* --- MODERN FOOTER CSS --- */

.modern-footer {
    background-color: #000b29; /* Fotoğraftaki o koyu lacivert ton */
    padding: 60px 0 30px 0;
    color: #ffffff;
    font-family: 'Roboto', sans-serif; /* Varsa sitenin fontu */
}

/* Logo Alanı */
.logo-circle {
    width: 150px;
    height: 150px;
    background: #000b29;
    border-radius: 50%;
    /* İçindekileri tam ortalar */
    display: flex;       
    align-items: center; 
    justify-content: center;
    margin: 0 auto;
    overflow: hidden; /* Dışarı taşan kısımları tıraşla */
    padding: 0; /* Boşluk bırakma */
}

.logo-circle img {
    /* Genişliği %100 yaparsak dikdörtgen olduğu için küçük kalır */
    /* O yüzden genişliği artırıp logoyu zorla büyütüyoruz */
    width: 90% !important; 
    
    /* Eğer logonun kenarlarında boşluk varsa bu kod onu yakınlaştırır (Zoom) */
    /* 1.2 değerini artırırsan logo daha da büyür (örn: 1.4, 1.5) */
    transform: scale(1.3); 
}

/* Menü Linkleri */
.footer-nav ul {
    padding: 0;
    margin: 0;
    list-style: none;
}

.footer-nav li {
    margin-bottom: 20px; /* Linkler arası boşluk */
}

.footer-nav a {
    color: #ffffff;
    font-size: 14px;
    font-weight: 500;
    text-transform: uppercase; /* Hepsini BÜYÜK HARF yap */
    text-decoration: none;
    letter-spacing: 0.5px;
    transition: opacity 0.3s;
}

.footer-nav a:hover {
    opacity: 0.7;
    color: #3a8bcd; /* Üzerine gelince mavi olsun */
}

/* Açıklama Metni */
.footer-description p {
    color: #8f9bb3; /* Hafif gri/mavi tonlu yazı rengi */
    font-size: 14px;
    line-height: 1.6;
    max-width: 600px;
    margin: 0 auto; /* Metni ortala */
    padding: 0 15px;
}

/* Sosyal Medya */
.footer-social a {
    color: #8f9bb3;
    font-size: 24px;
    margin: 0 15px;
    text-decoration: none;
    transition: color 0.3s;
}

.footer-social a:hover {
    color: #ffffff;
}

/* En Alt Kısım */
.footer-bottom {
    border-top: 1px solid rgba(255,255,255,0.1); /* İnce bir çizgi */
    padding-top: 30px;
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
}

.bottom-links a, 
.bottom-links span {
    color: #8f9bb3;
    font-size: 13px;
    margin: 0 10px;
    text-decoration: none;
}

/* Sol alttaki ikon süsü (Opsiyonel) */
.cookie-icon {
    position: absolute;
    left: 10px;
    bottom: 0;
    color: #fff;
    font-size: 20px;
    opacity: 0.5;
}

/* Mobilde ikonun yeri karışmasın diye düzenleme */
@media (max-width: 768px) {
    .cookie-icon {
        position: relative;
        left: auto;
        margin-top: 20px;
    }
}

/* Arka plan rengi ve genel ayarlar */
#pre-header {
    background-color: #006da0; /* Görseldeki okyanus mavisi tonu */
    color: #ffffff;
    padding: 10px 0;
    font-size: 14px;
    font-family: sans-serif;
}

/* Linklerin rengini beyaz yapalım */
#pre-header a {
    color: #ffffff;
    text-decoration: none;
}

/* Sosyal Medya İkonları - Yuvarlak Çerçeve */
.social-icons a {
    display: inline-block;
    width: 30px;
    height: 30px;
    line-height: 28px;
    border: 1px solid rgba(255,255,255,0.5);
    border-radius: 50%;
    text-align: center;
    margin-right: 5px;
    transition: all 0.3s ease;
}

.social-icons a:hover {
    background-color: #ffffff;
    color: #006da0;
    border-color: #ffffff;
}

/* İkonlar ve metinler arası boşluklar */
.contact-info i {
    color: #f0ad4e; /* Telefon ve mail ikonlarını turuncu yapar (isteğe bağlı) */
    margin-right: 5px;
}

.contact-info span {
    margin-left: 15px;
}

/* Mobilde alt alta gelince düzgün görünmesi için */
@media (max-width: 768px) {
    .social-icons, .contact-info {
        display: block !important;
        margin-bottom: 10px;
    }
    .contact-info span {
        display: block;
        margin: 5px 0;
        margin-left: 0;
    }
}

.trust-item:hover {
    transform: translateY(-5px); /* Yukarı doğru hafif kayar */
    background-color: #f9f9f9;
    border-radius: 10px;
}

/* Menü Linklerinin Genel Hali */
/* Alt Alta Geçmeyi Engeller */
.navbar-nav .nav-item .nav-link {
    white-space: nowrap;           /* KRİTİK KOMUT: Asla alt satıra geçme! */
    border-radius: 50px;
    padding: 10px 20px !important; /* Genişliği 25px'den 20px'e çektim, sığması kolay olsun */
    margin: 0 5px;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 13px;               /* Sığmazsa bunu 12px yapabilirsin */
    transition: all 0.4s ease;
    
    color: #888888 !important;     
    background-color: transparent; 
}

/* 1. TÜM BUTONLARIN SAKİN (SOLUK) HALİ */
.navbar-nav .nav-item .nav-link {
    border-radius: 50px;           /* Tam Oval (Hap Tasarım) */
    padding: 10px 25px !important; /* Buton içi genişlik */
    margin: 0 5px;                 /* Butonlar arası mesafe */
    font-weight: 600;              /* Yazı kalınlığı */
    text-transform: uppercase;     /* Büyük harf */
    font-size: 13px;               /* Kibar yazı boyutu */
    transition: all 0.4s ease;     /* Geçiş hızı */
    
    /* SOLUK GÖRÜNÜM AYARLARI BURADA */
    color: #888888 !important;     /* Soluk Gri Yazı Rengi */
    background-color: transparent; /* Arka plan yok (şeffaf) */
}

/* 2. MOUSE İLE ÜZERİNE GELİNCE (Hafif Canlanma) */
.navbar-nav .nav-item .nav-link:hover {
    color: #007bff !important;     /* Yazı rengini markanın rengi yap */
    background-color: rgba(0, 123, 255, 0.1); /* Çok hafif silik bir zemin ver */
}

/* 3. SEÇİLİ OLAN (ACTIVE) - CANLI HALİ */
.navbar-nav .nav-item.active .nav-link {
    background: linear-gradient(45deg, #007bff, #0056b3); /* Hafif degrade (modern durur) */
    color: #ffffff !important;     /* Yazı bembeyaz olsun */
    box-shadow: 0 4px 15px rgba(0, 123, 255, 0.4); /* Arkasına "glow" (ışık) ver */
    transform: scale(1.05);        /* Seçili olan diğerlerinden %5 daha büyük dursun */
}