/* =====================================================================================
   GÜRDAĞ EKLEMELERİ — temanın (style.css) üstüne yazılan kendi stillerimiz.
   Temanın dosyalarına dokunmamak için buradalar; _Layout.cshtml'de style.css'ten SONRA yüklenir.
   ===================================================================================== */

/* ---------- Yazı tipi: Inter (kendi sunucumuzdan) ----------
   Önceden Google Fonts'tan geliyordu: ayrı sunucuya bağlantı + sayfanın çizimini bloke eden CSS + italik ve
   "opsz" ekseniyle 3 dosya (~280 KB). Şimdi tek değişken font (100–900 kalınlık), iki parça:
     inter-latin.woff2  : Latin harfleri, rakamlar, noktalama (ı dahil)
     inter-turkce.woff2 : sadece Ğ ğ İ Ş ş ₺ (Google'ın 85 KB'lık latin-ext dosyasından ayıklandı)
   Tarayıcı unicode-range'e bakıp sadece gereken parçayı indirir. _Layout.cshtml'de latin parçası preload edilir. */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('../fonts/inter-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('../fonts/inter-turkce.woff2') format('woff2');
  unicode-range: U+011E-011F, U+0130, U+015E-015F, U+20BA;
}

/* ---------- Ana sayfa banner'ı (Views/Home/_Banner.cshtml) ----------
   Görsel, başlık ve kısa açıklama slayt slayt birlikte değişir (gurdag.js → "Banner döndürücü").
   Sadece "aktif" sınıfı olan slayt görünür; geçiş opacity ile yapılır (GPU'da çalışır). */

/* Arka plan fotoğrafları: üst üste durur. Temadaki .bg-image:before (renk geçişli örtü, z-index 1)
   fotoğrafların üstünde kalmaya devam eder. */
.banner-gorseller img {
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity 1.2s ease-in-out;
}
.banner-gorseller > .aktif img {
  opacity: 1;
}

/* Başlık ve açıklama: hepsi aynı hücreye (grid-area 1/1) yığılır. Böylece alan en uzun metin
   kadar yer kaplar ve slayt değişince alttaki içerik zıplamaz. */
.banner-yigin {
  display: grid;
}
.banner-yigin > * {
  grid-area: 1 / 1;
  opacity: 0;
  visibility: hidden;
  transition: opacity .8s ease, visibility .8s;
}
.banner-yigin > .aktif {
  opacity: 1;
  visibility: visible;
}

/* Temanın başlığı 3 kelimelik demo metnine göre çok büyüktü (110px). Panelden gelen başlıklar
   daha uzun (5-6 kelime); taşmasın diye küçültüldü. */
.banner-section .outer-box .outer-container .inner-container .banner-content .banner-title {
  font-size: clamp(32px, 5.2vw, 76px);
}

/* "Hareketi azalt" ayarı açık kullanıcılarda yumuşak geçiş yerine direkt değişsin */
@media (prefers-reduced-motion: reduce) {
  .banner-gorseller img,
  .banner-yigin > * { transition: none; }
}
/* =====================================================================================
   LOGO (_Layout.cshtml → Logo()) — panelden yüklenen logo + yanında site adı
   Yüklenen logo kare ve kenarlarında boşluk var; o yüzden genişlik değil YÜKSEKLİK veriliyor
   (width:auto → başka oranda bir logo yüklenirse de bozulmaz).
   ===================================================================================== */
