/* =====================================================================
   ATIS MACHINERY — MODERN UI LAYER
   Sadece görünüm katmanı. İçeriğe / PHP'ye dokunmaz.
   Mevcut sınıf adlarını hedefler, en son yüklenir (cascade'i kazanır).
   Marka: koyu lacivert + altın sarı (#fac11c).
   ===================================================================== */

:root {
  --navy-900: #131c27;
  --navy-800: #16212e;
  --navy-700: #1f3040;
  --navy-600: #27384a;
  --gold:     #fac11c;
  --gold-600: #e3a50b;
  --ink:      #18222e;   /* başlık metni */
  --body:     #515c69;   /* gövde metni */
  --muted:    #8993a0;
  --bg:       #f4f6f9;   /* sayfa zemini */
  --card:     #ffffff;
  --line:     #e7eaef;
  --radius:   16px;
  --radius-sm: 10px;
  --shadow-sm: 0 2px 10px rgba(20,30,45,.06);
  --shadow:    0 12px 32px rgba(20,30,45,.10);
  --shadow-lg: 0 24px 60px rgba(20,30,45,.18);
  --ease: cubic-bezier(.22,.61,.36,1);
}

/* ---------- Base ---------- */
html { scroll-behavior: smooth; }
body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
  color: var(--body);
  background: var(--bg) !important;
  font-size: 15px;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
/* Yatay taşmayı engelle ama sticky'yi bozma: kaydırma kabını body'ye taşımayan 'clip' */
html { overflow-x: clip; }
* { box-sizing: border-box; }
img { max-width: 100%; height: auto; }

h1, h2, h3, h4, h5, .form-title, .form-section {
  font-family: 'Sora', 'Inter', sans-serif !important;
  color: var(--ink);
  letter-spacing: -.01em;
  line-height: 1.2;
}
a { transition: color .2s var(--ease); }
a:hover, a:focus { text-decoration: none; }

.container { max-width: 1200px; }

/* Yumuşak giriş animasyonu (JS .reveal ekler) */
.reveal { opacity: 0; transform: translateY(26px); transition: opacity .7s var(--ease), transform .7s var(--ease); }
.reveal.in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  .reveal { opacity: 1 !important; transform: none !important; }
  html { scroll-behavior: auto; }
}

/* =====================================================================
   HEADER (üst bar) — yapışkan
   ===================================================================== */
