/**
 * Bak Ambalaj — modern CSS
 * Visual match to live site; cleaned tokens, no vendor-prefix clutter, Swiper-ready.
 */

/* ==========================================================================
   Tokens
   ========================================================================== */
:root {
  --bak-red: #af2c36;
  --bak-red-soft: #f0848c;
  --bak-ink: #4a4c4f;
  --bak-ink-soft: #4b4b4b;
  --bak-muted: #8b8b8b;
  --bak-gray: #757575;
  --bak-gray-mid: #656868;
  --bak-gray-light: #9d9d9d;
  --bak-line: #dfdfdf;
  --bak-line-soft: #dedede;
  --bak-bg-soft: #f0f0f0;
  --bak-bg-think: #ededed;
  --bak-dot: #dadada;
  --bak-white: #fff;
  --bak-black: #000;
  --bak-shadow: 0 0 3px rgb(0 0 0 / 0.1);
  --bak-shadow-menu: 0 4px 5px 3px rgb(0 0 0 / 0.1);
  --bak-font: "Panton", "Segoe UI", sans-serif;
  --bak-container: 1280px;
  --bak-ease: 0.3s ease;
  --bak-ease-slow: 0.5s ease;
  /* Belge simgesi (içerik tablolarındaki PDF bağlantıları). Maske olarak
     kullanılır, rengini yazıdan alır; _DocumentIcon.cshtml ile aynı çizim. */
  --bak-doc-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23000' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9.2 1.8H4.3a1.3 1.3 0 0 0-1.3 1.3v9.8a1.3 1.3 0 0 0 1.3 1.3h7.4a1.3 1.3 0 0 0 1.3-1.3V5.6z'/%3E%3Cpath d='M9.2 1.8v3.8H13'/%3E%3Cpath d='M5.9 8.4h4.2M5.9 11h4.2'/%3E%3C/svg%3E");
}

/* ==========================================================================
   Fonts
   ========================================================================== */
@font-face {
  font-family: "Panton";
  src: url("../fonts/Panton-Regular.woff") format("woff");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Panton";
  src: url("../fonts/Panton-Bold.woff") format("woff");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

/* ==========================================================================
   Base
   ========================================================================== */
*,
*::before,
*::after {
  box-sizing: border-box;
}

body {
  margin: 0;
  font-family: var(--bak-font);
  font-weight: 400;
  font-size: 14px;
  letter-spacing: 0.2px;
  color: var(--bak-muted);
  background: var(--bak-white);
  line-height: 1.45;
}

img {
  max-width: 100%;
  height: auto;
}

.img-responsive {
  display: block;
  max-width: 100%;
  height: auto;
}

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

a {
  color: var(--bak-red);
  text-decoration: none;
  transition: color var(--bak-ease), opacity var(--bak-ease), background-color var(--bak-ease);
}

a:hover {
  text-decoration: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: 600;
}

.container {
  width: 100%;
  max-width: var(--bak-container);
}

/* Legacy utility classes still used in markup */
.fr { float: right; }
.fl { float: left; }
.di { display: inline-block; }
.db { display: block; }
.dn { display: none; }
.pr { position: relative; }
.pa { position: absolute; }
.tc { text-align: center; }
.mp { margin: 0; padding: 0; }
.mb0 { margin-bottom: 0; }

/* ==========================================================================
   Header
   ========================================================================== */
#header {
  position: relative;
  z-index: 9;
  background: var(--bak-white);
  box-shadow: var(--bak-shadow);
}

#top {
  position: relative;
  height: 100px;
  padding-top: 15px;
}

#top .container,
#top .row,
#top .col-sm-12 {
  position: relative;
}

.logo {
  margin: 10px 0 0;
  text-align: center;
}

/* Logolar SVG. <img> icindeki SVG'nin ictirinsik olcusu olmadigi icin olcu
   burada da sabitlenir; aksi halde kutuyu doldurup buyur. Rasterdaki olcunun
   aynisi: navbar 248x54 (yukseklik eskisiyle ayni), footer 94x33. */
.logo img {
  margin: 0 auto;
  width: 248px;
  height: 54px;
}

.diller {
  position: absolute;
  right: 15px;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2;
  color: var(--bak-gray);
  font-size: 13px;
  line-height: 1;
  white-space: nowrap;
}

.diller a {
  color: var(--bak-gray);
  font-weight: 400;
  font-size: 13px;
}

.diller a:hover,
.diller a:focus {
  color: var(--bak-red);
}

#menuTop {
  height: auto;
  background: none;
  padding-bottom: 4px;
}

/* ==========================================================================
   Navigation (original look + Bootstrap 5 collapse)
   ========================================================================== */
.navbar-default.navbar {
  --bs-navbar-padding-x: 0;
  --bs-navbar-padding-y: 0;
  display: block;
  margin: 0;
  padding: 0;
  background: none;
  border: none;
  box-shadow: none;
  text-align: center;
  min-height: 0;
}

/* Desktop: canlı sitedeki gibi hamburger yok */
.navbar-default .navbar-header {
  display: none;
}

.navbar-default .navbar-toggler {
  display: none;
}

.navbar-default .navbar-nav {
  display: block;
  width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
  flex-direction: unset;
  flex-wrap: unset;
}

.navbar-default .navbar-nav > li {
  display: inline-block;
  float: none;
  margin: 0 10px 0 2px;
  position: relative;
}

.navbar-default .navbar-nav > li > a {
  display: block;
  padding: 13px 2px 10px;
  color: var(--bak-ink);
  font-weight: 600;
  text-decoration: none;
  transition: var(--bak-ease);
}

.navbar-default .navbar-nav > li:hover > a,
.navbar-default .navbar-nav > li > a:focus,
.navbar-default .navbar-nav > li.active > a {
  background: var(--bak-red);
  color: var(--bak-white);
  box-shadow: inset 0 3px 9px rgb(0 0 0 / 0.075);
}

.navbar-default .navbar-nav > li > ul {
  position: absolute;
  display: none;
  left: 50%;
  margin-left: -125px;
  width: 250px;
  padding: 0 20px;
  list-style: none;
  background: var(--bak-red);
  border-top: 1px solid var(--bak-red);
  border-radius: 0 0 5px 5px;
  box-shadow: var(--bak-shadow-menu);
  z-index: 20;
  /* Canlı sitede alt menü maddeleri kutunun içinde ortalıdır (#menuTop .tc'den
     miras alınan text-align:center). Burada left verilmişti; kaldırıldı. */
}

.navbar-default .navbar-nav > li:hover > ul {
  display: block;
}

.navbar-default .navbar-nav > li > ul li {
  border-top: 1px solid rgb(255 255 255 / 0.2);
}

.navbar-default .navbar-nav > li > ul li:first-child {
  border-top: 0;
}

.navbar-default .navbar-nav > li > ul a {
  display: block;
  padding: 10px 0;
  color: var(--bak-white);
  font-weight: 400;
  text-decoration: none;
  transition: opacity var(--bak-ease);
}

.navbar-default .navbar-nav > li > ul a:hover {
  opacity: 0.5;
}

@media (min-width: 768px) {
  .navbar-default .navbar-header,
  .navbar-default .navbar-toggler {
    display: none !important;
  }

  .navbar-default .navbar-collapse.collapse {
    display: block !important;
    height: auto !important;
    overflow: visible !important;
    padding: 0;
    visibility: visible !important;
  }

  .navbar-default .navbar-nav {
    text-align: center;
  }
}

