/* ==========================================================================
   GAZALI AVIATION — form-bolum.css
   FORM BÖLÜMÜNÜN YERLEŞİMİ — masaüstünde iki sütun, telefonda tek sütun.

   Macit isteği 2026-10-09 (aynen): "telefonda tek sutun da pc de bunu çift
   sutunlu yapalım bence düzelt. teklif formlarını felan." Uçak satış
   detayındaki talep formu 1890 px ekranda 820 px'lik dar kapta ortalı
   duruyordu (başlık + form tek sütun), iki yanı boştu.

   TEK KAYNAK — yükleyen sayfalar ($sayfaCss 'form-bolum'):
     uçak satışı liste + detay (ucakSatisi/UcakSatisiForm.php)
     motor/APU liste + detay  (motorApu/MotorApuForm.php)
     iletişim                 (iletisim/IletisimView.php)
     kiralama sihirbazı       (teklif/TeklifView.php — --form-once)
   Parça sepeti (modal) KULLANMAZ: sepet bir bölüm değil, sayfanın üstüne
   açılan tek kaydırma alanlı bir penceredir (CLAUDE.md "Teklif sepeti
   modalı"); iki sütun orada formu yarıya böler.

   İŞARETLEME
     <div class="container form-bolum">
       <div class="form-bolum__bas">     .section-head (+ core/form-bilgi.php)
       <div class="form-bolum__icerik">  Form::sonucKutusu() + <form>
     Sihirbaz: <div class="container form-bolum form-bolum--form-once">
       <div class="form-bolum__icerik">  sonuç kutusu + sihirbaz
       <div class="form-bolum__yan">     güvence kartları + core/form-bilgi.php

   ⚠ DOM SIRASI = GÖRSEL SIRA = ODAK SIRASI. Sütunlar order / grid-area ile
     yer DEĞİŞTİRMEZ. Satış, motor ve iletişimde başlık önce (başlangıç
     sütunu), form sonra. Sihirbazda form önce: /teklif'in başlığı
     page-hero'dadır, bölüm doğrudan formla açılır ve telefonda güvence
     kartları formun ALTINDADIR (bugünkü sıra) — bu yüzden ayrı bir
     değiştirici (--form-once), aynı ızgara.
   ⚠ RTL: ızgara sütunları yazı yönünde akar, Arapçada kendiliğinden
     aynalanır (başlık sağda, form solda). Fiziksel left/right YOK.
   ⚠ < 992 px BUGÜNKÜ GÖRÜNÜM: tek sütun, dar kap (--container-narrow, eski
     .container--narrow). Başlık ile form arası eskiden .section-head'in alt
     boşluğuydu (clamp(2.5rem, 5vw, 4rem)); şimdi ızgara aralığı, aynı
     değer — başlığın kendi alt boşluğu bu kapta 0. .form-bilgi telefonda
     GİZLİ: başlık ile form arasına yeni bir blok girmez (numara ve adres
     altbilgide de var).
   ⚠ SÜTUN ORANI 1 : 2.2 — formun İÇİ ≥ ~520 px kalsın: formun kendi alan
     ızgarası (.form-grid, main.css) iki sütun için 2 × 15rem + 1.25rem =
     500 px ister. Ölçüldü (görünüm genişliği → form kartı / içi, px; üç
     dilde aynı): 992 → 600 / 529 · 1024 → 620 / 546 · 1100 → 666 / 587 ·
     1280 → 724 / 632 · 1440 → 719 / 621 · 1890 → 710 / 612. Windows'un
     17 px kaydırma çubuğuyla 992'de ~590 / 519. Eski dar kapta kart 741
     (992) / 724 (≥ 1024) px idi: form neredeyse aynı genişlikte kaldı,
     başlık yanına geçti.
   ========================================================================== */

.form-bolum {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  row-gap: clamp(2.5rem, 5vw, 4rem);
  max-width: var(--container-narrow);
}

/* Sihirbaz: sihirbaz ile güvence kartları arası eskiden kartların .mt-3'ü
   (3rem) idi — telefonda aynı boşluk. */
.form-bolum--form-once {
  row-gap: 3rem;
}

/* Başlığın alt boşluğu ızgara aralığına devredildi (yukarıda). */
.form-bolum .section-head {
  margin-bottom: 0;
}

/* Doğrudan ulaşım bilgisi (core/form-bilgi.php) — yalnız masaüstünde. */
.form-bilgi {
  display: none;
}

