/* ============================================================
   REXFORA – Site stil dosyası
   Figma "Dental Clinic Landing Page" tasarımının birebir karşılığı.
   Ölçüler 1440px tasarım genişliğine göre; iç alan 1140px.
   ============================================================ */
:root {
  --ana: #249991;
  --ana-acik: #50ada7;
  --ana-kenar: #6cbbb5;
  --ana-rozet-kenar: #a8d7e3;
  --lacivert: #1d4e89;
  --lacivert-koyu: #1a477d;
  --koyu: #0f172a;
  --metin: #334155;
  --metin-koyu: #1e293b;
  --metin-soluk: #475569;
  --kenar: #e2e8f0;
  --cizgi: #cbd5e1;
  --zemin-acik: #f8fafc;
  --zemin-cok-acik: #f1f5f9;
  --gri-gorsel: #e8e8e8;
  --turuncu-zemin: #fff7ed;
  --turuncu-kenar: #fcd5a2;
  --turuncu: #c67812;
  --kirmizi: #cf3b30;
  --golge-xs: 0 1px 2px rgba(16, 24, 40, .05);
  --golge-sm: 0 1px 3px rgba(16, 24, 40, .10), 0 1px 2px rgba(16, 24, 40, .06);
  --golge-kart: -2px 3px 8px rgba(0,0,0,.05), -9px 11px 14px rgba(0,0,0,.04), -20px 25px 19px rgba(0,0,0,.03);
  --ic: 1140px;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  font-size: 16px; line-height: 24px; color: var(--metin); background: #fff;
  -webkit-font-smoothing: antialiased;
}
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
button { font: inherit; cursor: pointer; }
h1, h2, h3, h4, p { margin: 0; }
ul { margin: 0; padding: 0; list-style: none; }
.ikon { width: 24px; height: 24px; flex: none; }
.ikon-20 { width: 20px; height: 20px; }
.ikon-16 { width: 16px; height: 16px; }
.ikon-32 { width: 32px; height: 32px; }
.ikon-40 { width: 40px; height: 40px; }

.ic { width: 100%; max-width: var(--ic); margin: 0 auto; }
.bolum { padding: 88px 150px; }
.bolum-acik { background: var(--zemin-acik); }

/* ---------- Tipografi (Figma stilleri) ---------- */
.h1 { font-size: 48px; line-height: 59px; font-weight: 600; letter-spacing: -.02em; color: var(--koyu); }
.h5 { font-size: 32px; line-height: 40px; font-weight: 600; letter-spacing: -.02em; color: var(--koyu); }
.h7 { font-size: 24px; line-height: 32px; font-weight: 500; letter-spacing: -.02em; color: var(--koyu); }
.h8 { font-size: 20px; line-height: 28px; font-weight: 600; letter-spacing: -.02em; color: var(--koyu); }
.g18 { font-size: 18px; line-height: 28px; }
.g16 { font-size: 16px; line-height: 24px; }
.g14 { font-size: 14px; line-height: 20px; }
.orta { font-weight: 500; }
.kalin { font-weight: 600; }

