/* US Türk Akademi web sayfaları: ortak görünüm. Renkler uygulamanın
   lacivert/kırmızı kimliğinden; yazı tipi sistemin (dış kaynak yüklenmez). */
:root {
  --lacivert: #12294A;
  --lacivert-acik: #203F6B;
  --kirmizi: #B3263A;
  --kirmizi-koyu: #8E1C2D;
  --zemin: #F5F3EF;
  --kart: #FFFFFF;
  --metin: #23262D;
  --ikincil: #5A6170;
  --cizgi: #E4DFD6;
  --yumusak: #EEF1F6;
  --basari: #1F6B45;
  --basari-zemin: #E6F2EB;
  --hata: #A3212F;
  --hata-zemin: #FBE9EB;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html { -webkit-text-size-adjust: 100%; }
body {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  background: var(--zemin);
  color: var(--metin);
  line-height: 1.6;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}
a { color: var(--kirmizi); }
a:hover { color: var(--kirmizi-koyu); }
a:focus-visible, button:focus-visible, input:focus-visible { outline: 3px solid var(--kirmizi); outline-offset: 2px; }

.ust { background: var(--lacivert); color: #fff; }
.ust-ic { max-width: 760px; margin: 0 auto; padding: 18px 20px; display: flex; align-items: center; gap: 12px; }
.ust img { width: 44px; height: 44px; background: #fff; border-radius: 10px; padding: 4px; }
.ust a { color: #fff; text-decoration: none; font-weight: 700; font-size: 19px; letter-spacing: .2px; }
.ust small { display: block; color: #C9D3E3; font-weight: 400; font-size: 13px; letter-spacing: 0; }

main { flex: 1; width: 100%; max-width: 760px; margin: 0 auto; padding: 28px 20px 40px; }
.kart { background: var(--kart); border: 1px solid var(--cizgi); border-radius: 14px; padding: 32px 28px; }
.kart.dar { max-width: 460px; margin: 24px auto 0; text-align: center; }
h1 { color: var(--lacivert); font-size: 26px; line-height: 1.25; margin-bottom: 6px; text-wrap: balance; }
.tarih { color: var(--ikincil); font-size: 14px; margin-bottom: 24px; }
h2 { color: var(--lacivert); font-size: 18px; margin: 30px 0 10px; padding-bottom: 6px; border-bottom: 1px solid var(--cizgi); }
h3 { color: var(--lacivert); font-size: 15px; margin: 18px 0 6px; }
p, li { font-size: 15px; max-width: 68ch; }
p + p { margin-top: 10px; }
ul, ol { padding-left: 22px; margin-top: 8px; }
li { margin-bottom: 6px; }
.icindekiler { background: var(--yumusak); border-radius: 10px; padding: 14px 18px; font-size: 14px; }
.icindekiler ol { margin-top: 4px; }
.not { background: var(--yumusak); border-left: 4px solid var(--lacivert); border-radius: 8px; padding: 12px 16px; margin-top: 14px; }
.tablo { overflow-x: auto; margin-top: 10px; }
table { border-collapse: collapse; width: 100%; font-size: 14px; }
th, td { text-align: left; vertical-align: top; padding: 10px 12px; border-bottom: 1px solid var(--cizgi); }
th { color: var(--lacivert); background: var(--yumusak); }
.iletisim { background: var(--yumusak); border-radius: 10px; padding: 16px 18px; margin-top: 10px; }
p, li, td, .iletisim { overflow-wrap: anywhere; }

.dugme {
  display: inline-block; width: 100%; padding: 14px 18px; border: 0; border-radius: 10px;
  background: var(--kirmizi); color: #fff; font-size: 16px; font-weight: 700; text-decoration: none;
  cursor: pointer; text-align: center; font-family: inherit;
}
.dugme:hover { background: var(--kirmizi-koyu); color: #fff; }
.dugme:disabled { background: #9AA0AA; cursor: not-allowed; }
.simge { font-size: 40px; line-height: 1; margin-bottom: 12px; }
.alt-metin { color: var(--ikincil); font-size: 14px; margin-top: 14px; }
label { display: block; text-align: left; font-weight: 600; font-size: 14px; margin: 14px 0 6px; }
input[type="password"] {
  width: 100%; padding: 13px 14px; border: 1px solid var(--cizgi); border-radius: 10px;
  font-size: 16px; background: #FBFAF8; font-family: inherit;
}
.mesaj { display: none; margin-top: 16px; padding: 12px 14px; border-radius: 8px; font-size: 14px; text-align: left; }
.mesaj.basari { display: block; background: var(--basari-zemin); color: var(--basari); }
.mesaj.hata { display: block; background: var(--hata-zemin); color: var(--hata); }
.gizli { display: none !important; }
.ozellikler { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; margin-top: 16px; }
.ozellik { background: var(--yumusak); border-radius: 10px; padding: 14px 16px; }
.ozellik b { display: block; color: var(--lacivert); margin-bottom: 4px; }
.ozellik span { font-size: 14px; color: var(--ikincil); }

.alt { border-top: 1px solid var(--cizgi); background: #fff; }
.alt-ic { max-width: 760px; margin: 0 auto; padding: 18px 20px; font-size: 13px; color: var(--ikincil); display: flex; flex-wrap: wrap; gap: 8px 18px; }
.alt-ic a { color: var(--ikincil); }

@media (max-width: 560px) {
  main { padding: 18px 14px 32px; }
  .kart { padding: 22px 18px; }
  h1 { font-size: 22px; }
}
.bosluk { margin-top: 20px; }
