/* Arcates — projeler, surec ve "Neden ARCATES". Referans B5.
 *
 * Alt bolumlerin SON katmani: `HomeController` listesinin sonunda yuklenir.
 *
 * --- Olculer (B1'deki 0.583 olcegi, maket -> 1440 carpani 1.326) ---------
 *
 *   "Neden" madde ikonu   maket cap 16 (x648..663)  -> 21 px, DOLU mavi
 *   ikon zemini           ornekleme rgb(7,90,218)   -> #075ADA
 *   surec dairesi         maket cap ~35             -> 46 px (bizde 45)
 *   surec baglayicisi     kesikli cizgi + OK BASI
 */

/* --- "Neden ARCATES" madde ikonlari --------------------------------------
 *
 * Referansta ikon dolu mavi bir dairenin icinde beyaz duruyor ve liste bir
 * rozet dizisi gibi okunuyor. Bizde daire koyu lacivert bir gradyandi
 * (`linear-gradient(145deg,#0b2c4c,#07192b)`), yani zeminden neredeyse
 * ayirt edilemiyordu; yalnizca glif goruluyordu.
 */
.ref-home .ref-why__body li > span {
  border: 0;
  color: #fff;
  background: linear-gradient(150deg, #0F63E0, #0A4AAE);
  box-shadow: 0 2px 10px rgba(10, 74, 174, .35);
}

/* --- Surec baglayicisi ---------------------------------------------------- */

@media (min-width: 941px) {
  /* Eski tek parca cizgi: listenin bastan sona uzanan `::before`'u.
     Referansta bosluklar ayri ayri ve her biri ok basiyla bitiyor. */
  .ref-home .ref-process__list::before { display: none; }

  .ref-home .ref-process__list li { position: relative; }

  .ref-home .ref-process__link {
    position: absolute;
    inset-block-start: 22px;
    inset-inline-start: 56px;
    inset-inline-end: 16px;
    display: flex;
    align-items: center;
    gap: 4px;
    block-size: 12px;
    color: rgba(31, 152, 255, .75);
    pointer-events: none;
  }

  /* Kesikli cizgi; ok basi SVG olarak isaretlemede. */
  .ref-home .ref-process__link::before {
    content: '';
    flex: 1 1 auto;
    block-size: 1px;
    background: repeating-linear-gradient(
      90deg, rgba(31, 152, 255, .6) 0 5px, transparent 5px 10px);
  }

  .ref-home .ref-process__chevron {
    flex: 0 0 auto;
    inline-size: 7px;
    block-size: auto;
  }
}

/* 940 px altinda liste dikey akiyor ve `::before` dikey cizgiyi ciziyor;
   yatay baglayici orada gorunmez. */
@media (max-width: 940px) {
  .ref-home .ref-process__link { display: none; }
}

/* --- Ortak ok ve onay isaretleri ------------------------------------------
 *
 * Sayfadaki butun metin glifleri (→ ↗ ✓) satir ici SVG'ye cevrildi. Glif
 * fonta baglidir; font yuklenmezse kutu olarak cizilir. B2'de yalnizca
 * kahramandakiler donusturulmustu, kalan dokuz yer burada.
 *
 * Boyut baglama gore: metin baglantisinda yaziyla ayni akista, kart
 * dairesinin icinde ortada.
 */
.ref-home .ref-mark {
  flex: 0 0 auto;
  inline-size: 1em;
  block-size: auto;
  vertical-align: -.1em;
}

/* Bolum basligi baglantisi ve "Detaylari Gor": yazidan sonra kucuk bosluk. */
.ref-home .ref-section__head > a .ref-mark,
.ref-home .ref-service__more .ref-mark {
  margin-inline-start: .45em;
}

.ref-home .ref-section__head > a,
.ref-home .ref-service__more {
  display: inline-flex;
  align-items: center;
}

/* Kart dairesi: ok dairenin ortasinda, kendi boslugu yok. */
.ref-home .ref-project__arrow .ref-mark,
.ref-home .ref-post__arrow .ref-mark { inline-size: .9em; margin: 0; }

/* Son cagri bandindaki onay isareti. */
.ref-home .ref-final-cta__action small {
  display: inline-flex;
  align-items: center;
  gap: .4em;
}

.ref-home .ref-final-cta__action .ref-mark--check {
  inline-size: .95em;
  color: #5AC8F5;
}

.ref-home .ref-about .ref-btn .ref-mark { margin-inline-start: .5em; }
