/* ---------------------------------------------------------------------------
   Temel katman — govde, tipografi ve erisilebilirlik varsayilanlari.
--------------------------------------------------------------------------- */

/* KUTU MODELI SIFIRLAMASI.
   Bu kural EKSIKTI ve tema CSS'i baştan sona border-box VARSAYARAK yazilmis:
   19 ayri yerde "width: 100%" ile ic bosluk birlikte kullaniliyor. content-box
   varsayilaninda bunlarin hepsi ic bosluk + kenarlik kadar tasar.

   Somut belirti: popup form alanlari "width: 100%" (=290px) + 32px ic bosluk
   + 2px kenarlik = 324px olup kutunun sagindan 9px disari tasiyordu.

   Sifirlama tek yerde yapilir; boylece yeni bir bilesen yazan kisinin her
   seferinde box-sizing yazmasi gerekmez. */
*,
*::before,
*::after {
  box-sizing: border-box;
}

body {
  background: #fff;
  color: var(--ar-ink);
  /* Kenardan kenara bolumler (bkz. components/hero.css) 100vw kullanir;
     kaydirma cubugu genisligi kadar tasmayi kirp. "clip", "hidden"in aksine
     yapiskan basligi bozmaz. */
  overflow-x: clip;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--ar-font-heading);
}

/* Klavyeyle gezinenler icin gorunur odak halkasi. */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
  outline: 2px solid var(--ar-midnight);
  outline-offset: 2px;
  border-radius: var(--ar-radius-sm);
}

/* "Icerige atla" baglantisi — sadece odaklandiginda gorunur. */
.skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 999;
  background: var(--ar-navy);
  color: #fff;
  padding: 12px 20px;
  border-radius: 0 0 var(--ar-radius-md) 0;
}

.skip-link:focus {
  left: 0;
}

img {
  max-width: 100%;
  height: auto;
}

/* Kenar boslugu (gutter).
   Sayfa govdesindeki ust duzey bolumler dar ekranlarda ekran kenarina
   yapismasin. theme.json'daki kok dolgusu sadece sablon sarmalayicilarina
   uygulandigi icin, icerik icine dogrudan yerlestirilen bolumler (hero, CTA
   bantlari, desenler) burada ele aliniyor. */
.wp-site-blocks > .wp-block-group.is-layout-constrained,
.wp-site-blocks > .wp-block-columns,
.ar-section-alt {
  padding-left: var(--ar-space-md);
  padding-right: var(--ar-space-md);
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* =========================================================================
   PANELDEN TİPOGRAFİ (Tema Ayarları > Tipografi)
   -------------------------------------------------------------------------
   Değişken tanımlıysa panelden gelen değer, değilse mevcut ölçek
   geçerli. Ayar boş bırakıldığında değişken HİÇ basılmaz — bu yüzden
   var(--x, yedek) kalıbı güvenli.

   Başlıklarda clamp() korunuyor: sabit piksel dar ekranda taşıyor.
   Panelden verilen değer clamp'in ÜST SINIRI olur.
   ========================================================================= */

body {
  font-size: var(--ar-govde-punto, 1.0625rem);
  line-height: var(--ar-govde-satir, 1.75);
}

h1, .ar-h1 {
  font-size: clamp(1.9rem, 5vw, var(--ar-h1, 3.25rem));
  font-weight: var(--ar-baslik-kalinlik, 700);
}

h2, .ar-h2 {
  font-size: clamp(1.5rem, 3.6vw, var(--ar-h2, 2.25rem));
  font-weight: var(--ar-baslik-kalinlik, 700);
}

h3, .ar-h3 {
  font-size: clamp(1.125rem, 2.2vw, var(--ar-h3, 1.375rem));
  font-weight: var(--ar-baslik-kalinlik, 600);
}