@media (min-width: 992px) {

  .form-bolum {
    max-width: var(--container);
    grid-template-columns: minmax(0, 1fr) minmax(0, 2.2fr);
    column-gap: clamp(2.5rem, 4vw, 4.5rem);
    align-items: start;
  }

  .form-bolum--form-once {
    grid-template-columns: minmax(0, 2.2fr) minmax(0, 1fr);
  }

  /* Başlık başlangıç sütununda: ortalı değil, yazı yönüne yaslı; çizgili
     üst etiket iletişim sayfasının sol sütunuyla aynı görünür.
     ⚠ h2 --step-3: --step-4 (52 px) dar sütunda "satıyorsunuz?" gibi tek
       sözcüğü sütundan taşırıyordu (sözcük bölünmez). */
  .form-bolum .section-head--center {
    max-width: none;
    margin-inline: 0;
    text-align: start;
  }

  .form-bolum .eyebrow--center::before {
    display: block;
  }

  .form-bolum .section-head h2 {
    font-size: var(--step-3);
  }

  /* ---- Doğrudan ulaşım bilgisi ----
     Renkler jeton; kontrast GERÇEK PİKSELDEN (1440 px ekran görüntüsü,
     beyaz / --paper bölüm):
       etiket ve ofis adı --slate-600 7.53 / 7.14:1
       bağlantı --ink 18.17 / 17.22:1 · üzerine gelince --gold-700
       5.02 / 4.76:1 + alt çizgi (renk tek işaret değil). */
  .form-bilgi {
    display: block;
    margin-top: 2rem;
    padding-top: 1.75rem;
    border-top: 1px solid var(--line);
  }

  .form-bilgi__ust {
    margin-bottom: 1rem;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--slate-600);
  }

  .form-bilgi__liste {
    display: grid;
    gap: 1.125rem;
    margin: 0;
    padding: 0;
    list-style: none;
  }

  .form-bilgi__liste > li {
    display: grid;
    grid-template-columns: 2.5rem minmax(0, 1fr);
    column-gap: 0.875rem;
    align-items: start;
  }

  .form-bilgi__ikon {
    display: grid;
    place-items: center;
    width: 2.5rem;
    height: 2.5rem;
    color: var(--gold-700);
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
  }

  .form-bilgi__ikon svg {
    width: 1.125rem;
    height: 1.125rem;
  }

  .form-bilgi__ad {
    display: block;
    margin-bottom: 0.125rem;
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--slate-600);
  }

  /* Numara + ofis adı tek satırda; sığmazsa ofis adı alta iner. Numara
     dir="ltr" ile yalıtılır (Arapçada rakam grupları ters dizilmez). */
  .form-bilgi__hat {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    column-gap: 0.5rem;
    line-height: 1.6;
  }

  .form-bilgi__hat > span {
    font-size: 0.8125rem;
    color: var(--slate-600);
  }

  .form-bilgi a {
    font-weight: 600;
    color: var(--ink);
    text-decoration: none;
    overflow-wrap: anywhere;
  }

  .form-bilgi a:hover {
    color: var(--gold-700);
    text-decoration: underline;
  }
}

/* ---- Yapışkan başlık / yan sütun ----
   Form uzun (satış ~1.300 px, motor ~1.500 px): başlık ve doğrudan ulaşım
   bilgisi form doldurulurken görünür kalsın.
   ⚠ YALNIZ SIĞDIĞINDA: sütun ekrandan uzunsa yapışkan öğenin alt kısmı
     bölüm bitene dek hiç görünmez. Gereken görünüm yüksekliği = üst boşluk
     (--header-h 84 + 24 = 108 px) + sütunun boyu. Ölçülen en uzun sütun
     (3 dil × 992–1890 px): satış 569 · motor 621 → __bas eşiği 760 px;
     sihirbazın yanı 665 (EN, 992 px) → __yan eşiği 800 px. İletişim
     sayfasının sol sütunu 799 px (dört iletişim kalemi + NCAGE): orada
     yapışkan YOK (--akis). Hareket yok: prefers-reduced-motion'a konu değil.
   ⚠ Sözlük ya da iletişim bilgisi uzarsa sütun boyu yeniden ölçülür. */
@media (min-width: 992px) and (min-height: 760px) {

  .form-bolum__bas {
    position: sticky;
    top: calc(var(--header-h) + 1.5rem);
  }

  .form-bolum--akis .form-bolum__bas {
    position: static;
  }
}

@media (min-width: 992px) and (min-height: 800px) {

  .form-bolum__yan {
    position: sticky;
    top: calc(var(--header-h) + 1.5rem);
  }
}