 body {
   font-family: 'Inter', sans-serif;
 }

 .select-none {
   user-select: none;
   -webkit-user-select: none;
 }

 .degradeasama {
   background: linear-gradient(270deg, rgb(255 255 255 / 0%) 0%, var(--anarenk) 30%);
 }

 .degradebaslik {
   background: linear-gradient(37deg, rgba(87, 199, 133, 0) 20%, var(--anarenk-degrade) 109%);
   border-radius: 20px;
   padding: 1rem;
 }

 .degradesol {
   background: linear-gradient(347deg, #ad29290a 40%, #ffffff 200%);
   border: 0 !important;
 }

 .buttondegrade {
   background: radial-gradient(circle, rgba(42, 123, 155, 0) 56%, var(--anarenk) 376%);
 }

 .meta-badge {
   display: inline-flex;
   align-items: center;
   gap: .4rem;
   padding: .35rem .6rem;
   border: 1px solid #e2e8f0;
   border-radius: 9999px;
   background: #fff;
   color: #334155;
 }

 .checklist li {
   display: flex;
   gap: .5rem;
   align-items: flex-start;
 }

 .checklist i {
   color: var(--anarenk);
   margin-top: .15rem;
 }


 .anarenk-bg {
   background-color: var(--anarenk-solid) !important;
 }

 .anarenk-button {
   background: linear-gradient(220deg, rgba(42, 123, 155, 0) -15%, var(--anarenk) 25%);
 }

 .anarenk-bg-solid {
   background-color: var(--anarenk-solid-2) !important;
 }

 .anarenk-tx {
   color: var(--anarenk) !important;
 }

 .anarenk-tx-solid {
   color: var(--anarenk-solid) !important;
 }

 .glass {
   background: rgba(255, 255, 255, .6);
   backdrop-filter: blur(14px);
 }

 .glass-card {
   background: rgba(255, 255, 255, .65);
   backdrop-filter: blur(18px);
   box-shadow: 0 8px 24px rgba(0, 0, 0, .05);
   transition: all .3s ease;
 }

 .glass-card:hover {
   transform: translateY(-3px);
   box-shadow: 0 12px 32px rgba(0, 0, 0, .08);
 }

 img {
   user-select: none;
   -webkit-user-drag: none;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
   pointer-events: none;
 }

 ::-webkit-scrollbar {
   height: 6px;
   width: 6px;
 }

 ::-webkit-scrollbar-thumb {
   background: rgba(0, 0, 0, .2);
   border-radius: 9999px;
 }

 ::-webkit-scrollbar-track {
   background: transparent;
 }

 /* Marquee (gerekirse) */
 .marquee {
   position: relative;
   overflow: hidden;
   white-space: nowrap;
   width: calc(var(--limit, 20)*1ch);
 }

 .marquee__track {
   display: inline-block;
   will-change: transform;
   animation: marquee var(--dur, 14s) linear infinite;
 }

 .marquee__track>span {
   display: inline-block;
   padding-right: .5rem;
 }

 @keyframes marquee {
   from {
     transform: translateX(0)
   }

   to {
     transform: translateX(var(--end, -50%))
   }
 }

 @media (prefers-reduced-motion:reduce) {
   .marquee__track {
     animation: none;
     transform: none;
   }
 }

 /* Canlı yeşil nokta */
 .live-dot {
   width: 8px;
   height: 8px;
   border-radius: 9999px;
   background: #16a34a;
   box-shadow: 0 0 0 0 rgba(22, 163, 74, .7);
   animation: pulse 1.6s ease-in-out infinite;
 }

 @keyframes pulse {
   0% {
     box-shadow: 0 0 0 0 rgba(22, 163, 74, .7);
     opacity: .75;
   }

   50% {
     opacity: 1;
   }

   70% {
     box-shadow: 0 0 0 10px rgba(22, 163, 74, 0);
   }

   100% {
     box-shadow: 0 0 0 0 rgba(22, 163, 74, 0);
     opacity: .75;
   }
 }

 select {
   appearance: none;
   -webkit-appearance: none;
   -moz-appearance: none;
   background: #f9fafb;
   border: 1px solid #e5e7eb;
   border-radius: 12px;
   padding: 12px 14px;
   font-size: 14px;
   font-weight: 500;
   color: #111827;
   cursor: pointer;
   outline: none;
   transition: 0.2s ease;
 }

 select:hover {
   background: #f3f4f6;
 }

 select:focus {
   border-color: var(--anarenk);
   box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.05);
 }

 option {
   padding: 10px;
   font-size: 14px;
   color: #111827;
   background: #fff;
 }

 option:hover {
   background: #f9fafb;
 }

 option:checked {
   background: #f1f5f9;
   color: var(--anarenk);
   font-weight: 600;
 }

 /* ===== Blog Detay - Scoped Tipografi ===== */
 .blog-detail .post-title {
   font-size: 1.75rem;
   /* 28px */
   line-height: 1.3;
   letter-spacing: -0.01em;
   font-weight: 700;
   color: #0f172a;
   margin-bottom: .75rem;
 }

 /* Blog sayfaları için tipografi */
 .blog-content {
   font-family: 'Inter', sans-serif;
   color: #334155;
   line-height: 1.7;
   font-size: 14px;
   /* küçültüldü */
 }

 .blog-content h1,
 .blog-content h2,
 .blog-content h3,
 .blog-content h4 {
   line-height: 1.35;
   letter-spacing: -0.01em;
   font-weight: 600;
   color: #0f172a;
   margin-top: 1.25rem;
   margin-bottom: 0.6rem;
 }

 .blog-content h1 {
   font-size: 1.5rem;
   /* 24px yerine daha küçük */
   font-weight: 700;
   margin-top: 0;
 }

 .blog-content h2 {
   font-size: xx-large;
   font-weight: 400;
 }

 .blog-content pre {
   margin: 12px 0;
   padding: 14px 16px;
   border-radius: 14px;

   background: #0b1220;
   color: #e5e7eb;
   border: 1px solid rgba(148, 163, 184, 0.18);

   font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
   font-size: 13px;
   line-height: 1.6;
   white-space: pre-wrap;
   word-break: break-word;
   overflow-x: auto;
 }

 .blog-content pre code {
   font: inherit;
 }

 .blog-content pre::selection,
 .blog-content pre *::selection {
   background: rgba(56, 189, 248, 0.22);
 }

 .blog-content h3 {
   font-size: 22px;
   font-weight: 400;
 }

 .blog-content p {
   font-size: 0.875rem;
   /* 14px */
   color: #475569;
   margin-top: 0.6rem;
 }

 .blog-content blockquote {
   font-size: 0.9rem;
   font-style: italic;
   color: #475569;
   border-left: 4px solid var(--anarenk);
   padding-left: 1rem;
   margin: 1.25rem 0;
 }

 .blog-content ul li {
   list-style: disc;
 }

 .blog-content ol li {
   list-style: auto;
 }


 .blog-content ul,
 .blog-content ol {
   margin: 0.75rem 0 0.75rem 1.25rem;
 }

 .blog-content li {
   font-size: 0.875rem;
   margin-bottom: 0.3rem;
 }


 /* Yorumlar (sadece bu sayfa) */
 .blog-detail .comment-card {
   border-radius: .75rem;
   border: 1px solid #e2e8f0;
   padding: 1rem;
   background: #f8fafc;
 }

 .comment-card {
   border-radius: 0.75rem;
   border: 1px solid #e2e8f0;
   padding: 1rem;
   background: #f8fafc;
 }