/* Rawdah Okulları: ön yüz stilleri
   Renk okul üniformasından: kırmızı + siyah, zemin beyaz, bantlar açık gri; pastel ton yok
   (kullanıcı seçimi B, 01.10). Fotoğraflar düz kenarlı;
   kemer, yarım daire ve yuvarlak çerçeve kullanılmaz (kullanıcı kararı 01.10). */

/* Arapça yalnız iki kelime için (العربية, روضة): Amiri'nin 8 KB'lık alt kümesi */
@font-face { font-family: "Amiri Alt"; src: url("../fonts/amiri-alt-kume.woff2") format("woff2"); font-weight: 400; font-display: swap; unicode-range: U+0600-06FF, U+FE70-FEFF; }

/* ---- belirteçler ------------------------------------------------ */
:root {
  --kagit: #ffffff;
  --bant: #f1f1f1;
  --kum: #ececec;
  --kum-koyu: #d6d6d6;
  --murekkep: #1d1718;
  --metin: #231d1e;
  --gri: #5c5657;
  --gri-acik: #8f8a8b;
  --cizgi: #dddddd;
  --kirmizi: #c8102e;
  --kirmizi-koyu: #9c0c24;
  --kirmizi-koyu-zemin: #ef4058;
  --gece: #141011;
  --basari: #1f7a4d;
  --hata: #b3261e;

  --f-baslik: "Lexend", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --f-govde: "Lexend", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --f-arapca: "Amiri Alt", "Noto Naskh Arabic", "Segoe UI", serif;
  --baslik-agirlik: 600;

  --kap: 1240px;
  --yan: clamp(18px, 4vw, 40px);
  --bolum-y: clamp(56px, 8vw, 104px);
  --r: 12px;
  --r-kucuk: 8px;
  --golge: 0 0 0 1px rgba(29, 23, 24, .08), 0 1px 2px rgba(29, 23, 24, .05), 0 8px 24px -14px rgba(29, 23, 24, .18);
  --gecis: .25s cubic-bezier(.2, .7, .2, 1);
  --ust-y: 76px;
}