@media (max-width: 767.98px) {
  .diller {
    position: absolute;
    top: 12px;
    right: 15px;
    transform: none;
  }

  #top {
    height: auto;
    min-height: 72px;
    padding: 12px 0 8px;
  }

  h1.logo {
    margin: 8px 0 0;
  }

  h1.logo img {
    height: 40px;
    width: auto; /* oran korunur; sabit genislik burada logoyu eziyordu */
  }

  .navbar-default {
    margin-top: 8px;
    position: relative !important;
  }

  .navbar-default .navbar-header {
    display: block;
    text-align: center;
  }

  .navbar-default .navbar-collapse.collapse:not(.show) {
    display: none !important;
  }

  .navbar-default .navbar-collapse.collapse.show {
    display: block !important;
  }

  .navbar-default .navbar-toggler {
    display: block;
    width: 100%;
    margin: 0;
    padding: 0.65rem;
    border: 0;
    border-radius: 0;
    background: var(--bak-red);
  }

  .navbar-toggler:focus {
    box-shadow: none;
  }

  .navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(255,255,255,1)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
  }

  #bakioglu {
    width: 100%;
    padding: 0;
    text-align: center;
  }

  .navbar-default .navbar-nav {
    width: 100%;
    margin: 0;
  }

  .navbar-default .navbar-nav > li {
    display: block;
    margin: 0;
    border-bottom: 1px solid var(--bak-line-soft);
  }

  .navbar-default .navbar-nav > li > a {
    display: block;
    padding: 10px 15px !important;
    background: #eee;
    font-size: 13px;
    color: var(--bak-ink);
  }

  .navbar-default .navbar-nav > li a:hover {
    background: var(--bak-red);
    color: var(--bak-white);
  }

  .navbar-default .navbar-nav > li:hover > ul {
    display: none;
  }

  .navbar-default .navbar-nav > li > ul {
    position: static;
    display: none;
    width: 100%;
    margin: 0;
    left: auto;
    box-shadow: none;
    border-radius: 0;
  }
}

/* ==========================================================================
   Hero slider (Swiper)
   ========================================================================== */
#sliderHome {
  position: relative;
}

#slider.swiper {
  overflow: hidden;
}

#slider .swiper-slide img {
  display: block;
  width: 100%;
  height: auto;
}

#slider .sliderContent {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 50%;
  z-index: 5;
}

#slider .sliderContent .container {
  position: relative;
  z-index: 100;
}

#slider h2,
#slider h3 {
  margin: 0;
  color: var(--bak-white);
}

#slider h2 {
  font-size: 59px;
  font-weight: 600;
}

#slider h3 {
  font-size: 72px;
  font-weight: 400;
}

#slider p {
  padding: 0 200px;
  color: var(--bak-white);
  font-weight: 400;
  font-size: 24px;
}

#slider .swiper-button-prev,
#slider .swiper-button-next {
  top: 50%;
  width: 16px;
  height: 28px;
  margin-top: 0;
  transform: translateY(-50%);
  background: url("/images/owl-arrow.webp") no-repeat;
  color: transparent;
}

#slider .swiper-button-prev {
  left: 30px;
  background-position: 0 0;
}

#slider .swiper-button-next {
  right: 30px;
  background-position: -35px 0;
}

#slider .swiper-button-prev::after,
#slider .swiper-button-next::after {
  content: none;
}

#down {
  position: absolute;
  bottom: -24px;
  left: 50%;
  z-index: 4;
  width: 48px;
  height: 48px;
  margin-left: -24px;
  border-radius: 48px;
  background: var(--bak-white) url("/images/down.png") no-repeat center;
  cursor: pointer;
  transition: var(--bak-ease-slow);
}

#down:hover {
  bottom: -30px;
  background-color: #eee;
}

#down.clicked {
  bottom: 50px;
  opacity: 0;
  pointer-events: none;
}

/* ==========================================================================
   Home sections
   ========================================================================== */
#products {
  position: relative;
  text-align: center;
}

#products .think {
  position: absolute;
  inset: 0 auto auto 0;
  width: 100%;
  height: 55%;
  background: var(--bak-bg-think) url("/images/think-flexible-logo-r.webp") no-repeat center;
  background-size: contain;
}

.homeImg {
  position: relative;
  padding-top: 178px;
  margin: 0 auto;
  opacity: 1;
}

#products h1,
#products h3 {
  margin: 60px 0 25px;
  font-size: 24px;
  font-weight: 600;
  color: var(--bak-gray-mid);
}

#products p {
  font-size: 16px;
  color: var(--bak-gray);
}

#projects {
  margin: 80px 0 0;
  overflow: hidden;
}

.proje {
  position: relative;
  z-index: 1;
  display: block;
  padding: 20px 20px 20px 100px;
  text-align: left;
  color: var(--bak-white);
  opacity: 1;
}

.proje h1,
.proje h3 {
  margin: 15px 0 0;
  font-size: 18px;
  font-weight: 600;
}

.proje p {
  font-size: 14px;
  font-weight: 400;
}

.proje.biten {
  background: var(--bak-red) url("/images/cat.webp") no-repeat 20px center;
}

.proje.biten::after {
  content: "";
  position: absolute;
  top: 0;
  left: -297%;
  z-index: -1;
  width: 300%;
  height: 100%;
  background: var(--bak-red);
}

.proje.biten p {
  color: var(--bak-red-soft);
}

.proje.devam {
  background: var(--bak-gray-mid) url("/images/movie.webp") no-repeat 30px center;
}

.proje.devam::after {
  content: "";
  position: absolute;
  top: 0;
  right: -295%;
  z-index: -1;
  width: 300%;
  height: 100%;
  background: var(--bak-gray-mid);
}

.proje.devam p {
  color: var(--bak-gray-light);
}

.proje:hover {
  color: var(--bak-white);
  opacity: 0.8;
}

#about {
  position: relative;
  z-index: 1;
  margin: 100px 0 50px;
  padding: 10px 0;
  background: var(--bak-bg-soft);
}

#about .container .col-sm-12::after {
  content: "";
  position: absolute;
  top: -25%;
  left: 0;
  z-index: -1;
  width: 100%;
  height: 140%;
  background: url("/images/world.webp") no-repeat center;
  background-size: contain;
}

#about h1,
#about h3 {
  margin-top: 25px;
  font-size: 24px;
  font-weight: 600;
  color: var(--bak-gray-mid);
}

#about p {
  margin: 30px 0 0;
  padding: 0 50px;
  font-size: 16px;
  font-weight: 400;
  line-height: 22px;
  color: var(--bak-gray);
}

#news h2 {
  margin: 30px 0 60px;
  text-align: center;
  color: var(--bak-red);
  font-weight: 600;
}

#news .haberBaslik {
  display: block;
  min-height: 3em;
  color: var(--bak-ink-soft);
  font-size: 24px;
  font-weight: 600;
}

#news .haberBaslik:hover {
  color: var(--bak-red);
}

#news p {
  color: var(--bak-gray);
  font-size: 14px;
}

#news .newsDate {
  color: var(--bak-red);
}

#newsCarousel.swiper {
  overflow: hidden;
}

/* Gosterge swiper kutusunun disinda (bkz. _HomePageSections.cshtml) — icerde
   kalinca .swiper overflow:hidden tarafindan kirpiliyor ve hic gorunmuyordu. */
#newsPagination.swiper-pagination {
  position: relative;
  width: 100%;
  margin-top: 40px;
  text-align: center;
}

#newsPagination .swiper-pagination-bullet {
  width: 25px;
  height: 5px;
  margin: 0 5px;
  border-radius: 5px;
  background: var(--bak-dot);
  opacity: 1;
}

#newsPagination .swiper-pagination-bullet-active {
  background: var(--bak-red);
}

#logos {
  margin: 50px 0;
}

#logoCarousel {
  padding: 0 10px;
  text-align: center;
  overflow: hidden;
}

#logoCarousel .swiper-slide {
  width: auto;
  text-align: center;
}

/* Logolar tek ekrana siginca Swiper kurulmaz (site.js), serit ortalanir */
#logoCarousel.is-static .swiper-wrapper {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 40px;
  transform: none !important;
}

#logoCarousel.is-static .swiper-slide {
  margin: 0 !important;
}

#logoCarousel .swiper-slide img {
  height: 66px;
  width: auto;
  margin: 0 auto;
  opacity: 0.7;
  filter: grayscale(100%);
  transition: var(--bak-ease-slow);
  cursor: pointer;
}

#logoCarousel .swiper-slide img:hover {
  opacity: 1;
  filter: grayscale(0);
}

/* ==========================================================================
   Footer
   ========================================================================== */
#footerTop img {
  opacity: 0.7;
  filter: grayscale(100%);
  transition: opacity var(--bak-ease);
}

#footerTop img:hover {
  opacity: 1;
  filter: grayscale(0);
}

#footerTop .di {
  padding: 12px;
}

#footerTop .d-flex a,
#ispolicy,
#bth {
  font-size: 12px;
  color: #666;
}

