/* ===========================================================
   BENGİ KÜLTÜR: Genel Site Görsel Kimlik
   Üye platformuyla aynı marka paleti (logo-mark.png'den türedi),
   ama "kütüphane teması" burada daha ferah ve editoryal: daha çok
   boşluk, büyük serif başlıklar, ince çizgi süsler. Stok fotoğraf yok.
   =========================================================== */

:root{
  --zeytin-900:#1F2318; --zeytin-800:#333827; --zeytin-700:#454B36;
  --zeytin-600:#5E6448; --zeytin-500:#737367;
  --adaci-400:#9C9D8D; --adaci-300:#B5B7A6; --adaci-200:#CFD1C0; --adaci-100:#E2E4D5; --adaci-50:#F2F3E8;
  --krem:#FAF8F1; --kum:#F3F0E4;
  --kiremit:#A0522F; --kiremit-koyu:#8F4B2B; --kiremit-50:#FBF0E9;
  --altin:#8A6D1F; --altin-koyu:#6E5518; --altin-50:#FBF3DD;

  --sayfa: var(--krem);
  --white: #FFFFFF;
  --navy: var(--zeytin-800);
  --blue: var(--zeytin-600);
  --blue-soft: var(--zeytin-500);
  --blue-100: var(--adaci-100);
  --blue-50: var(--adaci-50);
  --ink: #262A1D;
  --ink-soft: #5C6150;
  --line: #E4E1D2;
  --ok-bg:#EEF4E7; --ok-bd:#5B7C3A; --ok-tx:#33471F;
  --err-bg:#FBEDE7; --err-bd:#B0472B; --err-tx:#6E2A17;

  --font-display: 'Source Serif 4', Georgia, serif;
  --font-body: 'Source Serif 4', Georgia, serif;
  --font-ui: 'Manrope', -apple-system, sans-serif;

  --radius: 14px;
  --radius-sm: 9px;
  --shadow: 0 1px 2px rgba(47,52,36,.05), 0 10px 30px -12px rgba(47,52,36,.20);
  --shadow-lift: 0 4px 12px rgba(47,52,36,.09), 0 24px 48px -18px rgba(47,52,36,.30);

  --egri: cubic-bezier(.22,.61,.36,1);
  --sure-hizli: .16s;
  --sure: .3s;
  --sure-yavas: .6s;

  --bengisu: #A0522F; --benginaz: #9C9D8D; --bengican: #5E6448;
}

/* Koyu tema: üye platformuyla aynı anahtar (data-tema), ayrı bir localStorage adı altında
   (bengi-genel-gorunum) ki iki site birbirinin tercihini ezmesin. Loş tema bu sitede yok. */
:root[data-tema="karanlik"]{
  --sayfa:#1B1D15; --white:#242619; --navy:#EFEEE4; --ink:#EDEBDF; --ink-soft:#AFB09C; --line:#3A3D2C;
  --blue:#B5B7A6; --blue-soft:#9C9D8D; --blue-100:#333827; --blue-50:#262A1D;
  --kiremit:#C97A52; --kiremit-koyu:#E09470;
}

*,*::before,*::after{ box-sizing:border-box; }
/* Hafif eğik kartlar (hobi kartları) telefonda 1 px yana kaydırmasın; clip, yapışkan üst çubuğu bozmaz */
html, body{ overflow-x:clip; }
html{ scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } }
body{
  margin:0; background:var(--sayfa); color:var(--ink);
  font-family:var(--font-body); font-size:17px; line-height:1.65;
  -webkit-font-smoothing:antialiased;
  transition:background var(--sure) var(--egri), color var(--sure) var(--egri);
}
img{ max-width:100%; display:block; }
a{ color:inherit; }
h1,h2,h3,h4{ font-family:var(--font-display); font-weight:700; margin:0 0 .4em; letter-spacing:-0.01em; color:var(--navy); }
h1{ font-size:clamp(32px,5vw,52px); line-height:1.1; }
h2{ font-size:clamp(24px,3.4vw,34px); line-height:1.18; }
h3{ font-size:20px; }
p{ margin:0 0 1em; }
button,input,select,textarea{ font-family:var(--font-ui); }
:focus-visible{ outline:2px solid var(--blue); outline-offset:2px; }
.container{ max-width:1080px; margin:0 auto; padding:0 20px; }
.eyebrow{ font-family:var(--font-ui); font-size:12px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-soft); }

