/* ══════════════════════════════════════════════════════
   MEGA MENU — ADAPTIF SÜTUN MODLARI
   ══════════════════════════════════════════════════════ */

/* 1 sütun modu (≤5 alt menü) — tek sütun, tam genişlik */
.mega-body.mega-cols-1 .uk-navbar-dropdown-nav {
  grid-template-columns: 1fr !important;
}
.mega-body.mega-cols-1 .uk-navbar-dropdown-nav > li {
  border-right: none !important;
}

/* 2 sütun modu (6–8 alt menü) */
.mega-body.mega-cols-2 .uk-navbar-dropdown-nav {
  grid-template-columns: repeat(2, 1fr) !important;
}
.mega-body.mega-cols-2 .uk-navbar-dropdown-nav > li:nth-child(3n) {
  border-right: 1px solid rgba(255,255,255,0.04) !important;
}
.mega-body.mega-cols-2 .uk-navbar-dropdown-nav > li:nth-child(2n) {
  border-right: none !important;
}

/* 3 sütun modu (9+ alt menü) — style.css varsayılanını pekiştir */
.mega-body.mega-cols-3 .uk-navbar-dropdown-nav {
  grid-template-columns: repeat(3, 1fr) !important;
}

/* ══════════════════════════════════════════════════════
   MEGA MENU — RESPONSİVE BOYUTLAR
   ══════════════════════════════════════════════════════ */

/* ── Orta masaüstü (1200px – 1499px): kompakt ── */
@media (min-width: 1200px) and (max-width: 1499px) {
  .mega-sidebar {
    width: 118px !important;
    padding: 22px 10px !important;
  }
  .mega-sidebar-title {
    font-size: 13px !important;
    letter-spacing: 0.20em !important;
  }
  .mega-body .uk-navbar-dropdown-nav > li > a {
    font-size: 11.5px !important;
    padding: 14px 16px !important;
    gap: 7px !important;
  }
  .mega-body .uk-navbar-dropdown-nav > li > a::after {
    font-size: 17px !important;
  }
}

/* ── Orta-geniş masaüstü (1500px – 1999px) ── */
@media (min-width: 1500px) and (max-width: 1999px) {
  .mega-sidebar {
    width: 130px !important;
    padding: 26px 10px !important;
  }
  .mega-sidebar-title {
    font-size: 14px !important;
    letter-spacing: 0.22em !important;
  }
  .mega-body .uk-navbar-dropdown-nav > li > a {
    font-size: 12px !important;
    padding: 16px 18px !important;
    gap: 8px !important;
  }
  .mega-body .uk-navbar-dropdown-nav > li > a::after {
    font-size: 18px !important;
  }
}

/* ── Geniş masaüstü (≥2000px) ── */
@media (min-width: 2000px) {
  .mega-body .uk-navbar-dropdown-nav > li > a {
    padding: 22px 24px !important;
  }
}

/* ══════════════════════════════════════════════════════
   SLIDER — Slogan alt pozisyon + animasyon
   ══════════════════════════════════════════════════════ */

.slide-slogan-pos {
  padding-bottom: 100px;
}

@keyframes sloganIn {
  0%   { opacity: 0; }
  100% { opacity: 1; }
}

.uk-slideshow-items > li.uk-active .slogan-anim {
  animation: sloganIn 1.4s ease 0.2s both;
  will-change: opacity;
}


/* Aktif olmayan slayttaki sloganı gizle */
.uk-slideshow-items > li:not(.uk-active) .slogan-anim {
  opacity: 0;
}

/* ══════════════════════════════════════════════════════
   SLIDER ASSİSTAN — Robot + Form katmanı
   ══════════════════════════════════════════════════════ */

/* Katman: slider okları ve kontrolleri engellemesin */
.slide-assistant-layer {
  pointer-events: none;
  z-index: 10;
  width: 100% !important;
  left: 0 !important;
  /* slogan yüksekliği (~80px) + alt boşluk */
  padding-bottom: 250px;
}

/* İçerik sarmalayıcı */
.slide-assistant-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  pointer-events: auto;
  width: 100%;
  max-width: 450px;
  margin: 0 auto;
}

/* ── Animasyonlar ── */

/* Robot: float + arada 3D dönüş (10s döngü) */
@keyframes robotAnimate {
  /* Float fazı */
  0%   { transform: translateY(0px)   rotateY(0deg);   filter: drop-shadow(0 8px 24px rgba(0,0,0,0.4)); }
  8%   { transform: translateY(-10px) rotateY(0deg);   filter: drop-shadow(0 14px 32px rgba(0,0,0,0.35)); }
  16%  { transform: translateY(0px)   rotateY(0deg);   filter: drop-shadow(0 8px 24px rgba(0,0,0,0.4)); }
  24%  { transform: translateY(-10px) rotateY(0deg);   filter: drop-shadow(0 14px 32px rgba(0,0,0,0.35)); }
  32%  { transform: translateY(0px)   rotateY(0deg);   filter: drop-shadow(0 8px 24px rgba(0,0,0,0.4)); }
  40%  { transform: translateY(-10px) rotateY(0deg);   filter: drop-shadow(0 14px 32px rgba(0,0,0,0.35)); }
  48%  { transform: translateY(0px)   rotateY(0deg);   filter: drop-shadow(0 8px 24px rgba(0,0,0,0.4)); }
  /* Hafif 3D yönelme — sağa döner, geri gelir */
  52%  { transform: translateY(0px)  rotateY(0deg)   rotateZ(0deg);  filter: drop-shadow(0 8px 24px rgba(0,0,0,0.4)); }
  62%  { transform: translateY(-4px) rotateY(35deg)  rotateZ(6deg);  filter: drop-shadow(0 10px 26px rgba(0,0,0,0.45)); }
  72%  { transform: translateY(-4px) rotateY(-35deg) rotateZ(-6deg); filter: drop-shadow(0 10px 26px rgba(0,0,0,0.45)); }
  80%  { transform: translateY(0px)  rotateY(0deg)   rotateZ(0deg);  filter: drop-shadow(0 8px 24px rgba(0,0,0,0.4)); }
  /* Dönüş sonrası float */
  88%  { transform: translateY(-10px) rotateY(0deg); filter: drop-shadow(0 14px 32px rgba(0,0,0,0.35)); }
  100% { transform: translateY(0px)   rotateY(0deg); filter: drop-shadow(0 8px 24px rgba(0,0,0,0.4)); }
}

/* Bubble: soldan konuşma balonu gibi açılır */
@keyframes bubbleTalk {
  0%   { opacity: 0; transform: scale(0.1); }
  100% { opacity: 1; transform: scale(1); }
}

@keyframes bubblePulse {
  0%, 100% { opacity: 1; }
  50%       { opacity: 0.85; }
}

/* Robot + konuşma balonu */
.slide-assistant-top {
  position: relative;
  display: inline-flex;
  justify-content: center;
  margin-bottom: 50px;
  perspective: 320px;
  perspective-origin: center center;
}

.slide-assistant-robot {
  display: block;
  width: auto;
  height: auto;
  max-height: 224px;
  position: relative;
  z-index: 1;
  animation: robotAnimate 10s ease-in-out infinite;
  transform-style: flat;
  backface-visibility: visible;
}

/* Konuşma balonu: robotun sağ üstüne absolute */
.slide-assistant-bubble {
  position: absolute;
  top: 10px;
  left: calc(50% + 90px);
  color: rgba(255,255,255,0.92);
  font-family: "proxima-nova", sans-serif;
  font-size: 18px;
  font-weight: 200;
  white-space: nowrap;
  z-index: 2;
  transform-origin: bottom left;
  box-shadow: none;
  will-change: transform, opacity;
  backface-visibility: hidden;
  -webkit-font-smoothing: antialiased;
  transition: opacity 0.35s ease;
  animation:
    bubbleTalk  0.8s ease 0.6s both,
    bubblePulse 8s ease-in-out 2s infinite;
}

/* Scroll başladığında JS bu class'ı ekler — CSS animasyonu bastırır */
.slide-assistant-bubble.js-bubble-hide {
  animation: none !important;
  opacity: 0 !important;
}
.slide-assistant-bubble strong {
  color: #fff;
  font-weight: 700;
  font-size: 24px;
  display: block;
}

/* Form: input pill + buton yan yana, pill üste biner */
.slide-assistant-form {
  display: flex;
  align-items: center;
  width: 100%;
}

/* Beyaz input pill — butonun sol kısmına biner */
.slide-assistant-input-pill {
  display: flex;
  align-items: center;
  flex: 1;
  min-width: 0;
  background: rgb(255 255 255);
  border-radius: 50px;
  padding: 0 20px 0 26px;
  height: 50px;
  box-shadow: 0 8px 32px rgba(0,0,0,0.25);
  position: relative;
  z-index: 2;
  margin-right: -40px;
}

.slide-assistant-input {
  flex: 1;
  min-width: 0;
  background: transparent !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  color: #818893 !important;
  font-family: "proxima-nova", sans-serif;
  font-size: 14px;
  font-weight: 400;
  padding: 0 10px 0 0 !important;
  height: 100% !important;
  align-self: stretch;
}
.slide-assistant-input::placeholder {
  color: #818893 !important;
  font-weight: 400;
}

