/* =================================================================
   XGRIDS Türkiye — ürün sayfaları (urunler/<slug>.html, 2026-10-27)
   hero → bölüm çubuğu → genel bakış (bento) → teknoloji → özellikler (zikzak) → çıktılar → karşılaştırma
   → uygulamalar → aksesuarlar → teknik özellikler → SSS → diğer ürünler → talep bandı.
   Zeminler anasayfayla aynı dil: koyu bölümlerde üst/alt kenarda mavi ışık şeridi, açık bölümler beyaz / --kagit-2.
   Tüm ölçüler rem (masaüstü orantılı ölçekleme, site.css).
   ================================================================= */

/* Yapışkan header + bölüm çubuğu: çapa hedefleri ikisinin altında kalsın */
html:has(.sayfa-urun) { scroll-padding-top: calc(var(--ust-h) + 4rem); }
.gorunmez { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.u-medya { display: block; width: 100%; height: 100%; object-fit: cover; background: var(--ink-3); }

/* Çip (biçim, kullanım örneği) */
.etiketler { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.etiketler li {
  padding: 0.25rem 0.75rem; border: 1px solid var(--cizgi); border-radius: 2rem;
  font-size: var(--fs-xs); font-weight: 600; letter-spacing: .04em; color: var(--soluk);
}
.etiketler--koyu li { border-color: var(--cizgi-koyu); color: var(--koyu-metin); }

/* ---------- Hero ---------- */
.uhero {
  position: relative; isolation: isolate; overflow: hidden;
  display: flex; flex-direction: column; min-height: clamp(40rem, calc(100svh - var(--ust-h) - 2.625rem), 62rem);
  color: #fff; background: var(--ink);
}
.uhero__medya { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; }
/* Tam kare hero (veri hero.tamKare; K2, 2026-10-27, kullanıcı: "çok zoom in"): geniş hero şeridinde cover sahneyi çok yakın keser.
   Masaüstünde video rakam bandının üstündeki alana tam sığar (oran = video 32:15), sağa yaslanır, sol kenarı koyu zemine erir.
   Bant yüksekliği ≈ 7rem + 4 px; video birkaç px bandın camının altına girer. Tablet/mobilde normal cover. */
@media (min-width: 1101px) {
  .uhero--tam .uhero__medya {
    left: auto; width: auto; max-width: 100%; height: calc(100% - 7rem); aspect-ratio: 32 / 15;
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 24%); mask-image: linear-gradient(90deg, transparent, #000 24%);
  }
}
.uhero__ort {
  position: absolute; inset: 0; z-index: -1;
  background:
    linear-gradient(90deg, rgba(var(--ink-rgb), .92) 0%, rgba(var(--ink-rgb), .7) 36%, rgba(var(--ink-rgb), .18) 68%, rgba(var(--ink-rgb), 0) 100%),
    linear-gradient(0deg, rgba(var(--ink-rgb), .88) 0%, rgba(var(--ink-rgb), 0) 34%);
}
.uhero__ic { flex: 1; display: flex; flex-direction: column; justify-content: center; padding-block: 3.5rem 3rem; }
.kirinti ol { display: flex; flex-wrap: wrap; gap: 0.5rem; list-style: none; margin: 0 0 2.25rem; padding: 0; font-size: var(--fs-sm); color: rgba(255, 255, 255, .66); }
.kirinti li + li::before { content: "/"; margin-right: 0.5rem; opacity: .5; }
.kirinti a { transition: color .2s; }
.kirinti a:hover { color: #fff; }
.kirinti [aria-current] { color: #fff; font-weight: 600; }
.uhero__baslik { display: flex; flex-direction: column; margin-top: 0.5rem; font-family: var(--font-baslik); font-weight: 800; text-transform: uppercase; }
.uhero__baslik > span:first-child { font-size: var(--fs-hero); line-height: .92; letter-spacing: -.005em; }
.uhero__slogan { max-width: 22ch; margin-top: 1rem; font-size: 2.5rem; font-weight: 700; line-height: 1.05; color: var(--xg-acik); }
.uhero__metin { max-width: 40rem; margin-top: 1.5rem; font-size: var(--fs-lg); line-height: 1.6; color: rgba(255, 255, 255, .86); }
.uhero__dugmeler { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 1.5rem; margin-top: 2.25rem; }
.uhero__katalog { display: inline-flex; align-items: center; gap: 0.625rem; font-weight: 600; color: #fff; transition: color .2s; }
.uhero__katalog .ikon { font-size: 1.25rem; color: var(--xg-acik); }
.uhero__katalog small { margin-left: 0.25rem; font-size: var(--fs-xs); font-weight: 500; color: rgba(255, 255, 255, .6); }
.uhero__katalog:hover { color: var(--xg-acik); }
.kirinti[data-belir] { --sira: 0; }
.uhero__baslik[data-belir] { --sira: 1; }
.uhero__metin[data-belir] { --sira: 2; }
.uhero__dugmeler[data-belir] { --sira: 3; }

.uhero__bant { border-top: 1px solid rgba(255, 255, 255, .14); background: rgba(var(--ink-rgb), .4); -webkit-backdrop-filter: blur(0.75rem); backdrop-filter: blur(0.75rem); }
.uhero__bant-ic { display: flex; align-items: center; justify-content: space-between; gap: 2rem; }
.uhero__rakamlar { display: grid; grid-template-columns: repeat(4, auto); }
.uhero__rakamlar div { display: flex; flex-direction: column-reverse; justify-content: flex-end; padding: 1.5rem 3.5rem 1.5rem 0; }   /* rakamlar üstte hizalı */
.uhero__rakamlar div + div { padding-left: 3.5rem; border-left: 1px solid rgba(255, 255, 255, .14); }
.uhero__rakamlar dd { font-family: var(--font-baslik); font-size: 2.5rem; font-weight: 700; line-height: 1; color: #fff; }
.uhero__rakamlar dd small, .ozellik__rakamlar dd small { margin-left: 0.25rem; font-size: .5em; font-weight: 600; color: var(--xg-acik); }
.uhero__rakamlar dt { margin-top: 0.375rem; font-size: var(--fs-xs); letter-spacing: .08em; text-transform: uppercase; color: rgba(255, 255, 255, .7); }
.uhero__oynat {
  flex: none; display: grid; place-items: center; width: 3rem; height: 3rem; border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, .4); color: #fff; font-size: 1rem; transition: background-color .2s, border-color .2s;
}
.uhero__oynat:hover { background: rgba(255, 255, 255, .14); border-color: #fff; }
.uhero__oynat .i-oynat { display: none; }
.uhero__oynat.is-durdu .i-oynat { display: block; }
.uhero__oynat.is-durdu .i-durdur { display: none; }

/* ---------- Bölüm çubuğu (header'ın altına yapışır) ---------- */
.ucubuk { position: sticky; top: var(--ust-h); z-index: 40; background: rgba(var(--ink-rgb), .94); border-bottom: 1px solid var(--cizgi-koyu); -webkit-backdrop-filter: blur(0.75rem); backdrop-filter: blur(0.75rem); }
.ucubuk__ic { display: flex; align-items: center; gap: 2rem; min-height: 4rem; }
.ucubuk__ad { flex: none; font-family: var(--font-baslik); font-size: 1.375rem; font-weight: 700; letter-spacing: .02em; text-transform: uppercase; color: #fff; }
.ucubuk__liste { display: flex; gap: 0.25rem; min-width: 0; margin-right: auto; overflow-x: auto; scrollbar-width: none; }
.ucubuk__liste::-webkit-scrollbar { display: none; }
.ucubuk__liste a {
  position: relative; display: block; padding: 1.25rem 0.875rem; white-space: nowrap;
  font-family: var(--font-baslik); font-size: var(--fs-sm); font-weight: 600; letter-spacing: .06em; text-transform: uppercase;
  color: var(--koyu-soluk); transition: color .2s;
}
.ucubuk__liste a::after { content: ""; position: absolute; left: 0.875rem; right: 0.875rem; bottom: 0; height: 2px; background: var(--xg); transform: scaleX(0); transition: transform .25s var(--ease); }
.ucubuk__liste a:hover { color: #fff; }
.ucubuk__liste a[aria-current="true"] { color: var(--xg); }   /* seçili bölüm: yazı alt çizgiyle aynı renk (kullanıcı, 2026-10-27) */
.ucubuk__liste a[aria-current="true"]::after { transform: scaleX(1); }
.ucubuk__dugme { flex: none; }
/* Masaüstünde ürün adı + bölüm bağlantıları çubuğun ortasında, düğme sağda (kullanıcı, 2026-10-27). Yan sütunlar eşit (1fr);
   yer daralırsa sağ sütun düğme genişliğinin altına inmez, liste kendi içinde kayar. Tablet/mobil düzeni değişmez. */
@media (min-width: 1101px) {
  .ucubuk__ic { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, max-content) minmax(max-content, 1fr); }
  .ucubuk__ad { grid-column: 2; }
  .ucubuk__liste { grid-column: 3; margin-right: 0; }
  .ucubuk__dugme { grid-column: 4; justify-self: end; }
}

/* ---------- Genel bakış: bento ---------- */
.bolum--genel { background: var(--kagit-2); }
.bento { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-auto-rows: 1fr; grid-auto-flow: dense; gap: 1rem; }   /* satırlar eşit */
.bento__vitrin {
  grid-column: span 2; grid-row: span 2; position: relative; display: flex; flex-direction: column; justify-content: flex-end;
  min-height: 27rem; overflow: hidden;   /* 2026-10-28: 34 → 27rem, kartlarda değer–başlık boşluğu azalsın (kullanıcı) */ border-radius: var(--yaricap); color: #fff;
  background:
    radial-gradient(ellipse 42% 52% at 50% 44%, rgba(124, 155, 255, .5) 0%, rgba(var(--xg-rgb), .22) 45%, rgba(var(--xg-rgb), 0) 80%),
    radial-gradient(ellipse 60% 14% at 50% 100%, rgba(var(--xg-rgb), .25), transparent 70%),
    var(--ink-2);
}
.bento__vitrin img { position: absolute; inset: 2rem 0 6rem; width: 100%; height: calc(100% - 8rem); object-fit: contain; }
.bento__vitrin img[src*="portalcam"] { inset: 4rem 0 8rem; height: calc(100% - 12rem); }
.bento__vitrin figcaption { position: relative; display: flex; flex-direction: column; padding: 2rem 2.25rem; }
.bento__vitrin figcaption span { font-family: var(--font-baslik); font-size: 2.25rem; font-weight: 800; line-height: 1; text-transform: uppercase; }
.bento__vitrin figcaption small { margin-top: 0.375rem; font-size: var(--fs-sm); color: var(--koyu-soluk); }
.bento__oge {
  display: flex; flex-direction: column; padding: 1.75rem 1.75rem 1.625rem;
  background: var(--kagit); border: 1px solid var(--cizgi); border-radius: var(--yaricap);
  transition: border-color .25s, box-shadow .25s, transform .3s var(--ease);
}
.bento__oge:hover { border-color: rgba(var(--xg-rgb), .45); box-shadow: 0 1rem 2.25rem rgba(var(--ink-rgb), .08); }
.bento__deger { font-family: var(--font-baslik); font-size: 3rem; font-weight: 800; line-height: 1; color: var(--xg); }
.bento__deger small { margin-left: 0.375rem; font-size: .42em; font-weight: 700; letter-spacing: .04em; color: var(--ink); }
.bento__baslik { margin-top: auto; padding-top: 1.25rem; font-family: var(--font-baslik); font-size: 1.375rem; font-weight: 700; line-height: 1.15; text-transform: uppercase; color: var(--ink); }
.bento__metin { margin-top: 0.375rem; font-size: var(--fs-sm); line-height: 1.5; color: var(--soluk); }
.bento__deger--uzun { font-size: 2.25rem; }   /* "320.000 / 640.000" gibi uzun değerler tek satırda kalsın, satırı uzatmasın */

/* ---------- Koyu bölümler: anasayfadaki üst/alt ışık şeridi ---------- */
.bolum--useritli {
  position: relative; overflow: hidden;
  background:
    radial-gradient(ellipse 75% 16rem at 50% 0%, rgba(var(--xg-rgb), .22), transparent 72%),
    radial-gradient(ellipse 75% 16rem at 50% 100%, rgba(var(--xg-rgb), .22), transparent 72%),
    var(--ink);
}

/* ---------- Teknoloji ---------- */
.tkartlar { display: grid; grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); gap: 1rem; }
.tkart { display: flex; flex-direction: column; overflow: hidden; background: var(--ink-2); border: 1px solid var(--cizgi-koyu); border-radius: var(--yaricap); transition: border-color .25s; }
.tkart:hover { border-color: rgba(var(--xg-rgb), .55); }
.tkart__medya { aspect-ratio: 16 / 9; overflow: hidden; border-bottom: 1px solid var(--cizgi-koyu); }
.tkart__medya .u-medya { transition: transform .6s var(--ease); }
.tkart:hover .tkart__medya .u-medya { transform: scale(1.04); }
.tkart__govde { padding: 1.5rem 1.5rem 1.625rem; }
.tkart__ad { font-family: var(--font-baslik); font-size: 1.5rem; font-weight: 700; line-height: 1.1; text-transform: uppercase; color: #fff; }
.tkart__metin { margin-top: 0.625rem; font-size: var(--fs-sm); line-height: 1.55; color: var(--koyu-soluk); }
.tkart__maddeler { display: flex; flex-direction: column; gap: 0.375rem; margin-top: 1rem; }
.tkart__maddeler li { position: relative; padding-left: 1.125rem; font-size: var(--fs-sm); line-height: 1.45; color: var(--koyu-metin); }
.tkart__maddeler li::before { content: ""; position: absolute; left: 0; top: .55em; width: 0.375rem; height: 0.375rem; border-radius: 50%; background: var(--xg); }
/* Medyalı düzen (L2 Pro, K2): solda büyük görsel/video, sağda kart listesi */
.teknoloji--yan { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: 1.5rem; align-items: stretch; }
.teknoloji__medya { overflow: hidden; border-radius: var(--yaricap); border: 1px solid var(--cizgi-koyu); min-height: 100%; }
.teknoloji--yan .tkartlar { grid-template-columns: minmax(0, 1fr); align-content: start; }
.teknoloji--yan .tkart__govde { padding: 1.25rem 1.5rem; }

/* ---------- Özellikler: zikzak ---------- */
.bolum--ozellik:not(.bolum--useritli) { background: var(--kagit); }   /* koyu seçenek (yazılım sayfaları, kullanıcı 2026-10-31): .bolum--koyu .bolum--useritli zemini */
.bolum--ozellik .kap { display: flex; flex-direction: column; gap: 7rem; }
/* Kompozisyon (2026-10-27, kullanıcı: "kayık ve boşluklu olmasın"): görsel ve metin sütunu aynı yükseklikte. Görsel sütunu kaplar
   (en az 16:9, metin uzunsa boyca uzar, object-fit: cover), kısa metin dikeyde ortalanır. Görsel her blokta geniş sütunda. */
.ozellik { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 5rem; align-items: stretch; }
.ozellik:nth-of-type(even), .ozellik--ters { grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); }
.ozellik:nth-of-type(even) .ozellik__medya, .ozellik--ters .ozellik__medya { order: 2; }
/* Dönüşümlü şeritler (CyberColor "Neden LCC", kullanıcı 2026-10-30): her özellik kendi tam genişlik bandında; ilki koyu (koyu bölümlerin
   ışık şeridiyle), sonraki gri, dönüşümlü. Bant boşluğu bölüm boşluğuyla aynı. */
.ozserit { padding-block: var(--bolum-y); background: var(--kagit-2); }
.ozserit--koyu {
  background:
    radial-gradient(ellipse 75% 16rem at 50% 0%, rgba(var(--xg-rgb), .22), transparent 72%),
    radial-gradient(ellipse 75% 16rem at 50% 100%, rgba(var(--xg-rgb), .22), transparent 72%),
    var(--ink);
}
:is(.ozserit--koyu, .bolum--ozellik.bolum--koyu) .ozellik__ust { color: var(--xg-acik); }
:is(.ozserit--koyu, .bolum--ozellik.bolum--koyu) .ozellik__no { background: rgba(var(--xg-rgb), .22); color: var(--xg-acik); }
:is(.ozserit--koyu, .bolum--ozellik.bolum--koyu) .ozellik__baslik, :is(.ozserit--koyu, .bolum--ozellik.bolum--koyu) .ozellik__rakamlar dd, :is(.ozserit--koyu, .bolum--ozellik.bolum--koyu) .ozellik__maddeler strong { color: #fff; }
:is(.ozserit--koyu, .bolum--ozellik.bolum--koyu) .ozellik__giris, :is(.ozserit--koyu, .bolum--ozellik.bolum--koyu) .ozellik__rakamlar dt, :is(.ozserit--koyu, .bolum--ozellik.bolum--koyu) .ozellik__maddeler li > span, :is(.ozserit--koyu, .bolum--ozellik.bolum--koyu) .ozellik__dipnot { color: var(--koyu-soluk); }
:is(.ozserit--koyu, .bolum--ozellik.bolum--koyu) .ozellik__rakamlar div { background: var(--ink-2); border: 1px solid var(--cizgi-koyu); }
:is(.ozserit--koyu, .bolum--ozellik.bolum--koyu) .ozellik__rakamlar dd small { color: var(--xg-acik); }
:is(.ozserit--koyu, .bolum--ozellik.bolum--koyu) .ozellik__medya { border: 1px solid var(--cizgi-koyu); box-shadow: 0 1.5rem 3.5rem rgba(0, 0, 0, .45); }
.ozellik__medya { position: relative; overflow: hidden; border-radius: var(--yaricap); background: var(--ink); box-shadow: 0 1.5rem 3.5rem rgba(var(--ink-rgb), .16); }
.ozellik__medya::before { content: ""; display: block; padding-top: 56.25%; }   /* en az 16:9 */
.ozellik__medya > .u-medya { position: absolute; inset: 0; }
.ozellik__metin { display: flex; flex-direction: column; justify-content: center; }
.ozellik__ust { display: flex; align-items: center; gap: 0.875rem; font-family: var(--font-baslik); font-size: var(--fs-sm); font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--xg); }
.ozellik__no { display: grid; place-items: center; width: 2.25rem; height: 2.25rem; border-radius: 50%; background: var(--xg-50); color: var(--xg-koyu); letter-spacing: 0; }
.ozellik__baslik { margin-top: 1rem; font-family: var(--font-baslik); font-size: 2.75rem; font-weight: 700; line-height: 1.04; text-transform: uppercase; color: var(--ink); text-wrap: balance; }
.ozellik__giris { margin-top: 1.25rem; font-size: var(--fs-lg); line-height: 1.6; color: var(--soluk); text-wrap: pretty; }
.ozellik__rakamlar { display: grid; grid-template-columns: repeat(auto-fit, minmax(8.5rem, 1fr)); gap: 1rem; margin-top: 1.5rem; }   /* 2026-10-28: 2rem → 1.5rem, metin sütunu videonun 16:9 boyunu aşmasın */
.ozellik__rakamlar div { display: flex; flex-direction: column-reverse; padding: 1rem 1.125rem; background: var(--kagit-2); border-radius: var(--yaricap); }
.ozellik__rakamlar dd { font-family: var(--font-baslik); font-size: 2.25rem; font-weight: 800; line-height: 1; color: var(--ink); }
.ozellik__rakamlar dd small { color: var(--xg); }
.ozellik__rakamlar dt { margin-top: 0.375rem; font-size: var(--fs-xs); line-height: 1.35; color: var(--soluk); }
.ozellik__rakamlar + .ozellik__rakamlar { margin-top: 1rem; }   /* ikinci sıra (ör. işlenmiş / işlenmemiş veri) */
.rakam__not { display: block; margin-top: 0.125rem; font-weight: 700; color: var(--xg-koyu); }
.ozellik__maddeler { display: flex; flex-direction: column; gap: 1rem; margin-top: 2rem; }
/* 4 ve daha fazla madde iki sütunda: metin sütunu görselden fazla uzamaz */
.ozellik__maddeler:has(> li:nth-child(4)) { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem 2rem; }
.ozellik__maddeler li { display: flex; flex-direction: column; gap: 0.25rem; padding-left: 1.125rem; border-left: 2px solid var(--xg); }
.ozellik__maddeler strong { font-weight: 700; color: var(--ink); }
.ozellik__maddeler li > span { font-size: var(--fs-sm); line-height: 1.55; color: var(--soluk); }   /* yalnız açıklama: başlıktaki marka adı (span lang="en") başlık renginde kalır (kullanıcı 2026-10-29) */
/* Önce/sonra karşılaştırması (L3 filtreleme): sahne .ozellik__medya sütunudur (2026-10-28, kullanıcı: diğerleri gibi yarı video yarı metin;
   çerçeve, en az 16:9 ve videoların yerleşimi .ozellik__medya'dan gelir). Üstteki video (önce) soldan --k kadar görünür; çizgi ve tutamak --k'de.
   Kaydırıcı görünmez range input'tur, sahnenin tamamını kaplar. */
.kiyas__sahne { --k: 50%; user-select: none; }
.kiyas__ust { clip-path: inset(0 calc(100% - var(--k)) 0 0); }
.kiyas__cizgi { position: absolute; top: 0; bottom: 0; left: var(--k); width: 2px; margin-left: -1px; background: #fff; box-shadow: 0 0 1rem rgba(0, 0, 0, .35); pointer-events: none; }
.kiyas__tutamak {
  position: absolute; top: 50%; left: 50%; display: grid; place-items: center; width: 3.25rem; height: 3.25rem; transform: translate(-50%, -50%);
  border: 2px solid #fff; border-radius: 50%; background: rgba(var(--ink-rgb), .7); color: #fff;
  -webkit-backdrop-filter: blur(0.5rem); backdrop-filter: blur(0.5rem); transition: transform .2s var(--ease), background .2s;
}
.kiyas__tutamak svg { width: 1.375rem; height: 1.375rem; }
.kiyas__sahne:hover .kiyas__tutamak { background: var(--xg); transform: translate(-50%, -50%) scale(1.06); }
.kiyas__sahne:has(.kiyas__aralik:focus-visible) .kiyas__tutamak { outline: 0.1875rem solid var(--xg-acik); outline-offset: 0.1875rem; }
.kiyas__etiket {
  position: absolute; top: 1.25rem; padding: 0.4375rem 0.875rem; border-radius: 0.375rem; background: rgba(var(--ink-rgb), .72); color: #fff;
  font-family: var(--font-baslik); font-size: var(--fs-xs); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; pointer-events: none;
  -webkit-backdrop-filter: blur(0.5rem); backdrop-filter: blur(0.5rem);
}
.kiyas__etiket--once { left: 1.25rem; }
.kiyas__etiket--sonra { right: 1.25rem; }
.kiyas__kisa { display: none; }   /* dar ekranda uzun etiket çizgiye değmesin */
.kiyas__aralik { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: ew-resize; touch-action: pan-y; -webkit-appearance: none; appearance: none; }
.ozellik__dipnot { margin-top: 1rem; font-size: var(--fs-xs); line-height: 1.4; color: var(--soluk); }   /* 2026-10-28: 1.5rem → 1rem */

/* ---------- Çıktılar / adımlar ---------- */
.ckartlar { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5rem; margin: 0; padding: 0; list-style: none; }
.ckartlar--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.ckart { display: flex; flex-direction: column; }
.ckart__medya { position: relative; aspect-ratio: 16 / 9; overflow: hidden; border-radius: var(--yaricap); border: 1px solid var(--cizgi-koyu); }
.ckart__no {
  position: absolute; left: 1rem; top: 1rem; display: grid; place-items: center; width: 2.5rem; height: 2.5rem; border-radius: 50%;
  background: var(--xg); color: #fff; font-family: var(--font-baslik); font-weight: 700;
}
.ckart__ad { margin-top: 1.5rem; font-family: var(--font-baslik); font-size: 1.75rem; font-weight: 700; line-height: 1.1; text-transform: uppercase; color: #fff; }
.ckart__metin { margin-top: 0.625rem; font-size: var(--fs-base); line-height: 1.55; color: var(--koyu-soluk); }
.ckart .etiketler { margin-top: 1.125rem; }

/* ---------- Karşılaştırma tablosu ---------- */
.bolum--karsilastirma { background: var(--kagit); }
.tablo-kap { overflow-x: auto; border: 1px solid var(--cizgi); border-radius: var(--yaricap); }
.karsilastirma { width: 100%; min-width: 46rem; border-collapse: collapse; font-size: var(--fs-base); }
.karsilastirma th, .karsilastirma td { padding: 1.25rem 1.5rem; text-align: left; vertical-align: top; border-bottom: 1px solid var(--cizgi); }
.karsilastirma thead th { font-family: var(--font-baslik); font-size: var(--fs-sm); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--soluk); background: var(--kagit-2); }
.karsilastirma tbody th { font-weight: 700; color: var(--ink); white-space: nowrap; }
.karsilastirma td { color: var(--soluk); }
.karsilastirma tbody tr:last-child > * { border-bottom: 0; }
.karsilastirma .is-vurgu > * { background: var(--xg-50); color: var(--ink); font-weight: 600; }
.karsilastirma .is-vurgu th { color: var(--xg-koyu); box-shadow: inset 0.25rem 0 0 var(--xg); }

/* ---------- Uygulama alanları ---------- */
.bolum--alan { background: var(--kagit-2); }
.akartlar { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5rem; }
.akartlar--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.akart__ic {
  display: flex; flex-direction: column; height: 100%; overflow: hidden;
  background: var(--kagit); border: 1px solid var(--cizgi); border-radius: var(--yaricap);
  transition: border-color .25s, box-shadow .25s, transform .3s var(--ease);
}
a.akart__ic:hover { border-color: rgba(var(--xg-rgb), .45); box-shadow: 0 1.25rem 2.75rem rgba(var(--ink-rgb), .1); transform: translateY(-0.25rem); }
.akart__medya { aspect-ratio: var(--oran, 4 / 3); overflow: hidden; }
.akart__medya .u-medya { transition: transform .6s var(--ease); }
a.akart__ic:hover .u-medya { transform: scale(1.04); }
.akart__govde { display: flex; flex: 1; flex-direction: column; gap: 0.75rem; padding: 1.5rem 1.5rem 1.625rem; }
.akart__ad { font-family: var(--font-baslik); font-size: 1.625rem; font-weight: 700; line-height: 1.1; text-transform: uppercase; color: var(--ink); }
.akart__metin { font-size: var(--fs-sm); line-height: 1.55; color: var(--soluk); }
.akart__maddeler { display: flex; flex-direction: column; gap: 0.3125rem; }
.akart__maddeler li { position: relative; padding-left: 1.125rem; font-size: var(--fs-sm); font-weight: 600; color: var(--ink); }
.akart__maddeler li::before { content: ""; position: absolute; left: 0; top: .55em; width: 0.375rem; height: 0.375rem; border-radius: 50%; background: var(--xg); }
.akart .etiketler { margin-top: auto; padding-top: 0.25rem; }
.akart__link { margin-top: auto; padding-top: 0.5rem; }
.akart .etiketler + .akart__link { margin-top: 0; }

/* ---------- Aksesuarlar / sahada ---------- */
.bolum--aksesuar:not(.bolum--useritli) { background: var(--kagit); }
/* Koyu aksesuar bölümü (L2 Pro, veri aksesuar.koyu): Teknoloji ile aynı zemin; kart metinleri ve görsel zemini koyuya göre */
.bolum--koyu .xkart__medya { background: var(--ink-2); }
.bolum--koyu .xkart__ad { color: #fff; }
.bolum--koyu .xkart__metin { color: var(--koyu-soluk); }
/* Standart içerik kartı (K2, veri aksesuar.icerik; kullanıcı 2026-10-30): kart iskeleti, son sıradaki boş sütunları kaplar (--yayil).
   Kutu yanındaki kart görselleriyle aynı yükseklikte: bir sütunun 4:3'ü = (kart genişliği − aralık) / 2 × 0,75 (cqw); altında başlık, metin, not.
   Zemin gri (kullanıcı: beyaz, sonra açık gri fazla açık): beyaz zeminli karolar multiply ile zemine karışır. Tablette kendi satırında (aynı formül), telefonda kutu içeriğe göre uzar. */
.xicerik { grid-column: span var(--yayil, 2); container-type: inline-size; }
.xkart__medya.xicerik__medya { aspect-ratio: auto; height: calc((100cqw - 1.5rem) / 2 * 0.75); padding: 0.875rem 1rem; background: linear-gradient(180deg, #dcdfe6, #c8cdd6); }
.xicerik__liste { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); grid-template-rows: repeat(2, minmax(0, 1fr)); gap: 0.625rem 0.75rem; height: 100%; }
.xicerik__oge { display: flex; flex-direction: column; align-items: center; min-height: 0; text-align: center; }
.xicerik__oge img { flex: 1; min-height: 0; width: 100%; object-fit: contain; mix-blend-mode: multiply; }
.xicerik__ad { margin-top: 0.25rem; font-size: 0.6875rem; font-weight: 600; line-height: 1.25; color: var(--ink); }
.xkartlar { display: grid; grid-template-columns: repeat(var(--n, 4), minmax(0, 1fr)); gap: 1.5rem; }   /* --n: öğe sayısı (en az 4), yetim kart kalmasın */
.xkartlar--kare .xkart__medya { aspect-ratio: 1 / 1; }   /* eşit kare çerçeve (sablon/urun.js b.kare) */
.aksesuar__eylem { display: flex; justify-content: center; margin-top: 3rem; }   /* aksesuarlar.html#<slug> düğmesi */
.xkart__medya { position: relative; aspect-ratio: 4 / 3; overflow: hidden; border-radius: var(--yaricap); background: var(--kagit-2); }
/* Kart videosu (medya.kv): görselin üstünde, ilk karesi gelince belirir; ilk ve son karesi kartın görseli (js/site.js [data-kart-video]) */
/* Video ilk karesi kapakla aynı ve tarama hemen başlıyor: oynayınca solmadan, anında görünür; çıkarken kısa solarak kapağa döner */
.xkart__video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity .3s var(--ease); }
.xkart.is-oynuyor .xkart__video { opacity: 1; transition-duration: 0s; }
/* Videolu kart: anasayfa yazılım kartları gibi fareyle gelince çerçeve kalkar, mavi kenar ve gölge alır; video 150 ms sonra başlar
   (data-kart-gecikme, js/site.js). Kalkış çerçevede: kartın kendisi [data-belir] beliriş geçişini kullanıyor (kullanıcı 2026-10-29).
   Kapak büyütmesi (scale 1,04) kaldırıldı: büyüyen kapak ile videonun kapak karesi üst üste binip tekrar/kayma gibi görünüyordu. */
.xkart[data-kart-video] .xkart__medya { isolation: isolate; transition: transform .35s var(--ease), box-shadow .35s var(--ease); }
.xkart[data-kart-video]:hover .xkart__medya { transform: translateY(-0.375rem); box-shadow: 0 0 0 1px rgba(var(--xg-rgb), .6), 0 1.5rem 3rem rgba(var(--ink-rgb), .22); }
/* Oynat rozeti kullanıcı isteğiyle kaldırıldı (2026-10-29); önceki: yedek/xgrids-aksesuar-video2-2026-10-29/urun-rozetli.css */
.xkart__ad { margin-top: 1.125rem; font-family: var(--font-baslik); font-size: 1.375rem; font-weight: 700; text-transform: uppercase; color: var(--ink); }
.xkart__metin { margin-top: 0.375rem; font-size: var(--fs-sm); line-height: 1.5; color: var(--soluk); }
.xkart__not { display: inline-block; margin-top: 0.75rem; padding: 0.1875rem 0.625rem; border-radius: 2rem; background: var(--xg-50); font-size: var(--fs-xs); font-weight: 600; color: var(--xg-koyu); }

/* ---------- Teknik özellikler ---------- */
.bolum--teknik { background: var(--kagit-2); }
.teknik__eylem { display: flex; flex-wrap: wrap; gap: 0.75rem; }
/* Teknik tablo (2026-10-27, kullanıcı: kayık sütunlar olmasın): her grup tam genişlikte tek kart; başlık solda, satırlar sağda iki sütunda.
   Kartlar alt alta, kenarlar hizalı; satır çizgileri iki sütunda aynı hizada. ≤1100 px başlık üstte, satırlar tek sütun. */
.teknik { display: grid; gap: 1rem; }
.teknik__grup { display: grid; grid-template-columns: 15rem minmax(0, 1fr); column-gap: 3rem; padding: 1.5rem 2rem; background: var(--kagit); border: 1px solid var(--cizgi); border-radius: var(--yaricap); }
.teknik__baslik { padding-top: 0.8125rem; font-family: var(--font-baslik); font-size: 1.375rem; font-weight: 700; line-height: 1.15; letter-spacing: .02em; text-transform: uppercase; color: var(--ink); }
.teknik__baslik::after { content: ""; display: block; width: 2.5rem; height: 2px; margin-top: 0.75rem; background: var(--xg); }
.teknik__grup dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 3rem; margin: 0; }
.teknik__grup dl > div { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: 1.5rem; padding: 0.8125rem 0; border-top: 1px solid var(--cizgi); }
.teknik__grup dl > div:nth-child(-n+2) { border-top: 0; }
.teknik__grup dt { font-size: var(--fs-sm); color: var(--soluk); }
.teknik__grup dd { font-size: var(--fs-sm); font-weight: 600; line-height: 1.5; color: var(--ink); overflow-wrap: anywhere; }
.teknik__dipnot { margin: 0.5rem 0 0; padding-left: 1.25rem; font-size: var(--fs-xs); line-height: 1.6; color: var(--soluk); }
.teknik__dipnot li + li { margin-top: 0.25rem; }
/* Ek teknik bölüm ara başlığı (ör. L2 Pro "Montaj Çözümleri", 2026-10-27): bölüm başlığının küçük kardeşi, üstte ayraç çizgisi */
.teknik__ara {
  margin: 3.5rem 0 1.5rem; padding-top: 2.5rem; border-top: 1px solid var(--cizgi);
  font-family: var(--font-baslik); font-size: 2rem; font-weight: 800; line-height: 1.1; text-transform: uppercase; color: var(--ink);
}

/* ---------- SSS ---------- */
.bolum--sss:not(.bolum--useritli) { background: var(--kagit); }
.sss { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 5rem; align-items: start; }
.sss__bas { position: sticky; top: calc(var(--ust-h) + 6rem); }
.sss__oge { border-bottom: 1px solid var(--cizgi); }
.sss__oge:first-child { border-top: 1px solid var(--cizgi); }
.sss__oge summary {
  display: flex; align-items: center; justify-content: space-between; gap: 2rem; padding: 1.5rem 0; cursor: pointer; list-style: none;
  font-size: var(--fs-lg); font-weight: 600; color: var(--ink); transition: color .2s;
}
.sss__oge summary::-webkit-details-marker { display: none; }
.sss__oge summary:hover { color: var(--xg-koyu); }
.sss__isaret { position: relative; flex: none; width: 2rem; height: 2rem; border-radius: 50%; border: 1px solid var(--cizgi); transition: background-color .2s, border-color .2s; }
.sss__isaret::before, .sss__isaret::after { content: ""; position: absolute; left: 50%; top: 50%; width: 0.75rem; height: 2px; background: currentColor; transform: translate(-50%, -50%); transition: transform .25s var(--ease); }
.sss__isaret::after { transform: translate(-50%, -50%) rotate(90deg); }
.sss__oge[open] .sss__isaret { background: var(--xg); border-color: var(--xg); color: #fff; }
.sss__oge[open] .sss__isaret::after { transform: translate(-50%, -50%) rotate(0deg); }
.sss__oge p { max-width: 52rem; padding-bottom: 1.25rem; font-size: var(--fs-base); line-height: 1.65; color: var(--soluk); }
.sss__oge p:last-child { padding-bottom: 1.75rem; }
/* Koyu SSS (yazılım sayfaları, kullanıcı 2026-10-31: bölümler gri / koyu dönüşümlü) */
.bolum--sss.bolum--koyu .sss__oge, .bolum--sss.bolum--koyu .sss__isaret { border-color: var(--cizgi-koyu); }
.bolum--sss.bolum--koyu .sss__oge summary { color: #fff; }
.bolum--sss.bolum--koyu .sss__oge summary:hover { color: var(--xg-acik); }
.bolum--sss.bolum--koyu .sss__oge p { color: var(--koyu-soluk); }

/* ---------- Diğer ürünler ---------- */
.dkartlar { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5rem; }
.dkartlar--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }   /* Ürünler sayfası yazılım bölümü (2026-10-31) */
.dkart a { display: flex; flex-direction: column; height: 100%; overflow: hidden; background: var(--ink-2); border: 1px solid var(--cizgi-koyu); border-radius: var(--yaricap); transition: border-color .25s, transform .3s var(--ease); }
.dkart a:hover { border-color: rgba(var(--xg-rgb), .6); transform: translateY(-0.25rem); }
.dkart__vitrin {
  display: block; aspect-ratio: 16 / 9; overflow: hidden; border-bottom: 1px solid var(--cizgi-koyu);   /* overflow: flex öğesinde içerik boyu oranı ezmesin */
  background: radial-gradient(ellipse 34% 62% at 50% 58%, rgba(124, 155, 255, .5) 0%, rgba(var(--xg-rgb), .22) 42%, rgba(var(--xg-rgb), 0) 78%), var(--ink-2);
}
.dkart__vitrin img { width: 100%; height: 100%; object-fit: contain; padding: 1.75rem 0 1.25rem; transition: transform .6s var(--ease); }
.dkart__vitrin img[src*="portalcam"] { padding: 2.75rem 0 2rem; }
.dkart a:hover .dkart__vitrin img { transform: scale(1.05); }
.dkart__govde { display: flex; flex: 1; flex-direction: column; padding: 1.5rem 1.75rem 1.75rem; }
.dkart__tur { font-size: var(--fs-xs); font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--xg-acik); }
.dkart__ad { margin-top: 0.375rem; font-family: var(--font-baslik); font-size: 2rem; font-weight: 800; line-height: 1; text-transform: uppercase; color: #fff; }
.dkart__konum { margin-top: 0.5rem; font-size: var(--fs-sm); color: var(--koyu-soluk); }
.dkart .ok-link { margin-top: auto; padding-top: 1.25rem; color: var(--xg-acik); }
/* Yazılım kartı (yazılım sayfalarında "Diğer Yazılımlarımız", Ürünler sayfasında yazılım bölümü): vitrinde yazılım görseli, kenardan kenara */
.dkart--yazilim .dkart__vitrin { aspect-ratio: 16 / 10; background: var(--ink-3); }
.dkart--yazilim .dkart__vitrin img { object-fit: cover; padding: 0; }
.dkart--yazilim a:hover .dkart__vitrin img { transform: scale(1.04); }
.dkart--yazilim .dkart__ad { font-size: 1.75rem; }

/* ---------- Talep bandı ---------- */
.utalep {
  position: relative; overflow: hidden; color: #fff;
  background:
    radial-gradient(42rem 30rem at 78% 60%, rgba(var(--xg-rgb), .5), transparent 70%),
    linear-gradient(120deg, var(--ink) 0%, var(--ink-3) 100%);
}
.utalep__ic { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 3rem; align-items: center; padding-block: 5rem; }
.utalep__baslik { margin-top: 1rem; font-family: var(--font-baslik); font-size: var(--fs-slogan); font-weight: 800; line-height: .98; text-transform: uppercase; text-wrap: balance; }
.utalep__giris { max-width: 38rem; margin-top: 1.25rem; font-size: var(--fs-lg); line-height: 1.6; color: rgba(255, 255, 255, .86); }
.utalep__dugmeler { display: flex; flex-wrap: wrap; gap: 1rem; margin-top: 2.25rem; }
.utalep__tel { display: inline-flex; align-items: center; gap: 0.5rem; margin-top: 1.5rem; font-family: var(--font-baslik); font-size: 1.375rem; font-weight: 700; letter-spacing: .04em; transition: color .2s; }
.utalep__tel .ikon { color: var(--xg-acik); }
.utalep__tel:hover { color: var(--xg-acik); }
.utalep__vitrin { position: relative; height: 30rem; }
.utalep__vitrin img { width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 2rem 3rem rgba(0, 0, 0, .5)); }
.utalep__vitrin img[src*="portalcam"] { padding: 3rem 0; }

/* ---------- Hareket ---------- */
@media (prefers-reduced-motion: reduce) {
  .tkart__medya .u-medya, .akart__medya .u-medya, .dkart__vitrin img, .akart__ic, .dkart a { transition: none; }
  .xkart[data-kart-video] .xkart__medya, .xkart__video { transition: none; }
}

/* ---------- Tablet / mobil ---------- */
@media (max-width: 1100px) {
  html:has(.sayfa-urun) { scroll-padding-top: calc(var(--ust-h) + 3.25rem); }
  .uhero { min-height: clamp(34rem, calc(100svh - var(--ust-h)), 48rem); }
  .uhero__ort { background: linear-gradient(90deg, rgba(var(--ink-rgb), .88) 0%, rgba(var(--ink-rgb), .55) 100%), linear-gradient(0deg, rgba(var(--ink-rgb), .85) 0%, rgba(var(--ink-rgb), 0) 40%); }
  .uhero__ic { padding-block: 2.5rem 2.5rem; }
  .kirinti ol { margin-bottom: 1.5rem; }
  .uhero__slogan { font-size: clamp(1.5rem, 1rem + 2vw, 2.125rem); }
  .uhero__rakamlar div { padding: 1.125rem 1.75rem 1.125rem 0; }
  .uhero__rakamlar div + div { padding-left: 1.75rem; }
  .uhero__rakamlar dd { font-size: 1.875rem; }
  .ucubuk__ic { gap: 1rem; min-height: 3.25rem; }
  .ucubuk__ad { display: none; }
  .ucubuk__liste { margin-inline: calc(var(--oluk) * -1) auto; padding-left: calc(var(--oluk) - 0.875rem); }
  .ucubuk__liste a { padding-block: 0.9375rem; }
  /* vitrin ilk satırda kendi boyunda; kart satırları birbirine eşit ama vitrine değil içeriğe göre (önceden 1fr tüm satırları vitrin boyuna çekiyordu) */
  .bento { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: auto; }
  .bento__vitrin { grid-column: 1 / -1; grid-row: auto; min-height: 26rem; }
  .teknoloji--yan, .ozellik, .utalep__ic { grid-template-columns: minmax(0, 1fr); }
  .teknoloji__medya { aspect-ratio: 16 / 9; }
  .bolum--ozellik .kap { gap: 4rem; }
  .ozellik { gap: 2rem; }
  .ozellik:nth-of-type(even) .ozellik__medya, .ozellik--ters .ozellik__medya { order: 0; }
  .ozellik__baslik { font-size: clamp(1.75rem, 1.2rem + 2vw, 2.375rem); }
  .ckartlar, .ckartlar--4, .akartlar, .akartlar--4, .dkartlar { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .teknik__grup { grid-template-columns: minmax(0, 1fr); row-gap: 0.5rem; }
  .teknik__grup dl { grid-template-columns: minmax(0, 1fr); }
  .teknik__grup dl > div:nth-child(2) { border-top: 1px solid var(--cizgi); }
  .ozellik:nth-of-type(even), .ozellik--ters { grid-template-columns: minmax(0, 1fr); }
  .ozellik__maddeler:has(> li:nth-child(4)) { grid-template-columns: minmax(0, 1fr); }
  .sss { grid-template-columns: minmax(0, 1fr); gap: 2rem; }
  .sss__bas { position: static; }
  .utalep__ic { padding-block: 3.5rem; }
  .utalep__vitrin { display: none; }
}
@media (max-width: 760px) {
  .uhero__rakamlar { flex: 1; min-width: 0; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .uhero__rakamlar div:nth-child(3) { padding-left: 0; border-left: 0; }
  .uhero__rakamlar div:nth-child(n+3) { border-top: 1px solid rgba(255, 255, 255, .14); }
  .ckartlar, .ckartlar--4, .akartlar, .akartlar--4, .dkartlar { grid-template-columns: minmax(0, 1fr); }
  .teknik__grup { padding: 1.25rem 1.25rem 0.75rem; }
  .ozellik__maddeler:has(> li:nth-child(4)) { gap: 1rem; }
  .teknik__grup dl > div { grid-template-columns: minmax(0, 1fr); gap: 0.125rem; }
}
@media (max-width: 640px) {
  .ucubuk__dugme { display: none; }
  .ucubuk__liste { margin-right: calc(var(--oluk) * -1); }
  .bento__vitrin { min-height: 21rem; }
  .bento__oge { padding: 1.25rem 1.125rem; }
  .bento__deger { font-size: 2.5rem; }
  .bento__deger--uzun { font-size: 1.75rem; }
  .bento { grid-auto-rows: auto; }   /* mobilde her kart satırı kendi en uzun kartı kadar (tüm satırları eşitlemek boşluk yaratıyordu) */
  .bento__baslik { font-size: 1.125rem; padding-top: 1rem; }
  .uhero__dugmeler .dugme { flex: 1 1 auto; justify-content: center; }
}
/* Yaslı kartlar (sablon/urun.js, öğelerde "oran"): görseller kendi oranında, kırpılmaz. Masaüstünde tek satır, aynı yükseklik;
   genişlik görsel oranıyla paylaşılır (flex-grow = oran, temel 0). 1100 px ve altında iki sütun, görsel yine kendi oranında. (2026-10-27) */
.xkartlar--yasli { display: flex; align-items: flex-start; }
.xkartlar--yasli .xkart { flex: var(--oran) 1 0; min-width: 0; }
.xkartlar--yasli .xkart__medya { aspect-ratio: var(--oran); }
/* Tablette 4 öğeli listeler 2×2 (3 sütunda tek kart yetim kalıyordu); 5 ve üstü 3 sütun */
@media (max-width: 1100px) { .xkartlar { grid-template-columns: repeat(2, minmax(0, 1fr)); } .xkartlar:has(> li:nth-child(5)) { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 1100px) { .xkartlar--yasli { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; } }
@media (max-width: 640px) {
  .kiyas__sahne { aspect-ratio: 4 / 3; }
  .kiyas__etiket { top: 0.75rem; padding: 0.3125rem 0.625rem; font-size: 0.6875rem; }
  .kiyas__etiket--once { left: 0.75rem; }
  .kiyas__etiket--sonra { right: 0.75rem; }
  .kiyas__tutamak { width: 2.75rem; height: 2.75rem; }
  .kiyas__uzun { display: none; }
  .kiyas__kisa { display: inline; }
}
@media (max-width: 640px) { .xkartlar { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; } }
@media (max-width: 1100px) { .xicerik { grid-column: 1 / -1; } }
@media (max-width: 640px) {
  .xkart__medya.xicerik__medya { height: auto; }
  .xicerik__liste { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: none; height: auto; }
  .xicerik__oge img { flex: none; height: auto; aspect-ratio: 1; }
  .xicerik__ad { font-size: var(--fs-xs); }
}