/* ---------- Düğmeler ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  font-family:var(--font-ui); font-weight:600; font-size:15px;
  padding:12px 22px; border-radius:999px; border:1px solid transparent;
  background:var(--blue); color:#fff; text-decoration:none; cursor:pointer;
  transition:transform var(--sure-hizli) var(--egri), background var(--sure-hizli) var(--egri);
}
.btn:hover{ background:var(--zeytin-700); }
/* Karanlık temada açık zemin üstünde koyu yazı (beyaz yazı 2:1 kalıyordu) */
:root[data-tema="karanlik"] .btn:not(.secondary){ color:#1F2318; }
:root[data-tema="karanlik"] .btn:not(.secondary):hover{ background:var(--adaci-200); }
.btn:active{ transform:scale(.97); }
.btn.secondary{ background:transparent; color:var(--ink); border-color:var(--line); }
.btn.secondary:hover{ background:var(--blue-50); }
.btn.small{ padding:8px 16px; font-size:13.5px; }
.btn.buyuk{ padding:16px 30px; font-size:16.5px; }

/* ---------- Header ---------- */
.site-header{
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:16px 20px; position:sticky; top:0; z-index:60;
  background:color-mix(in srgb, var(--sayfa) 88%, transparent);
  background:var(--sayfa);
  backdrop-filter:blur(10px) saturate(1.1);
  border-bottom:1px solid var(--line);
}
.marka{ display:flex; align-items:center; gap:10px; text-decoration:none; }
.marka img{ width:34px; height:34px; object-fit:contain; }
.marka-metin{ font-family:var(--font-display); font-weight:600; font-size:19px; color:var(--navy); white-space:nowrap; }
.marka-metin b{ font-weight:700; }
.header-sag{ display:flex; align-items:center; gap:10px; }
.ucnokta-dugme{
  width:40px; height:40px; border-radius:999px; border:1px solid var(--line);
  background:var(--white); display:flex; align-items:center; justify-content:center;
  cursor:pointer; color:var(--ink);
}
.ucnokta-dugme:hover{ background:var(--blue-50); }

/* ---------- Üç nokta çekmecesi ---------- */
.cekmece-ardalan{
  position:fixed; inset:0; background:rgba(31,35,24,.35); z-index:80;
  opacity:0; pointer-events:none; transition:opacity var(--sure) var(--egri);
}
.cekmece-ardalan.acik{ opacity:1; pointer-events:auto; }
.cekmece{
  position:fixed; top:0; right:0; height:100%; width:min(360px,88vw);
  background:var(--white); z-index:90; box-shadow:var(--shadow-lift);
  transform:translateX(100%); transition:transform var(--sure) var(--egri);
  display:flex; flex-direction:column; padding:20px;
  padding-top:calc(20px + env(safe-area-inset-top,0px));
  overflow-y:auto;
}
.cekmece.acik{ transform:translateX(0); }
.cekmece:not(.acik){ box-shadow:none; visibility:hidden; transition:transform var(--sure) var(--egri), visibility 0s linear var(--sure); } /* kapalıyken gölgesi sızmasın, Tab'la da ulaşılmasın */
.cekmece-dar{ width:min(420px,92vw); }
@media (max-width:640px){
  .cekmece, .cekmece-dar{ top:auto; bottom:0; right:0; left:0; width:100%; height:auto; max-height:82vh;
    border-radius:20px 20px 0 0; transform:translateY(100%); }
  .cekmece.acik{ transform:translateY(0); }
}
.cekmece h2{ font-size:18px; margin-bottom:14px; }
.cekmece-kapat{ align-self:flex-end; background:none; border:none; font-size:22px; cursor:pointer; color:var(--ink-soft); padding:6px; }
.cekmece-link{
  display:flex; align-items:center; gap:10px; padding:13px 10px; border-radius:var(--radius-sm);
  text-decoration:none; color:var(--ink); font-weight:600; font-size:15px;
}
.cekmece-link:hover{ background:var(--blue-50); }
.cekmece-ayrac{ height:1px; background:var(--line); margin:10px 0; }
.cekmece-dugme{ width:100%; text-align:left; border:0; background:none; font-family:var(--font-body); cursor:pointer; }

/* Üst menü: masaüstünde görünür, dar ekranda çekmecede */
.ust-menu{ display:none; }
@media (min-width:900px){
  .ust-menu{ display:flex; align-items:center; gap:4px; margin-left:auto; margin-right:8px; }
  .ust-menu a{ padding:8px 12px; border-radius:var(--radius-sm); color:var(--ink); text-decoration:none; font:600 14.5px var(--font-ui); }
  .ust-menu a:hover{ background:var(--blue-50); }
}

/* Görünüm seçici: hangisinin seçili olduğu hep görünür */
.tema-secici{ display:grid; gap:8px; padding:6px 10px 4px; }
.tema-baslik{ font:600 12px var(--font-ui); letter-spacing:.1em; text-transform:uppercase; color:var(--ink-soft); }
.tema-secenekler{ display:grid; grid-template-columns:repeat(3, 1fr); gap:4px; padding:4px; border:1px solid var(--line); border-radius:12px; background:var(--sayfa); }
.tema-secenekler button{ display:flex; flex-direction:column; align-items:center; gap:4px; padding:8px 4px; border:0; border-radius:9px; background:none; color:var(--ink-soft); font:600 12.5px var(--font-ui); cursor:pointer; }
.tema-secenekler svg{ width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.tema-secenekler button:hover{ color:var(--ink); }
.tema-secenekler button[aria-pressed="true"]{ background:var(--white); color:var(--ink); box-shadow:0 1px 3px rgba(20,22,16,.18); }
.tema-secenekler button:focus-visible{ outline:2px solid var(--kiremit); outline-offset:1px; }
.footer-dugme{ padding:0; border:0; background:none; color:var(--ink); font:400 14.5px var(--font-body); text-align:left; cursor:pointer; }
.footer-dugme:hover{ text-decoration:underline; }

/* ---------- Footer ---------- */
.site-footer{ border-top:1px solid var(--line); margin-top:60px; padding:40px 20px 30px; }
.footer-grid{ max-width:1080px; margin:0 auto; display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:28px; }
.footer-brand{ font-family:var(--font-display); font-weight:700; font-size:18px; color:var(--navy); }
.footer-not{ color:var(--ink-soft); font-size:14px; margin-top:8px; max-width:280px; }
.footer-baslik{ font-family:var(--font-ui); font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.08em; color:var(--ink-soft); margin-bottom:10px; }
.footer-links{ display:flex; flex-direction:column; gap:8px; }
.footer-links a{ text-decoration:none; color:var(--ink); font-size:14.5px; }
.footer-links a:hover{ text-decoration:underline; }
.footer-alt{ max-width:1080px; margin:30px auto 0; padding-top:18px; border-top:1px solid var(--line); font-size:13px; color:var(--ink-soft); display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px; }

/* ---------- Geri bildirim kutusu (her sayfada) ---------- */
.geri-bildirim-dugme{
  position:fixed; right:18px; bottom:18px; z-index:70;
  width:44px; height:44px; border-radius:999px; background:var(--white);
  border:1px solid var(--line); box-shadow:var(--shadow); cursor:pointer;
  display:flex; align-items:center; justify-content:center; color:var(--ink-soft);
}
.geri-bildirim-dugme:hover{ color:var(--ink); }

/* =========================================================
   ANA SAYFA BÖLÜMLERİ
   ========================================================= */

.bolum{ padding-top:64px; padding-bottom:64px; } /* yatay boşluk .container'dan gelsin */
.bolum + .bolum{ border-top:1px solid var(--line); }
.bolum-baslik{ text-align:center; max-width:640px; margin:0 auto 36px; }
.bolum-baslik .eyebrow{ margin-bottom:10px; }

/* Kaydırınca beliren bölümler (bölüm 8.2: yumuşak fade + 14px yukarı kayma) */
/* Yalnız JavaScript varken gizlenir (html.js, sablon.php); yoksa içerik hep görünür */
.js .belir{ opacity:0; transform:translateY(16px); transition:opacity .6s var(--egri), transform .6s var(--egri); }
.js .belir.gorundu{ opacity:1; transform:translateY(0); }
@media (prefers-reduced-motion: reduce){ .belir{ opacity:1; transform:none; transition:none; } }

/* ---------- Açılış ----------
   Sol: başlık ve davet. Sağ: son Ütopya kapağı (sitenin tek görseli), altında müze etiketi gibi
   tek satır. Kapak sayfa açılınca bir kez yerine oturur; ana sayfanın tek hareketli anı bu. */
.giris{ display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr); gap:56px; align-items:center; padding-top:72px; padding-bottom:84px; }
.katalog-etiket{ display:flex; flex-wrap:wrap; gap:6px 18px; margin:0 0 22px; font:700 11.5px ui-monospace,'Cascadia Mono','Courier New',monospace; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-soft); }
.katalog-etiket span + span{ color:var(--kiremit); }
.giris h1{ font-size:clamp(38px, 5.4vw, 62px); line-height:1.05; letter-spacing:-.02em; margin:0 0 20px; max-width:15ch; }
.giris-alt{ font-size:18.5px; line-height:1.65; color:var(--ink-soft); max-width:50ch; margin:0 0 30px; }
.giris-eylemler{ display:flex; align-items:center; gap:22px; flex-wrap:wrap; }
.giris-ikincil{ font:600 15px var(--font-ui); color:var(--ink); text-decoration:none; border-bottom:1px solid var(--line); padding-bottom:2px; transition:border-color var(--sure-hizli) var(--egri); }
.giris-ikincil:hover{ border-color:var(--kiremit); }
.giris-ikincil span{ display:inline-block; transition:transform var(--sure-hizli) var(--egri); }
.giris-ikincil:hover span{ transform:translateX(3px); }

