/* Ortak bileşen biçimleri (yer tutucu; site tasarımları Plan 2'de). Renkler ve
   ölçüler yalnız token'dan (sites/<anahtar>/tokens.css); ham renk yok. */
*, *::before, *::after { box-sizing: border-box; }
/* hidden özniteliği .dugme, .tesekkur gibi display veren sınıflara yenilmesin
   (yoksa teşekkür kutusu ve araç düğmeleri JavaScript'ten önce görünür). */
[hidden] { display: none !important; }
body {
  margin: 0;
  font-family: var(--yazi);
  font-size: var(--yazi-govde);
  line-height: var(--satir);
  color: var(--renk-metin);
  background: var(--renk-zemin);
}
a { color: var(--renk-ana); }
.ust, .okuma, .altbilgi { max-width: var(--okuma); margin: 0 auto; padding: var(--bosluk); }
.kelime-isareti { display: inline-flex; align-items: center; min-height: var(--dokunma); font-weight: 800; text-decoration: none; }
.dugme {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: var(--dokunma);
  min-width: var(--dokunma);
  padding: 0 calc(var(--bosluk) * 1.25);
  border: 0;
  border-radius: var(--kose);
  background: var(--renk-vurgu);
  color: var(--renk-dugme-metin);
  font: inherit;
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
}
.dugme:disabled { opacity: 0.6; cursor: wait; }
.dugme.ikincil { background: transparent; color: var(--renk-ana); border: 1px solid var(--renk-cizgi); }
.indir, .tesekkur { display: flex; flex-wrap: wrap; gap: var(--bosluk); margin: var(--bosluk) 0; }
.tesekkur p { flex-basis: 100%; margin: 0; }
.sss details { border-top: 1px solid var(--renk-cizgi); }
.sss summary { min-height: var(--dokunma); padding: calc(var(--bosluk) / 2) 0; cursor: pointer; font-weight: 600; }

/* Reklam yuvası: yükseklik bilerek sabittir. Worker (Task 7) yayındaki reklamı
   yuvaya istek anında koyar; yükseklik içeriğe göre değişseydi reklam gelince ya da
   giderken sayfa kayardı (CLS). Değerler varsayılan sponsorlu kartın (etiket + bir
   cümle + 44px düğme) her kesme noktasında ölçülen yüksekliğinden biraz büyüktür;
   kart metni değişirse yeniden ölçülür. */
.reklam { display: block; overflow: hidden; margin: calc(var(--bosluk) * 2) 0; border: 1px solid var(--renk-cizgi); border-radius: var(--kose); background: var(--renk-yuzey); }
.reklam-ana-bant { height: var(--yuva-ana-bant); }
.reklam-yan-kart { height: var(--yuva-yan-kart); }
@media (min-width: 600px) { .reklam-ana-bant { height: var(--yuva-ana-bant-600); } }
@media (min-width: 900px) { .reklam-ana-bant { height: var(--yuva-ana-bant-900); } }
.sponsorlu { display: flex; flex-direction: column; align-items: flex-start; gap: calc(var(--bosluk) / 2); padding: var(--bosluk); }
.sponsorlu p { margin: 0; }
.reklam-etiket { font-size: 0.8125rem; color: var(--renk-soluk); }

/* Form: alanlar 16px'ten küçük olmaz (iOS yakınlaştırması), dokunma hedefi 44px. */
.basvuru form { display: grid; gap: calc(var(--bosluk) / 2); }
.basvuru label { font-weight: 600; }
.basvuru input, .basvuru select {
  min-height: var(--dokunma);
  padding: 0 calc(var(--bosluk) / 2);
  font: inherit;
  font-size: var(--yazi-form);
  color: var(--renk-metin);
  background: var(--renk-zemin);
  border: 1px solid var(--renk-soluk);
  border-radius: var(--kose);
}
.basvuru .onay { display: flex; gap: calc(var(--bosluk) / 2); align-items: flex-start; }
.basvuru .onay input { flex: 0 0 var(--dokunma); min-height: var(--dokunma); margin: 0; }
.basvuru .onay label { font-weight: 400; }
.form-uyari { margin: 0; }
.form-hata { margin: 0; color: var(--renk-hata); font-weight: 600; }
.bal { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }

.altbilgi { color: var(--renk-soluk); border-top: 1px solid var(--renk-cizgi); }
.altbilgi a { display: inline-flex; align-items: center; min-height: var(--dokunma); }