/* Blog yazıları: masaüstü içindekiler, paylaşım ve danışma paneli */
.article-sidebar{display:grid;gap:16px;margin:28px 0 38px}
.article-sidebar-card{background:linear-gradient(145deg,rgba(27,31,39,.96),rgba(18,21,28,.96));border:1px solid var(--line);border-radius:16px;padding:19px;box-shadow:0 14px 34px rgba(0,0,0,.16)}
.article-sidebar-title{display:block;margin-bottom:13px;color:var(--muted);font:600 12px/1.2 var(--disp);letter-spacing:.13em;text-transform:uppercase}
.article-toc-list{display:grid;gap:2px;list-style:none;margin:0!important;padding:0!important}
.article-toc-list a{display:block;padding:8px 9px;border-left:2px solid rgba(124,92,255,.2);color:#c8ced9;font-size:13px;line-height:1.35;transition:color .18s ease,border-color .18s ease,background .18s ease}
.article-toc-list a:hover,.article-toc-list a:focus-visible{border-color:var(--violet);background:rgba(124,92,255,.09);color:#fff;outline:0}
.article-share-list{display:grid;gap:8px}
.article-share-link{display:flex;align-items:center;gap:10px;min-height:43px;padding:8px 10px;border:1px solid var(--line);border-radius:10px;color:#e5e8ef;font:600 13px var(--disp);transition:transform .18s ease,border-color .18s ease,background .18s ease}
.article-share-link:hover,.article-share-link:focus-visible{border-color:var(--line-strong);background:rgba(255,255,255,.04);transform:translateX(2px);outline:0}
.article-share-icon{display:grid;place-items:center;width:24px;height:24px;border-radius:7px;color:#fff;font:700 12px/1 var(--body)}
.article-share-icon.x{background:#050505;border:1px solid rgba(255,255,255,.18)}
.article-share-icon.f{background:#2176e8;font-size:15px}
.article-share-icon.in{background:#0a66c2;font-size:12px}
.article-share-icon.w{background:#25c26e}
.article-promo{position:relative;overflow:hidden;border-color:rgba(77,217,201,.2);background:radial-gradient(190px circle at 100% 0,rgba(124,92,255,.34),transparent 62%),linear-gradient(145deg,#111c33,#162747)}
.article-promo::after{content:"";position:absolute;right:-56px;top:-68px;width:156px;height:156px;border:1px solid rgba(77,217,201,.24);border-radius:50%;pointer-events:none}
.article-promo .article-sidebar-title{color:#aebed5}
.article-promo h2{position:relative;margin:0 0 9px!important;color:#fff;font-size:20px!important;line-height:1.15}
.article-promo p{position:relative;margin:0 0 17px!important;color:#cad5e5!important;font-size:13px!important;line-height:1.55}
.article-promo .article-promo-link{position:relative;display:flex;align-items:center;justify-content:center;min-height:44px;border-radius:10px;background:#fff;color:#111a2d;font:600 13px var(--disp);transition:transform .18s ease,box-shadow .18s ease}
.article-promo .article-promo-link:hover,.article-promo .article-promo-link:focus-visible{transform:translateY(-2px);box-shadow:0 9px 20px rgba(0,0,0,.18);outline:0}

@media(min-width:1040px){
  article.wrap.article-with-sidebar{max-width:1120px;display:grid;grid-template-columns:minmax(0,1fr) 240px;column-gap:38px;align-items:start}
  article.article-with-sidebar>.article-main{grid-column:1;min-width:0}
  article.article-with-sidebar>.article-sidebar{grid-column:2;grid-row:1;position:sticky;top:94px;align-self:start;margin:0}
}
@media(max-width:1039px){.article-sidebar{max-width:620px}.article-sidebar-card{padding:17px}}
@media(prefers-reduced-motion:reduce){.article-share-link,.article-promo .article-promo-link{transition:none}}
/* Tüm blog detaylarında ortak ilgili yazılar ve premium footer */
.related-posts{border-top:1px solid var(--line);padding-top:36px;padding-bottom:36px}
.related-posts h2{margin:0 0 20px;color:var(--muted);font:600 13px var(--disp);letter-spacing:.16em;text-transform:uppercase}
.related-posts-list{display:grid;gap:12px}
.related-post-link{display:flex;align-items:center;justify-content:space-between;padding:19px 20px;border:1px solid var(--line);border-radius:16px;background:rgba(20,23,29,.3);color:var(--text);font-family:var(--disp);font-weight:600;transition:border-color .16s ease,background-color .16s ease,transform .16s ease}
.related-post-link::after{content:"→";color:var(--cyan);font-size:18px}
.related-post-link:hover{border-color:var(--cyan);background:rgba(77,217,201,.04);transform:translateY(-1px)}
.blog-footer-inner{display:flex;flex-direction:column;align-items:center;gap:24px;text-align:center}
.blog-footer-inner .logo{justify-content:center}
.blog-footer-inner .foot-links{margin:0}
@media(prefers-reduced-motion:reduce){.related-post-link{transition:none}.related-post-link:hover{transform:none}}
@media(min-width:1040px){
  .related-posts{max-width:1120px;display:grid;grid-template-columns:minmax(0,1fr) 240px;column-gap:38px}
  .related-posts h2,.related-posts-list{grid-column:1}
}

/* Professional editorial treatment shared by every article page */
body:has(.article-with-sidebar) {
  --article-surface: rgba(18, 22, 30, 0.92);
  --article-line: rgba(255, 255, 255, 0.09);
  --article-line-strong: rgba(185, 200, 216, 0.2);
  --article-copy: #c3ceda;
  --article-soft: #8f9eaf;
  background:
    radial-gradient(820px circle at 88% 0%, rgba(77, 217, 201, 0.07), transparent 43%),
    radial-gradient(720px circle at 5% 22%, rgba(75, 112, 170, 0.065), transparent 42%),
    linear-gradient(180deg, #080a0e 0%, #0b0e13 52%, #080a0e 100%);
}

body:has(.article-with-sidebar) header.nav {
  background: rgba(8, 10, 14, 0.87);
  border-bottom-color: rgba(255, 255, 255, 0.08);
  box-shadow: 0 12px 38px rgba(0, 0, 0, 0.13);
}

body:has(.article-with-sidebar) header.nav .nav-in {
  width: 100%;
  max-width: 1120px;
  height: 74px;
}

body:has(.article-with-sidebar) .back {
  display: inline-flex;
  align-items: center;
  min-height: 40px;
  padding: 8px 13px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 10px;
  color: #a6b3c2;
  background: rgba(255, 255, 255, 0.02);
  font: 600 12px var(--disp);
}

body:has(.article-with-sidebar) .back:hover {
  border-color: rgba(126, 217, 206, 0.34);
  color: #e4e8ec;
}

body:has(.article-with-sidebar) main > article.wrap {
  padding-top: clamp(64px, 8vw, 104px);
  padding-bottom: 50px;
}

body:has(.article-with-sidebar) .article-main > .eyebrow {
  color: #b9c8d8;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-shadow: 0 0 18px rgba(77, 217, 201, 0.14);
}

body:has(.article-with-sidebar) .article-main > .eyebrow::before {
  display: none;
}

body:has(.article-with-sidebar) .article-main > h1.title {
  max-width: 16ch;
  margin: 19px 0 16px;
  color: #f0f2f3;
  font-size: clamp(42px, 5vw, 62px);
  font-weight: 600;
  line-height: 1.01;
  letter-spacing: -0.057em;
  text-wrap: balance;
}

body:has(.article-with-sidebar) .article-main > .meta {
  display: flex;
  align-items: center;
  gap: 9px;
  margin-top: 0;
  color: #8391a2;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

body:has(.article-with-sidebar) .article-main > .meta::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #55d994;
  box-shadow: 0 0 10px rgba(85, 217, 148, 0.45);
}

body:has(.article-with-sidebar) .article-route {
  gap: 0;
  margin: 27px 0 28px;
  padding: 14px 0;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

body:has(.article-with-sidebar) .article-route span {
  padding: 0 16px;
  border: 0;
  border-left: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 0;
  background: transparent;
  color: #99a7b7;
  font-size: 12px;
  letter-spacing: 0.04em;
}

body:has(.article-with-sidebar) .article-route span:first-child {
  padding-left: 0;
  border-left: 0;
}

body:has(.article-with-sidebar) .article-route span::before {
  width: 5px;
  height: 5px;
  background: #75d9ce !important;
}

body:has(.article-with-sidebar) .article-main > .cover {
  min-height: 280px;
  margin: 0 0 34px;
  border-color: rgba(255, 255, 255, 0.1);
  border-radius: 20px;
  box-shadow: 0 28px 66px -48px rgba(0, 0, 0, 0.96), inset 0 1px rgba(255, 255, 255, 0.035);
}

body:has(.article-with-sidebar) .article-main > .cover::before {
  display: none;
}

body:has(.article-with-sidebar) .article-main > .lead {
  max-width: 760px;
  margin: 0 0 46px;
  padding: 23px 0 23px 25px;
  border-left: 2px solid #78d9ce;
  border-radius: 0;
  background: linear-gradient(90deg, rgba(77, 217, 201, 0.065), transparent 78%);
  color: #dce4ec;
  font-size: 18px;
  font-weight: 450;
  line-height: 1.75;
}

body:has(.article-with-sidebar) .article-main > h2,
body:has(.article-with-sidebar) .article-main > h3,
body:has(.article-with-sidebar) .article-main > p,
body:has(.article-with-sidebar) .article-main > ul,
body:has(.article-with-sidebar) .article-main > ol,
body:has(.article-with-sidebar) .article-main > .callout {
  max-width: 760px;
}

body:has(.article-with-sidebar) .article-main > h2 {
  margin: 52px 0 17px;
  padding-top: 27px;
  border-top: 1px solid rgba(255, 255, 255, 0.085);
  color: #edf0f2;
  font-size: clamp(25px, 3vw, 33px);
  font-weight: 600;
  line-height: 1.14;
  letter-spacing: -0.04em;
}

body:has(.article-with-sidebar) .article-main > h2::before {
  display: none;
}

body:has(.article-with-sidebar) .article-main > h3 {
  color: #e5e9ed;
}

body:has(.article-with-sidebar) .article-main > p,
body:has(.article-with-sidebar) .article-main > ul,
body:has(.article-with-sidebar) .article-main > ol {
  color: var(--article-copy);
  font-size: 16.5px;
  line-height: 1.86;
}

body:has(.article-with-sidebar) .article-main > ul,
body:has(.article-with-sidebar) .article-main > ol {
  padding: 20px 22px 9px;
  border-color: rgba(255, 255, 255, 0.075);
  border-radius: 13px;
  background: rgba(255, 255, 255, 0.018);
}

body:has(.article-with-sidebar) .article-main > ul li::marker,
body:has(.article-with-sidebar) .article-main > ol li::marker {
  color: #79d9ce;
  font-weight: 700;
}

body:has(.article-with-sidebar) .article-main > .callout {
  padding: 24px 25px;
  border: 1px solid rgba(126, 217, 206, 0.2);
  border-left: 3px solid #79d9ce;
  border-radius: 14px;
  background: linear-gradient(120deg, rgba(77, 217, 201, 0.075), rgba(15, 19, 26, 0.88));
  box-shadow: none;
}

body:has(.article-with-sidebar) .article-main > .callout::before {
  color: #9edfd8;
}

body:has(.article-with-sidebar) .article-main > .cta-band {
  max-width: 760px;
  margin: 58px 0 52px;
  padding: 34px;
  border-color: rgba(126, 217, 206, 0.2);
  border-radius: 18px;
  background:
    radial-gradient(360px circle at 100% 0%, rgba(77, 217, 201, 0.1), transparent 70%),
    linear-gradient(145deg, rgba(21, 27, 35, 0.98), rgba(10, 13, 18, 0.98));
  box-shadow: none;
}

body:has(.article-with-sidebar) .article-main > .cta-band::before {
  color: #9edfd8;
}

body:has(.article-with-sidebar) .article-main > .cta-band h3 {
  color: #eef1f3;
}

body:has(.article-with-sidebar) .article-main > .cta-band p {
  color: #aab8c7;
}

body:has(.article-with-sidebar) .article-main .btn-primary {
  border: 1px solid #8fded5;
  background: #9de4dc;
  color: #07110f;
}

body:has(.article-with-sidebar) .article-next-steps {
  max-width: 760px;
  margin-top: 54px;
  padding: 30px;
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 17px;
  background: rgba(255, 255, 255, 0.018);
}

body:has(.article-with-sidebar) .article-next-steps > h2 {
  margin-top: 0 !important;
  padding-top: 0 !important;
  border-top: 0;
}

body:has(.article-with-sidebar) .article-next-steps > p {
  margin: 0 0 18px;
  color: #9eacbb;
}

body:has(.article-with-sidebar) .article-related-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

body:has(.article-with-sidebar) .article-related-list a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 58px;
  padding: 13px 15px;
  border: 1px solid rgba(255, 255, 255, 0.085);
  border-radius: 11px;
  background: rgba(8, 10, 14, 0.42);
  color: #d6dde4;
  font: 600 13px var(--disp);
}

body:has(.article-with-sidebar) .article-related-list a:hover {
  border-color: rgba(126, 217, 206, 0.34);
  background: rgba(77, 217, 201, 0.04);
}

body:has(.article-with-sidebar) .article-related-list span {
  color: #82dbd1;
  font-size: 18px;
}

body:has(.article-with-sidebar) .article-service-step {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 18px;
  color: #91dcd3;
  font: 600 13px var(--disp);
}

body:has(.article-with-sidebar) .article-service-step::after {
  content: "→";
}

body:has(.article-with-sidebar) .article-sidebar {
  gap: 12px;
}

body:has(.article-with-sidebar) .article-sidebar-card {
  padding: 18px;
  border-color: rgba(255, 255, 255, 0.085);
  border-radius: 13px;
  background: linear-gradient(155deg, rgba(21, 26, 35, 0.96), rgba(10, 13, 18, 0.98));
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.025);
}

body:has(.article-with-sidebar) .article-sidebar-title {
  color: #8e9dad;
  font-size: 12px;
  font-weight: 700;
}

body:has(.article-with-sidebar) .article-toc-list a {
  padding: 8px 9px;
  border-left-color: rgba(126, 217, 206, 0.16);
  color: #aeb9c6;
  font-size: 12px;
}

body:has(.article-with-sidebar) .article-toc-list a:hover,
body:has(.article-with-sidebar) .article-toc-list a:focus-visible {
  border-color: #79d9ce;
  background: rgba(77, 217, 201, 0.055);
  color: #e9edf0;
}

body:has(.article-with-sidebar) .article-share-link {
  min-height: 40px;
  border-color: rgba(255, 255, 255, 0.075);
  border-radius: 9px;
  color: #bac4cf;
  background: rgba(255, 255, 255, 0.012);
  font-size: 12px;
}

body:has(.article-with-sidebar) .article-promo {
  border-color: rgba(126, 217, 206, 0.17);
  background:
    radial-gradient(190px circle at 100% 0%, rgba(77, 217, 201, 0.1), transparent 66%),
    linear-gradient(155deg, #14202a, #0d141c);
}

body:has(.article-with-sidebar) .article-promo .article-promo-link {
  background: #a3e4dd;
  color: #07110f;
}

body:has(.article-with-sidebar) .related-posts {
  border-top-color: rgba(255, 255, 255, 0.08);
  padding-top: 45px;
  padding-bottom: 55px;
}

body:has(.article-with-sidebar) .related-posts h2 {
  color: #94a3b3;
  font-size: 12px;
}

body:has(.article-with-sidebar) .related-post-link {
  padding: 20px;
  border-color: rgba(255, 255, 255, 0.085);
  border-radius: 13px;
  background: linear-gradient(150deg, rgba(20, 25, 33, 0.9), rgba(10, 13, 18, 0.94));
  color: #dce2e7;
}

body:has(.article-with-sidebar) .related-post-link:hover {
  border-color: rgba(126, 217, 206, 0.34);
  background: rgba(77, 217, 201, 0.035);
}

body:has(.article-with-sidebar) .related-post-link::after {
  color: #82dbd1;
}

@media (max-width: 1039px) {
  body:has(.article-with-sidebar) article.article-with-sidebar {
    display: flex;
    flex-direction: column;
  }

  body:has(.article-with-sidebar) article.article-with-sidebar > .article-main {
    order: 1;
  }

  body:has(.article-with-sidebar) .article-sidebar {
    order: 2;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-width: 760px;
  }

  body:has(.article-with-sidebar) .article-sidebar .article-promo {
    grid-column: 1 / -1;
  }
}

@media (max-width: 680px) {
  body:has(.article-with-sidebar) header.nav .nav-in {
    height: 68px;
  }

  body:has(.article-with-sidebar) main > article.wrap {
    padding-top: 48px;
  }

  body:has(.article-with-sidebar) .article-main > h1.title {
    font-size: clamp(38px, 11vw, 50px);
  }

  body:has(.article-with-sidebar) .article-route {
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
  }

  body:has(.article-with-sidebar) .article-route span {
    padding: 0;
    border-left: 0;
  }

  body:has(.article-with-sidebar) .article-main > .cover {
    min-height: 220px;
    border-radius: 17px;
  }

  body:has(.article-with-sidebar) .article-main > .lead {
    padding: 19px 0 19px 18px;
    font-size: 17px;
  }

  body:has(.article-with-sidebar) .article-main > h2 {
    margin-top: 43px;
    font-size: 27px;
  }

  body:has(.article-with-sidebar) .article-main > .cta-band,
  body:has(.article-with-sidebar) .article-next-steps {
    padding: 25px 20px;
  }

  body:has(.article-with-sidebar) .article-sidebar {
    grid-template-columns: 1fr;
  }

  body:has(.article-with-sidebar) .article-sidebar .article-promo {
    grid-column: auto;
  }

  body:has(.article-with-sidebar) .article-related-list {
    grid-template-columns: 1fr;
  }
}

/* Tanıtım kartı başlığı artık <h2> değil <p>: kenar çubuğu DOM'da makaleden
   önce geldiği için o <h2>, sayfanın <h1>'inden önce gelen bir başlık
   oluşturuyordu. Görünüm birebir korunur. */
.article-promo .article-promo-h {
  position: relative;
  margin: 0 0 9px !important;
  color: #fff;
  font-family: var(--disp);
  font-weight: 600;
  font-size: 20px !important;
  line-height: 1.15;
  letter-spacing: -0.02em;
}

/* Okuma ölçüsü. Makale gövdesi 760px genişlikte 16,5px fontla akıyordu:
   satır başına ~80 karakter (bir paragrafta 96). Rahat okuma aralığı 45-75.
   Kenar çubuğu düzeni etkilenmez, yalnızca metin sütunu daralır. */
.article-main > p,
.article-main > ul,
.article-main > ol,
.article-main > h2,
.article-main > h3 {
  max-width: 68ch;
}
