/* ==========================================================================
   layout.css — Amazon-tarzı ana sayfa düzeni
   Promo hero + kategori overlap kartları + ürün rafları.
   ========================================================================== */

main { display: block; background: var(--color-surface); }

.section { padding-block: var(--space-7); }

.section-head {
  display: flex; align-items: baseline; justify-content: space-between;
  gap: var(--space-4); margin-bottom: var(--space-5);
}
.section-head h2 {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  margin: 0;
  font-size: var(--fs-400);
  letter-spacing: var(--tracking-normal);
}
.section-head h2 > .icon { flex: 0 0 auto; width: 1.05em; height: 1.05em; }
.section-head .link-more {
  font-size: var(--fs-75); font-weight: var(--fw-semibold); color: var(--color-ink-soft);
  display: inline-flex; align-items: center; gap: var(--space-1);
  transition: color var(--dur-fast) var(--ease-color);
}
.section-head .link-more .icon { width: 1em; height: 1em; }
@media (hover: hover) and (pointer: fine) {
  .section-head .link-more:hover { color: var(--color-ink); }
}
/* İki satırlı başlık (h2 + alt bilgi) varyantı */
.section-head--sub { align-items: center; }
.section-head--sub h2 { margin: 0; }
.section-head__sub {
  margin-top: var(--space-1); font-size: var(--fs-75); color: var(--color-ink-soft);
}
.section-head__sub strong { color: var(--color-ink); font-weight: var(--fw-bold); }
@media (max-width: 560px) {
  .section-head--sub { flex-direction: column; align-items: flex-start; gap: var(--space-2); }
}

/* ========================================================================== 
   PROMO HERO (büyük kampanya banner, satış odaklı)
   ========================================================================== */

/* ==========================================================================
   4 SABİT KARTLI GÖRSEL VİTRİN
   Kartlar hiçbir zaman yer değiştirmez (slider sabit). Her kart kendi görsel
   setini kendi sol/sağ oklarıyla, alan içinde geçişle döndürür.
   Yerleşim: sol büyük (2×2) · sağ üst geniş (2×1) · sağ alt iki küçük (1×1).
   ========================================================================== */
.home-showcase {
  position: relative;
  padding-block: clamp(10px, 1.4vw, 18px);
  overflow: hidden;
  border-top: 3px solid var(--color-accent);
  background: #eef2f5;
}
.home-showcase__shell { position: relative; }
.home-showcase__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  grid-template-rows: repeat(2, minmax(0, 246px));
  gap: clamp(8px, .8vw, 12px);
  width: 100%;
  min-width: 0;
}
.home-showcase__card--hero  { grid-column: span 2; grid-row: span 2; }
.home-showcase__card--wide  { grid-column: span 2; grid-row: span 1; }
.home-showcase__card--small { grid-column: span 1; grid-row: span 1; }