/* Arama ikonu */
.slide-assistant-search-ico {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  color: #9a9ea8;
}
.slide-assistant-search-ico svg { color: #9a9ea8; }

/* BANA SOR butonu — sağda, pill altında kalır */
.slide-assistant-btn {
  background: #d01734;
  color: #fff;
  border: none;
  border-radius: 50px;
  height: 50px;
  padding: 0 30px 0 52px;
  font-family: "proxima-nova", sans-serif;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  cursor: pointer;
  white-space: nowrap;
  flex-shrink: 0;
  position: relative;
  z-index: 1;
  transition: background 0.2s;
}
.slide-assistant-btn:hover { background: #a8001f; }

/* ══════════════════════════════════════════════════════
   SLIDER RESPONSİVE — Slogan + Asistan
   ══════════════════════════════════════════════════════ */

/* ── Küçük mobil (≤480px) ── */
@media (max-width: 480px) {
  .slogan-1 { font-size: 38px !important; }
  .slide-slogan-pos { padding-bottom: 70px; }

  .slide-assistant-layer { padding-bottom: 170px; }
  .slide-assistant-wrap { max-width: calc(100% - 32px); }
  .slide-assistant-top { margin-bottom: 16px; }
  .slide-assistant-robot { max-height: 150px; }

  .slide-assistant-bubble {
    font-size: 14px;
    left: calc(50% + 60px);
    top: 4px;
  }
  .slide-assistant-bubble strong { font-size: 14px; }

  .slide-assistant-input-pill {
    height: 40px;
    padding: 0 12px 0 16px;
    margin-right: -34px;
  }
  .slide-assistant-input { font-size: 12px; }
  .slide-assistant-btn {
    height: 40px;
    padding: 0 14px 0 14px; width: 100%;
    font-size: 10px;
  }
}

/* ── Mobil (481px – 767px) ── */
@media (min-width: 481px) and (max-width: 767px) {
  .slogan-1 { font-size: 50px !important; }
  .slide-slogan-pos { padding-bottom: 44px; }

  .slide-assistant-layer { padding-bottom: 190px; }
  .slide-assistant-wrap { max-width: calc(100% - 48px); }
  .slide-assistant-top { margin-bottom: 24px; }
  .slide-assistant-robot { max-height: 150px; }

  .slide-assistant-bubble {
    font-size: 13px;
    left: calc(50% + 50px);
    top: 6px;
  }
  .slide-assistant-bubble strong { font-size: 14px; }

  .slide-assistant-input-pill {
    height: 46px;
    margin-right: -38px;
  }
  .slide-assistant-input { font-size: 13px; }
  .slide-assistant-btn {
    height: 46px;
    padding: 0 22px 0 22px; width: 100%;
    font-size: 11px;
  }
}

/* ── Tablet (768px – 1199px) ── */
@media (min-width: 768px) and (max-width: 1199px) {
  .slogan-1 { font-size: 50px !important; }
  .slide-slogan-pos { padding-bottom: 72px; }

  .slide-assistant-layer { padding-bottom: 215px; }
  .slide-assistant-wrap { max-width: 400px; }
  .slide-assistant-top { margin-bottom: 38px; }
  .slide-assistant-robot { max-height: 170px; }

  .slide-assistant-bubble {
    font-size: 16px;
    left: calc(50% + 68px);
    top: 8px;
  }
  .slide-assistant-bubble strong { font-size: 19px; }

  .slide-assistant-input-pill { height: 48px; }
  .slide-assistant-btn {
    height: 48px;
    padding: 0 26px 0 26px; width: 100%;
    font-size: 12px;
  }
}

/* ── Orta masaüstü (1200px – 1499px) ── */
@media (min-width: 1200px) and (max-width: 1499px) {
  .slogan-1 { font-size: 46px !important; }
  .slide-slogan-pos { padding-bottom: 70px; }

  .slide-assistant-layer { padding-bottom: 220px; }
  .slide-assistant-wrap { max-width: 410px; }
  .slide-assistant-top { margin-bottom: 42px; }
  .slide-assistant-robot { max-height: 190px; }

  .slide-assistant-bubble {
    font-size: 18px;
    left: calc(50% + 76px);
    top: 8px;
  }
  .slide-assistant-bubble strong { font-size: 20px; }

  .slide-assistant-input-pill { height: 46px; }
  .slide-assistant-btn {
    height: 46px;
    padding: 0 26px 0 26px; width: 100%;
    font-size: 14px;
  }
}

/* ── Orta-geniş masaüstü (1500px – 1699px) ── */
@media (min-width: 1500px) and (max-width: 1999px) {
  .slogan-1 { font-size: 50px !important; }
  .slide-slogan-pos { padding-bottom: 95px; }

  .slide-assistant-layer { padding-bottom: 215px; }
  .slide-assistant-wrap { max-width: 450px; }
  .slide-assistant-top { margin-bottom: 38px; }
  .slide-assistant-robot { max-height: 200px; }

  .slide-assistant-bubble {
    font-size: 17px;
    left: calc(50% + 86px);
    top: 9px;
  }
  .slide-assistant-bubble strong { font-size: 23px; }

  .slide-assistant-input-pill { height: 50px; }
  .slide-assistant-btn {
    height: 50px;
    padding: 0 30px 0 30px; width: 100%;
    font-size: 13px;
  }
}

/* ── Geniş masaüstü (≥1900px) ── */
@media (min-width: 2000px) {
  .slide-slogan-pos { padding-bottom: 115px; }
  .slide-assistant-layer { padding-bottom: 270px; }
  .slide-assistant-wrap { max-width: 490px; }
  .slide-assistant-top { margin-bottom: 56px; }
  .slide-assistant-robot { max-height: 250px; }

  .slide-assistant-bubble {
    font-size: 20px;
    left: calc(50% + 100px);
    top: 10px;
  }
  .slide-assistant-bubble strong { font-size: 27px; }

  .slide-assistant-input-pill { height: 54px; }
  .slide-assistant-btn {
    height: 54px;
    padding: 0 34px 0 34px;
    font-size: 14px; width: 100%;
  }
}

/* ══════════════════════════════════════════════════════
   FOOTER BÜLTEN FORMU — RESPONSİVE
   ══════════════════════════════════════════════════════ */

/* ── Küçük mobil (≤480px) ── */
@media (max-width: 480px) {
  .footer-logo-img { height: 36px !important; }
  .footer-sep { margin: 20px 0 !important; }
  .footer-left-col { padding-bottom: 16px !important; }
  .footer-right-col { padding-top: 16px !important; }
  .footer-social {
    flex-wrap: wrap !important;
    gap: 8px !important;
    padding: 20px 0 !important;
  }
  .footer-soc-label { width: 100% !important; margin-right: 0 !important; font-size: 16px !important; }
  .footer-soc-ico { margin-left: 0 !important; width: 34px !important; height: 34px !important; }

  .footer-bulten-input {
    height: 44px !important;
    font-size: 14px !important;
    padding: 0 14px !important;
  }
  .footer-bulten-input::placeholder { font-size: 12px !important; }
  .footer-block-title { font-size: 16px !important; }
  .footer-kvkk { font-size: 13px !important; gap: 7px !important; }
  .footer-kvkk .uk-checkbox { width: 13px !important; height: 13px !important; }
  .footer-btn-red { padding: 9px 12px !important; font-size: 14px !important; }
  .footer-form-row { margin-top: 8px !important; gap: 8px !important; }
  .footer-contact-robot { margin-top: 28px !important; }
  .footer-contact-email { font-size: 16px !important; }
  .footer-contact-phone { font-size: 20px !important; }
  .footer-copy { font-size: 13px !important; padding-bottom: 20px !important; }
}

/* ══════════════════════════════════════════════════════
   ROBOT MOTIONPATH SCROLL
   ══════════════════════════════════════════════════════ */

/* Sabit robot sarmalayıcı — GSAP bu elemanı hareket ettirir */
#robot-float {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 900;
  pointer-events: none;
  will-change: transform;
  opacity: 0;
}

/* 3D model boyutları — model-viewer explicit size ister */
.robot-3d {
  display: block;
  width: 175px;
  height: 250px;
  background: transparent;
  --progress-bar-height: 0px;
  --poster-color: transparent;
  animation: robot3dFloat 3.5s ease-in-out infinite;
}

@keyframes robot3dFloat {
  0%, 100% { transform: translateY(0px); }
  50%       { transform: translateY(-11px); }
}

@media (min-width: 1024px) {
  .robot-3d { width: 200px; height: 285px; }
}

@media (min-width: 1280px) {
  .robot-3d { width: 225px; height: 320px; }
}

@media (min-width: 1500px) {
  .robot-3d { width: 250px; height: 355px; }
}

@media (min-width: 2000px) {
  .robot-3d { width: 300px; height: 425px; }
}

/* Masaüstünde orijinal robot gizli — #robot-float devralır */
@media (min-width: 768px) {
  .slide-assistant-layer .slide-assistant-robot { opacity: 0; }
}

/* Mobilde float gizli, orijinal gösterilir */
@media (max-width: 767px) {
  #robot-float { display: none !important; }
  .slide-assistant-layer .slide-assistant-robot { opacity: 1 !important; }
}

/* ── Mobil (481px – 767px) ── */
@media (min-width: 481px) and (max-width: 767px) {
  .footer-logo-img { height: 50px !important; }
  .footer-sep { margin: 26px 0 !important; }
  .footer-left-col { padding-bottom: 22px !important; }
  .footer-right-col { padding-top: 22px !important; }
  .footer-social {
    flex-wrap: wrap !important;
    gap: 8px !important;
    padding: 24px 0 !important;
  }
  .footer-soc-label { width: 100% !important; margin-right: 0 !important; }
  .footer-soc-ico { margin-left: 0 !important; }

  .footer-bulten-input {
    height: 50px !important;
    font-size: 13px !important;
    padding: 0 18px !important;
  }
  .footer-bulten-input::placeholder { font-size: 13px !important; }
  .footer-block-title { font-size: 14px !important; }
  .footer-kvkk { font-size: 12px !important; }
  .footer-btn-red { padding: 10px 14px !important; font-size: 12px !important; }
  .footer-form-row { margin-top: 10px !important; gap: 10px !important; }
  .footer-contact-robot { margin-top: 36px !important; }
  .footer-contact-email { font-size: 18px !important; }
  .footer-contact-phone { font-size: 20px !important; }
  .footer-robot-img { width: 100px !important; }
  .footer-copy { font-size: 14px !important; padding-bottom: 24px !important; }
}

/* ── Tablet (768px – 1199px) ── */
@media (min-width: 768px) and (max-width: 1199px) {
  .footer-bulten-input {
    height: 56px !important;
    font-size: 14px !important;
    padding: 0 20px !important;
  }
  .footer-bulten-input::placeholder { font-size: 14px !important; }
  .footer-block-title { font-size: 15px !important; }
  .footer-kvkk { font-size: 13px !important; }
  .footer-btn-red { padding: 11px 16px !important; font-size: 13px !important; }
  .footer-form-row { margin-top: 12px !important; }
  .footer-sep { margin: 32px 0 !important; }
  .footer-left-col { padding-bottom: 28px !important; }
  .footer-right-col { padding-top: 28px !important; }
  .footer-contact-robot { margin-top: 50px !important; }
  .footer-contact-email { font-size: 16px !important; }
  .footer-contact-phone { font-size: 21px !important; }
  .footer-robot-img { width: 120px !important; }
  .footer-copy { font-size: 15px !important; padding-bottom: 28px !important; }
}

/* ── Orta masaüstü (1200px – 1499px) ── */
@media (min-width: 1200px) and (max-width: 1499px) {
  .footer-bulten-input {
    height: 56px !important;
    font-size: 14px !important;
    padding: 0 20px !important;
  }
  .footer-bulten-input::placeholder { font-size: 14px !important; }
  .footer-block-title { font-size: 15px !important; }
  .footer-kvkk { font-size: 13px !important; }
  .footer-btn-red { padding: 11px 16px !important; font-size: 13px !important; }
  .footer-form-row { margin-top: 11px !important; }
  .footer-sep { margin: 38px -42px 38px 0 !important; }
  .footer-left-col { width: 32% !important; padding-right: 40px !important; }
  .footer-right-col { padding-left: 40px !important; }
  .footer-menus::after { left: -40px !important; }
  .footer-menus { gap: 0 28px !important; padding-bottom: 32px !important; }
  .footer-contact-robot { margin-top: 72px !important; }
  .footer-contact-email { font-size: 16px !important; }
  .footer-contact-phone { font-size: 21px !important; }
  .footer-robot-img { width: 128px !important; }
  .footer-copy { font-size: 15px !important; padding-bottom: 30px !important; }
}

/* ── Orta-geniş masaüstü (1500px – 1999px) ── */
@media (min-width: 1500px) and (max-width: 1999px) {
  .footer-bulten-input {
    height: 62px !important;
    font-size: 15px !important;
    padding: 0 22px !important;
  }
  .footer-bulten-input::placeholder { font-size: 15px !important; }
  .footer-block-title { font-size: 15px !important; }
  .footer-kvkk { font-size: 14px !important; }
  .footer-btn-red { padding: 12px 18px !important; font-size: 14px !important; }
  .footer-form-row { margin-top: 13px !important; }
  .footer-sep { margin: 46px -54px 46px 0 !important; }
  .footer-left-col { width: 35% !important; padding-right: 52px !important; }
  .footer-right-col { padding-left: 52px !important; }
  .footer-menus::after { left: -52px !important; }
  .footer-menus { gap: 0 38px !important; padding-bottom: 38px !important; }
  .footer-contact-robot { margin-top: 86px !important; }
  .footer-contact-email { font-size: 17px !important; }
  .footer-contact-phone { font-size: 22px !important; }
  .footer-robot-img { width: 140px !important; }
  .footer-copy { font-size: 15px !important; padding-bottom: 33px !important; }
}

/* ── Geniş masaüstü (≥2000px) ── */
@media (min-width: 2000px) {
  .footer-left-col { width: 40% !important; padding-right: 80px !important; }
  .footer-right-col { padding-left: 80px !important; }
  .footer-sep { margin: 64px -80px 64px 0 !important; }
  .footer-menus::after { left: -80px !important; }
  .footer-block-title { font-size: 18px !important; }
  .footer-bulten-input {
    height: 74px !important;
    font-size: 17px !important;
    padding: 0 28px !important;
  }
  .footer-bulten-input::placeholder { font-size: 17px !important; }
  .footer-kvkk { font-size: 16px !important; }
  .footer-btn-red { padding: 15px 24px !important; font-size: 16px !important; }
  .footer-form-row { margin-top: 16px !important; }
  .footer-contact-robot { margin-top: 120px !important; }
  .footer-contact-email { font-size: 20px !important; }
  .footer-contact-phone { font-size: 28px !important; }
  .footer-robot-img { width: 170px !important; }
  .footer-copy { font-size: 18px !important; padding-bottom: 42px !important; }
  .footer-menus { gap: 0 56px !important; padding-bottom: 52px !important; }
  .footer-social { padding: 42px 0 !important; }
  .footer-logo-img { height: 60px !important; }
}

/* ══════════════════════════════════════════════════════
   MOBİL HEADER — hamburger + logo
   ══════════════════════════════════════════════════════ */

/* Hamburger butonu beyaz */
.mob-hamburger {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #fff !important;
  line-height: 1;
}
.mob-hamburger svg,
.mob-hamburger [uk-icon] { color: #fff !important; }

/* Küçük ekran header logosu */
@media (max-width: 1199px) {
  .uk-navbar-left .logo {
    background-size: contain !important;
    background-position: center left !important;
    width: 120px !important;
    height: 52px !important;
    margin: 20px 0 !important;
  }
  .sticky .uk-navbar-left .logo {
    background-size: contain !important;
    width: 120px !important;
    height: 52px !important;
    margin: 10px 0 !important;
  }
}

/* Mobil dil butonu daha küçük */
@media (max-width: 767px) {
  .nav-lang-btn {
    width: 42px !important;
    height: 42px !important;
    font-size: 12px !important;
  }
}

/* Tablet: biraz daha büyük logo */
@media (min-width: 768px) and (max-width: 1199px) {
  .uk-navbar-left .logo {
    width: 155px !important;
    height: 66px !important;
  }
  .sticky .uk-navbar-left .logo {
    width: 145px !important;
    height: 60px !important;
  }
}

/* ══════════════════════════════════════════════════════
   OFFCanvas — dark tasarım
   ══════════════════════════════════════════════════════ */

.offcanvas-bar.uk-offcanvas-bar {
  width: 290px !important;
  background: #2c2e35 !important;
  padding: 0 !important;
  display: flex;
  flex-direction: column;
}

/* Kapatma butonu */
.offcanvas-close {
  position: absolute !important;
  top: 16px !important;
  right: 16px !important;
  color: rgba(255,255,255,0.55) !important;
  z-index: 10;
}
.offcanvas-close:hover { color: #fff !important; }

/* İç sarmalayıcı */
.offcanvas-inner {
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow-y: auto;
  padding: 28px 24px 0;
}

/* Logo bölümü */
.offcanvas-logo-wrap {
  padding-bottom: 22px;
  border-bottom: 1px solid rgba(255,255,255,0.1);
  margin-bottom: 10px;
}
.offcanvas-logo-img {
  height: 35px;
  width: auto;
  display: block;
}

/* Menü listesi */
.offcanvas-nav.uk-nav-primary {
  flex: 1;
}
.offcanvas-nav.uk-nav-primary > li > a {
  color: rgba(255,255,255,0.82) !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  padding: 13px 0 !important;
  border-bottom: 1px solid rgba(255,255,255,0.07);
  transition: color 0.2s;
}
.offcanvas-nav.uk-nav-primary > li > a:hover {
  color: #fff !important;
}
/* Parent ok ikonu rengi */
.offcanvas-nav .uk-nav-parent-icon > li.uk-parent > a::after {
  color: rgba(255,255,255,0.4) !important;
}

/* Alt menü */
.offcanvas-sub.uk-nav-sub {
  padding: 4px 0 10px 12px !important;
}
.offcanvas-sub > li > a {
  color: rgba(210,215,225,0.65) !important;
  font-size: 15px !important;
  font-weight: 400 !important;
  padding: 8px 0 8px 10px !important;
  border-left: 2px solid rgba(208,23,52,0.5) !important;
  margin: 3px 0 !important;
  transition: color 0.2s, border-color 0.2s;
}
.offcanvas-sub > li > a:hover {
  color: #fff !important;
  border-left-color: #d01734 !important;
}

/* 3. seviye alt menü */
.offcanvas-sub .uk-parent > .uk-nav-sub {
  max-height: 0;
  overflow: hidden;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  transition: max-height 0.35s ease, padding 0.35s ease;
}
.offcanvas-sub .uk-parent.uk-open > .uk-nav-sub {
  max-height: 600px;
  padding-top: 4px !important;
  padding-bottom: 6px !important;
}
.offcanvas-sub-level2.uk-nav-sub {
  padding-left: 10px !important;
}
.offcanvas-sub-level2 > li > a {
  color: rgba(180,185,200,0.5) !important;
  font-size: 14px !important;
  padding: 6px 0 6px 10px !important;
  border-left: 2px solid rgba(208,23,52,0.25) !important;
  margin: 2px 0 !important;
  transition: color 0.2s, border-color 0.2s;
}
.offcanvas-sub-level2 > li > a:hover {
  color: #fff !important;
  border-left-color: #d01734 !important;
}

/* ── Alt bölüm: telefon + sosyal ── */
.offcanvas-bottom {
  margin-top: auto;
  padding-bottom: 28px;
}
.offcanvas-bottom-divider {
  height: 1px;
  background: rgba(255,255,255,0.1);
  margin: 16px 0 20px;
}

/* Telefon linki */
.offcanvas-tel {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  color: rgba(255,255,255,0.75) !important;
  font-size: 15px;
  font-weight: 400;
  text-decoration: none;
  margin-bottom: 18px;
  transition: color 0.2s;
}
.offcanvas-tel:hover { color: #fff !important; }
.offcanvas-tel svg { color: #d01734 !important; flex-shrink: 0; }

/* Sosyal medya ikonları */
.offcanvas-social {
  display: flex;
  justify-content: center;
  gap: 10px;
}
.offcanvas-soc-ico {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 1px solid rgba(255,255,255,0.25);
  color: rgba(255,255,255,0.7) !important;
  transition: background 0.2s, border-color 0.2s, color 0.2s;
}
.offcanvas-soc-ico:hover {
  background: #d01734;
  border-color: #d01734;
  color: #fff !important;
}
.offcanvas-soc-ico svg { color: inherit !important; }

/* ══════════════════════════════════════════════════════
   KURUMSAL TANITIM — SCROLL TRACK + STICKY
   ══════════════════════════════════════════════════════ */

/* Scroll alanı */
.ks-scroll-track {
  position: relative;
  height: 100vh;
  overflow-x: clip;
}

/* Sticky sahne */
.kurumsal-sec {
  position: sticky;
  top: var(--header-sticky-offset, 0px);
  height: calc(100vh - var(--header-sticky-offset, 0px));
  padding: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  overflow-x: clip;
  box-sizing: border-box;
}

/* Metin bloğu */
.kurumsal-sec-text {
  max-width: 760px;
  margin: 0 auto;
  padding: 0px;
  position: relative;
  z-index: 3;
  will-change: transform;
  transform: translateZ(0);
  backface-visibility: hidden;
}

.kurumsal-sec-title {
  font-family: "proxima-nova", sans-serif;
  font-size: 38px;
  font-weight: 700;
  color: #e8e8e8;
  margin: 0 0 5px;
}

.kurumsal-sec-desc {
  font-family: "proxima-nova", sans-serif;
  font-size: 18px;
  font-weight: 200;
  color: #e8e8e8;
  margin: 0 0 22px;
}

.kurumsal-sec-slogan {
  font-family: "proxima-nova", sans-serif;
  font-size: 24px;
  font-weight: 200;
  color: #e8e8e8;
  margin: 0;
}

.kurumsal-sec-highlight {
  color: #d01734;
  font-weight: 700;
}

/* Görsel wrap */
.kurumsal-sec-img-wrap {
  flex: 0 0 auto;
  width: 100%;
  position: relative;
  z-index: 0;
  padding: 18px 0 0;
}

/* Görsel wrap dış sarmalayıcı */
.ks-clip-outer {
  width: 100%;
}

/* Radyal gradient */
.kurumsal-sec-img-wrap::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 160%;
  height: 260%;
  background: radial-gradient(
    ellipse 36% 52% at 50% 50%,
    rgba(14, 16, 20, 0.88) 0%,
    rgba(14, 16, 20, 0.55) 40%,
    rgba(14, 16, 20, 0.15) 65%,
    rgba(14, 16, 20, 0.00) 100%
  );
  pointer-events: none;
  z-index: 0;
}

.kurumsal-sec-img-wrap .uk-container {
  position: relative;
  z-index: 2;
}

/* Görsel kırpma kutusu */
.ks-img-clip {
  position: relative;
  overflow: hidden;
  border-radius: 20px;
  will-change: width, border-radius;
  transform: translateZ(0);
  backface-visibility: hidden;
}

/* Resim */
.kurumsal-sec-img {
  display: block;
  width: 100%;
  height: auto;
  max-height: 500px;
  object-fit: cover;
  object-position: center center;
  position: relative;
  z-index: 2;
  will-change: opacity;
  transform: translateZ(0);
  backface-visibility: hidden;
}

/* Video — resmin üstünde, JS ile opacity kontrolü */
.kurumsal-sec-video {
  position: absolute;
  top: 0; left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  z-index: 3;
  opacity: 0;
  will-change: opacity;
  transform: translateZ(0);
  backface-visibility: hidden;
}

/* ── Responsive — küçük mobil (≤480px) ── */
@media (max-width: 480px) {
  .ks-scroll-track { height: 250vh; }
  .kurumsal-sec-img-wrap { padding: 24px 0 32px; }
  .kurumsal-sec-title { font-size: 22px; }
  .kurumsal-sec-desc { font-size: 15px; }
  .kurumsal-sec-slogan { font-size: 20px; }
  .kurumsal-sec-text { margin-bottom: 20px; }
  .kurumsal-sec-img { max-height: 180px; }
}

/* ── Responsive — mobil (481–767px) ── */
@media (min-width: 481px) and (max-width: 767px) {
  .ks-scroll-track { height: 260vh; }
  .kurumsal-sec-img-wrap { padding: 30px 0 40px; }
  .kurumsal-sec-title { font-size: 24px; }
  .kurumsal-sec-desc { font-size: 18px; }
  .kurumsal-sec-text { margin-bottom: 24px; }
  .kurumsal-sec-img { max-height: 220px; }
}

/* ── Responsive — tablet (768–1199px) ── */
@media (min-width: 768px) and (max-width: 1199px) {
  .ks-scroll-track { height: 270vh; }
  .kurumsal-sec-img-wrap { padding: 40px 0 52px; }
  .kurumsal-sec-title { font-size: 24px; }
  .kurumsal-sec-img { max-height: 300px; }
  .kurumsal-sec-text { margin-bottom: 32px; }
}

/* ── Responsive — orta masaüstü (1200–1499px) ── */
@media (min-width: 1200px) and (max-width: 1499px) {
  .ks-scroll-track { height: 220vh; }
  .kurumsal-sec { gap: 20px;}
   .kurumsal-sec-text { max-width: 1200px;}
  .kurumsal-sec-title { font-size: 24px; }
  .kurumsal-sec-img { max-height: 520px; }
}

/* ── Responsive — geniş masaüstü (1500–1999px) ── */
@media (min-width: 1500px) and (max-width: 1999px) {
  .ks-scroll-track { height: 220vh; }
  .kurumsal-sec { gap: 30px;}
  .kurumsal-sec-title { font-size: 24px; }
  .kurumsal-sec-desc { font-size: 18px; }
  .kurumsal-sec-slogan { font-size: 24px; }
  .kurumsal-sec-text { max-width: 1200px; margin-bottom: 52px; }
  .kurumsal-sec-img { max-height: 620px; }
}

/* ── Responsive — çok geniş (≥2000px) ── */
@media (min-width: 2000px) {
  .ks-scroll-track { height: 220vh; }
  .kurumsal-sec { gap: 50px;}
  .kurumsal-sec-title { font-size: 24px; }
  .kurumsal-sec-desc { font-size: 18px; }
  .kurumsal-sec-slogan { font-size: 24px; }
  .kurumsal-sec-text { max-width: 1200px; margin-bottom: 64px; }
  .kurumsal-sec-img { max-height: 700px; }
}

/* prefers-reduced-motion */
@media (prefers-reduced-motion: reduce) {
  .ks-img-clip { width: auto !important; margin-left: 0 !important; border-radius: 20px !important; }
  .kurumsal-sec-text { opacity: 1 !important; transform: none !important; }
  .kurumsal-sec-video { transition: none !important; }
}

/* Mobil + Tablet: aynı scroll animasyonu */
@media (max-width: 1199px) {
  .ks-scroll-track {
    height: 210vh;
    min-height: 210vh;
  }

  .kurumsal-sec {
    position: relative;
    top: auto;
    height: auto;
    min-height: 100%;
    overflow: visible;
    display: block;
  }

  .kurumsal-sec-text {
    display: block;
    margin-bottom: 20px;
    padding-top: 4px;
    position: relative;
    z-index: 3;
    width: 100%;
    max-width: 100%;
  }

  .kurumsal-sec-img-wrap {
    position: sticky;
    top: var(--header-sticky-offset, 0px);
    height: calc(100dvh - var(--header-sticky-offset, 0px));
    min-height: 0;
    overflow: visible;
    display: flex;
    justify-content: center;
    align-items: center;
    transform: none;
    padding: 8px 0;
    margin-top: 0;
    z-index: 0;
    clear: both;
    isolation: isolate;
  }

  .kurumsal-sec-img-wrap .uk-container {
    max-width: 100%;
    padding-left: 18px;
    padding-right: 18px;
  }

  .ks-clip-outer {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
  }

  .ks-img-clip {
    width: 100%;
    margin-left: 0;
    border-radius: 20px;
  }

  .kurumsal-sec-img-wrap::before {
    opacity: 1;
    display: block;
  }
}

/* Mobil + Tablet dikey */
@media (max-width: 1199px) and (orientation: portrait) {
  .kurumsal-sec-img-wrap {
    width: 100%;
    padding: 8px 0 0;
  }

  .ks-clip-outer,
  .ks-img-clip {
    width: 100%;
    margin-left: 0;
    border-radius: 20px;
  }

  .kurumsal-sec-img,
  .kurumsal-sec-video {
    width: 100%;
    height: clamp(330px, 120vw, 560px);
    max-height: none;
    object-fit: cover;
    object-position: center center;
  }
}

/* Mobil + Tablet yatay */
@media (max-width: 1199px) and (orientation: landscape) {
  .kurumsal-sec-img-wrap {
    padding: 8px 0 6px;
  }

  .kurumsal-sec-img,
  .kurumsal-sec-video {
    height: clamp(280px, 72vw, 460px);
    max-height: none;
  }
}

/* ══════════════════════════════════════════════════════
   KALİTE BÖLÜMİ — TÜRKİYE'NİN 3 ÜNCÜ EN BÜYÜK
   ══════════════════════════════════════════════════════ */

.kalite-sec {
  position: relative;
  overflow: hidden;
}

/* Arka plan desen katmanı (sağ üst) */
.kalite-sec-bg {
  
  background: url('../images/kalite-bg.webp') right top / contain no-repeat; 

}

.kalite-container {
  position: relative;
  z-index: 1;
}

/* ── İstatistik alanı ── */
.kalite-stat-wrap {
  text-align: center;
  padding-bottom: 48px;
}

/* inline-block sarmalayıcı: içerik badge genişliğine kilitlenir */
.kalite-stat-inner {
  display: inline-block;
  text-align: left;
}

.kalite-stat-supra {
  font-family: "proxima-nova", sans-serif;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  color: #fff;
  margin: 0 0 10px;
  text-align: left;
}

.kalite-stat-badge {
  display: block;
  font-family: "proxima-nova", sans-serif;
  font-size: 72px;
  font-weight: 800;
  line-height: 1;
  color: #fff;
  background: #d01734;
  border-radius: 5px;
  padding: 14px 52px;
  margin: 0 0 10px;
}

.kalite-stat-sub {
  font-family: "proxima-nova", sans-serif;
  font-size: 16px;
  font-weight: 700;
  text-transform: uppercase;
  color: #fff;
  margin: 0;
  text-align: right;
}

/* ── İçerik satırı ── */


.kalite-img {
  display: block;
}

/* ── Sağ metin sütun ── */


.kalite-title {
  font-family: "proxima-nova", sans-serif;
  font-size: 36px;
  font-weight: 200;
  color: #e8e8e8;
  margin: 0 0 20px;
  line-height: 1.45;
}
.kalite-title strong {
  font-weight: 700;
  color: #fff;
}

.kalite-desc {
  font-family: "proxima-nova", sans-serif;
  font-size: 18px;
  font-weight: 200;
  color: #e8e8e8;
  margin: 0 0 34px;
}

.kalite-btns {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

.kalite-btn-red {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
  background: #e20032;
  color: #fff;
  font-family: "proxima-nova", sans-serif;
  font-size: 18px;
  font-weight: 700;
  text-transform: uppercase;
  padding: 10px 30px;
  border-radius: 5px;
  text-decoration: none;
  transition: transform 0.28s ease, box-shadow 0.28s ease, background 0.28s ease, border-color 0.28s ease;
  border: 2px solid #e20032;
}
.kalite-btn-red::after {
  content: "";
  position: absolute;
  top: 0;
  left: -75%;
  width: 50%;
  height: 100%;
  background: linear-gradient(110deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.4) 50%, rgba(255, 255, 255, 0) 100%);
  transform: skewX(-20deg);
  transition: left 0.45s ease;
}
.kalite-btn-red:hover {
  background: #b00024;
  border-color: #b00024;
  color: #fff;
  transform: translateY(-3px);
  box-shadow: 0 10px 22px rgba(226, 0, 50, 0.35);
}
.kalite-btn-red:hover::after { left: 130%; }

.kalite-btn-dark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
  background: #2c2e35;
  color: #fff;
  font-family: "proxima-nova", sans-serif;
  font-size: 18px;
  font-weight: 700;
  text-transform: uppercase;
  padding: 10px 30px;
  border-radius: 5px;
  border: 2px solid #2c2e35;
  text-decoration: none;
  transition: transform 0.28s ease, box-shadow 0.28s ease, background 0.28s ease, color 0.28s ease, border-color 0.28s ease;
}
.kalite-btn-dark::after {
  content: "";
  position: absolute;
  top: 0;
  left: -75%;
  width: 50%;
  height: 100%;
  background: linear-gradient(110deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.32) 50%, rgba(255, 255, 255, 0) 100%);
  transform: skewX(-20deg);
  transition: left 0.45s ease;
}
.kalite-btn-dark:hover {
  background: #3a3d47;
  border-color: #3a3d47;
  color: #fff;
  transform: translateY(-3px);
  box-shadow: 0 10px 22px rgba(20, 23, 31, 0.4);
}
.kalite-btn-dark:hover::after { left: 130%; }

/* ── Responsive — küçük mobil (≤480px) ── */
@media (max-width: 480px) {
  .kalite-sec-bg { min-height: 0; }
  .kalite-stat-wrap { padding-bottom: 28px; }
  .kalite-stat-supra { font-size: 14px; }
  .kalite-stat-sub { font-size: 16px; }
  .kalite-stat-badge { font-size: 30px; padding: 10px 20px; }
  .kalite-img-col { order: 2; }
  .kalite-img-col + div { order: 1; }
  .kalite-title { font-size: 24px; margin-bottom: 14px; }
  .kalite-desc { font-size: 16px; margin-bottom: 20px; }
  .kalite-btn-red, .kalite-btn-dark { font-size: 16px; padding: 8px 20px; }
}

/* ── Responsive — mobil (481px – 767px) ── */
@media (min-width: 481px) and (max-width: 767px) {
  .kalite-sec-bg { min-height: 0; }
  .kalite-stat-wrap { padding-bottom: 32px; }
  .kalite-stat-supra { font-size: 14px; }
  .kalite-stat-sub { font-size: 16px; }
  .kalite-stat-badge { font-size: 40px; padding: 11px 20px; }
  .kalite-img-col { order: 2; }
  .kalite-img-col + div { order: 1; }
  .kalite-title { font-size: 26px; }
  .kalite-desc { font-size: 15px; margin-bottom: 24px; }
  .kalite-btn-red, .kalite-btn-dark { font-size: 14px; padding: 9px 22px; }
}

/* ── Responsive — tablet (768px – 959px) ── */
@media (min-width: 768px) and (max-width: 959px) {
  .kalite-sec-bg { min-height: 0; }
  .kalite-stat-wrap { padding-bottom: 36px; }
  .kalite-stat-supra { font-size: 14px; }
  .kalite-stat-sub { font-size: 16px; }
  .kalite-stat-badge { font-size: 52px; padding: 12px 36px; }
  .kalite-img-col { order: 2; }
  .kalite-img-col + div { order: 1; }
  .kalite-title { font-size: 28px; }
  .kalite-desc { font-size: 16px; }
  .kalite-btn-red, .kalite-btn-dark { font-size: 15px; padding: 9px 24px; }
}

/* ── Responsive — orta masaüstü (960px – 1199px) ── */
@media (min-width: 960px) and (max-width: 1199px) {
  .kalite-sec-bg { min-height: 700px; }
  .kalite-stat-wrap { padding-bottom: 38px; }
  .kalite-stat-supra { font-size: 16px; }
  .kalite-stat-sub { font-size: 16px; }
  .kalite-stat-badge { font-size: 56px; padding: 12px 42px; }
  .kalite-title { font-size: 28px; }
  .kalite-desc { font-size: 16px; }
  .kalite-btn-red, .kalite-btn-dark { font-size: 15px; padding: 9px 24px; }
}

/* ── Responsive — geniş masaüstü (1200px – 1499px) ── */
@media (min-width: 1200px) and (max-width: 1499px) {
  .kalite-sec-bg { min-height: 820px; }
  .kalite-stat-wrap { padding-bottom: 42px; }
  .kalite-stat-supra { font-size: 16px; }
  .kalite-stat-sub { font-size: 16px; }
  .kalite-stat-badge { font-size: 62px; padding: 13px 46px; }
  .kalite-title { font-size: 30px; }
  .kalite-desc { font-size: 17px; }
  .kalite-btn-red, .kalite-btn-dark { font-size: 16px; padding: 9px 26px; }
}

/* ── Responsive — orta-geniş masaüstü (1500px – 1999px) ── */
@media (min-width: 1500px) and (max-width: 1999px) {
  .kalite-sec-bg { min-height: 960px; }
  .kalite-stat-wrap { padding-bottom: 46px; }
  .kalite-stat-supra { font-size: 16px; }
  .kalite-stat-sub { font-size: 18px; }
  .kalite-stat-badge { font-size: 68px; padding: 13px 50px; }
  .kalite-title { font-size: 34px; }
  .kalite-desc { font-size: 18px; }
  .kalite-btn-red, .kalite-btn-dark { font-size: 17px; padding: 10px 28px; }
}

/* ── Responsive — çok geniş masaüstü (≥2000px) ── */
@media (min-width: 2000px) {
  .kalite-stat-supra { font-size: 20px; }
  .kalite-stat-sub { font-size: 20px; }
  .kalite-stat-wrap { padding-bottom: 48px; }
}

/* ══════════════════════════════════════════════════════
   SERTİFİKA ŞERİDİ
   ══════════════════════════════════════════════════════ */

.sert-strip {
  display: flex;
  align-items: center;
  gap: 0;
}

/* Sol: FORMAL Kalitesi başlık */
.sert-left {
  flex-shrink: 0;
  padding-right: 32px;
  border-right: 1px solid rgba(255,255,255,0.18);
  margin-right: 32px;
}

.sert-baslik {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
  white-space: nowrap;
  font-family: "proxima-nova", sans-serif;
  font-size: 20px;
  font-weight: 300;
  color: #fff;
  transition: opacity 0.2s;
}
.sert-baslik:hover { opacity: 0.75; color: #fff; }
.sert-baslik strong {
  font-weight: 900;
}

.sert-arrow {
  color: rgba(255,255,255,0.65);
  flex-shrink: 0;
}

/* Sağ: slider sarmalayıcı */
.sert-slider-wrap {
  flex: 1;
  min-width: 0;
  overflow: hidden;
}

/* Slider liste */
.sert-list {
  gap: 0;
}

/* Büyük ekran: 6 logo yan yana */
.sert-item {
  width: calc(100% / 6);
  flex-shrink: 0;
  padding: 0 10px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.sert-logo {
  display: block;
  width: 100%;
  object-fit: contain;
  transition: opacity 0.2s;
  border-radius: 10px;
}
.sert-logo:hover { opacity: 0.8; }

/* ── Responsive — tablet (960px – 1199px): 5 logo ── */
@media (max-width: 1199px) {
  .sert-strip { margin: 0 -28px; padding: 18px 28px; gap: 0; }
  .sert-left { padding-right: 24px; margin-right: 24px; }
  .sert-baslik { font-size: 17px; }
  .sert-item { width: calc(100% / 5); padding: 0 12px; }
}

/* ── Responsive — küçük tablet (768px – 959px): 4 logo ── */
@media (max-width: 959px) {
  .sert-item { width: calc(100% / 4); padding: 0 10px; }
}

/* ── Responsive — mobil (≤767px): dikey stack, 3 logo ── */
@media (max-width: 767px) {
  .sert-strip {
    flex-direction: column;
    align-items: flex-start;
    margin: 0 -18px;
    padding: 18px 18px 14px;
    gap: 16px;
  }
  .sert-left {
    border-right: none;
    border-bottom: 1px solid rgba(255,255,255,0.18);
    padding-right: 0;
    padding-bottom: 14px;
    margin-right: 0;
    margin-bottom: 0;
    width: 100%;
  }
  .sert-baslik { font-size: 18px; }
  .sert-slider-wrap { width: 100%; }
  .sert-item { width: calc(100% / 3); padding: 0 8px; }
}

/* ── Responsive — küçük mobil (≤480px): 2 logo ── */
@media (max-width: 480px) {
  .sert-item { width: calc(100% / 2); padding: 0 6px; }
  .sert-baslik { font-size: 20px; }
}

/* ── Responsive — çok geniş (≥1500px): 6 logo (daha büyük) ── */
@media (min-width: 1500px) {
  .sert-baslik { font-size: 22px; }
  .sert-item { padding: 0 20px; }
  .sert-left { padding-right: 36px; margin-right: 36px; }
}

@media (min-width: 2000px) {
  .sert-baslik { font-size: 26px; }
  .sert-item { padding: 0 20px; }
  .sert-left { padding-right: 44px; margin-right: 44px; }
}

/* ══════════════════════════════════════════════════════
   SEKTÖRLER — YATAY SCROLL PIN
   ══════════════════════════════════════════════════════ */

/* ── Dış sarmalayıcı ──
   overflow: clip → yatay taşmayı keser ama position:sticky'yi bozmaz
   overflow: hidden kullansaydık sticky çalışmazdı                    */
.scroll-slider {
  background: #2c2e35;
  overflow: clip;
}

/* ── Pin section: yüksekliği JS ayarlar ── */
#sektor-pin {
  background: #2c2e35;
}

/* ── Sticky viewport: ekrana yapışır, yükseklik içeriğe göre otomatik ── */
.sektor-pin-sticky {
  position: sticky;
  top: 0; /* JS navbar yüksekliğini yazar */
  overflow: hidden;
  display: flex;
  flex-direction: row;
  align-items: stretch; /* height:100% yerine stretch — 100vh olmasını önler */
  padding: 100px 0;
  cursor: grab;
  user-select: none;
}

.sektor-pin-sticky.is-dragging {
  cursor: grabbing;
}

/* Metin + kartlar tek track olarak birlikte kayar */
.sektor-track {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: stretch;
  flex: 1;
  min-width: max-content;
  will-change: transform;
}

/* ── Intro sütunu: desktop'ta solda, mobilde üstte ── */
.sektor-intro {
  flex-shrink: 0;
  width: clamp(260px, 28vw, 800px);
  padding-left: max(30px, calc((100vw - 1600px) / 2 + 0px));
  padding-right: 40px;
  border-right: 0px solid rgba(255, 255, 255, 0.1);
  display: flex;
  flex-direction: column;
  justify-content: center;
}

/* ── Kartlar alanı: kalan tüm genişliği alır, taşmayı keser ── */
.sektor-cards-outer {
  flex: 1;
  min-width: 0;
  overflow-x: hidden;
  overflow-y: visible;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
}

/* ── Yatay kart bandı: JS genişliği ve transform'u yönetir ── */
.sektor-pin-wrap {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  flex-shrink: 0;
  align-items: center;
  gap: 50px;
  padding-right: 50px;
  will-change: transform;
}

.sektor-intro__title {
  font-family: "proxima-nova", sans-serif;
  font-size: clamp(40px, 5vw, 72px);
  font-weight: 800;
  color: #e8e8e8;
  line-height: 1;
  margin-bottom: 28px;
}

/* Bölüm üst başlık: tam genişlik, container-xlarge ile hizalı sol padding */
.sektor-title-top {
  padding-left: max(30px, calc((100vw - 1600px) / 2 + 0px));
  margin-bottom: 40px;
}

@media (max-width: 2000px) {
  .sektor-title-top.sektor-intro__title {
    font-size: clamp(32px, 3.8vw, 60px);
  }
}

/* Açıklama metni */
.sektor-desc {
  font-family: "proxima-nova", sans-serif;
  font-size: clamp(16px, 1.1vw, 18px);
  font-weight: 200;
  line-height: 1.8;
  color: #e8e8e8;
  margin: 0;
}
.sektor-desc strong {
  font-weight: 700;
  color: #fff;
}

/* ── Kart sarmalayıcı: genişlik JS tarafından hesaplanır ── */
.sektor-item {
  flex-shrink: 0;
  height: clamp(300px, 46vh, 320px);
  padding-bottom: 24px; /* butonun alt cizgide tasan kismina gorunur alan */
  box-sizing: border-box;
}

/* ── Kart ── */
.sektor-card {
  position: relative;
  width: 100%;
  height: 100%;
  background: transparent;
  border: 2px solid #4f5765;
  border-radius: 5px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  box-sizing: border-box;
  transition: border-color 0.28s ease;
}

/* İkon */
.sektor-card__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 22px;
  color: #a2a5ab;
}
.sektor-card__icon svg {
  width: clamp(68px, 6vw, 98px);
  height: clamp(68px, 6vw, 98px);
  opacity: 0.85;
}
.sektor-card__icon img {
  max-height: clamp(68px, 6vw, 98px);
  max-width: clamp(90px, 7.8vw, 124px);
  width: auto;
  height: auto;
  object-fit: contain;
  opacity: 0.85;
}

/* Sektör adı */
.sektor-card__name {
  font-family: "proxima-nova", sans-serif;
  font-size: 20px;
  font-weight: 700;
  text-transform: uppercase;
  color: #a2a5ab;
  line-height: 1.3;
  max-width: 100%;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
  text-align: center;
}

/* KATALOG butonu — kart sağ alt köşesinde */
.sektor-card__katalog {
  position: absolute;
  bottom: 0;
  right: 15px;
  transform: translateY(50%);
  background: #e20032;
  color: #fff;
  font-family: "proxima-nova", sans-serif;
  font-size: 16px;
  font-weight: 700;
  text-transform: uppercase;
  padding: 10px 20px;
  text-decoration: none;
  border-radius: 5px;
  border: 2px solid #e20032;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  transition: transform 0.28s ease, box-shadow 0.28s ease, background 0.28s ease, border-color 0.28s ease;
}

.sektor-card__katalog::after {
  content: "";
  position: absolute;
  top: 0;
  left: -75%;
  width: 50%;
  height: 100%;
  background: linear-gradient(110deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.4) 50%, rgba(255, 255, 255, 0) 100%);
  transform: skewX(-20deg);
  transition: left 0.45s ease;
}
.sektor-card__katalog:hover {
  background: #b00024;
  border-color: #b00024;
  color: #fff;
  transform: translateY(50%) translateY(-3px);
  box-shadow: 0 10px 22px rgba(226, 0, 50, 0.35);
}

.sektor-card__katalog:hover::after,
.sektor-card:hover .sektor-card__katalog::after { left: 130%; }

.sektor-card:hover .sektor-card__katalog {
  background: #b00024;
  border-color: #b00024;
  color: #fff;
  transform: translateY(50%) translateY(-3px);
  box-shadow: 0 10px 22px rgba(226, 0, 50, 0.35);
}

.sektor-card__katalog.is-disabled,
.sektor-card:hover .sektor-card__katalog.is-disabled {
  background: #8f939c;
  border-color: #8f939c;
  color: #fff;
  box-shadow: none;
  transform: translateY(50%);
  pointer-events: none;
}

.sektor-card__katalog.is-disabled::after,
.sektor-card:hover .sektor-card__katalog.is-disabled::after {
  display: none;
}

/* will-change: JS transform için ── */
.sektor-pin-wrap {
  will-change: transform;
}

/* ── Göster / Gizle: desktop vs mobil ── */
.sektor-only-mobile  { display: none; }
.sektor-only-desktop { display: block; }

@media (max-width: 767px) {
  .sektor-only-desktop { display: none !important; }
  .sektor-only-mobile  { display: block !important; }
  .sektor-mob-item .sektor-card__name { font-size: 16px; }
  .sektor-mob-item .sektor-card__katalog {
    font-size: 13px;
    padding: 8px 14px;
  }
}

/* ── Mobil bölüm sarmalayıcı ── */
.sektor-mobile-wrap {
  background: #2c2e35;
  padding: 40px 0 52px;
}

/* Mobil intro (başlık + metin): tam genişlik, alt çizgili */
.sektor-intro--mob {
  width: 100%;
  max-width: 100%;
  padding: 0 24px 28px;
  border-right: none;
  border-bottom: 0px solid rgba(255, 255, 255, 0.1);
  margin-bottom: 28px;
  box-sizing: border-box;
}
.sektor-intro--mob .sektor-intro__title { font-size: 36px; margin-bottom: 12px; }
.sektor-intro--mob .sektor-desc         { font-size: 16px; }

/* Mobil slider: parent sol padding ile hizalı, sağa peek taşar */
.sektor-mob-slider-outer {
  overflow-x: hidden;
  overflow-y: visible;
  padding-left: 24px;
}
.sektor-mob-container.uk-slider-container {
  overflow: visible;
}
.sektor-mob-list {
  gap: 0;
}

/* 1 tam kart + yarım peek: item genişliği = (alan - gap) / 1.5 */
.sektor-mob-item {
  width: calc((100% - 16px) / 1.5);
  padding-right: 16px;
  padding-bottom: 24px; /* alttan tasan katalog butonu kesilmesin */
  box-sizing: border-box;
  height: clamp(240px, 62vw, 320px);
}
.sektor-mob-item .sektor-card {
  height: 100%;
  padding: 0 20px 48px;
}

/* ══════════════════════════════════════════════════════
   SÜRDÜRÜLEBİLİRLİK BÖLÜMÜ
   ══════════════════════════════════════════════════════ */

.surdurulebilir-sec {
  position: relative;
  overflow: hidden;
}

/* ── Gökyüzü animasyon katmanı ── */

/* Güneş: sürekli yavaş dönüş */
@keyframes sunSpin {
  from { transform: translateX(-50%) rotate(0deg); }
  to   { transform: translateX(-50%) rotate(360deg); }
}

/* Sol bulutlar: sola kayma */
@keyframes cloudL {
  0%, 100% { transform: translateX(0px); }
  50%       { transform: translateX(-32px); }
}

/* Sağ bulutlar: sağa kayma */
@keyframes cloudR {
  0%, 100% { transform: translateX(0px); }
  50%       { transform: translateX(32px); }
}

.surd-sky {
  position: absolute;
  top: 0; right: 0;
  width: 50%;
  height: 50%;           /* gökyüzü arka planın üst yarısı */
  pointer-events: none;
  z-index: 1;
  overflow: hidden;
}

/* Güneş — yatay orta, üst */
.surd-sun {
  position: absolute;
  top: 6%;
  left: 50%;
  width: clamp(64px, 6vw, 110px);
  opacity: 0.88;
  animation: sunSpin 22s linear infinite;
}

/* Ortak bulut stili */
.surd-cloud {
  position: absolute;
  opacity: 0.75;
}

/* ── Sol bulutlar ── */
.surd-c-l1 {                          /* büyük, güneşe yakın */
  width: clamp(80px, 7.5vw, 130px);
  top: 10%; left: 24%;
  animation: cloudL 4.5s ease-in-out infinite;
}
.surd-c-l2 {                          /* orta, daha uzak */
  width: clamp(60px, 5.5vw, 96px);
  top: 22%; left: 8%;
  animation: cloudL 6s ease-in-out 1.4s infinite;
}
.surd-c-l3 {                          /* küçük, üst */
  width: clamp(46px, 4vw, 72px);
  top: 1%;  left: 16%;
  animation: cloudL 5s ease-in-out 0.7s infinite;
}

/* ── Sağ bulutlar ── */
.surd-c-r1 {                          /* büyük, güneşe yakın */
  width: clamp(80px, 7.5vw, 130px);
  top: 10%; left: 62%;
  animation: cloudR 4.8s ease-in-out 0.3s infinite;
}
.surd-c-r2 {                          /* orta, daha uzak */
  width: clamp(60px, 5.5vw, 96px);
  top: 22%; left: 78%;
  animation: cloudR 6.2s ease-in-out 1.8s infinite;
}
.surd-c-r3 {                          /* küçük, üst */
  width: clamp(46px, 4vw, 72px);
  top: 1%;  left: 70%;
  animation: cloudR 5.2s ease-in-out 1.1s infinite;
}

/* ── Martı süzülme — eliptik yörünge, çok yumuşak ── */
@keyframes mf1 {
  0%,100% { transform: translate( 0px,  0px); }
  25%     { transform: translate( 3px, -5px); }
  50%     { transform: translate( 0px, -8px); }
  75%     { transform: translate(-3px, -4px); }
}
@keyframes mf2 {
  0%,100% { transform: translate( 0px,  0px); }
  25%     { transform: translate(-2px, -4px); }
  50%     { transform: translate( 0px, -6px); }
  75%     { transform: translate( 2px, -2px); }
}
@keyframes mf3 {
  0%,100% { transform: translate( 0px,  0px); }
  30%     { transform: translate( 4px, -7px); }
  60%     { transform: translate( 1px, -9px); }
  80%     { transform: translate(-2px, -3px); }
}
@keyframes mf4 {
  0%,100% { transform: translate( 0px,  0px); }
  40%     { transform: translate(-3px, -5px); }
  70%     { transform: translate( 1px, -7px); }
}
@keyframes mf1r {
  0%,100% { transform: scaleX(-1) translate( 0px,  0px); }
  25%     { transform: scaleX(-1) translate( 3px, -5px); }
  50%     { transform: scaleX(-1) translate( 0px, -8px); }
  75%     { transform: scaleX(-1) translate(-3px, -4px); }
}
@keyframes mf2r {
  0%,100% { transform: scaleX(-1) translate( 0px,  0px); }
  25%     { transform: scaleX(-1) translate(-2px, -4px); }
  50%     { transform: scaleX(-1) translate( 0px, -6px); }
  75%     { transform: scaleX(-1) translate( 2px, -2px); }
}
@keyframes mf3r {
  0%,100% { transform: scaleX(-1) translate( 0px,  0px); }
  30%     { transform: scaleX(-1) translate( 4px, -7px); }
  60%     { transform: scaleX(-1) translate( 1px, -9px); }
  80%     { transform: scaleX(-1) translate(-2px, -3px); }
}
@keyframes mf4r {
  0%,100% { transform: scaleX(-1) translate( 0px,  0px); }
  40%     { transform: scaleX(-1) translate(-3px, -5px); }
  70%     { transform: scaleX(-1) translate( 1px, -7px); }
}

/* Ortak martı stili — bulutların arkasında */
.marti {
  position: absolute;
  pointer-events: none;
  opacity: 0.78;
  z-index: 1;
}
.surd-cloud { z-index: 2; } /* bulutlar öne gelir */

/* ── Sol grup — bulutların iç tarafında, güneşe yakın ── */
.ml1 { width:clamp(24px,2.1vw,36px); top:26%; left:30%; animation:mf1  9.0s ease-in-out 0.0s infinite; }
.ml2 { width:clamp(18px,1.6vw,27px); top:32%; left:24%; animation:mf2 10.5s ease-in-out 1.2s infinite; }
.ml3 { width:clamp(13px,1.1vw,19px); top:22%; left:36%; animation:mf3  8.4s ease-in-out 2.0s infinite; }
.ml4 { width:clamp(24px,2.1vw,36px); top:38%; left:27%; animation:mf4  9.8s ease-in-out 0.6s infinite; }
.ml5 { width:clamp(13px,1.1vw,19px); top:34%; left:40%; animation:mf1 11.2s ease-in-out 1.5s infinite; }
.ml6 { width:clamp(18px,1.6vw,27px); top:42%; left:22%; animation:mf2  9.4s ease-in-out 2.6s infinite; }
.ml7 { width:clamp(13px,1.1vw,19px); top:28%; left:20%; animation:mf3 10.8s ease-in-out 0.8s infinite; }
.ml8 { width:clamp(18px,1.6vw,27px); top:44%; left:34%; animation:mf4  8.8s ease-in-out 1.9s infinite; }

/* ── Sağ grup — bulutların iç tarafında, güneşe yakın ── */
.mr1 { width:clamp(24px,2.1vw,36px); top:26%; left:66%; animation:mf1r  9.2s ease-in-out 0.3s infinite; }
.mr2 { width:clamp(18px,1.6vw,27px); top:32%; left:72%; animation:mf2r 10.8s ease-in-out 1.4s infinite; }
.mr3 { width:clamp(13px,1.1vw,19px); top:22%; left:60%; animation:mf3r  8.6s ease-in-out 2.2s infinite; }
.mr4 { width:clamp(24px,2.1vw,36px); top:38%; left:69%; animation:mf4r  9.6s ease-in-out 0.9s infinite; }
.mr5 { width:clamp(13px,1.1vw,19px); top:34%; left:56%; animation:mf1r 11.0s ease-in-out 1.7s infinite; }
.mr6 { width:clamp(18px,1.6vw,27px); top:42%; left:74%; animation:mf2r  9.2s ease-in-out 2.8s infinite; }
.mr7 { width:clamp(13px,1.1vw,19px); top:28%; left:76%; animation:mf3r 10.6s ease-in-out 1.0s infinite; }
.mr8 { width:clamp(18px,1.6vw,27px); top:44%; left:62%; animation:mf4r  9.0s ease-in-out 2.1s infinite; }

/* Mobilde gizle + mobil bg */
@media (max-width: 767px) {
  .surd-sky { display: none; }
  .surdurulebilir-bg { background-image: url('../images/surdurulebilir-mbl-bg.webp') !important; }
}

/* Arka plan dünya görseli — sağ yarı, düşük opaklık */
.surdurulebilir-bg {
  position: absolute;
  top: 0;
  right: 0;
  width: 50%;
  height: 100%;
  background: url('../images/surdurulebilir-bg.webp') center right / contain no-repeat;
  opacity: 1;
  pointer-events: none;
  z-index: 0;
}

/* Alüminyum element simgesi — sağ üst köşe */
.surdurulebilir-ai {
  position: absolute;
  top: 48px;
  right: 48px;
  width: clamp(56px, 5vw, 88px);
  z-index: 3;
  pointer-events: none;
}

/* İçerik sarmalayıcı */
.surdurulebilir-container {
  position: relative;
  z-index: 2;
}

/* Üst sağ açıklama satırı */
.surdurulebilir-top-row {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 48px;
}
.surdurulebilir-top-text {
  width: 40%;
  font-family: "proxima-nova", sans-serif;
  font-size: 18px;
  font-weight: 200;
  color: #e8e8e8;
}

/* Logo perspektif animasyonu — dinlenme + sağ/sol 3D tilt döngüsü */
@keyframes logoPerspective {
  0%   { transform: rotateY(0deg)   rotateX(0deg);  }
  8%   { transform: rotateY(0deg)   rotateX(0deg);  }
  24%  { transform: rotateY(16deg)  rotateX(4deg);  }
  38%  { transform: rotateY(0deg)   rotateX(0deg);  }
  50%  { transform: rotateY(0deg)   rotateX(0deg);  }
  66%  { transform: rotateY(-14deg) rotateX(-3deg); }
  80%  { transform: rotateY(0deg)   rotateX(0deg);  }
  100% { transform: rotateY(0deg)   rotateX(0deg);  }
}

/* Sol: logo görsel sütunu */
.surdurulebilir-img-col {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  perspective: 800px;
  perspective-origin: center center;
}

/* Periyodik animasyon wrapper'da — JS ile çakışmaz */
.surdurulebilir-logo-anim {
  display: inline-block;
  animation: logoPerspective 10s ease-in-out infinite;
  transform-origin: center center;
  will-change: transform;
}

.surdurulebilir-logo {
  display: block;
  width: 100%;
  max-width: 420px;
  height: auto;
  cursor: pointer;
}

/* Sağ: metin sütunu */
.surdurulebilir-content {
  text-align: center;
  padding-left: 40px;
}

.surdurulebilir-title {
  font-family: "proxima-nova", sans-serif;
  font-size: clamp(38px, 4.5vw, 68px);
  font-weight: 800;
  color: #e8e8e8;
  line-height: 1.10;
  margin: 0 0 28px;
}

.surdurulebilir-desc {
  font-family: "proxima-nova", sans-serif;
  font-size: 18px;
  font-weight: 200;
  color: #e8e8e8;
  margin: 0 auto 44px;
}

.surdurulebilir-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
  background: #d01734;
  color: #fff;
  font-family: "proxima-nova", sans-serif;
  font-size: 18px;
  font-weight: 700;
  padding: 10px 30px;
  border-radius: 5px;
  border: 2px solid #d01734;
  text-decoration: none;
  transition: background 0.25s, border-color 0.25s, transform 0.25s, box-shadow 0.25s;
}
.surdurulebilir-btn::after {
  content: "";
  position: absolute;
  top: 0;
  left: -75%;
  width: 50%;
  height: 100%;
  background: linear-gradient(110deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.4) 50%, rgba(255,255,255,0) 100%);
  transform: skewX(-20deg);
  transition: left 0.45s ease;
}
.surdurulebilir-btn:hover {
  background: #a8001f;
  border-color: #a8001f;
  color: #fff;
  transform: translateY(-3px);
  box-shadow: 0 10px 22px rgba(208, 23, 52, 0.35);
}
.surdurulebilir-btn:hover::after { left: 130%; }

