/* Imported from: ../../styles/section.css */
/* ===== Ortak bölüm iskeleti =====
 * Anasayfadaki her bölüm aynı başlık alanını, aynı sekme çubuğunu ve aynı
 * ızgara aralığını kullanır. Tek yerde tanımlı olması "tüm bölümler birbiriyle
 * uyumlu" şartının teknik karşılığı: bir değeri değiştirmek hepsini değiştirir.
 *
 * Her değer editörden ezilebilir; var() ikinci argümanı tasarım varsayılanıdır.
 * Bu dosyayı kullanan bölüm CSS'i, kendi başına bu dosyayı import etmek
 * ZORUNDA — import edilmeyen stil derlemede sessizce düşer.
 * (Örnek yolu buraya yazmıyoruz: derleyicinin import tarayıcısı yorum
 *  satırlarını ayıklamıyor, yorumdaki yolu da çözmeye çalışıyor.)
 */

/* Bölüm dikey boşluğu. İki bölümün dikişi bunun iki katı okunuyor
   (üsttekinin alt boşluğu + alttakinin üst boşluğu): mobilde 64px,
   masaüstünde 80px. Bölüm başına "Bölüm Boşlukları" propları ezer. */
.cc_c1wmfzom_features .mays-section {
  width: 100%;
  padding-top: var(--sec-pt, 2rem);
  padding-bottom: var(--sec-pb, 2rem);
}

.cc_c1wmfzom_features .mays-section__container {
  display: flex;
  flex-direction: column;
  gap: var(--sec-gap, 1.25rem);
  max-width: var(--sec-max-w, none);
  margin-inline: auto;
  width: 100%;
}

/* ----- Başlık alanı ----- */

.cc_c1wmfzom_features .mays-section__head {
  display: flex;
  flex-direction: column;
  align-items: var(--head-align, center);
  gap: var(--head-gap, 0.5rem);
  text-align: var(--head-text-align, center);
}

/* Varsayılan: label-sm-medium (12px / 18px / 500 / .017em / uppercase).
   Satır yüksekliği varsayılanı BİRİMSİZ oran: editörden yalnızca puntoyu
   büyüten kişi rem cinsinden donmuş bir satır kutusuna sıkışıyordu — başlık
   büyüyüp altındaki giriş metninin üstüne biniyordu. 1.5 × 12px = 18px, yani
   varsayılan görünüm bit birebir aynı kalıyor, punto büyüyünce boşluk da
   onunla büyüyor. Satır yüksekliği propu yazıldığında yine o kazanır. */
.cc_c1wmfzom_features .mays-section__title {
  margin: 0;
  font-size: var(--sec-title-fs, 0.75rem);
  line-height: var(--sec-title-lh, 1.5);
  font-weight: var(--sec-title-fw, 500);
  letter-spacing: var(--sec-title-ls, 0.017em);
  text-transform: var(--sec-title-tt, uppercase);
  color: var(--sec-title-color, var(--kombos-gray-900));
}

/* Varsayılan: text-sm-regular (14px / 20px / 400).
   Satır yüksekliği yine birimsiz oran — 20/14 = 1.4286, 14px'te 20px eder. */
.cc_c1wmfzom_features .mays-section__desc {
  margin: 0;
  max-width: var(--sec-desc-max-w, 34rem);
  font-size: var(--sec-desc-fs, 0.875rem);
  line-height: var(--sec-desc-lh, 1.4286);
  font-weight: var(--sec-desc-fw, 400);
  letter-spacing: var(--sec-desc-ls, normal);
  text-transform: var(--sec-desc-tt, none);
  color: var(--sec-desc-color, var(--kombos-muted));
}

/* ----- Sekmeler (Kadın / Erkek) ----- */

.cc_c1wmfzom_features .mays-section__tabs {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--sec-tab-gap, 1.5rem);
}