.home-showcase__card {
  position: relative;
  min-width: 0;
  overflow: hidden;
  border: 1px solid #d8dee7;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 2px 8px rgba(15, 23, 42, .08);
  isolation: isolate;
  transition: border-color var(--dur-fast) var(--ease-color), box-shadow var(--dur-base) var(--ease-out);
}
.home-showcase__frames { position: absolute; inset: 0; }
.home-showcase__frame {
  position: absolute;
  inset: 0;
  display: block;
  color: inherit;
  opacity: 0;
  visibility: hidden;
  transition: opacity .4s var(--ease-out);
}
.home-showcase__frame.is-active { opacity: 1; visibility: visible; }
.home-showcase__frame img {
  width: 100%;
  height: 100%;
  display: block;
  background: #fff;
  transition: transform .4s var(--ease-out);
}
.home-showcase__frame--fit-cover img { object-fit: cover; }
.home-showcase__frame--fit-contain img { object-fit: contain; padding: clamp(8px, 1.25vw, 18px); }
.home-showcase__frame--empty {
  display: grid;
  place-items: center;
  opacity: 1;
  visibility: visible;
  color: #94a3b8;
  font-size: .9rem;
  background: repeating-linear-gradient(45deg, #f8fafc, #f8fafc 12px, #eef2f5 12px, #eef2f5 24px);
}
@media (hover: hover) and (pointer: fine) {
  .home-showcase__card:hover {
    border-color: color-mix(in srgb, var(--color-accent) 65%, #d8dee7);
    box-shadow: 0 12px 30px rgba(15, 23, 42, .15);
  }
  .home-showcase__card:hover .home-showcase__frame.is-active img { transform: scale(1.025); }
}

/* Her kartın kendi okları — kart içinde, kenarlarda. */
.home-showcase__card-arrow {
  position: absolute;
  top: 50%;
  z-index: 4;
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  transform: translateY(-50%);
  border: 1px solid #cbd5e1;
  border-radius: 50%;
  background: rgba(255,255,255,.95);
  color: #0f172a;
  box-shadow: 0 4px 14px rgba(15,23,42,.20);
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: background var(--dur-fast) var(--ease-color), transform var(--dur-fast) var(--ease-out), opacity var(--dur-fast) var(--ease-out), visibility var(--dur-fast) var(--ease-color), box-shadow var(--dur-fast) var(--ease-color);
}
.home-showcase__card:hover .home-showcase__card-arrow,
.home-showcase__card:focus-within .home-showcase__card-arrow {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}
.home-showcase__card-arrow .icon { width: 16px; height: 16px; }
.home-showcase__card-arrow--prev { left: 8px; }
.home-showcase__card-arrow--prev .icon { transform: rotate(180deg); }
.home-showcase__card-arrow--next { right: 8px; }
.home-showcase__card-arrow:hover { background: #fff8d8; transform: translateY(-50%) scale(1.08); }
.home-showcase__card-arrow:focus-visible { opacity: 1; outline: 3px solid rgba(234,179,8,.45); outline-offset: 2px; }

.home-showcase__card-count {
  position: absolute;
  right: 8px;
  bottom: 8px;
  z-index: 4;
  padding: 2px 9px;
  border-radius: 999px;
  background: rgba(15,23,42,.62);
  color: #fff;
  font-size: .72rem;
  font-weight: 600;
  letter-spacing: .02em;
  opacity: .82;
  transition: opacity var(--dur-fast) var(--ease-out);
}
.home-showcase__card:hover .home-showcase__card-count,
.home-showcase__card:focus-within .home-showcase__card-count { opacity: 1; }

@media (max-width: 900px) {
  .home-showcase__grid { grid-template-rows: repeat(2, minmax(0, 190px)); }
}
@media (max-width: 560px) {
  .home-showcase { padding-block: 8px 12px; }
  /* Dar ekran: sabit satır yüksekliği yerine kartın kendi en-boy oranı kullanılır
     (önerilen görsel ölçüleriyle uyumlu). Böylece banner görselleri KIRPILMADAN,
     tam olarak görünür. Sıra: büyük (tam genişlik) · geniş (tam genişlik) · iki küçük. */
  .home-showcase__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: auto;
    grid-auto-rows: auto;
    gap: 8px;
  }
  .home-showcase__card--hero  { grid-column: span 2; grid-row: auto; aspect-ratio: 132 / 100; }
  .home-showcase__card--wide  { grid-column: span 2; grid-row: auto; aspect-ratio: 160 / 60; }
  .home-showcase__card--small { grid-column: span 1; grid-row: auto; aspect-ratio: 4 / 3; }
  .home-showcase__card { border-radius: 10px; }
  .home-showcase__frame--fit-contain img { padding: 7px; }
  .home-showcase__card-arrow { width: 30px; height: 30px; }
  .home-showcase__card-arrow .icon { width: 14px; height: 14px; }
}

.promo {
  position: relative; overflow: hidden;
  background: var(--color-dark); color: var(--color-on-dark);
  border-radius: 0;
}
/* Yapısal üst kontur (parıltı/hazard deseni yok — kasıtlı, sade) */
.promo::before {
  content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px;
  background: var(--color-accent); pointer-events: none; z-index: 1;
}
/* Çok ince dikey ızgara — endüstriyel "blueprint" dokusu, AI parıltısı değil */
.promo::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-image: repeating-linear-gradient(90deg, rgba(244,244,245,.035) 0 1px, transparent 1px 72px);
}
/* Hareketli Türkiye tedarik ağı animasyonu (Three.js) — slider arka planı.
   Canvas tüm bölümü kaplar, tıklamayı asla engellemez. JS yalnızca ≥1024px'de
   kurar; mobilde canvas gizli. Katman sırası: canvas(0) < fade(1) < içerik(2). */
.promo__fx {
  position: absolute; inset: 0; width: 100%; height: 100%;
  display: block; pointer-events: none; z-index: 0;
}
/* Sol kenar karartması: başlık/metin okunurluğu için */
.promo__fx-fade {
  position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: linear-gradient(90deg,
    #16161a 0%, rgba(22,22,26,.90) 20%, rgba(22,22,26,.45) 42%, rgba(22,22,26,0) 64%);
}
@media (max-width: 1023.98px) { .promo__fx, .promo__fx-fade { display: none; } }
.promo__inner {
  position: relative;
  z-index: 2;
  padding-block: clamp(var(--space-7), 6vw, var(--space-9));
}
/* Her slayt 2 sütun: metin | panel (panel slayta özel ürünlerle dolar) */
.promo-slide { display: grid; grid-template-columns: 1.05fr .95fr; align-items: center; gap: var(--space-7); }
.promo-slide--simple { grid-template-columns: minmax(0, 720px) minmax(0, 1fr); }
.promo-slide__main { min-width: 0; }
.promo__eyebrow { color: var(--color-accent); margin-bottom: var(--space-3); }
.promo h1 { color: var(--color-on-dark); font-size: clamp(var(--fs-500), 3.5vw + 1rem, var(--fs-700)); max-width: 16ch; }
.promo h1 .accent { color: var(--color-accent); }
.promo__lede { margin-top: var(--space-4); font-size: var(--fs-200); color: var(--color-on-dark-soft); max-width: 46ch; }
.promo__actions { margin-top: var(--space-6); display: flex; flex-wrap: wrap; gap: var(--space-4); }
.promo__trust { margin-top: var(--space-6); display: flex; flex-wrap: wrap; gap: var(--space-4) var(--space-5);
  color: var(--color-on-dark-soft); font-size: var(--fs-75); }
.promo__trust li { display: flex; align-items: center; gap: var(--space-2); }
.promo__trust .icon { width: 1.05rem; height: 1.05rem; color: var(--color-accent); }

/* Mobil/tablet: hero 2 sütun → tek sütun (içerik dar sütuna sığmayıp taşmasın).
   minmax(0,1fr) + min-width:0 → sütun, içeriğin min-content'ine göre şişmez. */
@media (max-width: 860px) {
  .promo-slide { grid-template-columns: minmax(0, 1fr); gap: var(--space-6); }
  .promo-slide__main, .promo__panel { min-width: 0; }
  .promo__lede { max-width: 100%; }
}

/* Sağ panel: popüler ürünler (kategori kartlarıyla tekrar etmez) */
.promo__panel {
  background: var(--color-dark-2); border: 1px solid rgba(244,244,245,.08);
  border-radius: var(--radius-xl); padding: var(--space-5);
  display: flex; flex-direction: column; gap: var(--space-4);
  box-shadow: var(--shadow-3);
}
.promo__panel-head { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); }
.promo__panel-head .badge .icon { width: 1em; height: 1em; }
.link-more--on-dark { color: var(--color-on-dark-soft); }
.link-more--on-dark .icon { width: 1em; height: 1em; }
@media (hover: hover) and (pointer: fine) { .link-more--on-dark:hover { color: var(--color-on-dark); } }

.promo__products { display: flex; flex-direction: column; gap: var(--space-3); }
.mini-prod {
  display: flex; align-items: center; gap: var(--space-3);
  background: var(--color-ink); border: 1px solid rgba(244,244,245,.06);
  border-radius: var(--radius-lg); padding: var(--space-3);
  color: var(--color-on-dark);
  transition: transform var(--dur-base) var(--ease-out),
              border-color var(--dur-fast) var(--ease-color),
              background-color var(--dur-fast) var(--ease-color);
}
.mini-prod__thumb {
  flex: none; width: 58px; height: 58px; border-radius: var(--radius-md);
  display: grid; place-items: center; background: #fff;
  overflow: hidden; border: 1px solid rgba(244,244,245,.08);
}
.mini-prod__img {
  width: 100%; height: 100%; object-fit: contain;
  padding: 5px; display: block;
}
.mini-prod__thumb .icon { width: 26px; height: 26px; color: var(--color-ink-soft); }
.mini-prod--kkd      .mini-prod__thumb .icon { color: #b8860b; }
.mini-prod--ambalaj  .mini-prod__thumb .icon { color: #8a6d3b; }
.mini-prod--temizlik .mini-prod__thumb .icon { color: #2563eb; }
.mini-prod--matbaa   .mini-prod__thumb .icon { color: #6d28d9; }
.mini-prod__info { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1; }
.mini-prod__info strong { font-size: var(--fs-100); font-weight: var(--fw-semibold);
  line-height: var(--lh-snug); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mini-prod__info small { font-size: var(--fs-50); color: var(--color-on-dark-soft); }
.mini-prod__go { flex: none; color: var(--color-accent); display: grid; place-items: center; }
.mini-prod__go .icon { width: 1.1rem; height: 1.1rem; transition: transform var(--dur-fast) var(--ease-out); }
@media (hover: hover) and (pointer: fine) {
  .mini-prod:hover { transform: translateX(3px); border-color: rgba(245,197,24,.35);
    background: color-mix(in srgb, var(--color-ink) 80%, var(--color-accent)); }
  .mini-prod:hover .mini-prod__go .icon { transform: translateX(3px); }
}

/* ==========================================================================
   KATEGORİ OVERLAP KARTLARI (Amazon imzası: banner üstüne taşan beyaz kartlar)
   ========================================================================== */
.cat-rail {
  position: relative; z-index: 2;
  margin-top: calc(-1 * var(--space-7));
  display: flex; gap: var(--space-3);
  overflow-x: auto; overflow-y: hidden;
  padding: var(--space-1) var(--space-1) var(--space-3);
  margin-inline: calc(-1 * var(--space-1));
  scroll-snap-type: x mandatory;
  scroll-padding-inline: var(--space-1);
  -webkit-overflow-scrolling: touch;
  mask-image: linear-gradient(90deg, transparent 0, #000 18px, #000 calc(100% - 42px), transparent 100%);
  scrollbar-color: color-mix(in srgb, var(--color-accent) 70%, var(--color-ink)) transparent;
  scrollbar-width: thin;
}

/* ========================================================================== 
   ANA SAYFA MARKA LOGOLARI
   ========================================================================== */
.home-brands {
  position: relative;
  z-index: 3;
  margin-top: calc(-1 * var(--space-6));
  padding-bottom: var(--space-5);
}
.home-brands--after-showcase {
  margin-top: 0;
  padding-top: var(--space-5);
}
.home-brands__panel {
  overflow: hidden;
  padding: var(--space-4) var(--space-5);
  border: var(--border-thin);
  border-radius: var(--radius-xl);
  background: var(--color-bg);
  box-shadow: var(--shadow-2);
}
.home-brands__head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: var(--space-4);
  padding-bottom: var(--space-3);
  border-bottom: var(--border-thin);
}
.home-brands__head .eyebrow {
  color: var(--color-accent-strong, #9a6a00);
}
.home-brands__head h2 {
  margin-top: 4px;
  font-size: clamp(1.3rem, 2.3vw, 1.8rem);
}
.home-brands__viewport {
  overflow: hidden;
  margin-top: var(--space-3);
  padding-block: 2px;
  mask-image: linear-gradient(90deg, transparent, #000 28px, #000 calc(100% - 28px), transparent);
}
.home-brands__track {
  display: flex;
  width: max-content;
  will-change: transform;
  animation: home-brand-marquee 46s linear infinite;
}
.home-brands__group {
  display: flex;
  flex: none;
  gap: var(--space-3);
  padding-right: var(--space-3);
}
.home-brand-logo {
  position: relative;
  display: grid;
  place-items: center;
  flex: 0 0 108px;
  width: 108px;
  height: 108px;
  padding: 12px;
  border: var(--border-thin);
  border-radius: var(--radius-lg);
  background: linear-gradient(145deg, #fff, var(--color-surface));
  color: var(--color-ink);
  text-align: center;
  transition: transform var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-color), box-shadow var(--dur-fast) var(--ease-color);
}
.home-brand-logo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.home-brand-logo__wordmark {
  display: block;
  max-width: 100%;
  overflow: hidden;
  color: var(--color-ink);
  font-size: .86rem;
  font-weight: var(--fw-black);
  letter-spacing: -.025em;
  line-height: 1.05;
  overflow-wrap: anywhere;
}
@keyframes home-brand-marquee { to { transform: translateX(-50%); } }
.home-brands__viewport:hover .home-brands__track,
.home-brands__viewport:focus-within .home-brands__track { animation-play-state: paused; }
@media (hover: hover) and (pointer: fine) {
  .home-brand-logo:hover {
    z-index: 1;
    transform: translateY(-2px);
    border-color: var(--color-accent);
    box-shadow: var(--shadow-2);
  }
}
@media (max-width: 680px) {
  .home-brands { margin-top: 0; padding-top: var(--space-4); }
  .home-brands__panel { padding: var(--space-4); }
  .home-brands__head { align-items: flex-start; }
  .home-brands__head .link-more { font-size: var(--fs-50); }
  .home-brand-logo { flex-basis: 88px; width: 88px; height: 88px; padding: 9px; }
  .home-brand-logo__wordmark { font-size: .72rem; }
  .home-brands__track { animation-duration: 38s; }
}
@media (prefers-reduced-motion: reduce) {
  .home-brands__viewport { overflow-x: auto; mask-image: none; scrollbar-width: thin; }
  .home-brands__track { animation: none; }
  .home-brands__group[aria-hidden="true"] { display: none; }
}
.cat-rail--home { justify-content: safe center; }
.cat-rail::-webkit-scrollbar { height: 8px; }
.cat-rail::-webkit-scrollbar-track { background: transparent; }
.cat-rail::-webkit-scrollbar-thumb {
  background: color-mix(in srgb, var(--color-accent) 75%, var(--color-ink));
  border-radius: 999px;
}
.cat-card {
  flex: 0 0 clamp(180px, 18vw, 230px);
  min-height: 150px;
  background: var(--color-bg); border: var(--border-thin); border-radius: var(--radius-lg);
  padding: var(--space-4); display: flex; flex-direction: column; gap: var(--space-2);
  box-shadow: var(--shadow-2);
  scroll-snap-align: start;
  transition: transform var(--dur-base) var(--ease-out), box-shadow var(--dur-base) var(--ease-color);
}
.cat-card__icon { width: 42px; height: 42px; border-radius: var(--radius-md);
  display: grid; place-items: center; background: var(--color-accent-soft); }
.cat-card__icon .icon { width: 23px; height: 23px; color: var(--color-ink); }
.cat-card h3 { font-size: var(--fs-100); font-weight: var(--fw-semibold); letter-spacing: 0; }
.cat-card p {
  font-size: var(--fs-50); line-height: var(--lh-snug); color: var(--color-ink-soft);
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.cat-card .link-more { margin-top: auto; font-size: var(--fs-75); font-weight: var(--fw-semibold);
  color: var(--color-ink); display: inline-flex; align-items: center; gap: var(--space-1); }
.cat-card .link-more .icon { width: 1em; height: 1em; transition: transform var(--dur-fast) var(--ease-out); }
@media (hover: hover) and (pointer: fine) {
  .cat-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-3); }
  .cat-card:hover .link-more .icon { transform: translateX(3px); }
}

/* ==========================================================================
   ÜRÜN RAFI (yatay grid)
   ========================================================================== */
.shelf-panel {
  background: var(--color-bg); border: var(--border-thin); border-radius: var(--radius-lg);
  padding: var(--space-5); box-shadow: var(--shadow-1);
}
.shelf {
  display: grid; gap: var(--space-4);
  grid-template-columns: repeat(4, 1fr);
}

/* Ana sayfa urun vitrinleri: masaustunde 6 sutun x 2 sira kompakt kart. */
.shelf--featured-compact {
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 10px;
}
.shelf--featured-compact .pcard {
  min-width: 0;
  border-radius: 14px;
  box-shadow: 0 5px 16px rgba(19, 32, 51, .07);
}
.shelf--featured-compact .pcard__media {
  aspect-ratio: 1 / 1;
}
.shelf--featured-compact .pcard__img {
  max-width: 84%;
  max-height: 84%;
}
.shelf--featured-compact .pcard__fav,
.shelf--featured-compact .pcard__badge,
.shelf--featured-compact .pcard__eyebrow,
.shelf--featured-compact .pcard__desc,
.shelf--featured-compact .pcard__pricing,
.shelf--featured-compact .pcard__commerce-meta,
.shelf--featured-compact .pcard__chips {
  display: none;
}
.shelf--featured-compact .pcard__body {
  gap: 8px;
  padding: 10px;
}
.shelf--featured-compact .pcard__title {
  min-height: 2.7em;
  font-size: .76rem;
  line-height: 1.35;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}
.shelf--featured-compact .pcard__actions {
  grid-template-columns: minmax(0, 1fr) 38px;
  gap: 6px;
  padding-top: 2px;
}
.shelf--featured-compact .pcard__actions :is(.add-to-quote, .add-to-order),
.shelf--featured-compact .pcard__wa {
  min-height: 40px;
  border-radius: 11px;
}
.shelf--featured-compact .pcard__actions :is(.add-to-quote, .add-to-order) {
  justify-content: center;
  padding: 7px 5px;
}
.shelf--featured-compact .pcard__quote-ic,
.shelf--featured-compact .pcard__quote-text small {
  display: none;
}
.shelf--featured-compact .pcard__quote-text {
  align-items: center;
}
.shelf--featured-compact .pcard__quote-text strong {
  font-size: .7rem;
  line-height: 1.15;
  text-align: center;
}
.shelf--featured-compact .pcard__wa {
  min-width: 38px;
  padding: 0;
}
.shelf--featured-compact .pcard__wa .icon {
  width: 1.05rem;
  height: 1.05rem;
}
.shelf--featured-compact .pcard__wa-pulse {
  right: 6px;
  top: 6px;
  width: 5px;
  height: 5px;
}
.shelf--featured-compact .pcard__qt-full {
  display: none;
}
.shelf--featured-compact .pcard__qt-short {
  display: inline;
}
@media (max-width: 1200px) {
  .shelf--featured-compact { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  .shelf--featured-compact { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
.shelf-cta {
  display: flex; justify-content: center;
  padding-top: var(--space-5); border-top: var(--border-thin); margin-top: var(--space-4);
}

/* ==========================================================================
   ALT KATEGORİ TILE GRID — ana kategori sayfası görünümü
   ========================================================================== */
.subcat-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: var(--space-5);
  padding-bottom: var(--space-6);
}

/* Modern dikey kart — orta boy; geniş ekranda 3-4 sütun */
.subcat-tile {
  display: flex; flex-direction: column;
  border: var(--border-thin); border-radius: var(--radius-xl);
  overflow: hidden; background: var(--color-bg); box-shadow: var(--shadow-1);
  text-decoration: none; color: inherit;
  transition: box-shadow .2s var(--ease-out), transform .2s var(--ease-out), border-color .2s var(--ease-color);
}
@media (hover: hover) and (pointer: fine) {
  .subcat-tile:hover { box-shadow: var(--shadow-3); transform: translateY(-5px); border-color: var(--color-accent); }
}

.subcat-tile__media {
  position: relative; aspect-ratio: 4 / 3; overflow: hidden;
  background: linear-gradient(180deg, #ffffff 0%, #f6f9ff 100%);
  display: flex; align-items: center; justify-content: center;
  padding: var(--space-3); border-bottom: 1px solid #eef3fb;
}
.subcat-tile__media img {
  max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain;
  transition: transform .35s var(--ease-out);
}
.subcat-tile:hover .subcat-tile__media img { transform: scale(1.05); }
.subcat-tile__fallback { color: var(--color-ink-mute); }
.subcat-tile__fallback .icon { width: 52px; height: 52px; }

.subcat-tile__count {
  position: absolute; top: var(--space-3); right: var(--space-3);
  background: var(--color-ink); color: var(--color-on-dark);
  font-size: var(--fs-50); font-weight: var(--fw-bold); letter-spacing: .02em;
  padding: 3px 10px; border-radius: var(--radius-pill); box-shadow: var(--shadow-1);
}
.subcat-tile__ic {
  position: absolute; left: var(--space-4); bottom: -20px;
  width: 44px; height: 44px; border-radius: var(--radius-md);
  background: var(--color-accent); color: var(--color-on-accent);
  display: grid; place-items: center; box-shadow: var(--shadow-2);
  border: 3px solid var(--color-bg);
}
.subcat-tile__ic .icon { width: 22px; height: 22px; }

.subcat-tile__body {
  padding: calc(var(--space-5) + 4px) var(--space-5) var(--space-5);
  display: flex; flex-direction: column; gap: var(--space-2); flex: 1;
}
.subcat-tile__body h3 {
  font-size: var(--fs-200); font-weight: 700; margin: 0; line-height: 1.25; color: var(--color-ink);
}
.subcat-tile__body > p {
  font-size: var(--fs-75); color: var(--color-ink-soft); margin: 0; line-height: 1.45; flex: 1;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.subcat-tile__cta {
  margin-top: var(--space-1); font-size: var(--fs-75); font-weight: var(--fw-semibold);
  color: var(--color-ink); display: inline-flex; align-items: center; gap: 5px;
}
.subcat-tile__cta .icon { width: 1em; height: 1em; transition: transform .18s var(--ease-out); }
.subcat-tile:hover .subcat-tile__cta { color: var(--color-accent-strong, var(--color-accent)); }
.subcat-tile:hover .subcat-tile__cta .icon { transform: translateX(4px); }

/* Mobil: tek sütun */
@media (max-width: 680px) {
  .subcat-grid { grid-template-columns: 1fr; gap: var(--space-4); }
  .subcat-tile__media { aspect-ratio: 4 / 3; }
}

/* Son gezdiğiniz ürünler — yatay kaydırılır şerit (aynı .pcard kartları) */
.recent-strip {
  display: grid; grid-auto-flow: column; grid-auto-columns: minmax(264px, 300px);
  justify-content: start;
  gap: var(--space-4); overflow-x: auto; padding-bottom: var(--space-3);
  scroll-snap-type: x proximity; scrollbar-width: thin;
}
.recent-strip .pcard { scroll-snap-align: start; }
.recent-strip::-webkit-scrollbar { height: 8px; }
.recent-strip::-webkit-scrollbar-track { background: transparent; }
.recent-strip::-webkit-scrollbar-thumb { background: var(--color-border-strong); border-radius: var(--radius-pill); }
.recent-strip.shelf--featured-compact {
  grid-template-columns: repeat(6, minmax(0, 1fr));
  grid-auto-flow: row;
  grid-auto-columns: auto;
  justify-content: stretch;
  overflow: visible;
  padding-bottom: 0;
  scroll-snap-type: none;
}
@media (max-width: 1200px) {
  .recent-strip.shelf--featured-compact { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 680px) {
  .recent-strip.shelf--featured-compact { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Ana sayfa — admin tarafından seçilen popüler blog yazıları. */
.home-post-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--space-4);
}
.home-post-card {
  min-width: 0;
  overflow: hidden;
  color: inherit;
  text-decoration: none;
  background: var(--color-bg);
  border: var(--border-thin);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-1);
  transition: transform var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-color), border-color var(--dur-fast) var(--ease-color);
}
.home-post-card__media {
  display: grid;
  place-items: center;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: #f1f5f9;
}
.home-post-card__media img { width: 100%; height: 100%; object-fit: cover; }
.home-post-card__placeholder { color: var(--color-ink-mute); }
.home-post-card__placeholder .icon { width: 38px; height: 38px; }
.home-post-card__body { display: flex; flex-direction: column; gap: 7px; padding: var(--space-4); }
.home-post-card__meta { color: var(--color-accent-strong); font-size: var(--fs-50); font-weight: var(--fw-bold); text-transform: uppercase; }
.home-post-card__body strong { min-height: 2.7em; color: var(--color-ink); font-size: var(--fs-100); line-height: 1.35; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }
.home-post-card__excerpt { color: var(--color-ink-soft); font-size: var(--fs-75); line-height: 1.45; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }
.home-post-card__more { display: inline-flex; align-items: center; gap: 5px; margin-top: auto; color: var(--color-ink); font-size: var(--fs-75); font-weight: var(--fw-semibold); }
.home-post-card__more .icon { width: 1em; height: 1em; }
@media (hover:hover) and (pointer:fine) {
  .home-post-card:hover { transform: translateY(-3px); border-color: var(--color-accent); box-shadow: var(--shadow-2); }
}
@media (max-width: 980px) { .home-post-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .home-post-grid { grid-template-columns: 1fr; } }
.link-more--btn { cursor: pointer; }
.link-more--btn:active { transform: scale(0.97); }

/* Toplu teklif CTA şeridi */
.bulk-cta {
  background: var(--color-ink); color: var(--color-on-dark);
  border-radius: var(--radius-lg); overflow: hidden; position: relative;
  display: flex; align-items: center; justify-content: space-between;
  gap: var(--space-5); padding: var(--space-6) var(--space-7); flex-wrap: wrap;
}
/* Yapısal sol vurgu çubuğu — diyagonal hazard deseni yerine */
.bulk-cta::before {
  content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 5px;
  background: var(--color-accent); pointer-events: none;
}
.bulk-cta__text { position: relative; }
.bulk-cta h2 { color: var(--color-on-dark); font-size: var(--fs-400); letter-spacing: 0; }
.bulk-cta p { color: var(--color-on-dark-soft); margin-top: var(--space-2); max-width: 52ch; }
.bulk-cta__action { position: relative; }

/* Ana sayfa — neden Tedarikçiniz */
.home-why { padding-top: 0; }
.home-why__panel {
  position: relative;
  overflow: hidden;
  padding: clamp(var(--space-5), 4vw, var(--space-8));
  border: var(--border-thin);
  border-radius: var(--radius-xl);
  background:
    radial-gradient(circle at 92% 0, rgba(245, 197, 24, .16), transparent 28%),
    linear-gradient(145deg, #fff 0%, var(--color-surface) 100%);
  box-shadow: var(--shadow-1);
}
.home-why__head {
  display: grid;
  grid-template-columns: minmax(260px, .8fr) minmax(0, 1.2fr);
  align-items: end;
  gap: var(--space-6);
  padding-bottom: var(--space-6);
  border-bottom: var(--border-thin);
}
.home-why__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  margin-bottom: var(--space-3);
  color: #8a6100;
  font-size: var(--fs-50);
  font-weight: var(--fw-bold);
  letter-spacing: var(--tracking-wide);
  text-transform: uppercase;
}
.home-why__eyebrow .icon { width: 1.05rem; height: 1.05rem; }
.home-why__head h2 {
  max-width: 16ch;
  font-size: clamp(var(--fs-400), 2.4vw, var(--fs-600));
  line-height: var(--lh-tight);
  letter-spacing: var(--tracking-tight);
}
.home-why__head > p {
  max-width: 70ch;
  margin: 0;
  color: var(--color-ink-soft);
  font-size: var(--fs-100);
  line-height: var(--lh-relaxed);
}
.home-why__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-4);
  margin-top: var(--space-6);
}
.home-why__card {
  display: flex;
  align-items: flex-start;
  gap: var(--space-4);
  min-width: 0;
  padding: var(--space-5);
  border: 1px solid color-mix(in srgb, var(--color-border) 82%, transparent);
  border-radius: var(--radius-lg);
  background: color-mix(in srgb, var(--color-bg) 92%, transparent);
  transition: transform var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-color), box-shadow var(--dur-fast) var(--ease-color);
}
.home-why__icon {
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: var(--radius-md);
  background: var(--color-accent-soft);
  color: #8a6100;
}
.home-why__icon .icon { width: 1.35rem; height: 1.35rem; }
.home-why__card h3 {
  margin: 0 0 var(--space-2);
  color: var(--color-ink);
  font-size: var(--fs-100);
  line-height: var(--lh-tight);
}
.home-why__card p {
  margin: 0;
  color: var(--color-ink-mute);
  font-size: var(--fs-75);
  line-height: var(--lh-relaxed);
}
@media (hover:hover) and (pointer:fine) {
  .home-why__card:hover {
    transform: translateY(-3px);
    border-color: color-mix(in srgb, var(--color-accent) 55%, var(--color-border));
    box-shadow: var(--shadow-2);
  }
}
.home-why__footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-5);
  margin-top: var(--space-6);
  padding-top: var(--space-5);
  border-top: var(--border-thin);
}
.home-why__footer > p {
  max-width: 58ch;
  margin: 0;
  color: var(--color-ink-soft);
  font-size: var(--fs-75);
}
.home-why__actions { display: flex; align-items: center; gap: var(--space-4); }
.home-why__actions .link-more { white-space: nowrap; }

.home-process { padding-top: 0; }
.home-process__panel {
  padding: clamp(var(--space-5), 3vw, var(--space-7));
  border: var(--border-thin); border-radius: var(--radius-xl);
  background: var(--color-bg); box-shadow: var(--shadow-1);
}
.home-process__head { display: flex; align-items: end; justify-content: space-between; gap: var(--space-6); }
.home-process__head h2 { margin-top: var(--space-2); font-size: clamp(var(--fs-300), 2.2vw, var(--fs-500)); }
.home-process__head > p { max-width: 48ch; color: var(--color-ink-soft); font-size: var(--fs-75); }
.home-process__steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-4); margin-top: var(--space-6); }
.home-process__steps li { display: grid; grid-template-columns: 38px minmax(0, 1fr); gap: var(--space-3); min-width: 0; padding: var(--space-4); border: var(--border-thin); border-radius: var(--radius-lg); background: var(--color-surface); }
.home-process__number { display: grid; place-items: center; width: 36px; height: 36px; border-radius: var(--radius-pill); background: var(--color-accent); color: var(--color-on-accent); font-weight: var(--fw-bold); }
.home-process__steps h3 { font-size: var(--fs-100); }
.home-process__steps p { margin-top: var(--space-2); color: var(--color-ink-soft); font-size: var(--fs-75); line-height: var(--lh-relaxed); }
.home-process__foot { display: flex; align-items: center; justify-content: space-between; gap: var(--space-5); margin-top: var(--space-5); padding-top: var(--space-4); border-top: var(--border-thin); }
.home-process__foot nav, .home-process__actions { display: flex; align-items: center; flex-wrap: wrap; gap: var(--space-3) var(--space-4); }
.home-process__foot nav a { color: var(--color-ink-soft); font-size: var(--fs-50); text-decoration: underline; text-underline-offset: 3px; }
.home-process__actions .link-more { white-space: nowrap; }

@media (max-width: 1000px) {
  .home-why__head { grid-template-columns: 1fr; align-items: start; gap: var(--space-3); }
  .home-why__head h2 { max-width: none; }
  .home-why__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .home-why__footer { align-items: flex-start; flex-direction: column; }
}
@media (max-width: 840px) {
  .home-process__head, .home-process__foot { align-items: flex-start; flex-direction: column; }
  .home-process__steps { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .home-process__panel { padding: var(--space-5); border-radius: var(--radius-lg); }
  .home-process__actions { align-items: stretch; width: 100%; flex-direction: column; }
  .home-process__actions .btn { width: 100%; justify-content: center; }
}
@media (max-width: 620px) {
  .home-why__panel { padding: var(--space-5); border-radius: var(--radius-lg); }
  .home-why__head { padding-bottom: var(--space-4); }
  .home-why__head > p { font-size: var(--fs-75); line-height: var(--lh-relaxed); }
  .home-why__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-2); margin-top: var(--space-4); }
  .home-why__card { flex-direction: column; gap: var(--space-2); padding: var(--space-3); }
  .home-why__card h3 { font-size: var(--fs-75); margin-bottom: var(--space-1); }
  .home-why__card p { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 3; font-size: var(--fs-50); }
  .home-why__footer { gap: var(--space-3); margin-top: var(--space-4); padding-top: var(--space-4); }
  .home-why__actions { width: 100%; align-items: stretch; flex-direction: column; }
  .home-why__actions .btn { width: 100%; justify-content: center; }
}

/* ==========================================================================
   ORTAK: breadcrumb + sayfa başlığı (page-hero) + bölüm yardımcıları
   ========================================================================== */
.section--tight { padding-block: var(--space-6); }

.breadcrumb { display: flex; align-items: center; flex-wrap: wrap; gap: var(--space-2);
  font-size: var(--fs-75); color: var(--color-ink-mute); margin-bottom: var(--space-4); }
.breadcrumb a { color: var(--color-ink-soft); }
.breadcrumb .icon { width: .85rem; height: .85rem; color: var(--color-ink-mute); }
.breadcrumb span { color: var(--color-ink); font-weight: var(--fw-medium); }
@media (hover: hover) and (pointer: fine) { .breadcrumb a:hover { color: var(--color-ink); text-decoration: underline; } }
/* Mobil: breadcrumb tek satır, kaydırılabilir; son halka (ürün adı) uzunsa … ile kısalır. */
@media (max-width: 600px) {
  .breadcrumb { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
  .breadcrumb::-webkit-scrollbar { display: none; }
  .breadcrumb > a, .breadcrumb > span { flex: none; white-space: nowrap; }
  .breadcrumb > span:last-child { max-width: 20ch; overflow: hidden; text-overflow: ellipsis; }
}

.page-hero { background: var(--color-dark); color: var(--color-on-dark);
  position: relative; overflow: hidden; padding-block: clamp(var(--space-7), 6vw, var(--space-9)); }
.page-hero::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px;
  background: var(--color-accent); pointer-events: none; z-index: 1; }
.page-hero::after { content: ""; position: absolute; inset: 0; pointer-events: none;
  background-image: repeating-linear-gradient(90deg, rgba(244,244,245,.03) 0 1px, transparent 1px 72px); }
.page-hero--compact { padding-block: clamp(var(--space-6), 4vw, var(--space-7)); }
.page-hero > .container { position: relative; }
.page-hero__eyebrow { color: var(--color-accent); margin-bottom: var(--space-3); }
.page-hero h1 { color: var(--color-on-dark); max-width: 20ch; }
.page-hero h1 .accent { color: var(--color-accent); }
.page-hero__lede { margin-top: var(--space-4); color: var(--color-on-dark-soft);
  font-size: var(--fs-200); max-width: 60ch; }
.page-hero__actions { margin-top: var(--space-6); display: flex; flex-wrap: wrap; gap: var(--space-4); }

/* ==========================================================================
   LİSTELEME (kategori.php)
   ========================================================================== */
.listing-head { background: var(--color-surface); border-bottom: var(--border-thin); padding-block: var(--space-6); }
/* Ana kategori (KKD) açılış başlığı — premium his veren yumuşak gradyan */
.listing-head--hero {
  padding-block: var(--space-7);
  background:
    radial-gradient(130% 150% at 0% 0%, var(--color-accent-soft) 0%, transparent 52%),
    linear-gradient(180deg, var(--color-surface) 0%, var(--color-bg) 100%);
}
.listing-head__title { display: flex; align-items: center; gap: var(--space-3); }
.listing-head__title h1 { margin: 0; }
.listing-head h1 { font-size: var(--fs-500); }
.listing-head__ic {
  flex: none; width: 46px; height: 46px; border-radius: var(--radius-lg);
  background: var(--color-accent-soft); color: var(--color-accent-strong);
  display: grid; place-items: center;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--color-accent) 22%, transparent);
}
.listing-head__ic .icon { width: 26px; height: 26px; }
.listing-head__count { margin-top: var(--space-2); color: var(--color-ink-soft); font-size: var(--fs-75); }
.listing-head__count strong { color: var(--color-ink); }
/* Mobil: başlık bölümünü sıkılaştır (ürünler daha erken görünsün). */
@media (max-width: 600px) {
  .listing-head { padding-block: var(--space-4); }
  .listing-head h1 { font-size: var(--fs-400); line-height: 1.15; }
  .listing-head__ic { width: 40px; height: 40px; }
  .listing-head__ic .icon { width: 22px; height: 22px; }
}
.listing-head__blurb {
  margin-top: var(--space-3); max-width: 70ch;
  color: var(--color-ink-soft); font-size: var(--fs-100); line-height: 1.6;
}
/* "Devamını oku" düğmesi (JS mobilde, metin taşarsa enjekte eder). Tam metin DOM'da kalır → SEO korunur. */
.listing-head__blurb-toggle {
  background: none; border: 0; padding: 4px 0 0; margin: 0;
  color: #0056b3; font-weight: var(--fw-semibold); font-size: var(--fs-75); cursor: pointer;
}
@media (max-width: 600px) {
  .listing-head__blurb {
    display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden;
    margin-top: var(--space-2);
  }
  .listing-head__blurb.is-expanded {
    display: block; -webkit-line-clamp: unset; overflow: visible;
  }
}
@media (min-width: 960px) {
  .listing-head--with-blurb > .container {
    display: grid;
    grid-template-columns: minmax(260px, .7fr) minmax(0, 1.6fr);
    column-gap: clamp(var(--space-7), 6vw, 112px);
    align-items: start;
  }
  .listing-head--with-blurb .breadcrumb {
    grid-column: 1 / -1;
    grid-row: 1;
  }
  .listing-head--with-blurb .listing-head__summary {
    grid-column: 1;
    grid-row: 2;
  }
  .listing-head--with-blurb .listing-head__blurb {
    grid-column: 2;
    grid-row: 2;
    max-width: none;
    margin-top: 0;
  }
  .listing-head--with-blurb .subcat-rail {
    grid-column: 1 / -1;
    grid-row: 3;
    margin-top: var(--space-5);
  }
}
.listing { display: grid; grid-template-columns: 248px minmax(0, 1fr); gap: var(--space-6); align-items: start; }
.listing__results { min-width: 0; }