/* ── Küçük mobil (≤480px) ── */
@media (max-width: 480px) {
  .surdurulebilir-bg { width: 100%; opacity: 1; background-position: bottom center; background-size: 140% auto; }
  .surdurulebilir-container { margin-top: 0; }
  .surdurulebilir-top-row { justify-content: flex-start; margin-bottom: 20px; }
  .surdurulebilir-top-text { width: 100%; padding-left: 0; font-size: 16px; }
  .surdurulebilir-ai { top: 10px; right: 10px; width: 40px; }
  .surdurulebilir-img-col { justify-content: center; }
  .surdurulebilir-logo { max-width: 200px; margin: 0 auto 24px; }
  .surdurulebilir-content { padding-left: 0; }
  .surdurulebilir-title { font-size: 28px; margin-bottom: 16px; }
  .surdurulebilir-desc { font-size: 16px; margin-bottom: 22px; }
  .surdurulebilir-btn { font-size: 16px; padding: 8px 20px; }
}

/* ── Mobil (481px – 767px) ── */
@media (min-width: 481px) and (max-width: 767px) {
  .surdurulebilir-bg { width: 100%; opacity: 1; background-position: bottom center; background-size: 110% auto; }
  .surdurulebilir-container { margin-top: 0; }
  .surdurulebilir-top-row { justify-content: flex-start; margin-bottom: 24px; }
  .surdurulebilir-top-text { width: 100%; padding-left: 0; font-size: 16px; }
  .surdurulebilir-ai { top: 12px; right: 12px; width: 44px; }
  .surdurulebilir-img-col { justify-content: center; }
  .surdurulebilir-logo { max-width: 140px; margin: 0 auto 28px; }
  .surdurulebilir-content { padding-left: 0; }
  .surdurulebilir-title { font-size: 34px; margin-bottom: 18px; }
  .surdurulebilir-desc { font-size: 16px; margin-bottom: 26px; }
  .surdurulebilir-btn { font-size: 16px; padding: 9px 22px; }
}

