/* ============================================================
   Zarok Hub — site tasarımı
   Beyaz zemin + siyah bantlar + sarı vurgu, köşesiz, fırça kenarlar
   ============================================================ */

@font-face {
  font-family: "Libre Franklin";
  src: url("/assets/fonts/LibreFranklin.ttf") format("truetype-variations");
  font-weight: 100 900; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Caveat";
  src: url("/assets/fonts/Caveat.ttf") format("truetype-variations");
  font-weight: 400 700; font-style: normal; font-display: swap;
}
/* Kalam (SIL OFL, bkz. Kalam-OFL.txt): okunaklı, hafif yatık el yazısı — hero alt metni (400)
   ve hero butonları (700). Yalnız Latin karakterlere indirgendi (TR/KU/EN/NL/FR'nin tümü dahil):
   her ağırlık ~430 KB -> ~28 KB. Kalın için gerçek dosya var; yapay kalınlık bulanık görünüyordu. */
@font-face {
  font-family: "Kalam";
  src: url("/assets/fonts/Kalam-Regular.woff2") format("woff2");
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Kalam";
  src: url("/assets/fonts/Kalam-Bold.woff2") format("woff2");
  font-weight: 700; font-style: normal; font-display: swap;
}

:root {
  --sari: #f3672e;   /* logo turuncusu (eski sari: #FFEB00) */
  --siyah: #000000;
  --beyaz: #ffffff;
  --teal: #029E9C;
  --teal-bant: #389E9C;
  --teal-koyu: #077E7E;
  --turuncu: #F28500;
  --hardal: #F2B801;
  --focus-mavi: #134493;
  --hata: #FF3931;
  --gri-keyline: #E5E5E5;
  --gri-acik: #EFEFEF;
  --gri-orta: #787878;
  --font-govde: "Libre Franklin", Arial, Helvetica, sans-serif;
  --font-script: "Caveat", "Segoe Script", cursive;
  --font-el: "Kalam", "Caveat", "Segoe Print", cursive;   /* okunaklı el yazısı (paragraf) */
  --header-h: 64px;
}

/* Fırça kenar maskesi (SVG data URI — düzensiz boya izi) */
:root {
  --firca-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 40' preserveAspectRatio='none'%3E%3Cpath d='M0 0 h1200 v12 c-40 6 -95 -8 -150 2 c-60 11 -90 -6 -160 4 c-55 8 -85 14 -140 6 c-70 -10 -105 12 -170 8 c-60 -4 -80 -14 -145 -4 c-55 8 -95 -10 -150 -2 c-50 7 -90 16 -140 8 c-45 -7 -95 2 -145 -6 z' fill='%23000'/%3E%3C/svg%3E");
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }

/* Metin seçimi: logodaki turkuaz. Yazı rengi siyah sabitlenir (turkuaz üzerinde 7,2:1 kontrast);
   aksi hâlde turuncu başlıklar ve beyaz hero metni seçilince okunmaz hâle geliyordu. */
::-moz-selection { /* Code for Firefox */
    background: #23a8a7;
    color: #000;
}
::selection {
    background: #23a8a7;
    color: #000;
}
body {
  margin: 0;
  font-family: var(--font-govde);
  font-size: 16px;
  line-height: 1.625;
  letter-spacing: -0.0125rem;
  color: var(--siyah);
  background: var(--beyaz);
  -webkit-font-smoothing: antialiased;
}
@media (min-width: 768px)  { body { font-size: 17px; line-height: 1.55; } }
@media (min-width: 1024px) { body { font-size: 18px; } }

img { max-width: 100%; height: auto; }
a { color: inherit; }

.container { width: 100%; max-width: 1280px; margin: 0 auto; padding: 0 20px; }
@media (min-width: 1024px) { .container { padding: 0 50px; } }
@media (min-width: 1440px) { .container { max-width: 1400px; padding: 0 80px; } }

h1, h2, h3, h4 { font-weight: 700; line-height: 1.2; margin: 0 0 .5em; }
h1 { font-size: 38px; }
h2 { font-size: 30px; }
h3 { font-size: 24px; }
@media (min-width: 1024px) {
  h1 { font-size: 45px; line-height: 1.15; }
  h2 { font-size: 42px; }
  h3 { font-size: 28px; }
}

.skip-link {
  position: absolute; left: -9999px; top: 0; z-index: 999;
  background: var(--sari); color: var(--siyah); padding: 10px 18px; font-weight: 700;
}
.skip-link:focus { left: 0; }

/* ============ BUTONLAR — köşesiz, 3px kenarlık, ghost hover ============ */
.btn {
  display: inline-block;
  font-family: var(--font-govde);
  font-size: 17px; font-weight: 600; line-height: 1.4;
  padding: 13px 24px;
  border: 3px solid var(--siyah);
  border-radius: 0;
  background: var(--siyah); color: var(--beyaz);
  text-decoration: none; cursor: pointer;
  transition: all .2s ease-out;
}
.btn:hover { background: transparent; color: var(--siyah); }
.btn:focus-visible { outline: 0; background: var(--focus-mavi); border-color: var(--focus-mavi); color: var(--beyaz); }
.btn-primary { background: var(--siyah); border-color: var(--siyah); color: var(--beyaz); }
/* .btn-accent: bağış butonunun görünümü, kalpsiz (ana sayfa hero'daki birinci buton) */
.btn-donate, .btn-accent {
  background: var(--sari); border-color: var(--sari); color: var(--siyah);
  border-radius: 999px;            /* hap formu: sitenin keskin kosesine bilincli bir istisna */
  padding-left: 26px; padding-right: 26px;
}
.btn-donate:hover, .btn-accent:hover { background: transparent; border-color: var(--sari); color: inherit; }
.btn-donate::after { content: " ♥"; }
.btn-light { background: var(--beyaz); border-color: var(--beyaz); color: var(--siyah); }
.btn-light:hover { background: transparent; color: var(--beyaz); }
.btn-ghost { background: transparent; border-color: var(--beyaz); color: var(--beyaz); }
.btn-ghost:hover { background: var(--beyaz); color: var(--siyah); }
.btn-lg { font-size: 18px; padding: 16px 30px; }

/* ============ HEADER — yapışkan siyah bar + taşan logo ============ */
.site-header {
  position: sticky; top: 0; z-index: 100;
  background: var(--siyah); color: var(--beyaz);
}
.site-header::after { /* fırça alt kenar */
  content: ""; position: absolute; left: 0; right: 0; bottom: -18px; height: 18px;
  background: var(--siyah);
  -webkit-mask: var(--firca-mask) repeat-x bottom / 1200px 100%;
          mask: var(--firca-mask) repeat-x bottom / 1200px 100%;
  pointer-events: none;
}
/* fırça kenarın altında yumuşak gölge: aynı şeklin kopyası ::after'ın arkasında, gölgeyi o verir.
   (filter başlığın kendisine verilseydi içindeki position:fixed mobil menünün konumu bozulurdu.) */
.ust-golge {
  position: absolute; left: 0; right: 0; bottom: -18px; height: 18px; pointer-events: none;
  filter: drop-shadow(0 5px 7px rgba(8, 48, 58, .3));
}
.ust-golge::before {
  content: ""; position: absolute; inset: 0; background: var(--siyah);
  -webkit-mask: var(--firca-mask) repeat-x bottom / 1200px 100%;
          mask: var(--firca-mask) repeat-x bottom / 1200px 100%;
}
@media print { .ust-golge { display: none; } }
.header-inner {
  display: flex; align-items: center; gap: 10px;
  height: var(--header-h);
  /* Açılır alt menüler .nav-item'a göre konumlanır (bkz. .nav-dropdown). */
}
.brand {
  display: flex; align-items: center; gap: 12px;
  color: var(--beyaz); text-decoration: none;
  margin-right: auto;
  position: relative; z-index: 20;
}
.brand-logo {
  /* max-height (height DEĞİL): küçük logolar BÜYÜTÜLMEZ, böylece bulanıklaşmaz.
     --logo-olcek: Ayarlar'dan gelen yüzde (1 = %100). */
  --logo-olcek: 1;
  max-height: calc(52px * var(--logo-olcek));
  max-width: calc(240px * var(--logo-olcek));
  width: auto; height: auto;
  object-fit: contain; object-position: left center;
  margin-top: 14px;   /* bardan bir miktar aşağı taşar */
  filter: drop-shadow(0 3px 8px rgba(0,0,0,.45));
}
@media (min-width: 1200px) {
  .brand-logo {
    max-height: calc(64px * var(--logo-olcek));
    max-width: calc(300px * var(--logo-olcek));
    margin-top: 20px;
  }
}
@media (max-width: 520px) {
  .brand-logo {
    max-height: calc(40px * var(--logo-olcek));
    max-width: calc(170px * var(--logo-olcek));
    margin-top: 10px;
  }
}

/* --- Masaüstü mega nav --- */
.mega-nav { display: none; }
@media (min-width: 1200px) { .mega-nav { display: block; position: static; } }
.nav-root { list-style: none; display: flex; align-items: stretch; margin: 0; padding: 0; height: var(--header-h); }
.nav-item { position: relative; display: flex; }   /* açılır liste öğenin altına hizalansın */
.nav-link {
  display: flex; align-items: center; gap: 6px;
  font: inherit; font-family: var(--font-script); font-size: 21px; font-weight: 700;
  letter-spacing: .01em;
  white-space: nowrap;
  color: var(--beyaz); text-decoration: none;
  background: none; border: 0; cursor: pointer;
  /* Üzerine gelince beliren zemin bar yüksekliğini dolduran keskin bir dikdörtgendi; artık yazının
     etrafında, Bağış Yap ile aynı yükseklikte bir hap. Öğenin kendisi (.nav-item) bar yüksekliğinde
     kaldığı için açılır listeler yine barın altından açılır. */
  padding: 0 11px; height: 43px; align-self: center; border-radius: 999px;
}
@media (min-width: 1440px) { .nav-link { font-size: 23px; padding: 0 14px; } }
.nav-link:hover, .nav-item.is-open > .nav-link { background: #1c1c1c; color: var(--sari); }
.nav-link:focus-visible { outline: 0; background: var(--focus-mavi); }
.caret {
  width: 0; height: 0; border-left: 5px solid transparent; border-right: 5px solid transparent;
  border-top: 6px solid var(--sari);
  transition: transform .3s;
}
.nav-item.is-open .caret { transform: rotate(180deg); }

/* Açılır alt menü: ilgili öğenin hemen altında, dikey ve dar bir liste.
   (Eskiden başlığın tüm genişliğine yayılan yatay bir "mega panel"di.) */
/* Kapalıyken display:none — visibility:hidden yerleşimde kalıp sağ kenarda yatay kaydırma
   çubuğu doğurabiliyordu. Açılış efekti display değişiminde çalışan animasyonla verilir. */
.nav-dropdown {
  display: none;
  position: absolute; top: 100%; left: 0;
  min-width: 230px; max-width: 320px;
  background: #111; color: var(--beyaz);
  border-top: 3px solid var(--sari);
  box-shadow: 0 14px 30px rgba(0,0,0,.35);
  padding: 8px 0;
  z-index: 20;
}
/* Sağa hizalı: dil menüsü her zaman; diğerleri ekrana sığmazsa site.js .is-flip ekler. */
.nav-dropdown-right, .nav-dropdown.is-flip { left: auto; right: 0; }
.nav-item.is-open > .nav-dropdown { display: block; animation: alt-menu-ac .18s ease-out; }
@keyframes alt-menu-ac { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .nav-item.is-open > .nav-dropdown { animation: none; } }
.nav-dropdown-list { list-style: none; margin: 0; padding: 0; }
.nav-dropdown-list a {
  display: block; padding: 10px 20px;
  font-family: var(--font-govde); font-size: 15.5px; font-weight: 500; line-height: 1.35;
  color: rgba(255,255,255,.88); text-decoration: none;
  border-left: 3px solid transparent;
  transition: background .15s, color .15s, border-color .15s;
}
.nav-dropdown-list a:hover,
.nav-dropdown-list a:focus-visible {
  background: #1c1c1c; color: var(--sari); border-left-color: var(--sari); outline: none;
}
.nav-dropdown-parent { border-bottom: 1px solid #2a2a2a; margin-bottom: 6px; padding-bottom: 6px; }
.nav-dropdown-parent a { font-weight: 700; color: var(--beyaz); }
.nav-dropdown-list a.is-current { color: var(--sari); font-weight: 700; }

/* Dil paneli */
.nav-lang .lang-globe, .mobile-lang-toggle .lang-globe {
  width: 16px; height: 16px; border-radius: 50%;
  border: 2px solid var(--sari); display: inline-block; position: relative;
}
.nav-lang .lang-globe::before, .mobile-lang-toggle .lang-globe::before {
  content: ""; position: absolute; inset: -2px;
  border-radius: 50%;
  background:
    linear-gradient(transparent 6px, var(--sari) 6px, var(--sari) 8px, transparent 8px),
    radial-gradient(ellipse 40% 100% at center, transparent 60%, transparent 61%);
  -webkit-mask: radial-gradient(circle, #000 99%, transparent);
          mask: radial-gradient(circle, #000 99%, transparent);
  opacity: .9;
}

.header-donate {
  display: none; margin-left: 6px; white-space: nowrap;
  /* Hero butonlarıyla aynı el yazısı (Kalam kalın). Libre Franklin 17px'in görünür boyutu
     Kalam'da ~20px; bir kademe küçük -> 19px. Kutu da bir birim küçük (.btn 13/24 -> 12/23). */
  font-family: var(--font-el); font-weight: 700; font-size: 19px; line-height: 1.2;
  padding: 12px 23px;
}
@media (min-width: 560px) { .header-donate { display: inline-block; } }
@media (min-width: 1200px) {
  .header-donate {
    /* Eskiden bar yuksekligini tam dolduruyordu; kenarlardan icerletilip
       yuvarlatildi ki keskin dikdortgen gibi durmasin. */
    height: 43px; display: flex; align-items: center;
    border-width: 0; padding: 0 23px; font-size: 19px;
    margin-left: 14px;
  }
}
.header-donate::after { animation: none; display: inline-block; }
.header-donate:hover::after { animation: kalp-atis .75s infinite; }
@keyframes kalp-atis { 0%,100% { transform: scale(1); } 50% { transform: scale(1.35); } }

/* --- Hamburger --- */
.hamburger {
  display: flex; flex-direction: column; justify-content: center; gap: 5px;
  width: 52px; height: 44px; padding: 8px 12px;
  background: none; border: 2px solid var(--sari); cursor: pointer;
}
.hamburger span { display: block; height: 3px; background: var(--sari); transition: all .25s; }
.hamburger.is-open span:nth-child(1) { transform: translateY(8px) rotate(45deg); }
.hamburger.is-open span:nth-child(2) { opacity: 0; }
.hamburger.is-open span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }
@media (min-width: 1200px) { .hamburger { display: none; } }

/* --- Mobil menü: tam ekran, soldan kayar --- */
.mobile-menu {
  position: fixed; inset: var(--header-h) 0 0 0;
  background: var(--siyah); color: var(--beyaz);
  overflow-y: auto; z-index: 90;
  transform: translateX(-102%);
  transition: transform .3s ease-out;
}
.mobile-menu.is-open { transform: translateX(0); }
.mobile-menu[hidden] { display: block; visibility: hidden; }
.mobile-menu.is-open[hidden] { visibility: visible; }
.mobile-root { list-style: none; margin: 0; padding: 14px 0 60px; display: flex; flex-direction: column; }
.mobile-root > li { border-bottom: 1px solid #222; }
/* Büyük menü satırı. Bağış öğesi hariç: o bir düğme (.btn-donate) ve bu kural zeminini ezip düz yazıya çeviriyordu. */
.mobile-root > li:not(.mobile-donate) > a, .mobile-toggle {
  display: flex; justify-content: space-between; align-items: center; width: 100%;
  font: inherit; font-family: var(--font-script); font-size: 26px; font-weight: 700;
  color: var(--beyaz); text-decoration: none; text-align: left;
  background: none; border: 0; cursor: pointer;
  padding: 15px 22px;
}
.mobile-toggle .caret { border-top-color: var(--sari); }
.mobile-toggle[aria-expanded="true"] .caret { transform: rotate(180deg); }
.mobile-sub { list-style: none; margin: 0; padding: 0 0 10px; background: #111; }
.mobile-sub a {
  display: block; padding: 11px 22px 11px 40px;
  color: rgba(255,255,255,.8); text-decoration: none; font-size: 16px;
}
.mobile-sub a:hover { color: var(--sari); }
/* Mobil dil seçici: menünün üstünde küçük, kapalı başlayan hap düğme */
.mobile-langs { order: -1; padding: 12px 22px; background: #111; }
.mobile-lang-toggle {
  display: inline-flex; align-items: center; gap: 8px;
  font: inherit; font-family: var(--font-govde); font-size: 14px; font-weight: 600; line-height: 1;
  color: var(--beyaz); background: none; cursor: pointer;
  border: 1px solid #3a3a3a; border-radius: 999px; padding: 8px 14px;
}
.mobile-lang-toggle:focus-visible { outline: 2px solid var(--sari); outline-offset: 2px; }
.mobile-lang-toggle .mobile-lang-label { color: var(--gri-orta); font-weight: 600; }
.mobile-lang-toggle strong { font-weight: 800; letter-spacing: .04em; }
.mobile-lang-toggle[aria-expanded="true"] .caret { transform: rotate(180deg); }
.mobile-lang-list { display: flex; flex-wrap: wrap; gap: 8px; padding: 12px 0 2px; }
.mobile-lang-list[hidden] { display: none; }   /* display:flex [hidden]'ı ezmesin */
.mobile-lang-list a {
  font-family: var(--font-govde); font-size: 14px; font-weight: 600;
  color: var(--beyaz); text-decoration: none;
  border: 1px solid #3a3a3a; border-radius: 999px; padding: 6px 13px;
}
.mobile-lang-list a.is-current { background: var(--sari); border-color: var(--sari); color: var(--siyah); }
.mobile-donate { padding: 18px 22px; border-bottom: 0 !important; }
.mobile-donate .btn {
  width: 100%; text-align: center;
  /* Üst bardaki Bağış Yap ile aynı: Kalam kalın 19px, kutu bir birim küçük (.btn 13/24 -> 12/23) */
  font-family: var(--font-el); font-weight: 700; font-size: 19px; line-height: 1.2;
  padding: 12px 23px;
}

/* ============ HERO — siyah bant + script slogan ============ */
.hero { background: var(--siyah); color: var(--beyaz); position: relative; padding-top: 30px; }
.hero::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -18px; height: 18px;
  background: var(--siyah);
  -webkit-mask: var(--firca-mask) repeat-x bottom / 1200px 100%;
          mask: var(--firca-mask) repeat-x bottom / 1200px 100%;
  z-index: 2;
}
.hero-inner {
  display: grid; grid-template-columns: 1fr; gap: 26px;
  padding-top: 44px; padding-bottom: 54px; align-items: center;
}
@media (min-width: 900px) { .hero-inner { grid-template-columns: 1.15fr .85fr; gap: 50px; padding-top: 60px; padding-bottom: 74px; } }
.hero-inner > * { min-width: 0; } /* grid blowout koruması: görselin içsel genişliği kolonu şişirmesin */
.hero-text h1 {
  font-family: var(--font-script);
  font-weight: 700;
  font-size: clamp(44px, 7vw, 84px);
  line-height: 1.05;
  color: var(--sari);
  margin-bottom: 14px;
  text-shadow: 0 3px 14px rgba(0,0,0,.4);
}
.hero-sub {
  font-family: var(--font-el); font-weight: 400;
  font-size: clamp(17px, 1.55vw, 20px); line-height: 1.55;
  max-width: 36em; color: rgba(255,255,255,.92); margin: 0 0 26px;
}
.hero-actions { display: flex; gap: 14px; flex-wrap: wrap; }
/* İkinci (çerçeveli) buton da birincisi gibi hap formunda; renkleri .btn-ghost'tan gelir, değişmez. */
.hero-actions .btn-ghost { border-radius: 999px; padding-left: 25px; padding-right: 25px; }
/* Hero butonları alt metinle aynı el yazısında (Kalam kalın). Kalam aynı pikselde gövde fontundan
   küçük göründüğü için punto büyütüldü; butonların kutu boyu değişmez. */
.hero-actions .btn {
  font-family: var(--font-el); font-weight: 700;
  font-size: clamp(18px, 1.5vw, 20px); line-height: 1.25; letter-spacing: .01em;
  padding-top: 15px; padding-bottom: 15px;   /* .btn-lg 16px'ten bir birim küçük */
}
.hero-actions .btn-accent { padding-left: 29px; padding-right: 29px; }   /* .btn-lg 30px'ten bir birim küçük */
.hero-media img {
  display: block; width: 100%; max-width: 100%; margin: 0 auto;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpath d='M4 8 C20 1 45 3 60 2 C80 1 97 4 97 12 L98 55 C99 75 96 92 88 95 C70 100 40 98 20 96 C6 95 2 88 3 70 Z' fill='%23000'/%3E%3C/svg%3E") center / 100% 100%;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpath d='M4 8 C20 1 45 3 60 2 C80 1 97 4 97 12 L98 55 C99 75 96 92 88 95 C70 100 40 98 20 96 C6 95 2 88 3 70 Z' fill='%23000'/%3E%3C/svg%3E") center / 100% 100%;
}

@media (min-width: 900px) { .hero-media img { max-width: 520px; } }

/* ============ BÖLÜMLER ============ */
.section { padding: 56px 0; }
.section-tight { padding: 26px 0 0; }
@media (min-width: 1024px) { .section { padding: 76px 0; } }
/* Bolum basliklari (Calismalarimiz / One Cikanlar / Son Duyurular / Calisma Ortaklarimiz) */
.section-title {
  position: relative; display: inline-block; margin-bottom: 34px;
  font-family: var(--font-script); font-weight: 700;
  font-size: 42px; line-height: 1.05;
}
@media (min-width: 1024px) { .section-title { font-size: 56px; } }
.section-title::after { /* sarı fırça vurgusu */
  content: ""; display: block; height: 8px; width: 64%;
  margin-top: 8px;
  background: var(--sari);
  -webkit-mask: var(--firca-mask) no-repeat 0 0 / 300px 100%;
          mask: var(--firca-mask) no-repeat 0 0 / 300px 100%;
  transform: scaleY(-1);
}
.section-head { display: flex; align-items: baseline; justify-content: space-between; gap: 18px; flex-wrap: wrap; }
.section-more { font-weight: 700; color: var(--siyah); text-decoration: none; white-space: nowrap; }
.section-more:hover { color: var(--teal-koyu); text-decoration: underline; text-underline-offset: 5px; }

/* Çalışma alanı kartları */
.work-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 16px; }
.work-card {
  display: flex; flex-direction: column; gap: 10px;
  padding: 26px 22px 22px;
  text-decoration: none; color: var(--siyah);
  border: 3px solid var(--siyah);
  font-weight: 700; font-size: 19px;
  transition: transform .2s ease-out, box-shadow .2s;
  position: relative; overflow: hidden;
}
.work-card:hover { transform: translateY(-4px); box-shadow: 0 10px 0 var(--siyah); }
.work-c0 { background: var(--sari); }
.work-c1 { background: var(--teal); }
.work-c2 { background: var(--hardal); }   /* ana renk turuncu olunca --turuncu ile cakisiyordu */
.work-c3 { background: var(--gri-acik); }
.work-icon { width: 40px; height: 40px; border: 3px solid var(--siyah); border-radius: 50%; position: relative; }
.work-icon::after { content: ""; position: absolute; inset: 9px; background: var(--siyah); border-radius: 50%; }
.work-arrow { margin-top: auto; font-size: 24px; transition: transform .2s; }
.work-card:hover .work-arrow { transform: translateX(8px); }

/* ============ KARTLAR (haber/yazı) ============ */
.kart-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 30px 26px; }
.kart { display: flex; flex-direction: column; background: var(--beyaz); }
.kart-media { display: block; aspect-ratio: 16 / 10; overflow: hidden; background: var(--gri-acik); }
.kart-media img { width: 100%; height: 100%; object-fit: cover; transition: transform .35s ease-out; display: block; }
.kart:hover .kart-media img { transform: scale(1.045); }
.kart-media-ph {
  display: block; width: 100%; height: 100%;
  background:
    radial-gradient(circle at 25% 70%, var(--sari) 0 18%, transparent 19%),
    radial-gradient(circle at 55% 40%, var(--teal) 0 14%, transparent 15%),
    radial-gradient(circle at 80% 75%, var(--turuncu) 0 12%, transparent 13%),
    var(--gri-acik);
}
.kart-body { display: flex; flex-direction: column; padding: 16px 2px 0; flex: 1; border-bottom: 1px solid var(--gri-keyline); padding-bottom: 18px; }
.kart-meta { display: flex; align-items: center; gap: 12px; margin-bottom: 8px; font-size: 13px; font-weight: 700; }
.kart-tag {
  background: var(--gri-acik); color: var(--siyah);
  padding: 3px 10px; border-radius: 2px;
  text-transform: uppercase; letter-spacing: .05em; font-size: 11.5px;
  text-decoration: none;
}
a.kart-tag:hover { color: var(--teal-koyu); }
.kart-meta time { color: var(--gri-orta); font-weight: 600; }
.kart-title { font-size: 21px; margin: 0 0 8px; line-height: 1.3; }
.kart-title a { color: var(--siyah); text-decoration: none; }
.kart-title a:hover {
  background: linear-gradient(var(--sari), var(--sari)) repeat-x 0 100% / 100% 5px;
}
.kart-excerpt { margin: 0 0 14px; color: #333; font-size: 15.5px; flex: 1; }
.kart-actions { margin-top: auto; }
.kart-link { font-weight: 700; font-size: 15px; color: var(--siyah); text-decoration: none; }
.kart-link span { display: inline-block; transition: transform .2s; }
.kart-link:hover { color: var(--teal-koyu); }
.kart-link:hover span { transform: translateX(6px); }

/* ============ E-Kütüphane: PDF kapak grid ============ */
.lib-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 34px 26px;
}
.lib-card { display: flex; flex-direction: column; }
.lib-cover {
  display: block; position: relative;
  aspect-ratio: 3 / 4; overflow: hidden;
  background: #fff;
  border: 1px solid var(--gri-keyline);
  box-shadow: 0 6px 0 rgba(0,0,0,.08);
  transition: transform .2s ease-out, box-shadow .2s;
}
.lib-cover:hover { transform: translateY(-4px); box-shadow: 0 12px 0 var(--siyah); }
/* contain: kapak oranı ne olursa olsun KIRPILMADAN sığar (kare kapaklar kesilmesin) */
.lib-cover img { width: 100%; height: 100%; object-fit: contain; object-position: center; display: block; background: #fff; }
.lib-cover-ph {
  display: flex; align-items: center; justify-content: center; height: 100%;
  background:
    repeating-linear-gradient(135deg, #efefef 0 14px, #e7e7e7 14px 28px);
}
.lib-cover-ext {
  font-weight: 800; font-size: 26px; letter-spacing: .06em;
  color: var(--siyah); background: var(--sari); padding: 10px 16px;
  border: 3px solid var(--siyah);
}
.lib-badge {
  position: absolute; top: 10px; right: 10px;
  background: var(--sari); color: var(--siyah);
  font-size: 11px; font-weight: 800; letter-spacing: .05em;
  padding: 4px 8px; border: 2px solid var(--siyah);
}
.lib-body { padding-top: 14px; display: flex; flex-direction: column; gap: 6px; }
.lib-title { font-size: 17px; line-height: 1.3; margin: 0; }
.lib-title a { color: var(--siyah); text-decoration: none; }
.lib-title a:hover {
  background: linear-gradient(var(--sari), var(--sari)) repeat-x 0 100% / 100% 5px;
}
.lib-desc { font-size: 14px; color: #444; margin: 0; }
.lib-action {
  margin-top: 4px; align-self: flex-start;
  font-weight: 700; font-size: 14px; color: var(--teal-koyu);
  text-decoration: none;
}
.lib-action span { display: inline-block; transition: transform .2s; }
.lib-action:hover { color: var(--siyah); }
.lib-action:hover span { transform: translateX(4px); }

/* ============ CTA bandı — sarı ============ */
.section-cta {
  background: var(--sari); color: var(--siyah);
  position: relative;
  margin: 30px 0;
}
.section-cta::before, .section-cta::after {
  content: ""; position: absolute; left: 0; right: 0; height: 18px;
  background: var(--sari);
  -webkit-mask: var(--firca-mask) repeat-x bottom / 1200px 100%;
          mask: var(--firca-mask) repeat-x bottom / 1200px 100%;
}
.section-cta::before { top: -17px; transform: scaleY(-1); }
.section-cta::after { bottom: -17px; }
.cta-inner { display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap; }
.cta-inner h2 {
  margin: 0;
  font-family: var(--font-script); font-weight: 700;
  font-size: clamp(30px, 4.5vw, 52px);
}
/* "Bize Destek Olun": hero'daki "Neler Yapıyoruz?" ile aynı hap formu, Kalam kalın, punto ve iç boşluk.
   Krem zemin + logo turkuazının koyu tonu (4,4:1, büyük kalın yazı); hover'da renkler yer değiştirir. */
.cta-inner .btn-light {
  background: #FFF1E2; border-color: #FFF1E2; color: var(--teal-koyu);
  border-radius: 999px; padding: 15px 25px;
  font-family: var(--font-el); font-weight: 700;
  font-size: clamp(18px, 1.5vw, 20px); line-height: 1.25; letter-spacing: .01em;
  box-shadow: 0 4px 14px rgba(110, 40, 0, .18);
}
.cta-inner .btn-light:hover { background: var(--teal-koyu); border-color: var(--teal-koyu); color: #FFF1E2; }
.cta-inner .btn-light:focus-visible { background: var(--focus-mavi); border-color: var(--focus-mavi); color: var(--beyaz); }

/* ============ Sayfa başlığı ============ */
.page-head { padding: 46px 0 6px; }
@media (min-width: 1024px) { .page-head { padding: 70px 0 10px; } }
/* Başlık yanındaki sabit simge (koda gömülü, panelden silinemez) */
.baslik-emoji { font-size: .78em; margin-left: .28em; vertical-align: baseline; line-height: 1; }

/* Sayfa basligi hero ile ayni el yazisi fontunda; Caveat daha kucuk gorundugu icin punto artirildi. */
.page-head h1 {
  position: relative; display: inline-block; margin-bottom: 10px;
  font-family: var(--font-script); font-weight: 700;
  font-size: 54px; line-height: 1.05;
}
@media (min-width: 1024px) { .page-head h1 { font-size: 64px; } }
.page-head h1::after {
  content: ""; display: block; height: 9px; width: 100%;   /* h1 inline-block → metin genişliği kadar */
  margin-top: 10px;
  background: var(--sari);
  -webkit-mask: var(--firca-mask) repeat-x 0 100% / 340px 100%;
          mask: var(--firca-mask) repeat-x 0 100% / 340px 100%;
}
.page-head-sub { font-size: 20px; color: #333; margin: 4px 0 0; }
.post-meta { display: flex; gap: 14px; align-items: center; margin-bottom: 14px; font-weight: 600; color: var(--gri-orta); }
.page-hero-img { margin-top: 26px; }
.page-hero-img img {
  width: 100%; max-height: 480px; object-fit: cover; display: block;
  -webkit-mask: var(--firca-mask) repeat-x bottom / 1200px 16px, linear-gradient(#000 0 0) top / 100% calc(100% - 15px) no-repeat;
          mask: var(--firca-mask) repeat-x bottom / 1200px 16px, linear-gradient(#000 0 0) top / 100% calc(100% - 15px) no-repeat;
}

/* ============ İçerik (prose) ============ */
.prose { max-width: 52rem; }
.prose-center { margin: 0 auto; text-align: center; }
/* Ana sayfa giriş bölümü (Ana Sayfa'nın panelden yazılan içeriği) el yazısıyla: Kalam.
   Aynı pikselde gövde fontundan küçük göründüğü için 1.12 kat (16/17/18px -> ~18/19/20px). */
.section-intro .prose { font-family: var(--font-el); font-size: 1.12em; line-height: 1.6; letter-spacing: 0; }
/* Giriş metni ile sonraki bölüm arasında üç boşluk üst üste biniyordu (bölüm alt boşluğu + son paragraf
   payı + sonraki bölümün üst boşluğu, masaüstünde ~176px). Aralığı yalnız sonraki bölümün üst boşluğu belirlesin. */
.section-intro { padding-bottom: 0; }
.section-intro .prose > :last-child { margin-bottom: 0; }
.prose p { margin: 0 0 1.2em; }
.prose a {
  color: var(--siyah); font-weight: 600; text-decoration: none;
  background:
    linear-gradient(var(--sari), var(--sari)) repeat-x 0 100% / 100% 6px,
    linear-gradient(var(--siyah), var(--siyah)) repeat-x 0 calc(100% - 5px) / 100% 2px;
  padding-bottom: 7px;
  transition: background-size .2s;
}
.prose a:hover { background-size: 100% 10px, 100% 2px; }
.prose img { margin: 10px 0; }
.prose blockquote {
  font-family: var(--font-script); font-weight: 700;
  font-size: clamp(24px, 3vw, 34px); line-height: 1.35;
  margin: 1.4em 0; padding: 0 0 0 24px;
  border-left: 6px solid var(--hardal);
}
.prose ul, .prose ol { padding-left: 1.4em; margin-bottom: 1.2em; }
.prose h2, .prose h3 { margin-top: 1.4em; }
/* İçerik başlıkları sayfa başlığıyla aynı el yazısında (Caveat kalın) — kullanıcı isteği 23 Eki 2026:
   "çok düz ve fazla ciddi". Caveat aynı puntoda küçük durduğu için boyutlar büyütüldü. h4 ve altı düz kalır. */
.prose h1, .prose h2, .prose h3 { font-family: var(--font-script); font-weight: 700; line-height: 1.12; letter-spacing: 0; }
.prose h1 { font-size: clamp(38px, 4.4vw, 50px); }
.prose h2 { font-size: clamp(34px, 3.8vw, 44px); }
.prose h3 { font-size: clamp(28px, 3vw, 34px); }
.prose table { border-collapse: collapse; width: 100%; margin: 1em 0; }
.prose td, .prose th { border: 1px solid var(--gri-keyline); padding: 8px 12px; }

.empty-note { color: var(--gri-orta); font-family: var(--font-el); font-size: 20px; line-height: 1.5; }   /* boş liste notu: Kalam el yazısı (aynı pikselde gövde fontundan küçük görünür → 20px) */
.back-line { margin-top: 34px; }
.back-link { font-weight: 700; text-decoration: none; color: var(--siyah); background: none !important; }
.back-link:hover { color: var(--teal-koyu); }

.attachment-box {
  display: flex; align-items: center; justify-content: space-between; gap: 18px; flex-wrap: wrap;
  background: var(--gri-acik); border-left: 6px solid var(--sari);
  padding: 18px 20px; margin: 26px 0;
}
.attachment-name { font-weight: 700; }

/* ============ Sayfalama ============ */
.pagination { display: flex; align-items: center; gap: 18px; justify-content: center; margin-top: 44px; }
.page-btn {
  font-weight: 700; text-decoration: none; color: var(--siyah);
  border: 3px solid var(--siyah); padding: 9px 18px;
  transition: all .2s;
}
.page-btn:hover { background: var(--siyah); color: var(--sari); }
.page-info { color: var(--gri-orta); font-weight: 600; }

/* ============ Galeri + Lightbox ============ */
.galeri-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  gap: 10px; margin: 22px 0;
}
.galeri-item { display: block; aspect-ratio: 1; overflow: hidden; background: var(--gri-acik); }
.galeri-item img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s; display: block; }
.galeri-item:hover img { transform: scale(1.06); }
.galeri-item:focus-visible { outline: 4px solid var(--sari); }

.lightbox {
  position: fixed; inset: 0; z-index: 200;
  background: rgba(0,0,0,.92);
  display: flex; align-items: center; justify-content: center;
}
.lightbox[hidden] { display: none; }
.lightbox figure { margin: 0; max-width: 92vw; max-height: 88vh; text-align: center; }
.lightbox img { max-width: 92vw; max-height: 80vh; object-fit: contain; }
.lightbox figcaption { color: rgba(255,255,255,.85); padding-top: 12px; font-size: 15px; }
.lb-close, .lb-prev, .lb-next {
  position: absolute; background: none; border: 0; color: var(--beyaz);
  font-size: 44px; line-height: 1; cursor: pointer; padding: 14px;
  transition: color .15s;
}
.lb-close:hover, .lb-prev:hover, .lb-next:hover { color: var(--sari); }
.lb-close { top: 12px; right: 18px; }
.lb-prev { left: 8px; top: 50%; transform: translateY(-50%); font-size: 60px; }
.lb-next { right: 8px; top: 50%; transform: translateY(-50%); font-size: 60px; }

/* ============ İletişim ============ */
.contact-grid > *, .donate-grid > *, .footer-grid > * { min-width: 0; }
.contact-grid { display: grid; grid-template-columns: 1fr; gap: 44px; }
@media (min-width: 900px) { .contact-grid { grid-template-columns: .8fr 1.2fr; } }
.contact-list { list-style: none; padding: 0; margin: 20px 0 0; }
.contact-list li { padding: 12px 0 12px 36px; position: relative; border-bottom: 1px solid var(--gri-keyline); }
.contact-list li::before { content: "●"; color: var(--sari); position: absolute; left: 6px; }
.contact-list a { color: var(--siyah); font-weight: 600; text-decoration: none; }
.contact-list a:hover { text-decoration: underline; }
.contact-form label { display: block; font-weight: 700; font-size: 14px; margin-bottom: 16px; }
.contact-form input, .contact-form textarea {
  display: block; width: 100%; margin-top: 6px;
  font: inherit; padding: 12px 14px;
  border: 2px solid var(--siyah); border-radius: 0; background: var(--beyaz);
}
.contact-form input:focus, .contact-form textarea:focus {
  outline: 0; box-shadow: 0 0 0 3px var(--sari);
}
.hp-field { position: absolute; left: -9999px; }

/* Gönder satırı: matematik doğrulaması + buton yan yana */
.form-gonder {
  display: flex; align-items: flex-end; gap: 20px; flex-wrap: wrap;
  margin-top: 6px;
}
.captcha-alan { margin-bottom: 0 !important; }
.captcha-etiket { display: block; font-weight: 700; font-size: 14px; margin-bottom: 6px; }
.captcha-satir { display: flex; align-items: center; gap: 10px; }
.captcha-soru {
  font-size: 20px; font-weight: 700; letter-spacing: .04em;
  background: var(--sari); color: var(--siyah);
  border: 2px solid var(--siyah); padding: 10px 14px;
  user-select: none; white-space: nowrap;
}
.contact-form .captcha-satir input {
  width: 92px; margin-top: 0; text-align: center;
  font-size: 18px; font-weight: 700;
}
@media (max-width: 480px) {
  .form-gonder { gap: 14px; }
  .form-gonder .btn { width: 100%; }
}
.alert { padding: 14px 18px; margin-bottom: 18px; font-weight: 600; }
.alert-ok { background: #e2f6ec; border-left: 6px solid var(--teal); }
.alert-err { background: #fdecec; border-left: 6px solid var(--hata); }

/* =====================================================================
   BAĞIŞ — Seçenek C "Renkli ve oyunsu" (20 Eki 2026, kullanıcı onayı)
   Kaynak: _tasarim-onizleme/bagis-sayfasi/c-renkli-oyun.html (<style id="bagis-yeni">).
   Başlık gökyüzü renginde; güneş ve bulut görünür (".gok .page-head" dolgu kuralları GÖKYÜZÜ bölümünde).
   ===================================================================== */

/* ---- Sayfa başlığı: siyah bant yerine gökyüzü; güneş ve bulut geri gelir ---- */
.page-head-donate { background: none; color: inherit; position: relative; }
.page-head-donate::after { content: none; }
.page-head-donate h1 { color: #1b1b1b; }
.page-head-donate h1::after { background: var(--sari); }
.page-head-donate .page-head-sub { color: #333; }
.gok .page-head.page-head-donate { padding-top: 64px; }
@media (min-width: 1024px) { .gok .page-head.page-head-donate { padding: 64px 0 14px; } }
.gok--donate .gok-gunes, .gok--donate .gok-bulut { display: block; }

/* ---- Yerleşim: telefonda form → IBAN → metin (DOM sırası).
   ≥900px: solda form, sağda IBAN kartı; tanıtım metni ikisinin altında, kartsız ve
   tam genişlikte (kullanıcı kararı, 20 Eki 2026) ---- */
.donate-kutular { position: relative; display: grid; grid-template-columns: minmax(0, 1fr); gap: 30px; align-items: stretch; }
.donate-kutular > * { min-width: 0; }
/* kartların köşelerinde konfeti (kabın iç boşluğunda kalır → yatay kaydırma yok) */
.donate-kutular::before, .donate-kutular::after {
  content: ""; position: absolute; z-index: 0; width: 84px; height: 84px; pointer-events: none;
  background: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 96 96'><circle cx='14' cy='20' r='5' fill='%23F2B801'/><circle cx='70' cy='12' r='4' fill='%23029E9C'/><circle cx='46' cy='44' r='3' fill='%23EC7AA2'/><path d='M30 8l8 3-6 6z' fill='%23f3672e' stroke='%231b1b1b' stroke-width='1.4' stroke-linejoin='round'/><path d='M8 54q5-6 10 0t10 0' fill='none' stroke='%234AA8D0' stroke-width='3' stroke-linecap='round'/><path d='M78 40l2.4 5.6 5.6 2.4-5.6 2.4-2.4 5.6-2.4-5.6-5.6-2.4 5.6-2.4z' fill='%23F2B801' stroke='%231b1b1b' stroke-width='1.3' stroke-linejoin='round'/><rect x='52' y='72' width='8' height='8' rx='2' transform='rotate(24 56 76)' fill='%237BBA48'/><circle cx='22' cy='84' r='3.5' fill='%23f3672e'/></svg>") center / contain no-repeat;
}
.donate-kutular::before { top: -34px; left: -14px; }
.donate-kutular::after { right: -12px; bottom: -30px; transform: scale(-1); }   /* döndürme değil ayna: sınır kutusu büyümez, telefonda taşmaz */
.donate-metin { margin: 56px auto 0; }
@media (min-width: 900px) {
  .donate-kutular { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 32px; }
}

.donate-box {
  position: relative; z-index: 1; min-width: 0;
  display: flex; flex-direction: column;
  padding: 30px 22px 26px; border: 0;
  border-radius: 30px 36px 28px 34px / 34px 28px 36px 30px;   /* hafif "elle kesilmiş" köşeler */
}
@media (min-width: 600px) { .donate-box { padding: 36px 36px 32px; } }
/* elle çizilmiş kesikli iç çerçeve */
.donate-box::before {
  content: ""; position: absolute; inset: 9px; pointer-events: none;
  border: 2.5px dashed; border-radius: 23px 29px 21px 27px / 27px 21px 29px 23px;
}
.donate-box h2 { margin: 0 0 16px; }

/* =========================== FORM KARTI =========================== */
.donate-online {
  color: #1b1b1b;
  background: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 112'><g fill='none' stroke-linecap='round' stroke-width='3'><path d='M44 74q6-7 12 0t12 0' stroke='%23029E9C'/><path d='M560 34q6-7 12 0t12 0' stroke='%23f3672e'/><path d='M120 92q5-6 10 0t10 0' stroke='%23EC7AA2'/><path d='M488 88q5-6 10 0t10 0' stroke='%237BBA48'/></g><g stroke='%231b1b1b' stroke-width='1.6' stroke-linejoin='round'><path d='M98 22l9 4-7 7z' fill='%23F2B801'/><path d='M532 70l10 1-5 9z' fill='%234AA8D0'/><path d='M28 32l7 6-8 4z' fill='%23f3672e'/><path d='M606 76l8-3 1 9z' fill='%23029E9C'/><rect x='170' y='84' width='9' height='9' rx='2' transform='rotate(20 174 88)' fill='%237BBA48'/><rect x='462' y='22' width='9' height='9' rx='2' transform='rotate(-18 466 26)' fill='%23EC7AA2'/></g><g><circle cx='72' cy='40' r='4' fill='%234AA8D0'/><circle cx='150' cy='54' r='3.5' fill='%23f3672e'/><circle cx='14' cy='88' r='3' fill='%23F2B801'/><circle cx='182' cy='20' r='3' fill='%23029E9C'/><circle cx='584' cy='92' r='4' fill='%23F2B801'/><circle cx='512' cy='44' r='3.5' fill='%23029E9C'/><circle cx='626' cy='24' r='3' fill='%23EC7AA2'/><circle cx='458' cy='96' r='3' fill='%23f3672e'/></g><g fill='%23F2B801' stroke='%231b1b1b' stroke-width='1.4' stroke-linejoin='round'><path d='M164 30l2.6 6.4 6.4 2.6-6.4 2.6-2.6 6.4-2.6-6.4-6.4-2.6 6.4-2.6z'/><path d='M478 52l2.4 5.6 5.6 2.4-5.6 2.4-2.4 5.6-2.4-5.6-5.6-2.4 5.6-2.4z' fill='%23f3672e'/><path d='M290 14l2 4.6 4.6 2-4.6 2-2 4.6-2-4.6-4.6-2 4.6-2z' fill='%234AA8D0'/></g><path d='M350 98c12-8 22 3 33-2s21-9 33-2' fill='none' stroke='%23f3672e' stroke-width='6' stroke-linecap='round'/><path d='M352 106c10-5 19 2 28-1' fill='none' stroke='%23F2B801' stroke-width='4' stroke-linecap='round'/><g fill='none' stroke='%231b1b1b' stroke-width='1.5' stroke-linecap='round'><path d='M206 63c4 14 14 22 30 39M234 54c0 16 2 30 2 48M262 65c-6 14-14 22-26 37'/></g><path d='M236 102l-7-4v8zm0 0l7-4v8z' fill='%23f3672e' stroke='%231b1b1b' stroke-width='1.3' stroke-linejoin='round'/><g stroke='%231b1b1b' stroke-width='2.2'><ellipse cx='206' cy='44' rx='15' ry='19' fill='%23f3672e'/><ellipse cx='262' cy='46' rx='15' ry='19' fill='%234AA8D0'/><ellipse cx='234' cy='34' rx='16' ry='20' fill='%23F2B801'/></g><path d='M206 63l-3 4h6zM234 54l-3 4h6zM262 65l-3 4h6z' fill='%231b1b1b'/><path d='M198 38a8 10 0 0 1 4-7M226 28a8 10 0 0 1 4-7M254 40a8 10 0 0 1 4-7' fill='none' stroke='%23fff' stroke-width='2.5' stroke-linecap='round' opacity='.85'/><path d='M228 34q2-2.6 4 0M236 34q2-2.6 4 0M230 40q4 4 8 0' fill='none' stroke='%231b1b1b' stroke-width='1.8' stroke-linecap='round'/><g transform='translate(289 22) scale(.98)'><path d='M32 55C19 46 7 37 7 23.5 7 16 12.6 10.5 19.5 10.5c5.4 0 9.6 3 12.5 7.4 2.9-4.4 7.1-7.4 12.5-7.4C51.4 10.5 57 16 57 23.5 57 37 45 46 32 55z' fill='%23f3672e' stroke='%231b1b1b' stroke-width='2.5' stroke-linejoin='round'/><path d='M14 22a7 7 0 0 1 5.5-6' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' opacity='.85'/><path d='M23.5 28q2.5-3.2 5 0M35.5 28q2.5-3.2 5 0M26 35q6 6.5 12 0' fill='none' stroke='%231b1b1b' stroke-width='2.5' stroke-linecap='round'/><circle cx='21' cy='34' r='2.8' fill='%23FFC4AA'/><circle cx='43' cy='34' r='2.8' fill='%23FFC4AA'/></g><g transform='translate(392 72) rotate(40)' stroke='%231b1b1b' stroke-width='2' stroke-linejoin='round'><path d='M-6 -16L-4.5 -62Q0 -68 4.5 -62L6 -16Z' fill='%23029E9C'/><path d='M-2 -58v30' stroke='%23fff' stroke-width='2' stroke-linecap='round' opacity='.7'/><rect x='-8' y='-17' width='16' height='15' rx='2.5' fill='%23FFF1E2'/><path d='M-8 -10h16' stroke-width='1.5'/><path d='M-7.5 -2C-7.5 9 -3 17 0 22C3 17 7.5 9 7.5 -2Z' fill='%23f3672e'/></g></svg>") center 22px / auto 92px no-repeat, #FFF3E6;
  padding-top: 122px;
  box-shadow: 0 28px 46px -30px rgba(166, 61, 16, .55), 0 3px 0 rgba(166, 61, 16, .07);
}
.donate-online::before { border-color: rgba(243, 103, 46, .5); }
.donate-online > h2 {
  width: fit-content; max-width: 100%; margin: 0 auto 20px; text-align: center;
  font-family: var(--font-script); font-weight: 700; font-size: 48px; line-height: 1; color: #1b1b1b;
}
.donate-online > h2::after {
  content: ""; display: block; height: 8px; margin-top: 6px; background: var(--sari);
  -webkit-mask: var(--firca-mask) repeat-x 0 100% / 300px 100%;
          mask: var(--firca-mask) repeat-x 0 100% / 300px 100%;
}

/* ---- Sekmeler: şeftali yuvada hap düğmeler; seçili = dolu koyu turkuaz hap ---- */
.donate-sekmeler {
  display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 4px;
  margin: 0 0 20px; padding: 5px;
  background: #FBE1C8; border-radius: 999px; box-shadow: inset 0 2px 0 rgba(166, 61, 16, .12);
}
.donate-sekme {
  font: inherit; font-size: 16px; font-weight: 700; line-height: 1.2; letter-spacing: 0;
  min-height: 46px; padding: 10px 8px; cursor: pointer;
  background: transparent; color: #6E3412; border: 0; border-radius: 999px;
  transition: background-color .2s, color .2s, box-shadow .2s;
}
.donate-sekme:hover { background: rgba(255, 255, 255, .7); }
.donate-sekme.is-active {
  background: #0E6E6D; color: #fff;
  box-shadow: 0 3px 0 #094847, 0 8px 14px -8px rgba(14, 110, 109, .8);
}
.donate-sekme:focus-visible { outline: 3px solid var(--focus-mavi); outline-offset: 3px; position: relative; z-index: 1; }

/* ---- Paneller (JS yalnız hidden'ı değiştirir) ---- */
.donate-panel { container-type: inline-size; }
.donate-panel[hidden] { display: none; }
.donate-slogan {
  display: flex; align-items: center; gap: 8px; margin: 0 0 2px;
  font-family: var(--font-script); font-weight: 700; font-size: 34px; line-height: 1.05; color: #A63D10;
}
.donate-slogan::before { content: ""; flex: none; width: 30px; height: 30px; background: var(--ikon-kalp) center / contain no-repeat; }
.donate-giris { margin: 0 0 4px; font-family: var(--font-el); font-size: 17px; line-height: 1.45; color: #5A4334; }

/* ---- Tutar çıkartmaları: dört marka renginde tombul "sticker" ----
   Telefonda 2×2; panel ≥520px ise hepsi tek satır (2 seçenek → 2 geniş çıkartma). */
.donate-tutarlar {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 12px;
  margin: 14px 0 20px; padding: 6px 4px 0;
}
@container (min-width: 520px) {
  .donate-tutarlar { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 14px; }
  .donate-tutarlar:has(> :nth-child(5)) { grid-auto-flow: row; grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
.donate-tutar {
  --st: #F3672E; --st-koyu: #A63D10; --egim: -1deg;
  position: relative; display: flex; flex-direction: column; justify-content: flex-start; gap: 5px;
  min-width: 0; min-height: 96px; padding: 12px 14px 14px;
  font: inherit; color: #1b1b1b; text-align: left; letter-spacing: 0; cursor: pointer;
  background: var(--st); border: 3px solid #fff; border-radius: 22px;
  box-shadow: 0 4px 0 var(--st-koyu), 0 14px 20px -12px var(--st-koyu);
  transform: rotate(var(--egim));
  transition: transform .25s cubic-bezier(.3, 1.5, .5, 1), box-shadow .25s;
  overflow-wrap: anywhere; -webkit-tap-highlight-color: transparent;
}
.donate-tutar:nth-child(4n+2) { --st: #23A8A7; --st-koyu: #05615F; --egim: 1deg; }
.donate-tutar:nth-child(4n+3) { --st: #F2B801; --st-koyu: #8A6500; --egim: .8deg; }
.donate-tutar:nth-child(4n+4) { --st: #4AA8D0; --st-koyu: #1A5E7F; --egim: -.8deg; }
/* parlama çizgisi (simgelerdeki beyaz yay gibi) */
.donate-tutar::before {
  content: ""; position: absolute; top: 10px; right: 12px; width: 20px; height: 12px;
  border-top: 3px solid rgba(255, 255, 255, .9); border-radius: 50% 50% 0 0 / 100% 100% 0 0;
  transform: rotate(28deg);
}
.donate-tutar .tutar-rakam { font-family: var(--font-script); font-weight: 700; font-size: 38px; line-height: .9; }
.donate-tutar .tutar-ad { font-size: 13.5px; font-weight: 700; line-height: 1.25; }
@media (hover: hover) {
  .donate-tutar:hover { transform: rotate(calc(var(--egim) * -3)) translateY(-3px); box-shadow: 0 6px 0 var(--st-koyu), 0 18px 24px -12px var(--st-koyu); }
}
.donate-tutar:active { transform: translateY(3px); box-shadow: 0 1px 0 var(--st-koyu), 0 6px 10px -8px var(--st-koyu); }
/* SEÇİLİ: koyu turkuaz dış halka + köşede ✓ rozeti + kalkık duruş + bir kez zıplama (renkten bağımsız) */
.donate-tutar.is-active, .donate-tutar.is-active:hover {
  background: var(--st); color: #1b1b1b;
  transform: translateY(-4px) scale(1.04);
  box-shadow: 0 0 0 3.5px #0E6E6D, 0 6px 0 3.5px #0E6E6D, 0 20px 26px -10px rgba(14, 110, 109, .7);
  animation: sticker-zipla .5s cubic-bezier(.3, 1.6, .5, 1);
}
.donate-tutar.is-active::before { display: none; }
.donate-tutar.is-active::after {
  content: ""; position: absolute; top: -13px; right: -11px; width: 34px; height: 34px;
  border-radius: 50%; border: 3px solid #0E6E6D;
  background: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M5.5 12.5l4.2 4.2L18.5 7.5' fill='none' stroke='%231b1b1b' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'/></svg>") center / 22px no-repeat, #fff;
  box-shadow: 0 3px 8px rgba(14, 110, 109, .45); transform: rotate(10deg);
}
.donate-tutar:focus-visible { outline: 3px solid var(--focus-mavi); outline-offset: 5px; z-index: 1; }
@keyframes sticker-zipla {
  0%   { transform: scale(.94); }
  45%  { transform: translateY(-9px) scale(1.08) rotate(-2deg); }
  100% { transform: translateY(-4px) scale(1.04); }
}

/* ---- Seçilen paketin açıklaması: konuşma balonu ---- */
.donate-not {
  position: relative; margin: 0 0 20px; padding: 12px 16px 12px 52px;
  min-height: calc(3 * 1.45em + 28px);
  background: #fff; border: 2px solid #F6CDB4; border-radius: 18px;
  font-family: var(--font-el); font-size: 16.5px; line-height: 1.45; color: #4A3426;
}
@container (min-width: 520px) { .donate-not { min-height: calc(2 * 1.45em + 28px); } }
.donate-not::before {   /* balon kuyruğu (çıkartmalara bakar) */
  content: ""; position: absolute; top: -10px; left: 30px; width: 16px; height: 16px;
  background: #fff; border-left: 2px solid #F6CDB4; border-top: 2px solid #F6CDB4;
  border-radius: 4px 0 0 0; transform: rotate(45deg);
}
.donate-not::after {
  content: ""; position: absolute; left: 13px; top: 11px; width: 28px; height: 28px;
  background: var(--ikon-yildiz) center / contain no-repeat;
}

/* ---- "Diğer": serbest tutar kutusu ---- */
.donate-diger {
  display: flex; align-items: center; flex-wrap: wrap; gap: 8px 12px; margin: -4px 0 18px;
  font-family: var(--font-el); font-size: 19px; font-weight: 700; color: #1b1b1b;
}
.donate-diger[hidden] { display: none; }
.donate-diger-kutu {
  display: inline-flex; align-items: center; min-height: 56px;
  background: #F6FBFD; border: 2px solid #648F9E; border-radius: 18px; box-shadow: 0 10px 18px -12px rgba(26, 94, 127, .7);
  transition: border-color .2s, box-shadow .2s, background-color .2s;
}
.donate-diger-kutu:focus-within { outline: 2px solid transparent; border-color: #0E6E6D; background: #fff; box-shadow: 0 0 0 2px #0E6E6D, 0 0 0 6px rgba(35, 168, 167, .28); }
.donate-diger-kutu input {
  width: 8ch; border: 0; background: transparent; color: #1b1b1b;
  font: inherit; font-family: var(--font-govde); font-size: 24px; font-weight: 800; letter-spacing: 0;
  padding: 8px 4px 8px 16px;
}
.donate-diger-kutu input::placeholder { color: #7A6253; opacity: 1; }
.donate-diger-kutu input:focus { outline: none; }
.donate-diger-kutu span { padding-right: 16px; font-family: var(--font-govde); font-size: 24px; font-weight: 800; color: #0E6E6D; }

.donate-aylik-not { margin: -6px 0 20px; font-size: 14.5px; line-height: 1.5; color: #5A4334; }
.donate-aylik-not a { color: #0E6E6D; font-weight: 700; white-space: nowrap; text-underline-offset: 3px; }
.donate-aylik-not a:focus-visible { outline: 3px solid var(--focus-mavi); outline-offset: 2px; border-radius: 4px; }

/* ---- Bağışçı bilgileri: giriş ekranındaki yuvarlak alanlar ---- */
.donate-form { display: flex; flex-direction: column; flex: 1; container-type: inline-size; }
.donate-bal { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.donate-kisi { display: grid; gap: 14px; margin: 0 0 22px; }
@container (min-width: 520px) {
  .donate-kisi { grid-template-columns: 1fr 1fr; column-gap: 16px; }
  .donate-kisi .donate-onay { grid-column: 1 / -1; }
}
.donate-kisi label { display: flex; flex-direction: column; gap: 6px; font-size: 15px; font-weight: 700; color: #3A2A20; }
.donate-kisi input[type="text"], .donate-kisi input[type="email"] {
  width: 100%; min-height: 52px; padding: 12px 16px;
  font: inherit; font-size: 16.5px; font-weight: 500; letter-spacing: 0;
  background: #fff; color: #1b1b1b; border: 2px solid #648F9E; border-radius: 18px;
  box-shadow: inset 0 2px 0 rgba(166, 61, 16, .05);
  transition: border-color .15s, box-shadow .15s;
}
.donate-kisi input[type="text"]:focus, .donate-kisi input[type="email"]:focus {
  outline: none; border-color: #0E6E6D;
  box-shadow: 0 0 0 2px #0E6E6D, 0 0 0 6px rgba(35, 168, 167, .28);
}
.donate-kisi .donate-onay {
  flex-direction: row; align-items: flex-start; gap: 10px;
  font-size: 14.5px; font-weight: 600; line-height: 1.45; cursor: pointer;
}
.donate-onay input { width: 22px; height: 22px; margin: 0; flex: none; accent-color: #0E6E6D; cursor: pointer; }
.donate-onay input:focus-visible { outline: 3px solid var(--focus-mavi); outline-offset: 2px; }

/* ---- Gönder: giriş ekranındaki turuncu 3B hap ---- */
.donate-gonder {
  display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 4px 14px;
  width: 100%; min-height: 62px; margin-top: auto; padding: 12px 24px 14px;
  font: inherit; color: #fff; text-align: center; letter-spacing: 0; cursor: pointer;
  background: linear-gradient(180deg, #F06A2E 0%, #DC5419 20%, #CB4912 38%, #C4440E 64%, #B33C0A 100%);
  border: 0; border-radius: 999px;
  box-shadow: inset 0 2px 0 rgba(255, 255, 255, .24), 0 5px 0 #A3360A, 0 14px 24px rgba(190, 64, 12, .28);
  transition: transform .15s, box-shadow .15s;
}
.donate-gonder > span:first-child { font-family: var(--font-el); font-size: 23px; font-weight: 700; line-height: 1.1; }
.donate-kilit {
  padding: 4px 11px; border-radius: 999px; background: rgba(0, 0, 0, .16);
  font-size: 14px; font-weight: 700; line-height: 1.2; white-space: nowrap;
}
.donate-gonder:hover { color: #fff; background: linear-gradient(180deg, #F06A2E 0%, #DC5419 20%, #CB4912 38%, #C4440E 64%, #B33C0A 100%); transform: translateY(-1px); box-shadow: inset 0 2px 0 rgba(255, 255, 255, .24), 0 6px 0 #A3360A, 0 18px 28px rgba(190, 64, 12, .32); }
.donate-gonder:active { transform: translateY(3px); box-shadow: inset 0 2px 0 rgba(255, 255, 255, .2), 0 2px 0 #A3360A, 0 6px 12px rgba(190, 64, 12, .25); }
.donate-gonder:focus-visible { outline: 3px solid var(--focus-mavi); outline-offset: 5px; }
.donate-gonder.is-busy { opacity: .75; cursor: progress; }

.donate-gizlilik { margin: 18px 0 0; font-size: 13px; line-height: 1.5; color: #5A4334; }
.donate-gizlilik a { color: #0E6E6D; font-weight: 700; text-underline-offset: 2px; }
.donate-gizlilik a:focus-visible { outline: 3px solid var(--focus-mavi); outline-offset: 2px; border-radius: 3px; }
.donate-uyari {
  position: relative; margin: 14px 0 0; padding: 10px 14px 10px 46px;
  font-size: 14.5px; font-weight: 600; line-height: 1.4; color: #7A1F40;
  background: #FDE3EC; border: 2px solid #EC7AA2; border-radius: 16px;
}
.donate-uyari::before {
  content: "!"; position: absolute; left: 12px; top: 9px; width: 24px; height: 24px;
  display: grid; place-items: center; border-radius: 50%;
  background: #952A50; color: #fff; font-size: 15px; font-weight: 800; line-height: 1;
}
.donate-uyari[hidden] { display: none; }

/* ---- Stripe dönüş mesajları (kartın en üstünde) ---- */
.donate-durum {
  position: relative; margin: 0 0 18px; padding: 14px 16px 14px 62px; min-height: 64px;
  font-size: 15px; line-height: 1.45; color: #1b1b1b;
  background: #FFF2C4; border: 2px solid #F2B801; border-radius: 20px;
}
.donate-durum::before {
  content: ""; position: absolute; left: 12px; top: 12px; width: 38px; height: 38px; border-radius: 50%;
  background: var(--ikon-ampul) center / 30px no-repeat, #fff;
}
.donate-durum p { margin: 4px 0 0; }
.donate-durum strong { display: block; font-family: var(--font-el); font-size: 24px; font-weight: 700; line-height: 1.2; color: #05615F; }
.donate-durum-ok { background: #DCF3F1; border-color: #23A8A7; }
.donate-durum-ok::before { background: var(--ikon-kalp) center / 30px no-repeat, #fff; }
.donate-durum-hata { background: #FDE3EC; border-color: #EC7AA2; color: #7A1F40; font-weight: 600; }
.donate-durum-hata::before {
  content: "!"; display: grid; place-items: center; background: #952A50; color: #fff;
  font-size: 22px; font-weight: 800; line-height: 1;
}

/* ---- Ödeme yöntemi rozetleri: beyaz tepside (marka renkleri korunur) ---- */
.donate-odeme {
  display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 8px;
  margin-top: 20px; padding: 12px;
  background: #fff; border: 2px dashed #F6CDB4; border-radius: 18px;
}
.odeme-rozet {
  display: inline-flex; align-items: center; justify-content: center;
  height: 30px; min-width: 48px; padding: 0 8px;
  background: #fff; border: 1px solid rgba(0, 0, 0, .16); border-radius: 7px;
  font-size: 13px; font-weight: 800; letter-spacing: .02em; line-height: 1;
}
.odeme-visa { color: #1434cb; font-style: italic; font-size: 15px; letter-spacing: .04em; }
.odeme-mc i { width: 17px; height: 17px; border-radius: 50%; display: block; }
.odeme-mc i:first-child { background: #eb001b; }
.odeme-mc i:last-child { background: #f79e1b; margin-left: -7px; mix-blend-mode: multiply; }
.odeme-bancontact { color: #1e3764; font-size: 12px; font-weight: 800; letter-spacing: -.01em; }
.odeme-bancontact b { color: #0090d0; }
.odeme-apple { background: #000; border-color: #000; color: #fff; font-size: 12px; font-weight: 600; letter-spacing: 0; }
.odeme-google { color: #3c4043; font-size: 13px; font-weight: 600; letter-spacing: 0; }
.odeme-google b { color: #4285f4; font-weight: 800; }
.odeme-amex { background: #006fcf; border-color: #006fcf; color: #fff; flex-direction: column; gap: 1px; padding: 0 6px; }
.odeme-amex b { font-size: 8px; font-weight: 800; letter-spacing: .06em; line-height: 1.1; }
/* SEPA: lacivert rozet, beyaz italik yazı, sarı € */
.odeme-sepa { background: #10298e; border-color: #10298e; color: #fff; font-size: 13px; font-style: italic; letter-spacing: .03em; }
.odeme-sepa b { color: #ffcc00; }
.donate-guvence {
  position: relative; margin: 12px 0 0; padding-left: 24px;
  font-size: 12.5px; line-height: 1.5; color: #5A4334;
}
.donate-guvence::before { content: "🔒"; position: absolute; left: 0; top: 0; font-size: 13px; }

/* =========================== IBAN KARTI: turkuaz "kumbara" =========================== */
.donate-box:not(.donate-online) {
  color: #fff; overflow: hidden; padding-bottom: 0;
  background:
    radial-gradient(rgba(255, 255, 255, .05) 1.6px, transparent 2.2px) 0 0 / 18px 18px,
    linear-gradient(165deg, #0F7372 0%, #0E6E6D 40%, #0A5857 100%);
  box-shadow: 0 28px 46px -30px rgba(5, 60, 60, .85), 0 3px 0 rgba(5, 60, 60, .1);
}
.donate-box:not(.donate-online)::before { border-color: rgba(255, 255, 255, .38); }
.donate-box:not(.donate-online) > h2 {
  display: flex; align-items: center; gap: 14px; margin: 0 0 14px;
  font-family: var(--font-script); font-weight: 700; font-size: 48px; line-height: 1; color: #fff;
}
.donate-box:not(.donate-online) > h2::before {
  content: ""; flex: none; width: 64px; height: 64px; border-radius: 50%;
  background: var(--ikon-bina) center / 46px no-repeat, #fff;
  box-shadow: 0 0 0 4px rgba(255, 255, 255, .2); transform: rotate(-6deg);
}
.donate-row {
  display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; gap: 4px 12px;
  margin: 0; padding: 11px 0 13px; border-bottom: 2px dashed rgba(255, 255, 255, .28);
}
.donate-row > span {
  flex: 0 0 100%; font-size: 12.5px; font-weight: 700; line-height: 1.3;
  letter-spacing: .07em; text-transform: uppercase; color: #E2F7F4;
}
.donate-row > strong {
  flex: 1 1 auto; min-width: 0; font-size: 19px; font-weight: 700; line-height: 1.3;
  word-break: normal; overflow-wrap: anywhere;   /* adres boşluklardan kırılır, harf ortasından değil */
}
.donate-row-ince > strong { font-size: 16.5px; font-weight: 600; }
/* IBAN satırı: krem "bilet" (yan çentikli), büyük ve kopyalanabilir */
.donate-iban {
  margin: 6px -6px 6px; padding: 12px 18px 14px; border: 0; border-radius: 16px;
  background: #FFF3E6; color: #0B4F4E;
  -webkit-mask: radial-gradient(circle at 0 50%, transparent 9px, #000 9.5px) left / 51% 100% no-repeat,
                radial-gradient(circle at 100% 50%, transparent 9px, #000 9.5px) right / 51% 100% no-repeat;
          mask: radial-gradient(circle at 0 50%, transparent 9px, #000 9.5px) left / 51% 100% no-repeat,
                radial-gradient(circle at 100% 50%, transparent 9px, #000 9.5px) right / 51% 100% no-repeat;
}
.donate-iban > span { color: #0E6E6D; }
.donate-iban > strong { font-size: 23px; font-weight: 800; letter-spacing: .03em; font-variant-numeric: tabular-nums; text-wrap: balance; }   /* sığmazsa 2+2 grup */
/* Kopyala düğmeleri */
.donate-kopyala {
  display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 6px 14px 6px 11px;
  font: inherit; font-family: var(--font-el); font-size: 16px; font-weight: 700; line-height: 1; letter-spacing: 0;
  color: #1b1b1b; background: #F2B801; border: 0; border-radius: 999px;
  box-shadow: inset 0 2px 0 rgba(255, 255, 255, .35), 0 3px 0 #B58800, 0 8px 14px -8px rgba(0, 0, 0, .45); cursor: pointer; white-space: nowrap;
  transition: transform .15s, box-shadow .15s, background-color .15s;
}
.donate-kopyala span { font: inherit; text-transform: none; letter-spacing: 0; }
.donate-kopyala::before {
  content: ""; flex: none; width: 18px; height: 18px; background: currentColor;
  -webkit-mask: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><rect x='8.5' y='8.5' width='12' height='12' rx='3' fill='none' stroke='%23000' stroke-width='2.3'/><path d='M15.5 5.6V5.5a2 2 0 0 0-2-2h-8a2 2 0 0 0-2 2v8a2 2 0 0 0 2 2h.1' fill='none' stroke='%23000' stroke-width='2.3' stroke-linecap='round'/></svg>") center / contain no-repeat;
          mask: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><rect x='8.5' y='8.5' width='12' height='12' rx='3' fill='none' stroke='%23000' stroke-width='2.3'/><path d='M15.5 5.6V5.5a2 2 0 0 0-2-2h-8a2 2 0 0 0-2 2v8a2 2 0 0 0 2 2h.1' fill='none' stroke='%23000' stroke-width='2.3' stroke-linecap='round'/></svg>") center / contain no-repeat;
}
.donate-kopyala.is-kopyalandi { background: #fff; box-shadow: 0 3px 0 #9FC9C4, 0 8px 14px -8px rgba(0, 0, 0, .45); }
.donate-kopyala.is-secildi { background: #FFF2C4; white-space: normal; text-align: left; line-height: 1.15; flex: 0 1 auto; max-width: 100%; }
.donate-kopyala.is-kopyalandi::before {
  -webkit-mask-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M5.5 12.5l4.2 4.2L18.5 7.5' fill='none' stroke='%231b1b1b' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'/></svg>");
          mask-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M5.5 12.5l4.2 4.2L18.5 7.5' fill='none' stroke='%231b1b1b' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'/></svg>");
}
@media (hover: hover) { .donate-kopyala:hover { transform: translateY(-1px) rotate(-2deg); } }
.donate-kopyala:active { transform: translateY(2px); box-shadow: 0 1px 0 #B58800; }
.donate-kopyala:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
.donate-iban .donate-kopyala:focus-visible { outline-color: var(--focus-mavi); }
/* "Açıklama…" notu: bantlı sarı yapışkan not */
.donate-note {
  position: relative; margin: 22px 4px 12px; padding: 16px 16px 14px;
  background: #FFF2C4; color: #1b1b1b; border-radius: 6px 6px 18px 6px;
  font-family: var(--font-el); font-size: 17px; font-style: normal; line-height: 1.4;
  transform: rotate(-1.2deg); box-shadow: 0 10px 16px -10px rgba(0, 0, 0, .55);
}
.donate-note::before {
  content: ""; position: absolute; top: -9px; left: 50%; width: 72px; height: 18px; margin-left: -36px;
  background: rgba(255, 255, 255, .6); border-radius: 3px; transform: rotate(3deg);
}
/* kartın dibinde kumbara sahnesi (kartın tek çizimi) */
.donate-box:not(.donate-online)::after {
  content: ""; display: block; flex: 1 0 176px; margin: 0 -22px;
  background:
    url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 176'><g fill='none' stroke='%23fff' stroke-width='2.4' stroke-linecap='round' opacity='.75'><path d='M70 84v10M65 89h10'/><path d='M262 30v10M257 35h10'/><path d='M108 22v8M104 26h8'/></g><g stroke='%231b1b1b' stroke-width='1.8' stroke-linejoin='round'><path d='M92 66c-5-4-10-7.5-10-12 0-3 2.3-5.2 5-5.2 2.2 0 3.8 1.3 5 3 1.2-1.7 2.8-3 5-3 2.7 0 5 2.2 5 5.2 0 4.5-5 8-10 12z' fill='%23f3672e'/><path d='M246 70c-4-3.2-8-6-8-9.6 0-2.4 1.8-4.2 4-4.2 1.8 0 3 1 4 2.4 1-1.4 2.2-2.4 4-2.4 2.2 0 4 1.8 4 4.2 0 3.6-4 6.4-8 9.6z' fill='%23F2B801'/></g><ellipse cx='163' cy='158' rx='62' ry='6' fill='%23000' opacity='.18'/><g stroke='%231b1b1b' stroke-width='2.6' stroke-linejoin='round'><rect x='118' y='128' width='17' height='30' rx='7' fill='%23F48FB1'/><rect x='140' y='132' width='17' height='27' rx='7' fill='%23F48FB1'/><rect x='172' y='132' width='17' height='27' rx='7' fill='%23F48FB1'/><rect x='194' y='128' width='17' height='30' rx='7' fill='%23F48FB1'/><path d='M104 102c-10-3-15 6-9 10 5 3 9-4 3-7' fill='none' stroke-linecap='round'/><ellipse cx='162' cy='104' rx='62' ry='45' fill='%23F9AFC8'/><path d='M176 66l8-22 16 19z' fill='%23F48FB1'/><ellipse cx='222' cy='110' rx='14' ry='16' fill='%23F48FB1'/></g><rect x='138' y='62' width='28' height='6' rx='3' fill='%231b1b1b'/><ellipse cx='218' cy='108' rx='2.4' ry='3.8' fill='%231b1b1b'/><ellipse cx='227' cy='108' rx='2.4' ry='3.8' fill='%231b1b1b'/><path d='M190 92q5-6 10 0M200 132q9 6 18-1' fill='none' stroke='%231b1b1b' stroke-width='2.6' stroke-linecap='round'/><circle cx='196' cy='112' r='6' fill='%23EC6A96' opacity='.55'/><path d='M116 92a42 36 0 0 1 22-24' fill='none' stroke='%23fff' stroke-width='4' stroke-linecap='round' opacity='.8'/><g fill='none' stroke='%23fff' stroke-width='2.4' stroke-linecap='round' opacity='.8'><path d='M144 10v7M152 6v9M160 10v7'/></g><g stroke='%231b1b1b' stroke-width='2.4'><circle cx='152' cy='36' r='13' fill='%23F2B801'/><ellipse cx='204' cy='38' rx='5' ry='11' fill='%23F2B801' transform='rotate(22 204 38)'/></g><circle cx='152' cy='36' r='7.5' fill='none' stroke='%23B98A00' stroke-width='2'/><path d='M145 31a8 8 0 0 1 5-4' fill='none' stroke='%23fff' stroke-width='2.2' stroke-linecap='round' opacity='.85'/></svg>") center bottom 4px / auto 150px no-repeat,
    url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 60'><path d='M0 26C60 8 120 10 200 22S330 34 400 26V60H0Z' fill='%231E9A93'/><path d='M0 40C70 30 140 36 210 42S340 46 400 40V60H0Z' fill='%2391D5C6'/><g transform='translate(52 40)'><path d='M0 0V-9' stroke='%230E6E6D' stroke-width='2' stroke-linecap='round'/><g fill='%23fff'><circle cy='-13' r='3'/><circle cx='3.6' cy='-10.4' r='3'/><circle cx='2.2' cy='-6.6' r='3'/><circle cx='-2.2' cy='-6.6' r='3'/><circle cx='-3.6' cy='-10.4' r='3'/></g><circle cy='-9.4' r='2.3' fill='%23F2B801'/></g><g transform='translate(318 44)'><path d='M0 0V-9' stroke='%230E6E6D' stroke-width='2' stroke-linecap='round'/><g fill='%23F2B801'><circle cy='-13' r='3'/><circle cx='3.6' cy='-10.4' r='3'/><circle cx='2.2' cy='-6.6' r='3'/><circle cx='-2.2' cy='-6.6' r='3'/><circle cx='-3.6' cy='-10.4' r='3'/></g><circle cy='-9.4' r='2.3' fill='%23f3672e'/></g><g transform='translate(250 44)'><path d='M0 0V-8' stroke='%230E6E6D' stroke-width='2' stroke-linecap='round'/><path d='M-4.5-10V-17L-2.2-14.8L0-18L2.2-14.8L4.5-17V-10Q4.5-7 0-7Q-4.5-7-4.5-10Z' fill='%23f3672e'/></g></svg>") left -30px bottom / 400px 60px repeat-x;
}
@media (min-width: 600px) {
  .donate-box:not(.donate-online)::after { flex-basis: 214px; margin: 0 -36px; background-size: auto 182px, 400px 60px; }
}
@media (min-width: 900px) {
  .donate-row:not(.donate-iban) { padding: 13px 0 15px; }
  .donate-row > strong { font-size: 20px; }
  .donate-iban { margin-top: 10px; margin-bottom: 10px; padding-top: 14px; padding-bottom: 16px; }
}

/* yan yana düzende kart formun boyuna uzar: kumbaranın üstündeki turkuaz gökyüzüne iki bulut ve sıcak hava balonu */
@media (min-width: 900px) {
  .donate-box:not(.donate-online)::after {
    flex-basis: 260px;
    background:
      url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 58 86'><g transform='translate(1 1)' stroke='%231b1b1b' stroke-width='1.8' stroke-linejoin='round'><path d='M28 2C12 2 2 14 2 28c0 16 14 26 20 36h12c6-10 20-20 20-36C54 14 44 2 28 2Z' fill='%23f3672e'/><path d='M28 2c-8 0-12 12-12 26 0 16 6 26 8 36h8c2-10 8-20 8-36 0-14-4-26-12-26Z' fill='%23FFF1E2'/><path d='M28 2c-3 0-4.5 12-4.5 26 0 16 2.5 26 3 36h3c.5-10 3-20 3-36 0-14-1.5-26-4.5-26Z' fill='%23F2B801'/><path d='M23 64l1 8M33 64l-1 8' fill='none'/><rect x='21' y='72' width='14' height='10' rx='2' fill='%23F2B801'/></g><path d='M10 22a14 18 0 0 1 6-12' fill='none' stroke='%23fff' stroke-width='2.4' stroke-linecap='round' opacity='.8'/></svg>") left 64% top 6% / 50px auto no-repeat,
      url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='14 3 166 83'><g id='a'><circle cx='38' cy='62' r='18'/><circle cx='72' cy='46' r='27'/><circle cx='114' cy='40' r='31'/><circle cx='152' cy='58' r='22'/><rect x='38' y='50' width='114' height='30'/></g><use href='%23a' fill='%239FD3D6' stroke='%239FD3D6' stroke-width='6'/><use href='%23a' fill='%23fff'/></svg>") left 13% top 30% / 84px auto no-repeat,
      url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='14 3 166 83'><g id='a'><circle cx='38' cy='62' r='18'/><circle cx='72' cy='46' r='27'/><circle cx='114' cy='40' r='31'/><circle cx='152' cy='58' r='22'/><rect x='38' y='50' width='114' height='30'/></g><use href='%23a' fill='%239FD3D6' stroke='%239FD3D6' stroke-width='6'/><use href='%23a' fill='%23fff'/></svg>") right 11% top 52% / 60px auto no-repeat,
      url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 176'><g fill='none' stroke='%23fff' stroke-width='2.4' stroke-linecap='round' opacity='.75'><path d='M70 84v10M65 89h10'/><path d='M262 30v10M257 35h10'/><path d='M108 22v8M104 26h8'/></g><g stroke='%231b1b1b' stroke-width='1.8' stroke-linejoin='round'><path d='M92 66c-5-4-10-7.5-10-12 0-3 2.3-5.2 5-5.2 2.2 0 3.8 1.3 5 3 1.2-1.7 2.8-3 5-3 2.7 0 5 2.2 5 5.2 0 4.5-5 8-10 12z' fill='%23f3672e'/><path d='M246 70c-4-3.2-8-6-8-9.6 0-2.4 1.8-4.2 4-4.2 1.8 0 3 1 4 2.4 1-1.4 2.2-2.4 4-2.4 2.2 0 4 1.8 4 4.2 0 3.6-4 6.4-8 9.6z' fill='%23F2B801'/></g><ellipse cx='163' cy='158' rx='62' ry='6' fill='%23000' opacity='.18'/><g stroke='%231b1b1b' stroke-width='2.6' stroke-linejoin='round'><rect x='118' y='128' width='17' height='30' rx='7' fill='%23F48FB1'/><rect x='140' y='132' width='17' height='27' rx='7' fill='%23F48FB1'/><rect x='172' y='132' width='17' height='27' rx='7' fill='%23F48FB1'/><rect x='194' y='128' width='17' height='30' rx='7' fill='%23F48FB1'/><path d='M104 102c-10-3-15 6-9 10 5 3 9-4 3-7' fill='none' stroke-linecap='round'/><ellipse cx='162' cy='104' rx='62' ry='45' fill='%23F9AFC8'/><path d='M176 66l8-22 16 19z' fill='%23F48FB1'/><ellipse cx='222' cy='110' rx='14' ry='16' fill='%23F48FB1'/></g><rect x='138' y='62' width='28' height='6' rx='3' fill='%231b1b1b'/><ellipse cx='218' cy='108' rx='2.4' ry='3.8' fill='%231b1b1b'/><ellipse cx='227' cy='108' rx='2.4' ry='3.8' fill='%231b1b1b'/><path d='M190 92q5-6 10 0M200 132q9 6 18-1' fill='none' stroke='%231b1b1b' stroke-width='2.6' stroke-linecap='round'/><circle cx='196' cy='112' r='6' fill='%23EC6A96' opacity='.55'/><path d='M116 92a42 36 0 0 1 22-24' fill='none' stroke='%23fff' stroke-width='4' stroke-linecap='round' opacity='.8'/><g fill='none' stroke='%23fff' stroke-width='2.4' stroke-linecap='round' opacity='.8'><path d='M144 10v7M152 6v9M160 10v7'/></g><g stroke='%231b1b1b' stroke-width='2.4'><circle cx='152' cy='36' r='13' fill='%23F2B801'/><ellipse cx='204' cy='38' rx='5' ry='11' fill='%23F2B801' transform='rotate(22 204 38)'/></g><circle cx='152' cy='36' r='7.5' fill='none' stroke='%23B98A00' stroke-width='2'/><path d='M145 31a8 8 0 0 1 5-4' fill='none' stroke='%23fff' stroke-width='2.2' stroke-linecap='round' opacity='.85'/></svg>") center bottom 4px / auto 200px no-repeat,
      url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 60'><path d='M0 26C60 8 120 10 200 22S330 34 400 26V60H0Z' fill='%231E9A93'/><path d='M0 40C70 30 140 36 210 42S340 46 400 40V60H0Z' fill='%2391D5C6'/><g transform='translate(52 40)'><path d='M0 0V-9' stroke='%230E6E6D' stroke-width='2' stroke-linecap='round'/><g fill='%23fff'><circle cy='-13' r='3'/><circle cx='3.6' cy='-10.4' r='3'/><circle cx='2.2' cy='-6.6' r='3'/><circle cx='-2.2' cy='-6.6' r='3'/><circle cx='-3.6' cy='-10.4' r='3'/></g><circle cy='-9.4' r='2.3' fill='%23F2B801'/></g><g transform='translate(318 44)'><path d='M0 0V-9' stroke='%230E6E6D' stroke-width='2' stroke-linecap='round'/><g fill='%23F2B801'><circle cy='-13' r='3'/><circle cx='3.6' cy='-10.4' r='3'/><circle cx='2.2' cy='-6.6' r='3'/><circle cx='-2.2' cy='-6.6' r='3'/><circle cx='-3.6' cy='-10.4' r='3'/></g><circle cy='-9.4' r='2.3' fill='%23f3672e'/></g><g transform='translate(250 44)'><path d='M0 0V-8' stroke='%230E6E6D' stroke-width='2' stroke-linecap='round'/><path d='M-4.5-10V-17L-2.2-14.8L0-18L2.2-14.8L4.5-17V-10Q4.5-7 0-7Q-4.5-7-4.5-10Z' fill='%23f3672e'/></g></svg>") left -30px bottom / 400px 60px repeat-x;
  }
}

/* ---- Yazdırma: arka plan grafikleri kapalıyken beyaz yazı kâğıtta kaybolmasın; IBAN kartı sade ---- */
@media print {
  .donate-box:not(.donate-online) { background: none; color: #1b1b1b; box-shadow: none; border: 2px solid #0E6E6D; }
  .donate-box:not(.donate-online) * { color: #1b1b1b !important; }
  .donate-box:not(.donate-online)::after, .donate-kutular::before, .donate-kutular::after, .donate-kopyala { display: none !important; }
}

/* ---- Telefon ---- */
@media (max-width: 599.98px) {
  .donate-online { padding-top: 70px; background-position: center 14px, 0 0; background-size: auto 50px, auto; }
  .donate-online > h2, .donate-box:not(.donate-online) > h2 { font-size: 42px; }
  .donate-online > h2 { margin-bottom: 16px; }
  .donate-box:not(.donate-online) > h2::before { width: 56px; height: 56px; background-size: 40px, auto; }
  .donate-tutar { min-height: 90px; padding: 11px 12px 13px; }
  .donate-tutar .tutar-rakam { font-size: 35px; }
  .donate-tutar .tutar-ad { font-size: 13px; }
  .donate-iban > strong { font-size: 21px; }
}
@media (max-width: 389.98px) { .donate-iban > strong { font-size: 20px; letter-spacing: .01em; } }
@media (max-width: 359.98px) {
  .donate-box { padding-left: 16px; padding-right: 16px; }
  .donate-box::before { inset: 7px; }
  .donate-box:not(.donate-online)::after { margin-left: -16px; margin-right: -16px; }
  .donate-sekme { font-size: 15px; padding: 10px 4px; }
  .donate-tutarlar { gap: 14px 10px; padding-left: 2px; padding-right: 2px; }
  .donate-tutar { padding: 10px 10px 12px; }
  .donate-not { padding-left: 46px; font-size: 16px; }
  .donate-not::after { left: 10px; }
  .donate-iban { margin-left: -4px; margin-right: -4px; padding: 12px 14px 13px; }
  .donate-iban > strong { font-size: 18px; letter-spacing: 0; }
}

/* ---- Hareket azaltma: zıplama, eğilme geçişleri kapalı ---- */
@media (prefers-reduced-motion: reduce) {
  .donate-tutar, .donate-sekme, .donate-gonder, .donate-kopyala, .donate-kisi input, .donate-diger-kutu { transition: none; }
  .donate-tutar:hover, .donate-tutar:active, .donate-gonder:hover, .donate-gonder:active, .donate-kopyala:hover, .donate-kopyala:active { transform: none; }
  .donate-tutar.is-active, .donate-tutar.is-active:hover { transform: translateY(-4px); }
  .donate-tutar.is-active, .donate-tutar.is-active:hover { animation: none; }
}

/* İçerikteki gömülü videolar (YouTube, Vimeo, kendi videolarımız): sütun genişliğinde, 16:9 */
.prose iframe { display: block; width: 100%; max-width: 100%; height: auto; aspect-ratio: 16 / 9; border: 0; margin: 1.2em 0; }
.prose video { display: block; max-width: 100%; height: auto; margin: 1.2em 0; background: #000; }

/* ============ Bağış teşekkür sayfası (konfetili) ============ */
.tesekkur-sahne {
  position: relative; text-align: center; color: var(--siyah);
  padding: 56px 0 72px;
  /* turuncu zemin üzerinde turkuaz ve sarı renk lekeleri */
  background:
    radial-gradient(circle at 7% 22%, #23a8a7 0 90px, transparent 91px),
    radial-gradient(circle at 95% 78%, #FFD966 0 130px, transparent 131px),
    radial-gradient(circle at 88% 8%, #8FC7C2 0 42px, transparent 43px),
    radial-gradient(circle at 14% 92%, #FFD966 0 34px, transparent 35px),
    var(--sari);
}
.tesekkur-sahne::after { /* altta turuncu fırça kenarı */
  content: ""; position: absolute; left: 0; right: 0; bottom: -17px; height: 18px; z-index: 1;
  background: var(--sari);
  -webkit-mask: var(--firca-mask) repeat-x bottom / 1200px 100%;
          mask: var(--firca-mask) repeat-x bottom / 1200px 100%;
}
@media (min-width: 1024px) { .tesekkur-sahne { padding: 80px 0 96px; } }
.tesekkur-ic { position: relative; z-index: 2; }

.tesekkur-hitap {
  font-family: var(--font-el); font-weight: 700; font-size: clamp(20px, 2.4vw, 28px);
  margin: 0 0 2px; overflow-wrap: anywhere;
}
.tesekkur-baslik {
  font-family: var(--font-script); font-weight: 700; line-height: .95;
  font-size: clamp(66px, 10vw, 132px); margin: 0;
  color: var(--beyaz); text-shadow: 4px 4px 0 var(--siyah);   /* çıkartma etkisi; beyaz/turuncu büyük yazı */
}
.tesekkur-tutar {
  display: inline-flex; flex-direction: column; align-items: center; gap: 4px;
  margin: 26px auto 22px; padding: 16px 42px 14px;
  background: var(--beyaz); border: 3px solid var(--siyah); border-radius: 28px;
  box-shadow: 8px 8px 0 var(--siyah); transform: rotate(-2deg);
  animation: tutar-belir .7s .25s cubic-bezier(.3, 1.6, .5, 1) both;
}
.tesekkur-tutar strong { font-size: clamp(56px, 8vw, 96px); font-weight: 800; line-height: 1; letter-spacing: -.02em; }
.tesekkur-tutar span { font-family: var(--font-el); font-weight: 700; font-size: 19px; color: var(--teal-koyu); }
@keyframes tutar-belir { from { opacity: 0; transform: rotate(-2deg) scale(.55); } to { opacity: 1; transform: rotate(-2deg) scale(1); } }
.tesekkur-mesaj {
  font-family: var(--font-el); font-size: clamp(18px, 1.8vw, 22px); line-height: 1.5;
  max-width: 640px; margin: 0 auto;
}
.tesekkur-baslik + .tesekkur-mesaj { margin-top: 26px; }   /* tutar kartı yokken (genel teşekkür) */

/* Konfeti: saf CSS, iki kez yağıp durur. Parçaların konumu/rengi şablonda değişkenle verilir. */
.tesekkur-konfeti { position: absolute; inset: 0; overflow: hidden; pointer-events: none; z-index: 1; }
.kf {
  position: absolute; top: -8%; left: var(--x);
  width: 10px; height: 14px; background: var(--c); opacity: 0;
  transform: rotate(var(--r));
  animation: kf-dus var(--t) var(--d) cubic-bezier(.3, .55, .5, 1) 2 both;
}
.kf-serit { width: 7px; height: 20px; border-radius: 2px; }
.kf-kare { width: 12px; height: 12px; }
.kf-daire { width: 12px; height: 12px; border-radius: 50%; }
.kf-ucgen {
  width: 0; height: 0; background: none;
  border-left: 8px solid transparent; border-right: 8px solid transparent; border-bottom: 14px solid var(--c);
}
@keyframes kf-dus {
  0%   { top: -8%;  opacity: 0; transform: translateX(0) rotate(var(--r)); }
  8%   { opacity: 1; }
  50%  { transform: translateX(26px) rotate(calc(var(--r) + 360deg)); }
  100% { top: 108%; opacity: 1; transform: translateX(-10px) rotate(calc(var(--r) + 720deg)); }
}
@media (prefers-reduced-motion: reduce) {
  .kf { animation: none; opacity: .9; top: var(--y); }
  .tesekkur-tutar { animation: none; }
}

/* Alt bölüm: turkuaz "etki" ve sarı "özet" kartları */
.tesekkur-alt { padding-top: 72px; }
.tesekkur-kartlar { display: grid; grid-template-columns: 1fr; gap: 28px; max-width: 1040px; margin: 0 auto; align-items: start; }
@media (min-width: 900px) { .tesekkur-kartlar { grid-template-columns: 1fr 1fr; } }
.tesekkur-kartlar.is-tek { grid-template-columns: 1fr; max-width: 680px; }
.tesekkur-kartlar > * { min-width: 0; }
.tesekkur-kart { border: 3px solid var(--siyah); padding: 26px 26px 22px; box-shadow: 8px 8px 0 var(--siyah); }
@media (max-width: 560px) { .tesekkur-kart { box-shadow: 5px 5px 0 var(--siyah); padding: 22px 20px 18px; } }
.tesekkur-kart h2 { font-family: var(--font-script); font-weight: 700; font-size: 38px; line-height: 1; margin: 0 0 14px; }
.tesekkur-kart p { font-size: 17px; line-height: 1.55; margin: 0 0 10px; }
.tesekkur-etki { background: #23a8a7; transform: rotate(-.6deg); }
.tesekkur-ozet { background: #FFD966; transform: rotate(.5deg); }
.tesekkur-oge { font-family: var(--font-el); font-weight: 700; font-size: 26px !important; margin-bottom: 4px !important; }
.tesekkur-ozet dl { margin: 0; }
.tesekkur-ozet dl > div { display: flex; justify-content: space-between; gap: 14px; padding: 9px 0; border-bottom: 2px solid rgba(0, 0, 0, .14); }
.tesekkur-ozet dl > div:last-child { border-bottom: 0; }
.tesekkur-ozet dt { font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; padding-top: 3px; }
.tesekkur-ozet dd { margin: 0; font-size: 17px; font-weight: 700; text-align: right; overflow-wrap: anywhere; }
.tesekkur-not { font-size: 14px !important; margin: 12px 0 0 !important; }
.tesekkur-not a { color: inherit; font-weight: 700; }

.tesekkur-eylem { display: flex; flex-wrap: wrap; gap: 14px 16px; justify-content: center; align-items: center; margin-top: 48px; }
.tesekkur-eylem .btn { font-family: var(--font-el); font-weight: 700; }
.btn-cizgi { background: transparent; border-color: var(--siyah); color: var(--siyah); border-radius: 999px; }
.btn-cizgi:hover { background: var(--siyah); color: var(--beyaz); }
.tesekkur-yeniden {
  flex-basis: 100%; text-align: center; margin-top: 4px;
  font-weight: 700; color: var(--siyah); text-decoration-color: var(--sari); text-decoration-thickness: 3px; text-underline-offset: 4px;
}
@media (max-width: 480px) { .tesekkur-eylem .btn { width: 100%; text-align: center; } }

/* ============ FOOTER ============ */
.site-footer { background: var(--gri-keyline); margin-top: 70px; position: relative; }
.site-footer::before { /* üstte siyah fırça geçişi */
  content: ""; position: absolute; left: 0; right: 0; top: -1px; height: 18px;
  background: var(--gri-keyline);
  -webkit-mask: var(--firca-mask) repeat-x top / 1200px 100%;
          mask: var(--firca-mask) repeat-x top / 1200px 100%;
  transform: scaleY(-1) translateY(17px);
}
.footer-grid {
  display: grid; grid-template-columns: 1fr; gap: 34px;
  padding-top: 54px; padding-bottom: 40px;
}
@media (min-width: 760px) { .footer-grid { grid-template-columns: 1.3fr 1fr 1fr .8fr; } }
.footer-col h3 { font-size: 16px; text-transform: uppercase; letter-spacing: .05em; margin-bottom: 14px; }
.footer-brand { display: flex; align-items: center; gap: 12px; font-size: 18px; margin-bottom: 12px; flex-wrap: wrap; }
/* max-height: küçük logolar büyütülüp bulanıklaşmasın; --flogo-olcek: Ayarlar'daki yüzde */
.footer-brand img {
  --flogo-olcek: 1;
  max-height: calc(42px * var(--flogo-olcek));
  max-width: calc(170px * var(--flogo-olcek));
  width: auto; height: auto;
  object-fit: contain; object-position: left center;
}
.footer-about p { font-size: 15px; color: #333; max-width: 34em; }
.footer-links, .footer-contact { list-style: none; margin: 0; padding: 0; font-size: 15px; }
.footer-links li, .footer-contact li { margin-bottom: 9px; }
.footer-links a, .footer-contact a { color: var(--siyah); text-decoration: none; }
.footer-links a:hover, .footer-contact a:hover { text-decoration: underline; }
.footer-social { display: flex; gap: 12px; }
.social-ic {
  width: 42px; height: 42px; background: var(--siyah); display: inline-block;
  transition: transform .25s, background .2s; position: relative;
}
.social-ic:hover { transform: scale(1.18); background: var(--teal-koyu); }
.social-ic::after {
  content: ""; position: absolute; inset: 0;
  background: var(--beyaz);
  -webkit-mask: var(--ic, none) center / 22px 22px no-repeat;
          mask: var(--ic, none) center / 22px 22px no-repeat;
}
.social-facebook { --ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M13.5 22v-8h2.7l.4-3.2h-3.1V8.7c0-.9.3-1.6 1.6-1.6h1.7V4.2c-.3 0-1.3-.1-2.5-.1-2.5 0-4.2 1.5-4.2 4.3v2.4H7.4V14h2.7v8z' fill='%23000'/%3E%3C/svg%3E"); }
.social-instagram { --ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 4.3c2.5 0 2.8 0 3.8.1 2.4.1 3.7 1.4 3.8 3.8 0 1 .1 1.3.1 3.8s0 2.8-.1 3.8c-.1 2.4-1.4 3.7-3.8 3.8-1 0-1.3.1-3.8.1s-2.8 0-3.8-.1c-2.4-.1-3.7-1.4-3.8-3.8 0-1-.1-1.3-.1-3.8s0-2.8.1-3.8C4.5 5.8 5.8 4.5 8.2 4.4c1-.1 1.3-.1 3.8-.1zM12 2C9.4 2 9.1 2 8.1 2.1 4.8 2.2 2.2 4.8 2.1 8.1 2 9.1 2 9.4 2 12s0 2.9.1 3.9c.1 3.3 2.7 5.9 6 6C9.1 22 9.4 22 12 22s2.9 0 3.9-.1c3.3-.1 5.9-2.7 6-6 .1-1 .1-1.3.1-3.9s0-2.9-.1-3.9c-.1-3.3-2.7-5.9-6-6C14.9 2 14.6 2 12 2zm0 4.9a5.1 5.1 0 100 10.2 5.1 5.1 0 000-10.2zm0 8.4a3.3 3.3 0 110-6.6 3.3 3.3 0 010 6.6zm5.3-9.9a1.2 1.2 0 100 2.4 1.2 1.2 0 000-2.4z' fill='%23000'/%3E%3C/svg%3E"); }
.social-twitter { --ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M17.8 3h3l-6.6 7.6L22 21h-6.1l-4.8-6.3L5.6 21h-3l7.1-8.1L2 3h6.3l4.3 5.7zm-1.1 16.2h1.7L7.4 4.7H5.6z' fill='%23000'/%3E%3C/svg%3E"); }
.social-youtube { --ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M21.6 7.2a2.5 2.5 0 00-1.8-1.8C18.2 5 12 5 12 5s-6.2 0-7.8.4A2.5 2.5 0 002.4 7.2 26 26 0 002 12a26 26 0 00.4 4.8 2.5 2.5 0 001.8 1.8c1.6.4 7.8.4 7.8.4s6.2 0 7.8-.4a2.5 2.5 0 001.8-1.8A26 26 0 0022 12a26 26 0 00-.4-4.8zM10 15.2V8.8l5.2 3.2z' fill='%23000'/%3E%3C/svg%3E"); }
.footer-bottom { border-top: 1px solid #cfcfcf; padding: 16px 0; font-size: 14px; color: #444; }
.footer-bottom .container { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 24px; }
.footer-yasal { display: flex; flex-wrap: wrap; gap: 6px 18px; }
.footer-yasal a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
.footer-yasal a:hover { color: var(--siyah); }
.form-gizlilik a { color: inherit; font-weight: 700; }
.form-gizlilik { font-size: 14px; line-height: 1.45; margin: 14px 0 0; color: #333; }
/* Taslak sayfa önizlemesi (yalnız panele girişli kişiye) */
.onizleme-serit {
  background: #FFD966; color: var(--siyah); text-align: center; font-weight: 700; font-size: 14px;
  padding: 10px 16px; border-bottom: 3px solid var(--siyah);
}

/* ============ Çalışma ortakları — kayan logo şeridi ============ */
.section-ortaklar { padding-bottom: 40px; }
.ortaklar-serit {
  overflow: hidden;
  padding: 10px 0 18px;
  /* kenarlarda yumuşak solma: logolar aniden kesilmesin */
  -webkit-mask: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
          mask: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
}
.ortaklar-sira {
  display: flex; align-items: center; gap: 54px;
  width: max-content;
  animation: ortak-kay var(--ortak-sure, 40s) linear infinite;
}
.ortaklar-serit:hover .ortaklar-sira,
.ortaklar-serit:focus-within .ortaklar-sira { animation-play-state: paused; }
@keyframes ortak-kay {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }   /* liste çift basıldığı için yarısı = tam tur */
}
.ortak-logo {
  display: flex; align-items: center; justify-content: center;
  flex: 0 0 auto; height: 84px; padding: 6px;
}
.ortak-logo img {
  max-height: 100%; width: auto; max-width: 190px; object-fit: contain;
  transition: transform .2s, opacity .2s;
}
a.ortak-logo:hover img, a.ortak-logo:focus-visible img { transform: scale(1.06); opacity: .85; }
a.ortak-logo:focus-visible { outline: 3px solid var(--sari); outline-offset: 2px; }
@media (max-width: 640px) {
  .ortaklar-sira { gap: 34px; }
  .ortak-logo { height: 62px; }
  .ortak-logo img { max-width: 140px; }
}
@media (prefers-reduced-motion: reduce) {
  /* Hareket istemeyene: kaymayı durdur, şeridi elle kaydırılabilir yap */
  .ortaklar-sira { animation: none; width: auto; }
  .ortaklar-serit { overflow-x: auto; }
}

/* ============ Yukarı dön butonu ============ */
.yukari-don {
  position: fixed; right: 22px; bottom: 22px; z-index: 120;
  display: flex; align-items: center; justify-content: center;
  width: 56px; height: 56px; padding: 0;
  color: var(--siyah); background: var(--sari);
  border: 3px solid var(--siyah); border-radius: 0;   /* köşesiz: tema imzası */
  cursor: pointer;
  box-shadow: 0 4px 0 rgba(0,0,0,.25);
  opacity: 0; transform: translateY(14px);
  transition: opacity .25s ease-out, transform .25s ease-out, background .15s;
}
.yukari-don[hidden] { display: none; }
.yukari-don.is-visible { opacity: 1; transform: translateY(0); }
.yukari-don:hover { background: var(--beyaz); }
.yukari-don:focus-visible { outline: 0; background: var(--focus-mavi); color: var(--beyaz); border-color: var(--focus-mavi); }
.yukari-don:focus-visible svg { fill: var(--beyaz); }
.yukari-don svg { width: 28px; height: 28px; fill: var(--siyah); display: block; }
/* Metin görsel olarak gizli ama ekran okuyucularda okunur (dilden bağımsız temiz görünüm) */
.yukari-don-metin {
  position: absolute; width: 1px; height: 1px; overflow: hidden;
  clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap;
}
@media (max-width: 560px) {
  .yukari-don { right: 14px; bottom: 14px; width: 48px; height: 48px; }
  .yukari-don svg { width: 24px; height: 24px; }
}
@media (prefers-reduced-motion: reduce) {
  .yukari-don { transition: opacity .01s; transform: none; }
}

/* ============ Görünürlük animasyonu ============ */
@media (prefers-reduced-motion: no-preference) {
  .reveal { opacity: 0; transform: translateY(22px); transition: opacity .5s ease-out, transform .5s ease-out; }
  .reveal.is-visible { opacity: 1; transform: none; }
}

/* ============ MENÜ SİMGELERİ (Menüler > Simge) ============ */
/* Mobil menü satırları space-between: simge + etiket tek parça kalsın */
.menu-etiket { display: inline-flex; align-items: center; }

/* Zarok TV logosu — resim değil: "Z" gerçek bir harf (Libre Franklin 900), üç boyut text-shadow ile,
   gözler pseudo-element. Boyutlar em: menü yazısının puntosuyla birlikte ölçeklenir. */
.ztv-logo {
  position: relative; display: inline-block; flex: none;
  width: 1.34em; height: 1.27em; margin-right: .3em;
  vertical-align: middle; line-height: 1;
}
.ztv-logo__z {
  position: absolute; right: .06em; bottom: .02em;
  font-family: "Libre Franklin", "Arial Black", Arial, sans-serif; font-weight: 900; font-style: normal;
  font-size: 1.12em; line-height: 1; color: #ffd400; letter-spacing: 0;
  transform: perspective(2.5em) rotateY(-18deg) rotateX(12deg) scaleX(1.28);
  transform-origin: 50% 70%;
  text-shadow:
    0 -.015em 0 #ffe66b,
    0 -.03em 0 #f9d634,
    0 -.045em 0 #f0c51d,
    .015em -.015em 0 #d39c00,
    .03em -.03em 0 #bb8500,
    .045em -.045em 0 #a37000,
    .06em -.055em 0 #8a5d00,
    .06em .04em .06em rgba(0,0,0,.5);
}
.ztv-logo::before, .ztv-logo::after {
  content: ""; position: absolute; top: 0; z-index: 1;
  width: .54em; height: .54em; border-radius: 50%; box-sizing: border-box;
  border: .03em solid #1a1a00;
  background: radial-gradient(circle at 50% 50%, #000 0 40%, #d2dc00 43%, #eef53a 55%, #dde600 80%, #b9c400 100%);
  box-shadow: inset .03em .04em .04em rgba(255,255,255,.35), .02em .03em .04em rgba(0,0,0,.45);
}
.ztv-logo::before { left: 0; }
.ztv-logo::after { left: .47em; }
.gorsel-gizli {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0;
}

/* ============ GÖKYÜZÜ SAYFA ZEMİNİ — ana sayfa dışındaki sayfalar (20 Eki 2026, kullanıcı seçimi) ============
   layout.php içeriği <div class="gok gok--{şablon}"> ile sarar ve partials/gok-dekor.php süslerini ekler.
   .gok--metin: tek metin sütunlu şablonlar (page, post, 404) — başlık metinle hizalı, masaüstünde beyaz kart.
   Diğerleri (listing, library, contact, donate) yalnız gökyüzü zeminini, bulutları ve tepeleri alır.
   Telefonda metin bugünkü gibi tam genişlik düz beyazda; gökyüzü yalnız başlık bandında ve sayfa sonunda. */
.gok {
  position: relative; isolation: isolate;
  margin-bottom: -70px;   /* footer'ın 70px üst boşluğuyla birleşip sıfırlanır: tepeler footer'a değer */
  padding-bottom: 64px;   /* tepe bandına yer */
  background:
    linear-gradient(180deg, #D6EFF5 0, #EAF7F8 110px, rgba(255,255,255,0) 200px) top / 100% 200px no-repeat,   /* metin (≥212px) düz beyazda başlar */
    linear-gradient(0deg, #FFF2E0 0, rgba(255,255,255,0) 115px) bottom / 100% 115px no-repeat,
    #fff;
}
.gok > :not(.gok-dekor):not(dialog) { position: relative; z-index: 1; }   /* içerik (bölümler, kapak görseli…) süslerin üstünde; <dialog> ekrana sabit kalmalı (Nar Ağacı penceresi) */
/* Başlık ve kapak görseli metin sütunuyla aynı hizada (eskiden başlık kabın sol kenarındaydı) */
.gok--metin .page-head > .container, .gok--metin > .page-hero-img { max-width: 52rem; }
/* Telefon/tablet: güneş ve bulut başlığın ÜSTÜNDEKİ boşlukta durur (alt uçları ≤ 62px), başlık 64px'ten
   başlar → uzun ve iki-üç satırlık başlıklar, noktalı büyük harfler (İ, Ü) dahil, süslere değmez. */
.gok .page-head { padding-top: 64px; }
.gok--metin .prose > :last-child { margin-bottom: 0; }

/* Dünyamız (sayfa 21) ve Mutfağımızda Neler Var? (sayfa 22): madde listesi süslü — her madde pastel bir kutucukta, başında simge; maddeler arasında
   boşluk ve küçük bir süs (kullanıcı isteği 23 Eki 2026). layout.php gövdeye "sayfa-{id}" sınıfını ekler.
   İlk Buluşmalarımız (sayfa 23) sonundaki "Sana Çağrımız" bölümü de aynı kutucuklarda. Yalnız metnin doğrudan
   altındaki liste ("> ul"): bilgi kartlarının ve kart penceresinin içindeki listeler etkilenmez. */
:is(.sayfa-21, .sayfa-22, .sayfa-23) .prose > ul { list-style: none; margin: 30px 0 8px; padding: 0; }
:is(.sayfa-21, .sayfa-22, .sayfa-23) .prose > ul > li {
  --suslu-bg: #FFE9DC; --suslu-ikon: var(--ikon-balon);
  position: relative; margin: 0; padding: 18px 20px 18px 78px; border-radius: 22px;
  background: var(--suslu-bg); line-height: 1.6;
  box-shadow: 0 14px 26px -20px rgba(30, 54, 64, .45);
}
:is(.sayfa-21, .sayfa-22, .sayfa-23) .prose > ul > li:nth-child(4n+2) { --suslu-bg: #DCF3F1; --suslu-ikon: var(--ikon-nota); }
:is(.sayfa-21, .sayfa-22, .sayfa-23) .prose > ul > li:nth-child(4n+3) { --suslu-bg: #FFF2C4; --suslu-ikon: var(--ikon-filiz); }
:is(.sayfa-21, .sayfa-22, .sayfa-23) .prose > ul > li:nth-child(4n+4) { --suslu-bg: #DCEEF8; --suslu-ikon: var(--ikon-ampul); }
:is(.sayfa-21, .sayfa-22, .sayfa-23) .prose > ul > li::before {   /* beyaz daire içinde simge */
  content: ""; position: absolute; left: 16px; top: 16px; width: 48px; height: 48px; border-radius: 50%;
  background: var(--suslu-ikon) center / 34px no-repeat, #fff;
  box-shadow: 0 2px 0 rgba(30, 54, 64, .12);
}
:is(.sayfa-21, .sayfa-22, .sayfa-23) .prose > ul > li + li { margin-top: 58px; }
:is(.sayfa-21, .sayfa-22, .sayfa-23) .prose > ul > li + li::after {   /* maddeler arası süs: yıldız, kalp, konfeti */
  content: ""; position: absolute; left: 50%; top: -46px; width: 150px; height: 34px; transform: translateX(-50%);
  pointer-events: none;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 150 34'%3E%3Cpath d='M6 17q6-7 12 0t12 0' fill='none' stroke='%23029E9C' stroke-width='2.6' stroke-linecap='round'/%3E%3Ccircle cx='42' cy='10' r='3.2' fill='%23F2B801'/%3E%3Cpath d='M57 9l2.4 5.6 5.6 2.4-5.6 2.4L57 25l-2.4-5.6L49 17l5.6-2.4z' fill='%23F2B801' stroke='%231b1b1b' stroke-width='1.3' stroke-linejoin='round'/%3E%3Cpath d='M75 27c-6-4.6-11-8.2-11-12.8 0-3 2.3-5.2 5.1-5.2 2.4 0 4.1 1.4 5.9 3.4 1.8-2 3.5-3.4 5.9-3.4 2.8 0 5.1 2.2 5.1 5.2 0 4.6-5 8.2-11 12.8z' fill='%23f3672e' stroke='%231b1b1b' stroke-width='1.4' stroke-linejoin='round'/%3E%3Cpath d='M94 11l9 4-7 7z' fill='%234AA8D0' stroke='%231b1b1b' stroke-width='1.3' stroke-linejoin='round'/%3E%3Ccircle cx='110' cy='24' r='3' fill='%23EC7AA2'/%3E%3Cpath d='M120 17q6-7 12 0t12 0' fill='none' stroke='%23f3672e' stroke-width='2.6' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
}
:is(.sayfa-21, .sayfa-22, .sayfa-23) .prose > ul > li > strong:first-child { display: block; margin-bottom: 2px; font-family: var(--font-script); font-size: 1.45em; line-height: 1.15; }
/* Listenin hemen üstündeki "Yaşayan Kültür ve Sanat …" paragrafı da aynı kutucukta (leylak, yıldız); liste ile arasında süs */
:is(.sayfa-21, .sayfa-23) .prose > p:has(+ ul) {
  position: relative; margin: 30px 0 0; padding: 18px 20px 18px 78px; border-radius: 22px;
  background: #F1E6FA; line-height: 1.6; box-shadow: 0 14px 26px -20px rgba(30, 54, 64, .45);
}
:is(.sayfa-21, .sayfa-23) .prose > p:has(+ ul)::before {
  content: ""; position: absolute; left: 16px; top: 16px; width: 48px; height: 48px; border-radius: 50%;
  background: var(--ikon-yildiz) center / 34px no-repeat, #fff; box-shadow: 0 2px 0 rgba(30, 54, 64, .12);
}
:is(.sayfa-21, .sayfa-23) .prose > p:has(+ ul) > strong:first-child { display: block; margin-bottom: 2px; font-family: var(--font-script); font-size: 1.45em; line-height: 1.15; }
:is(.sayfa-21, .sayfa-23) .prose > p:has(+ ul) + ul { margin-top: 58px; }
:is(.sayfa-21, .sayfa-23) .prose > p:has(+ ul) + ul > li:first-child::after {   /* aynı süs şeridi, ilk maddenin üstünde */
  content: ""; position: absolute; left: 50%; top: -46px; width: 150px; height: 34px; transform: translateX(-50%);
  pointer-events: none;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 150 34'%3E%3Cpath d='M6 17q6-7 12 0t12 0' fill='none' stroke='%23029E9C' stroke-width='2.6' stroke-linecap='round'/%3E%3Ccircle cx='42' cy='10' r='3.2' fill='%23F2B801'/%3E%3Cpath d='M57 9l2.4 5.6 5.6 2.4-5.6 2.4L57 25l-2.4-5.6L49 17l5.6-2.4z' fill='%23F2B801' stroke='%231b1b1b' stroke-width='1.3' stroke-linejoin='round'/%3E%3Cpath d='M75 27c-6-4.6-11-8.2-11-12.8 0-3 2.3-5.2 5.1-5.2 2.4 0 4.1 1.4 5.9 3.4 1.8-2 3.5-3.4 5.9-3.4 2.8 0 5.1 2.2 5.1 5.2 0 4.6-5 8.2-11 12.8z' fill='%23f3672e' stroke='%231b1b1b' stroke-width='1.4' stroke-linejoin='round'/%3E%3Cpath d='M94 11l9 4-7 7z' fill='%234AA8D0' stroke='%231b1b1b' stroke-width='1.3' stroke-linejoin='round'/%3E%3Ccircle cx='110' cy='24' r='3' fill='%23EC7AA2'/%3E%3Cpath d='M120 17q6-7 12 0t12 0' fill='none' stroke='%23f3672e' stroke-width='2.6' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
}
/* Sayfa sonundaki renkli düğmeler: kart genişliğinde, alt alta üç geniş renkli kutu (solda simge, sağda ok).
   Hepsi aynı hizada ve ortalı; uzun başlıklar her ekranda sığar. */
.sayfa-21 .prose p:has(> a.dugme) { display: grid; grid-template-columns: 1fr; gap: 18px; margin: 56px 0 6px; }
.sayfa-21 .prose p:has(> a.dugme) > a.dugme {
  position: relative; display: flex; align-items: center; justify-content: flex-start; gap: 0;
  min-height: 86px; margin: 0; padding: 14px 70px 14px 92px; border-radius: 24px;
  font-family: var(--font-script); font-size: 28px; line-height: 1.12;
}
.sayfa-21 .prose p:has(> a.dugme) > a.dugme::before {   /* solda beyaz daire içinde simge (renge göre) */
  content: ""; position: absolute; left: 20px; top: 50%; width: 54px; height: 54px; margin-top: -27px; border-radius: 50%;
  background: var(--bk-ikon) center / 38px no-repeat, #fff; border: 2px solid #1b1b1b;
}
.sayfa-21 .prose p:has(> a.dugme) > a.dugme::after { position: absolute; right: 20px; top: 50%; margin-top: -17px; }
@media (max-width: 599.98px) {
  .sayfa-21 .prose p:has(> a.dugme) > a.dugme { min-height: 74px; padding: 12px 62px 12px 80px; font-size: 25px; }
  .sayfa-21 .prose p:has(> a.dugme) > a.dugme::before { left: 16px; width: 48px; height: 48px; margin-top: -24px; background-size: 32px, auto; }
  .sayfa-21 .prose p:has(> a.dugme) > a.dugme::after { right: 16px; }
}
@media (max-width: 599.98px) {
  /* telefonda simge sol üstte, başlık yanında (uzarsa satır kırar, metne binmez), açıklama altta tam genişlik */
  :is(.sayfa-21, .sayfa-22, .sayfa-23) .prose > ul > li { padding: 14px 16px 16px; }
  :is(.sayfa-21, .sayfa-22, .sayfa-23) .prose > ul > li::before { left: 14px; top: 14px; width: 44px; height: 44px; background-size: 30px, auto; }
  :is(.sayfa-21, .sayfa-22, .sayfa-23) .prose > ul > li > strong:first-child { display: flex; align-items: center; min-height: 44px; padding-left: 56px; margin-bottom: 6px; }
  :is(.sayfa-21, .sayfa-23) .prose > p:has(+ ul) { padding: 14px 16px 16px; }
  :is(.sayfa-21, .sayfa-23) .prose > p:has(+ ul)::before { left: 14px; top: 14px; width: 44px; height: 44px; background-size: 30px, auto; }
  :is(.sayfa-21, .sayfa-23) .prose > p:has(+ ul) > strong:first-child { display: flex; align-items: center; min-height: 44px; padding-left: 56px; margin-bottom: 6px; }
}
@media print {
  :is(.sayfa-21, .sayfa-22, .sayfa-23) .prose > ul > li { background: none; box-shadow: none; padding-left: 0; }
  :is(.sayfa-21, .sayfa-22, .sayfa-23) .prose > ul > li::before, :is(.sayfa-21, .sayfa-22, .sayfa-23) .prose > ul > li + li::after { display: none; }
  :is(.sayfa-21, .sayfa-23) .prose > p:has(+ ul) { background: none; box-shadow: none; padding-left: 0; }
  :is(.sayfa-21, .sayfa-23) .prose > p:has(+ ul)::before, :is(.sayfa-21, .sayfa-23) .prose > p:has(+ ul) + ul > li:first-child::after { display: none; }
}
/* Editördeki kırmızı (#e03e2d) krem kartta yetersiz kalır → koyu kiremit (metin değişmez; ana sayfadaki gibi) */
.gok--metin .prose [style*="#e03e2d" i], .gok--metin .prose [style*="rgb(224, 62, 45)"] { color: #B3261A !important; }

.gok-dekor { position: absolute; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; }
.gok-dekor > * { position: absolute; display: block; }
.gok-bulutlar, .gok-ucurtma { display: none; }

.gok-gunes { width: 56px; height: 56px; top: 10px; right: 8px; }   /* ekran kenarında kırpılmaz */
.gok-gunes-isin { transform-box: fill-box; transform-origin: center; animation: gok-don 140s linear infinite; }
.gok-bulut {
  width: 62px; height: 30px; top: 30px; right: 44px;
  background: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='16 5 162 79'><g id='a'><circle cx='38' cy='62' r='18'/><circle cx='72' cy='46' r='27'/><circle cx='114' cy='40' r='31'/><circle cx='152' cy='58' r='22'/><rect x='38' y='50' width='114' height='30'/></g><use href='%23a' fill='%23BFE1E8' stroke='%23BFE1E8' stroke-width='5'/><use href='%23a' fill='%23fff'/></svg>") center / contain no-repeat;
}
.gok-tepeler {
  left: 0; right: 0; bottom: 0; height: 80px;
  background:
    url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 800 130'><defs><g id='d'><path d='M0 0V-13' stroke='%23077E7E' stroke-width='2' stroke-linecap='round'/><circle cy='-19' r='3.4'/><circle cx='4.4' cy='-15.9' r='3.4'/><circle cx='2.7' cy='-10.8' r='3.4'/><circle cx='-2.7' cy='-10.8' r='3.4'/><circle cx='-4.4' cy='-15.9' r='3.4'/><circle cy='-14.6' r='2.6' fill='%23f3672e'/></g><g id='u'><path d='M0 0V-12' stroke='%23077E7E' stroke-width='2' stroke-linecap='round'/><path d='M-5-14V-22L-2.5-19.5L0-23L2.5-19.5L5-22V-14Q5-10 0-10Q-5-10-5-14Z' fill='%23f3672e'/></g></defs><path d='M0 70C110 70 170 32 280 32S450 80 560 80S700 70 800 70V130H0Z' fill='%2326A699'/><use href='%23d' x='30' y='72' fill='%23fff'/><use href='%23d' x='140' y='54' fill='%23fff'/><use href='%23u' x='205' y='41'/><use href='%23d' x='300' y='36' fill='%23F2B801'/><use href='%23d' x='420' y='59' fill='%23fff'/><use href='%23u' x='560' y='83'/><use href='%23d' x='684' y='78' fill='%23F2B801'/></svg>") repeat-x left -40px bottom / 267px 43px,
    url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1000 190'><path d='M0 120C120 120 200 60 320 60S520 110 640 110S800 75 880 75S960 120 1000 120V190H0Z' fill='%2391D5C6'/><path d='M320 64V38M880 79V60' stroke='%23077E7E' stroke-width='5' stroke-linecap='round'/><circle cx='320' cy='28' r='18' fill='%2350B8A6'/><circle cx='880' cy='52' r='12' fill='%2350B8A6'/></svg>") repeat-x left -100px bottom / 333px 63px,
    url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 240'><path d='M0 150C140 150 220 80 360 80S560 140 700 140S900 60 1060 60S1300 150 1440 150V240H0Z' fill='%23CBEBE3'/></svg>") repeat-x left 0 bottom / 480px 80px;
}

/* Tablet: aynı düzen, süsler bir kademe büyük */
@media (min-width: 768px) {
  .gok {
    padding-bottom: 92px;
    background:
      linear-gradient(180deg, #D6EFF5 0, #EAF7F8 110px, rgba(255,255,255,0) 200px) top / 100% 200px no-repeat,
      linear-gradient(0deg, #FFF2E0 0, rgba(255,255,255,0) 140px) bottom / 100% 140px no-repeat,
      #fff;
  }
  /* tablette de başlığın üstünde kalır: güneşin görünen alt ucu ~66px, bulutun 66px */
  .gok-gunes { width: 66px; height: 66px; top: 6px; right: 3%; }
  .gok-bulut { width: 76px; height: 37px; top: 29px; right: calc(3% + 38px); }
  .gok-tepeler {
    height: 120px;
    background-size: 400px 65px, 500px 95px, 720px 120px;
    background-position: left -60px bottom, left -150px bottom, left 0 bottom;
  }
}

/* Masaüstü: metin beyaz kartta, gökyüzü tüm sayfayı kaplar, bulutlar kenar boşluklarında */
@media (min-width: 1024px) {
  .gok {
    padding-bottom: 224px;   /* kart ile tepe/ağaç uçları arasında ~44px nefes payı */
    background:
      linear-gradient(180deg, #CDEDF3, rgba(225, 244, 247, 0)) top / 100% 640px no-repeat,
      linear-gradient(180deg, #E1F4F7 0, #EEF8F5 60%, #FFF1DC 100%);
  }
  .gok .page-head { padding: 64px 0 14px; }
  .gok--metin .section { padding: 22px 0 0; }
  /* Metin kartı = ana sayfa giriş kartı (krem, kesikli turuncu iç çerçeve, elle kesilmiş köşeler, üstte balon/kalp/fırça
     şeridi) — kullanıcı isteği 23 Eki 2026: "beyazlık çok fazla". Yazı tipi değişmez (uzun metin okunaklı kalsın). */
  .gok--metin .section > .prose {
    position: relative;
    background: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 112'><g fill='none' stroke-linecap='round' stroke-width='3'><path d='M44 74q6-7 12 0t12 0' stroke='%23029E9C'/><path d='M560 34q6-7 12 0t12 0' stroke='%23f3672e'/><path d='M120 92q5-6 10 0t10 0' stroke='%23EC7AA2'/><path d='M488 88q5-6 10 0t10 0' stroke='%237BBA48'/></g><g stroke='%231b1b1b' stroke-width='1.6' stroke-linejoin='round'><path d='M98 22l9 4-7 7z' fill='%23F2B801'/><path d='M532 70l10 1-5 9z' fill='%234AA8D0'/><path d='M28 32l7 6-8 4z' fill='%23f3672e'/><path d='M606 76l8-3 1 9z' fill='%23029E9C'/><rect x='170' y='84' width='9' height='9' rx='2' transform='rotate(20 174 88)' fill='%237BBA48'/><rect x='462' y='22' width='9' height='9' rx='2' transform='rotate(-18 466 26)' fill='%23EC7AA2'/></g><g><circle cx='72' cy='40' r='4' fill='%234AA8D0'/><circle cx='150' cy='54' r='3.5' fill='%23f3672e'/><circle cx='14' cy='88' r='3' fill='%23F2B801'/><circle cx='182' cy='20' r='3' fill='%23029E9C'/><circle cx='584' cy='92' r='4' fill='%23F2B801'/><circle cx='512' cy='44' r='3.5' fill='%23029E9C'/><circle cx='626' cy='24' r='3' fill='%23EC7AA2'/><circle cx='458' cy='96' r='3' fill='%23f3672e'/></g><g fill='%23F2B801' stroke='%231b1b1b' stroke-width='1.4' stroke-linejoin='round'><path d='M164 30l2.6 6.4 6.4 2.6-6.4 2.6-2.6 6.4-2.6-6.4-6.4-2.6 6.4-2.6z'/><path d='M478 52l2.4 5.6 5.6 2.4-5.6 2.4-2.4 5.6-2.4-5.6-5.6-2.4 5.6-2.4z' fill='%23f3672e'/><path d='M290 14l2 4.6 4.6 2-4.6 2-2 4.6-2-4.6-4.6-2 4.6-2z' fill='%234AA8D0'/></g><path d='M350 98c12-8 22 3 33-2s21-9 33-2' fill='none' stroke='%23f3672e' stroke-width='6' stroke-linecap='round'/><path d='M352 106c10-5 19 2 28-1' fill='none' stroke='%23F2B801' stroke-width='4' stroke-linecap='round'/><g fill='none' stroke='%231b1b1b' stroke-width='1.5' stroke-linecap='round'><path d='M206 63c4 14 14 22 30 39M234 54c0 16 2 30 2 48M262 65c-6 14-14 22-26 37'/></g><path d='M236 102l-7-4v8zm0 0l7-4v8z' fill='%23f3672e' stroke='%231b1b1b' stroke-width='1.3' stroke-linejoin='round'/><g stroke='%231b1b1b' stroke-width='2.2'><ellipse cx='206' cy='44' rx='15' ry='19' fill='%23f3672e'/><ellipse cx='262' cy='46' rx='15' ry='19' fill='%234AA8D0'/><ellipse cx='234' cy='34' rx='16' ry='20' fill='%23F2B801'/></g><path d='M206 63l-3 4h6zM234 54l-3 4h6zM262 65l-3 4h6z' fill='%231b1b1b'/><path d='M198 38a8 10 0 0 1 4-7M226 28a8 10 0 0 1 4-7M254 40a8 10 0 0 1 4-7' fill='none' stroke='%23fff' stroke-width='2.5' stroke-linecap='round' opacity='.85'/><path d='M228 34q2-2.6 4 0M236 34q2-2.6 4 0M230 40q4 4 8 0' fill='none' stroke='%231b1b1b' stroke-width='1.8' stroke-linecap='round'/><g transform='translate(289 22) scale(.98)'><path d='M32 55C19 46 7 37 7 23.5 7 16 12.6 10.5 19.5 10.5c5.4 0 9.6 3 12.5 7.4 2.9-4.4 7.1-7.4 12.5-7.4C51.4 10.5 57 16 57 23.5 57 37 45 46 32 55z' fill='%23f3672e' stroke='%231b1b1b' stroke-width='2.5' stroke-linejoin='round'/><path d='M14 22a7 7 0 0 1 5.5-6' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' opacity='.85'/><path d='M23.5 28q2.5-3.2 5 0M35.5 28q2.5-3.2 5 0M26 35q6 6.5 12 0' fill='none' stroke='%231b1b1b' stroke-width='2.5' stroke-linecap='round'/><circle cx='21' cy='34' r='2.8' fill='%23FFC4AA'/><circle cx='43' cy='34' r='2.8' fill='%23FFC4AA'/></g><g transform='translate(392 72) rotate(40)' stroke='%231b1b1b' stroke-width='2' stroke-linejoin='round'><path d='M-6 -16L-4.5 -62Q0 -68 4.5 -62L6 -16Z' fill='%23029E9C'/><path d='M-2 -58v30' stroke='%23fff' stroke-width='2' stroke-linecap='round' opacity='.7'/><rect x='-8' y='-17' width='16' height='15' rx='2.5' fill='%23FFF1E2'/><path d='M-8 -10h16' stroke-width='1.5'/><path d='M-7.5 -2C-7.5 9 -3 17 0 22C3 17 7.5 9 7.5 -2Z' fill='%23f3672e'/></g></svg>") center 26px / auto 84px no-repeat, #FFFAF3;
    border-radius: 30px 36px 28px 34px / 34px 28px 36px 30px;
    padding-top: 128px; padding-bottom: 62px;
    box-shadow: 0 28px 46px -30px rgba(166, 61, 16, .55), 0 3px 0 rgba(166, 61, 16, .07);
  }
  .gok--metin .section > .prose::before {
    content: ""; position: absolute; inset: 9px; pointer-events: none;
    border: 2.5px dashed rgba(243, 103, 46, .5);
    border-radius: 23px 29px 21px 27px / 27px 21px 29px 23px;
  }
  .gok-bulutlar {
    display: block; top: 320px; bottom: 150px; width: 580px;
    -webkit-mask: linear-gradient(0deg, transparent 20px, #000 170px);
            mask: linear-gradient(0deg, transparent 20px, #000 170px);
    animation: gok-suzul 80s ease-in-out infinite alternate;
  }
  .gok-bulutlar--sol {
    right: min(calc(50% + 26rem + 20px), calc(100% - 250px));   /* dar ekranda bulut kartın arkasına sokulur; süzülürken de ekran kenarında kırpılmaz */
    background:
      url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 340 1900'><defs><g id='a'><circle cx='38' cy='62' r='18'/><circle cx='72' cy='46' r='27'/><circle cx='114' cy='40' r='31'/><circle cx='152' cy='58' r='22'/><rect x='38' y='50' width='114' height='30'/></g><g id='b'><circle cx='30' cy='44' r='16'/><circle cx='60' cy='32' r='22'/><circle cx='90' cy='42' r='17'/><rect x='30' y='40' width='60' height='20'/></g><g id='A'><use href='%23a' fill='%23BFE1E8' stroke='%23BFE1E8' stroke-width='5'/><use href='%23a' fill='%23fff'/></g><g id='B'><use href='%23b' fill='%23BFE1E8' stroke='%23BFE1E8' stroke-width='5'/><use href='%23b' fill='%23fff'/></g><path id='k' d='M0 17q6-7 12 0q6-7 12 0M31 0q4.5-5 9 0q4.5-5 9 0' fill='none' stroke='%2377A6B0' stroke-width='2.2' stroke-linecap='round'/></defs><use href='%23A' x='130' y='40'/><g transform='translate(140 290)' stroke='%231b1b1b' stroke-width='1.6' stroke-linejoin='round'><path d='M28 2C12 2 2 14 2 28c0 16 14 26 20 36h12c6-10 20-20 20-36C54 14 44 2 28 2Z' fill='%23f3672e'/><path d='M28 2c-8 0-12 12-12 26 0 16 6 26 8 36h8c2-10 8-20 8-36 0-14-4-26-12-26Z' fill='%23FFF1E2'/><path d='M28 2c-3 0-4.5 12-4.5 26 0 16 2.5 26 3 36h3c.5-10 3-20 3-36 0-14-1.5-26-4.5-26Z' fill='%23029E9C'/><path d='M23 64l1 8M33 64l-1 8' fill='none'/><rect x='21' y='72' width='14' height='10' rx='2' fill='%23F2B801'/></g><use href='%23k' x='214' y='330'/><use href='%23B' transform='translate(100 620) scale(1.15)'/><use href='%23A' transform='translate(176 920) scale(.8)'/><use href='%23B' transform='translate(150 1250)'/><use href='%23k' x='120' y='1490'/><use href='%23A' transform='translate(118 1650) scale(.9)'/></svg>") right 0 top 0 / 340px 1900px repeat-y,
      url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 240 1000'><defs><g id='a'><circle cx='38' cy='62' r='18'/><circle cx='72' cy='46' r='27'/><circle cx='114' cy='40' r='31'/><circle cx='152' cy='58' r='22'/><rect x='38' y='50' width='114' height='30'/></g><g id='b'><circle cx='30' cy='44' r='16'/><circle cx='60' cy='32' r='22'/><circle cx='90' cy='42' r='17'/><rect x='30' y='40' width='60' height='20'/></g></defs><g opacity='.85'><use href='%23b' transform='translate(30 60) scale(.8)' fill='%23D3EBF0' stroke='%23D3EBF0' stroke-width='5'/><use href='%23b' transform='translate(30 60) scale(.8)' fill='%23fff'/><use href='%23a' transform='translate(70 540) scale(.6)' fill='%23D3EBF0' stroke='%23D3EBF0' stroke-width='5'/><use href='%23a' transform='translate(70 540) scale(.6)' fill='%23fff'/></g></svg>") left 0 top 200px / 240px 1000px repeat-y;
  }
  .gok-bulutlar--sag {
    left: min(calc(50% + 26rem + 20px), calc(100% - 250px));
    animation-direction: alternate-reverse;
    background:
      url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 340 1950'><defs><g id='a'><circle cx='38' cy='62' r='18'/><circle cx='72' cy='46' r='27'/><circle cx='114' cy='40' r='31'/><circle cx='152' cy='58' r='22'/><rect x='38' y='50' width='114' height='30'/></g><g id='b'><circle cx='30' cy='44' r='16'/><circle cx='60' cy='32' r='22'/><circle cx='90' cy='42' r='17'/><rect x='30' y='40' width='60' height='20'/></g><g id='A'><use href='%23a' fill='%23BFE1E8' stroke='%23BFE1E8' stroke-width='5'/><use href='%23a' fill='%23fff'/></g><g id='B'><use href='%23b' fill='%23BFE1E8' stroke='%23BFE1E8' stroke-width='5'/><use href='%23b' fill='%23fff'/></g><path id='k' d='M0 17q6-7 12 0q6-7 12 0M31 0q4.5-5 9 0q4.5-5 9 0' fill='none' stroke='%2377A6B0' stroke-width='2.2' stroke-linecap='round'/></defs><use href='%23B' transform='translate(24 90) scale(1.25)'/><g transform='translate(172 480)'><path d='M-8 32C-40 46-70 28-58 8C-48-7-26 6-44 27C-62 48-106 52-150 38' fill='none' stroke='%23A3D0D8' stroke-width='2' stroke-dasharray='5 7' stroke-linecap='round'/><path d='M0 22L48 0L34 38L22 27Z' fill='%23fff' stroke='%2373ADB8' stroke-width='2' stroke-linejoin='round'/><path d='M48 0L22 27L20 38L27 31' fill='none' stroke='%2373ADB8' stroke-width='2' stroke-linejoin='round'/></g><use href='%23A' transform='translate(16 780) scale(.95)'/><use href='%23B' transform='translate(120 1170) scale(.9)'/><use href='%23k' x='74' y='1372'/><g transform='translate(150 1560)' stroke='%231b1b1b' stroke-width='1.4'><path d='M0 18C2 40 16 54 24 72M24 8C22 36 26 52 24 72M46 22C42 44 30 56 24 72' fill='none' stroke-width='1.2'/><ellipse cx='0' cy='2' rx='13' ry='16' fill='%23f3672e'/><ellipse cx='24' cy='-8' rx='13' ry='16' fill='%23F2B801'/><ellipse cx='46' cy='6' rx='13' ry='16' fill='%23029E9C'/><path d='M-7 0a8 10 0 0 1 4-8M17-10a8 10 0 0 1 4-8M39 4a8 10 0 0 1 4-8' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' opacity='.75'/></g><use href='%23A' transform='translate(30 1770) scale(.7)'/></svg>") left 0 top 0 / 340px 1950px repeat-y,
      url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 240 1000'><defs><g id='a'><circle cx='38' cy='62' r='18'/><circle cx='72' cy='46' r='27'/><circle cx='114' cy='40' r='31'/><circle cx='152' cy='58' r='22'/><rect x='38' y='50' width='114' height='30'/></g><g id='b'><circle cx='30' cy='44' r='16'/><circle cx='60' cy='32' r='22'/><circle cx='90' cy='42' r='17'/><rect x='30' y='40' width='60' height='20'/></g></defs><g opacity='.85'><use href='%23b' transform='translate(30 60) scale(.8)' fill='%23D3EBF0' stroke='%23D3EBF0' stroke-width='5'/><use href='%23b' transform='translate(30 60) scale(.8)' fill='%23fff'/><use href='%23a' transform='translate(70 540) scale(.6)' fill='%23D3EBF0' stroke='%23D3EBF0' stroke-width='5'/><use href='%23a' transform='translate(70 540) scale(.6)' fill='%23fff'/></g></svg>") right 0 top 60px / 240px 1000px repeat-y;
  }
  /* güneş: kartın sağında; 1280–1365 arası ekran kenarına taşmasın diye 100%-170px ile sınırlı */
  .gok-gunes { width: 150px; height: 150px; top: 20px; right: auto; left: min(calc(50% + 26rem + clamp(28px, 6vw, 130px)), calc(100% - 170px)); }
  .gok-bulut {
    width: 150px; height: 73px; top: 116px; right: auto;
    left: calc(min(calc(50% + 26rem + clamp(28px, 6vw, 130px)), calc(100% - 170px)) - 58px);
    animation: gok-suzul 40s ease-in-out infinite alternate;
  }
  .gok-tepeler {
    height: 240px;
    background-size: 800px 130px, 1000px 190px, 1440px 240px;
    background-position: left -120px bottom, left -300px bottom, left 0 bottom;
  }
}
/* 1024–1279: kenar boşluğu dar (90–215px). Bulut şeritleri %62 ölçekte ekran kenarına yaslanır
   (kenardan 14px içeride, kırpılmaz); taşan kısım kartın arkasında kalır. Güneş ve bulut metin
   sütununun sağ sınırının (50% + 26rem − 50px) dışında, ekranın içinde kalır. */
@media (min-width: 1024px) and (max-width: 1279px) {
  .gok-bulutlar { width: 300px; animation: none; }
  .gok-bulutlar--sol { right: auto; left: 0; background-size: 211px 1178px, 0 0; background-position: left -46px top 0, 0 0; }
  .gok-bulutlar--sag { left: auto; right: 0; background-size: 211px 1209px, 0 0; background-position: right -54px top 0, 0 0; }
  .gok-gunes { left: auto; right: 18px; width: 96px; height: 96px; top: 10px; }
  .gok-bulut { left: auto; right: 34px; top: 80px; width: 88px; height: 43px; animation: none; }
}
@media (min-width: 1280px) {
  .gok-ucurtma {
    display: block; width: 116px; height: 248px; top: 50px;
    right: min(calc(50% + 26rem + clamp(60px, 8vw, 210px)), calc(100% - 150px));   /* sol kenarda kırpılmasın */
    transform: rotate(-12deg); transform-origin: 50% 18%;
    animation: gok-salin 9s ease-in-out infinite alternate;
  }
}
@keyframes gok-suzul { from { transform: translateX(-16px); } to { transform: translateX(16px); } }
@keyframes gok-salin { from { transform: rotate(-15deg); } to { transform: rotate(-8deg) translateY(-6px); } }
@keyframes gok-don { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
  .gok-dekor, .gok-dekor * { animation: none !important; }
}
@media print {
  .gok { background: none; margin-bottom: 0; padding-bottom: 0; }
  .gok-dekor { display: none; }
  .gok--metin .section > .prose { background: none !important; box-shadow: none !important; padding-top: 0 !important; }
  .gok--metin .section > .prose::before { display: none; }
}
/* Geniş düzenli şablonlar (liste, kütüphane, iletişim, bağış): içerik kabın tamamını kullanır; kenar bulut
   şeritleri ve uçurtma metne/forma binmesin diye yalnız gökyüzü zemini, güneş ve tepeler kalır. */
.gok:not(.gok--metin) .gok-bulutlar, .gok:not(.gok--metin) .gok-ucurtma { display: none; }


/* Editör içeriği: uzun bağlantılar sütundan taşmasın; çok sütunlu tablo telefonda bütün sayfayı
   yana kaydırmasın — metin önce hücrede kırılır, yine sığmazsa yalnız tablo kendi içinde kayar. */
.prose { overflow-wrap: break-word; }
@media (max-width: 599.98px) { .prose table { display: block; overflow-x: auto; } }


/* ============================================================
   BİLGİ KARTLARI — editörde:
   <div class="bilgi-kartlari"><details class="bilgi-karti"><summary>Başlık</summary>…</details>…</div>
   Renk, simge ve numara sıraya göre otomatik (6'lı döngü). JS yoksa <details> yerinde açılır;
   JS varsa (site.js) kart tıklanınca içerik pencerede (telefonda alttan açılan sayfa) gösterilir.
   "Devamını oku" / "Kapat" etiketleri ziyaretçinin dilinde: layout.php <body style="--bk-oku; --bk-kapat">.
   ============================================================ */
:root {
  --bk-oku: "Devamını oku"; --bk-kapat: "Kapat";
  /* Simgeler: kartlar sırayla, pencere düğmeleri data-ikon ile kullanır (PENCERE_SIMGELERI) */
  --ikon-kalp: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M32 55C19 46 7 37 7 23.5 7 16 12.6 10.5 19.5 10.5c5.4 0 9.6 3 12.5 7.4 2.9-4.4 7.1-7.4 12.5-7.4C51.4 10.5 57 16 57 23.5 57 37 45 46 32 55z' fill='%23f3672e' stroke='%231b1b1b' stroke-width='2.5' stroke-linejoin='round'/%3E%3Cpath d='M14 22a7 7 0 0 1 5.5-6' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' opacity='.85'/%3E%3Cpath d='M23.5 28q2.5-3.2 5 0M35.5 28q2.5-3.2 5 0M26 35q6 6.5 12 0' fill='none' stroke='%231b1b1b' stroke-width='2.5' stroke-linecap='round'/%3E%3Ccircle cx='21' cy='34' r='2.8' fill='%23FFC4AA'/%3E%3Ccircle cx='43' cy='34' r='2.8' fill='%23FFC4AA'/%3E%3C/svg%3E");
  --ikon-ampul: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M32 3v4M11 10l3 3M53 10l-3 3M3 28h4M57 28h4' stroke='%23f3672e' stroke-width='3' stroke-linecap='round'/%3E%3Cpath d='M32 12c-9.5 0-16.5 7-16.5 16.5 0 6.2 3.2 10 6.2 13.4 1.9 2.2 2.8 4.3 2.8 7.1h15c0-2.8.9-4.9 2.8-7.1 3-3.4 6.2-7.2 6.2-13.4C48.5 19 41.5 12 32 12z' fill='%23F2B801' stroke='%231b1b1b' stroke-width='2.5' stroke-linejoin='round'/%3E%3Cpath d='M21.5 25a10.5 10.5 0 0 1 6-6.5' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' opacity='.85'/%3E%3Cpath d='M26.5 30q2-2.6 4 0M33.5 30q2-2.6 4 0M28 36q4 4 8 0' fill='none' stroke='%231b1b1b' stroke-width='2.3' stroke-linecap='round'/%3E%3Crect x='24.5' y='49' width='15' height='7.5' rx='2.5' fill='%23029E9C' stroke='%231b1b1b' stroke-width='2.5'/%3E%3Cpath d='M28 60.5h8' stroke='%231b1b1b' stroke-width='2.5' stroke-linecap='round'/%3E%3C/svg%3E");
  --ikon-filiz: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M32 40V25' stroke='%233C6B19' stroke-width='3' stroke-linecap='round'/%3E%3Cpath d='M31 28C29 20 22 16 13 17c0 8 7 13 18 11z' fill='%237BBA48' stroke='%231b1b1b' stroke-width='2.5' stroke-linejoin='round'/%3E%3Cpath d='M33 25c2-8 9-13 17-12 0 8-7 14-17 12z' fill='%2396D16E' stroke='%231b1b1b' stroke-width='2.5' stroke-linejoin='round'/%3E%3Cpath d='M17 41h30l-4.5 17h-21z' fill='%23f3672e' stroke='%231b1b1b' stroke-width='2.5' stroke-linejoin='round'/%3E%3Crect x='14' y='37' width='36' height='7' rx='2.5' fill='%23F2B801' stroke='%231b1b1b' stroke-width='2.5'/%3E%3Cpath d='M26 50q2 2.5 4 0M34 50q2 2.5 4 0' fill='none' stroke='%231b1b1b' stroke-width='2' stroke-linecap='round'/%3E%3Cpath d='M56 21c-3 4.5-4.5 7-4.5 9a4.5 4.5 0 0 0 9 0c0-2-1.5-4.5-4.5-9z' fill='%234AA8D0' stroke='%231b1b1b' stroke-width='2' stroke-linejoin='round'/%3E%3Cpath d='M8 30c-2 3-3 4.6-3 6a3 3 0 0 0 6 0c0-1.4-1-3-3-6z' fill='%234AA8D0' stroke='%231b1b1b' stroke-width='1.8' stroke-linejoin='round'/%3E%3C/svg%3E");
  --ikon-bina: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M7 27 32 9l25 18z' fill='%234AA8D0' stroke='%231b1b1b' stroke-width='2.5' stroke-linejoin='round'/%3E%3Crect x='12' y='27' width='40' height='30' fill='%23fff' stroke='%231b1b1b' stroke-width='2.5' stroke-linejoin='round'/%3E%3Cpath d='M32 25c-3-2.3-6-4.4-6-7.3 0-1.8 1.4-3.2 3.1-3.2 1.3 0 2.3.8 2.9 1.8.6-1 1.6-1.8 2.9-1.8 1.7 0 3.1 1.4 3.1 3.2 0 2.9-3 5-6 7.3z' fill='%23f3672e' stroke='%231b1b1b' stroke-width='1.8' stroke-linejoin='round'/%3E%3Cg fill='%23F2B801' stroke='%231b1b1b' stroke-width='2'%3E%3Crect x='17' y='32' width='8' height='7' rx='1.5'/%3E%3Crect x='39' y='32' width='8' height='7' rx='1.5'/%3E%3Crect x='17' y='44' width='8' height='7' rx='1.5'/%3E%3Crect x='39' y='44' width='8' height='7' rx='1.5'/%3E%3C/g%3E%3Cpath d='M27.5 57V46a4.5 4.5 0 0 1 9 0v11' fill='%23029E9C' stroke='%231b1b1b' stroke-width='2.5' stroke-linejoin='round'/%3E%3Cpath d='M4 57h56' stroke='%231b1b1b' stroke-width='2.5' stroke-linecap='round'/%3E%3C/svg%3E");
  --ikon-yildiz: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M32 7l7.35 15.9 17.4 2.1-12.85 11.9 3.4 17.2L32 45.5l-15.3 8.5 3.4-17.2L7.3 25l17.35-2.1z' fill='%23F2B801' stroke='%231b1b1b' stroke-width='2.5' stroke-linejoin='round'/%3E%3Cpath d='M26.5 31q2-2.6 4 0M33.5 31q2-2.6 4 0M28 36.5q4 4 8 0' fill='none' stroke='%231b1b1b' stroke-width='2.3' stroke-linecap='round'/%3E%3Ccircle cx='24' cy='36' r='2.2' fill='%23f3672e' opacity='.55'/%3E%3Ccircle cx='40' cy='36' r='2.2' fill='%23f3672e' opacity='.55'/%3E%3C/svg%3E");
  --ikon-balon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M22 39c1 8 6 12 10 22M42 35c-1 10-6 16-10 26' fill='none' stroke='%231b1b1b' stroke-width='1.8' stroke-linecap='round'/%3E%3Cellipse cx='22' cy='24' rx='12' ry='14' fill='%23029E9C' stroke='%231b1b1b' stroke-width='2.5'/%3E%3Cellipse cx='42' cy='20' rx='12' ry='14' fill='%23f3672e' stroke='%231b1b1b' stroke-width='2.5'/%3E%3Cpath d='M16 19a7 8 0 0 1 4-5M36 15a7 8 0 0 1 4-5' fill='none' stroke='%23fff' stroke-width='2.5' stroke-linecap='round' opacity='.85'/%3E%3Cpath d='M22 38l-2.5 3.5h5zM42 34l-2.5 3.5h5z' fill='%231b1b1b'/%3E%3C/svg%3E");
  --ikon-nota: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cpath d='M25 47V17M53 40V10' stroke='%231b1b1b' stroke-width='3' stroke-linecap='round'/%3E%3Cpath d='M25 16 53 9v9l-28 7z' fill='%23f3672e' stroke='%231b1b1b' stroke-width='2.5' stroke-linejoin='round'/%3E%3Cellipse cx='18' cy='48' rx='8.5' ry='6.5' transform='rotate(-20 18 48)' fill='%23029E9C' stroke='%231b1b1b' stroke-width='2.5'/%3E%3Cellipse cx='46' cy='41' rx='8.5' ry='6.5' transform='rotate(-20 46 41)' fill='%23F2B801' stroke='%231b1b1b' stroke-width='2.5'/%3E%3Cpath d='M13 46.5a5 4 0 0 1 4.5-3.5M41 39.5a5 4 0 0 1 4.5-3.5' fill='none' stroke='%23fff' stroke-width='2.2' stroke-linecap='round' opacity='.85'/%3E%3Cpath d='M7 18q3-4 6 0M5 28q2.5-3 5 0' fill='none' stroke='%234AA8D0' stroke-width='2.4' stroke-linecap='round'/%3E%3C/svg%3E");
}
.bilgi-karti:nth-of-type(6n+1), .bk-dialog[data-renk="1"], .zp [data-renk="1"], a.dugme[data-renk="1"] { --bk-bg: #FFE9DC; --bk-acc: #f3672e; --bk-koyu: #A63D10; --bk-ikon: var(--ikon-kalp); }
.bilgi-karti:nth-of-type(6n+2), .bk-dialog[data-renk="2"], .zp [data-renk="2"], a.dugme[data-renk="2"] { --bk-bg: #DCF3F1; --bk-acc: #029E9C; --bk-koyu: #05615F; --bk-ikon: var(--ikon-ampul); }
.bilgi-karti:nth-of-type(6n+3), .bk-dialog[data-renk="3"], .zp [data-renk="3"], a.dugme[data-renk="3"] { --bk-bg: #FFF2C4; --bk-acc: #F2B801; --bk-koyu: #6B4F00; --bk-ikon: var(--ikon-filiz); }
.bilgi-karti:nth-of-type(6n+4), .bk-dialog[data-renk="4"], .zp [data-renk="4"], a.dugme[data-renk="4"] { --bk-bg: #DCEFF8; --bk-acc: #4AA8D0; --bk-koyu: #1A5E7F; --bk-ikon: var(--ikon-bina); }
.bilgi-karti:nth-of-type(6n+5), .bk-dialog[data-renk="5"], .zp [data-renk="5"], a.dugme[data-renk="5"] { --bk-bg: #FDE3EC; --bk-acc: #EC7AA2; --bk-koyu: #952A50; --bk-ikon: var(--ikon-yildiz); }
.bilgi-karti:nth-of-type(6n+6), .bk-dialog[data-renk="6"], .zp [data-renk="6"], a.dugme[data-renk="6"] { --bk-bg: #E4F3D7; --bk-acc: #7BBA48; --bk-koyu: #3A6918; --bk-ikon: var(--ikon-balon); }
/* pencere düğmesinin seçilen simgesi (rengin varsayılan simgesini ezer) */
.zp [data-ikon="kalp"] { --bk-ikon: var(--ikon-kalp); }
.zp [data-ikon="ampul"] { --bk-ikon: var(--ikon-ampul); }
.zp [data-ikon="filiz"] { --bk-ikon: var(--ikon-filiz); }
.zp [data-ikon="bina"] { --bk-ikon: var(--ikon-bina); }
.zp [data-ikon="yildiz"] { --bk-ikon: var(--ikon-yildiz); }
.zp [data-ikon="balon"] { --bk-ikon: var(--ikon-balon); }
.zp [data-ikon="nota"] { --bk-ikon: var(--ikon-nota); }

.bilgi-kartlari {
  display: grid; grid-template-columns: 1fr; gap: 18px;
  margin: 1.8em 0 1.4em; counter-reset: bk;
}
@media (min-width: 640px) {
  .bilgi-kartlari { grid-template-columns: 1fr 1fr; gap: 22px; }
  /* tek kalan son kart (1, 3, 5… kart) tüm satırı kaplar, yanında boşluk kalmaz */
  .bilgi-karti:last-of-type:nth-of-type(odd) { grid-column: 1 / -1; }
  .bilgi-karti:last-of-type:nth-of-type(odd) .bk-ozet { -webkit-line-clamp: 2; }
}

.bilgi-karti {
  counter-increment: bk;
  position: relative; min-width: 0;
  background: var(--bk-bg); border-radius: 26px;
  box-shadow: 0 14px 26px -18px var(--bk-koyu), 0 2px 0 rgba(0, 0, 0, .04);
  transition: transform .25s cubic-bezier(.3, 1.4, .5, 1), box-shadow .25s;
}
.bilgi-karti > summary {
  position: relative; display: flex; flex-direction: column; gap: 14px;
  min-height: 100%;
  padding: 98px 22px 22px;
  cursor: pointer; list-style: none; border-radius: 26px;
  font-family: var(--font-script); font-weight: 700; font-size: 34px; line-height: 1.15;
  letter-spacing: 0; color: #1b1b1b; text-wrap: balance; overflow-wrap: break-word;
  background:
    var(--bk-ikon) no-repeat 24px 20px / 62px 62px,
    radial-gradient(circle at 55px 51px, #fff 0 38px, transparent 39px) no-repeat;
  -webkit-tap-highlight-color: transparent;
}
.bilgi-karti > summary::-webkit-details-marker { display: none; }
.bilgi-karti > summary::marker { content: ""; }
/* numara çıkartması (otomatik) */
.bilgi-karti > summary::before {
  content: counter(bk);
  position: absolute; top: 18px; right: 18px;
  width: 46px; height: 46px; display: grid; place-items: center;
  border-radius: 50%; background: var(--bk-acc); color: #1b1b1b;
  font-family: var(--font-script); font-size: 30px; line-height: 1;
  border: 2.5px solid #1b1b1b; transform: rotate(8deg);
  box-shadow: 3px 3px 0 rgba(0, 0, 0, .18);
}
/* "Devamını oku →" etiketi (dile göre); ok işareti ekran okuyucuya okunmaz (destekleyen tarayıcıda) */
.bilgi-karti > summary::after {
  content: var(--bk-oku) " \2192";
  align-self: flex-start; margin-top: auto;
  display: inline-flex; align-items: center; min-height: 44px;
  padding: 8px 18px; border-radius: 999px;
  background: var(--bk-koyu); color: #fff;
  font-family: var(--font-el); font-weight: 700; font-size: 17px; line-height: 1.2;
  transition: transform .2s, background-color .2s;
}
.bilgi-karti[open] > summary::after { content: var(--bk-kapat) " \2191"; }
@supports (content: "a" / "b") {
  .bilgi-karti > summary::after { content: var(--bk-oku) " \2192" / var(--bk-oku); }
  .bilgi-karti[open] > summary::after { content: var(--bk-kapat) " \2191" / var(--bk-kapat); }
}

/* kısa tanıtım: içerikteki ilk paragraf (JS ekler), 3 satırla sınırlı */
.bk-ozet {
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden;
  margin: -4px 0 4px;
  font-family: var(--font-govde); font-weight: 400; font-size: 16px; line-height: 1.55;
  letter-spacing: -0.0125rem; color: #333; text-wrap: pretty;
}
@media (min-width: 768px) { .bk-ozet { font-size: 16.5px; } }

.bilgi-karti > summary:focus-visible { outline: 3px solid var(--focus-mavi); outline-offset: 4px; }
@media (hover: hover) {
  .bilgi-karti:not([open]):hover { transform: translateY(-5px) rotate(-.6deg); box-shadow: 0 22px 34px -18px var(--bk-koyu), 0 2px 0 rgba(0, 0, 0, .04); }
  .bilgi-karti:nth-of-type(even):not([open]):hover { transform: translateY(-5px) rotate(.6deg); }
  .bilgi-karti:hover > summary::after { transform: translateX(4px); }
}
.bilgi-karti:not([open]):active { transform: scale(.985); }

/* JS yokken (ya da sayfada arama yapılınca) kart yerinde açılır: tam genişlik, okunur içerik */
.bilgi-karti[open] { grid-column: 1 / -1; background: #fff; box-shadow: inset 0 0 0 3px var(--bk-bg), 0 14px 26px -18px var(--bk-koyu); }
.bilgi-karti[open] > summary { background-color: var(--bk-bg); border-radius: 26px 26px 0 0; min-height: 0; padding-bottom: 18px; }
.bilgi-karti[open] .bk-ozet { display: none; }
.bilgi-karti > :not(summary) { margin-left: 24px; margin-right: 24px; }
.bilgi-karti > summary + * { margin-top: 22px; }
.bilgi-karti > :last-child:not(summary) { margin-bottom: 26px; }
.bilgi-karti li::marker, .bk-govde li::marker { color: var(--bk-koyu); }

/* ---------- Kart penceresi (JS) ---------- */
html.bk-kilit, html.bk-kilit body { overflow: hidden; }
html.bk-kilit body { padding-right: var(--bk-sb, 0); }
.bk-dialog {
  padding: 0; border: 0; color: #000; background: #FFFAF3;   /* metin sayfalarındaki krem kartla aynı */
  width: min(760px, calc(100vw - 48px)); max-width: none;
  max-height: min(88vh, 900px); max-height: min(88dvh, 900px);
  border-radius: 28px; overflow: hidden;
  box-shadow: 0 40px 90px -30px rgba(0, 50, 60, .6);
}
.bk-dialog[open] { display: flex; flex-direction: column; animation: bk-gel .32s cubic-bezier(.2, 1.2, .4, 1); }
.bk-dialog::backdrop { background: rgba(8, 48, 58, .5); -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); }
.bk-dialog[open]::backdrop { animation: bk-sis .25s ease-out; }
@keyframes bk-gel { from { opacity: 0; transform: translateY(18px) scale(.97); } }
@keyframes bk-sis { from { opacity: 0; } }

.bk-ust {
  position: relative; flex: none; z-index: 1;
  display: flex; align-items: center; gap: 16px;
  padding: 24px 24px 20px 26px;
  background: var(--bk-bg);
}
.bk-ust::after {   /* fırça alt kenar */
  content: ""; position: absolute; left: 0; right: 0; top: 100%; height: 14px;
  background: var(--bk-bg);
  -webkit-mask: var(--firca-mask) repeat-x top / 900px 100%;
          mask: var(--firca-mask) repeat-x top / 900px 100%;
}
.bk-ikon {
  position: relative; flex: none; width: 78px; height: 78px; border-radius: 50%;
  background: var(--bk-ikon) center / 60px 60px no-repeat, #fff;
}
.bk-no {
  position: absolute; left: 50px; top: -6px;   /* simgenin sağ üst köşesinde */
  width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%;
  background: var(--bk-acc); color: #1b1b1b; border: 2px solid #1b1b1b;
  font-family: var(--font-script); font-weight: 700; font-size: 23px; line-height: 1;
  transform: rotate(8deg);
}
.bk-baslik {
  flex: 1; min-width: 0; margin: 0;
  font-family: var(--font-script); font-weight: 700; font-size: 40px; line-height: 1.2; letter-spacing: .015em; word-spacing: .06em; color: #1b1b1b;
  text-wrap: balance; overflow-wrap: break-word;
}
.bk-baslik:focus { outline: none; }
.bk-kapat, .bk-onceki, .bk-sonraki {
  display: inline-flex; align-items: center; gap: 6px; min-height: 44px;
  padding: 8px 18px; border-radius: 999px; cursor: pointer;
  font-family: var(--font-el); font-weight: 700; font-size: 17px; line-height: 1.1;
  transition: background-color .2s, color .2s, transform .2s;
}
.bk-kapat { flex: none; align-self: flex-start; background: #fff; color: #1b1b1b; border: 2.5px solid #1b1b1b; }
.bk-kapat [aria-hidden] { font-family: var(--font-govde); font-size: 24px; line-height: .8; font-weight: 400; }
@media (hover: hover) { .bk-kapat:hover { background: #1b1b1b; color: #fff; } }
.bk-kapat:focus-visible, .bk-onceki:focus-visible, .bk-sonraki:focus-visible { outline: 3px solid var(--focus-mavi); outline-offset: 3px; }

.bk-govde {
  flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain;
  max-width: none; padding: 40px 38px 30px; line-height: 1.75;
  letter-spacing: .018em; word-spacing: .06em;   /* site geneli -0.0125rem: pencerede harfler birbirine değmesin */
}
.bk-metin > p { margin-bottom: 1.35em; }
.bk-govde:focus { outline: none; }
.bk-govde:focus-visible { outline: 3px solid var(--focus-mavi); outline-offset: -4px; border-radius: 6px; }
.bk-metin > :first-child { margin-top: 0; }
.bk-metin > :last-child { margin-bottom: 0; }
.bk-govde ul { padding-left: 1.3em; }
.bk-govde li { margin-bottom: .6em; }

.bk-alt {
  flex: none; display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 12px 18px; border-top: 2px dashed rgba(243, 103, 46, .35); background: #FFFAF3;
}
.bk-alt[hidden] { display: none; }
.bk-onceki, .bk-sonraki { background: var(--bk-bg); color: #1b1b1b; border: 0; }
@media (hover: hover) {   /* dokunmatikte dokunduktan sonra "seçili" gibi takılı kalmasın */
  .bk-onceki:hover:not(:disabled), .bk-sonraki:hover:not(:disabled) { background: var(--bk-koyu); color: #fff; }
}
.bk-onceki:disabled, .bk-sonraki:disabled { visibility: hidden; }
.bk-sayac { font-family: var(--font-el); font-weight: 700; font-size: 17px; color: #444; }

/* Telefon: kartlar biraz daha sıkı */
@media (max-width: 599.98px) {
  .bilgi-karti > summary { padding: 90px 20px 20px; font-size: 32px; background-position: 20px 18px, 0 0; background-size: 58px 58px, auto; background-image: var(--bk-ikon), radial-gradient(circle at 49px 47px, #fff 0 36px, transparent 37px); }
  .bilgi-karti > summary::before { top: 16px; right: 16px; }
  .bilgi-karti > :not(summary) { margin-left: 20px; margin-right: 20px; }
}
/* Telefon ya da alçak ekran (yatay telefon, %200 yakınlaştırma): kart penceresi alttan açılan sayfa.
   site.js'teki matchMedia ile aynı koşul. */
@media (max-width: 599.98px), (max-height: 520px) {
  .bk-dialog {
    width: 100%; margin: auto 0 0; max-height: 92vh; max-height: 92dvh;
    border-radius: 26px 26px 0 0;
  }
  .bk-dialog[open] { animation-name: bk-yuksel; }
  .bk-dialog { transition: transform .22s ease-out; }        /* tutamaçtan aşağı çekince geri yaylanır */
  .bk-dialog.bk-surukle { transition: none; }
  .bk-ust { touch-action: none; }
  .bk-ust { display: grid; grid-template-columns: auto 1fr auto; align-items: start; gap: 10px 12px; padding: 26px 16px 10px 18px; }
  .bk-ikon { grid-area: 1 / 1; }
  .bk-kapat { grid-area: 1 / 3; }
  .bk-ust::after { display: none; }
  /* telefonda başlık kayan alanın başında durur: uzun başlık metne yer bırakır, "Kapat" hep görünür */
  .bk-govde > .bk-baslik {
    position: relative; margin: -30px -20px 32px; padding: 0 20px 14px;
    background: var(--bk-bg);
  }
  .bk-govde > .bk-baslik::after {
    content: ""; position: absolute; left: 0; right: 0; top: 100%; height: 14px;
    background: var(--bk-bg);
    -webkit-mask: var(--firca-mask) repeat-x top / 900px 100%;
            mask: var(--firca-mask) repeat-x top / 900px 100%;
  }
  .bk-ust::before {   /* tutamaç */
    content: ""; position: absolute; top: 9px; left: 50%; width: 44px; height: 5px; margin-left: -22px;
    border-radius: 3px; background: rgba(0, 0, 0, .18);
  }
  .bk-ikon { width: 56px; height: 56px; background-size: 44px 44px, auto; }
  .bk-no { left: 38px; top: -6px; width: 30px; height: 30px; font-size: 20px; }
  .bk-baslik { font-size: 31px; line-height: 1.22; }
  .bk-kapat { padding: 8px 14px; }
  .bk-govde { padding: 30px 20px 24px; }
  .bk-alt { padding: 10px 12px calc(10px + env(safe-area-inset-bottom)); }
  .bk-onceki, .bk-sonraki { padding: 8px 14px; }
}
@keyframes bk-yuksel { from { transform: translateY(60px); opacity: .4; } }
/* Alçak ekran: üst bant ve alt çubuk küçülür, metne yer kalsın */
@media (max-height: 520px) {
  .bk-dialog { max-height: 100vh; max-height: 100dvh; }
  .bk-ust { padding: 16px 12px 4px 14px; gap: 8px 10px; }
  .bk-ust::before { top: 6px; }
  .bk-ikon { width: 42px; height: 42px; background-size: 32px 32px, auto; }
  .bk-no { left: 27px; top: -6px; width: 25px; height: 25px; font-size: 16px; border-width: 1.5px; }
  .bk-kapat { min-height: 40px; padding: 5px 12px; }
  .bk-govde { padding: 18px 20px 16px; }
  .bk-govde > .bk-baslik { margin: -18px -20px 22px; padding: 0 20px 8px; }
  .bk-baslik { font-size: 26px; }
  .bk-alt { padding: 5px 12px calc(5px + env(safe-area-inset-bottom)); }
  .bk-onceki, .bk-sonraki { min-height: 40px; padding: 5px 12px; }
}

@media (prefers-reduced-motion: reduce) {
  .bilgi-karti, .bilgi-karti > summary::after, .bk-dialog, .bk-dialog[open], .bk-dialog[open]::backdrop { transition: none; animation: none; }
  .bilgi-karti:not([open]):hover, .bilgi-karti:nth-of-type(even):not([open]):hover, .bilgi-karti:not([open]):active { transform: none; }
  .bilgi-karti:hover > summary::after { transform: none; }
}
@media print {
  .bilgi-kartlari { display: block; }
  .bilgi-karti { box-shadow: none; border: 2px solid var(--bk-bg); margin-bottom: 16px; }
  .bilgi-karti > summary::after, .bk-ozet { display: none; }
}

/* İlk Buluşmalarımız (sayfa 23): atölye kartları kapalıyken Dünyamız'daki geniş renkli düğmeler gibi (solda simge,
   sağda ok); tıklanınca kart penceresi açılır. Başlıktaki <em> düğmede alt satırdır ("0–3 Yaş · Kürtçe"; site.js onu
   pencere başlığına katmaz). İçerikteki ilk liste (Dil, Yaş Grubu, Kurgu …) pencerede renkli etiketler olur. */
.sayfa-23 .bilgi-karti:nth-of-type(4n+1), .sayfa-23 .bk-dialog[data-renk="1"] { --bk-ikon: var(--ikon-nota); }
.sayfa-23 .bilgi-karti:nth-of-type(4n+2), .sayfa-23 .bk-dialog[data-renk="2"] { --bk-ikon: var(--ikon-balon); }
.sayfa-23 .bilgi-karti:nth-of-type(4n+3), .sayfa-23 .bk-dialog[data-renk="3"] { --bk-ikon: var(--ikon-yildiz); }
.sayfa-23 .bilgi-karti:nth-of-type(4n+4), .sayfa-23 .bk-dialog[data-renk="4"] { --bk-ikon: var(--ikon-ampul); }
.sayfa-23 .bilgi-kartlari { grid-template-columns: 1fr; gap: 18px; margin: 34px 0 52px; }
.sayfa-23 .bilgi-karti:not([open]) {
  background: var(--bk-acc); border: 2.5px solid #1b1b1b; border-radius: 24px; box-shadow: 4px 4px 0 #1b1b1b;
  transition: transform .18s cubic-bezier(.3, 1.4, .5, 1), box-shadow .18s;
}
.sayfa-23 .bilgi-karti:not([open]) > summary {
  justify-content: center; gap: 5px; min-height: 86px; padding: 14px 70px 14px 92px; border-radius: 22px;
  background: none; font-size: 28px; line-height: 1.12; text-wrap: pretty;
}
.sayfa-23 .bilgi-karti:not([open]) > summary::before {   /* numara yerine solda beyaz daire içinde simge */
  content: ""; left: 20px; right: auto; top: 50%; width: 54px; height: 54px; margin-top: -27px;
  background: var(--bk-ikon) center / 38px no-repeat, #fff; border: 2px solid #1b1b1b; box-shadow: none; transform: none;
}
.sayfa-23 .bilgi-karti:not([open]) > summary::after {   /* "Devamını oku" yerine sağda ok */
  content: "\2192"; content: "\2192" / "";
  position: absolute; right: 20px; top: 50%; width: 34px; height: 34px; min-height: 0; margin-top: -17px; padding: 0;
  display: grid; place-items: center; border-radius: 50%; background: #fff; color: #1b1b1b; border: 2px solid #1b1b1b;
  font-family: var(--font-govde); font-size: 18px; line-height: 1;
}
.sayfa-23 .bilgi-karti > summary > em {
  font-family: var(--font-el); font-style: normal; font-weight: 700; font-size: 16px; line-height: 1.3; letter-spacing: .01em;
}
.sayfa-23 .bilgi-karti:not([open]) .bk-ozet { display: none; }
@media (hover: hover) {
  .sayfa-23 .bilgi-karti:not([open]):hover { transform: translate(-2px, -2px) rotate(-.5deg); box-shadow: 6px 6px 0 #1b1b1b; }
  .sayfa-23 .bilgi-karti:nth-of-type(even):not([open]):hover { transform: translate(-2px, -2px) rotate(.5deg); }
  .sayfa-23 .bilgi-karti:hover > summary::after { transform: translateX(3px); }
}
.sayfa-23 .bilgi-karti:not([open]):active { transform: translate(3px, 3px); box-shadow: 1px 1px 0 #1b1b1b; }
.sayfa-23 .bilgi-karti > summary:focus-visible { outline-offset: 6px; }
/* bilgi etiketleri: pencerede (ve JS yokken yerinde açılan kartta) */
.sayfa-23 :is(.bk-metin, .bilgi-karti) > ul:first-of-type {
  display: flex; flex-wrap: wrap; gap: 12px 10px; margin-bottom: 2em; padding: 0; list-style: none;
}
.sayfa-23 :is(.bk-metin, .bilgi-karti) > ul:first-of-type > li {
  margin: 0; padding: 6px 15px; border-radius: 18px; background: var(--bk-bg); border: 2px solid var(--bk-acc);
  font-size: 15.5px; line-height: 1.45;
}
.sayfa-23 :is(.bk-metin, .bilgi-karti) > ul:first-of-type > li > strong { color: var(--bk-koyu); }
/* "Sana Çağrımız" bölümünün son satırı: el yazısı, ortalı */
.sayfa-23 .prose > ul + p:last-child { margin-top: 1.6em; text-align: center; font-family: var(--font-script); font-size: 1.7em; line-height: 1.2; }
@media (max-width: 599.98px) {
  .sayfa-23 .bilgi-karti:not([open]) > summary { min-height: 74px; padding: 12px 58px 12px 78px; font-size: 25px; }
  .sayfa-23 .bilgi-karti:not([open]) > summary::before { left: 14px; width: 48px; height: 48px; margin-top: -24px; background-size: 32px, auto; }
  .sayfa-23 .bilgi-karti:not([open]) > summary::after { right: 14px; }
  .sayfa-23 .bilgi-karti > summary > em { font-size: 15px; }
}
@media (prefers-reduced-motion: reduce) {
  .sayfa-23 .bilgi-karti:not([open]):hover, .sayfa-23 .bilgi-karti:nth-of-type(even):not([open]):hover,
  .sayfa-23 .bilgi-karti:not([open]):active, .sayfa-23 .bilgi-karti:hover > summary::after { transform: none; }
}
@media print {
  .sayfa-23 .bilgi-karti:not([open]) { background: none; box-shadow: none; }
  .sayfa-23 .bilgi-karti > summary::after { display: none; }
}

/* ============================================================
   RENKLİ DÜĞME — editörde: <a class="dugme" data-renk="1–6" href="…">…</a>
   ya da pencere açan: <a class="dugme" data-renk="1" data-pencere="yol-arkadasi" href="#yol-arkadasi">…</a>
   Çıkartma görünümü (kartlardaki numara rozetleriyle aynı dil): renkli hap, siyah kontur, kayık gölge.
   data-renk yoksa bilgi kartının içinde kartın vurgu rengini, dışında marka turuncusunu alır.
   ============================================================ */
a.dugme, .prose a.dugme {
  display: inline-flex; align-items: center; gap: 12px;
  min-height: 52px; padding: 7px 8px 7px 24px;
  border: 2.5px solid #1b1b1b; border-radius: 999px;
  background: var(--bk-acc, #f3672e); color: #1b1b1b;
  font-family: var(--font-el); font-weight: 700; font-size: 20px; line-height: 1.2; letter-spacing: .01em;
  text-decoration: none; box-shadow: 4px 4px 0 #1b1b1b;
  margin: 4px 0 10px;   /* aynı paragrafta alt satıra kayan düğmeler birbirine (ve gölgesine) değmesin */
  transition: transform .18s cubic-bezier(.3, 1.4, .5, 1), box-shadow .18s;
  -webkit-tap-highlight-color: transparent;
}
a.dugme:has(+ a.dugme) { margin-right: 14px; }   /* yan yana düğmeler */
a.dugme::after {
  content: "\2192"; content: "\2192" / "";
  flex: none; display: grid; place-items: center; width: 34px; height: 34px;
  border-radius: 50%; background: #fff; border: 2px solid #1b1b1b;
  font-family: var(--font-govde); font-weight: 700; font-size: 18px; line-height: 1;
  transition: transform .2s;
}
@media (hover: hover) {
  a.dugme:hover { transform: translate(-2px, -2px) rotate(-1deg); box-shadow: 6px 6px 0 #1b1b1b; }
  a.dugme:hover::after { transform: translateX(3px); }
}
a.dugme:active { transform: translate(3px, 3px); box-shadow: 1px 1px 0 #1b1b1b; }
a.dugme:focus-visible { outline: 3px solid var(--focus-mavi); outline-offset: 4px; }
.prose p:has(> a.dugme:only-child) { margin-top: 1.5em; }

/* ============================================================
   PENCERELER — <dialog class="zp" id="slug"> (partials/pencere.php; Panel > Pencereler).
   Gökyüzü zemin + beyaz "bulut" kart. Kart penceresinin içinden açılınca onun üstüne biner.
   ============================================================ */
html.zp-kilit, html.zp-kilit body { overflow: hidden; }
html.zp-kilit body { padding-right: var(--bk-sb, 0); }
.zp {
  --zp-yazi: #1E3640; --zp-etiket: #23434D; --zp-soluk: #557079; --zp-cizgi: #648F9E;
  --zp-alan: #F6FBFD; --zp-teal: #0E6E6D; --zp-hata: #B42318;
  padding: 0; border: 0; color: var(--zp-yazi);
  width: min(720px, calc(100vw - 32px)); max-width: none;
  max-height: min(92vh, 960px); max-height: min(92dvh, 960px);
  border-radius: 34px; overflow: hidden;
  background-color: #AEE0F4;   /* tam opak zemin; degrade yalnız süs */
  background-image:
    radial-gradient(circle at 40px 40px, rgba(255, 251, 238, .95) 0, rgba(255, 247, 228, .5) 70px, rgba(255, 247, 228, 0) 150px),
    linear-gradient(180deg, #84CDEE 0%, #AEE0F4 24%, #DDF2F6 56%, #FFEBD6 86%, #FFE0C4 100%);
  box-shadow: 0 40px 90px -30px rgba(0, 50, 60, .65);
  font-family: var(--font-govde); font-size: 16px; line-height: 1.55; letter-spacing: -0.0125rem;
}
.zp[open] { display: flex; flex-direction: column; animation: zp-gel .42s cubic-bezier(.2, 1.3, .4, 1); }
.zp::backdrop { background: rgba(8, 48, 58, .55); -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); }
html.bk-kilit .zp::backdrop { background: rgba(8, 48, 58, .35); }   /* kart penceresinin üstünde: zemin iki kez kararmasın */
.zp[open]::backdrop { animation: bk-sis .25s ease-out; }
@keyframes zp-gel { from { opacity: 0; transform: translateY(24px) scale(.94); } }
@keyframes zp-yuksel { from { opacity: .4; transform: translateY(80px); } }
@keyframes zp-suzul { from { transform: translateX(-10px); } to { transform: translateX(10px); } }
@keyframes zp-salin { from { transform: rotate(-4deg) translateY(0); } to { transform: rotate(3deg) translateY(-6px); } }

/* süsler (aria-hidden) */
.zp-gok { position: absolute; inset: 0; overflow: hidden; pointer-events: none; }
.zp-gok > * { position: absolute; display: block; background: center / contain no-repeat; }
.zp-gunes {
  width: 112px; height: 112px; left: -14px; top: -14px;
  background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-60 -60 120 120'><path d='M37 0h15M18.5 32 26 45M-18.5 32-26 45M-37 0h-15M-18.5-32-26-45M18.5-32 26-45M32 18.5l7.8 4.5M0 37v9M-32 18.5l-7.8 4.5M-32-18.5l-7.8-4.5M0-37v-9M32-18.5l7.8-4.5' stroke='%23F2B801' stroke-width='5' stroke-linecap='round'/><circle r='29' fill='%23F2B801'/><path d='M-15-15a21 21 0 0 1 17-7' fill='none' stroke='%23FFE27A' stroke-width='3.5' stroke-linecap='round'/><g fill='none' stroke='%235a3600' stroke-width='2.6' stroke-linecap='round'><path d='M-13-2q4-5 8 0M5-2q4-5 8 0M-8 8q8 8 16 0'/></g><circle cx='-16' cy='7' r='3.6' fill='%23f3672e' opacity='.5'/><circle cx='16' cy='7' r='3.6' fill='%23f3672e' opacity='.5'/></svg>");
}
.zp-bulut {
  background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='16 5 162 79'><g id='a'><circle cx='38' cy='62' r='18'/><circle cx='72' cy='46' r='27'/><circle cx='114' cy='40' r='31'/><circle cx='152' cy='58' r='22'/><rect x='38' y='50' width='114' height='30'/></g><use href='%23a' fill='%23BFE1E8' stroke='%23BFE1E8' stroke-width='5'/><use href='%23a' fill='%23fff'/></svg>");
  animation: zp-suzul 9s ease-in-out infinite alternate;
}
.zp-bulut--1 { width: 98px; height: 48px; left: 112px; top: 30px; }
.zp-bulut--2 { width: 70px; height: 34px; right: 168px; top: 14px; animation-direction: alternate-reverse; }
.zp-kuslar {
  width: 44px; height: 20px; left: 54%; top: 40px;
  background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-2 -4 54 24'><path d='M0 17q6-7 12 0q6-7 12 0M31 0q4.5-5 9 0q4.5-5 9 0' fill='none' stroke='%2377A6B0' stroke-width='2.2' stroke-linecap='round'/></svg>");
}
.zp-balon {   /* sıcak hava balonu: sol kenarda */
  width: 30px; height: 45px; left: 7px; top: 44%;
  background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 56 84'><g stroke='%231b1b1b' stroke-width='1.8' stroke-linejoin='round'><path d='M28 2C12 2 2 14 2 28c0 16 14 26 20 36h12c6-10 20-20 20-36C54 14 44 2 28 2Z' fill='%23f3672e'/><path d='M28 2c-8 0-12 12-12 26 0 16 6 26 8 36h8c2-10 8-20 8-36 0-14-4-26-12-26Z' fill='%23FFF1E2'/><path d='M28 2c-3 0-4.5 12-4.5 26 0 16 2.5 26 3 36h3c.5-10 3-20 3-36 0-14-1.5-26-4.5-26Z' fill='%23029E9C'/><path d='M23 64l1 8M33 64l-1 8' fill='none'/><rect x='21' y='72' width='14' height='10' rx='2' fill='%23F2B801'/></g></svg>");
  animation: zp-salin 5s ease-in-out infinite alternate;
}
.zp-balonlar {   /* üç balon: sağ kenarda */
  width: 34px; height: 46px; right: 5px; top: 62%;
  background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-15 -26 76 100'><g stroke='%231b1b1b' stroke-width='1.6'><path d='M0 18C2 40 16 54 24 72M24 8C22 36 26 52 24 72M46 22C42 44 30 56 24 72' fill='none' stroke-width='1.3'/><ellipse cx='0' cy='2' rx='13' ry='16' fill='%23f3672e'/><ellipse cx='24' cy='-8' rx='13' ry='16' fill='%23F2B801'/><ellipse cx='46' cy='6' rx='13' ry='16' fill='%23029E9C'/><path d='M-7 0a8 10 0 0 1 4-8M17-10a8 10 0 0 1 4-8M39 4a8 10 0 0 1 4-8' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' opacity='.75'/></g></svg>");
  animation: zp-salin 6s ease-in-out infinite alternate-reverse;
}
.zp-tepe {
  left: 0; right: 0; bottom: 0; height: 92px;
  background:
    url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 60'><path d='M20 58V30' stroke='%23077E7E' stroke-width='4' stroke-linecap='round'/><circle cx='20' cy='21' r='15' fill='%2350B8A6'/></svg>") left 12px bottom 30px / 26px 39px no-repeat,
    url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 60'><path d='M20 58V30' stroke='%23077E7E' stroke-width='4' stroke-linecap='round'/><circle cx='20' cy='21' r='15' fill='%2350B8A6'/></svg>") right 14px bottom 44px / 20px 30px no-repeat,
    url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 100' preserveAspectRatio='none'><path d='M0 46C80 46 130 20 220 20S370 58 460 58S560 36 600 36V100H0Z' fill='%23CBEBE3'/><path d='M0 62C90 62 150 38 250 38S420 76 510 76S580 66 600 64V100H0Z' fill='%2391D5C6'/><path d='M0 84C120 84 180 64 300 64S480 92 600 86V100H0Z' fill='%2326A699'/></svg>") center bottom / 100% 100% no-repeat;
}

/* kapat: kart penceresindekiyle aynı; kayan alanın dışında → hep görünür */
.zp-kapat {
  position: absolute; z-index: 3; top: 18px; right: 18px;
  display: inline-flex; align-items: center; gap: 6px; min-height: 44px;
  padding: 8px 16px; border-radius: 999px; cursor: pointer;
  background: #fff; color: #1b1b1b; border: 2.5px solid #1b1b1b; box-shadow: 3px 3px 0 rgba(0, 0, 0, .18);
  font-family: var(--font-el); font-weight: 700; font-size: 17px; line-height: 1.1;
  transition: background-color .2s, color .2s;
}
.zp-kapat [aria-hidden] { font-family: var(--font-govde); font-size: 24px; line-height: .8; font-weight: 400; }
@media (hover: hover) { .zp-kapat:hover { background: #1b1b1b; color: #fff; } }
.zp-kapat:focus-visible { outline: 3px solid var(--focus-mavi); outline-offset: 3px; }

.zp-govde {
  position: relative; z-index: 1; flex: 1 1 auto; min-height: 0;
  overflow-y: auto; overscroll-behavior: contain;
  /* üstte 62px gökyüzü bandı kaymaz (güneş, bulut, Kapat): kayan içerik Kapat düğmesinin altına girmez */
  margin-top: 62px; padding: 40px 40px 52px;
  letter-spacing: .012em; word-spacing: .04em;   /* düğmeli/formlu pencere: bilgi kartı penceresiyle aynı ferahlık */
  scrollbar-width: thin; scrollbar-color: rgba(14, 110, 109, .45) transparent;
}
/* beyaz bulut kart (yönetim girişi kartıyla aynı dil: yuvarlak, üstünde bulut kabarıkları) */
.zp-kart {
  position: relative; background: #fff; border-radius: 40px;
  padding: 38px 34px 32px;
  box-shadow: inset 0 -8px 0 #EEF7FB;
  filter: drop-shadow(0 22px 26px rgba(36, 104, 135, .22)) drop-shadow(0 4px 8px rgba(36, 104, 135, .10));
}
.zp-kart::before {
  content: ""; position: absolute; z-index: -1; left: 0; right: 0; top: -46px; height: 90px;
  background:
    radial-gradient(circle at 21% 70px, #fff 0 46px, transparent 47px),
    radial-gradient(circle at 50% 80px, #fff 0 70px, transparent 71px),
    radial-gradient(circle at 79% 72px, #fff 0 50px, transparent 51px);
}
.zp-baslik {
  margin: 0; text-align: center;
  font-family: var(--font-script); font-weight: 700; font-size: 48px; line-height: 1.18; color: var(--zp-teal);
  text-wrap: balance; overflow-wrap: break-word;
}
.zp-baslik > span {
  display: inline-block; padding-bottom: 10px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 14' preserveAspectRatio='none'%3E%3Cpath d='M4 9 C 40 3, 80 3, 112 7 S 170 12, 196 5' fill='none' stroke='%23F3672E' stroke-width='4' stroke-linecap='round'/%3E%3C/svg%3E") 50% 100% / 86% 12px no-repeat;
}
.zp-baslik:focus { outline: none; }
.zp-giris {
  margin: 14px auto 26px; max-width: 30em; text-align: center;
  font-family: var(--font-el); font-size: 19px; line-height: 1.45; color: var(--zp-etiket);
}

/* Düğmeli pencere: 1–4 seçenek */
.zp-secenekler { list-style: none; margin: 0 auto; padding: 0; max-width: 560px; display: grid; grid-template-columns: 1fr; gap: 18px; }
@media (min-width: 760px) {
  .zp-secenekler { grid-template-columns: 1fr 1fr; max-width: none; }
  /* tek düğme ya da tek kalan son düğme: ortada, yarım genişlikte */
  .zp-secenekler > li:last-child:nth-child(odd) { grid-column: 1 / -1; justify-self: center; width: calc(50% - 9px); }
}
.zp-secenekler > li { margin: 0; min-width: 0; display: flex; flex-direction: column; }
.zp-secenek {
  display: flex; align-items: center; gap: 10px; min-height: 66px;
  padding: 8px 16px 8px 8px; border: 2.5px solid #1b1b1b; border-radius: 999px;
  background: var(--bk-acc); color: #1b1b1b; text-decoration: none;
  font-family: var(--font-el); font-weight: 700; font-size: 20px; line-height: 1.15;
  overflow-wrap: break-word;
  box-shadow: 4px 4px 0 #1b1b1b;
  transition: transform .18s cubic-bezier(.3, 1.4, .5, 1), box-shadow .18s;
  -webkit-tap-highlight-color: transparent;
}
.zp-secenek:not([data-ikon]) { padding-left: 24px; }
.zp-secenek[data-ikon]::before {
  content: ""; flex: none; width: 46px; height: 46px; border-radius: 50%;
  background: var(--bk-ikon) center / 34px 34px no-repeat, #fff; border: 2px solid #1b1b1b;
}
.zp-secenek::after { content: "\2192"; content: "\2192" / ""; margin-left: auto; padding-left: 4px; font-family: var(--font-govde); font-weight: 700; font-size: 20px; transition: transform .2s; }
@media (hover: hover) {
  .zp-secenek:hover { transform: translate(-2px, -2px) rotate(-1deg); box-shadow: 6px 6px 0 #1b1b1b; }
  .zp-secenekler > li:nth-child(even) .zp-secenek:hover { transform: translate(-2px, -2px) rotate(1deg); }
  .zp-secenek:hover::after { transform: translateX(3px); }
}
.zp-secenek:active { transform: translate(3px, 3px); box-shadow: 1px 1px 0 #1b1b1b; }
.zp-secenek:focus-visible { outline: 3px solid var(--focus-mavi); outline-offset: 4px; }
.zp-secenek-not { margin: 12px 6px 0; text-align: center; font-size: 15px; line-height: 1.4; color: var(--zp-soluk); }

/* Fikir formu */
.zp-form { margin: 0; }
.zp-zorunlu-not { margin: -8px 0 18px; text-align: center; font-size: 14px; color: var(--zp-soluk); }
.zp-yildiz { color: var(--zp-hata); font-weight: 700; }
.zp-satir { display: grid; grid-template-columns: 1fr 1fr; gap: 0 16px; }
.zp-alan { margin: 0 0 16px; min-width: 0; }
.zp-alan > label { display: block; margin: 0 0 6px 4px; font-size: 15px; font-weight: 600; line-height: 1.3; color: var(--zp-etiket); }
.zp-alan input, .zp-alan textarea {
  display: block; width: 100%; margin: 0; height: 52px; padding: 0 16px;
  border: 2px solid var(--zp-cizgi); border-radius: 18px; background: var(--zp-alan);
  font: 500 16.5px/1.3 var(--font-govde); color: var(--zp-yazi);   /* ≥16px: iOS odakta yakınlaştırmaz */
  -webkit-appearance: none; appearance: none;
  transition: border-color .2s, box-shadow .2s, background-color .2s;
}
.zp-alan textarea { height: auto; min-height: 124px; padding: 13px 16px; line-height: 1.5; resize: vertical; }
.zp-alan input::placeholder, .zp-alan textarea::placeholder { color: var(--zp-soluk); opacity: 1; }
.zp-alan input:hover, .zp-alan textarea:hover { border-color: #4F7F8E; }
/* odak: kenar koyu teal + 2px daha kalın (beyaza karşı 6:1) ve yumuşak hale — yalnız açık renk haleye güvenilmez */
.zp-alan input:focus, .zp-alan textarea:focus { outline: 2px solid transparent; border-color: var(--zp-teal); background: #fff; box-shadow: 0 0 0 2px var(--zp-teal), 0 0 0 6px rgba(35, 168, 167, .28); }
.zp-alan [aria-invalid="true"] { border-color: #C4320A; background: #FFF8F5; }
.zp-alan [aria-invalid="true"]:focus { border-color: #C4320A; box-shadow: 0 0 0 2px #C4320A, 0 0 0 6px rgba(196, 50, 10, .18); }
.zp-hata, .zp-form-mesaj { display: flex; align-items: flex-start; gap: 7px; margin: 7px 4px 0; font-size: 14.5px; font-weight: 600; line-height: 1.35; color: var(--zp-hata); }
.zp-hata::before, .zp-form-mesaj::before {
  content: "!"; flex: none; display: grid; place-items: center; width: 19px; height: 19px; margin-top: 0;
  border-radius: 50%; background: var(--zp-hata); color: #fff; font-size: 13px; font-weight: 800; line-height: 1;
}
.zp-hata[hidden], .zp-form-mesaj[hidden] { display: none; }
/* gönderim hatası (oturum, bağlantı, çok sık gönderim): Gönder düğmesinin hemen üstünde, ortalı */
.zp-form-mesaj { justify-content: center; margin: 0 auto 16px; max-width: 34em; text-align: left; }
.zp-guvenlik[hidden] { display: none; }
.zp-guvenlik input { max-width: 11em; }
.zp-bal { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }   /* bal tuzağı: insan görmez, bot doldurur */
.zp-gizlilik { margin: 2px auto 20px; max-width: 34em; text-align: center; font-size: 14.5px; line-height: 1.5; color: var(--zp-soluk); }
.zp-gizlilik a { color: var(--zp-teal); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; white-space: nowrap; }   /* "Gizlilik Politikası" satırda bölünmez */
.zp-gizlilik a:hover { text-decoration-thickness: 2px; }
.zp-gizlilik a:focus-visible { outline: 3px solid var(--focus-mavi); outline-offset: 2px; border-radius: 3px; }
.zp-gonder {
  display: flex; align-items: center; justify-content: center; gap: 12px;
  width: 100%; max-width: 320px; min-height: 58px; margin: 0 auto; padding: 10px 26px;
  border: 2.5px solid #1b1b1b; border-radius: 999px; cursor: pointer;
  background: var(--bk-acc, #029E9C); color: #1b1b1b;
  font-family: var(--font-el); font-weight: 700; font-size: 22px; line-height: 1.1;
  box-shadow: 4px 4px 0 #1b1b1b;
  transition: transform .18s cubic-bezier(.3, 1.4, .5, 1), box-shadow .18s;
}
.zp-gonder::after {   /* kâğıt uçak */
  content: ""; flex: none; width: 30px; height: 24px;
  background: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 52 42'><path d='M3 22L49 3L35 39L23 28Z' fill='%23fff' stroke='%231b1b1b' stroke-width='3' stroke-linejoin='round'/><path d='M49 3L23 28L21 39L28 32' fill='none' stroke='%231b1b1b' stroke-width='3' stroke-linejoin='round'/></svg>") center / contain no-repeat;
  transition: transform .25s;
}
@media (hover: hover) {
  .zp-gonder:hover { transform: translate(-2px, -2px); box-shadow: 6px 6px 0 #1b1b1b; }
  .zp-gonder:hover::after { transform: translate(4px, -3px) rotate(-6deg); }
}
.zp-gonder:active { transform: translate(3px, 3px); box-shadow: 1px 1px 0 #1b1b1b; }
.zp-gonder:focus-visible { outline: 3px solid var(--focus-mavi); outline-offset: 4px; }
.zp-gonder[aria-busy="true"] { cursor: progress; opacity: .75; transform: none; box-shadow: 4px 4px 0 #1b1b1b; }
.zp-gonder[aria-busy="true"]::after { animation: zp-uc 1s ease-in-out infinite alternate; }
@keyframes zp-uc { to { transform: translate(6px, -5px) rotate(-8deg); } }
.zp-gonder--kapat::after { display: none; }

/* teşekkür görünümü */
.zp-tesekkur { position: relative; text-align: center; padding: 4px 0 6px; }
.zp-tesekkur[hidden], .zp-form-alani[hidden] { display: none; }
.zp-tesekkur::before {   /* konfeti */
  content: ""; position: absolute; left: 50%; top: -10px; width: 300px; height: 150px; margin-left: -150px; z-index: -1;
  background:
    radial-gradient(circle, #f3672e 0 5px, transparent 6px) 30px 30px / 12px 12px no-repeat,
    radial-gradient(circle, #F2B801 0 4px, transparent 5px) 250px 18px / 10px 10px no-repeat,
    radial-gradient(circle, #029E9C 0 5px, transparent 6px) 262px 100px / 12px 12px no-repeat,
    radial-gradient(circle, #EC7AA2 0 4px, transparent 5px) 20px 112px / 10px 10px no-repeat,
    radial-gradient(circle, #4AA8D0 0 3px, transparent 4px) 66px 4px / 8px 8px no-repeat,
    radial-gradient(circle, #7BBA48 0 3px, transparent 4px) 220px 136px / 8px 8px no-repeat;
}
.zp-tesekkur-resim {
  display: block; width: 128px; height: 128px; margin: 0 auto 12px; border-radius: 50%;
  background: var(--bk-ikon) center / 92px 92px no-repeat, var(--bk-bg);
  border: 3px dashed var(--bk-acc);
  animation: zp-zipla 1.6s cubic-bezier(.3, 1.4, .5, 1) .2s both;
}
@keyframes zp-zipla { 0% { transform: scale(.6) rotate(-10deg); opacity: 0; } 60% { transform: scale(1.06) rotate(3deg); opacity: 1; } 100% { transform: none; } }
.zp-tesekkur p { margin: 14px auto 26px; max-width: 26em; font-family: var(--font-el); font-size: 19px; line-height: 1.5; color: var(--zp-etiket); }

/* Telefon ya da alçak ekran: alttan açılan sayfa; kapat düğmesi sabit, içerik kendi içinde kayar */
@media (max-width: 599.98px), (max-height: 520px) {
  .zp {
    width: 100%; max-width: 100%; margin: auto 0 0;
    max-height: 94vh; max-height: 94dvh; border-radius: 28px 28px 0 0;
  }
  .zp[open] { animation-name: zp-yuksel; animation-duration: .32s; animation-timing-function: ease-out; }
  .zp-govde { margin-top: 62px; padding: 22px 14px calc(30px + env(safe-area-inset-bottom)); }
  .zp-gunes { width: 80px; height: 80px; left: -12px; top: -12px; }
  .zp-bulut--1 { width: 72px; height: 35px; left: 78px; top: 22px; }
  .zp-bulut--2, .zp-balon, .zp-balonlar { display: none; }
  .zp-kuslar { width: 34px; height: 16px; left: 168px; top: 36px; }
  .zp-tepe { height: 64px; background-size: 20px 30px, 16px 24px, 100% 100%; }
  .zp-kapat { top: 14px; right: 14px; padding: 8px 14px; }
  .zp-kart { border-radius: 30px; padding: 30px 18px 24px; }
  .zp-kart::before {
    top: -34px; height: 70px;
    background:
      radial-gradient(circle at 20% 54px, #fff 0 32px, transparent 33px),
      radial-gradient(circle at 50% 62px, #fff 0 50px, transparent 51px),
      radial-gradient(circle at 80% 56px, #fff 0 36px, transparent 37px);
  }
  .zp-baslik { font-size: 42px; }
  .zp-giris { font-size: 18px; margin: 12px auto 20px; }
  .zp-secenekler { grid-template-columns: 1fr; gap: 18px; }
  .zp-secenek-not { margin-top: 8px; }
  .zp-satir { grid-template-columns: 1fr; }
  .zp-zorunlu-not { margin: -4px 0 16px; }
  .zp-alan textarea { min-height: 120px; }
  .zp-gonder { max-width: none; }
}
/* Alçak ekran (yatay telefon, %200 yakınlaştırma): gökyüzü bandı ve kart sıkışır; genişse düğmeler yan yana */
@media (max-height: 520px) {
  .zp { max-height: 100vh; max-height: 100dvh; }
  .zp-govde { margin-top: 46px; padding: 16px 14px calc(18px + env(safe-area-inset-bottom)); }
  .zp-gunes { width: 60px; height: 60px; left: -10px; top: -10px; }
  .zp-bulut--1 { width: 56px; height: 27px; left: 60px; top: 12px; }
  .zp-kuslar { display: none; }
  .zp-tepe { height: 40px; }
  .zp-kapat { top: 4px; right: 10px; min-height: 40px; padding: 5px 12px; }
  .zp-kart { padding: 24px 18px 18px; }
  .zp-kart::before { top: -24px; height: 50px;
    background:
      radial-gradient(circle at 20% 38px, #fff 0 22px, transparent 23px),
      radial-gradient(circle at 50% 44px, #fff 0 34px, transparent 35px),
      radial-gradient(circle at 80% 40px, #fff 0 25px, transparent 26px); }
  .zp-baslik { font-size: 34px; }
  .zp-giris { font-size: 17px; margin: 8px auto 14px; }
}
@media (max-height: 520px) and (min-width: 560px) {
  .zp-secenekler { grid-template-columns: 1fr 1fr; gap: 14px; max-width: none; }
  .zp-secenekler > li:last-child:nth-child(odd) { grid-column: 1 / -1; justify-self: center; width: calc(50% - 7px); }
  .zp-satir { grid-template-columns: 1fr 1fr; }
}

/* JS yoksa: bağlantı #slug çapasına gider, pencere sayfada düz blok olarak görünür */
html:not(.zp-js) .zp:target {
  display: block; position: relative; inset: auto; margin: 40px auto;
  width: min(720px, calc(100% - 32px)); max-height: none;
  scroll-margin-top: calc(var(--header-h, 64px) + 40px);   /* yapışkan üst bar başlığı örtmesin */
}
html:not(.zp-js) .zp:target .zp-govde { overflow: visible; }
html:not(.zp-js) .zp-kapat, html:not(.zp-js) .zp-gonder--kapat { display: none; }

@media (prefers-reduced-motion: reduce) {
  a.dugme, .prose a.dugme, a.dugme::after, .zp-secenek, .zp-secenek::after, .zp-gonder, .zp-gonder::after,
  .zp[open], .zp[open]::backdrop, .zp-gok > *, .zp-tesekkur-resim { animation: none; transition: none; }
  a.dugme:hover, a.dugme:active, .zp-secenek:hover, .zp-secenekler > li:nth-child(even) .zp-secenek:hover, .zp-secenek:active,
  .zp-gonder:hover, .zp-gonder:active { transform: none; }
  a.dugme:hover::after, .zp-secenek:hover::after, .zp-gonder:hover::after { transform: none; }
  .zp-gonder[aria-busy="true"]::after { animation: none; }
}
@media (forced-colors: active) {
  a.dugme, .zp-secenek, .zp-gonder, .zp-kapat { border-color: ButtonText; }
  .zp-alan input, .zp-alan textarea { border-color: FieldText; }
  /* yüksek karşıtlıkta renkli zeminler kaybolur: kartlar, "Devamını oku" ve pencereler çerçeveyle belirgin kalsın */
  .bilgi-karti { border: 2px solid CanvasText; }
  .bilgi-karti > summary::after { border: 2px solid ButtonText; }
  .bk-dialog, .zp { border: 2px solid CanvasText; }
  .bk-onceki, .bk-sonraki { border: 2px solid ButtonText; }
}
@media print { .zp { display: none !important; } }

/* ============ ANA SAYFA — "RENKLİ ÇIKARTMALAR" (B) + "DUYURULAR & İLANLAR" (sahibin onayı, 21 Eki 2026) ============
   Kaynak: _tasarim-onizleme/ana-sayfa/b-duyurular.html (<style id="anasayfa-yeni">). Her kural body.is-home altında.
   Krem zemin + köşe konfetileri; giriş metni krem kesikli çerçeveli kartta (.intro-kart); sağında (telefonda altında)
   turkuaz "Duyurular & İlanlar" kartı (.duyuru-kart, Ayarlar'dan en çok 6 sayfa); "Neler Yapıyoruz?" bandı tepelerle
   açılan nane yeşili çayır, kutular çıkartma; ortaklar bölümü çiçekli tepelerle footer'a bağlanır.
   Bölüm başlıkları SOLA dayalı, fırça altı çizgisi solda, küçük süs yalnız başlığın sağında (kullanıcı kararı).

   home.php
   - Giriş bölümü: <section class="section section-intro[ section-intro--ikili]"><div class="container intro-ikili">
     (giriş metni varsa) <div class="prose prose-center intro-kart"> + (bağlantı varsa) <section class="duyuru-kart">.
     section-intro--ikili YALNIZ giriş metni VE bağlantı birlikte varsa:
       bağlantı yok    → duyuru kartı yok, sınıf yok → giriş kartı ortada tam genişlik (B'nin tek kart görünümü)
       giriş metni yok → yalnız duyuru kartı, ortada en çok 52rem;   ikisi de yok → bölüm basılmaz
     Güvenlik ağı: .intro-ikili > .duyuru-kart:only-child her durumda iki sütunu kaplar, ortalanır.
   - ≥1024 kap: .intro-ikili kendi 20px yan dolgusunu kullanır, en çok 1160px; sütunlar 6fr / 5fr, eşit yükseklik.
   - Satır renk/simge döngüsü sıraya göre (6n): turuncu+yıldız, turkuaz+kalp, hardal+nota, gök+filiz, pembe+balon, yeşil+ampul.
   - Satır adı ve kısa not en çok 2 satır (line-clamp). Ekran okuyucu: "Yeni" ve not öncesi gizli virgül (.gorsel-gizli).
   - Tepeler <main>'in (#icerik) dibinde: son bölüm ortaklar, CTA ya da Son Duyurular olsa da footer'a bağlanır.
   - Kutu ızgarası 1–4 kutuya uyar (auto-fit; telefonda tek kalan son kutu tam genişlik). Simgeler sıraya göre.
   - CMS'teki kırmızı satır (#e03e2d) krem kartta 4,5:1'in altına düşüyordu: yalnız renk #B3261A'ya çekilir.
   - Son Duyurular / Öne Çıkanlar: yazı kartları krem zeminde beyaz çıkartma kart, "Tümünü gör →" hap düğme (en altta).

   KONTRAST (WCAG 2.x)
   #1b1b1b / #FFFAF3 kart 16,58 · / #FFF1E0 zemin 15,51 · / #DDF2EC çayır 14,75 · / #DCF3F1 duyuru kartı 14,87
   #B3261A / #FFFAF3 6,30 · #1b1b1b / #F3672E 5,57 · / #23A8A7 5,93 · / #F2B801 9,54 · / #D3EBF7 13,94 · / #fff 17,22
   not #4a4a4a / #fff 8,86 (hover #FFFAF3 8,53) · kart etiketi #1b1b1b / #DCF3F1 14,87
   Odak halkası #134493 / #DDF2EC 7,90 · / #FFF1E0 8,31 · / #FFFAF3 8,88 · / #D3EBF7 7,47 · / #DCF3F1 7,97 · / #fff 9,23
   ============================================================================================ */

/* Krem zemin + çiçekli tepeler <main>'in dibinde: son bölüm hangisi olursa olsun (ortaklar, CTA, duyurular)
   tepeler footer'ın fırça kenarına değer */
body.is-home #icerik {
  padding-bottom: 80px;
  background: var(--b-tepeler) repeat-x left -40px bottom / 267px 43px, var(--b-tepeler2) repeat-x left -100px bottom / 333px 63px,
              var(--b-tepeler3) repeat-x left 0 bottom / 480px 80px, #FFF1E0;
}
body.is-home {
  --b-tepeler: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 800 130'><defs><g id='d'><path d='M0 0V-13' stroke='%23077E7E' stroke-width='2' stroke-linecap='round'/><circle cy='-19' r='3.4'/><circle cx='4.4' cy='-15.9' r='3.4'/><circle cx='2.7' cy='-10.8' r='3.4'/><circle cx='-2.7' cy='-10.8' r='3.4'/><circle cx='-4.4' cy='-15.9' r='3.4'/><circle cy='-14.6' r='2.6' fill='%23f3672e'/></g><g id='u'><path d='M0 0V-12' stroke='%23077E7E' stroke-width='2' stroke-linecap='round'/><path d='M-5-14V-22L-2.5-19.5L0-23L2.5-19.5L5-22V-14Q5-10 0-10Q-5-10-5-14Z' fill='%23f3672e'/></g></defs><path d='M0 70C110 70 170 32 280 32S450 80 560 80S700 70 800 70V130H0Z' fill='%2326A699'/><use href='%23d' x='30' y='72' fill='%23fff'/><use href='%23d' x='140' y='54' fill='%23fff'/><use href='%23u' x='205' y='41'/><use href='%23d' x='300' y='36' fill='%23F2B801'/><use href='%23d' x='420' y='59' fill='%23fff'/><use href='%23u' x='560' y='83'/><use href='%23d' x='684' y='78' fill='%23F2B801'/></svg>");
  --b-tepeler2: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1000 190'><path d='M0 120C120 120 200 60 320 60S520 110 640 110S800 75 880 75S960 120 1000 120V190H0Z' fill='%2391D5C6'/><path d='M320 64V38M880 79V60' stroke='%23077E7E' stroke-width='5' stroke-linecap='round'/><circle cx='320' cy='28' r='18' fill='%2350B8A6'/><circle cx='880' cy='52' r='12' fill='%2350B8A6'/></svg>");
  --b-tepeler3: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 240'><path d='M0 150C140 150 220 80 360 80S560 140 700 140S900 60 1060 60S1300 150 1440 150V240H0Z' fill='%23CBEBE3'/></svg>");
}
body.is-home .site-footer { margin-top: 0; }   /* tepeler footer'ın fırça kenarına değer (gökyüzü sayfaları gibi) */

/* ---------- Bölüm başlıkları: SOLA dayalı, fırça altı çizgisi solda (kullanıcı kararı, 21 Eki 2026) ---------- */
body.is-home .section-works .section-title,
body.is-home .section-ortaklar .section-title { color: #1b1b1b; }
body.is-home .section-title .baslik-emoji { white-space: nowrap; }   /* 🤜🤛 iki satıra bölünmesin */

/* ---------- 1. Giriş: krem kesikli çerçeveli kart ---------- */
body.is-home .section-intro { position: relative; padding-bottom: 74px; }
body.is-home .intro-kart {
  position: relative; z-index: 1;
  width: 100%; max-width: 52rem; margin-left: auto; margin-right: auto;   /* kabın 20px dolgusu kenar boşluğu */
  padding: 72px 22px 32px;
  color: #1b1b1b;
  background: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 112'><g fill='none' stroke-linecap='round' stroke-width='3'><path d='M44 74q6-7 12 0t12 0' stroke='%23029E9C'/><path d='M560 34q6-7 12 0t12 0' stroke='%23f3672e'/><path d='M120 92q5-6 10 0t10 0' stroke='%23EC7AA2'/><path d='M488 88q5-6 10 0t10 0' stroke='%237BBA48'/></g><g stroke='%231b1b1b' stroke-width='1.6' stroke-linejoin='round'><path d='M98 22l9 4-7 7z' fill='%23F2B801'/><path d='M532 70l10 1-5 9z' fill='%234AA8D0'/><path d='M28 32l7 6-8 4z' fill='%23f3672e'/><path d='M606 76l8-3 1 9z' fill='%23029E9C'/><rect x='170' y='84' width='9' height='9' rx='2' transform='rotate(20 174 88)' fill='%237BBA48'/><rect x='462' y='22' width='9' height='9' rx='2' transform='rotate(-18 466 26)' fill='%23EC7AA2'/></g><g><circle cx='72' cy='40' r='4' fill='%234AA8D0'/><circle cx='150' cy='54' r='3.5' fill='%23f3672e'/><circle cx='14' cy='88' r='3' fill='%23F2B801'/><circle cx='182' cy='20' r='3' fill='%23029E9C'/><circle cx='584' cy='92' r='4' fill='%23F2B801'/><circle cx='512' cy='44' r='3.5' fill='%23029E9C'/><circle cx='626' cy='24' r='3' fill='%23EC7AA2'/><circle cx='458' cy='96' r='3' fill='%23f3672e'/></g><g fill='%23F2B801' stroke='%231b1b1b' stroke-width='1.4' stroke-linejoin='round'><path d='M164 30l2.6 6.4 6.4 2.6-6.4 2.6-2.6 6.4-2.6-6.4-6.4-2.6 6.4-2.6z'/><path d='M478 52l2.4 5.6 5.6 2.4-5.6 2.4-2.4 5.6-2.4-5.6-5.6-2.4 5.6-2.4z' fill='%23f3672e'/><path d='M290 14l2 4.6 4.6 2-4.6 2-2 4.6-2-4.6-4.6-2 4.6-2z' fill='%234AA8D0'/></g><path d='M350 98c12-8 22 3 33-2s21-9 33-2' fill='none' stroke='%23f3672e' stroke-width='6' stroke-linecap='round'/><path d='M352 106c10-5 19 2 28-1' fill='none' stroke='%23F2B801' stroke-width='4' stroke-linecap='round'/><g fill='none' stroke='%231b1b1b' stroke-width='1.5' stroke-linecap='round'><path d='M206 63c4 14 14 22 30 39M234 54c0 16 2 30 2 48M262 65c-6 14-14 22-26 37'/></g><path d='M236 102l-7-4v8zm0 0l7-4v8z' fill='%23f3672e' stroke='%231b1b1b' stroke-width='1.3' stroke-linejoin='round'/><g stroke='%231b1b1b' stroke-width='2.2'><ellipse cx='206' cy='44' rx='15' ry='19' fill='%23f3672e'/><ellipse cx='262' cy='46' rx='15' ry='19' fill='%234AA8D0'/><ellipse cx='234' cy='34' rx='16' ry='20' fill='%23F2B801'/></g><path d='M206 63l-3 4h6zM234 54l-3 4h6zM262 65l-3 4h6z' fill='%231b1b1b'/><path d='M198 38a8 10 0 0 1 4-7M226 28a8 10 0 0 1 4-7M254 40a8 10 0 0 1 4-7' fill='none' stroke='%23fff' stroke-width='2.5' stroke-linecap='round' opacity='.85'/><path d='M228 34q2-2.6 4 0M236 34q2-2.6 4 0M230 40q4 4 8 0' fill='none' stroke='%231b1b1b' stroke-width='1.8' stroke-linecap='round'/><g transform='translate(289 22) scale(.98)'><path d='M32 55C19 46 7 37 7 23.5 7 16 12.6 10.5 19.5 10.5c5.4 0 9.6 3 12.5 7.4 2.9-4.4 7.1-7.4 12.5-7.4C51.4 10.5 57 16 57 23.5 57 37 45 46 32 55z' fill='%23f3672e' stroke='%231b1b1b' stroke-width='2.5' stroke-linejoin='round'/><path d='M14 22a7 7 0 0 1 5.5-6' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' opacity='.85'/><path d='M23.5 28q2.5-3.2 5 0M35.5 28q2.5-3.2 5 0M26 35q6 6.5 12 0' fill='none' stroke='%231b1b1b' stroke-width='2.5' stroke-linecap='round'/><circle cx='21' cy='34' r='2.8' fill='%23FFC4AA'/><circle cx='43' cy='34' r='2.8' fill='%23FFC4AA'/></g><g transform='translate(392 72) rotate(40)' stroke='%231b1b1b' stroke-width='2' stroke-linejoin='round'><path d='M-6 -16L-4.5 -62Q0 -68 4.5 -62L6 -16Z' fill='%23029E9C'/><path d='M-2 -58v30' stroke='%23fff' stroke-width='2' stroke-linecap='round' opacity='.7'/><rect x='-8' y='-17' width='16' height='15' rx='2.5' fill='%23FFF1E2'/><path d='M-8 -10h16' stroke-width='1.5'/><path d='M-7.5 -2C-7.5 9 -3 17 0 22C3 17 7.5 9 7.5 -2Z' fill='%23f3672e'/></g></svg>") center 14px / auto 50px no-repeat, #FFFAF3;
  border-radius: 30px 36px 28px 34px / 34px 28px 36px 30px;   /* "elle kesilmiş" köşeler (bağış kartı) */
  box-shadow: 0 28px 46px -30px rgba(166, 61, 16, .55), 0 3px 0 rgba(166, 61, 16, .07);
}
body.is-home .intro-kart::before {   /* elle çizilmiş kesikli iç çerçeve */
  content: ""; position: absolute; inset: 9px; pointer-events: none;
  border: 2.5px dashed rgba(243, 103, 46, .5);
  border-radius: 23px 29px 21px 27px / 27px 21px 29px 23px;
}
/* CMS kırmızısı krem kartta yetersiz → koyu kiremit (metin değişmez) */
body.is-home .section-intro [style*="#e03e2d" i],
body.is-home .section-intro [style*="rgb(224, 62, 45)"] { color: #B3261A !important; }

/* kartın köşelerinde konfeti: kartın arkasında (z 0), kabın iç boşluğunda → yatay kaydırma yok */
body.is-home .section-intro::before,
body.is-home .section-intro::after {
  content: ""; position: absolute; z-index: 0; width: 84px; height: 84px; pointer-events: none;
  background: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 96 96'><circle cx='14' cy='20' r='5' fill='%23F2B801'/><circle cx='70' cy='12' r='4' fill='%23029E9C'/><circle cx='46' cy='44' r='3' fill='%23EC7AA2'/><path d='M30 8l8 3-6 6z' fill='%23f3672e' stroke='%231b1b1b' stroke-width='1.4' stroke-linejoin='round'/><path d='M8 54q5-6 10 0t10 0' fill='none' stroke='%234AA8D0' stroke-width='3' stroke-linecap='round'/><path d='M78 40l2.4 5.6 5.6 2.4-5.6 2.4-2.4 5.6-2.4-5.6-5.6-2.4 5.6-2.4z' fill='%23F2B801' stroke='%231b1b1b' stroke-width='1.3' stroke-linejoin='round'/><rect x='52' y='72' width='8' height='8' rx='2' transform='rotate(24 56 76)' fill='%237BBA48'/><circle cx='22' cy='84' r='3.5' fill='%23f3672e'/></svg>") center / contain no-repeat;
}
body.is-home .section-intro::before { top: 22px; left: calc(50% - min(26rem, 50% - 20px) - 14px); }
body.is-home .section-intro::after { bottom: 44px; right: calc(50% - min(26rem, 50% - 20px) - 12px); transform: scale(-1); }

@media (min-width: 600px) {
  body.is-home .intro-kart {
    padding: 124px 56px 50px;
    background-position: center 24px, 0 0; background-size: auto 92px, auto;
  }
}
@media (min-width: 1024px) {
  body.is-home .section-intro { padding-bottom: 116px; }
  body.is-home .section-intro::before { top: 42px; }
  body.is-home .section-intro::after { bottom: 84px; }
}
/* geniş ekranda kartın iki yanındaki boş krem alana sıcak hava balonu + bulut ve uçurtma */
@media (min-width: 1200px) {
  body.is-home .section-intro {
    background:
      url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 58 86'><g transform='translate(1 1)' stroke='%231b1b1b' stroke-width='1.8' stroke-linejoin='round'><path d='M28 2C12 2 2 14 2 28c0 16 14 26 20 36h12c6-10 20-20 20-36C54 14 44 2 28 2Z' fill='%23f3672e'/><path d='M28 2c-8 0-12 12-12 26 0 16 6 26 8 36h8c2-10 8-20 8-36 0-14-4-26-12-26Z' fill='%23FFF1E2'/><path d='M28 2c-3 0-4.5 12-4.5 26 0 16 2.5 26 3 36h3c.5-10 3-20 3-36 0-14-1.5-26-4.5-26Z' fill='%23F2B801'/><path d='M23 64l1 8M33 64l-1 8' fill='none'/><rect x='21' y='72' width='14' height='10' rx='2' fill='%23F2B801'/></g><path d='M10 22a14 18 0 0 1 6-12' fill='none' stroke='%23fff' stroke-width='2.4' stroke-linecap='round' opacity='.8'/></svg>") left max(40px, calc(50vw - 26rem - 200px)) top 96px / 76px auto no-repeat,
      url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='14 3 166 83'><g id='a'><circle cx='38' cy='62' r='18'/><circle cx='72' cy='46' r='27'/><circle cx='114' cy='40' r='31'/><circle cx='152' cy='58' r='22'/><rect x='38' y='50' width='114' height='30'/></g><use href='%23a' fill='%239FD3D6' stroke='%239FD3D6' stroke-width='6'/><use href='%23a' fill='%23fff'/></svg>") left max(10px, calc(50vw - 26rem - 250px)) top 260px / 120px auto no-repeat,
      url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='14 3 166 83'><g id='a'><circle cx='38' cy='62' r='18'/><circle cx='72' cy='46' r='27'/><circle cx='114' cy='40' r='31'/><circle cx='152' cy='58' r='22'/><rect x='38' y='50' width='114' height='30'/></g><use href='%23a' fill='%239FD3D6' stroke='%239FD3D6' stroke-width='6'/><use href='%23a' fill='%23fff'/></svg>") right max(40px, calc(50vw - 26rem - 170px)) top 330px / 84px auto no-repeat,
      url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 150 320'><g transform='rotate(-12 75 60)'><path d='M75 10 25 62h50z' fill='%23f3672e'/><path d='M75 10l50 52H75z' fill='%23F2B801'/><path d='M25 62l50 98V62z' fill='%23029E9C'/><path d='M125 62l-50 98V62z' fill='%23fff'/><path d='M75 10l50 52-50 98-50-98z' fill='none' stroke='%231b1b1b' stroke-width='2.5' stroke-linejoin='round'/><path d='M75 10v150M25 62h100' stroke='%231b1b1b' stroke-width='1.6'/><path d='M75 160c-13 32 23 54 7 86-12 24-24 44-10 70' fill='none' stroke='%231b1b1b' stroke-width='1.6' stroke-linecap='round'/><path d='M74 187l-9-6v12zm0 0l9-6v12z' fill='%23f3672e'/><path d='M86 224l-9-6v12zm0 0l9-6v12z' fill='%23029E9C'/><path d='M67 280l-9-6v12zm0 0l9-6v12z' fill='%23F2B801'/></g></svg>") right max(40px, calc(50vw - 26rem - 210px)) top 70px / 92px auto no-repeat;
  }
}

/* ---------- 1b. Duyurular & İlanlar: giriş kartının sağında turkuaz çıkartma kart ----------
   Telefon/tablet: giriş kartının ALTINDA, aynı genişlikte (en çok 52rem). ≥1024px: iki sütun 6fr / 5fr, üstleri hizalı.
   Bağlantı yoksa home.php kutuyu basmaz ve section-intro--ikili sınıfını eklemez → yukarıdaki B kuralları aynen geçerli
   (giriş kartı ortada, tam genişlik, yan süsler eski yerinde). */
body.is-home .intro-ikili { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1fr); gap: 30px; justify-items: center; }
body.is-home .intro-ikili > * { min-width: 0; max-width: 100%; }   /* uzun tek kelime telefonda sayfayı yana taşırmasın */
/* güvenlik ağı: giriş metni yoksa duyuru kartı tek başına → iki sütunu kaplar, ortada en çok 52rem */
body.is-home .intro-ikili > .duyuru-kart:only-child { grid-column: 1 / -1; justify-self: center; max-width: 52rem; }
body.is-home .duyuru-kart {
  --duyuru-serit: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 360 112'><g fill='none' stroke-linecap='round' stroke-width='3'><path d='M16 72q6-7 12 0t12 0' stroke='%23f3672e'/><path d='M318 26q6-7 12 0t12 0' stroke='%23029E9C'/><path d='M52 98q5-6 10 0t10 0' stroke='%237BBA48'/><path d='M300 96q5-6 10 0t10 0' stroke='%23EC7AA2'/></g><g stroke='%231b1b1b' stroke-width='1.6' stroke-linejoin='round'><path d='M38 22l9 4-7 7z' fill='%234AA8D0'/><path d='M334 66l10 1-5 9z' fill='%23F2B801'/><rect x='10' y='34' width='9' height='9' rx='2' transform='rotate(20 14 38)' fill='%23EC7AA2'/><rect x='254' y='88' width='8' height='8' rx='2' transform='rotate(-18 258 92)' fill='%237BBA48'/></g><g><circle cx='70' cy='14' r='3.5' fill='%23F2B801'/><circle cx='8' cy='92' r='3' fill='%23029E9C'/><circle cx='352' cy='48' r='3.5' fill='%23f3672e'/><circle cx='268' cy='12' r='3' fill='%234AA8D0'/><circle cx='136' cy='100' r='3' fill='%23EC7AA2'/></g><path d='M340 92l2.4 5.6 5.6 2.4-5.6 2.4-2.4 5.6-2.4-5.6-5.6-2.4 5.6-2.4z' fill='%23F2B801' stroke='%231b1b1b' stroke-width='1.4' stroke-linejoin='round'/><path d='M128 14l2 4.6 4.6 2-4.6 2-2 4.6-2-4.6-4.6-2 4.6-2z' fill='%23f3672e' stroke='%231b1b1b' stroke-width='1.3' stroke-linejoin='round'/><g transform='rotate(-8 100 60)'><rect x='78' y='38' width='44' height='44' rx='3' fill='%23F2B801' stroke='%231b1b1b' stroke-width='2'/><path d='M86 54h28M86 62h28M86 70h17' stroke='%231b1b1b' stroke-width='1.8' stroke-linecap='round'/></g><circle cx='98' cy='38' r='5.5' fill='%23f3672e' stroke='%231b1b1b' stroke-width='1.8'/><path d='M96 36a2.6 2.6 0 0 1 2-2' fill='none' stroke='%23fff' stroke-width='1.5' stroke-linecap='round'/><g transform='rotate(-14 182 60)'><rect x='137' y='48' width='18' height='26' rx='5' fill='%23029E9C' stroke='%231b1b1b' stroke-width='2.2'/><path d='M162 72l-6 22h12l6-18z' fill='%23F2B801' stroke='%231b1b1b' stroke-width='2.2' stroke-linejoin='round'/><path d='M153 50L206 26Q214 23 214 32V90Q214 99 206 96L153 72Z' fill='%23f3672e' stroke='%231b1b1b' stroke-width='2.4' stroke-linejoin='round'/><ellipse cx='213' cy='61' rx='7' ry='33' fill='%23FFF1E2' stroke='%231b1b1b' stroke-width='2.4'/><path d='M161 52l36-16' stroke='%23fff' stroke-width='3' stroke-linecap='round' opacity='.85'/><path d='M169 61q2.5-3 5 0M183 58q2.5-3 5 0M173 69q6 5 12-1' fill='none' stroke='%231b1b1b' stroke-width='2.2' stroke-linecap='round'/><circle cx='167' cy='68' r='2.4' fill='%23FFC4AA'/><circle cx='191' cy='64' r='2.4' fill='%23FFC4AA'/><g fill='none' stroke-width='4' stroke-linecap='round'><path d='M229 46q8 15 0 30' stroke='%23029E9C'/><path d='M241 37q14 24 0 48' stroke='%23F2B801'/></g></g><g transform='rotate(12 296 56)'><path d='M296 34c-11 0-17 9-17 20v12l-5 7h44l-5-7V54c0-11-6-20-17-20z' fill='%234AA8D0' stroke='%231b1b1b' stroke-width='2.2' stroke-linejoin='round'/><circle cx='296' cy='31' r='3.5' fill='%231b1b1b'/><circle cx='296' cy='78' r='4.5' fill='%23f3672e' stroke='%231b1b1b' stroke-width='1.8'/><path d='M285 52a10 12 0 0 1 5-9' fill='none' stroke='%23fff' stroke-width='2.5' stroke-linecap='round'/></g></svg>");
  position: relative; width: 100%; max-width: 52rem;
  padding: 72px 14px 22px;
  color: #1b1b1b;
  background: var(--duyuru-serit) center 14px / auto 50px no-repeat, #DCF3F1;
  border-radius: 34px 28px 36px 30px / 30px 36px 28px 34px;   /* giriş kartının aynası: "elle kesilmiş" köşeler */
  box-shadow: 0 28px 46px -30px rgba(5, 97, 95, .6), 0 3px 0 rgba(5, 97, 95, .08);
}
body.is-home .duyuru-kart::before {   /* kesikli iç çerçeve (turkuaz) */
  content: ""; position: absolute; inset: 9px; pointer-events: none;
  border: 2.5px dashed rgba(2, 158, 156, .55);
  border-radius: 27px 21px 29px 23px / 23px 29px 21px 27px;
}
/* el yazısı başlık + turuncu fırça altı çizgisi (bölüm başlıklarındaki maske) */
body.is-home .duyuru-baslik {
  position: relative; display: table; margin: 0 auto 20px; max-width: 100%; overflow-wrap: anywhere;
  font-family: var(--font-script); font-weight: 700; font-size: 36px; line-height: 1.05; text-align: center;
}
body.is-home .duyuru-baslik::after {
  content: ""; display: block; height: 8px; width: 64%; margin: 7px auto 0;
  background: #f3672e;
  -webkit-mask: var(--firca-mask) no-repeat 0 0 / 300px 100%;
          mask: var(--firca-mask) no-repeat 0 0 / 300px 100%;
  transform: scaleY(-1);
}
body.is-home .duyuru-liste { position: relative; z-index: 1; list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
/* satır: beyaz çıkartma, koyu kontur, alttan gölge — satırın tamamı bağlantı (dokunma alanı ≥ 64px) */
body.is-home .duyuru-oge {
  --d-renk: #F3672E; --d-ikon: var(--ikon-yildiz); --d-egim: -6deg;
  display: flex; align-items: center; gap: 12px; min-height: 66px; padding: 9px 10px 9px 9px;
  color: #1b1b1b; text-decoration: none; background: #fff;
  border: 2.5px solid #1b1b1b; border-radius: 18px 20px 17px 21px / 20px 17px 21px 18px;
  box-shadow: 0 4px 0 #1b1b1b;
  -webkit-tap-highlight-color: transparent;
  transition: translate .2s cubic-bezier(.3, 1.5, .5, 1), box-shadow .2s, background-color .2s;
}
body.is-home .duyuru-liste > li:nth-child(6n+2) .duyuru-oge { --d-renk: #23A8A7; --d-ikon: var(--ikon-kalp); --d-egim: 5deg; }
body.is-home .duyuru-liste > li:nth-child(6n+3) .duyuru-oge { --d-renk: #F2B801; --d-ikon: var(--ikon-nota); --d-egim: -4deg; }
body.is-home .duyuru-liste > li:nth-child(6n+4) .duyuru-oge { --d-renk: #D3EBF7; --d-ikon: var(--ikon-filiz); --d-egim: 6deg; }
body.is-home .duyuru-liste > li:nth-child(6n+5) .duyuru-oge { --d-renk: #EC7AA2; --d-ikon: var(--ikon-balon); --d-egim: -5deg; }
body.is-home .duyuru-liste > li:nth-child(6n+6) .duyuru-oge { --d-renk: #7BBA48; --d-ikon: var(--ikon-ampul); --d-egim: 4deg; }
body.is-home .duyuru-ikon {   /* renkli kare çıkartma, içinde beyaz yuvarlakta simge */
  flex: none; width: 46px; height: 46px; rotate: var(--d-egim);
  border: 2px solid #1b1b1b; border-radius: 14px;
  background: var(--d-ikon) center / 25px no-repeat, radial-gradient(circle, #fff 0 15.5px, transparent 16px), var(--d-renk);
}
body.is-home .duyuru-metin { flex: 1; min-width: 0; }
/* ad ve not en çok 2 satır: uzun sayfa adı ya da not satırı 6 satıra uzatmasın */
body.is-home .duyuru-ad-yazi,
body.is-home .duyuru-not {
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; overflow: hidden;
  overflow-wrap: anywhere;
}
/* "Yeni" çıkartması kırpılan adın DIŞINDA: kısa adda yanında, ad satırı dolunca altında (hiç kesilmez) */
body.is-home .duyuru-ad { display: flex; flex-wrap: wrap; align-items: center; column-gap: 6px; row-gap: 4px; }
body.is-home .duyuru-ad-yazi { min-width: 0; max-width: 100%; }
body.is-home .duyuru-ad > .duyuru-yeni { flex: none; margin-left: 0; }
body.is-home .duyuru-ad { font-family: var(--font-el); font-weight: 700; font-size: 19px; line-height: 1.2; padding-top: 2px; }
body.is-home .duyuru-not {
  margin-top: 3px;
  font-family: var(--font-govde); font-size: 14px; line-height: 1.35; color: #4a4a4a;
}
body.is-home .duyuru-yeni {   /* "Yeni" çıkartması */
  display: inline-block; margin-left: 4px; padding: 3px 8px 2px; vertical-align: 2px; rotate: -4deg;
  font-family: var(--font-govde); font-size: 11.5px; font-weight: 800; line-height: 1.2; letter-spacing: .04em; text-transform: uppercase;
  color: #1b1b1b; background: #F3672E; border: 1.5px solid #1b1b1b; border-radius: 999px;
}
body.is-home .duyuru-ok {
  flex: none; display: grid; place-items: center; width: 36px; height: 36px;
  border-radius: 50%; background: #fff; border: 2.5px solid #1b1b1b;
  font-family: var(--font-govde); font-weight: 700; font-size: 17px; line-height: 1;
  transition: transform .2s;
}
@media (hover: hover) {
  body.is-home .duyuru-oge:hover { translate: 0 -2px; box-shadow: 0 6px 0 #1b1b1b; background: #FFFAF3; }
  body.is-home .duyuru-oge:hover .duyuru-ok { transform: translateX(3px); background: #F2B801; }
}
body.is-home .duyuru-oge:active { translate: 0 2px; box-shadow: 0 2px 0 #1b1b1b; }
body.is-home .duyuru-oge:focus-visible { outline: 3px solid var(--focus-mavi); outline-offset: 4px; }
@media (max-width: 359.98px) {
  body.is-home .duyuru-kart { padding-left: 12px; padding-right: 12px; }
  body.is-home .duyuru-oge { gap: 10px; padding-right: 8px; }
  body.is-home .duyuru-ikon { width: 40px; height: 40px; background-size: 22px, auto, auto; }
  body.is-home .duyuru-ok { width: 32px; height: 32px; }
  body.is-home .duyuru-baslik { font-size: 33px; }
}
@media (min-width: 600px) {
  body.is-home .duyuru-kart { padding: 124px 40px 44px; background-position: center 24px, 0 0; background-size: auto 92px, auto; }
  body.is-home .duyuru-baslik { font-size: 44px; margin-bottom: 24px; }
  body.is-home .duyuru-oge { padding: 10px 12px 10px 10px; gap: 14px; min-height: 72px; }
  body.is-home .duyuru-ad { font-size: 20px; }
}
/* ≥1024: iki sütun. Kap kendi 20px dolgusuyla en çok 1160px (içerik 1120px): site.css'in .container dolgusu
   (1024+ 50px, 1440+ 80px) burada kullanılmaz, yoksa kartlar 1000px'e sıkışıyordu. Kartlar eşit yükseklikte. */
@media (min-width: 1024px) {
  body.is-home .section-intro--ikili .intro-ikili {
    max-width: 1160px; padding-left: 20px; padding-right: 20px;
    grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); align-items: stretch; gap: 34px;
  }
  body.is-home .section-intro--ikili .intro-kart,
  body.is-home .section-intro--ikili .duyuru-kart { max-width: none; }
  body.is-home .section-intro--ikili .intro-kart { padding: 124px 40px 48px; background-size: auto 80px, auto; background-position: center 30px, 0 0; }   /* şerit 92px'te ~526px eniyle dar kartın çerçevesine taşıyordu */
  body.is-home .section-intro--ikili .duyuru-kart { padding: 124px 26px 32px; }
  body.is-home .section-intro--ikili .duyuru-baslik { font-size: 42px; }
  /* köşe konfetileri: sol kartın sol üstü, sağ kartın sağ altı (kart dış kenarı = max(20px, 50% − 560px)) */
  body.is-home .section-intro--ikili::before { left: calc(max(20px, 50% - 560px) - 16px); }
  body.is-home .section-intro--ikili::after { right: calc(max(20px, 50% - 560px) - 14px); }
}
@media (min-width: 1280px) {
  body.is-home .section-intro--ikili .intro-kart { padding-left: 52px; padding-right: 52px; background-size: auto 92px, auto; background-position: center 24px, 0 0; }
  body.is-home .section-intro--ikili .duyuru-kart { padding-left: 32px; padding-right: 32px; }
}
/* yan süsler: 1200–1439 arası kartların yanında yeterli yer yok → kaldır; ≥1440 kartların DIŞ kenarına göre
   (50vw ± 560px) yerleşir, B'deki gibi ekran kenarı korumalı (max(…)). 1440'ta (en dar hâl, 15px kaydırma çubuğuyla):
   balon 40–116px (kart ~153px'te → 37px boşluk) · sol bulut 24–124px (29px) · sağ bulut sağdan 40–124px (28px) ·
   uçurtma sağdan 32–124px (28px). Kaydırma çubuksuz ekranda boşluklar ~7px daha geniş; 1600'de 57 / 43 / 38 / 50px. */
@media (min-width: 1200px) and (max-width: 1439.98px) {
  body.is-home .section-intro--ikili { background: none; }
}
@media (min-width: 1440px) {
  body.is-home .section-intro--ikili {
    background-position:
      left max(40px, calc(50vw - 700px)) top 96px,
      left max(24px, calc(50vw - 710px)) top 270px,
      right max(40px, calc(50vw - 690px)) top 340px,
      right max(32px, calc(50vw - 710px)) top 64px;
    background-size: 76px auto, 100px auto, 84px auto, 92px auto;
  }
}

/* ---------- 2. Neler Yapıyoruz? — tepelerle açılan çayır bandı ---------- */
body.is-home .section-works { position: relative; background: #DDF2EC; padding: 30px 0 66px; }
body.is-home .section-works::before {   /* yumuşak dalgalı tepeler (üst kenar) */
  content: ""; position: absolute; left: 0; right: 0; top: -39px; height: 40px; pointer-events: none;
  background: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 70' preserveAspectRatio='none'><defs><g id='c'><path d='M0 0V-10' stroke='%23077E7E' stroke-width='2.4' stroke-linecap='round'/><circle cy='-15' r='3.6'/><circle cx='4.6' cy='-11.8' r='3.6'/><circle cx='2.8' cy='-6.6' r='3.6'/><circle cx='-2.8' cy='-6.6' r='3.6'/><circle cx='-4.6' cy='-11.8' r='3.6'/><circle cy='-10.4' r='2.8' fill='%23f3672e'/></g></defs><path d='M0 38C120 38 260 12 460 22S780 54 960 40 1300 38 1440 38V70H0Z' fill='%23B5E2D6'/><use href='%23c' x='250' y='20' fill='%23fff'/><use href='%23c' x='640' y='36' fill='%23F2B801'/><use href='%23c' x='1180' y='40' fill='%23fff'/><path d='M0 56C200 56 380 44 560 52S900 68 1080 56 1340 56 1440 56V70H0Z' fill='%23DDF2EC'/></svg>") repeat-x left -60px bottom / 720px 40px;
}
body.is-home .hero + .section-works::before { display: none; }   /* giriş metni boşsa siyah hero'nun altına binmesin */
body.is-home .section-works .section-title { margin-bottom: 30px; }
@media (min-width: 600px) {
  body.is-home .section-works .section-title::before {   /* başlık sola dayalı: küçük çizim yalnız sağında */
    content: ""; position: absolute; top: 6px; left: 100%; width: 64px; height: 48px; pointer-events: none;
    background: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 52 48'><path d='M24 36q5-6 10 0t10 0' fill='none' stroke='%23f3672e' stroke-width='3' stroke-linecap='round'/><path d='M8 10l9 4-7 7z' fill='%234AA8D0' stroke='%231b1b1b' stroke-width='1.4' stroke-linejoin='round'/><circle cx='40' cy='12' r='3.5' fill='%23F2B801'/><circle cx='12' cy='38' r='3' fill='%23029E9C'/><rect x='30' y='18' width='7' height='7' rx='2' transform='rotate(20 33 21)' fill='%237BBA48'/></svg>") right center / 52px 48px no-repeat;
  }
}
@media (min-width: 1024px) {
  body.is-home .section-works { padding: 40px 0 96px; }
  body.is-home .section-works::before { top: -69px; height: 70px; background-size: 1440px 70px; background-position: left -120px bottom; }
  body.is-home .section-works .section-title { margin-bottom: 40px; }
}
body.is-home .section-works + .section-cta { margin-top: 0; }   /* CTA'nın fırça kenarı çayırın üstüne oturur */

/* ---------- Çıkartma kutular ---------- */
body.is-home .work-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 14px; text-align: left; }
@media (max-width: 359.98px) { body.is-home .work-grid { gap: 16px 12px; } body.is-home .work-card { padding: 14px 11px 12px; } }
/* panel 1–4 kutu döndürebilir (ana_sayfa_kutulari boşları atlar): telefonda tek kalan son kutu iki sütunu kaplar,
   genişte auto-fit → 4, 3, 2 ya da 1 kutu satırı boşluksuz doldurur */
@media (max-width: 899.98px) { body.is-home .work-card:last-child:nth-child(odd) { grid-column: 1 / -1; min-height: 150px; } }
@media (min-width: 900px) { body.is-home .work-grid { grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 26px; } }
body.is-home .work-card {
  --st: #F3672E; --st-koyu: #A63D10; --st-ikon: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'><path d='M32 7C17 7 5 17 5 31c0 12 9 22 21 22 4.5 0 6-3 4.6-6.3-1.3-3 .4-6.2 4.2-6.2H42c9.5 0 17-5.3 17-14.5C59 15.6 46.6 7 32 7z' fill='%23FFF1E2' stroke='%231b1b1b' stroke-width='2.5' stroke-linejoin='round'/><path d='M12 25a12 12 0 0 1 7-9' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round'/><g stroke='%231b1b1b' stroke-width='2'><circle cx='18' cy='29' r='5' fill='%23f3672e'/><circle cx='27' cy='17.5' r='5' fill='%23F2B801'/><circle cx='40' cy='16' r='5' fill='%23029E9C'/><circle cx='17' cy='42' r='4.6' fill='%234AA8D0'/></g><path d='M41.5 27q2-2.6 4 0M48.5 27q2-2.6 4 0M43 32.5q4 4 8 0' fill='none' stroke='%231b1b1b' stroke-width='2.2' stroke-linecap='round'/><circle cx='40' cy='32' r='2' fill='%23f3672e' opacity='.5'/><circle cx='54' cy='32' r='2' fill='%23f3672e' opacity='.5'/></svg>"); --egim: -1.2deg;
  gap: 8px; min-height: 184px; padding: 16px 14px 14px;
  color: #1b1b1b; background: var(--st);
  border: 3px solid #fff; border-radius: 24px;
  box-shadow: 0 5px 0 var(--st-koyu), 0 16px 22px -12px var(--st-koyu);
  font-family: var(--font-script); font-weight: 700; font-size: clamp(23px, 7.4vw, 29px); line-height: 1; letter-spacing: 0;
  overflow-wrap: break-word; -webkit-tap-highlight-color: transparent;
  /* eğim ve kalkış ayrı özelliklerde (rotate/translate): site.js'in .reveal transform'uyla çakışmaz */
  rotate: var(--egim);
  transition: opacity .5s ease-out, transform .5s ease-out,
              rotate .25s cubic-bezier(.3, 1.5, .5, 1), translate .25s cubic-bezier(.3, 1.5, .5, 1), box-shadow .25s;
}
body.is-home .work-c1 { --st: #23A8A7; --st-koyu: #05615F; --st-ikon: var(--ikon-balon); --egim: 1deg; }
body.is-home .work-c2 { --st: #F2B801; --st-koyu: #8A6500; --st-ikon: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'><path d='M21 15l11-9 11 9' fill='none' stroke='%231b1b1b' stroke-width='2.2' stroke-linejoin='round' stroke-linecap='round'/><circle cx='32' cy='6' r='2.4' fill='%231b1b1b'/><rect x='6' y='15' width='52' height='42' rx='5' fill='%23F2B801' stroke='%231b1b1b' stroke-width='2.5'/><rect x='12' y='21' width='40' height='30' rx='2' fill='%23DCEFF8' stroke='%231b1b1b' stroke-width='2'/><path d='M12 44l10-9 8 7 7-6 15 12v1a2 2 0 0 1-2 2H14a2 2 0 0 1-2-2z' fill='%237BBA48' stroke='%231b1b1b' stroke-width='2' stroke-linejoin='round'/><circle cx='42' cy='29' r='4.6' fill='%23f3672e' stroke='%231b1b1b' stroke-width='1.8'/><path d='M9.5 22a5 5 0 0 1 3-4' fill='none' stroke='%23fff' stroke-width='2.4' stroke-linecap='round' opacity='.9'/></svg>"); --egim: .8deg; }
body.is-home .work-c3 { --st: #D3EBF7; --st-koyu: #4A86A6; --st-ikon: var(--ikon-ampul); --egim: -.8deg; }
/* parlama yayı (simgelerdeki beyaz yay gibi) */
body.is-home .work-card::before {
  content: ""; position: absolute; top: 12px; right: 14px; width: 22px; height: 13px;
  border-top: 3px solid rgba(255, 255, 255, .9); border-radius: 50% 50% 0 0 / 100% 100% 0 0;
  transform: rotate(28deg);
}
body.is-home .work-c3::before { border-top-color: #fff; }
body.is-home .work-icon {
  flex: none; width: 60px; height: 60px; border: 0; border-radius: 50%;
  background: var(--st-ikon) center / 44px no-repeat, #fff;
  box-shadow: 0 0 0 4px rgba(255, 255, 255, .35); rotate: -6deg;
}
body.is-home .work-c3 .work-icon { box-shadow: 0 0 0 4px rgba(74, 134, 166, .18); }
body.is-home .work-icon::after { content: none; }
body.is-home .work-name { display: block; margin-top: 4px; }
body.is-home .work-arrow {
  flex: none; align-self: flex-end; margin-top: auto;
  display: grid; place-items: center; width: 40px; height: 40px;
  border-radius: 50%; background: #fff; border: 2.5px solid #1b1b1b;
  font-family: var(--font-govde); font-weight: 700; font-size: 19px; line-height: 1;
}
body.is-home .work-card:hover { transform: none; box-shadow: 0 5px 0 var(--st-koyu), 0 16px 22px -12px var(--st-koyu); }
@media (hover: hover) {
  body.is-home .work-card:hover {
    translate: 0 -5px; rotate: calc(var(--egim) * -1.6);
    box-shadow: 0 9px 0 var(--st-koyu), 0 24px 28px -14px var(--st-koyu);
  }
  body.is-home .work-card:hover .work-arrow { transform: translateX(4px); }
}
body.is-home .work-card:active { translate: 0 3px; box-shadow: 0 2px 0 var(--st-koyu), 0 8px 12px -8px var(--st-koyu); }
body.is-home .work-card:focus-visible { outline: 3px solid var(--focus-mavi); outline-offset: 5px; }
@media (min-width: 600px) {
  body.is-home .work-card { min-height: 210px; padding: 20px 20px 18px; font-size: 34px; gap: 10px; }
  body.is-home .work-icon { width: 80px; height: 80px; background-size: 58px, auto; }
  body.is-home .work-arrow { width: 44px; height: 44px; font-size: 20px; }
}
@media (min-width: 1280px) { body.is-home .work-card { min-height: 236px; font-size: 38px; } }

/* ---------- 3. Çalışma Ortaklarımız: logolar beyaz çıkartmalarda, altta çiçekli tepeler ---------- */
body.is-home .section-ortaklar { position: relative; }
body.is-home .ortaklar-serit { padding: 12px 0 22px; }
body.is-home .ortak-logo {
  height: 92px; padding: 12px 20px; background: #fff; border-radius: 22px 26px 20px 24px;
  box-shadow: 0 4px 0 rgba(166, 61, 16, .14), 0 12px 18px -12px rgba(166, 61, 16, .45);
}
body.is-home .ortaklar-sira { gap: 30px; }
/* turuncu odak halkası krem zeminde 2,78:1 (<3) → koyu mavi 8,31:1 */
body.is-home a.ortak-logo:focus-visible { outline-color: var(--focus-mavi); }
@media (max-width: 640px) {
  body.is-home .ortak-logo { height: 70px; padding: 8px 14px; }
  body.is-home .ortaklar-sira { gap: 20px; }
}
@media (min-width: 768px) {
  body.is-home #icerik {
    padding-bottom: 120px;
    background-size: 400px 65px, 500px 95px, 720px 120px, auto;
    background-position: left -60px bottom, left -150px bottom, left 0 bottom, 0 0;
  }
}
@media (min-width: 900px) {
  body.is-home .section-ortaklar::before {   /* başlığın sağındaki boşlukta üç balon */
    content: ""; position: absolute; top: 34px; right: max(30px, calc(50% - 600px)); width: 92px; height: 118px;
    pointer-events: none; background: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='-16 -26 80 104'><g stroke='%231b1b1b' stroke-width='1.4'><path d='M0 18C2 40 16 54 24 72M24 8C22 36 26 52 24 72M46 22C42 44 30 56 24 72' fill='none' stroke-width='1.3'/><ellipse cx='0' cy='2' rx='13' ry='16' fill='%23f3672e'/><ellipse cx='24' cy='-8' rx='13' ry='16' fill='%23F2B801'/><ellipse cx='46' cy='6' rx='13' ry='16' fill='%23029E9C'/></g><path d='M0 18l-2.4 3.4h4.8zM24 8l-2.4 3.4h4.8zM46 22l-2.4 3.4h4.8z' fill='%231b1b1b'/><path d='M-7 0a8 10 0 0 1 4-8M17-10a8 10 0 0 1 4-8M39 4a8 10 0 0 1 4-8' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' opacity='.8'/><path d='M19.5-7q1.8-2.4 3.6 0M25-7q1.8-2.4 3.6 0M21-2.5q3 3 6 0' fill='none' stroke='%231b1b1b' stroke-width='1.5' stroke-linecap='round'/></svg>") center / contain no-repeat;
  }
}
@media (min-width: 1024px) {
  body.is-home #icerik {
    padding-bottom: 190px;
    background-size: 800px 130px, 1000px 190px, 1440px 240px, auto;
    background-position: left -120px bottom, left -300px bottom, left 0 bottom, 0 0;
  }
}

/* ---------- Hareket azaltma ---------- */
@media (prefers-reduced-motion: reduce) {
  body.is-home .work-card, body.is-home .work-arrow { transition: none; }
  body.is-home .work-card:hover, body.is-home .work-card:active { translate: none; rotate: var(--egim); }
  body.is-home .work-card:hover .work-arrow { transform: none; }
  body.is-home .duyuru-oge, body.is-home .duyuru-ok { transition: none; }
  body.is-home .duyuru-oge:hover, body.is-home .duyuru-oge:active { translate: none; }
  body.is-home .duyuru-oge:hover .duyuru-ok { transform: none; }
}

/* ---------- Yazdırma ---------- */
@media print {
  body.is-home #icerik, body.is-home .section-works, body.is-home .section-intro { background: none; }
  body.is-home #icerik { padding-bottom: 0; }
  body.is-home .section-intro::before, body.is-home .section-intro::after,
  body.is-home .section-works::before, body.is-home .section-works .section-title::before,
  body.is-home .section-ortaklar::before,
  body.is-home .work-card::before { display: none; }
  body.is-home .intro-kart { background: none; box-shadow: none; padding-top: 24px; }
  body.is-home .intro-kart::before { border-color: #999; }
  body.is-home .work-card { rotate: none; box-shadow: none; border: 2px solid #1b1b1b; }
  body.is-home .ortak-logo { box-shadow: none; }
  body.is-home .duyuru-kart { background: none; box-shadow: none; padding-top: 24px; }
  body.is-home .duyuru-kart::before { border-color: #999; }
  body.is-home .duyuru-oge { box-shadow: none; }
}
/* ---------- 4. Son Duyurular / Öne Çıkanlar: yazı kartları krem zeminde beyaz çıkartma ----------
   Başlık diğer bölümler gibi solda; "Tümünü gör →" hap düğme. Kart yapısı partials/post-card.php (değişmedi). */
body.is-home .section-latest .section-title,
body.is-home .section-featured .section-title { color: #1b1b1b; }
body.is-home .section-latest .section-head { align-items: center; column-gap: 24px; row-gap: 16px; margin-bottom: 34px; }
body.is-home .section-latest .section-head .section-title { margin-bottom: 0; }
body.is-home .section-latest .section-more {
  display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 8px 18px 7px;
  font-family: var(--font-el); font-weight: 700; font-size: 18px; line-height: 1.2;
  color: #1b1b1b; background: #fff; border: 2.5px solid #1b1b1b; border-radius: 999px;
  box-shadow: 0 3px 0 #1b1b1b;
  transition: translate .2s cubic-bezier(.3, 1.5, .5, 1), box-shadow .2s, background-color .2s;
}
@media (hover: hover) {
  body.is-home .section-latest .section-more:hover {
    color: #1b1b1b; text-decoration: none; background: #F2B801; translate: 0 -2px; box-shadow: 0 5px 0 #1b1b1b;
  }
}
body.is-home .section-latest .section-more:focus-visible { outline: 3px solid var(--focus-mavi); outline-offset: 4px; }
body.is-home .section-latest .kart-grid,
body.is-home .section-featured .kart-grid { gap: 30px 26px; }
@media (max-width: 359.98px) {
  body.is-home .section-latest .kart-grid,
  body.is-home .section-featured .kart-grid { grid-template-columns: minmax(0, 1fr); }   /* 280px'lik en küçük sütun 320'de taşmasın */
}
body.is-home .section-latest .kart,
body.is-home .section-featured .kart {
  overflow: hidden; background: #fff;
  border: 2.5px solid #1b1b1b; border-radius: 22px 26px 20px 24px / 24px 20px 26px 22px;
  box-shadow: 0 5px 0 #1b1b1b;
}
body.is-home .section-latest .kart-media,
body.is-home .section-featured .kart-media { border-bottom: 2.5px solid #1b1b1b; }
body.is-home .section-latest .kart-body,
body.is-home .section-featured .kart-body { padding: 16px 18px 18px; border-bottom: 0; }
body.is-home .section-latest .kart-tag,
body.is-home .section-featured .kart-tag { background: #DCF3F1; border: 1.5px solid #1b1b1b; border-radius: 999px; padding: 3px 10px 2px; }
body.is-home .section-latest .kart-title,
body.is-home .section-featured .kart-title { font-family: var(--font-el); font-weight: 700; font-size: 22px; line-height: 1.25; }
body.is-home .section-latest .kart a:focus-visible,
body.is-home .section-featured .kart a:focus-visible { outline: 3px solid var(--focus-mavi); outline-offset: 3px; }
body.is-home .section-latest .kart-media:focus-visible,
body.is-home .section-featured .kart-media:focus-visible { outline-offset: -4px; }
@media (prefers-reduced-motion: reduce) {
  body.is-home .section-latest .section-more { transition: none; }
  body.is-home .section-latest .section-more:hover { translate: none; }
}
@media print {
  body.is-home .section-latest .kart, body.is-home .section-featured .kart,
  body.is-home .section-latest .section-more { box-shadow: none; }
}

/* ============ Ana sayfa: Nar Ağacımız şeridi — "Notlar kartpostalı" (alternatif C; kullanıcı seçimi 24 Eki 2026) ============
   Şablon: partials/nar-serit.php (home.php, giriş + Duyurular bölümünün altında, "Neler Yapıyoruz?" çayırının üstünde).
   Kaynak: onaylı önizleme alt-c.html (<style id="nar-kartpostal">); görünüm birebir korunur.
   Fotoğraf yüzü: eğik yapıştırılmış gökyüzü resmi (bant), içinde Nar Ağacı sayfasının dilinde küçük bir nar ağacı
   (7 yuva: ağaçtaki dolu nar sayısı kadar nar, gerisi çiçek); köşesine taşan büyük, parlak bir nar çıkartması.
   Yazı yüzü: pul + posta damgası, başlık, kuruculardan gelen notlar (çizgili satırlarda el yazısı; <ul> listesi, hepsi
   aynı hücrede üst üste; site.js "Nar Ağacımız şeridi" panelde seçilen sürede bir değiştirir; JS yoksa ilki; hiç not yoksa
   "İlk notu sen bırak" yer tutucusu .nar-kp-bos), büyük sayılı sayaç, iki düğme (kontenjan dolunca yalnız "Nar Ağacını gör").
   Telefon (<700): .nar-kp-yazi "display: contents" → kart ızgarası: başlık, giriş, [fotoğraf | sayaç], notlar, düğmeler.
   Hareket yalnız transform/opacity (çıkartma salınır, çiçekler kıpırdar, notlar değişir); prefers-reduced-motion'da yok;
   .nar-kp--sakin (Panel → Nar Ağacımız → "Narlar ve çiçekler hareket etsin" kapalı) çıkartma ve çiçekleri durdurur.
   KONTRAST: #1b1b1b / #FFFAF3 16,6 · #A31F35 / #FFFAF3 7,6 · #1b1b1b / #f3672e 5,6 · #5B4632 / #FFFAF3 8,6 */
body.is-home .section-intro:has(+ .nar-kp) { padding-bottom: 46px; }
body.is-home .nar-kp { position: relative; padding: 0 0 78px; }
body.is-home .hero + .nar-kp { padding-top: 56px; }   /* giriş metni ve duyuru yoksa siyah hero'nun altına yapışmasın (.section üst dolgusu) */
.nar-kp-kap { max-width: 1160px; }
.nar-kp-kart {
  position: relative; display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  grid-template-areas: "baslik baslik" "giris giris" "resim sayac" "notlar notlar" "gezgin gezgin" "dugmeler dugmeler";
  column-gap: 16px; padding: 16px 16px 18px;
  background: #FFFAF3; color: #1b1b1b;
  border: 3px solid #1b1b1b; border-radius: 24px 28px 22px 26px / 26px 22px 28px 24px;
  box-shadow: 4px 4px 0 #1b1b1b;
}
.nar-kp-yazi { display: contents; }

/* ---- Fotoğraf yüzü: eğik yapıştırılmış gökyüzü resmi + iki bant + köşeye taşan nar çıkartması ---- */
.nar-kp-resim {
  grid-area: resim; align-self: center; position: relative; margin: 16px 0 6px 2px; padding: 5px;
  background: #fff; border: 2.5px solid #1b1b1b; border-radius: 12px;
  box-shadow: 3px 3px 0 rgba(27, 27, 27, .22);
  rotate: -2.4deg;
}
.nar-kp-resim::before, .nar-kp-resim::after {   /* bant şeritleri */
  content: ""; position: absolute; z-index: 2; top: -10px; width: 46px; height: 18px;
  background: repeating-linear-gradient(-45deg, rgba(255, 255, 255, .28) 0 5px, transparent 5px 10px), rgba(242, 184, 1, .72);
  border-left: 2px dotted rgba(27, 27, 27, .25); border-right: 2px dotted rgba(27, 27, 27, .25);
}
.nar-kp-resim::before { left: 8px; rotate: -8deg; }
.nar-kp-resim::after { right: 8px; rotate: 7deg; background-color: rgba(236, 122, 162, .72); }
.nar-kp-svg { display: block; width: 100%; height: auto; aspect-ratio: 1; border-radius: 7px; border: 2px solid #1b1b1b; }
.nar-kp-cikartma {
  position: absolute; z-index: 3; right: -16px; bottom: -18px; width: 46%; height: auto; overflow: visible;
  transform-origin: 50% 85%;
}

/* ---- Yazı yüzü ---- */
.nar-kp-baslik {
  grid-area: baslik; justify-self: start; position: relative; display: inline-block; margin: 0; padding-right: 8px;
  font-family: var(--font-script); font-weight: 700; font-size: 40px; line-height: 1.02; letter-spacing: 0;
}
.nar-kp-baslik::after {   /* nar kırmızısı fırça altı çizgisi (bölüm başlıklarındaki maske) */
  content: ""; display: block; height: 8px; width: 78%; margin-top: 5px;
  background: #C9283A;
  -webkit-mask: var(--firca-mask) no-repeat 0 0 / 300px 100%;
          mask: var(--firca-mask) no-repeat 0 0 / 300px 100%;
  transform: scaleY(-1);
}
.nar-kp-giris { grid-area: giris; margin: 10px 0 0; max-width: 30rem; font-size: 15px; line-height: 1.5; color: #5B4632; text-wrap: balance; }

/* pul (zımbalı kenar: maske) + posta damgası */
.nar-kp-pul { position: absolute; z-index: 1; top: 10px; right: 12px; width: 52px; pointer-events: none; }
.nar-kp-pul-kagit { display: block; filter: drop-shadow(2px 3px 0 rgba(27, 27, 27, .28)); rotate: 7deg; }
.nar-kp-pul-kagit svg {
  display: block; width: 100%; height: auto; padding: 4px; background: #fff;
  -webkit-mask: radial-gradient(circle, transparent 2.6px, #000 3px) -4px -4px / 8px 8px, linear-gradient(#000 0 0) center / calc(100% - 8px) calc(100% - 8px) no-repeat;
          mask: radial-gradient(circle, transparent 2.6px, #000 3px) -4px -4px / 8px 8px, linear-gradient(#000 0 0) center / calc(100% - 8px) calc(100% - 8px) no-repeat;
}
.nar-kp-damga { display: none; position: absolute; color: rgba(7, 126, 126, .72); rotate: -14deg; height: auto; }

/* notlar: kartpostal çizgilerinde el yazısı. Hepsi aynı hücrede üst üste (sayfa zıplamaz; liste en uzun not kadar yüksek);
   çizgiler yalnız notun kendi satırlarında. Not hücrenin üstünden başlar (sayacın hemen altında): uzun bir not listeyi
   uzatsa da kısa notun üstünde boşluk açılmaz, boşluk gösterge satırının üstünde kalır. Telefonda (<600) not en çok 4
   satır görünür (line-clamp; tam metin DOM'da, ekran okuyucu bütününü okur): 120 karakterlik tek bir not kartı herkes
   için uzatmasın. */
.nar-kp-notlar { grid-area: notlar; --sat: 32px; position: relative; display: grid; margin: 12px 0 0; padding: 0; list-style: none; }
.nar-kp-not {
  grid-area: 1 / 1; align-self: start; margin: 0; min-width: 0;
  background: repeating-linear-gradient(to bottom, transparent 0 calc(var(--sat) - 2px), #BCD9E8 calc(var(--sat) - 2px) var(--sat));
}
.nar-kp-not figure, .nar-kp-not blockquote { margin: 0; padding: 0; }
.nar-kp-not p {
  margin: 0; font-family: var(--font-el); font-weight: 700; font-size: 20px; line-height: var(--sat); letter-spacing: 0;
  color: #1b1b1b; overflow-wrap: anywhere; text-wrap: pretty;
}
@media (max-width: 599.98px) {
  .nar-kp-not blockquote p { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; line-clamp: 4; overflow: hidden; }
}
.nar-kp-not blockquote p::before { content: "“"; color: #C9283A; margin-right: 1px; }
.nar-kp-not blockquote p::after { content: "”"; color: #C9283A; margin-left: 1px; }
.nar-kp-not figcaption {
  font-family: var(--font-script); font-weight: 700; font-size: 24px; line-height: var(--sat); letter-spacing: 0;
  color: #A31F35; text-align: right; overflow-wrap: anywhere;
}
.nar-kp-not figcaption::before { content: "— "; }
/* hiç not yokken yer tutucu: davet cümlesi + boş imza yeri */
.nar-kp-bos figcaption { background: #FFFAF3; }   /* son çizgi yerine imza yerinin kesik çizgisi */
.nar-kp-bos figcaption span { display: inline-block; min-width: 7.5em; text-align: left; border-bottom: 2px dashed #C9283A; line-height: 1.05; }
/* Görünen not .is-aktif (şablon ilkini işaretler: JS yoksa ilk not görünür); diğerleri aynı hücrede saydam durur —
   ekran okuyucu bütün listeyi okur. JS notu değiştirince yumuşak geçiş. */
.nar-kp-not {
  opacity: 0; transform: translateY(8px) rotate(-.6deg); pointer-events: none;
  transition: opacity .6s ease, transform .7s cubic-bezier(.3, 1.3, .5, 1);
}
.nar-kp-not.is-aktif { opacity: 1; transform: none; pointer-events: auto; transition-delay: .25s, .25s; }

/* gösterge (noktalar ya da sayaç) + durdur düğmesi (JS açar; tek notta çıkmaz; gösterge kapalıyken yalnız durdur) */
.nar-kp-gezgin { grid-area: gezgin; display: flex; align-items: flex-start; gap: 6px; margin: 12px 0 0; }   /* noktalar iki satıra inerse düğme ilk satırda kalır */
.nar-kp-gezgin[hidden] { display: none; }
.nar-kp-gezgin:not(.nar-kp-gezgin--sayac) { container-type: inline-size; }
.nar-kp-noktalar { display: flex; flex-wrap: wrap; gap: 4px; min-width: 0; }   /* 8 not dar telefona sığmazsa alt satıra iner */
/* sığmayan 7–8 nokta dengeli kırılır (4 + 4 / 4 + 3; tek nokta alt satırda yalnız kalmaz). Eşik: nokta sayısı × 34 − 4
   + durdur düğmesi (6 boşluk + 4 pay + 30). data-sayi'yı JS yazar. */
@container (max-width: 307.98px) { .nar-kp-noktalar[data-sayi="8"] { display: grid; grid-template-columns: repeat(4, 30px); } }
@container (max-width: 273.98px) { .nar-kp-noktalar[data-sayi="7"] { display: grid; grid-template-columns: repeat(4, 30px); } }
.nar-kp-nokta {
  display: grid; place-items: center; width: 30px; height: 30px; padding: 0; border: 0; background: none; cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.nar-kp-nokta::before {
  content: ""; width: 11px; height: 11px; border-radius: 50%; border: 2px solid #1b1b1b; background: #fff;
  transition: background-color .2s, transform .2s;
}
.nar-kp-nokta[aria-current="true"]::before { background: #C9283A; transform: scale(1.18); }
.nar-kp-dur {
  position: relative; flex: none; display: grid; place-items: center; width: 30px; height: 30px; margin-left: 4px; padding: 0; cursor: pointer;
  border: 2px solid #1b1b1b; border-radius: 50%; background: #fff; -webkit-tap-highlight-color: transparent;
}
.nar-kp-dur::before {   /* oynuyor: duraklat simgesi (iki çizgi); basılı (durdu): oynat simgesi (üçgen) */
  content: ""; width: 8px; height: 10px;
  background: linear-gradient(90deg, #1b1b1b 0 3px, transparent 3px 5px, #1b1b1b 5px 8px);
}
.nar-kp-dur[aria-pressed="true"]::before {
  width: 9px; height: 10px; margin-left: 2px; background: #1b1b1b; clip-path: polygon(0 0, 100% 50%, 0 100%);
}
.nar-kp-dur::after { content: ""; position: absolute; inset: -9px; border-radius: 50%; }   /* görünüm 30px, dokunma alanı 44px */
.nar-kp-dur[hidden] { display: none; }
.nar-kp-nokta:focus-visible, .nar-kp-dur:focus-visible { outline: 3px solid var(--focus-mavi); outline-offset: 2px; border-radius: 50%; }
@media (hover: hover) { .nar-kp-dur:hover, .nar-kp-nokta:hover::before { background-color: #F2B801; } }
.nar-kp-dur:first-child { margin-left: 0; }   /* gösterge kapalı: düğme notların sol kenarında */
/* sayaç kipi (8'den çok not): ‹ "3 / 37" › — oklar durdur düğmesinin dilinde 30px yuvarlak; kutu 44px (dokunma alanı),
   dikey -7px payla satır noktalı kiptekiyle aynı yükseklikte kalır */
.nar-kp-gezgin--sayac { align-items: center; }
.nar-kp-sira { display: flex; align-items: center; min-width: 0; margin-left: -7px; }
.nar-kp-ok {
  position: relative; flex: none; display: grid; place-items: center; width: 44px; height: 44px; margin: -7px 0; padding: 0;
  border: 0; background: none; cursor: pointer; -webkit-tap-highlight-color: transparent;
}
.nar-kp-ok::before {
  content: ""; position: absolute; inset: 7px; border: 2px solid #1b1b1b; border-radius: 50%; background: #fff;
  transition: background-color .2s;
}
.nar-kp-ok::after {   /* ok başı: iki kenarlı köşe, 45° döndürülmüş */
  content: ""; position: relative; width: 8px; height: 8px; border: solid #1b1b1b; border-width: 0 0 2.6px 2.6px;
  transform: translateX(1.5px) rotate(45deg);
}
.nar-kp-ok--ileri::after { transform: translateX(-1.5px) rotate(-135deg); }
.nar-kp-sira-yazi {
  min-width: 3.6em; padding: 0 2px; text-align: center; white-space: nowrap;   /* JS en geniş "n / toplam" kadar sabitler: oklar kaymaz */
  font-family: var(--font-el); font-weight: 700; font-size: 19px; line-height: 30px; color: #1b1b1b; font-variant-numeric: tabular-nums;
}
.nar-kp-gezgin--sayac .nar-kp-dur { margin-left: 10px; }   /* okun 44px kutusu ile durdurun 48px alanı çakışmasın */
.nar-kp-ok:focus-visible { outline: none; }
.nar-kp-ok:focus-visible::before { outline: 3px solid var(--focus-mavi); outline-offset: 2px; }
@media (hover: hover) { .nar-kp-ok:hover::before { background-color: #F2B801; } }

/* sayaç: büyük sayı + kısa açıklama */
.nar-kp-sayac {
  grid-area: sayac; align-self: center; display: flex; flex-wrap: wrap; align-items: center; column-gap: 6px;
  margin: 16px 0 0; letter-spacing: 0; color: #1b1b1b;
}
.nar-kp-sayac-cicek { flex: none; width: 32px; height: 28px; }
.nar-kp-sayi {
  font-family: var(--font-script); font-weight: 700; font-size: 54px; line-height: .9; color: #A31F35;
  font-variant-numeric: tabular-nums;
}
.nar-kp-sayac-yazi { flex: 1 1 100%; margin-top: 4px; }
.nar-kp-sayac-ana { display: block; font-family: var(--font-el); font-weight: 700; font-size: 17px; line-height: 1.3; }
.nar-kp-sayac-on { font-family: var(--font-el); font-weight: 700; font-size: 17px; line-height: 1.3; }
.nar-kp-sayac-alt { display: block; margin-top: 4px; font-size: 13.5px; line-height: 1.4; color: #5B4632; text-wrap: balance; }

/* düğmeler: sitenin renkli düğmesi (a.dugme); ikincisi beyaz, asıl çağrı turuncu */
.nar-kp-dugmeler { grid-area: dugmeler; display: flex; flex-direction: column; gap: 10px; margin: 14px 0 0; }
.nar-kp-dugmeler a.dugme { margin: 0; width: 100%; justify-content: space-between; font-size: 19px; padding-left: 20px; }
.nar-kp-gor { --bk-acc: #fff; }
.nar-kp-katil { --bk-acc: #f3672e; order: -1; }   /* tek sütunda asıl çağrı üstte */

/* ---- Hareket: nar çıkartması hafifçe salınır, ağaçtaki çiçekler kıpırdar (parıltılar sabit) ---- */
.nar-kp-cikartma { animation: nk-salin 6s ease-in-out infinite alternate; }
@keyframes nk-salin { from { transform: rotate(-2deg) translateY(0); } to { transform: rotate(2.2deg) translateY(-4px); } }
.nk-cicek { transform-box: fill-box; transform-origin: 50% 100%; animation: nk-kipir 4.8s ease-in-out infinite; }
.nk-c2 { animation-delay: -1.6s; animation-duration: 5.4s; }
.nk-c3 { animation-delay: -3s; }
@keyframes nk-kipir { 0%, 100% { transform: rotate(0); } 35% { transform: rotate(-7deg); } 70% { transform: rotate(6deg); } }
.nar-kp.is-uzak .nar-kp-cikartma, .nar-kp.is-uzak .nk-cicek { animation-play-state: paused; }
.nar-kp--sakin .nar-kp-cikartma, .nar-kp--sakin .nk-cicek { animation: none; }

/* ---- Çok dar telefon (<360) ---- */
@media (max-width: 359.98px) {
  .nar-kp-kap { padding-left: 14px; padding-right: 14px; }
  .nar-kp-kart { padding: 14px 12px 18px; column-gap: 12px; }
  .nar-kp-baslik { font-size: 36px; }
  .nar-kp-pul { width: 44px; top: 10px; right: 10px; }
  .nar-kp-giris { font-size: 14.5px; }
  .nar-kp-sayac-cicek { display: none; }
  .nar-kp-sayi { font-size: 50px; }
  .nar-kp-sayac-ana, .nar-kp-sayac-on { font-size: 16px; }
  .nar-kp-notlar { --sat: 31px; }
  .nar-kp-resim::before, .nar-kp-resim::after { width: 34px; height: 15px; top: -8px; }
  .nar-kp-not p { font-size: 19px; }
  .nar-kp-not figcaption { font-size: 23px; }
  .nar-kp-dugmeler a.dugme { font-size: 16.5px; letter-spacing: 0; padding-left: 16px; gap: 8px; }
  .nar-kp-dugmeler a.dugme::after { width: 30px; height: 30px; font-size: 16px; }
}

/* ---- Geniş telefon / küçük tablet (600–699): aynı düzen, daha büyük ---- */
@media (min-width: 600px) {
  .nar-kp-kart { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); column-gap: 26px; padding: 22px 26px 26px; }
  .nar-kp-baslik { font-size: 48px; }
  .nar-kp-pul { width: 66px; top: 14px; right: 18px; }
  .nar-kp-giris { font-size: 16.5px; padding-right: 72px; }
  .nar-kp-resim { padding: 7px; }
  .nar-kp-resim::before, .nar-kp-resim::after { width: 70px; height: 24px; top: -12px; }
  .nar-kp-sayac-cicek { width: 40px; height: 34px; }
  .nar-kp-sayi { font-size: 66px; }
  .nar-kp-sayac-ana, .nar-kp-sayac-on { font-size: 20px; }
  .nar-kp-sayac-alt { font-size: 15px; }
  .nar-kp-notlar { --sat: 38px; margin-top: 16px; }
  .nar-kp-not p { font-size: 23px; }
  .nar-kp-not figcaption { font-size: 27px; }
}

/* ---- ≥700: iki yüz yan yana — solda fotoğraf, sağda yazı ---- */
@media (min-width: 700px) {
  .nar-kp-kart {
    grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); grid-template-areas: none;
    column-gap: 40px; align-items: center;
  }
  .nar-kp-yazi { display: block; position: relative; min-width: 0; padding: 4px 0 2px; }
  .nar-kp-resim { grid-area: auto; margin: 0 0 14px; padding: 7px; }
  .nar-kp-svg { aspect-ratio: 420 / 400; }
  .nar-kp-cikartma { width: 40%; right: -30px; bottom: -32px; }
  .nar-kp-baslik { font-size: 46px; margin-top: 2px; }
  .nar-kp-pul { width: 66px; top: -4px; right: -6px; }
  .nar-kp-giris { padding-right: 70px; }
  .nar-kp-damga { display: block; left: -54px; top: 44px; width: 92px; }
  .nar-kp-sayac { flex-wrap: nowrap; column-gap: 10px; margin-top: 18px; }
  .nar-kp-sayac-yazi { flex: 1 1 auto; margin: 0 0 0 4px; }
  .nar-kp-sayi { font-size: 62px; }
  .nar-kp-sayac-ana, .nar-kp-sayac-on { font-size: 19px; }
  .nar-kp-sayac-alt { margin-top: 2px; }
  .nar-kp-dugmeler { margin-top: 18px; }
}
@media (min-width: 900px) {
  body.is-home .nar-kp { padding-bottom: 120px; }
  body.is-home .section-intro:has(+ .nar-kp) { padding-bottom: 64px; }
  .nar-kp-kart { grid-template-columns: minmax(0, 1fr) minmax(0, 1.55fr); column-gap: 48px; padding: 30px 32px 30px 28px; }
  .nar-kp-baslik { font-size: 54px; }
  .nar-kp-pul { width: 80px; top: -6px; right: -6px; }
  .nar-kp-damga { left: -66px; top: 50px; width: 106px; }
  .nar-kp-giris { padding-right: 104px; font-size: 17px; }
  .nar-kp-notlar { --sat: 40px; margin-top: 18px; }
  .nar-kp-not p { font-size: 24px; }
  .nar-kp-not figcaption { font-size: 28px; }
  .nar-kp-sayac { margin-top: 16px; }
  .nar-kp-sayac-cicek { width: 46px; height: 39px; }
  .nar-kp-sayi { font-size: 70px; }
  .nar-kp-sayac-ana, .nar-kp-sayac-on { font-size: 21px; }
  .nar-kp-dugmeler { flex-direction: row; flex-wrap: wrap; gap: 12px 14px; margin-top: 20px; }
  .nar-kp-dugmeler a.dugme { width: auto; font-size: 17.5px; padding-left: 18px; gap: 10px; }
  .nar-kp-katil { order: 0; }   /* yan yana: ikincil solda, asıl çağrı sağda */
}
/* ≥1024: giriş + duyuru kartlarıyla aynı dış kenar (kap kendi 20px dolgusu, en çok 1160px) */
@media (min-width: 1024px) {
  .nar-kp-kap { padding-left: 20px; padding-right: 20px; }
  body.is-home .hero + .nar-kp { padding-top: 76px; }
}
@media (min-width: 1200px) {
  .nar-kp-kart { grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); column-gap: 60px; padding: 34px 44px 34px 34px; }
  .nar-kp-cikartma { right: -38px; bottom: -36px; }
  .nar-kp-baslik { font-size: 56px; }
  .nar-kp-pul { width: 84px; }
  .nar-kp-damga { left: -70px; width: 112px; }
  .nar-kp-giris { padding-right: 110px; }
  .nar-kp-sayi { font-size: 76px; }
  .nar-kp-dugmeler { gap: 12px 16px; }
  .nar-kp-dugmeler a.dugme { font-size: 19px; padding-left: 22px; gap: 12px; }
}

@media (prefers-reduced-motion: reduce) {
  .nar-kp-cikartma, .nk-cicek { animation: none; }
  .nar-kp-not { transition: none; transform: none; }
  .nar-kp-ok::before { transition: none; }
}
@media (forced-colors: active) {
  .nar-kp-kart, .nar-kp-resim { border-color: CanvasText; }
  .nar-kp-not { background: none; }
}
@media print {
  .nar-kp-kart { box-shadow: none; }
  .nar-kp-gezgin { display: none !important; }
}

/* ============================================================
   ÜYELİK FORMLARI (23 Eki 2026, kullanıcı kararı: "yönetim paneli giriş ekranının görünümü")
   Şablonlar: templates/uyelik-{fiili,destekci-form,tesekkur,aidat}.php + partials/uyelik-gok.php (sahne),
   yardımcılar app/uyelik-gorunum.php, davranış site.js "Üyelik formları".
   Sayfa üst menüsü ve alt bilgi aynen kalır; içerik alanını gökyüzü sahnesi ve bulut biçimli beyaz kart doldurur.
   Renkler/ölçüler giriş ekranıyla (giris.css) aynı: kutu 18px köşe, #648F9E çerçeve, #F6FBFD zemin, turkuaz odak halkası,
   turuncu 3B hap düğme, Caveat el yazısı başlık + turuncu alt çizgi. Paket kartları (uyelik-destekci) en altta.
   ============================================================ */
.uy-gok, .uy-destekci {
  --uy-teal: #23A8A7; --uy-teal-d: #0E6E6D; --uy-ink: #1E3640; --uy-label: #23434D; --uy-muted: #557079;
  --uy-line: #648F9E; --uy-field: #F6FBFD; --uy-hata: #A8300B; --uy-hata-cizgi: #D9480F;
}
.uy-gok [hidden], .uy-destekci [hidden] { display: none !important; }
.uy-sr {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0;
}

/* ---------- Sahne ---------- */
.uy-gok {
  position: relative; isolation: isolate; overflow: hidden;
  margin-bottom: -70px;   /* footer'ın 70px üst boşluğuyla birleşir: tepeler footer'ın fırça kenarına değer */
  color: var(--uy-ink);
  background:
    radial-gradient(circle 340px at 11% 120px, rgba(255,251,238,.9) 0, rgba(255,247,228,.55) 32%, rgba(255,247,228,0) 100%) no-repeat,
    radial-gradient(ellipse 70% 420px at 50% 100%, rgba(255,206,160,.55) 0, rgba(255,206,160,0) 70%) no-repeat,
    linear-gradient(180deg, #84CDEE 0, #AEE0F4 420px, #DDF2F6 max(760px, calc(100% - 640px)), #FFEBD6 calc(100% - 200px), #FFE0C4 100%);
}
.uy-gok-dekor { position: absolute; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; }
.uy-gok-dekor svg { position: absolute; display: block; overflow: visible; height: auto; }
.uyg-gunes { left: clamp(-24px, 4.5vw, 96px); top: 14px; width: clamp(104px, 12.5vw, 190px); }
.uyg-isinlar { transform-box: fill-box; transform-origin: center; animation: uyg-don 140s linear infinite; }
.uyg-bulut { animation: uyg-suzul var(--t, 80s) ease-in-out infinite alternate; animation-delay: var(--g, 0s); }
.uyg-b1 { left: 15%; top: 150px; width: clamp(120px, 13vw, 230px); --t: 70s; --g: -12s; }
.uyg-b2 { left: 66%; top: 22px; width: clamp(96px, 9.5vw, 170px); --t: 88s; --g: -40s; opacity: .9; }
.uyg-b3 { left: 2%; top: 440px; width: clamp(130px, 15vw, 250px); --t: 96s; --g: -30s; }
.uyg-b4 { right: 4%; top: 400px; width: clamp(120px, 12.5vw, 220px); --t: 82s; --g: -55s; }
.uyg-b5 { right: 7%; top: 64%; width: clamp(90px, 8vw, 150px); --t: 74s; --g: -20s; opacity: .85; }
.uyg-b6 { left: 4%; top: 50%; width: clamp(110px, 11vw, 200px); --t: 90s; --g: -64s; }
.uyg-b7 { right: 3%; top: 36%; width: clamp(96px, 9vw, 170px); --t: 78s; --g: -8s; opacity: .9; }
.uyg-kuslar { left: 25%; top: 64px; width: clamp(46px, 4.6vw, 84px); animation: uyg-kanat 11s ease-in-out infinite alternate; }
.uyg-ucurtma {
  right: clamp(18px, 8vw, 200px); top: 34px; width: clamp(66px, 8vw, 140px);
  transform-origin: 50% 18%; animation: uyg-ucus 9s ease-in-out infinite;
}
.uyg-kuyruk { transform-box: fill-box; transform-origin: 50% 0; animation: uyg-kuyruk 4.5s ease-in-out infinite alternate; }
.uy-gok-dekor .uyg-tepeler { left: 0; right: 0; bottom: 0; width: 100%; height: min(max(140px, 18vw), 300px); }
/* Kısa sayfalarda (teşekkür, aidat) yalnız üst bulutlar */
.uy-gok--tesekkur .uyg-b5, .uy-gok--tesekkur .uyg-b6, .uy-gok--tesekkur .uyg-b7,
.uy-gok--aidat .uyg-b5, .uy-gok--aidat .uyg-b6, .uy-gok--aidat .uyg-b7 { display: none; }
@keyframes uyg-suzul { from { transform: translateX(-4vw); } to { transform: translateX(4vw); } }
@keyframes uyg-kanat { from { transform: translate(0, 0); } to { transform: translate(22px, -10px); } }
@keyframes uyg-ucus { 0%, 100% { transform: rotate(-5deg) translate(0, 0); } 50% { transform: rotate(4deg) translate(-8px, 10px); } }
@keyframes uyg-kuyruk { from { transform: rotate(-7deg); } to { transform: rotate(6deg); } }
@keyframes uyg-don { to { transform: rotate(360deg); } }

.uy-gok-ic { position: relative; z-index: 1; padding: 118px 20px clamp(150px, 15vw, 240px); }

/* ---------- Bulut kart ---------- */
.uy-kart {
  position: relative; isolation: isolate; width: 100%; max-width: 560px; margin: 0 auto;
  padding: 40px 44px 32px; color: var(--uy-ink);
  font-size: 16px; line-height: 1.55; letter-spacing: 0;
}
.uy-kart--genis { max-width: 760px; padding: 44px 48px 36px; }
.uy-kart--orta { max-width: 640px; }
.uy-kart--dar { max-width: 540px; }
/* Gölge ayrı katmanda: kart + üstteki kabarcıklar tek bulut silüeti gibi gölgelenir; yazılar filtreli katmanda değil. */
.uy-kart-zemin {
  position: absolute; inset: 0; z-index: -1;
  background: #fff; border-radius: 44px; box-shadow: inset 0 -8px 0 #EEF7FB;
  filter: drop-shadow(0 26px 34px rgba(36, 104, 135, .20)) drop-shadow(0 4px 8px rgba(36, 104, 135, .10));
}
.uy-puf { position: absolute; border-radius: 50%; background: #fff; }
.uy-puf--1 { width: 104px; height: 104px; left: 9%; top: -36px; }
.uy-puf--2 { width: 150px; height: 150px; left: calc(50% - 82px); top: -58px; }
.uy-puf--3 { width: 112px; height: 112px; right: 10%; top: -40px; }
.uy-kart--genis .uy-puf--1 { width: 128px; height: 128px; left: 8%; top: -44px; }
.uy-kart--genis .uy-puf--2 { width: 176px; height: 176px; left: calc(50% - 96px); top: -66px; }
.uy-kart--genis .uy-puf--3 { width: 136px; height: 136px; right: 9%; top: -48px; }

.uy-logo { margin: 0; text-align: center; line-height: 1; }
.uy-logo img { display: block; width: 250px; max-width: 82%; height: auto; margin: 0 auto; }
.uy-baslik {
  margin: 16px 0 20px; text-align: center; text-wrap: balance;
  font: 700 2.3rem/1.08 var(--font-script); letter-spacing: 0; color: var(--uy-teal-d);
}
.uy-kart--genis .uy-baslik { font-size: 2.6rem; }
.uy-baslik span {
  display: inline-block; padding-bottom: 10px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 14' preserveAspectRatio='none'%3E%3Cpath d='M4 9 C 40 3, 80 3, 112 7 S 170 12, 196 5' fill='none' stroke='%23F3672E' stroke-width='4' stroke-linecap='round'/%3E%3C/svg%3E") 50% 100% / 86% 11px no-repeat;
}
.uy-baslik:focus { outline: none; }

.uy-giris { margin: 0 0 14px; font-size: 16.5px; line-height: 1.6; color: #2E4A54; }
.uy-giris.prose { max-width: none; }
.uy-giris.prose > :last-child { margin-bottom: 0; }
.uy-zorunlu-not {
  display: table; margin: 8px auto 22px; padding: 6px 15px; border-radius: 999px;
  background: #FFF4EC; color: #4A3226; font-size: 14.5px; font-weight: 600; text-align: center;
}
.uy-yildiz { color: #C2410C; font-weight: 800; }
.uy-istege { font-weight: 500; font-size: .9em; color: var(--uy-muted); }

/* Bilgi / uyarı notu ve hata özeti ("Hay aksi!", giriş ekranının uyarı kutusu) */
.uy-not, .uy-ozet-hata {
  display: flex; align-items: flex-start; gap: 11px; margin: 0 0 18px; padding: 12px 15px 12px 12px;
  border-radius: 18px; font-size: 15px; line-height: 1.45;
}
.uy-not { background: #EAF7F7; border: 2px solid #B6E2E0; color: #1D4A50; }
.uy-not--uyari { background: #FFF8E1; border-color: #EED27A; color: #4F3B00; }
.uy-not p, .uy-destekci .uy-not p { margin: 0; }
.uy-not a, .uy-durum a:not(.uy-bag) { color: inherit; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.uy-not svg, .uy-ozet-hata svg { width: 24px; height: 24px; flex: none; margin-top: -1px; }
.uy-ozet-hata { background: #FFF1EA; border: 2px solid #F6B395; color: #9A2E0A; scroll-margin-top: 120px; }
.uy-ozet-hata strong { display: block; font-weight: 700; }

/* ---------- Bölümler ---------- */
.uy-form { margin: 0; }
.uy-bolum { margin: 0 0 30px; padding: 0; border: 0; min-width: 0; }
.uy-bolum + .uy-bolum { padding-top: 26px; border-top: 2px dashed #CDE5EE; }
.uy-bolum-baslik, .uy-grup-baslik, .uy-mutfak-ad { float: left; width: 100%; padding: 0; }
.uy-bolum-baslik + *, .uy-grup-baslik + *, .uy-mutfak-ad + * { clear: both; }
.uy-bolum-baslik { margin: 0 0 16px; }
.uy-bolum-no {
  display: inline-block; margin: 0 0 6px; padding: 4px 13px 3px; border-radius: 999px;
  background: #FFE9DC; color: #8F350D; font-size: 13.5px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase;
}
.uy-bolum-ad { display: block; font: 700 31px/1.08 var(--font-script); letter-spacing: 0; color: var(--uy-teal-d); text-wrap: balance; }
.uy-bolum-alt { margin: -6px 0 18px 2px; color: var(--uy-muted); font-size: 15.5px; }

/* ---------- Alanlar ---------- */
.uy-alan { margin: 0 0 18px; min-width: 0; scroll-margin-top: 120px; }
.uy-etiket { display: block; margin: 0 0 7px 4px; font-size: 15px; font-weight: 600; line-height: 1.35; color: var(--uy-label); }
.uy-girdi { position: relative; display: block; }
.uy-girdi .uy-ikon {
  position: absolute; left: 17px; top: 17px; width: 20px; height: 20px;
  color: #5C8896; pointer-events: none; transition: color .2s;
}
.uy-girdi:focus-within .uy-ikon { color: var(--uy-teal-d); }
.uy-form input[type=text], .uy-form input[type=email], .uy-form input[type=tel], .uy-form input[type=date], .uy-form textarea {
  display: block; width: 100%; min-height: 54px; margin: 0; padding: 0 18px;
  border: 2px solid var(--uy-line); border-radius: 18px; background: var(--uy-field);
  font: 500 16.5px/1.4 var(--font-govde); letter-spacing: 0; color: var(--uy-ink);
  transition: border-color .2s, box-shadow .2s, background-color .2s;
  -webkit-appearance: none; appearance: none;
}
.uy-form input[type=date] { line-height: 50px; }
.uy-form input[type=date]::-webkit-date-and-time-value { text-align: left; }
.uy-form textarea { padding-top: 14px; padding-bottom: 14px; min-height: 96px; line-height: 1.5; resize: vertical; }
.uy-form .uy-girdi--ikon input, .uy-form .uy-girdi--ikon textarea { padding-left: 48px; }
.uy-form ::placeholder { color: #63828C; opacity: 1; }
.uy-form input:not(.uy-kutu):hover, .uy-form textarea:hover { border-color: #4F7F8E; }
/* :not(.uy-kutu): metin alanı kuralları onay kutularını beyaza boyamasın (işaretli kutu odaklanınca tik görünmez oluyordu) */
.uy-form input:not(.uy-kutu):focus, .uy-form textarea:focus {
  outline: 2px solid transparent; border-color: var(--uy-teal-d); background: #fff; box-shadow: 0 0 0 4px rgba(35, 168, 167, .30);
}
.uy-form input:-webkit-autofill { -webkit-box-shadow: 0 0 0 40px var(--uy-field) inset; -webkit-text-fill-color: var(--uy-ink); }
.uy-alan.is-hata input:not(.uy-kutu), .uy-alan.is-hata textarea { border-color: var(--uy-hata-cizgi); background: #FFF8F4; }
.uy-alan.is-hata input:focus, .uy-alan.is-hata textarea:focus { box-shadow: 0 0 0 4px rgba(217, 72, 15, .22); }
.uy-alan.is-hata .uy-ikon { color: var(--uy-hata-cizgi); }
.uy-yardim { margin: 7px 0 0 4px; font-size: 14px; line-height: 1.45; color: var(--uy-muted); }
.uy-hata { display: flex; align-items: flex-start; gap: 7px; margin: 7px 0 0 4px; font-size: 14.5px; font-weight: 600; line-height: 1.4; color: var(--uy-hata); }
.uy-hata svg { width: 18px; height: 18px; flex: none; margin-top: 1px; color: var(--uy-hata-cizgi); }
.uy-cift { display: grid; grid-template-columns: minmax(0, 1fr); column-gap: 16px; }
.uy-cift-baslik { grid-column: 1 / -1; margin: 0 0 8px 4px; font-size: 15px; font-weight: 700; color: var(--uy-label); }
.uy-cift-baslik ~ .uy-alan .uy-etiket { font-weight: 500; font-size: 14.5px; }
.uy-alan--guvenlik .uy-girdi { max-width: 220px; }   /* güvenlik sorusu: kısa sayı alanı */
@media (min-width: 600px) {
  .uy-cift { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .uy-alan--yarim { max-width: calc(50% - 8px); }
}

/* ---------- Seçim döşemeleri (onay kutusu / radyo): ≥48px dokunma alanı, metnin tamamı tıklanır ---------- */
.uy-secim {
  display: flex; align-items: flex-start; gap: 12px; min-height: 48px; margin: 0 0 10px; padding: 12px 14px;
  background: #fff; border: 2px solid #D3E6EC; border-radius: 16px; cursor: pointer;
  font-size: 15.5px; line-height: 1.45; color: var(--uy-ink);
  transition: border-color .15s, background-color .15s, box-shadow .15s;
  -webkit-tap-highlight-color: transparent;
}
.uy-secim:hover { border-color: #8DB8C4; }
.uy-secim:has(.uy-kutu:checked) { border-color: #1C9493; background: #EAF8F7; box-shadow: 0 3px 0 rgba(14, 110, 109, .18); }
.uy-secim:has(.uy-kutu:focus-visible) { outline: 3px solid var(--uy-teal-d); outline-offset: 2px; }
.uy-secim-metin { min-width: 0; flex: 1; }
.uy-secim-metin strong { color: var(--uy-teal-d); }
.uy-secim-ek { display: block; margin-top: 2px; font-size: 14px; color: var(--uy-muted); }
.uy-kutu {
  -webkit-appearance: none; appearance: none; flex: none; display: grid; place-content: center;
  width: 24px; height: 24px; margin: 0; border: 2px solid var(--uy-line); border-radius: 8px; background: #fff;
  cursor: pointer; transition: background-color .15s, border-color .15s;
}
.uy-kutu::before {
  content: ""; width: 13px; height: 13px; background: #fff; transform: scale(0); transition: transform .15s;
  clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
}
.uy-kutu:checked { background: var(--uy-teal-d); border-color: var(--uy-teal-d); }
.uy-kutu:checked::before { transform: scale(1); }
.uy-kutu--yuvarlak { border-radius: 50%; }
.uy-kutu--yuvarlak::before { width: 10px; height: 10px; border-radius: 50%; clip-path: none; }
.uy-kutu:focus-visible { outline: 3px solid var(--uy-teal-d); outline-offset: 2px; }
.uy-secim:has(.uy-kutu:focus-visible) .uy-kutu:focus-visible { outline: none; }
.uy-kutu:disabled { cursor: not-allowed; }
.uy-secim-metin { margin-top: 1px; }
.uy-grup.is-hata .uy-secim, .uy-alan--onay.is-hata .uy-secim { border-color: #EFA383; }
.uy-alan--onay { margin-bottom: 12px; }
.uy-alan--onay .uy-secim { margin: 0; font-size: 15px; }

.uy-grup { margin: 0 0 22px; padding: 0; border: 0; min-width: 0; scroll-margin-top: 120px; }
.uy-grup-baslik { margin: 4px 0 6px; padding: 0 4px; font-size: 16px; font-weight: 700; line-height: 1.35; color: var(--uy-label); }
.uy-grup > .uy-yardim { margin-top: 0; }

/* "Hangi Mutfakta…": her grup kendi pastel kartında (bilgi kartı renk döngüsü) */
.uy-mutfaklar { display: grid; gap: 14px; margin-top: 12px; }
.uy-mutfak { margin: 0; padding: 14px 14px 4px; border: 0; border-radius: 22px; background: var(--uy-pastel, #DCF3F1); min-width: 0; }
.uy-mutfak[data-renk="1"] { --uy-pastel: #FFE9DC; --uy-koyu: #A63D10; }
.uy-mutfak[data-renk="2"] { --uy-pastel: #DCF3F1; --uy-koyu: #05615F; }
.uy-mutfak[data-renk="3"] { --uy-pastel: #FFF2C4; --uy-koyu: #6B4F00; }
.uy-mutfak[data-renk="4"] { --uy-pastel: #DCEFF8; --uy-koyu: #1A5E7F; }
.uy-mutfak[data-renk="5"] { --uy-pastel: #FDE3EC; --uy-koyu: #952A50; }
.uy-mutfak[data-renk="6"] { --uy-pastel: #E4F3D7; --uy-koyu: #3A6918; }
.uy-mutfak-ad, .uy-alan--mutfak .uy-etiket {
  margin: 0 0 10px; padding: 0 4px; font: 700 27px/1.1 var(--font-script); letter-spacing: 0; color: var(--uy-koyu);
}
.uy-mutfak .uy-secim { border-color: rgba(30, 54, 64, .10); }
.uy-mutfak .uy-secim:hover { border-color: rgba(30, 54, 64, .32); }
.uy-mutfak .uy-secim:has(.uy-kutu:checked) { border-color: var(--uy-koyu); background: #fff; box-shadow: 0 3px 0 var(--uy-koyu); }
.uy-mutfak .uy-kutu:checked { background: var(--uy-koyu); border-color: var(--uy-koyu); }
.uy-mutfak--metin { padding-bottom: 14px; }
.uy-alan--mutfak { margin: 0; }
.uy-alan--mutfak input:not(.uy-kutu), .uy-alan--mutfak textarea { background: #fff; }
.uy-grup--mutfak > .uy-hata { margin-top: 10px; }

/* "Ayda ne kadar zaman": üç döşeme, geniş ekranda yan yana */
.uy-zamanlar { display: grid; gap: 10px; margin-top: 6px; }
.uy-secim--zaman { margin: 0; }
@media (min-width: 720px) { .uy-kart--genis .uy-zamanlar { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

/* Destekçi formu: paket seçimi */
.uy-paket-secimi { display: grid; gap: 12px; margin-top: 6px; }
@media (min-width: 560px) { .uy-paket-secimi { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
.uy-secim--paket { margin: 0; padding: 14px 14px 14px; background: var(--uy-pastel); border-color: transparent; }
.uy-secim--paket[data-renk="2"] { --uy-pastel: #DCF3F1; --uy-koyu: #05615F; }
.uy-secim--paket[data-renk="3"] { --uy-pastel: #FFF2C4; --uy-koyu: #6B4F00; }
.uy-secim--paket:hover { border-color: rgba(30, 54, 64, .3); }
.uy-secim--paket:has(.uy-kutu:checked) { border-color: var(--uy-koyu); background: var(--uy-pastel); box-shadow: 0 4px 0 var(--uy-koyu); }
.uy-secim--paket .uy-kutu:checked { background: var(--uy-koyu); border-color: var(--uy-koyu); }
.uy-paket-ad { display: block; font: 700 27px/1.05 var(--font-script); letter-spacing: 0; color: var(--uy-koyu) !important; }
.uy-paket-fiyat { display: block; margin: 4px 0 3px; font-size: 18px; font-weight: 800; color: #1b1b1b; }
.uy-paket-ek { display: block; font-size: 13.5px; line-height: 1.4; color: #3B4F55; }
.uy-paket-ek.is-doldu { color: var(--uy-hata); font-weight: 700; }
.uy-secim--paket.is-kapali { cursor: not-allowed; opacity: .72; }
.uy-duvar { margin: 0 0 18px; padding: 14px 14px 2px; border-radius: 20px; background: #FFF8E1; }
.uy-duvar-baslik { margin: 0 0 10px 4px; font-size: 14.5px; line-height: 1.45; color: #4F3B00; }
.uy-duvar .uy-alan--onay { margin-bottom: 14px; }
.uy-duvar .uy-girdi input:not(.uy-kutu), .uy-duvar .uy-girdi textarea { background: #fff; }
/* Nar Ağacı mesajı: karakter sayacı (gizli gelir, site.js açar); sınıra yaklaşınca / aşınca renk değişir */
.uy-sayac { margin: 6px 4px 0 0; font-size: 13.5px; font-weight: 700; line-height: 1.3; text-align: right; color: var(--uy-muted); font-variant-numeric: tabular-nums; }
.uy-sayac[hidden] { display: none; }
.uy-sayac.is-yakin { color: #8A5A00; }
.uy-sayac.is-asti { color: var(--uy-hata); }
.uy-alan--nar-mesaji .uy-sayac + .uy-yardim { margin-top: 2px; }
/* Teşekkür sayfası: narın mesajı */
.uy-durum .uy-tesekkur-nar { margin: -4px auto 14px; max-width: 34ch; font-style: italic; color: #4F3B00; overflow-wrap: anywhere; }
/* JS'siz de doğru alanlar görünsün (destekleyen tarayıcıda); JS ayrıca hidden özniteliği koyar */
.uy-form:has(#uy-p-standart:checked) [data-paket-goster="kurucu"],
.uy-form:has(#uy-p-kurucu:checked) [data-paket-goster="standart"],
.uy-duvar:has(#uy-duvar-izni:not(:checked)) .uy-duvar-ad { display: none; }

/* ---------- Düğme, alt satırlar ---------- */
.uy-dugme {
  position: relative; display: flex; align-items: center; justify-content: center; gap: 10px;
  width: 100%; max-width: 440px; min-height: 56px; margin: 26px auto 0; padding: 0 24px;
  border: 0; border-radius: 999px; cursor: pointer;
  /* Üst bant parlak marka turuncusu; yazının oturduğu bant (%32 ve altı) beyaz yazıyla en az 4,5:1 */
  background: linear-gradient(180deg, #F3672E 0%, #E4581C 18%, #CF4A11 32%, #C8460F 62%, #BA3E0B 100%); color: #fff;
  font: 700 19px/1.2 var(--font-govde); letter-spacing: .01em; text-align: center;
  box-shadow: inset 0 2px 0 rgba(255, 255, 255, .24), 0 5px 0 #A3360A, 0 14px 24px rgba(190, 64, 12, .28);
  transition: transform .15s ease, box-shadow .15s ease, opacity .15s;
}
.uy-dugme svg { width: 22px; height: 22px; flex: none; transition: transform .2s ease; }
.uy-dugme:hover:not(:disabled) { transform: translateY(-1px); box-shadow: inset 0 2px 0 rgba(255, 255, 255, .24), 0 6px 0 #A3360A, 0 18px 28px rgba(190, 64, 12, .32); }
.uy-dugme:hover:not(:disabled) svg { transform: translateX(3px); }
.uy-dugme:active:not(:disabled) { transform: translateY(3px); box-shadow: inset 0 2px 0 rgba(255, 255, 255, .18), 0 2px 0 #A3360A, 0 6px 12px rgba(190, 64, 12, .25); }
.uy-dugme:focus-visible { outline: 3px solid var(--uy-teal-d); outline-offset: 4px; }
.uy-dugme:disabled { cursor: not-allowed; opacity: .6; }
.uy-dugme[aria-busy="true"] { cursor: progress; opacity: .85; }
.uy-dugme[aria-busy="true"] svg { animation: uy-bekle 1s ease-in-out infinite alternate; }
@keyframes uy-bekle { to { transform: translateX(5px); } }
.uy-gizlilik { margin: 20px 0 0; font-size: 14px; line-height: 1.5; text-align: center; color: var(--uy-muted); }
.uy-gizlilik a, .uy-bag { color: var(--uy-teal-d); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.uy-gizlilik a:hover, .uy-bag:hover { color: #0A5150; text-decoration-thickness: 2px; }
.uy-stripe-notu { margin: 18px 0 0; font-size: 13.5px; line-height: 1.45; text-align: center; color: var(--uy-muted); text-wrap: balance; }
.uy-stripe-notu svg { display: inline-block; width: 15px; height: 15px; margin-right: 5px; vertical-align: -2px; }
.uy-kart-alt { display: flex; flex-wrap: wrap; justify-content: center; gap: 0 22px; margin: 18px 0 0; font-size: 15px; }
.uy-bag { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; border-radius: 6px; }
.uy-gok a:focus-visible { outline: 3px solid var(--uy-teal-d); outline-offset: 3px; }
.uy-bal { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* ---------- Durum kutuları (başarı, teşekkür, aidat) ---------- */
.uy-durum { text-align: center; }
.uy-durum:focus { outline: none; }
.uy-durum-simge { display: block; width: 84px; height: 84px; margin: 2px auto 12px; }
.uy-durum h2 { margin: 0 0 10px; font: 700 31px/1.1 var(--font-script); letter-spacing: 0; color: var(--uy-teal-d); }
.uy-durum p { margin: 0 0 12px; font-size: 16.5px; line-height: 1.6; color: #2E4A54; }
.uy-durum .uy-durum-ana { font-size: 17.5px; color: var(--uy-ink); }
.uy-durum .uy-durum-no { margin-top: 14px; font-size: 14px; color: var(--uy-muted); }
.uy-durum .uy-not { text-align: left; }
.uy-aidat-tutar { margin: 6px 0 0 !important; font: 800 40px/1 var(--font-govde) !important; color: var(--uy-teal-d) !important; }
.uy-aidat-tutar small { font-size: 16px; font-weight: 600; color: var(--uy-muted); }
.uy-aidat-form .uy-dugme { margin-top: 22px; }
.uy-durum .uy-stripe-notu { margin: 18px 0 0; font-size: 13.5px; line-height: 1.45; color: var(--uy-muted); }

/* ---------- Telefon ---------- */
@media (max-width: 600px) {
  .uy-gok-ic { padding: 98px 12px 128px; }
  .uy-kart, .uy-kart--genis { padding: 32px 20px 26px; }
  .uy-kart-zemin { border-radius: 34px; }
  .uy-puf--1, .uy-kart--genis .uy-puf--1 { width: 80px; height: 80px; left: 7%; top: -28px; }
  .uy-puf--2, .uy-kart--genis .uy-puf--2 { width: 116px; height: 116px; left: calc(50% - 62px); top: -44px; }
  .uy-puf--3, .uy-kart--genis .uy-puf--3 { width: 88px; height: 88px; right: 8%; top: -30px; }
  .uy-logo img { width: 210px; }
  .uy-baslik, .uy-kart--genis .uy-baslik { font-size: 2.05rem; margin: 12px 0 16px; }
  .uy-bolum-ad { font-size: 28px; }
  .uy-mutfak { padding: 12px 10px 2px; border-radius: 20px; }
  .uy-mutfak--metin { padding-bottom: 12px; }
  .uy-mutfak-ad, .uy-alan--mutfak .uy-etiket { font-size: 25px; }
  .uy-secim { padding: 11px 12px; gap: 10px; }
  .uyg-gunes { left: -14px; top: -6px; width: 92px; }
  .uyg-ucurtma { right: 12px; top: 4px; width: 50px; }
  .uyg-kuslar { left: 30%; top: 12px; width: 40px; }
  .uyg-b1 { left: 22%; top: 46px; width: 110px; }
  .uyg-b2 { left: 56%; top: 8px; width: 92px; }
  .uyg-b3, .uyg-b4, .uyg-b5, .uyg-b6, .uyg-b7 { display: none; }
  .uy-gok-dekor .uyg-tepeler { height: 120px; }
}
@media (max-width: 360px) {
  .uy-kart, .uy-kart--genis { padding: 30px 15px 24px; }
  .uy-baslik, .uy-kart--genis .uy-baslik { font-size: 1.9rem; }
  .uy-mutfak { padding-left: 8px; padding-right: 8px; }
}
@media (forced-colors: active) {
  .uy-kutu { -webkit-appearance: auto; appearance: auto; }
  .uy-kutu::before { display: none; }
  .uy-dugme { border: 2px solid ButtonText; }
  .uy-form input, .uy-form textarea { border-color: FieldText; }
}
@media (prefers-reduced-motion: reduce) {
  .uy-gok *, .uy-gok *::before, .uy-gok *::after { animation: none !important; transition: none !important; }
}
@media print {
  .uy-gok { background: none; margin-bottom: 0; }
  .uy-gok-dekor, .uy-dugme, .uy-bal { display: none; }
  .uy-gok-ic { padding: 0; }
  .uy-kart-zemin { filter: none; box-shadow: none; }
}

/* ---------- Destekçi Üyelik: paket kartları ("bilgi kartı" dili; krem metin kartının içinde) ---------- */
.uy-paketler { display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px; margin: 10px 0 0; }
@media (min-width: 640px) { .uy-paketler { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 22px; } }
.uy-pk {
  position: relative; display: flex; flex-direction: column; min-width: 0;
  padding: 100px 22px 24px; border-radius: 26px; color: #1b1b1b;
  background:
    var(--uy-ikonu) no-repeat 24px 20px / 62px 62px,
    radial-gradient(circle at 55px 51px, #fff 0 38px, transparent 39px) no-repeat,
    var(--uy-bg);
  box-shadow: 0 14px 26px -18px var(--uy-koyu), 0 2px 0 rgba(0, 0, 0, .04);
}
.uy-pk[data-renk="2"] { --uy-bg: #DCF3F1; --uy-acc: #029E9C; --uy-koyu: #05615F; --uy-ikonu: var(--ikon-kalp); }
.uy-pk[data-renk="3"] { --uy-bg: #FFF2C4; --uy-acc: #F2B801; --uy-koyu: #6B4F00; --uy-ikonu: var(--ikon-yildiz); }
.uy-destekci .uy-pk-baslik { margin: 0 0 10px; font: 700 36px/1.05 var(--font-script); letter-spacing: 0; color: #1b1b1b; text-wrap: balance; }
.uy-destekci .uy-pk-fiyat {
  align-self: flex-start; margin: 0 0 14px; padding: 5px 16px 4px;
  background: #fff; border: 2.5px solid #1b1b1b; border-radius: 16px; box-shadow: 3px 3px 0 rgba(0, 0, 0, .18);
  font: 700 26px/1.2 var(--font-el); letter-spacing: 0; color: var(--uy-koyu); transform: rotate(-1.5deg);
}
.uy-destekci .uy-pk-metin { margin: 0 0 12px; font-size: 16px; line-height: 1.55; color: #333; }
.uy-destekci .uy-pk-fayda { display: flex; gap: 10px; margin: 0 0 18px; font-size: 15.5px; line-height: 1.5; font-weight: 600; color: #1b1b1b; }
.uy-pk-tik { width: 22px; height: 22px; flex: none; margin-top: 1px; color: var(--uy-koyu); }
.uy-pk-rozet {
  position: absolute; top: 24px; right: 16px; max-width: calc(100% - 124px);
  padding: 5px 13px 4px; border: 2.5px solid #1b1b1b; border-radius: 999px; background: var(--uy-acc);
  font: 700 17px/1.15 var(--font-el); letter-spacing: 0; text-align: center; color: #1b1b1b;
  transform: rotate(5deg); box-shadow: 3px 3px 0 rgba(0, 0, 0, .18);
}
.uy-pk-kontenjan { margin: auto 0 16px; }
.uy-destekci .uy-pk-kalan { margin: 0 0 7px; font-size: 15px; font-weight: 700; color: #1b1b1b; }
.uy-pk-cubuk { display: block; height: 14px; overflow: hidden; background: #fff; border: 2px solid #1b1b1b; border-radius: 999px; }
.uy-pk-cubuk > span { display: block; height: 100%; min-width: 6px; background: #F3672E; border-radius: 999px; }
.uy-destekci .uy-pk-doldu {
  margin: 0; padding: 10px 14px; background: #fff; border: 2.5px dashed #A63D10; border-radius: 16px;
  font-size: 15px; line-height: 1.45; color: #6E2709;
}
.uy-pk-doldu strong { display: block; font: 700 23px/1.15 var(--font-el); color: #A63D10; }
.uy-destekci a.uy-pk-dugme {
  align-self: flex-start; display: inline-flex; align-items: center; gap: 8px; min-height: 48px; margin-top: auto; padding: 9px 22px 8px;
  border-radius: 999px; background: var(--uy-koyu); color: #fff; text-decoration: none;
  font: 700 19px/1.2 var(--font-el); letter-spacing: .02em; box-shadow: 0 4px 0 rgba(0, 0, 0, .22);
  transition: transform .2s cubic-bezier(.3, 1.5, .5, 1), box-shadow .2s;
}
.uy-pk-kontenjan + a.uy-pk-dugme { margin-top: 0; }
.uy-destekci a.uy-pk-dugme svg { width: 20px; height: 20px; transition: transform .2s; }
.uy-destekci a.uy-pk-dugme:focus-visible { outline: 3px solid var(--focus-mavi); outline-offset: 4px; }
@media (hover: hover) {
  .uy-destekci a.uy-pk-dugme:hover { color: #fff; transform: translateY(-2px); box-shadow: 0 6px 0 rgba(0, 0, 0, .22); }
  .uy-destekci a.uy-pk-dugme:hover svg { transform: translateX(3px); }
}
@media (max-width: 380px) {
  .uy-pk { padding: 92px 18px 20px; background-position: 18px 16px, 0 0, 0 0; background-size: 58px 58px, auto, auto;
    background-image: var(--uy-ikonu), radial-gradient(circle at 47px 45px, #fff 0 35px, transparent 36px); }
  .uy-pk-rozet { right: 12px; top: 20px; font-size: 15px; max-width: calc(100% - 108px); }
  .uy-destekci .uy-pk-baslik { font-size: 32px; }
}
@media (prefers-reduced-motion: reduce) { .uy-destekci a.uy-pk-dugme, .uy-destekci a.uy-pk-dugme svg { transition: none; } }
@media print { .uy-pk { box-shadow: none; border: 2px solid #999; } .uy-pk-dugme { display: none !important; } }

/* ---------- Destekçi kartı: "dolmak üzere" notu + Kurucularımız bağlantısı ---------- */
.uy-destekci .uy-pk-uzere { margin: 9px 0 0; padding: 7px 11px; background: #fff; border: 2px dashed #6B4F00; border-radius: 12px; font-size: 14px; line-height: 1.45; color: #4D3900; }
.uy-destekci a.uy-pk-bag { color: inherit; text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 3px; text-decoration-color: var(--uy-koyu, #6B4F00); }
.uy-destekci a.uy-pk-bag:hover { text-decoration-color: #f3672e; }
.uy-destekci a.uy-pk-bag:focus-visible { outline: 3px solid var(--focus-mavi); outline-offset: 2px; border-radius: 4px; }

/* ---------- Kurucularımız: Nar Ağacı (şablon uyelik-kurucular; balon ve pencere: site.js "Nar Ağacı") ----------
   Krem kart (metin sayfalarındaki kesik çizgili kart dili) içinde büyük, satır içi SVG ağaç: tacında 100 yuva; boşu
   salınan bir nar çiçeği, dolusu dala asılı tam bir nar. Altta sayfa metni, katılım çağrısı ve "Narlarımız" listesi.
   Hareket yalnız transform/opacity ile ve hep birkaç öğede: site.js her an birkaç çiçeğe (.is-nefes), kenar yaprağına
   (.is-ruzgar) ve ara sıra nara (.is-salla) kısa bir salınım verir. Satır içi SVG'nin alt öğeleri compositor'da
   oynamaz, her kare ağacı yeniden boyar: 100 çiçek + 70 yaprak birden sürekli oynasaydı telefonda ~25 fps'e düşerdi. Ağaç ekrandan çıkınca (.is-uzak), panelde "animasyon" kapalıyken (data-nar-animasyon="0") ve
   prefers-reduced-motion'da hareket yok. Pencere bilgi kartı penceresinin (.bk-dialog, data-renk="5" pembe)
   görünümünü kullanır; burada yalnız farklar. */
.uyn { max-width: 1320px; }
.uyn-kart {
  position: relative; margin: 0 auto; padding: 22px 0 20px;
  background: #FFFAF3; border-radius: 30px 36px 28px 34px / 34px 28px 36px 30px;
  box-shadow: 0 28px 46px -30px rgba(166, 61, 16, .55), 0 3px 0 rgba(166, 61, 16, .07);
}
.uyn-kart::before {
  content: ""; position: absolute; inset: 7px; pointer-events: none;
  border: 2.5px dashed rgba(243, 103, 46, .5); border-radius: 23px 29px 21px 27px / 27px 21px 29px 23px;
}
.uyn-tabela { position: relative; z-index: 1; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px 14px; margin: 0 8px 2px; text-align: center; }
.uyn-tabela-ad {
  margin: 0; padding: 6px 20px 4px; background: #E0392B; color: #fff; border: 2.5px solid #1b1b1b; border-radius: 14px;
  font: 700 30px/1.1 var(--font-script); letter-spacing: 0; transform: rotate(-2deg); box-shadow: 4px 4px 0 rgba(0, 0, 0, .2);
}
.uyn-sayi {
  margin: 0; padding: 4px 14px 3px; background: #fff; border: 2.5px solid #1b1b1b; border-radius: 999px;
  font: 700 18px/1.2 var(--font-el); color: #952A50; transform: rotate(2deg); box-shadow: 3px 3px 0 rgba(0, 0, 0, .15);
  font-variant-numeric: tabular-nums;
}

/* Ağaç: kartın tam genişliği (telefonda yanlardan biraz kırpılır: taç büyür; yatay kaydırma yok) */
.uyn-agac { position: relative; margin: 0; }
.uyn-svg { display: block; width: 100%; height: auto; aspect-ratio: 1200 / 920; }
.uyn-halka { fill: transparent; stroke: none; }
.uyn-nar, .uyn-siradaki { cursor: pointer; }
.uyn-nar:focus, .uyn-siradaki:focus { outline: none; }
/* SVG öğeleri kendi koordinat başlangıcı etrafında döner: nar sapın dala bağlandığı uçtan, çiçek dibinden */
.uyn-sal, .uyn-cicek, .uyn-kenar use { transform-box: view-box; transform-origin: 0 0; }
.uyn-nar-cizim { transform-box: view-box; transform-origin: 9px 44px; transition: transform .25s cubic-bezier(.3, 1.6, .5, 1); }
@media (hover: hover) {
  .uyn-nar:hover .uyn-nar-cizim { transform: scale(1.12); }
  .uyn-siradaki:hover .uyn-halka { fill: #fff; }
}
.uyn-nar:focus-visible .uyn-halka, .uyn-siradaki:focus-visible .uyn-halka { fill: rgba(255, 255, 255, .7); stroke: var(--focus-mavi); stroke-width: 5; stroke-dasharray: none; }
.uyn-nar.is-acik .uyn-halka { fill: rgba(255, 255, 255, .7); stroke: #1b1b1b; stroke-width: 3; stroke-dasharray: 6 5; }
/* Sıradaki çiçek: katılım formuna giden, kesik çizgili halkalı çiçek */
.uyn-siradaki .uyn-halka { fill: rgba(255, 255, 255, .78); stroke: #A63D10; stroke-width: 3; stroke-dasharray: 6 5; }
/* Taç kümelerinin ışık ve gölge kenarları */
.uyn-k-isik { fill: none; stroke: #8FCC5C; stroke-width: 8; stroke-linecap: round; }
.uyn-k-golge { fill: none; stroke: #3E7D24; stroke-width: 7; stroke-linecap: round; opacity: .7; }

/* Hareket: narlar ara sıra sapının ucunda sallanır (genlik --uyn-a, site.js); çiçekler sırayla salınıp "nefes alır"
   (açılıp kapanır); kenar yaprakları rüzgârda kıpırdar; çiçeklerde ara sıra minik parıltı. Çiçek ve yaprak
   salınımları tek turdur ve dinlenme hâlinden (transform yok) başlayıp ona döner: site.js aynı anda yalnız birkaçına
   sınıf ekler. Yalnız "sıradaki nar sizin olabilir" çiçeği sürekli nefes alır. */
.uyn-sal.is-salla { animation: uyn-salla 2.6s ease-in-out; }
@keyframes uyn-salla {
  0% { transform: rotate(0); }
  14% { transform: rotate(var(--uyn-a, 7deg)); }
  36% { transform: rotate(calc(var(--uyn-a, 7deg) * -.72)); }
  58% { transform: rotate(calc(var(--uyn-a, 7deg) * .42)); }
  80% { transform: rotate(calc(var(--uyn-a, 7deg) * -.16)); }
  100% { transform: rotate(0); }
}
.uyn-cicek.is-nefes { animation: uyn-nefes 4.2s ease-in-out; }
.uyn-cicek.is-nefes[data-s="1"] { animation-duration: 5s; }
.uyn-cicek.is-nefes[data-s="2"] { animation-duration: 3.6s; }
.uyn-cicek--siradaki { animation: uyn-nefes 4.4s ease-in-out infinite; }
@keyframes uyn-nefes {
  0%, 100% { transform: none; }
  30% { transform: rotate(-6deg) scale(.93, .97); }
  70% { transform: rotate(5deg) scale(1.06, 1.02); }
}
.uyn-kenar use.is-ruzgar { animation: uyn-ruzgar 3.2s ease-in-out; }
@keyframes uyn-ruzgar {
  0%, 100% { transform: none; }
  28% { transform: rotate(-7deg); }
  64% { transform: rotate(6deg); }
}
.uyn-parilti { opacity: 0; transform-box: fill-box; transform-origin: center; }
.uyn-parilti.is-parla { animation: uyn-parla 1.4s ease-out; }
@keyframes uyn-parla {
  0% { opacity: 0; transform: scale(.2) rotate(0); }
  35% { opacity: 1; transform: scale(1.15) rotate(40deg); }
  100% { opacity: 0; transform: scale(.35) rotate(90deg); }
}
.uyn-kelebek { animation: uyn-uc 3.6s ease-in-out infinite alternate; }
@keyframes uyn-uc { from { transform: translate(0, 0) rotate(-4deg); } to { transform: translate(12px, -16px) rotate(6deg); } }
.uyn-agac.is-uzak .uyn-cicek, .uyn-agac.is-uzak .uyn-kenar use, .uyn-agac.is-uzak .uyn-kelebek { animation-play-state: paused; }
.uyn-agac[data-nar-animasyon="0"] .uyn-cicek, .uyn-agac[data-nar-animasyon="0"] .uyn-kenar use,
.uyn-agac[data-nar-animasyon="0"] .uyn-kelebek, .uyn-agac[data-nar-animasyon="0"] .uyn-sal { animation: none; }

/* Balon: fareyle (ya da klavye odağıyla) narın üstüne gelince narın yanında belirir (site.js konumlar: kart
   dışına taşmaz; .is-alt = narın altında). Bilgi narın aria-label'ında da var: balon ekran okuyucudan gizli. */
.uyn-balon {
  --uyn-ok: 50%;
  position: absolute; left: 0; top: 0; z-index: 3; box-sizing: border-box; width: max-content; max-width: min(320px, calc(100% - 20px));
  margin: 0; padding: 10px 18px 13px; background: #fff; border: 2.5px solid #1b1b1b; border-radius: 20px 23px 19px 22px;
  box-shadow: 4px 5px 0 rgba(0, 0, 0, .16); text-align: left; pointer-events: none;
  opacity: 0; visibility: hidden; transform: translateY(8px) scale(.9); transform-origin: var(--uyn-ok) 100%;
  transition: opacity .16s ease-out, transform .24s cubic-bezier(.3, 1.5, .5, 1), visibility 0s linear .24s;
}
.uyn-balon.is-alt { transform: translateY(-8px) scale(.9); transform-origin: var(--uyn-ok) 0; }
.uyn-balon.is-acik { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
.uyn-balon::after {
  content: ""; position: absolute; left: var(--uyn-ok); bottom: -11px; width: 18px; height: 18px; margin-left: -9px;
  background: #fff; border: solid #1b1b1b; border-width: 0 2.5px 2.5px 0; border-bottom-right-radius: 4px; transform: rotate(45deg);
}
.uyn-balon.is-alt::after { top: -11px; bottom: auto; border-width: 2.5px 0 0 2.5px; border-radius: 4px 0 0; }
.uyn-balon-ad { margin: 0; font: 700 27px/1.1 var(--font-script); letter-spacing: 0; color: #A31F35; overflow-wrap: anywhere; }
.uyn-balon-mesaj { margin: 5px 0 0; font: 400 16.5px/1.45 var(--font-el); letter-spacing: 0; color: #1b1b1b; overflow-wrap: anywhere; }
.uyn-balon-mesaj::before { content: "“"; color: #E0392B; }
.uyn-balon-mesaj::after { content: "”"; color: #E0392B; }
.uyn-balon-mesaj[hidden] { display: none; }

.uyn-durum { position: relative; margin: 4px 16px 0; font: 700 21px/1.3 var(--font-el); letter-spacing: 0; text-align: center; color: #A63D10; }
.uyn-ipucu { position: relative; margin: 4px 16px 0; font-size: 15px; line-height: 1.5; text-align: center; color: #333; }
.uyn-not { position: relative; margin: 10px 18px 0; font-size: 14.5px; line-height: 1.5; text-align: center; color: #5B4632; }
.uyn-bos { position: relative; margin: 4px 16px 0; text-align: center; }
.uyn-bos-baslik { margin: 0 0 6px; font: 700 30px/1.15 var(--font-script); letter-spacing: 0; color: #A63D10; }
.uyn-bos-metin { max-width: 34rem; margin: 0 auto; font-size: 16px; line-height: 1.55; color: #333; }

/* Ağacın altındaki sayfa metni (CMS); ilk paragraf giriş cümlesi gibi büyük */
.uyn-govde { max-width: 44rem; margin: 30px auto 0; font-size: 17px; line-height: 1.7; text-align: center; }
.uyn-govde > :first-child { font: 700 25px/1.35 var(--font-script); letter-spacing: 0; color: #A63D10; }
.uyn-govde > :last-child { margin-bottom: 0; }

/* Katılım çağrısı */
.uyn-katil {
  max-width: 40rem; margin: 30px auto 0; padding: 20px 18px 22px; text-align: center;
  background: #fff; border: 2.5px solid #1b1b1b; border-radius: 22px 26px 21px 25px; box-shadow: 4px 4px 0 rgba(0, 0, 0, .14);
}
.uyn-katil-baslik { margin: 0 0 4px; font: 700 31px/1.15 var(--font-script); letter-spacing: 0; color: #A63D10; }
.uyn-katil-kalan { margin: 0 0 14px; font-size: 16px; font-weight: 700; color: #05615F; }
.uyn-katil--sade { padding: 0; background: none; border: 0; box-shadow: none; }
a.uyn-dugme {
  display: inline-flex; align-items: center; gap: 8px; min-height: 48px; padding: 9px 24px 8px; border-radius: 999px;
  background: #F3672E; color: #fff; text-decoration: none; font: 700 20px/1.2 var(--font-el); letter-spacing: .02em;
  border: 2.5px solid #1b1b1b; box-shadow: 0 4px 0 #1b1b1b; transition: transform .2s cubic-bezier(.3, 1.5, .5, 1), box-shadow .2s;
}
a.uyn-dugme svg { width: 20px; height: 20px; }
a.uyn-dugme:focus-visible { outline: 3px solid var(--focus-mavi); outline-offset: 4px; }
@media (hover: hover) { a.uyn-dugme:hover { color: #fff; transform: translateY(-2px); box-shadow: 0 6px 0 #1b1b1b; } }

/* Narlarımız: katılım sırasıyla kartlar (telefonda tek sütun); ağaçtaki narlar JS yoksa buraya bağlanır */
.uyn-liste-bolum { max-width: 1160px; margin: 40px auto 0; }
.uyn-liste-baslik { margin: 0 0 16px; font: 700 36px/1.1 var(--font-script); letter-spacing: 0; text-align: center; color: #1b1b1b; }
.uyn-liste { display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; margin: 0; padding: 0; list-style: none; }
.uyn-lk {
  display: flex; align-items: flex-start; gap: 14px; margin: 0; padding: 14px 16px 14px 14px;
  background: #FFFAF3; border: 2.5px solid #1b1b1b; border-radius: 18px 21px 17px 20px; box-shadow: 3px 3px 0 rgba(0, 0, 0, .14);
  scroll-margin-top: calc(var(--header-h) + 24px);
}
.uyn-lk:target { outline: 3px solid #E0392B; outline-offset: 3px; animation: uyn-hedef 1.4s ease-out; }
@keyframes uyn-hedef { from { background: #FDE3EC; } }
.uyn-lk-simge { position: relative; flex: none; width: 44px; height: 56px; }
.uyn-lk-nar { display: block; width: 44px; height: 56px; }
.uyn-lk-no {
  position: absolute; right: -8px; bottom: -4px; min-width: 22px; height: 22px; padding: 0 4px; border-radius: 999px;
  background: #fff; border: 1.5px solid #952A50; color: #952A50; font: 700 11px/19px var(--font-govde); text-align: center;
}
.uyn-lk-metin { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.uyn-lk-ad { font: 700 21px/1.2 var(--font-el); letter-spacing: 0; color: #1b1b1b; overflow-wrap: anywhere; }
.uyn-lk-mesaj { font-size: 15.5px; line-height: 1.5; color: #333; overflow-wrap: anywhere; quotes: "“" "”"; }

/* Nar penceresi (.bk-dialog üstüne) */
.uyn-pencere { width: min(580px, calc(100vw - 48px)); }
.uyn-pencere[hidden] { display: none; }
.uyn-pencere .uyn-p-ikon { display: grid; place-items: center; background: #fff; }
.uyn-p-nar { display: block; width: 52px; height: 66px; margin-top: 2px; }
.uyn-p-baslik { flex: 1; min-width: 0; }
.uyn-p-ust-etiket { margin: 0 0 2px; font: 700 16px/1.2 var(--font-el); letter-spacing: .02em; color: var(--bk-koyu); }
.uyn-p-baslik .bk-baslik { font-size: 38px; }
.uyn-p-govde { padding: 36px 34px 30px; }
.uyn-p-mesaj { margin: 0; padding: 0; border: 0; background: none; font: 700 26px/1.45 var(--font-el); letter-spacing: 0; text-align: center; color: #1b1b1b; overflow-wrap: anywhere; }
.uyn-p-mesaj p { margin: 0; }
.uyn-p-mesaj p::before { content: "“"; color: #E0392B; }
.uyn-p-mesaj p::after { content: "”"; color: #E0392B; }
.uyn-p-mesaj[hidden] { display: none; }
.uyn-p-mesajsiz { margin: 0; font-size: 18px; font-style: italic; line-height: 1.5; text-align: center; color: #555; }
@media (max-width: 599.98px), (max-height: 520px) {   /* site.js / bilgi kartı penceresiyle aynı koşul: alttan açılan sayfa */
  .uyn-pencere { width: 100%; }
  /* ad telefonda kayan alanın başında (site.js taşır; .bk-govde > .bk-baslik deseni): uzun ad mesajı sıkıştırmaz */
  .bk-govde > .uyn-p-baslik {
    position: relative; margin: -30px -20px 30px; padding: 0 20px 12px;
    background: var(--bk-bg);
  }
  .bk-govde > .uyn-p-baslik::after {
    content: ""; position: absolute; left: 0; right: 0; top: 100%; height: 14px;
    background: var(--bk-bg);
    -webkit-mask: var(--firca-mask) repeat-x top / 900px 100%;
            mask: var(--firca-mask) repeat-x top / 900px 100%;
  }
  .uyn-p-baslik .bk-baslik { font-size: 28px; }
  .uyn-p-nar { width: 40px; height: 51px; }
  .uyn-p-govde { padding: 30px 20px 24px; }
  .uyn-p-mesaj { font-size: 22px; }
}
@media (max-height: 520px) {
  .uyn-p-nar { width: 30px; height: 38px; }
  .uyn-p-ust-etiket { font-size: 14px; }
  .uyn-p-govde { padding: 18px 20px 16px; }
  .bk-govde > .uyn-p-baslik { margin: -18px -20px 22px; padding: 0 20px 8px; }
  .uyn-p-baslik .bk-baslik { font-size: 26px; }
}

/* Telefon: kart kabın kenar boşluğuna taşar (ağaç olabildiğince büyük), ağaç yanlardan 50'şer birim kırpılır;
   narların görünmez dokunma dairesi büyür (liste asıl okuma yolu) */
@media (max-width: 599.98px) {
  .uyn-kart { margin: 0 -12px; padding: 18px 0 18px; }
  .uyn-svg { aspect-ratio: 1100 / 920; }
  .uyn-nar .uyn-halka { r: 42px; }
}
@media (min-width: 600px) {
  .uyn-kart { padding: 28px 10px 26px; }
  .uyn-kart::before { inset: 9px; }
  .uyn-tabela-ad { font-size: 38px; }
  .uyn-govde { font-size: 18px; }
  .uyn-govde > :first-child { font-size: 30px; }
  .uyn-katil { padding: 24px 28px 26px; }
  .uyn-katil-baslik { font-size: 36px; }
  .uyn-liste { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1000px) {
  .uyn-kart { padding: 32px 22px 30px; }
  .uyn-tabela-ad { font-size: 44px; }
  .uyn-durum { font-size: 24px; }
  .uyn-liste { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (prefers-reduced-motion: reduce) {
  .uyn-cicek, .uyn-cicek.is-nefes, .uyn-kenar use, .uyn-kenar use.is-ruzgar, .uyn-kelebek, .uyn-sal, .uyn-parilti, .uyn-lk:target { animation: none; }
  .uyn-nar-cizim, a.uyn-dugme, .uyn-balon { transition: none; }
  .uyn-nar:hover .uyn-nar-cizim { transform: none; }
}
@media (forced-colors: active) {
  .uyn-kart, .uyn-lk, .uyn-katil, .uyn-tabela-ad, .uyn-balon { border: 2px solid CanvasText; }
  .uyn-nar:focus-visible .uyn-halka, .uyn-siradaki:focus-visible .uyn-halka { stroke: Highlight; }
}
@media print {
  .uyn-kart, .uyn-lk, .uyn-katil { box-shadow: none; }
  .uyn-katil, .uyn-ipucu, .uyn-pencere, .uyn-balon, .uyn-parlak { display: none !important; }
  .uyn-kus, .uyn-kelebek, .uyn-siradaki .uyn-halka { display: none; }
  .uyn-svg { max-width: 15cm; margin: 0 auto; }
  .uyn-cicek, .uyn-kenar use { animation: none; }
  .uyn-lk { break-inside: avoid; }
}