/* ===== Genel ===== */
*,*::before,*::after{ box-sizing:border-box }
html,body{ height:100%; margin:0; width:100%; max-width:100%; overflow-x:clip; -webkit-text-size-adjust:100% }

body{
  font-family: Arial, sans-serif;
  line-height: 1.6;
  color: #333;
  background: #fdfdfd;
}

/* ===== Navbar ===== */
.navbar{
  display:flex;
  justify-content:center;
  align-items:center;
  background:#002244;
  padding:5px 5px;
  color:#fff;

  /* --- Taşma FIX --- */
  position:fixed;
  top:0; left:0; right:0;
  width:auto;                 /* 100%/100vw taşma yapmasın */
  max-width:100%;
  margin:0;
  z-index:1000;
  overflow-x:clip;
}

.navbar .logo img{
  max-width:50px;
  height:50px;
  border-radius:50%;
  cursor:pointer;
  margin-right:8px;
  transition:transform .3s, filter .3s;
}
.navbar .logo img:hover{
  transform:translateY(-5px) scale(1.1);
  filter:drop-shadow(0 5px 10px rgba(0,0,0,.3));
}

.nav-links{
  display:flex;
  list-style:none;
  gap:10px;
  margin:0;
  padding:15px;
  align-items:flex-end;

  /* --- Flex satır patlaması FIX --- */
  min-width:0;
  box-sizing:border-box;
}
.nav-links li a{
  color:#fff;
  text-decoration:none;
  font-size:16px;
}
.nav-links a{
  color:#333; text-decoration:none; padding:8px 0; transition:color .3s;
}
.nav-links a:hover{ color:#ffcc00; }
.nav-links a.active{ color:#ff4b2b; font-weight:bold; border-bottom:2px solid #ff4b2b; }

.nav-links a::after{
  content:""; display:block; height:2px; width:0; background:#fff; transition:width .3s;
}
.nav-links a:hover::after{ width:100%; }

/* Hamburger */
.menu-toggle{
  /* --- Taşma FIX: genişliği otomatik bırak --- */
  display:none;
  width:auto;
  flex-direction:column;
  cursor:pointer;
  gap:5px;
  margin-left:0;
}
.menu-toggle span{
  width:28px; height:4px; background:#fff; transition:.3s;
}

/* ===== RESPONSIVE ===== */
@media (max-width:768px){
  .navbar{ justify-content:space-between; padding:10px 20px; }

  .nav-links{
    position:absolute;
    top:60px; right:0;
    background:#002244; color:#fff;
    width:min(260px, 90vw);            /* --- menü genişliği ekrana uysun --- */
    display:none;
    flex-direction:column;
    padding:10px;
  }
  .nav-links.active{ display:flex; }
  .nav-links.show{ display:block; right:0; }
  .nav-links li{ list-style:none; }
  .nav-links li a{ display:block; padding:15px; color:#fafafa; }

  .menu-toggle{
    display:flex;
    align-items:center;
    justify-content:center;
    position:relative;                  /* sticky değildi — taşma yapıyordu */
    right:auto; top:auto;
    z-index:10000;
  }
  .menu-toggle.active span:nth-child(1){ transform:rotate(45deg) translate(5px,5px) }
  .menu-toggle.active span:nth-child(2){ opacity:0 }
  .menu-toggle.active span:nth-child(3){ transform:rotate(-45deg) translate(5px,-5px) }
}

/* ===== HERO – tam responsive, taşma yok ===== */
/* Örneğin ilk slide için bir sınıf */

/* ==== HERO OVERRIDE (tüm çakışmaları ez) ==== */
/* HERO: yüksekliği resmi takip eder (tam ekran zorunlu değil) */
.hero{
  position:relative;
  width:100%;  
  background:#000;
  overflow:hidden;
  /* JS buraya px olarak yükseklik yazacak */
  height:var(--hero-h, auto);
}




/* Katmanlar */
.hero-slide{
  position:absolute; inset:0;
  opacity:0; transition:opacity .6s ease; z-index:0;
  display:flex; align-items:center; justify-content:center;
}
.hero-slide.show{ opacity:1; }

/* Resim: ASLA kırpma yok, oran korunur */
.hero-slide > img{
  display:block;
  max-width:100%;
  height:auto;          /* oran koru */
  object-fit:contain;   /* kırpma yok */
  object-position:center;
  user-select:none; -webkit-user-drag:none; pointer-events:none;
}

/* İstersen hafif karartma */
.hero::before{content:"";position:absolute;inset:0;background:rgba(0,0,0,.25);z-index:1}



/* İstersen spesifik görsellerde odak kaydırma (opsiyonel)
.hero.hero--short-cover .hero-slide.pos-SLD3 > img { object-position: 50% 42%; }
*/




/* İstersen spesifik görsellerde odak kaydırma (opsiyonel)
.hero.hero--short-cover .hero-slide.pos-SLD3 > img { object-position: 50% 42%; }
*/



/* ===== Diğer bölümler (mevcut stilin korunarak) ===== */
/* (Aşağıdaki bloklar senin orijinal ayarların — yapısına dokunmadım) */

.services, .services1 .references { padding:80px 20px; text-align:center; }
.service-cards, .service-cards1 .ref-cards { display:flex; justify-content:center; gap:20px; flex-wrap:wrap; }
.card, .card1 .ref-card{ background:#0077b6; padding:30px; border-radius:10px; box-shadow:0 4px 10px rgba(0,0,0,.1); transition:.3s }
.ref-cards{ text-align:center; padding-left:0; padding-right:0; gap:20px; flex-wrap:wrap; display:flex; justify-content:center; }
.card:hover, .card1:hover, .ref-card:hover{ background:#ffcc00; transform:translateY(-10px); box-shadow:0 6px 18px rgba(0,0,0,.15) }
.ref-card h4{ margin-top:15px; color:#03498f }
.ref-logo{ display:flex; margin:45px auto 15px; width:85px; height:85px; object-fit:cover; border-radius:50%; border:2px solid #002244 }

.feature-box .feature-box1{ display:flex; align-items:flex-start; background:#fff; border:1px solid #dcdcdc; border-left:6px solid #0077b6; padding:30px; margin:40px 0; border-radius:8px; box-shadow:0 2px 8px rgba(0,0,0,.05); transition:.3s }
.feature-box:hover, .feature-box1:hover{ background:#b9c302; transform:translateY(-5px); box-shadow:0 6px 16px rgba(0,119,182,.2); border-left-color:#023e8a }
.feature-text, .feature-text1{ flex:1; padding-right:30px }
.feature-text, .feature-text1 h3{ font-size:22px; color:#1a1a1a; margin-bottom:15px; font-weight:600 }
.feature-text, .feature-text1 p{ font-size:17px; color:#333; line-height:1.7; text-align:justify }
.feature-image,.feature-image1{ flex:0 0 300px; display:flex; justify-content:center; align-items:center }
.feature-image, .feature-image1 img{ display:block; width:100%; max-width:300px; height:auto; border-radius:6px; box-shadow:0 2px 6px rgba(0,0,0,.1); transition:transform .3s, border .3s }
.feature-image,.feature-image1 img:hover{ transform:scale(1.05) }

.contact{ padding:80px 20px; text-align:center; background:#002244 }
form{ display:flex; flex-direction:column; gap:15px; max-width:500px; margin:auto; padding:20px; background:#fff; border-radius:10px; box-shadow:0 4px 15px rgba(0,0,0,.1) }
form input, form textarea, form button{ padding:12px; font-size:16px; border:1px solid #ccc; border-radius:8px }
form button{ background:#002244; color:#fff; border:none; cursor:pointer; transition:.3s }
form button:hover{ background:#ffcc00; color:#000 }
.contact-info{ margin-top:30px; display:flex; justify-content:center; gap:20px; flex-wrap:wrap }
.info-box{ display:inline-block; padding:7px  15px; background:#ffffff; color:#002244; font-weight:bold; border-radius:10px; text-decoration:none; box-shadow:0 4px 12px rgba(0,0,0,.2); transition:.3s }
.info-box:hover{ background:#ffcc00; color:#002244; transform:translateY(-5px) scale(1.05) }
.contact-icons{ display:flex; gap:15px; justify-content:center; margin-top:20px }
.icon-link img{ width:50px; height:50px; transition:transform .2s }
.icon-link:hover img{ transform:scale(1.2) }
@media (max-width:992px){ .contact-info{ font-size:18px } }
@media (max-width:768px){ .contact-info{ font-size:15px; letter-spacing:1px; margin-bottom:20px } }
@media (max-width:480px){ .contact-info{ font-size:14px; line-height:1.2; text-align:center } }

#contacth2{ font-family:Poppins, sans-serif; font-size:52px; font-weight:700; text-align:center; color:#000; margin-bottom:30px; letter-spacing:2px; text-transform:uppercase; background:linear-gradient(90deg,#050505,#148ba3,#010101); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; text-shadow:2px 2px 8px rgba(0,0,0,.1); position:relative }
#contacth2::after{ content:""; display:block; width:350px; height:2px; background:#c6b713; margin:12px auto 0; border-radius:2px }
@media (max-width:992px){ #contacth2{ font-size:38px } }
@media (max-width:768px){ #contacth2{ font-size:30px; letter-spacing:1px; margin-bottom:20px } }
@media (max-width:480px){ #contacth2{ font-size:24px; line-height:1.2; text-align:center } }

.references{ flex:1; scroll-margin-top:80px; padding-top:100px; margin-top:-100px }
.site-footer{ background:#002244; color:#fff; text-align:center; padding:1px; margin-top:auto }
/* About — içerik yine max 1000px, ama arka plan tam genişlik */
.about{
  background: linear-gradient(180deg,#080b0f 0%, #002249 40%);
  /* içerik stillerin kalsın */
  padding:60px 40px;
  line-height:1.8; color:#fff; text-align:center;
  max-width:1000px; margin:0 auto; position:relative;

  /* ŞUNLARI kaldırıyoruz: */
  
  border-radius:0;               /* beyaz köşeler olmasın */
  box-shadow:none;               /* kenarlarda halo yapmasın */
}

/* Tam genişlik (#002244) arka plan */
.about::before{
  content:"";
  position:absolute;
  top:0; bottom:0;
  /* full-bleed hilesi: */
  left:50%; right:50%;
  margin-left:-50vw; margin-right:-50vw;
  background:#002244;
  z-index:-1;                    /* içeriğin arkasında */
}

/* Başlık, paragraf, görsel — senin değerlerinle uyumlu */
.about h2{
  margin-top:auto; font-size:5.5rem; font-weight:bold; color:#fff;
  text-align:center; opacity:0; transform:translateY(50px);
  animation:slideUp 1.2s ease-out forwards; position:relative;
}
.about h2::after{
  content:''; display:block; width:50%; height:4px;
  background:#0077b6; margin:.5px auto 0; border-radius:2px;
}
.about p{ font-size:18px; text-align:justify; margin-bottom:20px; color:#fff; }
.about img{
  width:60%; margin-top:20px; border-radius:10px;
  box-shadow:0 4px 10px rgba(0,0,0,.2);
  opacity:0; transform:scale(.9); transition:all 1s ease;
}
.about img.visible{ opacity:1; transform:scale(1); }

@keyframes slideUp{ from{opacity:0; transform:translateY(50px)} to{opacity:1; transform:translateY(0)} }
@keyframes underline{ from{width:0} to{width:80px} }

#aboutlogo{ max-width:480px; position:relative; z-index:2; border-radius:12px; backdrop-filter:blur(6px); animation:logoFadeIn 1.2s ease-out forwards; transition:transform .4s, box-shadow .4s; box-shadow:0 0 12px rgba(245,2,2,.1), 0 0 24px rgba(0,34,255,.3), inset 0 0 6px rgba(241,230,3,.2) }
#aboutlogo:hover{ transform:scale(1.05); box-shadow:0 0 20px rgba(124,11,11,.2), 0 0 40px rgba(238,255,0,.5), inset 0 0 8px rgba(0,51,255,.3) }
@keyframes logoFadeIn{ from{opacity:0; transform:scale(.9); filter:blur(4px)} to{opacity:1; transform:scale(1); filter:blur(0)} }

.about-features{ display:flex; justify-content:space-between; gap:20px; margin-top:40px; flex-wrap:wrap }
.about-box{ flex:1 1 220px; background:#97bdee; padding:20px; border-radius:10px; text-align:center; box-shadow:0 4px 12px rgba(0,0,0,.05); transition:.3s }
.about-box h4{ margin-bottom:10px; color:#0077b6; font-size:18px }
.about-box p{ font-size:15px; color:#333; line-height:1.5 }
.about-box:hover{ background:#b9c302; transform:translateY(-5px); box-shadow:0 6px 18px rgba(0,119,182,.2) }
@media (max-width:768px){ .about-features{ flex-direction:column; align-items:center } .about-box{ width:90%; margin-bottom:20px } }

/* Başlık setleri */
.hizmeth1{ font-size:2.5rem; font-weight:bold; color:#333; text-align:center; opacity:0; transform:translateY(50px); animation:slideUp 1.2s ease-out forwards; position:relative }
#referanslarımız, #hakkımızda1{ font-family:Poppins, sans-serif; font-weight:700; text-align:center; color:#000; margin-bottom:30px; letter-spacing:2px; text-transform:uppercase; background:linear-gradient(90deg,#050505,#148ba3,#010101); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; text-shadow:2px 2px 8px rgba(0,0,0,.1); position:relative }
#referanslarımız{ font-size:42px }
#referanslarımız::after{ content:""; display:block; width:350px; height:2px; background:#c6b713; margin:12px auto 0; border-radius:2px }
#hakkımızda1{ font-size:52px }
#hakkımızda1::after{ content:""; display:block; width:350px; height:2px; background:#c6b713; margin:12px auto 0; border-radius:2px }
@media (max-width:992px){ #referanslarımız{ font-size:38px } #hakkımızda1{ font-size:38px } }
@media (max-width:768px){ #referanslarımız{ font-size:30px; margin-bottom:20px } #hakkımızda1{ font-size:30px; margin-bottom:20px } }
@media (max-width:480px){ #referanslarımız{ font-size:24px; line-height:1.2 } #hakkımızda1{ font-size:24px; line-height:1.2 } }


/* Haciz / İcra — sadece bu section için (ID scoped) */
#haciz-islemleri{
  padding-block: clamp(48px, 8vw, 96px);
  background: linear-gradient(180deg, #002244 0%, #0b0d10 100%);
  border-block: 1px solid rgba(255,255,255,0.04);
}
#haciz-islemleri .container{ width: min(1100px, 92vw); margin-inline: auto; }

#haciz-islemleri .feature-grid{
  display:grid;
  grid-template-columns: 1.05fr .95fr;
  gap: clamp(20px, 4vw, 48px);
  align-items:center;
}

#haciz-islemleri .feature-text h2{
  margin:0 0 .6em;
  font-size:clamp(1.4rem, 2.6vw + .4rem, 2.2rem);
  line-height:1.2;
  color: #FFCC00;
}
#haciz-islemleri .feature-text p{ margin:0 0 1em; color:#eaeaea; }

#haciz-islemleri .feature-steps{
  margin:0; padding-left:1.15em; line-height:1.6;
  color: #f7f7f7;
}
#haciz-islemleri .feature-steps li{ margin:.35em 0; }
#haciz-islemleri .feature-steps em{ font-style:normal; font-weight:600; }

#haciz-islemleri .feature-note{
  margin-top:.9em; font-size:.95rem;
  color:#cbd5e1; background:#0b0b0b; border:1px solid #1f2937;
  padding:.75em .9em; border-radius:10px;
}

#haciz-islemleri .feature-media{
  margin:0; padding:0; border-radius:14px; overflow:hidden;
  box-shadow:0 10px 30px rgba(0,0,0,.35);
}
#haciz-islemleri .feature-media img{
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;  /* cover yerine contain */
  object-position: center top;  /* gerekirse üstten hizala */
  
  border-radius: 14px;
}

/* Responsive */
@media (max-width: 992px){
  #haciz-islemleri .feature-grid{ grid-template-columns:1fr; }
  #haciz-islemleri .feature-media{ order:2; }
  #haciz-islemleri .feature-text{ order:1; }
  #haciz-islemleri .feature-media img{ aspect-ratio:16/10; }
}
@media (max-width: 480px){
  #haciz-islemleri .container{ width:94vw; }
  #haciz-islemleri .feature-text h2{ font-size:clamp(1.26rem, 5.8vw, 1.6rem); }
  #haciz-islemleri .feature-steps{ font-size:.97rem; }
}

/* Haciz bölümü not kutusu (mavi ton) */
#haciz-islemleri .feature-note{
  background: #0b1623;
  border: 1px solid #FFCC00;
  color: #dbeafe;
  border-radius: 10px;
  padding: .75em .9em;
  transition: background .25s ease, border-color .25s ease, box-shadow .25s ease, transform .2s ease;
}
#haciz-islemleri .feature-note:hover,
#haciz-islemleri .feature-note:focus-visible{
  background: #FFCC00; 
  border-color: #2f5fb3;
  box-shadow: 0 0 0 3px rgba(47,95,179,.25);
  transform: translateY(-1px);
  outline: none;
  color: #002244;
}

/* ===== Paralegal Tahsilat Danışmanlığı (ID scoped) ===== */

#tahsilat-danismanlik{
  padding-block: clamp(48px, 8vw, 96px);
  background: linear-gradient(180deg,#080b0f 0%, #002249 60%);
  border-block: 1px solid rgba(255,255,255,.05);
  color: #e9eef5;
}

#tahsilat-danismanlik .td-container{
  width: min(1100px, 92vw);
  margin-inline: auto;
}

#tahsilat-danismanlik .td-grid{
  display: grid;
  grid-template-columns: .95fr 1.05fr; /* görsel solda, metin sağda */
  gap: clamp(20px, 4vw, 48px);
  align-items: center;
}

/* Görsel */
/* === KIRPMASIZ GÖRSEL (yalnız #tahsilat-danismanlik) === */
#tahsilat-danismanlik .td-media{
 margin:0; padding:0; border-radius:14px; overflow:hidden;
  box-shadow:0 10px 30px rgba(0,0,0,.35);

  /* Görseli ortalamak için esnek kutu */
  display:flex; align-items:center; justify-content:center;
  background:#002244;         /* letterbox alanlar siyah kalsın */
  min-width:0;             /* grid taşmasını engeller */
}

#tahsilat-danismanlik .td-media img{
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;  /* cover yerine contain */
  object-position: center top;  /* gerekirse üstten hizala */
  
  border-radius: 14px;/
}

/* Mobilde biraz daha yüksek olmasına izin ver */
@media (max-width: 992px){
  #tahsilat-danismanlik .td-media img{
    max-height: clamp(220px, 48vh, 560px);
  }
}


/* Metin */
#tahsilat-danismanlik .td-text h2{
  margin:0 0 .6em;
  font-size: clamp(1.4rem, 2.6vw + .4rem, 2.2rem);
  line-height: 1.2; color:#FFCC00;
}
#tahsilat-danismanlik .td-text p{ margin:0 0 1em; color:#d6dee8; }
#tahsilat-danismanlik .td-items{
  margin:0; padding-left: 1.1em; line-height:1.6;
}
#tahsilat-danismanlik .td-items li{ margin:.35em 0; }
#tahsilat-danismanlik .td-note{
  margin-top:.9em; font-size:.95rem;
  color:#cbd5e1; background:#0b0f14; border:1px solid #1f2937;
  padding:.75em .9em; border-radius:10px;
}

/* Responsive */
@media (max-width: 992px){
  #tahsilat-danismanlik .td-grid{ grid-template-columns: 1fr; }
  #tahsilat-danismanlik .td-media{ order: 2; }
  #tahsilat-danismanlik .td-text{ order: 1; }
  #tahsilat-danismanlik .td-media img{ aspect-ratio: 16 / 10; object-position:center 35%; }
}
@media (max-width: 480px){
  #tahsilat-danismanlik .td-container{ width:94vw; }
  #tahsilat-danismanlik .td-text h2{ font-size: clamp(1.24rem, 5.8vw, 1.6rem); }
  #tahsilat-danismanlik .td-items{ font-size:.97rem; }
}

/* Tahsilat danışmanlığı not kutusu (yeşil ton) */
#tahsilat-danismanlik .td-note{
  background: #002244;
  border: 1px solid #FFCC00;
  color: #dbeafe;
  border-radius: 10px;
  padding: .75em .9em;
  transition: background .25s ease, border-color .25s ease, box-shadow .25s ease, transform .2s ease;
}
#tahsilat-danismanlik .td-note:hover,
#tahsilat-danismanlik .td-note:focus-visible{
  background: #FFCC00; 
  border-color: #2f5fb3;
  box-shadow: 0 0 0 3px rgba(43,122,109,.25);
  transform: translateY(-1px);
  outline: none;
  color: #002244;
}


h1 {
  text-align: center;
  margin: 35px 0 20px 0 !important;
}

/* ===========================
   CONTACT (yalnızca stil)
   HTML değiştirmeden uygulanır
   =========================== */