.header-row {
  background: linear-gradient(100deg, var(--navy-900), var(--navy-700)) !important;
  position: relative; z-index: 2;
  padding: 10px 0 !important;
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.header-row .row { display: flex; align-items: center; flex-wrap: wrap; }
.header-row .navbar-brand.logo { padding: 0 !important; height: auto !important; }
.header-row .navbar-brand.logo img {
  width: auto !important; max-height: 46px !important; margin-top: 0 !important;
  filter: drop-shadow(0 1px 2px rgba(0,0,0,.3));
}
.header-row .contact-info { display: flex; align-items: center; }

/* Sağ grubu (sosyal + diller) yan yana ve yakın tut.
   Kolon sırası: 1=logo, 2=contact(boş), 3=sosyal, 4=diller */
.header-row .row > div { width: auto !important; flex: 0 0 auto; padding-left: 8px !important; padding-right: 8px !important; }
.header-row .row > div:nth-child(2) { flex: 1 1 auto; }   /* boş alan esner → sağ grubu sağa iter */

/* Sosyal ikonlar — KÜÇÜK + YUVARLAK (dillerden farkı belli olsun) */
.social-icon { display: flex !important; float: none !important; gap: 7px; align-items: center; margin: 0; padding: 0; }
.social-icon li { list-style: none; }
.social-icon li a {
  display: inline-grid; place-items: center;
  width: 29px; height: 29px; border-radius: 50%;
  background: rgba(255,255,255,.10); color: #fff !important;
  font-size: 12.5px; transition: all .25s var(--ease);
}
.social-icon li a:hover { background: var(--gold); color: var(--navy-900) !important; transform: translateY(-2px); }

/* Diller — DİKDÖRTGEN pill'ler, sosyalden ince ayraç çizgisiyle ayrılmış */
.header-row .row > div:nth-child(4) {
  display: flex; align-items: center; gap: 6px;
  border-left: 1px solid rgba(255,255,255,.18);
  margin-left: 4px; padding-left: 16px !important;
}
.header-row .col-md-2 a.social-icon {
  display: inline-block !important; float: none !important; width: auto; height: auto;
  padding: 7px 13px; margin: 0; border-radius: 8px;
  background: rgba(255,255,255,.07); color: #cfd6df !important;
  font-weight: 700; font-size: 12px; letter-spacing: .04em;
}
.header-row .col-md-2 a.social-icon:hover, .header-row .col-md-2 a.social-icon.active { background: var(--gold); color: var(--navy-900) !important; }

/* =====================================================================
   ANA MENÜ — yapışkan, cam efektli
   ===================================================================== */
.tp-navigations {
  position: relative; z-index: 1000;
  background: var(--card) !important;
  border-bottom: 1px solid var(--line);
  box-shadow: 0 1px 0 rgba(20,30,45,.02);
  transition: box-shadow .3s var(--ease);
}
.tp-navigations .navbar { margin: 0; border: 0; background: transparent !important; min-height: 0; }
.tp-navigations .navbar .container { display: flex; align-items: center; }
.tp-navigations .nav.navbar-nav { float: none; display: flex; flex-wrap: wrap; gap: 2px; }

.tp-navigations .nav.navbar-nav { padding: 8px 0; }
.tp-navigations .nav.navbar-nav > li { margin: 0 3px; }
.tp-navigations .nav.navbar-nav > li > a {
  color: var(--ink) !important;
  font-family: 'Sora', sans-serif;
  font-weight: 600; font-size: 13px;
  text-transform: uppercase; letter-spacing: .04em;
  padding: 14px 18px !important;
  background: transparent !important;
  border: 0 !important;                 /* eski dikey çizgileri (border-right) kaldır */
  border-radius: 10px;
  position: relative; overflow: hidden;
  transition: color .25s var(--ease), background .25s var(--ease);
}
/* Hover'da yumuşak altın zemin pili */
.tp-navigations .nav.navbar-nav > li > a:hover,
.tp-navigations .nav.navbar-nav > li.active > a {
  color: var(--navy-900) !important;
  background: linear-gradient(180deg, rgba(250,193,28,.14), rgba(250,193,28,.05)) !important;
}
/* Altta merkezden büyüyen altın gösterge çizgisi */
.tp-navigations .nav.navbar-nav > li > a::after {
  content: ''; position: absolute; left: 14px; right: 14px; bottom: 0;
  height: 3px; border-radius: 3px 3px 0 0;
  background: linear-gradient(90deg, var(--gold), var(--gold-600));
  transform: scaleX(0); transform-origin: center; transition: transform .3s var(--ease);
}
.tp-navigations .nav.navbar-nav > li:hover > a::after,
.tp-navigations .nav.navbar-nav > li.active > a::after { transform: scaleX(1); }

/* Açılır menü */
.tp-navigations .dropdown-menu {
  border: 1px solid var(--line); border-radius: 14px;
  box-shadow: var(--shadow); padding: 8px; margin-top: 6px;
  min-width: 230px; overflow: hidden;
}
.tp-navigations .dropdown-menu > li > a {
  border-radius: 9px; padding: 10px 14px !important;
  color: var(--body) !important; font-size: 13.5px; font-weight: 500;
  white-space: normal;
}
.tp-navigations .dropdown-menu > li > a:hover {
  background: var(--navy-800) !important; color: #fff !important;
}

/* Mobil menü butonu (hamburger) — marka altın */
.navbar-toggle {
  border: 0 !important; margin: 10px 0;
  background: var(--gold) !important; border-radius: 9px !important; padding: 11px 12px !important;
  box-shadow: 0 4px 12px rgba(250,193,28,.35);
}
.navbar-toggle .icon-bar { background: var(--navy-900) !important; height: 2px; width: 22px; border-radius: 2px; }
.navbar-toggle .icon-bar + .icon-bar { margin-top: 4px; }

/* Mobil dil linkleri (menü içi) */
.nav.navbar-nav > li.visible-xs > a { color: var(--ink) !important; }

/* =====================================================================
   HERO / SLIDER
   ===================================================================== */
.slider-wrapper, .camera_wrap {
  background: linear-gradient(120deg, var(--navy-900), var(--navy-700)) !important;
  position: relative;
}
.camera_wrap { min-height: 82vh !important; overflow: hidden; }

/* Modern hero slider (modern.js tarafından oluşturulur) */
.camera_wrap.mh-ready { display: block; height: auto !important; margin-bottom: 0 !important; }
/* Genel karartma azaltıldı — görsel daha net görünsün */
.camera_wrap.mh-ready::after {
  content: ''; position: absolute; inset: 0; z-index: 2; pointer-events: none;
  background: linear-gradient(180deg, rgba(13,20,30,.10) 0%, rgba(13,20,30,.14) 55%, rgba(13,20,30,.36) 100%);
}
.mh-slide {
  position: absolute; inset: 0; z-index: 1;
  background-size: cover; background-position: center;
  opacity: 0; transform: scale(1.09);
  transition: opacity 1.1s var(--ease), transform 7s linear;
}
.mh-slide.active { opacity: 1; transform: scale(1); z-index: 1; }
/* Caption: yazının ALTINDA kendi gradienti var (sol taraf), yazı onun ÜSTÜNDE (z-index) */
.mh-cap { position: absolute; inset: 0; z-index: 3; display: flex; align-items: center; }
.mh-cap::before {
  content: ''; position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background: linear-gradient(90deg, rgba(13,20,30,.72) 0%, rgba(13,20,30,.45) 32%, rgba(13,20,30,0) 62%);
}
.mh-cap .container { width: 100%; position: relative; z-index: 1; }
.mh-kick { display: block; width: 54px; height: 4px; border-radius: 4px;
  background: linear-gradient(90deg, var(--gold), var(--gold-600)); margin-bottom: 22px; }
.mh-cap h1, .mh-cap > .container > h1, .camera_caption h1 {
  background: none !important; color: #fff !important;
  font-family: 'Sora', sans-serif !important; font-weight: 800;
  font-size: clamp(30px, 4.6vw, 58px) !important; line-height: 1.1;
  text-shadow: 0 6px 34px rgba(0,0,0,.5);
  max-width: 780px; margin: 0; text-align: left;
}
.mh-dots { position: absolute; left: 0; right: 0; bottom: 26px; z-index: 4;
  display: flex; gap: 10px; justify-content: center; }
.mh-dots button {
  width: 11px; height: 11px; padding: 0; border: 0; border-radius: 50%;
  background: rgba(255,255,255,.45); cursor: pointer; transition: all .25s var(--ease);
}
.mh-dots button.active { background: var(--gold); width: 30px; border-radius: 6px; }

/* İleri / geri okları */
.mh-arrow {
  position: absolute; top: 50%; transform: translateY(-50%); z-index: 4;
  width: 54px; height: 54px; padding: 0; border: 0; border-radius: 50%;
  background: rgba(255,255,255,.16); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  color: #fff; font-family: 'Sora', sans-serif; font-size: 30px; line-height: 1; cursor: pointer;
  display: grid; place-items: center; transition: all .25s var(--ease);
}
.mh-arrow:hover { background: var(--gold); color: var(--navy-900); transform: translateY(-50%) scale(1.06); }
.mh-prev { left: 24px; }
.mh-next { right: 24px; }

/* Eski camera plugin loader'ını gizle (devralındı) */
.camera_wrap.mh-ready .camera_loader, .camera_wrap.mh-ready .cameraSlide { display: none !important; }

/* =====================================================================
   BÖLÜM BAŞLIKLARI
   ===================================================================== */
.project-section-space, #project-section, #trusted.trusted-section { padding: 72px 0 !important; }
.tp-heading-title { text-align: center; margin-bottom: 14px; }
.tp-heading-title h1 {
  font-size: clamp(26px, 3.4vw, 40px); font-weight: 800; margin: 0 0 18px;
  position: relative; display: inline-block; padding-bottom: 18px;
}
.tp-heading-title h1::after {
  content: ''; position: absolute; left: 50%; bottom: 0; transform: translateX(-50%);
  width: 64px; height: 4px; border-radius: 4px;
  background: linear-gradient(90deg, var(--gold), var(--gold-600));
}
.tp-heading-title p { color: var(--muted); max-width: 640px; margin: 6px auto 0; }

/* =====================================================================
   ÜRÜN / MARKA ŞERİDİ (#trusted, #owl-demo)
   ===================================================================== */
#trusted.trusted-section { background: var(--card) !important; }
#owl-demo .item, #owl-demoee .item, .owl-demobir .item { padding: 10px; }
#owl-demo .item a, #owl-demo > a {
  display: block; background: var(--card); border: 1px solid var(--line);
  border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow-sm);
  transition: transform .3s var(--ease), box-shadow .3s var(--ease), border-color .3s var(--ease);
}
#owl-demo .item a:hover, #owl-demo > a:hover {
  transform: translateY(-6px); box-shadow: var(--shadow); border-color: #dfe3ea;
}
#owl-demo .item img, #owl-demo > a img {
  width: 100%; height: 180px; object-fit: contain; padding: 18px;
  background: #fff; transition: transform .4s var(--ease);
}
#owl-demo .item a:hover img { transform: scale(1.04); }
#owl-demo h4, #trusted h4 {
  font-size: 14px !important; font-weight: 700; color: var(--ink) !important;
  padding: 12px 10px !important; margin: 0 !important; border-top: 1px solid var(--line);
  text-transform: uppercase; letter-spacing: .02em;
}

