/* =====================================================================
   KrediAnalizi – Design System v2
   Aesthetic: Professional Turkish fintech — trustworthy, clean, clear
   Palette: Deep blue authority + amber CTA + clean whites
   Font: Inter (body) + JetBrains Mono (numbers/data)
   ===================================================================== */

/* ── Reset & Variables ────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; font-size: 16px; }

:root {
  /* Brand */
  --blue-900:   #0f1e35;
  --blue-800:   #162640;
  --blue-700:   #1a3154;
  --blue-600:   #1e4080;
  --blue-500:   #1a56db;
  --blue-400:   #3b82f6;
  --blue-100:   #dbeafe;
  --blue-50:    #eff6ff;

  --amber-600:  #d97706;
  --amber-500:  #f59e0b;
  --amber-400:  #fbbf24;
  --amber-100:  #fef3c7;
  --amber-50:   #fffbeb;

  --green-600:  #16a34a;
  --green-100:  #dcfce7;
  --orange-600: #d97706;
  --orange-100: #ffedd5;
  --red-600:    #dc2626;
  --red-100:    #fee2e2;

  /* Neutrals */
  --gray-900:  #111827;
  --gray-700:  #374151;
  --gray-600:  #4b5563;
  --gray-500:  #6b7280;
  --gray-400:  #9ca3af;
  --gray-200:  #e5e7eb;
  --gray-100:  #f3f4f6;
  --gray-50:   #f9fafb;
  --white:     #ffffff;

  /* Semantic */
  --text:        var(--gray-900);
  --text-muted:  var(--gray-600);
  --text-light:  var(--gray-400);
  --border:      var(--gray-200);
  --bg:          var(--gray-50);
  --surface:     var(--white);

  /* Spacing */
  --space-xs:  4px;
  --space-sm:  8px;
  --space-md:  16px;
  --space-lg:  24px;
  --space-xl:  40px;
  --space-2xl: 64px;
  --space-3xl: 96px;

  /* Radii */
  --r-sm:  6px;
  --r-md:  10px;
  --r-lg:  16px;
  --r-xl:  24px;
  --r-pill:100px;

  /* Shadows */
  --shadow-sm: 0 1px 2px rgba(0,0,0,.06);
  --shadow-md: 0 4px 12px rgba(0,0,0,.08);
  --shadow-lg: 0 8px 32px rgba(0,0,0,.12);
  --shadow-xl: 0 20px 60px rgba(0,0,0,.16);
}

body {
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
  font-size: 1rem;
  line-height: 1.65;
  color: var(--text);
  background: var(--bg);
  -webkit-font-smoothing: antialiased;
}

/* ── Typography ───────────────────────────────────────────────────── */
h1, h2, h3, h4 {
  line-height: 1.2;
  color: var(--blue-900);
  font-weight: 700;
}
h1 { font-size: clamp(1.75rem, 4vw, 2.5rem); }
h2 { font-size: clamp(1.3rem, 3vw, 1.75rem); }
h3 { font-size: 1.1rem; }
p  { color: var(--text-muted); }
a  { color: var(--blue-500); text-decoration: none; }
a:hover { text-decoration: underline; }
em { color: var(--amber-600); font-style: normal; }
.mono { font-family: 'JetBrains Mono', monospace; }

/* ── Layout ───────────────────────────────────────────────────────── */
.container    { max-width: 1180px; margin: 0 auto; padding: 0 20px; }
.page-main    { padding: var(--space-xl) 0 var(--space-3xl); }
.page-layout  { display: grid; grid-template-columns: 1fr 300px; gap: var(--space-xl); align-items: start; }
.page-content { min-width: 0; }



/* ── Buttons ──────────────────────────────────────────────────────── */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  font-family: inherit; font-weight: 600; font-size: .925rem;
  padding: 10px 22px; border-radius: var(--r-md); border: 2px solid transparent;
  cursor: pointer; text-decoration: none; transition: all .18s ease;
  white-space: nowrap; line-height: 1;
}
.btn:hover { text-decoration: none; transform: translateY(-1px); }
.btn:active { transform: translateY(0); }

.btn-primary  { background: var(--blue-500); color: var(--white); border-color: var(--blue-500); }
.btn-primary:hover { background: var(--blue-600); border-color: var(--blue-600); color: var(--white); }

.btn-amber    { background: var(--amber-500); color: var(--blue-900); border-color: var(--amber-500); }
.btn-amber:hover { background: var(--amber-600); border-color: var(--amber-600); color: var(--blue-900); }

.btn-ghost    { background: transparent; color: var(--blue-600); border-color: var(--blue-200); }
.btn-ghost:hover { background: var(--blue-50); border-color: var(--blue-400); }

.btn-lg       { padding: 14px 28px; font-size: 1rem; border-radius: var(--r-lg); }
.btn-full     { width: 100%; }

/* ── Header ───────────────────────────────────────────────────────── */
.site-header {
  background: var(--blue-900);
  position: sticky; top: 0; z-index: 200;
  border-bottom: 1px solid rgba(255,255,255,.06);
  box-shadow: 0 2px 20px rgba(0,0,0,.25);
}
.header-inner {
  display: flex; align-items: center; gap: var(--space-lg);
  height: 60px;
}
.logo {
  display: flex; align-items: center; gap: 10px;
  text-decoration: none; flex-shrink: 0;
}
.logo-icon {
  width: 34px; height: 34px; border-radius: var(--r-sm);
  background: var(--blue-500); color: var(--white);
  font-weight: 800; font-size: 1rem;
  display: flex; align-items: center; justify-content: center;
}
.logo-name { color: var(--white); font-weight: 700; font-size: 1.05rem; letter-spacing: -.01em; }

