/* page-s3.css — S3 sayfaları (sektörler · güvenlik · yol haritası · durum).
   Tasarım sistemi DEĞİŞMEZ: .section/.container/.head/.mod/.md-* aynen kullanılır;
   burada yalnız bu sayfalara özgü .cz-* / .s3-* sınıfları var. Satır-içi stil YOK (CSP). */
:root{
    --bg:#ffffff;--bg-alt:#FAF7F1;--band:#16120D;--band-text:#F1E9DC;--surface:#ffffff;
    --text:#1A1611;--text-2:#5b5349;--muted:#797165;--line:#ece5d8;--line-strong:#dccfbb;
    --primary:#c04f00;--primary-hover:#a34300;--primary-soft:#fbf0e6;--primary-ink:#ffffff;
    --accent:#F8B800;--gold:#C9A24B;--gold-ink:#8c6d2a;--danger:#E00010;--ring:rgba(192,79,0,.22);
    --radius:12px;--radius-lg:18px;
    --shadow:0 1px 2px rgba(22,18,13,.04), 0 18px 50px -28px rgba(22,18,13,.22);
    --shadow-lg:0 50px 90px -44px rgba(22,18,13,.34);
  }

  /* ── Sektör sayfası: ilgili modül çipleri ─────────────────────────────── */
  .cz-mods{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
  .cz-mod{display:inline-flex;align-items:center;gap:9px;padding:10px 14px;
    border:1px solid var(--line);border-radius:999px;background:var(--surface);
    font-size:.95rem;color:var(--text);transition:border-color .2s,background .2s}
  .cz-mod:hover{border-color:var(--primary);background:var(--primary-soft)}
  .cz-mod__ic{display:inline-flex;color:var(--primary)}
  .cz-mod__go{color:var(--primary);font-family:var(--font-label);opacity:.6}

  /* ── Güvenlik sayfası: konu kartları + kanıt tablosu ─────────────────── */
  .s3-grid{display:grid;gap:18px;margin-top:34px}
  @media (min-width:820px){ .s3-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px} }
  .s3-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);
    padding:22px 24px;box-shadow:var(--shadow)}
  .s3-card__ic{display:inline-flex;color:var(--primary);margin-bottom:12px}
  .s3-card__t{font-size:1.06rem;font-weight:600;letter-spacing:-.01em}
  .s3-card__d{margin-top:9px;color:var(--text-2);font-size:.97rem;line-height:1.65}
  .s3-card ul{margin:12px 0 0;padding-left:0;list-style:none}
  .s3-card li{position:relative;padding-left:22px;margin-top:9px;color:var(--text-2);
    font-size:.94rem;line-height:1.6}
  .s3-card li::before{content:"";position:absolute;left:5px;top:.6em;width:6px;height:6px;
    border-radius:50%;background:var(--primary)}

  .s3-note{margin-top:26px;padding:16px 18px;border-left:3px solid var(--gold);
    background:var(--bg-alt);border-radius:var(--radius);color:var(--text-2);
    font-size:.95rem;line-height:1.65}

  /* ── Yol haritası: durum etiketli liste ──────────────────────────────── */
  .s3-lanes{display:grid;gap:22px;margin-top:34px}
  @media (min-width:900px){ .s3-lanes{grid-template-columns:repeat(3,minmax(0,1fr));gap:26px} }
  .s3-lane__h{display:flex;align-items:center;gap:9px;font-family:var(--font-label);
    font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;color:var(--text-2);
    padding-bottom:10px;border-bottom:1px solid var(--line)}
  .s3-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
  .s3-dot--live{background:#1F8A5B} .s3-dot--dev{background:#C98A1E} .s3-dot--plan{background:var(--muted)}
  .s3-lane ul{margin:0;padding:0;list-style:none}
  .s3-lane li{padding:13px 0;border-bottom:1px solid var(--line);color:var(--text-2);
    font-size:.95rem;line-height:1.6}
  .s3-lane li b{display:block;color:var(--text);font-weight:600;font-size:.99rem}

  /* Değişiklik günlüğü */
  .s3-log{margin-top:30px}
  .s3-log__i{display:grid;gap:6px;padding:18px 0;border-bottom:1px solid var(--line)}
  @media (min-width:760px){ .s3-log__i{grid-template-columns:150px minmax(0,1fr);gap:24px} }
  .s3-log__d{font-family:var(--font-mono);font-size:.8rem;color:var(--text-2)}
  .s3-log__t{font-weight:600;font-size:1rem;color:var(--text)}
  .s3-log__x{margin-top:6px;color:var(--text-2);font-size:.95rem;line-height:1.65}

  /* ── Durum sayfası: canlı kontrol satırları ──────────────────────────── */
  /* KURAL: küçük (<14px) açıklama metinlerinde --muted KULLANMA — beyaz zeminde 3,4:1
     kalır ve WCAG AA'yı (4,5:1) geçmez. Bu sayfalarda --text-2 kullanılır. */
  .s3-status{margin-top:32px;border:1px solid var(--line);border-radius:var(--radius-lg);
    overflow:hidden;background:var(--surface);box-shadow:var(--shadow)}
  .s3-row{display:flex;align-items:center;justify-content:space-between;gap:16px;
    padding:16px 20px;border-bottom:1px solid var(--line)}
  .s3-row:last-child{border-bottom:0}
  .s3-row__n{font-weight:600;font-size:.99rem}
  .s3-row__d{margin-top:4px;color:var(--text-2);font-size:.86rem}
  .s3-badge{display:inline-flex;align-items:center;gap:7px;flex-shrink:0;
    font-family:var(--font-label);font-size:.78rem;font-weight:600;padding:5px 12px;
    border-radius:999px}
  .s3-badge--ok{color:#166b47;background:rgba(31,138,91,.12)}
  .s3-badge--warn{color:#8a5e10;background:rgba(201,138,30,.14)}
  .s3-badge--down{color:#a3000c;background:rgba(224,0,16,.1)}
  .s3-badge--wait{color:var(--text-2);background:rgba(147,138,125,.18)}
  .s3-counters{display:grid;gap:14px;margin-top:26px}
  @media (min-width:700px){ .s3-counters{grid-template-columns:repeat(4,minmax(0,1fr))} }
  .s3-counter{border:1px solid var(--line);border-radius:var(--radius);padding:16px 18px;
    background:var(--bg-alt)}
  .s3-counter__v{font-size:1.5rem;font-weight:600;font-family:var(--font-display);
    letter-spacing:-.02em}
  .s3-counter__l{margin-top:4px;font-size:.84rem;color:var(--text-2)}

  /* Son kontrol zaman damgası — küçük metin, kontrast için --text-2 (bkz. yukarıdaki kural) */
  .s3-checked{margin-top:12px;font-family:var(--font-label);font-size:.78rem;color:var(--text-2)}