/* ============================================================
   HEKİM BLOG (2026-10-29, üçüncü tasarım)
   Kullanıcı: "kütüphane gibi değil, daha dinamik, daha slick, Hekim havasına uygun".
   Tanıtım sitesinin (landing.html) dilini taşır: glif yağmuru + girih zemini,
   HUD çubuğu ve okuma ilerleme çizgisi, VT323 terminal etiketleri, Georgia başlıklar,
   terminal pencereli kartlar. Tür rengi bilgi taşır: kavram altın, hikâye turkuaz.
   Hareket: kartlar bir kez belirir, öne çıkan yazının cümlesi terminalde yazılır;
   "hareketi azalt" tercihinde hepsi durur.
   ============================================================ */
@font-face{font-family:'Inter';font-style:normal;font-weight:100 900;font-display:swap;
  src:url('/static/fonts/inter-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+2000-206F,U+20AC,U+2122,U+2212}
@font-face{font-family:'Inter';font-style:normal;font-weight:100 900;font-display:swap;
  src:url('/static/fonts/inter-latin-ext.woff2') format('woff2');
  unicode-range:U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'VT323';font-style:normal;font-weight:400;font-display:swap;
  src:url('/static/fonts/vt323.woff2') format('woff2')}

:root{
  color-scheme:dark;
  --void:#0b1018; --deep:#0f1722; --panel:#18222e; --panel-2:#1d2836;
  --edge:#324358; --ink:#e7eef6; --ink-soft:#aab8c9; --ink-dim:#708296;
  --gold:#e0b15c; --gold-bright:#f0cd86; --teal:#6fcfc2; --parch:#e9dcb8; --rose:#e8617a;
  --serif:Georgia,'Times New Roman','Iowan Old Style',serif;
  --mono:'VT323','Courier New',monospace;
  --sans:"Segoe UI",system-ui,'Inter',sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{background:var(--void);color:var(--ink);font-family:var(--sans);font-size:16.5px;line-height:1.7;
  overflow-x:hidden;min-height:100vh}
a{color:inherit;text-decoration:none}
a:focus-visible,button:focus-visible,input:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:6px}
.tur-kavram{--tur:var(--gold);--tur-p:240,205,134} .tur-hikaye{--tur:var(--teal);--tur-p:111,207,194}
.wrap{max-width:1140px;margin:0 auto;padding:0 22px}

/* zemin katmanları (tanıtım sitesiyle aynı) */
.bg-base{position:fixed;inset:0;z-index:-3;
  background:radial-gradient(1100px 650px at 75% -10%,#152638 0%,var(--deep) 45%,var(--void) 100%)}
#rain{position:fixed;inset:0;z-index:-2;opacity:.12;pointer-events:none}
.yazi-sayfa #rain{opacity:.06}
.girih{position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='96' height='96' viewBox='0 0 96 96'%3E%3Cg fill='none' stroke='%23e0b15c' stroke-width='1'%3E%3Cpath d='M48 8 L59 37 L88 48 L59 59 L48 88 L37 59 L8 48 L37 37 Z'/%3E%3Ccircle cx='48' cy='48' r='14'/%3E%3C/g%3E%3C/svg%3E");
  background-size:96px 96px}

/* ---------- HUD çubuğu ---------- */
.hud{position:sticky;top:0;z-index:50;backdrop-filter:blur(14px) saturate(1.25);background:rgba(11,16,24,.62)}
.hud::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;
  background:linear-gradient(90deg,transparent,rgba(224,177,92,.55) 30%,rgba(111,207,194,.45) 70%,transparent)}
#ilerleme{position:absolute;left:0;bottom:0;height:2px;width:0;z-index:1;
  background:linear-gradient(90deg,var(--gold),var(--teal));box-shadow:0 0 10px rgba(224,177,92,.55)}
.hud-in{display:flex;align-items:center;gap:18px;height:54px}
.logo{display:flex;align-items:center;gap:9px;font-weight:700;letter-spacing:.4em;font-size:.92rem;color:var(--ink);margin-right:auto}
.logo svg{width:17px;height:26px;flex:none;fill:none;stroke:var(--gold);stroke-width:2.4;stroke-linecap:round;
  filter:drop-shadow(0 0 6px rgba(224,177,92,.5))}
.logo svg .wing{fill:rgba(224,177,92,.18);stroke-width:1.6}
.logo .bolum{font-family:var(--mono);font-weight:400;letter-spacing:.06em;font-size:1.15rem;color:var(--teal)}
.hud-links{display:flex;gap:4px}
.hud-links a{font-family:var(--mono);font-size:1.08rem;letter-spacing:.05em;color:var(--ink-dim);
  padding:.25rem .7rem;border:1px solid transparent;border-radius:6px;transition:.18s}
.hud-links a:hover,.hud-links a[aria-current]{color:var(--teal);border-color:rgba(111,207,194,.35);
  background:rgba(111,207,194,.06);text-shadow:0 0 9px rgba(111,207,194,.55)}
.cta{font-family:var(--mono);font-size:1.08rem;letter-spacing:.06em;white-space:nowrap;flex:none;
  padding:.28rem .95rem;border-radius:6px;color:var(--gold-bright);
  background:rgba(224,177,92,.08);border:1px solid rgba(224,177,92,.5);box-shadow:inset 0 0 14px rgba(224,177,92,.07);transition:.18s}
.cta::before{content:"▸ ";opacity:.8}
.cta:hover{background:rgba(224,177,92,.16);box-shadow:0 0 18px rgba(224,177,92,.35),inset 0 0 14px rgba(224,177,92,.1)}

/* ---------- liste: kahraman ---------- */
.kahraman{padding:64px 0 30px}
.komut{font-family:var(--mono);color:var(--teal);font-size:1.2rem;letter-spacing:.06em;margin-bottom:.8rem}
.imlec{display:inline-block;width:.55em;height:1.05em;background:var(--teal);vertical-align:-.18em;margin-left:3px;
  animation:yanip 1s steps(1) infinite}
@keyframes yanip{50%{opacity:0}}
.kahraman h1{font-family:var(--serif);font-weight:700;font-size:clamp(2.3rem,5.4vw,4rem);line-height:1.08;
  letter-spacing:.005em;max-width:15ch;text-wrap:balance}
.kahraman h1 em{font-style:italic;color:var(--gold-bright)}
.kahraman p{color:var(--ink-soft);font-size:1.08rem;max-width:36rem;margin-top:1.1rem}

/* süzgeç: arama + tür */
.suzgec{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin:34px 0 26px}
.ara{flex:1 1 280px;display:flex;align-items:center;gap:10px;max-width:440px;
  border:1px solid var(--edge);border-radius:10px;background:rgba(13,20,32,.75);padding:0 14px;transition:.18s}
.ara:focus-within{border-color:rgba(111,207,194,.6);box-shadow:0 0 0 3px rgba(111,207,194,.12)}
.ara span{font-family:var(--mono);font-size:1.25rem;color:var(--teal)}
.ara input{flex:1;min-width:0;background:none;border:0;color:var(--ink);font:inherit;font-size:16px;padding:11px 0}
.ara input:focus{outline:none}
.ara input::placeholder{color:var(--ink-dim)}
.turler{display:flex;gap:6px}
.turler a{font-family:var(--mono);font-size:1.1rem;letter-spacing:.04em;color:var(--ink-dim);padding:.38rem .9rem;
  border:1px solid var(--edge);border-radius:8px;transition:.18s}
.turler a:hover{color:var(--ink);border-color:rgba(231,238,246,.35)}
.turler a[aria-current]{color:#241a08;background:var(--gold-bright);border-color:var(--gold-bright)}
.turler a.tur-hikaye[aria-current]{background:var(--teal);border-color:var(--teal);color:#06201c}
.sayac{font-family:var(--mono);font-size:1.05rem;color:var(--ink-dim);margin-left:auto}

/* ---------- terminal pencereli kartlar ---------- */
.kartlar{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;padding-bottom:70px}
.kart{position:relative;display:flex;flex-direction:column;border-radius:14px;overflow:hidden;
  background:linear-gradient(180deg,rgba(29,40,54,.92),rgba(20,29,40,.92));
  border:1px solid rgba(50,67,88,.9);transition:transform .25s,border-color .25s,box-shadow .25s}
.kart:hover{transform:translateY(-4px);border-color:rgba(var(--tur-p),.6);
  box-shadow:0 18px 50px rgba(0,0,0,.45),0 0 26px rgba(var(--tur-p),.16)}
.pencere{display:flex;align-items:center;gap:6px;padding:9px 12px;background:#111a28;border-bottom:1px solid rgba(50,67,88,.7)}
.pencere i{width:8px;height:8px;border-radius:50%;background:#3a4a5e;flex:none}
.kart:hover .pencere i:nth-child(1){background:var(--rose)}
.kart:hover .pencere i:nth-child(2){background:var(--gold)}
.kart:hover .pencere i:nth-child(3){background:var(--teal)}
.pencere span{margin-left:6px;font-family:var(--mono);font-size:1rem;color:var(--ink-dim);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kart-ic{display:flex;flex-direction:column;gap:10px;padding:18px 20px 20px;flex:1}
.etiket{font-family:var(--mono);font-size:1.08rem;letter-spacing:.08em;color:var(--tur)}
.kart h2{font-family:var(--serif);font-weight:700;font-size:1.4rem;line-height:1.22;color:var(--ink);text-wrap:balance}
.kart h2 a::after{content:"";position:absolute;inset:0}
.kart p{color:var(--ink-soft);font-size:.97rem;line-height:1.6}
.kart .alt{margin-top:auto;padding-top:6px;display:flex;justify-content:space-between;
  font-family:var(--mono);font-size:1.02rem;color:var(--ink-dim)}
.kart .alt b{font-weight:400;color:var(--tur);opacity:0;transform:translateX(-6px);transition:.25s}
.kart:hover .alt b{opacity:1;transform:none}

/* öne çıkan: geniş terminal, cümle yazılır */
.kart.one{grid-column:1/-1;border-color:rgba(var(--tur-p),.45);
  box-shadow:0 26px 80px rgba(0,0,0,.5),0 0 30px rgba(var(--tur-p),.12)}
.kart.one .pencere i:nth-child(1){background:var(--rose)}
.kart.one .pencere i:nth-child(2){background:var(--gold)}
.kart.one .pencere i:nth-child(3){background:var(--teal)}
.kart.one .kart-ic{padding:30px 34px 32px;gap:14px}
.kart.one h2{font-size:clamp(1.9rem,3.6vw,2.8rem);line-height:1.1;max-width:24ch}
.kart.one p{font-family:var(--mono);font-size:1.35rem;line-height:1.45;color:#9fd8cd;max-width:52ch;min-height:2.9em}
.kart.one p::before{content:"> ";color:var(--tur)}
.bos{grid-column:1/-1;font-family:var(--mono);font-size:1.25rem;color:var(--ink-dim);padding:30px 0}

/* belirme (yalnız JS varsa; yoksa her şey görünür) */
html.js .rv{opacity:0;transform:translateY(14px);transition:opacity .55s ease,transform .55s ease}
html.js .rv.in{opacity:1;transform:none}

/* ---------- yazı ---------- */
.yazi{max-width:46rem;margin:0 auto;padding:40px 22px 30px}
.yol{font-family:var(--mono);font-size:1.15rem;color:var(--ink-dim);letter-spacing:.03em;margin-bottom:22px;
  overflow-wrap:anywhere}
.yol a{color:var(--teal)} .yol a:hover{text-shadow:0 0 9px rgba(111,207,194,.55)}
.kunye{display:flex;flex-wrap:wrap;gap:4px 16px;font-family:var(--mono);font-size:1.12rem;color:var(--ink-dim);letter-spacing:.03em}
.kunye .etiket{border:1px solid rgba(var(--tur-p),.5);border-radius:5px;padding:0 .5rem;background:rgba(var(--tur-p),.07)}
.yazi h1{font-family:var(--serif);font-weight:700;font-size:clamp(2.2rem,5.4vw,3.5rem);line-height:1.1;margin:14px 0 18px;text-wrap:balance}
.kanca{font-family:var(--serif);font-style:italic;font-size:clamp(1.2rem,2.3vw,1.4rem);line-height:1.5;color:var(--parch);
  padding-left:18px;border-left:2px solid var(--tur);text-wrap:pretty}
.yazar{font-family:var(--mono);font-size:1.08rem;color:var(--ink-dim);margin:22px 0 30px;padding-bottom:26px;
  border-bottom:1px solid rgba(50,67,88,.6)}
.metin p{font-size:1.06rem;line-height:1.8;color:#d6dee8;margin-bottom:1.2em;text-wrap:pretty}
.metin p:first-child::first-letter{float:left;font-family:var(--serif);font-weight:700;font-size:4.2em;line-height:.85;
  margin:.06em .12em 0 0;color:var(--tur);text-shadow:0 0 22px rgba(var(--tur-p),.35)}

.term{margin-top:30px;border:1px solid rgba(50,67,88,.9);border-radius:12px;overflow:hidden;background:#0d1420}
.term .pencere span{color:var(--ink-soft)}
.term-ic{padding:16px 18px 18px}
.term h2{font-family:var(--mono);font-weight:400;font-size:1.2rem;color:var(--teal);margin-bottom:10px;letter-spacing:.03em}
.term h2::before{content:"$ ";color:var(--gold)}
.term ol{padding-left:22px;font-size:.93rem;line-height:1.6;color:var(--ink-soft)}
.term li{margin-bottom:7px}
.term li::marker{font-family:var(--mono);color:var(--ink-dim)}
#atif-metni{font-size:.93rem;line-height:1.6;color:var(--ink-soft);overflow-wrap:anywhere;margin-bottom:14px}
.kopya{font-family:var(--mono);font-size:1.1rem;letter-spacing:.04em;color:var(--gold-bright);cursor:pointer;
  background:rgba(224,177,92,.08);border:1px solid rgba(224,177,92,.5);border-radius:6px;padding:.2rem .85rem;transition:.18s}
.kopya:hover{background:rgba(224,177,92,.16);box-shadow:0 0 16px rgba(224,177,92,.3)}

.davet{margin-top:34px;padding:26px 28px;border-radius:14px;display:flex;flex-wrap:wrap;align-items:center;gap:18px;
  background:linear-gradient(135deg,rgba(224,177,92,.12),rgba(111,207,194,.06));border:1px solid rgba(224,177,92,.35)}
.davet p{flex:1 1 18rem;font-family:var(--serif);font-size:1.25rem;line-height:1.4;color:var(--parch)}
.btn-altin{display:inline-block;padding:.7rem 1.4rem;border-radius:10px;font-weight:700;font-size:.95rem;color:#241a08;
  background:linear-gradient(180deg,#f7d999,#e0b15c 58%,#d3a34e);box-shadow:inset 0 1px 0 rgba(255,255,255,.55),0 1px 2px rgba(0,0,0,.35);transition:.18s}
.btn-altin:hover{transform:translateY(-1px);box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 6px 22px rgba(224,177,92,.38)}

.ilgili{max-width:1140px;margin:0 auto;padding:30px 22px 70px}
.ilgili>h2{font-family:var(--mono);font-weight:400;font-size:1.25rem;color:var(--teal);letter-spacing:.04em;margin-bottom:16px}
.ilgili>h2::before{content:"> "}
.ilgili .kartlar{padding-bottom:0}

footer{border-top:1px solid rgba(50,67,88,.6);padding:26px 0 40px;font-size:.88rem;color:var(--ink-dim)}
footer .wrap{display:flex;flex-wrap:wrap;gap:10px 26px;align-items:center;justify-content:space-between}
footer nav{display:flex;flex-wrap:wrap;gap:6px 18px}
footer a{color:var(--ink-soft)} footer a:hover{color:var(--teal)}

@media (max-width:960px){ .kartlar{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:640px){
  body{font-size:16px}
  .hud-links{display:none}
  .logo .bolum{display:none}
  .kahraman{padding:40px 0 18px}
  .kartlar{grid-template-columns:1fr;gap:14px}
  .kart.one .kart-ic{padding:22px 20px 24px}
  .kart.one p{font-size:1.2rem}
  .sayac{display:none}
  .turler{flex:1 1 100%}
  .turler a{flex:1;text-align:center;padding:.38rem .3rem}
  .yazi{padding-top:26px}
  .davet{padding:22px 20px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;
    transition-duration:.001ms!important;scroll-behavior:auto!important}
  html.js .rv{opacity:1;transform:none}
  .imlec{animation:none}
}