/* =====================================================================
   PROJELER (#project-section .project-block)
   ===================================================================== */
.project-block {
  background: var(--card); border: 1px solid var(--line);
  border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow-sm);
  margin: 0 0 26px !important;
  transition: transform .3s var(--ease), box-shadow .3s var(--ease);
}
.project-block:hover { transform: translateY(-6px); box-shadow: var(--shadow); }
.project-block .pro-thumb { overflow: hidden; margin: 0 !important; }
.project-block .pro-thumb img { width: 100%; height: 230px; object-fit: cover; transition: transform .5s var(--ease); }
.project-block:hover .pro-thumb img { transform: scale(1.07); }
.project-block .pro-dec { padding: 20px 22px 24px; }
.project-block .pro-dec h2, .project-block .pro-dec h2 a {
  font-size: 17px !important; font-weight: 700; color: var(--ink) !important; margin: 0 0 8px;
}
.project-block .pro-dec h2 a:hover { color: var(--gold-600) !important; }
.project-block .pro-dec .locations {
  color: var(--gold-600) !important; font-size: 12.5px; font-weight: 600;
  text-transform: uppercase; letter-spacing: .03em; margin-bottom: 8px;
}
.project-block .pro-dec p { color: var(--body); font-size: 13.5px; margin: 0; line-height: 1.6; }
/* Projeler açıklaması: tüm kartlarda eşit (3 satır) + uzun olunca sonunda "..." */
#project-section .pro-dec p:not(.locations) {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  min-height: calc(1.6em * 3); /* kısa metinler de 3 satır yer kaplasın → hizalı */
}
/* Başlık da 2 satır yer kaplasın ki açıklamalar aynı hizadan başlasın */
#project-section .pro-dec h2 { min-height: calc(1.25em * 2); }