.site-nav { display: flex; gap: 4px; margin-left: auto; }
.site-nav a {
  color: rgba(255,255,255,.65); font-size: .875rem; font-weight: 500;
  padding: 6px 12px; border-radius: var(--r-sm);
  text-decoration: none; transition: all .15s;
}
.site-nav a:hover { color: var(--white); background: rgba(255,255,255,.1); text-decoration: none; }

.header-cta {
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--amber-500); color: var(--blue-900);
  font-size: .875rem; font-weight: 700; padding: 8px 18px;
  border-radius: var(--r-sm); text-decoration: none;
  transition: background .18s; flex-shrink: 0;
}
.header-cta:hover { background: var(--amber-600); text-decoration: none; color: var(--blue-900); }

.nav-toggle {
  display: none; flex-direction: column; gap: 5px;
  background: none; border: none; cursor: pointer; padding: 4px;
}
.nav-toggle span { display: block; width: 22px; height: 2px; background: var(--white); border-radius: 2px; }

@media (max-width: 700px) {
  .site-nav { display: none; flex-direction: column; position: absolute; top: 60px; left: 0; right: 0; background: var(--blue-800); padding: 12px; }
  .site-nav.open { display: flex; }
  .nav-toggle { display: flex; }
  .header-cta { display: none; }
}

/* ── Hero ─────────────────────────────────────────────────────────── */
.hero {
  background: var(--blue-900);
  padding: var(--space-3xl) 0 var(--space-2xl);
  position: relative; overflow: hidden;
}
.hero::before {
  content: '';
  position: absolute; top: -30%; right: -10%; width: 600px; height: 600px;
  background: radial-gradient(circle, rgba(26,86,219,.25) 0%, transparent 65%);
  pointer-events: none;
}
.hero::after {
  content: '';
  position: absolute; bottom: -10%; left: -5%; width: 400px; height: 400px;
  background: radial-gradient(circle, rgba(245,158,11,.08) 0%, transparent 65%);
  pointer-events: none;
}
.hero-split {
  display: grid; grid-template-columns: 1fr 480px; gap: 56px; align-items: center;
  position: relative; z-index: 1;
}
@media (max-width: 1000px) { .hero-split { grid-template-columns: 1fr; gap: var(--space-xl); } }

.hero-badge {
  display: inline-flex; align-items: center; gap: 6px;
  background: rgba(245,158,11,.15); color: var(--amber-400);
  border: 1px solid rgba(245,158,11,.3);
  font-size: .8rem; font-weight: 600; padding: 5px 14px;
  border-radius: var(--r-pill); margin-bottom: var(--space-md); letter-spacing: .03em;
}
.hero-text h1 {
  color: var(--white); font-size: clamp(2rem, 4.5vw, 3rem);
  margin-bottom: var(--space-md); line-height: 1.1;
}
.highlight { color: var(--amber-400); }
.hero-sub { color: rgba(255,255,255,.65); font-size: 1.05rem; margin-bottom: var(--space-xl); max-width: 480px; }

.trust-row { display: flex; gap: var(--space-xl); }
.trust-item { display: flex; flex-direction: column; }
.trust-item strong { color: var(--white); font-size: 1.4rem; font-weight: 800; }
.trust-item span { color: rgba(255,255,255,.5); font-size: .8rem; }

.hero-form-card {
  background: var(--white); border-radius: var(--r-xl);
  padding: var(--space-lg) var(--space-lg);
  box-shadow: var(--shadow-xl);
}
.form-card-label {
  font-size: .8rem; font-weight: 700; color: var(--blue-500);
  text-transform: uppercase; letter-spacing: .06em; margin-bottom: var(--space-md);
  padding-bottom: var(--space-sm); border-bottom: 2px solid var(--blue-100);
}

/* ── Forms ────────────────────────────────────────────────────────── */
.form-group { display: flex; flex-direction: column; gap: 5px; }
.form-row   { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-md); margin-bottom: var(--space-md); }
@media (max-width: 500px) { .form-row { grid-template-columns: 1fr; } }

.form-group { margin-bottom: var(--space-md); }
.form-group label { font-size: .875rem; font-weight: 600; color: var(--gray-700); }
.req { color: var(--red-600); }
.field-hint { font-size: .775rem; color: var(--gray-400); }

.form-group input,
.form-group select {
  width: 100%; padding: 10px 14px;
  border: 1.5px solid var(--border);
  border-radius: var(--r-md);
  font-family: inherit; font-size: .95rem; color: var(--text);
  background: var(--white); transition: border-color .15s, box-shadow .15s;
}
.form-group input:focus,
.form-group select:focus {
  outline: none; border-color: var(--blue-400);
  box-shadow: 0 0 0 3px rgba(59,130,246,.15);
}
.form-group input::placeholder { color: var(--gray-400); }

/* ── Section headers ──────────────────────────────────────────────── */
.section-header { text-align: center; margin-bottom: var(--space-xl); }
.section-header h2 { margin-bottom: 8px; }
.section-header p  { color: var(--gray-500); }

