/* Pharmesin tanıtım sitesi (pharmesin.eczcollect.com). Tasarım yönü 3 «Güven önce» (AİK-0131). Dış yazı tipi yok: ziyaretçinin
   adresi kimseye gitmesin diye işletim sisteminin yazı tipleri. */
:root {
  --zemin: #f2f4f6; --yuzey: #ffffff; --metin: #14202b; --ikincil: #3c4a57; --soluk: #5a6875; --cizgi: #d6dde3; --cizgi-koyu: #c3ccd4;
  --yesil: #17603d; --yesil-koyu: #0f4529; --yesil-zemin: #eef6f1; --yesil-metin: #2f4a3b; --serit: #14202b; --serit-metin: #eef2f5;
  --serit-soluk: #b9c4ce; --serit-dugme: #6fd19c; --serit-dugme-metin: #0b1f14; --serit-cizgi: #46545f; --dugme-metin: #ffffff;
  --para: #e3f3ea; --para-b: #145c39; --para-m: #24453a; --depo: #fbeedd; --depo-b: #8a4a08; --depo-m: #4f3a22;
  --stok: #e3edf8; --stok-b: #1f5590; --stok-m: #23384f; --denetim: #f4e6f0; --denetim-b: #6a2f5a; --denetim-m: #46283d;
  --rapor: #e7ebf2; --rapor-b: #3d4b69; --rapor-m: #2e3647; --eczacilik: #f6e7e9; --eczacilik-b: #7a1f2b; --eczacilik-m: #4a262b;
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root {
    --zemin: #0f1418; --yuzey: #182027; --metin: #e6ecf1; --ikincil: #b6c2cc; --soluk: #95a3af; --cizgi: #2b353e; --cizgi-koyu: #3a4651;
    --yesil: #5fc48f; --yesil-koyu: #86d9ad; --yesil-zemin: #15281e; --yesil-metin: #b9dcc8; --serit: #1d2a35; --serit-cizgi: #4b5a66; --dugme-metin: #0b1f14;
    --para: #16271e; --para-b: #8fd8b0; --para-m: #c4dccf; --depo: #2a2116; --depo-b: #f0b673; --depo-m: #e1cfb8;
    --stok: #17222f; --stok-b: #8dbcf0; --stok-m: #c3d3e6; --denetim: #2a1b26; --denetim-b: #e3a8d2; --denetim-m: #e2cbdb;
    --rapor: #1c212b; --rapor-b: #b0bedb; --rapor-m: #cfd6e3; --eczacilik: #2b1b1e; --eczacilik-b: #f0a3ad; --eczacilik-m: #e6cdd0;
    color-scheme: dark;
  }
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--zemin); color: var(--metin); font: 17px/1.6 "Segoe UI Variable Text", "Segoe UI", -apple-system,
  BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", Arial, sans-serif; -webkit-text-size-adjust: 100%; }
a { color: var(--yesil); } a:hover { color: var(--yesil-koyu); }
.kap { max-width: 1120px; margin: 0 auto; padding: 0 24px; }
@media (max-width: 560px) { .kap { padding: 0 16px; } }

.ust { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 32px; padding-top: 20px; padding-bottom: 20px; }
.marka { display: flex; align-items: center; gap: 10px; text-decoration: none; color: var(--metin); font-weight: 800; font-size: 20px; }
.marka img { width: 36px; height: 36px; display: block; }
.ust nav { display: flex; flex-wrap: wrap; gap: 4px 24px; flex: 1 1 auto; justify-content: flex-end; align-items: center; font-size: 15px; font-weight: 500; }
.ust nav a { color: var(--ikincil); text-decoration: none; padding: 10px 0; }
.ust nav a:hover { color: var(--metin); }

.dugme { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 12px 26px; border-radius: 999px;
  font-weight: 700; text-decoration: none; border: 1.5px solid transparent; }
