/* ==================================================================
   cetinisik.com — YENİ TASARIM SİSTEMİ
   ------------------------------------------------------------------
   Porto teması, owl.carousel, modernizr ve plugins.min.js KULLANILMAZ.
   Bu dosya tek başına tüm görünümü kurar (~14 KB).
   Eski yığın: ~900 KB CSS+JS.

   TASARIM YÖNÜ — "klinik güven"
   Bir hastane zinciri ya da girişim sitesi değil; kıdemli bir cerrahın
   muayenehanesi. Sakin, kesin, gösterişsiz. Renk az yerde ve bilerek
   kullanılır; boşluk ve tipografi taşır.

   ERİŞİLEBİLİRLİK
   Eski markanın teal'i (#2baab1) beyaz üzerinde 2,6:1 kontrast veriyordu —
   WCAG AA sınırı 4,5:1. Marka tanınırlığı için ton korundu ama METİN ve
   BUTON için koyulaştırıldı (#0F7A80 → 4,8:1).
   ================================================================== */

/* ---------- TEMEL ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}

:root{
  --zemin:#fbfcfc;          /* saf beyaz değil — ekranda daha yumuşak */
  --kart:#ffffff;
  --zemin-alt:#f2f6f6;
  --murekkep:#10201f;       /* teal'e çalan koyu — saf siyahtan sıcak */
  --yumusak:#4f6362;
  --sonuk:#7d8f8e;
  --cizgi:#e2e9e9;
  --cizgi-koyu:#cfdada;

  --marka:#0f7a80;          /* metin/buton — erişilebilir */
  --marka-koyu:#0a5257;
  --marka-acik:#2baab1;     /* eski marka tonu — büyük öğelerde */
  --marka-sis:#edf6f6;

  --eylem:#e35d2b;          /* SADECE birincil eylem çağrısı */
  --eylem-koyu:#c44a1c;

  --r1:8px; --r2:14px; --r3:22px;
  --g1:0 1px 2px rgba(16,32,31,.04), 0 4px 14px rgba(16,32,31,.05);
  --g2:0 2px 8px rgba(16,32,31,.06), 0 16px 40px rgba(16,32,31,.09);
  --olcu:70ch;
}

body{
  margin:0;
  background:var(--zemin);
  color:var(--murekkep);
  font-family:"Source Sans 3","Source Sans Pro",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  font-size:17.5px;
  line-height:1.68;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto;display:block}
a{color:var(--marka);text-decoration:none;transition:color .15s}
a:hover{color:var(--marka-koyu)}
:focus-visible{outline:2.5px solid var(--marka);outline-offset:3px;border-radius:4px}

h1,h2,h3,h4{
  font-family:"Manrope","Source Sans 3",-apple-system,"Segoe UI",sans-serif;
  color:var(--murekkep);letter-spacing:-.022em;text-wrap:balance;margin:0;
}
h1{font-size:clamp(31px,4.6vw,52px);font-weight:800;line-height:1.08}
h2{font-size:clamp(25px,3.3vw,36px);font-weight:800;line-height:1.16}
h3{font-size:clamp(19px,2.2vw,23px);font-weight:700;line-height:1.3}
p{margin:0 0 1.05em}

.kapsa{max-width:1180px;margin:0 auto;padding:0 22px}
.dar{max-width:var(--olcu)}
.bolum{padding:clamp(52px,7vw,96px) 0}
.bolum-alt{background:var(--zemin-alt)}

.ust-etiket{
  font-size:12.5px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;
  color:var(--marka);margin:0 0 12px;
  font-family:"Manrope",sans-serif;
}