.site-logo {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  text-decoration: none;
}
.site-logo img {
  height: 64px;
  width: auto;
  max-width: none !important;  /* temanın logo genişlik/yükseklik sınırları kare logoyu sıkıştırmasın */
  max-height: none !important;
}
/* Site adı: ilk kelime büyük, kalanı altında küçük ve aralıklı (GÜRDAĞ / ENTEGRE) */
.site-logo-yazi {
  font-family: var(--heading-font-family);
  font-size: 22px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: #161616;
}
.site-logo-yazi small {
  display: block;
  margin-top: 4px;
  font-size: 11.5px;
  font-weight: 600;
  letter-spacing: 5.2px;
  color: #0a7b41; /* logodaki yeşil */
}
.site-logo.koyu .site-logo-yazi { color: #fff; }
.site-logo.koyu .site-logo-yazi small { color: var(--theme-color1); }

/* Koyu zeminde beyaz logo yoksa renkli logoyu açık renge çevir:
   invert → siyah beyaz olur, yeşil pembeye döner; hue-rotate(180) pembeyi tekrar (açık) yeşile çevirir.
   Panelden "Beyaz Logo" yüklenince bu sınıf kullanılmaz. */
.logo-acik {
  filter: invert(1) hue-rotate(180deg);
}

/* Yerine göre boyutlar. Temanın ".main-header .logo img { height:auto }" kuralını geçmek için
   seçiciler en az onun kadar güçlü yazıldı (sonra yüklendiği için eşit güçte bizimki kazanır). */
.main-header .site-logo img { height: 64px; }
.main-header .sticky-header .site-logo img { height: 54px; }
.mobile-menu .nav-logo .site-logo img { height: 52px; }
.footer-style-one .footer-logo { max-width: none !important; }
.footer-style-one .footer-logo .site-logo img { height: 92px; }
.footer-style-one .footer-logo .site-logo-yazi { font-size: 30px; }
.footer-style-one .footer-logo .site-logo-yazi small { font-size: 15px; letter-spacing: 7.4px; }

@media (max-width: 575.98px) {
  .main-header .site-logo img { height: 52px; }
  .site-logo-yazi { font-size: 19px; }
  .site-logo-yazi small { font-size: 10px; letter-spacing: 4.4px; }
}

/* =====================================================================================
   FOOTER / MOBİL MENÜ İLETİŞİM BİLGİLERİ
   ===================================================================================== */
/* Adres panelde birden çok satıra yazılabiliyor; satır sonları korunsun */
.adres-metni { white-space: pre-line; }

.footer-bilgiler {
  margin: 22px 0 0;
  padding: 0;
  list-style: none;
}
.footer-bilgiler li {
  display: flex;
  gap: 12px;
  margin-bottom: 10px;
  font-size: 15px;
  line-height: 24px;
  color: rgba(255, 255, 255, .7);
}
.footer-bilgiler li i {
  flex: 0 0 16px;
  margin-top: 5px;
  font-size: 14px;
  color: var(--theme-color1);
  text-align: center;
}
.footer-bilgiler a { color: inherit; }
.footer-bilgiler a:hover { color: var(--theme-color1); }

/* X (Twitter): temanın Font Awesome sürümünde ikonu yok, harfle gösteriliyor */
.x-ikon { font-weight: 700; font-style: normal; line-height: 1; }
/* 𝕏 harfi CSS ile yazılır: metin olarak yazılınca linkin görünen yazısı (𝕏) ile ekran okuyucu adı ("X'te paylaş")
   uyuşmuyor diye erişilebilirlik hatası veriyordu. */
.x-ikon::before { content: "\1D54F"; }

/* =====================================================================================
   REFERANS LOGO ŞERİDİ (Views/Home/_Referanslar.cshtml)
   Firmaların logoları farklı renk ve oranda; şerit dağınık görünmesin diye hepsi aynı kutuya
   sığdırılır, gri ve soluk durur, üzerine gelince renklenir.
   ===================================================================================== */
.referans-serit { padding-bottom: 20px; }
.referans-serit .brand-box-1 { height: 110px; line-height: normal; }
.referans-serit .brand-img-1 { padding: 10px 24px; }
.referans-serit .brand-img-1 img {
  max-width: 100%;
  max-height: 70px;
  object-fit: contain;
  filter: grayscale(1);
  opacity: .6;
}
.referans-serit .brand-box-1:hover .brand-img-1:last-child img {
  filter: none;
  opacity: 1;   /* tema burada .5 veriyor; gerçek logolar renkli ve net görünsün */
}

/* Az logo varken kaydırıcı yerine ortalanmış sabit sıra */
.referans-sabit {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
.referans-sabit-oge { flex: 0 0 20%; max-width: 220px; }
@media (max-width: 991.98px) { .referans-sabit-oge { flex-basis: 33.333%; } }
@media (max-width: 575.98px) { .referans-sabit-oge { flex-basis: 50%; } }

/* =====================================================================================
   İÇ SAYFALAR — hizmet / blog / kurumsal / iletişim
   ===================================================================================== */

/* Panelin zengin metin editöründen gelen içerik (Html.Raw). Editör sade HTML üretir;
   başlık, paragraf, liste, tablo ve görseller temaya uygun aralıklarla dizilsin. */
.icerik-metni { color: var(--text-color, #6b6b6b); font-size: 16px; line-height: 1.8; }
.icerik-metni > :first-child { margin-top: 0; }
.icerik-metni h2, .icerik-metni h3, .icerik-metni h4 { color: var(--headings-color); margin: 32px 0 12px; line-height: 1.3; }
.icerik-metni h2 { font-size: 28px; }
.icerik-metni h3 { font-size: 22px; }
.icerik-metni h4 { font-size: 18px; }
.icerik-metni p { margin: 0 0 16px; }
.icerik-metni ul, .icerik-metni ol { margin: 0 0 16px; padding-left: 22px; }
.icerik-metni ul li { list-style: disc; margin-bottom: 6px; }
.icerik-metni ol li { list-style: decimal; margin-bottom: 6px; }
.icerik-metni img { max-width: 100%; height: auto; border-radius: 12px; margin: 8px 0 16px; }
.icerik-metni a { color: var(--theme-color1); text-decoration: underline; }
.icerik-metni blockquote { border-left: 4px solid var(--theme-color1); padding: 8px 0 8px 20px; margin: 20px 0; font-style: italic; }
.icerik-metni table { width: 100%; border-collapse: collapse; margin: 0 0 16px; }
.icerik-metni th, .icerik-metni td { border: 1px solid #e5e5e5; padding: 8px 12px; }

/* Kısa açıklama / özet: içeriğin önünde vurgulu giriş cümlesi */
.icerik-giris { font-size: 18px; line-height: 1.7; color: var(--headings-color); font-weight: 500; margin-bottom: 20px; }
.kurumsal-slogan {
  font-family: var(--heading-font-family);
  font-size: clamp(22px, 2.6vw, 30px);
  font-weight: 600;
  line-height: 1.35;
  color: var(--headings-color);
  border-left: 5px solid var(--theme-color1);
  padding-left: 20px;
  margin-bottom: 28px;
}

/* Hizmet detayı */
.hizmet-kapak { border-radius: 20px; aspect-ratio: 16 / 9; object-fit: cover; }
.hizmet-maddeleri .acc-content .content { overflow: hidden; }
.hizmet-madde-gorsel { float: right; width: 140px; border-radius: 10px; margin: 0 0 10px 16px; }
.hizmet-galeri-oge { display: block; border-radius: 12px; overflow: hidden; }
.hizmet-galeri-oge img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; transition: transform .4s ease; }
.hizmet-galeri-oge:hover img { transform: scale(1.05); }
/* Yan menüde bulunulan sayfa: temanın "current" rengi açık zeminde okunmuyordu → koyu yeşil zemin, beyaz yazı.
   (Açık yeşil #93bd33 üstünde beyaz yazının kontrastı 2.2; koyu yeşilde 9.6 → erişilebilirlik için en az 4.5 gerekir.) */
.sidebar-service-list li.current a { background-color: var(--theme-color3); color: #fff; }
.sidebar-service-list li.current a i { background-color: #fff; color: var(--theme-color3); }

/* Tarihçe zaman çizelgesi */
.zaman-cizelgesi { list-style: none; margin: 0; padding: 0 0 0 28px; border-left: 2px solid #e3eccd; }
.zaman-cizelgesi li { position: relative; padding: 0 0 32px 24px; }
.zaman-cizelgesi li::before {
  content: ""; position: absolute; left: -38px; top: 4px;
  width: 18px; height: 18px; border-radius: 50%;
  background: var(--theme-color1); box-shadow: 0 0 0 5px #fff, 0 0 0 7px #e3eccd;
}
.zaman-yil { display: inline-block; font-family: var(--heading-font-family); font-weight: 700; font-size: 22px; color: var(--theme-color1); margin-bottom: 6px; }
.zaman-icerik h3 { margin: 0 0 6px; }
.zaman-icerik p { margin: 0; }
.zaman-icerik img { float: right; width: 120px; border-radius: 10px; margin: 0 0 8px 16px; }

/* Grup şirketleri */
.grup-sirket { display: flex; gap: 16px; align-items: flex-start; height: 100%; padding: 20px; border: 1px solid #ececec; border-radius: 16px; }
.grup-sirket.cati { border-color: var(--theme-color1); background: #f7faef; }
.grup-sirket-logo { flex: 0 0 72px; height: 72px; display: flex; align-items: center; justify-content: center; border-radius: 12px; background: #fff; border: 1px solid #ececec; font-size: 26px; color: #9aa; }
.grup-sirket-logo img { max-width: 60px; max-height: 60px; object-fit: contain; }
.grup-sirket h3 { margin: 0 0 6px; }
.grup-sirket p { margin: 0 0 6px; font-size: 15px; }

/* Kariyer kutusu */
.kariyer-kutusu { display: flex; flex-wrap: wrap; gap: 20px; align-items: center; justify-content: space-between; padding: 28px 30px; border-radius: 20px; background: #f7faef; }
.kariyer-kutusu h3 { margin: 0 0 6px; }
.kariyer-kutusu p { margin: 0; }

/* Blog */
.blog-liste .blog__item { margin-bottom: 30px; }
.blog-liste .entry-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 14px; }
.blog-tarih { font-size: 14px; color: #888; }
.blog-ozet { margin: 10px 0 0; font-size: 15px; line-height: 1.6; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.blog-bos { text-align: center; padding: 60px 20px; border: 1px dashed #ddd; border-radius: 20px; color: #777; }
.blog-bos i { font-size: 44px; color: var(--theme-color1); margin-bottom: 14px; display: block; }
.blog-arama-bilgi { margin-bottom: 24px; padding: 12px 18px; border-radius: 12px; background: #f7faef; }
.sayfalama ul { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin: 20px 0 0; padding: 0; list-style: none; }
.sayfalama a {
  display: flex; align-items: center; justify-content: center;
  min-width: 46px; height: 46px; padding: 0 10px; border-radius: 50%;
  border: 1px solid #e5e5e5; color: var(--headings-color); font-weight: 600;
}
.sayfalama a:hover, .sayfalama a.aktif { background: var(--theme-color1); border-color: var(--theme-color1); color: #fff; }

/* İletişim formu */
.form-hata { display: block; margin-top: 4px; font-size: 14px; color: #d63939; }
.form-hata:empty { display: none; }
.contact-details .form-control.input-validation-error { border-color: #d63939; }
.iletisim-sonuc { display: flex; gap: 14px; align-items: flex-start; margin-bottom: 24px; padding: 16px 20px; border-radius: 14px; background: #eef7e2; color: #2f5d0a; }
.iletisim-sonuc i { font-size: 24px; color: var(--theme-color1); margin-top: 2px; }
.iletisim-sonuc strong { display: block; }
/* Bot tuzağı: ekranda görünmez (display:none yerine ekran dışı; bazı botlar display:none alanları atlıyor) */
.bot-tuzagi { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }

/* =====================================================================================
   ÜST MENÜ SIĞDIRMA — menüde 7 öğe var (temanın demo menüsünde 5 taneydi). Temanın
   ayarlarıyla menü 1440px altındaki ekranlarda ikinci satıra taşıyordu. Genişliğe göre:
     1500px ve üstü : öğe arası 26px (tema 40px)
     1280 - 1499px  : öğe arası 16px, yazı 13px
     1200 - 1399px  : sağdaki "Atık Danışma Hattı" kutusu sadece ikon (link aynı)
     1200 - 1279px  : öğe arası 11px, yazı 12.5px; hamburger düğmesi gizli (menü zaten açıkta)
     1199px ve altı : masaüstü menüsü yerine hamburger menü (tema bunu 1024px'te yapıyordu;
                      1025-1199px arasında 7 öğe hiçbir şekilde sığmıyor)
   ===================================================================================== */
@media (min-width: 1200px) {
  .header-style-one .header-lower .inner-container .nav-outer .main-menu .navigation > li { margin-left: 26px; }
  .main-header .main-menu .navigation > li > a { white-space: nowrap; }
}
@media (min-width: 1200px) and (max-width: 1499.98px) {
  .header-style-one .header-lower .inner-container .nav-outer { margin-right: 0; }
  .header-style-one .header-lower .inner-container .nav-outer .main-menu .navigation > li { margin-left: 16px; }
  .header-style-one .header-lower .inner-container .nav-outer .main-menu .navigation > li > a { font-size: 13px; }
}
@media (min-width: 1200px) and (max-width: 1399.98px) {
  .header-style-one .header-lower .inner-container .right-box .header-phone_box { padding: 6px; }
  .header-style-one .header-lower .inner-container .right-box .header-phone_box .info { display: none; }
}
@media (min-width: 1200px) and (max-width: 1279.98px) {
  .header-style-one .header-lower .inner-container .nav-outer .main-menu .navigation > li { margin-left: 11px; }
  .header-style-one .header-lower .inner-container .nav-outer .main-menu .navigation > li > a { font-size: 12.5px; }
  .header-style-one .header-lower .inner-container .right-box .mobile-nav-toggler { display: none; }
}
@media (max-width: 1199.98px) {
  .main-header .main-menu { display: none; }
  .main-header .mobile-nav-toggler { display: block !important; }
}
/* Aşağı kaydırınca çıkan beyaz yapışkan header: aynı menü, temada öğe arası 60px → aynı kademeler */
@media (min-width: 1200px) {
  .sticky-header .main-menu .navigation > li { margin-left: 30px; }
}
@media (min-width: 1200px) and (max-width: 1499.98px) {
  .sticky-header .main-menu .navigation > li { margin-left: 16px; }
  .sticky-header .main-menu .navigation > li > a { font-size: 13px; }
}
@media (min-width: 1200px) and (max-width: 1279.98px) {
  .sticky-header .main-menu .navigation > li { margin-left: 11px; }
  .sticky-header .main-menu .navigation > li > a { font-size: 12.5px; }
}

/* =====================================================================================
   ATIK BAŞVURU FORMU — /atik-formu (Views/AtikFormu, Web/js/atik-formu.js)
   ===================================================================================== */
.atik-formu .form-label { font-weight: 600; font-size: 15px; color: var(--theme-color2); margin-bottom: 6px; }
/* Temanın .form-control'ü (gri, 63px, geniş iç boşluk) burada açılır listelerle aynı boya getirilir. */
.atik-formu .form-control, .atik-formu .form-select { height: 50px; padding: 10px 16px; background-color: #fff; border: 1px solid #dfe3d8; border-radius: 10px; color: #111; font-size: 15px; }
.atik-formu .form-select { padding-right: 40px; }
.atik-formu textarea.form-control { height: auto; }
.atik-formu .form-control:focus, .atik-formu .form-select:focus { border-color: var(--theme-color1); box-shadow: 0 0 0 3px rgba(var(--theme-color1-rgb), .18); }
.atik-formu .input-validation-error { border-color: #d63939; }

.atik-blok { border: 1px solid #e8ecdf; border-radius: 16px; padding: 26px 26px 10px; margin-bottom: 28px; background: #fff; }
.atik-blok legend { float: none; width: auto; display: flex; align-items: center; gap: 12px; font-size: 20px; font-weight: 700; color: var(--theme-color2); margin-bottom: 18px; padding: 0; }
.atik-blok legend span { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 50%; background: var(--theme-color1); color: #fff; font-size: 16px; }
.atik-blok__aciklama { font-size: 15px; margin-bottom: 18px; color: #555; }

.atik-kalemi { position: relative; border: 1px solid #e4e8db; border-left: 4px solid var(--theme-color1); border-radius: 12px; padding: 18px 18px 4px; margin-bottom: 18px; background: #fafbf7; }
.atik-kalemi.tehlikeli { border-left-color: #e8590c; background: #fff8f3; }
.atik-kalemi__ust { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.atik-kalemi__no { font-weight: 700; color: var(--theme-color3); }
.atik-kalemi__sil { margin-left: auto; border: 0; background: none; color: #a33; font-size: 14px; padding: 4px 8px; border-radius: 6px; }
.atik-kalemi__sil:hover { background: #fbeaea; }
.atik-tehlikeli { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; color: #b54708; background: #ffead5; padding: 3px 10px; border-radius: 20px; }
.atik-tehlikeli[hidden] { display: none; }

.atik-ara { position: relative; }
.atik-ara > i { position: absolute; left: 16px; top: 18px; color: #8a8f80; pointer-events: none; }
.atik-ara .form-control { padding-left: 42px; }
.atik-ara__sonuc { position: absolute; z-index: 20; left: 0; right: 0; top: calc(100% + 4px); max-height: 320px; overflow-y: auto; background: #fff; border: 1px solid #dfe3d8; border-radius: 10px; box-shadow: 0 12px 30px rgba(0,0,0,.12); }
.atik-ara__oge { display: block; width: 100%; text-align: left; border: 0; border-bottom: 1px solid #f0f2ea; background: #fff; padding: 10px 14px; font-size: 14px; line-height: 1.45; color: #333; }
.atik-ara__oge:hover, .atik-ara__oge:focus { background: #f3f8e8; outline: none; }
.atik-ara__oge strong { color: var(--theme-color3); white-space: nowrap; }
.atik-ara__bos { padding: 12px 14px; font-size: 14px; color: #666; }

.atik-ekle { display: inline-flex; align-items: center; gap: 8px; border: 2px dashed var(--theme-color1); background: none; color: var(--theme-color3); font-weight: 600; border-radius: 10px; padding: 12px 20px; margin-bottom: 18px; }
.atik-ekle:hover { background: #f3f8e8; }
.atik-ekle[hidden] { display: none; }

.atik-onay { display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-start; font-size: 15px; }
.atik-onay .form-check-input { width: 20px; height: 20px; margin-top: 3px; flex: 0 0 auto; }
.atik-onay label { flex: 1; cursor: pointer; }
.atik-onay .form-hata { flex-basis: 100%; }

.atik-uyari { display: flex; gap: 10px; align-items: flex-start; padding: 14px 18px; border-radius: 12px; background: #fdecec; color: #8a1f1f; margin-bottom: 22px; }

.atik-basari { text-align: center; padding: 50px 30px; border-radius: 18px; background: #eef7e2; color: #2f5d0a; }
.atik-basari > i { font-size: 56px; color: var(--theme-color1); margin-bottom: 14px; }
.atik-basari h2 { color: var(--theme-color3); margin-bottom: 14px; }
.atik-basari__no { display: inline-block; font-size: 28px; font-weight: 800; letter-spacing: 1px; color: var(--theme-color3); background: #fff; border-radius: 12px; padding: 10px 26px; margin: 4px 0 10px; }
.atik-basari .theme-btn { margin-top: 10px; }

.atik-kenar { position: sticky; top: 120px; }
.atik-kenar__kutu { border-radius: 16px; background: #f5f7ef; padding: 28px; margin-bottom: 24px; }
.atik-kenar__kutu h3 { margin-bottom: 16px; }
.atik-adimlar { list-style: none; counter-reset: adim; padding: 0; margin: 0; }
.atik-adimlar li { counter-increment: adim; position: relative; padding-left: 46px; margin-bottom: 16px; font-size: 15px; line-height: 1.5; }
.atik-adimlar li::before { content: counter(adim); position: absolute; left: 0; top: 0; width: 32px; height: 32px; border-radius: 50%; background: var(--theme-color1); color: #fff; font-weight: 700; display: flex; align-items: center; justify-content: center; }
.atik-adimlar li strong { display: block; color: var(--theme-color2); }
.atik-kenar__yardim { background: var(--theme-color3); color: #e4eedb; }
.atik-kenar__yardim h3 { color: #fff; }
.atik-kenar__yardim p { color: #d7e5cc; }
.atik-kenar__yardim p em { color: #fff; }
.atik-kenar__tel { display: flex; align-items: center; gap: 10px; color: #fff; font-weight: 700; font-size: 18px; margin-top: 12px; }
.atik-kenar__tel:hover { color: var(--theme-color1); }
@media (max-width: 991.98px) { .atik-kenar { position: static; } }
@media (max-width: 575.98px) { .atik-blok { padding: 20px 16px 6px; } .atik-kalemi { padding: 14px 12px 2px; } }
.mobil-atik-formu { padding: 20px 25px 0; } .mobil-atik-formu .theme-btn { justify-content: center; }
.atik-formu { margin-top: 36px; } .atik-blok legend { margin-bottom: 10px; }

/* =====================================================================================
   GERİ DÖNÜŞÜM ÜRÜNLERİ — kart (_UrunKarti), ana sayfa slider'ı (_Urunler), /urunler, /urunler/{slug}
   ===================================================================================== */
.urun-karti { display: flex; flex-direction: column; height: 100%; background: #fff; border: 1px solid #e8ecdf; border-radius: 18px; overflow: hidden; transition: transform .35s ease, box-shadow .35s ease; }
.urun-karti:hover { transform: translateY(-6px); box-shadow: 0 18px 40px rgba(13, 79, 43, .12); }
.urun-karti__gorsel { position: relative; display: block; aspect-ratio: 1 / 1; overflow: hidden; background: #fff; border-bottom: 1px solid #eef1e7; }
.urun-karti__gorsel img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.urun-karti:hover .urun-karti__gorsel img { transform: scale(1.06); }
.urun-karti__yer-tutucu { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; font-size: 64px; color: var(--theme-color1); background: #eef5df; }
.urun-karti__etiket { position: absolute; left: 14px; top: 14px; padding: 4px 12px; border-radius: 20px; background: rgba(255,255,255,.92); color: var(--theme-color3); font-size: 12px; font-weight: 700; letter-spacing: .5px; text-transform: uppercase; }
.urun-karti__icerik { display: flex; flex-direction: column; flex: 1; padding: 22px 22px 24px; }
.urun-karti__baslik { font-size: 19px; line-height: 1.35; margin-bottom: 10px; }
.urun-karti__baslik a { color: var(--theme-color2); }
.urun-karti__baslik a:hover { color: var(--theme-color3); }
.urun-karti__ozet { font-size: 15px; line-height: 1.6; color: #666; margin-bottom: 18px; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.urun-karti__link { margin-top: auto; display: inline-flex; align-items: center; gap: 8px; font-weight: 700; color: var(--theme-color3); font-size: 15px; }
.urun-karti__link i { font-size: 12px; transition: transform .3s; }
.urun-karti__link:hover { color: var(--theme-color1); }
.urun-karti__link:hover i { transform: translateX(4px); }

/* Ana sayfa bölümü */
.urunler-bolumu { background: linear-gradient(180deg, #f5f8ee 0%, #fff 100%); }
.urunler-bolumu__ust { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 40px; }
.urunler-bolumu__ust .sec-title { max-width: 640px; }
.urun-slider-oklar { display: flex; gap: 10px; flex: 0 0 auto; }
.urun-slider-ok { width: 52px; height: 52px; border-radius: 50%; border: 1px solid #d5dcc5; background: #fff; color: var(--theme-color3); transition: all .3s; }
.urun-slider-ok:hover { background: var(--theme-color1); border-color: var(--theme-color1); color: #fff; }
.urun-slider-ok.swiper-button-disabled { opacity: .4; pointer-events: none; }
.urun-slider-ok.swiper-button-lock { display: none; }
.urun-slider { padding: 6px 2px 14px; }
.urun-slider .swiper-slide { height: auto; }
@media (max-width: 767.98px) { .urunler-bolumu__ust { flex-direction: column; align-items: flex-start; } }

/* /urunler */
.urun-filtre { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-bottom: 40px; }
.urun-filtre a { padding: 10px 22px; border-radius: 30px; border: 1px solid #dfe5d2; color: var(--theme-color2); font-weight: 600; }
.urun-filtre a span { font-size: 12px; color: #889; margin-left: 4px; }
.urun-filtre a.aktif, .urun-filtre a:hover { background: var(--theme-color3); border-color: var(--theme-color3); color: #fff; }
.urun-filtre a.aktif span, .urun-filtre a:hover span { color: #cfe3c0; }

.urun-cagri { padding-bottom: 110px; }
.urun-cagri__kutu { display: flex; align-items: center; justify-content: space-between; gap: 30px; flex-wrap: wrap; padding: 40px 46px; border-radius: 22px; background: var(--theme-color3); color: #dce9d2; }
.urun-cagri__metin { display: flex; gap: 22px; align-items: flex-start; flex: 1 1 420px; }
.urun-cagri__metin > i { font-size: 46px; color: var(--theme-color1); }
.urun-cagri__metin h2 { color: #fff; margin-bottom: 6px; }
.urun-cagri__metin p { color: #d2e2c6; margin: 0; }
.urun-cagri__dugmeler { display: flex; align-items: center; gap: 24px; flex-wrap: wrap; }
.urun-cagri__tel { color: #fff; font-weight: 700; font-size: 20px; display: inline-flex; align-items: center; gap: 10px; }
.urun-cagri__tel:hover { color: var(--theme-color1); }

/* /urunler/{slug} */
.urun-galeri__ana { position: relative; display: block; border-radius: 22px; overflow: hidden; background: #f3f6ec; aspect-ratio: 1 / 1; }
.urun-galeri__ana img { width: 100%; height: 100%; object-fit: cover; }
.urun-galeri__ana.urun-karti__yer-tutucu { font-size: 110px; }
.urun-galeri__buyut { position: absolute; right: 16px; bottom: 16px; width: 44px; height: 44px; border-radius: 50%; background: rgba(255,255,255,.92); color: var(--theme-color3); display: flex; align-items: center; justify-content: center; }
.urun-galeri__kucukler { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-top: 12px; }
.urun-galeri__kucukler a { display: block; aspect-ratio: 1 / 1; border-radius: 12px; overflow: hidden; }
.urun-galeri__kucukler img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.urun-galeri__kucukler a:hover img { transform: scale(1.08); }

.urun-bilgi__kategori { display: inline-block; padding: 5px 14px; border-radius: 20px; background: #eef5df; color: var(--theme-color3); font-size: 13px; font-weight: 700; letter-spacing: .5px; text-transform: uppercase; margin-bottom: 16px; }
.urun-bilgi__ad { font-size: 38px; line-height: 1.2; margin-bottom: 18px; }
.urun-bilgi__ozet { font-size: 18px; line-height: 1.7; color: #555; }
.urun-ozellikler { width: 100%; border-collapse: separate; border-spacing: 0; border: 1px solid #e4e9da; border-radius: 12px; overflow: hidden; font-size: 15px; }
.urun-ozellikler th, .urun-ozellikler td { padding: 12px 18px; border-bottom: 1px solid #e4e9da; vertical-align: top; }
.urun-ozellikler tr:last-child th, .urun-ozellikler tr:last-child td { border-bottom: 0; }
.urun-ozellikler th { width: 38%; background: #f5f8ee; color: var(--theme-color2); font-weight: 600; }
.urun-bilgi__dugmeler { display: flex; align-items: center; flex-wrap: wrap; gap: 26px; margin: 30px 0; }
.urun-bilgi__tel { display: inline-flex; align-items: center; gap: 12px; color: var(--theme-color2); font-weight: 700; font-size: 18px; }
.urun-bilgi__tel small { display: block; font-size: 13px; font-weight: 500; color: #666; }
.urun-bilgi__tel .ikon { width: 50px; height: 50px; border-radius: 50%; background: #eef5df; color: var(--theme-color3); display: flex; align-items: center; justify-content: center; }
.urun-bilgi__tel:hover { color: var(--theme-color3); }
.urun-bilgi__artilar { list-style: none; padding: 22px 0 0; margin: 0; border-top: 1px solid #e8ecdf; }
.urun-bilgi__artilar li { display: flex; gap: 12px; align-items: baseline; margin-bottom: 10px; font-size: 15px; color: #555; }
.urun-bilgi__artilar i { color: var(--theme-color1); width: 18px; }
.urun-bilgi__artilar a { color: var(--theme-color3); font-weight: 700; text-decoration: underline; }

.urun-aciklama { margin-top: 70px; padding: 44px 48px; border-radius: 22px; background: #fafbf7; border: 1px solid #e8ecdf; }
.urun-aciklama__baslik { margin-bottom: 22px; padding-bottom: 16px; border-bottom: 2px solid #e8ecdf; }
/* Panelde içerik "Başlık 1" ile yazılmış olabilir; sayfada tek h1 sayfa başlığı olduğundan küçültülür. */
.urun-aciklama .icerik-metni h1 { font-size: 28px; margin: 0 0 16px; }
.urun-aciklama .icerik-metni h2 { font-size: 24px; }
.urun-aciklama .icerik-metni h3 { font-size: 20px; }

.urun-benzerler { margin-top: 70px; }
.urun-benzerler__ust { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-bottom: 26px; }
.urun-benzerler__ust h2 { margin: 0; }

@media (max-width: 991.98px) { .urun-bilgi__ad { font-size: 30px; } }
@media (max-width: 575.98px) { .urun-aciklama { padding: 28px 20px; } .urun-cagri__kutu { padding: 30px 24px; } .urun-galeri__kucukler { grid-template-columns: repeat(3, 1fr); } }
.urun-aciklama .icerik-metni { max-width: 900px; }

/* ---------- Erişilebilirlik: SSS (akordeon) açık başlığı ----------
   Temada açık başlık yeşil zemin (#93bd33) üstünde beyaz yazıydı: kontrast 2.2 (en az 4.5 olmalı).
   Koyu yazı ile kontrast 7.1. */
.accordion-box .accordion.active-block .acc-btn,
.accordion-box .accordion.active-block .acc-btn.active .icon {
  color: var(--theme-color2);
}

/* ---------- Yazı tipi yedeği: Inter inene kadar sayfa kaymasın ----------
   Inter gelene kadar yazılar Arial ile çizilir (font-display: swap). Arial'ın harfleri Inter'den dar olduğu için
   font gelince satırlar uzar, alt satıra geçer ve sayfa kayardı (Lighthouse: CLS). "Inter Yedek", Arial'ı Inter'in
   ölçülerine getirir (size-adjust ve satır yükseklikleri); değişim olduğunda yazılar aynı yeri kaplar. */
@font-face {
  font-family: 'Inter Yedek';
  src: local('Arial');
  size-adjust: 107.06%;
  ascent-override: 90.49%;
  descent-override: 22.56%;
  line-gap-override: 0%;
}
:root {
  --body-font-family: "Inter", "Inter Yedek", sans-serif;
  --heading-font-family: "Inter", "Inter Yedek", sans-serif;
}

/* ---------- Erişilebilirlik: renk kontrastı (Lighthouse) ----------
   Açık yeşil (#93bd33) zemin üstünde beyaz yazı okunmuyor (kontrast 2.2, en az 4.5 olmalı) → koyu yeşil zemin.
   Gri küçük yazılar biraz koyulaştırıldı. */
.blog-details__date { background-color: var(--theme-color3); }           /* blog detay: görsel üstündeki tarih */
.service-details-help { background-color: var(--theme-color3); }         /* hizmet detay: yan menüdeki "yardım" kutusu */
.help-contact p { opacity: .85; }
.sidebar__post .sidebar__post-list .sidebar__post-content-meta { color: #5f625d !important; } /* blog yan menü tarihleri */