.dugme.dolu { background: var(--yesil); color: var(--dugme-metin); }
.dugme.dolu:hover { background: var(--yesil-koyu); color: var(--dugme-metin); }
.dugme.cizgili { color: var(--metin); border-color: var(--cizgi-koyu); }
.dugme.cizgili:hover { border-color: var(--metin); color: var(--metin); }
.ust nav .dugme { min-height: 44px; padding: 8px 18px; color: var(--dugme-metin); }
.dugmeler { display: flex; flex-wrap: wrap; gap: 12px; }

.giris { padding-top: 64px; padding-bottom: 40px; }
.giris h1 { margin: 0 0 24px; font-weight: 800; font-size: clamp(44px, 8vw, 92px); line-height: 1; letter-spacing: -.035em; }
.giris .alt { display: flex; flex-wrap: wrap; gap: 24px 48px; align-items: flex-end; }
.giris .alt p { flex: 1 1 420px; min-width: 0; margin: 0; font-size: 20px; color: var(--ikincil); }
.giris .surum { margin: 20px 0 0; font-size: 14px; color: var(--soluk); }

.akis-kutu { background: var(--yuzey); border-radius: 24px; padding: 40px 32px; display: flex; flex-wrap: wrap; align-items: stretch;
  justify-content: center; gap: 16px; }
.dugum { flex: 1 1 200px; min-width: 0; border: 1.5px solid var(--cizgi); border-radius: 16px; padding: 20px; }
.dugum.orta { flex: 1.4 1 260px; border: 2px solid var(--yesil); background: var(--yesil-zemin); }
.dugum .tur { font-size: 14px; font-weight: 700; color: var(--soluk); }
.dugum.orta .tur { color: var(--yesil); }
.dugum .ad { font-weight: 700; font-size: 18px; margin-top: 4px; }
.dugum.orta .ad { font-weight: 800; font-size: 20px; }
.dugum .acik { color: var(--soluk); font-size: 14px; margin-top: 6px; }
.dugum.orta .acik { color: var(--yesil-metin); }
.ok { flex: 0 0 auto; display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 0 4px;
  color: var(--yesil); font-size: 13px; font-weight: 700; }
.ok svg { width: 48px; height: 16px; }
@media (max-width: 700px) { .ok { flex-basis: 100%; flex-direction: row-reverse; gap: 10px; } .ok svg { width: 16px; height: 32px; transform: rotate(90deg); }
  .akis-kutu { padding: 24px 16px; } }
.akis-not { margin: 16px 8px 0; color: var(--soluk); font-size: 15px; }

section.bolum { padding-top: 96px; }
h2 { margin: 0 0 32px; font-weight: 800; font-size: clamp(30px, 4vw, 46px); line-height: 1.1; letter-spacing: -.025em; }
.kartlar { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 16px; }
.kart { border-radius: 20px; padding: 28px; }
.kart h3 { margin: 0 0 8px; font-size: 20px; }
.kart p { margin: 0; font-size: 15px; }
.kart.para { background: var(--para); } .kart.para h3 { color: var(--para-b); } .kart.para p { color: var(--para-m); }
.kart.depo { background: var(--depo); } .kart.depo h3 { color: var(--depo-b); } .kart.depo p { color: var(--depo-m); }
.kart.stok { background: var(--stok); } .kart.stok h3 { color: var(--stok-b); } .kart.stok p { color: var(--stok-m); }
.kart.denetim { background: var(--denetim); } .kart.denetim h3 { color: var(--denetim-b); } .kart.denetim p { color: var(--denetim-m); }
.kart.rapor { background: var(--rapor); } .kart.rapor h3 { color: var(--rapor-b); } .kart.rapor p { color: var(--rapor-m); }
.kart.eczacilik { background: var(--eczacilik); } .kart.eczacilik h3 { color: var(--eczacilik-b); } .kart.eczacilik p { color: var(--eczacilik-m); }

.sorular { max-width: 820px; }
details { border-top: 1px solid var(--cizgi); padding: 18px 0; }
details:last-of-type { border-bottom: 1px solid var(--cizgi); }
summary { cursor: pointer; font-weight: 700; font-size: 18px; min-height: 28px; }
details p { margin: 10px 0 0; color: var(--ikincil); }