/* ── Tablet (768px – 1199px) ── */
@media (min-width: 768px) and (max-width: 1199px) {
  .surdurulebilir-bg { width: 70%; opacity: 1; background-position: center right; }
  .surdurulebilir-container { margin-top: 20px; }
  .surdurulebilir-top-row { justify-content: flex-end; margin-bottom: 28px; }
  .surdurulebilir-top-text { width: 100%; padding-left: 20px; font-size: 17px; }
  .surdurulebilir-ai { top: 0; right: 24px; width: 48px; }
  .surdurulebilir-img-col { justify-content: center; }
  .surdurulebilir-logo { max-width: 180px; margin: 0 auto 32px; }
  .surdurulebilir-content { padding-left: 0; }
  .surdurulebilir-title { font-size: 42px; margin-bottom: 20px; }
  .surdurulebilir-desc { font-size: 17px; margin-bottom: 30px; }
  .surdurulebilir-btn { font-size: 16px; padding: 9px 24px; }
}

/* ── Orta masaüstü (1200px – 1499px) ── */
@media (min-width: 1200px) and (max-width: 1499px) {
  .surdurulebilir-bg { width: 70%; opacity: 1; }
  .surdurulebilir-container { margin-top: 60px; }
  .surdurulebilir-top-row { margin-bottom: 34px; }
  .surdurulebilir-top-text { font-size: 17px; }
  .surdurulebilir-ai { top: 0; right: 36px; width: 52px; }
  .surdurulebilir-logo { max-width: 350px; }
  .surdurulebilir-title { font-size: 52px; }
  .surdurulebilir-desc { font-size: 17px; margin-bottom: 38px; }
  .surdurulebilir-btn { font-size: 16px; padding: 9px 26px; }
}

