/* ============================================================================
   Kuante — Tema sınıflarıyla kurulmuş bölümler (slideralt.php ve benzeri)
   Bu bölümlerin kendi CSS'i yok; doğrudan Crafto yardımcı sınıflarını
   kullanıyorlar. Bu yüzden düzeltme markup yerine buradan yapılıyor.
   Referans: DESIGN-KUANTE.md
   ========================================================================== */

/* ------------------------------------------------- BAŞLIK AĞIRLIK DİSİPLİNİ */
/* app.css h1–h3'ü kapsıyordu; tema bölüm başlıklarında h4 kullanıyor. */
h1[class*="fw-6"], h2[class*="fw-6"], h3[class*="fw-6"],
h4[class*="fw-6"], h5[class*="fw-6"], h6[class*="fw-6"],
h1[class*="fw-7"], h2[class*="fw-7"], h3[class*="fw-7"],
h4[class*="fw-7"], h5[class*="fw-7"], h6[class*="fw-7"],
h1[class*="fw-8"], h2[class*="fw-8"], h3[class*="fw-8"],
h4[class*="fw-8"], h5[class*="fw-8"], h6[class*="fw-8"],
h1[class*="fw-9"], h2[class*="fw-9"], h3[class*="fw-9"],
h4[class*="fw-9"], h5[class*="fw-9"], h6[class*="fw-9"] {
  font-weight: var(--k-w-350) !important;
  letter-spacing: var(--k-tracking-heading) !important;
}

/* ------------------------------------------------------------ GÖLGE YASAĞI */
.btn-box-shadow,
.box-shadow-quadruple-large,
.box-shadow-triple-large,
.box-shadow-double-large,
.box-shadow-extra-large,
.box-shadow-large,
.box-shadow-medium,
.box-shadow-small,
.slider-navigation-style-04,
.btn.btn-box-shadow span { box-shadow: none !important; }

/* Gölgesiz kalınca ayrım gerekiyor: tek 1px çizgi */
.tab-style-08.box-shadow-quadruple-large { border-bottom: 1px solid var(--k-line); }

/* ------------------------------------------------------------ MARKA DIŞI RENK */
/* Tema "emerald green" kullanıyor; sistemde beş yeşil yok. */
.text-emerald-green,
.text-jade,
.text-green { color: var(--k-aqua-700) !important; }

/* ----------------------------------------------------------------- SAYAÇLAR */
.vertical-counter {
  font-family: var(--k-font-display) !important;
  font-weight: var(--k-w-350) !important;
  letter-spacing: var(--k-tracking-display) !important;
  color: var(--k-ink) !important;
}

/* Görsel üstündeki sayaç kutusu — düz yüzey + çizgi */
.bg-very-light-gray.box-shadow-large,
.bg-very-light-gray.position-absolute {
  background: var(--k-canvas) !important;
  border: 1px solid var(--k-line);
  box-shadow: none !important;
}

/* -------------------------------------------------------------- SEKME ÇUBUĞU */
.tab-style-08 .nav-tabs .nav-link {
  font-family: var(--k-font-body);
  font-weight: var(--k-w-regular) !important;
  letter-spacing: var(--k-tracking-body);
  color: var(--k-muted) !important;
}
.tab-style-08 .nav-tabs .nav-link.active {
  color: var(--k-ink) !important;
  font-weight: var(--k-w-medium) !important;
}
.tab-style-08 .nav-tabs .tab-border { background: var(--k-ink) !important; }

/* --------------------------------------------------------- BÖLÜM ZEMİNLERİ */
/* Sistem yalnızca Canvas / Surface / Deep Ink kullanıyor. */
.bg-very-light-gray { background-color: var(--k-surface) !important; }
.bg-base-color      { background-color: var(--k-ink) !important; }

/* Tema butonu (btn-white) — sisteme çekiliyor */
.btn.btn-white {
  text-transform: none !important;   /* katalogla tutarlı: BÜYÜK HARF yok */
  background: transparent !important;
  border: 1.5px solid var(--k-ink) !important;
  color: var(--k-ink) !important;
  font-weight: var(--k-w-medium) !important;
}
.btn.btn-white:hover { background: var(--k-ink) !important; color: var(--k-on-dark) !important; }
.btn.btn-white:hover span { background: var(--k-aqua) !important; color: var(--k-ink) !important; }
.btn.btn-white span.bg-base-color {
  background: var(--k-ink) !important;
  color: var(--k-on-dark) !important;
}