.section-badge {
  display: inline-block;
  background: var(--blue-100); color: var(--blue-600);
  font-size: .78rem; font-weight: 700; padding: 3px 12px;
  border-radius: var(--r-pill); margin-bottom: var(--space-sm); letter-spacing: .04em;
}

/* ── Tools section ────────────────────────────────────────────────── */
.tools-section { padding: var(--space-3xl) 0; background: var(--white); }
.tools-grid    { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-md); }
@media (max-width: 800px) { .tools-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 480px) { .tools-grid { grid-template-columns: 1fr; } }

.tool-tile {
  display: flex; flex-direction: column;
  background: var(--gray-50); border: 1.5px solid var(--border);
  border-radius: var(--r-lg); padding: var(--space-lg);
  text-decoration: none; transition: all .18s; position: relative;
}
.tool-tile:hover { border-color: var(--blue-400); box-shadow: var(--shadow-md); transform: translateY(-2px); text-decoration: none; }
.tool-tile-icon { font-size: 1.75rem; margin-bottom: var(--space-sm); }
.tool-tile-body { flex: 1; }
.tool-tile-body h3 { font-size: 1rem; margin-bottom: 6px; color: var(--blue-900); }
.tool-tile-body p  { font-size: .85rem; color: var(--gray-500); }
.tool-tile-arrow { align-self: flex-end; margin-top: var(--space-md); font-size: 1.1rem; color: var(--blue-400); font-weight: 700; }

/* ── Questions section ────────────────────────────────────────────── */
.questions-section { padding: var(--space-3xl) 0; }
.questions-grid    { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
@media (max-width: 768px) { .questions-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 480px) { .questions-grid { grid-template-columns: 1fr; } }

.q-card {
  display: flex; align-items: center; gap: var(--space-sm);
  background: var(--white); border: 1.5px solid var(--border);
  border-radius: var(--r-md); padding: 12px 16px;
  text-decoration: none; font-size: .875rem; font-weight: 500; color: var(--gray-700);
  transition: all .15s;
}
.q-card:hover { border-color: var(--blue-400); color: var(--blue-700); background: var(--blue-50); text-decoration: none; }
.q-dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: var(--blue-400); flex-shrink: 0;
}

/* ── Guides section ───────────────────────────────────────────────── */
.guides-section { padding: var(--space-3xl) 0; background: var(--white); }
.guides-grid    { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-md); }
@media (max-width: 768px) { .guides-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 480px) { .guides-grid { grid-template-columns: 1fr; } }

.guide-card {
  display: flex; flex-direction: column;
  background: var(--gray-50); border: 1.5px solid var(--border);
  border-radius: var(--r-lg); padding: var(--space-lg);
  text-decoration: none; transition: all .18s;
}
.guide-card:hover { border-color: var(--blue-400); box-shadow: var(--shadow-md); text-decoration: none; }
.guide-tag {
  display: inline-block; background: var(--blue-100); color: var(--blue-600);
  font-size: .72rem; font-weight: 700; padding: 2px 10px;
  border-radius: var(--r-pill); margin-bottom: var(--space-sm); width: fit-content;
}
.guide-card h3 { font-size: 1rem; color: var(--blue-900); margin-bottom: 8px; }
.guide-card p  { font-size: .875rem; color: var(--gray-500); flex: 1; }
.guide-read    { display: block; margin-top: var(--space-md); font-size: .85rem; font-weight: 600; color: var(--blue-500); }

/* ── Result Card ──────────────────────────────────────────────────── */
.result-card {
  background: var(--white); border-radius: var(--r-xl);
  border: 2px solid var(--border); padding: var(--space-lg);
  box-shadow: var(--shadow-md); margin: var(--space-lg) 0;
}
.result-card.result-low    { border-color: var(--green-600); }
.result-card.result-medium { border-color: var(--orange-600); }
.result-card.result-high   { border-color: var(--red-600); }

.result-header { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: var(--space-lg); flex-wrap: wrap; gap: var(--space-md); }
.result-probability { display: flex; flex-direction: column; }
.prob-num {
  font-family: 'JetBrains Mono', monospace;
  font-size: 3.5rem; font-weight: 700; line-height: 1;
}
.result-card.result-low    .prob-num { color: var(--green-600); }
.result-card.result-medium .prob-num { color: var(--orange-600); }
.result-card.result-high   .prob-num { color: var(--red-600); }
.prob-pct { font-size: 1.5rem; color: var(--gray-400); display: inline; }
.prob-label { font-size: .78rem; color: var(--gray-400); font-weight: 500; text-transform: uppercase; letter-spacing: .05em; margin-top: 2px; }

.result-badges { display: flex; flex-direction: column; gap: 6px; align-items: flex-end; }
.risk-badge {
  font-size: .8rem; font-weight: 700; padding: 4px 12px;
  border-radius: var(--r-pill); display: inline-block;
}
.risk-badge.risk-low    { background: var(--green-100);  color: var(--green-600); }
.risk-badge.risk-medium { background: var(--orange-100); color: var(--orange-600); }
.risk-badge.risk-high   { background: var(--red-100);    color: var(--red-600); }
.loan-badge {
  font-size: .78rem; font-weight: 500; padding: 3px 10px;
  border-radius: var(--r-pill); background: var(--blue-100); color: var(--blue-600);
}