/* ── Orta-geniş masaüstü (1500px – 1999px) ── */
@media (min-width: 1500px) and (max-width: 1999px) {
  .surdurulebilir-bg { width: 70%; opacity: 1; }
  .surdurulebilir-container { margin-top: 100px; }
  .surdurulebilir-top-row { margin-bottom: 44px; }
  .surdurulebilir-top-text { font-size: 18px; }
  .surdurulebilir-ai { top: 0; right: 44px; width: 58px; }
  .surdurulebilir-logo { max-width: 350px; }
  .surdurulebilir-title { font-size: 62px; }
  .surdurulebilir-desc { font-size: 18px; margin-bottom: 48px; }
  .surdurulebilir-btn { font-size: 17px; padding: 10px 28px; }
}

/* ── Geniş masaüstü (≥2000px) — referans ── */
@media (min-width: 2000px) {
  .surdurulebilir-bg { width: 50%; opacity: 1; }
  .surdurulebilir-container { margin-top: 150px; }
  .surdurulebilir-top-row { margin-bottom: 56px; }
  .surdurulebilir-top-text { font-size: 20px; }
  .surdurulebilir-ai { top: 0; right: 56px; width: 65px; }
  .surdurulebilir-logo { max-width: 500px; }
  .surdurulebilir-title { font-size: 72px; }
  .surdurulebilir-desc { font-size: 20px; margin-bottom: 56px; }
  .surdurulebilir-btn { font-size: 18px; padding: 10px 30px; }
}