/* ---------- Butonlar ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  height: 40px; padding: 10px 16px; border-radius: 8px;
  background: var(--ana); border: 1px solid var(--ana); color: #fff;
  font-size: 14px; line-height: 20px; font-weight: 500; white-space: nowrap;
  transition: background .15s, border-color .15s, color .15s, transform .15s;
}
.btn:hover { background: #1f857e; border-color: #1f857e; }
.btn .ikon { width: 20px; height: 20px; }
.btn-md { height: 48px; padding: 14px 20px; gap: 8px; font-size: 16px; line-height: 24px; background: var(--ana-acik); border-color: var(--ana-kenar); }
.btn-md .ikon { width: 24px; height: 24px; }
.btn-md:hover { background: var(--ana); }
.btn-cizgi { background: #fff; border-color: var(--ana-kenar); color: var(--ana); }
.btn-cizgi:hover { background: #effaf9; border-color: var(--ana); }
.btn-blok { width: 100%; }

/* Hap (chip) buton – ekip filtresi */
.hap {
  display: inline-flex; align-items: center; height: 40px; padding: 10px 20px; border-radius: 100px;
  background: #fff; border: 1px solid var(--cizgi); color: var(--metin);
  font-size: 14px; line-height: 20px; font-weight: 500; box-shadow: var(--golge-xs);
}
.hap.aktif, .hap:hover { background: var(--ana); border-color: var(--ana); color: #fff; }

/* ---------- Bölüm etiketleri ---------- */
.etiket { display: inline-flex; align-items: center; gap: 8px; color: var(--ana); font-size: 16px; line-height: 24px; font-weight: 500; }
.etiket::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: var(--ana); }
.etiket-rozet { height: 40px; padding: 0 20px; border-radius: 100px; background: #fff; border: 1px solid var(--ana-rozet-kenar); box-shadow: var(--golge-sm); }
.bolum-baslik { display: flex; align-items: center; gap: 24px; margin-bottom: 40px; }
.bolum-baslik .cizgi { flex: 1; height: 1px; background: var(--cizgi); }
.bolum-baslik .h5 { width: 461px; flex: none; }
.bolum-baslik-orta { display: flex; flex-direction: column; align-items: center; gap: 12px; text-align: center; margin-bottom: 40px; }

/* ---------- Üst bar ---------- */
.ustbar { background: var(--ana); color: #fff; height: 56px; padding: 12px 150px; display: flex; align-items: center; justify-content: space-between; }
.ustbar-bilgi { display: flex; align-items: center; gap: 12px; font-size: 14px; line-height: 20px; font-weight: 500; }
.ustbar-bilgi a, .ustbar-bilgi span { display: inline-flex; align-items: center; gap: 4px; }
.ustbar-bilgi .ayrac { width: 1px; height: 24px; background: rgba(255,255,255,.4); }
.sosyal { display: flex; gap: 8px; }
.sosyal a { width: 32px; height: 32px; border-radius: 50%; background: var(--ana-acik); display: inline-flex; align-items: center; justify-content: center; color: #fff; }
.sosyal a:hover { background: #fff; color: var(--ana); }
.sosyal .ikon { width: 18px; height: 18px; }

/* ---------- Menü ---------- */
.menu { background: #fff; border-bottom: 1px solid var(--kenar); box-shadow: var(--golge-xs); position: sticky; top: 0; z-index: 50; }
.menu-ic { height: 72px; padding: 16px 150px; display: flex; align-items: center; justify-content: space-between; gap: 32px; }
.logo { display: inline-flex; align-items: center; gap: 2px; color: var(--koyu); }
.logo .ikon { width: 40px; height: 40px; color: var(--ana); }
.logo img { height: 40px; width: auto; }
.logo-yazi { font-family: 'Anek Bangla', 'Inter', sans-serif; font-size: 27.5px; line-height: 1; font-weight: 500; letter-spacing: -.04em; }
.menu-baglanti { display: flex; align-items: center; gap: 32px; }
.menu-baglanti > a, .menu-baglanti .acilir > a { font-size: 16px; line-height: 24px; font-weight: 500; color: var(--koyu); display: inline-flex; align-items: center; gap: 4px; }
.menu-baglanti > a.aktif, .menu-baglanti > a:hover, .menu-baglanti .acilir:hover > a { color: var(--ana); }
.acilir { position: relative; }
.acilir .ikon { width: 20px; height: 20px; }
.acilir-kutu { position: absolute; top: calc(100% + 12px); left: -16px; min-width: 240px; background: #fff; border: 1px solid var(--kenar); border-radius: 12px; box-shadow: var(--golge-sm); padding: 8px; opacity: 0; visibility: hidden; transform: translateY(6px); transition: .15s; }
.acilir:hover .acilir-kutu, .acilir:focus-within .acilir-kutu { opacity: 1; visibility: visible; transform: none; }
.acilir-kutu a { display: block; padding: 10px 12px; border-radius: 8px; font-size: 14px; line-height: 20px; font-weight: 500; color: var(--metin); }
.acilir-kutu a:hover { background: var(--zemin-acik); color: var(--ana); }
.menu-ac { display: none; width: 40px; height: 40px; border: 1px solid var(--kenar); border-radius: 8px; background: #fff; color: var(--koyu); align-items: center; justify-content: center; }

/* ---------- Hero ---------- */
.hero { position: relative; overflow: hidden; background: linear-gradient(180deg, #fff 0%, #f3f3f3 100%); padding: 88px 150px; min-height: 642px; }
.hero-dalga { position: absolute; inset: 0; pointer-events: none; opacity: .5; }
.hero-ic { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 40px; }
.hero-metin { width: 480px; flex: none; display: flex; flex-direction: column; gap: 48px; }
.hero-metin .ust { display: flex; flex-direction: column; gap: 24px; }
.rozet-turuncu { display: inline-flex; align-items: center; height: 40px; padding: 0 20px; border-radius: 100px; background: var(--turuncu-zemin); border: 1px solid var(--turuncu-kenar); color: var(--turuncu); font-size: 18px; line-height: 28px; font-weight: 500; align-self: flex-start; }
.hero-metin .h1 { white-space: pre-line; }
.hero-metin .aciklama { font-size: 18px; line-height: 28px; color: var(--metin); max-width: 462px; margin-top: 16px; }
.hero-gorsel { position: relative; width: 416px; height: 466px; flex: none; }
.hero-kart { position: absolute; right: 0; top: 35px; width: 278px; height: 400px; border-radius: 24px 24px 24px 24px; overflow: hidden; background: linear-gradient(165deg, #f4f8f8 0%, #dfeeec 45%, #5fb3ad 80%, var(--lacivert) 100%); }
.hero-kart::before { content: ''; position: absolute; right: -1px; top: -1px; width: 72px; height: 72px; background: #fff; border-radius: 0 0 0 24px; }
.hero-kart img { width: 100%; height: 100%; object-fit: cover; object-position: top; }
.hero-kart .bos { width: 100%; height: 100%; display: flex; align-items: flex-end; justify-content: center; }
.hero-kart .bos svg { width: 70%; height: auto; color: rgba(255,255,255,.6); }
.hero-yay { position: absolute; left: -45px; top: 69px; width: 488px; height: 255px; pointer-events: none; }
.hero-dis { position: absolute; left: -46px; top: 135px; width: 75px; height: 75px; filter: drop-shadow(-1px 2px 5px rgba(0,0,0,.08)); }
.ist-kart { position: absolute; display: flex; align-items: center; gap: 12px; padding: 12px 16px; background: #fff; border-radius: 12px; box-shadow: var(--golge-kart); }
.ist-kart .ikon { width: 32px; height: 32px; }
.ist-kart .ikon-turuncu { color: #f59e0b; }
.ist-kart .ikon-ana { color: var(--ana); }
.ist-kart b { display: block; font-size: 20px; line-height: 28px; font-weight: 600; letter-spacing: -.02em; color: var(--koyu); }
.ist-kart span { font-size: 16px; line-height: 24px; color: var(--metin-soluk); }
.ist-hasta { left: -66px; top: 339px; }
.ist-uzman { right: -70px; top: 251px; }

/* ---------- Sigorta / partner ---------- */
.partner { padding: 40px 150px; }
.partner-ic { display: flex; flex-direction: column; align-items: center; gap: 24px; }
.partner-baslik { font-size: 18px; line-height: 28px; font-weight: 500; color: var(--metin-soluk); }
.partner-logolar { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 56px; }
.partner-logolar img { height: 48px; width: auto; max-width: 223px; object-fit: contain; filter: grayscale(0); }
.partner-logolar .logo-yazi-yedek { height: 48px; display: flex; align-items: center; font-size: 22px; font-weight: 700; color: var(--metin-soluk); letter-spacing: -.02em; }

/* ---------- Hakkımızda ---------- */
.hakkimizda { padding: 96px 134px; }
.hakkimizda-ic { display: flex; align-items: center; gap: 69px; }
.hakkimizda-metin { width: 558px; flex: none; display: flex; flex-direction: column; gap: 32px; }
.hakkimizda-metin .ust { display: flex; flex-direction: column; gap: 12px; }
.hakkimizda-metin .h5 { margin-top: 0; white-space: pre-line; }
.hakkimizda-metin .metin { max-width: 493px; color: var(--metin); }
.ozellikler { display: flex; flex-wrap: wrap; gap: 16px; }
.ozellik { display: inline-flex; align-items: center; gap: 8px; height: 48px; padding: 12px 16px; border-radius: 12px; background: #fff; border: 1px solid var(--kenar); box-shadow: var(--golge-xs); font-size: 14px; line-height: 20px; font-weight: 500; color: var(--koyu); }
.ozellik .ikon { color: var(--ana); }
.hakkimizda-gorsel { position: relative; width: 544px; height: 415px; flex: none; }
.hakkimizda-gorsel img, .hakkimizda-gorsel .bos { width: 100%; height: 100%; border-radius: 12px; object-fit: cover; background: var(--gri-gorsel); }
.oynat { position: absolute; left: -32px; top: 57px; width: 64px; height: 64px; border-radius: 50%; background: #fff; border: 8px solid var(--zemin-cok-acik); display: flex; align-items: center; justify-content: center; color: var(--ana); box-sizing: content-box; width: 48px; height: 48px; }
.oynat:hover { background: var(--ana); color: #fff; }

/* ---------- Hizmetler ---------- */
.hizmetler-izgara { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.hizmet-kart { display: flex; flex-direction: column; gap: 24px; min-height: 208px; padding: 24px; background: #fff; border: 1px solid var(--kenar); border-radius: 12px; box-shadow: var(--golge-xs); transition: transform .2s, box-shadow .2s; }
.hizmet-kart:hover { transform: translateY(-3px); box-shadow: var(--golge-sm); }
.hizmet-kart .ust { display: flex; align-items: center; justify-content: space-between; }
.hizmet-kart .simge { width: 56px; height: 56px; border-radius: 8px; background: var(--gri-gorsel); display: flex; align-items: center; justify-content: center; overflow: hidden; }
.hizmet-kart .simge img { width: 56px; height: 56px; object-fit: contain; }
.hizmet-kart .simge.resimli { background: transparent; border-radius: 0; }
.hizmet-kart .simge .ikon { width: 32px; height: 32px; color: var(--ana); }
.hizmet-kart .simge.renkli { background: #effaf9; }
.hizmet-kart .no { font-size: 36px; line-height: 44px; font-weight: 600; letter-spacing: -.02em; color: var(--kenar); }
.hizmet-kart h3 { font-size: 18px; line-height: 28px; font-weight: 600; color: var(--koyu); margin-bottom: 4px; }
.hizmet-kart p { font-size: 16px; line-height: 24px; color: var(--metin); }

/* ---------- Ekip ---------- */
.filtreler { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin-bottom: 24px; }
.ekip-kaydirak { position: relative; }
.ekip-izgara { display: flex; gap: 16px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; padding-bottom: 2px; }
.ekip-izgara::-webkit-scrollbar { display: none; }
.doktor-kart { width: 251px; flex: none; scroll-snap-align: start; background: #fff; border: 1px solid var(--kenar); border-radius: 12px; box-shadow: var(--golge-xs); overflow: hidden; }
.doktor-kart .foto { padding: 8px; }
.doktor-kart .foto img, .doktor-kart .foto .bos { width: 235px; height: 232px; border-radius: 8px; object-fit: cover; object-position: top; background: var(--gri-gorsel); display: flex; align-items: center; justify-content: center; color: #cbd5e1; }
.doktor-kart .foto .bos .ikon { width: 96px; height: 96px; }
.doktor-kart .bilgi { padding: 8px 16px 16px; display: flex; flex-direction: column; gap: 8px; }
.doktor-kart .bilgi b { font-size: 16px; line-height: 24px; font-weight: 600; color: var(--koyu); }
.doktor-kart .bilgi span { font-size: 14px; line-height: 20px; font-weight: 500; color: var(--metin-soluk); }
.kaydirak-ok { display: flex; justify-content: center; gap: 12px; margin-top: 40px; }
.yuvarlak-ok { width: 48px; height: 48px; border-radius: 50%; border: 1px solid var(--kenar); background: #fff; color: var(--koyu); display: inline-flex; align-items: center; justify-content: center; }
.yuvarlak-ok.dolu { background: var(--lacivert); border-color: var(--lacivert); color: #fff; }
.yuvarlak-ok:hover { border-color: var(--lacivert); }

/* ---------- Yorumlar ---------- */
.yorum-ic { display: flex; justify-content: space-between; align-items: flex-start; gap: 60px; }
.yorum-gorsel { position: relative; width: 540px; height: 468px; flex: none; }
.yorum-gorsel .noktalar { position: absolute; left: 0; top: 18px; width: 420px; height: 440px; opacity: .25; background-image: radial-gradient(var(--ana) 1.4px, transparent 1.6px); background-size: 18px 18px; mask-image: radial-gradient(circle at 40% 50%, #000 40%, transparent 72%); -webkit-mask-image: radial-gradient(circle at 40% 50%, #000 40%, transparent 72%); }
.yorum-gorsel .daire { position: absolute; left: 246px; top: 227px; width: 231px; height: 231px; border-radius: 50%; background: linear-gradient(180deg, #42a7c3 31%, #1a477d 100%); }
.yorum-gorsel .cerceve { position: absolute; right: 0; top: 0; width: 391px; height: 468px; border-radius: 12px; overflow: hidden; }
.yorum-gorsel .cerceve img { width: 100%; height: 100%; object-fit: cover; object-position: top; }
.yorum-gorsel .cerceve .bos { width: 100%; height: 100%; display: flex; align-items: flex-end; justify-content: center; color: rgba(36,153,145,.25); }
.yorum-gorsel .cerceve .bos .ikon { width: 220px; height: 220px; margin-bottom: 40px; }
.yorum-sag { width: 463px; flex: none; display: flex; flex-direction: column; gap: 24px; }
.yorum-kart { display: none; flex-direction: column; gap: 16px; padding: 24px; background: #fff; border-radius: 8px; box-shadow: var(--golge-xs); }
.yorum-kart.aktif { display: flex; }
.yorum-kart .alinti { display: flex; gap: 8px; }
.yorum-kart .alinti .ikon { width: 32px; height: 32px; color: var(--ana); }
.yorum-kart .alinti .h7 { flex: 1; }
.yorum-kart .metin { font-size: 18px; line-height: 28px; color: var(--metin-koyu); margin-top: -4px; }
.yorum-kart .alt { display: flex; align-items: center; justify-content: space-between; margin-top: 4px; }
.yildizlar { display: flex; gap: 2px; color: #f59e0b; }
.yorum-kart .kisi { display: flex; align-items: center; gap: 8px; font-size: 16px; line-height: 24px; font-weight: 500; color: var(--koyu); }
.avatar { width: 40px; height: 40px; border-radius: 50%; background: var(--gri-gorsel); object-fit: cover; display: inline-flex; align-items: center; justify-content: center; font-size: 14px; font-weight: 600; color: var(--metin-soluk); flex: none; }
.yorum-sag .kaydirak-ok { justify-content: flex-end; margin-top: 0; }

/* ---------- Blog ---------- */
.blog-izgara { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px 20px; }
.yazi-kart { background: #fff; border: 1px solid var(--kenar); border-radius: 8px; box-shadow: var(--golge-xs); overflow: hidden; display: flex; flex-direction: column; transition: transform .2s, box-shadow .2s; }
.yazi-kart:hover { transform: translateY(-3px); box-shadow: var(--golge-sm); }
.yazi-kart .kapak { height: 172px; background: var(--gri-gorsel); display: flex; align-items: center; justify-content: center; color: #cbd5e1; }
.yazi-kart .kapak img { width: 100%; height: 100%; object-fit: cover; }
.yazi-kart .kapak .ikon { width: 48px; height: 48px; }
.yazi-kart .govde { padding: 16px; display: flex; flex-direction: column; gap: 24px; flex: 1; }
.yazi-kart .meta { display: flex; align-items: center; gap: 8px; font-size: 14px; line-height: 20px; color: var(--metin); }
.yazi-kart .meta i { width: 4px; height: 4px; border-radius: 50%; background: var(--cizgi); }
.yazi-kart h3 { font-size: 18px; line-height: 28px; font-weight: 600; color: var(--koyu); margin-top: 8px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.yazi-kart .devam { font-size: 16px; line-height: 24px; font-weight: 500; color: var(--ana); margin-top: auto; }
.blog-alt { display: flex; justify-content: center; margin-top: 40px; }

/* ---------- Şubeler ---------- */
.sube-izgara { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.sube-kart { background: #fff; border: 1px solid var(--kenar); border-radius: 8px; box-shadow: var(--golge-xs); overflow: hidden; display: flex; flex-direction: column; }
.sube-kart .foto { height: 272px; background: var(--gri-gorsel); display: flex; align-items: center; justify-content: center; color: #cbd5e1; }
.sube-kart .foto img { width: 100%; height: 100%; object-fit: cover; }
.sube-kart .foto .ikon { width: 56px; height: 56px; }
.sube-kart .govde { padding: 16px; display: flex; flex-direction: column; gap: 12px; flex: 1; }
.sube-kart h3 { font-size: 18px; line-height: 28px; font-weight: 600; color: var(--koyu); }
.sube-kart .adres { font-size: 14px; line-height: 20px; color: var(--metin); min-height: 40px; }
.sube-kart hr { border: 0; border-top: 1px solid var(--cizgi); margin: 0; }
.sube-kart .saatler { display: flex; flex-direction: column; gap: 8px; }
.sube-kart .saatler b { font-size: 16px; line-height: 24px; font-weight: 500; color: var(--koyu); }
.sube-kart .saatler div { display: flex; justify-content: space-between; font-size: 14px; line-height: 20px; color: var(--metin-koyu); }
.sube-kart .saatler div span:last-child { font-weight: 500; color: var(--koyu); }
.sube-kart .saatler .kapali { color: var(--kirmizi) !important; }
.sube-kart .btn { margin-top: auto; }

/* ---------- CTA ---------- */
.cta { position: relative; overflow: hidden; background: var(--lacivert-koyu); color: #fff; padding: 48px 150px; }
.cta::after { content: ''; position: absolute; right: 56px; top: -40px; width: 385px; height: 191px; border-radius: 50%; background: var(--ana); opacity: .5; filter: blur(80px); }
.cta-ic { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.cta h2 { font-size: 32px; line-height: 40px; font-weight: 600; letter-spacing: -.02em; }
.cta p { font-size: 18px; line-height: 28px; font-weight: 500; margin-top: 16px; }

/* ---------- Footer ---------- */
.footer { background: var(--koyu); color: #fff; padding: 88px 150px 32px; }
.footer-ust { display: flex; justify-content: space-between; gap: 80px; }
.footer-marka { width: 274px; flex: none; display: flex; flex-direction: column; gap: 16px; }
.footer-marka .logo { color: #fff; }
.footer-marka .logo .ikon { color: #fff; }
.footer-marka p { font-size: 14px; line-height: 20px; font-style: italic; }
.footer-sutunlar { display: flex; gap: 96px; }
.footer-sutun { display: flex; flex-direction: column; gap: 16px; padding: 0 24px; }
.footer-sutun h4 { font-size: 18px; line-height: 28px; font-weight: 600; height: 40px; display: flex; align-items: center; white-space: nowrap; }
.footer-sutun ul { display: flex; flex-direction: column; gap: 16px; }
.footer-sutun li, .footer-sutun a { font-size: 14px; line-height: 20px; font-weight: 500; display: flex; gap: 8px; align-items: flex-start; }
.footer-sutun a:hover { color: var(--ana-kenar); }
.footer-sutun .ikon { width: 20px; height: 20px; }
.footer-sutun .iletisim { width: 212px; }
.footer hr { border: 0; border-top: 1px solid var(--metin-soluk); margin: 40px 0 0; }
.footer-alt { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 24px 0 0; margin-top: 0; font-size: 14px; line-height: 20px; font-weight: 500; }
.imza { display: inline-flex; align-items: center; gap: 10px; padding: 6px 14px 6px 12px; border-radius: 100px; border: 1px solid rgba(255,255,255,.14); background: rgba(255,255,255,.04); color: #fff; transition: border-color .15s, background .15s; }
.imza:hover { border-color: var(--ana-kenar); background: rgba(36,153,145,.14); }
.imza-etiket { font-size: 11px; line-height: 14px; font-weight: 500; letter-spacing: .06em; text-transform: uppercase; color: var(--cizgi); }
.imza-ad { display: inline-flex; align-items: center; gap: 6px; font-size: 14px; line-height: 20px; font-weight: 600; color: var(--ana-kenar); }
.imza-ad .ikon { width: 16px; height: 16px; }
.footer-alt div { display: flex; gap: 32px; }

/* ---------- İç sayfalar (blog, randevu) ---------- */
.sayfa-baslik { background: linear-gradient(180deg, #fff 0%, #f3f3f3 100%); padding: 56px 150px; }
.sayfa-baslik .kirinti { font-size: 14px; line-height: 20px; color: var(--metin-soluk); margin-bottom: 12px; display: flex; gap: 8px; align-items: center; }
.sayfa-baslik .kirinti a:hover { color: var(--ana); }
.sayfa-baslik .h5 { font-size: 36px; line-height: 44px; }
.sayfa-baslik p { margin-top: 12px; font-size: 18px; line-height: 28px; max-width: 640px; }
.yazi-detay { display: flex; gap: 60px; align-items: flex-start; }
.yazi-icerik { flex: 1; min-width: 0; }
.yazi-icerik .kapak { width: 100%; height: 420px; border-radius: 12px; object-fit: cover; margin-bottom: 32px; }
.yazi-icerik .meta { display: flex; gap: 8px; align-items: center; font-size: 14px; color: var(--metin); margin-bottom: 16px; }
.yazi-icerik .meta i { width: 4px; height: 4px; border-radius: 50%; background: var(--cizgi); }
.yazi-icerik .metin { font-size: 18px; line-height: 30px; color: var(--metin-koyu); white-space: pre-line; }
.yazi-icerik .metin p { margin-bottom: 20px; }
.yazi-yan { width: 367px; flex: none; display: flex; flex-direction: column; gap: 20px; }
.yazi-yan h4 { font-size: 18px; line-height: 28px; font-weight: 600; color: var(--koyu); }
.sayfalama { display: flex; justify-content: center; gap: 8px; margin-top: 40px; }
.sayfalama a, .sayfalama span { min-width: 40px; height: 40px; padding: 0 12px; border-radius: 8px; border: 1px solid var(--kenar); background: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: 14px; font-weight: 500; color: var(--metin); }
.sayfalama .aktif { background: var(--ana); border-color: var(--ana); color: #fff; }

/* Form */
.form-kart { background: #fff; border: 1px solid var(--kenar); border-radius: 12px; box-shadow: var(--golge-xs); padding: 32px; }
.form-izgara { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.form-izgara .tam { grid-column: 1 / -1; }
.alan { display: flex; flex-direction: column; gap: 6px; }
.alan label { font-size: 14px; line-height: 20px; font-weight: 500; color: var(--koyu); }
.alan input, .alan select, .alan textarea { width: 100%; height: 44px; padding: 10px 14px; border: 1px solid var(--cizgi); border-radius: 8px; font: inherit; font-size: 15px; color: var(--koyu); background: #fff; outline: none; transition: border-color .15s, box-shadow .15s; }
.alan textarea { height: auto; min-height: 110px; resize: vertical; }
.alan input:focus, .alan select:focus, .alan textarea:focus { border-color: var(--ana); box-shadow: 0 0 0 3px rgba(36,153,145,.15); }
.alan .hata { font-size: 13px; color: var(--kirmizi); }
.onay { display: flex; gap: 10px; align-items: flex-start; font-size: 14px; line-height: 20px; color: var(--metin); }
.onay input { width: 18px; height: 18px; margin-top: 1px; accent-color: var(--ana); flex: none; }
.uyari { padding: 14px 16px; border-radius: 8px; font-size: 14px; line-height: 20px; font-weight: 500; margin-bottom: 20px; }
.uyari-basarili { background: #ecfdf5; border: 1px solid #a7f3d0; color: #047857; }
.uyari-hata { background: #fef2f2; border: 1px solid #fecaca; color: #b91c1c; }
.randevu-duzen { display: flex; gap: 40px; align-items: flex-start; }
.randevu-duzen .form-kart { flex: 1; }
.randevu-yan { width: 367px; flex: none; display: flex; flex-direction: column; gap: 20px; }
.bilgi-kart { background: #fff; border: 1px solid var(--kenar); border-radius: 12px; box-shadow: var(--golge-xs); padding: 24px; display: flex; flex-direction: column; gap: 12px; }
.bilgi-kart h4 { font-size: 18px; line-height: 28px; font-weight: 600; color: var(--koyu); }
.bilgi-kart div { display: flex; gap: 8px; align-items: flex-start; font-size: 14px; line-height: 20px; color: var(--metin); }
.bilgi-kart .ikon { width: 20px; height: 20px; color: var(--ana); }

/* WhatsApp düğmesi */
.wa { position: fixed; right: 24px; bottom: 24px; width: 56px; height: 56px; border-radius: 50%; background: #25d366; color: #fff; display: flex; align-items: center; justify-content: center; box-shadow: 0 8px 24px rgba(0,0,0,.18); z-index: 60; }
.wa .ikon { width: 30px; height: 30px; }

/* ---------- Duyarlı ---------- */
@media (max-width: 1280px) {
  .bolum, .hero, .ustbar, .menu-ic, .partner, .cta, .footer, .sayfa-baslik { padding-left: 40px; padding-right: 40px; }
  .hakkimizda { padding-left: 40px; padding-right: 40px; }
  .hero-ic { gap: 24px; }
  .hero-metin { width: 440px; }
  .hakkimizda-metin { width: 50%; }
  .hakkimizda-gorsel { width: 46%; height: 380px; }
  .yorum-gorsel { width: 46%; }
  .yorum-gorsel .cerceve { width: 75%; }
  .yorum-gorsel .daire { left: 35%; }
  .yorum-sag { width: 48%; }
  .footer-sutunlar { gap: 40px; }
}
@media (max-width: 1024px) {
  .ustbar { height: auto; flex-wrap: wrap; gap: 8px; padding-top: 10px; padding-bottom: 10px; }
  .ustbar-bilgi { flex-wrap: wrap; row-gap: 4px; }
  .menu-baglanti { position: fixed; inset: 0 0 0 auto; width: 300px; background: #fff; flex-direction: column; align-items: flex-start; padding: 80px 24px 24px; gap: 20px; box-shadow: -8px 0 32px rgba(0,0,0,.12); transform: translateX(100%); transition: .25s; z-index: 70; }
  .menu-baglanti.acik { transform: none; }
  .menu-baglanti .acilir-kutu { position: static; opacity: 1; visibility: visible; transform: none; box-shadow: none; border: 0; padding: 4px 0 0 12px; display: none; }
  .menu-baglanti .acilir.acik .acilir-kutu { display: block; }
  .menu-ac { display: inline-flex; }
  .menu-ac.kapat { position: fixed; top: 20px; right: 24px; z-index: 71; }
  .hero-ic { flex-direction: column; align-items: flex-start; }
  .hero-gorsel { align-self: center; margin-top: 40px; }
  .hero-metin { width: 100%; }
  .hizmetler-izgara, .blog-izgara, .sube-izgara { grid-template-columns: repeat(2, 1fr); }
  .hakkimizda-ic { flex-direction: column; }
  .hakkimizda-metin, .hakkimizda-gorsel { width: 100%; }
  .hakkimizda-gorsel { height: auto; aspect-ratio: 544 / 415; }
  .oynat { left: 24px; }
  .yorum-ic { flex-direction: column; }
  .yorum-gorsel { width: 100%; max-width: 540px; }
  .yorum-gorsel .cerceve { width: 72%; }
  .yorum-sag { width: 100%; }
  .footer-ust { flex-direction: column; gap: 40px; }
  .footer-sutunlar { flex-wrap: wrap; gap: 24px; }
  .footer-sutun { padding: 0; }
  .yazi-detay, .randevu-duzen { flex-direction: column; }
  .yazi-yan, .randevu-yan { width: 100%; }
}
@media (max-width: 640px) {
  .bolum, .hero, .ustbar, .menu-ic, .partner, .cta, .footer, .hakkimizda, .sayfa-baslik { padding-left: 16px; padding-right: 16px; }
  .bolum, .hakkimizda { padding-top: 56px; padding-bottom: 56px; }
  .footer { padding-top: 56px; padding-bottom: 24px; }
  .ustbar .sosyal { display: none; }
  .ustbar-bilgi .ayrac { display: none; }
  .h1 { font-size: 36px; line-height: 44px; }
  .h5 { font-size: 26px; line-height: 34px; }
  .bolum-baslik { flex-wrap: wrap; gap: 16px; }
  .bolum-baslik .cizgi { display: none; }
  .bolum-baslik .h5 { width: 100%; }
  .hero { min-height: 0; }
  .hero-gorsel { width: 100%; height: auto; margin-top: 24px; }
  .hero-kart { position: relative; right: auto; top: 0; width: 100%; max-width: 320px; margin: 0 auto; height: 380px; }
  .hero-yay, .hero-dis { display: none; }
  .ist-hasta { left: 0; top: auto; bottom: 24px; }
  .ist-uzman { right: 0; top: 24px; }
  .hizmetler-izgara, .blog-izgara, .sube-izgara { grid-template-columns: 1fr; }
  .form-izgara { grid-template-columns: 1fr; }
  .form-kart { padding: 20px; }
  .cta-ic { flex-direction: column; align-items: flex-start; }
  .cta h2 { font-size: 26px; line-height: 34px; }
  .footer-alt { flex-direction: column; gap: 12px; align-items: flex-start; }
  .yorum-gorsel { height: 360px; }
  .yorum-gorsel .daire { width: 160px; height: 160px; top: 190px; }
  .yazi-icerik .kapak { height: 220px; }
  .menu-baglanti { width: 86vw; }
}

/* ---------- 404 sayfası ---------- */
.hata-sayfa { background: linear-gradient(180deg, #fff 0%, #f3f3f3 100%); padding: 96px 150px; min-height: 560px; }
.hata-ic { display: flex; align-items: center; justify-content: space-between; gap: 40px; }
.hata-metin { width: 520px; flex: none; display: flex; flex-direction: column; gap: 24px; }
.hata-metin .h1 { font-size: 44px; line-height: 54px; }
.hata-metin .aciklama { font-size: 18px; line-height: 28px; color: var(--metin); }
.hata-dugmeler { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 8px; }
.hata-gorsel { position: relative; width: 416px; height: 380px; flex: none; display: flex; align-items: center; justify-content: center; }
.hata-daire { position: absolute; width: 300px; height: 300px; border-radius: 50%; background: linear-gradient(165deg, #f4f8f8 0%, #dfeeec 45%, #5fb3ad 80%, var(--lacivert) 100%); opacity: .9; }
.hata-gorsel img { position: relative; width: 190px; height: 190px; filter: drop-shadow(-4px 10px 18px rgba(0,0,0,.12)); }
.hata-sayi { position: absolute; right: 24px; bottom: 16px; font-size: 96px; line-height: 1; font-weight: 600; letter-spacing: -.04em; color: var(--kenar); }
@media (max-width: 1024px) { .hata-ic { flex-direction: column; align-items: flex-start; } .hata-metin { width: 100%; } .hata-gorsel { align-self: center; } }
@media (max-width: 640px) { .hata-sayfa { padding: 56px 16px; } .hata-metin .h1 { font-size: 34px; line-height: 42px; } .hata-gorsel { width: 100%; height: 320px; } }