/* ---- temel ------------------------------------------------------ */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: calc(var(--ust-y) + 16px); }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }
body {
  margin: 0; background: var(--kagit); color: var(--metin);
  font: 400 16.5px/1.7 var(--f-govde); font-feature-settings: "kern";
  -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
}
img, svg, video, iframe { display: block; max-width: 100%; }
img { height: auto; }
a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { color: var(--kirmizi); }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
h1, h2, h3, h4 { font-family: var(--f-baslik); font-weight: var(--baslik-agirlik); color: var(--murekkep); line-height: 1.14; margin: 0 0 .5em; letter-spacing: -.022em; text-wrap: balance; }
p { margin: 0 0 1em; text-wrap: pretty; }
:focus-visible { outline: 3px solid var(--kirmizi); outline-offset: 3px; border-radius: 4px; }
::selection { background: var(--kirmizi); color: #fff; }
[hidden] { display: none !important; }
.gorunmez { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.atla { position: absolute; left: 12px; top: -60px; z-index: 100; background: var(--murekkep); color: #fff; padding: 10px 16px; border-radius: 8px; text-decoration: none; }
.atla:focus { top: 12px; color: #fff; }
.kap { width: 100%; max-width: var(--kap); margin-inline: auto; padding-inline: var(--yan); }
.ikon { width: 1.2em; height: 1.2em; flex: none; }
main { outline: none; }
.arapca { font-family: var(--f-arapca); direction: rtl; unicode-bidi: isolate; }


/* ---- düğmeler --------------------------------------------------- */
.dugme {
  display: inline-flex; align-items: center; justify-content: center; gap: .55em;
  min-height: 48px; padding: 0 24px; border-radius: 999px; border: 1.5px solid transparent;
  font-weight: 600; font-size: 16px; line-height: 1; text-decoration: none; white-space: nowrap;
  transition: background var(--gecis), color var(--gecis), border-color var(--gecis), transform var(--gecis);
}
.dugme .ikon { width: 1.1em; height: 1.1em; transition: transform var(--gecis); }
.dugme:hover .ikon { transform: translateX(3px); }
.dugme-dolu { background: var(--kirmizi); color: #fff; }
.dugme-dolu:hover { background: var(--kirmizi-koyu); color: #fff; }
.dugme-cizgi { border-color: currentColor; color: var(--murekkep); background: transparent; }
.dugme-cizgi:hover { background: var(--murekkep); color: #fff; border-color: var(--murekkep); }
.dugme-acik { background: #fff; color: var(--murekkep); }
.dugme-acik:hover { background: var(--kum); color: var(--murekkep); }
.dugme-koyu { background: var(--murekkep); color: #fff; }
.dugme-koyu:hover { background: #000; color: #fff; }
.metin-baglanti { display: inline-flex; align-items: center; gap: .4em; font-weight: 600; color: var(--murekkep); text-decoration: none; border-bottom: 1.5px solid var(--kirmizi); padding-bottom: 2px; }
.metin-baglanti .ikon { width: 1em; height: 1em; transition: transform var(--gecis); }
.metin-baglanti:hover { color: var(--kirmizi); }
.metin-baglanti:hover .ikon { transform: translateX(3px); }

/* ---- üst bilgi -------------------------------------------------- */
.ust { position: sticky; top: 0; z-index: 50; background: rgba(255, 255, 255, .94); backdrop-filter: saturate(1.4) blur(10px); -webkit-backdrop-filter: saturate(1.4) blur(10px); border-bottom: 1px solid transparent; transition: border-color var(--gecis), box-shadow var(--gecis); }
.ust.kaydi { border-bottom-color: var(--cizgi); box-shadow: 0 6px 24px -18px rgba(0, 0, 0, .35); }
.ust-ic { display: flex; align-items: center; gap: 20px; height: var(--ust-y); }
.marka { display: flex; align-items: center; gap: 12px; text-decoration: none; color: var(--murekkep); flex: none; }
.marka:hover { color: var(--murekkep); }
.marka-amblem { width: 50px; height: auto; }
.marka-yazi { display: flex; flex-direction: column; line-height: 1.1; }
.marka-ad { font-family: var(--f-baslik); font-weight: var(--baslik-agirlik); font-size: 21px; letter-spacing: -.01em; }
.marka-alt { font-size: 12.5px; color: var(--gri); letter-spacing: .02em; margin-top: 3px; }

.ana-menu { flex: 1; display: flex; justify-content: center; }
.menu-liste { display: flex; align-items: center; gap: 2px; list-style: none; margin: 0; padding: 0; }
.menu-oge { position: relative; }
.menu-baglanti, .menu-dugme {
  display: inline-flex; align-items: center; gap: 4px; height: 44px; padding: 0 11px; border: 0; background: none;
  border-radius: 999px; font-size: 15.5px; font-weight: 500; color: var(--metin); text-decoration: none; white-space: nowrap;
  transition: background var(--gecis), color var(--gecis);
}
.menu-baglanti:hover, .menu-dugme:hover, .menu-dugme[aria-expanded="true"] { background: var(--kum); color: var(--murekkep); }
.menu-oge.etkin > .menu-baglanti, .menu-oge.etkin > .menu-dugme { color: var(--kirmizi); }
.menu-ok { width: 16px; height: 16px; transition: transform var(--gecis); }
.menu-dugme[aria-expanded="true"] .menu-ok { transform: rotate(180deg); }
.menu-alt {
  position: absolute; left: 50%; top: calc(100% + 10px); min-width: 280px; transform: translate(-50%, 6px);
  opacity: 0; visibility: hidden; transition: opacity .18s ease, transform .18s ease, visibility 0s .18s;
}
.menu-alt::before { content: ""; position: absolute; left: 0; right: 0; top: -12px; height: 12px; }
.menu-alt.genis { min-width: 560px; }
.menu-oge.acik > .menu-alt { opacity: 1; visibility: visible; transform: translate(-50%, 0); transition-delay: 0s; }
.menu-alt-ic { background: #fff; border: 1px solid var(--cizgi); border-radius: var(--r); box-shadow: 0 24px 48px -24px rgba(29, 23, 24, .35); padding: 14px; }
.menu-alt a.menu-alt-bas { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 12px 12px; margin-bottom: 6px; border-radius: 0; border-bottom: 1px solid var(--cizgi); font-family: var(--f-baslik); font-size: 18px; color: var(--murekkep); text-decoration: none; }
.menu-alt a.menu-alt-bas .ikon { width: 18px; height: 18px; color: var(--kirmizi); }
.menu-alt ul { list-style: none; margin: 0; padding: 0; }
.menu-alt.genis > .menu-alt-ic > ul { columns: 2; column-gap: 8px; }
.menu-alt li { break-inside: avoid; }
.menu-alt a { display: block; padding: 8px 12px; border-radius: var(--r-kucuk); text-decoration: none; font-size: 15px; color: var(--metin); }
.menu-alt a:hover { background: var(--bant); color: var(--kirmizi); }
.menu-alt a[aria-current="page"] { color: var(--kirmizi); font-weight: 600; }
.menu-alt li.grup { margin: 2px 0 8px; }
.menu-alt li.grup > a { font-weight: 600; color: var(--murekkep); }
.menu-alt li.grup ul { margin-left: 12px; padding-left: 8px; border-left: 2px solid var(--cizgi); }
.menu-alt li.grup ul a { padding: 6px 10px; font-size: 14.5px; color: var(--gri); }
.menu-mobil-alt { display: none; }

.ust-sag { display: flex; align-items: center; gap: 10px; flex: none; margin-left: auto; }
/* Telefon üst şeritte yalnız simge (numara aria-label, menünün altı ve alt bilgide); numara yazısı menüyü sığdırmıyordu */
.ust-tel { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; flex: none; border-radius: 50%; border: 1px solid var(--cizgi); background: #fff; text-decoration: none; color: var(--murekkep); }
.ust-tel span { display: none; }
.ust-tel .ikon { width: 18px; height: 18px; color: var(--kirmizi); }
.ust-cta { min-height: 44px; padding: 0 20px; font-size: 15px; }
/* Portal girişi: öğrenci, veli ve öğretmen için ayrı uygulama (rawdah-portal); telefonda da üst şeritte kalır */
.ust-portal { min-height: 44px; padding: 0 18px; font-size: 15px; }
.ust-portal .ikon { width: 18px; height: 18px; color: var(--kirmizi); }
.ust-portal:hover .ikon { color: #fff; transform: none; }
.menu-ac { display: none; width: 46px; height: 46px; border: 1px solid var(--cizgi); border-radius: 50%; background: #fff; align-items: center; justify-content: center; }
.menu-ac .ikon { width: 22px; height: 22px; }
.menu-ac .kapa-ikon { display: none; }
.menu-ac[aria-expanded="true"] .ac-ikon { display: none; }
.menu-ac[aria-expanded="true"] .kapa-ikon { display: block; }

/* 1181-1260 px: tam menü sığsın diye sıkı aralık, Portal simgesiz */
@media (min-width: 1181px) and (max-width: 1260px) { .ust-ic { gap: 14px; } .menu-baglanti, .menu-dugme { padding: 0 8px; } .ust-sag { gap: 8px; } .ust-portal .ikon { display: none; } .ust-portal { padding: 0 16px; } }
@media (max-width: 1180px) {
  :root { --ust-y: 68px; }
  /* backdrop-filter sabit konumlu çocuklar için kapsayıcı olur: menü üst şeridin boyuna hapsolurdu */
  .ust { background: var(--kagit); backdrop-filter: none; -webkit-backdrop-filter: none; }
  .menu-ac { display: inline-flex; }
  .ust-cta { display: none; }
  .ana-menu {
    position: fixed; inset: var(--ust-y) 0 0 0; background: var(--kagit); display: block; overflow-y: auto; overscroll-behavior: contain;
    padding: 12px var(--yan) 32px; opacity: 0; visibility: hidden; transform: translateY(-8px);
    transition: opacity .2s ease, transform .2s ease, visibility 0s .2s; border-top: 1px solid var(--cizgi);
  }
  .menu-acik .ana-menu { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
  .menu-acik { overflow: hidden; }
  .menu-liste { flex-direction: column; align-items: stretch; gap: 0; }
  .menu-oge { border-bottom: 1px solid var(--cizgi); }
  .menu-baglanti, .menu-dugme { width: 100%; height: 58px; justify-content: space-between; padding: 0 4px; border-radius: 0; font-size: 19px; font-family: var(--f-baslik); font-weight: var(--baslik-agirlik); }
  .menu-baglanti:hover, .menu-dugme:hover, .menu-dugme[aria-expanded="true"] { background: none; }
  .menu-ok { width: 20px; height: 20px; }
  .menu-alt, .menu-alt.genis { position: static; transform: none; min-width: 0; display: none; opacity: 1; visibility: visible; transition: none; }
  .menu-oge.acik > .menu-alt { display: block; transform: none; }
  .menu-alt-ic { border: 0; box-shadow: none; background: none; padding: 0 0 14px; }
  .menu-alt.genis > .menu-alt-ic > ul { columns: 1; }
  .menu-alt a.menu-alt-bas { display: flex; align-items: center; justify-content: space-between; gap: 12px; font-size: 16px; font-family: var(--f-govde); font-weight: 600; padding: 6px 4px 10px; }
  .menu-alt a { padding: 10px 4px; font-size: 16px; }
  .menu-mobil-alt { display: flex; flex-direction: column; gap: 12px; padding-top: 24px; }
  .menu-tel { display: inline-flex; align-items: center; gap: 10px; font-weight: 600; font-size: 18px; text-decoration: none; }
  .menu-tel .ikon { color: var(--kirmizi); }
  .menu-mobil-alt .dugme { width: 100%; min-height: 54px; }
}
/* Dar telefonda telefon simgesi menünün içinde (menu-tel) ve WhatsApp düğmesinde kalır; şeritte Portal'a yer açılır */
@media (max-width: 420px) { .marka-amblem { width: 38px !important; } }
@media (max-width: 460px) { .ust-tel { display: none; } }
@media (max-width: 380px) {
  .ust-portal .ikon { display: none; }
  .ust-portal { padding: 0 12px; }
  .marka { gap: 8px; }
  .marka-ad { font-size: 16px !important; }
  .marka-alt { font-size: 10.5px !important; }
}
@media (max-width: 560px) {
  .ust-portal { min-height: 40px; padding: 0 12px; font-size: 14px; gap: 6px; }
  .marka-amblem { width: 42px; }
  .marka-ad { font-size: 18px; }
  .marka-alt { font-size: 11.5px; }
  .ust-sag { gap: 8px; }
  .ust-ic { gap: 10px; }
  .menu-ac { width: 44px; height: 44px; }
}
@media (max-width: 340px) { .marka-amblem { width: 32px !important; } .marka-ad { font-size: 15px !important; } .marka-alt { font-size: 10px !important; } .ust-portal { padding: 0 10px !important; } }

/* ---- ortak bölüm yapısı ----------------------------------------- */
.bolum { padding-block: var(--bolum-y); }
.bolum-bant { background: var(--bant); }
.bolum-koyu { background: var(--gece); color: #ececec; }
.bolum-koyu h2, .bolum-koyu h3 { color: #fff; }
.bolum-bas { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin-bottom: clamp(28px, 4vw, 48px); flex-wrap: wrap; }
.bolum-bas h2 { font-size: clamp(30px, 4.2vw, 50px); margin: 0; max-width: 18ch; }
.bolum-bas p { max-width: 52ch; margin: 12px 0 0; color: var(--gri); }

/* ---- ana sayfa: giriş slaytları --------------------------------- */
/* Koyu mürekkep zemin, sağda fotoğraf sahnesi. Geçişte yeni fotoğraf kırmızı bir izle sağdan perde gibi açılır, başlık kelime
   kelime yukarıdan belirir, alttaki sekmenin çizgisi süreyi gösterir (süre biter, animationend sonraki slayta geçirir).
   Albüm fotoğrafları en çok 1024 px: sahne yüksekliği 720 px ile sınırlı ki fotoğraf yumuşamasın. */
.slider { --sure: 7000ms; --sahne: 54; --alt-y: 104px; --egri: cubic-bezier(.77, 0, .18, 1); position: relative; isolation: isolate; overflow: hidden; background: var(--gece); color: #fff; }
.slider-sahne { position: absolute; top: 0; right: 0; bottom: var(--alt-y); width: calc(var(--sahne) * 1%); overflow: hidden; background: #000; }
.slider-sahne::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 6px; background: var(--kirmizi); z-index: 4; }
.slider-sahne::after { content: ""; position: absolute; inset: 0; z-index: 3; pointer-events: none;
  background: linear-gradient(to top, rgba(20, 16, 17, .4), rgba(20, 16, 17, 0) 30%); }
.slider-foto { position: absolute; inset: 0; margin: 0; z-index: 0; visibility: hidden; }
.slider-foto.etkin { z-index: 2; visibility: visible; }
.slider-foto.onceki { z-index: 1; visibility: visible; }
.slider-foto img { width: 100%; height: 100%; object-fit: cover; transform-origin: 60% 45%; }
.slider-iz { position: absolute; top: 0; bottom: 0; left: 100%; width: 12px; margin-left: -6px; background: var(--kirmizi); z-index: 5; opacity: 0; pointer-events: none; }
.slider-kunye { position: absolute; top: 20px; right: 20px; z-index: 4; display: inline-flex; align-items: center; gap: 8px; max-width: calc(100% - 48px);
  padding: 7px 14px 7px 11px; border-radius: 999px; background: rgba(20, 16, 17, .66); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
  font-size: 13px; line-height: 1.3; color: rgba(255, 255, 255, .9); }
.slider-kunye .ikon { width: 16px; height: 16px; color: var(--kirmizi-koyu-zemin); }
.slider-album { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.slider-kunye:has(.slider-album:empty) { display: none; }

.slider-ic { position: relative; z-index: 6; display: flex; flex-direction: column; justify-content: space-between; gap: 40px;
  min-height: clamp(580px, calc(100svh - var(--ust-y) - 20px), 720px); padding-block: clamp(48px, 7vh, 84px) 28px; pointer-events: none; }
.slider-ic > * { pointer-events: auto; }
.slider-yazilar { display: grid; flex: 1; align-items: center; width: calc((100 - var(--sahne)) * 1vw - max(var(--yan), (100vw - var(--kap)) / 2 + var(--yan)) - 56px); }
.slayt { grid-area: 1 / 1; min-width: 0; visibility: hidden; opacity: 0; transition: opacity .35s ease, visibility 0s .35s; }
.slayt.etkin { visibility: visible; opacity: 1; transition: opacity .2s ease, visibility 0s; }
.slayt-baslik { margin: 0 0 22px; color: #fff; font-size: clamp(40px, 4.5vw, 70px); line-height: 1.03; letter-spacing: -.04em; }
.slayt-baslik .k { display: inline-block; overflow: hidden; vertical-align: top; padding-bottom: .1em; margin-bottom: -.1em; }
.slayt-baslik .k > span { display: inline-block; }
.slayt-metin { margin: 0 0 30px; max-width: 44ch; font-size: clamp(16.5px, 1.35vw, 19px); line-height: 1.65; color: rgba(255, 255, 255, .76); }
.slayt-eylem { display: flex; flex-wrap: wrap; gap: 12px 20px; align-items: center; }
.slider .dugme-dolu:hover { background: #fff; color: var(--murekkep); }

.slider-alt { display: flex; align-items: flex-end; gap: 28px; }
.slider-sekmeler { flex: 1; min-width: 0; display: flex; gap: 20px; list-style: none; margin: 0; padding: 0; }
.slider-sekmeler > li { flex: 1 1 0; min-width: 0; transition: flex-grow .5s var(--egri); }
.slider-sekme { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: baseline; column-gap: 10px; width: 100%; padding: 16px 0 4px;
  border: 0; background: none; color: rgba(255, 255, 255, .62); text-align: left; font: inherit; cursor: pointer; position: relative; transition: color var(--gecis); }
.slider-sekme:hover, .slider-sekme[aria-current="true"] { color: #fff; }
.sekme-no { font-size: 13px; font-weight: 600; font-variant-numeric: tabular-nums; color: var(--kirmizi-koyu-zemin); }
.sekme-ad { font-size: 14.5px; font-weight: 500; line-height: 1.35; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sekme-cizgi { position: absolute; top: 0; left: 0; right: 0; height: 2px; background: rgba(255, 255, 255, .22); overflow: hidden; }
.sekme-cizgi > span { position: absolute; inset: 0; background: #fff; transform: scaleX(0); transform-origin: left; }
.slider-sekme.gecti .sekme-cizgi > span { transform: scaleX(1); background: rgba(255, 255, 255, .5); }
.slider-sekme[aria-current="true"] .sekme-cizgi > span { background: var(--kirmizi); transform: scaleX(1); }
.slider-dugmeler { display: flex; gap: 8px; flex: none; }
.slider-dugme { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; border-radius: 50%;
  border: 1.5px solid rgba(255, 255, 255, .32); background: rgba(20, 16, 17, .35); color: #fff; cursor: pointer; transition: background var(--gecis), color var(--gecis), border-color var(--gecis); }
.slider-dugme:hover { background: #fff; color: var(--murekkep); border-color: #fff; }
.slider-dugme .ikon { width: 20px; height: 20px; }
.slider :focus-visible { outline: 2px solid #fff; outline-offset: 3px; }

@media (prefers-reduced-motion: no-preference) {
  .slider-foto.etkin img { animation: slayt-yakin calc(var(--sure) + 2.5s) linear both; }
  .slider-foto.gir { animation: slayt-perde 1.15s var(--egri) both; }
  .slider-foto.gir.geri { animation-name: slayt-perde-geri; }
  .slider-iz.ileri { animation: slayt-iz 1.15s var(--egri) both; }
  .slider-iz.geri { animation: slayt-iz-geri 1.15s var(--egri) both; }
  .slayt.etkin .k > span { animation: slayt-kelime .95s cubic-bezier(.2, .8, .2, 1) both; animation-delay: calc(var(--i) * 55ms + .25s); }
  .slayt.etkin .slayt-metin, .slayt.etkin .slayt-eylem { animation: slayt-yukari .8s cubic-bezier(.2, .8, .2, 1) both; }
  .slayt.etkin .slayt-metin { animation-delay: .5s; }
  .slayt.etkin .slayt-eylem { animation-delay: .62s; }
  .slider-sekme[aria-current="true"] .sekme-cizgi > span { animation: slayt-dolum var(--sure) linear both; }
  .slider.bekliyor .sekme-cizgi > span, .slider.bekliyor .slider-foto img { animation-play-state: paused; }
}
/* İlk açılışta başlık hemen okunur (en büyük içerik boyaması gecikmesin); hareket yalnız geçişlerde */
.slider:not(.oynadi) .slayt.etkin * { animation: none !important; }
@keyframes slayt-perde { from { clip-path: inset(0 0 0 100%); } to { clip-path: inset(0); } }
@keyframes slayt-perde-geri { from { clip-path: inset(0 100% 0 0); } to { clip-path: inset(0); } }
@keyframes slayt-iz { 0% { left: 100%; opacity: 1; } 88% { opacity: 1; } 100% { left: 0; opacity: 0; } }
@keyframes slayt-iz-geri { 0% { left: 0; opacity: 1; } 88% { opacity: 1; } 100% { left: 100%; opacity: 0; } }
@keyframes slayt-yakin { from { transform: scale(1.08); } to { transform: scale(1); } }
@keyframes slayt-kelime { from { transform: translateY(108%); } to { transform: none; } }
@keyframes slayt-yukari { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
@keyframes slayt-dolum { from { transform: scaleX(0); } to { transform: scaleX(1); } }

/* Dar masaüstünde (1100-1279 px) beş ad sığmaz: etkin sekme genişler, ötekilerde yalnız numara kalır */
@media (min-width: 1100px) and (max-width: 1279px) {
  .slider-sekmeler { gap: 14px; }
  .slider-sekmeler > li:has([aria-current]) { flex-grow: 3.2; }
  .slider-sekme .sekme-ad { transition: opacity .3s ease; }
  .slider-sekme:not([aria-current]) .sekme-ad { opacity: 0; }
}
/* Tablet ve telefon: fotoğraf üstte tam genişlik, yazı altta; sekmeler süre çizgisine iner */
@media (max-width: 1099px) {
  .slider { display: flex; flex-direction: column; }
  .slider { --sahne-y: min(56.25vw, 62svh); }
  .slider-sahne { position: relative; bottom: auto; width: 100%; height: var(--sahne-y); }
  .slider-sahne::before { top: auto; right: 0; width: auto; height: 5px; }
  .slider-sahne::after { background: linear-gradient(to top, rgba(20, 16, 17, .45), rgba(20, 16, 17, 0) 35%); }
  .slider-kunye { top: 16px; right: auto; left: var(--yan); max-width: calc(100% - 2 * var(--yan)); }
  .slider-ic { min-height: 0; gap: 26px; padding-block: 22px 34px; }
  /* Telefonda süre çizgileri yazının üstünde, düğmeler fotoğrafın sağ altında (sağ alttaki WhatsApp düğmesiyle çakışmasın) */
  .slider-alt { order: -1; }
  .slider-dugmeler { position: absolute; top: -62px; right: var(--yan); }
  .slider-dugme { background: rgba(20, 16, 17, .55); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
  .slider-yazilar { width: 100%; align-items: start; }
  .slayt-baslik { font-size: clamp(34px, 6.4vw, 56px); margin-bottom: 16px; }
  .slayt-metin { margin-bottom: 24px; }
  .slider-alt { align-items: center; gap: 18px; }
  .slider-sekmeler { gap: 8px; }
  .slider-sekme { display: block; padding: 18px 0 0; min-height: 44px; }
  .sekme-no, .sekme-ad { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .sekme-cizgi { top: 21px; height: 3px; border-radius: 2px; }
}
@media (max-width: 600px) {
  .slider { --sahne-y: min(82vw, 60svh); }
  .slider-kunye { top: 12px; padding: 5px 11px 5px 9px; font-size: 12px; }
  .slider-dugmeler { top: -56px; }
  .slayt-baslik { font-size: clamp(32px, 9.4vw, 44px); }
  .slayt-metin { font-size: 16px; }
  .slider-dugme { width: 42px; height: 42px; }
  .slider-dugmeler { gap: 6px; }
}
@media (prefers-reduced-motion: reduce) {
  .slider-foto { opacity: 0; transition: opacity .5s ease, visibility 0s .5s; }
  .slider-foto.etkin { opacity: 1; transition: opacity .5s ease, visibility 0s; }
}

/* ---- ana sayfa: niçin ------------------------------------------- */
.nicin { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(32px, 6vw, 96px); align-items: start; }
.nicin-bas h2 { font-size: clamp(32px, 4.4vw, 54px); }
.nicin-bas p { color: var(--gri); }
.nicin-liste { list-style: none; margin: 0; padding: 0; counter-reset: n; }
.nicin-liste li { counter-increment: n; display: grid; grid-template-columns: 40px 1fr; gap: 16px; padding: 26px 0; border-top: 1px solid var(--cizgi); font-size: clamp(17px, 1.6vw, 20px); line-height: 1.55; color: var(--murekkep); }
.nicin-liste li:last-child { border-bottom: 1px solid var(--cizgi); }
.nicin-liste li::before { content: counter(n) "."; font-family: var(--f-baslik); font-weight: 600; font-size: 1em; line-height: inherit; color: var(--kirmizi); }
@media (max-width: 860px) { .nicin { grid-template-columns: 1fr; } .nicin-liste li { grid-template-columns: 28px 1fr; gap: 10px; padding: 20px 0; } }

/* ---- ana sayfa: kademeler --------------------------------------- */
.kademeler { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(20px, 3vw, 36px); }
.kademe { position: relative; display: grid; grid-template-columns: minmax(0, 0.85fr) minmax(0, 1fr); gap: 26px; align-items: stretch; background: #fff; border-radius: var(--r); padding: 22px; box-shadow: var(--golge); }
.kademe-foto { min-height: 340px; border-radius: var(--r-kucuk); overflow: hidden; background: var(--kum); }
.kademe-foto img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s cubic-bezier(.2, .7, .2, 1); }
.kademe:hover .kademe-foto img { transform: scale(1.04); }
.kademe-metin { padding: 18px 6px 10px 0; display: flex; flex-direction: column; align-items: flex-start; }
.kademe-metin .metin-baglanti { margin-top: auto; }
.kademe-yas { display: block; font-size: 14.5px; font-weight: 500; color: var(--gri); margin-bottom: 6px; }
.kademe h3 { font-size: clamp(26px, 2.6vw, 34px); margin-bottom: 12px; }
.kademe h3 a { text-decoration: none; }
.kademe h3 a::after { content: ""; position: absolute; inset: 0; border-radius: var(--r); }
.kademe p { color: var(--gri); font-size: 15.5px; margin-bottom: 18px; }
.kademe-alt { list-style: none; margin: 0 0 20px; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.kademe-alt a { position: relative; z-index: 1; display: inline-block; font-size: 13.5px; padding: 6px 12px; border: 1px solid var(--cizgi); border-radius: 999px; text-decoration: none; color: var(--metin); }
.kademe-alt a:hover { border-color: var(--kirmizi); color: var(--kirmizi); }
.kademe .metin-baglanti { position: relative; z-index: 1; }
@media (max-width: 1080px) { .kademeler { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .kademe { grid-template-columns: 1fr; } .kademe-foto { min-height: 0; aspect-ratio: 4 / 3.2; } }

.en-kutu { margin-top: clamp(20px, 3vw, 36px); display: grid; grid-template-columns: auto 1fr auto; gap: 18px 28px; align-items: center; padding: 26px 30px; border-radius: var(--r); border: 1px solid var(--cizgi); background: #fff; }
.en-kutu h3 { margin: 0; font-size: 22px; }
.en-kutu p { margin: 0; color: var(--gri); font-size: 15.5px; }
@media (max-width: 760px) { .en-kutu { grid-template-columns: 1fr; } }

/* ---- ana sayfa: okulumuz ---------------------------------------- */
.okulumuz { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); gap: clamp(32px, 6vw, 88px); align-items: start; }
.okulumuz-fotolar { position: sticky; top: calc(var(--ust-y) + 24px); display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.okulumuz-fotolar figure { margin: 0; overflow: hidden; background: var(--kum); }
.okulumuz-fotolar figure { border-radius: var(--r); }
.okulumuz-fotolar figure:first-child { grid-column: 1 / -1; aspect-ratio: 16 / 10; }
.okulumuz-fotolar figure:not(:first-child) { aspect-ratio: 1; }
.okulumuz-fotolar img { width: 100%; height: 100%; object-fit: cover; }
.okulumuz-metin h2 { font-size: clamp(32px, 4.2vw, 50px); }
.okulumuz-metin p { color: var(--metin); }
/* telefonda ana sayfada ilk iki paragraf; devamı için "Biz kimiz" düğmesi (kullanıcı kararı 29.09) */
@media (max-width: 700px) { .okulumuz-govde > :nth-child(n+3) { display: none; } }
@media (max-width: 900px) { .okulumuz { grid-template-columns: 1fr; } .okulumuz-fotolar { position: static; } }

/* ---- ana sayfa: EDN alıntısı ------------------------------------ */
.alinti-bolum { background: var(--murekkep); color: #fff; }
.alinti { position: relative; z-index: 1; max-width: 980px; }
.alinti blockquote { margin: 0 0 30px; font-family: var(--f-baslik); font-weight: var(--baslik-agirlik); font-size: clamp(28px, 3.9vw, 50px); line-height: 1.16; letter-spacing: -.015em; text-wrap: balance; }
.alinti .dugme-acik { background: var(--kirmizi); border-color: var(--kirmizi); color: #fff; }
.alinti .dugme-acik:hover { background: var(--kirmizi-koyu); border-color: var(--kirmizi-koyu); color: #fff; }

/* ---- ana sayfa: programlar ------------------------------------- */
.programlar { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; background: var(--cizgi); border: 1px solid var(--cizgi); border-radius: var(--r); overflow: hidden; }
.program { position: relative; background: var(--kagit); padding: 28px 24px 26px; display: flex; flex-direction: column; gap: 12px; min-height: 0; transition: background var(--gecis); text-decoration: none; color: var(--metin); }
.program:hover { background: var(--bant); color: var(--metin); }
.program h3 { font-size: 21px; margin: 0; }
.program p { font-size: 14.5px; color: var(--gri); margin: 0; }
.program .ok { margin-top: auto; width: 20px; height: 20px; color: var(--kirmizi); opacity: 0; transform: translateX(-6px); transition: opacity var(--gecis), transform var(--gecis); }
.program:hover .ok { opacity: 1; transform: none; }
@media (max-width: 1000px) { .programlar { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .programlar { grid-template-columns: 1fr; } .program { padding: 20px 18px; gap: 8px; } .program h3 { font-size: 19px; } .program .ok { display: none; } }

/* ---- haber kartları --------------------------------------------- */
.haber-izgara { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(18px, 2.4vw, 30px); }
.haber-kart { position: relative; display: flex; flex-direction: column; background: #fff; border-radius: var(--r); overflow: hidden; box-shadow: var(--golge); }
.haber-kart-foto { aspect-ratio: 16 / 10; background: var(--kum); overflow: hidden; }
.haber-kart-foto img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.haber-kart:hover .haber-kart-foto img { transform: scale(1.04); }
.haber-kart-foto.bos { display: grid; place-items: center; color: var(--kirmizi); background: var(--bant); }
.haber-kart-foto.bos img { width: 64px; height: auto; opacity: .7; }
.haber-kart-ic { padding: 22px 22px 24px; display: flex; flex-direction: column; gap: 10px; flex: 1; }
.haber-kart-ust { display: flex; align-items: center; gap: 10px; font-size: 13px; color: var(--gri); }
.rozet { display: inline-flex; align-items: center; height: 24px; padding: 0 10px; border-radius: 999px; font-size: 12.5px; font-weight: 600; background: var(--kirmizi); color: #fff; }
.rozet-koyu { background: var(--murekkep); color: #fff; }
.haber-kart h3 { font-size: 21px; margin: 0; }
.haber-kart h3 a { text-decoration: none; }
.haber-kart h3 a::after { content: ""; position: absolute; inset: 0; }
.haber-kart p { font-size: 15px; color: var(--gri); margin: 0; }
@media (max-width: 960px) { .haber-izgara { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 620px) { .haber-izgara { grid-template-columns: 1fr; } }

/* ---- ana sayfa: haber + takvim --------------------------------- */
.guncel { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: clamp(24px, 3vw, 40px); align-items: start; }
.guncel .haber-izgara { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 1000px) { .guncel { grid-template-columns: 1fr; } }
@media (max-width: 620px) { .guncel .haber-izgara { grid-template-columns: 1fr; } }
.etkinlik-kutu { background: #fff; border-radius: var(--r); padding: 26px; box-shadow: var(--golge); }
.etkinlik-kutu h3 { font-size: 24px; display: flex; align-items: center; gap: 10px; }
.etkinlik-kutu h3 .ikon { color: var(--kirmizi); }
.etkinlik-liste { list-style: none; margin: 0 0 18px; padding: 0; }
.etkinlik-liste li { display: grid; grid-template-columns: 58px 1fr; gap: 14px; padding: 14px 0; border-top: 1px solid var(--cizgi); }
.etkinlik-gun { display: flex; flex-direction: column; align-items: center; justify-content: center; height: 62px; border-radius: var(--r-kucuk); background: var(--kirmizi); color: #fff; line-height: 1; }
.etkinlik-gun b { font-family: var(--f-baslik); font-weight: var(--baslik-agirlik); font-size: 25px; }
.etkinlik-gun small { font-size: 12px; font-weight: 600; margin-top: 4px; }
.etkinlik-bilgi strong { display: block; font-weight: 600; color: var(--murekkep); line-height: 1.35; }
.etkinlik-bilgi span { font-size: 13.5px; color: var(--gri); }

/* ---- ana sayfa: galeri şeridi ----------------------------------- */
.serit { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(260px, 23%); gap: 18px; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 14px; scrollbar-width: thin; scrollbar-color: var(--kum-koyu) transparent; }
.serit::-webkit-scrollbar { height: 8px; }
.serit::-webkit-scrollbar-thumb { background: var(--kum-koyu); border-radius: 8px; }
.album-kart { position: relative; scroll-snap-align: start; display: block; text-decoration: none; color: var(--murekkep); }
.album-kart-foto { aspect-ratio: 4 / 5; border-radius: var(--r); overflow: hidden; background: var(--kum); margin-bottom: 14px; }
.album-kart-foto img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s cubic-bezier(.2, .7, .2, 1); }
.album-kart:hover .album-kart-foto img { transform: scale(1.05); }
.album-kart h2, .album-kart h3 { font-size: 19px; margin: 0 0 4px; }
.album-kart span { font-size: 13.5px; color: var(--gri); display: inline-flex; align-items: center; gap: 6px; }
.album-kart span .ikon { width: 16px; height: 16px; }
.album-kart:hover h2, .album-kart:hover h3 { color: var(--kirmizi); }
/* Telefonda yana kaydırma yok: iki sütunlu ızgarada ilk dört albüm, gerisi "Tüm albümler"de */
@media (max-width: 620px) {
  .serit { grid-auto-flow: row; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-columns: auto; gap: 22px 14px; overflow: visible; padding-bottom: 0; }
  .serit > :nth-child(n+5) { display: none; }
  .serit .album-kart h3 { font-size: 16.5px; }
}

/* ---- tanıtım filmi ---------------------------------------------- */
.film { position: relative; display: block; width: 100%; aspect-ratio: 16 / 9; border: 0; padding: 0; border-radius: var(--r); overflow: hidden; background: var(--gece); color: #fff; box-shadow: 0 40px 80px -48px rgba(0, 0, 0, .6); }
.film img { width: 100%; height: 100%; object-fit: cover; opacity: .82; transition: opacity var(--gecis), transform 1s ease; }
.film:hover img { opacity: .7; transform: scale(1.02); }
.film-oynat { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 96px; height: 96px; border-radius: 50%; background: var(--kirmizi); display: grid; place-items: center; transition: transform var(--gecis), box-shadow var(--gecis); }
.film-oynat .ikon { width: 34px; height: 34px; margin-left: 5px; }
.film:hover .film-oynat { transform: translate(-50%, -50%) scale(1.06); }
.film-yazi { position: absolute; left: 0; right: 0; bottom: 0; padding: 22px 28px; text-align: left; background: linear-gradient(transparent, rgba(0, 0, 0, .65)); font-weight: 600; font-size: 16px; }
.film iframe { position: absolute; inset: 0; width: 100%; height: 100%; }
@media (max-width: 600px) { .film { border-radius: var(--r); } .film-oynat { width: 70px; height: 70px; } .film-oynat .ikon { width: 26px; height: 26px; } .film-yazi { font-size: 14px; padding: 14px 16px; } }

/* ---- ziyaret (randevu çağrısı) ---------------------------------- */
.ziyaret { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: clamp(24px, 4vw, 56px); align-items: stretch; }
.ziyaret-metin h2 { font-size: clamp(32px, 4.4vw, 54px); color: #fff; }
.ziyaret-metin > p { color: #cac7c7; font-size: 18px; max-width: 44ch; }
.ziyaret-eylem { display: flex; flex-wrap: wrap; gap: 12px; margin: 28px 0 34px; }
.ziyaret-eylem .dugme-cizgi { color: #fff; }
.ziyaret-eylem .dugme-cizgi:hover { background: #fff; color: var(--murekkep); border-color: #fff; }
.ziyaret-bilgi { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.ziyaret-bilgi li { display: flex; gap: 12px; align-items: flex-start; color: #e2e0e0; }
.ziyaret-bilgi .ikon { color: var(--kirmizi-koyu-zemin); margin-top: 3px; }
.ziyaret-bilgi a { color: #fff; text-decoration: none; }
.ziyaret-bilgi a:hover { text-decoration: underline; }
.harita { position: relative; min-height: 380px; border-radius: var(--r); overflow: hidden; background: #222 center / cover; }
.harita-kapak { position: absolute; inset: 0; display: grid; place-items: center; text-align: center; color: #fff; background: #262323; border: 0; width: 100%; padding: 24px; }
.harita-kapak .ikon { width: 44px; height: 44px; color: var(--kirmizi-koyu-zemin); margin: 0 auto 12px; }
.harita-kapak strong { display: block; color: #fff; font-family: var(--f-baslik); font-weight: var(--baslik-agirlik); font-size: 24px; margin-bottom: 6px; }
.harita-kapak span { color: #cac7c7; font-size: 14.5px; }
.harita-kapak .dugme { margin-top: 18px; color: var(--murekkep); }
.harita-cerceve { position: absolute; inset: 0; }
.harita-cerceve .leaflet-container { width: 100%; height: 100%; }
@media (max-width: 900px) { .ziyaret { grid-template-columns: 1fr; } .harita { min-height: 320px; } }

/* ---- alt bilgi -------------------------------------------------- */
.alt { background: var(--gece); color: #c2bebe; font-size: 15px; padding-top: clamp(56px, 7vw, 88px); border-top: 1px solid rgba(255, 255, 255, .06); }
.alt a { color: #ececec; text-decoration: none; }
.alt a:hover { color: #fff; text-decoration: underline; }
.alt h2 { font-family: var(--f-baslik); font-weight: 600; font-size: 17px; color: #fff; margin-bottom: 16px; }
.alt-ust { display: grid; grid-template-columns: 1.35fr 1fr .9fr 1.2fr; gap: clamp(28px, 4vw, 56px); padding-bottom: 48px; }
.alt-marka img { width: 190px; margin-bottom: 20px; }
.alt-marka p { max-width: 40ch; line-height: 1.6; }
.sosyal { display: flex; flex-wrap: wrap; gap: 10px; list-style: none; margin: 20px 0 0; padding: 0; }
.sosyal a { width: 42px; height: 42px; border-radius: 50%; display: grid; place-items: center; border: 1px solid rgba(255, 255, 255, .16); transition: background var(--gecis), border-color var(--gecis); }
.sosyal a:hover { background: var(--kirmizi); border-color: var(--kirmizi); text-decoration: none; }
.sosyal .ikon { width: 20px; height: 20px; }
.alt-iletisim, .alt-liste { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.alt-iletisim li { display: flex; gap: 10px; align-items: flex-start; }
.alt-iletisim .ikon { color: var(--kirmizi-koyu-zemin); margin-top: 3px; width: 18px; height: 18px; }
.bulten-form { display: grid; grid-template-columns: 1fr auto; gap: 8px; }
.bulten-form input[type="email"] { min-height: 48px; border-radius: 999px; border: 1px solid rgba(255, 255, 255, .2); background: rgba(255, 255, 255, .06); padding: 0 18px; color: #fff; min-width: 0; }
.bulten-form input::placeholder { color: #a19d9d; }
.bulten-form input:focus { outline: none; border-color: #fff; }
.bulten-form .kucuk-not, .bulten-form .form-sonuc { grid-column: 1 / -1; font-size: 13px; margin: 4px 0 0; color: #a19d9d; }
.bulten-form .kucuk-not a { color: #d6d3d3; text-decoration: underline; }
.bulten-form .form-sonuc { color: #fff; font-size: 14px; }
.alt-alt { display: flex; flex-wrap: wrap; gap: 10px 28px; align-items: center; justify-content: space-between; padding-block: 24px; border-top: 1px solid rgba(255, 255, 255, .1); font-size: 13.5px; color: #a19d9d; }
.alt-alt p { margin: 0; }
.alt-yasal { display: flex; gap: 20px; list-style: none; margin: 0; padding: 0; }
.alt-alt .imza { margin-right: 72px; }
.alt-alt .imza a, .alt-yasal a { text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 1000px) { .alt-ust { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) { .alt-ust { grid-template-columns: 1fr; } .alt-alt { flex-direction: column; align-items: flex-start; } .alt-alt .imza { margin-right: 0; } }

.wp-dugme { position: fixed; right: 18px; bottom: 18px; z-index: 40; display: inline-flex; align-items: center; gap: 8px; height: 54px; padding: 0 20px 0 16px; border-radius: 999px; background: #1faa59; color: #fff; text-decoration: none; font-weight: 600; box-shadow: 0 12px 28px -12px rgba(0, 0, 0, .45); transition: transform var(--gecis), background var(--gecis); }
.wp-dugme:hover { background: #178a48; color: #fff; transform: translateY(-2px); }
.wp-dugme .ikon { width: 24px; height: 24px; }
.yukari { position: fixed; right: 18px; bottom: 84px; z-index: 40; width: 46px; height: 46px; border-radius: 50%; border: 1px solid var(--cizgi); background: #fff; color: var(--murekkep); display: grid; place-items: center; box-shadow: var(--golge); }
.yukari .ikon { width: 20px; height: 20px; }
@media (max-width: 600px) { .wp-dugme { width: 54px; padding: 0; justify-content: center; } .wp-dugme span { display: none; } .yukari { bottom: 82px; } }

/* Panel önizlemesi şeridi (yalnız imzalı önizleme bağlantısında; ziyaretçi hiç görmez) */
.onizleme-serit { background: var(--gece); color: #fff; font-size: 14.5px; line-height: 1.5; padding: 10px 0; }
.onizleme-serit strong { color: var(--kirmizi-koyu-zemin); }

/* ---- iç sayfa başı ---------------------------------------------- */
.sayfa-bas { padding: clamp(28px, 4vw, 52px) 0 clamp(28px, 4vw, 48px); }
.sayfa-bas-ic { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 32px; align-items: end; }
.sayfa-bas h1 { font-size: clamp(36px, 5.2vw, 68px); margin: 0; letter-spacing: -.02em; max-width: 20ch; }
.sayfa-bas .sayfa-ozet { font-size: 18.5px; color: var(--gri); margin: 16px 0 0; max-width: 56ch; }
.sayfa-bas-foto { width: clamp(180px, 22vw, 300px); aspect-ratio: 4 / 5; border-radius: var(--r); overflow: hidden; background: var(--kum); }
.sayfa-bas-foto img { width: 100%; height: 100%; object-fit: cover; }
/* Telefonda önce konum satırı ve başlık, fotoğraf altında (fotoğraf üstteyken sayfanın adı ilk ekranın altına düşüyordu) */
@media (max-width: 760px) { .sayfa-bas-ic { grid-template-columns: minmax(0, 1fr); gap: 22px; } .sayfa-bas-foto { width: 100%; aspect-ratio: 16 / 10; border-radius: var(--r); } }
.yol { font-size: 14px; color: var(--gri); margin-bottom: 18px; }
.yol ol { display: flex; flex-wrap: wrap; gap: 4px 0; list-style: none; margin: 0; padding: 0; }
.yol li { display: inline-flex; align-items: center; }
.yol li + li::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: var(--kum-koyu); margin: 0 10px; }
.yol a { text-decoration: none; color: var(--gri); }
.yol a:hover { color: var(--kirmizi); }
.yol [aria-current] { color: var(--murekkep); }
@media (max-width: 700px) {
  /* telefonda sayfa yolu tek satır; uzunsa yana kayar, sona kaydırılmış açılır. Bulunulan sayfanın adı hemen altındaki
     büyük başlıkla aynı: telefonda yazılmaz (uzun haber başlığında satır soldan kesik görünüyordu, 07.10) */
  .yol ol { flex-wrap: nowrap; overflow-x: auto; white-space: nowrap; scrollbar-width: none; margin-inline: calc(var(--yan) * -1); padding-inline: var(--yan); }
  .yol ol::-webkit-scrollbar { display: none; }
  .yol li[aria-current] { display: none; }
  .yol li:nth-last-child(2) { padding-right: var(--yan); } /* kaydırma kabında sağ iç boşluk yok sayılıyor */
}

/* ---- iç sayfa düzeni -------------------------------------------- */
.icerik-duzen { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: clamp(28px, 5vw, 72px); align-items: start; padding-bottom: var(--bolum-y); }
.icerik-duzen.tek { grid-template-columns: minmax(0, 1fr); }
.yan-menu { position: sticky; top: calc(var(--ust-y) + 20px); }
.yan-menu h2 { font-family: var(--f-baslik); font-weight: 600; font-size: 16px; color: var(--murekkep); margin: 0 0 12px; }
.yan-menu ul { list-style: none; margin: 0; padding: 0; border-left: 2px solid var(--cizgi); }
.yan-menu li a { display: block; padding: 9px 0 9px 16px; margin-left: -2px; border-left: 2px solid transparent; text-decoration: none; color: var(--metin); font-size: 15.5px; line-height: 1.35; }
.yan-menu li a:hover { color: var(--kirmizi); }
.yan-menu li a[aria-current="page"] { border-left-color: var(--kirmizi); color: var(--kirmizi); font-weight: 600; }
.yan-menu ul ul { border-left: 0; margin-left: 16px; }
.yan-menu ul ul a { font-size: 14.5px; color: var(--gri); padding-block: 6px; }
.yan-kutu { margin-top: 28px; padding: 22px; border-radius: var(--r); background: var(--kirmizi); color: #fff; }
.yan-kutu strong { display: block; font-family: var(--f-baslik); font-weight: var(--baslik-agirlik); font-size: 22px; line-height: 1.2; margin-bottom: 8px; }
.yan-kutu p { font-size: 14.5px; opacity: .92; margin-bottom: 16px; }
.yan-kutu .dugme { width: 100%; color: var(--kirmizi-koyu); }
@media (max-width: 900px) {
  .icerik-duzen { grid-template-columns: minmax(0, 1fr); }
  .yan-menu { position: static; order: 2; padding-top: 28px; border-top: 1px solid var(--cizgi); }
}

/* ---- metin tipografisi ------------------------------------------ */
.yazi { max-width: 760px; font-size: 17px; line-height: 1.8; color: var(--metin); }
.yazi > :first-child { margin-top: 0; }
.yazi h2 { font-size: clamp(26px, 3vw, 36px); margin: 1.8em 0 .6em; }
.yazi h3 { font-size: clamp(21px, 2.2vw, 25px); margin: 1.6em 0 .5em; }
.yazi h2 + h3 { margin-top: .8em; }
.yazi p { margin: 0 0 1.1em; }
.yazi a { color: var(--kirmizi-koyu); }
.yazi ul, .yazi ol { margin: 0 0 1.3em; padding-left: 0; list-style: none; }
.yazi li { position: relative; padding-left: 28px; margin-bottom: .45em; }
.yazi ul > li::before { content: ""; position: absolute; left: 4px; top: .68em; width: 7px; height: 7px; border-radius: 50%; background: var(--kirmizi); }
.yazi ol { counter-reset: s; }
.yazi ol > li { counter-increment: s; }
.yazi ol > li::before { content: counter(s) "."; position: absolute; left: 0; font-weight: 700; color: var(--kirmizi); }
.yazi strong { color: var(--murekkep); font-weight: 650; }
.yazi blockquote { display: flow-root; margin: 1.6em 0; padding: 26px 30px; border-radius: var(--r); background: #fff; border-left: 4px solid var(--kirmizi); font-family: var(--f-baslik); font-weight: var(--baslik-agirlik); font-size: 19px; line-height: 1.55; color: var(--murekkep); }
.yazi blockquote p:last-child { margin: 0; }
.yazi img { border-radius: var(--r); }
.yazi figure { margin: 1.4em 0; }
.yazi figcaption { font-size: 14.5px; color: var(--gri); margin-top: 8px; }
.yazi table { width: 100%; border-collapse: collapse; margin: 1.2em 0 1.6em; font-size: 16.5px; background: #fff; border-radius: var(--r); overflow: hidden; box-shadow: var(--golge); }
.yazi th, .yazi td { text-align: left; padding: 14px 18px; border-bottom: 1px solid var(--cizgi); vertical-align: top; }
.yazi thead th { background: var(--murekkep); color: #fff; font-weight: 600; font-size: 14.5px; }
.yazi tbody tr:last-child > * { border-bottom: 0; }
.yazi tbody th { font-weight: 600; color: var(--murekkep); }
.yazi .tablo-kap { overflow-x: auto; }
.yazi .kisi-foto { float: right; width: min(300px, 42%); margin: 0 0 20px 32px; }
.yazi .kisi-foto img { border-radius: var(--r); aspect-ratio: 422 / 591; object-fit: cover; width: 100%; }
.yazi .kisi-foto figcaption strong { display: block; font-family: var(--f-baslik); font-weight: var(--baslik-agirlik); font-size: 20px; color: var(--murekkep); }
.yazi .nedenler { counter-reset: n; }
.yazi .nedenler > li { counter-increment: n; padding: 18px 0 18px 34px; margin: 0; border-top: 1px solid var(--cizgi); }
.yazi .nedenler > li::before { content: counter(n) "."; width: auto; height: auto; background: none; border-radius: 0; left: 0; top: 18px; font-family: var(--f-baslik); font-weight: 600; font-size: 1em; color: var(--kirmizi); }
.yazi .vurgu { padding: 24px 28px; border-radius: var(--r); background: var(--kirmizi); color: #fff; font-size: 19px; }
.yazi .vurgu strong { color: #fff; }
.yazi *::-moz-selection { background: var(--kirmizi); color: #fff; }
@media (max-width: 600px) {
  .yazi { font-size: 17px; }
  .yazi .kisi-foto { float: none; width: 100%; max-width: 320px; margin: 0 0 24px; }
  .yazi table { font-size: 15px; }
  .yazi th, .yazi td { padding: 12px; }
}
.belge-indir { display: flex; align-items: center; gap: 16px; padding: 20px 22px; margin: 0 0 1.4em; border: 1px solid var(--cizgi); border-radius: var(--r); background: #fff; text-decoration: none; color: var(--murekkep); max-width: 560px; transition: border-color var(--gecis), transform var(--gecis); }
.belge-indir:hover { border-color: var(--kirmizi); color: var(--murekkep); transform: translateY(-2px); }
.belge-indir-ikon { width: 52px; height: 52px; border-radius: var(--r-kucuk); background: var(--bant); color: var(--kirmizi); display: grid; place-items: center; flex: none; }
.belge-indir-ikon .ikon { width: 26px; height: 26px; }
.belge-indir strong { display: block; font-weight: 600; }
.belge-indir span { font-size: 14px; color: var(--gri); }
.sayfa-guncelleme { margin-top: 40px; font-size: 14px; color: var(--gri-acik); }

/* ---- bölüm şablonu: alt sayfa kartları -------------------------- */
.kart-izgara { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; padding-bottom: var(--bolum-y); }
.alt-kart { position: relative; display: flex; flex-direction: column; gap: 14px; min-height: 230px; padding: 28px; background: #fff; border-radius: var(--r); box-shadow: var(--golge); text-decoration: none; color: var(--metin); transition: transform var(--gecis), box-shadow var(--gecis); }
.alt-kart:hover { transform: translateY(-4px); box-shadow: 0 2px 4px rgba(29, 23, 24, .06), 0 24px 40px -24px rgba(29, 23, 24, .35); color: var(--metin); }
.alt-kart-foto { margin: -28px -28px 6px; aspect-ratio: 16 / 9; overflow: hidden; border-radius: var(--r) var(--r) 0 0; background: var(--kum); }
.alt-kart-foto img { width: 100%; height: 100%; object-fit: cover; }
.alt-kart h2 { font-size: 24px; margin: 0; }
.alt-kart p { font-size: 15px; color: var(--gri); margin: 0; }
.alt-kart .ok-sat { margin-top: auto; display: inline-flex; align-items: center; gap: 6px; font-weight: 600; color: var(--kirmizi); font-size: 15px; }
.alt-kart .ok-sat .ikon { width: 18px; height: 18px; transition: transform var(--gecis); }
.alt-kart:hover .ok-sat .ikon { transform: translateX(4px); }
.alt-kart-alt { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.alt-kart-alt li { font-size: 13px; padding: 4px 10px; border-radius: 999px; background: var(--bant); color: var(--gri); }
@media (max-width: 960px) { .kart-izgara { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 620px) { .kart-izgara { grid-template-columns: 1fr; } .alt-kart { min-height: 0; } }

/* ---- kadro ------------------------------------------------------ */
.suzgec { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 32px; }
.suzgec a, .suzgec button { display: inline-flex; align-items: center; height: 42px; padding: 0 18px; border-radius: 999px; border: 1px solid var(--cizgi); background: #fff; text-decoration: none; font-size: 15px; font-weight: 500; color: var(--metin); transition: background var(--gecis), color var(--gecis), border-color var(--gecis); }
.suzgec a:hover, .suzgec button:hover { border-color: var(--murekkep); color: var(--murekkep); }
.suzgec [aria-current="true"], .suzgec [aria-pressed="true"] { background: var(--murekkep); border-color: var(--murekkep); color: #fff; }
@media (max-width: 700px) {
  /* telefonda süzgeç tek satır, yana kaydırılır */
  .suzgec { flex-wrap: nowrap; overflow-x: auto; margin-inline: calc(var(--yan) * -1); padding: 2px var(--yan) 6px; scrollbar-width: none; }
  .suzgec::-webkit-scrollbar { display: none; }
  .suzgec a, .suzgec button { flex: none; }
}
.suzgec .adet { margin-left: 8px; font-size: 12.5px; opacity: .65; }
.kadro-grup { margin-bottom: 48px; }
.kadro-grup > h2 { font-size: 26px; margin-bottom: 20px; display: flex; align-items: baseline; gap: 12px; }
.kadro-grup > h2 small { font-family: var(--f-govde); font-size: 14px; color: var(--gri); font-weight: 500; }
.kadro-izgara { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 22px; }
.ogretmen { position: relative; text-align: left; background: none; border: 0; padding: 0; color: var(--metin); }
.ogretmen-foto { aspect-ratio: 4 / 5; border-radius: var(--r); overflow: hidden; background: var(--kum); margin-bottom: 14px; display: grid; place-items: center; }
.ogretmen-foto img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 20%; transition: transform .6s ease; }
/* Fotoğrafı olmayan öğretmen: baş harf yerine sade gri siluet (vurgu rengi yok) */
.ogretmen-foto .foto-yok .ikon { width: 64px; height: 64px; color: var(--kum-koyu); stroke-width: 1.4; }
.ogretmen h3 { font-size: 20px; margin: 0 0 4px; }
.ogretmen p { font-size: 14.5px; color: var(--gri); margin: 0; }
.ogretmen-ac { position: absolute; inset: 0; border: 0; background: none; width: 100%; cursor: pointer; border-radius: var(--r); }
.ogretmen:hover .ogretmen-foto img { transform: scale(1.04); }
.ogretmen .devam { display: inline-flex; align-items: center; gap: 4px; font-size: 13.5px; font-weight: 600; color: var(--kirmizi); margin-top: 8px; }
@media (max-width: 1000px) { .kadro-izgara { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 700px) { .kadro-izgara { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; } .ogretmen h3 { font-size: 17px; } }

/* diyalog (öğretmen özgeçmişi) */
.diyalog { border: 0; padding: 0; border-radius: var(--r); width: min(760px, calc(100vw - 32px)); max-height: calc(100dvh - 48px); background: var(--kagit); color: var(--metin); box-shadow: 0 40px 80px -30px rgba(0, 0, 0, .5); }
.diyalog::backdrop { background: rgba(28, 20, 21, .6); backdrop-filter: blur(3px); }
.diyalog-ic { display: grid; grid-template-columns: 220px 1fr; gap: 28px; padding: 32px; }
.diyalog-ic .ogretmen-foto { margin: 0; }
.diyalog h2 { font-size: 30px; margin: 0 0 4px; }
.diyalog .unvan { color: var(--kirmizi); font-weight: 600; margin-bottom: 16px; }
.diyalog-metin { font-size: 16px; line-height: 1.7; }
.diyalog-kapat { position: absolute; right: 14px; top: 14px; width: 42px; height: 42px; border-radius: 50%; border: 1px solid var(--cizgi); background: #fff; display: grid; place-items: center; }
.diyalog-kapat .ikon { width: 20px; height: 20px; }
@media (max-width: 640px) { .diyalog-ic { grid-template-columns: 1fr; padding: 24px 20px; } .diyalog-ic .ogretmen-foto { width: 160px; } }

/* ---- albümler ve ışık kutusu ------------------------------------ */
.album-izgara { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 28px 22px; padding-bottom: var(--bolum-y); }
@media (max-width: 1000px) { .album-izgara { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 700px) { .album-izgara { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 14px; } .album-kart h2, .album-kart h3 { font-size: 16.5px; } }
.foto-izgara { columns: 3 280px; column-gap: 14px; padding-bottom: var(--bolum-y); }
.foto-izgara a { display: block; margin-bottom: 14px; border-radius: var(--r); overflow: hidden; background: var(--kum); break-inside: avoid; position: relative; }
.foto-izgara img { width: 100%; transition: transform .6s ease, opacity var(--gecis); }
.foto-izgara a:hover img { transform: scale(1.03); }
.foto-izgara a::after { content: ""; position: absolute; inset: 0; background: rgba(28, 20, 21, 0); transition: background var(--gecis); }
.foto-izgara a:hover::after { background: rgba(28, 20, 21, .12); }
/* Telefonda iki sütun: 20 fotoğraflık albüm tek sütunda 7.000 px boy yapıyordu */
@media (max-width: 700px) { .foto-izgara { columns: 2; column-gap: 10px; } .foto-izgara a { margin-bottom: 10px; border-radius: var(--r-kucuk); } }
.isik { position: fixed; inset: 0; z-index: 200; background: rgba(18, 12, 13, .96); display: grid; grid-template-rows: auto 1fr auto; color: #fff; }
.isik-ust { display: flex; justify-content: space-between; align-items: center; padding: 14px 18px; font-size: 14px; color: #cac7c7; }
.isik-sahne { position: relative; display: grid; place-items: center; min-height: 0; padding: 0 64px; }
.isik-sahne img { max-width: 100%; max-height: calc(100dvh - 140px); width: auto; height: auto; border-radius: 8px; box-shadow: 0 30px 60px -30px #000; }
.isik button { width: 48px; height: 48px; border-radius: 50%; border: 1px solid rgba(255, 255, 255, .2); background: rgba(255, 255, 255, .06); color: #fff; display: grid; place-items: center; }
.isik button:hover { background: rgba(255, 255, 255, .16); }
.isik button .ikon { width: 22px; height: 22px; }
.isik-onceki, .isik-sonraki { position: absolute; top: 50%; transform: translateY(-50%); }
.isik-onceki { left: 10px; } .isik-sonraki { right: 10px; }
.isik-alt { padding: 12px 18px 18px; text-align: center; font-size: 14px; color: #cac7c7; min-height: 44px; }
@media (max-width: 600px) { .isik-sahne { padding: 0 8px; } .isik-onceki, .isik-sonraki { top: auto; bottom: -58px; transform: none; } .isik-alt { padding-inline: 70px; } }

/* ---- takvim ----------------------------------------------------- */
.takvim-ust { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 20px; }
.takvim-ust h2 { margin: 0; font-size: 30px; }
.takvim-gezin { display: flex; gap: 8px; }
.takvim-gezin a { display: inline-flex; align-items: center; gap: 6px; height: 42px; padding: 0 16px; border-radius: 999px; border: 1px solid var(--cizgi); background: #fff; text-decoration: none; font-size: 15px; }
.takvim-gezin a:hover { border-color: var(--murekkep); color: var(--murekkep); }
.takvim-gezin .ikon { width: 18px; height: 18px; }
.takvim { width: 100%; border-collapse: separate; border-spacing: 6px; table-layout: fixed; margin: 0 -6px 32px; width: calc(100% + 12px); }
.takvim th { font-size: 13px; font-weight: 600; color: var(--gri); padding: 6px 4px; text-align: left; }
.takvim td { vertical-align: top; height: 108px; background: #fff; border-radius: var(--r-kucuk); padding: 8px 10px; border: 1px solid transparent; }
.takvim td.bos { background: transparent; }
.takvim td.bugun { border-color: var(--kirmizi); }
.takvim .gun-no { font-weight: 700; font-size: 14px; color: var(--murekkep); }
.takvim td.haftasonu .gun-no { color: var(--gri-acik); }
.takvim-olay { display: block; margin-top: 6px; font-size: 12.5px; line-height: 1.3; padding: 4px 7px; border-radius: 8px; background: var(--kirmizi); color: #fff; font-weight: 600; }
.takvim-olay.tatil { background: var(--bant); color: var(--metin); }
.takvim-olay.toplanti { background: var(--murekkep); color: #fff; }
.takvim-olay.gezi { background: #fff; color: var(--kirmizi-koyu); box-shadow: inset 0 0 0 1.5px var(--kirmizi); }
@media (max-width: 800px) { .takvim { display: none; } }
.olay-liste { list-style: none; margin: 0 0 var(--bolum-y); padding: 0; display: grid; gap: 12px; }
.olay-liste li { display: grid; grid-template-columns: 76px 1fr; gap: 18px; background: #fff; border-radius: var(--r); padding: 16px; box-shadow: var(--golge); }
.olay-liste .etkinlik-gun { height: 76px; }
.olay-liste h3 { font-size: 20px; margin: 2px 0 6px; }
.olay-liste p { margin: 0; font-size: 15px; color: var(--gri); }
.olay-meta { display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: 14px; color: var(--gri); margin-bottom: 6px; }
.olay-meta span { display: inline-flex; align-items: center; gap: 6px; }
.olay-meta .ikon { width: 16px; height: 16px; color: var(--kirmizi); }

/* ---- formlar ---------------------------------------------------- */
.form-duzen { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); gap: clamp(28px, 5vw, 72px); align-items: start; padding-bottom: var(--bolum-y); }
@media (max-width: 900px) { .form-duzen { grid-template-columns: 1fr; } }
.form-kutu { background: #fff; border-radius: var(--r); padding: clamp(22px, 4vw, 40px); box-shadow: var(--golge); }
.form-kutu h2 { font-size: 28px; margin-bottom: 6px; }
.form-kutu > p { color: var(--gri); }
.alanlar { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 16px; margin: 24px 0; }
.alan { display: flex; flex-direction: column; gap: 7px; }
.alan.tam { grid-column: 1 / -1; }
.alan label, .alan legend { font-size: 14.5px; font-weight: 600; color: var(--murekkep); }
.alan label .istege { font-weight: 400; color: var(--gri); }
.alan input, .alan select, .alan textarea { width: 100%; min-height: 52px; padding: 12px 16px; border: 1.5px solid var(--cizgi); border-radius: var(--r-kucuk); background: var(--kagit); transition: border-color var(--gecis), background var(--gecis); }
.alan textarea { min-height: 130px; resize: vertical; line-height: 1.5; }
.alan input:focus, .alan select:focus, .alan textarea:focus { outline: none; border-color: var(--murekkep); background: #fff; }
.alan [aria-invalid="true"] { border-color: var(--hata); background: #fff6f5; }
.alan .alan-hata { font-size: 13.5px; color: var(--hata); }
.alan select { appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231d1718' stroke-width='1.8' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 14px center; background-size: 18px; padding-right: 44px; }
fieldset.alan { border: 0; padding: 0; margin: 0; min-width: 0; }
.secimler { display: flex; flex-wrap: wrap; gap: 8px; }
.secim { position: relative; }
.secim input { position: absolute; left: 0; top: 0; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.secim span { display: inline-flex; align-items: center; min-height: 44px; padding: 0 16px; border-radius: 999px; border: 1.5px solid var(--cizgi); background: var(--kagit); font-size: 15px; cursor: pointer; transition: all var(--gecis); }
.secim input:checked + span { background: var(--murekkep); border-color: var(--murekkep); color: #fff; }
.secim input:focus-visible + span { outline: 3px solid var(--kirmizi); outline-offset: 2px; }
.onay { display: flex; gap: 12px; align-items: flex-start; font-size: 14.5px; color: var(--gri); }
.form-not { font-size: 14.5px; color: var(--gri); margin: 4px 0 0; }
.onay input { width: 20px; height: 20px; margin-top: 2px; accent-color: var(--kirmizi); flex: none; }
.form-gonder { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; margin-top: 22px; }
.form-gonder .dugme { min-width: 200px; min-height: 54px; }
.form-gonder .dugme[disabled] { opacity: .6; cursor: progress; }
.form-mesaj { border-radius: var(--r); padding: 16px 18px; font-size: 15.5px; margin-bottom: 18px; display: flex; gap: 12px; align-items: flex-start; }
.form-mesaj.basari { background: #e8f4ee; color: #174d33; }
.form-mesaj.hata { background: #fcebea; color: #7d1c16; }
.form-mesaj .ikon { width: 22px; height: 22px; flex: none; }
.bal { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
@media (max-width: 600px) { .alanlar { grid-template-columns: 1fr; } .form-gonder .dugme { width: 100%; } }

.iletisim-kartlar { display: grid; gap: 14px; }
.iletisim-kart { display: flex; gap: 16px; align-items: flex-start; padding: 20px; border-radius: var(--r); background: #fff; box-shadow: var(--golge); text-decoration: none; color: var(--metin); }
a.iletisim-kart:hover { color: var(--metin); outline: 2px solid var(--kirmizi); }
.iletisim-kart-ikon { width: 46px; height: 46px; border-radius: var(--r-kucuk); background: var(--bant); color: var(--kirmizi); display: grid; place-items: center; flex: none; }
.iletisim-kart-ikon .ikon { width: 22px; height: 22px; }
.iletisim-kart small { display: block; font-size: 13px; color: var(--gri); font-weight: 500; margin-bottom: 2px; }
.iletisim-kart strong { font-weight: 600; font-size: 17px; color: var(--murekkep); word-break: break-word; }

/* ---- haber detay ------------------------------------------------ */
.haber-bas-foto { border-radius: var(--r); overflow: hidden; margin-bottom: 36px; aspect-ratio: 16 / 9; background: var(--kum); }
.haber-bas-foto img { width: 100%; height: 100%; object-fit: cover; }
.haber-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; font-size: 14.5px; color: var(--gri); margin-top: 16px; }
.paylas { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 36px 0 0; padding-top: 24px; border-top: 1px solid var(--cizgi); font-size: 14.5px; color: var(--gri); }
.paylas a, .paylas button { width: 42px; height: 42px; border-radius: 50%; border: 1px solid var(--cizgi); background: #fff; display: grid; place-items: center; color: var(--murekkep); }
.paylas a:hover, .paylas button:hover { border-color: var(--kirmizi); color: var(--kirmizi); }
.paylas .ikon { width: 19px; height: 19px; }
.sayfalama { display: flex; justify-content: center; gap: 8px; padding-bottom: var(--bolum-y); }
.sayfalama a, .sayfalama span { min-width: 44px; height: 44px; padding: 0 12px; border-radius: 999px; display: inline-grid; place-items: center; border: 1px solid var(--cizgi); background: #fff; text-decoration: none; }
.sayfalama [aria-current] { background: var(--murekkep); color: #fff; border-color: var(--murekkep); }

/* ---- arama, 404 ------------------------------------------------- */
.arama-form { display: flex; gap: 8px; max-width: 620px; }
.arama-form input { flex: 1; min-height: 54px; border-radius: 999px; border: 1.5px solid var(--cizgi); padding: 0 22px; background: #fff; min-width: 0; }
.arama-form input:focus { outline: none; border-color: var(--murekkep); }
.sonuc-liste { list-style: none; margin: 28px 0 var(--bolum-y); padding: 0; max-width: 760px; }
.sonuc-liste li { padding: 20px 0; border-top: 1px solid var(--cizgi); }
.sonuc-liste a { font-family: var(--f-baslik); font-size: 22px; text-decoration: none; color: var(--murekkep); }
.sonuc-liste a:hover { color: var(--kirmizi); }
.sonuc-liste p { margin: 6px 0 0; color: var(--gri); font-size: 15.5px; }
.sonuc-liste small { display: block; font-size: 13px; color: var(--gri-acik); margin-bottom: 4px; }
.yok-sayfa { text-align: center; padding-block: clamp(48px, 8vw, 110px) var(--bolum-y); }
.yok-sayfa .yok-rakam { font-family: var(--f-baslik); font-size: clamp(90px, 16vw, 180px); line-height: 1; color: var(--kirmizi); margin-bottom: 10px; }
.yok-sayfa h1 { font-size: clamp(30px, 4vw, 46px); }
.yok-sayfa p { color: var(--gri); max-width: 46ch; margin: 0 auto 28px; }
.yok-sayfa .arama-form { margin: 0 auto 28px; }
.yok-baglantilar { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; }

/* ---- belirme hareketi ------------------------------------------- */
@media (prefers-reduced-motion: no-preference) {
  /* Yalnız ekranın altındaki öğeler gizlenip belirir (JS "bekle" ekler); ilk ekran hiç beklemez */
  .belir { transition: opacity .8s cubic-bezier(.2, .7, .2, 1), transform .8s cubic-bezier(.2, .7, .2, 1); }
  .belir.bekle { opacity: 0; transform: translateY(22px); }
  .belir-2 { transition-delay: .08s; } .belir-3 { transition-delay: .16s; } .belir-4 { transition-delay: .24s; }
}

/* ---- yazdırma --------------------------------------------------- */
@media print {
  .ust, .alt, .wp-dugme, .yukari, .yan-menu, .deneme-seridi, .paylas, .film, .harita { display: none !important; }
  body { background: #fff; color: #000; font-size: 12pt; }
  .kap { max-width: none; padding: 0; }
  .yazi { max-width: none; }
  a { text-decoration: none; }
  .icerik-duzen { display: block; }
}