/* ══════════════════════════════════════════════════════
   FORMAL GÜNDEM SECTION
   ══════════════════════════════════════════════════════ */

/* ── Animasyon keyframes ── */
@keyframes gundemInFromCenter-L {
  from { opacity: 0; transform: translateX(80px); }
  to   { opacity: 1; transform: translateX(0); }
}
@keyframes gundemInFromCenter-R {
  from { opacity: 0; transform: translateX(-80px); }
  to   { opacity: 1; transform: translateX(0); }
}
@keyframes gundemScaleUp {
  0%   { opacity: 0;   transform: scale(0.4); }
  60%  { opacity: 1; }
  100% { opacity: 1;   transform: scale(1); }
}
.gundem-card-inner-l.gundem-in-left,
.gundem-card-outer-l.gundem-in-left  { animation: gundemInFromCenter-L 1.6s cubic-bezier(0.22,1,0.36,1) both; }
.gundem-card-inner-r.gundem-in-right,
.gundem-card-outer-r.gundem-in-right { animation: gundemInFromCenter-R 1.6s cubic-bezier(0.22,1,0.36,1) both; }

/* ── Section ── */
.gundem-sec {
  position: relative;
  overflow: hidden;
}
.gundem-sec::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) scale(0.3);
  width: clamp(300px, 28vw, 500px);
  height: clamp(300px, 28vw, 500px);
  border-radius: 50%;
  background: radial-gradient(circle, rgba(21,22,30,0.85) 0%, rgba(21,22,30,0.3) 45%, transparent 70%);
  pointer-events: none;
  z-index: 0;
  opacity: 0;
  transition: opacity 2s cubic-bezier(0.22,1,0.36,1), transform 2.4s cubic-bezier(0.22,1,0.36,1);
}
.gundem-sec.gundem-active::before {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1);
}