/* =====================================================================
   SEKMELER (st-tabs)
   ===================================================================== */
/* Sekmeler SOLA yaslı (madde 2) */
.st-tabs .nav-tabs { border-bottom: 1px solid var(--line) !important; display: flex; flex-wrap: wrap; gap: 4px; justify-content: flex-start; }
/* Bootstrap'in clearfix ::before/::after'ı flex'te görünmez öğe olup gap ile ilk sekmeyi
   4px sağa itiyordu → kaldır ki ilk sekme alttaki içerikle tam hizalı dursun (soldan gap yok) */
.st-tabs .nav-tabs::before, .st-tabs .nav-tabs::after { content: none !important; display: none !important; }
.st-tabs .nav-tabs > li { float: none; margin: 0 !important; }
.st-tabs .nav-tabs > li > a {
  border: 1px solid transparent !important; border-radius: 12px 12px 0 0 !important;
  color: var(--body) !important; font-weight: 600; font-family: 'Sora', sans-serif;
  margin: 0 !important; padding: 13px 22px !important;
  /* Yumuşak geçiş — hover'da ani değişim olmasın (madde 3) */
  transition: background-color .25s var(--ease), border-color .25s var(--ease), color .25s var(--ease) !important;
}
/* Orijinaldeki hover padding zıplamasını (15px 60px) iptal et — artık uzamaz, sadece yumuşakça renk değişir (madde 3) */
.st-tabs .nav-tabs > li > a:hover { padding: 13px 22px !important; background: var(--bg) !important; border-color: var(--line) !important; color: var(--navy-900) !important; }
.st-tabs .nav-tabs > li > a img { max-height: 54px; width: auto; }
.st-tabs .nav-tabs > li.active > a {
  background: var(--card) !important; color: var(--navy-900) !important;
  border-color: var(--line) !important; border-bottom-color: var(--card) !important;
}
/* tab-content: kalın bej boxy border yerine modern, temiz kart (madde 5) */
.st-tabs .tab-content {
  background: var(--card) !important;
  border: 1px solid var(--line) !important; border-top: none !important;
  border-radius: 0 0 14px 14px !important;
  padding: 26px 26px 26px 22px !important; /* sol padding sekme yazısıyla (22px) eşit → tam hizalı */
  box-shadow: var(--shadow-sm);
  color: var(--body); line-height: 1.8;
}
.owl-demobir .item img { height: 130px; object-fit: contain; }

/* =====================================================================
   ÜRÜN DETAY SAYFASI (galeri.php else dalı) düzeltmeleri
   ===================================================================== */
/* Madde 4 BUG: .col-md-9 içine yuvalanmış sabit genişlikli .container'lar
   kolondan taşıyor → kolona sığdır */
.woo-shop .col-md-9 .container {
  width: auto !important; max-width: 100% !important;
  margin-left: 0 !important; margin-right: 0 !important;
  padding-left: 0 !important; padding-right: 0 !important;
}
.woo-shop .col-md-9 .project-section-space { padding: 30px 0 0 !important; }

/* Madde 1: ANA ürün resmi daha uzun + tüm makine görünsün (contain) */
.woo-shop .col-md-9 .col-md-12.project-block { margin-bottom: 18px !important; }
.woo-shop .col-md-9 .col-md-12.project-block .pro-thumb img {
  height: 440px !important; object-fit: contain !important; background: #f6f7f9;
}
.woo-shop .col-md-9 .col-md-12.project-block:hover .pro-thumb img { transform: none !important; }

/* Madde 2 (thumb): alt thumb şeridi kutuya sığsın + KARE olsun */
.woo-shop #owl-demo { width: 100% !important; }
.woo-shop #owl-demo .item { padding: 6px !important; }
.woo-shop #owl-demo .item a {
  display: block; border: 1px solid var(--line); border-radius: 12px; overflow: hidden;
  background: var(--card); box-shadow: var(--shadow-sm); transition: all .25s var(--ease);
}
.woo-shop #owl-demo .item a:hover { transform: translateY(-4px); box-shadow: var(--shadow); }
.woo-shop #owl-demo .item img {
  width: 100% !important; height: auto !important; aspect-ratio: 1 / 1;
  object-fit: cover !important; padding: 0 !important; background: #fff; display: block;
}
.woo-shop #owl-demo .item h4 {
  font-size: 12px !important; padding: 9px 8px !important; margin: 0 !important;
  border-top: 1px solid var(--line); text-transform: none; letter-spacing: 0;
}

/* =====================================================================
   İÇ SAYFA — başlık bandı (tp-page-header)
   ===================================================================== */
.tp-page-header {
  background: linear-gradient(120deg, var(--navy-900), var(--navy-700)) !important;
  position: relative; overflow: hidden; padding: 0 !important;
}
.tp-page-header::after {
  content: ''; position: absolute; right: -60px; top: -60px; width: 280px; height: 280px;
  background: radial-gradient(circle, rgba(250,193,28,.16), transparent 70%);
}
.tp-page-header .page-header-title { padding: 46px 0; position: relative; z-index: 1; }
.tp-page-header h2 {
  color: #fff !important; font-weight: 800; margin: 0;
  font-size: clamp(24px, 3vw, 36px);
  padding-left: 18px; border-left: 4px solid var(--gold);
}