.result-stats {
  display: flex; gap: var(--space-lg); flex-wrap: wrap;
  background: var(--gray-50); border-radius: var(--r-md); padding: var(--space-md);
  margin-bottom: var(--space-md);
}
.rstat { display: flex; flex-direction: column; gap: 2px; }
.rstat-label { font-size: .75rem; color: var(--gray-400); font-weight: 500; text-transform: uppercase; letter-spacing: .04em; }
.rstat-val   { font-family: 'JetBrains Mono', monospace; font-size: 1.05rem; font-weight: 600; color: var(--blue-900); }
.rstat-val small { font-size: .7rem; color: var(--gray-400); }

.result-explanation {
  background: var(--gray-50); border-left: 3px solid var(--blue-400);
  border-radius: 0 var(--r-md) var(--r-md) 0; padding: var(--space-md);
  margin-bottom: var(--space-md);
}
.result-explanation p { color: var(--gray-700); font-size: .9rem; line-height: 1.7; }

.result-advice { margin-bottom: var(--space-md); }
.result-advice h4 { font-size: .85rem; color: var(--gray-600); text-transform: uppercase; letter-spacing: .04em; margin-bottom: var(--space-sm); }
.result-advice ul { list-style: none; display: flex; flex-direction: column; gap: 6px; }
.result-advice ul li {
  font-size: .875rem; color: var(--gray-700); padding: 8px 12px;
  background: var(--amber-50); border: 1px solid var(--amber-100);
  border-radius: var(--r-sm); padding-left: 32px; position: relative;
}
.result-advice ul li::before {
  content: '→'; position: absolute; left: 10px;
  color: var(--amber-600); font-weight: 700;
}

.result-banks { margin-bottom: var(--space-md); }
.result-banks h4 { font-size: .85rem; color: var(--gray-500); margin-bottom: var(--space-sm); font-weight: 600; }
.bank-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.bank-tag {
  background: var(--white); border: 1.5px solid var(--border);
  padding: 4px 14px; border-radius: var(--r-pill);
  font-size: .8rem; font-weight: 500; color: var(--gray-700);
}

.result-actions { display: flex; gap: var(--space-sm); flex-wrap: wrap; }

/* ── Page content elements ────────────────────────────────────────── */
.page-h1 { margin-bottom: var(--space-md); }
.page-lead {
  background: var(--blue-50); border: 1px solid var(--blue-100);
  border-radius: var(--r-md); padding: var(--space-md) var(--space-lg);
  margin-bottom: var(--space-xl);
}
.page-lead p { color: var(--gray-700); font-size: .95rem; }
.page-lead-text { color: var(--gray-600); margin-bottom: var(--space-xl); font-size: .95rem; }

.content-block { margin: var(--space-xl) 0; }
.content-block h2 { margin-bottom: var(--space-md); font-size: 1.35rem; }
.content-block p { margin-bottom: var(--space-md); }
.content-block p:last-child { margin-bottom: 0; }

/* ── Breadcrumb ───────────────────────────────────────────────────── */
.breadcrumb { margin-bottom: var(--space-lg); }
.breadcrumb ol { display: flex; flex-wrap: wrap; gap: 4px 8px; list-style: none; }
.breadcrumb li { display: flex; align-items: center; gap: 8px; }
.breadcrumb a { font-size: .8rem; color: var(--gray-400); text-decoration: none; }
.breadcrumb a:hover { color: var(--blue-500); }
.breadcrumb span[aria-current] { font-size: .8rem; color: var(--gray-600); font-weight: 500; }
.breadcrumb li:not(:last-child)::after { content: '›'; color: var(--gray-300); font-size: .8rem; }

/* ── Profile chips ────────────────────────────────────────────────── */
.profile-chips { display: flex; gap: var(--space-sm); flex-wrap: wrap; margin-bottom: var(--space-lg); }
.chip {
  display: flex; flex-direction: column; gap: 1px;
  background: var(--white); border: 1.5px solid var(--border);
  border-radius: var(--r-md); padding: 8px 16px;
}
.chip-l { font-size: .72rem; color: var(--gray-400); font-weight: 500; text-transform: uppercase; letter-spacing: .04em; }
.chip-v { font-family: 'JetBrains Mono', monospace; font-weight: 700; color: var(--blue-900); font-size: 1rem; }

/* ── Cost table ───────────────────────────────────────────────────── */
.cost-table { border: 1px solid var(--border); border-radius: var(--r-md); overflow: hidden; margin-top: var(--space-md); }
.ct-row { display: grid; grid-template-columns: 80px 1fr 1fr 1fr; padding: 11px 16px; font-size: .875rem; }
.ct-head { background: var(--blue-900); color: var(--white); font-size: .78rem; font-weight: 600; letter-spacing: .02em; }
.ct-row:not(.ct-head) { border-top: 1px solid var(--gray-100); font-family: 'JetBrains Mono', monospace; }
.ct-row:not(.ct-head):nth-child(even) { background: var(--gray-50); }
.table-note { font-size: .78rem; color: var(--gray-400); margin-top: 8px; }

/* ── FAQ ──────────────────────────────────────────────────────────── */
.faq-section   { padding: var(--space-3xl) 0; background: var(--white); }
.faq-container { max-width: 760px; }
.faq-list      { display: flex; flex-direction: column; gap: 8px; margin-top: var(--space-md); }