.giris-sahne{ position:relative; justify-self:center; width:min(360px, 100%); margin:0; }
.giris-kapak{ display:block; aspect-ratio:3/4; border-radius:3px; overflow:hidden; background:var(--zeytin-800); transform:rotate(1.2deg);
  box-shadow:-1px 0 0 rgba(0,0,0,.08), 0 2px 4px rgba(20,22,16,.12), 0 30px 50px -28px rgba(20,22,16,.55); transition:transform .35s var(--egri); }
.giris-kapak:hover{ transform:rotate(0deg) translateY(-3px); }
.giris-kapak img{ width:100%; height:100%; object-fit:cover; }
/* Kitabın sırtına düşen ince gölge: kapak bir yüzey değil bir kitap gibi dursun */
.giris-kapak::before{ content:""; position:absolute; inset:0 auto 0 0; width:10px; background:linear-gradient(90deg, rgba(0,0,0,.18), transparent); z-index:1; }
.giris-kapak{ position:relative; }

/* Müze etiketi: kapağın altında sayı ve tema */
.giris-etiket{ display:flex; flex-direction:column; gap:2px; margin-top:18px; padding-left:2px; font:700 11px ui-monospace,'Cascadia Mono','Courier New',monospace; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-soft); }
.giris-etiket span + span{ font:500 14px var(--font-display); letter-spacing:0; text-transform:none; color:var(--ink); }
.giris.tek{ grid-template-columns:1fr; max-width:820px; }
.js .giris-kapak{ animation:kapakOtur .9s var(--egri) .1s backwards; }
@keyframes kapakOtur{ from{ opacity:0; transform:translateY(18px) rotate(2.5deg); } to{ opacity:1; transform:rotate(1.2deg); } }

/* ---------- Tanıtım ve üyelerin anlatımları ---------- */
.tanitim{ display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:56px; max-width:1000px; margin:0 auto; align-items:start; }
.tanitim-baslik{ padding-top:6px; }
.tanitim-baslik .eyebrow{ display:block; margin-bottom:10px; color:var(--kiremit); }
.tanitim-baslik h2{ font-size:clamp(30px, 3.8vw, 42px); line-height:1.12; margin:0 0 20px; }
.tanitim-metin p{ font-size:18.5px; line-height:1.75; margin:0 0 1.1em; color:var(--ink); }
.tanitim-metin p:last-child{ margin-bottom:0; }
.tanitim-imza{ margin:22px 0 0 !important; font:italic 500 26px/1.2 var(--font-display) !important; color:var(--kiremit-koyu) !important; }
.tanitim-imza::before{ content:"— "; }

.anlatimlar-baslik{ text-align:center; margin:84px auto 30px; }
.anlatimlar-baslik .eyebrow{ display:block; margin-bottom:10px; }
.anlatimlar-baslik h2{ margin:0; }
.anlatimlar{ columns:2 340px; column-gap:22px; max-width:1000px; margin:0 auto; }
.anlatim{ break-inside:avoid; margin:0 0 22px; padding:26px 26px 22px; background:var(--white); border:1px solid var(--line); border-radius:var(--radius); }
.anlatim blockquote{ margin:0; }
.anlatim-soz{ position:relative; margin:0 0 14px; padding-top:22px; font:500 21px/1.45 var(--font-display); color:var(--ink); }
.anlatim-soz::before{ content:"\201C"; position:absolute; top:-14px; left:-4px; font:700 56px/1 var(--font-display); color:var(--kiremit); opacity:.85; }
.anlatim-uzun, .anlatim-devam p{ margin:0 0 .8em; font-size:16px; line-height:1.7; color:var(--ink-soft); }
.anlatim-devam summary{ list-style:none; cursor:pointer; font-size:16px; line-height:1.7; color:var(--ink-soft); margin-bottom:.8em; }
.anlatim-devam summary::-webkit-details-marker{ display:none; }
.anlatim-ac{ font:700 13.5px var(--font-ui); color:var(--kiremit-koyu); white-space:nowrap; }
.anlatim-devam[open] summary{ display:none; }
.anlatim figcaption{ display:flex; align-items:center; gap:12px; margin-top:16px; padding-top:16px; border-top:1px solid var(--line); font-family:var(--font-ui); }
.anlatim-harf{ flex:none; display:inline-flex; align-items:center; justify-content:center; width:38px; height:38px; border-radius:50%; background:color-mix(in srgb, var(--kiremit) 14%, transparent); color:var(--kiremit-koyu); font:700 15px var(--font-display); }
.anlatim figcaption b{ display:block; font-size:14.5px; color:var(--ink); }
.anlatim figcaption small{ display:block; font-size:13px; line-height:1.45; color:var(--ink-soft); }