/* =====================================================================
   İÇERİK / ŞİRKET PROFİLİ
   ===================================================================== */
.tp-company-profile { padding: 56px 0 !important; }
.tp-company-profile p { color: var(--body); font-size: 15.5px; line-height: 1.85; }
.tp-company-profile img { border-radius: var(--radius-sm); box-shadow: var(--shadow-sm); }
.main-wrapper { padding: 46px 0; }

/* =====================================================================
   KATEGORİ / MAĞAZA (woo-shop, product-box)
   ===================================================================== */
.woo-shop { padding: 10px 0 40px; }
.product-box {
  margin-bottom: 28px;
}
.product-box .product-wrap {
  background: var(--card); border: 1px solid var(--line); border-radius: var(--radius);
  overflow: hidden; box-shadow: var(--shadow-sm);
  transition: transform .3s var(--ease), box-shadow .3s var(--ease);
}
.product-box:hover .product-wrap { transform: translateY(-6px); box-shadow: var(--shadow); }
.product-box .product-wrap img { width: 100%; height: 240px; object-fit: cover; transition: transform .5s var(--ease); }
.product-box:hover .product-wrap img { transform: scale(1.06); }
.product-box h3 { margin: 14px 0 0; }
.product-box h3 a { font-size: 15px !important; font-weight: 700; color: var(--ink) !important; text-transform: capitalize; }
.product-box h3 a:hover { color: var(--gold-600) !important; }

/* Yan kategori menüsü */
.woo-shop .navbar-default { background: var(--card) !important; border: 1px solid var(--line) !important; border-radius: var(--radius); box-shadow: var(--shadow-sm); overflow: hidden; }
#sidenav01 { padding: 6px; }
#sidenav01 > li > a {
  color: var(--ink) !important; font-weight: 600; border-radius: 9px;
  padding: 12px 14px !important; display: block; transition: all .2s var(--ease);
}
#sidenav01 > li > a:hover { background: var(--bg) !important; }
/* Tıklanıp açılan (genişletilen) kategori: lacivert zemin → yazı BEYAZ olsun (okunur) */
#sidenav01 > li > a:not(.collapsed),
#sidenav01 > li > a[aria-expanded="true"] {
  background: var(--navy-800) !important; color: #fff !important;
}
#sidenav01 > li > a:not(.collapsed) .glyphicon,
#sidenav01 > li > a[aria-expanded="true"] .glyphicon { color: var(--gold) !important; }
#sidenav01 .glyphicon { color: var(--gold-600); margin-right: 6px; font-size: 11px; }
#sidenav01 .nav-list { padding-left: 10px; }
#sidenav01 .nav-list li a { color: var(--body) !important; padding: 8px 12px !important; font-weight: 500; border-radius: 8px; }
#sidenav01 .nav-list li a:hover { color: var(--navy-900) !important; background: var(--bg) !important; }

/* =====================================================================
   GALERİ (project-gallery)
   ===================================================================== */
.project-gallery { padding: 30px 0 60px; }
.project-gallery .project-block { margin-bottom: 24px !important; }
.project-gallery .pro-thumb img { height: 220px; object-fit: cover; width: 100%; }

/* Partner / logo galerisi (normal-sayfa.php) — logolar TAM görünür + ORTALI */
.partner-gallery .project-block {
  background: transparent !important; border: 0 !important; box-shadow: none !important;
  border-radius: 0 !important; overflow: visible !important;
  margin-bottom: 24px !important; padding-left: 12px !important; padding-right: 12px !important;
}
.partner-gallery .pro-thumb {
  margin: 0 !important; height: 170px; padding: 22px;
  background: #fff; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow-sm);
  display: flex; align-items: center; justify-content: center; overflow: hidden;
  transition: transform .25s var(--ease), box-shadow .25s var(--ease);
}
.partner-gallery .project-block:hover .pro-thumb { transform: translateY(-4px); box-shadow: var(--shadow); }
.partner-gallery .pro-thumb a { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; }
/* Logo tam sığsın, kırpılmasın, ortada dursun */
.partner-gallery .pro-thumb img {
  width: auto !important; height: auto !important; max-width: 100% !important; max-height: 100% !important;
  object-fit: contain !important; transform: none !important; margin: 0 auto;
}
@media (max-width: 991px) { .partner-gallery .project-block { width: 33.333% !important; float: left; } }
@media (max-width: 575px)  { .partner-gallery .project-block { width: 50% !important; } .partner-gallery .pro-thumb { height: 130px; padding: 16px; } }

/* =====================================================================
   İLETİŞİM
   ===================================================================== */
.contact-page { padding: 10px 0 40px; }
.contact-page iframe { border-radius: var(--radius); box-shadow: var(--shadow-sm); margin-bottom: 34px; display: block; }
.contact-heading h2 { font-size: 22px; font-weight: 700; margin-bottom: 18px; position: relative; padding-bottom: 12px; }
.contact-heading h2::after { content: ''; position: absolute; left: 0; bottom: 0; width: 48px; height: 3px; background: var(--gold); border-radius: 3px; }
.contact-form .form-control, #contact-page .form-control {
  border: 1px solid var(--line) !important; border-radius: var(--radius-sm) !important;
  padding: 12px 14px !important; height: auto !important; box-shadow: none !important;
  background: var(--card) !important; color: var(--ink); transition: border-color .2s var(--ease), box-shadow .2s var(--ease);
}
.contact-form .form-control:focus, #contact-page .form-control:focus {
  border-color: var(--gold) !important; box-shadow: 0 0 0 3px rgba(250,193,28,.18) !important;
}
.contact-form label { color: var(--ink); font-weight: 600; font-size: 13px; }
.ct-support p span { display: flex; align-items: center; gap: 10px; padding: 8px 0; color: var(--body); }
.ct-support .fa { color: var(--gold-600); width: 20px; text-align: center; }