.faq-item { border: 1.5px solid var(--border); border-radius: var(--r-md); overflow: hidden; background: var(--white); }
.faq-q {
  width: 100%; display: flex; align-items: center; justify-content: space-between; gap: var(--space-md);
  padding: 16px 20px; background: none; border: none; cursor: pointer;
  font-family: inherit; font-size: .95rem; font-weight: 600; color: var(--gray-900); text-align: left;
  transition: background .15s;
}
.faq-q:hover { background: var(--gray-50); }
.faq-icon { font-size: 1.3rem; color: var(--gray-400); flex-shrink: 0; transition: transform .2s; }
.faq-item.open .faq-icon { transform: rotate(45deg); color: var(--blue-500); }
.faq-a { display: none; padding: 0 20px 16px; }
.faq-item.open .faq-a { display: block; }
.faq-a p { font-size: .9rem; color: var(--gray-600); line-height: 1.7; }

/* ── Related links ────────────────────────────────────────────────── */
.related-links { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: var(--space-md); }
@media (max-width: 480px) { .related-links { grid-template-columns: 1fr; } }
.related-link {
  background: var(--white); border: 1.5px solid var(--border);
  border-radius: var(--r-md); padding: 11px 16px;
  font-size: .875rem; font-weight: 500; color: var(--gray-700);
  text-decoration: none; transition: all .15s;
}
.related-link:hover { border-color: var(--blue-400); color: var(--blue-700); background: var(--blue-50); text-decoration: none; }

/* ── Combo links ──────────────────────────────────────────────────── */
.combo-links { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 8px; margin-top: var(--space-md); }
@media (max-width: 600px) { .combo-links { grid-template-columns: 1fr; } }
.combo-link {
  background: var(--gray-50); border: 1.5px solid var(--border);
  border-radius: var(--r-md); padding: 10px 14px;
  font-size: .8rem; font-weight: 500; color: var(--gray-600);
  text-decoration: none; transition: all .15s;
}
.combo-link:hover { border-color: var(--blue-300); color: var(--blue-700); text-decoration: none; }

/* ── Sidebar ──────────────────────────────────────────────────────── */
.sidebar { display: flex; flex-direction: column; gap: var(--space-md); }
@media (min-width: 1025px) { .sidebar { position: sticky; top: 76px; } }
.sidebar-widget {
  background: var(--white); border: 1.5px solid var(--border);
  border-radius: var(--r-lg); padding: var(--space-md); overflow: hidden;
}
.sidebar-widget h3 {
  font-size: .78rem; font-weight: 700; color: var(--gray-400);
  text-transform: uppercase; letter-spacing: .06em;
  margin-bottom: var(--space-sm); padding-bottom: var(--space-sm);
  border-bottom: 1px solid var(--gray-100);
}
.sidebar-list { list-style: none; }
.sidebar-list li a {
  display: flex; align-items: center; gap: 8px;
  padding: 7px 8px; font-size: .85rem; color: var(--gray-600);
  text-decoration: none; border-radius: var(--r-sm); transition: all .15s;
}
.sidebar-list li a svg { color: var(--gray-300); flex-shrink: 0; }
.sidebar-list li a:hover { background: var(--blue-50); color: var(--blue-700); text-decoration: none; }
.sidebar-list li a:hover svg { color: var(--blue-400); }

.sidebar-cta {
  background: var(--blue-900); border-radius: var(--r-lg);
  padding: var(--space-lg); text-align: center;
}
.scta-icon { font-size: 2rem; margin-bottom: var(--space-sm); }
.sidebar-cta h3 { color: var(--white); font-size: 1rem; margin-bottom: 8px; }
.sidebar-cta p  { color: rgba(255,255,255,.6); font-size: .8rem; margin-bottom: var(--space-md); }

/* ── Tool card ────────────────────────────────────────────────────── */
.tool-card {
  background: var(--white); border: 1.5px solid var(--border);
  border-radius: var(--r-xl); padding: var(--space-lg) var(--space-xl);
  box-shadow: var(--shadow-md); margin-bottom: var(--space-xl);
}
.tool-subtitle { font-size: 1.15rem; margin-bottom: var(--space-lg); }

/* Amort table */
.amort-table { border: 1px solid var(--border); border-radius: var(--r-md); overflow: hidden; max-height: 300px; overflow-y: auto; margin-top: var(--space-md); }
.at-row { display: grid; grid-template-columns: 40px 1fr 1fr 1fr 1fr; padding: 7px 12px; font-size: .78rem; font-family: 'JetBrains Mono', monospace; }
.at-head { background: var(--blue-900); color: var(--white); font-family: 'Inter', sans-serif; font-size: .75rem; position: sticky; top: 0; font-weight: 600; }
.at-row:not(.at-head):nth-child(even) { background: var(--gray-50); }

/* Score scale */
.score-scale { display: flex; flex-direction: column; gap: 6px; margin-top: var(--space-md); }
.ss-row { display: grid; grid-template-columns: 120px 100px 1fr; gap: var(--space-md); align-items: center; padding: 10px 16px; border-radius: var(--r-md); font-size: .875rem; }
.ss-excellent { background: var(--green-100); }
.ss-good      { background: #dbeafe; }
.ss-fair      { background: #e0f2fe; }
.ss-low       { background: var(--amber-100); }
.ss-bad       { background: var(--red-100); }
.ss-range     { font-family: 'JetBrains Mono', monospace; font-weight: 600; font-size: .82rem; }
.ss-label     { font-weight: 700; }
.ss-desc      { color: var(--gray-600); font-size: .8rem; }

/* How grid */
.how-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-md); margin-top: var(--space-md); }
@media (max-width: 600px) { .how-grid { grid-template-columns: 1fr; } }
.how-item { background: var(--gray-50); border: 1.5px solid var(--border); border-radius: var(--r-lg); padding: var(--space-lg); text-align: center; }
.how-num  { font-family: 'JetBrains Mono', monospace; font-size: 1.75rem; font-weight: 700; color: var(--blue-500); display: block; margin-bottom: 8px; }
.how-item h3 { font-size: .95rem; margin-bottom: 6px; }
.how-item p  { font-size: .82rem; }

