/* Arcates — bolum basliklari ve metrik bandi. Referans B3.
 *
 * Bolum stillerinin SON katmani: `HomeController` listesinin sonunda
 * yuklenir, yoksa `reference-parity*.css` icindeki ayni agirliktaki
 * kurallar burayi geri ezer.
 *
 * --- Olculer (B1'deki 0.583 olcegi, maket -> 1440 carpani 1.326) ---------
 *
 *   Hizmetlerimiz basligi  y471..486  x  74..196  -> govde ~29 px
 *   alt yazi               y479..489  x 213..419  -> ~16 px, AYNI SATIRDA
 *   metrik sayisi          y406..419            -> govde ~26 px
 *   metrik etiketi         y429..436            -> ~15 px
 *   metrik ikonu           y407..434            -> ~37 px
 *
 * --- Baslik ve alt yazi neden yan yana -----------------------------------
 *
 * Referansta sag tarafinda baglanti olan bolumlerde ("Hizmetlerimiz",
 * "One Cikan Projeler") baslik ve alt yazi tek satirda, baslik hizasinda
 * duruyor. Baglantisi olmayan bolumlerde ("Nasil Calisiyoruz?",
 * "Neden ARCATES?") alt alta. Bu ayrim bizdeki `--local` sinifiyla
 * birebir ortusuyor; kural ona gore yazildi.
 *
 * Bizde ikisi her yerde alt altaydi.
 */

@media (min-width: 941px) {

  /* Baglantili bolum: baslik + alt yazi ayni satirda, taban hizasinda. */
  .ref-home .ref-section__head:not(.ref-section__head--local) > div {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    column-gap: clamp(12px, 1.55vw, 29px);

    /* Dar kolonlarda (Biz Kimiz? / Son Yazilar) alt yazi tek satira
       sigmayip sariyor. Referansta oradaki alt yazilar kisa oldugu icin
       tek satirda duruyor; bizimkiler panelden gelen daha uzun metinler.
       Sardiginda baslikla dibine yapismasin. */
    row-gap: 3px;
  }

  .ref-home .ref-section__head:not(.ref-section__head--local) > div > p {
    margin-block-start: 0;
  }

  /* Referansta baslik bizdekinden biraz iri, alt yazi belirgin sekilde. */
  .ref-home .ref-section__head h2 { font-size: clamp(22px, 2vw, 38px); }
  .ref-home .ref-section__head p  { font-size: clamp(11px, 1.1vw, 20px); }
}

/* --- Metrik bandi --------------------------------------------------------- */

/* Referansta hucre basligi ikona gore belirgin sekilde iri; bizde 15 px
 * kalmisti ve 31 px'lik ikonun yaninda kuculmus duruyordu.
 *
 * Referansin olculen degeri 1440'ta ~26 px ve hucre ~81 px. Site sahibinin
 * karariyla `reference-parity-check`in metrik butcesi 56-72'den 70-88'e
 * yukseltildi, boylece referansin kendi olcusune cikilabildi.
 */
@media (min-width: 941px) {
  .ref-home .ref-metric strong { font-size: clamp(15px, 1.81vw, 34px); }
  .ref-home .ref-metric { min-block-size: clamp(64px, 5.6vw, 104px); }

  /* Etiket referansta ~15 px, bizde 13 px. Sebep icerik: referansin
     etiketleri kisa ("Tamamlanan Proje", "Musteri Memnuniyeti"), bizimkiler
     uzun ("Her ekranda kusursuz deneyim"). 15 px'te ikinci satira kaciyor
     ve hucre 81 -> 102 px oluyor. Tek satirda kalmak referansin genel
     gorunumune 15 px'lik puntodan daha yakin. */
  .ref-home .ref-metric small { font-size: clamp(11px, .9vw, 17px); }

  .ref-home .ref-metric__icon {
    inline-size: clamp(31px, 2.85vw, 53px);
    block-size: clamp(31px, 2.85vw, 53px);
    flex-basis: clamp(31px, 2.85vw, 53px);
  }

  /* `reference-parity-final.css` ikonun `svg`'sini ayrica 31 px'e
     sabitliyor; kapsayiciyi buyutmek tek basina yetmiyor. */
  .ref-home .ref-metric__icon svg {
    inline-size: clamp(28px, 2.57vw, 48px);
    block-size: clamp(28px, 2.57vw, 48px);
  }
}


/* --- Hizmet kartlari ------------------------------------------------------
 *
 * Referans kart 1440 olceginde ~190 px (maket y501..643):
 *   ikon      y520..541  x 89..114  -> 34 x 29
 *   ikon alti bosluk 18 maket px    -> 24
 *   baslik    y559..568             -> ~17
 *   aciklama  satir basi 13 maket   -> 13 / 17
 *
 * Once butce (130-165 px) bunlarin hicbirini barindirmiyordu; site
 * sahibinin karariyla 165-215'e yukseltildi. Ust sinir bizim aciklama
 * metinlerimiz referanstakinden bir satir uzun oldugu icin 190'in biraz
 * uzerinde.
 *
 * Mobil dokunulmadi: referansin telefon maketinde hizmet karti gorunmuyor.
 */
@media (min-width: 941px) {
  .ref-home .ref-service__icon {
    inline-size: clamp(31px, 2.78vw, 52px);
    block-size: clamp(31px, 2.78vw, 52px);
    margin-block-end: clamp(10px, 1.67vw, 31px);
  }

  /* `reference-parity-final.css` svg'yi ayrica 25 px'e sabitliyor. */
  .ref-home .ref-service__icon svg {
    inline-size: clamp(27px, 2.36vw, 44px);
    block-size: clamp(27px, 2.36vw, 44px);
  }

  .ref-home .ref-service h3 { font-size: clamp(13px, 1.18vw, 22px); }

  .ref-home .ref-service p {
    font-size: clamp(11px, .9vw, 17px);
    line-height: 1.31;
  }
}

/* --- Icerik rayi ---------------------------------------------------------- */

/* Referansta icerik, tasarimin kendi genisliginde (~1863 px) 139..1724
 * arasinda duruyor: ekranin %85.1'i, kenar basina %7.46. Bizde ray
 * `min(1280px, 100% - 64px)` idi, yani 1440'ta %88.9 — referanstan genis.
 * Kenar boslugu `vw` cinsinden yazildi, ust sinir referansin 1586 px'i.
 *
 * Yalnizca anasayfa: ic sayfalarin karsilastirilacak bir referansi yok.
 */
@media (min-width: 941px) {
  .is-reference-home .wrap {
    inline-size: min(1586px, calc(100% - 14.92vw));
    max-inline-size: none;
  }
}