.kvkk-link {
  /* Dar tutuluyor: daha genis bosluklarda Ege Orman Vakfi logosu sikisip kuculuyordu.
     (font-size/renk "#footerTop .d-flex a" kuralindan geliyor.) */
  margin-right: 8px;
  padding: 8px;
  /* "Çerez Tercihleri" ve "Kişisel Verilerin Korunması Kanunu" iki satira boluniyordu */
  white-space: nowrap;
}

/* Logo, linkler yer kapladikca kuculmesin */
#footerTop .justify-content-end > a:last-child { flex: 0 0 auto; }
#footerTop .justify-content-end > a:last-child img { min-width: 54px; }

/* Dar ekranlarda tek satir sigmayinca alt alta gecsin, kelime kirilmasin */
@media (max-width: 1199px) {
  #footerTop .justify-content-end {
    flex-wrap: wrap;
    row-gap: 4px;
  }

  .kvkk-link {
    margin-right: 10px;
    padding: 6px 0;
  }
}

.holding {
  margin-top: 5px;
}
.holding img {
  width: 94px;
  height: 33px;
}

#footer {
  margin: 20px 0 0;
  padding: 35px 30px;
  border-top: 1px solid var(--bak-line);
  border-bottom: 1px solid var(--bak-line);
  background: var(--bak-red);
  color: var(--bak-white);
}

#footer a {
  color: var(--bak-white);
}

#footer .col-sm-6:first-child {
  text-align: left;
}

#footer .col-sm-6:last-child {
  text-align: right;
}

.sosyal {
  padding: 9px 5px 7px 15px;
  text-align: left;
}

/* Beyaz daire + bordo glif. Glifler inline SVG (bkz. _Footer.cshtml); rengi
   currentColor'dan alir, sprite'taki gibi olcek kaybi olmaz. */
.sosyal a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  margin: 0 4px 0 0;
  border-radius: 50%;
  background: var(--bak-white);
  color: var(--bak-red);
  transition: opacity var(--bak-ease), transform var(--bak-ease);
}

/* "#footer a" id ozgullugu ile beyaz rengi dayatiyor; glif beyaz daire uzerinde
   beyaz kalmasin diye bordo burada id'li secici ile veriliyor. */
#footer .sosyal a {
  color: var(--bak-red);
}

.sosyal a svg {
  width: 15px;
  height: 15px;
  fill: currentColor;
  pointer-events: none;
}

.sosyal a:hover,
.sosyal a:focus-visible {
  opacity: 0.75;
  transform: translateY(-2px);
}

.sosyal a:focus-visible {
  outline: 2px solid var(--bak-white);
  outline-offset: 2px;
}

.copyright {
  margin-top: 10px;
  font-size: 12px;
  color: var(--bak-gray);
}

/* ==========================================================================
   Cookie bar
   ========================================================================== */
.cookie-disclaimer {
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: 99999;
  width: 100%;
  background: var(--bak-red);
  opacity: 0;
  transform: translateY(100%);
  transition: transform 300ms cubic-bezier(0.4, 0, 0.2, 1), opacity 300ms cubic-bezier(0.4, 0, 0.2, 1);
}

.cookie-disclaimer.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.cookie-disclaimer_content {
  width: min(50%, 100%);
  margin: 0 auto;
  padding: 15px 0;
  color: var(--bak-white);
  font-size: 14px;
  font-weight: 400;
}

.cookie-disclaimer_content a {
  color: var(--bak-white) !important;
  font-size: 14px !important;
  text-decoration: underline;
}

.cookie-disclaimer_content .btn {
  display: inline-block;
  margin: 0 auto;
  padding: 5px 15px;
  border: 0;
  border-radius: 0;
  background: var(--bak-gray-mid);
  color: var(--bak-white);
  font-size: 14px;
}

.cookie-disclaimer_content .btn:hover,
.cookie-disclaimer_content .btn:focus {
  background: var(--bak-black);
  box-shadow: none;
  outline: 0;
}

/* ==========================================================================
   Video modal (Fancybox replacement)
   ========================================================================== */
.video-modal {
  position: relative;
  width: 70%;
  max-width: min(800px, 92vw);
  padding: 0;
  border: 0;
  background: var(--bak-black);
}

.video-modal::backdrop {
  background: rgb(0 0 0 / 0.65);
}

.video-modal__frame {
  position: relative;
  padding-top: 56.25%;
}

.video-modal__frame iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

/* Kapatma butonu modalin ICINDE durur: disarida (top:-2.2rem) kaldiginda
   kucuk ekranlarda gorunur alanin disina tasip erisilemez oluyordu. */
.video-modal__close {
  position: absolute;
  top: 8px;
  right: 8px;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: rgb(0 0 0 / 0.55);
  color: var(--bak-white);
  font-size: 1.5rem;
  line-height: 1;
  cursor: pointer;
  transition: background .2s ease;
}

.video-modal__close:hover,
.video-modal__close:focus-visible {
  background: var(--bak-red);
  outline: none;
}

/* ==========================================================================
   Harita modalı (iletişim sayfası)
   ========================================================================== */
.map-modal {
  position: relative;
  width: min(900px, 94vw);
  max-width: 94vw;
  padding: 0;
  border: 0;
  overflow: hidden;
  background: var(--bak-black);
}

.map-modal::backdrop {
  background: rgb(0 0 0 / 0.65);
}

/* Bordo baslik seridi: solda sube adi, sagda kapat. */
.map-modal__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 16px 24px;
  background: var(--bak-red);
}

.map-modal__title {
  margin: 0;
  color: var(--bak-white);
  font-size: 18px;
  font-weight: 700;
  line-height: 1.3;
  text-transform: uppercase;
  letter-spacing: .01em;
}

.map-modal__frame {
  position: relative;
  padding-top: 62%;
}

.map-modal__frame iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

.map-modal__close {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--bak-white);
  line-height: 0;
  cursor: pointer;
  transition: opacity .2s ease, transform .2s ease;
}

.map-modal__close svg {
  width: 20px;
  height: 20px;
  pointer-events: none;
}

.map-modal__close:hover,
.map-modal__close:focus-visible {
  opacity: .7;
  transform: rotate(90deg);
  outline: none;
}

.map-modal__close:focus-visible {
  outline: 2px solid var(--bak-white);
  outline-offset: 2px;
}

@media (max-width: 575.98px) {
  .map-modal__head { padding: 12px 16px; }
  .map-modal__title { font-size: 15px; }
}

/* Harita butonu <a> iken <button> oldu; canlıdaki gri .send görünümü korunur
   (aşağıdaki "button.send" kuralı iletişim formunun kırmızı butonu içindir). */
button.send.map-trigger {
  display: block;
  width: 100%;
  padding: 21px 20px;
  border: 0;
  border-radius: 4px;
  margin-top: 10px;
  background: #656868;
  color: #fff;
  font-family: "Panton", sans-serif;
  font-size: 16px;
  font-weight: 600;
  text-align: center;
  text-transform: none;
  letter-spacing: normal;
  cursor: pointer;
  transition: .5s ease-in;
}

button.send.map-trigger:hover {
  background: #af2c36;
  filter: none;
}

/* ==========================================================================
   Belge (PDF) listeleri — kart satırları + yıl filtresi + sayfalama
   Yapıyı site.js kurar (initDocumentLists); JS yoksa eski liste görünür kalır.
   ========================================================================== */
.pressList {
  margin: 0 0 10px;
  text-align: left;
}

.pressToolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-bottom: 22px;
  padding-bottom: 18px;
  border-bottom: 1px solid #ececec;
}

.pressFilterLabel {
  margin: 0;
  font-size: 13px;
  font-weight: 600;
  color: var(--bak-gray-mid);
  letter-spacing: .3px;
  text-transform: uppercase;
}

.pressSelectWrap { position: relative; }

/* Tarayıcının kendi oku gizlenip yerine marka renginde bir çentik konur */
.pressSelectWrap::after {
  content: "";
  position: absolute;
  right: 14px;
  top: 50%;
  width: 8px;
  height: 8px;
  margin-top: -6px;
  border-right: 2px solid var(--bak-red);
  border-bottom: 2px solid var(--bak-red);
  transform: rotate(45deg);
  pointer-events: none;
}

.pressSelect {
  appearance: none;
  min-width: 190px;
  height: 42px;
  padding: 0 38px 0 14px;
  border: 1px solid #ddd;
  border-radius: 4px;
  background: var(--bak-white);
  color: var(--bak-ink);
  font-family: inherit;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: border-color var(--bak-ease), box-shadow var(--bak-ease);
}