/* ==========================================================================
   F�LTRE S�TUNU (�r�n Listeleme)
   ========================================================================== */
.filters {
  position: sticky; top: var(--space-6);
  background: var(--color-bg);
  border: 1px solid rgba(0,0,0,0.06);
  border-radius: var(--radius-xl);
  box-shadow: 0 4px 12px rgba(0,0,0,0.02);
  padding: var(--space-5);
  /* Filtre uzun olduğunda kendi içinde kaydırılsın → sayfayı en alta kaydırmaya gerek yok */
  max-height: calc(100vh - 2 * var(--space-6));
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: color-mix(in srgb, var(--color-accent) 70%, var(--color-ink)) transparent;
}
.filters::-webkit-scrollbar { width: 8px; }
.filters::-webkit-scrollbar-track { background: transparent; }
.filters::-webkit-scrollbar-thumb { background: color-mix(in srgb, var(--color-accent) 75%, var(--color-ink)); border-radius: 999px; }
.filters__sub--3 { margin-left: var(--space-3); border-left: 1px solid rgba(0,0,0,0.07); padding-left: var(--space-2); }
.filters__head { 
  display: flex; align-items: center; justify-content: space-between; gap: var(--space-3);
  margin-bottom: var(--space-4); border-bottom: 1px solid rgba(0,0,0,0.06); padding-bottom: var(--space-3); 
}
.filters__head h2 { font-size: var(--fs-100); font-weight: var(--fw-bold); color: var(--color-ink); }
.filters__toggle { display: none; }
.filters__group { padding-block: var(--space-3); border-top: 1px dashed rgba(0,0,0,0.06); }
.filters__group:first-child { border-top: none; padding-top: 0; }
.filters__group h2 { 
  font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.05em;
  color: var(--color-ink-mute); font-weight: var(--fw-bold); margin-bottom: var(--space-3); 
}
/* A��l�r/kapan�r grup ba�l��� (details/summary) */
.filters__group > summary { 
  display: flex; align-items: center; justify-content: space-between; gap: var(--space-2);
  cursor: pointer; list-style: none; margin-bottom: var(--space-2); user-select: none; 
  padding-block: var(--space-1);
}
.filters__group > summary::-webkit-details-marker { display: none; }
.filters__grouptitle { 
  font-size: 0.85rem; text-transform: uppercase; letter-spacing: 0.02em;
  color: var(--color-ink); font-weight: var(--fw-bold); 
}
.filters__chevron { 
  width: 1.1em; height: 1.1em; color: var(--color-ink-mute); flex: none;
  transition: transform var(--dur-fast) var(--ease-out); 
}
.filters__group[open] > summary .filters__chevron { transform: rotate(180deg); }
.filters__search {
  display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 8px;
  min-height: 44px; margin: 4px 0 8px; padding: 0 12px; border: 1px solid var(--color-border);
  border-radius: var(--radius-md); background: #fff; color: var(--color-ink-mute);
}
.filters__search .icon { width: 1rem; height: 1rem; }
.filters__search input { width: 100%; min-width: 0; border: 0; outline: 0; background: transparent; color: var(--color-ink); font: inherit; }
.filters__no-result { padding: 12px; color: var(--color-ink-mute); font-size: var(--fs-75); text-align: center; }
@media (hover: hover) and (pointer: fine) { 
  .filters__group > summary:hover .filters__grouptitle,
  .filters__group > summary:hover .filters__chevron { color: var(--color-accent-strong); } 
}
.filters__group ul { display: flex; flex-direction: column; gap: 4px; }
.filters__group a { 
  display: flex; align-items: center; gap: var(--space-3);
  padding: 6px var(--space-3); border-radius: var(--radius-md);
  font-size: var(--fs-75); color: #4b5563;
  transition: all 0.2s ease; 
  position: relative;
}
.filters__group a .icon { width: 1.2em; height: 1.2em; color: #9ca3af; }
/* Checkbox efekti */
.filters__group a::before {
  content: ""; display: block; width: 16px; height: 16px; flex: none;
  border: 1px solid #d1d5db; border-radius: 4px; background: #fff;
  transition: all 0.2s ease;
}
.filters__group a.is-active::before {
  background: var(--color-accent); border-color: var(--color-accent);
  box-shadow: inset 0 0 0 2px #fff;
}
.filters__group a.is-active { background: #f3f4f6; color: var(--color-ink); font-weight: var(--fw-semibold); }
.filters__group a.is-active .icon { color: var(--color-accent-strong); }
@media (hover: hover) and (pointer: fine) {
  .filters__group a:hover { background: #f9fafb; color: var(--color-ink); }
  .filters__group a:hover::before { border-color: #9ca3af; }
}
/* Aktif ana kategorinin alt kategorileri (girintili) */
.filters__sub { 
  margin: 4px 0 var(--space-3) 24px;
  padding-left: var(--space-3); border-left: 2px solid #e5e7eb; 
  display: flex; flex-direction: column; gap: 4px;
}
.filters__sub a { padding-block: 4px; font-size: 0.8rem; color: #6b7280; }
.filters__sub a::before { display: none; /* Alt kategorilerde checkbox gizli */ }
.filters__sub a.is-active { background: transparent; color: var(--color-accent-strong); font-weight: var(--fw-bold); }
.filters__clear { 
  display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2); 
  margin-top: var(--space-5); width: 100%;
  padding: var(--space-2); border-radius: var(--radius-md);
  background: #fff0f0; border: 1px solid #fed7d7;
  font-size: var(--fs-75); font-weight: var(--fw-medium); color: var(--color-danger); 
  transition: all 0.2s ease;
}
.filters__clear .icon { width: 1.1em; height: 1.1em; }
@media (hover: hover) and (pointer: fine) { 
  .filters__clear:hover { background: #fed7d7; border-color: #fca5a5; } 
}

.grid-products { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-4); }
.grid-products--3col { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid-products--4col { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-3); }
/* 4 sütunda kartlar biraz küçülsün */
.grid-products--4col .pcard__body { gap: 0.5rem; padding: 0.85rem 0.9rem 0.95rem; }
.grid-products--4col .pcard__title { font-size: var(--fs-75); }
.grid-products--4col .pcard__desc { font-size: var(--fs-50); -webkit-line-clamp: 2; }
.grid-products--4col .pcard__eyebrow { font-size: var(--fs-25, 0.66rem); }
.grid-products--4col .pcard__quote-btn small { display: none; }
.grid-products--4col .pcard__chips { display: none; }

.listing__empty { text-align: center; padding: var(--space-9) var(--space-5);
  border: 1px dashed var(--color-border-strong); border-radius: var(--radius-lg); background: var(--color-bg); }
.listing__empty-icon { display: inline-grid; place-items: center; width: 60px; height: 60px;
  border-radius: var(--radius-pill); background: var(--color-surface); color: var(--color-ink-mute); margin-bottom: var(--space-4); }
.listing__empty-icon .icon { width: 28px; height: 28px; }
.listing__empty h2 { font-size: var(--fs-400); }
.listing__empty p { margin-top: var(--space-2); color: var(--color-ink-soft); max-width: 46ch; margin-inline: auto; }
.listing__empty-actions { margin-top: var(--space-5); display: flex; gap: var(--space-3); justify-content: center; flex-wrap: wrap; }

/* ==========================================================================
   ÜRÜN DETAY (urun.php)
   ========================================================================== */
.pdetail { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: var(--space-7); align-items: start; }
.pdetail__media { position: relative; aspect-ratio: 4 / 3; display: grid; place-items: center;
  background: var(--color-surface); border: var(--border-thin); border-radius: var(--radius-xl); }
.pdetail__thumb { display: grid; place-items: center; width: 140px; height: 140px;
  border-radius: var(--radius-xl); background: var(--color-bg); box-shadow: var(--shadow-2); }
.pdetail__thumb .icon { width: 72px; height: 72px; color: var(--color-ink-soft); }

.pdetail__cat { display: inline-flex; align-items: center; gap: var(--space-2);
  font-size: var(--fs-75); font-weight: var(--fw-medium); color: var(--color-ink-soft); }
.pdetail__cat .icon { width: 1.05em; height: 1.05em; color: var(--color-accent); }
.pdetail__info .pcard__brand { display: block; margin-top: var(--space-3); }
.pdetail__info h1 { font-size: var(--fs-500); margin-top: var(--space-1); }
.pdetail__quote-note { display: inline-flex; align-items: center; gap: var(--space-2); margin-top: var(--space-4);
  font-size: var(--fs-75); color: var(--color-ink-soft); background: var(--color-accent-soft);
  padding: var(--space-2) var(--space-3); border-radius: var(--radius-md); }
.pdetail__quote-note .icon { width: 1.05rem; height: 1.05rem; }
.pdetail__moq { display: inline-flex; align-items: center; gap: var(--space-2); margin: var(--space-4) 0 0;
  font-size: var(--fs-75); font-weight: var(--fw-semibold); color: var(--color-ink);
  background: var(--color-accent-soft); border: 1px solid var(--color-accent);
  padding: var(--space-2) var(--space-3); border-radius: var(--radius-md); }
.pdetail__moq strong { color: var(--color-ink); }
.pdetail__moq .icon { width: 1.05rem; height: 1.05rem; color: var(--color-ink); }

.spec-table { width: 100%; margin-top: var(--space-5); border-collapse: collapse; font-size: var(--fs-75); }
.spec-table th, .spec-table td { text-align: left; padding: var(--space-3) var(--space-3); border-bottom: var(--border-thin); }
.spec-table th { color: var(--color-ink-mute); font-weight: var(--fw-medium); width: 38%; }
.spec-table td { color: var(--color-ink); font-weight: var(--fw-medium); }

.pdetail__buy { display: flex; flex-wrap: wrap; gap: var(--space-3); margin-top: var(--space-6); align-items: stretch; }
.qty-stepper { display: inline-flex; align-items: center; border: var(--border-base); border-radius: var(--radius-md); overflow: hidden; }
.qty-stepper .qstep { width: 44px; align-self: stretch; font-size: var(--fs-300); color: var(--color-ink);
  transition: background-color var(--dur-fast) var(--ease-color), transform var(--dur-press) var(--ease-out); }
.qty-stepper .qstep:active { transform: scale(0.92); }
@media (hover: hover) and (pointer: fine) { .qty-stepper .qstep:hover { background: var(--color-surface); } }
.qty-stepper__input { width: 56px; text-align: center; border: 0; border-inline: var(--border-thin);
  font-size: var(--fs-200); font-weight: var(--fw-semibold); -moz-appearance: textfield; }
.qty-stepper__input::-webkit-outer-spin-button, .qty-stepper__input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.pdetail__buy .add-to-quote { flex: 1; min-width: 220px; }

.pdetail__trust { margin-top: var(--space-6); display: flex; flex-wrap: wrap; gap: var(--space-4);
  padding-top: var(--space-5); border-top: var(--border-thin); }
.pdetail__trust li { display: flex; align-items: center; gap: var(--space-2); font-size: var(--fs-75); color: var(--color-ink-soft); }
.pdetail__trust .icon { width: 1.1rem; height: 1.1rem; color: var(--color-accent); }

/* ==========================================================================
   HAKKIMIZDA — değer kartları
   ========================================================================== */
.value-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-4); }
.value-card { background: var(--color-bg); border: var(--border-thin); border-radius: var(--radius-lg);
  padding: var(--space-5); display: flex; flex-direction: column; gap: var(--space-3);
  transition: transform var(--dur-base) var(--ease-out), box-shadow var(--dur-base) var(--ease-color); }
.value-card__icon { display: grid; place-items: center; width: 48px; height: 48px;
  border-radius: var(--radius-md); background: var(--color-accent-soft); }
.value-card__icon .icon { width: 26px; height: 26px; color: var(--color-ink); }
.value-card h3 { font-size: var(--fs-200); letter-spacing: 0; }
.value-card p { font-size: var(--fs-75); color: var(--color-ink-soft); }
@media (hover: hover) and (pointer: fine) {
  .value-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-2); }
}

