/* ============================================================
   Uygulama destek katmanı — orijinal temada jQuery eklentilerinin
   (owl-carousel, isotope, skrollr) çalışma anında ürettiği stillerin
   React karşılıkları. Tema CSS'i olduğu gibi korunur; bu dosya yalnızca
   eksik kalan davranış stillerini tamamlar.
   ============================================================ */

/* ---------- sayfa yükleme ---------- */
#main {
  transition: opacity 0.5s ease;
}
.loader {
  transition: opacity 0.4s ease;
}
.loader.loader-hidden {
  opacity: 0;
  visibility: hidden;
}

/* ---------- hero slider (owl fade karşılığı) ---------- */
.hero-wrap-image-slider .item {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  transition: opacity 1.3s ease;
}
.hero-wrap-image-slider .item.active {
  opacity: 1;
}
.hero-wrap-text-slider .item {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  visibility: hidden;
  transition: opacity 1s ease, visibility 1s;
  z-index: 3;
}
.hero-wrap-text-slider .item.active {
  opacity: 1;
  visibility: visible;
}
/* Orijinalde metin bloğu hero yüksekliğinin %50'sinden başlar (transform yok) */
.hero-wrap-item.center-item {
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
}

/* ---------- kutu içi slider ---------- */
.single-slider {
  position: relative;
  float: left;
  width: 100%;
}
.single-slider .item {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  opacity: 0;
  transition: opacity 0.8s ease;
  pointer-events: none;
}
.single-slider .item.active {
  position: relative;
  opacity: 1;
  pointer-events: auto;
}

/* ---------- parallax bg yumuşatma ---------- */
.parallax-inner .bg,
.hero-wrap-image-slider .bg {
  will-change: transform;
}

/* ---------- mobil menü ---------- */
@media only screen and (max-width: 1036px) {
  .nav-holder.vis-nav {
    display: block !important;
  }
}

/* ---------- masonry portfolyo ızgarası (isotope karşılığı) ---------- */
.gallery-items {
  position: relative;
}
.gallery-items .gallery-item {
  transition: transform 0.45s ease, opacity 0.45s ease, left 0.45s ease,
    top 0.45s ease;
}
.gallery-items.masonry-ready .gallery-item {
  position: absolute;
  top: 0;
  left: 0;
}
.gallery-item.filtered-out {
  opacity: 0;
  transform: scale(0.92);
  pointer-events: none;
}

/* ---------- ana sayfa proje kartları tıklanabilir ---------- */
/* Link, h3'ün görünümünü birebir devralır (renk/alt çizgi değişmez) */
.parallax-deck-item h3.folio-title a {
  color: inherit;
  text-decoration: none;
  transition: opacity 200ms linear;
}
.parallax-deck-item h3.folio-title a:hover {
  opacity: 0.7;
}
.paralax-wrap a {
  display: block;
  cursor: pointer;
}

/* ---------- ana sayfa 01: öne çıkan projeler slider'ı ---------- */
.featured-slide {
  display: block;
  position: relative;
  overflow: hidden;
}
.featured-slide-img {
  aspect-ratio: 3 / 4;
  object-fit: cover;
  object-position: center;
  display: block;
  width: 100%;
}
.featured-slide-caption {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  padding: 14px 16px;
  background: rgba(17, 18, 20, 0.82);
  color: #fff;
  font-family: "Muli", sans-serif;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  text-align: left;
  -webkit-transition: background 200ms linear;
  transition: background 200ms linear;
}
.featured-slide:hover .featured-slide-caption {
  background: #000;
}

/* ---------- ana sayfa 3: kompakt proje ızgarası ---------- */
.folio-compact {
  float: left;
  width: 100%;
}
/* Temanın .gallery-item genişlik kuralları (%25/%50) burada geçersiz:
   kart, içinde bulunduğu col-md-4 sütununu doldurur */
.folio-compact .gallery-item,
.folio-compact .gallery-item.folio-compact-item {
  width: 100% !important;
  float: left;
  margin-bottom: 12px;
}
.folio-compact .gallery-item a {
  display: block;
}
.folio-compact .grid-item-holder {
  padding: 4px;
}
.folio-compact-img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  display: block;
  position: relative;
  z-index: 2;
}