/* ---------- BUTON ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:9px;
  font-family:"Manrope",sans-serif;font-weight:700;font-size:15.5px;
  padding:13px 26px;border-radius:var(--r1);border:1.5px solid transparent;
  cursor:pointer;transition:transform .12s,box-shadow .18s,background .18s;
  text-decoration:none;line-height:1.2;
}
.btn:hover{transform:translateY(-1px);text-decoration:none}
.btn-ana{background:var(--eylem);color:#fff;box-shadow:0 2px 12px rgba(227,93,43,.26)}
.btn-ana:hover{background:var(--eylem-koyu);color:#fff;box-shadow:0 6px 20px rgba(227,93,43,.32)}
.btn-marka{background:var(--marka);color:#fff;box-shadow:0 2px 12px rgba(15,122,128,.22)}
.btn-marka:hover{background:var(--marka-koyu);color:#fff}
.btn-cizgi{background:transparent;border-color:var(--cizgi-koyu);color:var(--murekkep)}
.btn-cizgi:hover{border-color:var(--marka);color:var(--marka)}
.btn-beyaz{background:#fff;color:var(--marka);border-color:#fff}
.btn-beyaz:hover{background:var(--marka-sis);color:var(--marka-koyu)}

/* ---------- ÜST BAR + MENÜ ---------- */
.tepe{background:var(--marka-koyu);color:#cfe6e7;font-size:14px}
.tepe .kapsa{display:flex;gap:22px;align-items:center;justify-content:flex-end;height:40px}
.tepe a{color:#cfe6e7;display:inline-flex;align-items:center;gap:7px}
.tepe a:hover{color:#fff}
/* Dil anahtarı — yapışkan başlığın içinde, "Randevu Al"ın yanında.
   Tek başına duran "EN" yerine iki dilli segment. */
.dil{
  display:inline-flex;align-items:center;gap:2px;flex:none;
  padding:3px 3px 3px 9px;border-radius:99px;
  border:1px solid var(--cizgi-koyu);background:var(--zemin-alt);
}
.dil-kure{color:var(--sonuk);margin-right:6px;flex:none}
.dil .secili,
.dil a{
  font-family:"Manrope",sans-serif;font-size:12.5px;font-weight:800;letter-spacing:.06em;
  padding:5px 11px;border-radius:99px;line-height:1;display:inline-flex;align-items:center;
  transition:background .16s,color .16s;
}
.dil .secili{background:var(--marka);color:#fff}          /* 4.5:1 üstü kontrast */
.dil a{color:var(--yumusak)}
.dil a:hover{background:#fff;color:var(--marka-koyu);box-shadow:0 1px 3px rgba(16,32,31,.12)}

.baslik-cubugu{
  position:sticky;top:0;z-index:60;background:rgba(255,255,255,.88);
  backdrop-filter:saturate(180%) blur(14px);
  border-bottom:1px solid rgba(226,233,233,.9);
  transition:box-shadow .25s;
}
.baslik-cubugu:hover{box-shadow:0 1px 20px rgba(16,32,31,.05)}
.baslik-cubugu .kapsa{display:flex;align-items:center;gap:28px;height:78px}
/* Dil anahtarı HTML'de logodan hemen sonra duruyor (mobilde solda kalsın diye),
   masaüstünde menünün sağına — "Randevu Al"ın yanına — alınıyor. */
.baslik-cubugu .menu{order:1}
.baslik-cubugu .dil{order:2;margin-left:14px}
.logo img{max-height:50px;width:auto}

.menu{display:flex;gap:2px;margin-left:auto;align-items:center}
.menu > a,.alt-menu > a{
  position:relative;font-family:"Manrope",sans-serif;font-weight:600;font-size:15.5px;
  color:var(--murekkep);padding:10px 15px;border-radius:var(--r1);
  transition:color .18s;white-space:nowrap;
}
/* alttan büyüyen ince çizgi — arka plan bloğundan daha zarif */
.menu > a::after,.alt-menu > a::after{
  content:"";position:absolute;left:15px;right:15px;bottom:5px;height:2px;
  background:var(--marka);border-radius:2px;
  transform:scaleX(0);transform-origin:center;transition:transform .24s cubic-bezier(.2,.7,.3,1);
}
.menu > a:hover,.alt-menu > a:hover{color:var(--marka)}
.menu > a:hover::after,.alt-menu > a:hover::after{transform:scaleX(1)}
.menu > a.aktif,.alt-menu > a.aktif{color:var(--marka-koyu)}
.menu > a.aktif::after,.alt-menu > a.aktif::after{transform:scaleX(1);background:var(--marka-acik)}
/* buton menü öğesi değil — çizgi almasın */
.menu > a.btn::after{display:none}
.menu > a.btn{padding:12px 22px}

.menu-buton{
  display:none;background:none;border:1.5px solid var(--cizgi-koyu);
  border-radius:var(--r1);padding:9px 14px;margin-left:auto;cursor:pointer;
  font-size:19px;line-height:1;color:var(--murekkep);transition:border-color .18s,color .18s;
}
.menu-buton:hover{border-color:var(--marka);color:var(--marka)}

/* açılır alt menü */
.alt-menu{position:relative}
.alt-menu > .liste{
  position:absolute;top:calc(100% + 10px);left:50%;transform:translateX(-50%) translateY(-6px);
  min-width:268px;background:#fff;border:1px solid var(--cizgi);border-radius:var(--r2);
  box-shadow:0 4px 12px rgba(16,32,31,.06), 0 18px 44px rgba(16,32,31,.13);
  padding:9px;opacity:0;visibility:hidden;
  transition:opacity .2s,transform .2s,visibility .2s;
}
/* küçük ok — menüye bağlı olduğunu gösterir */
.alt-menu > .liste::before{
  content:"";position:absolute;top:-6px;left:50%;margin-left:-6px;width:12px;height:12px;
  background:#fff;border-left:1px solid var(--cizgi);border-top:1px solid var(--cizgi);
  transform:rotate(45deg);border-radius:2px 0 0 0;
}
.alt-menu:hover > .liste,.alt-menu:focus-within > .liste{
  opacity:1;visibility:visible;transform:translateX(-50%) translateY(0);
}
.alt-menu .liste a{
  display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:var(--r1);
  font-size:15px;font-weight:600;color:var(--murekkep);transition:background .16s,color .16s,padding .16s;
}
.alt-menu .liste a::before{
  content:"";width:5px;height:5px;border-radius:50%;background:var(--cizgi-koyu);
  flex:none;transition:background .16s;
}
.alt-menu .liste a:hover{background:var(--marka-sis);color:var(--marka-koyu);padding-left:17px}
.alt-menu .liste a:hover::before{background:var(--marka-acik)}
.alt-menu .liste a:first-child{
  font-weight:700;border-bottom:1px solid var(--cizgi);
  border-radius:var(--r1) var(--r1) 0 0;margin-bottom:5px;padding-bottom:12px;
}

/* ---------- HERO — metin solda, görsel SAĞDA ---------- */
.hero{
  position:relative;overflow:hidden;
  background:
    radial-gradient(1100px 620px at 88% 18%, rgba(43,170,177,.16), transparent 62%),
    linear-gradient(168deg,#0a5257 0%,#0d6a70 58%,#0f7a80 100%);
  color:#fff;
}
/* ince doku — düz renk yerine derinlik */
.hero::before{
  content:"";position:absolute;inset:0;opacity:.5;
  background-image:radial-gradient(rgba(255,255,255,.055) 1px,transparent 1px);
  background-size:22px 22px;
}
.hero .kapsa{position:relative;z-index:2;padding:clamp(46px,6vw,78px) 22px}

.hero-satir{
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.86fr);
  gap:clamp(30px,5vw,64px);align-items:center;
}
.hero-ic{max-width:600px}
.hero h1{color:#fff;margin-bottom:18px}
.hero p.giris{color:#cfe7e8;font-size:19px;line-height:1.6;margin-bottom:26px}
.hero .eylemler{display:flex;gap:13px;flex-wrap:wrap;margin-bottom:26px}
/* küçük güven rozetleri — başlığın altında */
.hero .rozetler{display:flex;gap:9px;flex-wrap:wrap}
.hero .rozetler span{
  background:rgba(255,255,255,.11);border:1px solid rgba(255,255,255,.16);
  border-radius:99px;padding:6px 14px;font-size:14px;color:#e3f3f4;
}

/* ---------- SLIDER (kütüphanesiz) ---------- */
.slayt-kutu{position:relative}
.slaytlar{
  display:flex;overflow-x:auto;scroll-snap-type:x mandatory;
  scrollbar-width:none;-ms-overflow-style:none;border-radius:var(--r3);
  box-shadow:0 22px 60px rgba(4,42,45,.42);
}
.slaytlar::-webkit-scrollbar{display:none}
.slayt{flex:0 0 100%;scroll-snap-align:center;position:relative}
/* ⚠️ ORAN GÖRSELİN KENDİ ORANIDIR.
   Slider klasöründeki fotoğrafların tamamı DİKEY (613×704 ≈ 0,87).
   İlk sürümde yatay oran (4/3.35 ≈ 1,19) zorlanıyordu; `cover` üstten
   kırptığı için doktorun KAFASI görünmüyordu.
   `object-position:center top` de eklendi: ileride farklı oranda bir
   görsel yüklenirse kırpma üstten değil alttan olur, yüz korunur. */
.slayt img{width:100%;aspect-ratio:613/704;object-fit:cover;object-position:center top;display:block}
/* alt köşede küçük başlık — görselin ne olduğunu söyler */
.slayt figcaption{
  position:absolute;left:0;right:0;bottom:0;padding:34px 22px 18px;
  background:linear-gradient(transparent,rgba(4,42,45,.82));
  color:#fff;font-size:15px;font-family:"Manrope",sans-serif;font-weight:600;
}
.slayt-nokta{display:flex;gap:8px;justify-content:center;margin-top:16px}
.slayt-nokta button{
  width:9px;height:9px;border-radius:50%;border:none;cursor:pointer;padding:0;
  background:rgba(255,255,255,.34);transition:width .2s,background .2s;
}
.slayt-nokta button[aria-current="true"]{width:26px;border-radius:99px;background:#fff}

/* ---------- GÜVEN ŞERİDİ ---------- */

/* ---------- GÜVEN ŞERİDİ ---------- */
/* Dört cerrahi bölüm. Önceden sadece ince çizgiyle ayrılmış metin
   bloklarıydı — tıklanamıyordu ve kart gibi durmuyordu. Artık her biri
   kendi bölüm sayfasına giden belirgin bir kart. */
.guven{background:var(--zemin);padding:40px 0 44px;border-bottom:1px solid var(--cizgi)}
.guven .kapsa{display:grid;grid-template-columns:repeat(auto-fit,minmax(238px,1fr));gap:18px}
.guven a{
  position:relative;display:flex;flex-direction:column;
  padding:26px 24px 24px;background:var(--kart);color:var(--murekkep);
  border:1px solid var(--cizgi);border-radius:var(--r2);
  box-shadow:0 1px 2px rgba(16,32,31,.05), 0 10px 26px rgba(16,32,31,.06);
  overflow:hidden;
  transition:transform .2s cubic-bezier(.2,.7,.3,1),box-shadow .22s,border-color .2s;
}
.guven a::before{ /* sol kenar vurgusu — üzerine gelince tam boy uzar */
  content:"";position:absolute;left:0;top:0;bottom:0;width:3px;
  background:linear-gradient(180deg,var(--marka-acik),var(--marka));
  transform:scaleY(.28);transform-origin:top;transition:transform .26s ease;
}
.guven a:hover{
  transform:translateY(-5px);border-color:var(--marka-acik);color:var(--murekkep);
  box-shadow:0 4px 10px rgba(16,32,31,.07), 0 22px 46px rgba(16,32,31,.14);
}
.guven a:hover::before{transform:scaleY(1)}
.guven b{
  display:block;font-family:"Manrope",sans-serif;font-size:18px;font-weight:800;
  line-height:1.25;margin-bottom:7px;
}
.guven span{color:var(--yumusak);font-size:15px;line-height:1.55;display:block}
/* margin-top:auto → açıklama 1 satır da olsa 2 satır da olsa
   bağlantılar aynı hizada durur */
.guven .git{
  margin-top:auto;padding-top:16px;font-family:"Manrope",sans-serif;font-weight:700;font-size:14.5px;
  color:var(--marka);display:inline-flex;align-items:center;gap:7px;transition:gap .2s;
}
.guven a:hover .git{gap:12px}

/* ---------- IZGARA ---------- */
.izgara{display:grid;gap:22px}
.iz-2{grid-template-columns:repeat(auto-fit,minmax(320px,1fr))}
.iz-3{grid-template-columns:repeat(auto-fit,minmax(285px,1fr))}
.iz-4{grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}

/* ---------- KART — belirgin ---------- */
.kart{
  position:relative;background:var(--kart);
  border:1px solid var(--cizgi);border-radius:var(--r2);
  box-shadow:0 1px 2px rgba(16,32,31,.05), 0 10px 28px rgba(16,32,31,.07);
  overflow:hidden;display:flex;flex-direction:column;
  transition:transform .2s cubic-bezier(.2,.7,.3,1),box-shadow .24s,border-color .2s;
}
/* üst kenarda marka çizgisi — hover'da beliriyor */
.kart::before{
  content:"";position:absolute;top:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg,var(--marka),var(--marka-acik));
  transform:scaleX(0);transform-origin:left;transition:transform .26s ease;
}
.kart:hover{
  transform:translateY(-5px);
  box-shadow:0 4px 10px rgba(16,32,31,.07), 0 22px 48px rgba(16,32,31,.14);
  border-color:var(--marka-acik);
}
.kart:hover::before{transform:scaleX(1)}
.kart img{aspect-ratio:16/10;object-fit:cover;width:100%;transition:transform .4s ease}
.kart:hover img{transform:scale(1.04)}
.kart > a img,.kart .resim{overflow:hidden}
.kart-govde{padding:24px 26px;display:flex;flex-direction:column;gap:10px;flex:1}
.kart h3{font-size:19.5px}
.kart p{color:var(--yumusak);font-size:16px;margin:0}
.kart .devam{
  margin-top:auto;padding-top:14px;font-weight:700;font-size:15px;
  font-family:"Manrope",sans-serif;color:var(--marka);
  display:inline-flex;align-items:center;gap:7px;transition:gap .2s;
}
.kart:hover .devam{gap:12px}

/* hizmet kartı — görselsiz, ikonlu, daha belirgin */
.kart-hizmet{padding:28px 26px 26px}
.kart-hizmet .ikon{
  width:52px;height:52px;border-radius:14px;
  background:linear-gradient(140deg,var(--marka-sis),#dff0f1);
  border:1px solid rgba(15,122,128,.14);
  display:grid;place-items:center;color:var(--marka);font-size:23px;margin-bottom:17px;
  transition:background .24s,color .24s,transform .24s;
}
.kart-hizmet:hover .ikon{
  background:linear-gradient(140deg,var(--marka),var(--marka-acik));
  color:#fff;transform:scale(1.06);border-color:transparent;
}

/* ---------- ÖNE ÇIKAN TEDAVİ (diz / kalça protezi) ----------
   Bu iki sayfa sitenin en değerli ticari hedefi:
   "diz protezi ameliyatı" 12.241 gösterim · "kalça protezi" 3.682.
   Ana sayfadan verilen bağlantı en güçlü iç bağlantıdır; bu yüzden
   liste içinde kaybolmak yerine kendi bölümlerini alıyorlar. */
/* GÖRSELSİZ kurgu. Önceki iki denemede görseller sorundu: biri gerçek
   klinik fotoğrafı, diğeri mavi 3B çizim — yan yana iki ayrı siteden
   gelmiş gibi duruyordu ve her oranda kötü kırpılıyordu. Bölümün gücü
   artık tipografi ve koyu marka zemininden geliyor. */
.protez-serit{
  background:
    radial-gradient(1000px 460px at 15% -10%, rgba(43,170,177,.30), transparent 62%),
    radial-gradient(760px 420px at 92% 108%, rgba(43,170,177,.20), transparent 60%),
    linear-gradient(160deg, #0a5257 0%, #073c40 100%);
  color:#eaf5f5;
}
.protez-serit h2{color:#fff}
.protez-serit .ust-etiket{color:#7fd4d8}
.protez-serit .giris{color:#b9d5d5;max-width:60ch;margin:0 0 40px}

.one-cikan{display:grid;grid-template-columns:repeat(auto-fit,minmax(330px,1fr));gap:22px}
.oc{
  position:relative;display:flex;flex-direction:column;gap:13px;
  padding:34px 32px 30px;
  background:rgba(255,255,255,.055);
  border:1px solid rgba(255,255,255,.14);
  border-radius:var(--r3);
  transition:transform .22s cubic-bezier(.2,.7,.3,1),background .22s,border-color .22s;
}
.oc::before{ /* üst kenarda ince vurgu — kartı zeminden ayırır */
  content:"";position:absolute;left:32px;right:32px;top:-1px;height:2px;border-radius:2px;
  background:linear-gradient(90deg,var(--marka-acik),rgba(43,170,177,0));
}
.oc:hover{transform:translateY(-5px);background:rgba(255,255,255,.10);
  border-color:rgba(127,212,216,.5)}

.oc .etiket{
  align-self:flex-start;color:#0a5257;background:#7fd4d8;
  font-family:"Manrope",sans-serif;font-size:11px;font-weight:800;letter-spacing:.12em;
  text-transform:uppercase;padding:5px 11px;border-radius:99px;
}
.oc h3{color:#fff;font-size:clamp(23px,2.5vw,29px);line-height:1.18;margin:0}
.oc p{color:#b9d5d5;font-size:16px;line-height:1.6;margin:0}
.oc ul{list-style:none;padding:0;margin:6px 0 0;display:flex;flex-direction:column;gap:9px}
.oc ul li{
  display:flex;align-items:flex-start;gap:10px;color:#dcecec;
  font-size:15.5px;line-height:1.5;
}
.oc ul li::before{
  content:"";width:7px;height:7px;border-radius:50%;flex:none;margin-top:8px;
  background:#7fd4d8;
}
.oc .devam{
  margin-top:auto;padding-top:24px;font-family:"Manrope",sans-serif;font-weight:700;
  font-size:15.5px;color:#7fd4d8;display:inline-flex;align-items:center;gap:8px;
  transition:gap .2s,color .2s;
}
.oc:hover .devam{gap:14px;color:#fff}

/* Alt satır: yüksek hacimli yan sayfalara hızlı geçiş */
.protez-yan{
  display:flex;flex-wrap:wrap;gap:10px;margin-top:26px;
  padding-top:24px;border-top:1px solid rgba(255,255,255,.14);
}
.protez-yan span{
  color:#8fb3b3;font-size:14.5px;align-self:center;margin-right:6px;
  font-family:"Manrope",sans-serif;font-weight:700;
}
.protez-yan a{
  color:#eaf5f5;font-size:15px;padding:9px 16px;border-radius:99px;
  border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.04);
  transition:background .18s,border-color .18s,color .18s;
}
.protez-yan a:hover{background:#7fd4d8;border-color:#7fd4d8;color:#0a5257}
@media (max-width:560px){ .oc{padding:26px 22px 24px} .oc::before{left:22px;right:22px} }

/* ---------- TEDAVİ LİSTESİ (uzun sayfa için) ---------- */
.tedavi{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px}
.tedavi a{
  display:flex;align-items:center;gap:13px;padding:16px 18px;background:#fff;
  border:1px solid var(--cizgi);border-radius:var(--r1);color:var(--murekkep);
  font-weight:600;font-size:16px;transition:border-color .18s,transform .18s,box-shadow .2s;
}
.tedavi a::before{
  content:"";width:7px;height:7px;border-radius:50%;background:var(--marka-acik);flex:none;
}
.tedavi a:hover{border-color:var(--marka);transform:translateX(3px);
  box-shadow:0 4px 16px rgba(16,32,31,.08);color:var(--marka-koyu)}

/* ---------- SÜREÇ ADIMLARI ---------- */
.adimlar{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:24px;counter-reset:a}
.adimlar > div{counter-increment:a;position:relative;padding-top:12px}
.adimlar > div::before{
  content:counter(a);display:grid;place-items:center;width:42px;height:42px;border-radius:12px;
  background:var(--marka);color:#fff;font-family:"Manrope",sans-serif;font-weight:800;font-size:18px;
  margin-bottom:15px;
}
.adimlar h3{font-size:18.5px;margin-bottom:7px}
.adimlar p{color:var(--yumusak);font-size:16px;margin:0}

/* ---------- DOKTOR TANITIM ---------- */
.tanitim{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(28px,5vw,60px);align-items:center}
.tanitim img{border-radius:var(--r3);box-shadow:var(--g2)}
/* Hakkında sayfasında özgeçmiş uzun; ortalanan görsel sayfanın ortasına
   düşüp metnin başıyla hizasını kaybediyordu. Yapışkan ve üstte. */
.tanitim.uzun{align-items:start}
.tanitim.uzun img{position:sticky;top:96px}
@media (max-width:900px){ .tanitim.uzun img{position:static} }
.tanitim .metin p{color:var(--yumusak)}

/* ---------- İSTATİSTİK ---------- */
.sayilar{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:1px;
  background:var(--cizgi);border:1px solid var(--cizgi);border-radius:var(--r2);overflow:hidden}
.sayilar div{background:#fff;padding:24px 20px;text-align:center}
.sayilar b{display:block;font-family:"Manrope",sans-serif;font-size:33px;font-weight:800;
  color:var(--marka);line-height:1;margin-bottom:7px;font-variant-numeric:tabular-nums}
.sayilar span{color:var(--yumusak);font-size:14.5px}

/* ---------- ÇAĞRI ---------- */
.cagri{background:var(--marka-koyu);color:#fff;border-radius:var(--r3);padding:clamp(34px,5vw,56px)}
.cagri h2{color:#fff;margin-bottom:12px}
.cagri p{color:#cfe6e7;margin-bottom:24px;max-width:58ch}
.cagri .eylemler{display:flex;gap:13px;flex-wrap:wrap}

/* ---------- İÇERİK (blog/hizmet metni) ---------- */
.icerik{max-width:var(--olcu)}
.icerik h2{margin:1.9em 0 .55em}
.icerik h3{margin:1.5em 0 .45em}
.icerik p{color:var(--yumusak)}
.icerik ul,.icerik ol{padding-left:1.2em;color:var(--yumusak)}
.icerik li{margin-bottom:.5em}
.icerik li::marker{color:var(--marka-acik)}
.icerik a{font-weight:600;text-decoration:underline;text-underline-offset:3px}
.icerik img{border-radius:var(--r2);margin:1.5em 0}
.icerik table{width:100%;border-collapse:collapse;margin:1.5em 0;font-size:16px;
  border:1px solid var(--cizgi);border-radius:var(--r1);overflow:hidden}
.icerik th{background:var(--zemin-alt);text-align:left;padding:.75em .95em;font-weight:700}
.icerik td{padding:.75em .95em;border-top:1px solid var(--cizgi)}
.icerik blockquote{margin:1.5em 0;padding:16px 22px;background:var(--marka-sis);
  border-left:3px solid var(--marka-acik);border-radius:0 var(--r1) var(--r1) 0;color:var(--murekkep)}

/* ---------- SSS ---------- */
.sss{border:1px solid var(--cizgi);border-radius:var(--r2);overflow:hidden;background:#fff}
.sss details{border-bottom:1px solid var(--cizgi)}
.sss details:last-child{border-bottom:none}
.sss summary{
  padding:17px 22px;cursor:pointer;font-family:"Manrope",sans-serif;font-weight:700;
  font-size:16.5px;list-style:none;display:flex;align-items:center;gap:12px;
}
.sss summary::-webkit-details-marker{display:none}
.sss summary::after{content:"+";margin-left:auto;color:var(--marka);font-size:21px;font-weight:400;flex:none}
.sss details[open] summary::after{content:"−"}
.sss summary:hover{background:var(--marka-sis)}
.sss .cevap{padding:0 22px 19px;color:var(--yumusak)}

/* ---------- SAYFA BAŞLIĞI ---------- */
.sayfa-basi{background:var(--zemin-alt);border-bottom:1px solid var(--cizgi);padding:clamp(34px,5vw,58px) 0}
.sayfa-basi h1{margin-bottom:10px}
.kirinti{font-size:14.5px;color:var(--sonuk);display:flex;gap:9px;flex-wrap:wrap}
.kirinti a{color:var(--sonuk)}
.kirinti a:hover{color:var(--marka)}

/* ---------- ALT BİLGİ ---------- */
/* ---------- HİZMET BÖLGELERİ ŞERİDİ (alt bilgi üstü) ---------- */
/* Alt bilginin bir tonu açığı: 47 bağlantı koyu zeminde ayrı bir blok
   olarak duruyor, asıl alt bilgiyi bastırmıyor. */
.bolge-serit{background:#0c1a19;color:#8fa5a4;padding:clamp(34px,4.5vw,52px) 0;
  border-top:1px solid rgba(255,255,255,.06)}
.bolge-serit h4{
  color:#dbe9e8;font-family:"Manrope",sans-serif;font-size:15.5px;font-weight:700;
  margin:0 0 24px;
}
.bolge-izgara{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:30px}
.bolge-baslik{
  display:block;font-family:"Manrope",sans-serif;font-size:12px;font-weight:800;
  letter-spacing:.11em;text-transform:uppercase;color:#5f7d7c;margin-bottom:12px;
}
.bolge-liste{display:flex;flex-wrap:wrap;gap:5px 0}
.bolge-liste a{
  color:#8fa5a4;font-size:14px;line-height:1.4;padding:3px 9px 3px 0;
  position:relative;transition:color .15s;
}
/* İnce ayraç — madde işareti yerine, kalabalık görünmesin */
.bolge-liste a:not(:last-child)::after{
  content:"·";position:absolute;right:2px;color:#3d5251;
}
.bolge-liste a:hover{color:#fff}
.bolge-liste a.one{color:#7fd4d8;font-weight:700}      /* Ataşehir — muayenehane burada */
.bolge-liste a.tumu{color:#7fd4d8;font-weight:700;width:100%;padding-top:10px}
.bolge-liste a.tumu::after{content:none}
@media (max-width:560px){ .bolge-serit{padding:30px 0} .bolge-izgara{gap:24px} }

.alt{background:var(--murekkep);color:#9fb3b2;padding:clamp(44px,6vw,72px) 0 0;font-size:15.5px}
.alt h4{color:#fff;font-size:16px;font-weight:700;margin-bottom:15px;font-family:"Manrope",sans-serif}
.alt a{color:#9fb3b2;display:block;padding:4px 0}
.alt a:hover{color:#fff}
.alt .izgara{gap:34px}
.alt .telif{margin-top:44px;border-top:1px solid rgba(255,255,255,.09);padding:20px 0;
  font-size:14px;display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap}

/* ---------- YÜZEN İLETİŞİM ---------- */
.yuzen{position:fixed;right:18px;bottom:18px;z-index:70;display:flex;flex-direction:column;gap:11px}
.yuzen a{width:54px;height:54px;border-radius:50%;display:grid;place-items:center;
  color:#fff;font-size:23px;box-shadow:0 5px 18px rgba(16,32,31,.24);transition:transform .15s}
.yuzen a:hover{transform:scale(1.07);color:#fff}
.yuzen .wa{background:#25d366}
.yuzen .tel{background:var(--marka)}

/* ---------- MOBİL ---------- */
@media (max-width:980px){
  .hero-satir{grid-template-columns:1fr;gap:34px}
  .slayt-kutu{max-width:560px;margin:0 auto;width:100%}
  .hero-ic{max-width:none}
}
@media (max-width:900px){
  .tanitim{grid-template-columns:1fr}
  /* min(...) şart: düz `max-width:460px`, temeldeki img{max-width:100%}
     kuralını eziyordu. 390px'lik telefonda görsel 460px kalıyor, sayfa
     yana kayıyor ve sağda 92px boş şerit oluşuyordu. */
  .tanitim img{max-width:min(460px,100%);margin:0 auto}
}
@media (max-width:768px){
  body{font-size:16.5px}
  .tepe{display:none}
  .baslik-cubugu .kapsa{height:66px;gap:14px}
  .menu-buton{display:block}
  /* Mobilde: logo · dil · ☰ — anahtar açılır menünün içine gömülmez.
     Üçü 390px'e sığsın diye logo ve anahtar küçülür, yoksa ☰ ekran
     dışına taşıyordu. */
  .baslik-cubugu .dil{order:0;margin-left:10px}
  .baslik-cubugu .menu{order:0}
  .logo{min-width:0}
  .logo img{max-height:40px}
  .dil-kure{display:none}
  .dil{padding:2px;gap:0}
  .dil .secili,.dil a{font-size:12px;padding:6px 10px}
  .menu-buton{padding:8px 12px}
  .menu{
    display:none;position:absolute;top:100%;left:0;right:0;background:#fff;
    flex-direction:column;align-items:stretch;gap:2px;padding:12px;
    border-bottom:1px solid var(--cizgi);box-shadow:var(--g2);max-height:78vh;overflow:auto;
  }
  .menu.acik{display:flex}
  .menu > a{padding:12px 14px}
  /* Masaüstünde açılır menü hover ile görünür oluyor; mobilde hover yok.
     opacity/visibility sıfırlanmayınca alt bağlantılar yer kaplıyor ama
     GÖRÜNMÜYORDU — menüde koca bir boşluk kalıyordu. */
  .alt-menu > .liste{position:static;display:block;box-shadow:none;border:none;
    padding:0 0 0 14px;min-width:0;
    opacity:1;visibility:visible;transform:none;transition:none}
  .alt-menu > .liste::before{display:none}   /* ok yalnızca masaüstünde anlamlı */
  .alt-menu > a::after{display:none}
  .hero p{font-size:17.5px}
  .hero .eylemler .btn,.cagri .eylemler .btn{flex:1 1 100%}
  .bolum{padding:44px 0}
  .yuzen a{width:50px;height:50px;font-size:21px}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;transition-duration:.001ms!important}
  .kart:hover,.btn:hover,.yuzen a:hover{transform:none}
}


/* ---------- SAYFA İÇİ KISAYOL ---------- */
.kisayol{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:36px;
  padding:16px 20px;background:var(--marka-sis);border-radius:var(--r2);
  border:1px solid #d8ebeb}
.kisayol > span{font-family:"Manrope",sans-serif;font-weight:700;font-size:14px;
  color:var(--marka-koyu);margin-right:4px}
.kisayol a{font-size:14.5px;color:var(--marka);padding:5px 12px;border-radius:99px;
  background:#fff;border:1px solid #cfe6e6;transition:background .16s,color .16s,border-color .16s}
.kisayol a:hover{background:var(--marka);border-color:var(--marka);color:#fff}
.kisayol a:hover strong{color:#fff}
.kisayol strong{color:var(--marka-koyu)}

/* ---------- HEKİM KÜNYESİ ---------- */
/* Tıbbi içerikte "bunu kim yazdı" sorusunun cevabı ekranda da
   görünmeli; şema tek başına yetmiyor. */
.kunye-ust{
  display:flex;flex-wrap:wrap;align-items:center;gap:8px;
  font-size:14.5px;color:var(--yumusak);margin:0 0 24px;
  padding-bottom:16px;border-bottom:1px solid var(--cizgi);
}
.kunye-ust .etiket{
  font-family:"Manrope",sans-serif;font-size:11.5px;font-weight:800;letter-spacing:.1em;
  text-transform:uppercase;color:var(--sonuk);
}
.kunye-ust a{font-family:"Manrope",sans-serif;font-weight:700;color:var(--marka)}
.kunye-ust .ayrac{color:var(--cizgi-koyu)}

.kunye{
  margin:44px 0 0;padding:26px 28px;border-radius:var(--r2);
  background:var(--marka-sis);border:1px solid #d8ebeb;
}
.kunye-ic{display:flex;gap:24px;align-items:flex-start;justify-content:space-between}
.kunye .etiket{
  display:block;font-family:"Manrope",sans-serif;font-size:11.5px;font-weight:800;
  letter-spacing:.11em;text-transform:uppercase;color:var(--marka);margin-bottom:8px;
}
.kunye h3{font-size:21px;margin:0 0 4px}
.kunye h3 a{color:var(--murekkep)}
.kunye h3 a:hover{color:var(--marka)}
.kunye .unvan{font-size:15px;color:var(--marka-koyu);font-weight:600;margin:0 0 12px}
.kunye .ozet{font-size:15.5px;line-height:1.6;color:var(--yumusak);margin:0 0 16px;max-width:70ch}
.kunye-baglanti{display:flex;flex-wrap:wrap;gap:10px}
.kunye-baglanti a{
  font-family:"Manrope",sans-serif;font-weight:700;font-size:14.5px;
  padding:8px 16px;border-radius:99px;background:#fff;border:1px solid #cfe6e6;color:var(--marka);
  transition:background .16s,color .16s,border-color .16s;
}
.kunye-baglanti a:hover{background:var(--marka);border-color:var(--marka);color:#fff}
.kunye-gorsel{flex:none;max-width:150px;opacity:.85}
.kunye-uyari{
  margin:18px 0 0;padding-top:14px;border-top:1px solid #d3e7e7;
  font-size:13.5px;line-height:1.55;color:var(--sonuk);
}
@media (max-width:640px){
  .kunye{padding:22px 20px}
  .kunye-ic{flex-direction:column;gap:16px}
  .kunye-gorsel{order:-1}
}

/* ---------- SOSYAL MEDYA SİMGELERİ ---------- */
.sosyal{display:flex;gap:9px;flex-wrap:wrap;margin-top:16px}
.sosyal a{
  display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;
  border-radius:50%;color:#bcd3d3;background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.14);
  transition:background .18s,color .18s,transform .18s,border-color .18s;
}
.sosyal a:hover{background:var(--marka-acik);border-color:var(--marka-acik);
  color:#04282b;transform:translateY(-2px)}
.sosyal a:focus-visible{outline:2.5px solid #7fd4d8;outline-offset:2px}

/* Üst çubuktaki küçük sürüm — yalnızca masaüstü (üst çubuk mobilde gizli) */
.tepe .sosyal{margin:0 0 0 4px;gap:2px}
.tepe .sosyal a{
  width:28px;height:28px;background:none;border:none;color:#9dc3c4;
}
.tepe .sosyal a:hover{background:rgba(255,255,255,.12);color:#fff;transform:none}
.tepe .sosyal svg{width:16px;height:16px}

/* ---------- SAYFA BAŞLIK BANDI + KIRINTI YOLU ---------- */
.sayfa-bant{
  background:
    radial-gradient(760px 340px at 12% -20%, rgba(43,170,177,.26), transparent 62%),
    linear-gradient(160deg, #0a5257 0%, #073c40 100%);
  color:#eaf5f5;padding:clamp(34px,5vw,58px) 0 clamp(30px,4.4vw,50px);
}
.sayfa-bant h1{color:#fff;font-size:clamp(27px,3.9vw,44px);margin:0}
.sayfa-bant .bant-alt{color:#b9d5d5;font-size:17px;line-height:1.6;margin:12px 0 0;max-width:66ch}
.kirinti{
  display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-bottom:14px;
  font-size:14px;color:#8fb3b3;
}
.kirinti a{color:#a8d0d1}
.kirinti a:hover{color:#fff}
.kirinti .simdiki{color:#e2f0f0}

/* ---------- İÇERİK METNİ (blog / hizmet detay) ---------- */
.yazi{max-width:74ch}
.yazi h2{font-size:clamp(22px,2.7vw,30px);margin:38px 0 14px}
.yazi h3{font-size:clamp(19px,2.2vw,23px);margin:28px 0 10px}
.yazi h2:first-child,.yazi h3:first-child{margin-top:0}
.yazi p{margin:0 0 1.05em;color:#33403f}
.yazi ul,.yazi ol{margin:0 0 1.15em;padding-left:1.3em;color:#33403f}
.yazi li{margin-bottom:.45em}
.yazi img{border-radius:var(--r2);margin:22px 0}
.yazi a{text-decoration:underline;text-underline-offset:3px}
.yazi blockquote{
  margin:26px 0;padding:16px 22px;border-left:3px solid var(--marka-acik);
  background:var(--marka-sis);border-radius:0 var(--r1) var(--r1) 0;color:var(--yumusak);
}
.yazi table{width:100%;border-collapse:collapse;margin:22px 0;font-size:16px}
.yazi th,.yazi td{border:1px solid var(--cizgi);padding:10px 12px;text-align:left}
.yazi th{background:var(--zemin-alt);font-family:"Manrope",sans-serif;font-weight:700}
/* Geniş içerik sayfayı yana kaydırmasın */
.yazi-kaydir{overflow-x:auto}

/* Yazı + yan sütun */
.iki-sutun{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:44px;align-items:start}
.yan-kutu{
  position:sticky;top:96px;background:var(--kart);border:1px solid var(--cizgi);
  border-radius:var(--r2);padding:22px;box-shadow:var(--g1);
}
.yan-kutu h4{font-family:"Manrope",sans-serif;font-size:16px;font-weight:800;margin:0 0 12px}
.yan-kutu + .yan-kutu{margin-top:18px}
.yan-liste{display:flex;flex-direction:column;gap:2px}
.yan-liste a{
  padding:9px 12px;border-radius:var(--r1);color:var(--yumusak);font-size:15.5px;
  line-height:1.4;transition:background .16s,color .16s;
}
.yan-liste a:hover{background:var(--marka-sis);color:var(--marka-koyu)}
.yan-liste a.aktif{background:var(--marka);color:#fff}
@media (max-width:900px){
  .iki-sutun{grid-template-columns:1fr;gap:32px}
  .yan-kutu{position:static}
}

/* ---------- SAYFALAMA ---------- */
.sayfalama{display:flex;flex-wrap:wrap;gap:8px;margin-top:38px;align-items:center}
.sayfalama a,.sayfalama span{
  min-width:42px;height:42px;display:inline-flex;align-items:center;justify-content:center;
  padding:0 12px;border-radius:var(--r1);border:1px solid var(--cizgi-koyu);
  font-family:"Manrope",sans-serif;font-weight:700;font-size:15px;color:var(--murekkep);
  transition:border-color .16s,background .16s,color .16s;
}
.sayfalama a:hover{border-color:var(--marka);color:var(--marka)}
.sayfalama .simdiki{background:var(--marka);border-color:var(--marka);color:#fff}
.sayfalama .bosluk{border:none;min-width:0;padding:0 4px;color:var(--sonuk)}

/* ---------- GALERİ ---------- */
.galeri-izgara{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px;
}
.galeri-izgara a{
  display:block;border-radius:var(--r2);overflow:hidden;background:var(--zemin-alt);
  aspect-ratio:4/3;border:1px solid var(--cizgi);
  transition:transform .2s cubic-bezier(.2,.7,.3,1),box-shadow .22s;
}
.galeri-izgara img{width:100%;height:100%;object-fit:cover;transition:transform .4s ease}
.galeri-izgara a:hover{transform:translateY(-4px);box-shadow:var(--g2)}
.galeri-izgara a:hover img{transform:scale(1.05)}

/* Video kartı — gerçek oynatıcı yerine kapak, tıklanınca yüklenir */
.video-kart{
  position:relative;display:block;width:100%;padding:0;cursor:pointer;
  border:1px solid var(--cizgi);border-radius:var(--r2);overflow:hidden;
  background:var(--zemin-alt);aspect-ratio:16/9;
  transition:transform .2s cubic-bezier(.2,.7,.3,1),box-shadow .22s,border-color .2s;
}
.video-kart img{width:100%;height:100%;object-fit:cover;transition:transform .4s ease}
.video-kart:hover{transform:translateY(-4px);box-shadow:var(--g2);border-color:var(--marka-acik)}
.video-kart:hover img{transform:scale(1.05)}
.video-kart .oynat{
  /* 42% — başlık iki satıra taştığında oynat düğmesiyle çakışıyordu */
  position:absolute;top:42%;left:50%;transform:translate(-50%,-50%);
  width:56px;height:56px;border-radius:50%;background:rgba(10,82,87,.86);color:#fff;
  display:flex;align-items:center;justify-content:center;font-size:20px;padding-left:4px;
  transition:background .18s,transform .18s;
}
.video-kart:hover .oynat{background:var(--eylem);transform:translate(-50%,-50%) scale(1.08)}
.video-kart .video-ad{
  position:absolute;left:0;right:0;bottom:0;padding:26px 14px 12px;text-align:left;
  background:linear-gradient(to top, rgba(7,42,45,.92), rgba(7,42,45,0));
  color:#fff;font-family:"Manrope",sans-serif;font-weight:700;font-size:15px;line-height:1.35;
}
.video-kutu{border-radius:var(--r2);overflow:hidden;aspect-ratio:16/9;background:#000}
.video-kutu iframe{width:100%;height:100%;border:0;display:block}

/* Fotoğraf kartı — panelden yüklenen görseller.
   .video-ad mutlak konumlanıyor; kapsayıcı relative olmazsa başlık
   sayfanın en üstüne kaçıyor. */
.foto-kart{position:relative}
.foto-kart .video-ad{
  position:absolute;left:0;right:0;bottom:0;padding:26px 14px 12px;text-align:left;
  background:linear-gradient(to top, rgba(7,42,45,.92), rgba(7,42,45,0));
  color:#fff;font-family:"Manrope",sans-serif;font-weight:700;font-size:15px;line-height:1.35;
}

/* ---------- İLETİŞİM ---------- */
.iletisim-izgara{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px;align-items:start}
.bilgi-liste{display:flex;flex-direction:column;gap:14px;margin-bottom:26px}
/* `>` şart: seçici iç içe div'lerin İKİSİNİ birden yakalıyordu, iç div de
   flex olunca "TELEFON" etiketi ile numara yan yana diziliyordu. */
.bilgi-liste > div{
  display:flex;gap:14px;align-items:flex-start;padding:16px 18px;
  background:var(--kart);border:1px solid var(--cizgi);border-radius:var(--r2);box-shadow:var(--g1);
}
.bilgi-liste b{
  display:block;font-family:"Manrope",sans-serif;font-size:13px;font-weight:800;
  letter-spacing:.08em;text-transform:uppercase;color:var(--sonuk);margin-bottom:3px;
}
.bilgi-liste span{font-size:16.5px;line-height:1.5}
.harita{border-radius:var(--r2);overflow:hidden;border:1px solid var(--cizgi);min-height:300px}
.harita iframe{display:block;width:100%;height:100%;min-height:300px;border:0}
@media (max-width:860px){ .iletisim-izgara{grid-template-columns:1fr;gap:30px} }

/* ---------- 404 ---------- */
.bos-durum{text-align:center;padding:clamp(40px,7vw,84px) 0}
.bos-durum .kod{
  font-family:"Manrope",sans-serif;font-size:clamp(64px,12vw,132px);font-weight:800;
  line-height:1;color:var(--marka-sis);letter-spacing:-.04em;
}
.bos-durum h2{margin:-10px 0 12px}
.bos-durum p{color:var(--yumusak);max-width:52ch;margin:0 auto 26px}

/* ---------- RANDEVU MODALI ---------- */
.modal-ort{
  position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center;
  padding:20px;background:rgba(7,42,45,.62);backdrop-filter:blur(3px);
  animation:modalGir .18s ease-out;
}
.modal-ort[hidden]{display:none}
@keyframes modalGir{from{opacity:0}to{opacity:1}}
.modal-kutu{
  position:relative;width:100%;max-width:470px;max-height:92vh;overflow:auto;
  background:var(--kart);border-radius:var(--r3);padding:34px 32px 28px;
  box-shadow:0 30px 80px rgba(7,42,45,.42);
  animation:modalKutu .24s cubic-bezier(.2,.7,.3,1);
}
@keyframes modalKutu{from{opacity:0;transform:translateY(18px) scale(.97)}to{opacity:1;transform:none}}
.modal-kapat{
  position:absolute;top:14px;right:14px;width:36px;height:36px;line-height:1;
  border:none;border-radius:50%;background:var(--zemin-alt);color:var(--yumusak);
  font-size:26px;cursor:pointer;transition:background .16s,color .16s;
}
.modal-kapat:hover{background:var(--marka);color:#fff}
.modal-kutu h3{font-size:26px;line-height:1.2;margin:0 0 8px}
.modal-giris{color:var(--yumusak);font-size:15.5px;line-height:1.55;margin:0 0 20px}

.alan{display:block;margin-bottom:14px}
.alan > span{
  display:block;font-family:"Manrope",sans-serif;font-size:13.5px;font-weight:700;
  color:var(--murekkep);margin-bottom:6px;
}
.alan > span b{color:var(--eylem)}
.alan input,.alan textarea{
  width:100%;font:inherit;font-size:16px;color:var(--murekkep);
  padding:12px 14px;background:var(--zemin);
  border:1.5px solid var(--cizgi-koyu);border-radius:var(--r1);
  transition:border-color .16s,box-shadow .16s,background .16s;
}
.alan textarea{resize:vertical;min-height:84px}
.alan input:focus,.alan textarea:focus{
  outline:none;background:#fff;border-color:var(--marka);
  box-shadow:0 0 0 3px rgba(15,122,128,.16);
}
.alan input::placeholder,.alan textarea::placeholder{color:var(--sonuk)}

/* Bal küpü: ekran okuyucudan ve gözden gizli, display:none DEĞİL —
   bazı botlar display:none alanları atlıyor. */
.balkupu{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

.modal-durum{font-size:15px;line-height:1.5;margin:2px 0 0;border-radius:var(--r1)}
.modal-durum.tamam,.modal-durum.hata{padding:11px 14px;margin:4px 0 12px}
.modal-durum.tamam{background:#e7f4ee;color:#1c6b45;border:1px solid #bfe3d1}
.modal-durum.hata {background:#fdece7;color:#a8371a;border:1px solid #f6cdc0}
.modal-gonder{width:100%;justify-content:center;margin-top:6px}
.modal-gonder[disabled]{opacity:.65;cursor:progress}
.modal-kvkk{font-size:13px;color:var(--sonuk);line-height:1.5;margin:14px 0 0;text-align:center}

@media (max-width:520px){
  .modal-ort{padding:0;align-items:flex-end}
  .modal-kutu{max-width:none;max-height:94vh;border-radius:var(--r3) var(--r3) 0 0;padding:28px 22px 22px}
}

/* ---------- YAZDIRMA ---------- */
@media print{
  .tepe,.baslik-cubugu,.yuzen,.alt,.cagri,.modal-ort{display:none}
  body{font-size:12pt;background:#fff}
}