/* Varsayılan: label-sm-regular. Aktif sekme dolgu değil, ince çizgi alır. */
.cc_c1wmfzom_features .mays-section__tab {
  position: relative;
  padding: 0.5rem 0;
  background: none;
  border: none;
  cursor: pointer;
  font-size: var(--sec-tab-fs, 0.75rem);
  line-height: 1.125rem;
  font-weight: var(--sec-tab-fw, 400);
  letter-spacing: var(--sec-tab-ls, 0.017em);
  text-transform: var(--sec-tab-tt, uppercase);
  color: var(--sec-tab-color, var(--kombos-muted));
  transition: color var(--kombos-duration-fast) var(--kombos-ease-standard);
}

.cc_c1wmfzom_features .mays-section__tab:hover, .cc_c1wmfzom_features .mays-section__tab--active {
  color: var(--sec-tab-active-color, var(--kombos-gray-900));
}

.cc_c1wmfzom_features .mays-section__tab--active::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0.25rem;
  height: 1px;
  background: var(--sec-tab-underline, var(--kombos-gray-900));
}

/* ----- Izgara ----- */

.cc_c1wmfzom_features .mays-section__grid {
  display: grid;
  grid-template-columns: repeat(var(--mobile-cols, 2), 1fr);
  gap: var(--sec-grid-gap-m, var(--sec-grid-gap, var(--kombos-grid-gap)));
}

@media (min-width: 768px) {
  .cc_c1wmfzom_features .mays-section {
    padding-top: var(--sec-pt, 2.5rem);
    padding-bottom: var(--sec-pb, 2.5rem);
  }

  .cc_c1wmfzom_features .mays-section__container {
    gap: var(--sec-gap, 1.5rem);
  }

  .cc_c1wmfzom_features .mays-section__grid {
    gap: var(--sec-grid-gap, var(--kombos-grid-gap));
  }
}

@media (min-width: 1024px) {
  .cc_c1wmfzom_features .mays-section__grid {
    grid-template-columns: repeat(var(--desktop-cols, 4), 1fr);
  }
}

@media (max-width: 767px) {
  .cc_c1wmfzom_features .mays-section__title {
    font-size: var(--sec-title-fs-m, var(--sec-title-fs, 0.75rem));
  }

  .cc_c1wmfzom_features .mays-section__desc {
    font-size: var(--sec-desc-fs-m, var(--sec-desc-fs, 0.875rem));
  }
}

/* End import: ../../styles/section.css */
/* Imported from: ../FeatureItem/styles.css */
/* ===== Feature Item =====
   Varsayılan: ikon solda, başlık label-xs-medium, metin text-sm-regular. */

.cc_c1wmfzom_features .kombos-feature-item {
  display: flex;
  align-items: center;
  gap: var(--feat-icon-gap, 0.75rem);
  min-height: 2.75rem;
  color: inherit;
  text-decoration: none;
  text-align: var(--feat-text-align, left);
  transition: opacity var(--kombos-duration-fast) var(--kombos-ease-standard);
}

/* İkon üstte: dört eşit sütunlu güven şeridi düzeni. */
.cc_c1wmfzom_features .kombos-feature-item--vertical {
  flex-direction: column;
  align-items: var(--feat-items, center);
  text-align: var(--feat-text-align, center);
}

.cc_c1wmfzom_features a.kombos-feature-item:hover {
  opacity: 0.65;
}

.cc_c1wmfzom_features .kombos-feature-item__icon {
  width: var(--feat-icon-size, 1.5rem);
  height: var(--feat-icon-size, 1.5rem);
  flex-shrink: 0;
  object-fit: contain;
}

/* Setten gelen ikon `font-size` ile ölçekleniyor (svg.kombos-icon { height: 1em }),
   yüklenen görsel ise width/height ile — ikisi de aynı "İkon Boyutu" propunu
   okuyor, editörde tek düğme kalıyor. Rengi metinden miras alıyor. */
.cc_c1wmfzom_features .kombos-feature-item__svg {
  flex-shrink: 0;
  font-size: var(--feat-icon-size, 1.5rem);
}