/* ---------- ana sayfa CTA (footer üstü) ---------- */
.home-cta section {
  padding: 110px 0;
}
.home-cta-inner {
  text-align: center;
  float: left;
  width: 100%;
}
.home-cta-inner .section-title {
  text-align: center;
  margin-bottom: 14px;
}
.home-cta-text {
  color: rgba(255, 255, 255, 0.85);
  font-size: 13px;
  line-height: 1.9;
  max-width: 560px;
  margin: 0 auto 34px;
}
.home-cta-btn {
  display: inline-block;
}
/* Koyu zeminde düğme: beyaz çerçeve/yazı, hover'da beyaz dolgu + siyah yazı */
.home-cta .btn {
  float: none;
  display: inline-block;
  color: #fff;
  border-color: #fff;
  position: relative;
  z-index: 1;
}
.home-cta .btn:before {
  background: #fff;
}
.home-cta .btn:hover,
.home-cta .btn:focus {
  color: #000;
}

/* ---------- proje açıklaması (zengin metin) ---------- */
.project-description {
  float: left;
  width: 100%;
  max-width: 860px;
  padding: 30px 0;
  font-family: Terminal, Monaco, monospace;
  font-size: 13px;
  line-height: 1.9;
  color: #333;
  text-align: left;
}
.project-description h2,
.project-description h3 {
  text-transform: uppercase;
  font-weight: 600;
  letter-spacing: 1px;
  color: #000;
  margin: 18px 0 10px;
}
.project-description h2 {
  font-size: 20px;
}
.project-description h3 {
  font-size: 16px;
}
.project-description p {
  margin-bottom: 12px;
}
.project-description ul,
.project-description ol {
  margin: 0 0 12px 20px;
}
.project-description li {
  margin-bottom: 4px;
}
.project-description a {
  color: #000;
  text-decoration: underline;
}
.project-description a:hover {
  opacity: 0.6;
}
.project-description strong {
  font-weight: 700;
}

/* ---------- Basında Biz kartları ---------- */
.press-card {
  display: block;
  margin-bottom: 40px;
  color: #000;
  text-decoration: none !important;
}
.press-card-media {
  display: block;
  position: relative;
  overflow: hidden;
  background: #f4f4f4;
}
.press-card-media img {
  width: 100%;
  aspect-ratio: 3 / 4;
  object-fit: cover;
  object-position: center top;
  display: block;
  -webkit-transition: transform 400ms ease;
  transition: transform 400ms ease;
}
.press-card:hover .press-card-media img {
  transform: scale(1.03);
}
.press-card-info {
  display: block;
  padding: 14px 0 0;
  text-align: left;
}
.press-card-publication {
  display: block;
  font-family: "Muli", sans-serif;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #999;
  margin-bottom: 6px;
}
.press-card-title {
  display: block;
  font-family: Terminal, Monaco, monospace;
  font-size: 14px;
  line-height: 1.5;
  color: #000;
}
.press-card-title .fa {
  font-size: 11px;
  margin-left: 6px;
  color: #999;
}
.press-card:hover .press-card-title {
  opacity: 0.65;
}

/* ---------- Ödüller listesi ---------- */
.awards-list {
  list-style: none;
  padding: 20px 0 40px;
  margin: 0;
  float: left;
  width: 100%;
  max-width: 900px;
}
.awards-list li {
  position: relative;
  border-bottom: 1px solid #e5e5e5;
}
.awards-list li:first-child {
  border-top: 1px solid #e5e5e5;
}
.award-row {
  display: flex;
  align-items: baseline;
  gap: 24px;
  padding: 18px 8px;
  cursor: default;
  -webkit-transition: background 200ms linear;
  transition: background 200ms linear;
}
.awards-list li:hover .award-row {
  background: #f7f7f7;
}
.award-year {
  font-family: "Muli", sans-serif;
  font-size: 15px;
  font-weight: 800;
  letter-spacing: 1px;
  color: #000;
  min-width: 56px;
}
.award-text {
  font-family: Terminal, Monaco, monospace;
  font-size: 13px;
  line-height: 1.7;
  color: #333;
}
.awards-list li:hover .award-text {
  color: #000;
}
/* hover'da beliren fotoğraf önizlemesi (imleci takip eder) */
.award-preview {
  position: fixed;
  z-index: 90;
  pointer-events: none;
  width: 260px;
  box-shadow: 0 14px 40px rgba(0, 0, 0, 0.3);
  opacity: 0;
  transform: scale(0.96);
  -webkit-transition: opacity 150ms linear, transform 150ms linear;
  transition: opacity 150ms linear, transform 150ms linear;
}
.award-preview.visible {
  opacity: 1;
  transform: scale(1);
}
.award-preview img {
  width: 100%;
  display: block;
}

/* ---------- ekip kartları (Hakkımızda) ---------- */
.team-holder > ul {
  list-style: none;
  padding-left: 0;
  float: left;
  width: 100%;
}
/* Fotoğraflar hangi oranda yüklenirse yüklensin kartlar tek tip görünür:
   3:4 dikey çerçeve, ortadan kırpma */