.pressSelect:hover { border-color: var(--bak-red); }

.pressSelect:focus {
  outline: none;
  border-color: var(--bak-red);
  box-shadow: 0 0 0 3px rgb(175 44 54 / .12);
}

.pressCount {
  margin-left: auto;
  font-size: 12px;
  font-weight: 600;
  color: var(--bak-gray-light);
}

.pressItems {
  margin: 0;
  padding: 0;
  list-style: none;
}

/* İçerik alanının genel <ul> madde imini (rok.png) bu listede iptal eder */
#masterContent .icerik .pressItems {
  list-style: none;
  list-style-image: none;
}

.pressItem { margin: 0 0 8px; }
#masterContent .icerik .pressItem { margin-bottom: 8px; }
.pressItem[hidden] { display: none; }

.pressItem > a {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 14px 18px;
  border: 1px solid #ececec;
  border-left: 3px solid transparent;
  border-radius: 4px;
  background: var(--bak-white);
  color: var(--bak-ink);
  text-decoration: none;
  transition: border-color var(--bak-ease), background-color var(--bak-ease), box-shadow var(--bak-ease);
}

#masterContent .icerik .pressItem > a { color: var(--bak-ink); }

.pressItem > a:hover,
.pressItem > a:focus-visible {
  border-color: #e2c4c7;
  border-left-color: var(--bak-red);
  background: #fcfafa;
  box-shadow: 0 2px 10px rgb(0 0 0 / .05);
  text-decoration: none;
}

#masterContent .icerik .pressItem > a:hover { color: var(--bak-red); }

.pressIcon {
  flex: 0 0 auto;
  display: flex;
  color: var(--bak-red);
}

.pressIcon svg { display: block; }

.pressBody {
  flex: 1 1 auto;
  min-width: 0;
}

.pressTitle {
  display: block;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.4;
}

.pressDate {
  display: block;
  margin-top: 3px;
  font-size: 12px;
  font-weight: 400;
  color: var(--bak-gray-light);
}

.pressGo {
  flex: 0 0 auto;
  color: #cfcfcf;
  transition: color var(--bak-ease), transform var(--bak-ease);
}

.pressItem > a:hover .pressGo {
  color: var(--bak-red);
  transform: translateX(3px);
}

.pressEmpty {
  margin: 24px 0;
  padding: 18px;
  border: 1px dashed #e0e0e0;
  border-radius: 4px;
  color: var(--bak-gray-light);
  text-align: center;
}

.doc-pager {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  margin: 25px 0 10px;
}

.doc-pager button {
  min-width: 38px;
  height: 38px;
  padding: 0 10px;
  border: 0;
  border-radius: 4px;
  background: transparent;
  color: #656868;
  font-size: 15px;
  cursor: pointer;
  transition: .3s ease;
}

.doc-pager button:hover { background: #f0f0f0; }

.doc-pager button[aria-current="page"] {
  background: #af2c36;
  color: #fff;
  font-weight: 600;
}

.doc-pager button[disabled] { opacity: .35; cursor: default; }
.doc-pager button[disabled]:hover { background: transparent; }

.doc-empty { padding: 20px 0; color: #757575; }

/* Bootstrap kolon siniflari [hidden]'i ezebiliyor */
.icerik [hidden] { display: none !important; }

/* ==========================================================================
   Pazarlar — dünya haritası
   ========================================================================== */
.market-map {
  position: relative;
  margin-bottom: 30px;
  border: 1px solid #eee;
  padding: 10px;
  background: #fff;
}

.market-map svg {
  display: block;
  width: 100%;
  height: auto;
}

.market-map path {
  fill: #ececec;
  stroke: #fff;
  stroke-width: .5;
  vector-effect: non-scaling-stroke;
}

.market-map path.is-market {
  fill: #af2c36;
  cursor: pointer;
  transition: fill .25s ease;
}

.market-map path.is-market:hover,
.market-map path.is-market:focus {
  fill: #656868;
  outline: none;
}

/* Ulke isaretcisi: hover/tooltip ulke yolunda kalsin diye tiklamayi gecirir.
   Olcegi JS'te zoom ile ters orantili verilir, buyume yapmaz. */
.market-map .market-pin {
  pointer-events: none;
}

/* ".market-map path" ulke yollari icin fill/stroke veriyor ve CSS sunum
   niteliklerini ezdigi icin isaretcinin bordo glifi de griye donuyordu. */
.market-map .market-pin circle {
  fill: var(--bak-white);
  stroke: none;
}

.market-map .market-pin path {
  fill: #b02e37;
  stroke: none;
}

.market-map__tooltip {
  position: absolute;
  z-index: 3;
  padding: 4px 10px;
  border-radius: 3px;
  background: #656868;
  color: #fff;
  font-size: 13px;
  line-height: 1.4;
  white-space: nowrap;
  pointer-events: none;
  transform: translate(-50%, -140%);
}

.market-map__tooltip[hidden] { display: none; }

.market-map__zoom {
  position: absolute;
  top: 18px;
  right: 18px;
  z-index: 4;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.market-map__zoom button {
  width: 30px;
  height: 30px;
  padding: 0;
  border: 1px solid #ddd;
  border-radius: 3px;
  background: #fff;
  color: #656868;
  font-size: 18px;
  line-height: 1;
  cursor: pointer;
  transition: .2s ease;
}

.market-map__zoom button:hover:not([disabled]) {
  background: #af2c36;
  border-color: #af2c36;
  color: #fff;
}

.market-map__zoom button[disabled] { opacity: .4; cursor: default; }

/* Haritanin altindaki iki baslik: yan yana degil alt alta, basinda gri onay isareti */
.market-map ~ .row > h3 {
  /* içerikten "col-sm-6" ile geliyor; Bootstrap'in width:50% kuralı ezilir */
  flex: 0 0 100%;
  width: 100%;
  max-width: 100%;
  display: flex;
  align-items: baseline;
  gap: .4em;
  text-align: left;
}

.market-map ~ .row > h3::before {
  content: "\2713";
  flex: 0 0 auto;
  color: #656868;
  font-weight: 700;
}

/* Yakinlastirilmisken suruklenerek gezilebilir */
.market-map.is-zoomed svg { cursor: grab; }
.market-map.is-panning svg { cursor: grabbing; }

@media (max-width: 767px) {
  .market-map { padding: 4px; }
  .market-map__tooltip { font-size: 12px; }
  .market-map__zoom { top: 10px; right: 10px; }
}

/* ==========================================================================
   Görsel lightbox
   ========================================================================== */
.img-lightbox {
  width: auto;
  max-width: min(1100px, 94vw);
  max-height: 92vh;
  padding: 0;
  border: 0;
  background: transparent;
  overflow: visible;
}

.img-lightbox::backdrop { background: rgb(0 0 0 / .75); }

.img-lightbox img {
  display: block;
  max-width: 100%;
  max-height: 88vh;
  width: auto;
  height: auto;
  margin: 0 auto;
  background: #fff;
}

.img-lightbox__close {
  position: absolute;
  top: 8px;
  right: 8px;
  z-index: 3;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: rgb(0 0 0 / 0.55);
  color: var(--bak-white);
  font-size: 1.75rem;
  line-height: 1;
  cursor: pointer;
  transition: background .2s ease;
}

/* Galeri icindeki gorseller arasi gecis butonlari */
.img-lightbox__nav {
  position: absolute;
  top: 50%;
  z-index: 3;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  transform: translateY(-50%);
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: rgb(0 0 0 / 0.55);
  color: var(--bak-white);
  font-size: 1.25rem;
  line-height: 1;
  cursor: pointer;
  transition: background .2s ease;
}

.img-lightbox__nav--prev { left: 8px; }
.img-lightbox__nav--next { right: 8px; }

.img-lightbox__close:hover,
.img-lightbox__close:focus-visible,
.img-lightbox__nav:hover,
.img-lightbox__nav:focus-visible {
  background: var(--bak-red);
  outline: none;
}

.img-lightbox__nav[hidden],
.img-lightbox__counter[hidden] { display: none; }

.img-lightbox__counter {
  position: absolute;
  left: 50%;
  bottom: 8px;
  transform: translateX(-50%);
  padding: 4px 12px;
  border-radius: 20px;
  background: rgb(0 0 0 / 0.55);
  color: var(--bak-white);
  font-size: 13px;
  line-height: 1.4;
}

@media (max-width: 767px) {
  .img-lightbox__nav { width: 38px; height: 38px; font-size: 1rem; }
}

/* Ürün grubu detayındaki görsel tıklanabilir olduğunu belli etsin */
#masterContent .icerik .proHolder img[data-lightbox],
#masterContent .icerik .imgHolder img[data-lightbox] { cursor: zoom-in; }

/* ==========================================================================
   .thumbnail — Bootstrap 3'te vardı, 5'te kaldırıldı.
   Reborn Ailesi logolarının ince çerçevesi bu sınıftan geliyordu.
   ========================================================================== */
.thumbnail {
  display: block;
  padding: 4px;
  margin-bottom: 20px;
  line-height: 1.42857143;
  background-color: #fff;
  border: 1px solid #ddd;
  border-radius: 4px;
  transition: border .2s ease-in-out;
}

.thumbnail > img,
.thumbnail a > img {
  display: block;
  max-width: 100%;
  height: auto;
  margin-right: auto;
  margin-left: auto;
}

.thumbnail .caption {
  padding: 9px;
  color: #333;
}

a.thumbnail:hover,
a.thumbnail:focus { border-color: var(--bak-red); }

/* ==========================================================================
   Site pop-up (Panel > Pop-up'lar)
   ========================================================================== */
.site-popup {
  position: relative;
  width: fit-content;
  max-width: min(760px, 90vw);
  max-height: 72vh;
  padding: 0;
  border: 0;
  background: transparent;
  overflow: visible;
}

.site-popup::backdrop {
  background: rgb(0 0 0 / 0.65);
}

.site-popup > a {
  display: block;
  line-height: 0;
}

.site-popup img {
  display: block;
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 60vh;
  margin: 0 auto;
  border-radius: 4px;
}

.site-popup__close {
  position: absolute;
  top: -14px;
  right: -14px;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: var(--bak-red);
  color: var(--bak-white);
  line-height: 0;
  cursor: pointer;
  box-shadow: 0 2px 10px rgb(0 0 0 / 0.35);
  transition: background-color .2s ease, transform .2s ease;
}

.site-popup__close svg {
  width: 16px;
  height: 16px;
  pointer-events: none;
}

.site-popup__close:hover,
.site-popup__close:focus-visible {
  background: #111;
  transform: rotate(90deg);
}

.site-popup__close:focus-visible {
  outline: 2px solid var(--bak-white);
  outline-offset: 2px;
}

@media (max-width: 767px) {
  .site-popup {
    max-width: 88vw;
  }

  .site-popup__close {
    top: -12px;
    right: -12px;
    width: 34px;
    height: 34px;
  }

  .site-popup__close svg {
    width: 14px;
    height: 14px;
  }
}

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width: 1366px) {
  .cookie-disclaimer_content {
    width: 90%;
  }
}

@media (min-width: 981px) and (max-width: 1199px) {
  .navbar-default .navbar-nav > li {
    margin: 0 !important;
  }

  .navbar-default .navbar-nav > li > a {
    padding: 13px 10px 10px;
  }

  #menuTop .container,
  #logos .container {
    width: 100%;
  }

  #logoCarousel {
    padding: 0 20px;
  }
}

