/* ============================================================================
   Kuante — Marka İşareti (assets/kuante/mark.png)

   İşaret sadece İKİ yerde kullanılıyor; her ikisi de "kalabalık yapmadan"
   ölçütünü karşılıyor:

   1) KOYU BANTLARDA FİLİGRAN — çok düşük opaklıkta, kaydırmayla yavaşça
      süzülen bir doku. Bir "öğe" gibi okunmuyor, zemine derinlik veriyor.
   2) BOŞ DURUMLAR — ekranda başka hiçbir şey yokken çıkıyor, yani hiçbir
      şeyle yarışmıyor.

   Hareket JS'siz: `animation-timeline: view()`. Desteklenmezse işaret
   sabit durur; `prefers-reduced-motion` ile tamamen durur.
   ========================================================================== */

:root { --k-mark: url("../assets/kuante/mark.png"); }

/* --------------------------------------------------------------- FİLİGRAN */
.stats-banner-section,
.about-cta-card,
.kuante-footer,
.c-cta-band,
.c-culture .band { position: relative; overflow: hidden; }

.stats-banner-section::after,
.about-cta-card::after,
.kuante-footer::after,
.c-cta-band::after,
.c-culture .band::after {
  content: "";
  position: absolute;
  z-index: 0;
  pointer-events: none;
  background: var(--k-mark) no-repeat center / contain;
  opacity: .06;                     /* doku seviyesi — okunurluğu etkilemez */
}

/* Sayı bandı: sağ üstte, taşan büyük işaret */
.stats-banner-section::after {
  top: -12%; right: -4%;
  width: 320px; height: 620px;
}
/* CTA kartı: sağ alt köşe */
.about-cta-card::after,
.c-cta-band::after {
  bottom: -18%; right: 2%;
  width: 200px; height: 390px;
  opacity: .07;
}
/* Kültür bandı */
.c-culture .band::after {
  top: -20%; right: 3%;
  width: 170px; height: 330px;
}
/* Footer: sol üstte, çok sönük */
.kuante-footer::after {
  top: -10%; left: 4%;
  width: 240px; height: 470px;
  opacity: .04;
}

/* İçerik her zaman filigranın üstünde kalsın */
.stats-banner-section > *,
.about-cta-card > *,
.kuante-footer > *,
.c-cta-band > *,
.c-culture .band > * { position: relative; z-index: 1; }

@media (max-width: 767.98px) {
  /* Dar ekranda filigran metnin arkasına fazla girmesin */
  .stats-banner-section::after,
  .about-cta-card::after,
  .c-cta-band::after,
  .c-culture .band::after,
  .kuante-footer::after { opacity: .035; width: 150px; height: 290px; }
}

/* ------------------------------------------------------------ BOŞ DURUMLAR */
.p-empty::before,
.c-news__empty-box::before,
.k-catalog .empty::before {
  content: "";
  display: block;
  width: 34px;
  height: 66px;
  margin: 0 auto var(--k-space-24);
  background: var(--k-mark) no-repeat center / contain;
  opacity: .5;
}

/* ------------------------------------------------------------------ HAREKET */
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    /* Filigran: bölüm ekranda kayarken ters yönde çok yavaş süzülür.
       Klasik paralaks, ama sadece doku katmanında — metin sabit kalır. */
    @keyframes k-mark-drift {
      from { transform: translateY(6%)  rotate(-2deg); }
      to   { transform: translateY(-8%) rotate(2deg); }
    }
    .stats-banner-section::after,
    .about-cta-card::after,
    .kuante-footer::after,
    .c-cta-band::after,
    .c-culture .band::after {
      animation: k-mark-drift linear both;
      animation-timeline: view();
      animation-range: cover 0% cover 100%;
    }

    /* Boş durum: yavaş nefes alma */
    @keyframes k-mark-breathe {
      0%, 100% { opacity: .38; transform: translateY(0); }
      50%      { opacity: .58; transform: translateY(-4px); }
    }
    .p-empty::before,
    .c-news__empty-box::before,
    .k-catalog .empty::before {
      animation: k-mark-breathe 4.5s var(--k-ease) infinite;
    }
  }
}

/* ------------------------------------------------- GÖRÜŞ MADALYONU ------- */
/* Burada eskiden marka işareti "müşteri fotoğrafı" olarak duruyordu.
   Logoyu bir kişinin yerine koymak hem kafa karıştırıcı hem de görüşü
   sahte gösteriyordu. Yerine nötr bir tırnak madalyonu. */
.k-quote-medallion {
  flex: 0 0 72px;
  width: 72px; height: 72px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--k-aqua-200);
  border-radius: var(--k-radius-pill);
  background: var(--k-aqua-050);
  /* Aqua, canvas üzerinde 1.98:1 kalıyordu. Dekoratif bir glif olsa da
     (aria-hidden) soluk görünüyordu; aqua-700 hem okunur hem sessiz (5.60:1).
     !important gerekli: `.testimonials-style-09 .swiper-slide span` daha spesifik. */
  color: var(--k-aqua-700) !important;
  font-family: var(--k-font-display);
  font-size: 40px;
  line-height: 0;
  padding-top: 22px;
  user-select: none;
}
@media (max-width: 991.98px) {
  .k-quote-medallion { margin: 0 auto var(--k-space-24); }
}