.team-photo img.team-photo-img {
  width: 100%;
  aspect-ratio: 3 / 4;
  object-fit: cover;
  object-position: center top;
  display: block;
}
.team-info h4 {
  color: #666;
  text-transform: uppercase;
  letter-spacing: 2px;
  padding-bottom: 8px;
}
.team-info p {
  font-size: 12px;
  line-height: 1.7;
  color: #444;
  margin-top: 6px;
}
/* Sosyal bağlantılar: her zaman görünür ikon satırı (mobil dahil) */
.team-contact {
  list-style: none;
  padding: 12px 0 0;
  margin: 0;
  float: left;
  width: 100%;
}
/* Temanın .team-holder li (%33 + padding) kuralını ikonlar için sıfırla */
.team-holder .team-contact li,
.team-contact li {
  float: none !important;
  width: auto !important;
  padding: 0 !important;
  display: inline-block;
  margin-right: 14px;
}
.team-contact li a {
  color: #1b1b1b;
  font-size: 15px;
  -webkit-transition: opacity 200ms linear;
  transition: opacity 200ms linear;
}
.team-contact li a:hover {
  opacity: 0.5;
}
/* Fotoğrafsız üye: isim baş harfleriyle yer tutucu — aynı 3:4 oran */
.team-photo-placeholder {
  width: 100%;
  aspect-ratio: 3 / 4;
  background: #1b1b1b;
  display: flex;
  align-items: center;
  justify-content: center;
}
.team-photo-placeholder span {
  color: rgba(255, 255, 255, 0.85);
  font-size: 44px;
  letter-spacing: 6px;
  font-weight: 300;
}

/* ---------- basit lightbox (portfolyo galerisi) ---------- */
.eg-lightbox {
  position: fixed;
  inset: 0;
  z-index: 999;
  background: rgba(0, 0, 0, 0.93);
  display: flex;
  align-items: center;
  justify-content: center;
}
.eg-lightbox img {
  max-width: 92vw;
  max-height: 92vh;
  width: auto;
  height: auto;
}
.eg-lightbox .lb-close,
.eg-lightbox .lb-prev,
.eg-lightbox .lb-next {
  position: absolute;
  color: #fff;
  font-size: 28px;
  cursor: pointer;
  width: 44px;
  height: 44px;
  line-height: 44px;
  text-align: center;
  background: rgba(0, 0, 0, 0.4);
  z-index: 2;
}
.eg-lightbox .lb-close {
  top: 20px;
  right: 20px;
}
.eg-lightbox .lb-prev {
  left: 20px;
  top: 50%;
  margin-top: -22px;
}
.eg-lightbox .lb-next {
  right: 20px;
  top: 50%;
  margin-top: -22px;
}

/* ---------- ekip üyesi detay/özgeçmiş sayfası ---------- */
.member-photo {
  float: left;
  width: 100%;
  margin-bottom: 30px;
}
.member-photo-img {
  width: 100%;
  aspect-ratio: 3 / 4;
  object-fit: cover;
  object-position: center top;
  display: block;
}
.member-contact {
  margin-top: 14px;
}
.member-info {
  float: left;
  width: 100%;
}
.member-title {
  font-family: "Muli", sans-serif;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #666;
  margin-bottom: 18px;
}
.member-desc {
  font-size: 14px;
  line-height: 1.8;
  color: #222;
  margin-bottom: 20px;
}
.member-bio {
  font-family: Terminal, Monaco, monospace;
  font-size: 13px;
  line-height: 1.9;
  color: #333;
  max-width: 720px;
}
.member-bio h2,
.member-bio h3 {
  text-transform: uppercase;
  letter-spacing: 1px;
  color: #000;
  margin: 18px 0 10px;
}
.member-bio h2 { font-size: 20px; }
.member-bio h3 { font-size: 16px; }
.member-bio p { margin-bottom: 12px; }
.member-bio ul,
.member-bio ol { margin: 0 0 12px 20px; }
.member-bio a { color: #000; text-decoration: underline; }
.member-bio strong { font-weight: 700; }
/* İsme/kartlara hover imleci */
.team-photo-link,
.team-info h3 a {
  cursor: pointer;
}
.team-info h3 a { color: #000; }
.team-info h3 a:hover { opacity: 0.6; }

/* ---------- iletişim formu captcha ---------- */
.contact-captcha {
  display: block;
  margin: 6px 0 4px;
}
.contact-captcha-label {
  display: block;
  font-size: 12px;
  color: #666;
  margin-bottom: 6px;
  letter-spacing: 1px;
}