/* ==========================================================================
   İLETİ�?İM
   ========================================================================== */
.contact { display: grid; grid-template-columns: 0.9fr 1.1fr; gap: var(--space-6); align-items: start; }
.contact__info h2 { font-size: var(--fs-300); letter-spacing: 0; margin-bottom: var(--space-4); }
.contact__channels { display: flex; flex-direction: column; gap: var(--space-4); }
.contact__channels li { display: flex; gap: var(--space-3); align-items: center; }
.contact__ic { flex: none; display: grid; place-items: center; width: 44px; height: 44px;
  border-radius: var(--radius-md); background: var(--color-surface); border: var(--border-thin); }
.contact__ic .icon { width: 1.3rem; height: 1.3rem; color: var(--color-ink); }
.contact__channels span span, .contact__channels li > span { display: flex; flex-direction: column; }
.contact__channels small { font-size: var(--fs-50); color: var(--color-ink-mute);
  text-transform: uppercase; letter-spacing: var(--tracking-wide); }
.contact__channels a, .contact__channels strong { font-size: var(--fs-100); font-weight: var(--fw-semibold); color: var(--color-ink); }
.contact__channels a { overflow-wrap: anywhere; }
.contact__addr { margin-top: var(--space-6); padding-top: var(--space-5); border-top: var(--border-thin); }
.contact__addr h3 { font-size: var(--fs-75); text-transform: uppercase; letter-spacing: var(--tracking-wide);
  color: var(--color-ink-mute); margin-bottom: var(--space-2); }
.contact__addr address { font-style: normal; color: var(--color-ink-soft); line-height: var(--lh-normal); }

.contact__form-card { background: var(--color-bg); border: var(--border-thin);
  border-radius: var(--radius-xl); box-shadow: var(--shadow-2); padding: var(--space-6); }
.contact__form-card h2 { font-size: var(--fs-300); letter-spacing: 0; display: inline-flex; align-items: center; gap: var(--space-2); }
.contact__form-card h2 .icon { width: 1.3rem; height: 1.3rem; color: var(--color-accent); }
.contact__form-lede { margin-top: var(--space-2); margin-bottom: var(--space-5); color: var(--color-ink-soft); font-size: var(--fs-75); }
.contact-form { display: flex; flex-direction: column; gap: var(--space-4); }
.contact__kvkk { font-size: var(--fs-50); color: var(--color-ink-mute); text-align: center; }
.contact__kvkk a { color: var(--color-ink-soft); text-decoration: underline; }
/* "Size Nasıl Ulaşalım?" iletişim tercihi pill'leri (drawer teklif formuyla aynı görsel) */
.contact-form__prefs { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-2); }
.contact-form__pref-opt { display: flex; align-items: center; gap: var(--space-2); padding: var(--space-2) var(--space-3);
  border: var(--border-base); border-radius: var(--radius-md); cursor: pointer; font-size: var(--fs-75);
  transition: border-color var(--dur-fast) var(--ease-color); }
.contact-form__pref-opt:has(input:checked) { border-color: var(--color-accent); background: var(--color-accent-soft); }
.contact-file { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: var(--space-3);
  min-height: 92px; padding: var(--space-4); border: 1.5px dashed var(--color-border-strong);
  border-radius: var(--radius-lg); background: var(--color-surface); cursor: pointer;
  transition: border-color var(--dur-fast) var(--ease-color), background-color var(--dur-fast) var(--ease-color), box-shadow var(--dur-fast) var(--ease-color); }
.contact-file:hover, .contact-file.is-dragover { border-color: var(--color-accent-strong); background: var(--color-accent-soft); }
.contact-file:focus-within { border-color: var(--color-accent); box-shadow: var(--focus-ring); }
.contact-file input { position: absolute; width: 1px; height: 1px; overflow: hidden; opacity: 0; pointer-events: none; }
.contact-file__icon, .contact-file__selected-icon { display: grid; place-items: center; flex: none; width: 44px; height: 44px;
  border-radius: var(--radius-md); background: var(--color-accent-soft); color: var(--color-ink); }
.contact-file__icon .icon, .contact-file__selected-icon .icon { width: 22px; height: 22px; }
.contact-file__copy { display: grid; gap: 4px; min-width: 0; }
.contact-file__copy strong { color: var(--color-ink); font-size: var(--fs-75); }
.contact-file__copy small { color: var(--color-ink-mute); font-size: var(--fs-50); line-height: 1.45; }
.contact-file__action { padding: 9px 12px; border: var(--border-base); border-radius: var(--radius-md); background: var(--color-bg);
  color: var(--color-ink); font-size: var(--fs-50); font-weight: var(--fw-semibold); white-space: nowrap; }