/* ── Guide article ────────────────────────────────────────────────── */
.guide-label-tag {
  display: inline-flex; align-items: center; gap: 6px;
  background: var(--blue-100); color: var(--blue-700);
  font-size: .78rem; font-weight: 700; padding: 4px 14px;
  border-radius: var(--r-pill); margin-bottom: var(--space-sm);
}
.guide-intro {
  background: var(--blue-900); color: var(--white);
  border-radius: var(--r-lg); padding: var(--space-lg) var(--space-xl);
  margin-bottom: var(--space-xl);
}
.guide-intro p { color: rgba(255,255,255,.78); font-size: .95rem; line-height: 1.75; }

.inline-cta-box {
  display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: var(--space-md);
  background: var(--amber-50); border: 1.5px solid var(--amber-400);
  border-radius: var(--r-lg); padding: var(--space-md) var(--space-lg);
  margin: var(--space-xl) 0;
}
.inline-cta-box p { margin: 0; color: var(--gray-800); }

.guide-cta-box {
  background: var(--blue-900); border-radius: var(--r-xl);
  padding: var(--space-xl); text-align: center; margin-top: var(--space-xl);
}
.guide-cta-box h3 { color: var(--white); margin-bottom: var(--space-sm); }
.guide-cta-box p  { color: rgba(255,255,255,.6); margin-bottom: var(--space-lg); }

/* ── Lead form ────────────────────────────────────────────────────── */
.lead-form-section {
  background: linear-gradient(135deg, var(--blue-900) 0%, var(--blue-700) 100%);
  border-radius: var(--r-xl); padding: var(--space-xl);
  margin: var(--space-xl) 0; overflow: hidden; position: relative;
}
.lead-form-section::before {
  content: '';
  position: absolute; top: -50%; right: -10%; width: 300px; height: 300px;
  background: radial-gradient(circle, rgba(245,158,11,.12) 0%, transparent 65%);
}
.lead-form-inner {
  display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-xl);
  align-items: start; position: relative;
}
@media (max-width: 768px) { .lead-form-inner { grid-template-columns: 1fr; } }

.lead-form-copy .section-badge { background: rgba(245,158,11,.2); color: var(--amber-400); border: 1px solid rgba(245,158,11,.3); }
.lead-form-copy h2 { color: var(--white); font-size: 1.4rem; margin-bottom: var(--space-sm); }
.lead-form-copy p  { color: rgba(255,255,255,.7); font-size: .9rem; margin-bottom: var(--space-md); }

.lead-benefits { list-style: none; display: flex; flex-direction: column; gap: 6px; }
.lead-benefits li { display: flex; align-items: center; gap: 8px; font-size: .875rem; color: rgba(255,255,255,.8); }
.check { color: var(--amber-400); font-weight: 700; font-size: 1rem; }

.lead-form-box {
  background: var(--white); border-radius: var(--r-lg); padding: var(--space-lg);
}
.form-note { font-size: .75rem; color: var(--gray-400); margin-top: 10px; text-align: center; }
.form-note a { color: var(--gray-500); }

.lead-success { text-align: center; padding: var(--space-xl) 0; }
.success-icon {
  width: 56px; height: 56px; border-radius: 50%;
  background: var(--green-100); color: var(--green-600);
  font-size: 1.5rem; display: flex; align-items: center; justify-content: center;
  margin: 0 auto var(--space-md);
}
.lead-success h3 { margin-bottom: 8px; }
.lead-success p  { color: var(--gray-500); }

/* ── Footer ───────────────────────────────────────────────────────── */
.site-footer {
  background: var(--blue-900); margin-top: var(--space-3xl);
  border-top: 1px solid rgba(255,255,255,.06);
}
.footer-top {
  display: grid; grid-template-columns: 300px 1fr; gap: var(--space-xl);
  padding: var(--space-3xl) 0 var(--space-xl);
}
@media (max-width: 768px) { .footer-top { grid-template-columns: 1fr; } }

.footer-brand .logo { margin-bottom: var(--space-md); display: inline-flex; }
.footer-brand p      { color: rgba(255,255,255,.5); font-size: .85rem; margin-bottom: var(--space-sm); }
.disclaimer          { font-size: .75rem !important; color: rgba(255,255,255,.3) !important; line-height: 1.5; }

.footer-links { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-lg); }
@media (max-width: 600px) { .footer-links { grid-template-columns: 1fr; } }
.footer-col h4 { color: rgba(255,255,255,.6); font-size: .78rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; margin-bottom: 12px; }
.footer-col ul { list-style: none; display: flex; flex-direction: column; gap: 6px; }
.footer-col ul a { color: rgba(255,255,255,.45); font-size: .85rem; text-decoration: none; transition: color .15s; }
.footer-col ul a:hover { color: var(--amber-400); }