@media (min-width: 768px) and (max-width: 980px) {
  .navbar-default .navbar-nav > li {
    margin: 0 0 0 3px;
  }

  .navbar-default .navbar-nav > li > a {
    padding: 13px 5px 10px;
    font-size: 12px;
  }

  #menuTop .container {
    width: 766px;
  }

  #logoCarousel {
    padding: 0 20px;
  }

  #logoCarousel .swiper-slide img {
    height: 50px;
  }

  #footer {
    padding: 35px 15px;
  }
}

@media (max-width: 980px) {
  #slider .sliderContent h2 {
    font-size: 50px;
  }
}

@media (max-width: 991px) {
  #footerTop .row.d-flex {
    display: block !important;
  }

  #footerTop .justify-content-end {
    margin-top: 15px;
    justify-content: space-between;
  }

  #footerTop .justify-content-start {
    justify-content: space-between;
  }
}

@media (max-width: 768px) {
  #footerTop .text-center,
  #footerTop .text-left,
  #footerTop .text-right {
    display: flex;
    flex-direction: row;
    width: 100%;
    justify-content: center;
    align-items: center;
    text-align: center !important;
  }
}

@media (max-width: 767.98px) {
  #down {
    display: none;
  }

  #slider .sliderContent {
    display: none;
  }

  #products {
    margin-top: -55px;
  }

  .homeImg {
    top: 20px;
    opacity: 1;
  }

  #products p {
    padding: 0 15px;
  }

  #projects {
    margin: 50px 0 0;
    padding: 0;
  }

  #projects .col-sm-6 {
    margin: 0;
    padding: 0;
  }

  #about {
    margin: 50px 0;
  }

  #about p {
    padding: 0 15px;
  }

  #news .haberBaslik {
    font-size: 18px;
  }

  #news p {
    margin: 10px 0;
  }

  #newsCarousel .swiper-slide {
    padding: 0 15px;
  }

  #newsPagination .swiper-pagination-bullet {
    width: 16px;
  }

  /* Belge listesi: filtre tam genişlik, satırlar biraz daha sıkı */
  .pressToolbar { gap: 8px; }
  .pressSelectWrap { flex: 1 1 100%; }
  .pressSelect { min-width: 100%; }
  .pressCount { margin-left: 0; }

  .pressItem > a {
    gap: 12px;
    padding: 12px 14px;
  }

  .pressTitle { font-size: 14px; }

  #logoCarousel {
    padding: 0;
    margin: 0 0 50px;
  }

  #logoCarousel .swiper-slide img {
    height: 40px;
    margin-bottom: 20px;
  }

  #footer {
    padding: 10px;
  }

  #footerTop .fl,
  #footerTop .fr {
    float: none !important;
    display: block !important;
    width: 100% !important;
  }
}

@media (max-width: 375px) {
  #footerTop .col-md-4 .d-flex,
  #footerTop .col-md-4.d-flex {
    display: block !important;
  }

  #footerTop .justify-content-center {
    margin-top: 15px;
  }

  #footerTop .kvkk-link {
    display: block;
    margin-bottom: 15px;
    text-align: center;
  }
}


/* ==========================================================================
   Inner pages (master layout)
   ========================================================================== */
#masterContent { margin-bottom: 30px; color: #717171; overflow: hidden; }
    #masterContent .icerik h1, #masterContent .icerik h2, #masterContent .icerik h3, #masterContent .icerik h4, #masterContent .icerik h5, #masterContent .icerik h6 { color: #af2c36; }
    #masterContent .icerik h4 { color: #656868; }
    #masterContent .icerik p { min-height: 10px; }
    #masterContent .icerik a { color: #af2c36; }

#masterImg { background: #af2c36; position: relative; height: 305px; overflow: hidden; }
#masterImg.smallMaster{height:180px}
    #masterImg > img { object-fit: cover; height: 100%; width: 100%; }
/* Ic sayfa hero gorseli uzerinde asagi dogru koyulasan katman.
   Canlidaki ile ayni gradient; opaklik .5 yerine .4 (yaklasik %20 daha hafif). */
#masterImg::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  opacity: .4;
  background: linear-gradient(to bottom, rgba(212, 228, 239, 0) 0%, rgba(0, 0, 0, 1) 100%);
}
.masterLeft #leftMenu h2 { display: none; }

.icerik { font-size: 14px; font-weight: 400; padding: 50px 10px 50px 0; text-align: justify; }

/* ---- Haber detayi ------------------------------------------------------
   Gorsel kolonu col-sm-2'den col-sm-4'e cikti (yaklasik 2 kat). Baslik ve
   tarih .icerik'teki justify'dan etkilenmesin diye sola dayali. */
#masterContent .icerik .news-detail h3,
#masterContent .icerik .news-detail h5 {
  text-align: left;
  text-align-last: left;
  hyphens: none;
}

#masterContent .icerik .news-detail .imgHolder img {
  width: 100%;
  height: auto;
}