.cc_c1wmfzom_features .kombos-feature-item__body {
  display: flex;
  flex-direction: column;
  gap: var(--kombos-space-2);
  min-width: 0;
}

.cc_c1wmfzom_features .kombos-feature-item__title {
  font-size: var(--feat-title-fs, 0.625rem);
  line-height: var(--feat-title-lh, 0.875rem);
  font-weight: var(--feat-title-fw, 500);
  letter-spacing: var(--feat-title-ls, 0.06em);
  text-transform: var(--feat-title-tt, uppercase);
  color: var(--feat-title-color, var(--kombos-gray-900));
}

.cc_c1wmfzom_features .kombos-feature-item__text {
  font-size: var(--feat-text-fs, 0.875rem);
  line-height: var(--feat-text-lh, 1.25rem);
  font-weight: var(--feat-text-fw, 400);
  letter-spacing: var(--feat-text-ls, normal);
  color: var(--feat-text-color, var(--kombos-muted));
}

/* End import: ../FeatureItem/styles.css */

/* ===== Features / trust strip =====
 * Başlık alanı ortak `mays-section` iskeletinden. Şeridin kendisi mobilde
 * yatay kayar, masaüstünde eşit paylaşır; kolon sayısı verilirse ızgaraya
 * geçer.
 *
 * Bu bölüm anasayfanın en dar dikey bloğu, o yüzden varsayılan üst/alt boşluk
 * diğer bölümlerden küçük.
 */

.cc_c1wmfzom_features .kombos-features {
  width: 100%;
  border-top: 1px solid var(--kombos-line);
  padding-top: var(--sec-pt, 1.75rem);
  padding-bottom: var(--sec-pb, 1.75rem);
}

.cc_c1wmfzom_features .kombos-features__container {
  display: flex;
  gap: var(--feat-gap, 1.5rem);
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}

.cc_c1wmfzom_features .kombos-features__container::-webkit-scrollbar {
  display: none;
}

/* NOTE: IkasComponentRenderer's wrapper depth is not guaranteed; this
   structural selector is the sizing mechanism this theme already ships with.
   Keep it layout-only — visual styling belongs on .kombos-feature-item. */
.cc_c1wmfzom_features .kombos-features__container > * > * > * {
  flex: 0 0 auto;
  width: calc(
    (100% - (var(--feat-cols-m, 1.28) - 1) * var(--feat-gap, 1.5rem)) /
      var(--feat-cols-m, 1.28)
  );
  scroll-snap-align: start;
}

.cc_c1wmfzom_features .kombos-features--divided .kombos-features__container > * > * > * {
  border-left: 1px solid var(--feat-divider, var(--kombos-line));
  padding-left: var(--feat-gap, 1.5rem);
}

.cc_c1wmfzom_features .kombos-features--divided .kombos-features__container > * > *:first-child > * {
  border-left: none;
  padding-left: 0;
}

@media (min-width: 640px) {
  .cc_c1wmfzom_features .kombos-features__container > * > * > * {
    width: calc(
      (100% - (var(--feat-cols-m, 2) - 1) * var(--feat-gap, 1.5rem)) /
        var(--feat-cols-m, 2)
    );
  }
}

@media (min-width: 1024px) {
  .cc_c1wmfzom_features .kombos-features {
    padding-top: var(--sec-pt, 2rem);
    padding-bottom: var(--sec-pb, 2rem);
  }

  .cc_c1wmfzom_features .kombos-features__container {
    justify-content: space-between;
    overflow-x: visible;
  }

  /* Kolon sayısı verilmediyse ögeler satırı eşit paylaşır. */
  .cc_c1wmfzom_features .kombos-features__container > * > * > * {
    width: auto;
    flex: 1 1 0;
  }

  .cc_c1wmfzom_features .kombos-features--fixed-cols .kombos-features__container > * > * > * {
    flex: 0 0
      calc(
        (100% - (var(--feat-cols, 4) - 1) * var(--feat-gap, 1.5rem)) /
          var(--feat-cols, 4)
      );
  }
}