/* ---------------------------------------------------------- AYIRICI ÇİZGİLER */
.separator-line-1px.bg-base-color { background-color: var(--k-aqua) !important; opacity: 1 !important; }
.border-color-extra-medium-gray { border-color: var(--k-line) !important; }

/* --------------------------------------------------------- GÖRÜŞ SLIDER'I */
.slider-navigation-style-04.bg-very-light-gray {
  background: var(--k-canvas) !important;
  border: 1px solid var(--k-line);
}
.testimonials-style-09 .swiper-slide span { color: var(--k-ink); }

/* ============================================================================
   Haberler bölümü (partials/haberler.php)
   Satır içi <style> bloğundan buraya taşındı.
   ========================================================================== */

.c-news {
  background: var(--k-canvas);
  padding-block: var(--k-section-gap);
}
.c-news__container {
  max-width: var(--k-page-max);
  margin-inline: auto;
  padding-inline: var(--k-page-gutter);
}

.c-news__head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--k-space-24);
  margin-bottom: var(--k-space-32);
}
.c-news__eyebrow {
  margin: 0 0 6px;
  font-family: var(--k-font-mono);
  font-size: var(--k-text-label);
  letter-spacing: var(--k-tracking-mono);
  text-transform: uppercase;
  color: var(--k-muted);
}
.c-news__title {
  margin: 0 0 var(--k-space-8);
  font-family: var(--k-font-display);
  font-size: var(--k-text-heading-sm);
  font-weight: var(--k-w-350);
  line-height: var(--k-lh-snug);
  letter-spacing: var(--k-tracking-heading);
  color: var(--k-ink);
}
.c-news__desc {
  margin: 0;
  font-size: var(--k-text-body-sm);
  line-height: var(--k-lh-normal);
  color: var(--k-muted);
}
.c-news__cta { flex: 0 0 auto; }

.c-news__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--k-space-24);
}
@media (min-width: 720px)  { .c-news__grid { grid-template-columns: repeat(2, minmax(0, 1fr)) } }
@media (min-width: 1024px) { .c-news__grid { grid-template-columns: repeat(3, minmax(0, 1fr)) } }

/* Haber kartı — ürün kartıyla aynı dil: düz yüzey, 1px çizgi, gölge yok */
.c-card {
  position: relative;
  display: flex;
  flex-direction: column;
  background: var(--k-canvas);
  border: 1px solid var(--k-line);
  border-radius: var(--k-radius-card);
  overflow: hidden;
  box-shadow: none;
  transform: none;
  transition: border-color var(--k-dur) var(--k-ease);
}
.c-card::after { content: none; }          /* alttaki dekoratif gradient şerit */
.c-card:hover,
.c-card:focus-within {
  transform: none;
  box-shadow: none;
  border-color: var(--k-ink);
}

.c-card__media {
  position: relative;
  display: block;
  aspect-ratio: 16 / 9;
  background: var(--k-surface);
  flex: 0 0 auto;
  min-height: 0;
  overflow: hidden;
}
.c-card__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.c-card__media::after { content: none; }   /* hover'daki radial parlama */

/* Tarih rozeti — aqua, lacivert metin (7.52:1) */
.c-date {
  position: absolute;
  left: 12px; top: 12px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border: 0;
  border-radius: var(--k-radius-pill);
  background: var(--k-aqua);
  color: var(--k-ink);
  font-family: var(--k-font-mono);
  font-size: var(--k-text-label);
  font-weight: var(--k-w-regular);
  letter-spacing: var(--k-tracking-mono);
  box-shadow: none;
}

.c-card__body {
  display: flex;
  flex-direction: column;
  flex: 1;
  padding: var(--k-space-16);
}