.footer-bottom {
  display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 8px;
  padding: var(--space-md) 0; border-top: 1px solid rgba(255,255,255,.07);
}
.footer-bottom p { color: rgba(255,255,255,.3); font-size: .8rem; }
.footer-bottom a { color: rgba(255,255,255,.3); text-decoration: none; }
.footer-bottom a:hover { color: rgba(255,255,255,.6); }

/* ── Error page ───────────────────────────────────────────────────── */
.error-page { padding: var(--space-3xl) 0; text-align: center; }
.error-inner { max-width: 480px; margin: 0 auto; }
.error-code { font-family: 'JetBrains Mono', monospace; font-size: 6rem; font-weight: 700; color: var(--border); line-height: 1; margin-bottom: var(--space-md); }
.error-links { display: flex; gap: var(--space-sm); justify-content: center; flex-wrap: wrap; margin-top: var(--space-lg); }

/* ── Utility ──────────────────────────────────────────────────────── */
.hidden      { display: none !important; }
.error-msg   { color: var(--red-600); background: var(--red-100); padding: 12px 16px; border-radius: var(--r-md); font-size: .875rem; }
/* =====================================================================
   SIDEBAR MOBİL KESİN ÇÖZÜM
   ===================================================================== */

@media (min-width: 901px) {
  .sidebar {
    position: sticky;
    top: 84px;
    align-self: start;
  }
  .sidebar-toggle { display: none !important; }
  .sidebar-body { display: block !important; }
}

@media (max-width: 900px) {
  /* 1. KAPSAYICIYI ALT ALTA ZORLA */
  .page-layout {
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
  }

  /* 2. ANA İÇERİK TAM GENİŞLİK */
  .page-content {
    width: 100% !important;
    order: 2 !important; /* Alt kısımda durmasını garantiler */
  }

  /* 3. SIDEBAR TAM GENİŞLİK VE EN ÜSTTE (SECTION GİBİ) */
  .sidebar {
    width: 100% !important;
    position: static !important;
    order: 1 !important; /* Ana içeriğin üstüne çıkar */
    margin: 0 !important;
    padding: 0 !important;
  }

  /* BUTON TASARIMI */
  .sidebar-toggle {
    display: flex !important;
    justify-content: space-between;
    align-items: center;
    width: 100% !important;
    padding: 16px 20px !important;
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 10px !important;
    font-size: 16px;
    font-weight: 600;
    color: #0f172a;
    cursor: pointer;
  }

  /* İÇERİK (VARSAYILAN KAPALI) */
  .sidebar-body {
    display: none !important;
    width: 100% !important;
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-top: none !important;
    border-radius: 0 0 10px 10px !important;
    padding: 20px !important;
  }

  /* --- AÇIK (AKTİF) DURUM --- */
  .sidebar.is-open .sidebar-body {
    display: block !important; /* İçeriği gösterir ve sayfa aşağı kayar */
  }

  .sidebar.is-open .sidebar-toggle {
    border-radius: 10px 10px 0 0 !important;
    background: #f8fafc !important;
    border-bottom: 1px solid transparent !important;
  }

  .sidebar.is-open .sidebar-toggle-icon {
    transform: rotate(180deg);
  }
  
  .sidebar-toggle-icon {
    transition: transform 0.3s ease;
  }
}

/* =====================================================================
   YENİ KATMANLAR — contentBuilders.js çıktıları için CSS
   Executive Summary · Analysis Table · Checklist · Trivia · Internal Links · Guide Summary
   ===================================================================== */

/* ── Executive Summary ────────────────────────────────────────────── */
.executive-summary {
  border-radius: var(--r-lg);
  border: 2px solid var(--border);
  padding: var(--space-lg);
  margin-bottom: var(--space-xl);
  background: var(--white);
}
.executive-summary.status-good     { border-color: var(--green-600);  background: var(--green-100); }
.executive-summary.status-medium   { border-color: var(--orange-600); background: var(--orange-100); }
.executive-summary.status-weak     { border-color: var(--amber-600);  background: var(--amber-100); }
.executive-summary.status-critical { border-color: var(--red-600);    background: var(--red-100); }

.summary-header {
  display: flex; align-items: center; justify-content: space-between;
  flex-wrap: wrap; gap: var(--space-sm); margin-bottom: var(--space-md);
}
.summary-badge {
  display: inline-block; font-size: .78rem; font-weight: 700;
  padding: 4px 14px; border-radius: var(--r-pill);
  background: var(--blue-900); color: var(--white);
}
.executive-summary.status-good     .summary-badge { background: var(--green-600); }
.executive-summary.status-medium   .summary-badge { background: var(--orange-600); }
.executive-summary.status-weak     .summary-badge { background: var(--amber-600); color: var(--blue-900); }
.executive-summary.status-critical .summary-badge { background: var(--red-600); }

.summary-prob { font-size: .875rem; color: var(--gray-600); }
.summary-prob strong { font-family: 'JetBrains Mono', monospace; font-size: 1rem; color: var(--blue-900); }

.summary-facts {
  list-style: none; display: flex; flex-direction: column; gap: 4px;
  margin-bottom: var(--space-md);
}
.summary-facts li { font-size: .875rem; color: var(--gray-700); }
.summary-facts strong { color: var(--blue-900); }
.fact-note { font-size: .75rem; color: var(--gray-400); margin-left: 4px; }