/* ---- İçerik tabloları ---------------------------------------------------
   Panelden gelen tablolar (Yönetim Kurulu, Ticari ve Sicil Bilgileri, tesis
   listesi, Bize Ulaşın) içerikte düz <table> olarak duruyor. Biçim tamamen
   burada; içerik değişmediği için editör aynı basit tabloyu girmeye devam eder.
   İletişim sayfasındaki .sube tablosunun kendi kuralları var, kapsam dışı. */
#masterContent .icerik table:not(.sube) {
  width: 100%;
  margin: 0 0 1.5rem;
  border: 1px solid var(--bak-line);
  border-radius: 10px;
  border-collapse: separate; /* satır içi border'lar böylece devre dışı kalır */
  border-spacing: 0;
  background: var(--bak-white);
  font-size: 14px;
}
/* Zeminler HÜCREYE veriliyor: Bootstrap'in ".table > :not(caption) > * > *"
   kuralı hücrelere beyaz zemin basıyor ve <tr> üzerindeki zemini örtüyor. */
#masterContent .icerik table:not(.sube) td {
  padding: .85rem 1rem;
  border-top: 1px solid var(--bak-line);
  background: var(--bak-white);
  vertical-align: middle;
  text-align: left;          /* .icerik'teki justify isimleri geriyordu */
  hyphens: none;
}
#masterContent .icerik table:not(.sube) tr:first-child td { border-top: 0; }
#masterContent .icerik table:not(.sube) tbody tr:nth-child(even) td { background: #fafafa; }
#masterContent .icerik table:not(.sube) tbody tr:hover td { background: #f6f1f1; }
/* editörden gelen <p><br /> ... </p> hücrelerde fazladan boşluk açıyordu */
#masterContent .icerik table:not(.sube) td p { margin: 0; }
#masterContent .icerik table:not(.sube) td p > br:first-child { display: none; }
/* köşe yuvarlatma: tablo elemanında overflow güvenilir kırpmıyor, köşe
   hücrelerine tek tek veriliyor */
#masterContent .icerik table:not(.sube) tr:first-child td:first-child { border-top-left-radius: 9px; }
#masterContent .icerik table:not(.sube) tr:first-child td:last-child { border-top-right-radius: 9px; }
#masterContent .icerik table:not(.sube) tr:last-child td:first-child { border-bottom-left-radius: 9px; }
#masterContent .icerik table:not(.sube) tr:last-child td:last-child { border-bottom-right-radius: 9px; }

/* Başlık satırı: tüm hücreleri kalın olan ilk satır (Yönetim Kurulu, tesis
   listesi). "Etiket : Değer" tablolarında yalnız ilk hücre kalın olduğu için
   bu kural devreye girmez — onlar düz liste görünümünde kalır. */
#masterContent .icerik table:not(.sube) tr:first-child:has(td:first-child strong):has(td:last-child strong) td,
#masterContent .icerik table:not(.sube) tr:first-child:has(td:first-child b):has(td:last-child b) td,
#masterContent .icerik table:not(.sube) tbody tr:first-child:has(td:first-child strong):has(td:last-child strong):hover td,
#masterContent .icerik table:not(.sube) tbody tr:first-child:has(td:first-child b):has(td:last-child b):hover td {
  background: var(--bak-gray-mid); /* breadcrumb şeridiyle aynı gri */
  color: var(--bak-white);
  font-weight: 600;
  letter-spacing: .02em;
  white-space: nowrap;
}
#masterContent .icerik table:not(.sube) tr:first-child td strong,
#masterContent .icerik table:not(.sube) tr:first-child td b { font-weight: 600; }

/* İsimler CV dosyasına bağlantı; tek satırda kalsın ve bağlantı olduğu belli olsun */
#masterContent .icerik table:not(.sube) td a {
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
}
#masterContent .icerik table:not(.sube) td a:hover { text-decoration: underline; }
/* PDF'e giden bağlantılara küçük belge simgesi (maske ile, rengi yazıdan alır) */
#masterContent .icerik table:not(.sube) td a[href$=".pdf" i]::after {
  content: "";
  display: inline-block;
  width: 12px;
  height: 12px;
  margin-left: .35rem;
  vertical-align: -1px;
  background-color: currentColor;
  -webkit-mask: var(--bak-doc-icon) no-repeat center / contain;
  mask: var(--bak-doc-icon) no-repeat center / contain;
  opacity: .75;
}

@media (max-width: 767px) {
  /* dar ekranda tablo kendi içinde yatay kayar; sayfa gövdesi kaymaz */
  #masterContent .icerik table:not(.sube) { display: block; overflow-x: auto; }
}

.logoHolder {
    margin-bottom: 5px;
    background: #fff;
    border: solid 2px #eee;
    padding: 5px;
    font-size: 18px;
    color: #656868;
}
.logoHolder span {
    display: inline-block;
    margin-left: 5px;
    border-left: solid 2px #eee;
    padding-left: 10px;
}