.serit { background: var(--serit); color: var(--serit-metin); border-radius: 28px; padding: 48px 40px; display: flex; flex-wrap: wrap;
  gap: 32px; align-items: center; }
@media (max-width: 560px) { .serit { padding: 32px 20px; } }
.serit > div:first-child { flex: 1 1 420px; min-width: 0; }
.serit h2 { margin: 0 0 8px; font-size: clamp(28px, 3.2vw, 40px); }
.serit p { margin: 0; color: var(--serit-soluk); font-size: 15px; }
.serit .saglama { margin-top: 4px; font-size: 13px; overflow-wrap: anywhere; font-family: ui-monospace, "Cascadia Mono", Consolas, monospace; }
.serit .dugme.dolu { background: var(--serit-dugme); color: var(--serit-dugme-metin); }
.serit .dugme.dolu:hover { filter: brightness(1.08); }
.serit .dugme.cizgili { color: var(--serit-metin); border-color: var(--serit-cizgi); }
.serit .dugme.cizgili:hover { border-color: var(--serit-metin); }

.pilot { display: flex; flex-wrap: wrap; gap: 40px; align-items: flex-start; padding-bottom: 96px; }
.pilot > div { flex: 1 1 360px; min-width: 0; }
.pilot p { margin: 0 0 16px; color: var(--ikincil); }
.kosullar { flex: 1 1 420px; min-width: 0; background: var(--yuzey); border-radius: 20px; padding: 28px; }
.kosullar ul { margin: 0 0 24px; padding: 0; list-style: none; display: grid; gap: 14px; }
.kosullar li { padding-left: 28px; position: relative; color: var(--ikincil); }
.kosullar li b { color: var(--metin); }
.kosullar li::before { content: ""; position: absolute; left: 4px; top: .55em; width: 10px; height: 10px; border-radius: 50%; background: var(--yesil); }
.kosullar .not { font-size: 14px; color: var(--soluk); margin: 12px 0 0; }

footer { border-top: 1px solid var(--cizgi); }
footer .kap { padding-top: 28px; padding-bottom: 28px; display: flex; flex-wrap: wrap; gap: 12px 28px; font-size: 14px; color: var(--soluk); }
footer a { color: var(--soluk); }

/* Kurulum sayfası: kılavuzun «Kurulum» bölümü (docs/kilavuz/01-kurulum.md). */
.kilavuz { background: var(--yuzey); border-radius: 24px; padding: 40px; margin: 24px auto 96px; max-width: 900px; }
@media (max-width: 560px) { .kilavuz { padding: 24px 16px; } }
.kilavuz h1 { margin: 0 0 16px; font-weight: 800; font-size: clamp(34px, 5vw, 52px); letter-spacing: -.03em; line-height: 1.05; }
.kilavuz h2 { margin: 40px 0 12px; font-size: 26px; }
.kilavuz p, .kilavuz li { color: var(--ikincil); }
.kilavuz b { color: var(--metin); }
.kilavuz code { background: var(--zemin); border-radius: 6px; padding: 1px 6px; font-size: .9em; overflow-wrap: anywhere;
  font-family: ui-monospace, "Cascadia Mono", Consolas, monospace; }
.kilavuz .tablo { overflow-x: auto; }
.kilavuz table { border-collapse: collapse; width: 100%; font-size: 15px; margin: 8px 0 16px; }
.kilavuz th { text-align: left; background: var(--yesil-zemin); color: var(--yesil); padding: 10px 12px; }
.kilavuz td { border-bottom: 1px solid var(--cizgi); padding: 10px 12px; vertical-align: top; color: var(--ikincil); }
.kilavuz td:first-child { white-space: nowrap; font-weight: 600; color: var(--metin); }
@media (max-width: 700px) { .kilavuz td:first-child { white-space: normal; } }
.geri { margin: 32px 0 0; }
.gizli-baslik { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; margin: 0; }