/* =====================================================================
   BUTONLAR
   ===================================================================== */
.btn-submit, .btn.btn-submit, .btn.green, .btn.red, .btn.btn-primary {
  background: linear-gradient(180deg, var(--gold), var(--gold-600)) !important;
  border: 0 !important; color: var(--navy-900) !important;
  font-family: 'Sora', sans-serif; font-weight: 700; letter-spacing: .02em;
  padding: 12px 26px !important; border-radius: 999px !important;
  box-shadow: 0 8px 20px rgba(250,193,28,.32); transition: transform .2s var(--ease), box-shadow .2s var(--ease);
}
.btn-submit:hover, .btn.green:hover, .btn.red:hover, .btn.btn-primary:hover, .btn.btn-submit:hover {
  transform: translateY(-2px); box-shadow: 0 12px 26px rgba(250,193,28,.42); color: var(--navy-900) !important;
}

/* =====================================================================
   FOOTER
   ===================================================================== */
.footer-section {
  background: linear-gradient(160deg, var(--navy-800), var(--navy-900)) !important;
  color: #aab4c0; padding: 64px 0 40px !important; margin-top: 20px;
}
.footer-section h2 {
  color: #fff !important; font-size: 16px; font-weight: 700; text-transform: uppercase;
  letter-spacing: .04em; margin-bottom: 22px; position: relative; padding-bottom: 12px;
}
.footer-section h2::after { content: ''; position: absolute; left: 0; bottom: 0; width: 36px; height: 3px; background: var(--gold); border-radius: 3px; }
.footer-section p, .footer-section li, .footer-section .address li { color: #9aa6b3; }
.footer-section .ft-logo img { width: 210px !important; margin-bottom: 18px; }
.footer-section .address ul { padding: 0; margin: 0; list-style: none; }
.footer-section .address li { display: flex; align-items: flex-start; gap: 10px; padding: 7px 0; }
.footer-section .address .fa, .footer-section .fa-angle-double-right { color: var(--gold); margin-top: 3px; }
.footer-section a { color: #aab4c0 !important; }
.footer-section ul { padding: 0; list-style: none; }
.footer-section .tp-investor-relation li { padding: 6px 0; }
.footer-section a:hover { color: var(--gold) !important; padding-left: 3px; }

.tiny-footer { background: var(--navy-900) !important; padding: 18px 0 !important; border-top: 1px solid rgba(255,255,255,.06); }
.tiny-footer .copyright-ct { color: #6f7b89; font-size: 12.5px; margin: 0; line-height: 1.7; }

/* =====================================================================
   WHATSAPP & YUKARI ÇIK
   ===================================================================== */
a[href*="wa.me"] {
  z-index: 900; bottom: 24px !important; right: 22px !important;
  filter: drop-shadow(0 8px 20px rgba(37,211,102,.45));
  transition: transform .25s var(--ease);
}
a[href*="wa.me"]:hover { transform: scale(1.08) translateY(-2px); }
a[href*="wa.me"] img { width: 56px !important; }

#toTop {
  position: fixed; bottom: 92px; right: 26px; z-index: 900;
  width: 46px; height: 46px; border: 0; border-radius: 50%;
  background: var(--navy-800); color: #fff; cursor: pointer;
  box-shadow: var(--shadow); opacity: 0; visibility: hidden;
  transform: translateY(12px); transition: all .3s var(--ease);
  display: grid; place-items: center; font-size: 18px;
}
#toTop.show { opacity: 1; visibility: visible; transform: none; }
#toTop:hover { background: var(--gold); color: var(--navy-900); }

/* =====================================================================
   RESPONSIVE
   ===================================================================== */
@media (max-width: 991px) {
  .tp-navigations { top: 0; }
  .tp-navigations .navbar { position: static; min-height: 58px; }
  .tp-navigations .navbar .container { display: block; position: static; min-height: 58px; }
  .tp-navigations .navbar-header { min-height: 58px; float: none; margin: 0; }
  /* Hamburger'ı sticky .tp-navigations'a göre sağ-üste sabitle */
  .navbar-toggle {
    position: absolute !important; top: 12px; right: 18px; z-index: 1002;
    float: none !important; margin: 0 !important;
    display: inline-flex !important; flex-direction: column; justify-content: center;
  }
  .tp-navigations .navbar-collapse { clear: both; background: #fff; border-top: 1px solid var(--line); box-shadow: var(--shadow); border-radius: 0 0 14px 14px; }
  .tp-navigations .nav.navbar-nav { display: block; margin: 6px 0; }
  .tp-navigations .nav.navbar-nav > li > a { padding: 14px 16px !important; }
  .tp-navigations .nav.navbar-nav > li > a::after { display: none; }
  /* Mobil header: logo kendi satırında ortalı; sosyal + diller birlikte ortalı */
  .header-row .row { justify-content: center; row-gap: 12px; }
  .header-row .contact-info { display: none !important; }
  .header-row .row > div:nth-child(1) { flex: 0 0 100% !important; width: 100% !important; display: flex; justify-content: center; }
  .woo-shop .col-md-9, .woo-shop .col-md-3 { width: 100%; }
}
@media (max-width: 767px) {
  .project-section-space, #project-section, #trusted.trusted-section { padding: 48px 0 !important; }
  .camera_wrap { min-height: 64vh !important; }
  .mh-arrow { width: 40px; height: 40px; font-size: 24px; }
  .mh-prev { left: 10px; }
  .mh-next { right: 10px; }
  .header-row .navbar-brand.logo img { max-height: 38px !important; }
  .product-box .product-wrap img, .project-block .pro-thumb img { height: 200px; }
  .mh-cap h1 { font-size: clamp(21px, 6vw, 30px) !important; line-height: 1.18; }
  .mh-kick { margin-bottom: 14px; height: 3px; width: 42px; }
  .mh-cap .container { padding-left: 22px; padding-right: 22px; }
  .mh-dots { bottom: 16px; }
}

/* =====================================================================
   YEDEK PARÇA — özel tekil ürün sayfası (yedek-parca-urun.php)
   ===================================================================== */
.yp-page { padding: 30px 0 0; }
.yp-breadcrumb { font-size: 13px; color: var(--muted); margin: 6px 0 26px; }
.yp-breadcrumb a { color: var(--body); font-weight: 600; }
.yp-breadcrumb a:hover { color: var(--gold-600); }
.yp-breadcrumb .yp-sep { margin: 0 8px; color: #c7cdd5; }
.yp-breadcrumb .yp-current { color: var(--ink); font-weight: 700; }

.yp-product { display: flex; gap: 48px; align-items: flex-start; }
.yp-gallery { flex: 0 0 46%; max-width: 46%; }
.yp-info { flex: 1 1 auto; min-width: 0; padding-top: 6px; }

/* Sol: ana resim + thumbnail'ler */
.yp-main {
  position: relative; cursor: zoom-in;
  background: #fff; border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: var(--shadow-sm); overflow: hidden; padding: 24px;
  display: flex; align-items: center; justify-content: center;
  height: 460px;
}
.yp-main img { max-width: 100%; max-height: 100%; object-fit: contain; transition: opacity .25s var(--ease), transform .35s var(--ease); }
.yp-main:hover img { transform: scale(1.03); }
.yp-zoom-ico {
  position: absolute; bottom: 14px; right: 14px; width: 40px; height: 40px; border-radius: 50%;
  background: rgba(22,33,46,.82); color: #fff; display: grid; place-items: center; font-size: 16px;
  pointer-events: none; transition: background .2s var(--ease);
}
.yp-main:hover .yp-zoom-ico { background: var(--gold); color: var(--navy-900); }
/* Thumbnail'ler ana resimle aynı genişlikte biter (sağda boşluk kalmaz) */
.yp-thumbs { display: flex; gap: 10px; margin-top: 12px; }
.yp-thumb {
  flex: 1 1 0; min-width: 0; aspect-ratio: 1 / 1; padding: 6px; cursor: pointer;
  background: #fff; border: 2px solid var(--line); border-radius: 12px;
  display: grid; place-items: center; transition: all .2s var(--ease);
}
.yp-thumb img { max-width: 100%; max-height: 100%; object-fit: contain; }
.yp-thumb:hover { border-color: #cfd5dd; }
.yp-thumb.active { border-color: var(--gold); box-shadow: 0 4px 14px rgba(250,193,28,.28); }

/* Sağ: başlık / (fiyat + buton) / açıklama */
.yp-title { font-size: clamp(26px, 3vw, 40px); font-weight: 800; line-height: 1.15; margin: 0 0 20px; }
/* Fiyat + Teklif butonu aynı satırda */
.yp-buy {
  display: flex; align-items: center; gap: 24px; flex-wrap: wrap;
  margin: 0 0 26px; padding-bottom: 26px; border-bottom: 1px solid var(--line);
}
.yp-price {
  font-family: 'Sora', sans-serif; font-weight: 800; color: var(--ink);
  font-size: 32px; margin: 0; padding: 0; border: 0; line-height: 1;
}
.yp-price span { color: var(--gold-600); font-size: 25px; }
.yp-desc { color: var(--body); font-size: 15.5px; line-height: 1.85; margin-bottom: 10px; }
.yp-desc p { margin: 0 0 12px; }
.yp-desc img { max-width: 100%; height: auto; border-radius: 10px; }

.yp-offer-btn {
  display: inline-flex; align-items: center; gap: 10px; margin: 0;
  background: linear-gradient(180deg, #25d366, #1eb558); color: #fff !important;
  font-family: 'Sora', sans-serif; font-weight: 700; font-size: 16px; letter-spacing: .02em;
  padding: 14px 32px; border-radius: 999px; text-decoration: none;
  box-shadow: 0 10px 24px rgba(37,211,102,.36); transition: transform .2s var(--ease), box-shadow .2s var(--ease);
}
.yp-offer-btn i { font-size: 20px; }
.yp-offer-btn:hover { transform: translateY(-2px); box-shadow: 0 14px 30px rgba(37,211,102,.46); color: #fff !important; }

/* Lightbox (ana resme tıklayınca büyük önizleme) */
.yp-lightbox {
  position: fixed; inset: 0; z-index: 3000; display: flex; align-items: center; justify-content: center;
  background: rgba(13,20,30,.92); opacity: 0; visibility: hidden; transition: opacity .3s var(--ease);
  -webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px);
}
.yp-lightbox.open { opacity: 1; visibility: visible; }
.yp-lightbox img { max-width: 90vw; max-height: 86vh; border-radius: 10px; box-shadow: 0 30px 80px rgba(0,0,0,.5); }
.yp-lb-btn {
  position: absolute; top: 50%; transform: translateY(-50%); z-index: 2;
  width: 56px; height: 56px; border: 0; border-radius: 50%; cursor: pointer;
  background: rgba(255,255,255,.14); color: #fff; font-size: 28px;
  display: flex; align-items: center; justify-content: center; line-height: 0; padding: 0;
  transition: background .2s var(--ease);
}
.yp-lb-btn:hover { background: var(--gold); color: var(--navy-900); }
.yp-lb-prev { left: 28px; } .yp-lb-next { right: 28px; }
.yp-lb-close {
  position: absolute; top: 22px; right: 26px; z-index: 2;
  width: 48px; height: 48px; border: 0; border-radius: 50%; cursor: pointer;
  background: rgba(255,255,255,.14); color: #fff; font-size: 22px;
  display: flex; align-items: center; justify-content: center; line-height: 0; padding: 0;
  transition: background .2s var(--ease);
}
.yp-lb-close:hover { background: #e5484d; color: #fff; }
/* FA ikonları kutuda tam ortalansın */
.yp-lb-btn i, .yp-lb-close i { display: block; line-height: 1; }
@media (max-width: 600px) { .yp-lb-btn { width: 44px; height: 44px; font-size: 24px; } .yp-lb-prev { left: 10px; } .yp-lb-next { right: 10px; } }

/* Alt: diğer kategoriler — kayan şerit (marquee) */
.yp-other { margin-top: 64px; padding: 40px 0 56px; background: var(--card); border-top: 1px solid var(--line); }
.yp-other-title { font-size: clamp(22px, 2.6vw, 30px); font-weight: 800; text-align: center; margin: 0 0 30px; position: relative; padding-bottom: 16px; }
.yp-other-title::after { content: ''; position: absolute; left: 50%; bottom: 0; transform: translateX(-50%); width: 60px; height: 4px; border-radius: 4px; background: linear-gradient(90deg, var(--gold), var(--gold-600)); }
/* Ok butonlu, elle kayan carousel + sayfa noktaları */
.yp-cats-carousel { display: flex; align-items: center; gap: 14px; }
.yp-cats-viewport { overflow: hidden; flex: 1 1 auto; min-width: 0; }
.yp-cats-track { display: flex; gap: 20px; transition: transform .45s var(--ease); will-change: transform; }
.yp-cats-arrow {
  flex: 0 0 auto; width: 48px; height: 48px; border: 1px solid var(--line); border-radius: 50%;
  background: var(--card); color: var(--ink); font-family: 'Sora', sans-serif; font-size: 26px; line-height: 1;
  cursor: pointer; display: grid; place-items: center; box-shadow: var(--shadow-sm);
  transition: all .2s var(--ease);
}
.yp-cats-arrow:hover { background: var(--gold); color: var(--navy-900); border-color: var(--gold); }
.yp-cats-arrow:disabled { opacity: .35; cursor: default; background: var(--card); color: var(--ink); border-color: var(--line); }
.yp-cats-dots { display: flex; justify-content: center; gap: 9px; margin-top: 24px; }
.yp-cats-dots button { width: 9px; height: 9px; padding: 0; border: 0; border-radius: 50%; background: #cfd5dd; cursor: pointer; transition: all .25s var(--ease); }
.yp-cats-dots button.active { background: var(--gold); width: 26px; border-radius: 6px; }
.yp-cat { flex: 0 0 auto; width: 210px; text-decoration: none; background: var(--bg); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; transition: transform .25s var(--ease), box-shadow .25s var(--ease); }
.yp-cat:hover { transform: translateY(-6px); box-shadow: var(--shadow); }
.yp-cat-img { height: 140px; overflow: hidden; background: #fff; }
.yp-cat-img img { width: 100%; height: 100%; object-fit: cover; }
.yp-cat-name { display: block; padding: 14px 12px; font-size: 13px; font-weight: 700; color: var(--ink); text-align: center; text-transform: uppercase; letter-spacing: .02em; line-height: 1.3; }

@media (max-width: 900px) {
  .yp-product { flex-direction: column; gap: 26px; }
  .yp-gallery, .yp-info { flex: 1 1 100%; max-width: 100%; }
  .yp-main { height: 360px; }
  .yp-cat { width: 170px; }
  .yp-cat-img { height: 120px; }
}
@media (prefers-reduced-motion: reduce) { .yp-cats-track { animation: none; } }