.breadcrumb { background-color: transparent; border-radius: 0; list-style: outside none none; margin-bottom: 0; padding: 10px 0 0; }
    .breadcrumb a { color: #ccc; font-weight: 400; }
        .breadcrumb a:hover { color: #eee; }
    .breadcrumb li { margin-bottom: 1px; }

    .breadcrumb > li + li::before { background: url("/images/breadcrumb-splitter.png") no-repeat scroll center center; content: ""; padding: 0 10px; }


    

#leftMenu { background: #656868; border-top: 10px solid #af2c36; padding: 30px 0 100px; z-index: 5; border-radius: 0px 0px 5px 5px; -webkit-border-radius: 0px 0px 5px 5px; }
/*#leftMenu:after{width:300%; height:100%; content:''; left:100%; top:0; position:absolute; background:#656868;  }*/

.nav-pills > li > a { border-radius: 0; border-bottom: solid 1px #777777; }
.nav-pills > li > a { background: url(/images/ok.png) no-repeat left -20px center; color: #fff; display: block; font-size: 15px; font-weight: 400; margin: 0 0 -2px; padding: 10px 15px; position: relative; transition: .3s ease; }
    .nav-pills > li > a:focus, .nav-pills > li > a:hover { background: #982730 url(/images/ok.png) no-repeat left 15px center; padding-left: 25px; text-decoration: none; transition: .3s ease; }
.nav-pills > li:last-child > a { border: none; }
.nav-pills > li.active > a, .nav-pills > li.active > a:focus, .nav-pills > li.active > a:hover { background: url(/images/ok.png) no-repeat left 15px center; color: #fff; padding-left: 25px; }


#masterContent .icerik ul { list-style-image: url(/images/rok.png); padding: 0; list-style-position: inside; }
    #masterContent .icerik ul li { margin-bottom: 10px; font-size: 14px; }

        #masterContent .icerik ul li a { color: #656868; transition: .3s ease; }
            #masterContent .icerik ul li a:hover { color: #af2c36; }

.masterRight .page-title, #masterContent .page-title { position: relative; padding-top: 30px; }
#masterImg .page-title { position: absolute; left: 0; top: 50%; margin-top: -50px; width: 100%; z-index: 3; }
.masterRight h2{ font-size: 30px; color: #fff; padding: 10px; margin: 0; position: relative; float: left; background: #af2c36; }

/* Baslik kutusu ile breadcrumb seridi ayni yukseklikte olsun (float yerine flex) */
.masterRight .page-title { display: flex; align-items: stretch; flex-wrap: wrap; }
.masterRight .page-title h2 { float: none; display: flex; align-items: center; }
.masterRight .page-title .bread { flex: 1 1 240px; min-width: 0; display: flex; }
.masterRight .page-title .breadcrumb { float: none; width: 100%; display: flex; align-items: center; flex-wrap: wrap; }
#masterContent .proTitle{text-align:center}
.proTitle h2 {font-size: 30px; color: #fff; padding: 10px; margin: 0; display:inline-block; background: #af2c36; }
#masterImg.productBanner .page-title h2 {background:none}
#masterImg { text-align: center; }
#masterImg.productBanner .breadcrumb {background:none}
    #masterImg h2 { display: inline-block; font-size: 30px; color: #fff; padding: 10px; margin: 0; position: relative; background: #af2c36; }
.masterRight .breadcrumb { margin: 0; padding: 16px 10px; position: relative; float: left; background: #656868; }
.proTitle .breadcrumb{float: none; display: inline-block; padding: 5px; margin: 0; position: relative; background: #656868; }
    .masterRight .breadcrumb:after { background: #656868; content: ''; height: 100%; width: 3000px; position: absolute; left: 0; top: 0; z-index: -1; }
#masterImg .breadcrumb { float: none; display: inline-block; padding: 5px; margin: 0; position: relative; background: #656868; }
    #masterImg .breadcrumb:after { display: none; }
.haber-item h4 { margin-top: 20px; height: 80px; text-align: left; }
.haber-item p { font-size: 14px; font-weight: 400; }

.g-recaptcha { border-radius: 10px; height: 73px; text-align: right; width: 290px; max-width: 100%; }
    .g-recaptcha div { margin: -2px 0 0 -1px; }
.form-controlC { border: 1px solid #e8e8e8; border-radius: 4px; background: #f9f9f9; }

.mapHolder { border: 1px solid #eee; padding: 10px; margin-bottom: 20px; }
.form-group { margin-bottom: 0; min-height: 60px; }
.form-control { padding: 10px 10px; height: 50px; color: #666; border-radius: 4px; box-shadow: none; font-size: 14px; }
.send { width: 100%; display: block; color: #fff !important; font-size: 16px; font-weight: 600; padding: 21px 20px; border-radius: 4px; margin-top: 10px; background: #656868; transition: .5s ease-in; }
    .send:hover { background: #af2c36; color: #fff; }
    .send:hover, .send:focus, .send.focus { color: #fff; }
.capHolder { overflow: hidden; width: 296px; max-width: 100%; }


.sube th { background: #af2c36; color: #fff; }
.sube td { padding: 10px; }
#masterContent .icerik .sube th h4 { color: #fff; padding: 20px; }

.pro { position: relative; overflow: hidden; background: #af2c36; transition: .5s ease-in; }
    .pro img { transition: .5s ease-in; height: 200px; width: 100%; object-fit: cover; }
.proName { color: #fff; position: relative; padding: 10px; font-size: 18px; transition: .5s ease-in; }
/* Kart ismi editorden <a> ile geliyor. "#masterContent .icerik a" kirmizi rengi
   daha yuksek ozgullukte olduğu icin yazi kirmizi zemine karisiyordu. */
#masterContent .icerik .proName a,
#masterContent .icerik .proName a:hover,
#masterContent .icerik .proName a:focus,
.proName a { color: #fff; text-decoration: none; }
.pro:hover img { opacity: .7; }
.pro:after { z-index: 2; pointer-events: none; opacity: 0; content: ''; position: absolute; right: 0; top: -40px; margin-left: -20px; width: 40px; height: 40px; background: #af2c36 url(/images/magnify.png) center no-repeat; transition: .3s ease-in; }
.pro:hover:after { opacity: 1; top: 0; }

#masterContent .icerik .document { background: #656868; padding: 10px; color: #fff; display: block; margin-top: 10px; }
    #masterContent .icerik .document:hover { background: #af2c36; }

#timeline .timeline-item:before { content: ''; display: block; width: 100%; clear: both; position: relative; }
#timeline { width: 100%; margin: 30px auto 0; position: relative; padding: 0 0 0 10px; transition: all 0.4s ease; }
    #timeline .timeline-year { position: absolute; content: ''; left: 5px; top: -7px; font-size: 16px; color: #af2c36; font-weight: 600; }

    #timeline .timeline-item:first-child .timeline-year { font-size: 20px; top: -10px; }
    #timeline .timeline-item:last-child .timeline-year { font-size: 20px; top: -10px; }

    #timeline:before { content: ""; width: 2px; height: 100%; background: #af2c36; left: 4px; top: 0; position: absolute; }
    #timeline:after { content: ""; clear: both; display: table; width: 100%; }
    #timeline .timeline-item { margin-bottom: 50px; width: 100%; position: relative; float: right; }
        #timeline .timeline-item .timeline-icon { background: #af2c36; width: 10px; height: 10px; position: absolute; top: 0; left: 4px; overflow: hidden; margin-left: -14px; -webkit-border-radius: 50%; border-radius: 50%; }
            #timeline .timeline-item .timeline-icon img { position: relative; }
        #timeline .timeline-item .timeline-content { width: 90%; float: right; transition: all 0.3s ease; text-align: left; margin-top: -13px; }
            #timeline .timeline-item .timeline-content h2 { font-size: 14px; background: #656868; color: #fff; font-weight: 600; -webkit-border-radius: 3px; 3px; border-radius: 3px; float: left; }

            #timeline .timeline-item .timeline-content p { margin-top: 10px; clear: left; float: left; }
            #timeline .timeline-item .timeline-content ul { margin-top: 10px; clear: left; float: left; padding-left: 18px; width: 100%; }
            #timeline .timeline-item .timeline-content li { margin-bottom: 4px; }

.sayfagaleri { margin-top: 20px; }
    .sayfagaleri hr { margin-bottom: 40px; }
    .sayfagaleri .img-thumbnail { margin-bottom: 5px; width: 100%; overflow: hidden; position: relative; }
        .sayfagaleri .img-thumbnail:after { background: #fff; height: 5px; width: 100%; position: absolute; left: 0; bottom: 0; content: ''; }
        .sayfagaleri .img-thumbnail img { width: 100%; object-fit: cover; transition: all 0.4s ease; }
            .sayfagaleri .img-thumbnail img:hover { opacity: .7; }

.mappa { border: solid 1px #eee; transition: .3s ease; }

.proHolder { text-align: center; margin-bottom:30px; padding: 10px; box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.25); transition: .3s ease; }
    .proHolder .proName { padding: 6px; background: #af2c36; color: #fff; font-size: 16px; font-weight: 500; transition: .3s ease; min-height: 60px; display: flex;justify-content: center;align-items: center;}
    .proHolder img { transition: .3s ease; }
    .proHolder:hover img { opacity: .7; }
    .proHolder:hover { box-shadow: 0px 4px 10px 4px rgba(0,0,0,0.15); }

/* ---- Haber listesi (tek sutun, gorsel solda) -----------------------------
   Haber detayindaki duzenin ayni; kartlar yerine alt alta satirlar. */
.icerik .news-list {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.icerik .news-row {
  display: flex;
  align-items: flex-start;
  gap: 24px;
  padding-bottom: 24px;
  border-bottom: 1px solid var(--bak-line, #e5e5e5);
}

.icerik .news-row:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}

.icerik .news-row__media {
  flex: 0 0 33%;
  max-width: 33%;
  overflow: hidden;
  border: 1px solid var(--bak-line, #e5e5e5);
  border-radius: 4px;
  background: #fff;
}

.icerik .news-row__media a {
  display: block;
  line-height: 0;
}

.icerik .news-row__media img {
  width: 100%;
  height: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  transition: opacity .3s ease, transform .4s ease;
}

.icerik .news-row:hover .news-row__media img {
  opacity: .85;
  transform: scale(1.03);
}

.icerik .news-row__body {
  flex: 1 1 auto;
  min-width: 0;
  text-align: left;
}

.icerik .news-row__body h3 {
  margin: 0 0 6px;
  font-size: 20px;
  line-height: 1.3;
  text-align: left;
  hyphens: none;
}

.icerik .news-row__body h3 a { color: var(--bak-red); }
.icerik .news-row:hover .news-row__body h3 a { color: #111; }

.icerik .news-row__date {
  display: block;
  margin-bottom: 10px;
  color: #777;
  font-size: 13px;
}

.icerik .news-row__body p {
  margin: 0 0 12px;
  text-align: left;
  hyphens: none;
}

.icerik .news-row__more {
  display: inline-block;
  color: var(--bak-red);
  font-weight: 600;
  font-size: 14px;
}

.icerik .news-row__more::after {
  content: " \2192";
  display: inline-block;
  transition: transform .25s ease;
}

.icerik .news-row__more:hover { color: #111; }
.icerik .news-row__more:hover::after { transform: translateX(4px); }

@media (max-width: 767.98px) {
  .icerik .news-row {
    flex-direction: column;
    gap: 14px;
  }

  .icerik .news-row__media {
    flex: 0 0 auto;
    max-width: 100%;
    width: 100%;
  }

  .icerik .news-row__body h3 { font-size: 18px; }
}


.icerik .all { width: 100%; display: block; color: #fff !important; font-size: 16px; text-align:center; font-weight: 600; padding: 5px; border-radius: 4px; margin-top: 10px; background: #656868; transition: .5s ease-in; margin-top:20px}
    .all:hover { background: #af2c36; color: #fff; }
    .all:hover, .all:focus, .all.focus { color: #fff; }

    .galHolder { margin-bottom: 20px; height: 150px; overflow: hidden; padding: 0; transition: 0.3s ease-in; }
    .galHolder img { object-fit: cover; transition: 0.3s ease-in; }
    .galHolder:hover img { opacity: .4; }
    .galHolder:after { opacity: 0; content: ''; top: 0; left: 0; position: absolute; width: 100%; height: 100%; background: url(/images/magnify.png) no-repeat center; pointer-events: none; z-index: -1; transition: 0.3s ease-in; }
    .galHolder:hover:after { opacity: 1; z-index: 2; }

    #sayfagaleriCarousel{padding:20px; border: 3px #eee solid; position:relative}
    #sayfagaleriCarousel .owl-controls{ position:absolute; right:25px; bottom:20px}
    #sayfagaleriCarousel .owl-dots .owl-dot span{background:#dadada; width:25px; border-radius:5px; height:5px}
    #sayfagaleriCarousel .owl-dots .owl-dot.active span,#news .owl-theme .owl-dots .owl-dot:hover span{background:#af2c36}

    #masterContent .icerik #tabs{list-style-image:none; list-style-position:inside; text-align:left; margin-top:20px}
#masterContent .icerik #tabs li { cursor: pointer; color: #656868; font-size: 18px;  background-color:#eee; padding:10px}
   #masterContent .icerik #tabs li.active { color: #fff; background:#af2c36 url(/images/ok.png) no-repeat right 10px center; }  
   
   .tabWrapper{padding:20px 15px}

   #katalog li{font-size:16px; border-bottom:solid 1px #eee;display:block;position:relative}
      #katalog li a{display:block;padding:10px 10px 10px 30px; }
      #katalog li.link{background:url(/images/link.png) no-repeat left center;}
      #katalog li.pdf{background:url(/images/pdf.png) no-repeat left center;}

      #ikIframe{border:solid 3px #eee}
     #masterImg.productBanner{height:150px}
     /*#masterImg.productBanner:after{display:none}*/

/* Bootstrap 5: stacked left menu (was .nav-stacked) */
#leftMenu .nav-pills {
  flex-direction: column;
}
#leftMenu .nav-pills .nav-link,
#leftMenu .nav-pills > li > a {
  border-radius: 0;
}

/* Breadcrumb: live site uses image splitter; keep simple slash spacing */
.breadcrumb > li + li::before {
  background: none;
  content: "/";
  padding: 0 8px;
  color: #ccc;
}

.masterRight .breadcrumb {
  list-style: none;
}
.masterRight .breadcrumb li {
  display: inline;
  color: #ccc;
}
.masterRight .breadcrumb a {
  color: #ccc;
}
.masterRight .breadcrumb a:hover {
  color: #eee;
}

/* Form label spacing on contact */
#masterContent .form-label {
  color: #656868;
  font-weight: 600;
  margin-bottom: 0.35rem;
}
#masterContent textarea.form-control {
  height: auto;
  min-height: 140px;
}

@media (max-width: 767.98px) {
  #leftMenu {
    margin-bottom: 20px;
    padding-bottom: 30px;
  }
  .masterLeft {
    float: none;
    width: 100%;
  }
  .masterRight {
    width: 100%;
  }
  .masterRight h2 {
    float: none;
    display: inline-block;
  }
  .masterRight .breadcrumb {
    float: none;
    display: block;
  }
  #masterImg {
    height: auto;
    min-height: 140px;
  }
  #masterImg > img {
    min-height: 140px;
  }
}

/* Contact form (CMS) */
#contact-form .send,
button.send {
  background: #af2c36;
  color: #fff;
  border: 0;
  padding: 10px 28px;
  font-family: "Panton", sans-serif;
  text-transform: uppercase;
  letter-spacing: .04em;
}
#contact-form .send:hover,
button.send:hover { filter: brightness(1.05); }
.form-consent-group { margin-top: .5rem; }
.form-consent-chk { display: flex; gap: .5rem; align-items: flex-start; margin: .4rem 0; font-size: .9rem; }

/* KVKK onayi + "KVKK Metni" baglantisi tek satirda: onay solda, belge baglantisi sagda.
   Baglanti yalniz sayfasi olan dilde basilir (bkz. SiteUi.HasPrivacyNoticePage). */
.form-consent-kvkk-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: .5rem 1rem;
}
.form-consent-chk--kvkk { flex: 1 1 16rem; }
.form-kvkk-read-link {
  flex: 0 0 auto;
  margin-left: auto; /* dar ekranda alt satira dustugunde de saga yasli kalir */
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .3rem .8rem;
  border: 1px solid var(--bak-red);
  border-radius: 100px;
  color: var(--bak-red);
  font-size: .8rem;
  line-height: 1.4;
  white-space: nowrap;
  text-decoration: none;
  transition: background var(--bak-ease), color var(--bak-ease);
}
/* Iletisim formu "#masterContent .icerik" icinde duruyor ve oradaki
   "#masterContent .icerik a" kurali (1,1,1) buradaki hover rengini (0,2,0)
   eziyordu: kirmizi zeminde kirmizi yazi okunmuyordu. Ikon currentColor
   kullandigi icin renkle birlikte o da beyaza doner. */
#masterContent .icerik a.form-kvkk-read-link:hover,
#masterContent .icerik a.form-kvkk-read-link:focus-visible,
.form-kvkk-read-link:hover,
.form-kvkk-read-link:focus-visible {
  background: var(--bak-red);
  color: var(--bak-white);
  text-decoration: none;
}
.form-kvkk-read-link svg {
  width: 14px;
  height: 14px;
  flex: 0 0 auto;
}
.insight-filter-bar { display: flex; flex-wrap: wrap; gap: .5rem; }
.insight-filter-btn {
  display: inline-block;
  padding: .35rem .75rem;
  border: 1px solid #ccc;
  color: #333;
  text-decoration: none;
  font-size: .85rem;
}
.insight-filter-btn.active,
.insight-filter-btn:hover {
  border-color: #af2c36;
  color: #af2c36;
}
/* Aktif dil: sadece bold + bordo, alt cizgi yok (tum dillerde ayni). */
.diller a.active,
.diller a[aria-current="page"] {
  color: var(--bak-red);
  font-weight: 700;
  text-decoration: none;
}

/* ==========================================================================
   Ana sayfa scroll reveal — eski sitedeki animate.css davranisinin karsiligi.
   .js-reveal sinifini site.js ekler; JS yoksa hicbir sey gizlenmez.
   Sadece >=768px'te devreye girer (eski responsive.css de mobilde kapatiyordu).
   ========================================================================== */
@keyframes bakFadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes bakFadeInUp { from { opacity: 0; transform: translate3d(0, 40px, 0); } to { opacity: 1; transform: none; } }
@keyframes bakFadeInLeft { from { opacity: 0; transform: translate3d(-60px, 0, 0); } to { opacity: 1; transform: none; } }
@keyframes bakFadeInRight { from { opacity: 0; transform: translate3d(60px, 0, 0); } to { opacity: 1; transform: none; } }

.js-reveal [data-reveal] { opacity: 0; }
.js-reveal [data-reveal].is-revealed {
  opacity: 1;
  animation-duration: .9s;
  animation-fill-mode: both;
}
.js-reveal [data-reveal="fade"].is-revealed { animation-name: bakFadeIn; }
.js-reveal [data-reveal="up"].is-revealed { animation-name: bakFadeInUp; }
.js-reveal [data-reveal="left"].is-revealed { animation-name: bakFadeInLeft; }
.js-reveal [data-reveal="right"].is-revealed { animation-name: bakFadeInRight; }
.js-reveal [data-reveal][data-reveal-delay="1"].is-revealed { animation-delay: .2s; }
.js-reveal [data-reveal][data-reveal-delay="2"].is-revealed { animation-delay: .4s; }
.js-reveal [data-reveal][data-reveal-delay="3"].is-revealed { animation-delay: .6s; }

@media (prefers-reduced-motion: reduce) {
  .js-reveal [data-reveal] { opacity: 1; }
  .js-reveal [data-reveal].is-revealed { animation: none; }
}