/* Seorar — sade blog (2026-10-28). Krem zemin, ince nokta izgarasi, yumusak isik gecisleri. */
*,*::before,*::after{box-sizing:border-box}
:root{
  --krem:#fff5e6; --murekkep:#1a1522; --amber:#ffb000; --turuncu:#ff5a1f; --turuncu-koyu:#c43f0a;
  --soluk:#4a4356; --yesil:#25d366; --nokta:#d9cdb8; --cizgi:rgba(26,21,34,.14); --panel:rgba(255,255,255,.55);
  color-scheme:light;
}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  background-color:var(--krem);
  background-image:
    radial-gradient(var(--nokta) 1.2px, transparent 1.2px),
    radial-gradient(760px 420px at 0% 0%, rgba(255,176,0,.34), rgba(255,176,0,0) 62%),
    radial-gradient(700px 440px at 100% 0%, rgba(255,90,31,.26), rgba(255,90,31,0) 60%);
  background-size:22px 22px, 100% 820px, 100% 820px;
  background-repeat:repeat, no-repeat, no-repeat;
  color:var(--murekkep);
  font-family:"Bricolage Grotesque","Segoe UI",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif;
  font-weight:500; font-size:17.5px; line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
.sahne{position:relative;min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;overflow:hidden}
.halka{position:absolute;top:-250px;right:-270px;width:620px;height:620px;pointer-events:none;z-index:0}
.ust,.govde,.alt{position:relative;z-index:1}
.ic{width:100%;max-width:1100px;margin:0 auto;padding:0 24px}
.okuma{width:100%;max-width:720px;margin:0 auto;padding:0 24px}
h1,h2,h3{margin:0;font-weight:800;letter-spacing:-.04em;line-height:1.05}
p{margin:0}
img,svg{display:block;max-width:100%}
a{color:var(--murekkep)}
a:focus-visible{outline:3px solid var(--turuncu);outline-offset:4px;border-radius:4px}
.atla{position:absolute;left:-9999px}
.atla:focus{position:static;display:inline-block;margin:8px 24px 0;padding:6px 12px;background:var(--murekkep);color:#fff;border-radius:6px}

/* ust serit */
.ust{padding:22px 0}
.ust .ic{display:flex;align-items:center;justify-content:space-between;gap:16px}
.ust img{width:96px;height:31px}
.ust a.blog{font-weight:700;letter-spacing:-.01em;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:5px;text-decoration-color:rgba(26,21,34,.35)}
.ust a.blog:hover{text-decoration-color:var(--turuncu)}
.ust a.blog[aria-current="page"]{text-decoration-color:var(--turuncu)}

/* govde */
.govde{flex:1;padding:28px 0 72px}

/* blog listesi */
.liste-basi{padding:14px 0 38px}
.liste-basi h1{font-size:clamp(34px,5vw,44px)}
.liste-basi p{margin-top:10px;color:var(--soluk);font-size:clamp(17px,2.2vw,19px)}
.yazilar{list-style:none;margin:0;padding:0;border-top:1px solid var(--cizgi)}
.yazilar li{padding:26px 0;border-bottom:1px solid var(--cizgi)}
.meta{font-size:14px;color:var(--soluk)}
.meta .ayrac{margin:0 8px;opacity:.5}
.yazilar h2{margin-top:8px;font-size:clamp(21px,3vw,25px);line-height:1.22}
.yazilar h2 a{text-decoration:none}
.yazilar h2 a:hover{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:4px;text-decoration-color:var(--turuncu)}
.ozet{margin-top:8px;color:var(--soluk);font-size:16.5px;line-height:1.55;max-width:680px}
.sayfalama{display:flex;justify-content:space-between;gap:20px;margin-top:30px;font-size:16.5px}
.sayfalama a{font-weight:700;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:5px;text-decoration-color:rgba(26,21,34,.35)}
.sayfalama a:hover{text-decoration-color:var(--turuncu)}
.sayfalama .bos{flex:1}

/* yazi basi */
.yazi-basi{padding:12px 0 34px}
.yazi-basi h1{margin-top:12px;font-size:clamp(30px,4.6vw,42px);line-height:1.08}

/* yazi govdesi */
.icerik p{margin:0 0 20px;font-size:17.5px;line-height:1.7;color:var(--soluk)}
.icerik > p:first-child{font-size:18.5px;color:var(--murekkep)}
.icerik h2{margin:46px 0 16px;font-size:clamp(24px,3.6vw,30px);line-height:1.12}
.icerik h3{margin:30px 0 12px;font-size:clamp(19px,2.8vw,22px)}
.icerik strong{font-weight:800;color:var(--murekkep)}
.icerik em{font-style:italic}
.icerik a{color:var(--turuncu-koyu);font-weight:700;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px;text-decoration-color:rgba(196,63,10,.45)}
.icerik a:hover{text-decoration-color:var(--turuncu-koyu)}
.icerik ul,.icerik ol{margin:0 0 22px;padding-left:24px}
.icerik li{margin:0 0 9px;line-height:1.65;color:var(--soluk)}
.icerik li::marker{color:var(--turuncu)}
.icerik code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.9em;background:rgba(26,21,34,.06);border-radius:5px;padding:1px 6px;color:#6d3200;word-break:break-word}
.icerik img{height:auto;border-radius:10px;margin:0 0 20px}
.icerik blockquote{margin:0 0 22px;padding:4px 0 4px 20px;border-left:3px solid var(--amber);color:var(--soluk);font-style:italic}
.icerik hr{border:0;border-top:1px solid var(--cizgi);margin:36px 0}

/* cevap kutusu */
.answer-box{margin:0 0 30px;padding:22px 24px;border:1px solid var(--cizgi);border-radius:14px;background:var(--panel)}
.answer-box h2{margin:0 0 12px;font-size:clamp(20px,3vw,24px)}
.answer-box p{margin:0 0 12px}
.answer-box p:last-child{margin-bottom:0}

/* kod kutusu */
.code-box{margin:0 0 24px;padding:18px 20px;border-radius:12px;background:var(--murekkep);overflow-x:auto}
.code-box pre{margin:0;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:13.5px;line-height:1.6;color:#f3ebdc;white-space:pre-wrap;word-break:break-word}
.icerik pre{margin:0 0 24px;padding:18px 20px;border-radius:12px;background:var(--murekkep);color:#f3ebdc;font-size:13.5px;line-height:1.6;overflow-x:auto;white-space:pre-wrap;word-break:break-word}
.icerik pre code{background:none;color:inherit;padding:0;font-size:inherit}

/* tablolar */
.table-wrap{margin:0 0 26px;border:1px solid var(--cizgi);border-radius:12px;background:var(--panel);overflow-x:auto;-webkit-overflow-scrolling:touch}
.icerik table{width:100%;min-width:520px;border-collapse:collapse;font-size:15.5px}
.icerik th{padding:12px 14px;text-align:left;font-weight:800;letter-spacing:-.01em;background:rgba(26,21,34,.06);border-bottom:1px solid var(--cizgi);white-space:nowrap}
.icerik td{padding:11px 14px;border-top:1px solid var(--cizgi);color:var(--soluk);line-height:1.5;vertical-align:top}
.icerik tr:first-child td{border-top:0}

/* sss */
.faq{border-top:1px solid var(--cizgi);margin-top:6px}
.faq details{border-bottom:1px solid var(--cizgi)}
.faq summary{padding:15px 0;font-weight:800;font-size:17px;letter-spacing:-.02em;cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:14px;align-items:center}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";flex:0 0 auto;font-size:21px;line-height:1;color:var(--turuncu)}
.faq details[open] summary::after{content:"\2212"}
.faq p{margin:0;padding:0 0 18px;color:var(--soluk);line-height:1.7}

/* diger yazilar */
.diger{margin-top:56px;padding-top:28px;border-top:1px solid var(--cizgi)}
.diger h2{font-size:15px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--soluk)}
.diger ul{list-style:none;margin:14px 0 0;padding:0}
.diger li{padding:10px 0;border-bottom:1px solid var(--cizgi)}
.diger li:last-child{border-bottom:0}
.diger a{font-weight:700;font-size:17.5px;letter-spacing:-.02em;line-height:1.35;text-decoration:none}
.diger a:hover{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:4px;text-decoration-color:var(--turuncu)}
.diger .meta{margin-top:3px}

/* alt serit */
.alt{padding:20px 0 26px;text-align:center;font-size:14px;color:var(--soluk)}

@media (max-width:1200px){
  .halka{top:-220px;right:-250px;width:460px;height:460px}
}
@media (max-width:760px){
  body{background-image:
    radial-gradient(var(--nokta) 1.2px, transparent 1.2px),
    radial-gradient(420px 320px at 0% 0%, rgba(255,176,0,.28), rgba(255,176,0,0) 62%),
    radial-gradient(380px 340px at 100% 0%, rgba(255,90,31,.22), rgba(255,90,31,0) 60%);
    background-size:22px 22px, 100% 600px, 100% 600px}
  .halka{top:-170px;right:-180px;width:380px;height:380px}
  .ic,.okuma{padding:0 20px}
  .govde{padding:20px 0 56px}
}
@media (max-width:460px){
  body{font-size:17px}
  .halka{top:-150px;right:-150px;width:290px;height:290px}
  .ust{padding:18px 0}
  .ust img{width:88px;height:28px}
  .yazilar li{padding:22px 0}
  .icerik p,.icerik li{font-size:17px}
  .icerik > p:first-child{font-size:17.5px}
  .answer-box{padding:18px 18px}
  .sayfalama{flex-direction:column;gap:12px}
}