/* ---------- Hikaye baloncukları ---------- */
.hikaye-akis{ max-width:620px; margin:0 auto; display:flex; flex-direction:column; gap:14px; }
.baloncuk{
  max-width:78%; padding:13px 17px; border-radius:18px; font-size:15.5px; line-height:1.5;
  background:var(--white); border:1px solid var(--line); align-self:flex-start;
}
.baloncuk.sag{ align-self:flex-end; border-bottom-right-radius:4px; }
.baloncuk.sol{ border-bottom-left-radius:4px; }
.baloncuk-kim{ font-family:var(--font-ui); font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.06em; margin-bottom:4px; display:block; }
.baloncuk.bengisu{ border-left:3px solid var(--bengisu); }
.baloncuk.benginaz{ border-left:3px solid var(--benginaz); }
.baloncuk.bengican{ border-left:3px solid var(--bengican); }

.zaman-cizelgesi{ max-width:680px; margin:44px auto 0; display:flex; flex-direction:column; gap:0; }
.tc-satir{ display:grid; grid-template-columns:96px 24px 1fr; padding:16px 0; }
.tc-etiket{ font-family:var(--font-ui); font-weight:700; color:var(--kiremit-koyu); font-size:13px; text-align:right; padding-top:2px; overflow-wrap:anywhere; }
.tc-cizgi{ position:relative; display:flex; justify-content:center; }
.tc-cizgi::before{ content:""; position:absolute; top:0; bottom:0; width:2px; background:var(--line); }
.tc-satir:first-child .tc-cizgi::before{ top:18px; }
.tc-satir:last-child .tc-cizgi::before{ bottom:auto; height:18px; }
.tc-cizgi::after{ content:""; position:absolute; top:8px; width:10px; height:10px; border-radius:999px; background:var(--kiremit); }
.tc-baslik{ font-weight:700; margin-bottom:2px; }
.tc-metin{ color:var(--ink-soft); font-size:14.5px; margin:0; }

/* ---------- Kart grid genel (dergi/arşiv) ---------- */
.kart-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:18px; }
.icerik-kart{ background:var(--white); border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; text-decoration:none; color:var(--ink); display:flex; flex-direction:column; transition:box-shadow var(--sure-hizli) var(--egri); }
.icerik-kart:hover{ box-shadow:var(--shadow); }
.icerik-kart .kapak{ aspect-ratio:16/10; background:var(--blue-50); overflow:hidden; }
.icerik-kart .kapak img{ width:100%; height:100%; object-fit:cover; }
.icerik-kart .govde{ padding:16px; flex:1; display:flex; flex-direction:column; gap:6px; }
.icerik-kart h3{ font-size:16px; margin:0; }
.icerik-kart .ozet{ font-size:13.5px; color:var(--ink-soft); margin:0; }
.icerik-kart .meta{ font-family:var(--font-ui); font-size:12px; color:var(--ink-soft); margin-top:auto; }
.bolum-alt-link{ text-align:center; margin-top:28px; }