.contact-file__selected { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: var(--space-3);
  margin-top: var(--space-2); padding: var(--space-3); border: 1px solid #b7e4c7; border-radius: var(--radius-md); background: #f0fdf4; }
.contact-file__selected[hidden] { display: none; }
.contact-file__selected > span:nth-child(2) { display: grid; gap: 3px; min-width: 0; }
.contact-file__selected strong { overflow: hidden; color: var(--color-ink); font-size: var(--fs-75); text-overflow: ellipsis; white-space: nowrap; }
.contact-file__selected small { color: var(--color-ink-mute); font-size: var(--fs-50); }
.contact-file__selected button { display: grid; place-items: center; width: 36px; height: 36px; border: 0; border-radius: var(--radius-md);
  background: transparent; color: var(--color-ink-mute); cursor: pointer; }
.contact-file__selected button:hover { background: #fee2e2; color: var(--color-danger); }
.contact-file__selected button .icon { width: 18px; height: 18px; }

/* ==========================================================================
   LİSTELEME/SAYFA RESPONSIVE
   ========================================================================== */
@media (max-width: 1000px) {
  .grid-products { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .value-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 860px) {
  .listing { grid-template-columns: minmax(0, 1fr); }
  /* Mobil: filtre kartının çerçevesi/dolgusu kaldırıldı → sadece buton, çok yer kaplamasın. */
  .filters { position: static; max-height: none; overflow: visible;
    background: none; border: 0; box-shadow: none; padding: 0; margin-bottom: var(--space-3); }
  .filters__toggle { display: inline-flex; align-items: center; gap: var(--space-2);
    background: var(--color-bg); border: var(--border-base); border-radius: var(--radius-md);
    padding: var(--space-3) var(--space-4); font-weight: var(--fw-semibold); width: 100%; justify-content: center; }
  .filters__toggle .icon { width: 1.1em; height: 1.1em; }
  .filters__body { position: static; display: none; margin-top: var(--space-3); }
  .filters__body.is-open { display: block; }
  .filters__group > summary,
  .filters__group a,
  .filters__clear { min-height: 44px; }
  .filters__group[open] > ul {
    max-height: min(42vh, 360px); overflow-y: auto; overscroll-behavior: contain;
    padding-right: 4px; scrollbar-width: thin;
  }
  .pdetail { grid-template-columns: 1fr; gap: var(--space-5); }
  /* Mobilde GetSafe düzeni: önce görsel, sonra başlık/varyant/özellik. */
  .pdetail__gallery { order: -1; }
  .pdetail__buybox { order: 2; }
  /* Buybox içindeki kategori linki breadcrumb'ın son halkasıyla aynı → mobilde gizle. */
  .pdetail__cat { display: none; }
  .contact { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .listing .grid-products > .pcard.is-mobile-deferred { display: none !important; }
  .mobile-catalog-more { display: flex; justify-content: center; padding: 16px 0 4px; }
  .mobile-catalog-more .btn { min-height: 48px; width: min(100%, 343px); }

  .listing .grid-products,
  .listing .grid-products--3col,
  .listing .grid-products--4col { grid-template-columns: minmax(0, 1fr) !important; gap: 12px; }
  .listing .pcard {
    display: grid; grid-template-columns: 132px minmax(0, 1fr); align-items: stretch;
    border-radius: 17px; min-height: 236px;
  }
  .listing .pcard__media-wrap { min-width: 0; min-height: 100%; }
  .listing .pcard__media {
    width: 100%; height: 100%; min-height: 236px; aspect-ratio: auto;
    border-right: 1px solid #eef3fb; border-bottom: 0;
  }
  .listing .pcard__body,
  .listing .grid-products--4col .pcard__body { min-width: 0; gap: 7px; padding: 12px; }
  .listing .pcard__eyebrow,
  .listing .grid-products--4col .pcard__eyebrow {
    display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 1;
    font-size: .65rem; line-height: 1.25;
  }
  .listing .pcard__title,
  .listing .grid-products--4col .pcard__title {
    display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 3;
    font-size: .9rem; line-height: 1.28;
  }
  .listing .pcard__desc,
  .listing .grid-products--4col .pcard__desc,
  .listing .pcard__chips { display: none; }
  .listing .pcard__pricing { padding: 7px 8px; }
  .listing .pcard__commerce-meta { font-size: .67rem; }
  .listing .pcard__actions { grid-template-columns: minmax(0, 1fr) 44px; gap: 6px; padding-top: 2px; }
  .listing .pcard__actions :is(.add-to-quote, .add-to-order), .listing .pcard__wa { min-height: 46px; border-radius: 13px; }
  .listing .pcard__fav, .listing .pcard__cmp { right: 6px; }
  .listing .pcard__fav { top: 6px; }
  .listing .pcard__cmp { top: 56px; }
  .pdetail__media { aspect-ratio: 4 / 3; max-height: 390px; }
  .pdetail__buybox h1 { font-size: clamp(1.65rem, 8vw, 2.25rem); }
  .value-grid { grid-template-columns: 1fr; }
  .contact .field-row { grid-template-columns: 1fr; }
  .section { padding-block: var(--space-6); }
  .contact__form-card { padding: var(--space-5); }
  .contact-file { grid-template-columns: auto minmax(0, 1fr); }
  .contact-file__action { grid-column: 1 / -1; width: 100%; text-align: center; }
}
@media (max-width: 340px) {
  .grid-products { grid-template-columns: 1fr !important; }
}

/* ========================================================================== 
   YEREL SEO / İSTANBUL ANADOLU YAKASI
   ========================================================================== */
.local-seo { background: linear-gradient(180deg, var(--color-surface, #fff) 0%, #f6f8fb 100%); }
.local-seo__panel {
  border: 1px solid var(--color-border, #dfe5ec); border-radius: var(--radius-xl, 24px);
  background: #fff; padding: clamp(1.25rem, 3vw, 2.5rem); box-shadow: 0 18px 45px rgba(15, 23, 42, .07);
}
.local-seo__intro { max-width: 92ch; }
.local-seo__intro h2, .product-local h2, .local-hub-intro h2 { margin: .35rem 0 .8rem; }
.local-seo__intro p, .product-local p, .local-hub-intro__copy p, .local-district p, .local-focus__card p {
  color: var(--color-ink-mute); line-height: 1.72;
}
.local-seo__eyebrow {
  margin: 0; color: #9a6700 !important; font-size: .76rem; font-weight: 800;
  letter-spacing: .08em; text-transform: uppercase;
}
.local-seo__cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-4); margin-top: var(--space-6); }
.local-seo__card { border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: var(--space-5); background: #f9fafb; }
.local-seo__card h3, .local-seo__districts h3 { margin: 0 0 var(--space-3); font-size: 1rem; }
.local-seo__list { display: grid; gap: .65rem; margin: 0; padding: 0; }
.local-seo__list li { display: flex; align-items: flex-start; gap: .55rem; color: var(--color-ink-mute); }
.local-seo__list svg { flex: 0 0 auto; color: #b77900; margin-top: .15rem; }
.local-seo__districts { margin-top: var(--space-7); }
.local-district-nav { display: flex; flex-wrap: wrap; gap: .55rem; margin-top: var(--space-4); }
.local-district-nav a {
  display: inline-flex; align-items: center; min-height: 36px; padding: .48rem .78rem;
  border: 1px solid var(--color-border); border-radius: 999px; background: #fff;
  color: var(--color-ink); font-size: .84rem; font-weight: 700; text-decoration: none;
}
.local-district-nav a:hover, .local-district-nav a:focus-visible { border-color: #e4a900; background: #fff8dc; }
.local-seo__faq { margin-top: var(--space-6); }
.local-seo__footer { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); margin-top: var(--space-6); }
.local-seo__footer p { margin: 0; color: var(--color-ink-mute); }

.product-local {
  margin-top: var(--space-7); padding: clamp(1.2rem, 3vw, 2rem); border: 1px solid #ead58a;
  border-radius: var(--radius-xl); background: linear-gradient(135deg, #fffbeb, #fff 58%);
}
.product-local__copy { max-width: 92ch; }
.product-local .link-more { display: inline-flex; margin-top: var(--space-5); }

.local-hero { position: relative; overflow: hidden; }
.local-hero::after {
  content: ''; position: absolute; right: -10%; bottom: -45%; width: 38rem; aspect-ratio: 1;
  border-radius: 50%; background: radial-gradient(circle, rgba(255, 193, 7, .18), transparent 68%); pointer-events: none;
}
.local-hub-intro__grid { display: grid; grid-template-columns: minmax(16rem, .8fr) minmax(0, 1.25fr); gap: clamp(1.5rem, 5vw, 4.5rem); align-items: start; }
.local-hub-intro__copy { display: grid; gap: .7rem; }
.local-hub-intro__copy p { margin: 0; }
.local-focus { background: #f6f8fb; }
.local-focus__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-4); }
.local-focus__card {
  display: flex; flex-direction: column; min-width: 0; padding: var(--space-5); border: 1px solid var(--color-border);
  border-radius: var(--radius-xl); background: #fff; box-shadow: 0 10px 30px rgba(15, 23, 42, .05);
}
.local-focus__icon { display: grid; place-items: center; width: 2.7rem; height: 2.7rem; border-radius: .8rem; background: #fff3bf; color: #a66b00; }
.local-focus__card h3 { margin: var(--space-4) 0 var(--space-2); font-size: 1.05rem; }
.local-focus__card p { margin: 0; font-size: .9rem; }
.local-focus__card ul { display: grid; gap: .45rem; margin: var(--space-4) 0; padding: 0; font-size: .84rem; }
.local-focus__card li { display: flex; gap: .45rem; align-items: flex-start; color: var(--color-ink-mute); }
.local-focus__card li svg { flex: 0 0 auto; color: #a66b00; margin-top: .1rem; }
.local-focus__card > a { margin-top: auto; font-weight: 800; text-decoration: none; }
.local-districts__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4); }
.local-district {
  scroll-margin-top: 6rem; padding: clamp(1.2rem, 2.5vw, 2rem); border: 1px solid var(--color-border);
  border-radius: var(--radius-xl); background: #fff;
}
.local-district:target { border-color: #e4a900; box-shadow: 0 0 0 4px rgba(255, 193, 7, .16); }
.local-district__name { color: #9a6700; font-size: .78rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.local-district h3 { margin: .45rem 0 .6rem; }
.local-district__links { display: flex; flex-wrap: wrap; gap: .45rem; margin-top: var(--space-4); }
.local-district__links a { padding: .38rem .65rem; border-radius: .5rem; background: #f2f4f7; color: var(--color-ink); font-size: .8rem; font-weight: 700; text-decoration: none; }
.local-faq .pfaq__list { max-width: none; }

@media (max-width: 1000px) {
  .local-focus__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .local-seo__cards, .local-hub-intro__grid, .local-districts__grid { grid-template-columns: 1fr; }
  .local-seo__footer { align-items: flex-start; flex-direction: column; }
}
@media (max-width: 560px) {
  .local-focus__grid { grid-template-columns: 1fr; }
  .local-seo__panel, .product-local, .local-focus__card, .local-district { border-radius: var(--radius-lg); }
  .local-district-nav { gap: .4rem; }
  .local-district-nav a { min-height: 34px; padding: .4rem .62rem; font-size: .78rem; }
  .local-seo__footer .btn { width: 100%; }
}

/* ==========================================================================
   FOOTER (B2B güven belgesi)
   ========================================================================== */
.site-footer {
  background:
    linear-gradient(rgba(22,22,26,.86), rgba(22,22,26,.92)),
    url('/assets/img/footer-bg.webp') center / cover no-repeat;
  background-color: var(--color-dark);
  color: var(--color-on-dark-soft);
}
.site-footer__grid {
  display: grid; grid-template-columns: 1.4fr 1.8fr 1fr 1.1fr 1.1fr; gap: var(--space-6);
  padding-block: var(--space-8) var(--space-7);
}
.site-footer__claim { margin-top: var(--space-4); color: var(--color-on-dark-soft);
  font-size: var(--fs-75); max-width: 32ch; }
.site-footer__contact { margin-top: var(--space-5); display: flex; flex-direction: column; gap: var(--space-3); }
.site-footer__contact li { display: flex; align-items: center; gap: var(--space-2); font-size: var(--fs-75); }
.site-footer__contact .icon { width: 1.1rem; height: 1.1rem; color: var(--color-accent); flex: none; }
.site-footer__contact a { color: var(--color-on-dark); transition: color var(--dur-fast) var(--ease-color); }
.site-footer__social { margin-top: var(--space-4); display: flex; gap: var(--space-2); }
.site-footer__social-link { display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: var(--radius-md); border: 1px solid rgba(255,255,255,.18); color: var(--color-on-dark); transition: background var(--dur-fast) var(--ease-color), border-color var(--dur-fast) var(--ease-color), color var(--dur-fast) var(--ease-color); }
.site-footer__social-link:hover { background: var(--color-accent); border-color: var(--color-accent); color: #161616; }
.site-footer__social-link .icon { width: 1.25rem; height: 1.25rem; }

/* ===== Blog ===== */
.post-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: var(--space-5); }
.post-card { display: flex; flex-direction: column; background: #fff; border: 1px solid #e2e8f0; border-radius: var(--radius-lg); overflow: hidden; color: inherit; text-decoration: none; transition: transform var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-color), border-color var(--dur-fast) var(--ease-color); }
@media (hover: hover) and (pointer: fine) { .post-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-2); border-color: #cbd5e1; } }
.post-card__media { aspect-ratio: 16 / 9; background: #f1f5f9; display: flex; align-items: center; justify-content: center; overflow: hidden; }
.post-card__media img { width: 100%; height: 100%; object-fit: cover; }
.post-card__ph { color: #cbd5e1; }
.post-card__ph .icon { width: 3rem; height: 3rem; }
.post-card__body { padding: var(--space-4); display: flex; flex-direction: column; gap: var(--space-2); flex: 1; }
.post-card__date { font-size: var(--fs-75); color: var(--color-ink-mute); display: inline-flex; align-items: center; gap: 6px; }
.post-card__date .icon { width: 1em; height: 1em; }
.post-card__title { font-size: var(--fs-200); font-weight: var(--fw-bold); color: var(--color-ink); line-height: 1.3; }
.post-card__excerpt { font-size: var(--fs-75); color: var(--color-ink-soft); line-height: 1.5; }
.post-card__more { margin-top: auto; font-size: var(--fs-75); font-weight: var(--fw-semibold); color: var(--color-accent-strong, #b45309); display: inline-flex; align-items: center; gap: 4px; }
.post-card__more .icon { width: 1em; height: 1em; }

.post-wrap { max-width: 860px; }
.post__title { font-size: clamp(1.6rem, 4vw, 2.4rem); line-height: 1.2; margin: var(--space-3) 0 var(--space-2); color: var(--color-ink); }
.post__meta { color: var(--color-ink-mute); font-size: var(--fs-75); display: inline-flex; align-items: center; gap: 6px; }
.post__meta a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
.post__category, .post-card__category { display: inline-flex; width: fit-content; padding: 5px 10px; border-radius: 999px; background: #fff5cc; color: #7a5600; font-size: var(--fs-75); font-weight: var(--fw-semibold); text-decoration: none; }
.post__cover { width: 100%; height: auto; border-radius: var(--radius-lg); margin: var(--space-4) 0; border: 1px solid #e2e8f0; }
.post__body { font-size: var(--fs-200); line-height: 1.75; color: var(--color-ink-soft); }
.post__body > * + * { margin-top: var(--space-4); }
.post__body h2 { font-size: 1.5rem; color: var(--color-ink); margin-top: var(--space-6); }
.post__body h3 { font-size: 1.2rem; color: var(--color-ink); margin-top: var(--space-5); }
.post__body img { max-width: 100%; height: auto; border-radius: var(--radius-md); }
.post__body a { color: var(--color-accent-strong, #b45309); text-decoration: underline; }
.post__body ul, .post__body ol { padding-left: 1.4em; }
.post__body li { margin-top: var(--space-2); }
.post__body h2 { scroll-margin-top: 100px; }
.post-table-wrap { width: 100%; overflow-x: auto; border: 1px solid #dbe3ec; border-radius: var(--radius-md); }
.post__body table { width: 100%; border-collapse: collapse; min-width: 560px; margin: 0; background: #fff; }
.post__body th, .post__body td { padding: 12px 14px; border-bottom: 1px solid #e6ebf1; text-align: left; vertical-align: top; }
.post__body th { background: #f8fafc; color: var(--color-ink); font-size: var(--fs-75); }
.post__toc { margin: var(--space-4) 0 var(--space-5); padding: var(--space-4); border: 1px solid #dbe3ec; border-left: 4px solid var(--color-accent, #f5bf00); border-radius: var(--radius-md); background: #f8fafc; }
.post__toc strong { display: block; margin-bottom: var(--space-2); color: var(--color-ink); }
.post__toc ol { margin: 0; padding-left: 1.25rem; columns: 2; column-gap: var(--space-5); }
.post__toc li { break-inside: avoid; margin: 6px 0; font-size: var(--fs-75); }
.post__toc a { color: var(--color-ink-soft); text-decoration: none; }
.post__toc a:hover { color: var(--color-ink); text-decoration: underline; }
.post__commercial { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); margin-top: var(--space-6); padding: var(--space-5); border-radius: var(--radius-lg); background: #111827; color: #fff; }
.post__commercial strong { display: block; font-size: var(--fs-200); }
.post__commercial p { margin-top: 6px; color: #cbd5e1; }
.post__commercial .btn { flex: 0 0 auto; }
.post__related { margin-top: var(--space-6); }
.post__related h2 { font-size: 1.35rem; margin-bottom: var(--space-3); }
.post__related-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-3); }
.post__related-grid > a { display: flex; flex-direction: column; justify-content: space-between; min-height: 132px; padding: var(--space-4); border: 1px solid #dbe3ec; border-radius: var(--radius-md); color: var(--color-ink); text-decoration: none; background: #fff; }
.post__related-grid span { margin-top: var(--space-3); color: #9a6a00; font-size: var(--fs-75); font-weight: var(--fw-semibold); }
.blog-filters { display: flex; gap: 8px; overflow-x: auto; padding: 2px 0 var(--space-5); scrollbar-width: thin; }
.blog-filters a { flex: 0 0 auto; padding: 8px 12px; border: 1px solid #dbe3ec; border-radius: 999px; color: var(--color-ink-soft); text-decoration: none; background: #fff; font-size: var(--fs-75); }
.blog-filters a[aria-current="page"] { border-color: var(--color-accent, #f5bf00); background: var(--color-accent, #f5bf00); color: #111827; font-weight: var(--fw-semibold); }
.post__foot { display: flex; gap: var(--space-3); flex-wrap: wrap; margin-top: var(--space-6); }

@media (max-width: 700px) {
  .post__meta { display: flex; flex-wrap: wrap; line-height: 1.55; }
  .post__toc ol { columns: 1; }
  .post__commercial { align-items: stretch; flex-direction: column; padding: var(--space-4); }
  .post__commercial .btn { width: 100%; justify-content: center; }
  .post__related-grid { grid-template-columns: 1fr; }
  .post__related-grid > a { min-height: 0; }
}

.site-footer__col h3 {
  font-size: var(--fs-75); font-weight: var(--fw-semibold); color: var(--color-on-dark);
  text-transform: uppercase; letter-spacing: var(--tracking-wide); margin-bottom: var(--space-4);
}
.site-footer__col ul { display: flex; flex-direction: column; gap: var(--space-3); }
.site-footer__categories-list {
  display: grid !important;
  grid-template-columns: repeat(2, 1fr) !important;
  gap: var(--space-3) var(--space-5) !important;
}
.site-footer__col a { color: var(--color-on-dark-soft); font-size: var(--fs-75);
  transition: color var(--dur-fast) var(--ease-color); }
.site-footer__address { font-style: normal; font-size: var(--fs-75); line-height: var(--lh-normal); }
.site-footer__service-link { display: inline-flex; align-items: center; gap: var(--space-1); margin-top: var(--space-3); }
.site-footer__service-link .icon { width: 1em; height: 1em; }
.site-footer__hours { margin-top: var(--space-4); display: flex; align-items: center; gap: var(--space-2);
  font-size: var(--fs-75); }
.site-footer__hours .icon { width: 1.1rem; height: 1.1rem; color: var(--color-accent); }

@media (hover: hover) and (pointer: fine) {
  .site-footer__contact a:hover,
  .site-footer__col a:hover { color: var(--color-accent); }
}

/* Yasal künye şeridi */
.site-footer__legal { border-top: 1px solid rgba(244,244,245,.10); background: #0e0e11; }
.site-footer__legal-inner {
  display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap;
  gap: var(--space-3) var(--space-6); padding-block: var(--space-5);
}
.site-footer__company { display: flex; flex-direction: column; gap: 2px; font-size: var(--fs-50); }
.site-footer__company strong { color: var(--color-on-dark); font-size: var(--fs-75); font-weight: var(--fw-semibold); }
.site-footer__credit { color: var(--color-on-dark-soft); width: fit-content; transition: color var(--dur-fast) var(--ease-color); }
@media (hover: hover) and (pointer: fine) { .site-footer__credit:hover { color: var(--color-accent); } }
.site-footer__copy { display: flex; flex-direction: column; gap: var(--space-1); align-items: flex-end;
  font-size: var(--fs-50); text-align: right; }
.site-footer__copy nav { display: flex; gap: var(--space-4); flex-wrap: wrap; }
.site-footer__copy a { color: var(--color-on-dark-soft); transition: color var(--dur-fast) var(--ease-color); }
@media (hover: hover) and (pointer: fine) { .site-footer__copy a:hover { color: var(--color-accent); } }

@media (max-width: 900px) {
  .site-footer__grid { grid-template-columns: 1fr 1fr; gap: var(--space-6); }
  .site-footer__brand { grid-column: 1 / -1; }
}
@media (max-width: 560px) {
  .site-footer__grid { grid-template-columns: 1fr; }
  .site-footer__legal-inner { flex-direction: column; align-items: flex-start; }
  .site-footer__copy { align-items: flex-start; text-align: left; }
  .site-footer__social-link { width: 44px; height: 44px; }
}

/* ==========================================================================
   SONUÇ KARTI (teklif handler: teşekkür / hata)
   ========================================================================== */
.result-card {
  max-width: 640px; margin-inline: auto;
  background: var(--color-bg); border: var(--border-thin); border-radius: var(--radius-xl);
  box-shadow: var(--shadow-2); padding: var(--space-7); text-align: center;
}
.result-card__icon { display: inline-grid; place-items: center; width: 64px; height: 64px;
  border-radius: var(--radius-pill); margin-bottom: var(--space-4); }
.result-card__icon .icon { width: 34px; height: 34px; }
.result-card--success .result-card__icon { background: #e7f6ec; color: var(--color-success); }
.result-card--error .result-card__icon { background: #fdeaea; color: var(--color-danger); }
.result-card h1 { font-size: var(--fs-500); }
.result-card__lede { margin-top: var(--space-3); color: var(--color-ink-soft); font-size: var(--fs-200); }
.result-card__ref { margin-top: var(--space-3); font-size: var(--fs-75); color: var(--color-ink-mute); }
.result-card__items { margin-top: var(--space-6); text-align: left;
  border: var(--border-thin); border-radius: var(--radius-lg); padding: var(--space-4); background: var(--color-surface); }
.result-card__items h2 { font-size: var(--fs-200); margin-bottom: var(--space-3); letter-spacing: 0; }
.result-card__items ul { display: flex; flex-direction: column; gap: var(--space-2); }
.result-card__items li { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3);
  font-size: var(--fs-75); padding-bottom: var(--space-2); border-bottom: var(--border-thin); }
.result-card__items li:last-child { border-bottom: 0; padding-bottom: 0; }
.result-card__items small { color: var(--color-ink-mute); }
.result-card__list { text-align: left; max-width: 40ch; margin: var(--space-4) auto; color: var(--color-danger);
  display: flex; flex-direction: column; gap: var(--space-1); }
.result-card__actions { margin-top: var(--space-6); display: flex; flex-wrap: wrap; gap: var(--space-3); justify-content: center; }

/* ========================================================================== 
   MARKA DİZİNİ & MARKA LANDING
   ========================================================================== */
.pcard__brand-link { color: inherit; font-weight: inherit; }
.pcard__brand-link:hover { color: var(--color-ink); text-decoration: underline; text-underline-offset: 2px; }
.pdetail__brand-link { display: inline-flex; width: fit-content; color: var(--color-accent-strong); text-decoration: none; }
.pdetail__brand-link:hover { text-decoration: underline; text-underline-offset: 3px; }

.brand-hero { position: relative; overflow: hidden; padding-block: clamp(var(--space-7), 6vw, var(--space-9)); background: var(--color-dark); color: var(--color-on-dark); }
.brand-hero::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(circle at 85% 15%, rgba(245,197,24,.2), transparent 30%), repeating-linear-gradient(90deg, rgba(244,244,245,.03) 0 1px, transparent 1px 72px); }
.brand-hero > .container { position: relative; }
.breadcrumb--on-brand a, .breadcrumb--on-brand span { color: var(--color-on-dark-soft); }
.breadcrumb--on-brand .icon { color: var(--color-on-dark-mute); }
.brand-hero__layout { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(260px, .65fr); gap: clamp(var(--space-6), 6vw, var(--space-9)); align-items: end; }
.brand-hero__eyebrow { color: var(--color-accent); margin-bottom: var(--space-3); }
.brand-hero h1 { color: var(--color-on-dark); max-width: 18ch; }
.brand-hero__copy > p { max-width: 68ch; margin-top: var(--space-4); color: var(--color-on-dark-soft); font-size: var(--fs-200); line-height: var(--lh-relaxed); }
.brand-hero__actions { display: flex; flex-wrap: wrap; gap: var(--space-3); margin-top: var(--space-6); }
.brand-hero__facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border: 1px solid rgba(255,255,255,.12); border-radius: var(--radius-xl); background: rgba(255,255,255,.04); box-shadow: var(--shadow-3); }
.brand-hero__facts > div { min-width: 0; padding: var(--space-5) var(--space-4); border-right: 1px solid rgba(255,255,255,.1); }
.brand-hero__facts > div:last-child { border-right: 0; }
.brand-hero__facts strong, .brand-hero__facts span { display: block; }
.brand-hero__facts strong { color: var(--color-accent); font-size: var(--fs-300); line-height: var(--lh-tight); }
.brand-hero__facts span { margin-top: 4px; color: var(--color-on-dark-soft); font-size: var(--fs-50); }

.brand-category-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-3); }
.brand-category-card { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: var(--space-3); min-width: 0; padding: var(--space-4); border: var(--border-thin); border-radius: var(--radius-lg); background: var(--color-bg); color: var(--color-ink); box-shadow: var(--shadow-1); transition: transform var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-color), box-shadow var(--dur-fast) var(--ease-color); }
.brand-category-card__icon { display: grid; place-items: center; width: 42px; height: 42px; border-radius: var(--radius-md); background: var(--color-accent-soft); }
.brand-category-card__icon .icon { width: 22px; height: 22px; }
.brand-category-card strong, .brand-category-card small { display: block; min-width: 0; }
.brand-category-card strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: var(--fs-75); }
.brand-category-card small { margin-top: 3px; color: var(--color-ink-mute); font-size: var(--fs-50); }
.brand-category-card > .icon { color: var(--color-ink-mute); }
.brand-category-card:hover { transform: translateY(-2px); border-color: var(--color-accent); box-shadow: var(--shadow-2); }

/* Marka kataloğu: boş kolonlar korunur; seyrek ürünler tüm satıra yayılmaz. */
#marka-urunleri .brand-product-grid {
  grid-template-columns: repeat(4, minmax(0, 320px));
  justify-content: start;
  gap: var(--space-4);
}
#marka-urunleri .brand-product-grid .pcard__body { gap: .55rem; padding: .9rem; }
#marka-urunleri .brand-product-grid .pcard__title { font-size: var(--fs-75); }
#marka-urunleri .brand-product-grid .pcard__desc { font-size: var(--fs-50); }
#marka-urunleri .brand-product-grid .pcard__chips { display: none; }

.brand-guide__layout { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(280px, .45fr); gap: var(--space-6); align-items: start; }
.brand-guide__main, .brand-guide__aside { border: var(--border-thin); border-radius: var(--radius-xl); background: var(--color-bg); box-shadow: var(--shadow-1); }
.brand-guide__main { padding: clamp(var(--space-5), 4vw, var(--space-7)); }
.brand-guide__main h2 { margin-top: var(--space-2); font-size: clamp(var(--fs-300), 2.4vw, var(--fs-500)); }
.brand-guide__main > p { max-width: 80ch; margin-top: var(--space-4); color: var(--color-ink-soft); line-height: var(--lh-relaxed); }
.brand-guide__steps { display: grid; gap: var(--space-3); margin-top: var(--space-5); padding: 0; list-style: none; }
.brand-guide__steps li { display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: var(--space-3); align-items: start; padding-top: var(--space-3); border-top: var(--border-thin); }
.brand-guide__steps li > span { display: grid; place-items: center; width: 32px; height: 32px; border-radius: var(--radius-pill); background: var(--color-accent); color: var(--color-on-accent); font-size: var(--fs-75); font-weight: var(--fw-bold); }
.brand-guide__steps p { color: var(--color-ink-soft); font-size: var(--fs-75); line-height: var(--lh-relaxed); }
.brand-guide__aside { position: sticky; top: 100px; padding: var(--space-5); background: linear-gradient(145deg, var(--color-dark), var(--color-dark-2)); color: var(--color-on-dark); }
.brand-guide__aside-icon { display: grid; place-items: center; width: 46px; height: 46px; border-radius: var(--radius-md); background: var(--color-accent); color: var(--color-on-accent); }
.brand-guide__aside-icon .icon { width: 24px; height: 24px; }
.brand-guide__aside h3 { margin-top: var(--space-4); color: var(--color-on-dark); font-size: var(--fs-200); }
.brand-guide__aside p { margin: var(--space-3) 0 var(--space-5); color: var(--color-on-dark-soft); font-size: var(--fs-75); line-height: var(--lh-relaxed); }
.brand-guide__aside .eyebrow { display: block; margin-top: var(--space-4); color: var(--color-accent); }
.brand-guide__aside .btn { width: 100%; justify-content: center; white-space: normal; text-align: center; }
.cat-rail--about { margin-top: 0; }
.about-category-head .eyebrow { display: block; margin-bottom: var(--space-2); }
.about-category-head h2 { display: block; margin: 0; }
.about-editorial { box-shadow: none; }
.about-editorial h2 { margin-bottom: var(--space-4); }
.about-editorial p + p { margin-top: var(--space-3); }

/* ==========================================================================
   HAKKIMIZDA 2026 — kurumsal anlatı
   ========================================================================== */
.about2026-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding-block: clamp(4rem, 8vw, 7.5rem);
  color: var(--color-on-dark);
  background:
    radial-gradient(circle at 87% 18%, rgba(245, 197, 24, .18), transparent 28%),
    linear-gradient(125deg, #111114 0%, var(--color-dark) 58%, #222228 100%);
}
.about2026-hero::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  background-image:
    linear-gradient(rgba(255, 255, 255, .035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, .035) 1px, transparent 1px);
  background-size: 72px 72px;
  mask-image: linear-gradient(90deg, transparent 0%, #000 58%, #000 100%);
}
.about2026-hero::after {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: min(38vw, 560px);
  height: 4px;
  background: var(--color-accent);
}
.about2026-hero__layout {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(300px, .65fr);
  align-items: center;
  gap: clamp(var(--space-7), 7vw, var(--space-10));
}
.about2026-hero__content,
.about2026-hero__panel,
.about2026-section-heading,
.about2026-intro__copy,
.about2026-delivery-card > div,
.about2026-service__copy { min-width: 0; }
.about2026-eyebrow { margin-bottom: var(--space-4); color: var(--color-accent); }
.about2026-hero h1 {
  max-width: 13ch;
  color: var(--color-on-dark);
  font-size: clamp(2.4rem, 5.4vw, 5rem);
  line-height: .98;
  letter-spacing: -.045em;
  overflow-wrap: break-word;
}
.about2026-hero h1 span { display: block; color: var(--color-accent); }
.about2026-hero__lede {
  max-width: 59ch;
  margin-top: var(--space-5);
  color: #d4d4d8;
  font-size: clamp(var(--fs-100), 1.3vw, var(--fs-200));
  line-height: 1.75;
}
.about2026-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
  margin-top: var(--space-6);
}
.about2026-hero__panel {
  position: relative;
  overflow: hidden;
  padding: clamp(var(--space-5), 4vw, var(--space-7));
  border: 1px solid rgba(255, 255, 255, .13);
  border-radius: var(--radius-xl);
  background: rgba(255, 255, 255, .055);
  box-shadow: 0 28px 70px rgba(0, 0, 0, .26);
  backdrop-filter: blur(10px);
}
.about2026-hero__panel::after {
  content: "";
  position: absolute;
  right: -50px;
  bottom: -50px;
  width: 150px;
  height: 150px;
  border: 24px solid rgba(245, 197, 24, .12);
  border-radius: 50%;
}
.about2026-hero__panel-kicker {
  display: block;
  color: var(--color-on-dark-soft);
  font-size: var(--fs-50);
  font-weight: var(--fw-bold);
  letter-spacing: var(--tracking-wide);
  text-transform: uppercase;
}
.about2026-hero__year {
  margin-top: var(--space-3);
  color: var(--color-accent);
  font-size: clamp(3.5rem, 7vw, 6rem);
  font-weight: var(--fw-black);
  line-height: 1;
  letter-spacing: -.06em;
}
.about2026-hero__panel > p {
  position: relative;
  z-index: 1;
  max-width: 28ch;
  margin-top: var(--space-2);
  color: var(--color-on-dark);
  font-size: var(--fs-200);
  line-height: var(--lh-normal);
}
.about2026-hero__checks {
  position: relative;
  z-index: 1;
  display: grid;
  gap: var(--space-3);
  margin-top: var(--space-6);
  padding-top: var(--space-5);
  border-top: 1px solid rgba(255, 255, 255, .12);
}
.about2026-hero__checks li {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  color: #d4d4d8;
  font-size: var(--fs-75);
}
.about2026-hero__checks .icon {
  flex: 0 0 auto;
  width: 1.1rem;
  height: 1.1rem;
  color: var(--color-accent);
}

.about2026-intro { padding-block: clamp(var(--space-7), 7vw, var(--space-9)); background: var(--color-bg); }
.about2026-intro__layout {
  display: grid;
  grid-template-columns: minmax(260px, .8fr) minmax(0, 1.2fr);
  gap: clamp(var(--space-6), 8vw, var(--space-10));
  align-items: start;
}
.about2026-section-heading .eyebrow { margin-bottom: var(--space-3); color: #896400; }
.about2026-section-heading h2 {
  max-width: 18ch;
  font-size: clamp(1.8rem, 3.4vw, 3.35rem);
  line-height: 1.08;
  letter-spacing: -.035em;
  overflow-wrap: break-word;
}
.about2026-intro__copy {
  padding-left: clamp(var(--space-5), 4vw, var(--space-8));
  border-left: 3px solid var(--color-accent);
}
.about2026-intro__copy p {
  max-width: 67ch;
  color: var(--color-ink-soft);
  font-size: clamp(var(--fs-100), 1.4vw, var(--fs-200));
  line-height: 1.8;
}
.about2026-intro__copy p + p { margin-top: var(--space-4); }

.about2026-scope {
  padding-block: clamp(var(--space-7), 7vw, var(--space-9));
  border-block: var(--border-thin);
  background: var(--color-surface);
}
.about2026-scope__head {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) minmax(0, .65fr);
  align-items: end;
  gap: var(--space-7);
  margin-bottom: var(--space-7);
}
.about2026-scope__head > p { max-width: 52ch; color: var(--color-ink-soft); line-height: 1.7; }
.about2026-scope__list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-3); }
.about2026-scope__list li { min-width: 0; }
.about2026-scope__list a {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--space-3);
  min-width: 0;
  min-height: 68px;
  padding: var(--space-3);
  border: var(--border-thin);
  border-radius: var(--radius-lg);
  color: var(--color-ink);
  background: var(--color-bg);
  box-shadow: var(--shadow-1);
  transition: transform var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-color), box-shadow var(--dur-fast) var(--ease-color);
}
.about2026-scope__list a > span {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border-radius: var(--radius-md);
  color: #745500;
  background: var(--color-accent-soft);
}
.about2026-scope__list a > span .icon { width: 21px; height: 21px; }
.about2026-scope__list strong { min-width: 0; font-size: var(--fs-75); line-height: 1.3; overflow-wrap: break-word; }
.about2026-scope__list a > .icon { width: 1rem; height: 1rem; color: var(--color-ink-mute); }
@media (hover: hover) and (pointer: fine) {
  .about2026-scope__list a:hover { transform: translateY(-2px); border-color: var(--color-accent); box-shadow: var(--shadow-2); }
}

.about2026-values { padding-block: clamp(var(--space-7), 7vw, var(--space-9)); background: var(--color-bg); }
.about2026-values__head { margin-bottom: var(--space-7); }
.about2026-value-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-4); }
.about2026-value-card {
  position: relative;
  min-width: 0;
  min-height: 270px;
  padding: clamp(var(--space-5), 3vw, var(--space-7));
  border: var(--border-thin);
  border-radius: var(--radius-xl);
  background: var(--color-surface);
  transition: transform var(--dur-base) var(--ease-out), border-color var(--dur-fast) var(--ease-color), box-shadow var(--dur-base) var(--ease-color);
}
.about2026-value-card__icon {
  display: grid;
  place-items: center;
  width: 52px;
  height: 52px;
  border-radius: var(--radius-md);
  background: var(--color-accent);
  color: var(--color-on-accent);
}
.about2026-value-card__icon .icon { width: 26px; height: 26px; }
.about2026-value-card__number {
  position: absolute;
  top: var(--space-5);
  right: var(--space-5);
  color: var(--color-border-strong);
  font-size: var(--fs-400);
  font-weight: var(--fw-black);
  line-height: 1;
}
.about2026-value-card h3 { margin-top: var(--space-6); font-size: var(--fs-300); letter-spacing: -.02em; }
.about2026-value-card p { margin-top: var(--space-3); color: var(--color-ink-mute); line-height: 1.7; }
@media (hover: hover) and (pointer: fine) {
  .about2026-value-card:hover { transform: translateY(-4px); border-color: var(--color-accent); box-shadow: var(--shadow-2); }
}

.about2026-process { padding-block: clamp(var(--space-7), 7vw, var(--space-9)); color: var(--color-on-dark); background: var(--color-dark); }
.about2026-process__layout { display: grid; grid-template-columns: minmax(250px, .72fr) minmax(0, 1.28fr); gap: clamp(var(--space-7), 8vw, var(--space-10)); align-items: start; }
.about2026-process__intro { min-width: 0; position: sticky; top: 110px; }
.about2026-process__intro .eyebrow { color: var(--color-accent); }
.about2026-process__intro h2 { color: var(--color-on-dark); }
.about2026-process__intro > p { max-width: 43ch; margin-top: var(--space-4); color: var(--color-on-dark-soft); line-height: 1.7; }
.about2026-process__steps { display: grid; gap: 0; counter-reset: about-step; }
.about2026-process__steps li {
  position: relative;
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr);
  gap: var(--space-5);
  min-width: 0;
  padding-bottom: var(--space-6);
}
.about2026-process__steps li:not(:last-child)::before {
  content: "";
  position: absolute;
  top: 54px;
  bottom: 0;
  left: 26px;
  width: 2px;
  background: rgba(245, 197, 24, .24);
}
.about2026-process__steps li > span {
  position: relative;
  z-index: 1;
  display: grid;
  place-items: center;
  width: 54px;
  height: 54px;
  border: 1px solid rgba(245, 197, 24, .45);
  border-radius: 50%;
  color: var(--color-accent);
  background: var(--color-dark-2);
  font-size: var(--fs-75);
  font-weight: var(--fw-bold);
}
.about2026-process__steps li > div { min-width: 0; padding: var(--space-2) 0 var(--space-5); border-bottom: 1px solid rgba(255, 255, 255, .1); }
.about2026-process__steps h3 { color: var(--color-on-dark); font-size: var(--fs-200); }
.about2026-process__steps p { max-width: 60ch; margin-top: var(--space-2); color: var(--color-on-dark-soft); line-height: 1.65; }

.about2026-transparency { padding-top: clamp(var(--space-7), 7vw, var(--space-9)); background: var(--color-bg); }
.about2026-transparency__panel {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: start;
  gap: var(--space-5);
  padding: clamp(var(--space-5), 4vw, var(--space-7));
  border: 1px solid color-mix(in srgb, var(--color-accent) 55%, var(--color-border));
  border-radius: var(--radius-xl);
  background: linear-gradient(120deg, var(--color-accent-soft), #fff 72%);
}
.about2026-transparency__icon {
  display: grid;
  place-items: center;
  width: 58px;
  height: 58px;
  border-radius: var(--radius-lg);
  color: var(--color-on-accent);
  background: var(--color-accent);
}
.about2026-transparency__icon .icon { width: 29px; height: 29px; }
.about2026-transparency__panel > div { min-width: 0; }
.about2026-transparency__panel .eyebrow { margin-bottom: var(--space-2); color: #745500; }
.about2026-transparency__panel h2 { font-size: clamp(1.4rem, 2.8vw, var(--fs-400)); letter-spacing: -.025em; }
.about2026-transparency__panel p { max-width: 80ch; margin-top: var(--space-3); color: var(--color-ink-soft); line-height: 1.7; }

.about2026-delivery {
  padding-block: clamp(var(--space-7), 7vw, var(--space-9));
  border-block: var(--border-thin);
  background: var(--color-surface);
}
.about2026-delivery__head {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) minmax(0, .8fr);
  align-items: end;
  gap: var(--space-7);
  margin-bottom: var(--space-7);
}
.about2026-delivery__head > p { max-width: 55ch; color: var(--color-ink-soft); line-height: 1.7; }
.about2026-delivery__grid { display: grid; gap: var(--space-3); }
.about2026-delivery-card {
  display: grid;
  grid-template-columns: 64px minmax(0, 1fr);
  gap: var(--space-5);
  align-items: center;
  min-width: 0;
  padding: clamp(var(--space-5), 3vw, var(--space-6));
  border: var(--border-thin);
  border-radius: var(--radius-lg);
  background: var(--color-bg);
  box-shadow: var(--shadow-1);
}
.about2026-delivery-card--featured { border-left: 4px solid var(--color-accent); }
.about2026-delivery-card__icon {
  display: grid;
  place-items: center;
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: var(--color-accent-soft);
  color: #7c5900;
}
.about2026-delivery-card__icon .icon { width: 29px; height: 29px; }
.about2026-delivery-card__label {
  display: block;
  margin-bottom: var(--space-1);
  color: #896400;
  font-size: var(--fs-50);
  font-weight: var(--fw-bold);
  letter-spacing: .05em;
  text-transform: uppercase;
}
.about2026-delivery-card h3 { font-size: clamp(var(--fs-200), 2vw, var(--fs-300)); letter-spacing: -.015em; }
.about2026-delivery-card p { max-width: 78ch; margin-top: var(--space-2); color: var(--color-ink-soft); line-height: 1.65; }

.about2026-service { padding-block: clamp(var(--space-7), 7vw, var(--space-9)); background: var(--color-bg); }
.about2026-service__panel {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: clamp(var(--space-5), 4vw, var(--space-7));
  min-width: 0;
  padding: clamp(var(--space-5), 4vw, var(--space-8));
  border-radius: var(--radius-xl);
  color: var(--color-on-dark);
  background: linear-gradient(130deg, var(--color-dark), #24242a);
  box-shadow: var(--shadow-3);
}
.about2026-service__icon {
  display: grid;
  place-items: center;
  width: 72px;
  height: 72px;
  border-radius: var(--radius-lg);
  background: var(--color-accent);
  color: var(--color-on-accent);
}
.about2026-service__icon .icon { width: 34px; height: 34px; }
.about2026-service__copy .eyebrow { margin-bottom: var(--space-2); color: var(--color-accent); }
.about2026-service__copy h2 {
  max-width: 30ch;
  color: var(--color-on-dark);
  font-size: clamp(1.5rem, 2.7vw, var(--fs-400));
  line-height: 1.15;
  overflow-wrap: break-word;
}
.about2026-service__copy p { max-width: 80ch; margin-top: var(--space-3); color: #c4c4ca; line-height: 1.7; }
.about2026-service__link {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-4) 0;
  color: var(--color-accent);
  font-size: var(--fs-75);
  font-weight: var(--fw-bold);
  white-space: nowrap;
}
.about2026-service__link .icon { width: 1.1rem; height: 1.1rem; transition: transform var(--dur-fast) var(--ease-out); }
.about2026-service__link:hover .icon { transform: translateX(4px); }

.about2026-corporate { padding-block: clamp(var(--space-7), 7vw, var(--space-9)); background: var(--color-bg); }
.about2026-corporate__layout { display: grid; grid-template-columns: minmax(240px, .6fr) minmax(0, 1.4fr); gap: clamp(var(--space-7), 8vw, var(--space-10)); align-items: start; }
.about2026-corporate__layout .about2026-section-heading > p,
.about2026-faq__intro > p { max-width: 46ch; margin-top: var(--space-4); color: var(--color-ink-soft); line-height: 1.7; }
.about2026-corporate__facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 2px solid var(--color-ink); }
.about2026-corporate__facts > div { min-width: 0; padding: var(--space-5) var(--space-4); border-bottom: var(--border-thin); }
.about2026-corporate__facts > div:nth-child(odd) { border-right: var(--border-thin); }
.about2026-corporate__facts dt { color: var(--color-ink-mute); font-size: var(--fs-50); font-weight: var(--fw-bold); letter-spacing: .06em; text-transform: uppercase; }
.about2026-corporate__facts dd { margin-top: var(--space-2); color: var(--color-ink); font-size: var(--fs-100); font-weight: var(--fw-semibold); line-height: 1.45; overflow-wrap: break-word; }

.about2026-faq { padding-block: clamp(var(--space-7), 7vw, var(--space-9)); border-top: var(--border-thin); background: var(--color-surface); }
.about2026-faq__layout { display: grid; grid-template-columns: minmax(240px, .58fr) minmax(0, 1.42fr); gap: clamp(var(--space-7), 8vw, var(--space-10)); align-items: start; }
.about2026-faq__intro { min-width: 0; }
.about2026-faq__contact { display: inline-flex; align-items: center; gap: var(--space-2); margin-top: var(--space-5); color: #745500; font-size: var(--fs-75); font-weight: var(--fw-bold); }
.about2026-faq__contact .icon { width: 1rem; height: 1rem; transition: transform var(--dur-fast) var(--ease-out); }
.about2026-faq__contact:hover .icon { transform: translateX(4px); }
.about2026-faq__list { display: grid; gap: var(--space-3); min-width: 0; }
.about2026-faq__item { overflow: hidden; border: var(--border-thin); border-radius: var(--radius-lg); background: var(--color-bg); box-shadow: var(--shadow-1); }
.about2026-faq__item summary { position: relative; padding: var(--space-5) 58px var(--space-5) var(--space-5); color: var(--color-ink); font-weight: var(--fw-semibold); line-height: 1.45; cursor: pointer; list-style: none; }
.about2026-faq__item summary::-webkit-details-marker { display: none; }
.about2026-faq__item summary::after { content: "+"; position: absolute; top: 50%; right: var(--space-5); transform: translateY(-50%); color: #745500; font-size: 1.4rem; font-weight: var(--fw-regular); }
.about2026-faq__item[open] summary::after { content: "−"; }
.about2026-faq__item p { padding: 0 var(--space-5) var(--space-5); color: var(--color-ink-soft); line-height: 1.7; }
.about2026-faq__item[open] { border-color: color-mix(in srgb, var(--color-accent) 60%, var(--color-border)); }

.about2026-cta { padding-bottom: clamp(var(--space-7), 7vw, var(--space-9)); background: var(--color-bg); }
.about2026-cta__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-7);
  padding: clamp(var(--space-5), 4vw, var(--space-7));
  border: 1px solid color-mix(in srgb, var(--color-accent) 45%, var(--color-border));
  border-radius: var(--radius-xl);
  background: linear-gradient(110deg, var(--color-accent-soft), #fff 65%);
}
.about2026-cta__inner > div { min-width: 0; }
.about2026-cta__inner .eyebrow { margin-bottom: var(--space-2); color: #7c5900; }
.about2026-cta__inner h2 { font-size: clamp(1.55rem, 3vw, var(--fs-400)); letter-spacing: -.025em; }
.about2026-cta__inner p { max-width: 60ch; margin-top: var(--space-2); color: var(--color-ink-soft); line-height: 1.65; }
.about2026-cta__inner .btn { flex: 0 0 auto; }

@media (max-width: 980px) {
  .about2026-hero__layout { grid-template-columns: minmax(0, 1fr) minmax(280px, .65fr); gap: var(--space-7); }
  .about2026-hero h1 { font-size: clamp(2.4rem, 7vw, 4rem); }
  .about2026-scope__list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .about2026-value-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .about2026-service__panel { grid-template-columns: auto minmax(0, 1fr); }
  .about2026-service__link { grid-column: 2; width: fit-content; padding: 0; }
}
@media (max-width: 760px) {
  .about2026-hero__layout,
  .about2026-intro__layout,
  .about2026-scope__head,
  .about2026-process__layout,
  .about2026-delivery__head,
  .about2026-corporate__layout,
  .about2026-faq__layout { grid-template-columns: 1fr; }
  .about2026-hero__layout { gap: var(--space-7); }
  .about2026-hero h1 { max-width: 14ch; }
  .about2026-hero__panel { width: 100%; }
  .about2026-intro__layout { gap: var(--space-6); }
  .about2026-section-heading h2 { max-width: 22ch; }
  .about2026-intro__copy { padding-left: var(--space-5); }
  .about2026-scope__head { align-items: start; gap: var(--space-4); margin-bottom: var(--space-6); }
  .about2026-scope__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .about2026-value-grid { grid-template-columns: 1fr; }
  .about2026-value-card { min-height: 0; }
  .about2026-process__layout,
  .about2026-corporate__layout,
  .about2026-faq__layout { gap: var(--space-6); }
  .about2026-process__intro { position: static; }
  .about2026-delivery__head { align-items: start; gap: var(--space-4); margin-bottom: var(--space-6); }
  .about2026-cta__inner { align-items: stretch; flex-direction: column; gap: var(--space-5); }
  .about2026-cta__inner .btn { width: 100%; justify-content: center; }
}
@media (max-width: 560px) {
  .about2026-hero { padding-block: var(--space-8); }
  .about2026-hero h1 { font-size: clamp(2.25rem, 12vw, 3.25rem); }
  .about2026-hero__actions { align-items: stretch; flex-direction: column; }
  .about2026-hero__actions .btn { width: 100%; justify-content: center; }
  .about2026-hero__panel { padding: var(--space-5); }
  .about2026-scope__list { grid-template-columns: 1fr; }
  .about2026-transparency__panel { grid-template-columns: 1fr; }
  .about2026-delivery-card { grid-template-columns: 1fr; align-items: start; gap: var(--space-4); }
  .about2026-delivery-card__icon { width: 52px; height: 52px; }
  .about2026-delivery-card__icon .icon { width: 25px; height: 25px; }
  .about2026-service__panel { grid-template-columns: 1fr; align-items: start; }
  .about2026-service__icon { width: 58px; height: 58px; }
  .about2026-service__link { grid-column: 1; white-space: normal; }
  .about2026-corporate__facts { grid-template-columns: 1fr; }
  .about2026-corporate__facts > div:nth-child(odd) { border-right: 0; }
  .about2026-faq__item summary { padding: var(--space-4) 52px var(--space-4) var(--space-4); }
  .about2026-faq__item summary::after { right: var(--space-4); }
  .about2026-faq__item p { padding: 0 var(--space-4) var(--space-4); }
}

.brand-faq__layout { display: grid; grid-template-columns: minmax(220px, .45fr) minmax(0, 1.55fr); gap: var(--space-7); }
.brand-faq__layout h2 { margin-top: var(--space-2); }
.brand-faq .faq-list { display: grid; gap: var(--space-3); }
.brand-faq .faq-item { border: var(--border-thin); border-radius: var(--radius-lg); background: var(--color-bg); }
.brand-faq .faq-item summary { position: relative; padding: var(--space-4) 48px var(--space-4) var(--space-4); color: var(--color-ink); font-weight: var(--fw-semibold); cursor: pointer; list-style: none; }
.brand-faq .faq-item summary::-webkit-details-marker { display: none; }
.brand-faq .faq-item summary::after { content: "+"; position: absolute; right: var(--space-4); top: 50%; transform: translateY(-50%); color: var(--color-accent-strong); font-size: 1.35rem; }
.brand-faq .faq-item[open] summary::after { content: "−"; }
.brand-faq .faq-item p { padding: 0 var(--space-4) var(--space-4); color: var(--color-ink-soft); font-size: var(--fs-75); line-height: var(--lh-relaxed); }

.brand-directory-head { display: flex; align-items: end; justify-content: space-between; gap: var(--space-5); margin-bottom: var(--space-5); }
.brand-directory-head h2 { font-size: var(--fs-400); }
.brand-directory-head p { margin-top: var(--space-1); color: var(--color-ink-mute); font-size: var(--fs-75); }
.brand-directory-search { display: flex; align-items: center; gap: var(--space-2); width: min(360px, 100%); padding: 0 var(--space-4); border: var(--border-base); border-radius: var(--radius-pill); background: var(--color-bg); }
.brand-directory-search:focus-within { border-color: var(--color-accent); box-shadow: var(--focus-ring); }
.brand-directory-search .icon { color: var(--color-ink-mute); }
.brand-directory-search input { width: 100%; min-height: 46px; border: 0; outline: 0; background: transparent; }
.brand-directory { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-3); }
.brand-directory-card { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: var(--space-3); min-width: 0; padding: var(--space-4); border: var(--border-thin); border-radius: var(--radius-lg); background: var(--color-bg); color: var(--color-ink); transition: transform var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-color), box-shadow var(--dur-fast) var(--ease-color); }
.brand-directory-card__letter { display: grid; place-items: center; width: 44px; height: 44px; border-radius: var(--radius-md); background: var(--color-ink); color: var(--color-accent); font-weight: var(--fw-black); }
.brand-directory-card__copy { min-width: 0; }
.brand-directory-card strong, .brand-directory-card small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.brand-directory-card small { margin-top: 3px; color: var(--color-ink-mute); font-size: var(--fs-50); }
.brand-directory-card > .icon { color: var(--color-ink-mute); }
.brand-directory-card:hover { transform: translateY(-2px); border-color: var(--color-accent); box-shadow: var(--shadow-2); }
.brand-directory-empty { padding: var(--space-6); border: var(--border-thin); border-radius: var(--radius-lg); background: var(--color-bg); color: var(--color-ink-mute); text-align: center; }

@media (max-width: 1000px) {
  .brand-hero__layout, .brand-guide__layout { grid-template-columns: 1fr; }
  .brand-guide__aside { position: static; }
  .brand-category-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .brand-directory { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 1179px) {
  #marka-urunleri .brand-product-grid { grid-template-columns: repeat(3, minmax(0, 320px)); }
}
@media (max-width: 839px) {
  #marka-urunleri .brand-product-grid { grid-template-columns: repeat(2, minmax(0, 320px)); }
}
@media (max-width: 560px) {
  #marka-urunleri .brand-product-grid { grid-template-columns: minmax(0, 1fr) !important; gap: 12px; }
  #marka-urunleri .brand-product-grid .pcard {
    display: grid; grid-template-columns: 120px minmax(0, 1fr); align-items: stretch;
    min-height: 204px; border-radius: 17px;
  }
  #marka-urunleri .brand-product-grid .pcard__media-wrap { min-width: 0; min-height: 100%; }
  #marka-urunleri .brand-product-grid .pcard__media {
    width: 100%; height: 100%; min-height: 204px; aspect-ratio: auto;
    border-right: 1px solid #eef3fb; border-bottom: 0;
  }
  #marka-urunleri .brand-product-grid .pcard__body { min-width: 0; gap: 6px; padding: 11px !important; }
  #marka-urunleri .brand-product-grid .pcard__eyebrow {
    display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 1;
    font-size: .64rem; line-height: 1.2;
  }
  #marka-urunleri .brand-product-grid .pcard__title {
    display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2;
    font-size: .88rem !important; line-height: 1.25;
  }
  #marka-urunleri .brand-product-grid .pcard__desc,
  #marka-urunleri .brand-product-grid .pcard__chips { display: none; }
  #marka-urunleri .brand-product-grid .pcard__pricing { min-height: 0; padding: 6px 7px; }
  #marka-urunleri .brand-product-grid .pcard__pricing strong { font-size: .82rem; }
  #marka-urunleri .brand-product-grid .pcard__pricing span { display: none; }
  #marka-urunleri .brand-product-grid .pcard__commerce-meta { font-size: .66rem; }
  #marka-urunleri .brand-product-grid .pcard__actions { grid-template-columns: minmax(0, 1fr) 42px; gap: 6px; padding-top: 1px; }
  #marka-urunleri .brand-product-grid .pcard__actions :is(.add-to-quote, .add-to-order),
  #marka-urunleri .brand-product-grid .pcard__wa { min-height: 44px !important; border-radius: 12px; }
  #marka-urunleri .brand-product-grid .pcard__fav,
  #marka-urunleri .brand-product-grid .pcard__cmp { right: 5px; width: 32px; height: 32px; }
  #marka-urunleri .brand-product-grid .pcard__fav { top: 5px; }
  #marka-urunleri .brand-product-grid .pcard__cmp { top: 44px; }
}
@media (max-width: 680px) {
  .brand-hero__facts { grid-template-columns: 1fr; }
  .brand-hero__facts > div { border-right: 0; border-bottom: 1px solid rgba(255,255,255,.1); }
  .brand-hero__facts > div:last-child { border-bottom: 0; }
  .brand-hero__actions .btn { width: 100%; justify-content: center; }
  .brand-faq__layout { grid-template-columns: 1fr; gap: var(--space-4); }
  .brand-directory-head { align-items: stretch; flex-direction: column; }
  .brand-directory-search { width: 100%; }
  .brand-directory { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
  .brand-category-grid { grid-template-columns: 1fr; }
}

/* ==========================================================================
   STAGGER (dekoratif; etkileşimi bloklamaz)
   ========================================================================== */
/* İçerik VARSAYILAN görünür. Yalnız JS aktifken (html.js) gizleyip animasyonla getir.
   JS yoksa / IO tetiklenmezse içerik kaybolmaz — emil: animasyon enhancement'tır. */
.js [data-stagger] > * { opacity: 0; transform: translateY(10px); }
.js [data-stagger].is-in > * {
  opacity: 1; transform: translateY(0);
  transition: opacity var(--dur-base) var(--ease-out), transform var(--dur-base) var(--ease-out);
}
/* Hero girişi: ilk görünüm — bir tık daha belirgin ve yumuşak */
.js .promo__content[data-stagger] > * { transform: translateY(16px); }
.js .promo__content[data-stagger].is-in > * {
  transition: opacity 420ms var(--ease-out), transform 420ms var(--ease-out);
}
.js .promo__content[data-stagger].is-in > *:nth-child(1) { transition-delay: 60ms; }
.js .promo__content[data-stagger].is-in > *:nth-child(2) { transition-delay: 120ms; }
.js .promo__content[data-stagger].is-in > *:nth-child(3) { transition-delay: 190ms; }
.js .promo__content[data-stagger].is-in > *:nth-child(4) { transition-delay: 260ms; }
.js .promo__content[data-stagger].is-in > *:nth-child(5) { transition-delay: 330ms; }
[data-stagger].is-in > *:nth-child(1) { transition-delay: 0ms; }
[data-stagger].is-in > *:nth-child(2) { transition-delay: 40ms; }
[data-stagger].is-in > *:nth-child(3) { transition-delay: 80ms; }
[data-stagger].is-in > *:nth-child(4) { transition-delay: 120ms; }
[data-stagger].is-in > *:nth-child(5) { transition-delay: 160ms; }
[data-stagger].is-in > *:nth-child(6) { transition-delay: 200ms; }
[data-stagger].is-in > *:nth-child(7) { transition-delay: 240ms; }
[data-stagger].is-in > *:nth-child(8) { transition-delay: 280ms; }
@media (prefers-reduced-motion: reduce) { .js [data-stagger] > * { transform: none; } }

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */
@media (max-width: 1000px) {
  .shelf { grid-template-columns: repeat(3, 1fr); }
  .cat-rail { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 860px) {
  .promo-slide { grid-template-columns: 1fr; gap: var(--space-6); }
}
@media (max-width: 680px) {
  /* Ürün şeritleri ("çok teklif alınan", "aynı kategoriden"): dar 2 sütunda
     sıkışmak yerine yatay kaydırılır karusel — kartlar geniş, parmakla kaydırılır. */
  .shelf {
    grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 78%;
    overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x proximity;
    -webkit-overflow-scrolling: touch; padding-bottom: var(--space-2);
  }
  .shelf > * { scroll-snap-align: start; }
  .shelf.shelf--featured-compact {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-auto-flow: row;
    grid-auto-columns: auto;
    overflow: visible;
    scroll-snap-type: none;
    padding-bottom: 0;
  }
  .shelf-panel { padding: var(--space-4); }
  .cat-rail { margin-top: var(--space-5); }
  .cat-rail--home { justify-content: flex-start; }
  .bulk-cta { padding: var(--space-5); }
}
@media (max-width: 560px) {
  /* Dar telefon kartlarında ikincil spec çiplerini gizle (yükseklik/sıkışıklık azalsın) */
  .pcard__chips { display: none; }
}
@media (max-width: 420px) {
  .promo__actions .btn { width: 100%; }
}

/* Genel Mobil D�zeltmeleri */
@media (max-width: 480px) {
  /* Okunabilir yatay kartlar: dar ekranda fiyat ve aksiyonlar sıkışmaz. */
  .grid-products { grid-template-columns: minmax(0, 1fr) !important; gap: 12px; }
  .shelf-panel, .contact { padding: var(--space-4) !important; }
  .promo__title { font-size: 1.8rem !important; }
  .section-head h2 { font-size: 1.25rem !important; }
}

@media (max-width: 340px) {
  .grid-products { grid-template-columns: 1fr !important; }
}

/* ==========================================================================
   ÜRÜN PAKETLERİ (bundles) — /paketler ve /paket/{slug}
   ========================================================================== */
.bundle-hero__grid { display: grid; grid-template-columns: 1.2fr .8fr; gap: clamp(var(--space-5), 4vw, var(--space-8)); align-items: center; }
.bundle-hero__body .eyebrow { color: var(--color-accent); }
.bundle-hero__body h1 { font-size: var(--fs-600); margin: var(--space-2) 0 var(--space-4); }
.bundle-hero__lede { color: var(--color-ink-soft); line-height: 1.7; max-width: 60ch; margin-bottom: var(--space-3); }
.bundle-hero__actions { display: flex; flex-wrap: wrap; gap: var(--space-3); margin-top: var(--space-5); }
.bundle-hero__chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: var(--space-5); }
.bundle-hero__chips li a { display: inline-flex; align-items: center; padding: 6px 12px; border: 1px solid var(--color-border, #e2e8f0); border-radius: 999px; background: #fff; color: var(--color-ink); font-size: var(--fs-75); font-weight: 600; text-decoration: none; transition: border-color .15s, background .15s; }
.bundle-hero__chips li a:hover { border-color: var(--color-accent); background: #fffbea; }
.bundle-hero__media { border-radius: var(--radius-xl, 18px); overflow: hidden; border: 1px solid var(--color-border, #e2e8f0); background: #fff; aspect-ratio: 4 / 3; }
.bundle-hero__media img { width: 100%; height: 100%; object-fit: contain; padding: clamp(10px, 2vw, 24px); display: block; }
@media (max-width: 820px) {
  .bundle-hero__grid { grid-template-columns: 1fr; }
  .bundle-hero__media { order: -1; aspect-ratio: 16 / 10; }
}

.bundle-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: clamp(14px, 2vw, 22px); }
.bundle-card { display: flex; flex-direction: column; border: 1px solid var(--color-border, #e2e8f0); border-radius: var(--radius-lg, 14px); overflow: hidden; background: #fff; color: inherit; text-decoration: none; box-shadow: 0 2px 10px rgba(15,23,42,.05); transition: transform .18s var(--ease-out, ease), box-shadow .18s, border-color .18s; }
.bundle-card:hover { transform: translateY(-3px); box-shadow: 0 14px 34px rgba(15,23,42,.13); border-color: color-mix(in srgb, var(--color-accent) 55%, #e2e8f0); }
.bundle-card__media { position: relative; aspect-ratio: 4 / 3; background: #fff; display: grid; place-items: center; overflow: hidden; }
.bundle-card__media img { width: auto; height: auto; max-width: 88%; max-height: 88%; object-fit: contain; display: block; }
.bundle-card__ph { color: #94a3b8; } .bundle-card__ph .icon { width: 40px; height: 40px; }
.bundle-card__badge { position: absolute; top: 10px; left: 10px; padding: 4px 10px; border-radius: 999px; background: rgba(15,23,42,.85); color: #fff; font-size: 11px; font-weight: 700; }
.bundle-card__body { display: flex; flex-direction: column; gap: 8px; padding: 16px 16px 18px; flex: 1; }
.bundle-card__body h2 { font-size: var(--fs-200); margin: 0; }
.bundle-card__body p { color: var(--color-ink-soft); font-size: var(--fs-75); line-height: 1.55; flex: 1; }
.bundle-card__more { display: inline-flex; align-items: center; gap: 6px; color: var(--color-accent-ink, #b45309); font-weight: 700; font-size: var(--fs-75); }
.bundle-card__more .icon { width: 15px; height: 15px; }

/* ==========================================================================
   ANA SAYFA KAMPANYA ŞERİDİ — slider ile Popüler Markalar arası 4 banner
   ========================================================================== */
.home-promostrip { padding-block: clamp(10px, 1.6vw, 18px); background: #eef2f5; }
.home-promostrip__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(10px, 1.1vw, 16px); }
.home-promostrip__item { display: block; overflow: hidden; border: 1px solid #d8dee7; border-radius: 14px; background: #fff; box-shadow: 0 2px 8px rgba(15,23,42,.08); aspect-ratio: 3 / 2; transition: transform .18s var(--ease-out, ease), box-shadow .18s, border-color .18s; }
.home-promostrip__item img { width: 100%; height: 100%; object-fit: cover; display: block; }
@media (hover: hover) and (pointer: fine) {
  .home-promostrip__item:hover { transform: translateY(-3px); box-shadow: 0 14px 30px rgba(15,23,42,.15); border-color: color-mix(in srgb, var(--color-accent) 55%, #d8dee7); }
}
@media (max-width: 820px) { .home-promostrip__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 460px) { .home-promostrip__grid { grid-template-columns: 1fr; } .home-promostrip__item { aspect-ratio: 16 / 9; } }

/* Teklif odaklı vitrin: metin kartların üstünde, indirim fiyatları görünür. */
.home-showcase__intro { margin: 0 0 18px; text-align: center; color: #14213b; }
.home-showcase__intro h1 { margin: 0 0 6px; font-size: clamp(20px, 2vw, 30px); line-height: 1.25; }
.home-showcase__intro p { margin: 0; font-size: clamp(14px, 1.2vw, 17px); color: #46566f; }
/* Koyu banner panel (slider kartları estetiğinde) — göze çarpan başlık şeridi */
.home-showcase__intro--banner {
  padding: clamp(15px, 2.2vw, 24px) clamp(16px, 2.4vw, 28px);
  border-radius: 14px;
  background: linear-gradient(120deg, #0b1730, #13233f);
  box-shadow: 0 10px 30px rgba(11, 23, 48, .18);
}
.home-showcase__intro--banner h1 {
  margin: 0 0 7px;
  text-transform: uppercase;
  font-size: clamp(16px, 1.9vw, 26px); line-height: 1.18; font-weight: 900; letter-spacing: .01em;
  color: #fff; text-wrap: balance;
}
.home-showcase__intro--banner h1 .hs-hl { color: #fb923c; white-space: nowrap; }
.home-showcase__intro--banner p {
  font-size: clamp(12.5px, 1vw, 15px); line-height: 1.5; color: #b9c4d6; font-weight: 500;
}
.home-showcase__intro--banner p b { color: #fff; font-weight: 800; }
.product-quote-promise { padding: 14px 16px; border-radius: 12px; background: #fff8dc; color: #23334b; line-height: 1.6; }
.shelf--featured-compact .pcard__pricing.pcard__pricing--compact-visible { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; padding: 8px; min-width: 0; }
.shelf--featured-compact .pcard__pricing--compact-visible strong { font-size: 18px; line-height: 1.3; }
.shelf--featured-compact .pcard__pricing--compact-visible :is(small, span) { font-size: 11px; line-height: 1.4; }
.shelf--featured-compact .pcard__pricing--compact-visible del { font-size: 13px; color: #65718a; }
.shelf--featured-compact .pcard__pricing--compact-visible mark { position: static; font-size: 12px; }
.campaign-detail h1 { margin: 20px 0 12px; font-size: clamp(24px, 3vw, 38px); }
.campaign-detail__image { width: min(100%, 680px); max-height: 400px; object-fit: contain; border-radius: 16px; margin: 18px 0; }
.campaign-detail__terms { padding: clamp(18px, 3vw, 30px); background: #fff; border: 1px solid #dce4ee; border-radius: 16px; margin: 20px 0 28px; overflow-wrap: anywhere; }
.campaign-detail__terms h3 { margin: 22px 0 6px; }
.campaign-detail__terms p { line-height: 1.65; margin: 8px 0; }
.campaign-detail__terms dt { font-weight: 700; margin-top: 14px; }
.campaign-detail__terms dd { margin: 5px 0; }
.campaign-detail__products { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.campaign-detail__pagination { display: flex; flex-wrap: wrap; gap: 8px; margin: 24px 0; }
@media (max-width: 700px) {
  .home-showcase__intro { text-align: left; margin-bottom: 14px; }
  .campaign-detail__products { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
}

/* Paket sayfası: WhatsApp butonu + alt CTA satırı */
.bundle-wa { background: #25d366; border: 1px solid #25d366; color: #fff; }
.bundle-wa:hover { background: #1eb958; border-color: #1eb958; color: #fff; }
.bundle-wa .icon { color: #fff; }
.bundle-cta-row { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; margin-top: var(--space-6); }