.c-tag {
  display: inline-flex;
  align-self: flex-start;
  padding: 5px 10px;
  margin-bottom: var(--k-space-8);
  border: 1px solid var(--k-line);
  border-radius: var(--k-radius-pill);
  background: transparent;
  font-family: var(--k-font-mono);
  font-size: var(--k-text-label);
  letter-spacing: var(--k-tracking-mono);
  line-height: 1;
  color: var(--k-muted);
}

.c-card__title {
  margin: 0 0 var(--k-space-8);
  font-family: var(--k-font-display);
  font-size: var(--k-text-subheading);
  font-weight: var(--k-w-350);
  line-height: var(--k-lh-snug);
  letter-spacing: var(--k-tracking-heading);
  color: var(--k-ink);
}
.c-card__title a { color: inherit; text-decoration: none; }
.c-card__title a::after { content: ""; position: absolute; inset: 0; }

.c-card__excerpt {
  margin: 0 0 var(--k-space-16);
  font-size: var(--k-text-caption);
  line-height: var(--k-lh-normal);
  color: var(--k-muted);
}

.c-card__meta {
  display: flex;
  align-items: center;
  gap: var(--k-space-8);
  margin-top: auto;
  font-size: var(--k-text-caption);
  color: var(--k-muted);
}
.c-dot {
  width: 4px; height: 4px;
  border-radius: var(--k-radius-pill);
  background: var(--k-disabled);
  display: inline-block;
}
.c-read {
  color: var(--k-aqua-700);        /* 5.60:1 */
  font-weight: var(--k-w-medium);
  text-decoration: none;
  position: relative;
  z-index: 1;
}
.c-read:hover { color: var(--k-ink); text-decoration: underline; }

.c-news__empty { display: flex; justify-content: center; padding: var(--k-space-32) 0; }
.c-news__empty-box {
  max-width: 760px;
  padding: var(--k-space-32);
  border: 1px solid var(--k-line);
  border-radius: var(--k-radius-card);
  background: var(--k-canvas);
  text-align: center;
}
.c-news__empty-box :is(h2,h3,h4,h5,h6) {
  margin: 0 0 6px;
  font-family: var(--k-font-display);
  font-weight: var(--k-w-350);
  color: var(--k-ink);
}
.c-news__empty-box p { margin: 0; color: var(--k-muted); }
.c-news__empty-box a { color: var(--k-aqua-700); font-weight: var(--k-w-medium); }

@media (max-width: 575.98px) {
  .c-news__head { flex-direction: column; align-items: flex-start; }
}

/* ------------------------------------------------------- YUKARI ÇIK BUTONU */
/* Tema bunu beyaz metin + beyaz çizgi olarak veriyordu; sabit konumlu olduğu
   için açık bölümlerin üzerinde okunmuyordu (1.03:1). Kendi zeminini taşıyan
   bir pile çevrildi — hem açık hem koyu bölümlerin üstünde okunur. */
a.scroll-top {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  padding: 10px 8px;
  border: 1px solid var(--k-line);
  border-radius: var(--k-radius-pill);
  background: var(--k-canvas);
  box-shadow: none;
}
a.scroll-top .scroll-text {
  color: var(--k-ink);
  font-family: var(--k-font-body);
  font-size: var(--k-text-micro);
  font-weight: var(--k-w-medium);
  letter-spacing: var(--k-tracking-label);
}
a.scroll-top .scroll-line,
a.scroll-top .scroll-point { background-color: var(--k-ink) !important; }
a.scroll-top:hover { border-color: var(--k-ink); }

/* ---------------------------------------------------- ORTAK HİZA IZGARASI */
/* Sitede iki farklı kapsayıcı kalıbı vardı ve içerik kenarları tutmuyordu:
     tema .container  → max-width 1220 + 15px padding → içerik 125'te başlıyordu
     bizim kapsayıcı  → max-width 1280 + 24px padding → içerik 104'te
   Tema container'ı da aynı kutuya çekiliyor. Bootstrap'in row (-15px) /
   col (+15px) telafisi sayesinde sütun içeriği tam 104'e oturuyor. */
.container {
  max-width: var(--k-page-max);
  padding-inline: var(--k-page-gutter);
}