/* ---------- Dinle, izle: kartlar doğrudan YouTube'a / podcast sayfasına gider ---------- */
.dinle-izle{ text-decoration:none; color:inherit; }
.dinle-izle .govde{ display:flex; flex-direction:column; gap:6px; }
.dinle-izle .eyebrow{ color:var(--kiremit); font-size:11px; }
.di-kapak{ position:relative; display:block; overflow:hidden; background:var(--zeytin-800); }
.di-video{ aspect-ratio:16/9; }
.di-podcast{ aspect-ratio:16/9; }
.di-kapak img{ width:100%; height:100%; object-fit:cover; transition:transform .4s var(--egri); }
.dinle-izle:hover .di-kapak img{ transform:scale(1.03); }
.di-oynat{ position:absolute; left:14px; bottom:14px; width:42px; height:42px; border-radius:50%; background:rgba(255,255,255,.92); box-shadow:0 4px 12px rgba(0,0,0,.25); }
.di-oynat::after{ content:""; position:absolute; left:16px; top:13px; border-style:solid; border-width:8px 0 8px 13px; border-color:transparent transparent transparent #262A1D; }
.dinle-izle .meta{ color:var(--kiremit-koyu); font-weight:600; }
.di-dalga{ display:flex; align-items:center; gap:3px; height:72px; padding:0 18px; background:color-mix(in srgb, var(--kiremit) 9%, var(--white)); border-bottom:1px solid var(--line); }
.di-dalga i{ flex:1; min-height:4px; border-radius:2px; background:var(--kiremit); opacity:.55; }
.dinle-izle:hover .di-dalga i{ opacity:.8; }
.dinle-izle:hover h3{ color:var(--kiremit-koyu); }
@media (prefers-reduced-motion: reduce){ .di-kapak img{ transition:none; } }

/* ---------- Etkinlik / duyuru ---------- */
.liste-kutu{ display:flex; flex-direction:column; gap:12px; max-width:680px; margin:0 auto; }
.satir-kart{ background:var(--white); border:1px solid var(--line); border-radius:var(--radius-sm); padding:16px 18px; }
.satir-kart h3{ font-size:16px; margin-bottom:4px; }
.satir-kart .meta{ font-family:var(--font-ui); font-size:12.5px; color:var(--ink-soft); }
.bos-metin{ text-align:center; color:var(--ink-soft); padding:30px 0; }

/* ---------- Üye cümleleri şeridi ---------- */
.soz-seridi{ display:flex; gap:16px; overflow-x:auto; padding:6px 20px 16px; scroll-snap-type:x proximity; }
.soz-kart{ flex:0 0 auto; width:260px; background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:18px; scroll-snap-align:start; }
.soz-kart p{ font-style:italic; font-size:15px; margin-bottom:10px; }
.soz-kart .kim{ font-family:var(--font-ui); font-size:12.5px; color:var(--ink-soft); font-style:normal; }

/* ---------- Sosyal medya ---------- */
.bolum-bas-satir{ display:flex; justify-content:space-between; align-items:flex-end; gap:16px; flex-wrap:wrap; margin:0 0 24px; }
.bolum-bas-satir .eyebrow{ display:block; margin-bottom:8px; color:var(--kiremit); }
.bolum-bas-satir h2{ margin:0; }
.bolum-bas-link{ font:600 14.5px var(--font-ui); color:var(--ink); text-decoration:none; border-bottom:1px solid var(--line); padding-bottom:2px; white-space:nowrap; }
.bolum-bas-link:hover{ border-color:var(--kiremit); color:var(--kiremit-koyu); }

/* ---------- Bizi takip et: resmî logolarla hesaplar ---------- */
.takip{ margin-top:44px; padding-top:28px; border-top:1px solid var(--line); }
.takip-baslik{ margin:0 0 14px; font:700 11.5px var(--font-ui); letter-spacing:.14em; text-transform:uppercase; color:var(--ink-soft); }
.takip-izgara{ display:grid; grid-template-columns:repeat(auto-fit, minmax(220px, 1fr)); gap:12px; }
.takip-hesap{ display:flex; align-items:center; gap:14px; padding:14px 16px; border:1px solid var(--line); border-radius:var(--radius); background:var(--white); text-decoration:none; color:var(--ink); transition:border-color var(--sure-hizli) var(--egri), transform var(--sure-hizli) var(--egri); }
.takip-hesap:hover{ border-color:var(--adaci-400); transform:translateY(-1px); }
.takip-logo{ flex:none; display:inline-flex; width:40px; height:40px; align-items:center; justify-content:center; }
.takip-logo svg{ width:36px; height:36px; display:block; }
.takip-logo svg[viewBox="0 0 28 20"]{ width:38px; height:27px; }
.takip-metin{ min-width:0; flex:1; }
.takip-metin b{ display:block; font:700 15px var(--font-ui); }
.takip-metin small{ display:block; font:13px var(--font-ui); color:var(--ink-soft); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.takip-ok{ color:var(--ink-soft); font-size:15px; transition:color var(--sure-hizli); }
.takip-hesap:hover .takip-ok{ color:var(--kiremit-koyu); }
@media (prefers-reduced-motion: reduce){ .takip-hesap{ transition:none; } }

/* ---------- Başvuru formu ---------- */
.basvuru-kutu{ max-width:560px; margin:0 auto; background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:32px; }
.basvuru-ilerleme{ height:4px; background:var(--line); border-radius:999px; margin-bottom:26px; overflow:hidden; }
.basvuru-ilerleme-ic{ height:100%; background:var(--kiremit); border-radius:999px; transition:width var(--sure) var(--egri); }
.basvuru-adim{ display:none; }
.basvuru-adim.aktif{ display:block; }
.basvuru-adim label{ display:flex; flex-direction:column; gap:6px; font-size:14px; margin-bottom:16px; }
.basvuru-adim input[type=text], .basvuru-adim input[type=email], .basvuru-adim textarea, .basvuru-adim select{
  padding:12px 14px; border-radius:10px; border:1px solid var(--line); font-size:15px; background:var(--sayfa);
}
.hobi-secim-grid{ display:flex; flex-wrap:wrap; gap:8px; }
.hobi-secim-cip{ padding:9px 15px; border-radius:999px; border:1px solid var(--line); background:var(--sayfa); cursor:pointer; font-size:13.5px; font-family:var(--font-ui); }
.hobi-secim-cip.secili{ background:var(--zeytin-700); color:#fff; border-color:var(--zeytin-700); }
.basvuru-nav{ display:flex; justify-content:space-between; gap:10px; margin-top:10px; }
.basvuru-sonuc{ text-align:center; }

/* Mühür/damga: üye platformunun kendi malzeme dilinden (animasyon.css'teki
   not: "konfeti kütüphane temasına yabancı"). Confetti yerine bunu
   kullanıyoruz, hem başvuru sonucunda hem sertifika doğrulamasında. */
.damga{
  display:inline-flex; align-items:center; justify-content:center;
  width:84px; height:84px; margin:0 auto 18px; border:3px solid var(--kiremit);
  border-radius:47% 53% 51% 49%; color:var(--kiremit); background:transparent;
  font-family:ui-monospace,'Cascadia Mono','Courier New',monospace;
  font-size:12px; font-weight:700; letter-spacing:.04em; text-transform:uppercase;
  transform:scale(1.6) rotate(-16deg); opacity:0;
  animation:damgaBas .45s cubic-bezier(.34,1.56,.64,1) .1s forwards;
}
@keyframes damgaBas{
  0%{ opacity:0; transform:scale(1.6) rotate(-16deg); }
  60%{ opacity:.9; transform:scale(.96) rotate(4deg); }
  100%{ opacity:1; transform:scale(1) rotate(-6deg); }
}
@media (prefers-reduced-motion: reduce){ .damga{ animation:none; opacity:1; transform:rotate(-6deg); } }

/* ---------- Mobil ---------- */
@media (max-width:600px){
  .container{ padding:0 16px; }
  .site-header{ padding:12px 14px; gap:8px; }
  .marka-metin{ font-size:16px; }
  .marka img{ width:28px; height:28px; }
  .header-sag .btn{ padding:9px 14px; font-size:13.5px; white-space:nowrap; }
  .ucnokta-dugme{ width:36px; height:36px; flex:0 0 auto; }
  .bolum{ padding-top:48px; padding-bottom:48px; }
  .tc-satir{ grid-template-columns:74px 20px 1fr; }
  .tc-etiket{ font-size:11.5px; }
  .basvuru-kutu{ padding:22px; }
}

/* ---------- Erişilebilirlik: dokunma hedefleri en az 44px (bölüm 8.4) ---------- */
@media (hover: none) and (pointer: coarse){
  .btn.small, .hobi-secim-cip, .cekmece-link, .footer-links a, .footer-dugme{ min-height:44px; display:inline-flex; align-items:center; }
  .btn.small{ padding-top:12px; padding-bottom:12px; }
}

/* ---------- Dergi Ütopya: son sayı ve içindekiler ---------- */
.dergi-blok{ display:grid; grid-template-columns:minmax(0,320px) minmax(0,1fr); gap:56px; align-items:center; max-width:960px; margin:0 auto; }
.dergi-blok.kapaksiz{ grid-template-columns:1fr; max-width:680px; }
.dergi-kapak{ position:relative; display:block; aspect-ratio:3/4; border-radius:3px; overflow:hidden; background:var(--zeytin-800); box-shadow:0 2px 4px rgba(20,22,16,.12), 0 26px 44px -26px rgba(20,22,16,.55); }
.dergi-kapak::before{ content:""; position:absolute; inset:0 auto 0 0; width:10px; background:linear-gradient(90deg, rgba(0,0,0,.18), transparent); }
.dergi-kapak img{ width:100%; height:100%; object-fit:cover; }
.dergi-metin .eyebrow{ display:block; margin-bottom:12px; color:var(--kiremit); }
.dergi-metin h2{ font-size:clamp(32px, 4.4vw, 48px); line-height:1.08; margin:0 0 14px; }
.dergi-no{ display:block; font:700 13px ui-monospace,'Cascadia Mono','Courier New',monospace; letter-spacing:.12em; text-transform:uppercase; color:var(--ink-soft); margin-bottom:8px; }
.dergi-ozet{ color:var(--ink-soft); font-size:17px; line-height:1.65; margin:0 0 24px; max-width:56ch; }
.icindekiler-baslik{ font:700 11.5px var(--font-ui); letter-spacing:.14em; text-transform:uppercase; color:var(--ink-soft); margin:0 0 6px; }
.icindekiler{ list-style:none; margin:0 0 26px; padding:0; border-top:1px solid var(--line); }
.icindekiler li{ border-bottom:1px solid var(--line); }
.icindekiler a{ display:flex; align-items:baseline; gap:10px; padding:12px 0; text-decoration:none; color:var(--ink); }
.ic-baslik{ font-family:var(--font-display); font-size:18px; min-width:0; }
.ic-nokta{ flex:1; min-width:24px; border-bottom:1px dotted var(--adaci-400); transform:translateY(-4px); }
.ic-yazar{ font:500 14px var(--font-ui); color:var(--ink-soft); white-space:nowrap; }
.icindekiler a:hover .ic-baslik{ color:var(--kiremit-koyu); }
.dergi-eylem{ display:flex; gap:10px; flex-wrap:wrap; }

/* ---------- Ana sayfanın sonu: koyu davet bandı ---------- */
.davet{ background:var(--zeytin-800); color:#F4EEDC; padding:88px 0; margin-top:24px; }
.davet-ic{ display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr); gap:64px; align-items:center; }
.davet .eyebrow{ display:block; margin-bottom:12px; color:#E09470; }
.davet h2{ color:#F4EEDC; font-size:clamp(32px, 4.4vw, 50px); line-height:1.08; letter-spacing:-.015em; margin:0 0 16px; max-width:17ch; }
.davet-sol p{ color:rgba(244,238,220,.78); font-size:18px; line-height:1.65; margin:0 0 28px; max-width:44ch; }
.davet-dugme{ background:#F4EEDC !important; color:#262A1D !important; }
.davet-dugme:hover{ background:#fff !important; }
.davet-dugme span{ display:inline-block; transition:transform var(--sure-hizli) var(--egri); }
.davet-dugme:hover span{ transform:translateX(3px); }
.davet-sol small{ display:block; margin-top:14px; font:13px var(--font-ui); color:rgba(244,238,220,.6); }
.davet-adimlar{ list-style:none; counter-reset:adim; margin:0; padding:0; border-left:1px solid rgba(244,238,220,.18); }
.davet-adimlar li{ counter-increment:adim; position:relative; padding:0 0 30px 44px; }
.davet-adimlar li:last-child{ padding-bottom:0; }
.davet-adimlar li::before{ content:counter(adim); position:absolute; left:-17px; top:-4px; width:34px; height:34px; border-radius:50%; background:var(--zeytin-800); border:1px solid rgba(244,238,220,.35); color:#E09470; display:flex; align-items:center; justify-content:center; font:700 14px var(--font-ui); }
.davet-adimlar b{ display:block; font:600 20px/1.3 var(--font-display); color:#F4EEDC; margin-bottom:4px; }
.davet-adimlar span{ display:block; font:15px/1.6 var(--font-ui); color:rgba(244,238,220,.7); }
:root[data-tema="karanlik"] .davet{ background:#242619; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
:root[data-tema="karanlik"] .davet-adimlar li::before{ background:#242619; }

/* Arşiv: kapaksız kart kapaklı komşusunun boyuna uzamasın; sayfalama sığmazsa alt satıra geçsin */
.arsiv-grid{ align-items:start; }
.sayfalama{ display:flex; flex-wrap:wrap; justify-content:center; gap:8px; margin-top:32px; }
.sayfalama span{ align-self:center; color:var(--ink-soft); }
.gizli-baslik{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }

/* ---------- Gizlilik sayfası ---------- */
.gizlilik-metni{ max-width:720px; margin:0 auto; color:var(--ink); }
.gizlilik-metni h2{ font-size:22px; margin-top:1.6em; }
.kvkk-tablo{ overflow-x:auto; margin:0 0 1.2em; border:1px solid var(--line); border-radius:var(--radius); }
.kvkk-tablo table{ width:100%; min-width:560px; border-collapse:collapse; font-family:var(--font-ui); font-size:14px; line-height:1.45; }
.kvkk-tablo th, .kvkk-tablo td{ text-align:left; vertical-align:top; padding:10px 12px; border-bottom:1px solid var(--line); }
.kvkk-tablo tr:last-child td{ border-bottom:0; }
.kvkk-tablo th{ font-size:11.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-soft); background:var(--sayfa); }

/* ---------- Dijital arşiv: dört raf (arsiv.php) ---------- */
.ar-sayfa{ padding-top:50px; }
.ar-sekmeler{ display:flex; flex-wrap:wrap; justify-content:center; gap:6px; margin:0 auto 18px; }
.ar-sekmeler a{ padding:8px 16px; border-radius:999px; border:1px solid var(--line); color:var(--ink); text-decoration:none; font:600 14px var(--font-ui); background:var(--white); }
.ar-sekmeler a:hover{ border-color:var(--zeytin-600); }
.ar-sekmeler a[aria-current="page"]{ background:var(--navy); border-color:var(--navy); color:var(--sayfa); }
.ar-ara{ max-width:560px; margin:0 auto 34px; display:flex; gap:8px; }
.ar-ara input{ flex:1; min-width:0; padding:10px 16px; border-radius:999px; border:1px solid var(--line); background:var(--white); color:var(--ink); font:400 15px var(--font-ui); }
.ar-not{ text-align:center; margin:-18px 0 24px; font:400 14px var(--font-ui); color:var(--ink-soft); }
.ar-raf{ margin-bottom:46px; }
.ar-raf-bas{ display:flex; justify-content:space-between; align-items:flex-end; gap:16px; flex-wrap:wrap; padding-bottom:10px; margin-bottom:18px; border-bottom:1px solid var(--line); }
.ar-raf-bas h2{ font-size:24px; margin:0; }
.ar-raf-bas p{ margin:2px 0 0; font:400 14px var(--font-ui); color:var(--ink-soft); }
.ar-raf-bas a{ font:600 14px var(--font-ui); text-decoration:none; color:var(--blue); white-space:nowrap; }
.ar-meta{ font:400 12.5px var(--font-ui); color:var(--ink-soft); }
.ar-baslik{ font:600 16.5px/1.35 var(--font-display); color:var(--navy); }
.ar-ozet{ font:400 14px/1.55 var(--font-body); color:var(--ink-soft); }

/* Dergi sayıları: kapak rafı */
.ar-izgara-sayi{ display:grid; grid-template-columns:repeat(auto-fill, minmax(150px, 1fr)); gap:22px 18px; align-items:start; }
.ar-sayi{ display:flex; flex-direction:column; gap:6px; text-decoration:none; color:inherit; }
.ar-kapak{ display:block; aspect-ratio:3/4; border-radius:3px; overflow:hidden; background:var(--zeytin-800, #3E4230); box-shadow:0 1px 0 var(--line), 0 12px 22px -16px rgba(20,22,16,.6); transition:transform .25s var(--egri); }
.ar-kapak img{ width:100%; height:100%; object-fit:cover; display:block; }
.ar-kapak-yazi{ display:flex; align-items:flex-end; height:100%; padding:14px; color:#F4F0E4; font:600 15px/1.25 var(--font-display); }
.ar-sayi:hover .ar-kapak{ transform:translateY(-4px); }
.ar-sayi-ad{ font:600 14.5px/1.35 var(--font-display); color:var(--navy); }

/* Video: küçük resimli ızgara */
.ar-izgara-video{ display:grid; grid-template-columns:repeat(auto-fill, minmax(250px, 1fr)); gap:24px 20px; align-items:start; }
.ar-video{ display:flex; flex-direction:column; gap:7px; text-decoration:none; color:inherit; }
.ar-kucuk-resim{ position:relative; display:block; aspect-ratio:16/9; border-radius:8px; overflow:hidden; background:var(--blue-50); }
.ar-kucuk-resim img{ width:100%; height:100%; object-fit:cover; display:block; }
.ar-oynat{ position:absolute; left:12px; bottom:12px; width:38px; height:38px; border-radius:50%; background:rgba(255,255,255,.92); }
.ar-oynat::after{ content:""; position:absolute; left:15px; top:12px; border-left:12px solid #262A1D; border-top:7px solid transparent; border-bottom:7px solid transparent; }
.ar-video .ar-ozet{ display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }

/* Yazılar ve podcast: liste */
.ar-liste{ display:grid; border-top:1px solid var(--line); }
.ar-satir{ display:grid; grid-template-columns:auto 1fr; gap:16px; padding:16px 4px; border-bottom:1px solid var(--line); text-decoration:none; color:inherit; }
.ar-satir:hover .ar-baslik{ text-decoration:underline; text-underline-offset:3px; }
.ar-satir-govde{ display:grid; gap:4px; min-width:0; }
.ar-satir-isaret{ width:34px; height:34px; border-radius:50%; margin-top:2px; border:1px solid var(--line); background:var(--white); position:relative; }
.ar-yazi .ar-satir-isaret::after{ content:""; position:absolute; inset:10px 9px; border-top:2px solid var(--ink-soft); border-bottom:2px solid var(--ink-soft); }
.ar-podcast .ar-satir-isaret::after{ content:""; position:absolute; left:13px; top:10px; border-left:10px solid var(--ink-soft); border-top:6px solid transparent; border-bottom:6px solid transparent; }
.ar-karisik .ar-satir{ border-bottom:0; padding-top:4px; }
.ar-karisik-satir{ border-bottom:1px solid var(--line); padding-top:12px; }
.ar-tur-etiket{ display:inline-block; margin-left:54px; font:700 11px var(--font-ui); letter-spacing:.1em; text-transform:uppercase; color:var(--ink-soft); }
@media (max-width:560px){
  .ar-izgara-sayi{ grid-template-columns:repeat(2, minmax(0,1fr)); gap:18px 14px; }
  .ar-sekmeler{ justify-content:flex-start; flex-wrap:nowrap; overflow-x:auto; padding-bottom:4px; margin-inline:-4px; }
  .ar-sekmeler a{ white-space:nowrap; }
}
@media (prefers-reduced-motion: reduce){ .ar-kapak{ transition:none; } }

/* ---- SSS: konulara ayrılmış, sakin bir liste ---- */
.sss-sayfa{ padding-top:50px; }
.sss-duzen{ max-width:960px; margin:0 auto; display:grid; grid-template-columns:200px 1fr; gap:48px; align-items:start; }
.sss-duzen.tek{ grid-template-columns:1fr; max-width:720px; }
.sss-konular{ position:sticky; top:96px; display:flex; flex-direction:column; gap:2px; font-family:var(--font-ui); font-size:14px; }
.sss-konular a{ display:flex; justify-content:space-between; gap:10px; padding:8px 12px; border-radius:var(--radius-sm); color:var(--ink-soft); text-decoration:none; transition:background var(--sure-hizli) var(--egri), color var(--sure-hizli) var(--egri); }
.sss-konular a span{ color:color-mix(in srgb, var(--ink-soft) 55%, transparent); font-variant-numeric:tabular-nums; transition:color var(--sure-hizli); }
.sss-konular a:hover, .sss-konular a.etkin{ background:color-mix(in srgb, var(--ink) 6%, transparent); color:var(--ink); }
.sss-konular a.etkin span{ color:var(--kiremit); }
.sss-grup{ scroll-margin-top:96px; margin-bottom:40px; }
.sss-grup h2{ font-family:var(--font-ui); font-size:12px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--kiremit); margin:0 0 6px; }
.sss-soru{ border-bottom:1px solid var(--line); }
.sss-soru summary{ list-style:none; display:flex; align-items:center; justify-content:space-between; gap:18px; padding:18px 0; cursor:pointer; font-family:var(--font-display); font-size:19px; line-height:1.35; color:var(--ink); }
.sss-soru summary::-webkit-details-marker{ display:none; }
.sss-soru summary:focus-visible{ outline:2px solid var(--kiremit); outline-offset:4px; border-radius:4px; }
.sss-soru summary:hover span{ color:var(--kiremit-koyu); }
/* Artı işareti: açılınca dikey çizgi yatar, eksiye döner */
.sss-soru summary i{ position:relative; flex:none; width:14px; height:14px; }
.sss-soru summary i::before, .sss-soru summary i::after{ content:""; position:absolute; left:0; top:6px; width:14px; height:2px; border-radius:2px; background:var(--ink-soft); transition:transform var(--sure) var(--egri), background var(--sure-hizli); }
.sss-soru summary i::after{ transform:rotate(90deg); }
.sss-soru[open] summary i::after{ transform:rotate(0deg); }
.sss-soru[open] summary i::before, .sss-soru[open] summary i::after{ background:var(--kiremit); }
.sss-cevap{ padding:0 34px 20px 0; color:var(--ink-soft); font-size:17px; line-height:1.65; }
.sss-cevap p{ margin:0 0 .7em; }
.sss-cevap p:last-child{ margin-bottom:0; }
.sss-cevap a{ color:var(--kiremit-koyu); }
.sss-son{ margin-top:8px; color:var(--ink-soft); font-family:var(--font-ui); font-size:15px; }
.sss-son a{ color:var(--kiremit-koyu); font-weight:600; }
/* Açılırken yumuşakça uzasın (destekleyen tarayıcılarda; diğerlerinde anında açılır) */
@supports (interpolate-size: allow-keywords){
  .sss-soru{ interpolate-size:allow-keywords; }
  .sss-soru::details-content{ height:0; overflow:clip; opacity:0; transition:height var(--sure) var(--egri), opacity var(--sure) var(--egri), content-visibility var(--sure) allow-discrete; }
  .sss-soru[open]::details-content{ height:auto; opacity:1; }
}
@media (max-width:820px){
  .sss-duzen{ grid-template-columns:1fr; gap:20px; }
  .sss-konular{ position:static; flex-direction:row; flex-wrap:wrap; gap:6px; }
  .sss-konular a{ padding:6px 12px; border:1px solid var(--line); border-radius:999px; }
  .sss-soru summary{ font-size:17px; padding:16px 0; }
  .sss-cevap{ padding-right:0; font-size:16px; }
}
@media (prefers-reduced-motion:reduce){
  .sss-soru::details-content, .sss-soru summary i::before, .sss-soru summary i::after{ transition:none; }
}

@media (max-width:860px) and (min-width:601px){
  .giris{ grid-template-columns:1fr; gap:40px; }
  .giris-sahne{ width:min(320px, 70%); }
  .dergi-blok{ grid-template-columns:minmax(0,240px) minmax(0,1fr); gap:32px; }
}
@media (prefers-reduced-motion: reduce){
  .js .giris-kapak{ animation:none; }
  .giris-kapak{ transition:none; }
}

/* Ana sayfa, telefon (temel kurallardan sonra gelmeli) */
@media (max-width:600px){
  .giris{ grid-template-columns:1fr; gap:36px; padding-top:40px; padding-bottom:56px; }
  .giris-sahne{ width:min(280px, 80%); }
  .tanitim{ grid-template-columns:1fr; gap:22px; }
  .tanitim-metin p{ font-size:17px; }
  .anlatimlar-baslik{ margin-top:56px; }
  .anlatim{ padding:22px 20px 18px; }
  .dergi-blok{ grid-template-columns:1fr; gap:28px; }
  .dergi-kapak{ width:min(240px, 70%); }
  .davet{ padding:60px 0; }
  .davet-ic{ grid-template-columns:1fr; gap:40px; }
  .davet-adimlar{ margin-left:17px; }
}