/* ── Row ── */
.gundem-row {
  display: flex;
  align-items: center;
  gap: clamp(8px, 1vw, 18px);
  position: relative;
  z-index: 1;
}

/* ── Kartlar — başlangıçta gizli ── */
.gundem-card {
  flex: 1 1 0;
  opacity: 0;
  min-width: 0;
  position: relative;
}
.gundem-card.gundem-in-left,
.gundem-card.gundem-in-right { opacity: 1; }

.gundem-card-outer-l,
.gundem-card-outer-r { z-index: 1; }
.gundem-card-inner-l,
.gundem-card-inner-r { z-index: 2; }
.gundem-center       { z-index: 3; }

.gundem-card-inner {
  width: 100%;
  aspect-ratio: 3 / 5;
  border-radius: 6px;
  overflow: hidden;
  background: rgba(255,255,255,0.04) center / cover no-repeat;
  border: 1px solid rgba(255,255,255,0.10);
  transition: transform 0.35s ease, box-shadow 0.35s ease;
}
.gundem-card:hover .gundem-card-inner {
  transform: scale(1.025);
  box-shadow: 0 12px 40px rgba(0,0,0,0.4);
}

/* ── Merkez başlık ── */
.gundem-center {
  flex: 0 0 auto;
  width: clamp(180px, 20vw, 300px);
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 0 8px;
  overflow: hidden;
  opacity: 0;
}
.gundem-center.gundem-center-visible {
  animation: gundemScaleUp 2.2s cubic-bezier(0.22,1,0.36,1) both;
}
.gundem-title-row {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: clamp(8px, 0.8vw, 16px);
  width: 100%;
}
.gundem-title {
  font-family: "proxima-nova", sans-serif;
  font-size: clamp(20px, 1.3vw, 20px);
  font-weight: 300;
  color: rgba(255,255,255,0.90);
  white-space: nowrap;
  text-transform: uppercase;
}
.gundem-formal {
  font-weight: 700;
  color: #fff;
}
.gundem-arrow {
  background: none;
  border: none;
  color: rgba(255,255,255,0.55);
  font-size: clamp(20px, 1.6vw, 26px);
  cursor: pointer;
  padding: 0;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: color 0.25s;
}
.gundem-arrow:hover { color: #fff; }

/* ── Responsive ── */
@media (max-width: 767px) {
  .gundem-row { flex-wrap: wrap; gap: 12px; }
  .gundem-card-inner-l,
  .gundem-card-inner-r { display: none; }
  .gundem-card-outer-l,
  .gundem-card-outer-r { flex: 0 0 calc(50% - 6px); }
  .gundem-center {
    order: -1;
    width: 100%;
    flex: 0 0 100%;
    padding: 0;
    margin-bottom: 4px;
    justify-content: center;
    overflow: visible;
  }
  .gundem-title-row {
    width: auto;
    gap: 20px;
  }
  .gundem-title {
    font-size: 20px;
    line-height: 1;
  }
  .gundem-arrow {
    font-size: 32px;
    color: rgba(255,255,255,0.85);
    width: 36px;
    height: 36px;
  }
}

@media (max-width: 480px) {
  .gundem-card-outer-l,
  .gundem-card-outer-r { flex: 0 0 calc(50% - 6px); }
}

@media (min-width: 768px) and (max-width: 1199px) {
  .gundem-title { font-size: 20px; }
  .gundem-row { flex-wrap: wrap; gap: 12px; }
  .gundem-center {
    order: -1;
    width: 100%;
    flex: 0 0 100%;
    padding: 0;
    margin-bottom: 4px;
    justify-content: center;
    overflow: visible;
  }
  .gundem-title-row {
    width: auto;
    justify-content: center;
  }
}

@media (min-width: 2000px) {
  .gundem-title { font-size: 20px;  }
  .gundem-card-title { font-size: 24px; }
  .gundem-card-desc { font-size: 15px; }
}
