.summary-advice {
  font-size: .875rem; color: var(--gray-700);
  background: rgba(255,255,255,.6); border-radius: var(--r-sm);
  padding: var(--space-sm) var(--space-md); margin-bottom: var(--space-sm);
  border-left: 3px solid var(--blue-500);
}
.summary-disclaimer {
  font-size: .75rem; color: var(--gray-400); margin: 0;
}

/* ── Analysis Table (buildLoanTableHtml çıktısı) ──────────────────── */
.table-responsive { overflow-x: auto; margin-top: var(--space-md); }
.analysis-table {
  width: 100%; border-collapse: collapse;
  border: 1px solid var(--border); border-radius: var(--r-md);
  overflow: hidden; font-size: .875rem;
}
.analysis-table thead tr {
  background: var(--blue-900); color: var(--white);
  font-size: .78rem; font-weight: 600; letter-spacing: .02em;
}
.analysis-table thead th {
  padding: 10px 16px; text-align: left; font-weight: 600;
}
.analysis-table tbody tr { border-top: 1px solid var(--gray-100); }
.analysis-table tbody tr:nth-child(even) { background: var(--gray-50); }
.analysis-table tbody td {
  padding: 10px 16px; color: var(--gray-700);
  font-family: 'JetBrains Mono', monospace;
}
.analysis-table tbody td:first-child { font-family: 'Inter', sans-serif; font-weight: 600; color: var(--blue-900); }
.table-disclaimer {
  font-size: .75rem; color: var(--gray-400); margin-top: 8px; line-height: 1.5;
}

/* ── Checklist (getDynamicChecklist çıktısı) ──────────────────────── */
.checklist {
  list-style: none; display: flex; flex-direction: column; gap: 8px;
  margin-top: var(--space-md);
}
.checklist li {
  position: relative; padding: 10px 14px 10px 38px;
  background: var(--white); border: 1.5px solid var(--border);
  border-radius: var(--r-md); font-size: .875rem; color: var(--gray-700);
  line-height: 1.5;
}
.checklist li::before {
  content: '✓'; position: absolute; left: 12px; top: 10px;
  color: var(--green-600); font-weight: 700; font-size: .95rem;
}

/* ── Trivia / E-E-A-T Bilgi Notları ──────────────────────────────── */
.trivia-block {
  background: var(--white);
  border: 1.5px solid var(--border);
  border-radius: var(--r-lg);
  padding: var(--space-lg);
  margin: var(--space-xl) 0;
  border-top: 3px solid var(--blue-500);
}
.trivia-title {
  font-size: .78rem; font-weight: 700;
  color: var(--blue-500); line-height: 1;
  margin-bottom: var(--space-md);
  display: flex; align-items: center; gap: 6px;
  text-transform: uppercase; letter-spacing: .06em;
}
.trivia-card {
  padding: var(--space-md) 0;
  border-bottom: 1px solid var(--gray-100);
}
.trivia-card:last-child { border-bottom: none; padding-bottom: 0; }
.trivia-card:first-child { padding-top: 0; }
.trivia-tag {
  display: inline-block;
  background: var(--blue-100); color: var(--blue-700);
  font-size: .72rem; font-weight: 700;
  padding: 2px 10px; border-radius: var(--r-pill);
  margin-bottom: var(--space-xs); line-height: 1.6;
}
.trivia-text {
  font-size: .875rem; color: var(--gray-700);
  margin: 0; line-height: 1.65;
}

/* ── Internal Links (buildInternalLinksHtml çıktısı) ─────────────── */
.internal-links {
  margin: var(--space-xl) 0;
  border: 1.5px solid var(--border);
  border-radius: var(--r-lg); overflow: hidden;
  background: var(--white);
}
.internal-links-title {
  font-size: .875rem; font-weight: 700; color: var(--gray-500);
  text-transform: uppercase; letter-spacing: .05em;
  padding: var(--space-md) var(--space-lg);
  background: var(--gray-50); border-bottom: 1px solid var(--border);
  margin: 0;
}
.internal-link-group { padding: var(--space-md) var(--space-lg); border-top: 1px solid var(--gray-100); }
.internal-link-group:first-of-type { border-top: none; }
.link-group-title {
  font-size: .72rem; font-weight: 700; color: var(--gray-400);
  text-transform: uppercase; letter-spacing: .06em;
  margin-bottom: 8px;
}
.link-list {
  list-style: none; display: grid; grid-template-columns: 1fr 1fr; gap: 6px;
}
@media (max-width: 600px) { .link-list { grid-template-columns: 1fr; } }
.link-list li a {
  display: block; padding: 7px 12px;
  background: var(--gray-50); border: 1px solid var(--border);
  border-radius: var(--r-sm); font-size: .825rem; color: var(--gray-700);
  text-decoration: none; transition: all .15s;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.link-list li a:hover {
  border-color: var(--blue-400); color: var(--blue-700);
  background: var(--blue-50); text-decoration: none;
}

/* ── Guide Summary Box (guide.ejs summary alanı) ─────────────────── */
.guide-summary-box {
  background: var(--amber-50); border: 1.5px solid var(--amber-400);
  border-radius: var(--r-md); padding: var(--space-md) var(--space-lg);
  margin-bottom: var(--space-lg);
}
.guide-summary-box p {
  font-size: .9rem; color: var(--gray-700); margin: 0; line-height: 1.65;
}