:root{
  --bg:#f6f7fb;
  --paper:#ffffff;
  --ink:#0f172a;
  --muted:#475569;
  --line:#e5e7eb;
  --accent:#255cff;
  --accent2:#00c2ff;
  --radius:18px;
  --shadow:0 14px 40px rgba(15,23,42,.08);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:
    radial-gradient(900px 520px at 10% 0%, rgba(37,92,255,.10), transparent 60%),
    radial-gradient(700px 520px at 90% 0%, rgba(0,194,255,.10), transparent 55%),
    var(--bg);
  color:var(--ink);
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial;
}
a{color:inherit;text-decoration:none}
.container{width:min(1220px,88vw);margin:0 auto}

.header{
  position: static; top:0; z-index:50;
  background: rgba(246,247,251,.86);
  backdrop-filter: blur(10px);
  border-bottom:1px solid var(--line);
}

/* Minimal header variant (İletişim: sadece "SEVAY" yazısı) */
.header--solo .header__inner{
  grid-template-columns: 1fr;
  justify-items:center;
  padding: 16px 0;
}

.header__inner{
  display:grid;
  grid-template-columns: 1fr auto 1fr;
  align-items:center;
  gap:12px;
  padding:14px 0;
}
.brand{
  justify-self:start;
  display:flex; align-items:center; gap:12px;
}

.nav{
  justify-self:center;
  position:relative;
}
.nav__btn{
  display:none;
  width:44px; height:42px;
  border-radius:14px;
  background: var(--paper);
  border:1px solid var(--line);
  cursor:pointer;
}
.nav__btn span{
  display:block; height:2px; width:18px;
  background: var(--ink);
  margin:6px auto;
  border-radius:2px;
  opacity:.9;
  transition: transform .2s ease, opacity .2s ease;
}
.nav__btn[aria-expanded="true"] span:first-child{
  transform: translateY(4px) rotate(45deg);
}
.nav__btn[aria-expanded="true"] span:last-child{
  transform: translateY(-4px) rotate(-45deg);
}
.nav__list{
  list-style:none; margin:0; padding:0;
  display:flex; gap:14px; align-items:center;
}
.nav__list a{
  font-weight:700;
  color:var(--muted);
  padding:10px 12px;
  border-radius:12px;
}
.nav__list a:hover{
  color:var(--ink);
  background: rgba(15,23,42,.04);
}
.nav__list a.is-active{
  color:var(--ink);
  background: linear-gradient(90deg, rgba(37,92,255,.10), rgba(0,194,255,.10));
  border: 1px solid rgba(37,92,255,.18);
}

.header__right{
  justify-self:end;
  display:flex; align-items:center; gap:10px;
}
.header__right .phone{
  font-weight:600;
  padding:10px 12px;
  border-radius:999px;
  background: var(--paper);
  border:1px solid var(--line);
  box-shadow: 0 8px 18px rgba(15,23,42,.06);
  color: var(--ink);
}
.header__right .phone:hover{ border-color: rgba(37,92,255,.30); }

.kicker{
  display:inline-block;
  padding:8px 12px;
  border-radius:999px;
  background: var(--paper);
  border:1px solid var(--line);
  color:var(--muted);
  font-size:13px;
  font-weight:700;
}
h1{
  margin:14px 0 10px;
  font-family: "Space Grotesk", system-ui;
  font-size: clamp(32px, 4vw, 54px);
  line-height:1.05;
  letter-spacing:-.8px;
}
.grad{
  background: linear-gradient(90deg, var(--accent), var(--accent2));
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
.lead{
  margin:0 0 18px;
  color:var(--muted);
  line-height:1.65;
  max-width: 70ch;
}
.cards{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap:14px;
}
.card{
  background: var(--paper);
  border:1px solid var(--line);
  border-radius: var(--radius);
  padding:16px;
  box-shadow: 0 10px 24px rgba(15,23,42,.06);
  transition: transform .18s ease, box-shadow .18s ease;
}
.card:hover{
  transform: translateY(-2px);
  box-shadow: 0 16px 34px rgba(15,23,42,.10);
}
.card h3{
  margin:0;
  font-family:"Space Grotesk", system-ui;
}
.card p{
  margin:8px 0 0;
  color:var(--muted);
  line-height:1.6;
  font-size: 13px;
}

.panel{
  background: var(--paper);
  border:1px solid var(--line);
  border-radius: 22px;
  box-shadow: var(--shadow);
  overflow:hidden;
}

.badge{
  font-weight:700;
  font-size:12px;
  padding:7px 10px;
  border-radius:999px;
  background: var(--paper);
  border:1px solid var(--line);
}

.row{
  display:flex; justify-content:space-between; gap:12px;
  padding:10px 0;
  border-bottom: 1px dashed rgba(15,23,42,.12);
}
.row:last-of-type{ border-bottom:none; }
.lbl{ color:var(--muted); font-weight:700; }
.val{ font-weight:700; }

.section{ padding: 56px 0; }

/* Stoklar / Projeler / Hakkımızda / İletişim / Yasal sayfalar: reduce gap between header and first section */
body.page--stoklar main > .section:first-child,
body.page--projeler main > .section:first-child,
body.page--hakkimizda main > .section:first-child,
body.page--iletisim main > .section:first-child,
body.page--legal main > .section:first-child,
body.page--listeler main > .section:first-child,
body.page-urun-detay #detailWrap > .section:first-child{
  padding-top: 10px;
}

/* Filtre panelleri: daha kompakt (kullanım bozulmadan) */
body.page--stoklar .filters--v2{ padding: 6px; }
body.page--stoklar .filters--v2 .easy{ gap: 8px; }
body.page--stoklar .chipsRow{ gap: 6px; }
body.page--stoklar .chipsGroup,
body.page--stoklar .advBox{ padding: 6px; }
body.page--stoklar .chips{ gap: 6px; }
body.page--stoklar .filters--v2 .input,
body.page--stoklar .filters--v2 .select,
body.page--stoklar .filters--v2 .btn{ padding: 8px 10px; } /* dokunma alanı koru */
body.page--stoklar .advanced{ margin-top: 8px; padding-top: 8px; }

body.page--projeler .filters{ padding: 6px; gap: 10px; }
body.page--projeler .filters__top{ gap: 8px; }
body.page--projeler .checks{ gap: 6px; }
body.page--projeler .chk{ padding: 8px 9px; }
body.page--projeler .filters__meta{ gap: 8px; }

body.page--listeler .docsToolbar,
body.page--belgeler .docsToolbar{ padding: 6px; gap: 8px; }
body.page--listeler .docsToolbar__row,
body.page--belgeler .docsToolbar__row{ gap: 8px; }
body.page--listeler .docsToolbar__row--bottom,
body.page--belgeler .docsToolbar__row--bottom{ gap: 10px; }
body.page--listeler .docsInput,
body.page--listeler .docsSelect,
body.page--belgeler .docsInput,
body.page--belgeler .docsSelect{ padding: 8px 10px; }
body.page--listeler .docsToggle,
body.page--belgeler .docsToggle{ padding: 0 10px; }

.loadMoreWrap{
  display: flex;
  justify-content: center;
  gap: 10px;
  margin-top: 20px;
}
.compatSearchWrap{
  margin-bottom: 16px;
}
.compatSearchWrap .input{
  width: 100%;
}
.compatShowAllBtn{
  background: transparent;
  border: 1px solid transparent;
  color: var(--accent, #255cff);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.compatShowAllBtn:hover{
  background: transparent;
  opacity: .8;
}

/* Uyumlu Ürünler / Benzer Ürünler / Kullanılan Projeler — ürün ya da proje
   sayısı 16'yı AŞMADIĞINDA (bkz. CARD_CAROUSEL_THRESHOLD, js/urun-detay.js)
   kullanılan yatay kaydırmalı kart şeridi (carousel). 16'dan fazla olduğunda
   (renderExpandable) aşağıya doğru "Daha Fazla Yükle" ile açılan eski dikey
   listeleme aynen kullanılmaya devam eder — bu blok o moddan etkilenmez.
   KB-60-01/LPYA-01 gibi "aranabilir/sınırsız" uyumlu ürün listesi kullanan
   ürünler (renderCompatibleSearchable) de bu carousel'den bağımsızdır,
   kendi arama+grid davranışlarını korur. */
.cardCarousel{
  position: relative;
  margin-top: 14px;
}
.products.density-24.cardCarousel__track,
.projectUseGrid.cardCarousel__track{
  margin-top: 0;
  display: flex;
  flex-wrap: nowrap;
  overflow-x: auto;
  scroll-behavior: smooth;
  scroll-snap-type: x mandatory;
  padding-bottom: 6px;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.cardCarousel__track::-webkit-scrollbar{ display:none; }
.cardCarousel__track > a{
  flex: 0 0 calc((100% - 14px * 3) / 4);
  min-width: 0;
  scroll-snap-align: start;
}
@media (max-width: 1100px){
  .cardCarousel__track > a{ flex-basis: calc((100% - 14px * 2) / 3); }
}
@media (max-width: 820px){
  .cardCarousel__track > a{ flex-basis: calc((100% - 14px * 1) / 2); }
}
@media (max-width: 560px){
  .cardCarousel__track > a{ flex-basis: 100%; }
}
.cardCarousel__nav{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 40px;
  height: 40px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: #fff;
  color: var(--ink);
  font-size: 18px;
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: 0 12px 24px rgba(15,23,42,.16);
  z-index: 6;
  transition: border-color .15s ease, color .15s ease, transform .15s ease;
}
.cardCarousel__nav:hover{
  border-color: var(--accent, #255cff);
  color: var(--accent, #255cff);
}
/* Masaüstünde oklar kart alanının TAMAMEN dışına (konteyner kenar boşluğuna)
   yerleştirilir — hiçbir kartın üzerine binmez. */
.cardCarousel__nav--prev{ left: -56px; }
.cardCarousel__nav--next{ right: -56px; }
.cardCarousel__nav[hidden]{ display:none; }
/* Konteyner kenar boşluğunun daralmaya başladığı orta genişliklerde oklar
   içeri çekilir ama yine de kart kenarının hemen dışında durur. */
@media (max-width: 1300px){
  .cardCarousel__nav--prev{ left: -16px; }
  .cardCarousel__nav--next{ right: -16px; }
}
/* Dar ekranlarda (tablet/mobil) kart alanının dışında yeterli boşluk
   kalmadığından oklar kart kenarına yaslanır (hafif üst üste binme burada
   kabul edilir — sadece masaüstünde binmemesi istendi). */
@media (max-width: 900px){
  .cardCarousel__nav{ width: 36px; height: 36px; font-size: 16px; }
  .cardCarousel__nav--prev{ left: 0; }
  .cardCarousel__nav--next{ right: 0; }
}

.head{ margin-bottom: 16px; }
.head h2{
  margin:0;
  font-family: "Space Grotesk", system-ui;
  font-size: 28px;
}
.head p{ margin:8px 0 0; color:var(--muted); max-width: 80ch; }

.grid{ display:grid; gap:14px; }
.grid--4{ grid-template-columns: repeat(4, 1fr); }
.grid--3{ grid-template-columns: repeat(3, 1fr); }
.grid--2{ grid-template-columns: repeat(2, 1fr); }

.tile{
  background: var(--paper);
  border:1px solid var(--line);
  border-radius: var(--radius);
  padding:16px;
  box-shadow: 0 10px 24px rgba(15,23,42,.06);
}
.tile h3{ margin:0; font-family:"Space Grotesk", system-ui; }
.tile p{ margin:8px 0 0; color:var(--muted); line-height:1.6; font-size: 13px; }
.pills{ display:flex; gap:8px; flex-wrap:wrap; margin-top: 12px; }
.pills span{
  font-size: 12px;
  padding: 7px 10px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: rgba(15,23,42,.02);
  color: var(--muted);
  font-weight: 600;
}

.footer{
  padding: 38px 0 16px;
  border-top:1px solid var(--line);
  background: rgba(255,255,255,.55);
}
.footer__grid{
  display:grid;
  grid-template-columns: 1fr 1fr 1fr 1.2fr;
  gap: 14px;
  align-items:start;
}
.footer h4{
  margin: 0 0 10px;
  font-family:"Space Grotesk", system-ui;
}
.footer ul{ list-style:none; margin:0; padding:0; display:grid; gap: 8px; }
.footer a{ color: var(--muted); font-weight:700; }
.footer a:hover{ color: var(--ink); }
.footer .muted{ color: var(--muted); }
.map{
  border-radius: 16px;
  overflow:hidden;
  border:1px solid var(--line);
  background: var(--paper);
  box-shadow: 0 10px 24px rgba(15,23,42,.06);
  height: 180px;
}
.map iframe{ width:100%; height:100%; border:0; }

/* İletişim: tek harita + adres kartı */
.mapGrid{
  display:grid;
  grid-template-columns: 1.2fr .8fr;
  gap: 14px;
  align-items: stretch;
}
.map.map--lg{ height: 360px; }
.addrCard{ display:flex; flex-direction:column; }

.btnRow{ margin-top: 12px; display:flex; gap: 10px; flex-wrap:wrap; }

@media (max-width: 980px) {
  .mapGrid{ grid-template-columns: 1fr; }
  .map.map--lg{ height: 320px; }
}
.footer__bottom{
  margin-top: 14px;
  padding-top: 12px;
  border-top:1px solid var(--line);
  display:flex;
  justify-content:space-between;
  gap:10px;
  flex-wrap:wrap;
  color: var(--muted);
  font-size: 13px;
}

@media (max-width: 980px) {
  
  .cards{ grid-template-columns: 1fr; }
  .grid--4{ grid-template-columns: repeat(2, 1fr); }
  .grid--3{ grid-template-columns: 1fr; }
  .grid--2{ grid-template-columns: 1fr; }
  
  .footer__grid{ grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
  .header__inner{ grid-template-columns: 1fr auto 1fr; }
  .header__right{ display:none; }
  .nav__btn{ display:block; }
  .nav__list{
    position:absolute;
    left:50%;
    transform: translateX(-50%);
    top: 54px;
    width: min(420px, 92vw);
    display:none;
    flex-direction:column;
    gap:6px;
    background: var(--paper);
    border:1px solid var(--line);
    border-radius: 16px;
    padding: 10px;
    box-shadow: var(--shadow);
  }
  .nav__list.is-open{ display:flex; }
  .grid--4{ grid-template-columns: 1fr; }
  
  .footer__grid{ grid-template-columns: 1fr; }
}

.filters{
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 22px;
  box-shadow: var(--shadow);
  padding: 14px;
  display:grid;
  gap: 12px;
}

.input, .select{
  background: rgba(15,23,42,.02);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 11px 12px;
  outline:none;
  font-weight: 700;
  color: var(--ink);
}
.input{ flex: 1 1 260px; }
.select{ flex: 0 0 240px; }
.input:focus, .select:focus{ border-color: rgba(37,92,255,.45); box-shadow: 0 0 0 4px rgba(37,92,255,.10); }

.checks{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.chk{
  display:flex;
  align-items:center;
  gap:8px;
  padding: 9px 10px;
  border: 1px solid var(--line);
  background: rgba(15,23,42,.02);
  border-radius: 999px;
  font-weight: 600;
  color: var(--muted);
  user-select:none;
}
.chk input{
  width:16px; height:16px;
  accent-color: var(--accent);
}
.filters__meta{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  justify-content:space-between;
  align-items:center;
  color: var(--muted);
  font-weight: 700;
  font-size: 13px;
}
.btn{
  cursor:pointer;
  border: 1px solid var(--line);
  background: var(--paper);
  border-radius: 999px;
  padding: 9px 12px;
  font-weight: 700;
}
/* .btn:hover burada tanımlıydı ama dosyada daha aşağıdaki (satır ~5100)
   ".btn:hover{ border-color: rgba(7,25,74,.26); background: rgba(7,25,74,.03); }"
   kuralı aynı özgüllükte olduğu için bunu her zaman eziyordu (hiçbir zaman
   görünmeyen ölü kod) — kaldırıldı, gerçek görünüm hiç değişmedi. */

.products{
  margin-top: 14px;
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}
.pcardSlot{
  position: relative;
  min-width: 0;
}
.pcardSlot .pcard{
  display:block;
  height:100%;
  color: inherit;
  text-decoration:none;
}
.comparePick{
  position:absolute;
  top: 10px;
  right: 10px;
  z-index: 4;
  width: 36px;
  height: 36px;
  border-radius: 999px;
  border: 1px solid rgba(15,23,42,.10);
  background: rgba(255,255,255,.94);
  color: var(--muted);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size: 18px;
  font-weight: 700;
  cursor:pointer;
  box-shadow: 0 12px 24px rgba(15,23,42,.12);
  transition: transform .16s ease, border-color .16s ease, background .16s ease, color .16s ease, box-shadow .16s ease;
}
.comparePick:hover{
  transform: translateY(-1px) scale(1.03);
  border-color: rgba(37,92,255,.28);
  box-shadow: 0 16px 28px rgba(37,92,255,.14);
}
.comparePick.is-active{
  background: linear-gradient(135deg, rgba(37,92,255,.98), rgba(0,194,255,.92));
  border-color: rgba(37,92,255,.94);
  color: #fff;
  box-shadow: 0 18px 32px rgba(37,92,255,.22);
}
/* ENEC ve TSE rozetleri artık birleşik tek kutu değil; TEDAŞ/Acil Kit'Li ikilisiyle
   aynı mantıkla birbirinden ayrı, aralarında küçük bir boşlukla yan yana duran iki
   ayrı kutu (konum/boyut satır içi stil ile sabitlenir, bu kurallar görsel referans
   ve olası inline-stilsiz kullanım için tutulur). */
.pcardEnecBadge,
.pcardTseBadge{
  position:absolute;
  top: 10px;
  z-index: 4;
  width: 36px;
  height: 36px;
  border-radius: 10px;
  border: 1px solid rgba(15,23,42,.10);
  background: rgba(255,255,255,.96);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 24px 24px;
  box-shadow: 0 12px 24px rgba(15,23,42,.12);
  pointer-events: none;
}
.pcardEnecBadge{ left: 10px; background-image: url('assets/img/badges/enec.webp'); }
.pcardTseBadge{ left: 52px; background-image: url('assets/img/badges/tse.webp'); }
.pcardTedasBadge{
  position:absolute;
  bottom: 10px;
  left: 10px;
  z-index: 4;
  height: 36px;
  border-radius: 10px;
  border: 1px solid rgba(15,23,42,.10);
  background: rgba(255,255,255,.96);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap: 4px;
  padding: 6px 7px;
  box-shadow: 0 12px 24px rgba(15,23,42,.12);
  pointer-events: none;
}
.pcardTedasBadge img{
  height: 100%;
  width: auto;
  max-width: 30px;
  object-fit: contain;
  display: block;
}
/* Stoklar sayfası "X / sayfa" yoğunluk sınıflarıyla (kart küçüldükçe) rozet de
   orantılı olarak küçülsün — diğer kart öğeleriyle aynı ölçek mantığı. */
body.page--stoklar .products.density-24 .pcardTedasBadge{
  bottom: 8px;
  left: 8px;
  height: 30px;
  gap: 3px;
  padding: 5px 6px;
  border-radius: 9px;
}
body.page--stoklar .products.density-24 .pcardTedasBadge img{ max-width: 26px; }
body.page--stoklar .products.density-50 .pcardTedasBadge{
  bottom: 7px;
  left: 7px;
  height: 26px;
  gap: 3px;
  padding: 4px 5px;
  border-radius: 8px;
}
body.page--stoklar .products.density-50 .pcardTedasBadge img{ max-width: 22px; }
body.page--stoklar .products.density-100 .pcardTedasBadge{
  bottom: 6px;
  left: 6px;
  height: 22px;
  gap: 2px;
  padding: 3px 4px;
  border-radius: 7px;
}
body.page--stoklar .products.density-100 .pcardTedasBadge img{ max-width: 18px; }
.pcardAcilBadge{
  position:absolute;
  bottom: 10px;
  left: 10px;
  z-index: 5;
  height: 36px;
  width: 36px;
  border-radius: 10px;
  border: 1px solid rgba(220,38,38,.28);
  background: rgba(255,255,255,.96);
  display:flex;
  flex-direction: column;
  align-items:center;
  justify-content:center;
  gap: 1px;
  box-shadow: 0 12px 24px rgba(15,23,42,.12);
  pointer-events: none;
  line-height: 1;
}
.pcardAcilBadge span{
  font-size: 11px;
  font-weight: 600;
  color: #dc2626;
  letter-spacing: .01em;
  text-align: center;
}
.pcardAtexBadge{
  position:absolute;
  bottom: 8px;
  right: 8px;
  z-index: 5;
  width: 30px;
  height: 30px;
  border-radius: 9px;
  border: 1px solid rgba(15,23,42,.10);
  background: rgba(255,255,255,.96);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 20px 20px;
  background-image: url('assets/img/badges/atex.webp');
  box-shadow: 0 12px 24px rgba(15,23,42,.12);
  pointer-events: none;
}
#compareBtn.is-ready{
  background: linear-gradient(90deg, rgba(37,92,255,.14), rgba(0,194,255,.10));
  border-color: rgba(37,92,255,.24);
  color: var(--ink);
  box-shadow: 0 10px 22px rgba(37,92,255,.08);
}
body.is-compare-open{ overflow:hidden; }
.compareSheet{
  --compare-first-col: 160px;
  --compare-col-min: 190px;
  --compare-head-image: 168px;
  --compare-cell-pad-x: 12px;
  --compare-cell-pad-y: 10px;
  position: fixed;
  inset: 0;
  z-index: 80;
}
.compareSheet[hidden]{
  display:none !important;
}
.compareSheet__backdrop{
  position:absolute;
  inset:0;
  background: rgba(2,6,23,.52);
  backdrop-filter: blur(5px);
}
.compareSheet__panel{
  position: relative;
  z-index: 1;
  width: min(1420px, calc(100vw - 12px));
  max-height: min(92vh, 980px);
  margin: max(8px, 2vh) auto;
  display:grid;
  grid-template-rows: auto 1fr;
  background: var(--paper);
  border: 1px solid rgba(15,23,42,.08);
  border-radius: 20px;
  box-shadow: 0 20px 44px rgba(15,23,42,.16);
  overflow:hidden;
}
.compareSheet__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 12px;
  padding: 16px 20px;
  border-bottom: 1px solid rgba(15,23,42,.08);
  background: var(--paper);
}
.compareSheet__head h3{
  margin:0;
  font-size: 20px;
}
.compareSheet__actions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
.compareDiffBtn.is-active{
  background: rgba(37,92,255,.12);
  border-color: rgba(37,92,255,.24);
  color: var(--ink);
}
.compareSheet__body{
  padding: 12px 16px 16px;
  overflow:auto;
}
.compareSummary{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  margin-bottom: 14px;
}
.compareSummary__stat,
.compareSummary__hint{
  display:inline-flex;
  align-items:center;
  min-height: 34px;
  padding: 8px 12px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
  border: 1px solid rgba(15,23,42,.08);
  background: rgba(255,255,255,.72);
}
.compareSummary__stat--accent{
  color: var(--accent);
  background: rgba(37,92,255,.08);
  border-color: rgba(37,92,255,.18);
}
.compareSummary__hint{
  color: var(--muted);
}
.compareEmpty{
  border:1px dashed rgba(15,23,42,.14);
  border-radius: 20px;
  background: rgba(15,23,42,.03);
  padding: 18px;
  color: var(--muted);
  font-weight: 600;
}
.compareTableFrame{
  border: 1px solid rgba(15,23,42,.08);
  border-radius: 18px;
  background: var(--paper);
  padding: 4px;
  overflow: hidden;
}
.compareTableWrap{
  overflow:auto;
  overscroll-behavior-x: contain;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 4px;
  max-height: min(64vh, 640px);
  border-radius: 18px;
}
.compareTable{
  width:max-content;
  min-width: 100%;
  border-collapse: separate;
  border-spacing:0;
}
/* Sütun genişlikleri <colgroup> üzerinden verilir; table-layout:fixed
   olmadan tarayıcı bu genişlikleri yalnızca bir "öneri" olarak alır ve
   sütunlar içerik uzunluğuna göre kayar — bu da ürün başlıkları ile alt
   satırlardaki hücrelerin birbiriyle hizasız görünmesine yol açar. Sabit
   düzen, her sütunun tüm satırlar boyunca aynı genişlikte kalmasını garanti
   eder (bkz. renderCompareSheet() içindeki --compare-first-col / --compare-col-width).
*/
.compareTable.compareTable--fixed{
  table-layout: fixed;
}
.compareTable.compareTable--fixed .compareCol--label{
  width: var(--compare-first-col);
}
.compareTable.compareTable--fixed .compareCol--product{
  width: var(--compare-col-width, var(--compare-col-min));
}
.compareTable th,
.compareTable td{
  padding: var(--compare-cell-pad-y) var(--compare-cell-pad-x);
  border-bottom: 1px solid rgba(15,23,42,.06);
  vertical-align: middle;
}
.compareTable th:first-child,
.compareTable td:first-child{
  min-width: var(--compare-first-col);
  max-width: var(--compare-first-col);
}
/* NOT: Başlık satırını (dikey) veya "Özellik" sütununu (yatay) sabitlemek
   (position:sticky), altındaki/yanındaki ürün kartlarının veya değerlerin
   kaydırma sırasında sabit hücrenin arkasında kalıp kesilmiş/üst üste binmiş
   görünmesine yol açıyordu. Bu yüzden karşılaştırma tablosunda hiçbir satır
   veya sütun sabitlenmiyor; tablo normal şekilde kayar, hiçbir öğe bir
   diğerinin üstüne binmez. */
.compareTable thead th{
  background: rgba(255,255,255,.98);
  box-shadow: inset 0 -1px 0 rgba(15,23,42,.06);
}
.compareTable tbody th{
  text-align:left;
  font-size: 13px;
  color: var(--muted);
  font-weight: 600;
}
.compareRow--diff th,
.compareRow--diff td{
  background: rgba(37,92,255,.03);
}
.compareRow--diff th:first-child,
.compareRow--diff td:first-child{
  background: rgba(37,92,255,.06);
}
/* Çok satırlı karşılaştırma tablosunda satırları göz için ayırt etmek üzere
   ince zebra deseni ve satır üzerine gelince (hover) hafif vurgu. */
.compareTable tbody tr:nth-child(even):not(.compareRow--diff) th,
.compareTable tbody tr:nth-child(even):not(.compareRow--diff) td{
  background: rgba(15,23,42,.016);
}
.compareTable tbody tr:hover th,
.compareTable tbody tr:hover td{
  background: rgba(37,92,255,.05);
}
.compareTable tbody tr:hover th:first-child,
.compareTable tbody tr:hover td:first-child{
  background: rgba(37,92,255,.09);
}
.compareDelta{
  display:inline-flex;
  align-items:center;
  margin-left: 8px;
  padding: 3px 8px;
  border-radius: 999px;
  background: rgba(37,92,255,.10);
  color: var(--accent);
  font-size: 11px;
  font-weight: 700;
}
.compareHeadCard{
  position: relative;
  display:grid;
  gap:8px;
  justify-items: center;
  text-align: center;
  min-width: var(--compare-col-min);
  padding: 10px;
  border-radius: 18px;
  border: 1px solid rgba(15,23,42,.08);
  background: var(--paper);
}
.compareHeadCard img{
  width: 100%;
  height: var(--compare-head-image);
  object-fit: contain;
  border-radius: 14px;
  padding: 10px;
  border: 1px solid rgba(15,23,42,.07);
  background: #fbfbfc;
}
.compareHeadCard strong{
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  width: 100%;
  min-height: 2.6em;
  line-height: 1.3;
  font-size: 13px;
}
.compareHeadCard span{
  display: block;
  width: 100%;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}
.compareHeadMeta{
  display:flex;
  gap:6px;
  flex-wrap:wrap;
  justify-content:center;
}
.compareQuickStats{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  justify-content:center;
}
.compareQuickStats span{
  display:inline-flex;
  align-items:center;
  min-height: 26px;
  padding: 4px 9px;
  border-radius: 999px;
  border: 1px solid rgba(15,23,42,.08);
  background: transparent;
  color: var(--ink);
  font-size: 11px;
  font-weight: 600;
}

.compareRemove{
  position:absolute;
  top: 18px;
  right: 18px;
  width: 30px;
  height: 30px;
  border-radius: 999px;
  border: 1px solid rgba(15,23,42,.10);
  background: rgba(255,255,255,.94);
  font-size: 18px;
  line-height: 1;
  cursor:pointer;
}
.compareRemove:hover{
  border-color: rgba(220,38,38,.20);
}
.compareCell{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  gap:4px;
  min-width: var(--compare-col-min);
  min-height: 100%;
  font-weight: 700;
  font-size: 13px;
  line-height: 1.45;
  word-break: break-word;
  padding: 9px 10px;
  border-radius: 12px;
  border: 1px solid transparent;
  background: transparent;
}
.compareCell--diff{
  border-color: rgba(37,92,255,.14);
  background: rgba(37,92,255,.05);
}
.compareCell .miniTag{
  margin: 0 6px 6px 0;
}
.compareCell__inline{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}
@media (max-width: 700px) {
  .compareSheet__panel{
    width: calc(100vw - 8px);
    max-height: 94vh;
    margin: 1vh auto;
    border-radius: 18px;
  }
  .compareSheet__head,
  .compareSheet__body{
    padding-left: 12px;
    padding-right: 12px;
  }
  .compareSheet__head h3{
    font-size: 18px;
  }
  .compareTable th,
  .compareTable td{
    padding: 10px 12px;
  }
  .compareCell,
  .compareHeadCard{
    min-width: 180px;
  }
}

.pcard{
  position: relative;
  background: var(--paper);
  border:1px solid var(--line);
  border-radius: var(--radius);
  overflow:hidden;
  box-shadow: 0 10px 24px rgba(15,23,42,.06);
  transition: transform .18s ease, box-shadow .18s ease;
}
.pcard:hover{ transform: translateY(-2px); box-shadow: 0 16px 34px rgba(15,23,42,.10); }
.pcard__title{
  margin:0;
  font-family:"Space Grotesk", system-ui;
  font-size: 18px;
}

.detail{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  align-items:start;
}
.detail__media{
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 22px;
  box-shadow: var(--shadow);
  padding: 18px;
  display:flex;
  align-items:center;
  justify-content:center;
  min-height: 380px;
  background:
    radial-gradient(700px 320px at 10% 0%, rgba(37,92,255,.10), transparent 60%),
    radial-gradient(700px 320px at 90% 0%, rgba(0,194,255,.10), transparent 60%),
    var(--paper);
}
/* Ana galeri görseli (#mainImg): sabit yükseklikteki .gallery__main
   kutusunu genişlik ve yükseklik olarak %100 doldurur, object-fit:contain
   ile oranı bozulmadan sığdırılır. Böylece galeri görselleri değiştikçe
   (örn. yatay bir görselden dikey bir görsele geçildiğinde) kutu boyu
   zıplamaz — her zaman aynı yükseklikte kalır. Küçük resimler (thumbs)
   ayrı bir seçiciyle (.gallery__thumb img) yönetiliyor, bu kural onları
   etkilemez. */
.gallery__main img{
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  filter: drop-shadow(0 14px 24px rgba(15,23,42,.12));
}

/* Ürün Detayı – görsel galeri */
.gallery{
  width:100%;
  display:grid;
  gap:12px;
}
.gallery__main{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  height:360px;
}
.gallery__nav{
  position:absolute;
  top:50%;
  /* .gallery__main is a flex container, so flex items paint in DOM order
     regardless of position — without this, the main image (which sits
     after .gallery__prev in the markup) visually covers the prev button
     and blocks clicks on it. */
  z-index:2;
  transform: translateY(-50%);
  width:44px;
  height:44px;
  border-radius:999px;
  border:1px solid var(--line);
  background: rgba(255,255,255,.82);
  backdrop-filter: blur(6px);
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:22px;
  line-height:1;
  box-shadow: 0 10px 22px rgba(15,23,42,.10);
}
.gallery__nav:hover{ background: rgba(255,255,255,.95); }
.gallery__prev{ left:8px; }
.gallery__next{ right:8px; }

.gallery__thumbs{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  justify-content:center;
  align-items:center;
}
.gallery__thumb{
  width:68px;
  height:54px;
  border-radius:14px;
  border:1px solid var(--line);
  background: rgba(15,23,42,.02);
  padding:0;
  overflow:hidden;
  cursor:pointer;
}
.gallery__thumb img{
  width:100%;
  height:100%;
  max-width:none;
  max-height:none;
  object-fit:cover;
  display:block;
  filter:none;
}
.gallery__thumb.is-active{
  outline: 2px solid rgba(37,92,255,.35);
  border-color: rgba(37,92,255,.35);
}

.gallery__meta{
  display:flex;
  justify-content:center;
  color: var(--muted);
  font-size: 12px;
}
.detail__box{
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 22px;
  box-shadow: var(--shadow);
  padding: 18px;
}
/* Ürün adı/açıklama/etiketler artık galerinin altında (sol sütunda) ayrı bir
   kart olarak duruyor; böylece galeri kısa kaldığında altında boş yer
   kalmıyor ve sağ sütun en üstten "Ürün Bilgileri" ile başlıyor. */
.detail__titleBox{
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 22px;
  box-shadow: var(--shadow);
  padding: 18px;
  margin-top: 14px;
}
.detail__box h1,
.detail__titleBox h1{
  margin:0;
  font-family:"Space Grotesk", system-ui;
  font-size: 24px;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: normal;
}
.detail__sub{
  margin-top: 10px;
  color: var(--muted);
  line-height: 1.7;
}
.detail__brandCode{
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 9px;
  font-family: "Space Grotesk", system-ui;
}
.detail__brandCode__brand{
  font-weight: 700;
  font-size: 15px;
  color: var(--accent);
  text-transform: uppercase;
  letter-spacing: .05em;
}
.detail__brandCode__sep{
  width: 4px;
  height: 4px;
  border-radius: 999px;
  background: var(--line);
  flex: 0 0 auto;
}
.detail__brandCode__code{
  font-weight: 600;
  font-size: 15px;
  color: var(--ink);
  letter-spacing: .02em;
}
/* Ürün Detayı – aksiyon/badge satırları */
.detail__actions,
.detail__badges{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
  margin-bottom:10px;
}

.page-urun-detay #detailWrap .head{
  text-align:center;
}
.page-urun-detay #detailWrap .head p{
  margin-left:auto;
  margin-right:auto;
}
.page-urun-detay .detail{
  max-width: 1180px;
  margin-left:auto;
  margin-right:auto;
}
.productToolbar{
  display:flex;
  align-items:center;
  gap:16px;
  flex-wrap:wrap;
  margin:14px 0 20px;
}
.productToolbar__left,
.productToolbar__right{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}
.productToolbar__title{
  display:flex;
  flex-direction:column;
  gap:1px;
  min-width:0;
}
.productToolbar__titleMain{
  font-family:'Space Grotesk', system-ui;
  font-size:17px;
  font-weight:600;
  color:var(--ink);
  line-height:1.2;
}
.productToolbar__titleSub{
  font-size:12px;
  font-weight:700;
  color:var(--muted);
  line-height:1.2;
}
.productToolbar__badges{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}
.productToolbar__right{
  justify-content:flex-end;
  margin-left:auto;
}
.detail__copyBtn{ order:1; }
.detail__mfgBtn{ order:2; }
/* Proje Detayı: tüm toolbar tek satırda — sol/başlık/aksiyonlar soldan sağa;
   adres artık sadece "Haritada Aç" butonu olarak aksiyonlar satırında yer alıyor.
   4 buton aynı görünümde (plain .btn.btn--sm); sadece sırası ayarlanıyor:
   Proje PDF Özeti - Kullanılan Ürünler - Linki Kopyala - Haritada Aç */
.page--proje-detay .productToolbar__right .detail__pdfBtn{ order:1; }
.page--proje-detay .productToolbar__right #viewUsedProductsBtn{ order:2; }
.page--proje-detay .productToolbar__right .detail__copyBtn{ order:3; }
.page--proje-detay .productToolbar__right .projectAddressLine__link{
  order:4;
  /* diğer 3 buton ile aynı stil (pill .btn görünümü); özel adres renklendirmesi kaldırıldı */
  font-size:13px;
  font-weight:700;
  padding:8px 10px;
  border-radius:999px;
  background:var(--paper);
  border:1px solid var(--line);
  color:inherit;
  white-space:nowrap;
}
.page--proje-detay .productToolbar__right .projectAddressLine__link:hover{
  border-color: rgba(37,92,255,.35);
}
@media (max-width: 640px) {
  .productToolbar{
    flex-direction:column;
    align-items:stretch;
    gap:10px;
  }
  .productToolbar__left .btn,
  .productToolbar__right{
    width:100%;
  }
  .productToolbar__right{
    justify-content:flex-start;
    margin-left:0;
  }
  .productToolbar__right .btn{
    flex:1 1 auto;
    justify-content:center;
  }
  .productToolbar__title,
  .productToolbar__badges{
    order:0;
    width:100%;
  }
}
/* Proje detay sayfası: mobilde "Proje PDF Özeti / Kullanılan Ürünler /
   Linki Kopyala / Haritada Aç" butonları uzun Türkçe etiketler yüzünden
   satır başına tek buton sığıp alt alta 3-4 ayrı tam-genişlik satır
   oluşturuyor, görseli görmeden önce hatırı sayılır bir kaydırma
   gerektiriyordu. Sadece bu sayfada (diğer sayfaların toolbar'ını
   etkilemeden) 2 sütunlu bir ızgaraya alınarak dikey yer kazanılır. */
@media (max-width: 640px) {
  .page--proje-detay .productToolbar__right{
    display:grid;
    grid-template-columns: repeat(2, 1fr);
    gap:8px;
  }
  .page--proje-detay .productToolbar__right .btn{
    width:100%;
    flex:none;
    white-space:normal;
    text-align:center;
  }
}
.specs{
  margin-top: 14px;
  display:grid;
  gap: 10px;
}
.spec{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap: 14px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: rgba(15,23,42,.02);
}
.spec b{ font-weight: 700; }
.spec span{ color: var(--muted); font-weight: 600; }
.spec span.spec__value--blurred{
  filter: blur(5px);
  -webkit-filter: blur(5px);
  user-select: none;
  cursor: default;
  pointer-events: none;
}
.spec--blurred{ position: relative; }
.spec--blurred .spec__hint{
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 11px;
  font-weight: 600;
  color: var(--muted);
  background: rgba(15,23,42,.06);
  border-radius: 999px;
  padding: 3px 9px;
  white-space: nowrap;
}
.spec__label{
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
}
.spec__icon{
  display:inline-flex;
  flex:0 0 18px;
  width:18px;
  height:18px;
  color: var(--accent);
}
.spec__icon svg{ width:100%; height:100%; }

@media (max-width: 980px) {
  .products{ grid-template-columns: repeat(2, 1fr); }
  .detail{ grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .products{ grid-template-columns: 1fr; }
  .select{ flex: 1 1 200px; }
}

.chips{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.chip{
  display:inline-flex;
  align-items:center;
  gap:10px;
  border: 1px solid var(--line);
  background: rgba(37,92,255,.06);
  color: var(--ink);
  border-radius: 999px;
  padding: 8px 10px;
  cursor:pointer;
  font-weight: 600;
}

.thumb{
  border: 1px solid var(--line);
  background: rgba(15,23,42,.02);
  border-radius: 14px;
  padding: 6px;
  cursor:pointer;
}
.thumb img{
  width: 86px;
  height: 66px;
  object-fit: cover;
  border-radius: 10px;
  display:block;
}
.thumb.is-active{
  border-color: rgba(37,92,255,.55);
  box-shadow: 0 0 0 4px rgba(37,92,255,.10);
}

.viewbar{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  margin-top: 12px;
}
.seg{
  display:flex;
  gap:8px;
  background: var(--paper);
  border:1px solid var(--line);
  border-radius: 999px;
  padding: 6px;
  box-shadow: 0 10px 24px rgba(15,23,42,.06);
}
.seg button{
  border:0;
  background: transparent;
  padding: 9px 12px;
  border-radius: 999px;
  font-weight: 700;
  color: var(--muted);
  cursor:pointer;
}
.seg button.is-active{
  background: linear-gradient(90deg, rgba(37,92,255,.10), rgba(0,194,255,.10));
  color: var(--ink);
  border: 1px solid rgba(37,92,255,.18);
}

.badge{
  display:inline-flex;
  align-items:center;
  gap: 8px;
  font-weight: 700;
  font-size: 12px;
  padding: 7px 10px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: rgba(15,23,42,.02);
  color: var(--muted);
}
.badge i{
  width:8px; height:8px; border-radius:50%;
  background: rgba(15,23,42,.18);
  display:inline-block;
}
.badge--out{ border-color: rgba(220,38,38,.25); background: rgba(220,38,38,.06); color: #991b1b; }
.badge--out i{ background: rgba(220,38,38,.75); }
.badge--low{ border-color: rgba(245,158,11,.25); background: rgba(245,158,11,.08); color: #92400e; }
.badge--low i{ background: rgba(245,158,11,.75); }
.badge--mid{ border-color: rgba(59,130,246,.25); background: rgba(59,130,246,.08); color: #1e40af; }
.badge--mid i{ background: rgba(59,130,246,.75); }
.badge--high{ border-color: rgba(16,185,129,.25); background: rgba(16,185,129,.08); color: #065f46; }
.badge--high i{ background: rgba(16,185,129,.75); }

.metaLine{
  margin-top: 10px;
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.miniTag{
  font-size: 12px;
  font-weight: 700;
  color: var(--muted);
  padding: 7px 10px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: rgba(15,23,42,.02);
}

/* Stok sayfası: Güncelleme & termin etiketleri */

.docLine{ margin-top: 8px; display:flex; flex-wrap:wrap; gap:8px; }

.miniTag--info{ background: rgba(59,130,246,.08); border-color: rgba(59,130,246,.22); color: #1e40af; }

.miniTag--ok{ background: rgba(16,185,129,.10); border-color: rgba(16,185,129,.25); color: #065f46; }

/* Ürün detay sayfası: "Sipariş Üzerine Ürettirilir" — stok kartlarındaki
   kırmızı rozetle aynı renk, üst araç çubuğunda diğer miniTag'lerle
   birlikte ama dolgun kırmızı zeminle ayrışıyor. */
.miniTag--siparis{ background:#e11d2e; border-color:#e11d2e; color:#fff; font-weight: 700; }

.products.is-list .stockMetaLine{ grid-column: 1 / 2; }

.products.is-list{
  grid-template-columns: 1fr;
}
.products.is-list .pcardSlot{
  width: 100%;
}
.products.is-list .pcard{
  display:grid;
  grid-template-columns: 180px 1fr;
  align-items:stretch;
}
.products.is-list .pcard__img{ height: 100%; min-height: 150px; }
.products.is-list .pcard__body{
  display:grid;
  grid-template-columns: 1fr auto;
  gap: 10px 14px;
  align-content:start;
}
.products.is-list .pcard__title{ grid-column: 1 / 2; }
.products.is-list .pcard__desc{ grid-column: 1 / 2; }
.products.is-list .metaLine{ grid-column: 1 / 3; }
@media (max-width: 700px) {
  .products.is-list .pcard{ grid-template-columns: 1fr; }
  .products.is-list .pcard__body{ grid-template-columns: 1fr; }
}

.chips{display:flex; gap:8px; flex-wrap:wrap; margin: 12px 0;}

.acc{
  border: 1px solid var(--line);
  border-radius: 16px;
  background: rgba(15,23,42,.02);
  overflow:hidden;
}
.acc > summary{
  list-style:none;
  cursor:pointer;
  padding: 12px 14px;
  font-weight: 700;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.acc > summary::-webkit-details-marker{ display:none; }
.acc > summary:after{
  content:"+";
  font-weight: 700;
  color: var(--muted);
}
.acc[open] > summary:after{ content:"–"; }
.acc__body{
  padding: 0 14px 14px;
  color: var(--muted);
  line-height: 1.7;
}
.acc__body p{ margin: 10px 0 0; }

.acc__summaryRow{
  flex: 1;
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
}
.acc__summaryTitle{
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}
.acc__summaryNote{
  font-size: 12px;
  font-weight: 600;
  color: #c0304a;
}
.acc__summaryNote a{
  color: #c0304a;
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.acc__summaryCta{
  flex-shrink: 0;
  text-decoration: none;
}
@media (max-width: 640px){
  .acc__summaryRow{ flex-wrap: wrap; }
  .acc__summaryNote{ width: 100%; }
}

@media (max-width: 980px) {
  .tile .products{ grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 640px) {
  .tile .products{ grid-template-columns: 1fr !important; }
}

.step{
  display:flex; gap: 12px; align-items:flex-start;
  border: 1px solid var(--line); border-radius: 18px; padding: 12px;
  background: rgba(255,255,255,.55);
}

@keyframes sevay-marquee{
  from{ transform: translateX(0); }
  to{ transform: translateX(-50%); }
}

.btn--sm{ padding: 8px 10px; font-size: 13px; font-weight: 700; }

@media (max-width: 980px) {
  
  
  
  
  .ctaBar .btn{ width:auto; }
  .ctaBar .btn--primary{ white-space: nowrap; }
}

.btn--primary{
  box-shadow: 0 10px 24px rgba(15,23,42,.10);
}

.products.density-24{
  grid-template-columns: repeat(4, 1fr);
}
.products.density-50{
  grid-template-columns: repeat(5, 1fr);
}
.products.density-100{
  grid-template-columns: repeat(6, 1fr);
}
.products.density-24 .pcard__img{ height: 140px; }
.products.density-50 .pcard__img{ height: 120px; }
.products.density-100 .pcard__img{ height: 110px; }

.products.density-24 .pcard__body,
.products.density-50 .pcard__body{
  padding: 12px;
}
.products.density-100 .pcard__body{ padding: 10px; }
.products.density-24 .pcard__title{ font-size: 15px; }
.products.density-50 .pcard__title{ font-size: 14px; }
.products.density-100 .pcard__title{ font-size: 13px; }

.products.density-24 .pcard__desc,
.products.density-50 .pcard__desc{
  font-size: 13px;
  margin-top: 8px;
}
.products.density-100 .pcard__desc{
  font-size: 12px;
  margin-top: 7px;
}
.products.density-24 .crit__b,
.products.density-50 .crit__b{
  font-size: 12px;
  padding: 6px 8px;
  border-radius: 10px;
}
.products.density-100 .crit__b{
  font-size: 11px;
  padding: 5px 7px;
  border-radius: 10px;
}
.products.density-24 .badge,
.products.density-50 .badge{
  transform: scale(.95);
  transform-origin: left top;
}
.products.density-100 .badge{
  transform: scale(.9);
  transform-origin: left top;
}

@media (max-width: 1100px) {
  .products.density-24{ grid-template-columns: repeat(3, 1fr); }
  .products.density-50{ grid-template-columns: repeat(3, 1fr); }
  .products.density-100{ grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 820px) {
  .products.density-24{ grid-template-columns: repeat(2, 1fr); }
  .products.density-50{ grid-template-columns: repeat(2, 1fr); }
  .products.density-100{ grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 560px) {
  .products.density-24, .products.density-50, .products.density-100{ grid-template-columns: 1fr; }
}

.filters--v2{  padding: 12px;
  border-radius: 22px;
}
.filters--v2 .easy{ display:grid; gap: 12px; }

.chips{ display:flex; gap: 10px; flex-wrap:wrap; }
.chip{
  border: 1px solid var(--line);
  background: rgba(15,23,42,.02);
  padding: 10px 12px;
  border-radius: 999px;
  font-weight: 700;
  cursor:pointer;
  transition: transform .12s ease, background .12s ease, border-color .12s ease;
}
.chip:hover{ transform: translateY(-1px); background: rgba(59,130,246,.08); border-color: rgba(59,130,246,.30); }
.chip.is-active{ background: rgba(16,185,129,.12); border-color: rgba(16,185,129,.35); }

.chips--small .chip{ padding: 8px 10px; font-size: 13px; }

.advanced{
  margin-top: 12px;
  border-top: 1px solid var(--line);
  padding-top: 12px;
}

.rangeRow{ display:grid; gap: 8px; }
.rangeRow--inputs{
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 8px;
}
.rangeRow__sep{
  color: var(--muted, #64748b);
  font-weight: 700;
}
.rangeNum{
  width: 100%;
  min-width: 0;
  text-align: center;
}
.rangeNum::-webkit-outer-spin-button,
.rangeNum::-webkit-inner-spin-button{
  -webkit-appearance: none;
  margin: 0;
}
.rangeNum[type="number"]{
  -moz-appearance: textfield;
}
.rangeMeta{ display:flex; gap: 10px; align-items:center; justify-content: space-between; margin-top: 8px; }

.grid--5{
  display:grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 12px;
}
@media (max-width: 980px) {
  
  .grid--5{ grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 520px) {
  .grid--5{ grid-template-columns: 1fr; }
}

.thumb{
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 6px;
  background: rgba(15,23,42,.02);
  cursor:pointer;
  transition: transform .12s ease, border-color .12s ease, background .12s ease;
}
.thumb:hover{ transform: translateY(-1px); border-color: rgba(59,130,246,.30); background: rgba(59,130,246,.06); }
.thumb.is-active{ border-color: rgba(16,185,129,.35); background: rgba(16,185,129,.08); }
.thumb img{ width: 64px; height: 64px; object-fit: cover; border-radius: 10px; display:block; }

.lightbox{
  position: fixed;
  inset: 0;
  background: rgba(15,23,42,.80);
  display:none;
  align-items:center;
  justify-content:center;
  padding: 18px;
  z-index: 9999;
}
.lightbox.is-open{ display:flex; }

.lightbox__stage{
  width: min(1400px, 96vw);
  height: 88vh;
  border-radius: 18px;
  box-shadow: 0 24px 64px rgba(0,0,0,.35);
  background: #fff;
  overflow:hidden;
  position: relative;
}

.lightbox__img{
  position:absolute;
  top:0;
  left:0;
  max-width: none;
  max-height: none;
  border-radius: 0;
  box-shadow: none;
  background: transparent;
  transform-origin: 0 0;
  user-select: none;
  -webkit-user-drag: none;
}

.lightbox__hint{
  position:absolute;
  left: 50%;
  bottom: 14px;
  transform: translateX(-50%);
  color:#fff;
  font-size: 12px;
  font-weight: 700;
  padding: 8px 10px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.22);
  background: rgba(255,255,255,.10);
  backdrop-filter: blur(6px);
}

.lightbox__close{
  position:absolute;
  top: 16px;
  right: 16px;
  width: 42px;
  height: 42px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.25);
  background: rgba(255,255,255,.12);
  color: #fff;
  font-weight: 700;
  cursor:pointer;
}

.lightbox__nav{
  position:absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 48px;
  height: 48px;
  border-radius: 16px;
  border: 1px solid rgba(15,23,42,.14);
  background: rgba(255,255,255,.90);
  color: #0f172a;
  font-size: 26px;
  font-weight: 700;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  box-shadow: 0 16px 40px rgba(0,0,0,.20);
  backdrop-filter: blur(6px);
}
.lightbox__nav:hover{ transform: translateY(-50%) scale(1.03); }
.lightbox__prev{ left: 14px; }
.lightbox__next{ right: 14px; }

@media (max-width: 520px) {
  .lightbox__nav{ width: 42px; height: 42px; border-radius: 14px; font-size: 24px; }
  .lightbox__prev{ left: 10px; }
  .lightbox__next{ right: 10px; }
}

.filters--v2{ padding: 12px; }
.filters--v2 .input{ padding: 10px 12px; }

.chip{ padding: 8px 10px; font-size: 13px; }
.easyBar .chk span{ font-size: 13px; }

.select{ padding: 10px 12px; }
.filters--v2 .btn{ padding: 10px 12px; }

.filters--v2{
  padding: 10px;
}
.filters--v2 .chipsGroup,
.filters--v2 .advBox{
  padding: 10px;
}
.filters--v2 .chip{
  padding: 7px 9px;
  font-size: 12px;
}
.filters--v2 .input{ padding: 9px 11px; }
.filters--v2 .btn{ padding: 9px 11px; }
.filters--v2 .select{ padding: 9px 11px; }

.advanced{
  max-height: 340px;
  overflow: auto;
  border-radius: 16px;
}

.rangeMeta{ margin-top: 6px; }
.rangeRow{ gap: 6px; }

.checks--compact{
  display:flex;
  gap: 10px;
  flex-wrap: wrap;
}
.checks--compact .chk{
  margin: 0;
  padding: 0;
}
.checks--compact input[type="checkbox"]{
  transform: scale(.95);
}

:root{
  --soft: rgba(15,23,42,.04);
  --soft2: rgba(15,23,42,.02);
}
.filters--v2{
  background: rgba(255,255,255,.72);
  box-shadow: 0 10px 28px rgba(15,23,42,.06);
  backdrop-filter: blur(8px);
}
.filters--v2 .chipsGroup,
.filters--v2 .advBox{
  background: rgba(255,255,255,.78);
  box-shadow: 0 6px 18px rgba(15,23,42,.05);
}
.filters--v2 .input{
  border-radius: 16px;
  background: rgba(255,255,255,.9);
}
.filters--v2 .select{
  border-radius: 14px;
  background: rgba(255,255,255,.9);
}
.filters--v2 .btn{
  border-radius: 14px;
}
.chip{
  background: var(--soft2);
}
.chip.is-active{
  box-shadow: 0 8px 20px rgba(16,185,129,.10);
}

.advanced{
  scrollbar-gutter: stable;
}
.advanced::-webkit-scrollbar{ width: 10px; }
.advanced::-webkit-scrollbar-thumb{
  background: rgba(15,23,42,.12);
  border-radius: 999px;
  border: 3px solid rgba(255,255,255,.6);
}
.advanced::-webkit-scrollbar-track{ background: rgba(255,255,255,.35); border-radius: 999px; }

.pcard{
  border-radius: 22px;
  overflow: hidden;
  box-shadow: 0 10px 26px rgba(15,23,42,.08);
  transition: transform .14s ease, box-shadow .14s ease, border-color .14s ease;
}
.pcard:hover{
  transform: translateY(-2px);
  box-shadow: 0 16px 36px rgba(15,23,42,.12);
}

/* Sipariş'te (yolda) olan ürünleri kartta hafifçe belirginleştir */
.pcard__img{
  background: linear-gradient(180deg, rgba(15,23,42,.02), rgba(15,23,42,.00));
}
.pcard__img img{
  transform: scale(1.01);
  transition: transform .20s ease;
}
.pcard:hover .pcard__img img{ transform: scale(1.04); }

.viewbar{
  position: static;
  top: 14px;
  z-index: 10;
  background: rgba(255,255,255,.70);
  backdrop-filter: blur(10px);
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 8px 10px;
  box-shadow: 0 10px 26px rgba(15,23,42,.06);
}

.badge{ border-radius: 999px; }

#viewList:disabled{ opacity: .5; pointer-events:none; }

.select option:disabled{ color: rgba(15,23,42,.35); }

#sort{ min-width: 240px; }
@media (max-width: 560px) {
  #sort{ min-width: 100%; }
}

.filters--v2{
  position: static;
  top: 14px;
  z-index: 11;
}
@media (max-width: 980px) {
  .filters--v2{ position: static; }
}

.docGrid{ display:grid; gap:10px; margin-top:12px; }

.pcard--flat .pcard__body{ padding: 16px; }

.head h2{ font-size: 34px; letter-spacing: -0.02em; }
@media (max-width: 560px) { .head h2{ font-size: 28px; } }
.card{ border-radius: 22px; }
/* .btn{ font-weight: 700; } burada tekrar tanımlıydı; satır ~526'daki
   .btn zaten font-weight:700 veriyor, bu tam bir tekrardı (aynı değer) —
   kaldırıldı, hiçbir görsel etkisi yok. */

.miniTag--accent{
  background: rgba(59,130,246,.10);
  border-color: rgba(59,130,246,.22);
  font-weight: 700;
}
.btn--ghost{
  background: rgba(15,23,42,.03);
}

.highlights{ display:flex; gap:10px; flex-wrap:wrap; margin-top: 12px; }

.docCard.is-disabled{ opacity: .6; cursor: not-allowed; }

.brandLogo{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 10px 12px;
  border-radius: 16px;
  border: 1px solid var(--line);
  background: rgba(255,255,255,.75);
  font-weight: 700;
}

.panel{
  border: 1px solid var(--line);
  border-radius: 22px;
  background: rgba(255,255,255,.72);
  box-shadow: 0 10px 26px rgba(15,23,42,.06);
  overflow: hidden;
}

.docCard.is-disabled{ opacity: .55; pointer-events:none; }

.miniTag--ghost{
  background: rgba(15,23,42,.03);
  border-color: rgba(15,23,42,.08);
}

.refCard{
  border: 1px solid var(--line);
  border-radius: 22px;
  background: rgba(255,255,255,.72);
  box-shadow: 0 10px 24px rgba(15,23,42,.06);
  padding: 16px;
  display:flex;
  flex-direction:column;
  gap: 10px;
}

.refBadges{ display:flex; gap:10px; flex-wrap:wrap; margin-top: 8px; }
.refDesc{ margin: 0; opacity: .85; }
.refActions{ display:flex; gap:10px; flex-wrap:wrap; margin-top: 6px; }

.toggle{
  display:flex;
  align-items:center;
  gap:10px;
  margin-top: 10px;
  user-select:none;
  font-weight: 700;
  opacity: .9;
}
.toggle input{ display:none; }

.toggle input:checked + .toggle__ui{
  background: rgba(16,185,129,.14);
  border-color: rgba(16,185,129,.30);
}
.toggle input:checked + .toggle__ui::after{
  left: 20px;
}

.panel{
  border: 1px solid var(--line);
  border-radius: 24px;
  background: rgba(255,255,255,.72);
  box-shadow: 0 10px 26px rgba(15,23,42,.06);
  overflow: hidden;
}

/* Listeler */

.seg{display:flex; gap:8px; padding:6px; border-radius:14px; background:rgba(15,23,42,.06); flex-wrap:wrap;}
.seg__btn{border:1px solid rgba(15,23,42,.12); background:transparent; padding:10px 12px; border-radius:12px; cursor:pointer; font-weight:600;}
.seg__btn.is-active{background:rgba(15,23,42,.92); color:#fff; border-color:rgba(15,23,42,.92);}

.listCard.is-disabled{opacity:.6;}

/* Listeler - Debu benzeri marka deneyimi */

.brandCard.is-active{border-color:rgba(15,23,42,.85); box-shadow:0 14px 30px rgba(15,23,42,.10);}

/* Kartı komple tıklanabilir yaptık */

/* Doc System (Listeler / Belgeler) */

.input, .select{
  border:1px solid var(--line);
  border-radius: 14px;
  padding: 10px 12px;
  background: var(--paper);
  font-weight: 700;
}
.input:focus, .select:focus{outline:none; border-color: rgba(37,92,255,.45); box-shadow: 0 0 0 3px rgba(37,92,255,.10);}
.small{font-size:12px;}

.seg{display:flex; gap:8px; padding:6px; border-radius: 999px; background: rgba(15,23,42,.05); flex-wrap:wrap;}
.seg__btn{
  border:1px solid rgba(15,23,42,.10);
  background: transparent;
  padding: 10px 12px;
  border-radius: 999px;
  cursor:pointer;
  font-weight: 700;
}
.seg__btn.is-active{background: rgba(15,23,42,.92); color:#fff; border-color: rgba(15,23,42,.92);}

.chips--tight .chip{padding:8px 10px; border-radius: 999px;}

.docGrid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-top: 12px;
}
@media (max-width: 980px) {.docGrid{grid-template-columns: repeat(2, minmax(0,1fr));}}
@media (max-width: 640px) {
  .docGrid{grid-template-columns: 1fr;}
  
  
}

.docCard.is-disabled{opacity:.6; pointer-events:none;}

.btn--ghost{background: rgba(15,23,42,.03);}
.btn--sm{padding: 8px 10px; font-weight: 700;}

.viewToggle .btn.is-active{border-color: rgba(15,23,42,.85);}

/* Header v2 - daha net sığan, responsive */
.header__inner{
  display:flex !important;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:5px 0;
}
.brand{flex:0 0 auto; max-width:320px;}

.nav{
  flex:1 1 auto;
  display:flex;
  justify-content:center;
  position:relative;
}
.nav__list{
  flex-wrap:nowrap;
  gap: clamp(6px, 1.1vw, 14px);
}
.nav__list a{
  padding:9px 10px;
  font-size:14px;
  white-space:nowrap;
}
.header__right{flex:0 0 auto;}
.phone{
  display:inline-flex;
  align-items:center;
  gap:8px;
  white-space:nowrap;
}
.phone__label{
  display:none;
  font-weight:700;
}
.phone__num{
  display:inline;
}

/* 1180-1340px aralığında (ör. 1280px genişliğindeki dizüstü ekranları)
   menü tam bağlantı listesi yerine doğrudan hamburger'a düşüyordu; oysa
   bu genişlikte hâlâ "masaüstü" bir görünüm bekleniyor. Bağlantıların
   yatay boşluğu (padding/gap) ve yazı boyutu bu aralıkta daraltılarak
   telefon numarasıyla çakışmadan sığdırılıyor; hamburger'a düşüş noktası
   yalnızca gerçekten dar (≤1180px) ekranlar için korunuyor; bu eşik
   js/app.js içindeki mobil menü mantığının kullandığı
   "(max-width: 1180px)" ile de birebir aynı. */
@media (min-width: 1181px) and (max-width: 1340px) {
  .nav__list{ gap:4px; }
  .nav__list a{
    padding:10px 8px;
    font-size:14px;
  }
  .header__right{ gap:8px; }
  .header__right .phone{ padding:10px 10px; font-size:14px; }
}

@media (max-width: 1180px) {
  .nav{justify-content:flex-end;}
  .nav__btn{
    display:inline-flex !important;
    flex-direction:column;
    align-items:center;
    justify-content:center;
  }
  .nav__list{
    position:absolute;
    right:0;
    top: calc(100% + 10px);
    background: rgba(255,255,255,.94);
    backdrop-filter: blur(12px);
    border:1px solid var(--line);
    box-shadow: 0 18px 40px rgba(15,23,42,.16);
    border-radius: 18px;
    padding: 10px;
    display:none;
    flex-direction:column;
    align-items:stretch;
    min-width: 280px;
    max-width: 360px;
    z-index: 80;
  }
  .nav__list.is-open{display:flex;}
  .nav__list a{width:100%;}
}

/* Çok dar ekranda numara yerine "Ara" göster */
@media (max-width: 560px) {
  
  .phone__num{display:none;}
  .phone__label{display:inline;}
  .phone{padding:10px 12px;}
}

/* Doc Filters compact (stoklar gibi) */

.docFilters .miniTag{border:1px solid var(--line); padding:8px 10px; border-radius:999px; font-weight:700; font-size:12px; background: rgba(15,23,42,.02);}

.chips--small .chip{padding:8px 10px; border-radius:999px; font-weight:700;}
.viewToggle--sm .btn{padding:8px 10px;}

/* Doc Filters compact overrides (daha küçük kutular) */

.docFilters--compact .chipsGroup .chips--small{gap:6px;}
.docFilters--compact .miniTag{padding:7px 10px;}

/* Doc toolbar height reduction */

.docFilters--compact .miniTag{padding:6px 10px;}
.docFilters--compact .chip{padding:7px 9px;}

@media (min-width: 901px) {
  /* Desktop: search + brand + type in same row without big whitespace */
  
  
   /* brand */
     /* type */
}

/* Ultra-compact doc toolbar (customer view) */

.seg--sm{padding: 5px; gap:6px;}
.seg--sm .seg__btn{padding: 7px 10px; font-size: 13px;}

@media (max-width: 520px) {
  
  
  .seg--sm{width: 100%; justify-content:flex-start; flex-wrap:wrap;}
}

/* Toggle (xs) */
.toggle{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding: 7px 10px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: rgba(15,23,42,.02);
  font-weight: 700;
  cursor:pointer;
  user-select:none;
}
.toggle input{ accent-color: #2563eb; }

/* Doc grid + premium cards */
.docGrid{
  margin-top: 12px;
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 12px;
}

.docCard--file.is-disabled:hover{
  transform:none;
  box-shadow:none;
}

/* ===== Docs pages v2 (clean layout, no overlap) ===== */

.docsView .docsBtn.is-active{
  border-color: rgba(37,99,235,.45);
  background: rgba(37,99,235,.18);
}

.docsSeg__btn.is-active{
  border-color: rgba(37,99,235,.35);
  background: rgba(37,99,235,.14);
}

.docsCount{
  border: 1px solid var(--line);
  background: rgba(255,255,255,.7);
  border-radius: 999px;
  padding: 7px 10px;
  font-weight: 700;
  font-size: 12px;
  white-space:nowrap;
}

.docsCard.is-disabled:hover{transform:none; box-shadow:none;}

.docsRow__dl.is-disabled{
  opacity: .45;
  cursor: default;
  pointer-events: none;
}

.docsEmpty{
  margin-top: 12px;
  border: 1px dashed rgba(15,23,42,.22);
  border-radius: 18px;
  padding: 18px;
  background: rgba(255,255,255,.6);
}
.docsEmpty h3{margin:0 0 6px 0; font-size: 16px;}
.docsEmpty p{margin:0 0 12px 0; color: var(--muted); font-weight: 600;}

@media (max-width: 520px) {
  
  
  
  .docsCount{align-self:flex-start;}
}

/* ===== Docs tiles v3 (Debu-like grid + PDF preview) ===== */

.docTile{
  border: 1px solid rgba(15,23,42,.12);
  border-radius: 22px;
  background: rgba(255,255,255,.88);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  text-decoration: none;
  color: inherit;
  min-width: 0;
  transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease;
}
.docTile:hover{
  transform: translateY(-1px);
  box-shadow: 0 20px 44px rgba(15,23,42,.12);
  border-color: rgba(15,23,42,.18);
}
.docTile.is-disabled{ opacity: .92; }
.docTile.is-disabled:hover{ transform:none; box-shadow:none; }

.docTile__previewWrap{
  position: relative;
  height: 168px;
  background: rgba(15,23,42,.03);
}

.docTile:hover .docTile__preview{ transform: scale(1.02); }

.docTile__dl{
  position: absolute;
  top: 10px;
  right: 10px;
  width: 38px;
  height: 38px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(15,23,42,.14);
  background: rgba(255,255,255,.88);
  backdrop-filter: blur(10px);
  cursor: pointer;
  transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease, opacity .12s ease;
}
.docTile__dl svg{ width: 18px; height: 18px; }
.docTile__dl:hover{
  transform: translateY(-1px);
  box-shadow: 0 12px 24px rgba(15,23,42,.10);
  border-color: rgba(37,99,235,.30);
}
.docTile__dl.is-disabled{
  opacity: .45;
  cursor: not-allowed;
  pointer-events: none;
}

.docTile__body{
  padding: 12px 14px 14px 14px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  min-height: 112px;
}

.docTile__title{
  font-weight: 700;
  font-size: 14px;
  line-height: 1.25;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: 34px;
}
.docTile__meta{
  color: var(--muted);
  font-weight: 600;
  font-size: 12px;
  display:flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items:center;
}

/* ===== Docs tiles: CSS cover (no preview images) ===== */
.docTile__previewWrap{
  position: relative;
  height: 148px;
  background: linear-gradient(180deg, rgba(37,99,235,.14), rgba(15,23,42,.04));
}

/* ===== Select UX ===== */
.select{
  -webkit-appearance:none;
  appearance:none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M7 10l5 5 5-5' stroke='%230f172a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position: right 12px center;
  padding-right: 44px;
  min-height: 42px;
  cursor: pointer;
}
.select:hover{
  border-color: rgba(15,23,42,.22);
  background-color: rgba(15,23,42,.03);
}
.select:focus{
  border-color: rgba(37,99,235,.55);
  box-shadow: 0 0 0 4px rgba(37,99,235,.14);
}
select.select option{
  font-weight: 600;
}

/* ===== Docs cover positioning overrides (per page) ===== */

/* Belgeler: Brand sol üst + Type altında, sol hizalı */

/* ===== Belgeler görünüm toggle (Kart/Liste) ===== */

.docsView .docsBtn:not(.is-active){
  border-color: transparent;
  background: transparent;
  opacity: .85;
}
.docsView .docsBtn.is-active{
  border-color: rgba(37,99,235,.38);
  background: rgba(37,99,235,.16);
  opacity: 1;
}

/* Ensure hidden attribute always wins */
[hidden]{display:none !important;}

/* =========================
   V90 CLEAN THEME PATCH
   Amaç: daha sade, hizalı ve tutarlı görünüm
   (JS/ID yapısına dokunmadan)
========================= */

/* Daha sade arka plan */
body{
  background: var(--bg);
}

/* Header: cam efekti azalt */
.header{
  position: static;
  background: rgba(246,247,251,.98);
  backdrop-filter: none;
}

/* Genel kart/gölge: daha sakin */
.card, .panel, .pcard, .docsCard, .docsRow, .projCard, .docTile, .tile{
  box-shadow: 0 10px 24px rgba(15,23,42,.06);
}

/* Glass/blur azalt */
.filters--v2,
.filters--v2 .chipsGroup,
.filters--v2 .advBox,
.docsCard,
.docsRow,
.docTile{
  backdrop-filter: none !important;
}

.filters--v2{
  background: var(--paper);
  border: 1px solid var(--line);
}
.filters--v2 .chipsGroup,
.filters--v2 .advBox{
  background: var(--paper);
  border: 1px solid rgba(15,23,42,.08);
  box-shadow: none;
}

/* Checkbox listeleri: grid (dağınıklık biter) */
.checks--compact{
  display:grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 220px));
  gap: 8px;
  justify-content: start;
  align-content: start;
}

@media (max-width: 620px) {
  .checks--compact,
  .checks--stack{
    grid-template-columns: 1fr;
  }
}

.checksBar{
  grid-column: 1 / -1;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
  margin-bottom: 8px;
  order: -1;
}

/* Checkbox satırı: temel (tüm site) */
.chk{
  margin:0;
  display:flex;
  align-items:center;
  gap: 10px;
}
.chk input{ margin:0; }
.chk.isHidden{ display:none !important; }
.chk.isSearchHidden{ display:none !important; }
.chk.isFacetHidden{ display:none !important; }
.chk.is-disabled{ opacity: .55; }

/* Chip: akıllı daraltma */
.chip.isFacetHidden{ display:none !important; }

/* Listelerde daha kart gibi dursun */
.checks--compact .chk,
.checks--stack .chk{
  width: 100%;
  padding: 9px 10px;
  border-radius: 14px;
  border: 1px solid rgba(15,23,42,.08);
  background: rgba(15,23,42,.02);
}
.checks--compact .chk:hover,
.checks--stack .chk:hover{
  border-color: rgba(37,92,255,.25);
  background: rgba(37,92,255,.04);
}

/* Inline checkbox'lar (örn: easyBar) sade kalsın */
.easyBar .chk{
  padding: 0;
  border: 0;
  background: transparent;
}

/* Ürün tipi sütun hacklerini iptal et */
#types.checks--compact{
  column-count: unset !important;
  column-gap: unset !important;
  display: grid !important;
  max-height: 260px;
  overflow: auto;
  padding-right: 4px;
}

/* Filtre grupları aynı yükseklik + scroll */

.chipsRow .chipsGroup .checks{ flex: 1; max-height: 260px; overflow:auto; padding-right: 4px; }

.viewbar__left{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  align-items:center;
}

/* Viewbar hizası */
.viewbar__controls{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
}
.viewbar__paging{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
}
.viewbar__pagingGroup{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:8px;
}

/* ===================================================================
   Stoklar — Ürün Filtre Kartı (fCard): modern/premium/kurumsal yeniden
   tasarım. Beyaz zemin, ince açık gri border, büyük radius, hafif
   gölge, lacivert metin, mavi vurgu. Hiyerarşi: (1) başlık + Akıllı
   Filtre, (2) filtre grid'i, (3) aktif filtreler, (4) toplu işlem +
   Kart/Liste, (5) sıralama/sayfa/sayfalama, (6) karşılaştırma paneli.
   =================================================================== */
body.page--stoklar .fCard{
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 22px;
  box-shadow: 0 10px 30px rgba(15,23,42,.05);
  padding: 10px 24px;
  display:flex;
  flex-direction:column;
  gap: 8px;
}

/* (1) Başlık satırı */
body.page--stoklar .fCard__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 14px;
  flex-wrap:wrap;
}
body.page--stoklar .fCard__heading{
  display:flex;
  align-items:center;
  gap: 10px;
  min-width:0;
}
body.page--stoklar .fCard__headIcon{
  display:inline-flex;
  color: #255cff;
  flex: 0 0 auto;
}
body.page--stoklar .fCard__headIcon svg{ width:20px; height:20px; }
body.page--stoklar .fCard__title{
  font-size: 15px;
  font-weight: 700;
  letter-spacing: .06em;
  color: var(--ink);
  white-space: nowrap;
}
body.page--stoklar .fCard__sep{
  width: 1px;
  height: 18px;
  background: var(--line);
  flex: 0 0 auto;
}
body.page--stoklar .fCard__subtitle{
  font-size: 14px;
  font-weight: 600;
  color: var(--muted);
  white-space: nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

/* Akıllı Filtre: bağımsız ana özellik butonu — checkbox tamamen görsel
   olarak gizlenir, etiketin kendisi tıklanabilir bir buton gibi
   davranır. Diğer filtrelerle KARIŞTIRILMAMASI için tamamen ayrı bir
   sınıf (fChip değil) ve konum (sağ üst) kullanılır. */
body.page--stoklar .fCard__smart{
  position: relative;
  display:inline-flex;
  align-items:center;
  gap: 8px;
  padding: 9px 16px;
  border: 1.5px solid rgba(37,92,255,.45);
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(37,92,255,.08), rgba(0,194,255,.06));
  color: #255cff;
  font-weight: 700;
  font-size: 14px;
  cursor:pointer;
  white-space: nowrap;
  flex: 0 0 auto;
  transition: box-shadow .15s ease, background .15s ease;
}
body.page--stoklar .fCard__smart:hover{
  box-shadow: 0 6px 18px rgba(37,92,255,.16);
}
body.page--stoklar .fCard__smart input{
  position:absolute;
  width:1px; height:1px;
  padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0);
  white-space:nowrap; border:0;
}
body.page--stoklar .fCard__smart:has(input:checked){
  background: linear-gradient(90deg, rgba(37,92,255,.95), rgba(0,194,255,.85));
  border-color: transparent;
  color:#fff;
  box-shadow: 0 10px 24px rgba(37,92,255,.28);
}
/* Sadece arka plan rengi değişince "seçili" durumu anlaşılmıyordu;
   işaretliyken belirgin bir onay (✓) rozeti eklendi. */
body.page--stoklar .fCard__smart__check{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 0;
  overflow: hidden;
  opacity: 0;
  transition: width .15s ease, opacity .15s ease;
}
body.page--stoklar .fCard__smart:has(input:checked) .fCard__smart__check{
  width: 16px;
  opacity: 1;
}
body.page--stoklar .fCard__smart__check svg{ width:14px; height:14px; flex: 0 0 auto; }
body.page--stoklar .fCard__smartIcon{ display:inline-flex; flex:0 0 auto; }
body.page--stoklar .fCard__smartIcon svg{ width:16px; height:16px; }
body.page--stoklar .fCard__smartArrow{
  width:15px; height:15px;
  transition: transform .15s ease;
}
body.page--stoklar .fCard__smart:hover .fCard__smartArrow{ transform: translateX(2px); }

/* Akıllı Filtre artık detaylı filtrelerin sonunda, kendi kartında yer
   alıyor. Kart flex-column olduğu için varsayılan stretch davranışı
   pilli tam genişliğe yayar; bunu engelleyip mevcut kompakt pill
   görünümünü koruyoruz. Kart, diğer filtre kartlarından hafifçe daha
   az iç boşlukla ("dikkat çekici ama abartısız") ayrışır. */
body.page--stoklar .fCard--smart{
  align-items: flex-start;
  padding: 12px 24px;
}
@media (max-width: 860px) {
  body.page--stoklar .fCard--smart{
    align-items: stretch;
  }
  body.page--stoklar .fCard--smart .fCard__smart{
    justify-content: center;
  }
}

/* (0) Arama satırı — eski "head--stoklar" başlığından taşınan arama
   kutusu, stok özeti rozetleri ve iletişim notu, artık filtre kartının
   en üstünde yer alır. */
body.page--stoklar .fCard__searchRow{
  display:flex;
  flex-direction:column;
  gap: 6px;
  padding-bottom: 10px;
  margin-bottom: 2px;
  border-bottom: 1px solid var(--line);
}
body.page--stoklar .fCard__searchRow .stockSearchBar{
  position:relative;
  display:flex;
  align-items:center;
  gap: 10px;
  width:100%;
}
body.page--stoklar .fCard__searchRow .stockSearchBar .input{
  padding:12px 16px 12px 40px;
  font-size:14px;
  border-radius:14px;
}
body.page--stoklar .fCard__searchRow .stockSearchBar .input:placeholder-shown{
  padding-right:16px;
}
body.page--stoklar .fCard__searchRow .stockSearchBar .input:not(:placeholder-shown){
  padding-right:88px;
}
body.page--stoklar .fCard__searchRow .stockSearchBar .input::-webkit-search-cancel-button{
  display:none;
}
body.page--stoklar .fCard__searchRow .stockContactNote{
  margin:0;
  font-size:12px;
  font-weight:700;
  color:#c0304a;
}
body.page--stoklar .fCard__searchRow .stockContactNote a{
  color:#c0304a;
  font-weight:600;
  text-decoration:underline;
  text-underline-offset:2px;
}
@media (max-width: 520px){
  body.page--stoklar .fCard__searchRow .stockSearchBar{ flex-wrap:wrap; }
  body.page--stoklar .fCard__searchRow .stockSearchBar__field{ flex-basis:100%; }
}

/* (2) Normal filtreler — grid */
body.page--stoklar .fCard__grid{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 6px;
}
body.page--stoklar .fCard__grid.fCard__grid--more{
  margin-top:6px;
}
body.page--stoklar .fCard__moreWrap{
  display:flex;
  justify-content:center;
  margin-top:10px;
}
body.page--stoklar .fCard__moreBtn{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:7px 16px;
  border:1px solid var(--line);
  border-radius:999px;
  background:var(--paper);
  color: var(--muted);
  font-size:12px;
  font-weight:600;
  cursor:pointer;
  transition: border-color .15s ease, color .15s ease, background .15s ease;
}
body.page--stoklar .fCard__moreBtn:hover{
  border-color: rgba(37,92,255,.35);
  color: #255cff;
}
body.page--stoklar .fCard__moreBtn svg{
  width:15px; height:15px;
  transition: transform .15s ease;
}
body.page--stoklar .fCard__moreBtn[aria-expanded="true"] svg{
  transform: rotate(180deg);
}
body.page--stoklar .fChip{
  position:relative;
  display:flex;
  align-items:center;
  gap: 10px;
  padding: 6px 14px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--paper);
  cursor:pointer;
  user-select:none;
  transition: border-color .15s ease, background .15s ease;
}
body.page--stoklar .fChip:hover{
  border-color: rgba(37,92,255,.35);
}
body.page--stoklar .fChip input{
  width:17px; height:17px;
  flex: 0 0 auto;
  accent-color: #255cff;
  cursor:pointer;
}
body.page--stoklar .fChip__icon{
  display:inline-flex;
  flex: 0 0 auto;
  color: var(--muted);
  transition: color .15s ease;
}
body.page--stoklar .fChip__icon svg{ width:18px; height:18px; }
body.page--stoklar .fChip__label{
  font-size: 14px;
  font-weight: 600;
  color: var(--ink);
  white-space:normal;
  line-height:1.25;
  min-width:0;
}
body.page--stoklar .fChip:has(input:checked){
  background: rgba(37,92,255,.06);
  border-color: rgba(37,92,255,.45);
}
body.page--stoklar .fChip:has(input:checked) .fChip__icon{
  color: #255cff;
}

/* (3) Aktif filtreler */
body.page--stoklar .fCard__activeRow{
  display:flex;
  align-items:center;
  gap: 10px;
  flex-wrap:wrap;
}
body.page--stoklar .fCard__activeChips{
  display:flex;
  align-items:center;
  gap: 8px;
  flex-wrap:wrap;
  flex: 1 1 auto;
  min-height: 0;
}
body.page--stoklar .fCard__activeChips .miniTag{
  font-size: 13px;
  font-weight: 700;
  color: var(--muted);
}
body.page--stoklar .fCard__clearAllBtn{
  display:inline-flex;
  align-items:center;
  gap: 7px;
  padding: 8px 14px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--paper);
  color: var(--ink);
  font-weight: 600;
  font-size: 13px;
  cursor:pointer;
  white-space:nowrap;
}
body.page--stoklar .fCard__clearAllBtn:hover{
  border-color: rgba(37,92,255,.35);
  color: #255cff;
}
body.page--stoklar .fCard__clearAllBtn svg{ width:15px; height:15px; flex:0 0 auto; }
body.page--stoklar .fCard__activeChip{
  display:inline-flex;
  align-items:center;
  gap: 7px;
  padding: 8px 12px;
  border: 1px solid rgba(37,92,255,.30);
  border-radius: 999px;
  background: rgba(37,92,255,.06);
  color: #255cff;
  font-weight: 600;
  font-size: 12px;
  cursor:pointer;
  white-space:nowrap;
}
body.page--stoklar .fCard__activeChip:hover{
  background: rgba(37,92,255,.12);
}
body.page--stoklar .fCard__activeChip span{ font-size:14px; line-height:1; }
body.page--stoklar .fCard__clearWrap{
  flex: 0 0 auto;
}
body.page--stoklar .fCard__clearBtn{
  display:inline-flex;
  align-items:center;
  gap: 8px;
  padding: 9px 16px;
  border: 0;
  border-radius: 999px;
  background: linear-gradient(90deg, #255cff, #00c2ff);
  color:#fff;
  font-weight: 700;
  font-size: 13px;
  cursor:pointer;
  white-space:nowrap;
  box-shadow: 0 10px 22px rgba(37,92,255,.22);
}
body.page--stoklar .fCard__clearBtn:hover{
  box-shadow: 0 12px 26px rgba(37,92,255,.30);
}
body.page--stoklar .fCard__clearBtn svg{ width:15px; height:15px; flex:0 0 auto; }

/* (4) Toplu işlem + Kart/Liste — aynı satır; Kart/Liste her zaman
   sağda (margin-left:auto), toplu işlem paneli sadece seçim varken
   solda belirir ve hiçbir zaman sabit/boş alan bırakmaz. */
body.page--stoklar .fCard__toolRow{
  display:flex;
  align-items:center;
  gap: 12px;
  flex-wrap:wrap;
}
body.page--stoklar .fCard__viewSeg{
  margin-left:auto;
}
body.page--stoklar .fCard__viewSeg button{
  display:inline-flex;
  align-items:center;
  gap:6px;
}
body.page--stoklar .fCard__viewSeg button svg{ width:15px; height:15px; }
body.page--stoklar .fCard__viewSeg button.is-active{
  background: linear-gradient(90deg, #255cff, #00c2ff);
  color:#fff;
  border-radius:999px;
}
body.page--stoklar #stockBulkTools{
  margin:0;
}
body.page--stoklar #compareDock{
  display: none !important;
}

/* (5) Sıralama + sayfa başına ürün + sayfalama */
body.page--stoklar .fCard__sortRow{
  display:flex;
  align-items:flex-end;
  gap: 16px;
  flex-wrap:wrap;
  padding-top: 2px;
  border-top: 1px solid var(--line);
}
body.page--stoklar .fCard__field{
  display:flex;
  flex-direction:column;
  gap: 6px;
  flex: 1 1 260px;
  min-width: 200px;
}
body.page--stoklar .fCard__field--size{
  flex: 0 1 200px;
}
body.page--stoklar .fCard__fieldLabel{
  font-size: 12px;
  font-weight: 600;
  color: var(--muted);
  padding-left: 2px;
}
body.page--stoklar .fCard__select{
  flex: 0 0 auto;
  width: 100%;
  padding: 11px 14px;
  font-size: 14px;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
body.page--stoklar .fCard__paging{
  display:flex;
  align-items:center;
  gap: 8px;
  margin-left:auto;
}
body.page--stoklar .fCard__pageBtn{
  display:inline-flex;
  align-items:center;
  gap: 6px;
  padding: 10px 14px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--paper);
  color: var(--ink);
  font-weight: 600;
  font-size: 13px;
  cursor:pointer;
  white-space:nowrap;
}
body.page--stoklar .fCard__pageBtn:hover:not(:disabled){
  border-color: rgba(37,92,255,.35);
  color: #255cff;
}
body.page--stoklar .fCard__pageBtn:disabled{
  opacity:.45;
  cursor:default;
}
body.page--stoklar .fCard__pageBtn svg{ width:14px; height:14px; }
body.page--stoklar .fCard__pageInfo{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width: 62px;
  padding: 9px 10px;
  border: 1.5px solid rgba(37,92,255,.45);
  border-radius: 999px;
  background: var(--paper);
  color: #255cff;
  font-weight: 700;
  font-size: 13px;
}

@media (max-width: 900px){
  body.page--stoklar .fCard{ padding: 18px 16px; }
  body.page--stoklar .fCard__grid{ grid-template-columns: repeat(2, 1fr); }
  body.page--stoklar .fCard__sortRow{ align-items:stretch; }
  body.page--stoklar .fCard__paging{ margin-left:0; width:100%; justify-content:center; }
}
@media (max-width: 560px){
  body.page--stoklar .fCard__grid{ grid-template-columns: 1fr; }
  body.page--stoklar .fCard__head{ flex-direction:column; align-items:flex-start; }
  body.page--stoklar .fCard__smart{ align-self: stretch; justify-content:center; }
  body.page--stoklar .fCard__toolRow{ flex-direction:column; align-items:stretch; }
  body.page--stoklar .fCard__viewSeg{ margin-left:0; align-self:stretch; justify-content:center; }
  body.page--stoklar #stockBulkTools{ width:100%; overflow-x:auto; }
}

/* Karşılaştırma şeridi (compareStrip): araç çubuğunun hemen altında
   belirdiğinde toplam görünen yükseklik gereksiz artmasın diye dolgu/
   boşluk daraltıldı. */
body.page--stoklar .compareStrip{
  margin: 8px 0 10px;
}
body.page--stoklar .compareStrip__inner{
  padding: 16px 18px;
  border-radius: 20px;
}
body.page--stoklar .compareStrip__count{
  font-size: 14px;
}
/* Karşılaştır: mavi kenarlıklı, beyaz zemin, hover'da dolu mavi.
   Temizle: ikincil (ghost) görünüm. Ortak Marka/Tip: bilgi chip'i. */
body.page--stoklar .compareStrip__actions [data-compare-action="open"]{
  border: 1.5px solid #255cff;
  background: var(--paper);
  color: #255cff;
  font-weight: 700;
}
body.page--stoklar .compareStrip__actions [data-compare-action="open"]:hover:not(:disabled){
  background: linear-gradient(90deg, #255cff, #00c2ff);
  color: #fff;
  border-color: transparent;
}
body.page--stoklar .compareStrip__actions [data-compare-action="clear"]{
  color: var(--muted);
  background: transparent;
  border-color: var(--line);
}
body.page--stoklar .compareStrip__actions [data-compare-action="brand"],
body.page--stoklar .compareStrip__actions [data-compare-action="type"]{
  background: rgba(37,92,255,.06);
  border-color: rgba(37,92,255,.20);
  color: #255cff;
  font-weight: 600;
}
body.page--stoklar .compareStrip__actions [data-compare-action="brand"]:hover,
body.page--stoklar .compareStrip__actions [data-compare-action="type"]:hover{
  background: rgba(37,92,255,.12);
}

/* Ürün kartı: görsel zoomu azalt */
.pcard__img img{ transform: none !important; }
.pcard:hover .pcard__img img{ transform: none !important; }

/* Stok kartı görseli: oran bozulmasın, taşma olmasın, her ürün aynı çerçevede dursun */
.pcard__img{
  display:flex;
  align-items:center;
  justify-content:center;
  background: var(--paper) !important;
}
.pcard__img img{
  width: 100%;
  height: 100%;
  object-fit: contain;
  display:block;
  max-width: 100%;
  max-height: 100%;
}

/* 102/sayfa (density-100) görünümünde padding çok yer yiyor, biraz sıkıştır */
.products.density-100 .pcard__img{ padding: 6px; }

/* Liste görünümünde (is-list) görsel alanı gereksiz uzamasın */
.products.is-list .pcard__img{ height: 170px; min-height: unset; }

/* Doküman kartları: sade zemin */

/* Footer: daha net */
.footer{
  background: rgba(255,255,255,.92);
  border-top: 1px solid var(--line);
}

/* Alt sayfalama (stoklar sayfası) */
.pagingBottom{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:10px;
  margin: 18px 0 6px;
}
@media (max-width: 560px) {
  .pagingBottom{ flex-wrap:wrap; }
}

/* Stoklar: Filtre paneli aç/kapa */
body.page--stoklar .filters--v2.is-collapsed{ display:block; }
body.page--stoklar .filters--v2.is-collapsed .chipsRow,
body.page--stoklar .filters--v2.is-collapsed .advanced{ display:none; }

/* Stoklar: Marka/Ürün tipi liste yüksekliği (sabit) */
/* Akıllı filtre seçilince seçenekler azalsa bile kart yüksekliği kısalmasın */
body.page--stoklar .chipsRow .chipsGroup .checks{ height: 260px; max-height: 260px; }
body.page--stoklar #types.checks--compact{ height: 260px; max-height: 260px; }
@media (max-height: 780px) {
  body.page--stoklar .chipsRow .chipsGroup .checks{ height: 260px; max-height: 260px; }
  body.page--stoklar #types.checks--compact{ height: 260px; max-height: 260px; }
}

/* Basit uyarı (toast) */
.uiToast{
  position: fixed;
  left: 50%;
  bottom: 18px;
  transform: translateX(-50%) translateY(18px);
  opacity: 0;
  pointer-events: none;
  background: rgba(254, 242, 242, .98);
  color: #7f1d1d;
  border: 1px solid rgba(252, 165, 165, .9);
  padding: 10px 12px;
  border-radius: 14px;
  max-width: min(560px, calc(100vw - 24px));
  font-size: 13px;
  font-weight: 700;
  box-shadow: 0 16px 36px rgba(0,0,0,.12);
  display: flex;
  align-items: center;
  gap: 10px;
  transition: opacity .18s ease, transform .18s ease;
  z-index: 9999;
}
.uiToast::before{
  content: "!";
  width: 20px;
  height: 20px;
  flex: 0 0 20px;
  border-radius: 999px;
  background: #ef4444;
  color: #fff;
  display: grid;
  place-items: center;
  font-weight: 700;
  line-height: 1;
}
.uiToast.is-show{
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}

/* Liste butonu kilitli görünüm (12/sayfa değilken) */
#viewList.is-locked{
  opacity: .55;
}

/* Arama terimlerini ürün adında vurgula */
.pcard__title mark.hl{
  background: rgba(253, 224, 71, .55);
  color: inherit;
  padding: 0 .22em;
  border-radius: 10px;
  box-shadow: inset 0 0 0 1px rgba(234, 179, 8, .45);
}

/* Skeleton loading (filtre değişince kısa geçiş) */
.pcard--skeleton{
  pointer-events: none;
  transform: none !important;
}
.pcard--skeleton:hover{
  transform: none;
  box-shadow: 0 10px 24px rgba(15,23,42,.06);
}
.pcard--skeleton .pcard__img{
  background: transparent;
}
.sk{
  display: block;
  background: linear-gradient(90deg, rgba(148,163,184,.22), rgba(148,163,184,.38), rgba(148,163,184,.22));
  background-size: 260% 100%;
  animation: skShimmer 1.05s ease-in-out infinite;
  border-radius: 14px;
}
.sk--img{ width: 100%; height: 100%; border-radius: 0; }
.sk--pill{ height: 22px; width: 120px; margin: 2px auto 10px; border-radius: 999px; }
.sk--title{ height: 18px; width: 78%; margin: 6px auto 12px; }
.sk--line{ height: 12px; width: 92%; margin: 8px auto; }
.sk--line2{ width: 68%; }
.sk--row{ height: 44px; width: 96%; margin: 12px auto 0; }

@keyframes skShimmer{
  0%{ background-position: 180% 0; }
  100%{ background-position: -40% 0; }
}

/* Yukarı çık butonu */
.toTopBtn{
  position: fixed;
  right: 16px;
  bottom: 18px;
  width: 44px;
  height: 44px;
  border-radius: 999px;
  border: 1px solid rgba(37,92,255,.22);
  background: rgba(255,255,255,.92);
  color: var(--accent);
  font-size: 18px;
  font-weight: 700;
  display: grid;
  place-items: center;
  box-shadow: 0 18px 46px rgba(15,23,42,.18);
  opacity: 0;
  transform: translateY(16px);
  pointer-events: none;
  transition: opacity .18s ease, transform .18s ease, box-shadow .18s ease;
  z-index: 90;
}
.toTopBtn.is-show{
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}
.toTopBtn:hover{
  background: #fff;
  box-shadow: 0 22px 56px rgba(15,23,42,.22);
}
@media (max-width: 520px) {
  .toTopBtn{ right: 12px; bottom: 14px; width: 46px; height: 46px; }
}

/* Stoklar: Marka / Ürün tipi arama kutuları (chipsGroup içinde) */
body.page--stoklar .filters--v2 .chipsSearch{
  /* Arama kutusu ile hemen altındaki "Hepsini Seç / Temizle" pilleri
     birbirine çok yapışıktı; boşluk artırıldı. */
  margin: 8px 0 16px;
}
body.page--stoklar .filters--v2 .input--mini{
  width: 100%;
  min-width: 0;
  padding: 8px 10px;
  border-radius: 14px;
  font-size: 13px;
}

/* qSuggest kaldırıldı: qWrap pozisyonu korunur */
body.page--stoklar .head--stoklar{
  display:grid;
  grid-template-columns: minmax(0,auto) minmax(340px, 1fr);
  grid-template-areas:
    "title search"
    "note  search";
  align-items:center;
  column-gap:24px;
  row-gap:4px;
}
body.page--stoklar .head--stoklar h1{
  grid-area: title;
  margin:0;
  font-family: "Space Grotesk", system-ui;
  font-size: 34px;
  line-height: 1.2;
  letter-spacing: -0.02em;
}
@media (max-width: 860px){
  body.page--stoklar .head--stoklar h1{ font-size: clamp(22px, 6.2vw, 30px); }
}
@media (max-width: 560px){
  body.page--stoklar .head--stoklar h1{ font-size: 28px; }
}
@media (max-width: 900px){
  body.page--stoklar .head--stoklar{
    grid-template-columns: 1fr;
    grid-template-areas:
      "title"
      "note"
      "search";
  }
}
body.page--stoklar .head--stoklar .stockSearchBar{
  position:relative;
  margin-top:0;
}
body.page--stoklar .head--stoklar .stockSearchBar .input{
  padding:12px 16px 12px 40px;
  font-size:14px;
  border-radius:14px;
}
body.page--stoklar .head--stoklar .stockSearchBar .input:placeholder-shown{
  padding-right:16px;
}
body.page--stoklar .head--stoklar .stockSearchBar .input:not(:placeholder-shown){
  padding-right:88px;
}
body.page--stoklar .head--stoklar .stockSearchBar .input::-webkit-search-cancel-button{
  display:none;
}
body.page--stoklar .stockSearchBar__icon{
  position:absolute;
  left:14px;
  top:50%;
  transform:translateY(-50%);
  width:16px;
  height:16px;
  color:var(--muted);
  pointer-events:none;
}
body.page--stoklar .stockSearchBar__count{
  position:absolute;
  right:10px;
  top:50%;
  transform:translateY(-50%);
  white-space:nowrap;
  font-size:11px;
  font-weight:600;
  color:var(--accent);
  background:rgba(37,92,255,.08);
  border:1px solid rgba(37,92,255,.16);
  padding:4px 9px;
  border-radius:999px;
  pointer-events:none;
}
body.page--stoklar .stockSearchBar__count--empty{
  color:#c0304a;
  background:rgba(220,38,38,.08);
  border-color:rgba(220,38,38,.16);
}
@media (max-width: 520px) {
  body.page--stoklar .head--stoklar .stockSearchBar{
    flex-wrap: wrap;
  }
  body.page--stoklar .stockSearchBar__field{
    flex-basis: 100%;
  }
}

/* Arama çubuğu artık başlığın sağındaki tüm sütunu kullanır; iletişim
   notu "Stoklarımız" başlığının hemen altında, küçük ve tek satıra
   sığacak şekilde yer alır (grid-area: note). */
body.page--stoklar .head--stoklar .stockSearchBar{
  grid-area: search;
  align-self: center;
  position: static;
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  max-width: none;
}
body.page--stoklar .stockSearchBar__field{
  position: relative;
  flex: 1 1 auto;
  min-width: 0;
}
body.page--stoklar .stockContactNote{
  grid-area: note;
  margin: 0;
  font-size: 11px;
  font-weight: 700;
  color: #c0304a;
  white-space: normal;
}
body.page--stoklar .stockContactNote a{
  color: #c0304a;
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 2px;
}
body.page--stoklar .stockSummary--inSearchBar{
  flex: 0 0 auto;
  flex-wrap: nowrap;
  gap: 6px;
  margin: 0;
}
body.page--stoklar .stockSummary--inSearchBar .miniTag{
  white-space: nowrap;
}
@media (max-width: 640px) {
  body.page--stoklar .stockSummary--inSearchBar{
    flex-basis: 100%;
    justify-content: flex-start;
    margin-top: 6px;
  }
  body.page--stoklar .stockSearchBar__field{
    min-width: 0;
    flex-basis: 100%;
  }
}
@media (max-width: 900px) and (min-width: 641px) {
  body.page--stoklar .stockSearchBar__field{
    min-width: 260px;
  }
}

body.page--stoklar .qRow{
  display: flex;
  gap: 10px;
  align-items: center;
}
body.page--stoklar .qWrap{
  position: relative;
  flex: 1 1 auto;
  min-width: 0;
}
body.page--stoklar .qWrap .input{
  width: 100%;
  min-width: 0;
}
body.page--stoklar .stockCountTop{
  margin-left: auto;
  white-space: nowrap;
  flex-shrink: 0;
}
body.page--stoklar .stockToolsRow{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  align-items:center;
}
body.page--stoklar .stockSummary{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:center;
  flex:0 1 auto;
}
body.page--stoklar .stockSummary:empty{
  display:none;
}
@media (max-width: 900px) {
  body.page--stoklar .stockToolsRow{
    flex-direction:column;
    align-items:stretch;
  }
}
@media (max-width: 680px) {
  body.page--stoklar .qRow{
    flex-direction: column;
    align-items: stretch;
  }
  body.page--stoklar .stockCountTop{
    margin-left: 0;
    align-self: flex-start;
  }
}

body.page--stoklar .chk__text{ flex: 1; min-width: 0; }
body.page--stoklar .chk__count{
  margin-left: auto;
  font-size: 12px;
  font-weight: 700;
  color: rgba(15,23,42,.60);
  white-space: nowrap;
}
body.page--stoklar .chk__count b{ color: rgba(15,23,42,.76); }

body.page--stoklar .favRow{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 8px 0 10px;
}
body.page--stoklar .favRow__label{
  width: 100%;
  font-size: 12px;
  color: rgba(15,23,42,.62);
  font-weight: 700;
  margin-bottom: 2px;
}
body.page--stoklar .favChip{
  border: 1px solid rgba(15,23,42,.10);
  background: rgba(15,23,42,.03);
  border-radius: 999px;
  padding: 7px 10px;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}
body.page--stoklar .favChip:hover{
  background: rgba(37,92,255,.06);
  border-color: rgba(37,92,255,.20);
}

body.page--stoklar .chk.isCollapsedHidden{ display: none !important; }

body.page--stoklar .checksFooter{
  grid-column: 1 / -1;
  display: flex;
  justify-content: center;
  margin-top: 8px;
}
body.page--stoklar .checksFooter .btn{ width: 100%; justify-content: center; }
@media (min-width: 620px) {
  body.page--stoklar .checksFooter .btn{ width: auto; }
}

/* =====================================================
   İletişim (V3) – Baştan Tasarım
   ===================================================== */
body.page--iletisim .hero--contact{ padding: 42px 0 18px; }
body.page--iletisim .contactHero{ gap: 16px; }
body.page--iletisim .contactActions{ display:flex; gap:10px; flex-wrap:wrap; margin: 14px 0 10px; }
body.page--iletisim .contactDept{ margin-top: 14px; }

body.page--iletisim .contactPanel{ position: sticky; top: 14px; }
@media (max-width: 980px) { body.page--iletisim .contactPanel{ position: static; } }

body.page--iletisim .cForm{ display:grid; gap: 12px; }
body.page--iletisim .cForm__row{ display:flex; gap: 10px; flex-wrap:wrap; }
body.page--iletisim .field{ flex: 1 1 220px; min-width: 220px; }
body.page--iletisim .field label{
  font-size:12px;
  font-weight:700;
  letter-spacing:.3px;
  text-transform:uppercase;
  color: var(--muted);
}
body.page--iletisim textarea.input{ resize: vertical; min-height: 110px; }

body.page--iletisim .tchips{ display:flex; gap:8px; flex-wrap:wrap; }
body.page--iletisim .tchip{
  border: 1px solid var(--line);
  background: rgba(15,23,42,.02);
  border-radius: 999px;
  padding: 9px 12px;
  font-weight: 700;
  cursor:pointer;
}
body.page--iletisim .tchip:hover{ border-color: rgba(37,92,255,.35); background: rgba(37,92,255,.07); }

body.page--iletisim .formActions{ display:flex; gap:10px; flex-wrap:wrap; }
body.page--iletisim .cHint{ margin: 0; font-size: 12px; line-height: 1.6; }

body.page--iletisim .contactChannels{
  display:grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 14px;
}
@media (max-width: 980px) { body.page--iletisim .contactChannels{ grid-template-columns: 1fr; } }

body.page--iletisim .channelTop{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap: 12px;
  flex-wrap:wrap;
}
body.page--iletisim .channelVal{ margin-top: 6px; font-weight: 700; }
body.page--iletisim .channelBtns{ display:flex; gap:10px; flex-wrap:wrap; align-items:center; }

/* =====================================================
   İletişim (Kompakt Minimal)
   ===================================================== */
body.page--iletisim .contactCards{ display:grid; gap:14px; align-content:start; }
body.page--iletisim .cardTopBetween{ display:flex; justify-content:space-between; align-items:flex-start; gap:10px; flex-wrap:wrap; }
body.page--iletisim .bigVal{ margin-top: 6px; font-size: 20px; font-weight: 700; letter-spacing:.2px; }
body.page--iletisim .bigVal a{ color: inherit; text-decoration: none; }
body.page--iletisim .miniPills{ display:flex; gap:8px; flex-wrap:wrap; margin: 8px 0 0; }
body.page--iletisim .miniPill{
  border: 1px solid var(--line);
  background: rgba(15,23,42,.02);
  border-radius: 999px;
  padding: 7px 10px;
  font-weight: 700;
  font-size: 12px;
  color: var(--muted);
}
body.page--iletisim .head--compact{ margin-bottom: 12px; }
body.page--iletisim .head--compact p{ margin-top: 6px; }
@media (max-width: 980px) {
  body.page--iletisim .bigVal{ font-size: 18px; }
}

/* Breadcrumb + legal pages + cookie consent */
.breadcrumb{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px;
  margin:0 0 18px;
  padding:12px 14px;
  border-radius:16px;
  background:rgba(255,255,255,.82);
  border:1px solid var(--line);
  box-shadow:0 8px 20px rgba(15,23,42,.05);
  color:var(--muted);
  font-size:13px;
  font-weight:700;
}
.breadcrumb a{
  color:var(--ink);
}
.breadcrumb a:hover{
  color:var(--accent);
}
.breadcrumb__sep{
  color:#94a3b8;
  font-weight:700;
}
.breadcrumb [aria-current="page"]{
  color:var(--muted);
}

/* Ürün detay sayfası: breadcrumb altındaki mini/hızlı ürün arama çubuğu.
   Stoklar sayfasındaki arama çubuğuyla aynı boyut/görünümde ama sayfa
   içinde kalıp (stoklar.html'e gitmeden) küçük bir sonuç listesi açar. */
.detailQuickSearch{
  position: relative;
  max-width: none;
  margin: 0 0 18px;
}
.detailQuickSearch__field{
  position: relative;
}
.detailQuickSearch__field .input{
  width: 100%;
  padding: 12px 16px 12px 40px;
  font-size: 14px;
  border-radius: 14px;
}
.detailQuickSearch__icon{
  position: absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%);
  width: 16px;
  height: 16px;
  color: var(--muted);
  pointer-events: none;
}
.detailQuickSearch__results{
  position: absolute;
  left: 0;
  right: 0;
  top: calc(100% + 6px);
  z-index: 40;
  background: rgba(255,255,255,.99);
  border: 1px solid var(--line);
  border-radius: 16px;
  box-shadow: 0 18px 36px rgba(15,23,42,.14);
  padding: 6px;
  max-height: min(70vh, 420px);
  overflow-y: auto;
}
.detailQuickSearch__item{
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 9px 10px;
  border-radius: 12px;
  text-decoration: none;
  color: var(--ink);
}
.detailQuickSearch__item:hover,
.detailQuickSearch__item.is-active{
  background: rgba(37,92,255,.08);
}
.detailQuickSearch__item img{
  width: 52px;
  height: 52px;
  object-fit: contain;
  border-radius: 10px;
  background: #fff;
  border: 1px solid var(--line);
  flex: 0 0 auto;
}
.detailQuickSearch__itemText{
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}
.detailQuickSearch__itemText strong{
  font-size: 14px;
  font-weight: 700;
  line-height: 1.3;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.detailQuickSearch__itemText small{
  font-size: 12px;
  color: var(--muted);
  font-weight: 600;
}
.detailQuickSearch__itemMeta{
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: 1px;
}
.detailQuickSearch__itemMeta span{
  display: inline-flex;
  align-items: center;
  font-size: 11px;
  font-weight: 600;
  color: var(--accent);
  background: rgba(37,92,255,.08);
  border: 1px solid rgba(37,92,255,.14);
  border-radius: 999px;
  padding: 2px 8px;
  white-space: nowrap;
}
.detailQuickSearch__itemMeta span.is-out{
  color: #c0304a;
  background: rgba(220,38,38,.08);
  border-color: rgba(220,38,38,.16);
}
.detailQuickSearch__more{
  display: block;
  text-align: center;
  margin-top: 4px;
  padding: 9px 8px;
  border-radius: 11px;
  border-top: 1px dashed var(--line);
  font-size: 12px;
  font-weight: 600;
  color: var(--accent);
  text-decoration: none;
}
.detailQuickSearch__more:hover{
  background: rgba(37,92,255,.06);
}
.detailQuickSearch__empty{
  padding: 12px 10px;
  font-size: 12px;
  color: var(--muted);
  text-align: center;
}
@media (max-width: 640px){
  .detailQuickSearch{ max-width: none; }
}

body.page--legal .section--legalHero{
  padding:28px 0 18px;
}
body.page--legal .section--legalBody{
  padding-top:0;
}

.legalHero__copy,
.legalHero__card,
.legalCard--pad{
  border-radius:24px;
}
.legalHero__copy{
  padding:26px;
  background:linear-gradient(135deg, rgba(37,92,255,.10), rgba(0,194,255,.08));
  border:1px solid rgba(37,92,255,.14);
  box-shadow:var(--shadow);
}
.legalHero__copy h1{
  margin:14px 0 10px;
  font-size:clamp(30px, 4vw, 46px);
  line-height:1.06;
}
.legalHero__copy p{
  margin:0;
  color:var(--muted);
  font-size:15px;
  line-height:1.75;
  max-width:68ch;
}

.legalMeta{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:18px;
}
.legalMeta__item{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:10px 12px;
  border-radius:999px;
  background:rgba(255,255,255,.75);
  border:1px solid rgba(37,92,255,.10);
  font-size:12px;
  font-weight:700;
  color:var(--ink);
}

.legalInlineBtn{
  padding:10px 14px;
}

.cookieConsent[hidden]{
  display:none !important;
}
/* Çerez kutusu — tüm ekran boyutlarında TEK bir tasarım:
   sağ-alt köşede duran, tek satırlık, hap (pill) biçiminde çok küçük bir
   bileşen. Eskiden tam genişlikte, ekranın altına yaslanan uzun bir şerit
   kullanılıyordu; bu hem sayfanın önemli bir kısmını kaplıyor hem de
   dikkat dağıtıyordu. Kompakt hap tasarımı yalnızca kısa bir başlık ve iki
   butondan oluştuğu için köşeye küçük bir şekilde sığıyor, açıklama
   metni ve kapatma düğmesi kaldırıldı (butonlardan biri seçilerek zaten
   kapatılabiliyor). Çok dar ekranlarda köşeden köşeye taşmaması için
   max-width ile genişlik sınırlanıyor. */
.cookieConsent{
  position:fixed;
  left:auto;
  right:20px;
  bottom:20px;
  top:auto;
  width:auto;
  max-width:min(360px, calc(100vw - 40px));
  box-sizing:border-box;
  /* Leaflet haritasının kendi iç katmanları (kontrol düğmeleri, popup'lar
     vb.) 1000'e kadar z-index kullanabiliyor; çerez pop-up'ı eskiden 120
     ile bunların ALTINDA kalıyordu (projeler sayfasında harita üstte,
     pop-up altta görünüyordu). Sitedeki diğer "her zaman en üstte" olması
     gereken katmanlarla (toast, lightbox) aynı seviyeye çekildi. */
  z-index:9998;
  display:flex;
  flex-direction:row;
  flex-wrap:nowrap;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  padding:8px 14px 8px 18px;
  background:linear-gradient(155deg, rgba(15,23,42,.98), rgba(30,41,59,.96));
  color:#fff;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.10);
  box-shadow:0 12px 30px rgba(15,23,42,.32);
}
.cookieConsent__close{
  display:none;
}
.cookieConsent__content{
  min-width:0;
  flex:1 1 auto;
  overflow:hidden;
}
/* Kısa "ÇEREZ" rozeti ayrı bir satır kaplayıp yüksekliği artırıyordu;
   hap tasarımında başlık zaten "çerez" kelimesini içerdiği için
   rozet olmadan da anlam kaybı olmuyor. */
.cookieConsent__eyebrow{
  display:none;
}
.cookieConsent__title{
  display:block;
  width:100%;
  font-size:11.5px;
  line-height:1.4;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
/* Açıklama metni tam kart yerine küçük bir hapa sığmadığından gizleniyor;
   detaylı bilgi zaten başlıktaki linkten (Çerez Politikası) erişilebilir. */
.cookieConsent p{
  display:none;
}
.cookieConsent a{
  color:#fff;
  text-decoration:underline;
  text-underline-offset:3px;
}
.cookieConsent__actions{
  display:flex;
  align-items:center;
  gap:6px;
  flex:0 0 auto;
  flex-wrap:nowrap;
  justify-content:flex-end;
}

.cookieConsent__btn{
  appearance:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:28px;
  border:0;
  cursor:pointer;
  border-radius:999px;
  padding:6px 12px;
  font:inherit;
  font-size:11px;
  font-weight:700;
  text-decoration:none;
  white-space:nowrap;
}
.cookieConsent__btn--ghost{
  background:transparent;
  color:#fff;
  border:1px solid rgba(255,255,255,.20);
}

.cookieConsent__btn--primary{
  background:linear-gradient(135deg, #ffffff, #dbeafe);
  color:var(--ink);
  box-shadow:0 8px 18px rgba(37,92,255,.16);
}
/* Hap artık sayfanın akışını itmiyor (sabit konumlu, küçük ve köşede
   duruyor), bu yüzden alt boşluk eklemeye gerek yok. app.js banner
   görünürken body'e "has-cookie-consent" class'ı eklemeye devam ediyor,
   ancak bu kural artık görsel bir etki yaratmıyor. */
body.has-cookie-consent{
  padding-bottom: 0;
}

/* --- Mobil: köşeye daha az kenar boşluğuyla yaslanır --- */
@media (max-width: 640px){
  .cookieConsent{
    right:12px;
    bottom:12px;
    max-width:calc(100vw - 24px);
    padding:7px 12px 7px 16px;
  }

  .cookieConsent__title{
    font-size:11px;
  }

  .cookieConsent__btn{
    padding:6px 10px;
    min-height:28px;
    font-size:10.5px;
  }
}

@media (max-width: 640px) {
  body.page--legal .section--legalHero{
    padding-top:20px;
  }

  .legalHero__copy,
  .legalHero__card,
  .legalCard--pad{
    padding:18px;
    border-radius:20px;
  }
}

.footer__addrText{
  margin-top: 10px;
  font-size: 13px;
  line-height: 1.6;
  color: var(--muted);
}
.footer__legal{
  max-width: min(100%, 920px);
  text-align: right;
  line-height: 1.5;
  text-wrap: balance;
  overflow-wrap: anywhere;
}
@media (max-width: 980px) {
  .footer__legal{
    text-align: left;
  }
}

/* === Karşılaştırma v3: seçim şeridi, mobil düzen, güçlü vurgu === */
#onlySelectedBtn.is-ready,
.compareStrip .btn.is-active{
  background: linear-gradient(90deg, rgba(37,92,255,.14), rgba(0,194,255,.10));
  border-color: rgba(37,92,255,.24);
  color: var(--ink);
}
.pcardSlot.is-compare-selected{
  z-index: 1;
}
.pcard.pcard--compare-active{
  border-color: rgba(37,92,255,.28);
  box-shadow:
    0 0 0 3px rgba(37,92,255,.08),
    0 18px 36px rgba(37,92,255,.12);
}
.pcard.pcard--compare-active:hover{
  box-shadow:
    0 0 0 4px rgba(37,92,255,.10),
    0 22px 42px rgba(37,92,255,.16);
}
.pcard__title{
  display:-webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow:hidden;
  min-height: 2.7em;
}

.compareStrip{
  position: sticky;
  top: 84px;
  z-index: 18;
  margin: 0 0 14px;
}
.compareStrip[hidden]{
  display:none !important;
}
.compareStrip__inner{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
  padding: 12px 14px;
  border: 1px solid rgba(37,92,255,.14);
  border-radius: 20px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.95), rgba(255,255,255,.84));
  box-shadow: 0 14px 32px rgba(15,23,42,.08);
  backdrop-filter: blur(8px);
}
.compareStrip__meta{
  display:grid;
  gap:2px;
  margin-right:auto;
}
.compareStrip__count{
  font-size: 13px;
  font-weight: 700;
  color: var(--ink);
}
.compareStrip__hint{
  font-size: 12px;
  font-weight: 700;
  color: var(--muted);
}
.compareStrip__chips{
  display:flex;
  align-items:center;
  gap:8px;
  flex: 1 1 260px;
  min-width: 180px;
  flex-wrap:wrap;
}
.compareMiniChip{
  display:inline-flex;
  align-items:center;
  gap:8px;
  max-width: 220px;
  padding: 6px 12px 6px 6px;
  border-radius: 999px;
  border: 1px solid rgba(15,23,42,.08);
  background: rgba(15,23,42,.03);
  cursor:pointer;
}
.compareMiniChip__img{
  width: 26px;
  height: 26px;
  border-radius: 8px;
  object-fit: cover;
  flex: 0 0 auto;
  background: #fff;
  border: 1px solid rgba(15,23,42,.06);
}
.compareMiniChip__name{
  display:block;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size: 12px;
  font-weight: 600;
  color: var(--ink);
}
.compareMiniChip__remove{
  flex: 0 0 auto;
  font-size: 16px;
  line-height: 1;
  color: var(--muted);
}
.compareStrip__actions{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}

.compareDock{
  position: fixed;
  left: 50%;
  bottom: 14px;
  z-index: 55;
  transform: translateX(-50%);
  width: min(680px, calc(100vw - 20px));
}
.compareDock[hidden]{
  display:none !important;
}
.compareDock__inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding: 12px 14px;
  border-radius: 18px;
  border: 1px solid rgba(15,23,42,.08);
  background: rgba(255,255,255,.96);
  box-shadow: 0 16px 38px rgba(15,23,42,.16);
  backdrop-filter: blur(8px);
}
.compareDock__meta{
  display:grid;
  gap:2px;
}
.compareDock__meta strong{
  font-size: 14px;
  line-height:1.1;
}
.compareDock__meta span{
  font-size: 12px;
  font-weight: 700;
  color: var(--muted);
}
.compareDock__actions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}

/* ===== Karşılaştırma penceresi: rozet, en iyi değer ve mobil kart stilleri ===== */
.compareSummary__stat{
  max-width: min(100%, 320px);
}
.compareSummary__stat:last-of-type{
  white-space: nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.compareBest,
.compareEmptyTag{
  display:inline-flex;
  align-items:center;
  min-height: 22px;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
}
.compareBest{
  color: var(--accent);
  background: rgba(37,92,255,.09);
  border: 1px solid rgba(37,92,255,.22);
}
.compareEmptyTag{
  color: #94a3b8;
  background: transparent;
  border: 1px solid rgba(148,163,184,.28);
}
.compareCell--best{
  border-color: rgba(37,92,255,.28);
  background: rgba(37,92,255,.07);
}
.compareCell--best.compareCell--diff{
  background: rgba(37,92,255,.09);
}
.compareCell--empty{
  color: #94a3b8;
  font-weight: 600;
  border-style: dashed;
  border-color: rgba(148,163,184,.28);
  background: transparent;
}
.compareCell--empty .badge{
  opacity: .74;
}
.compareMobileList{
  display:grid;
  gap:14px;
}
.compareMobileCard{
  border: 1px solid rgba(15,23,42,.08);
  border-radius: 18px;
  background: var(--paper);
  overflow:hidden;
}
.compareMobileCard__head{
  padding: 12px;
  border-bottom: 1px solid rgba(15,23,42,.06);
}
.compareMobileCard__head .compareHeadCard{
  min-width: 0;
  box-shadow:none;
}
.compareMobileSpecs{
  display:grid;
  gap:10px;
  padding: 12px;
}
.compareSpec{
  display:grid;
  gap:8px;
}
.compareSpec__label{
  display:flex;
  align-items:center;
  gap:8px;
  font-size: 12px;
  font-weight: 700;
  color: var(--muted);
}
.compareSpec--diff .compareSpec__label{
  color: var(--accent);
}
.compareMobileSpecs .compareCell{
  min-width: 0;
}

@media (max-width: 900px) {
  .compareStrip{
    top: 74px;
  }
  .compareStrip__meta{
    width: 100%;
  }
}
@media (min-width: 761px) {
  .compareDock{
    width: min(420px, calc(100vw - 24px));
    left: auto;
    right: 16px;
    transform: none;
  }
}
@media (max-width: 760px) {
  .compareStrip{
    top: 66px;
  }
  .compareStrip__inner{
    padding: 10px 12px;
    border-radius: 16px;
  }
  .compareStrip__chips{
    width: 100%;
    flex-wrap: nowrap;
    overflow:auto;
    padding-bottom: 2px;
  }
  .compareMiniChip{
    max-width: 170px;
    flex: 0 0 auto;
  }
  .compareStrip__actions{
    width: 100%;
  }
  .compareStrip__actions .btn{
    flex: 1 1 calc(50% - 6px);
    justify-content: center;
  }
  .compareSheet__actions{
    width: 100%;
  }
  .compareSheet__actions .btn{
    flex: 1 1 calc(50% - 4px);
    justify-content:center;
  }
  .compareDock{
    left: 10px;
    right: 10px;
    bottom: 10px;
    width: auto;
    transform: none;
  }
  .compareDock__inner{
    border-radius: 16px;
  }
}
@media print {
  body *{
    visibility: hidden !important;
  }
  #compareSheet,
  #compareSheet *{
    visibility: visible !important;
  }
  #compareSheet{
    position: static !important;
    inset: auto !important;
  }
  #compareSheet .compareSheet__backdrop,
  #compareSheet [data-compare-close],
  #compareSheet [data-compare-pdf],
  #compareSheet [data-compare-clear],
  #compareDock,
  .compareStrip,
  .compareRemove{
    display: none !important;
  }
  #compareSheet .compareSheet__panel{
    width: 100% !important;
    max-height: none !important;
    margin: 0 !important;
    border-radius: 0 !important;
    border: none !important;
    box-shadow: none !important;
    overflow: visible !important;
  }
  #compareSheet .compareSheet__head{
    padding-bottom: 8px !important;
  }
  #compareSheet .compareSheet__body{
    overflow: visible !important;
  }
  #compareSheet .compareTable{
    min-width: 0 !important;
  }
}

/* ===== Karşılaştırma penceresi: başlık kaydırma + doküman hücresi ===== */
.compareSheet__head{
  flex-wrap: wrap;
  align-items: flex-start;
}
.compareSheet__actions{
  flex: 1 1 420px;
}
.compareSheet__actions .btn{
  flex: 0 0 auto;
}
.compareSheet__assist{
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  padding:0 !important;
  margin:-1px !important;
  overflow:hidden !important;
  clip:rect(0,0,0,0) !important;
  white-space:nowrap !important;
  border:0 !important;
}
.docTile.has-preview .docTile__preview{ display:block !important; }
.docTile.has-preview .docTile__cover{
  background: linear-gradient(180deg, rgba(15,23,42,.10), rgba(15,23,42,.42));
}
.docTile.has-preview .docTile__coverBrand,
.docTile.has-preview .docTile__coverType{
  background: rgba(255,255,255,.82);
}
.docTile[role="link"]{ cursor: pointer; }
.docTile[role="link"]:focus{
  outline: 2px solid rgba(37,99,235,.34);
  outline-offset: 3px;
}

.docTile.is-disabled .docTile__ctaText::after{
  content: '•';
}

/* 2026-02-27: Stoklar liste görünümü oran düzeltmesi */
.products.is-list{
  grid-template-columns: 1fr;
  gap: 14px;
}
.products.is-list .pcardSlot{
  width: 100%;
  min-width: 0;
}
.products.is-list .pcard{
  display: grid;
  grid-template-columns: clamp(170px, 18vw, 210px) minmax(0, 1fr);
  align-items: stretch;
  min-height: 210px;
}
.products.is-list .pcard__img{
  height: auto;
  min-height: 210px;
  max-height: 210px;
  padding: 14px;
}
.products.is-list .pcard__img img{
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 170px;
  object-fit: contain;
}
.products.is-list .pcard__body{
  display: grid;
  /* Sol sütun (başlık/özellikler) geniş satırlarda 1fr olduğu için tüm
     boş alanı kendine ayırıyor, marka etiketi ise sağ kenara yapışık
     kalıyordu; ikisi arasında gereksiz büyük bir boşluk oluşuyordu.
     Sol sütun 560px ile sınırlanınca marka etiketi içeriğe çok daha
     yakın duruyor; artan boşluk kartın sağ kenarına düşer. */
  grid-template-columns: minmax(0, min(560px, 1fr)) auto;
  gap: 8px 16px;
  align-content: center;
  min-width: 0;
  padding: 16px 18px;
}
.products.is-list .pcard__title{
  grid-column: 1 / 2;
  min-width: 0;
  line-height: 1.3;
  min-height: 46px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.products.is-list .pmeta,
.products.is-list .docLine,
.products.is-list .stockMetaLine,
.products.is-list .crit,
.products.is-list .metaLine{
  grid-column: 1 / 2;
  min-width: 0;
}
.products.is-list .metaLine{
  margin-top: 2px !important;
}
@media (max-width: 900px) {
  .products.is-list .pcard{
    grid-template-columns: 160px minmax(0, 1fr);
    min-height: 190px;
  }
  .products.is-list .pcard__img{
    min-height: 190px;
    max-height: 190px;
  }
  .products.is-list .pcard__img img{
    max-height: 150px;
  }
}
@media (max-width: 760px) {
  .products.is-list .pcard{
    grid-template-columns: 1fr;
    min-height: 0;
  }
  .products.is-list .pcard__img{
    min-height: 170px;
    max-height: 170px;
  }
  .products.is-list .pcard__body{
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .products.is-list .pcard__title{
    min-height: 0;
  }
}

/* 2026-02-27: Stoklar liste görünümü kompakt + eşit yükseklik */
.products.is-list{
  gap: 12px;
}
.products.is-list .pcard{
  grid-template-columns: 156px minmax(0, 1fr);
  min-height: 188px;
  height: 188px;
}
.products.is-list .pcard__img{
  min-height: 188px;
  max-height: 188px;
  padding: 10px;
}
.products.is-list .pcard__img img{
  max-height: 136px;
}
.products.is-list .pcard__body{
  grid-template-columns: minmax(0, 1fr) 132px;
  grid-auto-rows: min-content;
  gap: 6px 12px;
  align-content: start;
  padding: 12px 14px;
  overflow: hidden;
}
.products.is-list .pcard__title{
  min-height: 0;
  height: 36px;
  line-height: 1.22;
  font-size: 15px;
  -webkit-line-clamp: 2;
}
.products.is-list .pmeta,
.products.is-list .docLine,
.products.is-list .stockMetaLine,
.products.is-list .crit,
.products.is-list .metaLine{
  margin-top: 0 !important;
}
.products.is-list .docLine,
.products.is-list .stockMetaLine{
  flex-wrap: nowrap;
  overflow: hidden;
  gap: 6px;
}
.products.is-list .docLine .miniTag,
.products.is-list .stockMetaLine .miniTag,
.products.is-list .stockMetaLine .badge{
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}
.products.is-list .crit{
  overflow: hidden;
}
.products.is-list .crit__row{
  flex-wrap: nowrap;
  gap: 6px;
  overflow: hidden;
}
.products.is-list .crit__row--tags,
.products.is-list .metaLine{
  display: none;
}
.products.is-list .crit__b{
  padding: 6px 8px;
  font-size: 11px;
  white-space: nowrap;
}
@media (max-width: 900px) {
  .products.is-list .pcard{
    grid-template-columns: 144px minmax(0, 1fr);
    min-height: 176px;
    height: 176px;
  }
  .products.is-list .pcard__img{
    min-height: 176px;
    max-height: 176px;
    padding: 8px;
  }
  .products.is-list .pcard__img img{
    max-height: 124px;
  }
  .products.is-list .pcard__body{
    grid-template-columns: minmax(0, 1fr) 120px;
    padding: 11px 12px;
  }
  .products.is-list .pcard__title{
    height: 34px;
    font-size: 14px;
  }
}
@media (max-width: 760px) {
  .products.is-list .pcard{
    grid-template-columns: 1fr;
    min-height: 0;
    height: auto;
  }
  .products.is-list .pcard__img{
    min-height: 148px;
    max-height: 148px;
  }
  .products.is-list .pcard__img img{
    max-height: 112px;
  }
  .products.is-list .pcard__body{
    grid-template-columns: 1fr;
    gap: 8px;
    padding: 12px;
  }
  .products.is-list .pmeta,
  .products.is-list .docLine,
  .products.is-list .stockMetaLine,
  .products.is-list .crit__row{
    flex-wrap: wrap;
  }
  .products.is-list .metaLine{
    display: flex;
  }
}

/* ===== Home page professional refresh ===== */
.page--home .hero--home{
  padding: 52px 0 18px;
}
.page--home .homeHero{
  align-items: stretch;
}
.page--home .homeHero__copy{
  padding-right: 6px;
}
.page--home .homeHero__pill{
  font-weight: 700;
  background: rgba(37,92,255,.08);
  border-color: rgba(37,92,255,.16);
}
.page--home .homeHero__panel{
  display: flex;
  flex-direction: column;
  gap: 14px;
  background: linear-gradient(180deg, rgba(255,255,255,.82), rgba(255,255,255,.66));
  box-shadow: 0 18px 40px rgba(15,23,42,.08);
}
.page--home .homeHeroStats{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap:10px;
}
.page--home .homeHeroStats .kpi{
  margin-bottom: 0;
}
.page--home .homeFocusBox{
  border:1px solid rgba(15,23,42,.08);
  border-radius: 20px;
  padding: 14px;
  background: rgba(15,23,42,.025);
}
.page--home .homeFocusBox__top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  font-weight: 700;
}
.page--home .homeFocusBox__top span{
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}
.page--home .homeFocusList{
  display:grid;
  gap:8px;
  margin-top: 12px;
}
.page--home .homeFocusItem{
  position:relative;
  padding: 10px 12px 10px 38px;
  border-radius: 16px;
  background: var(--paper);
  border:1px solid rgba(15,23,42,.08);
  font-weight: 600;
}
.page--home .homeFocusItem::before{
  content:'•';
  position:absolute;
  left:14px;
  top:50%;
  transform: translateY(-50%);
  width: 16px;
  height: 16px;
  border-radius: 999px;
  display:flex;
  align-items:center;
  justify-content:center;
  background: rgba(37,92,255,.12);
  color: var(--accent);
  font-weight: 700;
  line-height: 1;
}
.page--home .homeQuickLinks{
  display:grid;
  gap:10px;
}
.page--home .homeQuickLink{
  display:block;
  padding: 14px;
  border-radius: 18px;
  border:1px solid rgba(15,23,42,.08);
  background: rgba(255,255,255,.9);
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.page--home .homeQuickLink:hover{
  transform: translateY(-2px);
  box-shadow: 0 16px 34px rgba(15,23,42,.08);
  border-color: rgba(37,92,255,.2);
}
.page--home .homeQuickLink strong{
  display:block;
  margin-top: 4px;
  font-family: "Space Grotesk", system-ui;
  font-size: 18px;
}
.page--home .homeQuickLink span:last-child{
  display:block;
  margin-top: 6px;
  color: var(--muted);
  line-height: 1.55;
  font-size: 13px;
}
.page--home .homeQuickLink__eyebrow{
  display:inline-flex;
  align-items:center;
  padding: 5px 8px;
  border-radius: 999px;
  background: rgba(15,23,42,.04);
  font-size: 11px;
  font-weight: 700;
  color: var(--muted);
}
.page--home .homeMetricsSection{
  padding-top: 20px;
}
.page--home .homeMetrics{
  display:grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
}
.page--home .homeMetricCard{
  border:1px solid var(--line);
  border-radius: 22px;
  padding: 18px;
  background: rgba(255,255,255,.75);
  box-shadow: 0 12px 28px rgba(15,23,42,.05);
}
.page--home .homeMetricCard__label{
  display:block;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.page--home .homeMetricCard__value{
  display:block;
  margin-top: 8px;
  font-size: clamp(28px, 3vw, 38px);
  line-height: 1;
  font-family: "Space Grotesk", system-ui;
}
.page--home .homeMetricCard p{
  margin: 10px 0 0;
  color: var(--muted);
  line-height: 1.55;
  font-size: 13px;
}
.page--home .homeSolutionGrid{
  gap: 16px;
}
.page--home .homeSolutionCard{
  position:relative;
  overflow:hidden;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.page--home .homeSolutionCard::after{
  content:'';
  position:absolute;
  inset: auto 0 0 0;
  height: 4px;
  background: linear-gradient(90deg, rgba(37,92,255,.9), rgba(0,194,255,.9));
  opacity: 0;
  transition: opacity .18s ease;
}
.page--home .homeSolutionCard:hover{
  transform: translateY(-3px);
  box-shadow: 0 18px 36px rgba(15,23,42,.10);
  border-color: rgba(37,92,255,.18);
}
.page--home .homeSolutionCard:hover::after{
  opacity: 1;
}
.page--home .homeSolutionCard__top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  margin-bottom: 10px;
}
.page--home .homeSolutionCard__icon{
  width: 34px;
  height: 34px;
  border-radius: 12px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background: rgba(37,92,255,.10);
  color: var(--accent);
  font-size: 12px;
  font-weight: 700;
}
.page--home .homeAdvGrid{
  gap: 16px;
}
.page--home .homeAdvCard{
  background: rgba(255,255,255,.8);
}
.page--home .homeAdvCard__eyebrow{
  display:inline-flex;
  width: fit-content;
  padding: 6px 9px;
  border-radius: 999px;
  border: 1px solid rgba(15,23,42,.08);
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.page--home .homeAdvCard h3{
  margin-top: 12px;
}
.page--home .homeTrustRow{
  margin-top: 16px;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
.page--home .homeTrustTag{
  display:inline-flex;
  align-items:center;
  padding: 9px 12px;
  border-radius: 999px;
  border: 1px solid rgba(15,23,42,.08);
  background: rgba(255,255,255,.7);
  font-size: 12px;
  font-weight: 700;
}
.page--home .homeShowcaseCard{
  padding: 0;
  overflow:hidden;
  gap:0;
}
.page--home .homeShowcaseCard__media{
  height: 190px;
  background: linear-gradient(180deg, rgba(37,92,255,.10), rgba(0,194,255,.05));
  display:flex;
  align-items:center;
  justify-content:center;
  padding: 16px;
}
.page--home .homeShowcaseCard__media img{
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  filter: drop-shadow(0 12px 20px rgba(15,23,42,.12));
}
.page--home .homeShowcaseCard__body{
  padding: 16px;
}
.page--home .homeShowcaseCard__meta{
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.page--home .homeShowcaseCard h3{
  margin: 10px 0 0;
  font-family: "Space Grotesk", system-ui;
  font-size: 22px;
  line-height: 1.15;
}
.page--home .homeShowcaseCard .refDesc{
  margin-top: 10px;
  min-height: 44px;
}
.page--home .homeResourceBar{
  background: linear-gradient(90deg, rgba(37,92,255,.06), rgba(0,194,255,.04));
}
.page--home .homeResourceBar__actions{
  justify-content: flex-end;
}
@media (max-width: 1100px) {
  .page--home .homeMetrics{ grid-template-columns: repeat(2, 1fr); }
  .page--home .homeSolutionGrid{ grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 900px) {
  .page--home .hero__inner.homeHero{ grid-template-columns: 1fr; }
  .page--home .homeHero__copy{ padding-right: 0; }
}
@media (max-width: 700px) {
  .page--home .hero--home{ padding-top: 34px; }
  .page--home .homeHeroStats{ grid-template-columns: 1fr; }
  .page--home .homeMetrics{ grid-template-columns: 1fr; }
  .page--home .homeSolutionGrid{ grid-template-columns: 1fr; }
  .page--home .homeAdvGrid{ grid-template-columns: 1fr; }
  .page--home .homeResourceBar,
  .page--home .homeResourceBar__actions{
    flex-direction: column;
    align-items: stretch;
  }
  .page--home .homeResourceBar__actions .btn{
    justify-content: center;
  }
  .page--home .homeShowcaseCard__media{ height: 170px; }
}

/* Sevay logo branding */
.brand{
  gap:10px;
  max-width:380px;
  min-width:0;
}

.brand__logo{
  display:block;
  width:clamp(150px, 18vw, 218px);
  height:auto;
  border-radius:16px;
  border:1px solid rgba(15,23,42,.08);
  box-shadow:0 12px 28px rgba(15,23,42,.10);
  background:#081a46;
}

@media (max-width: 820px) {
  
  .brand{max-width:none;}
  .brand__logo{width:clamp(132px, 36vw, 188px);}
}
@media (max-width: 560px) {
  .brand__logo{width:clamp(118px, 42vw, 164px);}
}

/* ===== Sevay brand subtle polish ===== */
:root{
  --bg:#f7f8fc;
  --paper:#ffffff;
  --ink:#0b1638;
  --muted:#4a566f;
  --line:#d9e1ef;
  --accent:#07194a;
  --accent2:#d7e51f;
  --accent-weak:rgba(7,25,74,.08);
  --accent-weak-2:rgba(215,229,31,.12);
  --shadow:0 16px 38px rgba(7,25,74,.09);
}
body{
  background:
    radial-gradient(920px 560px at 8% 0%, rgba(7,25,74,.11), transparent 60%),
    radial-gradient(760px 520px at 92% 0%, rgba(215,229,31,.08), transparent 56%),
    var(--bg);
}
.header{
  background: rgba(247,248,252,.92);
  border-bottom:1px solid rgba(7,25,74,.08);
}
.brand__logo{
  border-color: rgba(7,25,74,.10);
  box-shadow: 0 14px 30px rgba(7,25,74,.10);
}
.brand__tag,
.header__right .phone{
  border-color: rgba(7,25,74,.10);
  box-shadow: 0 10px 22px rgba(7,25,74,.06);
}
.nav__list a{
  transition: background .16s ease, color .16s ease, border-color .16s ease;
}
.nav__list a:hover{
  color: var(--ink);
  background: rgba(7,25,74,.045);
}
.nav__list a.is-active{
  background: linear-gradient(90deg, rgba(7,25,74,.10), rgba(215,229,31,.12));
  border-color: rgba(7,25,74,.14);
}
.btn,
.pillBtn,
.qf{
  transition: transform .14s ease, background .14s ease, border-color .14s ease, color .14s ease, box-shadow .14s ease;
}
.btn{
  border-color: rgba(7,25,74,.10);
}
.btn:hover{
  border-color: rgba(7,25,74,.26);
  background: rgba(7,25,74,.03);
}
.btn--primary{
  background: linear-gradient(135deg, #07194a, #102c72);
  border-color: rgba(7,25,74,.92);
  color: #ffffff;
  box-shadow: 0 14px 28px rgba(7,25,74,.16);
}
.btn--primary:hover{
  background: linear-gradient(135deg, #06153d, #0d255e);
  border-color: rgba(7,25,74,.98);
  color:#ffffff;
  box-shadow: 0 16px 30px rgba(7,25,74,.20);
}
.btn--danger{
  background: linear-gradient(135deg, #b91c1c, #dc2626);
  border-color: rgba(153,27,27,.92);
  color: #ffffff;
  box-shadow: 0 14px 28px rgba(185,28,28,.18);
}
.btn--danger:hover{
  background: linear-gradient(135deg, #991b1b, #c81e1e);
  border-color: rgba(153,27,27,.98);
  color:#ffffff;
  box-shadow: 0 16px 30px rgba(185,28,28,.22);
}

.hero__panel,
.ctaBar,
.step,
.marquee,
.card,
.tile,
.panel{
  border-color: rgba(7,25,74,.08);
  box-shadow: 0 14px 30px rgba(7,25,74,.06);
}

.kpi__n,
.page--home .homeMetricCard__value,
.page--home .homeShowcaseCard h3{
  color: var(--ink);
}

.page--home .hero--home{
  padding-top: 50px;
  background:
    radial-gradient(980px 560px at 14% 0%, rgba(7,25,74,.14), transparent 58%),
    radial-gradient(820px 520px at 88% 6%, rgba(215,229,31,.10), transparent 54%),
    linear-gradient(180deg, rgba(255,255,255,.55), rgba(255,255,255,.18));
}
.page--home .homeHero__copy h1{
  max-width: 11ch;
  color: var(--ink);
}
.page--home .homeHero__copy p{
  max-width: 62ch;
}
.page--home .homeHero__pill{
  background: linear-gradient(90deg, rgba(7,25,74,.07), rgba(215,229,31,.12));
  border-color: rgba(7,25,74,.12);
  color: var(--ink);
}
.page--home .homeHero__panel{
  border:1px solid rgba(7,25,74,.08);
  background: linear-gradient(180deg, rgba(255,255,255,.92), rgba(246,248,255,.80));
  box-shadow: 0 20px 44px rgba(7,25,74,.08);
}
.page--home .homeHeroStats .kpi{
  background: linear-gradient(180deg, rgba(7,25,74,.03), rgba(255,255,255,.94));
}
.page--home .homeFocusBox{
  border-color: rgba(7,25,74,.08);
  background: linear-gradient(180deg, rgba(7,25,74,.025), rgba(255,255,255,.92));
}
.page--home .homeFocusItem{
  border-color: rgba(7,25,74,.08);
}
.page--home .homeFocusItem::before{
  background: rgba(215,229,31,.18);
  color: #566200;
}
.page--home .homeQuickLink,
.page--home .homeMetricCard,
.page--home .homeAdvCard,
.page--home .homeTrustTag{
  border-color: rgba(7,25,74,.08);
}
.page--home .homeQuickLink:hover,
.page--home .homeSolutionCard:hover{
  border-color: rgba(7,25,74,.16);
  box-shadow: 0 18px 38px rgba(7,25,74,.09);
}
.page--home .homeQuickLink__eyebrow,
.page--home .homeAdvCard__eyebrow{
  background: rgba(7,25,74,.04);
  border-color: rgba(7,25,74,.08);
}
.page--home .homeSolutionCard::after{
  background: linear-gradient(90deg, rgba(7,25,74,.95), rgba(215,229,31,.92));
}
.page--home .homeSolutionCard__icon{
  background: rgba(7,25,74,.08);
  color: var(--accent);
}
.page--home .homeMetricCard{
  background: linear-gradient(180deg, rgba(255,255,255,.88), rgba(248,250,255,.76));
}
.page--home .homeMetricCard__value{
  text-shadow: 0 1px 0 rgba(255,255,255,.6);
}
.page--home .homeShowcaseCard__media,
.page--home .homeResourceBar{
  background: linear-gradient(180deg, rgba(7,25,74,.05), rgba(215,229,31,.06));
}
.footer{
  border-top: 1px solid rgba(7,25,74,.08);
}
@media (max-width: 700px) {
  .page--home .hero--home{ padding-top: 32px; }
  .page--home .homeHero__copy h1{ max-width:none; }
}

/* ===== Header cleanup + compact homepage refresh ===== */
/* 1240px sabit tavan, masaüstü genişliklerde (hamburger menüye düşmeden
   önceki aralıkta) nav menüsünün ("Ana Sayfa"..."İletişim") tüm öğelerini
   tek satırda göstermeye yetecek kadar yer bırakmıyordu — nav içeriği
   kendi kutusundan taşıp (.nav__list'in justify-content:center'ı yüzünden)
   her iki yöne de bindiriyordu; solda logoyla ("Ana Sayfa" yazısının "An"
   kısmı logonun arkasında kalıyordu), sağda telefon alanıyla çakışıyordu.
   1290px, bu taşmayı ortadan kaldıracak asgari pay. */
.header .container.header__inner{
  width:min(1290px, 94vw);
}
.brand{
  gap:0 !important;
  max-width:none !important;
}

.brand__logo{
  width:clamp(112px, 13.8vw, 175px);
  border-radius:12px;
}
.nav{
  min-width:0;
}
.nav__list{
  justify-content:center;
}
@media (max-width: 820px) {
  .brand__logo{ width:clamp(124px, 34vw, 176px); }
}
@media (max-width: 640px) {
  .header .container.header__inner{
    width:min(1240px, 94vw);
  }
  .nav{
    flex:0 0 auto;
  }
}

/* compact homepage */
.page--home .hero--compactHome{
  padding: 34px 0 18px;
  background:
    radial-gradient(960px 520px at 10% 0%, rgba(7,25,74,.10), transparent 58%),
    radial-gradient(760px 420px at 92% 0%, rgba(215,229,31,.07), transparent 56%),
    linear-gradient(180deg, rgba(255,255,255,.65), rgba(255,255,255,.2));
}
.page--home .compactHome{
  display:grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(280px, .85fr);
  gap: 16px;
  align-items: start;
}
.page--home .compactHome__intro{
  min-width: 0;
}
.page--home .compactHome__pill{
  margin-bottom: 10px;
}
.page--home .compactHome__intro h1{
  margin: 0 0 10px;
  max-width: 11ch;
  color: var(--ink);
  font-size: clamp(34px, 4vw, 58px);
  line-height: 1.02;
}
.page--home .compactHome__intro p{
  margin: 0;
  max-width: 60ch;
  color: var(--muted);
  line-height: 1.65;
}
.page--home .compactHome__side{
  border:1px solid rgba(7,25,74,.08);
  border-radius: 20px;
  background: rgba(255,255,255,.88);
  box-shadow: 0 14px 30px rgba(7,25,74,.06);
  padding: 14px;
}
.page--home .compactMiniStats{
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 10px;
}
.page--home .compactMiniStat{
  border:1px solid rgba(7,25,74,.08);
  border-radius: 16px;
  padding: 12px;
  background: linear-gradient(180deg, rgba(7,25,74,.02), rgba(255,255,255,.95));
}
.page--home .compactMiniStat span{
  display:block;
  font-size: 11px;
  font-weight: 700;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .04em;
}
.page--home .compactMiniStat strong{
  display:block;
  margin-top: 8px;
  font-family: "Space Grotesk", system-ui;
  font-size: clamp(24px, 2.4vw, 34px);
  line-height: 1;
  color: var(--ink);
}
.page--home .compactMiniLinks{
  display:grid;
  gap: 8px;
  margin-top: 10px;
}
.page--home .compactMiniLink{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding: 11px 12px;
  border-radius: 14px;
  border:1px solid rgba(7,25,74,.08);
  background: rgba(7,25,74,.02);
  font-weight: 600;
}
.page--home .compactMiniLink::after{
  content:'›';
  color: var(--muted);
  font-size: 16px;
  line-height: 1;
}
.page--home .compactSection{
  padding: 34px 0;
}
.page--home .compactSection--last{
  padding-top: 28px;
  padding-bottom: 50px;
}
.page--home .compactSection__head{
  margin-bottom: 14px;
}
.page--home .compactSection__head h2{
  font-size: clamp(24px, 2.2vw, 30px);
}
.page--home .compactSection__head p{
  margin-top: 6px;
}
.page--home .compactCategoryGrid{
  gap: 12px;
}
.page--home .compactCategoryCard{
  padding: 16px;
  box-shadow: 0 10px 22px rgba(7,25,74,.05);
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.page--home .compactCategoryCard:hover{
  transform: translateY(-2px);
  box-shadow: 0 14px 28px rgba(7,25,74,.08);
  border-color: rgba(7,25,74,.14);
}
.page--home .compactCategoryCard__eyebrow{
  display:inline-flex;
  padding: 6px 9px;
  border-radius: 999px;
  background: rgba(7,25,74,.05);
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.page--home .compactCategoryCard h3{
  margin-top: 12px;
}
.page--home .compactCategoryCard p{
  margin-top: 8px;
}
.page--home #homeProjectShowcase{
  gap: 12px;
}
.page--home .homeShowcaseCard{
  border-radius: 18px;
  box-shadow: 0 10px 22px rgba(7,25,74,.05);
}
.page--home .homeShowcaseCard__media{
  height: 150px;
}
.page--home .homeShowcaseCard__body{
  padding: 14px;
}
.page--home .homeShowcaseCard h3{
  font-size: 19px;
}
.page--home .homeShowcaseCard .refDesc{
  min-height: 0;
  font-size: 13px;
}
.page--home .refActions{
  margin-top: 12px;
}
.page--home .compactResources{
  display:grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 12px;
}
.page--home .compactResource{
  display:flex;
  flex-direction:column;
  gap: 4px;
  padding: 16px;
  border-radius: 18px;
  border:1px solid rgba(7,25,74,.08);
  background: rgba(255,255,255,.86);
  box-shadow: 0 10px 22px rgba(7,25,74,.05);
}
.page--home .compactResource strong{
  font-family: "Space Grotesk", system-ui;
  font-size: 18px;
}
.page--home .compactResource span{
  color: var(--muted);
  font-size: 13px;
  line-height: 1.5;
}
@media (max-width: 980px) {
  .page--home .compactHome{
    grid-template-columns: 1fr;
  }
  .page--home .compactResources{
    grid-template-columns: repeat(2, minmax(0,1fr));
  }
}
@media (max-width: 700px) {
  .page--home .hero--compactHome{
    padding-top: 26px;
  }
  .page--home .compactHome__intro h1{
    max-width: none;
  }
  .page--home .compactMiniStats{
    grid-template-columns: 1fr;
  }
  .page--home .compactResources,
  .page--home .compactCategoryGrid{
    grid-template-columns: 1fr;
  }
  .page--home .compactSection{
    padding: 28px 0;
  }
}

/* Projects page refresh */
.page--projeler .section--projectsTop{ padding-bottom: 4px; }
.page--projeler .section--projectsBody{ padding-top: 4px; }
/* Ekran görüntüsünde kahverengi ile işaretlenen gereksiz boşluklar:
   breadcrumb ile üst panel, üst panel ile filtre/harita alanı arası. */
body.page--projeler .breadcrumb{ margin-bottom: 10px; }
.page--projeler .projectsHero,
.page--projeler .projectsQuick,
.page--projeler .projectFilterCard,
.page--projeler .projectsTrust,
.page--proje-detay .projectDetailHero,
.page--proje-detay .projectGallery{
  border: 1px solid rgba(7,25,74,.08);
  background: rgba(255,255,255,.92);
  box-shadow: 0 12px 28px rgba(7,25,74,.06);
}
.page--projeler .projectsHero{
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 20px;
  padding: 14px 22px;
}
.page--projeler .projectsHero__copy{
  flex: 1 1 auto;
  min-width: 0;
}
.page--projeler .projectsHero__copy h1{
  margin: 6px 0 6px;
  font-family: "Space Grotesk", system-ui;
  font-size: clamp(24px, 2.6vw, 34px);
  line-height: 1.1;
}
.page--proje-detay .projectDetailHero h1{
  margin: 2px 0 4px;
  font-family: "Space Grotesk", system-ui;
  font-size: clamp(19px, 2.4vw, 24px);
  line-height: 1.1;
}
.page--projeler .projectsHero__copy p,
.page--proje-detay .projectDetailHero__copy p{
  margin: 0;
  color: var(--muted);
  line-height: 1.4;
  font-size: 13px;
  max-width: 62ch;
}
.page--projeler .projectsHero__quickLine{
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
}
.page--projeler .projectsStats{
  flex: 0 0 auto;
  width: min(620px, 100%);
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 8px;
}
.page--projeler .projectsStat{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 7px 8px;
  border-radius: 13px;
  border: 1px solid rgba(7,25,74,.08);
  background: linear-gradient(180deg, rgba(7,25,74,.02), rgba(7,25,74,.06));
}
.page--proje-detay .projectDetailFact{
  padding: 8px 10px;
  border-radius: 12px;
  border: 1px solid rgba(7,25,74,.08);
  background: linear-gradient(180deg, rgba(7,25,74,.02), rgba(7,25,74,.06));
}
.page--projeler .projectsStat strong{
  display: block;
  font-family: "Space Grotesk", system-ui;
  font-size: 14px;
  line-height: 1.1;
  color: #07194a;
}
.page--proje-detay .projectDetailFact strong{
  display: block;
  font-family: "Space Grotesk", system-ui;
  font-size: 17px;
  line-height: 1.1;
  color: #07194a;
}
.page--projeler .projectsStat span{
  display: block;
  margin-top: 2px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.2;
  white-space: nowrap;
}
.page--proje-detay .projectDetailFact span{
  display: block;
  margin-top: 2px;
  color: var(--muted);
  font-size: 11px;
}
.page--projeler .projectsQuick{
  margin-top: 14px;
  padding: 14px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}
.page--projeler .projectsQuick__head{
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.page--projeler .projectsQuick__head strong,
.page--projeler .projectFilterCard__head h2,
.page--proje-detay .projectSectionHead h2{
  font-family: "Space Grotesk", system-ui;
}
.page--projeler .projectsQuick__head span,
.page--projeler .projectFilterCard__head p,
.page--projeler .projectSectionHead p,
.page--proje-detay .projectSectionHead p,
.page--projeler .projectsTrust span{
  color: var(--muted);
  font-size: 13px;
}
.page--projeler .projectsLayout{
  display: grid;
  grid-template-columns: minmax(260px, 320px) minmax(0, 1fr);
  gap: 18px;
  align-items: start;
}
.page--projeler .projectFilterCard{
  position: static;
  top: auto;
  padding: 16px;
  border-radius: 22px;
}
.page--projeler .projectFilterCard__head p{ margin: 6px 0 0; }
.page--projeler .projectFilterCard__group + .projectFilterCard__group{ margin-top: 14px; }
.page--projeler .projectFilterCard__row{
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 10px;
}
.page--projeler .projectFilterCard__label,
.page--projeler .projectFilterCard__labelWrap{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 8px;
  font-size: 13px;
  font-weight: 600;
}
.page--projeler .projectTypeChips{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.page--projeler .projectChip,
.page--projeler .toggleFilterBtn{
  border: 1px solid rgba(7,25,74,.1);
  background: rgba(7,25,74,.03);
  border-radius: 999px;
  padding: 8px 11px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-weight: 700;
  cursor: pointer;
  transition: .18s ease;
}
.page--projeler .toggleFilterBtn{
  width: 100%;
  padding: 10px 14px;
}
.page--projeler .projectChip b{
  min-width: 18px;
  padding: 2px 6px;
  border-radius: 999px;
  background: rgba(7,25,74,.08);
  font-size: 11px;
}
.page--projeler .projectChip.is-active,
.page--projeler .toggleFilterBtn.is-active{
  border-color: rgba(7,25,74,.92);
  background: rgba(7,25,74,.92);
  color: #fff;
}
.page--projeler .projectChip.is-active b{
  background: rgba(255,255,255,.16);
}
.page--projeler .filters__meta--stack{
  margin-top: 16px;
  display: grid;
  gap: 10px;
}
.page--projeler #pReset.is-idle{
  opacity: .5;
  pointer-events: none;
}
.page--projeler .projectsContent{ min-width: 0; }
.page--projeler .projectViewbar{
  position: static;
  top: auto;
  z-index: 1;
  margin-bottom: 12px;
  padding: 12px 14px;
  border-radius: 18px;
  background: rgba(255,255,255,.84);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(7,25,74,.08);
}
.page--projeler .projectFeatureWrap[hidden]{ display:none; }
.page--projeler .projectFeatureGrid,
.page--proje-detay .projectUsedGrid{
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 16px;
}
.page--projeler .projectListWrap,
.page--proje-detay .projectUsedSection{ margin-top: 16px; }
.page--projeler .projectSectionHead,
.page--proje-detay .projectSectionHead{ margin-bottom: 12px; }
.page--projeler .projectSectionHead h2,
.page--proje-detay .projectSectionHead h2{ margin-bottom: 4px; }
.page--projeler .projectRefCard,
.page--proje-detay .projectUsedGrid .pcard{ overflow: hidden; }
.page--projeler .projectRefCard .pcard__body{ padding: 16px; }
.page--projeler .projectRefCard .pcard__img{ height: 190px; }
.page--projeler .projectRef__top,
.page--proje-detay .projectDetailHero__actions{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.page--projeler .projectRef__fact{
  margin-top: 10px;
  font-size: 13px;
  font-weight: 700;
  color: rgba(7,25,74,.82);
}
.page--projeler .projectRef__cta{
  margin-top: 12px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-weight: 600;
  color: #07194a;
}
.page--projeler .projectRefCard--featured .pcard__img{ height: 210px; }
.page--projeler .tile--empty{ padding: 22px; }
.page--projeler .projectsTrust{
  margin-top: 16px;
  padding: 14px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.page--projeler .projectsTrust strong{
  font-family: "Space Grotesk", system-ui;
  font-size: 18px;
}

/* Project detail refresh */
.page--proje-detay .section{ padding-top: 24px; }
.page--proje-detay .projectDetailHero{
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(250px, .85fr);
  gap: 18px;
  padding: 24px;
  border-radius: 24px;
}
.page--proje-detay .projectDetailFacts{
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 12px;
}
.page--proje-detay .projectDetailLayout{
  margin-top: 18px;
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(250px, .8fr);
  gap: 18px;
  align-items: start;
}
.page--proje-detay .projectGallery{
  padding: 16px;
  border-radius: 22px;
}
.page--proje-detay .projectGallery__main{
  border-radius: 18px;
  overflow: hidden;
  border: 1px solid rgba(7,25,74,.08);
  background: rgba(7,25,74,.02);
}
.page--proje-detay .projectGallery__main img{
  width: 100%;
  display: block;
  aspect-ratio: 16 / 10;
  object-fit: cover;
}
.page--proje-detay .projectGallery__thumbs{
  margin-top: 12px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.page--proje-detay .projectThumb{
  border: 1px solid rgba(7,25,74,.1);
  background: rgba(7,25,74,.03);
  border-radius: 12px;
  min-width: 42px;
  height: 40px;
  padding: 0 10px;
  font-weight: 600;
  cursor: pointer;
}
.page--proje-detay .projectThumb.is-active{
  background: rgba(7,25,74,.92);
  color: #fff;
  border-color: rgba(7,25,74,.92);
}
.page--proje-detay .projectBlocks{ margin-top: 16px; display: grid; gap: 14px; }
.page--proje-detay .projectInfoBlock{ padding: 18px; }
.page--proje-detay .projectInfoBlock h3{ margin-top: 0; }
.page--proje-detay .projectInfoBlock p{ color: var(--muted); line-height: 1.75; }
.page--proje-detay .projectBullets{
  margin: 10px 0 0;
  padding-left: 18px;
  color: var(--muted);
  line-height: 1.75;
}
.page--proje-detay .projectUsedGrid__img{ height: 140px; }

@media (max-width: 1080px) {
  .page--projeler .projectsHero,
  .page--proje-detay .projectDetailHero,
  .page--proje-detay .projectDetailLayout{
    grid-template-columns: 1fr;
  }
  .page--projeler .projectsLayout{
    grid-template-columns: 1fr;
  }
  .page--projeler .projectFilterCard,
  .page--projeler .projectViewbar{
    position: static;
    top: auto;
  }
  .page--projeler .projectFeatureGrid,
  .page--proje-detay .projectUsedGrid{
    grid-template-columns: repeat(2, minmax(0,1fr));
  }
}
@media (max-width: 760px) {
  .page--projeler .projectsQuick,
  .page--projeler .projectsTrust{
    flex-direction: column;
    align-items: stretch;
  }
  .page--projeler .projectFeatureGrid,
  .page--projeler .projectFilterCard__row,
  .page--proje-detay .projectDetailFacts,
  .page--proje-detay .projectUsedGrid{
    grid-template-columns: 1fr;
  }
  .page--projeler .projectsStats{
    grid-template-columns: repeat(3, minmax(0,1fr));
  }
  .page--projeler .projectViewbar .viewbar__controls{
    width: 100%;
    justify-content: space-between;
    flex-wrap: wrap;
  }
}

/* Projects filter refinement */
.page--projeler .projectChip--all{
  border-style: dashed;
}
.page--projeler .projectChip.is-empty{
  opacity: .72;
}
.page--projeler .projectChip.is-empty:not(.is-active) b{
  background: rgba(7,25,74,.05);
}
.page--projeler .projectFilterCard .input,
.page--projeler .projectFilterCard .select{
  min-height: 46px;
}
.page--projeler .projectFilterCard__group .muted{
  font-size: 12px;
}
.page--projeler .metaLine .btn.btn--ghost{
  padding: 9px 12px;
  border-radius: 999px;
}
.page--projeler .projectRefCard .pcard__desc{
  min-height: 60px;
}
.page--projeler .products.is-list .projectRefCard{
  display: grid;
  grid-template-columns: minmax(180px, 240px) minmax(0, 1fr);
}
.page--projeler .products.is-list .projectRefCard .pcard__img{
  height: 100%;
}

/* Project detail deep refresh */
.page--proje-detay .projectDetailAsideSticky{
  position: sticky;
  top: 94px;
}
.page--proje-detay .projectDetailHero__lead{
  font-size: 15px;
}
.page--proje-detay .projectDetailMetaRow{
  margin-top: 14px;
}
.page--proje-detay .projectGallery__caption{
  margin-top: 12px;
  color: var(--muted);
  font-size: 13px;
}
.page--proje-detay .projectThumb{
  width: 76px;
  height: 54px;
  padding: 0;
  overflow: hidden;
}
.page--proje-detay .projectThumb img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.page--proje-detay .projectCallout{
  margin-top: 14px;
  padding: 12px 14px;
  border-radius: 16px;
  background: rgba(7,25,74,.04);
  border: 1px solid rgba(7,25,74,.08);
  font-weight: 700;
  color: rgba(7,25,74,.84);
}
.page--proje-detay .projectCriteriaList{
  margin-top: 14px;
  display: grid;
  gap: 10px;
}
.page--proje-detay .projectCriteriaItem,
.page--proje-detay .projectResource,
.page--proje-detay .projectStage,
.page--proje-detay .projectInsightCard,
.page--proje-detay .projectTypeRow,
.page--proje-detay .projectRelatedCard{
  border: 1px solid rgba(7,25,74,.08);
  background: rgba(255,255,255,.84);
  border-radius: 18px;
}
.page--proje-detay .projectCriteriaItem{
  padding: 12px 14px;
  line-height: 1.7;
  color: var(--muted);
}
.page--proje-detay .projectProcessGrid,
.page--proje-detay .projectResourceGrid,
.page--proje-detay .projectRelatedGrid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 12px;
}
.page--proje-detay .projectStage,
.page--proje-detay .projectResource{
  padding: 16px;
}
.page--proje-detay .projectStage__num{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 999px;
  margin-bottom: 10px;
  background: #07194a;
  color: #fff;
  font-family: "Space Grotesk", system-ui;
  font-weight: 700;
}
.page--proje-detay .projectStage strong,
.page--proje-detay .projectResource strong,
.page--proje-detay .projectInsightCard strong,
.page--proje-detay .projectTypeRow strong,
.page--proje-detay .projectRelatedCard strong{
  display: block;
  font-family: "Space Grotesk", system-ui;
}
.page--proje-detay .projectStage p,
.page--proje-detay .projectResource p,
.page--proje-detay .projectInsightCard p,
.page--proje-detay .projectTypeRow p,
.page--proje-detay .projectRelatedCard p{
  margin: 8px 0 0;
  color: var(--muted);
  line-height: 1.7;
}
.page--proje-detay .projectInsightStack,
.page--proje-detay .projectTypeList{
  display: grid;
  gap: 12px;
}
.page--proje-detay .projectInsightCard,
.page--proje-detay .projectTypeRow{
  padding: 14px;
}
.page--proje-detay .projectRelatedGrid{
  grid-template-columns: repeat(3, minmax(0,1fr));
}
.page--proje-detay .projectRelatedCard{
  display: grid;
  overflow: hidden;
  text-decoration: none;
}
.page--proje-detay .projectRelatedCard__img{
  height: 160px;
  background: rgba(7,25,74,.03);
}
.page--proje-detay .projectRelatedCard__img img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.page--proje-detay .projectRelatedCard__body{
  padding: 14px;
}
.page--proje-detay .projectRelatedCard__body span{
  display: inline-flex;
  margin-top: 10px;
  font-weight: 600;
  color: #07194a;
}

@media (max-width: 1080px) {
  .page--proje-detay .projectDetailAsideSticky{
    position: static;
    top: auto;
  }
  .page--proje-detay .projectProcessGrid,
  .page--proje-detay .projectResourceGrid,
  .page--proje-detay .projectRelatedGrid{
    grid-template-columns: 1fr;
  }
}
@media (max-width: 760px) {
  .page--projeler .products.is-list .projectRefCard{
    grid-template-columns: 1fr;
  }
  .page--proje-detay .projectThumb{
    width: 62px;
    height: 46px;
  }
}

.page--proje-detay .projectDetailMain{ min-width: 0; }
.page--proje-detay .projectDetailAside{ display: grid; gap: 14px; }

/* Project detail: align closer to product detail page */
.page--proje-detay .detail--project{
  max-width: 1180px;
  margin-left:auto;
  margin-right:auto;
}
.page--proje-detay .detail--project .detail__actions,
.page--proje-detay .detail--project .detail__badges{
  justify-content:flex-start;
}
.page--proje-detay .detail--project .detail__box{
  min-width:0;
}
.page--proje-detay .detail--project .detail__box h1,
.page--proje-detay .detail--project .detail__titleBox h1{
  margin-top:0;
}
/* Başlık/açıklama/etiket kartı artık ürün detayındaki gibi galerinin
   altında (sol sütunda) duruyor — sütun zaten grid gap ile boşluk
   bıraktığı için kartın kendi üst boşluğu (margin-top:14px) tekrarlanmasın. */
.page--proje-detay .detail--project .detail__titleBox{
  margin-top:0;
}
.page--proje-detay .projectFeatureStrip{
  margin-top:12px;
  padding:14px 16px;
  border-radius:18px;
  border:1px solid rgba(7,25,74,.08);
  background: rgba(7,25,74,.03);
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap:10px;
}
.page--proje-detay .projectQuickItem{
  min-width:0;
}
.page--proje-detay .projectQuickItem strong{
  display:block;
  font-size:12px;
  color: var(--muted);
  font-weight: 600;
}
.page--proje-detay .projectQuickItem span{
  display:block;
  margin-top:6px;
  font-family: "Space Grotesk", system-ui;
  font-size:16px;
  line-height:1.35;
  color:#07194a;
  font-weight:700;
}
.page--proje-detay .projectSpecGrid{
  display:grid;
  gap:10px;
}
.page--proje-detay .spec--stack{
  align-items:flex-start;
  flex-direction:column;
  gap:6px;
}
.page--proje-detay .spec--stack span{
  width:100%;
}
.page--proje-detay .spec:not(.spec--stack) span{
  text-align: right;
}
/* Proje Bilgileri: her satırı ayrı bir "chip" kutusu olarak değil, ince
   ayraçlarla bölünmüş tek bir liste olarak göster — daha sakin ve
   Proje Süreci zaman çizelgesiyle tutarlı bir görünüm sağlar. */
.page--proje-detay .specs{
  gap: 0;
}
.page--proje-detay .specs .spec{
  border: none;
  border-radius: 0;
  background: transparent;
  padding: 12px 2px;
  border-bottom: 1px solid var(--line);
}
.page--proje-detay .specs .spec:hover{
  background: rgba(15,23,42,.02);
}
.page--proje-detay .specs .spec:first-child{
  padding-top: 2px;
}
.page--proje-detay .specs .spec:last-child{
  border-bottom: none;
  padding-bottom: 2px;
}
.page--proje-detay .projectBulletList{
  margin:0;
  padding-left:18px;
  display:grid;
  gap:8px;
  color: var(--muted);
  line-height:1.7;
}
/* Proje Süreci: "Kapsam ve Teslim İçeriği" adımlarını (Keşif, Ürün Seçimi,
   Teknik Doküman, Uygulama Yönlendirmesi) numaralı, bağlantı çizgili bir
   akış olarak gösterir — önceki 2x2 kutu ızgarasına göre daha okunaklı ve
   sıralı bir anlatım sağlar. */
.page--proje-detay .projectTimeline{
  margin:0;
  padding:0;
  list-style:none;
  display:grid;
  gap:0;
}
.page--proje-detay .projectTimeline__item{
  position:relative;
  display:grid;
  grid-template-columns:28px 1fr;
  gap:14px;
  padding-bottom:18px;
}
.page--proje-detay .projectTimeline__item:last-child{
  padding-bottom:0;
}
.page--proje-detay .projectTimeline__item:not(:last-child)::before{
  content:"";
  position:absolute;
  left:13px;
  top:28px;
  bottom:2px;
  width:2px;
  background: rgba(37,92,255,.16);
}
.page--proje-detay .projectTimeline__num{
  display:flex;
  align-items:center;
  justify-content:center;
  width:28px;
  height:28px;
  border-radius:50%;
  background: linear-gradient(135deg, var(--accent), var(--accent2));
  color:#fff;
  font-weight:700;
  font-size:12px;
  flex-shrink:0;
}
.page--proje-detay .projectTimeline__body strong{
  display:block;
  color: var(--ink);
  margin-bottom:3px;
}
.page--proje-detay .projectTimeline__body p{
  margin:0;
  color: var(--muted);
  line-height:1.65;
  font-size:14px;
}
.page--proje-detay .projectNoteBlock{
  margin-top:16px;
  padding-top:14px;
  border-top:1px solid var(--line);
}
.page--proje-detay .projectNoteBlock__title{
  display:block;
  color: var(--ink);
  margin-bottom:8px;
}
.page--proje-detay .projectInlineSection + .projectInlineSection{
  margin-top:16px;
}
.page--proje-detay .projectSimilarGrid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap:16px;
}
.page--proje-detay .projectSimilarCard .pcard__img{
  height: 190px;
}
.page--proje-detay .projectSimilarCard .pcard__img img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.page--proje-detay .projectInlineSection .head{
  margin-bottom:12px;
}
.page--proje-detay .projectInlineSection .head h2{
  margin-bottom:4px;
}
@media (max-width: 980px) {
  .page--proje-detay .projectFeatureStrip,
  .page--proje-detay .projectSimilarGrid{
    grid-template-columns: 1fr;
  }
}

/* ===== Projects alignment cleanup ===== */
.header .container.header__inner{
  align-items:center;
  gap:16px;
}
.header .nav{
  min-width:0;
  flex:1 1 auto;
}
.header .nav__list{
  align-items:center;
}
.header .header__right{
  display:flex;
  justify-content:flex-end;
  align-items:center;
}

.page--projeler .projectsLayout{
  grid-template-columns: minmax(280px, 320px) minmax(0, 1fr);
  gap: 20px;
  align-items: start;
}
.page--projeler .projectsContent,
.page--projeler .projectListWrap,
.page--projeler .projectFeatureWrap{
  min-width: 0;
}
.page--projeler .projectFilterCard{
  display: grid;
  gap: 14px;
  align-content: start;
}
.page--projeler .projectFilterCard__group,
.page--projeler .projectFilterCard__group + .projectFilterCard__group{
  margin-top: 0;
}
.page--projeler .projectFilterCard__row{
  align-items: end;
}
.page--projeler .projectFilterCard .input,
.page--projeler .projectFilterCard .select,
.page--projeler .projectFilterCard .btn,
.page--projeler .projectFilterCard .toggleFilterBtn{
  width: 100%;
}
.page--projeler .projectFilterCard .filters__meta--stack{
  margin-top: 2px;
}
.page--projeler .projectViewbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 12px;
}
.page--projeler .projectViewbar .viewbar__left{
  min-width: 0;
  flex: 1 1 auto;
}
.page--projeler .projectViewbar .viewbar__controls{
  justify-content: flex-end;
  align-items: center;
}
.page--projeler #pActive.metaLine{
  margin-bottom: 4px;
  align-items: center;
}
.page--projeler .projectFeatureGrid,
.page--projeler #projectList.products{
  align-items: stretch;
}
.page--projeler .projectRefCard,
.page--projeler #projectList.products .projectRefCard{
  display: flex;
  flex-direction: column;
  height: 100%;
}
.page--projeler .projectRefCard .pcard__body{
  display: flex;
  flex-direction: column;
  gap: 10px;
  flex: 1 1 auto;
}
.page--projeler .projectRefCard .pmeta,
.page--projeler .projectRefCard .metaLine--strong{
  margin-top: 0;
}
.page--projeler .projectRef__fact{
  margin-top: 0;
}
.page--projeler .projectRef__cta{
  margin-top: auto;
  padding-top: 2px;
}
.page--projeler .products.is-list .projectRefCard{
  align-items: stretch;
}
.page--projeler .products.is-list .projectRefCard .pcard__body{
  justify-content: center;
}
.page--projeler .projectsTrust{
  align-items: flex-start;
}

.page--proje-detay .detail--project{
  grid-template-columns: minmax(0, 1.08fr) minmax(320px, .92fr);
  gap: 18px;
  align-items: start;
}
.page--proje-detay .detail--project > div:first-child,
.page--proje-detay .detail--project .detail__box{
  min-width: 0;
}
.page--proje-detay .detail--project > div:first-child{
  display: grid;
  gap: 12px;
  align-content: start;
}
.page--proje-detay .detail--project .detail__actions,
.page--proje-detay .detail--project .detail__badges{
  margin-bottom: 0;
}
.page--proje-detay .detail--project .detail__media{
  min-height: 0;
  padding: 16px;
}
.page--proje-detay .detail--project .gallery__thumbs{
  justify-content: flex-start;
}
.page--proje-detay .projectFeatureStrip{
  align-items: stretch;
  margin-top: 18px;
}
.page--proje-detay .projectQuickItem{
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 84px;
}
.page--proje-detay .detail--project .detail__box{
  display: grid;
  gap: 14px;
  align-content: start;
}
.page--proje-detay .detail--project .detail__box .pmeta,
.page--proje-detay .detail--project .detail__box [style*="margin-top:14px"]{
  margin-top: 0 !important;
}
.page--proje-detay .detail--project .detail__box details{
  margin: 0;
}
.page--proje-detay .projectSpecGrid{
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
}
.page--proje-detay .projectInlineSection .products,
.page--proje-detay .projectSimilarGrid{
  align-items: stretch;
}
.page--proje-detay .projectInlineSection .pcard,
.page--proje-detay .projectSimilarCard{
  display: flex;
  flex-direction: column;
  height: 100%;
}
.page--proje-detay .projectInlineSection .pcard__body,
.page--proje-detay .projectSimilarCard .pcard__body{
  display: flex;
  flex-direction: column;
  gap: 10px;
  flex: 1 1 auto;
}
.page--proje-detay .projectInlineSection .pcard__desc,
.page--proje-detay .projectSimilarCard .pcard__desc{
  margin-top: 0;
}
.page--proje-detay .projectInlineSection .pcard__cta,
.page--proje-detay .projectSimilarCard .pcard__cta{
  margin-top: auto;
  padding-top: 2px;
}

@media (max-width: 1080px) {
  .page--projeler .projectsLayout,
  .page--proje-detay .detail--project{
    grid-template-columns: 1fr;
  }
  .page--projeler .projectFilterCard{
    gap: 12px;
  }
}
@media (max-width: 760px) {
  .page--projeler .projectViewbar,
  .page--projeler .projectViewbar .viewbar__controls{
    align-items: stretch;
  }
  .page--projeler .projectViewbar .viewbar__controls > *{
    width: 100%;
  }
  .page--projeler .projectFilterCard__row,
  .page--proje-detay .projectSpecGrid,
  .page--proje-detay .projectFeatureStrip{
    grid-template-columns: 1fr;
  }
  .page--proje-detay .projectQuickItem{
    min-height: 0;
  }
}

/* ===== Micro polish: spacing, heading alignment, mobile header ===== */
.page--projeler .projectFeatureGrid,
.page--projeler #projectList.products,
.page--proje-detay .projectInlineSection .products,
.page--proje-detay .projectSimilarGrid{
  gap: 18px;
}

.page--projeler .projectRefCard .pcard__body,
.page--proje-detay .projectInlineSection .pcard__body,
.page--proje-detay .projectSimilarCard .pcard__body{
  padding: 18px;
  gap: 12px;
}

.page--projeler .projectRef__top,
.page--projeler .projectRefCard .pmeta,
.page--projeler .projectRefCard .metaLine--strong,
.page--proje-detay .projectInlineSection .pmeta,
.page--proje-detay .projectSimilarCard .pmeta{
  gap: 6px;
}

.page--projeler .projectRefCard .pcard__title,
.page--proje-detay .projectInlineSection .pcard__title,
.page--proje-detay .projectSimilarCard .pcard__title,
.page--proje-detay .detail--project .detail__box h1,
.page--proje-detay .detail--project .detail__titleBox h1,
.page--projeler .projectFilterCard__head h2,
.page--projeler .projectSectionHead h2,
.page--proje-detay .projectInlineSection .head h2,
.page--proje-detay .projectSectionHead h2{
  line-height: 1.22;
  letter-spacing: -.02em;
  text-wrap: balance;
}

.page--projeler .projectRefCard .pcard__title,
.page--proje-detay .projectInlineSection .pcard__title,
.page--proje-detay .projectSimilarCard .pcard__title{
  min-height: calc(1.22em * 2);
}

.page--projeler .projectFilterCard__head h2,
.page--projeler .projectSectionHead h2,
.page--proje-detay .projectInlineSection .head h2,
.page--proje-detay .projectSectionHead h2{
  margin: 0;
}

.page--projeler .projectFilterCard__head p,
.page--projeler .projectSectionHead p,
.page--proje-detay .projectInlineSection .head p,
.page--proje-detay .projectSectionHead p,
.page--proje-detay .detail--project .detail__box .lead{
  margin: 6px 0 0;
  line-height: 1.62;
  max-width: 58ch;
}

.page--projeler .projectRefCard .pcard__desc,
.page--proje-detay .projectInlineSection .pcard__desc,
.page--proje-detay .projectSimilarCard .pcard__desc{
  line-height: 1.62;
}

.page--projeler .projectRef__fact,
.page--projeler .projectRef__cta,
.page--proje-detay .projectInlineSection .pcard__cta,
.page--proje-detay .projectSimilarCard .pcard__cta{
  line-height: 1.45;
}

.page--projeler .projectViewbar{
  padding: 13px 15px;
}

.page--projeler .projectViewbar .viewbar__left,
.page--projeler .projectViewbar .viewbar__controls{
  row-gap: 8px;
}

.header .container.header__inner{
  gap: 14px;
}

.header .header__right .phone,
.header .nav__btn{
  min-height: 42px;
}

@media (max-width: 820px) {
  .header .container.header__inner{
    gap: 10px;
    padding-top: 8px;
    padding-bottom: 8px;
  }

  .brand__logo{
    width: clamp(90px, 24vw, 125px);
  }

  .header .header__right .phone,
  .header .nav__btn{
    border-radius: 12px;
  }

  .header .header__right .phone{
    padding: 9px 11px;
  }

  .header .nav__btn{
    width: 42px;
    height: 42px;
  }

  .page--projeler .projectRefCard .pcard__body,
  .page--proje-detay .projectInlineSection .pcard__body,
  .page--proje-detay .projectSimilarCard .pcard__body{
    padding: 16px;
  }
}

@media (max-width: 640px) {
  .header .container.header__inner{
    gap: 8px;
  }

  .brand__logo{
    width: clamp(82px, 22.4vw, 109px);
    border-radius: 10px;
  }

  .header .nav{
    flex: 0 0 auto;
  }

  .header .nav__btn{
    width: 40px;
    height: 40px;
    padding: 0;
  }

  .header .header__right .phone{
    min-height: 40px;
    padding: 8px 10px;
    font-size: 13px;
  }

  .header .nav__list{
    top: calc(100% + 8px);
    min-width: min(88vw, 320px);
    max-height: calc(100vh - 92px);
    overflow: auto;
  }

  .page--projeler .projectFeatureGrid,
  .page--projeler #projectList.products,
  .page--proje-detay .projectInlineSection .products,
  .page--proje-detay .projectSimilarGrid{
    gap: 14px;
  }

  .page--projeler .projectRefCard .pcard__title,
  .page--proje-detay .projectInlineSection .pcard__title,
  .page--proje-detay .projectSimilarCard .pcard__title{
    min-height: 0;
  }
}

/* Hakkımızda sayfası yenileme */

.eyebrow{
  display:inline-flex;
  align-items:center;
  gap: 8px;
  font-size: 11px;
  letter-spacing: .12em;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--muted);
}

.aboutQuickLinks .tile--link{
  min-height: 62px;
}

/* =====================================================
   İletişim (Levent esinli, formsuz)
   ===================================================== */
body.page--iletisim .hero--contact{ padding-top: 28px; }
body.page--iletisim .contactHero{ gap: 18px; align-items: stretch; }
body.page--iletisim .contactHeroKpis{
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 10px;
  margin-top: 12px;
}
body.page--iletisim .contactSummary{
  display:grid;
  gap: 14px;
  align-content:start;
}
body.page--iletisim .contactInfoList{
  display:grid;
  gap: 0;
}
body.page--iletisim .contactInfoRow{
  display:grid;
  gap: 4px;
  padding: 10px 0;
  border-bottom: 1px dashed rgba(15,23,42,.12);
}
body.page--iletisim .contactInfoRow:last-child{ border-bottom: none; }
body.page--iletisim .contactInfoRow span{
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .25px;
  text-transform: uppercase;
  color: var(--muted);
}
body.page--iletisim .contactInfoRow strong,
body.page--iletisim .contactInfoRow strong a{
  color: var(--ink);
  text-decoration: none;
  line-height: 1.55;
}
body.page--iletisim .channelCard p{ margin-bottom: 12px; }
body.page--iletisim .channelVal a{
  color: inherit;
  text-decoration: none;
}
body.page--iletisim .quickLinkCard{
  display:block;
  color: inherit;
  text-decoration: none;
}
body.page--iletisim .quickLinkCard:hover h3{ color: var(--accent); }
@media (max-width: 980px) {
  body.page--iletisim .contactHeroKpis{ grid-template-columns: 1fr; }
}

/* ===== Docs pages refresh (2026-03-02) ===== */

.docsMiniCard.is-disabled{ opacity: .7; }

.docTile__summary{
  color: var(--muted);
  font-size: 12px;
  line-height: 1.5;
  font-weight: 600;
  min-height: 36px;
}
.docTile__dl::before{
  content:'';
  width: 18px;
  height: 18px;
  display:block;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M12 3v10m0 0l4-4m-4 4l-4-4' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M4 17v3h16v-3' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M12 3v10m0 0l4-4m-4 4l-4-4' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M4 17v3h16v-3' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}
.docsQuickLinks{
  margin-top: 14px;
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

@media (max-width: 980px) {
  
  .docsMiniList,
  .docsQuickLinks{ grid-template-columns: 1fr; }
}

/* ===== Home page conversion polish ===== */
.page--home .hero--compactHome{
  padding: 42px 0 22px;
  background:
    radial-gradient(1040px 560px at 10% 0%, rgba(7,25,74,.13), transparent 58%),
    radial-gradient(780px 460px at 90% 4%, rgba(215,229,31,.09), transparent 56%),
    linear-gradient(180deg, rgba(255,255,255,.8), rgba(255,255,255,.28));
}
.page--home .compactHome{
  gap: 22px;
  align-items: stretch;
}
.page--home .compactHome__intro{
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 6px 0;
}
.page--home .compactHome__pill{
  margin-bottom: 12px;
}
.page--home .compactHome__intro h1{
  margin: 0 0 12px;
  max-width: 13.5ch;
  font-size: clamp(38px, 4.5vw, 64px);
  line-height: 1.01;
  letter-spacing: -.03em;
}
.page--home .compactHome__intro p{
  max-width: 58ch;
  font-size: 15px;
}
.page--home .hero__cta{
  gap: 12px;
  margin-top: 16px;
}
.page--home .compactHome__trust{
  margin-top: 16px;
}
.page--home .compactHome__trust .homeTrustTag{
  background: rgba(255,255,255,.82);
  border-color: rgba(7,25,74,.10);
  box-shadow: 0 10px 24px rgba(7,25,74,.05);
}
.page--home .compactHome__side{
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 18px;
  border-radius: 24px;
  border: 1px solid rgba(7,25,74,.08);
  background: linear-gradient(180deg, rgba(255,255,255,.94), rgba(247,249,255,.88));
  box-shadow: 0 20px 38px rgba(7,25,74,.07);
}
.page--home .compactHome__side::before{
  content: '';
  position: absolute;
  inset: 0 0 auto auto;
  width: 180px;
  height: 180px;
  background: radial-gradient(circle, rgba(215,229,31,.18), transparent 70%);
  pointer-events: none;
}
.page--home .compactSideHead,
.page--home .compactMiniStats,
.page--home .compactMiniLinks,
.page--home .compactSideNote{
  position: relative;
  z-index: 1;
}
.page--home .compactSideHead{
  display: grid;
  gap: 6px;
}
.page--home .compactSideHead__eyebrow{
  display: inline-flex;
  width: fit-content;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(7,25,74,.05);
  border: 1px solid rgba(7,25,74,.08);
  color: var(--muted);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.page--home .compactSideHead strong{
  font-family: "Space Grotesk", system-ui;
  font-size: clamp(22px, 2.2vw, 28px);
  line-height: 1.08;
  color: var(--ink);
}
.page--home .compactSideHead p{
  margin: 0;
  color: var(--muted);
  line-height: 1.55;
  font-size: 13px;
}
.page--home .compactMiniStats{
  gap: 12px;
}
.page--home .compactMiniStat{
  min-height: 92px;
  border-radius: 18px;
  padding: 14px;
  background: linear-gradient(180deg, rgba(7,25,74,.03), rgba(255,255,255,.98));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.9);
}
.page--home .compactMiniStat strong{
  margin-top: 10px;
}
.page--home .compactMiniLinks{
  gap: 10px;
  margin-top: 0;
}
.page--home .compactMiniLink{
  padding: 12px 14px;
  border-radius: 16px;
  background: rgba(255,255,255,.84);
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.page--home .compactMiniLink:hover{
  transform: translateY(-2px);
  border-color: rgba(7,25,74,.16);
  box-shadow: 0 12px 24px rgba(7,25,74,.06);
}
.page--home .compactSideNote{
  display: grid;
  gap: 6px;
  padding: 14px;
  border-radius: 18px;
  border: 1px solid rgba(7,25,74,.08);
  background: linear-gradient(180deg, rgba(7,25,74,.035), rgba(255,255,255,.96));
}
.page--home .compactSideNote span{
  font-size: 11px;
  font-weight: 700;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .04em;
}
.page--home .compactSideNote strong{
  font-size: 14px;
  line-height: 1.5;
  color: var(--ink);
}
.page--home .compactSection__head{
  margin-bottom: 16px;
}
.page--home .compactCategoryCard,
.page--home .compactResource,
.page--home .homeShowcaseCard{
  border-color: rgba(7,25,74,.08);
}
.page--home .compactCategoryCard h3,
.page--home .compactResource strong,
.page--home .homeShowcaseCard h3{
  letter-spacing: -.01em;
}
@media (max-width: 980px) {
  .page--home .compactHome__intro h1{
    max-width: 11.5ch;
  }
}
@media (max-width: 700px) {
  .page--home .hero--compactHome{
    padding-top: 28px;
  }
  .page--home .compactHome__intro{
    padding: 0;
  }
  .page--home .compactHome__intro h1{
    max-width: none;
    font-size: clamp(34px, 10vw, 52px);
  }
  .page--home .compactHome__trust{
    gap: 8px;
  }
  .page--home .compactHome__trust .homeTrustTag{
    width: fit-content;
  }
}

/* --- site enhancements --- */
.enhCard{
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:20px;
  box-shadow:0 12px 28px rgba(15,23,42,.06);
  padding:16px;
  margin:14px 0;
}
.enhCard__head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  margin-bottom:12px;
}
.enhCard__head .btn{
  flex: 0 0 auto;
  white-space: nowrap;
}
.enhCard__head h3{margin:4px 0 0;font-size:18px}
.enhCard__head p{margin:6px 0 0;color:var(--muted);font-size:13px;line-height:1.5}
.enhCard__head--compact{margin-bottom:10px}
.projectMapViewToggle{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  flex:0 0 auto;
}
@media (max-width: 420px){
  .projectMapViewToggle{width:100%}
  .projectMapViewToggle .btn{flex:1 1 auto}
}
.enhEyebrow{
  display:inline-flex;
  align-items:center;
  padding:6px 10px;
  border-radius:999px;
  font-size:11px;
  font-weight:600;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:var(--accent);
  background:rgba(37,92,255,.08);
}
.enhCount{
  white-space:nowrap;
  font-weight:600;
  font-size:13px;
  padding:10px 12px;
  border-radius:999px;
  border:1px solid rgba(37,92,255,.16);
  background:rgba(37,92,255,.06);
}
.enhActionRow{display:flex;align-items:center;gap:10px}
.enhActionRow--wrap{flex-wrap:wrap}
.enhHint{margin-top:10px;color:var(--muted);font-size:12px;line-height:1.5}

.projectMap{
  position:relative;
  min-height:360px;
  border-radius:18px;
  border:1px solid rgba(37,92,255,.14);
  background:#dbeafe;
  overflow:hidden;
}
.projectMap .leaflet-control-attribution{font-size:11px}
.projectMap .leaflet-popup-content{margin:8px 10px;line-height:1.45}
.projectMapFallback{
  min-height:360px;
  display:grid;
  place-items:center;
  text-align:center;
  padding:24px;
  color:var(--muted);
  background:linear-gradient(180deg, rgba(255,255,255,.88), rgba(219,234,254,.92));
}

.projectFilterCard__group--enh{margin-top:8px;padding-top:4px;border-top:1px solid rgba(15,23,42,.06)}
.projectFilterCard__row--enh{align-items:flex-end}
.projectTypeVisuals{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(132px,1fr));
  gap:10px;
  margin-top:12px;
}
.projectTypeVisual{
  border:1px solid var(--line);
  border-radius:16px;
  background:rgba(15,23,42,.02);
  padding:12px;
  text-align:left;
  cursor:pointer;
  display:grid;
  gap:4px;
}
.projectTypeVisual span{font-size:13px;font-weight:700}
.projectTypeVisual b{font-size:12px;color:var(--muted)}
.projectTypeVisual.is-active{
  border-color:rgba(37,92,255,.28);
  background:linear-gradient(90deg, rgba(37,92,255,.08), rgba(0,194,255,.08));
}
.is-extra-hidden{display:none !important}

.enhTable{width:100%;border-collapse:collapse;table-layout:fixed}
.enhTable th,.enhTable td{
  padding:12px 14px;
  border-bottom:1px solid var(--line);
  text-align:left;
  font-size:13px;
  word-break:break-word;
  overflow-wrap:anywhere;
}
.enhTable th{font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}

.siteSearch{position:relative}
.siteSearch__results{
  position:absolute;
  top:calc(100% + 10px);
  left:0;
  right:0;
  z-index:25;
  padding:8px;
  border-radius:18px;
  border:1px solid var(--line);
  background:var(--paper);
  box-shadow:0 20px 40px rgba(15,23,42,.12);
}
.siteSearch__item{
  display:grid;
  gap:4px;
  padding:12px 12px;
  border-radius:14px;
}
.siteSearch__item:hover{background:rgba(15,23,42,.04)}
.siteSearch__badge{
  display:inline-flex;
  width:max-content;
  padding:4px 8px;
  border-radius:999px;
  background:rgba(37,92,255,.08);
  color:var(--accent);
  font-size:11px;
  font-weight:600;
}
.siteSearch__item strong{font-size:14px}
.siteSearch__item small,.siteSearch__empty{color:var(--muted);font-size:12px;line-height:1.5}
.siteSearch__empty{padding:12px}
.enhCard--homeSearch{margin-top:14px;max-width:760px}

.docTile{position:relative}
.docTileEnh{
  position:absolute;
  pointer-events:none;
  top:10px;
  left:10px;
  right:52px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  z-index:2;
}
.docTileEnh__check{
  pointer-events:auto;
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:6px;
  border-radius:999px;
  background:rgba(255,255,255,.92);
  box-shadow:0 8px 16px rgba(15,23,42,.08);
}
.docTileEnh__check input{margin:0}
.docTileEnh__check span{display:block;width:10px;height:10px}
.docTileEnh__btn{
  pointer-events:auto;
  border:0;
  padding:7px 10px;
  border-radius:999px;
  font-size:11px;
  font-weight:600;
  cursor:pointer;
  background:rgba(15,23,42,.78);
  color:#fff;
}
.docVersionBadge,.docImportanceBadge{
  display:inline-flex;
  align-items:center;
  padding:5px 9px;
  border-radius:999px;
  font-size:11px;
  font-weight:600;
  margin:0 0 8px;
}
.docVersionBadge.is-current{background:rgba(22,163,74,.12);color:#166534}
.docVersionBadge.is-archive{background:rgba(148,163,184,.16);color:#334155}
.docImportanceBadge{margin-right:6px}
.docImportanceBadge.is-critical{background:rgba(239,68,68,.10);color:#991b1b}
.docImportanceBadge.is-tech{background:rgba(37,92,255,.10);color:#1d4ed8}
.docImportanceBadge.is-info{background:rgba(148,163,184,.16);color:#334155}
.docPreviewOverlay{
  position:fixed;
  inset:0;
  z-index:110;
}
.docPreviewOverlay__backdrop{
  position:absolute;
  inset:0;
  background:rgba(2,6,23,.62);
  backdrop-filter:blur(4px);
}
.docPreviewOverlay__panel{
  position:relative;
  width:min(1080px, calc(100vw - 24px));
  max-height:calc(100vh - 24px);
  margin:12px auto;
  border-radius:20px;
  background:var(--paper);
  border:1px solid rgba(255,255,255,.24);
  overflow:hidden;
  display:flex;
  flex-direction:column;
}
.docPreviewOverlay__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:14px 16px;
  border-bottom:1px solid var(--line);
}
.docPreviewOverlay__body{padding:0;min-height:70vh;background:#eef2ff}
.docPreviewFrame{display:block;width:100%;height:72vh;border:0;background:#fff}
.docPreviewImage{display:block;max-width:100%;max-height:72vh;margin:0 auto;padding:18px}
.docPreviewFallback{padding:24px}

.legalUtilityRow{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:10px;
  margin-top:14px;
}

@media (max-width: 900px) {
  .enhCard__head{flex-direction:column}
  .docTileEnh{right:10px}
  .projectMap{min-height:320px}
}
@media (max-width: 640px) {
  
  .projectTypeVisuals{grid-template-columns:1fr 1fr}
  .docPreviewOverlay__panel{width:calc(100vw - 12px);margin:6px auto;max-height:calc(100vh - 12px)}
  .docPreviewFrame,.docPreviewImage{height:66vh;max-height:66vh}
}

/* --- premium polish v3 --- */

/* Toplu seçim kartı — artık viewbar (görünüm/sıralama) satırında,
   yalnızca ürün seçiliyken görünen küçük/minimal bir çubuk. */
.stockBulkMini{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  padding:6px 6px 6px 12px;
  border-radius:999px;
  border:1px solid rgba(37,92,255,.18);
  background:linear-gradient(90deg, rgba(37,92,255,.07), rgba(0,194,255,.05));
  box-shadow:0 6px 16px rgba(15,23,42,.05);
}
.stockBulkMini__count{
  white-space:nowrap;
  font-weight:600;
  font-size:12px;
  color:var(--accent);
}
.stockBulkMini__actions{
  display:flex;
  align-items:center;
  gap:6px;
  flex-wrap:wrap;
}
.stockBulkMini__btn{
  appearance:none;
  border:1px solid rgba(15,23,42,.10);
  background:#fff;
  color:var(--ink);
  font-family:inherit;
  font-weight:700;
  font-size:11px;
  line-height:1;
  padding:8px 10px;
  border-radius:999px;
  cursor:pointer;
  white-space:nowrap;
  transition:transform .12s ease, border-color .12s ease, background .12s ease, color .12s ease, box-shadow .12s ease;
}
.stockBulkMini__btn:hover{
  transform:translateY(-1px);
  border-color:rgba(37,92,255,.3);
}
.stockBulkMini__btn:disabled{
  opacity:.5;
  cursor:default;
  transform:none;
}
.stockBulkMini__btn--primary{
  background:linear-gradient(90deg, rgba(37,92,255,.98), rgba(0,194,255,.92));
  border-color:transparent;
  color:#fff;
  box-shadow:0 8px 18px rgba(37,92,255,.18);
}
.stockBulkMini__btn--primary:hover{
  box-shadow:0 10px 22px rgba(37,92,255,.24);
}
.stockBulkMini__compareBtn{
  border-radius:999px !important;
  padding:8px 10px !important;
  font-size:11px !important;
}
@media (max-width: 760px) {
  .stockBulkMini{
    width:100%;
    justify-content:space-between;
  }
}

.projectMap{
  border-color:rgba(37,92,255,.18);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.45), 0 16px 34px rgba(15,23,42,.08);
}
.projectMap .leaflet-popup-content-wrapper{
  border-radius:14px;
  box-shadow:0 16px 30px rgba(15,23,42,.16);
}
.projectMap .leaflet-popup-tip{box-shadow:none}
/* Pin'in sağında beliren küçük proje kartı (ad, tarih, resim, şehir) */
.projectMap .leaflet-popup.projectMapPopup--card .leaflet-popup-content-wrapper{
  padding:0;
  border-radius:12px;
  overflow:hidden;
}
.projectMap .leaflet-popup.projectMapPopup--card .leaflet-popup-content{
  margin:0;
  width:auto !important;
}
.projectMapMarker,
.projectMap .leaflet-marker-icon.projectMapMarker{
  background:transparent !important;
  border:0 !important;
  overflow:visible !important;
}
.projectMapPin{
  position:relative;
  display:block;
  width:26px;
  height:34px;
  transform-origin:50% 100%;
  transition:transform .16s ease, filter .16s ease;
}
.projectMapPin::before{
  content:'';
  position:absolute;
  top:0;
  left:50%;
  width:26px;
  height:26px;
  margin-left:-13px;
  border-radius:50% 50% 50% 0;
  transform:rotate(-45deg);
  background:linear-gradient(135deg, #24406E, #0F1E3D);
  box-shadow:0 10px 18px rgba(15,23,42,.28);
  border:2px solid #fff;
}
.projectMapPin__dot{
  position:absolute;
  top:7px;
  left:50%;
  width:8px;
  height:8px;
  margin-left:-4px;
  border-radius:50%;
  background:#fff;
  z-index:1;
}
/* Kategoriye göre pin rengi: proje kartlarındaki (.pcard__badge--cN) AYNI
   vurgu renkleri, sadece gerçekten ayırt edici olan c1-c5 için burada da
   kullanılır — c0/c6/c7+ kategoriler kartlarda olduğu gibi haritada da
   varsayılan (yukarıdaki mavi) pin rengiyle kalır, aşırı renk çeşitliliğine
   gidilmez. Sınıf adı js/site-enhancements.js#pinAccentClass tarafından
   eklenir. */
.projectMapPin--c1::before{ background:linear-gradient(135deg, #EA580C, #9A3412); }
.projectMapPin--c2::before{ background:linear-gradient(135deg, #3B82F6, #1E4FA3); }
.projectMapPin--c3::before{ background:linear-gradient(135deg, #8B5CF6, #6D28D9); }
.projectMapPin--c4::before{ background:linear-gradient(135deg, #22C55E, #15803D); }
.projectMapPin--c5::before{ background:linear-gradient(135deg, #EC4899, #BE185D); }

/* Harita altındaki kategori-renk lejantı (bkz. js/site-enhancements.js
   renderMapLegend). Nokta renkleri yukarıdaki .projectMapPin--cN::before
   ile AYNI değerlerdir; ::before yerine doğrudan öğe üzerinde kullanılır. */
.projectMapLegend{
  display:flex;
  flex-wrap:wrap;
  gap:6px 16px;
  margin-top:10px;
  padding-top:10px;
  border-top:1px solid var(--pj-border, #E5EAF2);
}
.projectMapLegend__item{
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-size:12px;
  color:var(--pj-muted, #6B7280);
}
.projectMapLegend__swatch{
  width:10px;
  height:10px;
  border-radius:50%;
  flex:none;
  background:linear-gradient(135deg, #24406E, #0F1E3D);
  box-shadow:0 0 0 2px #fff, 0 1px 3px rgba(15,23,42,.25);
}
.projectMapLegend__swatch.projectMapPin--c1{ background:linear-gradient(135deg, #EA580C, #9A3412); }
.projectMapLegend__swatch.projectMapPin--c2{ background:linear-gradient(135deg, #3B82F6, #1E4FA3); }
.projectMapLegend__swatch.projectMapPin--c3{ background:linear-gradient(135deg, #8B5CF6, #6D28D9); }
.projectMapLegend__swatch.projectMapPin--c4{ background:linear-gradient(135deg, #22C55E, #15803D); }
.projectMapLegend__swatch.projectMapPin--c5{ background:linear-gradient(135deg, #EC4899, #BE185D); }
.projectMapMarker:hover .projectMapPin,
.projectMapMarker.is-active .projectMapPin{
  transform:translateY(-3px) scale(1.08);
  filter:saturate(1.15);
}
.projectMapMarker.is-active .projectMapPin::before{
  /* Seçili proje pin'i, varsayılan mavi tondan bilinçli olarak ayrılır:
     haritada onlarca mavi pin arasında "hangisi seçili" sorusu tek bakışta
     yanıtlanır. */
  background:linear-gradient(135deg, rgba(239,68,68,.98), rgba(185,28,28,.98));
  box-shadow:0 10px 20px rgba(185,28,28,.35);
}

#listBulkTools.enhCard,
#docBulkTools.enhCard{
  background:linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,250,252,.96));
  border-color:rgba(148,163,184,.18);
}
#listBulkTools .enhActionRow,
#docBulkTools .enhActionRow{gap:8px}
#listBulkTools .enhActionRow .btn,
#docBulkTools .enhActionRow .btn{
  min-height:40px;
  padding:0 12px;
  border-radius:12px;
}

.docsPage--listeler .docTile,
.docsPage--belgeler .docTile{
  position:relative;
  background:linear-gradient(180deg, rgba(255,255,255,.98), rgba(248,250,252,.96));
  border-color:rgba(148,163,184,.20);
  box-shadow:0 18px 34px rgba(15,23,42,.07), inset 0 1px 0 rgba(255,255,255,.88);
}
.docsPage--listeler .docTile::before,
.docsPage--belgeler .docTile::before{
  content:'';
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(135deg, rgba(255,255,255,.38), transparent 42%, rgba(37,92,255,.04));
  opacity:.95;
}
.docsPage--listeler .docTile:hover,
.docsPage--belgeler .docTile:hover{
  transform:translateY(-3px);
  border-color:rgba(37,92,255,.22);
  box-shadow:0 24px 42px rgba(15,23,42,.11);
}
.docsPage--listeler .docTile__previewWrap,
.docsPage--belgeler .docTile__previewWrap{
  height:158px;
  border-bottom:1px solid rgba(148,163,184,.16);
}
.docsPage--listeler .docTile__previewWrap{
  background:
    radial-gradient(110px 70px at 18% 18%, rgba(255,255,255,.55), transparent 60%),
    linear-gradient(135deg, rgba(37,92,255,.22), rgba(0,194,255,.14));
}
.docsPage--belgeler .docTile__previewWrap{
  background:
    radial-gradient(110px 70px at 18% 18%, rgba(255,255,255,.52), transparent 60%),
    linear-gradient(135deg, rgba(7,25,74,.18), rgba(37,92,255,.12));
}

.docsPage--listeler .docTile__body,
.docsPage--belgeler .docTile__body{
  padding:14px 16px 16px;
  gap:9px;
}

.docsPage--listeler .docTile__title,
.docsPage--belgeler .docTile__title{
  font-size:14px;
  min-height:36px;
}
.docsPage--listeler .docTile__summary,
.docsPage--belgeler .docTile__summary{
  min-height:34px;
  font-size:12px;
}
.docsPage--listeler .docTile__meta,
.docsPage--belgeler .docTile__meta{
  font-size:11px;
}

.docsPage--listeler .docTileEnh,
.docsPage--belgeler .docTileEnh{
  top:12px;
  left:12px;
  right:56px;
}
.docsPage--listeler .docTileEnh__check,
.docsPage--belgeler .docTileEnh__check{
  padding:7px 9px;
  border:1px solid rgba(255,255,255,.56);
  background:rgba(255,255,255,.9);
}
.docsPage--listeler .docTileEnh__btn,
.docsPage--belgeler .docTileEnh__btn{
  padding:8px 11px;
  background:rgba(7,25,74,.82);
  box-shadow:0 10px 16px rgba(15,23,42,.12);
}
.docsPage--listeler .docTile__dl,
.docsPage--belgeler .docTile__dl{
  top:12px;
  right:12px;
  width:40px;
  height:40px;
  border-color:rgba(255,255,255,.34);
  background:rgba(255,255,255,.9);
  box-shadow:0 10px 20px rgba(15,23,42,.10);
}
.docsPage--listeler .docVersionBadge,
.docsPage--belgeler .docVersionBadge,
.docsPage--belgeler .docImportanceBadge{
  margin-bottom:6px;
  box-shadow:0 8px 14px rgba(15,23,42,.06);
}

@media (max-width: 780px) {
  .projectMapPin{width:22px;height:29px}
  .projectMapPin::before{width:22px;height:22px;margin-left:-11px}
  .projectMapPin__dot{width:7px;height:7px;margin-left:-3.5px;top:6px}
  .docsPage--listeler .docTile__previewWrap,
  .docsPage--belgeler .docTile__previewWrap{height:150px}
}

/* ===== Docs pages rebuilt ===== */
.docsHubMain{
  padding: 20px 0 56px;
}
.docsHubHeroPanel{
  display:grid;
  grid-template-columns: minmax(0, 1fr);
  margin-bottom: 18px;
}
.docsHubHeroCopy,
.docsHubShell{
  background: var(--paper);
  border:1px solid var(--line);
  border-radius: 24px;
  box-shadow: 0 14px 34px rgba(15,23,42,.06);
}
/* Compact, wide hero: text and stats sit side by side now that the old
   "quick tip" side panel is gone, so the card is roughly half the height
   it used to be instead of stacking everything vertically. */
.docsHubHeroCopy{
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap: 20px;
  padding: 18px 26px;
}
.docsHubHeroCopy__main{
  flex: 1 1 340px;
  min-width: 0;
}
.docsHubHeroCopy h1{
  margin: 6px 0 6px;
  font-size: clamp(24px, 2.6vw, 34px);
}
.docsHubHeroCopy .lead{
  max-width: 62ch;
  margin-bottom: 0;
}
.docsHubStatRow{
  flex: 0 0 auto;
  width: min(460px, 100%);
  display:grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}
.docsHubStat{
  min-width:0;
  border:1px solid rgba(37,92,255,.12);
  border-radius: 16px;
  padding: 10px 12px;
  background: linear-gradient(180deg, rgba(255,255,255,.96), rgba(245,248,255,.92));
}
.docsHubStat strong{
  display:block;
  font-size: 17px;
  font-weight: 700;
}
.docsHubStat span{
  display:block;
  margin-top: 3px;
  color: var(--muted);
  font-size: 12px;
}
.docsHubShell{
  padding: 18px;
}

.docsHubInput,
.docsHubSelect{
  width:100%;
  padding: 12px 14px;
  border-radius: 14px;
  border:1px solid var(--line);
  background: #fff;
  font: inherit;
}
.docsHubToggle{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding: 12px 14px;
  border-radius: 14px;
  border:1px solid var(--line);
  background:#fff;
  font-weight:700;
  color:var(--muted);
}
.docsHubToggle input{ margin:0; }
.docsHubActive{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin: 14px 0 12px;
}
.docsHubFilterPill{
  display:inline-flex;
  align-items:center;
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(37,92,255,.07);
  color: var(--ink);
  font-size: 12px;
  font-weight: 600;
}
.docsHubFilterPill.is-muted{
  background: rgba(148,163,184,.14);
  color: var(--muted);
}
.docsHubBulk{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 12px;
  flex-wrap:wrap;
  padding: 14px 16px;
  border-radius: 18px;
  border:1px solid rgba(37,92,255,.14);
  background: linear-gradient(180deg, rgba(255,255,255,.98), rgba(246,249,255,.94));
  margin-bottom: 16px;
}
.docsHubBulk strong{
  display:block;
  font-family: "Space Grotesk", system-ui;
  font-size: 15px;
}
.docsHubBulk span{
  display:block;
  margin-top: 3px;
  font-size: 13px;
  color: var(--muted);
}
.docsHubBulk__actions{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.docsHubGrid{
  display:grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 16px;
}
.docHubCard{
  position:relative;
  display:grid;
  gap: 14px;
  min-height: 100%;
  padding: 18px;
  border-radius: 22px;
  border:1px solid var(--line);
  background: linear-gradient(180deg, #fff, #fbfdff);
  box-shadow: 0 12px 28px rgba(15,23,42,.06);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
  cursor:pointer;
}
.docHubCard:hover{
  transform: translateY(-2px);
  border-color: rgba(37,92,255,.24);
  box-shadow: 0 18px 36px rgba(15,23,42,.10);
}
.docHubCard.is-selected{
  border-color: rgba(37,92,255,.34);
  box-shadow: 0 0 0 3px rgba(37,92,255,.08), 0 18px 38px rgba(15,23,42,.10);
}
.docHubCard.is-disabled{
  opacity:.72;
}
.docHubCheck{
  position:absolute;
  top: 14px;
  right: 14px;
  z-index: 2;
}
.docHubCheck input{
  position:absolute;
  inset:0;
  opacity:0;
}
.docHubCheck span{
  display:block;
  width: 20px;
  height: 20px;
  border-radius: 7px;
  border:1px solid rgba(37,92,255,.24);
  background:#fff;
  box-shadow: 0 4px 10px rgba(15,23,42,.06);
}
.docHubCheck input:checked + span{
  background: linear-gradient(135deg, var(--accent), var(--accent2));
  border-color: transparent;
}
.docHubCheck input:checked + span::after{
  content:'✓';
  display:grid;
  place-items:center;
  width:100%;
  height:100%;
  color:#fff;
  font-size: 12px;
  font-weight: 700;
}
.docHubCard__top{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  padding-right: 34px;
}
.docHubBadge{
  display:inline-flex;
  align-items:center;
  padding: 7px 10px;
  border-radius: 999px;
  background: rgba(15,23,42,.05);
  color: var(--ink);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .01em;
}
.docHubBadge.is-fresh,
.docHubBadge.is-tech{
  background: rgba(37,92,255,.10);
  color: var(--accent);
}
.docHubBadge.is-archive,
.docHubBadge.is-info{
  background: rgba(148,163,184,.16);
  color: var(--muted);
}
.docHubBadge.is-critical{
  background: rgba(239,68,68,.10);
  color: #b91c1c;
}
.docHubCard__body{
  display:grid;
  gap: 8px;
}
.docHubBrand{
  color: var(--accent);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .03em;
}
.docHubCard__body h3{
  margin:0;
  font-family: "Space Grotesk", system-ui;
  font-size: 20px;
  line-height: 1.2;
}
.docHubCard__body p{
  margin:0;
  color: var(--muted);
  line-height: 1.55;
  font-size: 13px;
}
.docHubMeta{
  display:flex;
  flex-wrap:wrap;
  gap: 8px;
  align-items:center;
}
.docHubMeta span{
  display:inline-flex;
  align-items:center;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(15,23,42,.05);
  color: var(--muted);
  font-size: 11px;
  font-weight: 600;
}
.docHubActions{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 10px;
  margin-top:auto;
}
.docHubActions .btn.is-disabled{
  pointer-events:none;
  opacity:.5;
}
.docsHubMiniNote{
  font-size: 12px;
  font-weight: 600;
  color: var(--muted);
}
.docsHubModal{
  position:fixed;
  inset:0;
  z-index: 140;
}
.docsHubModal__backdrop{
  position:absolute;
  inset:0;
  background: rgba(2,6,23,.54);
  backdrop-filter: blur(4px);
}
.docsHubModal__panel{
  position:relative;
  width:min(1080px, calc(100vw - 32px));
  height:min(84vh, 820px);
  margin: min(6vh, 40px) auto 0;
  border-radius: 22px;
  background:#fff;
  border:1px solid rgba(148,163,184,.22);
  box-shadow: 0 26px 60px rgba(15,23,42,.24);
  display:grid;
  grid-template-rows: auto 1fr;
  overflow:hidden;
}
.docsHubModal__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 12px;
  padding: 14px 16px;
  border-bottom:1px solid var(--line);
}
.docsHubModal__body{
  min-height:0;
  background: #f8fafc;
}
.docsHubFrame{
  width:100%;
  height:100%;
  border:0;
  display:block;
}
.pdfPreviewModal .docsHubModal__panel{
  height:min(90vh, 900px);
}
.pdfPreviewModal .docsHubModal__body{
  overflow:auto;
  background:#eef1f8;
}
.docsHubModal__fallback{
  min-height:100%;
  display:grid;
  place-items:center;
}
body.page--stoklar .compareStrip{
  position: static;
  top: auto;
}
@media (max-width: 1080px) {
  
  .docsHubGrid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 860px) {
  .docsHubHeroCopy{
    flex-direction: column;
    align-items: stretch;
  }
  .docsHubHeroCopy__main{
    flex: 0 0 auto;
  }
  .docsHubStatRow{
    flex: 0 0 auto;
    width: 100%;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 680px) {
  
  .docsHubGrid{
    grid-template-columns: 1fr;
  }
  .docsHubBulk{
    align-items:flex-start;
  }
  
}

/* ===== Global mobile fit pass (2026-03-03) ===== */
@media (max-width: 860px) {
  html,
  body{
    max-width:100%;
    overflow-x:hidden;
  }

  body{
    -webkit-text-size-adjust:100%;
  }

  img,
  svg,
  video,
  canvas,
  iframe,
  object,
  embed{
    max-width:100%;
  }

  .container,
  .header .container.header__inner{
    width:min(100%, calc(100vw - 24px)) !important;
  }

  .section{
    padding: 34px 0;
  }

  

  h1{
    font-size: clamp(28px, 8vw, 40px);
    line-height: 1.08;
  }

  .head h2{
    font-size: clamp(22px, 6.2vw, 30px);
  }

  .lead,
  .head p,
  .pcard__desc,
  .card p,
  .tile p,
  .legalCard p,
  .docHubCard p{
    max-width:none;
    overflow-wrap:anywhere;
  }

  .header{
    position: sticky;
    top: 0;
  }

  .header__inner{
    grid-template-columns: minmax(0, 1fr) auto auto;
    gap: 8px;
    padding-top: 8px;
    padding-bottom: 8px;
  }

  .brand,
  .nav,
  .header__right{
    min-width:0;
  }

  .brand__logo{
    width: clamp(86px, 24vw, 120px) !important;
  }

  .header__right{
    display:flex !important;
  }

  .header__right .phone{
    min-height: 40px;
    padding: 8px 10px;
    gap: 0;
  }

  .header__right .phone__num{
    display:none !important;
  }

  .header__right .phone__label{
    display:inline !important;
    font-size: 13px;
    line-height: 1;
  }

  .nav{
    justify-self:end;
  }

  .nav__btn{
    display:block;
    width: 42px;
    height: 42px;
  }

  .nav__list{
    position: fixed;
    left: 12px;
    right: 12px;
    top: 64px;
    transform: none;
    width: auto;
    min-width: 0;
    max-width: none;
    max-height: calc(100dvh - 84px);
    overflow: auto;
    display:none;
    flex-direction:column;
    align-items:stretch;
    gap: 6px;
    padding: 10px;
    border-radius: 18px;
    border:1px solid var(--line);
    background: rgba(255,255,255,.98);
    box-shadow: 0 20px 48px rgba(15,23,42,.18);
    z-index: 45;
  }

  /* Mobil menü açıkken arkadaki içeriği karartan katman. Menü, üstünde
     hiçbir görsel ayrım olmadan içeriğin üstünde asılı duruyormuş gibi
     görünüyordu; header'ı (ve kapatma düğmesini) kapatmamak için 64px'lik
     header yüksekliğinin altından başlıyor. */
  body.is-nav-open::before{
    content:"";
    position:fixed;
    top:64px;
    left:0;
    right:0;
    bottom:0;
    background: rgba(15,23,42,.45);
    z-index: 40;
  }

  .nav__list li,
  .nav__list a{
    width:100%;
  }

  .nav__list a{
    display:block;
    padding: 12px 14px;
  }

  .nav__list.is-open{
    display:flex;
  }

  body.is-nav-open{
    overflow:hidden;
  }

  .hero__grid,
  .cards,
  .grid--4,
  .grid--3,
  .contactgrid,
  .footer__grid,
  .mapGrid,
  .detail,
  .aboutPageHero,
  .aboutSplitGrid,
  .aboutSummary__grid,
  .aboutTrustStrip,
  .legalHero,
  .legalGrid--3,
  .legalGrid--2,
  .page--home .compactHome,
  .page--home .compactResources,
  .page--home .compactCategoryGrid,
  .page--projeler .projectsLayout,
  .page--projeler .projectFeatureGrid,
  .page--proje-detay .projectUsedGrid,
  .page--proje-detay .projectProcessGrid,
  .page--proje-detay .projectResourceGrid,
  .page--proje-detay .projectRelatedGrid,
  .docsHubHeroPanel,
  .docsHubToolbar,
  .docsHubGrid{
    grid-template-columns: 1fr !important;
  }

  .products,
  .docGrid,
  .listelerGrid,
  .brandGallery{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .page--projeler .products.is-list .projectRefCard,
  .products.is-list .pcard{
    grid-template-columns: 1fr !important;
  }

  .page--projeler .products.is-list .projectRefCard .pcard__img,
  .products.is-list .pcard__img{
    height: 180px !important;
    min-height: 180px !important;
  }

  .filters,
  .filters--v2,
  .projectFilterCard,
  .docsHubShell,
  .docsHubHeroCopy,
  .legalHero__copy,
  .legalHero__card,
  .legalCard--pad,
  .aboutHeroCard{
    padding: 14px !important;
    border-radius: 18px !important;
  }

  .filters__top,
  .viewbar,
  .viewbar__left,
  .viewbar__controls,
  .stockToolsRow,
  .projectViewbar,
  .projectFilterCard__row,
  .projectFilterCard__labelWrap,
  .projectFeatureWrap .metaLine,
  .docsHubBulk,
  .docsHubBulk__actions,
  .legalActions,
  .btnRow,
  .channelBtns,
  .hero__cta{
    align-items:stretch;
    gap: 8px;
  }

  .viewbar,
  .viewbar__left,
  .viewbar__controls,
  .stockToolsRow,
  .projectViewbar,
  .projectFilterCard__row,
  .projectFilterCard__labelWrap,
  .docsHubBulk,
  .docsHubBulk__actions,
  .legalActions,
  .hero__cta{
    flex-direction:column;
  }

  /* .page--projeler .projectFilterCard__labelWrap (base rule) sets
     align-items:center/justify-content:space-between with higher
     specificity than the generic mobile rule above — restate it here
     so "Ek Filtreler" and its description actually stack left-aligned
     instead of colliding on one centered row. */
  .page--projeler .projectFilterCard__labelWrap{
    align-items: flex-start;
    justify-content: flex-start;
  }

  .hero__cta .btn,
  .viewbar .btn,
  .stockToolsRow .btn,
  .projectViewbar .btn,
  .legalActions .btn,
  .btnRow .btn,
  .channelBtns .btn,
  .docsHubBulk__actions .btn{
    width:100%;
    justify-content:center;
  }

  .input,
  .select,
  .docsHubInput,
  .docsHubSelect,
  .docsInput,
  .docsSelect{
    width:100%;
    min-width:0;
    flex:1 1 auto;
  }

  .seg,
  .seg--sm{
    width:100%;
    max-width:100%;
    justify-content:space-between;
  }

  .seg__btn{
    flex:1 1 0;
    justify-content:center;
  }

  .chips,
  .chips--small,
  .projectTypeChips,
  .homeTrustRow,
  .pills,
  .miniPills,
  .docsHubActive,
  .gallery__thumbs,
  .page--proje-detay .projectGallery__thumbs{
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    padding-bottom: 4px;
    justify-content:flex-start;
  }

  .chips > *,
  .chips--small > *,
  .projectTypeChips > *,
  .homeTrustRow > *,
  .pills > *,
  .miniPills > *,
  .docsHubActive > *,
  .gallery__thumbs > *,
  .page--proje-detay .projectGallery__thumbs > *{
    flex: 0 0 auto;
  }

  .detail__media{
    min-height: min(58vw, 300px);
    padding: 14px;
  }

  .gallery__main{
    height: min(52vw, 260px);
  }

  .gallery__main,
  .page--proje-detay .projectGallery__main{
    border-radius: 16px;
  }

  .page--projeler .projectViewbar{
    padding: 12px;
    border-radius: 16px;
  }

  .page--projeler .projectsStats,
  body.page--iletisim .contactHeroKpis{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .compareSheet__panel,
  .docsHubModal__panel{
    width: calc(100vw - 10px);
    max-width: none;
    height: min(92dvh, 920px);
    max-height: 92dvh;
    margin: 4px auto;
    border-radius: 18px;
  }

  .compareSheet__head,
  .compareSheet__body,
  .docsHubModal__head{
    padding-left: 12px;
    padding-right: 12px;
  }

  .compareSheet__actions{
    width:100%;
  }

  .compareSheet__actions .btn{
    flex:1 1 auto;
  }

  .docsHubModal__head{
    flex-wrap:wrap;
  }

  

  .map,
  .map.map--lg{
    height: min(56vw, 280px) !important;
  }

  .page--proje-detay .projectDetailAsideSticky,
  body.page--iletisim .contactPanel{
    position: static !important;
    top: auto !important;
  }

  .pcard,
  .tile,
  .card,
  .info,
  .docHubCard{
    border-radius: 18px;
  }
}

@media (max-width: 620px) {
  .container,
  .header .container.header__inner{
    width:min(100%, calc(100vw - 18px)) !important;
  }

  .header__inner{
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .header__right{
    display:none !important;
  }

  .nav__list{
    left: 9px;
    right: 9px;
    top: 58px;
  }

  .products,
  .docGrid,
  .listelerGrid,
  .brandGallery,
  body.page--iletisim .contactHeroKpis{
    grid-template-columns: 1fr !important;
  }

  .page--projeler .projectsStats{
    grid-template-columns: repeat(2, minmax(0,1fr)) !important;
  }

  .page--projeler .projectFeatureGrid,
  .page--proje-detay .projectUsedGrid{
    gap: 12px;
  }

  .compareSheet__panel,
  .docsHubModal__panel{
    width: calc(100vw - 4px);
    border-radius: 14px;
  }

  .compareSheet__head{
    flex-wrap:wrap;
  }
}

/* ===== Mobile fit pass 2026-03-03 ===== */
.pcard__img.is-placeholder,
.gallery__thumb.is-placeholder,
.thumb.is-placeholder{
  display:none !important;
}
.detail__media.is-placeholder{
  min-height: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}
.detail__media.is-placeholder .gallery__main,
.detail__media.is-placeholder .gallery__thumbs,
.detail__media.is-placeholder .gallery__meta,
.detail__media.is-placeholder .gallery__nav,
.detail__media.is-placeholder img{
  display:none !important;
}
img.is-placeholder-img{
  opacity: 0 !important;
}

/* Ürün görseli hiç yoksa, sağdaki bilgi kartının solunda boş bir
   sütun kalmasın diye galeri sütununu tamamen kaldırıp bilgi kartını
   tam genişliğe yayıyoruz. */
.detail:has(.detail__media.is-placeholder){
  grid-template-columns: 1fr;
}

@media (max-width: 760px) {
  .header__right{
    display:none !important;
  }

  .header__inner{
    gap:10px !important;
    padding:8px 0 !important;
  }

  .brand{
    max-width: calc(100% - 64px);
    min-width: 0;
  }

  

  

  .nav{
    flex: 0 0 auto;
  }

  .nav__list{
    left: auto !important;
    right: 0 !important;
    top: 64px !important;
    transform: none !important;
    width: min(360px, calc(100vw - 24px)) !important;
    max-width: calc(100vw - 24px) !important;
  }

  .map{
    height: 120px !important;
  }

  .map.map--lg{
    height: 180px !important;
  }

  .pcard__img,
  .page--projeler .projectRefCard .pcard__img,
  .page--projeler .projectRefCard--featured .pcard__img,
  .products.is-list .pcard__img,
  .page--projeler .products.is-list .projectRefCard .pcard__img{
    height: 136px !important;
    min-height: 136px !important;
  }

  .pcard__img img,
  .page--projeler .projectRefCard .pcard__img img{
    max-height: 118px !important;
  }

  .detail__media,
  .page--proje-detay .detail--project .detail__media{
    min-height: 210px !important;
    padding: 12px !important;
  }

  .gallery__main{
    height: 180px !important;
  }

  .page--proje-detay .detail--project .detail__media img{
    max-height: 180px !important;
  }

  .gallery__nav{
    width: 38px;
    height: 38px;
    font-size: 20px;
  }

  .gallery__thumbs{
    justify-content: flex-start !important;
  }

  body.page--stoklar .filters--v2{
    padding: 10px !important;
  }

  body.page--stoklar .chipsRow{
    grid-template-columns: 1fr !important;
    gap: 8px !important;
  }

  body.page--stoklar .chipsRow .chipsGroup{
    min-width: 0;
    padding: 8px !important;
  }

  body.page--stoklar .checks--compact{
    grid-template-columns: 1fr !important;
    gap: 6px !important;
  }

  body.page--stoklar .chipsRow .chipsGroup .checks,
  body.page--stoklar #types.checks--compact,
  body.page--stoklar #brands.checks--compact{
    height: auto !important;
    max-height: min(34vh, 176px) !important;
    min-height: 0 !important;
    overflow: auto !important;
  }

  body.page--stoklar .filters--v2.is-collapsed .easy > :not(.qRow):not(.easyBar){
    display: none !important;
  }

  body.page--stoklar .filters--v2.is-collapsed .easyBar{
    padding-top: 4px;
  }

  body.page--stoklar .filters--v2.is-collapsed .easyBar > :not(#toggleFilters):not(#resetFilters){
    display: none !important;
  }

  body.page--stoklar .viewbar,
  body.page--stoklar .viewbar__left,
  body.page--stoklar .viewbar__controls,
  body.page--stoklar .viewbar__paging{
    width: 100%;
  }
  /* #stockBulkTools artık body'ye eklenen sabit (fixed) bir şerit —
     genişliği ekranın altındaki floating-panel kuralında ayrıca
     tanımlanıyor, burada 100% ile ezilmesin. */

}

@media (max-width: 520px) {
  .container{
    width: min(1120px, calc(100vw - 20px));
  }

  .detail__actions,
  .detail__badges,
  .btnRow,
  .footer__addrActions{
    gap: 8px;
  }

  .detail__actions .btn,
  .btnRow .btn,
  .footer__addrActions .btn{
    width: 100%;
    justify-content: center;
  }

  .map{
    height: 108px !important;
  }

  .map.map--lg{
    height: 160px !important;
  }

  .detail__media,
  .page--proje-detay .detail--project .detail__media{
    min-height: 180px !important;
  }

  .gallery__main{
    height: 150px !important;
  }

  .page--proje-detay .detail--project .detail__media img{
    max-height: 150px !important;
  }

}

/* ===================================================================
   Anasayfa — yeniden tasarım (yalnızca .page--home kapsamında)
   Nav ve footer stilleri değiştirilmemiştir; mevcut renk paletindeki
   --bg / --paper / --ink / --muted / --line / --accent / --accent2
   değişkenleri ve mevcut .tile / .btn / .pill / .eyebrow / .section
   bileşenleri temel alınmıştır.
   =================================================================== */

.page--home .hHero{
  padding: 22px 0 0;
  background:
    radial-gradient(920px 520px at 8% 0%, rgba(37,92,255,.10), transparent 58%),
    radial-gradient(720px 480px at 92% 4%, rgba(0,194,255,.09), transparent 55%);
}
.page--home .hHero__inner{
  display:grid;
  grid-template-columns: minmax(0,1fr) minmax(560px,1.55fr);
  gap: 20px;
  align-items:start;
}
.page--home .hHero__showcase{
  display:grid;
  grid-template-columns: 1fr 1.05fr 1fr 1fr;
  gap: 12px;
  align-items:stretch;
}
.page--home .hHero__showcase .hHero__pedasCard,
.page--home .hHero__showcase .hHero__brandPanel{
  min-height: 300px;
}
.page--home .hHero__showcase .hHero__panel{
  height:100%;
}
.page--home .hHero__brandPanel{
  padding: 12px;
  background:#fff;
}
.page--home .hHero__intro h1{
  max-width: 13ch;
}
.page--home .hHero__intro .lead{
  margin-top: 12px;
}
.page--home .hHero__cta{
  margin-top: 18px;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.page--home .hHero__panel{
  padding: 18px;
  display:flex;
  flex-direction:column;
  gap: 14px;
  background: #fff;
  border-color: rgba(8,26,70,.10);
}
.page--home .hHero__panelHead{
  display:flex;
  flex-direction:column;
  gap: 6px;
}
.page--home .hHero__panelHead .eyebrow{
  color: #6b6f0f;
  background: rgba(213,222,31,.22);
  border-color: rgba(213,222,31,.5);
}
.page--home .hHero__panelHead strong{
  color: #081A46;
}
.page--home .hHero__brandCells{
  display:grid;
  grid-template-columns: repeat(2, 1fr);
  grid-auto-rows: minmax(62px, 1fr);
  gap: 8px;
  flex: 1 1 auto;
  height: 100%;
}
.page--home .hHero__brandCell{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height: 62px;
  padding: 8px;
  border: 0;
  border-radius: 12px;
  background: transparent;
  box-shadow: none;
}
.page--home .hHero__brandCell img{
  max-width: 100%;
  max-height: 26px;
  width: auto;
  height: auto;
  object-fit: contain;
}
.page--home .hHero__brandCell--dark{
  background: linear-gradient(160deg, #0c1f4d, #081A46);
  border-color: #0c2054;
}
.page--home .hHero__brandCell--lg{
  grid-column: span 2;
}
.page--home .hHero__brandCell--lg img{
  max-height: 40px;
}
.page--home .hHero__brandCell--boost img{
  filter: contrast(1.35) saturate(1.1);
}
/* MOLLED/İNOLED/ASL/SERLİTE kartı: 4 logo da tek sütunda alt alta,
   birbirinden eşit aralıklarla ayrılmış kendi satırında gösterilir
   (ASL ve SERLİTE eskiden tek satırda yan yana sıkışık duruyordu). */
.page--home .hHero__brandCell--asl img{
  max-height: 30px;
}
.page--home .hHero__brandCell--serlite img{
  max-height: 48px;
}
.page--home .hHero__brandCell--nudgeUp{
  transform: translateY(-3px);
}
.page--home .hHero__brandCell--nudgeDown{
  transform: translateY(3px);
}
/* Detay/Yavuz/Gecem ve Molled/İnoled/ASL+Serlite kartlarında logolar
   yan yana değil alt alta, kartın tam yüksekliğine eşit aralıklarla
   yayılacak şekilde tek sütun halinde dizilir. */
.page--home .hHero__brandCells--stack{
  grid-template-columns: 1fr;
  grid-auto-rows: 1fr;
  grid-auto-flow: row;
  height: 100%;
}
.page--home .hHero__brandCells--stack .hHero__brandCell{
  min-height: 0;
}
.page--home .hHero__brandCell--md img{
  max-height: 34px;
}
.page--home .hHero__brandCell--yavuz img{
  max-height: 38px;
}
.page--home .hHero__brandCells--stack .hHero__brandCell--lg{
  grid-column: auto;
}
.page--home .hHero__brandCells--stack .hHero__brandCell--asl{
  grid-column: auto;
}
.page--home .hHero__brandStrip{
  grid-column: 1 / -1;
  margin-top: 0;
  padding: 16px 18px;
}
.page--home .hHero__brandStripCells{
  display:grid;
  grid-template-columns: repeat(7, 1fr);
  align-items:center;
  justify-items:center;
  gap: 8px;
}
.page--home .hHero__brandStrip .hHero__brandCell{
  width: 100%;
  min-height: 44px;
  padding: 4px;
}

.page--home .hHero__pedasCard{
  align-items:center;
  justify-content:center;
  padding: 18px;
  min-height: 0;
  background: #fff;
}
.page--home .hHero__pedasLogo{
  width: 100%;
  flex: 1 1 auto;
  display:flex;
  align-items:center;
  justify-content:center;
  background: transparent;
  border-radius: 16px;
  padding: 6px;
  box-shadow: none;
}
.page--home .hHero__pedasLogo img{
  width: 100%;
  height: auto;
  object-fit: contain;
}
.page--home .hHero__pedasSlogan{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap: 6px;
  text-align:center;
  padding: 10px 0 0;
  border-top: 1px solid rgba(8,26,70,.08);
  margin-top: 8px;
  width: 100%;
}
.page--home .hHero__pedasSlogan strong{
  font-family:"Space Grotesk", system-ui;
  font-size: 17px;
  letter-spacing:.03em;
  color:#081A46;
}
.page--home .hHero__pedasSlogan span{
  font-size: 12px;
  font-weight:600;
  color: var(--muted);
  text-transform:uppercase;
  letter-spacing:.06em;
}

.page--home .hHero__miniBrands{
  padding: 14px;
  background: #fff;
}
.page--home .hHero__miniBrands__grid{
  display:grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
}
.page--home .hHero__miniBrands__cell{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height: 68px;
  padding: 12px;
  border-radius: 14px;
  background: #fff;
  border: 1px solid rgba(8,26,70,.10);
  box-shadow: 0 2px 6px rgba(15,23,42,.05);
}
.page--home .hHero__miniBrands__cell img{
  max-width: 100%;
  max-height: 32px;
  width: auto;
  height: auto;
  object-fit: contain;
}

.page--home .hFeature{
  display:flex;
  flex-direction:column;
  gap: 6px;
}
.page--home .hFeature__num{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width: 34px;
  height: 34px;
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(37,92,255,.14), rgba(0,194,255,.14));
  color: var(--accent);
  font-family: "Space Grotesk", system-ui;
  font-weight: 700;
  font-size: 13px;
  margin-bottom: 6px;
}

.page--home .hCategory{
  display:flex;
  flex-direction:column;
  gap: 4px;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.page--home .hCategory:hover{
  transform: translateY(-2px);
  box-shadow: 0 16px 34px rgba(15,23,42,.10);
  border-color: rgba(37,92,255,.25);
}
.page--home .hCategory__tag{
  display:inline-flex;
  width: fit-content;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(37,92,255,.08);
  color: var(--accent);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.page--home .hCategory h3{
  margin-top: 10px;
}

.page--home .hProjects__head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap: 14px;
  margin-bottom: 16px;
}
.page--home .hProjects__head .head{
  margin-bottom: 0;
}

.page--home .hStep{
  position:relative;
}
.page--home .hStep__num{
  display:block;
  font-family: "Space Grotesk", system-ui;
  font-size: 13px;
  font-weight: 700;
  color: var(--accent);
  letter-spacing: .06em;
}
.page--home .hStep h3{
  margin-top: 8px;
}

.page--home .hResource{
  display:flex;
  flex-direction:column;
  gap: 4px;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.page--home .hResource:hover{
  transform: translateY(-2px);
  box-shadow: 0 16px 34px rgba(15,23,42,.10);
  border-color: rgba(37,92,255,.25);
}
.page--home .hResource strong{
  font-family: "Space Grotesk", system-ui;
  font-size: 17px;
}
.page--home .hResource span{
  color: var(--muted);
  font-size: 13px;
  line-height: 1.55;
}

.hMarquee{
  padding: 40px 0 0;
}
.page--home .hMarquee{
  padding: 12px 0 44px;
}

/* Anasayfa: marquee'nin altında, footer'a bitişik istatistik bandı */
.page--home .hStatsBand{
  padding: 12px 0 0;
}
.page--home .hStatsBand .miniStatRow{
  margin-bottom: 4px;
}

.hMarquee__inner{
  overflow: hidden;
  width: 100%;
  padding: 14px 0;
  background: linear-gradient(120deg, rgba(37,92,255,.94), rgba(0,194,255,.88));
  box-shadow: 0 20px 44px rgba(37,92,255,.20);
}
.hMarquee__track{
  display:flex;
  width: max-content;
  animation: sevay-marquee 28s linear infinite;
  will-change: transform;
}
.hMarquee__list{
  display:flex;
  align-items:center;
  flex-shrink:0;
  gap: 14px;
  margin:0;
  padding: 0 14px 0 28px;
  list-style:none;
  white-space: nowrap;
}
.hMarquee__list li{
  color:#ffffff;
  font-family: "Space Grotesk", system-ui;
  font-weight: 600;
  font-size: 14px;
  letter-spacing: .01em;
}
.hMarquee__list li[aria-hidden="true"]{
  color: rgba(255,255,255,.65);
  font-weight: 700;
}
@media (max-width: 640px){
  .hMarquee__track{ animation-duration: 18s; }
  .hMarquee__list li{ font-size: 13px; }
  .hMarquee__list{ padding: 0 10px 0 18px; }
}
@media (prefers-reduced-motion: reduce){
  .hMarquee__track{ animation: none; }
}

.page--home .hCtaBanner{
  padding: 14px 0 0;
}
.page--home .hCtaBanner__inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 20px;
  flex-wrap:wrap;
  padding: 26px 28px;
  border-radius: 24px;
  background: linear-gradient(120deg, rgba(37,92,255,.94), rgba(0,194,255,.88));
  box-shadow: 0 20px 44px rgba(37,92,255,.20);
  color: #fff;
}
.page--home .hCtaBanner__inner h2{
  margin: 0;
  font-family: "Space Grotesk", system-ui;
  font-size: clamp(22px, 2.4vw, 30px);
  color: #fff;
}
.page--home .hCtaBanner__inner p{
  margin: 8px 0 0;
  color: rgba(255,255,255,.92);
}
.page--home .hCtaBanner__actions{
  display:flex;
  gap: 10px;
  flex-wrap:wrap;
}
.page--home .hCtaBanner__actions .btn{
  border-color: rgba(255,255,255,.5);
  background: rgba(255,255,255,.12);
  color: #fff;
}
.page--home .hCtaBanner__actions .btn--primary{
  background: #fff;
  color: var(--ink);
  border-color: #fff;
}
.page--home .hCtaBanner__actions .btn:hover{
  border-color: #fff;
}
.page--home .hCtaBanner__whatsapp{
  display:inline-flex;
  align-items:center;
  gap: 8px;
  background: rgba(37, 211, 102, .95);
  border-color: rgba(37, 211, 102, .95);
  color: #fff;
}
.page--home .hCtaBanner__whatsapp:hover{
  background: #25D366;
  border-color: #fff;
}

@media (max-width: 980px) {
  .page--home .hHero__inner{ grid-template-columns: 1fr; }
  .page--home .hHero__intro h1{ max-width: none; }
  .page--home .hProjects__head{ align-items:flex-start; flex-direction:column; }
}
@media (max-width: 720px) {
  .page--home .hHero__showcase{ grid-template-columns: 1fr; }
  .page--home .hHero__brandCells{ grid-template-columns: repeat(3, 1fr); grid-auto-rows: 56px; }
  .page--home .hHero__brandCells--stack{ grid-template-columns: 1fr; grid-auto-rows: 56px; height: auto; }
  .page--home .hHero__brandStripCells{ grid-template-columns: repeat(4, 1fr); grid-auto-rows: 56px; gap: 6px 10px; }
  /* Masaüstünde 3 sütunlu vitrin eşit yükseklikte görünsün diye kartlara
     min-height:300px veriliyor; mobilde tek sütuna indiğinde bu değer
     içerikten (birkaç logo) çok daha büyük kalıp kartların arasında
     gereksiz boşluk bırakıyordu. Mobilde kartlar kendi içeriğine göre
     boyutlansın diye bu alt sınır burada kaldırılıyor. */
  .page--home .hHero__showcase .hHero__pedasCard,
  .page--home .hHero__showcase .hHero__brandPanel{ min-height: 0; }
  .page--home .hHero__pedasCard{ padding: 16px; }
  .page--home .hHero__pedasLogo{ flex: 0 0 auto; }
}
@media (max-width: 480px) {
  .page--home .hHero__brandStripCells{ grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 640px) {
  .page--home .hHero{ padding-top: 18px; }
  .page--home .hHero__stats{ grid-template-columns: 1fr; }
  .page--home .hCtaBanner__inner{ flex-direction:column; align-items:flex-start; }
}

/* ===================================================================
   Ürün kartı (.pcard) — görsel iyileştirme katmanı
   Mevcut işlevsellik, sınıf adları ve JS bağlantıları korunmuştur;
   burada sadece görünüm (renk paleti, boşluk, gölge, tipografi)
   inceltilmiştir. --bg/--paper/--ink/--muted/--line/--accent/--accent2
   değişkenleri kullanılmıştır.
   =================================================================== */

.pcard{
  border-radius: 20px;
  border: 1px solid var(--line);
  box-shadow: 0 8px 20px rgba(15,23,42,.05);
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.pcard:hover{
  transform: translateY(-3px);
  box-shadow: 0 18px 38px rgba(15,23,42,.12);
  border-color: rgba(37,92,255,.22);
}
.pcard__img{
  position: relative;
  background: linear-gradient(160deg, rgba(37,92,255,.08), rgba(0,194,255,.05) 55%, rgba(15,23,42,.02));
  border-bottom: 1px solid var(--line);
}
.pcard__img img{
  filter: drop-shadow(0 10px 16px rgba(15,23,42,.12));
}

.pcard .badge{
  display:inline-flex;
  align-items:center;
  gap: 6px;
  font-size: 11px;
  letter-spacing: .01em;
}
.pcard .badge i{
  width: 7px;
  height: 7px;
  border-radius: 999px;
}

.pcard__title{
  margin-top: 6px;
  font-size: 16px;
  line-height: 1.28;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: 2.56em;
}

.pcard .crit{
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px dashed var(--line);
}
.pcard .crit__b{
  font-size: 12px;
  font-weight: 700;
  padding: 6px 9px;
  border-radius: 10px;
}
.pcard .crit__row--tags{
  margin-top: 6px;
}

.pcard .metaLine .miniTag{
  font-weight: 600;
}

.comparePick{
  box-shadow: 0 6px 16px rgba(15,23,42,.10);
}
.pcardSlot:hover .comparePick{
  border-color: rgba(37,92,255,.35);
}

/* Liste görünümü ince ayar (yapı bozulmadan) */
.products.is-list .pcard{
  border-radius: 16px;
}
.products.is-list .pcard:hover{
  transform: translateY(-1px);
}
.products.is-list .pcard__title{
  -webkit-line-clamp: 1;
  min-height: 0;
}

@media (max-width: 640px) {
  .pcard__title{
    font-size: 15px;
  }
}

/* ===================================================================
   Proje Detayı — düzen iyileştirme (yalnızca .page--proje-detay)
   Mevcut .detail/.gallery/.acc yapısı korunmuş, sadece görünüm
   inceltilmiş ve adres/harita satırı eklenmiştir.
   =================================================================== */

.page--proje-detay .detail--project{
  gap: 20px;
}
.page--proje-detay .detail__media{
  border-radius: 24px;
  padding: 14px;
}
.page--proje-detay .gallery__thumb{
  width: 76px;
  height: 60px;
  transition: transform .14s ease, border-color .14s ease;
}
.page--proje-detay .gallery__thumb:hover{
  transform: translateY(-2px);
  border-color: rgba(37,92,255,.30);
}

.projectAddressLine{
  display:flex;
  align-items:center;
  gap: 10px;
  flex-wrap: wrap;
  margin: 0 0 12px;
  padding: 10px 14px;
  border-radius: 14px;
  border: 1px solid rgba(37,92,255,.18);
  background: rgba(37,92,255,.05);
}
.projectAddressLine__icon{
  font-size: 15px;
  line-height: 1;
}
.projectAddressLine__text{
  color: var(--ink);
  font-weight: 600;
  font-size: 13px;
  flex: 1 1 auto;
  min-width: 180px;
}
.projectAddressLine__link{
  font-size: 12px;
  font-weight: 700;
  padding: 6px 10px;
  border-radius: 999px;
  background: var(--paper);
  border: 1px solid rgba(37,92,255,.25);
  color: var(--accent);
  white-space: nowrap;
}
.projectAddressLine__link:hover{
  border-color: var(--accent);
}

.page--proje-detay .projectFeatureStrip{
  margin-top: 14px;
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}
.page--proje-detay .projectQuickItem{
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 12px;
  background: rgba(15,23,42,.02);
}
.page--proje-detay .projectQuickItem strong{
  display:block;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--muted);
}
.page--proje-detay .projectQuickItem span{
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
  margin-top: 6px;
  font-weight: 600;
  font-size: 13px;
  line-height: 1.4;
  color: var(--ink);
}

.page--proje-detay .detail__box{
  border-radius: 24px;
}
.page--proje-detay .acc{
  border-radius: 16px;
  transition: border-color .14s ease;
}
.page--proje-detay .acc[open]{
  border-color: rgba(37,92,255,.22);
}
.page--proje-detay .spec{
  border-radius: 12px;
}
.page--proje-detay .spec:hover{
  border-color: rgba(37,92,255,.20);
}

@media (max-width: 700px) {
  .page--proje-detay .projectFeatureStrip{
    grid-template-columns: 1fr;
  }
  .projectAddressLine{
    flex-direction: column;
    align-items: flex-start;
  }
}

/* ===================================================================
   Ürün kartı — görsel + stok/kod satırı + ürün adı + watt/kelvin/lümen
   + marka alt bandı. Diğer detaylar ürün detay sayfasında.
   =================================================================== */

.pcard__img--full{
  position: relative !important;
  display: block !important;
  width: 100%;
  height: 250px !important;
  background: linear-gradient(160deg, rgba(37,92,255,.08), rgba(0,194,255,.05) 55%, rgba(15,23,42,.02));
  border-bottom: 1px solid var(--line);
  overflow: hidden;
  padding: 0 !important;
}
.pcard__img--full img{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-height: none !important;
  max-width: none !important;
  object-fit: contain;
  padding: 16px;
  filter: drop-shadow(0 10px 16px rgba(15,23,42,.12));
  /* Görsel geç (lazy) yüklenirken kart bir süre tamamen boş/beyaz
     görünüp "kırık görsel" hissi veriyordu. JS tarafı (bkz. js/projects.js,
     js/proje-detay.js) img'e inline opacity:0 verip yüklenince 1'e
     çekiyor; buradaki geçiş bu değişimi yumuşak bir fade-in'e çeviriyor. */
  transition: opacity .35s ease;
}
/* "Sipariş Üzerine Ürettirilir" kırmızı bandı, üstte mutlak konumlandığı
   için ürün görselinin üstüne biniyordu. Bant varken görselin üst
   boşluğu artırılır; object-fit:contain görseli kalan alana göre yeniden
   ortalar, böylece bant ile görsel artık çakışmıyor. */
.pcard__img--hasRibbon img{
  padding-top: 46px;
}

.pcard__body--v3{
  padding: 12px 14px 10px;
  text-align: center;
}

.pcard__metaRow{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
}
.pcard__metaItem{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--muted);
}
.pcard__metaItem svg{
  width: 15px;
  height: 15px;
  flex: 0 0 auto;
  color: var(--accent);
}
.pcard__metaVal{
  font-size: 12px;
  font-weight: 700;
  color: var(--ink);
  max-width: 110px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.pcard__metaVal.badge--out{ color: #b91c1c; }
.pcard__metaVal.badge--low{ color: #b45309; }
.pcard__metaVal.badge--mid{ color: #1e40af; }
.pcard__metaVal.badge--high{ color: #047857; }
.pcard__metaDivider{
  width: 1px;
  height: 16px;
  background: var(--line);
  flex: 0 0 auto;
}
/* Proje kartlarında "Çözüm Alanı" gibi değerler sabit 110px genişlikte
   agresifçe ortadan kesiliyordu (ör. "Cadde, Sokak..."), oysa kartta
   halen boşluk vardı. Sabit tavan yerine iki meta öğesi mevcut alanı
   eşit paylaşır; gerçekten sığmayan durumda yine üç nokta ile kısaltılır
   ama artık kartın tam genişliğinden faydalanır. Tam metin title
   attribute'u ile hover'da görünür (bkz. js/projects.js). */
.page--projeler .pcard__metaRow{
  gap: 8px;
}
/* Yıl değeri her zaman kısa (4 haneli) olduğundan sabit/daralmaz kalır;
   yalnızca Çözüm Alanı değeri (değişken uzunlukta) mevcut boşluğu
   paylaşıp gerektiğinde kısaltılır — böylece "2023" gibi bir yıl asla
   "2.." şeklinde kesilmez. */
.page--projeler .pcard__metaItem{
  min-width: 0;
  flex: 0 0 auto;
}
.page--projeler .pcard__metaItem:last-child{
  flex: 1 1 auto;
  min-width: 0;
}
.page--projeler .pcard__metaVal{
  max-width: none;
}
/* Çözüm Alanı değeri tek satırda (nowrap) kelime ortasından "..." ile
   kesiliyordu (ör. "Cadde, Sokak ve Bina Aydınlat…") — başlığın altında
   ikinci bir kesik metin daha kartın bilgi değerini düşürüyordu. Son meta
   öğesi (Çözüm Alanı) artık en fazla 2 satıra sarabiliyor, sadece o da
   yetmezse "..." ile kesiliyor; tam metin yine title attribute'unda durur. */
.page--projeler .pcard__metaItem:last-child .pcard__metaVal{
  min-width: 0;
  flex: 1 1 auto;
  white-space: normal;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.25;
  text-align: left;
}

/* Kart başlıkları farklı uzunlukta olduğunda (kısa/uzun ürün adı), altındaki
   watt/kelvin/lümen satırı aynı satırda hizalı durmuyordu — aynı satırdaki
   kartlar arasında görsel kayma oluşuyordu. Başlık artık HER ZAMAN sabit 3
   satırlık bir alan kaplıyor (kısa başlıklar boş alan bırakır, uzun
   başlıklar "..." ile kesilir) — böylece specRow her kartta aynı yükseklikte
   başlar, kart içeriğinin uzunluğundan tamamen bağımsız. Tam ürün adı
   title="" ile hover'da görülebilir.*/
.pcard__title--v3{
  margin: 10px 0 0;
  font-size: 15px;
  line-height: 1.3;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  height: calc(1.3em * 3);
  max-height: calc(1.3em * 3);
  min-height: calc(1.3em * 3);
  overflow: hidden;
  white-space: normal;
  word-break: break-word;
}

/* Kartta ürün tipi/kategori bilgisi hiç gösterilmiyordu; "Tümü" ya da
   marka bazlı filtrelemede kullanıcı kartın hangi ürün tipine ait olduğunu
   sadece isimden tahmin etmek zorunda kalıyordu. Başlığın hemen üstünde
   küçük, ikincil bir "kicker" etiketi olarak gösterilir. */
body.page--stoklar .pcard__typeTag,
body.page-urun-detay .pcard__typeTag{
  margin: 8px 0 0;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--accent);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
body.page--stoklar .products.is-list .pcard__typeTag{
  order: 0;
  margin: 0;
  text-align: left;
}
body.page--stoklar .products.density-24 .pcard__typeTag,
body.page--stoklar .products.density-50 .pcard__typeTag{ font-size: 11px; margin-top: 6px; }
body.page--stoklar .products.density-100 .pcard__typeTag{ font-size: 11px; margin-top: 5px; }

.pcard__specRow{
  margin-top: 12px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 4px;
  padding-top: 10px;
  border-top: 1px dashed var(--line);
}
.pcard__specItem{
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  min-width: 0;
}
.pcard__specItem svg{
  width: 16px;
  height: 16px;
  color: var(--accent);
}
.pcard__listExtra{
  /* Sadece "Liste" görünümünde gösterilen ek bilgi satırı (garanti/CRI);
     kart (grid) görünümünde yer darlığı nedeniyle tamamen gizlenir. */
  display: none;
}
.pcard__specItem span{
  font-size: 12px;
  font-weight: 600;
  color: var(--ink);
  /* Bazı değerler ("4020 lm" gibi) hücre genişliğine sığmayıp 2 satıra
     kayabiliyor; bu da o satırın (ve o kartın specRow'unun) diğer
     kartlardan daha yüksek olmasına, dolayısıyla dikey ortalanan
     (justify-content:center) kart gövdesinde tüm içeriğin (başlık dahil)
     kartlar arası kaymasına yol açıyordu. Değer alanı artık HER ZAMAN
     2 satırlık sabit bir yükseklik kaplıyor (tek satırlık değerler dikey
     ortalanır) — böylece specRow yüksekliği içerikten bağımsız sabit
     kalır ve kartlar arası hizalama bozulmaz. */
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  line-height: 1.15;
  min-height: calc(1.15em * 2);
  /* Dar sütunlarda (25/50/100 sayfa yoğunluğu) kelime kırılma noktası
     olmayan değerler ("6500K", "IP65" gibi) hücre dışına taşıp
     görünmez oluyordu. Sığmadığında kelime içinden de kırılabilsin
     ki değer her zaman kart sınırları içinde, okunur kalsın. */
  width: 100%;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.pcard__brandFooter{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px 14px;
  border-top: 1px solid var(--line);
  background: rgba(37,92,255,.04);
  font-size: 12px;
  font-weight: 700;
  color: var(--ink);
  letter-spacing: .01em;
}
.pcard__brandFooter svg{
  width: 15px;
  height: 15px;
  color: var(--accent);
}

/* Stoklar sayfası: kartın tamamı tıklanabilir bir link olsa da üzerinde
   görünür bir "detaya git" ipucu yoktu (sadece hover'da hafif gölge
   değişiyordu). Marka satırının sağına küçük bir "İncele →" ibaresi
   eklenir; böylece kart alt satırı hem markayı hem tıklanabilirliği
   aynı anda gösterir. Stoklar ve ürün detayı ("Benzer/Uyumlu Ürünler")
   sayfalarındaki .pcard__brandFooter aynı iki parçalı (marka + "İncele")
   yapıyı kullanır; projelerdeki .pcard__brandFooter kullanımını etkilemez. */
body.page--stoklar .pcard__brandFooter,
body.page-urun-detay .pcard__brandFooter{
  justify-content: space-between;
}
body.page--stoklar .pcard__brandInfo,
body.page-urun-detay .pcard__brandInfo{
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}
body.page--stoklar .pcard__brandInfo span,
body.page-urun-detay .pcard__brandInfo span{
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
body.page--stoklar .pcard__cta,
body.page-urun-detay .pcard__cta{
  display: flex;
  align-items: center;
  gap: 3px;
  flex: 0 0 auto;
  color: var(--accent);
  font-weight: 600;
  font-size: 12px;
  opacity: .8;
}
body.page--stoklar .pcard__cta svg,
body.page-urun-detay .pcard__cta svg{
  width: 13px;
  height: 13px;
  transition: transform .16s ease;
}
body.page--stoklar .pcard:hover .pcard__cta,
body.page-urun-detay .pcard:hover .pcard__cta{ opacity: 1; }
body.page--stoklar .pcard:hover .pcard__cta svg,
body.page-urun-detay .pcard:hover .pcard__cta svg{ transform: translateX(2px); }

/* Rozet rehberi: kart görselindeki ENEC/TSE/TEDAŞ/Acil/Sensör/ATEX gibi
   rozetlerin anlamı masaüstünde sadece mouse ile üzerine gelince (title
   tooltip) görünüyordu; dokunmatik (mobil) kullanıcılar bunu hiç göremiyordu.
   Bu native <details> açılır-kapanır bilgi kutusu, ürün listesinin hemen
   üstünde, herkesin (mobil dahil) erişebileceği bir rozet lejantı sunar. */
.badgeLegend{
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 14px;
  margin: 0 0 14px;
  overflow: hidden;
}
.badgeLegend__toggle{
  list-style: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 11px 14px;
  font-size: 13px;
  font-weight: 600;
  color: var(--ink);
  user-select: none;
}
.badgeLegend__toggle::-webkit-details-marker{ display: none; }
.badgeLegend__infoIcon{ width: 17px; height: 17px; color: var(--accent); flex: 0 0 auto; }
.badgeLegend__chev{ width: 16px; height: 16px; margin-left: auto; flex: 0 0 auto; transition: transform .16s ease; }
.badgeLegend[open] .badgeLegend__chev{ transform: rotate(180deg); }
.badgeLegend__grid{
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 10px;
  padding: 4px 14px 14px;
  border-top: 1px dashed var(--line);
  margin-top: 2px;
  padding-top: 12px;
}
.badgeLegend__item{
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: 12px;
  color: var(--muted);
  line-height: 1.35;
}
.badgeLegend__item b{ color: var(--ink); }
.badgeLegend__icon{
  width: 22px;
  height: 22px;
  flex: 0 0 auto;
  border: 1px solid var(--line);
  border-radius: 7px;
  object-fit: contain;
  padding: 2px;
  background: #fff;
}
.badgeLegend__dot{
  width: 22px;
  height: 22px;
  flex: 0 0 auto;
  border-radius: 7px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
}
.badgeLegend__dot svg{ width: 14px; height: 14px; }
.badgeLegend__dot--acil{ background: rgba(255,255,255,.9); border: 1px solid rgba(220,38,38,.28); color: #dc2626; }
.badgeLegend__dot--sensor{ background: rgba(255,255,255,.9); border: 1px solid rgba(29,78,216,.28); color: #1d4ed8; }
.badgeLegend__dot--siparis{ background: #e11d2e; color: #fff; font-size: 12px; }
.badgeLegend__dot--overflow{ background: rgba(15,23,42,.88); color: #fff; font-size: 11px; }

/* Liste görünümü: yatay satır — küçük görsel solda, ortada isim+stok/kod+özellikler,
   sağda marka. Kart görünümündeki dikey akıştan bağımsız, kendi düzeni var. */
.products.is-list .pcardSlot .pcard{
  display: flex !important;
  flex-direction: row;
  align-items: center;
  gap: 16px;
  padding: 10px 16px;
  min-height: 0;
  height: auto;
}
.products.is-list .pcard__img--full{
  flex: 0 0 auto;
  width: 140px;
  height: 100px !important;
  border-radius: 12px;
  border: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.products.is-list .pcard__img--full img{
  padding: 8px;
}
.products.is-list .pcard__body--v3{
  flex: 1 1 auto;
  min-width: 0;
  text-align: left;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.products.is-list .pcard__title--v3{
  order: 1;
  margin: 0;
  padding: 0;
  font-size: 14px;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  height: auto;
  max-height: none;
  min-height: 0;
  overflow: hidden;
  white-space: normal;
}
.products.is-list .pcard__title--v3::after{
  display: none;
}
.products.is-list .pcard__metaRow{
  order: 2;
  justify-content: flex-start;
}
.products.is-list .pcard__specRow{
  order: 3;
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  gap: 16px;
  margin-top: 2px;
  padding-top: 0;
  border-top: none;
}
.products.is-list .pcard__specItem{
  flex-direction: row;
  gap: 5px;
}
.products.is-list .pcard__specItem span{
  display: inline;
  min-height: 0;
  white-space: nowrap;
}
.products.is-list .pcard__listExtra{
  /* Liste görünümünde yatayda açılan fazladan alanı, kart görünümünde
     gösterilemeyen ek bilgilerle (garanti süresi, CRI) değerlendiriyoruz. */
  display: flex;
  order: 4;
  gap: 16px;
  margin-top: 2px;
  padding-top: 6px;
  border-top: 1px dashed var(--line);
}
.products.is-list .pcard__brandFooter{
  flex: 0 0 auto;
  width: 120px;
  flex-direction: column;
  gap: 4px;
  border-top: none;
  border-left: 1px solid var(--line);
  background: none;
  padding: 4px 0 4px 16px;
  text-align: left;
  justify-content: center;
}

@media (max-width: 700px) {
  .products.is-list .pcardSlot .pcard{
    flex-wrap: wrap;
  }
  .products.is-list .pcard__brandFooter{
    width: auto;
    border-left: none;
    border-top: 1px dashed var(--line);
    padding: 6px 0 0;
    margin-top: 4px;
    flex-basis: 100%;
  }
}

/* ===================================================================
   Stoklar sayfası — sol sabit filtre paneli + sağda ürün listesi
   (Hepsiburada tarzı düzen). Filtre elemanlarının id'leri değişmedi,
   sadece konumları/gruplamaları güncellendi.
   =================================================================== */

body.page--stoklar .stockLayout{
  display: grid;
  grid-template-columns: 420px minmax(0, 1fr);
  gap: 28px;
  align-items: start;
  margin-top: 6px;
}

body.page--stoklar .filters--v2{
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 16px;
}

/* "fCard" (arama/görünüm/sıralama kartı) artık sol filtre sütununun
   (#filtersPanel) en üstünde yer alıyor. Sütun dar olduğu için (300px)
   kartın iç boşlukları ve grid düzeni, geniş ana kolon yerine dar
   sidebar'a göre daraltılır; ardından gelen ilk filterGroup ile
   arasında belirgin bir boşluk/ayraç bırakılır. */
body.page--stoklar #filtersPanel > .fCard{
  padding: 16px 14px;
  margin-bottom: 4px;
}
body.page--stoklar #filtersPanel .fCard__grid{
  /* Hızlı filtre onay kutuları (Sadece stokta olanlar, TEDAŞ Onaylı,
     TSE Belgeli, vb.) tek sütunda alt alta dizilip paneli gereksiz
     uzatıyordu; dar sidebar'a göre 2 sütuna alındı. */
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 8px;
  row-gap: 8px;
  align-items: stretch;
}
/* Dar sidebar'da chip metni (ör. "Sadece stokta olanlar") 2 satıra
   bölünüyor ve chip'ler birbirine göre farklı yükseklik/hizada
   duruyordu. Yazı boyutu küçültülüp ikon+metin üstten hizalanarak
   her iki chip de aynı görünüme kavuşturuldu. */
body.page--stoklar #filtersPanel .fChip{
  align-items: center;
  gap: 6px;
  padding: 9px 8px;
}
body.page--stoklar #filtersPanel .fChip__icon svg{
  width: 14px;
  height: 14px;
}
body.page--stoklar #filtersPanel .fChip__label{
  font-size: 11px;
  line-height: 1.2;
}
body.page--stoklar #filtersPanel .fCard__head{
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
}
body.page--stoklar #filtersPanel .fCard__smart{
  align-self: stretch;
  justify-content: center;
}
body.page--stoklar #filtersPanel .fCard__toolRow{
  flex-direction: column;
  align-items: stretch;
}
/* Kart/Liste anahtarı: iki buton da eşit genişlikte, ortalanmış
   içerikle satırın tamamını simetrik şekilde paylaşır. */
body.page--stoklar #filtersPanel .fCard__viewSeg{
  margin-left: 0;
  align-self: stretch;
  display: flex;
}
body.page--stoklar #filtersPanel .fCard__viewSeg button{
  flex: 1 1 0;
  justify-content: center;
}
body.page--stoklar #filtersPanel .fCard__sortRow{
  align-items: stretch;
}
body.page--stoklar #filtersPanel .fCard__field{
  min-width: 0;
  /* Dar sidebar'da (~340px) "Sıralama" (260px) ve "Sayfa başına ürün"
     (200px) taban genişlikleri toplamı sığmadığı için alt alta
     düşüyordu. Sidebar bağlamında ikisi de esneyip aynı satırda yan
     yana dursun diye taban 0'a çekildi. */
  flex: 1 1 0;
}
body.page--stoklar #filtersPanel .fCard__field--size{
  flex: 1 1 0;
}
/* #sort öğesindeki genel "min-width:240px" kuralı (üstteki geniş araç
   çubuğu bağlamı için tanımlanmış), dar sidebar'da (~336px) Sıralama
   kutusunun Sayfa başına ürün kutusunun üzerine taşmasına (iç içe
   geçmesine) sebep oluyordu. Sidebar bağlamında bu taban genişlik
   iptal edilir, select konteynerine göre tam genişlikte kalır. */
body.page--stoklar #filtersPanel #sort{
  min-width: 0;
}
/* Sayfalama satırı: Önceki / sayfa bilgisi / Sonraki tam genişliğe
   eşit aralıklarla (kenar-orta-kenar) simetrik dağılır. */
body.page--stoklar #filtersPanel .fCard__paging{
  margin-left: 0;
  width: 100%;
  justify-content: space-between;
}
body.page--stoklar #filtersPanel .fCard__pageBtn{
  flex: 1 1 0;
  justify-content: center;
}
body.page--stoklar #filtersPanel .fCard__pageInfo{
  flex: 0 0 auto;
}
/* Dar sütunda "FİLTRELER | İhtiyacınıza göre filtreleyin" başlığı
   sığmadığı için üç nokta ile kırpılıyordu; açıklama alt satıra
   düşsün / gerekirse tamamen sarsın diye nowrap kaldırıldı. */
body.page--stoklar #filtersPanel .fCard__heading{
  flex-wrap: wrap;
  row-gap: 2px;
}
body.page--stoklar #filtersPanel .fCard__subtitle{
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
  flex-basis: 100%;
}
body.page--stoklar #filtersPanel .fCard__sep{
  display: none;
}
/* Arama satırı: rozetler (Stokta/Toplam) girişin sağında dar bir
   sütuna sıkışıp alt alta yığılıyordu — artık arama kutusu kendi
   satırını, rozetler de altında kendi tam genişlikteki satırını
   simetrik ve yan yana kullanıyor. */
body.page--stoklar #filtersPanel .fCard__searchRow .stockSearchBar{
  flex-wrap: wrap;
  row-gap: 8px;
}
body.page--stoklar #filtersPanel .fCard__searchRow .stockSearchBar__field{
  flex: 1 1 100%;
}
body.page--stoklar #filtersPanel .fCard__searchRow .stockSummary--inSearchBar{
  flex: 1 1 100%;
  flex-wrap: nowrap;
  justify-content: flex-start;
}

body.page--stoklar .stockSidebar__row{
  display: flex;
  justify-content: flex-end;
}
body.page--stoklar .easyBar--stack{
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
}

body.page--stoklar .filterGroup{
  display: block;
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 14px;
  overflow: hidden;
  background: rgba(255,255,255,.6);
  /* Ardışık filtre grupları (Kullanım Alanı, IP Koruma, Renk Sıcaklığı vb.)
     birbirine bitişik durup kenarlıkları çakışarak tek bir blok gibi
     görünüyordu; aralarında ince bir boşluk bırakılır. */
  margin-bottom: 6px;
}
body.page--stoklar .filterGroup:last-of-type{
  margin-bottom: 0;
}
body.page--stoklar .filterGroup > .filterGroup__body{
  display: none;
}
body.page--stoklar .filterGroup[open] > .filterGroup__body{
  display: flex;
}
body.page--stoklar .filterGroup__toggle{
  width: 100%;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 12px 14px;
  margin: 0;
  font-family: inherit;
  font-weight: 600;
  font-size: 14px;
  line-height: 1.3;
  color: var(--ink);
  background: none;
  border: 0;
  text-align: left;
  user-select: none;
}
body.page--stoklar .filterGroup__toggle::after{
  content: '▾';
  flex: 0 0 auto;
  color: var(--muted);
  font-size: 12px;
  transition: transform .15s ease;
}
body.page--stoklar .filterGroup[open] .filterGroup__toggle::after{
  transform: rotate(180deg);
}
body.page--stoklar .filterGroup[open] .filterGroup__toggle{
  border-bottom: 1px solid var(--line);
}
body.page--stoklar .filterGroup__body{
  padding: 12px 14px 14px;
  flex-direction: column;
  gap: 10px;
}
body.page--stoklar .filterGroup .checks{
  max-height: none;
}

body.page--stoklar .stockSidebar__actions{
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding-top: 4px;
  border-top: 1px solid var(--line);
  margin-top: 4px;
}
body.page--stoklar .stockSidebar__actions .btn{
  width: 100%;
  justify-content: center;
}

@media (max-width: 980px) {
  body.page--stoklar .stockLayout{
    grid-template-columns: 1fr;
  }
  body.page--stoklar .filters--v2{
    position: static;
    max-height: none;
  }
}

/* Mobil/tablet: detaylı filtre + sıralama bloğu artık ürünlerden ÖNCE
   ekranın büyük kısmını kaplamıyor. Arama kutusu her zaman görünür
   kalır; geri kalan filtreler ("Filtreler ve Sıralama" butonu) kapalı
   başlar, kullanıcı isterse açar — sonuç listesine çok daha hızlı
   ulaşılır. Masaüstünde (980px üzeri) bu davranış devre dışıdır: buton
   gizli, panel her zaman açık görünür. */
.filtersMobileToggle{
  display:none;
}

/* "Haritada Gör" kısayolu: harita masaüstünde (>1080px) zaten filtrelerin
   yanında en üstte olduğu için orada gizlenir; harita proje listesinin
   ALTINA taşındığı ≤1080px görünümde (bkz. js/site-enhancements.js
   reorderMapForViewport) görünür olur — kullanıcı onlarca proje kartını
   kaydırmadan doğrudan haritaya atlayabilir. */
.projectMapJumpLink{
  display:none;
}
@media (max-width: 1080px){
  .projectMapJumpLink{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    width:100%;
    margin:0 0 12px;
    padding:11px 16px;
    border-radius:14px;
    border:1px solid var(--pj-border, var(--line));
    background:#fff;
    color:var(--pj-primary, var(--ink));
    font-weight:600;
    font-size:14px;
    text-decoration:none;
  }
  .projectMapJumpLink svg{
    flex:none;
    width:17px;
    height:17px;
  }
  .projectMapJumpLink:hover{
    background:var(--pj-bg, #F6F8FC);
  }
}

@media (max-width: 980px) {
  .filtersMobileToggle{
    display:flex;
    align-items:center;
    gap:10px;
    width:100%;
    margin:12px 0;
    padding:13px 16px;
    border-radius:14px;
    border:1px solid var(--line);
    background:var(--paper);
    color:var(--ink);
    font:inherit;
    font-size:14px;
    font-weight:700;
    cursor:pointer;
  }
  .filtersMobileToggle svg{
    flex:none;
    width:18px;
    height:18px;
  }
  .filtersMobileToggle__text{
    flex:1;
    text-align:left;
  }
  .filtersMobileToggle__chev{
    transition: transform .18s ease;
  }
  .filtersMobileToggle[aria-expanded="true"] .filtersMobileToggle__chev{
    transform: rotate(180deg);
  }

  .filtersCollapsible{
    display:none;
    flex-direction:column;
  }
  .filtersCollapsible.is-open{
    display:flex;
  }
}

/* Ürün grid'i: sayfa başına seçilen ürün sayısına göre sabit sütun
   sayısı kullanılır — 15/sayfa: 3 sütun × 5 satır, 25/sayfa: 5×5,
   50/sayfa: 5×10, 100/sayfa: 5×20. */
body.page--stoklar .stockMain .products{
  grid-template-columns: repeat(3, 1fr) !important;
}
body.page--stoklar .stockMain .products.density-24{
  grid-template-columns: repeat(5, 1fr) !important;
}
body.page--stoklar .stockMain .products.density-50{
  grid-template-columns: repeat(5, 1fr) !important;
}
body.page--stoklar .stockMain .products.density-100{
  grid-template-columns: repeat(5, 1fr) !important;
}
body.page--stoklar .stockMain .products.is-list{
  grid-template-columns: 1fr !important;
}

/* Yoğunluk arttıkça kart içi öğeler orantılı küçülür (bozulmadan) */
body.page--stoklar .products.density-24 .pcard__img--full{ height: 195px !important; }
body.page--stoklar .products.density-50 .pcard__img--full{ height: 160px !important; }
body.page--stoklar .products.density-100 .pcard__img--full{ height: 130px !important; }
/* Sipariş rozeti de yoğunlukla birlikte küçüldüğü için üstteki boşluk
   payı da aynı oranla (0.85/0.72/0.58) küçültülür. */
body.page--stoklar .products.density-24 .pcard__img--hasRibbon img{ padding-top: 39px; }
body.page--stoklar .products.density-50 .pcard__img--hasRibbon img{ padding-top: 33px; }
body.page--stoklar .products.density-100 .pcard__img--hasRibbon img{ padding-top: 27px; }

body.page--stoklar .products.density-24 .pcard__body--v3,
body.page--stoklar .products.density-50 .pcard__body--v3,
body.page--stoklar .products.density-100 .pcard__body--v3{
  padding: 9px 10px 8px;
}
body.page--stoklar .products.density-24 .pcard__title--v3{ font-size: 14px; }
body.page--stoklar .products.density-50 .pcard__title--v3{ font-size: 12px; padding-bottom: 9px; }
body.page--stoklar .products.density-100 .pcard__title--v3{ font-size: 12px; padding-bottom: 7px; }

body.page--stoklar .products.density-24 .pcard__metaVal,
body.page--stoklar .products.density-50 .pcard__metaVal{ font-size: 12px; }
body.page--stoklar .products.density-100 .pcard__metaVal{ font-size: 11px; }
body.page--stoklar .products.density-50 .pcard__metaItem svg,
body.page--stoklar .products.density-100 .pcard__metaItem svg{ width: 12px; height: 12px; }
body.page--stoklar .products.density-24 .pcard__metaRow{ gap: 8px; }
body.page--stoklar .products.density-50 .pcard__metaRow{ gap: 5px; }
body.page--stoklar .products.density-100 .pcard__metaRow{ gap: 4px; }
body.page--stoklar .products.density-50 .pcard__metaVal,
body.page--stoklar .products.density-100 .pcard__metaVal{ max-width: 62px; }
body.page--stoklar .products.density-50 .pcard__metaItem,
body.page--stoklar .products.density-100 .pcard__metaItem{ gap: 3px; }
body.page--stoklar .pcard__metaRow,
body.page--stoklar .pcard__metaItem{ min-width: 0; }
body.page--stoklar .pcard__metaVal{ min-width: 0; }
/* Stok adedi her zaman kısa ve kritik bilgidir — asla kesilmesin.
   Kod uzun olabileceğinden, sığmazsa sadece o küçülüp ellipsis alsın. */
body.page--stoklar .pcard__metaItem:first-of-type{
  flex-shrink: 0;
}
body.page--stoklar .pcard__metaItem:first-of-type .pcard__metaVal{
  max-width: none;
  overflow: visible;
}
body.page--stoklar .pcard__metaItem:last-of-type{
  flex-shrink: 1;
  min-width: 0;
}

body.page--stoklar .products.density-50 .pcard__specRow,
body.page--stoklar .products.density-100 .pcard__specRow{ margin-top: 8px; padding-top: 7px; gap: 2px; }
body.page--stoklar .products.density-50 .pcard__specItem svg,
body.page--stoklar .products.density-100 .pcard__specItem svg{ width: 13px; height: 13px; }
body.page--stoklar .products.density-50 .pcard__specItem span,
body.page--stoklar .products.density-100 .pcard__specItem span{ font-size: 11px; }
body.page--stoklar .products.density-50 .pcard__specRow--5 .pcard__specItem span,
body.page--stoklar .products.density-100 .pcard__specRow--5 .pcard__specItem span{ font-size: 11px; }
body.page--stoklar .products.density-50 .pcard__specRow--5 .pcard__specItem svg,
body.page--stoklar .products.density-100 .pcard__specRow--5 .pcard__specItem svg{ width: 11px; height: 11px; }
/* 100/sayfa'da 5 sütun daha da dar olduğundan (özellikle IP değeri)
   bir tık daha küçültülür; minmax(0,1fr) + word-break sayesinde artık
   taşmadan kartın içinde kalır. */
body.page--stoklar .products.density-100 .pcard__specRow--5{ gap: 1px; }
body.page--stoklar .products.density-100 .pcard__specRow--5 .pcard__specItem span{ font-size: 11px; }
body.page--stoklar .products.density-100 .pcard__specRow--5 .pcard__specItem svg{ width: 10px; height: 10px; }

body.page--stoklar .products.density-24 .pcard__brandFooter,
body.page--stoklar .products.density-50 .pcard__brandFooter,
body.page--stoklar .products.density-100 .pcard__brandFooter{ padding: 7px 10px; font-size: 11px; }
body.page--stoklar .products.density-100 .pcard__brandFooter svg{ width: 12px; height: 12px; }

/* Karşılaştırma ("+") düğmesi: görünüm yoğunluğu arttıkça (kartlar
   küçüldükçe) düğme de orantılı olarak küçülsün — sabit 36px büyük kalıp
   küçük kartlarda orantısız/taşma gibi durmasın. */
body.page--stoklar .products.density-24 .comparePick{
  width: 30px; height: 30px; font-size: 15px; top: 8px; right: 8px;
}
body.page--stoklar .products.density-50 .comparePick{
  width: 26px; height: 26px; font-size: 13px; top: 6px; right: 6px;
}
body.page--stoklar .products.density-100 .comparePick{
  width: 22px; height: 22px; font-size: 12px; top: 5px; right: 5px;
}

@media (max-width: 980px) {
  body.page--stoklar .stockMain .products{
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)) !important;
  }
  body.page--stoklar .stockMain .products.density-24,
  body.page--stoklar .stockMain .products.density-50,
  body.page--stoklar .stockMain .products.density-100{
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)) !important;
  }
}
/* Tablet (ör. 768px genişlik): 980px kuralındaki 160px minimum, filtre
   paneli üstte tam genişlikte akınca içerik alanına 4 dar sütun sığdırıyor
   ve ürün kodu/tip gibi metinler "..." ile aşırı kısalıyordu. 481-899px
   aralığında biraz daha geniş bir minimum (210px) kullanılarak kart
   başına daha fazla yatay alan bırakılır (genelde 3 sütun), metinler
   daha az kesilir. 480px ve altı zaten kendi (2 sütun sabit) kuralını
   kullanmaya devam eder. */
@media (max-width: 899px) {
  body.page--stoklar .stockMain .products{
    grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)) !important;
  }
  body.page--stoklar .stockMain .products.density-24,
  body.page--stoklar .stockMain .products.density-50,
  body.page--stoklar .stockMain .products.density-100{
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)) !important;
  }
}
@media (max-width: 480px) {
  body.page--stoklar .stockMain .products{
    grid-template-columns: repeat(2, 1fr) !important;
  }
  body.page--stoklar .stockMain .products.density-24,
  body.page--stoklar .stockMain .products.density-50,
  body.page--stoklar .stockMain .products.density-100{
    grid-template-columns: repeat(2, 1fr) !important;
  }

  /* 2 sütunlu dar kartlarda "Stokta" rozeti ile ürün kodu aynı satırda
     yer için yarışınca ürün kodu "51..." gibi okunmaz hâle kesiliyordu.
     Ürün kodu artık kendi satırına geçiyor; böylece neredeyse kartın
     tam genişliğini kullanabiliyor ve gerçekten sığmadığı çok nadir
     durumda küçülüp üç nokta ile kısalıyor (tamamen kaybolmuyor). */
  body.page--stoklar .pcard__metaRow{
    flex-wrap: wrap;
    row-gap: 4px;
    justify-content: flex-start;
  }
  body.page--stoklar .pcard__metaDivider{
    display: none;
  }
  body.page--stoklar .pcard__metaItem:last-of-type{
    flex-basis: 100%;
    width: 100%;
  }
  body.page--stoklar .pcard__metaVal{
    font-size: 12px;
  }
  body.page--stoklar .pcard__metaItem:last-of-type .pcard__metaVal{
    max-width: none;
  }

  /* 2 sütunlu dar kartlarda 4-5'li teknik özellik satırı (Watt, Kelvin,
     Lümen, lm/W, IP gibi) her değere sadece ~30-35px genişlik bırakıyor;
     bu da "6500K" gibi kırılma noktası olmayan değerlerin ortadan
     ("650" / "0K" şeklinde) bölünmesine yol açıyordu. Sütun sayısını
     azaltıp değerleri 2 satıra (3+2 veya 2+2) sarmak, her hücreye daha
     fazla genişlik bırakarak değerlerin bütün kalmasını sağlıyor. */
  body.page--stoklar .pcard__specRow--5{
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  body.page--stoklar .pcard__specRow--4{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* ===================================================================
   Stoklar — sol panel: taşma güvenliği + son hizalama düzeltmeleri
   =================================================================== */
body.page--stoklar .filters--v2,
body.page--stoklar .filters--v2 *{
  min-width: 0;
}
body.page--stoklar .filters--v2{
  overflow-x: hidden;
}
body.page--stoklar .filters--v2 .qWrap,
body.page--stoklar .filters--v2 .input,
body.page--stoklar .filters--v2 .select,
body.page--stoklar .filters--v2 .rangeRow{
  width: 100%;
  max-width: 100%;
}
body.page--stoklar .filters--v2 .checks{
  width: 100%;
}
body.page--stoklar .filters--v2 .checks .chk,
body.page--stoklar .filters--v2 .checks label{
  width: 100%;
  max-width: 100%;
}
body.page--stoklar .filters--v2 .checks .chk span,
body.page--stoklar .filters--v2 .checks label span:first-of-type{
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
body.page--stoklar .filters--v2 .chips{
  width: 100%;
}
body.page--stoklar .filters--v2 .chip{
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
}
body.page--stoklar .filters--v2 .rangeMeta{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}
body.page--stoklar .filters--v2 .rangeMeta .miniTag{
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 100%;
}
body.page--stoklar .stockSidebar__row{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

/* Sol panel (stoklar): eski "#types.checks--compact" sabit yükseklik +
   overflow:auto kuralları (2 sütunlu geniş liste tasarımından kalma)
   artık dar sidebar'da gereksiz ve native ok-butonlu scrollbar'a yol
   açıyordu. Marka/Ürün Tipi listeleri artık doğal akışta, sayfayla
   birlikte kayar; ayrı iç scroll kutusu yok. */
body.page--stoklar #types.checks--compact,
body.page--stoklar #brands.checks--compact{
  height: auto !important;
  max-height: none !important;
  min-height: 0 !important;
  overflow: visible !important;
  display: flex !important;
  flex-wrap: wrap !important;
  column-count: unset !important;
  padding-right: 0 !important;
}

/* ===================================================================
   Stoklar — üstte tam genişlik arama çubuğu + hizalama son rötuşları
   =================================================================== */
body.page--stoklar .stockSearchBar{
  margin-top: 14px;
}
body.page--stoklar .stockSearchBar .input{
  width: 100%;
  padding: 16px 20px;
  font-size: 15px;
  border-radius: 16px;
  box-shadow: 0 8px 20px rgba(15,23,42,.05);
}
body.page--stoklar .stockSearchBar .input:focus{
  border-color: rgba(37,92,255,.35);
  box-shadow: 0 8px 24px rgba(37,92,255,.12);
}

body.page--stoklar .stockLayout{
  margin-top: 16px;
}

body.page--stoklar .stockToolsRow{
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 8px;
}
body.page--stoklar .stockSummary{
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
body.page--stoklar .stockCountTop{
  flex: 0 0 auto;
  white-space: nowrap;
}


/* ===================================================================
   Stoklar — sol panel: yazı/buton boyutları ~%80'e küçültüldü (daha
   fazla içerik daha az yer kaplasın, taşma riski azalsın).
   =================================================================== */
body.page--stoklar .filters--v2{
  font-size: 13px;
}
body.page--stoklar .filters--v2 .input,
body.page--stoklar .filters--v2 .select{
  padding: 9px 10px;
  font-size: 13px;
  border-radius: 12px;
}
body.page--stoklar .filters--v2 .chip{
  padding: 6px 9px;
  font-size: 11px;
  gap: 6px;
}
/* "Hepsini Seç" / "Temizle" hızlı seçim butonları: daha net, ayırt edilebilir */
body.page--stoklar .filters--v2 .checksBar .chip{
  font-weight: 600;
  border-width: 1px;
  transition: transform .12s ease, box-shadow .12s ease, background-color .12s ease;
}
body.page--stoklar .filters--v2 .checksBar .chip[data-b="all"],
body.page--stoklar .filters--v2 .checksBar .chip[data-t="all"]{
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
  box-shadow: 0 6px 14px rgba(7,25,74,.18);
}
body.page--stoklar .filters--v2 .checksBar .chip[data-b="all"]:hover,
body.page--stoklar .filters--v2 .checksBar .chip[data-t="all"]:hover{
  background: #0a2260;
  box-shadow: 0 8px 18px rgba(7,25,74,.26);
  transform: translateY(-1px);
}
body.page--stoklar .filters--v2 .checksBar .chip[data-b="none"],
body.page--stoklar .filters--v2 .checksBar .chip[data-t="none"]{
  background: #fff;
  border-color: rgba(220,38,38,.35);
  color: #c0304a;
}
body.page--stoklar .filters--v2 .checksBar .chip[data-b="none"]:hover,
body.page--stoklar .filters--v2 .checksBar .chip[data-t="none"]:hover{
  background: rgba(220,38,38,.08);
  border-color: rgba(220,38,38,.5);
  transform: translateY(-1px);
}
body.page--stoklar .filters--v2 .btn{
  padding: 7px 10px;
  font-size: 12px;
}
body.page--stoklar .filters--v2 .chk{
  padding: 7px 8px;
  gap: 6px;
  font-size: 12px;
}
body.page--stoklar .filters--v2 .chk input{
  width: 13px;
  height: 13px;
}
body.page--stoklar .filters--v2 .miniTag{
  padding: 5px 8px;
  font-size: 11px;
}
body.page--stoklar .filterGroup__toggle{
  padding: 10px 11px;
  font-size: 11px;
}
body.page--stoklar .filterGroup__body{
  padding: 10px 11px 11px;
  gap: 8px;
}
body.page--stoklar .filterGroup .checks{
  gap: 6px;
}
body.page--stoklar .filters--v2 .checks .chk,
body.page--stoklar .filters--v2 .checks label{
  padding: 6px 8px;
}
body.page--stoklar .filters--v2 .rangeMeta .btn{
  padding: 6px 9px;
}
body.page--stoklar .stockSummary .miniTag,
body.page--stoklar .stockCountTop{
  font-size: 11px;
  padding: 6px 9px;
}
body.page--stoklar .stockSidebar__actions .btn{
  padding: 9px 10px;
  font-size: 12px;
}

/* ===================================================================
   Stoklar — hızlı stok checkbox'ları artık viewbar'da (Kart/Liste
   yanında), sidebar'da değil.
   =================================================================== */
body.page--stoklar .viewbar__quickChecks{
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
body.page--stoklar .viewbar__quickChecks .chk{
  padding: 8px 10px;
  font-size: 12px;
  white-space: nowrap;
}
body.page--stoklar .viewbar__infoNote{
  display: inline-flex;
  align-items: center;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px dashed rgba(37,92,255,.30);
  background: rgba(37,92,255,.05);
  color: var(--accent);
  font-size: 12px;
  font-weight: 600;
  line-height: 1.3;
  flex: 0 1 auto;
}
body.page--stoklar .viewbar__left{
  flex-wrap: wrap;
}

/* Stok/Toplam özeti artık Kart/Liste görünüm seçicisinin hemen yanında
   (satırın en sağına itilmiyor); Aktif filtre bilgisi ve "Filtreleri
   Temizle" ise aynı satırda onun yanında yer alır — ayrı satır/boşluk yok. */
body.page--stoklar .stockSummary{
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.metaLine--inline{
  margin-top: 0;
  align-items: center;
}
.metaLine--inline:empty{
  display: none;
}
.stockClearBar--inline{
  display: flex;
  align-items: center;
  margin: 0;
}
.stockClearBar--inline .btn--sm{
  padding: 7px 12px;
  font-size: 12px;
}
@media (max-width: 760px) {
  body.page--stoklar .viewbar__quickChecks{
    width: 100%;
  }
  body.page--stoklar .stockSummary{
    width: 100%;
  }
}

/* Stoklar sayfası: breadcrumb / başlık / araç çubuğu arasındaki gereksiz
   boşlukları azalt (ekran görüntüsünde yeşil çizgilerle işaretlenen alanlar). */
body.page--stoklar .breadcrumb{ margin-bottom: 10px; }
body.page--stoklar .head{ margin-bottom: 10px; }
body.page--stoklar .stockLayout{ margin-top: 2px; }

/* Ürün detay sayfası: breadcrumb'ı diğer sayfalarla aynı hizaya getir
   (header ile ilk section arasındaki boşluk + breadcrumb altı boşluk). */
body.page-urun-detay .breadcrumb{ margin-bottom: 10px; }

/* Stoklar sayfası: diğer sayfalarla (Projeler, Belgeler vb.) aynı ortalanmış,
   kenarlarda boşluk bırakan container genişliğini kullanır. */
body.page--stoklar .section > .container{
  width: min(1220px, 88vw);
}

/* Kartlar aynı satırda eşit yükseklikte kalsın (grid varsayılan stretch),
   ama fazla boşluk specRow ile marka etiketi arasında garip bir açıklık
   olarak görünmesin — gövde içeriği dikeyde ortalanır, marka etiketi
   her zaman kartın en altına yapışık, tutarlı bir konumda kalır. */
body.page--stoklar .pcardSlot .pcard{
  display: flex !important;
  flex-direction: column;
}
body.page--stoklar .pcard__img--full{
  flex: 0 0 auto;
}
body.page--stoklar .pcard__body--v3{
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
body.page--stoklar .pcard__brandFooter{
  flex: 0 0 auto;
}

body.page--stoklar .products.is-list .pcardSlot .pcard{
  flex-direction: row;
}
body.page--stoklar .products.is-list .pcard__body--v3{
  justify-content: flex-start;
}

/* Ürün detay — "Benzer Ürünler" / "Uyumlu Ürünler" kartları: içerik
   yüksekliği ürüne göre değişse de (ör. Trafo'nun 4 satırlı specRow'u
   vs. tek satırlık başlık), marka etiketi her zaman kartın en altına
   yapışık kalsın — stoklar sayfasındaki aynı çözüm burada da uygulanır. */
.page-urun-detay #similarProducts .pcard,
.page-urun-detay #compatibleProducts .pcard{
  display: flex;
  flex-direction: column;
  height: 100%;
}
.page-urun-detay #similarProducts .pcard__img--full,
.page-urun-detay #compatibleProducts .pcard__img--full{
  flex: 0 0 auto;
}
.page-urun-detay #similarProducts .pcard__body--v3,
.page-urun-detay #compatibleProducts .pcard__body--v3{
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.page-urun-detay #similarProducts .pcard__brandFooter,
.page-urun-detay #compatibleProducts .pcard__brandFooter{
  flex: 0 0 auto;
}

/* ===================================================================
   Projeler & Referanslar — katlanabilir filtre grupları (stoklar
   sayfasındaki mantığa benzer: her zaman görünür sol panel, sade
   aç/kapa başlıklar) ve kart yükseklik tutarlılığı.
   =================================================================== */
.page--projeler .pFilterGroup{
  display: block;
  border: 1px solid var(--line);
  border-radius: 16px;
  overflow: hidden;
  background: rgba(255,255,255,.6);
}
.page--projeler .pFilterGroup > .pFilterGroup__body{
  display: none;
}
.page--projeler .pFilterGroup[open] > .pFilterGroup__body{
  display: block;
  padding: 0 14px 14px;
}
.page--projeler .pFilterGroup__toggle{
  width: 100%;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 12px 14px;
  margin: 0;
  font-family: inherit;
  font-weight: 600;
  font-size: 14px;
  color: var(--ink);
  background: none;
  border: 0;
  text-align: left;
}
.page--projeler .pFilterGroup__toggle::after{
  content: '+';
  flex: 0 0 auto;
  color: var(--accent);
  font-size: 15px;
  font-weight: 700;
  line-height: 1;
  transition: transform .15s ease;
}
.page--projeler .pFilterGroup[open] .pFilterGroup__toggle::after{
  transform: rotate(45deg);
}
.page--projeler .pFilterGroup[open] .pFilterGroup__toggle{
  border-bottom: 1px solid var(--line);
  margin-bottom: 12px;
}
.page--projeler .pFilterGroup + .pFilterGroup{
  margin-top: 10px;
}
.page--projeler .pFilterGroup__toggleText{
  display: inline-flex;
  align-items: center;
  gap: 7px;
}
.page--projeler .pFilterGroup__dot{
  display: inline-block;
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: var(--accent);
}
.page--projeler .projectFilterCard__head h2{
  display: flex;
  align-items: center;
  gap: 8px;
}
.page--projeler .pActiveCount{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 20px;
  height: 20px;
  padding: 0 6px;
  border-radius: 999px;
  background: var(--accent);
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  font-family: "Inter", system-ui;
}
.page--projeler .pSearchWrap{
  position: relative;
  display: flex;
  align-items: center;
}
.page--projeler .pSearchWrap .input{
  width: 100%;
  padding-right: 32px;
}
.page--projeler .pSearchWrap .input::-webkit-search-cancel-button,
.page--projeler .pSearchWrap .input::-webkit-search-decoration{
  -webkit-appearance: none;
  appearance: none;
  display: none;
}
.page--projeler .pSearchWrap__clear{
  position: absolute;
  right: 8px;
  width: 22px;
  height: 22px;
  border-radius: 999px;
  border: 0;
  background: rgba(7,25,74,.08);
  color: var(--muted);
  font-size: 15px;
  line-height: 1;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}
.page--projeler .pSearchWrap__clear:hover{
  background: rgba(7,25,74,.14);
  color: var(--ink);
}
.page--projeler .projectFilterCard__group + .pFilterGroup{
  margin-top: 14px;
}

/* Proje kartları: aynı satırda eşit yükseklik + dengeli iç boşluk
   (kısa/uzun başlıklarda CTA her zaman kartın en altına yapışık). */
.page--projeler #projectList.products{
  align-items: stretch;
}
.page--projeler #projectList .projectRefCard{
  display: flex;
  flex-direction: column;
  height: 100%;
}
.page--projeler #projectList .projectRefCard .pcard__img{
  flex: 0 0 auto;
}
.page--projeler #projectList .projectRefCard .pcard__body{
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
}
.page--projeler #projectList .projectRefCard .projectRef__cta{
  margin-top: auto;
  padding-top: 10px;
}

@media (max-width: 640px) {
  .page--projeler .pFilterGroup__toggle{
    padding: 11px 12px;
    font-size: 13px;
  }
}

/* ===================================================================
   Projeler sayfası — kart tasarımı stoklar sayfasındaki temiz yapıdan
   ilham alınarak yenilendi: büyük görsel + yıl/şehir satırı + başlık +
   kategori/çözüm satırı + "Detayı İncele" alt bandı.
   =================================================================== */
.page--projeler #projectList.products{
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)) !important;
  gap: 16px !important;
  align-items: start;
}
.page--projeler .projectRefCard{
  display: flex !important;
  flex-direction: column;
  text-decoration: none;
  border: 1px solid var(--line);
  border-radius: 20px;
  overflow: hidden;
  background: var(--paper);
  box-shadow: 0 8px 20px rgba(15,23,42,.05);
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.page--projeler .projectRefCard:hover{
  transform: translateY(-3px);
  box-shadow: 0 18px 38px rgba(15,23,42,.12);
  border-color: rgba(37,92,255,.22);
}
.page--projeler .projectRefCard .pcard__img--full{
  position: relative !important;
  display: block !important;
  width: 100%;
  height: 190px !important;
  background: linear-gradient(160deg, rgba(37,92,255,.08), rgba(0,194,255,.05) 55%, rgba(15,23,42,.02));
  border-bottom: 1px solid var(--line);
  overflow: hidden;
  padding: 0 !important;
}
.page--projeler .projectRefCard .pcard__img--full img{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.page--projeler .projectRefCard__noImg{
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  color: var(--muted);
}
.page--projeler .projectRefCard__noImg svg{
  width: 26px;
  height: 26px;
  color: rgba(37,92,255,.35);
}
.page--projeler .projectRefCard__noImg span{
  font-size: 12px;
  font-weight: 600;
}
.page--projeler .projectRefCard .pcard__body--v3{
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 14px 16px 12px;
}
.page--projeler .projectRefCard .pcard__title--v3{
  margin: 10px 0 0;
  font-size: 16px;
  line-height: 1.32;
  display: block;
  height: auto;
  max-height: none;
  min-height: 0;
  overflow: visible;
  white-space: normal;
  border-radius: 6px;
  cursor: pointer;
  transition: color .14s ease;
}
/* Proje adına tıklamak sayfadan ayrılmak yerine haritayı o konuma
   yaklaştırır — bu ipucunu görsel olarak da verelim. */
.page--projeler .projectRefCard .pcard__title--v3:hover,
.page--projeler .projectRefCard .pcard__title--v3:focus-visible{
  color: var(--brand, #255cff);
  text-decoration: underline;
  text-decoration-thickness: 1.5px;
  text-underline-offset: 3px;
  outline: none;
}
.page--projeler .projectRefCard .pcard__specRow--2{
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px dashed var(--line);
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
}
.page--projeler .projectRefCard .pcard__specItem span{
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: inline;
  min-height: 0;
}
.page--projeler .projectRefCard .pcard__brandFooter{
  flex: 0 0 auto;
  justify-content: center;
}

/* Liste görünümü — yatay satır, küçük görsel solda */
.page--projeler .products.is-list#projectList{
  display: flex !important;
  flex-direction: column;
  gap: 10px;
}
.page--projeler .products.is-list .projectRefCard{
  flex-direction: row !important;
  align-items: center;
  gap: 16px;
  padding: 10px 16px;
}
.page--projeler .products.is-list .projectRefCard .pcard__img--full{
  flex: 0 0 auto;
  width: 100px;
  height: 76px !important;
  border-radius: 12px;
  border: 1px solid var(--line);
}
.page--projeler .products.is-list .projectRefCard .pcard__body--v3{
  flex: 1 1 auto;
  min-width: 0;
  padding: 0;
  text-align: left;
}
.page--projeler .products.is-list .projectRefCard .pcard__metaRow{
  justify-content: flex-start;
}
.page--projeler .products.is-list .projectRefCard .pcard__title--v3{
  font-size: 14px;
  margin-top: 6px;
}
.page--projeler .products.is-list .projectRefCard .pcard__specRow--2{
  flex-direction: row;
  border-top: none;
  margin-top: 6px;
  padding-top: 0;
  display: flex;
  gap: 16px;
}
.page--projeler .products.is-list .projectRefCard .pcard__brandFooter{
  flex: 0 0 auto;
  width: 130px;
  border-top: none;
  border-left: 1px solid var(--line);
  background: none;
}

@media (max-width: 700px) {
  .page--projeler .products.is-list .projectRefCard{
    flex-wrap: wrap;
  }
  .page--projeler .products.is-list .projectRefCard .pcard__brandFooter{
    width: auto;
    border-left: none;
    border-top: 1px dashed var(--line);
    margin-top: 6px;
    padding-top: 6px;
    flex-basis: 100%;
  }
}

/* Proje/ürün detay — ana görsel yoksa nazik bir yer tutucu */
.gallery__noImg{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
  min-height: 260px;
  color: var(--muted);
  background: linear-gradient(160deg, rgba(37,92,255,.06), rgba(0,194,255,.04));
  border-radius: 16px;
}
.gallery__noImg svg{
  color: rgba(37,92,255,.35);
}
.gallery__noImg span{
  font-size: 13px;
  font-weight: 600;
}

/* === Footer social icons (Facebook / Instagram) === */
.footer__social{
  display:flex;
  gap:10px;
  margin-top:14px;
}
.footer__socialLink{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:36px;
  height:36px;
  border-radius:50%;
  border:1px solid var(--line);
  background:var(--paper);
  color:var(--muted);
  transition: color .2s ease, border-color .2s ease, transform .2s ease;
}
.footer__socialLink:hover{
  color:var(--accent);
  border-color:var(--accent);
  transform:translateY(-2px);
}
.footer__socialLink svg{ width:18px; height:18px; display:block; }

/* === Legal pages (KVKK / Gizlilik / Çerez) — same .head + .tile pattern as the rest of the site === */
.legalDoc{
  max-width: 860px;
  padding: 32px 36px;
}
.legalDoc__updated{
  display:block;
  font-size: 13px;
  color: var(--muted);
  font-weight: 700;
  margin-bottom: 24px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--line);
}
.legalDoc h2{
  font-size: 17px;
  color: var(--ink);
  margin: 26px 0 10px;
  font-family: "Space Grotesk", system-ui;
}
.legalDoc h2:first-of-type{ margin-top: 4px; }
.legalDoc p,
.legalDoc ul{
  margin: 0 0 14px;
  font-size: 15px;
  line-height: 1.7;
  color: var(--muted);
}
.legalDoc ul{ padding-left: 20px; }
.legalDoc li{ margin-bottom: 8px; }
.legalDoc strong{ color: var(--ink); }
.legalDoc a{ color: var(--accent); font-weight:700; }
.legalDoc__foot{
  margin-top: 26px;
  padding-top: 18px;
  border-top: 1px solid var(--line);
  font-size: 14px;
  line-height: 1.9;
  color: var(--muted);
}
.legalDoc__foot .legalInlineBtn{
  margin: 0 2px;
  vertical-align: baseline;
}
@media (max-width: 640px) {
  .legalDoc{ padding: 22px; }
}

/* === Fix: projects category filter was rendering twice (compact chips +
   a duplicate "visual" card grid injected by site-enhancements.js right
   below it). Keep the compact chip row only. === */
.projectTypeVisuals{
  display: none;
}

/* === Belgeler / Listeler: sidebar filter layout, inspired by the
   Projeler & Referanslar filter card (same column ratio + breakpoint). === */
.docsHubLayout{
  display: grid;
  grid-template-columns: minmax(260px, 300px) minmax(0, 1fr);
  gap: 20px;
  align-items: start;
}
.docsFilterCard{
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 22px;
  box-shadow: 0 14px 34px rgba(15,23,42,.06);
  padding: 18px;
  display: grid;
  gap: 14px;
  align-content: start;
}
.docsFilterCard__head{
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}
.docsFilterCard__headMain{
  min-width: 0;
}
.docsFilterCard__head h2{
  margin: 0;
  font-size: 18px;
  font-family: "Space Grotesk", system-ui;
}
.docsFilterCard__head p{
  margin: 6px 0 0;
  font-size: 13px;
  color: var(--muted);
}
.docsFilterCard__resetBtn{
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 12px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: #fff;
  color: var(--muted);
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  transition: color .15s ease, border-color .15s ease, background .15s ease;
}
.docsFilterCard__resetBtn svg{
  width: 14px;
  height: 14px;
  flex: 0 0 auto;
}
.docsFilterCard__resetBtn:hover{
  color: var(--accent);
  border-color: rgba(37,92,255,.28);
  background: rgba(37,92,255,.06);
}
.docsFilterCard__resetBtn:focus-visible{
  outline: 2px solid rgba(37,92,255,.45);
  outline-offset: 2px;
}
.docsFilterCard__group{
  display: grid;
  gap: 6px;
}
.docsFilterCard__label{
  font-size: 12px;
  font-weight: 600;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .03em;
}
.docsFilterCard .docsHubSelect{
  width: 100%;
}
.docsFilterCard .docsHubToggle{
  width: 100%;
  box-sizing: border-box;
  justify-content: center;
}
.docsSearchBar{
  position: relative;
}
.docsSearchBar .docsHubInput{
  width: 100%;
  box-sizing: border-box;
  padding-left: 38px;
}
.docsSearchBar__icon{
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  width: 16px;
  height: 16px;
  color: var(--muted);
  pointer-events: none;
}
.docsFilterCard__foot{
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  margin-top: 2px;
  background: rgba(15,23,42,.03);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 12px 14px;
  font-size: 12px;
  font-weight: 600;
  color: var(--muted);
}
.docsFilterCard__foot svg{
  width: 15px;
  height: 15px;
  flex: 0 0 auto;
  color: var(--accent);
}
.docsHubContent{
  min-width: 0;
}
.docsHubContent .docsHubActive{
  margin-top: 0;
}
@media (max-width: 1080px) {
  .docsHubLayout{
    grid-template-columns: 1fr;
  }
}

/* === Belgeler / Listeler cards: icon-led meta + explicit İncele/İndir actions
   (inspired by the icon+value meta rows used on the Stoklar product cards). === */
.docHubActionBtn{
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.docHubActionBtn svg{
  flex: 0 0 auto;
  width: 15px;
  height: 15px;
}
.docHubBrand{
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.docHubBrand svg{
  flex: 0 0 auto;
  width: 13px;
  height: 13px;
}
.docHubMeta span{
  display: inline-flex;
  align-items: center;
  gap: 5px;
}
.docHubMeta svg{
  flex: 0 0 auto;
  width: 12px;
  height: 12px;
  opacity: .8;
}

/* === Listeler / Belgeler cards: visual cover header (real PDF first-page
   thumbnail when available, brand mark + type ribbon on top). Replaces the
   old plain top badge row and the removed "Kritik" importance system with a
   single unobtrusive freshness dot. Scoped to .docsHubGrid only, so the
   shared .docHubCard classes used by product-page document cards
   (.productDocCard on urun-detay.html) are completely unaffected. === */
/* Large horizontal content card: cover image fixed-width on the left,
   spanning the full card height; title/meta/actions stacked in the wider
   right-hand column. Replaces the earlier small vertical grid-card layout —
   .docsHubGrid is now a single column of these wide rows. */
.docsHubGrid .docHubCard{
  display: grid;
  grid-template-columns: 210px minmax(0, 1fr);
  grid-template-rows: auto auto;
  align-items: stretch;
  padding: 0;
  overflow: hidden;
  gap: 0;
  cursor: default;
}
.docsHubGrid .docHubCard__cover{
  position: relative;
  grid-column: 1;
  grid-row: 1 / -1;
  aspect-ratio: auto;
  height: 100%;
  min-height: 168px;
  background: linear-gradient(135deg, var(--accent) 0%, #0c2a68 60%, var(--accent) 100%);
  overflow: hidden;
}
.docsHubGrid .docHubCard__cover::before{
  content: "";
  position: absolute;
  inset: -20% -10%;
  background: linear-gradient(112deg,
    transparent 0 42%,
    rgba(215,229,31,.92) 42% 46%,
    rgba(255,255,255,.42) 46% 48%,
    transparent 48% 100%);
}
.docsHubGrid .docHubCard__cover[data-kind="catalog"]{
  background: linear-gradient(135deg, #0c2a68 0%, var(--accent) 55%, #123a86 100%);
}
.docsHubGrid .docHubCard__cover[data-kind="cert"]{
  background: linear-gradient(135deg, var(--accent) 0%, #3a1150 60%, var(--accent) 100%);
}
.docsHubGrid .docHubCard__cover[data-kind="report"]{
  background: linear-gradient(135deg, var(--accent) 0%, #0a3d4a 60%, var(--accent) 100%);
}
.docsHubGrid .docHubCard__cover.has-thumb::before{
  display: none;
}
.docsHubGrid .docHubCard__coverImg{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top center;
  display: block;
}
.docsHubGrid .docHubCard__ribbon{
  position: absolute;
  top: 12px;
  right: 12px;
  max-width: calc(100% - 24px);
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(255,255,255,.94);
  border: 1px solid rgba(15,23,42,.08);
  color: var(--ink);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .01em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  box-shadow: 0 6px 14px rgba(2,6,23,.16);
}
/* Certificates/reports tend to have their own letterhead crowding the top
   of the page — move the type ribbon down to the empty footer area instead
   of stacking it over the document's own header graphics. */
.docsHubGrid .docHubCard__cover[data-kind="cert"].has-thumb .docHubCard__ribbon,
.docsHubGrid .docHubCard__cover[data-kind="report"].has-thumb .docHubCard__ribbon{
  top: auto;
  bottom: 12px;
  right: 12px;
}
.docsHubGrid .docHubCard__coverMark{
  position: absolute;
  left: 14px;
  bottom: 12px;
  width: 40px;
  height: 40px;
  border-radius: 12px;
  background: #fff;
  display: grid;
  place-items: center;
  box-shadow: 0 8px 18px rgba(2,6,23,.28);
  overflow: hidden;
}
.docsHubGrid .docHubCard__coverMark img{
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: 6px;
}
.docsHubGrid .docHubCard__coverMark.is-fallback{
  background: rgba(255,255,255,.16);
  border: 1px solid rgba(255,255,255,.32);
}
.docsHubGrid .docHubCard__cover.has-thumb .docHubCard__coverMark.is-fallback{
  background: rgba(7,25,74,.82);
  border: 1px solid rgba(255,255,255,.24);
}
.docsHubGrid .docHubCard__coverMark.is-fallback span{
  color: #fff;
  font-family: "Space Grotesk", system-ui;
  font-weight: 600;
  font-size: 16px;
}
.docsHubGrid .docHubCard__body{
  grid-column: 2;
  grid-row: 1;
  padding: 18px 20px 6px;
  gap: 7px;
  align-content: start;
}
.docsHubGrid .docHubCard__desc{
  margin: 2px 0 0;
  color: var(--muted);
  font-size: 12px;
  line-height: 1.55;
}
.docsHubGrid .docHubChips{
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 2px;
}
.docsHubGrid .docHubChip{
  display: inline-flex;
  align-items: center;
  padding: 5px 10px;
  border-radius: 999px;
  background: rgba(15,23,42,.05);
  color: var(--muted);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .02em;
}
.docsHubGrid .docHubChip.is-ok{
  background: rgba(22,163,74,.12);
  color: #15803d;
}
.docsHubGrid .docHubChip.is-off{
  background: rgba(148,163,184,.16);
  color: var(--muted);
}
.docsHubGrid .docHubActions{
  grid-column: 2;
  grid-row: 2;
  padding: 10px 20px 18px;
}
@media (max-width: 720px){
  .docsHubGrid .docHubCard{
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto auto auto;
  }
  .docsHubGrid .docHubCard__cover{
    grid-column: 1;
    grid-row: 1;
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
  }
  .docsHubGrid .docHubCard__body{
    grid-column: 1;
    grid-row: 2;
    padding: 16px 16px 4px;
  }
  .docsHubGrid .docHubActions{
    grid-column: 1;
    grid-row: 3;
    padding: 10px 16px 16px;
  }
}
.docsHubGrid .docHubCheck{
  top: 12px;
  right: auto;
  left: 12px;
  z-index: 3;
}
.docsHubGrid .docHubCheck span{
  background: rgba(255,255,255,.92);
  border-color: rgba(255,255,255,.5);
}
.docHubDot{
  display: inline-block;
  width: 7px;
  height: 7px;
  border-radius: 999px;
  margin-right: 6px;
  background: var(--muted);
  vertical-align: middle;
}
.docHubDot.is-fresh{ background: #16a34a; }
.docHubDot.is-archive{ background: #94a3b8; }

/* ===================================================================
   Proje Detayı — "Benzer Ürünler" ve "Benzer Referanslar" kartlarını
   stoklar sayfasındaki v3 ürün kartı tasarımıyla hizala. Eski düz
   (pcard--flat) kart kuralları artık kullanılmıyor; burada v3 kart
   yapısı (görsel + stok/kod satırı + watt/kelvin/lümen + marka bandı)
   proje detay bağlamına göre yeniden ölçekleniyor.
   =================================================================== */
.pcard__specRow--1{ grid-template-columns: minmax(0, 1fr); justify-items: center; }
.pcard__specRow--2{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
.pcard__specRow--4{ grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 2px; }
.pcard__specRow--4 .pcard__specItem span{ font-size: 11px; }
.pcard__specRow--5{ grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 2px; }
.pcard__specRow--5 .pcard__specItem span{ font-size: 11px; }
.pcard__specRow--5 .pcard__specItem svg{ width: 14px; height: 14px; }
.pcard__noImg{
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  color: var(--muted);
  background: linear-gradient(160deg, rgba(37,92,255,.10), rgba(0,194,255,.06) 55%, rgba(15,23,42,.03));
}
.pcard__noImg svg{ color: rgba(37,92,255,.35); }
.pcard__noImg span{
  font-size: 12px;
  font-weight: 600;
  padding: 0 12px;
  text-align: center;
}

/* "Kullanılan Ürünler" — bilinçli olarak stoklar sayfasındaki dikey pcard
   tasarımının bir kopyası DEĞİL: bu projede kaç adet kullanıldığı bilgisini
   öne çıkarmak için üstte adet rozetiyle işaretlenmiş, GENİŞ ve net bir ürün
   görseli, altında ürün bilgileri yer alan bir kart kullanır. Görsel
   önceden 64px'lik dar bir kutuya sıkışıp seçilemiyordu; artık kartın tam
   genişliğinde, diğer ürün kartlarıyla aynı ölçekte gösterilir. Renk/radius/
   gölge token'ları sitenin geri kalanıyla aynıdır (uyumlu), yerleşim farklıdır. */
.usedProductsGrid{
  margin-top: 14px;
  display: grid;
  /* Ürün sayısı arttıkça 2 sütunda alt alta uzayıp gitmesin diye masaüstünde
     sabit 4 sütun kullanılır (tablet 2, mobil 1 — proje kartı ızgarasıyla
     aynı desen). --used-scale artık sütun sayısını DEĞİL, sadece çok
     kalabalık listelerde kart iç boşluklarını hafifçe kısmak için kullanılır
     (proje-detay.js). */
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: calc(18px * var(--used-scale, 1));
}
@media (max-width: 1080px) {
  .usedProductsGrid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.usedProductCard{
  display: flex;
  flex-direction: column;
  gap: 0;
  border-radius: calc(20px * var(--used-scale, 1));
  border: 1px solid var(--line);
  background: var(--paper);
  box-shadow: 0 8px 20px rgba(15,23,42,.05);
  text-decoration: none;
  color: inherit;
  overflow: hidden;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.usedProductCard:hover{
  transform: translateY(-3px);
  box-shadow: 0 18px 38px rgba(15,23,42,.12);
  border-color: rgba(37,92,255,.22);
}
.usedProductCard__imgWrap{
  position: relative;
  /* 4 sütunlu ızgarada kart daha dar olduğu için görsel alanı da orantılı
     olarak alçaltıldı (200px -> 168px) — aksi halde kare gibi görünen çok
     yüksek bir kutu, dar kartlarda dengesiz dururdu. */
  height: calc(168px * var(--used-scale, 1));
  display: flex;
  align-items: center;
  justify-content: center;
  background:
    radial-gradient(120% 140% at 50% 12%, rgba(37,92,255,.10), transparent 65%),
    linear-gradient(160deg, rgba(37,92,255,.07), rgba(0,194,255,.05) 55%, rgba(15,23,42,.02));
  border-bottom: 1px solid var(--line);
}
.usedProductCard__img{
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: calc(18px * var(--used-scale, 1));
}
.usedProductCard:hover .usedProductCard__img{
  transform: scale(1.03);
}
.usedProductCard__img{
  /* Lazy-load sırasında görsel yüklenene kadar boş görünmesin diye
     JS'te (js/proje-detay.js) inline opacity:0 verilip onload'da 1'e
     çekiliyor; bu geçiş fade-in'i yumuşatır. */
  transition: transform .2s ease, opacity .35s ease;
}
.usedProductCard__qtyBadge{
  position: absolute;
  top: calc(12px * var(--used-scale, 1));
  left: calc(12px * var(--used-scale, 1));
  z-index: 1;
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
  padding: calc(7px * var(--used-scale, 1)) calc(12px * var(--used-scale, 1));
  border-radius: 999px;
  background: linear-gradient(135deg, var(--accent), var(--accent2));
  box-shadow: 0 10px 22px rgba(37,92,255,.28);
}
.usedProductCard__qtyBadge b{
  font-size: calc(16px * var(--used-scale, 1));
  font-weight: 700;
  line-height: 1;
  color: #fff;
}
.usedProductCard__qtyBadge span{
  font-size: calc(9.5px * var(--used-scale, 1));
  font-weight: 600;
  letter-spacing: .04em;
  color: rgba(255,255,255,.92);
  text-transform: uppercase;
  white-space: nowrap;
}
.usedProductCard__body{
  flex: 1 1 auto;
  min-width: 0;
  padding: calc(16px * var(--used-scale, 1)) calc(18px * var(--used-scale, 1)) calc(14px * var(--used-scale, 1));
  display: flex;
  flex-direction: column;
  gap: calc(10px * var(--used-scale, 1));
}
.usedProductCard__top{ min-width: 0; }
.usedProductCard__title{
  margin: 0;
  font-size: calc(17px * var(--used-scale, 1));
  font-weight: 600;
  line-height: 1.3;
  color: var(--ink);
}
.usedProductCard__code{
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-top: 5px;
  font-size: calc(11.5px * var(--used-scale, 1));
  font-weight: 600;
  color: var(--muted);
}
.usedProductCard__code svg{ width: 13px; height: 13px; color: var(--accent); }
.usedProductCard__specs{
  display: flex;
  flex-wrap: wrap;
  gap: 6px 14px;
  padding-top: calc(10px * var(--used-scale, 1));
  border-top: 1px dashed var(--line);
}
.usedProductCard__specs span{
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: calc(12px * var(--used-scale, 1));
  font-weight: 600;
  color: var(--ink);
}
.usedProductCard__specs svg{ width: 14px; height: 14px; color: var(--accent); }
.usedProductCard__foot{
  margin-top: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding-top: calc(8px * var(--used-scale, 1));
}
.usedProductCard__brand{
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: calc(11.5px * var(--used-scale, 1));
  font-weight: 700;
  color: var(--ink);
}
.usedProductCard__brand svg{ width: 13px; height: 13px; color: var(--accent); }
.usedProductCard__cta{
  font-size: calc(11.5px * var(--used-scale, 1));
  font-weight: 700;
  color: var(--accent);
  white-space: nowrap;
}
.usedProductCard--missing{
  border-style: dashed;
  border-color: rgba(220,38,38,.25);
  background: rgba(220,38,38,.02);
}
.usedProductCard--missing:hover{
  transform: none;
  box-shadow: none;
  border-color: rgba(220,38,38,.25);
}
.usedProductCard--missing .usedProductCard__imgWrap{
  background: rgba(220,38,38,.04);
}
.usedProductCard__thumb--empty{
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgba(220,38,38,.45);
}
.usedProductCard__thumb--empty svg{ width: 34px; height: 34px; }
.usedProductCard__notes{
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.usedProductCard__note{
  margin: 0;
  font-size: 12px;
  font-weight: 600;
  color: #991b1b;
  line-height: 1.5;
}
.usedProductCard__note--info{
  color: #1a3fb0;
  background: rgba(37,92,255,.08);
  border-radius: 8px;
  padding: 6px 8px;
}

@media (max-width: 640px) {
  .usedProductsGrid{ grid-template-columns: 1fr; }
  .usedProductCard__imgWrap{ height: 180px; }
  .usedProductCard__qtyBadge b{ font-size: 15px; }
}

.page--proje-detay .projectSimilarGrid{ align-items: stretch; }
.page--proje-detay .projectSimilarCard{
  display: flex;
  flex-direction: column;
  height: 100%;
  border-radius: 20px;
  border: 1px solid var(--line);
  background: var(--paper);
  box-shadow: 0 8px 20px rgba(15,23,42,.05);
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.page--proje-detay .projectSimilarCard:hover{
  transform: translateY(-3px);
  box-shadow: 0 18px 38px rgba(15,23,42,.12);
  border-color: rgba(37,92,255,.22);
}
.page--proje-detay .projectSimilarCard .pcard__img--full{
  position: relative !important;
  display: block !important;
  width: 100%;
  height: 170px !important;
  background: linear-gradient(160deg, rgba(37,92,255,.08), rgba(0,194,255,.05) 55%, rgba(15,23,42,.02));
  border-bottom: 1px solid var(--line);
  overflow: hidden;
  padding: 0 !important;
}
.page--proje-detay .projectSimilarCard .pcard__img--full img{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.page--proje-detay .projectSimilarCard .pcard__body--v3{
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  padding: 14px 16px 12px;
  text-align: center;
  gap: 0;
}
.page--proje-detay .projectSimilarCard .pcard__title--v3{
  margin: 10px 0 0;
  font-size: 16px;
  line-height: 1.32;
}
.page--proje-detay .projectSimilarCard .pcard__specRow--2{
  margin-top: auto;
  padding-top: 10px;
}
.page--proje-detay .projectSimilarCard .pcard__specItem span{
  /* Kategori/Çözüm Alanı değeri tek satırda kelime ortasından
     kesilmesin diye artık 2 satıra kadar sarabiliyor. */
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  line-height: 1.25;
  min-height: 0;
}
.page--proje-detay .projectSimilarCard .pcard__brandFooter{
  flex: 0 0 auto;
}

@media (max-width: 760px) {
  .usedProductsGrid,
  .page--proje-detay .projectSimilarGrid{
    grid-template-columns: 1fr;
  }
}

/* ===================================================================
   Proje Detayı — "Kullanılan Ürün Dağılımı": tıklanınca açılan,
   gerçek eşleşen ürünleri (kod + stok) gösteren akıllı satırlar.
   =================================================================== */

.projectDistProducts{
  margin-top: 6px;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 10px;
}
.projectDistProduct{
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--paper);
  text-decoration: none;
  transition: transform .14s ease, box-shadow .14s ease, border-color .14s ease;
}
.projectDistProduct:hover{
  transform: translateY(-2px);
  box-shadow: 0 10px 22px rgba(15,23,42,.10);
  border-color: rgba(37,92,255,.25);
}
.projectDistProduct--missing{
  border-style: dashed;
  border-color: rgba(220,38,38,.25);
  background: rgba(220,38,38,.03);
  cursor: default;
}
.projectDistProduct--missing:hover{
  transform: none;
  box-shadow: none;
  border-color: rgba(220,38,38,.25);
}
.projectDistProduct__name{
  font-size: 13px;
  font-weight: 600;
  color: var(--ink);
  line-height: 1.4;
}
.projectDistProduct__meta{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.projectDistProduct__code{
  font-size: 12px;
  font-weight: 700;
  color: var(--muted);
}
.projectDistProduct__stock{
  font-size: 12px;
  font-weight: 700;
  padding: 3px 9px;
  border-radius: 999px;
  border: 1px solid var(--line);
}
.projectDistProduct__stock.badge--out{ border-color: rgba(220,38,38,.25); background: rgba(220,38,38,.06); color: #991b1b; }
.projectDistProduct__stock.badge--low{ border-color: rgba(245,158,11,.25); background: rgba(245,158,11,.08); color: #92400e; }
.projectDistProduct__stock.badge--mid{ border-color: rgba(59,130,246,.25); background: rgba(59,130,246,.08); color: #1e40af; }
.projectDistProduct__stock.badge--high{ border-color: rgba(16,185,129,.25); background: rgba(16,185,129,.08); color: #065f46; }
.projectDistProduct__stock--usedQty{ border-color: rgba(37,92,255,.25); background: rgba(37,92,255,.06); color: var(--accent); }

@media (max-width: 640px) {

  .projectDistProducts{
    grid-template-columns: 1fr;
  }
}

/* TEDAŞ rozeti artık ürün görselinin içine (sol alt köşesine) yerleştiriliyor.
   Boyut/konum artık doğrudan öğe üzerinde satır içi (inline) stil ile
   verildiği için burada yalnızca görsel kabının konumlama bağlamı (relative)
   sağlanır; çakışan eski kural setleriyle uğraşmaya gerek kalmaz. */
.pcard__img{ position: relative; }

/* ===================================================================
   Footer — kurumsal yeniden tasarım (koyu lacivert marka bandı)
   Mevcut --accent / --accent2 marka renkleri ve .footer__* sınıfları
   temel alınmıştır; yalnızca görsel/yerleşim katmanı güncellenmiştir.
   =================================================================== */
.footer{
  padding: 0 0 0;
  margin-top: 28px;
  border-top: none;
  background: linear-gradient(180deg, #0b1f4d 0%, #071a44 100%);
  color: rgba(255,255,255,.78);
}
/* Kayan şeridin (.hMarquee) hemen üstünde birleşik durması gereken
   sayfalarda footer'ın üst boşluğu sıfırlanır. */
.footer.footer--attached{
  margin-top: 0;
}

.footer__top{
  padding: 34px 0 22px;
  border-bottom: 1px solid rgba(255,255,255,.10);
  display:flex;
  align-items:center;
  gap: 18px;
}
.footer__brand{
  display:flex;
  align-items:center;
  gap: 16px;
  flex-wrap: wrap;
}
.footer__logo{
  display:block;
  width: 148px;
  height:auto;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.14);
  box-shadow: 0 12px 26px rgba(0,0,0,.28);
  flex: 0 0 auto;
}
.footer__tagline{
  margin:0;
  max-width: 56ch;
  font-size: 14px;
  line-height: 1.6;
  color: rgba(255,255,255,.62);
}

.footer__grid{
  padding: 30px 0 6px;
}
.footer__heading{
  margin: 0 0 14px;
  font-family:"Space Grotesk", system-ui;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #fff;
  position: relative;
  padding-bottom: 10px;
}
.footer__heading::after{
  content:"";
  position:absolute;
  left:0; bottom:0;
  width: 30px; height: 3px;
  border-radius: 999px;
  background: var(--accent2);
}
.footer ul{ gap: 10px; }
.footer a{ color: rgba(255,255,255,.72); font-weight: 600; transition: color .16s ease, padding-left .16s ease; }
.footer a:hover{ color: #fff; padding-left: 2px; }
.footer .muted{ color: rgba(255,255,255,.55); }

.footer__addrText{ color: rgba(255,255,255,.62); }

.footer .map{
  border-color: rgba(255,255,255,.14);
  box-shadow: 0 10px 26px rgba(0,0,0,.28);
}

.footer__social{ margin-top: 16px; }
.footer__socialLink{
  border-color: rgba(255,255,255,.22);
  background: rgba(255,255,255,.06);
  color: rgba(255,255,255,.85);
}
.footer__socialLink:hover{
  color: #07194a;
  border-color: var(--accent2);
  background: var(--accent2);
  transform: translateY(-2px);
}

.footer__bottom{
  margin-top: 0;
  padding: 16px 0 22px;
  border-top: 1px solid rgba(255,255,255,.10);
  color: rgba(255,255,255,.55);
}
.footer__legal{ color: rgba(255,255,255,.5); }

@media (max-width: 640px) {
  .footer__top{ padding: 26px 0 18px; }
  .footer__brand{ gap: 12px; }
  .footer__logo{ width: 120px; }
  .footer__bottom{ text-align: left; }
  .footer__legal{ text-align: left; }
}

/* ===================================================================
   Projeler sayfası — hero v2: filtre paneli üst "hero" alanına taşındı
   (başlık/istatistik bloğunun yanına, aynı satır yüksekliğine
   sığacak şekilde), harita ve proje kartları artık tek sütunlu, tam
   genişlikte bir gövdede akıyor. .projectsLayout / .projectFilterCard
   sınıf adları bilinçli olarak korundu: js/site-enhancements.js bu
   sınıfları arayarak harita + ek filtre + tip görselleri modülünü
   başlatıyor (bkz. initProjectsEnhancements). Bu blok, dosyanın
   üstündeki eski iki sütunlu tasarım kurallarını (aynı seçiciler,
   dosyanın sonunda olduğu için) kasıtlı olarak ezer.
   =================================================================== */
.page--projeler .projectsHero--v2{
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 384px);
  align-items: stretch;
  gap: 24px;
  padding: 20px 24px;
}
.page--projeler .projectsHero__main{
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 16px;
  min-width: 0;
}
.page--projeler .projectsHero__main .projectsHero__copy h1{
  margin: 0 0 6px;
}
.page--projeler .projectsHero--v2 .projectsStats{
  width: 100%;
}

/* Filtre paneli artık ayrı bir kart değil, hero kartının içinde ikinci
   sütun: kendi arkaplanı/gölgesi yok, ince bir ayraç ile solundan
   ayrılıyor ve yeşil alanla (başlık+istatistik) aynı satır
   yüksekliğine yayılıyor. */
.page--projeler .projectFilterCard--compact{
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 0 0 0 24px;
  margin: 0;
  border: 0;
  border-left: 1px solid rgba(7,25,74,.1);
  border-radius: 0;
  background: none;
  box-shadow: none;
  min-width: 0;
}
.page--projeler .projectFilterCard--compact .projectFilterCard__head{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin: 0;
}
.page--projeler .projectFilterCard--compact .projectFilterCard__head h2{
  font-size: 14px;
  margin: 0;
}
.page--projeler .projectFilterCard--compact .projectFilterCard__head .btn{
  width: auto;
  flex: 0 0 auto;
  padding: 7px 12px;
  font-size: 12px;
}
.page--projeler .projectFilterCard--compact .pSearchWrap{
  margin: 0;
}
.page--projeler .projectFilterCard--compact .pSearchWrap .input{
  min-height: 38px;
  padding: 8px 32px 8px 12px;
  font-size: 13px;
}

.page--projeler .projectFilterCard__row--compact{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px 10px;
  margin: 0;
}
/* Çözüm alanı seçimi genelde en uzun etiketleri taşıyor (ör. "Akaryakıt
   İstasyonu"); kendi satırında tam genişlik kullanarak kısayoldan
   kesilmeden okunabilir kalıyor, şehir/yıl ise yan yana kalıyor. */
.page--projeler .projectFilterCard__row--compact .pFilterGroup[data-pgroup="solution"]{
  grid-column: 1 / -1;
}
.page--projeler .projectFilterCard__row--compact .pFilterGroup{
  position: relative;
  display: block;
  border: 0;
  border-radius: 0;
  background: none;
  overflow: visible;
}
.page--projeler .projectFilterCard__row--compact .pFilterGroup + .pFilterGroup{
  margin-top: 0;
}
.page--projeler .projectFilterCard__row--compact .select{
  width: 100%;
  min-height: 40px;
  padding: 7px 26px 7px 12px;
  font-size: 12px;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
.page--projeler .projectFilterCard__row--compact .pFilterGroup__dot{
  position: absolute;
  top: -3px;
  right: -3px;
  z-index: 1;
  width: 8px;
  height: 8px;
  box-shadow: 0 0 0 2px var(--paper, #fff);
  pointer-events: none;
}

.page--projeler .pFilterGroup--chips{
  border: 0;
  border-radius: 0;
  background: none;
  padding: 0;
  margin-top: 2px;
}
.page--projeler .pFilterGroup--chips > .pFilterGroup__body,
.page--projeler .pFilterGroup--chips[open] > .pFilterGroup__body{
  display: block;
  padding: 0;
}
.page--projeler .projectTypeChips--scroll{
  flex-wrap: nowrap;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  padding-bottom: 4px;
}
.page--projeler .projectTypeChips--scroll > *{
  flex: 0 0 auto;
}
.page--projeler .projectTypeChips--scroll .projectChip{
  padding: 6px 10px;
  font-size: 12px;
}

.page--projeler .filters__meta--inline{
  margin-top: 2px;
  font-size: 12px;
  justify-content: flex-end;
}

/* Gövde: filtre paneli hero'ya taşındığı için içerik artık tek
   sütunda, tam genişlikte akıyor (harita + proje kartları). */
.page--projeler .projectsLayout{
  display: block;
}
.page--projeler .projectsContent{
  min-width: 0;
  width: 100%;
}
.page--projeler .enhCard--map{
  margin: 0 0 18px;
}

@media (max-width: 1080px) {
  .page--projeler .projectsHero--v2{
    grid-template-columns: 1fr;
  }
  .page--projeler .projectFilterCard--compact{
    padding-left: 0;
    border-left: 0;
    border-top: 1px solid rgba(7,25,74,.1);
    padding-top: 18px;
    margin-top: 4px;
  }
}
@media (max-width: 480px) {
  .page--projeler .projectFilterCard__row--compact{
    grid-template-columns: 1fr;
  }
  .page--projeler .projectFilterCard__row--compact .pFilterGroup[data-pgroup="solution"]{
    grid-column: auto;
  }
}

/* ===================================================================
   Projeler sayfası v3 — tam yeniden tasarım: sade başlık, ikonlu
   istatistik kartları, üstte tek satırlık filtre çubuğu (şehir/
   kategori/çözüm alanı/yıl aralığı + "Daha Fazla Filtre" + "Filtrele"),
   altında harita ile "Aktif Filtreler" panelinin yan yana olduğu bölüm,
   en altta tam genişlikte kart ızgarası + "Daha Fazla Yükle". Önceki
   turdaki .projectsHero--v2 / .projectFilterCard--compact kuralları bu
   sayfada artık hiçbir öğeyle eşleşmiyor (markup değişti), bu yüzden
   kasıtlı olarak silinmedi — zararsız, ölü kod. .projectsSplitRow ve
   .projectFilterBar sınıf adları js/site-enhancements.js içinde
   initProjectsEnhancements()'ın çalışıp çalışmayacağını belirleyen
   seçiciler olduğu için KORUNMALI.
   =================================================================== */

.page--projeler .projectsHero3{
  padding: 6px 2px 4px;
}
.page--projeler .projectsHero3 h1{
  margin: 0 0 6px;
  font-family: "Space Grotesk", system-ui;
  font-size: clamp(26px, 3vw, 36px);
  line-height: 1.12;
}
.page--projeler .projectsHero3 p{
  margin: 0;
  color: var(--muted);
  font-size: 14px;
  max-width: 68ch;
}

/* --- İstatistik kartları --- */
.page--projeler .projectsStatsRow{
  margin-top: 16px;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
}
.page--projeler .projectsStatCard{
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  border-radius: 18px;
  border: 1px solid rgba(7,25,74,.08);
  background: rgba(255,255,255,.92);
  box-shadow: 0 10px 22px rgba(15,23,42,.05);
}
.page--projeler .projectsStatCard__icon{
  flex: 0 0 auto;
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 13px;
}
.page--projeler .projectsStatCard__icon svg{ width: 20px; height: 20px; }
.page--projeler .projectsStatCard--total .projectsStatCard__icon{ background: rgba(7,25,74,.1); color: #07194a; }
.page--projeler .projectsStatCard--cities .projectsStatCard__icon{ background: rgba(37,150,224,.14); color: #1b6fb3; }
.page--projeler .projectsStatCard--solutions .projectsStatCard__icon{ background: rgba(209,138,46,.16); color: #b3661b; }
.page--projeler .projectsStatCard--qty .projectsStatCard__icon{ background: rgba(122,91,214,.16); color: #6a45c4; }
.page--projeler .projectsStatCard--years .projectsStatCard__icon{ background: rgba(47,179,126,.16); color: #1c8a5c; }
.page--projeler .projectsStatCard__body{
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.page--projeler .projectsStatCard__body strong{
  font-family: "Space Grotesk", system-ui;
  font-size: 20px;
  line-height: 1.15;
  color: #07194a;
}
.page--projeler .projectsStatCard__body span{
  font-size: 12px;
  color: var(--muted);
  white-space: nowrap;
}
@media (max-width: 480px){
  .page--projeler .projectsStatCard{
    min-width: 0;
  }
  .page--projeler .projectsStatCard__body span{
    white-space: normal;
    overflow-wrap: break-word;
  }
}

/* --- Filtre çubuğu: masaüstünde (>1080px) harita ile yan yana, dar/dikey
   bir sidebar kartı — scroll ederken haritayla birlikte akıp gitmesin diye
   "sticky" ile ekranda sabit kalır. Mobil/tablette (≤1080px) hem bu
   sticky davranış hem de yan yana grid, aşağıdaki medya sorgusuyla
   devre dışı bırakılıp kart tam genişlikte üstte, harita da (JS ile)
   proje listesinin altına taşınır. --- */
.page--projeler .projectFilterBar{
  position: sticky;
  top: 20px;
  max-height: calc(100vh - 40px);
  overflow-y: auto;
  padding: 20px 18px;
  border-radius: 20px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  background:
    linear-gradient(180deg, rgba(30,79,163,.035), rgba(30,79,163,0) 120px),
    var(--pj-card);
  box-shadow: 0 1px 0 rgba(15,23,42,.02), 0 14px 32px -18px rgba(16,38,84,.28);
}
.page--projeler .projectFilterBar::before{
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--pj-secondary), var(--pj-primary) 65%, var(--pj-secondary));
}
.page--projeler .projectFilterBar__row{
  display: grid;
  gap: 14px;
}
.page--projeler .projectFilterBar__row--main{
  /* Kart dar olduğu için arama + 3 seçim alanı yan yana değil, eskiden
     olduğu gibi alt alta akar. */
  grid-template-columns: 1fr;
}
.page--projeler .projectFilterBar__row--sub{
  grid-template-columns: 1fr;
  align-items: stretch;
  margin-top: 2px;
  padding-top: 14px;
  border-top: 1px dashed var(--pj-border);
}
.page--projeler .pFilterField{
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  gap: 7px;
  min-width: 0;
}
.page--projeler .pFilterField label{
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .05em;
  text-transform: uppercase;
  color: var(--pj-muted);
}
.page--projeler .pFilterField label::before{
  content: "";
  width: 5px;
  height: 5px;
  border-radius: 999px;
  background: var(--pj-secondary);
  opacity: .55;
  flex: 0 0 auto;
}
.page--projeler .pFilterField:focus-within label{
  color: var(--pj-secondary);
}
.page--projeler .pFilterField:focus-within label::before{
  opacity: 1;
}
.page--projeler .pFilterField .select{
  /* Genel ".select{flex:0 0 240px}" kuralı, dikey (column) bir flex
     bağlamında flex-basis'i YÜKSEKLİK olarak uyguluyor (240px'lik dev bir
     kutu) — burada bilinçli olarak sıfırlanıyor. */
  flex: 0 0 auto;
  width: 100%;
  min-height: 44px;
  background-color: var(--pj-bg);
  border-color: var(--pj-border);
  transition: border-color .15s ease, background-color .15s ease, box-shadow .15s ease;
}
.page--projeler .pFilterField .select:hover{
  background-color: #fff;
  border-color: rgba(30,79,163,.35);
}
.page--projeler .pSearchWrap{
  position: relative;
  display: flex;
  align-items: center;
}
.page--projeler .pSearchWrap__icon{
  position: absolute;
  left: 12px;
  width: 16px;
  height: 16px;
  color: var(--muted);
  pointer-events: none;
}
.page--projeler .pSearchWrap .input{
  width: 100%;
  min-height: 44px;
  padding-left: 36px;
  padding-right: 32px;
  background-color: var(--pj-bg);
  border-color: var(--pj-border);
  transition: border-color .15s ease, background-color .15s ease, box-shadow .15s ease;
}
.page--projeler .pSearchWrap .input:hover{
  background-color: #fff;
  border-color: rgba(30,79,163,.35);
}
.page--projeler .pSearchWrap .input:focus{
  background-color: #fff;
}
.page--projeler .pSearchWrap .input::-webkit-search-cancel-button,
.page--projeler .pSearchWrap .input::-webkit-search-decoration{
  -webkit-appearance: none;
  appearance: none;
  display: none;
}
.page--projeler .pSearchWrap__clear{
  position: absolute;
  right: 8px;
  width: 22px;
  height: 22px;
  border-radius: 999px;
  border: 0;
  background: rgba(7,25,74,.08);
  color: var(--muted);
  font-size: 15px;
  line-height: 1;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}
.page--projeler .pSearchWrap__clear:hover{
  background: rgba(7,25,74,.14);
  color: var(--ink);
}

.page--projeler .pFilterField--yearRange{
  max-width: none;
}
.page--projeler .pYearRange{
  display: flex;
  align-items: center;
  gap: 8px;
}
.page--projeler .pYearRange .select{
  flex: 1 1 0;
  min-width: 0;
  min-height: 44px;
}
.page--projeler .pYearRange__sep{
  color: var(--muted);
  font-weight: 600;
}

.page--projeler .projectFilterBar__actions{
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 10px;
  justify-self: stretch;
}
.page--projeler .projectFilterBar__actions .btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 44px;
  white-space: nowrap;
  transition: transform .15s ease, box-shadow .15s ease, background-color .15s ease, border-color .15s ease;
}
.page--projeler .projectFilterBar__actions .btn svg{ width: 16px; height: 16px; transition: transform .2s ease; }
.page--projeler #pMoreFilters{
  border-color: var(--pj-border);
  background: var(--pj-bg);
}
.page--projeler #pMoreFilters:hover{
  border-color: rgba(30,79,163,.35);
  background: #fff;
}
.page--projeler #pMoreFilters.is-active{
  border-color: var(--pj-secondary);
  background: rgba(30,79,163,.08);
  color: var(--pj-secondary);
}
/* Masaüstü "Daha Fazla Filtre" butonu artık mobildeki "Filtreler ve
   Sıralama" geçiş butonuyla aynı görsel dili kullanır: sol ikon + esnek
   metin + sağda açılınca 180° dönen chevron (yalnızca chevron döner,
   sol ikon sabit kalır). */
.page--projeler #pMoreFilters.pMoreFiltersBtn{
  justify-content: flex-start;
}
.page--projeler .pMoreFiltersBtn__text{
  flex: 1;
  text-align: left;
}
.page--projeler .pMoreFiltersBtn__chev{
  flex: 0 0 auto;
  transition: transform .18s ease;
}
.page--projeler #pMoreFilters.is-active .pMoreFiltersBtn__chev{ transform: rotate(180deg); }
.page--projeler .projectFilterBar__actions .btn--primary:hover{
  transform: translateY(-1px);
  box-shadow: 0 10px 22px -8px rgba(30,79,163,.55);
}

.page--projeler .projectExtraFiltersSlot{
  margin-top: 4px;
  padding-top: 14px;
  border-top: 1px solid rgba(7,25,74,.08);
}
.page--projeler .projectExtraFiltersSlot .projectFilterCard__labelWrap{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 10px;
  font-size: 13px;
  font-weight: 600;
}
.page--projeler .projectExtraFiltersSlot .projectFilterCard__row--enh{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.page--projeler .projectExtraFiltersSlot .projectFilterCard__group .select{ width: 100%; min-height: 44px; }
.page--projeler .projectExtraFiltersSlot .enhHint{
  margin-top: 8px;
  color: var(--muted);
  font-size: 12px;
}

/* --- Gövde: harita artık burada değil, proje listesinin ALTINDAKİ ayrı
   ".section--projectsMap" bölümüne — js/site-enhancements.js içindeki
   reorderMapForViewport() view genişliğine göre haritayı (aynı Leaflet
   örneğini DOM'da taşıyarak) ikisi arasında geçirir; masaüstünde
   (>1080px) filtre + harita yine yan yana, mobil/tablette proje
   listesinin altında. Harita yüksekliği de eskiye göre biraz azaltıldı
   (480px -> 360px) ki ilk ekranda projeler daha az geriye düşsün. --- */
.page--projeler .projectsSplitRow{
  display: grid;
  grid-template-columns: 340px minmax(0, 1fr);
  gap: 20px;
  align-items: start;
}
.page--projeler .section--projectsMap{
  padding-top: 8px;
  padding-bottom: 8px;
}
.page--projeler .projectsMapCol{
  min-width: 0;
}
.page--projeler .projectsMapCol .enhCard--map{
  margin: 0;
}
.page--projeler .projectMap{
  min-height: 360px;
}
@media (max-width: 760px) {
  .page--projeler .projectMap{
    min-height: 340px;
  }
}

.page--projeler .linkBtn{
  border: 0;
  background: none;
  padding: 0;
  color: var(--accent);
  font-weight: 600;
  font-size: 12px;
  cursor: pointer;
}
.page--projeler .linkBtn:hover{ text-decoration: underline; }
.page--projeler .linkBtn.is-idle{
  opacity: .45;
  pointer-events: none;
}

.page--projeler .pActiveChips{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.page--projeler .pActiveChip{
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 7px 8px 7px 12px;
  border-radius: 999px;
  border: 1px solid rgba(30,79,163,.20);
  background: rgba(30,79,163,.07);
  font-size: 12px;
  font-weight: 700;
  color: var(--pj-primary);
  cursor: pointer;
  transition: border-color .15s ease, background-color .15s ease, transform .15s ease;
}
.page--projeler .pActiveChip:hover{
  border-color: var(--pj-secondary);
  background: rgba(30,79,163,.12);
  transform: translateY(-1px);
}
.page--projeler .pActiveChip__x{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  border-radius: 999px;
  background: rgba(30,79,163,.14);
  font-size: 12px;
  line-height: 1;
  color: var(--pj-secondary);
}
.page--projeler .pActiveChip:hover .pActiveChip__x{
  background: var(--pj-secondary);
  color: #fff;
}
.page--projeler .pActiveChip--empty{
  cursor: default;
  color: var(--pj-muted);
  background: none;
  border-style: dashed;
  border-color: var(--pj-border);
  padding-left: 10px;
}
.page--projeler .pActiveChip--empty:hover{
  border-color: var(--pj-border);
  background: none;
  transform: none;
}

/* --- Aktif Filtreler şeridi: filtre çubuğunun alt satırında, "Daha
   Fazla Filtre" / "Filtrele" butonlarının solunda yer alan yatay şerit.
   Önceden haritanın yanında ayrı bir dikey kart (sidebar) olarak
   duruyordu; harita tam genişlik kullanabilsin diye buraya taşındı. --- */
.page--projeler .projectActiveStrip{
  display: flex;
  flex-direction: column;
  gap: 12px;
  min-width: 0;
}
.page--projeler .projectActiveStrip__top{
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px 10px;
}
.page--projeler .projectActiveStrip__label{
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .05em;
  text-transform: uppercase;
  color: var(--pj-muted);
  white-space: nowrap;
}
.page--projeler .projectActiveStrip__top .pActiveChips{
  flex: 1 1 auto;
}
.page--projeler .projectActiveStrip__top .linkBtn{
  margin-left: auto;
  white-space: nowrap;
}
.page--projeler .projectActiveStrip__stats{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
  padding-top: 12px;
  margin-top: 2px;
  border-top: 1px solid rgba(7,25,74,.08);
}
.page--projeler .projectActiveStrip__stat{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: var(--pj-muted);
  white-space: nowrap;
}
.page--projeler .projectActiveStrip__stat svg{
  width: 15px;
  height: 15px;
  flex: 0 0 auto;
  color: var(--pj-secondary);
}
.page--projeler .projectActiveStrip__stat strong{
  color: var(--pj-primary);
  font-weight: 600;
}
.page--projeler .projectActiveStrip__sort{
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
}
.page--projeler .projectActiveStrip__sort label{
  font-size: 12px;
  font-weight: 600;
  color: var(--pj-muted);
  white-space: nowrap;
}
.page--projeler .projectActiveStrip__sort .select{
  flex: 1 1 auto;
  min-width: 0;
  min-height: 38px;
  padding: 8px 34px 8px 12px;
  font-size: 13px;
}

/* --- Proje kartı: kategori rozeti + konum satırı --- */
.page--projeler .pcard__badge{
  position: absolute;
  top: 12px;
  left: 12px;
  z-index: 1;
  padding: 5px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .02em;
  color: #fff;
  box-shadow: 0 6px 14px rgba(15,23,42,.18);
}
.page--projeler .pcard__img--full{
  position: relative;
}
/* Not: burada eskiden her kategori (c0-c7) için gökkuşağı renginde ayrı
   linear-gradient rozet tanımları vardı. Bu tanımlar, sayfanın daha
   sonraki bir bölümünde bilinçli bir tasarım kararıyla ("kategori
   rozetleri: aşırı renk çeşitliliği yerine ağırlıklı olarak kurumsal
   lacivert" — bkz. aşağıdaki .pcard__badge--cN blokları) tamamen
   geçersiz kılınıyordu; yani hiçbir zaman ekranda görünmüyorlardı. Ölü
   kod olduğu doğrulanıp (computed style karşılaştırmasıyla) temizlendi;
   gerçek/aktif renk tanımları dosyanın ilerisindedir. */

/* --- Öne Çıkan Projeler rozeti (featured:true) --- */
.page--projeler .pcard__featuredTag{
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 5px 10px 5px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .02em;
  color: #07194a;
  background: linear-gradient(135deg, #ffd166, #f2a900);
  box-shadow: 0 6px 14px rgba(15,23,42,.18);
}
.page--projeler .pcard__featuredTag svg{
  width: 12px;
  height: 12px;
  flex: none;
}
.page--projeler .projectRefCard--featured .pcard__featuredTag{
  top: 14px;
  right: 14px;
}

.page--projeler .pcard__locLine{
  display: flex;
  align-items: center;
  gap: 6px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 700;
}
.page--projeler .pcard__locLine svg{
  width: 13px;
  height: 13px;
  flex: 0 0 auto;
}

/* --- Sayfalama: "Daha Fazla Yükle" ile açılana kadar gizli kartlar ---
   ÖNEMLİ: .projectRefCard temel kuralı "display: flex !important;"
   kullanıyor (bkz. yukarıdaki blok) — bu yüzden burada da !important
   olmadan "display:none" hiçbir zaman kazanamıyor ve TÜM kartlar (30'u
   da) sayfa ilk açıldığında görünür kalıyordu; "Daha Fazla Yükle (N)"
   butonu ise hâlâ gösteriliyor ama gerçekte gizleyecek bir şeyi yoktu.
   !important eklenerek sayfalama fiilen çalışır hale getirildi. */
.page--projeler .projectRefCard.is-pagedOut{
  display: none !important;
}
.page--projeler .projectLoadMoreWrap{
  display: flex;
  justify-content: center;
  margin-top: 24px;
}
.page--projeler .btn--wide{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 22px;
}
.page--projeler .btn--wide svg{ width: 16px; height: 16px; }

.page--projeler .section--projectsFeatured{ padding-top: 22px; padding-bottom: 0; }
.page--projeler .section--projectsList{ padding-top: 22px; padding-bottom: 24px; }
/* "Daha Fazla Yükle" butonu ile altındaki istatistik kartları arasında
   iki ayrı section'ın varsayılan 56px'lik dolgusu üst üste binip (56+56)
   aşırı büyük bir boşluk bırakıyordu; ikisi de daraltıldı. */
.page--projeler .section--projectsStatsBottom{ padding-top: 26px; }

@media (max-width: 1080px) {
  /* Sidebar+harita yan yana sığmıyor: filtre kartı tam genişlikte üste,
     harita altına düşer; kart artık dar olmadığı için alanları da
     tekrar 2 sütuna, aksiyon butonlarını da yan yana açabiliriz. */
  .page--projeler .projectsSplitRow{
    grid-template-columns: 1fr;
  }
  .page--projeler .projectFilterBar{
    position: static;
    max-height: none;
    overflow-y: visible;
  }
  .page--projeler .projectsStatsRow{
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .page--projeler .projectFilterBar__row--main{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .page--projeler .projectFilterBar__row--sub{
    grid-template-columns: 1fr;
  }
  .page--projeler .projectFilterBar__actions{
    flex-direction: row;
    justify-self: stretch;
  }
  .page--projeler .projectFilterBar__actions .btn{
    flex: 1 1 0;
    justify-content: center;
  }
  .page--projeler .projectActiveStrip__sort{
    width: auto;
    margin-left: auto;
  }
  .page--projeler .projectActiveStrip__sort .select{
    flex: 0 0 auto;
    min-width: 132px;
  }
}

@media (max-width: 760px) {
  .page--projeler .projectsStatsRow{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .page--projeler .projectFilterBar__row--main{
    grid-template-columns: 1fr;
  }
  /* Mobilde tekrar tek sütuna düş: aktif filtreler şeridi üstte,
     "Daha Fazla Filtre"/"Filtrele" butonları altında tam genişlikte. */
  .page--projeler .projectFilterBar__row--sub{
    grid-template-columns: 1fr;
  }
  .page--projeler .projectFilterBar__actions{
    flex-direction: column;
    align-items: stretch;
  }
  .page--projeler .projectActiveStrip__sort{
    width: 100%;
    margin-left: 0;
  }
  .page--projeler .projectActiveStrip__sort .select{
    flex: 1 1 auto;
  }
  .page--projeler .projectMap{
    min-height: 300px;
  }
}

@media (max-width: 480px) {
  .page--projeler .projectsStatsRow{
    grid-template-columns: 1fr 1fr;
  }
}

/* ===================================================================
   Projeler v3 — ek: kurumsal renk paleti (bu sayfaya özel), harita
   Harita/Liste sekmeleri + kümeleme rozeti, profesyonel boş durum,
   proje kartı görsel oranı/hover/başlık kırpma inceltmeleri.
   =================================================================== */
.page--projeler{
  --pj-primary: #102654;
  --pj-secondary: #1E4FA3;
  --pj-bg: #F6F8FC;
  --pj-card: #FFFFFF;
  --pj-border: #E5EAF2;
  --pj-text: #17233D;
  --pj-muted: #6B7280;
}
.page--projeler .projectsHero3 h1{ color: var(--pj-text); }
.page--projeler .projectsHero3 p{ color: var(--pj-muted); }
.page--projeler .projectsStatCard,
.page--projeler .projectFilterBar{
  background: var(--pj-card);
  border-color: var(--pj-border);
}
.page--projeler .projectsStatCard__body strong{ color: var(--pj-primary); }
.page--projeler .projectsStatCard__body span{ color: var(--pj-muted); }
.page--projeler .projectsStatCard--total .projectsStatCard__icon{ background: rgba(16,38,84,.08); color: var(--pj-primary); }
.page--projeler .projectsStatCard--cities .projectsStatCard__icon{ background: rgba(30,79,163,.12); color: var(--pj-secondary); }
.page--projeler .pFilterField label{ color: var(--pj-muted); }
.page--projeler .projectFilterBar__actions .btn--primary{ background: var(--pj-secondary); border-color: var(--pj-secondary); }
.page--projeler .projectFilterBar__actions .btn--primary:hover{ background: var(--pj-primary); border-color: var(--pj-primary); }
.page--projeler .linkBtn{ color: var(--pj-secondary); }
.page--projeler .pcard__badge--c0{ background: var(--pj-primary); }
.page--projeler .pcard__badge--c2{ background: var(--pj-secondary); }

/* Kategori rozetleri: aşırı renk çeşitliliği yerine ağırlıklı olarak
   kurumsal lacivert, sadece birkaç kategori için ayırt edici vurgu
   rengi kullanılıyor (referans tasarımdaki gibi çoğunlukla koyu, azınlıkta
   turuncu/mor/yeşil vurgular). */
.page--projeler .pcard__badge{ background: var(--pj-primary); }
.page--projeler .pcard__badge--c1{ background: #C2410C; }
.page--projeler .pcard__badge--c3{ background: #7C3AED; }
.page--projeler .pcard__badge--c4{ background: #15803D; }
.page--projeler .pcard__badge--c5{ background: #BE185D; }
.page--projeler .pcard__badge--c6{ background: var(--pj-primary); }
.page--projeler .pcard__badge--c7{ background: var(--pj-primary); }

/* --- Proje kartı: 4:3 görsel oranı, object-fit:cover, hafif hover zoom,
   başlık en fazla 2 satır, kart kenarlığı/gölgesi kurumsal palet --- */
.page--projeler .projectRefCard{
  background: var(--pj-card);
  border: 1px solid var(--pj-border);
  border-radius: 16px;
  box-shadow: 0 1px 2px rgba(16,38,84,.04);
  transition: transform .18s ease, box-shadow .18s ease;
  overflow: hidden;
}
.page--projeler .projectRefCard:hover{
  transform: translateY(-3px);
  box-shadow: 0 14px 28px rgba(16,38,84,.1);
}
.page--projeler .projectRefCard .pcard__img{
  aspect-ratio: 4 / 3;
  height: auto;
  overflow: hidden;
}
.page--projeler .projectRefCard .pcard__img img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .35s ease;
}
.page--projeler .projectRefCard:hover .pcard__img img{
  transform: scale(1.045);
}
.page--projeler .projectRefCard .pcard__title--v3{
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  /* min-height yerine sabit height: tek satırlık kısa başlıklarda (ör.
     "Akdeniz Park Halı Saha") kutu, iki satırlık başlıklara göre birkaç
     piksel daha kısa kalıyor, bu da aynı satırdaki kartlarda içerik
     bloğunun (konum + başlık + meta) hizasını hafifçe kaydırıyordu.
     Sabit height tüm kartlarda başlık alanını piksel bazında eşitler. */
  height: calc(1.22em * 2);
  min-height: calc(1.22em * 2);
  color: var(--pj-text);
}
.page--projeler .projectRefCard .pcard__locLine{ color: var(--pj-muted); }
.page--projeler .projectRefCard .pcard__metaItem{ color: var(--pj-muted); }

/* --- Profesyonel boş durum --- */
.page--projeler .pEmptyState{
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 6px;
  padding: 56px 24px;
  border: 1px dashed var(--pj-border);
  border-radius: 18px;
  background: var(--pj-card);
}
.page--projeler .pEmptyState h3{
  margin: 0;
  font-family: "Space Grotesk", system-ui;
  font-size: 19px;
  color: var(--pj-text);
}
.page--projeler .pEmptyState p{
  margin: 0 0 10px;
  color: var(--pj-muted);
  font-size: 14px;
}

/* --- Harita: kümeleme rozeti --- */
.projectMapCluster{
  display: flex;
  align-items: center;
  justify-content: center;
}
.projectMapCluster span{
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 999px;
  background: #102654;
  color: #fff;
  font-weight: 600;
  font-size: 13px;
  box-shadow: 0 0 0 4px rgba(16,38,84,.18);
}

@media (max-width: 760px) {
  .page--projeler .pActiveChips{
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 2px;
  }
  .page--projeler .pActiveChips .pActiveChip{
    flex: 0 0 auto;
  }
}

/* Kart ızgarası: auto-fill yerine kesin sütun sayıları — masaüstü 4,
   tablet 2, mobil 1 (istenen breakpoint davranışı net olsun diye).
   !important: yukarıda aynı seçici için zaten !important olan eski
   "auto-fill" kuralını (aynı özgüllük, dosyada daha önce) ezmek için. */
.page--projeler #projectList.products{
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}
@media (max-width: 1080px) {
  .page--projeler #projectList.products{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 620px) {
  .page--projeler #projectList.products{
    grid-template-columns: 1fr !important;
  }
}

/* =========================================================================
   Ek geliştirme turu: filtre çubuğunu kompaktlaştırma, tek-şehir istatistik
   sunumu, kategoriye göre görsel yerine geçen ikon/atmosfer, ve harita
   marker <-> proje kartı çift yönlü bağlantısı (popup, hover, tıklama
   vurgusu). Navbar/footer'a dokunulmadı; mevcut Leaflet altyapısı ve proje
   verisi aynen korunuyor.
   ========================================================================= */

/* --- Filtre çubuğu: Yıl Aralığı artık "Daha Fazla Filtre" panelinin içinde
   (ilk görünümde sadece Arama/Şehir/Kategori/Çözüm Alanı + Filtrele
   görünür); alt satır artık sadece eylem butonlarını taşıyor. --- */
.page--projeler .projectFilterBar__row--sub{
  /* Sidebar dar olduğu için aktif filtreler şeridi ile aksiyon butonları
     yan yana değil, alt alta (tek sütun) akıyor. */
  grid-template-columns: 1fr;
  align-items: stretch;
  justify-items: stretch;
}
.page--projeler .projectExtraFiltersSlot .pFilterField--yearRange{
  max-width: none;
  margin-bottom: 14px;
}
@media (min-width: 761px) and (max-width: 1080px) {
  /* Sidebar tam genişliğe düştüğünde (ama mobilde değil) tekrar yan yana sığar. */
  .page--projeler .projectFilterBar__row--sub{
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    justify-items: stretch;
  }
}

/* --- İstatistik kartı: veri tek şehir içeriyorsa (ör. sadece Antalya)
   sayının altında şehir adı da gösterilir: "1 / ANTALYA / Şehir". --- */
.page--projeler .projectsStatCard__cityName{
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .04em;
  color: var(--pj-secondary, #1E4FA3);
  margin-top: 1px;
}

/* --- Görseli olmayan proje kartları: büyük boş beyaz alan yerine
   kategori tonuna uyan yumuşak bir arka plan + nötr ikon. Sahte proje
   görseli/verisi ÜRETİLMEZ. --- */
.page--projeler .projectRefCard__noImg svg{
  width: 30px;
  height: 30px;
}
.page--projeler .projectRefCard__noImg--c0{ background: linear-gradient(160deg, rgba(16,38,84,.12), rgba(16,38,84,.03)); }
.page--projeler .projectRefCard__noImg--c0 svg{ color: rgba(16,38,84,.55); }
.page--projeler .projectRefCard__noImg--c1{ background: linear-gradient(160deg, rgba(194,65,12,.12), rgba(194,65,12,.03)); }
.page--projeler .projectRefCard__noImg--c1 svg{ color: rgba(194,65,12,.55); }
.page--projeler .projectRefCard__noImg--c2{ background: linear-gradient(160deg, rgba(30,79,163,.12), rgba(30,79,163,.03)); }
.page--projeler .projectRefCard__noImg--c2 svg{ color: rgba(30,79,163,.55); }
.page--projeler .projectRefCard__noImg--c3{ background: linear-gradient(160deg, rgba(124,58,237,.12), rgba(124,58,237,.03)); }
.page--projeler .projectRefCard__noImg--c3 svg{ color: rgba(124,58,237,.55); }
.page--projeler .projectRefCard__noImg--c4{ background: linear-gradient(160deg, rgba(21,128,61,.12), rgba(21,128,61,.03)); }
.page--projeler .projectRefCard__noImg--c4 svg{ color: rgba(21,128,61,.55); }
.page--projeler .projectRefCard__noImg--c5{ background: linear-gradient(160deg, rgba(190,24,93,.12), rgba(190,24,93,.03)); }
.page--projeler .projectRefCard__noImg--c5 svg{ color: rgba(190,24,93,.55); }
.page--projeler .projectRefCard__noImg--c6{ background: linear-gradient(160deg, rgba(16,38,84,.12), rgba(16,38,84,.03)); }
.page--projeler .projectRefCard__noImg--c6 svg{ color: rgba(16,38,84,.55); }
.page--projeler .projectRefCard__noImg--c7{ background: linear-gradient(160deg, rgba(16,38,84,.12), rgba(16,38,84,.03)); }
.page--projeler .projectRefCard__noImg--c7 svg{ color: rgba(16,38,84,.55); }

/* --- Harita marker'ına tıklanınca ilgili proje kartı listede kısa
   süreliğine vurgulanır (marker -> kart bağlantısı). --- */
.page--projeler .pcard.is-mapActive{
  animation: pjCardHighlight 1.8s ease;
}
@keyframes pjCardHighlight{
  0%   { box-shadow: 0 0 0 3px rgba(30,79,163,.55), 0 14px 28px rgba(15,23,42,.10); }
  70%  { box-shadow: 0 0 0 3px rgba(30,79,163,.55), 0 14px 28px rgba(15,23,42,.10); }
  100% { box-shadow: 0 4px 14px rgba(15,23,42,.06); }
}

/* --- Harita popup'ı: kompakt premium mini proje kartı (görsel/ikon,
   kategori rozeti, ad, konum, yıl, kategori, Detayı İncele). Herhangi bir
   anda en fazla tek bir popup açık olabildiği için (Leaflet varsayılanı),
   kartın mavi kenarlığı doğrudan "şu an seçili proje" anlamına gelir —
   ayrı bir "seçili" durumu/JS bayrağı gerekmez. --- */
.projectMap .leaflet-popup.projectMapPopup--card{
  margin-bottom: 20px;
}
.projectMap .leaflet-popup.projectMapPopup--card .leaflet-popup-content-wrapper{
  border-radius: 16px;
  box-shadow: 0 18px 34px rgba(15,23,42,.16), 0 2px 8px rgba(15,23,42,.06);
  border: 1.5px solid rgba(30,79,163,.45);
  padding: 0;
}
.projectMap .leaflet-popup.projectMapPopup--card .leaflet-popup-tip{
  box-shadow: 2px 2px 4px rgba(15,23,42,.06);
}
.projectMapCard{
  display: flex;
  align-items: flex-start;
  gap: 12px;
  width: 264px;
  padding: 14px;
  text-decoration: none;
  color: inherit;
  /* Popup içeriği kapatma çarpısı olmadığı için tıklanabilir bir bağlantı
     olduğu belirgin olsun diye üstte ince bir alt çizgi yerine, kartın
     tamamı zaten "Detayı İncele" ile CTA taşıyor. Native focus halkası
     (bazı tarayıcılarda kalın/koyu bir kutu olarak görünüyordu) kaldırılıp
     yerine ince, marka rengine uygun bir odak halkası konuldu. */
  outline: none;
  border-radius: 16px;
  transition: background-color .15s ease;
}
.projectMapCard:focus-visible{
  box-shadow: 0 0 0 2px rgba(30,79,163,.4);
}
.projectMapCard:hover{
  background: rgba(30,79,163,.05);
}
.projectMapCard__thumb{
  position: relative;
  flex: 0 0 72px;
  width: 72px;
  height: 72px;
  border-radius: 14px;
  overflow: hidden;
  background: linear-gradient(160deg, rgba(30,79,163,.16), rgba(30,79,163,.05));
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: inset 0 0 0 1px rgba(15,23,42,.07);
}
.projectMapCard__thumb img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.projectMapCard__thumb--empty .projectMapCard__thumbIcon{
  width: 28px;
  height: 28px;
  color: rgba(30,79,163,.5);
  display: flex;
}
.projectMapCard__thumb--empty .projectMapCard__thumbIcon svg{ width: 100%; height: 100%; }
/* Rozet: sayfadaki genel ".pcard__badge" kuralından (padding/font-size
   daha büyük, kart görselleri için tasarlanmış) devraldığı boyutlar
   yüzünden bu küçük thumbnail üzerinde kırmızı bir "top" gibi büyük ve
   orantısız görünüyordu — burada, aynı .pcard__badge--cN renk kurallarını
   KORUYUP sadece boyut/konum özelliklerini bu bağlama özel olarak (en az
   iki sınıflı bir seçiciyle, genel kuralla eşit/üstün özgüllükte) sıfırdan
   tanımlıyoruz. */
.projectMap .projectMapCard__badge{
  position: absolute;
  left: 5px;
  top: 5px;
  right: auto;
  bottom: auto;
  display: inline-block;
  font-size: 11px;
  line-height: 1.3;
  padding: 3px 7px;
  border-radius: 999px;
  letter-spacing: .01em;
  font-weight: 600;
  white-space: nowrap;
  box-shadow: 0 2px 6px rgba(15,23,42,.25);
}
.projectMapCard__body{
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 5px;
  padding-top: 1px;
}
.projectMapCard__title{
  font-size: 14px;
  line-height: 1.35;
  font-weight: 600;
  color: var(--pj-primary, #102654);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.projectMapCard__locLine{
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 11px;
  font-weight: 600;
  color: #64748b;
}
.projectMapCard__locLine svg{ width: 12px; height: 12px; flex: 0 0 auto; }
.projectMapCard__metaRow{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 5px;
  margin-top: 2px;
}
.projectMapCard__metaItem{
  display: inline-flex;
  align-items: center;
  gap: 4px;
  max-width: 100%;
  padding: 3px 8px;
  border-radius: 999px;
  background: rgba(30,79,163,.07);
  font-size: 11px;
  color: #64748b;
}
.projectMapCard__metaItem svg{ width: 10px; height: 10px; flex: 0 0 auto; color: var(--pj-secondary, #1E4FA3); }
.projectMapCard__metaItem b{
  color: #1E4FA3;
  font-weight: 700;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 150px;
}
.projectMapCard__cta{
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-top: 6px;
  padding: 7px 12px;
  border-radius: 999px;
  background: var(--pj-secondary, #1E4FA3);
  font-size: 11px;
  font-weight: 600;
  color: #fff;
  align-self: flex-start;
  transition: background-color .15s ease, transform .15s ease;
}
.projectMapCard:hover .projectMapCard__cta{
  background: var(--pj-primary, #102654);
  transform: translateX(1px);
  text-decoration: none;
}

/* --- Kart üzerine gelince (hover/focus) haritadaki karşılık gelen pin
   aktif hale gelir; bu, kart<->marker bağlantısını iki yönlü kılar. --- */
.page--projeler .pcard[href*="proje-detay.html?id="]{ cursor: pointer; }

/* =========================================================================
   Harita + sağ detay paneli: seçilen proje için haritanın sağında açılan
   daha geniş, kurumsal görünümlü panel (fotoğraf, ad/konum/yıl/kategori,
   açıklama, kullanılan ürünler, "Projeyi Detaylı İncele"). Panel kapalıyken
   harita tüm genişliği kaplar; panel açıldığında harita otomatik daralır
   (flex düzeni) — ayrı bir grid/sütun yapısına gerek yok.
   ========================================================================= */
.projectMapStage{
  display: flex;
  align-items: stretch;
  gap: 16px;
  /* Sabit yükseklik: panel içeriği (fotoğraf + açıklama + ürün listesi)
     ne kadar uzun olursa olsun harita büyüyüp küçülmesin — panel kendi
     içinde kaydırılır (overflow-y: auto), harita hep aynı boyutta kalır. */
  height: 480px;
}
.projectMapStage .projectMap{
  flex: 1 1 auto;
  min-width: 0;
  height: 100%;
}
.projectDetailPanel{
  flex: 0 0 360px;
  width: 360px;
  max-width: 360px;
  position: relative;
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid rgba(15,23,42,.08);
  border-radius: 18px;
  box-shadow: 0 20px 40px rgba(15,23,42,.10), 0 2px 8px rgba(15,23,42,.05);
  overflow-x: hidden;
  overflow-y: auto;
  opacity: 0;
  transform: translateX(8px);
  transition: opacity .22s ease, transform .22s ease;
}
.projectDetailPanel.is-open{
  opacity: 1;
  transform: translateX(0);
}
.projectDetailPanel[hidden]{ display: none; }
.projectDetailPanel__close{
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 2;
  width: 32px;
  height: 32px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  border: 1px solid rgba(15,23,42,.10);
  background: rgba(255,255,255,.92);
  color: #334155;
  box-shadow: 0 8px 18px rgba(15,23,42,.14);
  cursor: pointer;
  transition: background-color .15s ease, color .15s ease, transform .15s ease;
}
.projectDetailPanel__close svg{ width: 15px; height: 15px; }
.projectDetailPanel__close:hover{
  background: var(--pj-secondary, #1E4FA3);
  color: #fff;
  transform: rotate(90deg);
}
.projectDetailPanel__thumb{
  position: relative;
  width: 100%;
  height: 140px;
  flex: 0 0 auto;
  background: linear-gradient(160deg, rgba(30,79,163,.16), rgba(30,79,163,.05));
  display: flex;
  align-items: center;
  justify-content: center;
}
.projectDetailPanel__thumb img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.projectDetailPanel__thumb--empty .projectDetailPanel__thumbIcon{
  width: 46px;
  height: 46px;
  color: rgba(30,79,163,.5);
}
.projectDetailPanel__thumb--empty .projectDetailPanel__thumbIcon svg{ width: 100%; height: 100%; }
.projectDetailPanel__content{
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 14px 16px 16px;
}
.projectDetailPanel__badge{
  align-self: flex-start;
  font-size: 11px;
}
.projectDetailPanel__title{
  margin: 1px 0 0;
  font-size: 16px;
  line-height: 1.28;
  font-weight: 600;
  color: var(--pj-primary, #102654);
}
.projectDetailPanel__locLine{
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  font-weight: 600;
  color: #64748b;
}
.projectDetailPanel__locLine svg{ width: 12px; height: 12px; flex: 0 0 auto; }
.projectDetailPanel__metaRow{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 5px;
  margin-top: 1px;
}
.projectDetailPanel__metaItem{
  display: inline-flex;
  align-items: center;
  gap: 4px;
  max-width: 100%;
  padding: 4px 9px;
  border-radius: 999px;
  background: rgba(30,79,163,.07);
  font-size: 11px;
  color: #64748b;
}
.projectDetailPanel__metaItem svg{ width: 10px; height: 10px; flex: 0 0 auto; color: var(--pj-secondary, #1E4FA3); }
.projectDetailPanel__metaItem b{
  color: #1E4FA3;
  font-weight: 700;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 200px;
}
.projectDetailPanel__section{
  margin-top: 4px;
  padding-top: 10px;
  border-top: 1px solid rgba(15,23,42,.07);
}
.projectDetailPanel__sectionTitle{
  display: block;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--pj-muted, #64748b);
  margin-bottom: 6px;
}
.projectDetailPanel__desc{
  margin: 0;
  font-size: 12px;
  line-height: 1.5;
  color: #334155;
  /* Kısa/öz kalsın diye açıklama görsel olarak 4 satırla sınırlanır; tam
     metin proje detay sayfasında zaten mevcut. */
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.projectDetailPanel__prodList{
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.projectDetailPanel__prod{
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 6px 8px;
  border-radius: 9px;
  background: rgba(30,79,163,.045);
  font-size: 12px;
}
.projectDetailPanel__prodIcon{
  flex: 0 0 auto;
  width: 14px;
  height: 14px;
  color: var(--pj-secondary, #1E4FA3);
}
.projectDetailPanel__prodIcon svg{ width: 100%; height: 100%; }
.projectDetailPanel__prodName{
  flex: 1 1 auto;
  min-width: 0;
  color: #1e293b;
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.projectDetailPanel__prodQty{
  flex: 0 0 auto;
  font-weight: 600;
  color: var(--pj-secondary, #1E4FA3);
}
.projectDetailPanel__cta{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  margin-top: 10px;
  padding: 10px 14px;
  border-radius: 11px;
  background: var(--pj-secondary, #1E4FA3);
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  text-decoration: none;
  transition: background-color .15s ease, transform .15s ease;
}
.projectDetailPanel__cta:hover{
  background: var(--pj-primary, #102654);
  transform: translateY(-1px);
}

@media (max-width: 1080px) {
  .projectMapStage{
    flex-direction: column;
    /* Alt alta dizilimde sabit toplam yükseklik anlamsız; harita kendi
       yüksekliğini korur (aşağıda), panel altında kendi max-height'i
       kadar yer kaplar. */
    height: auto;
  }
  .projectMapStage .projectMap{
    height: 480px;
  }
  .projectDetailPanel{
    flex: 0 0 auto;
    width: 100%;
    max-width: none;
    max-height: 420px;
  }
}
@media (max-width: 760px) {
  .projectMapStage .projectMap{
    height: 340px;
  }
}


/* Erişilebilirlik: yalnızca ekran okuyucular için görünen başlıklar/etiketler */
.srOnly{
  position:absolute !important;
  width:1px; height:1px;
  padding:0; margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}


/* =========================================================================
   Listeler / Belgeler — kart ve boş durum iyileştirmeleri
   ========================================================================= */

/* Kapak görselleri dikey PDF sayfaları; 210px'lik dar kutuda "cover" ile
   kırpılınca belgenin başlığı kesiliyordu. Tamamı görünsün diye "contain"a
   alındı, arkasına nötr bir zemin kondu. */
.docsHubGrid .docHubCard__coverImg{
  object-fit: contain;
  object-position: center;
  padding: 10px;
  background: #f4f6fb;
}
.docsHubGrid .docHubCard__cover.has-thumb{
  background: #f4f6fb;
}

/* Rozet ve marka işareti kapağın üzerinde okunur kalsın diye alt/üst şerit */
.docsHubGrid .docHubCard__cover.has-thumb::after{
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 78px;
  background: linear-gradient(to top, rgba(7,25,74,.55), rgba(7,25,74,0));
  pointer-events: none;
}
.docsHubGrid .docHubCard__ribbon,
.docsHubGrid .docHubCard__coverMark{
  z-index: 2;
}
/* Dar kapak kutusunda tür rozeti ile marka işareti alt köşelerde çakışıyordu:
   rozet üst şeride alındı (koyu zemin + beyaz yazı, açık kapaklarda da okunur),
   marka işareti alt sol köşede gradyan şeridin üzerinde kalır. */
.docsHubGrid .docHubCard__cover[data-kind].has-thumb .docHubCard__ribbon,
.docsHubGrid .docHubCard__cover.has-thumb .docHubCard__ribbon{
  top: 10px;
  right: 10px;
  left: auto;
  max-width: calc(100% - 62px);
  background: rgba(7,25,74,.92);
  border-color: rgba(255,255,255,.18);
  color: #fff;
}
.docsHubGrid .docHubCard__cover[data-kind].has-thumb .docHubCard__ribbon{
  bottom: auto;
}
.docsHubGrid .docHubCard__cover.has-thumb .docHubCard__coverImg{
  padding: 44px 10px 34px;
}

/* Geniş ekranda birden fazla kayıt varsa iki sütun; tek kayıtta kart
   sayfanın tamamına yayılıp boş görünmesin diye üst sınır kondu. */
@media (min-width: 1180px){
  .docsHubGrid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
  }
  .docsHubGrid .docHubCard{
    grid-template-columns: 170px minmax(0, 1fr);
  }
  .docsHubGrid:has(.docHubCard:only-child){
    grid-template-columns: minmax(0, 720px);
  }
}

/* Boş durum: ikon + ortalanmış, daha okunur bir blok */
.docsEmpty{
  display: grid;
  justify-items: center;
  text-align: center;
  gap: 6px;
  padding: 34px 20px 30px;
  margin-top: 14px;
}
.docsEmpty__icon{
  display: grid;
  place-items: center;
  width: 52px;
  height: 52px;
  margin-bottom: 4px;
  border-radius: 16px;
  background: rgba(37,92,255,.08);
  color: #255cff;
}
.docsEmpty__icon svg{ width: 26px; height: 26px; }
.docsEmpty h3{ font-size: 18px; }
.docsEmpty p{ max-width: 46ch; }


/* =========================================================================
   Proje kartları: kapak görseli çerçeveyi tam doldursun
   Mobil kuralları (.pcard__img img { max-height:118px !important }) stok
   kartları için yazılmıştı; proje kartlarının tam kanama (full-bleed) kapak
   görselini de kısıtlayıp altta boşluk bırakıyordu.
   ========================================================================= */
.page--projeler .projectRefCard .pcard__img--full{
  padding: 0 !important;
  display: block !important;
}
.page--projeler .projectRefCard .pcard__img--full img{
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  object-fit: cover !important;
  object-position: center !important;
  filter: none !important;
}
.page--projeler .projectRefCard .projectRefCard__noImg{
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
}


/* =========================================================================
   Proje detay: ana görsel kartı tam doldursun (köşe yuvarlaklığıyla kırpılsın)
   ve "Benzer Referanslar" kartları proje kartlarıyla aynı davransın.
   Sebep: .pcard__img--full img { padding:16px } ve .gallery__main img
   { object-fit: contain } görselin çevresinde beyaz şerit bırakıyordu.
   ========================================================================= */
.page--proje-detay .detail--project .detail__media{
  padding: 0 !important;
  overflow: hidden;
  border-radius: 24px;
}
.page--proje-detay .detail--project .gallery{
  width: 100%;
}
.page--proje-detay .detail--project .detail__media:not(.is-placeholder){
  min-height: 0 !important;
}
/* Kart yüksekliğini görselin kendisi belirlesin (mobilde sabit yükseklikler
   kutuyu görselden uzun bırakıp üstte/altta boşluk oluşturuyordu). */
.page--proje-detay .detail--project .gallery__main{
  overflow: hidden;
  border-radius: 0;
  height: auto !important;
  aspect-ratio: 16 / 10;
}
.page--proje-detay .detail--project .gallery__main img{
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  object-fit: cover !important;
  object-position: center !important;
  border-radius: 0 !important;
  filter: none !important;
}
/* Küçük görsel şeridi kart kenarına yapışmasın */
.page--proje-detay .detail--project .gallery__thumbs{
  padding: 12px 14px 14px;
  margin: 0;
}
/* Görsel yoksa gösterilen yer tutucu da alanı doldursun */
.page--proje-detay .detail--project .detail__media.is-placeholder{
  padding: 18px !important;
}

/* Benzer Referanslar kartları — projeler sayfasındaki kartlarla aynı kural */
.page--proje-detay .projectSimilarCard .pcard__img--full,
.page--proje-detay .projectRefCard .pcard__img--full{
  padding: 0 !important;
  overflow: hidden;
}
.page--proje-detay .projectSimilarCard .pcard__img--full img,
.page--proje-detay .projectRefCard .pcard__img--full img{
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  object-fit: cover !important;
  object-position: center !important;
  filter: none !important;
}
.page--proje-detay .projectSimilarCard .pcard__img--full,
.page--proje-detay .projectRefCard .pcard__img--full{
  position: relative;
}
.page--proje-detay .projectSimilarCard .projectRefCard__noImg,
.page--proje-detay .projectRefCard .projectRefCard__noImg{
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
}


/* Lightbox: .lightbox__stage bir konumlandırma bağlamı; görsel mutlak
   konumlu olduğu için DOM sırası gereği ok ve kapat butonlarının üstünü
   kapatıyordu. Butonlar görselin üzerinde kalsın. */
.lightbox__img{ z-index: 1; }
.lightbox__nav{ z-index: 3; }
.lightbox__close{ z-index: 4; }
.lightbox__hint{ z-index: 3; }


/* Proje lightbox: sahne görselin oranında boyutlanır; koyu zemin fotoğrafı
   öne çıkarır ve görsel yakınlaştırıldığında taşan kısım sahnenin köşe
   yuvarlaklığıyla kırpılır. */
#projectLightbox .lightbox__stage{
  background: #0b1020;
  border-radius: 20px;
  width: auto;
  height: auto;
  max-width: 94vw;
  max-height: 88vh;
}
#projectLightbox .lightbox__img{
  border-radius: 0;
}


/* Ürün detay — opsiyonel özellik satırları (EVET / HAYIR) */
.page-urun-detay .spec--option .spec__label b{ font-weight: 700; }
.specFlag{
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-width: 62px;
  justify-content: center;
  padding: 3px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .03em;
  border: 1px solid transparent;
}
.specFlag.is-yes{
  color: #0f7a52;
  background: rgba(16,185,129,.12);
  border-color: rgba(16,185,129,.28);
}
.specFlag.is-no{
  color: #8a94a8;
  background: rgba(15,23,42,.05);
  border-color: rgba(15,23,42,.10);
}


/* Ürün detay — "Opsiyonel Özellikler" bölümü */
.page-urun-detay .optionsNote{
  margin: 0 0 12px;
  font-size: 12px;
  color: var(--muted);
  font-weight: 600;
  line-height: 1.5;
}
.page-urun-detay .optionsNote a{ color: #255cff; font-weight: 600; }
.page-urun-detay .acc--options .spec__label b{ font-weight: 700; }


/* =========================================================================
   Ürün detay — "Kullanılan Projeler" bölümü
   ========================================================================= */
.projectUseGrid{
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 16px;
}
.projectUseCard{
  display: flex;
  flex-direction: column;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 18px;
  overflow: hidden;
  text-decoration: none;
  color: inherit;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.projectUseCard:hover{
  transform: translateY(-3px);
  border-color: rgba(37,92,255,.28);
  box-shadow: 0 16px 32px rgba(16,38,84,.12);
}
.projectUseCard__media{
  position: relative;
  height: 158px;
  overflow: hidden;
  background: linear-gradient(160deg, rgba(37,92,255,.10), rgba(0,194,255,.06));
  border-bottom: 1px solid var(--line);
}
.projectUseCard__media img{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .35s ease;
}
.projectUseCard:hover .projectUseCard__media img{ transform: scale(1.04); }
.projectUseCard__noImg{
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  color: rgba(37,92,255,.55);
  font-size: 12px;
  font-weight: 600;
}
.projectUseCard__noImg svg{ width: 26px; height: 26px; }
.projectUseCard__badge{
  position: absolute;
  top: 10px;
  left: 10px;
  padding: 5px 10px;
  border-radius: 999px;
  background: rgba(7,25,74,.88);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .05em;
  max-width: calc(100% - 20px);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.projectUseCard__qty{
  position: absolute;
  right: 10px;
  bottom: 10px;
  padding: 5px 10px;
  border-radius: 999px;
  background: rgba(255,255,255,.94);
  border: 1px solid rgba(15,23,42,.10);
  color: #0f172a;
  font-size: 11px;
  font-weight: 700;
  box-shadow: 0 6px 14px rgba(2,6,23,.16);
}
.projectUseCard__body{
  padding: 13px 15px 6px;
  display: grid;
  gap: 4px;
}
.projectUseCard__loc{
  font-size: 12px;
  font-weight: 600;
  color: var(--muted);
}
.projectUseCard__body h3{
  margin: 0;
  font-size: 15px;
  line-height: 1.3;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.projectUseCard__sol{
  font-size: 12px;
  color: var(--muted);
  font-weight: 700;
}
.projectUseCard__cta{
  margin-top: auto;
  padding: 11px 15px 13px;
  font-size: 12px;
  font-weight: 700;
  color: #255cff;
}

@media (max-width: 560px){
  .projectUseGrid{ grid-template-columns: 1fr; }
  .projectUseCard__media{ height: 170px; }
}


/* Opsiyonel özellikler notu — vurgulu satır */
.page-urun-detay .optionsNote strong{
  display: block;
  margin-top: 6px;
  padding: 7px 11px;
  border-radius: 9px;
  color: #92400e;
  background: rgba(245,158,11,.10);
  border: 1px solid rgba(245,158,11,.28);
  font-weight: 600;
}


/* Karşılaştırma tablosu — opsiyonel özellik rozetleri */
.compareOptFlag{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 58px;
  padding: 3px 9px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .03em;
  border: 1px solid transparent;
}
.compareOptFlag.is-yes{ color:#0f7a52; background: rgba(16,185,129,.12); border-color: rgba(16,185,129,.30); }
.compareOptFlag.is-no{ color:#8a94a8; background: rgba(15,23,42,.05); border-color: rgba(15,23,42,.10); }
.compareOptFlag.is-na{ color:#a9b2c4; background: transparent; border-color: rgba(15,23,42,.08); font-weight: 700; }

/* ===== Header/nav ince ayar: üst bar biraz daha az yükseklikte, nav
   linkleri arasında hafif nefes payı ===== */
.header__inner{
  padding: 4px 0;
}
.nav__list{
  gap: 20px;
}
.nav__list a{
  padding: 8px 10px;
}

/* ===== Listeler sayfası (stoklar/projeler mantığından yeniden inşa) ===== */
.page--listeler .listHero{ padding: 4px 0 2px; }
.page--listeler .listHero p{ max-width: 620px; }

.page--listeler .listStatsRow{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 12px;
  margin: 18px 0 20px;
}
.page--listeler .listStatCard{
  display:flex; align-items:center; gap:12px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 14px 16px;
  box-shadow: var(--shadow);
}
.page--listeler .listStatCard__icon{
  width:40px; height:40px; border-radius:12px; flex:none;
  display:flex; align-items:center; justify-content:center;
  background: rgba(7,25,74,.08); color:#07194a;
}
.page--listeler .listStatCard__icon svg{ width:20px; height:20px; }
.page--listeler .listStatCard strong{ display:block; font-size:20px; font-weight:700; line-height:1.15; }
.page--listeler .listStatCard span{ font-size:12px; color:var(--muted); font-weight:700; }

.page--listeler .listToolbar{
  display:flex; flex-wrap:wrap; align-items:center; gap:12px;
  background: var(--paper); border:1px solid var(--line); border-radius:18px;
  padding: 14px 16px; margin-bottom: 18px; box-shadow: var(--shadow);
}
.page--listeler .listSearchWrap{ position:relative; flex: 1 1 260px; min-width:220px; }
.page--listeler .listSearchWrap svg{
  position:absolute; left:12px; top:50%; transform:translateY(-50%);
  width:18px; height:18px; color:var(--muted); pointer-events:none;
}
.page--listeler .listSearchWrap input{ padding-left:38px; width:100%; }
.page--listeler .listTypeSelectWrap{ flex: 0 1 200px; min-width:160px; }
.page--listeler .listTypeSelect{ width:100%; cursor:pointer; }
.page--listeler .listFacets{ display:flex; gap:8px; flex-wrap:wrap; margin-bottom:18px; }
.page--listeler .listMeta{ font-size:12px; color:var(--muted); font-weight:700; margin-left:auto; white-space:nowrap; }

.page--listeler .listGrid{
  display:grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 16px;
}
.page--listeler .listCard{
  position:relative; overflow:hidden;
  background: var(--paper); border:1px solid var(--line); border-radius:var(--radius);
  display:flex; flex-direction:column;
  box-shadow: 0 10px 24px rgba(15,23,42,.06); transition: transform .18s ease, box-shadow .18s ease;
}
.page--listeler .listCard:hover{ transform: translateY(-2px); box-shadow: 0 16px 34px rgba(15,23,42,.10); }

/* Stoklar sayfasındaki ürün kartlarıyla aynı görsel dil: üstte tam genişlikte
   görsel alanı (gerçek belge kapağı yerine tür temelli örnek görsel), altında
   marka/tür/başlık ve işlem butonları. */
.page--listeler .listCard__imgFull{
  position:relative; height:170px; flex:none;
  display:flex; align-items:center; justify-content:center;
  background: linear-gradient(160deg, rgba(37,92,255,.10), rgba(0,194,255,.06) 55%, rgba(15,23,42,.02));
  border-bottom:1px solid var(--line);
  overflow:hidden;
}
/* Ana görsel alanı: markanın gerçek logosu (yoksa genel tür ikonu). */
.page--listeler .listCard__brandLogoFull{
  max-width:72%; max-height:64%; width:auto; height:auto; object-fit:contain;
  filter: drop-shadow(0 10px 16px rgba(15,23,42,.12));
}
.page--listeler .listCard__typeGlyph{
  width:56px; height:56px; color:#255cff; opacity:.9;
  filter: drop-shadow(0 10px 16px rgba(37,92,255,.18));
}
.page--listeler .listCard__typeGlyph svg{ width:100%; height:100%; }
.page--listeler .listCard__typeWatermark{
  position:absolute; left:0; right:0; bottom:10px; text-align:center;
  font-size:12px; font-weight:700; letter-spacing:.03em; color:#1a3fb0;
  text-transform:uppercase; opacity:.75;
}
/* Sol üst rozet: artık marka logosu değil, belge türünü (Katalog/Fiyat
   Listesi) belirten küçük ikonu gösterir. */
.page--listeler .listCard__brandChip{
  position:absolute; top:10px; left:10px; z-index:2;
  width:34px; height:34px; border-radius:10px;
  background:#fff; border:1px solid var(--line); padding:7px;
  display:flex; align-items:center; justify-content:center;
  box-shadow: 0 6px 14px rgba(15,23,42,.10);
  color:#255cff;
}
.page--listeler .listCard__brandChip svg{ width:100%; height:100%; }

.page--listeler .listCard__body{ padding:14px 16px 16px; display:flex; flex-direction:column; gap:10px; flex:1; }
.page--listeler .listCard__kindRow{ display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.page--listeler .listCard__kind{ font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.05em; color:var(--muted); }
.page--listeler .listCard__typeBadge{
  font-size:11px; font-weight:600; letter-spacing:.02em;
  background: rgba(37,92,255,.1); color:#1a3fb0;
  border-radius:999px; padding:2px 9px; white-space:nowrap;
}
.page--listeler .listCard__title{ font-size:15px; font-weight:600; line-height:1.3; margin:0; }
.page--listeler .listCard__cta{
  margin-top:auto; display:inline-flex; align-items:center; gap:6px;
  font-size:12px; font-weight:600; color:#255cff;
}
.page--listeler .listCard__cta svg{ width:14px; height:14px; transition: transform .15s ease; }
.page--listeler .listCard:hover .listCard__cta svg{ transform: translateX(3px); }

.page--listeler .listEmpty{ text-align:center; padding: 40px 20px; color:var(--muted); font-weight:700; }

.page--listeler .listCta{
  margin-top:26px; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:14px;
  background: linear-gradient(120deg, #07194a 0%, #14306e 60%, #1d3f8f 100%);
  color:#fff; border-radius:20px; padding:22px 24px;
}
.page--listeler .listCta h3{ margin:0; font-size:18px; }
.page--listeler .listCta p{ margin:4px 0 0; color:#c7d2fe; font-size:13px; max-width:520px; }
.page--listeler .listCta .btnRow{ flex:none; }
/* .btn varsayılan olarak beyaz zemin (var(--paper)) kullanır ama kendi metin
   rengini tanımlamaz; bu koyu kutunun color:#fff'i miras alınca "WhatsApp"
   butonu beyaz zemin üzerinde beyaz yazı olup görünmez oluyordu. */
.page--listeler .listCta .btnRow .btn:not(.btn--primary){ color: var(--ink); }
/* WhatsApp butonu: sitedeki diğer WhatsApp bağlantılarıyla (bkz.
   .hCtaBanner__whatsapp) aynı yeşil marka rengini kullanır. Önceden genel
   .btn:hover kuralı (lacivert/mavi tonu) miras alındığı için hover'da
   yanlışlıkla maviye dönüyordu; artık hem normalde hem hover'da yeşil. */
.page--listeler .listCta .btnRow .listCta__whatsapp{
  background: rgba(37, 211, 102, .95);
  border-color: rgba(37, 211, 102, .95);
  color:#fff;
}
.page--listeler .listCta .btnRow .listCta__whatsapp:hover{
  background:#25D366;
  border-color:#25D366;
  color:#fff;
}

@media (max-width: 720px){
  .page--listeler .listToolbar{ flex-direction:column; align-items:stretch; }
  .page--listeler .listTypeSelectWrap{ flex:none; }
  .page--listeler .listMeta{ margin-left:0; }
}

/* ===== Genel: hero banner, mini istatistik ve bilgi kartları
   (Hakkımızda, İletişim gibi kurumsal sayfalarda kullanılır) ===== */
.heroBanner{
  background: linear-gradient(120deg, #07194a 0%, #14306e 55%, #1d3f8f 100%);
  color:#fff; border-radius:22px; padding:30px 32px; margin:18px 0 6px;
  position:relative; overflow:hidden;
}
.heroBanner::after{
  content:""; position:absolute; inset:0;
  background: radial-gradient(460px 240px at 92% -15%, rgba(255,255,255,.12), transparent 62%);
  pointer-events:none;
}
.heroBanner__eyebrow{
  display:inline-block; font-size:12px; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
  color:#a9bcff; margin:0 0 8px;
}
.heroBanner h1{ color:#fff; margin:0 0 8px; }
.heroBanner p{ color:#c7d2fe; max-width:640px; margin:0; font-size:14px; line-height:1.6; }

.miniStatRow{
  display:grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap:12px; margin:18px 0 22px;
}
.miniStatCard{
  display:flex; align-items:center; gap:12px;
  background: var(--paper); border:1px solid var(--line); border-radius:16px;
  padding:14px 16px; box-shadow: var(--shadow);
}
.miniStatCard__icon{
  width:40px; height:40px; border-radius:12px; flex:none;
  display:flex; align-items:center; justify-content:center;
  background: rgba(7,25,74,.08); color:#07194a;
}
.miniStatCard__icon svg{ width:20px; height:20px; }
.miniStatCard strong{ display:block; font-size:18px; font-weight:700; line-height:1.2; }
.miniStatCard span{ font-size:12px; color:var(--muted); font-weight:700; }

.infoCardGrid{
  display:grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap:14px;
}
.infoCard{
  background: var(--paper); border:1px solid var(--line); border-radius:18px;
  padding:18px; box-shadow: var(--shadow); display:flex; flex-direction:column; gap:8px;
  transition: transform .15s ease, box-shadow .15s ease;
}
a.infoCard:hover{ transform: translateY(-3px); box-shadow: 0 18px 44px rgba(15,23,42,.12); }
.infoCard__icon{
  width:42px; height:42px; border-radius:12px;
  display:flex; align-items:center; justify-content:center;
  background: rgba(37,92,255,.08); color:#255cff;
}
.infoCard__icon svg{ width:20px; height:20px; }
.infoCard h3{ margin:2px 0 0; font-size:15px; }
.infoCard p{ margin:0; font-size:13px; color:var(--muted); line-height:1.55; }
.infoCard__value{ font-size:14px; font-weight:600; color:var(--ink); margin:0; }

.sectionLabel{
  font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.06em;
  color:#255cff; margin:0 0 6px;
}

/* ===== Listeler: gerçek doküman kartları (görüntüle/indir) ===== */
.page--listeler .listCard__docMeta{
  display:flex; flex-direction:column; gap:3px;
  font-size:12px; color:var(--muted); font-weight:700;
}
.page--listeler .listCard__docMeta .listCard__ext{
  display:inline-flex; align-items:center; gap:4px; color:#9a6a00;
}
.page--listeler .listCard__docMeta .listCard__ext svg{ width:12px; height:12px; }
.page--listeler .listCard__actions{
  display:flex; gap:8px; margin-top:auto; padding-top:4px;
}
.page--listeler .listCard__actions .btn{
  flex:1; display:inline-flex; align-items:center; justify-content:center; gap:6px;
}
.page--listeler .listCard__actions svg{ width:15px; height:15px; }
.page--listeler .listCard__actions .btn[aria-busy="true"]{ opacity:.7; pointer-events:none; }

.sr-only{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}

/* ===================================================================
   Proje Detayı — üst blokların (galeri, başlık kartı, özet şeridi,
   sağ sütun kartı) köşe yuvarlaklığı ve kenarlık rengi tek bir ölçüye
   çekilir; sayfa boyunca göz aynı "kart dili"ni takip eder.
   =================================================================== */
.page--proje-detay .detail--project .detail__media,
.page--proje-detay .detail--project .detail__titleBox,
.page--proje-detay .detail--project .detail__box,
.page--proje-detay .projectFeatureStrip{
  border-radius: 20px;
  border-color: rgba(7,25,74,.10);
}
.page--proje-detay .detail--project .detail__titleBox,
.page--proje-detay .detail--project .detail__box{
  box-shadow: 0 10px 24px rgba(7,25,74,.05);
}

/* Proje Süreci'ndeki numaralı gradyan rozetlerin renk dilini (navy →
   sarı-yeşil aksan) sayfanın diğer üst bloklarına da taşır: adres
   iğnesi, Proje Bilgileri satır başlıkları, özet şeridi kartları ve
   galeri gezinme/küçük görsel vurguları. */
.page--proje-detay .specs .spec b{
  position:relative;
  padding-left:16px;
}
.page--proje-detay .specs .spec b::before{
  content:"";
  position:absolute;
  left:0;
  top:50%;
  transform:translateY(-50%);
  width:7px;
  height:7px;
  border-radius:50%;
  background: linear-gradient(135deg, var(--accent), var(--accent2));
}

.page--proje-detay .projectQuickItem{
  position:relative;
  padding-left:16px;
  overflow:hidden;
}
.page--proje-detay .projectQuickItem::before{
  content:"";
  position:absolute;
  left:0; top:0; bottom:0;
  width:4px;
  background: linear-gradient(180deg, var(--accent), var(--accent2));
}

.page--proje-detay .gallery__nav:hover{
  background: linear-gradient(135deg, var(--accent), var(--accent2));
  color:#fff;
}
.page--proje-detay .gallery__thumb.is-active{
  outline-color: var(--accent2);
  border-color: var(--accent);
}
.page--proje-detay .gallery__thumb:hover{
  border-color: var(--accent2);
}

.page--proje-detay .productToolbar__badges .miniTag{
  color: #07194a;
  border-color: rgba(7,25,74,.14);
  background: rgba(7,25,74,.04);
}
.page--proje-detay .productToolbar__badges .miniTag--accent{
  color:#fff;
  border-color: transparent;
  background: linear-gradient(135deg, var(--accent), var(--accent2));
}

/* =========================================================================
   Logo/amblem görselleri (pcard__img--contain / detail__media--contain):
   proje kapak fotoğrafları object-fit:cover ile çerçeveyi kırpıp doldurur,
   ama şeffaf zeminli bir logo bu şekilde devasa ve kırpılmış görünür.
   Bu projelerde (project.imageFit === "contain") görsel kırpılmadan,
   çerçeve içinde dolgu bırakılarak bütün halinde ve küçük gösterilir.
   ========================================================================= */
.page--projeler .projectRefCard .pcard__img--full.pcard__img--contain,
.page--proje-detay .projectSimilarCard .pcard__img--full.pcard__img--contain,
.page--proje-detay .projectRefCard .pcard__img--full.pcard__img--contain{
  padding: 18px !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  background: var(--paper) !important;
}
.page--projeler .projectRefCard .pcard__img--full.pcard__img--contain img,
.page--proje-detay .projectSimilarCard .pcard__img--full.pcard__img--contain img,
.page--proje-detay .projectRefCard .pcard__img--full.pcard__img--contain img{
  position: static !important;
  inset: auto !important;
  width: auto !important;
  height: auto !important;
  max-width: 100% !important;
  max-height: 100% !important;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  object-fit: contain !important;
  object-position: center !important;
  filter: none !important;
}
.page--proje-detay .detail--project .detail__media--contain{
  padding: 0 !important;
}
.page--proje-detay .detail--project .detail__media--contain .gallery__main{
  aspect-ratio: 16 / 10;
  background: var(--paper);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 28px;
}
.page--proje-detay .detail--project .detail__media--contain .gallery__main img{
  width: auto !important;
  height: auto !important;
  max-width: 100% !important;
  max-height: 100% !important;
  min-height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  object-fit: contain !important;
  object-position: center !important;
  border-radius: 0 !important;
  filter: none !important;
}
.page--proje-detay .detail--project .detail__media--contain .gallery__thumb{
  background: var(--paper);
}
.page--proje-detay .detail--project .detail__media--contain .gallery__thumb img{
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  padding: 4px;
}

/* ===== Anasayfa: TCMB USD/TRY kur bandı (hHero__showcase içinde,
   marka şeridinin altında, CTA bandının üstünde tam genişlik satır) ===== */
.page--home .hHero__rateStrip{
  grid-column: 1 / -1;
  margin-top: 0;
  padding: 14px 18px;
  display:flex;
  flex-direction:column;
  gap: 6px;
  background: linear-gradient(155deg, rgba(37,92,255,.06), rgba(0,194,255,.05));
}
.hRateWidget__row{
  display:flex;
  flex-direction:row;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap: 10px 16px;
}
.hRateWidget__label{
  font-size: 12px;
  font-weight: 600;
  color: var(--muted);
  letter-spacing: .01em;
}
.hRateWidget__date{
  font-weight: 600;
  color: var(--muted);
}
.hRateWidget__value{
  font-family: "Space Grotesk", system-ui;
  font-size: 17px;
  font-weight: 700;
  color: var(--ink);
}
.hRateWidget__value--loading{
  font-family: Inter, system-ui;
  font-size: 13px;
  font-weight: 600;
  color: var(--muted);
}
.hRateWidget__source{
  font-size: 12px;
  font-weight: 600;
  color: var(--accent);
  text-decoration: underline;
  text-underline-offset: 3px;
  white-space: nowrap;
}
.hHero__rateStrip .hRateWidget__note,
.hRateWidget__note{
  margin: 0;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.4;
  color: #d81e2c !important;
}

@media (max-width: 640px){
  .page--home .hHero__rateStrip{
    padding: 14px 16px;
  }
  .hRateWidget__row{
    flex-direction:column;
    align-items:flex-start;
    gap: 4px;
  }
  .hRateWidget__value{
    font-size: 16px;
  }
  .hRateWidget__note{
    font-size: 11px;
  }
}

/* ===== Kur kartı (.rateCard): stoklar.html ve urun-detay.html'de
   bağımsız bir kart olarak kullanılan, ana sayfadaki kur şeridiyle
   aynı iç yapıyı (js/exchange-rate.js tarafından doldurulan
   .hRateWidget__row/__note) paylaşan genel kapsayıcı. ===== */
.rateCard{
  background: linear-gradient(155deg, rgba(37,92,255,.06), rgba(0,194,255,.05));
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 14px 18px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin: 0 0 18px;
}
.rateCard--compact{
  margin: 0;
  padding: 12px 16px;
}
@media (max-width: 640px){
  .rateCard{
    padding: 12px 14px;
  }
}

/* ===================================================================
   Hamburger menü — ikonlar + genişlik düzeltmesi
   Ana Sayfa / İletişim / Listeler sayfalarındaki mevcut Ara-WhatsApp
   kartları ve butonları burada değiştirilmiyor, başka hiçbir sayfaya
   Arama/WhatsApp düğmesi eklenmiyor. Bu blok yalnızca hamburger
   menüsü (nav__btn görünür olduğunda, ≤1340px) için:
   - menü linklerinin başına küçük, tek renkli (currentColor) çizgi
     ikonlar ekliyor (HTML'deki .nav__emoji span'leri içinde satır içi
     SVG — renkli emoji glyphlerinin cihazdan cihaza değişen görünümü
     ve hizalama sorunu yerine, sitedeki diğer ikonlarla aynı çizgi
     stilinde, metinle tam hizalı sabit boyutlu ikonlar), masaüstü
     yatay menüde gizli kalır,
   - dar ekranlarda menünün sağa yaslanıp solda boşluk bırakan eski
     genişlik/konum kısıtlarını simetrik hale getiriyor.
   Renkler, fontlar ve diğer bileşenler değişmedi.
   Not: nav__btn (hamburger) artık ≤1180px'te görünüyor (js/app.js'teki
   "(max-width: 1180px)" mobil menü eşiğiyle aynı; bkz. üstteki
   1181-1340px kompakt menü kuralı); bu blok da aynı eşiğe hizalandı,
   aksi halde 1181-1340px arasındaki yatay masaüstü menüde de ikonlar
   görünürdü. */
.nav__emoji{
  display:none;
}
@media (max-width: 1180px){
  .nav__emoji{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:18px;
    height:18px;
    margin-right:9px;
    color: var(--muted);
    flex: none;
    vertical-align:middle;
  }
  .nav__emoji svg{
    width:100%;
    height:100%;
    display:block;
  }
  .nav__list a.is-active .nav__emoji{
    color: var(--ink);
  }
}
@media (max-width: 760px){
  /* Menü kutusunun sağa yaslanıp max-width:360px ile solda boşluk
     bırakan önceki kuralı (bkz. .nav__list right:0 + width:min(360px,...))
     simetrik kenar boşluklarıyla değiştiriyoruz; böylece menü tüm
     genişliği kullanır ve içerik düzgün sola hizalanır. */
  .nav__list{
    left: 12px !important;
    right: 12px !important;
    width: auto !important;
    max-width: none !important;
    align-items: stretch !important;
  }
}

/* ===================================================================
   Projeler sayfası — mobilde proje kartları artık tek sütun yerine
   2 sütun (2-2-2) gösteriliyor: hem "Öne Çıkan Projeler" şeridi hem de
   ana "Projeler" ızgarası. Yukarıdaki daha eski/genel kurallar (ör.
   ".products{grid-template-columns:1fr !important}" ~620px'te,
   ".page--projeler .projectFeatureGrid{grid-template-columns:1fr
   !important}" ~860px'te) bu sayfada tek sütuna düşürüyordu; buradaki
   kurallar (dosyanın SONUNDA olduğu ve/veya daha yüksek özgüllüğe
   sahip olduğu için) onların yerini alır. --- */
@media (max-width: 860px) {
  .page--projeler #projectList.products,
  .page--projeler .projectFeatureGrid{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
  }
}
@media (max-width: 480px) {
  .page--projeler #projectList.products,
  .page--projeler .projectFeatureGrid{
    gap: 8px !important;
  }
  .page--projeler .projectRefCard .pcard__body{
    padding: 12px !important;
    gap: 6px !important;
  }
  .page--projeler .projectRefCard .pcard__title{
    font-size: 13px !important;
  }
  .page--projeler .projectRefCard .pcard__metaRow{
    flex-wrap: wrap;
  }
}

/* --- 2 sütunlu mobil kartlarda okunabilirlik düzeltmeleri: (1) kategori
   rozeti ("AVM" vb.) ile "Öne Çıkan" etiketi dar kartta iç içe giriyordu
   — ikisine de kartın yarısını asla aşamayacak bir tavan (calc(50% - Npx))
   ve taşan metni "..." ile kesme eklendi, bu yüzden ne kadar uzun
   kategori adı olursa olsun (ör. "AKARYAKIT İSTASYONU") çakışma
   MATEMATİKSEL olarak imkânsız. (2) Konum satırı (📍 Şehir) bir flex
   kutusu olduğu için kartın geri kalanındaki text-align:center'ı
   miras almıyor ve sola yaslı duruyordu — artık o da ortalanıyor.
   (3) Başlık 2 satırda kesilip proje adının sonu görünmüyordu — 3
   satıra çıkarıldı. --- */
@media (max-width: 620px) {
  .page--projeler .projectRefCard .pcard__featuredTag{
    /* "Öne Çıkan" metni sabit/kısa olduğu için doğal genişliğinde
       (~85px) bırakılıyor — sadece bir güvenlik payı olarak üst sınır
       konuyor. Kategori rozeti ("AVM", "EĞİTİM KURUMU" vb.) ise ne kadar
       yer KALDIYSA (kartın %100'ünden bu etiketin kapladığı payın
       çıkarılmasıyla, bkz. aşağıdaki calc) o kadar genişlik alabiliyor;
       böylece rozet ile etiket kart ne kadar dar olursa olsun asla
       çakışmaz, rozet gerektiğinde "..." ile kısalır. */
    max-width: 112px;
    padding: 4px 8px 4px 6px;
    font-size: 11px;
    gap: 3px;
    white-space: nowrap;
    overflow: hidden;
  }
  .page--projeler .projectRefCard .pcard__featuredTag span{
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 0;
  }
  .page--projeler .projectRefCard .pcard__featuredTag svg{
    width: 10px;
    height: 10px;
    flex: none;
  }
  .page--projeler .projectRefCard .pcard__badge{
    /* Varsayılan: aynı kartta "Öne Çıkan" etiketi YOKSA rozet, kartın
       neredeyse tamamı kadar genişlik kullanabilir (sadece sol/sağ 12px'lik
       iç boşluk payı düşülüyor). Kartların büyük çoğunluğunda (31 projenin
       yalnızca 3'ü "öne çıkan") gereksiz yere dar tutulup "SPOR TESİSİ",
       "EĞİTİM KURUMU" gibi etiketlerin kırpılmasına neden oluyordu. */
    max-width: calc(100% - 24px);
    padding: 4px 7px;
    font-size: 11px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .page--projeler .projectRefCard .pcard__img--full:has(.pcard__featuredTag) .pcard__badge{
    /* Bu kartta "Öne Çıkan" etiketi de varsa, iki rozet üst üste binmesin
       diye rozete ayrılan genişlik yine dar tutulur. */
    max-width: calc(100% - 120px);
  }
  .page--projeler .projectRefCard .pcard__locLine{
    justify-content: center;
  }
  .page--projeler .projectRefCard .pcard__title--v3{
    -webkit-line-clamp: 3;
    height: calc(1.22em * 3);
    min-height: calc(1.22em * 3);
  }
}

/* 480px altında (2 sütunlu mobil kart genişliği ~170px) yukarıdaki 120px'lik
   pay hâlâ kategori rozetine yeterli yer bırakmıyor; ör. "SPOR TESİSİ"
   "SP..." şeklinde kırpılıyordu. Kartta hem kategori hem "Öne Çıkan" rozeti
   birlikteyse, bu dar genişlikte "Öne Çıkan" yazısı gizlenip sadece ikonu
   bırakılır — kategori adına neredeyse tüm satır genişliği kalır. */
@media (max-width: 480px) {
  .page--projeler .projectRefCard .pcard__img--full:has(.pcard__featuredTag) .pcard__featuredTag{
    max-width: none;
    padding: 5px;
    gap: 0;
  }
  .page--projeler .projectRefCard .pcard__img--full:has(.pcard__featuredTag) .pcard__featuredTag span{
    display: none;
  }
  .page--projeler .projectRefCard .pcard__img--full:has(.pcard__featuredTag) .pcard__badge{
    max-width: calc(100% - 46px);
  }
}


/* ================================
   Ana Sayfa — Öne Çıkan Ürün Kartı
   (hHero__showcase içinde, PEDAŞ kartının SOLUNDA; aynı boyut/stil dili)
   ================================ */
.page--home .hHero__showcase .hFeaturedCard{
  align-items:center;
  justify-content:center;
  padding: 18px;
  min-height: 0;
  background: #fff;
}
.hFeaturedCard__media{
  position: relative;
  width: 100%;
  flex: 1 1 auto;
  display:flex;
  align-items:center;
  justify-content:center;
  padding: 6px 6px 12px;
  border-radius: 10px;
}
.hFeaturedCard__media:focus-visible{
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}
.hFeaturedCard__media img{
  width: 100%;
  height: auto;
  max-height: 120px;
  object-fit: contain;
  transition: opacity .18s ease;
}
.hFeaturedCard__media img.is-fading{
  opacity: 0;
}

.hFeaturedCard__stock{
  position:absolute;
  top: -10px;
  left: -10px;
  z-index: 1;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .02em;
  text-transform: uppercase;
  padding: 3px 7px;
  border-radius: 999px;
  background: rgba(16,185,129,.14);
  color: #0a7a56;
  border: 1px solid rgba(16,185,129,.25);
  line-height:1.4;
}
.hFeaturedCard__stock.is-out{
  background: rgba(220,38,38,.06);
  color:#991b1b;
  border-color: rgba(220,38,38,.25);
}

.hFeaturedCard__navBtn{
  position:absolute;
  top:50%;
  transform: translateY(-50%);
  width: 24px;
  height: 24px;
  border-radius:999px;
  border:1px solid var(--line);
  background: rgba(255,255,255,.92);
  color: var(--ink);
  font-size: 15px;
  line-height:1;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  opacity: 0;
  transition: opacity .15s ease, background .15s ease;
}
.hFeaturedCard__media:hover .hFeaturedCard__navBtn,
.hFeaturedCard__navBtn:focus-visible{
  opacity: 1;
}
.hFeaturedCard__navBtn:hover{ background:#fff; border-color:var(--accent); color:var(--accent); }
.hFeaturedCard__navBtn--prev{ left: 2px; }
.hFeaturedCard__navBtn--next{ right: 2px; }

.hFeaturedCard__dots{
  position:absolute;
  left:50%;
  bottom: -2px;
  transform: translateX(-50%);
  display:flex;
  gap:5px;
}
.hFeaturedCard__dot{
  width:6px;
  height:6px;
  border-radius:999px;
  border:none;
  padding:0;
  background: rgba(8,26,70,.18);
  cursor:pointer;
}
.hFeaturedCard__dot.is-active{ background: var(--accent); }
@media (hover:none){
  .hFeaturedCard__navBtn{ opacity: 1; }
}

.hFeaturedCard__info{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap: 6px;
  text-align:center;
  padding: 10px 0 0;
  border-top: 1px solid rgba(8,26,70,.08);
  margin-top: 8px;
  width: 100%;
}
.hFeaturedCard__tag{
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .03em;
  text-transform: uppercase;
  color: #d21f1f;
}
.hFeaturedCard__name{
  font-family:"Space Grotesk", system-ui;
  font-size: 11px;
  line-height:1.3;
  color:#081A46;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
}
.hFeaturedCard__btn{
  padding: 7px 16px;
  font-size: 12px;
}

@media (max-width: 720px){
  .hFeaturedCard__media img{ max-height: 150px; }
}

/* =========================================================
   Navbar + logo entegrasyonu
   Logo görselinin kendi lacivert zeminiyle nav bar birebir
   aynı renge getirildi; logonun etrafındaki kutu (çerçeve,
   yuvarlatma, gölge, farklı arka plan) kaldırılarak logo
   doğrudan bara "gömülü" görünüyor. Logo ayrıca okunabilirlik
   için büyütüldü; nav linkleri ve telefon rozeti koyu zemine
   göre yeniden renklendirildi.
   ========================================================= */
.header,
.header--solo{
  background:#091732;
  border-bottom:1px solid rgba(255,255,255,.10);
  backdrop-filter:none;
}

.header__inner{
  padding:6px 0;
}

.brand__logo{
  background:none;
  border:0;
  border-radius:0;
  box-shadow:none;
  width:clamp(140px, 14vw, 196px);
}

.nav__list a{
  color:rgba(255,255,255,.80);
}
.nav__list a:hover{
  color:#ffffff;
  background:rgba(255,255,255,.10);
}
.nav__list a.is-active{
  color:#ffffff;
  background:linear-gradient(90deg, rgba(255,255,255,.16), rgba(215,229,31,.22));
  border-color:rgba(255,255,255,.24);
}

.nav__btn{
  background:rgba(255,255,255,.08);
  border-color:rgba(255,255,255,.18);
}
.nav__btn span{
  background:#ffffff;
}

.header__right .phone{
  background:rgba(255,255,255,.96);
  border-color:rgba(255,255,255,.20);
}

@media (max-width: 860px){
  .header__inner{
    padding:5px 0;
  }
  .brand__logo{
    width:clamp(128px, 30vw, 172px) !important;
  }
}
@media (max-width: 820px){
  .brand__logo{
    width:clamp(128px, 30vw, 172px);
  }
}
@media (max-width: 640px){
  .header__inner{
    padding:5px 0;
  }
  .brand__logo{
    width:clamp(112px, 34vw, 148px);
    border-radius:0;
  }
}

/* ===== Ana sayfa: Sıkça Sorulan Sorular (SSS) =====
   Basit, tek sütun, kart/gölge kullanmayan sade bir liste: çok sayıda
   soru olsa da (13) göz yormaması için ince ayraç çizgileri ve bolca
   boşlukla, tek okunabilir sütun genişliğinde (720px) sunuluyor. */
.hFaq__intro{
  margin:0 0 26px;
  max-width:640px;
  font-size:13.5px;
  line-height:1.6;
  color:var(--muted);
}
.hFaq__intro a{
  color:var(--accent);
  font-weight:700;
  text-decoration:underline;
  text-underline-offset:2px;
}
.hFaq__groups{
  max-width:720px;
}
.faqGroup{
  margin:0 0 28px;
}
.faqGroup:last-child{
  margin-bottom:0;
}
.faqGroup__title{
  margin:0 0 2px;
  font-size:12px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.06em;
  color:var(--accent);
}
.faqList{
  display:flex;
  flex-direction:column;
}
.faqItem{
  border-bottom:1px solid var(--line);
}
.faqItem__q{
  list-style:none;
  cursor:pointer;
  display:flex;
  align-items:center;
  gap:14px;
  padding:15px 2px;
  font-size:14px;
  font-weight:600;
  color:var(--ink);
  line-height:1.4;
}
.faqItem__q::-webkit-details-marker{
  display:none;
}
.faqItem__q span{
  flex:1 1 auto;
}
.faqItem__chev{
  width:17px;
  height:17px;
  flex:none;
  color:var(--muted);
  transition:transform .16s ease;
}
.faqItem[open] .faqItem__chev{
  transform:rotate(180deg);
}
.faqItem__a{
  margin:-2px 0 0;
  padding:0 2px 16px;
}
.faqItem__a p{
  margin:0;
  max-width:62ch;
  font-size:13px;
  line-height:1.65;
  color:var(--muted);
}
.faqItem__a a{
  color:var(--accent);
  font-weight:700;
  text-decoration:underline;
  text-underline-offset:2px;
}
@media (max-width: 640px){
  .faqGroup{
    margin:0 0 22px;
  }
  .faqItem__q{
    font-size:13.5px;
    padding:13px 0;
    gap:10px;
  }
  .faqItem__a{
    padding:0 0 14px;
  }
}

/* ===== Ana sayfa SSS: sağ sütun (öne çıkan ürünler + projeler) ===== */
.hFaq__layout{
  display:flex;
  align-items:flex-start;
  gap:48px;
}
.hFaq__layout .hFaq__main{
  flex:1 1 620px;
  max-width:720px;
  min-width:0;
}
.hFaqAside{
  flex:1 1 300px;
  max-width:320px;
  display:flex;
  flex-direction:column;
  gap:26px;
}
.hFaqAside__title{
  margin:0 0 12px;
  font-size:12px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.06em;
  color:var(--accent);
}
.hFaqAside__products{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}
.miniProductCard{
  display:flex;
  flex-direction:column;
  gap:8px;
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:14px;
  padding:10px;
  text-decoration:none;
  color:inherit;
  transition:box-shadow .15s ease;
}
.miniProductCard:hover{
  box-shadow:0 12px 26px rgba(15,23,42,.10);
}
.miniProductCard__imgWrap{
  aspect-ratio:1/1;
  border-radius:10px;
  background:#f7f9fc;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  position:relative;
}
.miniProductCard__stock{
  position:absolute;
  top:6px;
  left:6px;
  z-index:1;
  font-size:9px;
  font-weight:600;
  letter-spacing:.02em;
  text-transform:uppercase;
  padding:2px 6px;
  border-radius:999px;
  background:rgba(16,185,129,.14);
  color:#0a7a56;
  border:1px solid rgba(16,185,129,.25);
  line-height:1.4;
}
.miniProductCard__stock.is-out{
  background:rgba(220,38,38,.06);
  color:#991b1b;
  border-color:rgba(220,38,38,.25);
}
.miniProductCard__img{
  width:100%;
  height:100%;
  object-fit:contain;
  padding:10px;
}
.miniProductCard__name{
  font-size:11.5px;
  font-weight:700;
  color:var(--ink);
  line-height:1.35;
}
.miniProductCard__meta{
  font-size:10.5px;
  color:var(--muted);
  font-weight:600;
}
.hFaqAside__projects{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.miniProjectCard{
  display:flex;
  align-items:center;
  gap:10px;
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:14px;
  padding:10px;
  text-decoration:none;
  color:inherit;
  transition:box-shadow .15s ease, transform .15s ease;
}
.miniProjectCard:hover{
  box-shadow:0 12px 26px rgba(15,23,42,.10);
  transform:translateY(-2px);
}
.miniProjectCard__imgWrap{
  width:52px;
  height:52px;
  flex:none;
  border-radius:10px;
  background:#f7f9fc;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}
.miniProjectCard__img{
  width:100%;
  height:100%;
  object-fit:contain;
  padding:5px;
}
.miniProjectCard__body{
  display:flex;
  flex-direction:column;
  gap:3px;
  min-width:0;
}
.miniProjectCard__title{
  font-size:12px;
  font-weight:700;
  color:var(--ink);
  line-height:1.3;
}
.miniProjectCard__cta{
  font-size:10.5px;
  color:var(--accent);
  font-weight:700;
}
@media (max-width: 900px){
  .hFaq__layout{
    flex-direction:column;
  }
  .hFaqAside{
    position:static;
    max-width:100%;
    width:100%;
  }
  .hFaqAside__products{
    max-width:420px;
  }
}

/* =========================================================
   Mobil hamburger menü — okunabilirlik düzeltmesi
   Header'ın koyu lacivert zemini için tanımlanan ".nav__list a"
   beyaz metin rengi (bkz. "Navbar + logo entegrasyonu" bloğu),
   header'dan bağımsız, position:fixed AÇIK/BEYAZA yakın
   (rgba(255,255,255,.98)) zeminli mobil menü paneline
   (".nav__list.is-open") de miras kalıyor ve menü açıkken
   yönlendirme linkleri beyaz-üstüne-beyaz görünüp okunamıyordu.
   Burada menü AÇIK durumu için (".nav__list.is-open a" — iki
   sınıflı, daha yüksek özgüllük) zeminle yeterli kontrast
   sağlayan koyu renkler açıkça tanımlanıyor; dosya sırasına
   güvenmek yerine hem özgüllük hem de dosya sonunda olmak bu
   kuralın her zaman kazanmasını garanti ediyor (bkz. AGENTS.md
   "Genel" bölümündeki .btn/.btn:hover örneği ile aynı ilke).
   Header'ın kendi masaüstü/kompakt yatay menüsü (".nav__list"
   olan, ".is-open" OLMAYAN hali) bu kuraldan etkilenmez, koyu
   zemine göre beyaz metniyle aynen kalır. ========================================================= */
.nav__list.is-open a{
  color: var(--ink);
}
.nav__list.is-open a:hover{
  color: var(--ink);
  background: rgba(15,23,42,.06);
}
.nav__list.is-open a.is-active{
  color: var(--ink);
  background: linear-gradient(90deg, rgba(37,92,255,.10), rgba(0,194,255,.10));
  border-color: rgba(37,92,255,.18);
}