:root {
    --kagit: #F7F1E6;
    --murekkep: #241016;
    --govde: #3B2A24;
    --altin: #9A6B2F;
    --cizgi: #DCCDB4;
    --kutu: #EFE4D2;
  }
  @media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) {
      --kagit: #1C0E14;
      --murekkep: #F7E9DC;
      --govde: #DFCDBE;
      --altin: #E8B979;
      --cizgi: #3D2A30;
      --kutu: #2A1720;
    }
  }
  :root[data-theme="dark"] {
    --kagit: #1C0E14;
    --murekkep: #F7E9DC;
    --govde: #DFCDBE;
    --altin: #E8B979;
    --cizgi: #3D2A30;
    --kutu: #2A1720;
  }
  * { box-sizing: border-box; }
  body {
    margin: 0;
    background: var(--kagit);
    color: var(--govde);
    font: 16px/1.72 Georgia, "Times New Roman", serif;
    -webkit-text-size-adjust: 100%;
  }
  .sayfa { max-width: 760px; margin: 0 auto; padding: 48px 16px 96px; }
  header { border-bottom: 1px solid var(--cizgi); padding-bottom: 22px; margin-bottom: 30px; }
  .ust { font: 12px/1 system-ui, sans-serif; letter-spacing: .22em;
         text-transform: uppercase; color: var(--altin); margin: 0 0 14px; }
  h1 { font-size: 1.85rem; line-height: 1.2; color: var(--murekkep); margin: 0 0 10px; font-weight: 600; }
  .tarih { font: 13px/1.5 system-ui, sans-serif; color: var(--altin); margin: 0; }
  h2 { font-size: 1.16rem; color: var(--murekkep); margin: 38px 0 12px; font-weight: 600; }
  h3 { font-size: 1rem; color: var(--murekkep); margin: 24px 0 8px; font-weight: 600; }
  p, li { margin: 0 0 13px; }
  ul { padding-left: 22px; margin: 0 0 16px; }
  a { color: var(--altin); }
  strong { color: var(--murekkep); }
  .kutu {
    background: var(--kutu); border: 1px solid var(--cizgi);
    border-radius: 12px; padding: 18px 20px; margin: 22px 0;
  }
  .kutu p:last-child, .kutu ul:last-child { margin-bottom: 0; }
  table { width: 100%; border-collapse: collapse; margin: 16px 0 20px;
          font: 14px/1.55 system-ui, sans-serif; }
  th, td { text-align: left; vertical-align: top; padding: 9px 10px;
           border-bottom: 1px solid var(--cizgi); }
  th { color: var(--murekkep); font-weight: 600; }
  footer { margin-top: 46px; padding-top: 20px; border-top: 1px solid var(--cizgi);
           font: 13px/1.6 system-ui, sans-serif; color: var(--altin); }
  /* Dar ekranda tablo satırları karta dönüşür: üç sütunluk metin
     telefonda yatay kaydırma üretiyordu. */
  @media (max-width: 560px) {
    table, tbody, tr, td { display: block; width: 100%; }
    .baslik { display: none; }
    tr {
      border: 1px solid var(--cizgi); border-radius: 10px;
      padding: 4px 12px 8px; margin: 0 0 12px; background: var(--kutu);
    }
    td { border: 0; padding: 8px 0 0; }
    td::before {
      content: attr(data-etiket);
      display: block; margin-bottom: 2px;
      font-size: 11px; letter-spacing: .12em; text-transform: uppercase;
      color: var(--altin);
    }
  }
  @media (max-width: 480px) {
    .sayfa { padding: 30px 16px 70px; }
    h1 { font-size: 1.5rem; }
  }
  /* Destek ve tanıtım sayfalarına özgü */
  .soru { border-bottom: 1px solid var(--cizgi); padding: 0 0 4px; margin: 0 0 18px; }
  .soru:last-child { border-bottom: 0; }
  .baglar { display: flex; flex-wrap: wrap; gap: 10px; margin: 26px 0 0;
            font: 14px/1 system-ui, sans-serif; }
  .bag { display: inline-block; padding: 11px 16px; border: 1px solid var(--cizgi);
         border-radius: 999px; text-decoration: none; background: var(--kutu); }
  .fallar { list-style: none; padding: 0; columns: 2; column-gap: 26px; }
  .fallar li { break-inside: avoid; padding-left: 16px; position: relative; }
  .fallar li::before { content: "·"; position: absolute; left: 3px; color: var(--altin); }
  @media (max-width: 480px) { .fallar { columns: 1; } }