:root {
  --spc-primary: #f97316;        /* turuncu — ana renk */
  --spc-primary-dark: #14202b;   /* koyu slate — footer/menü/başlık çapası */
  --spc-accent: #f59e0b;         /* amber — vurgu CTA */
  --spc-bg: #f5f7fa;
  --spc-border: #e3e8ef;
  --spc-text: #1c2733;
  --spc-muted: #65728a;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  font-family: "Segoe UI", system-ui, -apple-system, Roboto, Arial, sans-serif;
  color: var(--spc-text);
  background: var(--spc-bg);
}

a { color: var(--spc-primary); text-decoration: none; }
a:hover { text-decoration: underline; }

.container { width: 100%; max-width: 1200px; margin: 0 auto; padding: 0 16px; }

/* ---------- Header ---------- */
.spc-header { background: #fff; border-bottom: 1px solid var(--spc-border); }
.spc-header-main {
  display: flex; align-items: center; gap: 18px; padding: 14px 16px;
}

/* Global "sepete eklendi" bildirimi — üst köşede belirir, birkaç saniyede kaybolur (JS'siz) */
.spc-flash-toast {
  position: fixed; top: 84px; right: 20px; z-index: 500;
  display: flex; align-items: center; gap: 8px;
  background: #16a34a; color: #fff; font-weight: 600;
  padding: 12px 18px; border-radius: 10px; box-shadow: var(--spc-shadow-md);
  animation: spcFlashInOut 4s ease forwards;
}
@keyframes spcFlashInOut {
  0% { opacity: 0; transform: translateY(-10px); }
  8% { opacity: 1; transform: translateY(0); }
  82% { opacity: 1; transform: translateY(0); }
  100% { opacity: 0; transform: translateY(-10px); visibility: hidden; }
}
@media (max-width: 620px) { .spc-flash-toast { top: auto; bottom: 16px; right: 16px; left: 16px; justify-content: center; } }
.spc-logo { display: flex; align-items: center; gap: 10px; color: var(--spc-primary-dark); }
.spc-logo:hover { text-decoration: none; }
.spc-logo-mark {
  background: var(--spc-primary); color: #fff; font-weight: 800;
  padding: 6px 10px; border-radius: 8px; letter-spacing: .5px;
}
.spc-logo-text { font-weight: 700; font-size: 1.15rem; white-space: nowrap; }

.spc-search { flex: 1; display: flex; min-width: 0; }
.spc-search input {
  flex: 1; min-width: 0; border: 2px solid var(--spc-primary);
  border-right: none; border-radius: 8px 0 0 8px; padding: 12px 16px; font-size: 1rem;
}
.spc-search input:focus { outline: none; }
.spc-search button {
  border: none; background: var(--spc-primary); color: #fff; font-weight: 600;
  padding: 0 26px; border-radius: 0 8px 8px 0; cursor: pointer; font-size: 1rem;
}
.spc-search button:hover { background: #ea580c; }

.spc-contact { display: flex; align-items: center; gap: 12px; }
.spc-phone { display: flex; flex-direction: column; line-height: 1.1; color: var(--spc-primary-dark); }
.spc-contact-label { font-size: .72rem; color: var(--spc-muted); }
.spc-contact-value { font-weight: 700; }
.spc-wa {
  background: #25d366; color: #fff; padding: 10px 16px; border-radius: 8px; font-weight: 600;
}
.spc-wa:hover { text-decoration: none; background: #1ebe5a; }
/* Garajım — header üst satırda turuncu buton (tıkla → garaj / üye değilse giriş) */
.spc-garage-top { display: inline-flex; align-items: center; gap: 7px; background: var(--spc-primary); color: #fff; padding: 10px 14px; border-radius: 8px; font-weight: 700; white-space: nowrap; }
.spc-garage-top .ic { width: 18px; height: 18px; }
.spc-garage-top:hover { background: #ea580c; color: #fff; text-decoration: none; }
@media (max-width: 820px) { .spc-garage-top .spc-garage-top-txt { display: none; } .spc-garage-top { padding: 9px 11px; } }

/* Header: ikon üstte + yazı altta (WhatsApp / Ara / Garajım) */
.spc-hi { display: inline-flex; flex-direction: column; align-items: center; gap: 3px; color: var(--spc-primary-dark); text-decoration: none; line-height: 1.1; padding: 2px 4px; }
.spc-hi:hover { text-decoration: none; }
.spc-hi-ic { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 50%; background: #f1f5f9; color: var(--spc-primary-dark); transition: background .15s, color .15s; }
.spc-hi-ic .ic { width: 19px; height: 19px; }
.spc-hi-lbl { font-size: .74rem; font-weight: 600; white-space: nowrap; }
.spc-hi-call { background: #fff2e8; color: var(--spc-primary); }
.spc-hi-wa { background: #e4fbec; color: #16a34a; }
.spc-hi-garage { background: #fff2e8; color: var(--spc-primary); }
.spc-hi:hover .spc-hi-call { background: var(--spc-primary); color: #fff; }
.spc-hi:hover .spc-hi-wa { background: #16a34a; color: #fff; }
.spc-hi:hover .spc-hi-garage { background: var(--spc-primary); color: #fff; }
@media (max-width: 820px) { .spc-hi-lbl { display: none; } }

/* ---------- Ana menü: Kategoriler butonu + araç markaları ---------- */
.spc-mainnav { background: var(--spc-primary-dark); }
.spc-mainnav-inner { display: flex; align-items: stretch; gap: 8px; }

/* Sol: Tüm Kategoriler butonu + geniş mega-panel */
.spc-catbtn-wrap { position: relative; flex: 0 0 auto; }
.spc-catbtn {
  height: 100%; display: flex; align-items: center; gap: 8px;
  background: var(--spc-primary); color: #fff; border: none; cursor: pointer;
  font-weight: 700; font-size: .92rem; padding: 13px 20px;
}
.spc-catbtn-icon { font-size: 1.05rem; line-height: 1; }
.spc-catbtn:hover { background: #ea580c; }

.spc-catmega {
  position: absolute; top: 100%; left: 0; z-index: 50; display: none;
  width: min(920px, 92vw);
  grid-template-columns: repeat(4, 1fr); gap: 4px 24px;
  background: #fff; border: 1px solid var(--spc-border); border-top: 3px solid var(--spc-primary);
  border-radius: 0 0 12px 12px; box-shadow: 0 16px 40px rgba(16,24,40,.18);
  padding: 20px 24px;
}
@media (min-width: 821px) and (hover: hover) { .spc-catbtn-wrap:hover .spc-catmega { display: grid; } }
.spc-catbtn-wrap.is-open .spc-catmega { display: grid; }
.spc-catmega-col { break-inside: avoid; margin-bottom: 14px; }
.spc-catmega-head { display: block; font-weight: 700; color: var(--spc-primary-dark); font-size: .92rem; margin-bottom: 8px; padding-bottom: 6px; border-bottom: 1px solid var(--spc-border); }
.spc-catmega-head:hover { color: var(--spc-primary); text-decoration: none; }
.spc-catmega-col ul { list-style: none; margin: 0; padding: 0; }
.spc-catmega-col li { margin: 0; }
.spc-catmega-col ul a { display: block; color: var(--spc-muted); font-size: .86rem; padding: 4px 0; }
.spc-catmega-col ul a:hover { color: var(--spc-primary); text-decoration: none; }

/* Sağ: araç markaları — TEK SATIR (taşarsa yatay kaydırma, çizgiyi bozma) */
.spc-brandnav { list-style: none; display: flex; align-items: center; gap: 2px; margin: 0; padding: 0; flex: 1 1 auto; min-width: 0; flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
.spc-brandnav::-webkit-scrollbar { display: none; }
.spc-brandnav > li { flex: 0 0 auto; }
.spc-brandnav > li > a, .spc-morebrands-btn {
  display: block; color: #d8dee6; padding: 13px 14px; font-weight: 600; font-size: .9rem;
  background: none; border: none; cursor: pointer; font-family: inherit;
}
.spc-brandnav > li > a:hover, .spc-morebrands-btn:hover { color: #fff; background: var(--spc-primary); text-decoration: none; }

.spc-morebrands { position: relative; }
.spc-morebrands-panel {
  position: absolute; top: 100%; right: 0; z-index: 50; display: none; min-width: 200px;
  background: #fff; border: 1px solid var(--spc-border); border-top: 3px solid var(--spc-primary);
  border-radius: 0 0 10px 10px; box-shadow: 0 12px 30px rgba(16,24,40,.16);
  padding: 8px; max-height: 60vh; overflow-y: auto;
}
@media (min-width: 821px) and (hover: hover) { .spc-morebrands:hover .spc-morebrands-panel { display: block; } }
.spc-morebrands.is-open .spc-morebrands-panel { display: block; }
.spc-morebrands-panel a { display: block; color: var(--spc-text); padding: 7px 12px; font-size: .88rem; border-radius: 6px; }
.spc-morebrands-panel a:hover { background: #fff1e3; color: var(--spc-primary); text-decoration: none; }

/* Nav sağı: Hemen Ara (ikon + metin) — header kayınca hep erişilebilir */
.spc-nav-call { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 8px; color: #fff; font-weight: 700; font-size: .9rem; padding: 0 18px; text-decoration: none; border-left: 1px solid rgba(255, 255, 255, .12); white-space: nowrap; }
.spc-nav-call .ic { width: 18px; height: 18px; color: #fb923c; }
.spc-nav-call:hover { background: var(--spc-primary); color: #fff; text-decoration: none; }
.spc-nav-call:hover .ic { color: #fff; }
@media (max-width: 820px) { .spc-nav-call { justify-content: center; padding: 12px; border-left: 0; border-top: 1px solid rgba(255, 255, 255, .12); } }

/* Araç markası logoları (dosya varsa) — koyu nav'da beyaz çip içinde, tek satır bozulmaz */
.spc-brand-logo { display: block; height: 34px; width: 34px; object-fit: contain; background: #fff; border-radius: 8px; padding: 4px; flex: none; box-shadow: 0 1px 3px rgba(0,0,0,.18); }
.spc-brandnav > li > a { display: flex; align-items: center; }
.spc-brandnav > li > a.has-logo { gap: 8px; padding: 8px 14px 8px 8px; }
.spc-brand-name { white-space: nowrap; font-weight: 600; }
/* Araç markası → modeller dropdown paneli (masaüstü hover; tam genişlik, nav altında) */
.spc-mainnav { position: relative; }
.spc-brandmega { position: absolute; top: 100%; left: 0; right: 0; z-index: 60; background: #fff; border-top: 1px solid var(--spc-border); box-shadow: 0 14px 26px rgba(16,24,40,.14); }
.spc-brandmega-inner { padding: 16px 0 20px; }
.spc-brandmega-head { display: flex; align-items: baseline; gap: 14px; margin-bottom: 12px; }
.spc-brandmega-head #brandMegaTitle { font-weight: 800; font-size: 1rem; color: var(--spc-primary-dark); text-transform: uppercase; letter-spacing: .02em; }
.spc-brandmega-head a { font-size: .82rem; color: var(--spc-primary); font-weight: 700; text-decoration: none; }
.spc-brandmega-head a:hover { text-decoration: underline; }
.spc-brandmega-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 2px 18px; max-height: 52vh; overflow-y: auto; }
.spc-brandmega-grid a { color: var(--spc-text); font-size: .9rem; padding: 6px 8px; border-radius: 6px; text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.spc-brandmega-grid a:hover { background: #f1f4f8; color: var(--spc-primary); }
.spc-brandmega-msg { color: var(--spc-muted); font-size: .9rem; padding: 8px; }
@media (max-width: 900px) { .spc-brandmega { display: none; } }

/* Nav sağı: Garajım (turuncu, öne çıkan) — tıkla → garaj (üye değilse giriş/kayıt) */
.spc-nav-garage { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 8px; color: #fff; font-weight: 700; font-size: .9rem; padding: 0 18px; text-decoration: none; background: var(--spc-primary); white-space: nowrap; }
.spc-nav-garage .ic { width: 18px; height: 18px; }
.spc-nav-garage:hover { background: #ea580c; color: #fff; text-decoration: none; }
@media (max-width: 820px) { .spc-nav-garage { justify-content: center; padding: 12px; } }

@media (max-width: 820px) {
  /* Header: satırlara böl — logo + iletişim ikonları üstte, arama tam genişlik altta */
  .spc-header-main { flex-wrap: wrap; gap: 10px 12px; padding: 12px 14px; }
  .spc-search { order: 5; flex: 1 1 100%; position: relative; }
  .spc-search button { display: none; }              /* butonu gizle — Enter ile ara */
  .spc-search input { border-radius: 8px; border-right: 2px solid var(--spc-primary); font-size: .95rem; }
  .spc-contact { margin-left: auto; gap: 6px; }
  .spc-phone .spc-phone-txt { display: none; }        /* telefon: sadece ikon */
  .spc-phone { padding: 6px; }
  .spc-wa span { display: none; }                     /* WhatsApp: sadece ikon */
  .spc-wa { padding: 9px 11px; }
  .spc-logo-text { font-size: 1.05rem; }

  /* Nav: Tüm Kategoriler tam genişlik + tıkla-aç mega (tek sütun, kaydırmalı); markalar yatay kaydırma */
  .spc-mainnav-inner { flex-direction: column; align-items: stretch; gap: 0; }
  .spc-catbtn-wrap { width: 100%; }
  .spc-catbtn { width: 100%; justify-content: space-between; }
  /* Mobil mega: doğal açılış (nav sticky olmadığı için içeriği aşağı iter, sayfa akıcı kayar) */
  .spc-catmega { position: static; display: none; grid-template-columns: 1fr; width: 100%; box-shadow: none; border: none; border-radius: 0; padding: 6px 16px 14px; }
  .spc-brandnav { flex-wrap: nowrap; overflow-x: auto; gap: 0; padding: 2px 8px 8px; -webkit-overflow-scrolling: touch; }
  .spc-brandnav::-webkit-scrollbar { height: 0; }
  .spc-brandnav > li { flex: 0 0 auto; }
  .spc-brandnav > li > a { padding: 11px 12px; white-space: nowrap; }
  .spc-morebrands { display: none; }
}

@media (max-width: 480px) {
  /* Çok dar ekran: logo yazısını gizle, sadece amblem — iletişim ikonlarına yer aç */
  .spc-logo-text { display: none; }
}

/* ---------- Hero (hibrit) ---------- */
.spc-hero { padding: 28px 0; }
.spc-hero-grid { display: grid; grid-template-columns: 380px 1fr; gap: 20px; }

.spc-vehicle-panel {
  background: #fff; border: 1px solid var(--spc-border); border-radius: 12px; padding: 22px;
  box-shadow: 0 1px 3px rgba(16,24,40,.06);
}
.spc-vehicle-panel h1 { margin: 0 0 4px; font-size: 1.25rem; }
.spc-vehicle-panel p.sub { margin: 0 0 16px; color: var(--spc-muted); font-size: .9rem; }
.spc-vehicle-panel select, .spc-vehicle-panel button {
  width: 100%; padding: 12px 14px; margin-bottom: 12px; border-radius: 8px;
  border: 1px solid var(--spc-border); font-size: .95rem; background: #fff;
}
.spc-vehicle-panel select:disabled { background: #f1f3f7; color: #9aa6b8; }
.spc-vehicle-panel button {
  background: var(--spc-accent); color: #fff; font-weight: 700; border: none;
  cursor: pointer; margin-bottom: 0;
}
.spc-vehicle-panel button:disabled { background: #f0b886; cursor: not-allowed; }

.spc-promo {
  background: linear-gradient(135deg, var(--spc-primary) 0%, var(--spc-primary-dark) 100%);
  color: #fff; border-radius: 12px; padding: 40px; display: flex; flex-direction: column;
  justify-content: center;
}
.spc-promo h2 { margin: 0 0 12px; font-size: 2rem; }
.spc-promo p { margin: 0 0 20px; font-size: 1.1rem; opacity: .9; max-width: 560px; }
.spc-promo .spc-btn {
  align-self: flex-start; background: var(--spc-accent); color: #fff; padding: 12px 24px;
  border-radius: 8px; font-weight: 700;
}

/* ---------- Section / shortcuts ---------- */
.spc-section { padding: 24px 0; }
.spc-section h2 { font-size: 1.3rem; margin: 0 0 16px; }
.spc-chips { display: flex; flex-wrap: wrap; gap: 10px; }
.spc-chip {
  background: #fff; border: 1px solid var(--spc-border); border-radius: 999px;
  padding: 10px 18px; font-weight: 500; color: var(--spc-text);
}
.spc-chip:hover { border-color: var(--spc-primary); color: var(--spc-primary); text-decoration: none; }

/* ---------- Kategori / arama başlık bandı ---------- */
.spc-cathead {
  background: linear-gradient(135deg, var(--spc-primary-dark) 0%, #23303f 100%);
  color: #fff; padding: 26px 0 22px; margin-bottom: 20px;
}
.spc-breadcrumb { font-size: .82rem; color: #aeb9c7; margin-bottom: 10px; display: flex; gap: 8px; align-items: center; }
.spc-breadcrumb a { color: #dbe3ec; }
.spc-breadcrumb a:hover { color: #fff; }
/* Açık zeminli sayfalarda (ürün detay) breadcrumb */
.spc-breadcrumb-page { color: var(--spc-muted); padding: 18px 0 6px; }
.spc-breadcrumb-page a { color: var(--spc-primary); }
.spc-breadcrumb-page a:hover { color: #ea580c; }
.spc-cathead h1 { margin: 0; font-size: 1.7rem; }
.spc-cathead-sub { margin: 6px 0 0; color: #aeb9c7; font-size: .92rem; }

/* ---------- Aktif filtreler ---------- */
.spc-activefilters { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 18px; }
.spc-activefilters-label { font-size: .82rem; font-weight: 700; color: var(--spc-muted); }
.spc-filterchip {
  display: inline-flex; align-items: center; gap: 8px; background: #fff1e3; color: var(--spc-primary);
  border: 1px solid #ffd9b8; border-radius: 999px; padding: 5px 12px; font-size: .84rem; font-weight: 600;
}
.spc-filterchip span { font-weight: 800; opacity: .8; }
.spc-filterchip:hover { background: var(--spc-primary); color: #fff; border-color: var(--spc-primary); text-decoration: none; }
.spc-filterclear { font-size: .82rem; color: var(--spc-muted); text-decoration: underline; }

/* ---------- Product grid / search ---------- */
.spc-layout { display: grid; grid-template-columns: 260px 1fr; gap: 24px; padding: 0 0 24px; }
.spc-facets { background: #fff; border: 1px solid var(--spc-border); border-radius: 14px; padding: 6px 18px 12px; align-self: start; }
.spc-facet-group { padding: 12px 0; border-bottom: 1px solid var(--spc-border); }
.spc-facet-group:last-child { border-bottom: none; }
.spc-facets h3 { font-size: .8rem; text-transform: uppercase; letter-spacing: .05em; color: var(--spc-muted); margin: 0 0 8px; }
.spc-facets ul { list-style: none; margin: 0; padding: 0; }
.spc-facets li { margin: 0; }
.spc-facets a { display: flex; justify-content: space-between; align-items: center; gap: 8px; color: var(--spc-text); font-size: .9rem; padding: 7px 10px; border-radius: 8px; }
.spc-facets a:hover { background: #fff1e3; color: var(--spc-primary); text-decoration: none; }
.spc-facets .count { color: var(--spc-muted); font-size: .8rem; background: #f1f3f7; border-radius: 999px; padding: 1px 8px; }
.spc-facets a.active { font-weight: 700; color: var(--spc-primary); background: #fff1e3; }
.spc-facets a.active .count { background: var(--spc-primary); color: #fff; }
.spc-facet-empty { color: var(--spc-muted); font-size: .88rem; padding: 12px 0; }

/* Kenar çubuğu araç seçici */
.spc-vehiclefilter select, .spc-vehiclefilter button { width: 100%; padding: 9px 11px; margin-top: 8px; border-radius: 8px; border: 1px solid var(--spc-border); font-size: .88rem; background: #fff; }
.spc-vehiclefilter select:disabled { background: #f1f3f7; color: #9aa6b8; }
.spc-vehiclefilter button { background: var(--spc-accent); color: #fff; font-weight: 700; border: none; cursor: pointer; }
.spc-vehiclefilter button:disabled { background: #f0b886; cursor: not-allowed; }
.spc-vehiclefilter-current { display: flex; flex-direction: column; gap: 4px; background: #fff1e3; border: 1px solid #ffd9b8; border-radius: 8px; padding: 8px 10px; font-size: .86rem; font-weight: 700; color: var(--spc-primary-dark); }
.spc-vehiclefilter-current a { font-size: .8rem; font-weight: 600; color: var(--spc-primary); }
.spc-vehiclefilter-hint { font-size: .78rem; color: var(--spc-muted); margin: 8px 0 0; }

/* Aramalı combobox (marka & model) */
.spc-combo { position: relative; margin-top: 8px; }
.spc-combo-input { width: 100%; padding: 9px 30px 9px 11px; border-radius: 8px; border: 1px solid var(--spc-border); font-size: .88rem; background: #fff; box-sizing: border-box; }
.spc-combo-input:focus { outline: none; border-color: var(--spc-accent); box-shadow: 0 0 0 2px rgba(230,126,34,.15); }
.spc-combo.is-disabled .spc-combo-input { background: #f1f3f7; color: #9aa6b8; cursor: not-allowed; }
.spc-combo-caret { position: absolute; right: 11px; top: 50%; transform: translateY(-50%); font-size: .65rem; color: #9aa6b8; pointer-events: none; }
.spc-combo-list { position: absolute; z-index: 40; left: 0; right: 0; top: calc(100% + 3px); max-height: 240px; overflow-y: auto; margin: 0; padding: 4px; list-style: none; background: #fff; border: 1px solid var(--spc-border); border-radius: 8px; box-shadow: 0 8px 24px rgba(15,23,42,.14); }
.spc-combo-list li { padding: 8px 10px; border-radius: 6px; font-size: .86rem; cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.spc-combo-list li:hover, .spc-combo-list li.active { background: var(--spc-accent); color: #fff; }
.spc-combo-empty { color: var(--spc-muted); cursor: default; }
.spc-combo-empty:hover { background: transparent; color: var(--spc-muted); }
/* Anasayfa panelinde daha büyük input'lara uy */
.spc-vehicle-panel .spc-combo { margin: 0 0 12px; }
.spc-vehicle-panel .spc-combo-input { padding: 12px 32px 12px 14px; font-size: .95rem; }

/* Aktif filtrede araç çipi (koyu, öne çıkan) */
.spc-filterchip-vehicle { background: var(--spc-primary-dark); color: #fff; border-color: var(--spc-primary-dark); }
.spc-filterchip-vehicle span { opacity: .85; }
.spc-filterchip-vehicle:hover { background: #000; border-color: #000; color: #fff; }

.spc-results-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; flex-wrap: wrap; gap: 12px; }
.spc-results-count { font-weight: 700; color: var(--spc-muted); font-size: .9rem; }
.spc-sort { display: flex; align-items: center; gap: 8px; }
.spc-sort label { font-size: .85rem; color: var(--spc-muted); }
.spc-sort select { padding: 8px 12px; border: 1px solid var(--spc-border); border-radius: 8px; background: #fff; font-size: .9rem; cursor: pointer; }
.spc-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 18px; }

.spc-card {
  background: #fff; border: 1px solid var(--spc-border); border-radius: 14px; overflow: hidden;
  display: flex; flex-direction: column; transition: box-shadow .18s, transform .18s, border-color .18s;
}
.spc-card:hover { box-shadow: 0 10px 28px rgba(16,24,40,.12); transform: translateY(-3px); border-color: #ffd9b8; text-decoration: none; }
.spc-card-img { position: relative; aspect-ratio: 4/3; background: #f7f9fc; display: flex; align-items: center; justify-content: center; color: #b6c0d0; padding: 14px; }
.spc-card-img img { max-width: 100%; max-height: 100%; object-fit: contain; }
.spc-card-noimg { font-size: .82rem; }
.spc-card-stock { position: absolute; top: 10px; left: 10px; font-size: .7rem; font-weight: 700; padding: 3px 9px; border-radius: 999px; text-transform: uppercase; letter-spacing: .03em; }
.spc-card-stock.in { background: #dcfce7; color: #15803d; }
.spc-card-stock.out { background: #fee2e2; color: #b91c1c; }
.spc-card-type { position: absolute; top: 10px; right: 10px; font-size: .7rem; font-weight: 700; padding: 3px 9px; border-radius: 999px; text-transform: uppercase; letter-spacing: .03em; }
.spc-card-type.orijinal { background: #dcfce7; color: #15803d; }
.spc-card-type.muadil { background: #e0edff; color: #1d4ed8; }
.spc-card-link { display: flex; flex-direction: column; flex: 1; color: inherit; }
.spc-card-link:hover { text-decoration: none; }
.spc-card-body { padding: 14px; display: flex; flex-direction: column; gap: 6px; flex: 1; }
.spc-card-brand { font-size: .72rem; font-weight: 700; color: var(--spc-primary); text-transform: uppercase; letter-spacing: .04em; }
.spc-card-name { color: var(--spc-text); font-weight: 600; font-size: .86rem; line-height: 1.3; min-height: 3.4em; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.spc-card-meta { display: inline-block; align-self: flex-start; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .76rem; color: #475467; background: #f2f4f7; padding: 2px 8px; border-radius: 6px; letter-spacing: .01em; }
.spc-card-foot { padding: 12px 14px 14px; display: flex; flex-direction: column; align-items: stretch; gap: 10px; border-top: 1px solid var(--spc-border); }
.spc-card-addform { margin: 0; }
.spc-card-addbtn { width: 100%; display: inline-flex; align-items: center; justify-content: center; gap: 7px; padding: 10px 12px; border: none; border-radius: 9px; background: var(--spc-primary); color: #fff; font-weight: 700; font-size: .9rem; cursor: pointer; transition: filter .15s; }
.spc-card-addbtn:hover { filter: brightness(1.07); }
.spc-card-addbtn .ic { width: 17px; height: 17px; }
.spc-price { font-weight: 800; font-size: 1.1rem; color: var(--spc-primary-dark); }
.spc-price-ask { font-size: .92rem; color: var(--spc-primary); }
.spc-card-cta { font-size: .82rem; font-weight: 700; color: var(--spc-primary); }

.spc-badge { display: inline-block; background: #fff1e3; color: var(--spc-primary); border-radius: 6px; padding: 3px 8px; font-size: .78rem; font-weight: 600; }
.spc-badge-orijinal { background: #dcfce7; color: #15803d; }
.spc-badge-muadil { background: #e0edff; color: #1d4ed8; }

.spc-empty { background: #fff; border: 1px dashed var(--spc-border); border-radius: 14px; padding: 56px 24px; text-align: center; color: var(--spc-muted); }
.spc-empty-icon { font-size: 2.4rem; margin-bottom: 8px; }
.spc-empty strong { color: var(--spc-text); }

/* ---------- Pagination ---------- */
.spc-pager { display: flex; gap: 6px; justify-content: center; margin-top: 28px; }
.spc-pager a, .spc-pager span {
  padding: 9px 15px; border: 1px solid var(--spc-border); border-radius: 8px; background: #fff; color: var(--spc-text); font-weight: 600; font-size: .9rem;
}
.spc-pager a:hover { border-color: var(--spc-primary); color: var(--spc-primary); text-decoration: none; }
.spc-pager .current { background: var(--spc-primary); color: #fff; border-color: var(--spc-primary); }

/* ---------- Product detail ---------- */
.spc-detail { display: grid; grid-template-columns: 420px 1fr; gap: 32px; padding: 24px 0; }
.spc-detail-img { background: #fff; border: 1px solid var(--spc-border); border-radius: 12px; aspect-ratio: 1; display: flex; align-items: center; justify-content: center; color: #b6c0d0; }
.spc-detail h1 { font-size: 1.6rem; margin: 4px 0 8px; }
.spc-detail .spc-detail-brand { color: var(--spc-muted); text-transform: uppercase; font-size: .85rem; letter-spacing: .04em; }
.spc-detail .spc-detail-price { font-size: 2rem; font-weight: 800; color: var(--spc-primary-dark); margin: 16px 0; }
.spc-cta { display: flex; gap: 12px; margin: 18px 0; flex-wrap: wrap; }
.spc-cta a { padding: 14px 28px; border-radius: 10px; font-weight: 700; font-size: 1.05rem; }
.spc-cta .call { background: var(--spc-primary); color: #fff; }
.spc-cta .wa { background: #25d366; color: #fff; }
.spc-spec { width: 100%; border-collapse: collapse; margin-top: 16px; background: #fff; border: 1px solid var(--spc-border); border-radius: 12px; overflow: hidden; }
.spc-spec th, .spc-spec td { text-align: left; padding: 10px 14px; border-bottom: 1px solid var(--spc-border); font-size: .92rem; }
.spc-spec th { background: #f8fafc; width: 200px; color: var(--spc-muted); font-weight: 600; }
.spc-chiplist { display: flex; flex-wrap: wrap; gap: 8px; }
.spc-chiplist span { background: #f1f3f7; border-radius: 6px; padding: 4px 10px; font-size: .85rem; }

/* ---------- Footer ---------- */
.spc-footer { background: var(--spc-primary-dark); color: #c8d2e0; margin-top: 32px; padding: 32px 0 16px; }
.spc-footer a { color: #fff; }
.spc-footer-cols { display: grid; grid-template-columns: 2fr 1fr 1.5fr; gap: 24px; }
@media (max-width: 700px) { .spc-footer-cols { grid-template-columns: 1fr; } }
.spc-footer strong { color: #fff; display: block; margin-bottom: 8px; }
.spc-footer-bottom { border-top: 1px solid rgba(255,255,255,.12); margin-top: 24px; padding-top: 14px; font-size: .85rem;
    display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
/* ETBİS: panelden gelen resmi kod bloğu — koyu footer'da okunsun diye beyaz kart içinde */
.spc-etbis { display: inline-flex; align-items: center; background: #fff; border-radius: 8px; padding: 7px 11px; line-height: 0; }
.spc-etbis img, .spc-etbis canvas, .spc-etbis svg { display: block; max-height: 64px; width: auto; max-width: 220px; }
/* Kod bloğu yoksa: doğrulama linkinden üretilen karekod rozeti */
.spc-etbis-qr { display: inline-flex; align-items: center; gap: 9px; background: #fff; border-radius: 8px; padding: 6px 11px 6px 7px; }
.spc-etbis-qr:hover { text-decoration: none; filter: brightness(.97); }
.spc-etbis-qr-img { width: 46px; height: 46px; display: block; flex: 0 0 46px; }
.spc-etbis-qr-img svg { width: 100%; height: 100%; display: block; }
.spc-etbis-qr-txt { font-size: .68rem; font-weight: 800; line-height: 1.15; color: #14202b; letter-spacing: .01em; }

/* ---------- Responsive ---------- */
@media (max-width: 900px) {
  .spc-hero-grid { grid-template-columns: 1fr; }
  .spc-layout { grid-template-columns: 1fr; }
  .spc-detail { grid-template-columns: 1fr; }
  .spc-detail-img { max-width: 420px; }
}
@media (max-width: 700px) {
  .spc-header-main { flex-wrap: wrap; }
  .spc-search { order: 3; flex-basis: 100%; }
  .spc-contact { margin-left: auto; }
  .spc-footer-cols { grid-template-columns: 1fr; }
}

/* ---------- İçerik sayfaları (Hakkımızda / İletişim) ---------- */
.spc-prose { max-width: 820px; }
.spc-prose h1 { margin: 0 0 16px; }
.spc-prose h2 { margin: 28px 0 12px; font-size: 1.15rem; }
.spc-prose p { color: var(--spc-text); line-height: 1.7; margin: 0 0 12px; }
.spc-prose ul { margin: 0 0 12px; padding-left: 20px; line-height: 1.9; }

.spc-contact-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; margin-top: 20px; }
.spc-contact-card { background: #fff; border: 1px solid var(--spc-border); border-radius: 12px; padding: 18px; }
.spc-contact-card strong { display: block; color: var(--spc-muted); font-size: .78rem; text-transform: uppercase; letter-spacing: .04em; margin-bottom: 8px; }
.spc-contact-card p { margin: 0 0 4px; }

/* ---------- Öne Çıkan Motorlar slider ---------- */
.spc-motors { background: #fff; border-top: 1px solid var(--spc-border); border-bottom: 1px solid var(--spc-border); }
.spc-slider-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; margin-bottom: 16px; flex-wrap: wrap; }
.spc-slider-head h2 { margin: 0; }
.spc-slider-sub { margin: 4px 0 0; color: var(--spc-muted); font-size: .9rem; }
.spc-slider-nav { display: flex; align-items: center; gap: 8px; }
.spc-slider-all { font-weight: 700; color: var(--spc-primary); font-size: .9rem; margin-right: 6px; }
.spc-slider-btn { width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--spc-border); background: #fff; color: var(--spc-primary-dark); font-size: 1.4rem; line-height: 1; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: background .15s, color .15s; }
.spc-slider-btn:hover { background: var(--spc-primary); color: #fff; border-color: var(--spc-primary); }
.spc-slider { display: flex; gap: 18px; overflow-x: auto; scroll-snap-type: x mandatory; padding: 2px 2px 12px; scrollbar-width: thin; }
.spc-slider::-webkit-scrollbar { height: 8px; }
.spc-slider::-webkit-scrollbar-thumb { background: #d5dbe4; border-radius: 999px; }
.spc-slider .spc-slide { flex: 0 0 240px; scroll-snap-align: start; }
/* Az öğeli slider taşmıyorsa kartları ortala (sola yığılıp sağ boş kalmasın) — JS ekler */
.spc-slider.spc-slider--fit { justify-content: center; }
.spc-slider .spc-card-noimg { font-size: 2.4rem; }

/* ---------- Blog ---------- */
.spc-blog-teaser { background: #fff; border-top: 1px solid var(--spc-border); }
.spc-blog-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 22px; }
.spc-blog-card { display: flex; flex-direction: column; background: #fff; border: 1px solid var(--spc-border); border-radius: 14px; overflow: hidden; transition: box-shadow .18s, transform .18s, border-color .18s; }
.spc-blog-card:hover { box-shadow: 0 10px 28px rgba(16,24,40,.12); transform: translateY(-3px); border-color: #ffd9b8; text-decoration: none; }
.spc-blog-img { aspect-ratio: 16/9; background: #f7f9fc; display: flex; align-items: center; justify-content: center; font-size: 2.6rem; color: #b6c0d0; }
.spc-blog-img img { width: 100%; height: 100%; object-fit: cover; }
.spc-blog-body { padding: 16px 18px 18px; display: flex; flex-direction: column; gap: 8px; }
.spc-blog-date { font-size: .78rem; color: var(--spc-muted); text-transform: uppercase; letter-spacing: .03em; }
.spc-blog-title { font-size: 1.05rem; margin: 0; color: var(--spc-text); line-height: 1.35; }
.spc-blog-summary { font-size: .9rem; color: var(--spc-muted); line-height: 1.6; margin: 0; }
.spc-blog-more { font-size: .84rem; font-weight: 700; color: var(--spc-primary); margin-top: 2px; }

/* Blog yazı detay */
.spc-article { max-width: 760px; margin: 0 auto; padding: 8px 0 32px; }
.spc-article h1 { font-size: 1.9rem; margin: 8px 0 10px; line-height: 1.25; }
.spc-article-meta { color: var(--spc-muted); font-size: .88rem; margin-bottom: 18px; display: flex; gap: 8px; }
.spc-article-hero { width: 100%; border-radius: 14px; margin-bottom: 20px; }
.spc-article-body { color: var(--spc-text); line-height: 1.8; font-size: 1.02rem; }
.spc-article-body h2 { font-size: 1.3rem; margin: 28px 0 12px; }
.spc-article-body ul { padding-left: 22px; line-height: 1.9; }
.spc-article-body p { margin: 0 0 16px; }
.spc-article-cta { margin-top: 32px; padding: 24px; background: #fff7ef; border: 1px solid #ffd9b8; border-radius: 14px; text-align: center; }
.spc-article-cta p { margin: 0 0 14px; font-weight: 600; }
.spc-article-cta .spc-btn { display: inline-block; background: var(--spc-primary); color: #fff; padding: 12px 24px; border-radius: 10px; font-weight: 700; }
.spc-article-cta .spc-btn:hover { background: #ea580c; text-decoration: none; }

/* ============ GÖRSEL CİLA ============ */

/* Hero altı güven şeridi */
.spc-trust { background: #fff; border-bottom: 1px solid var(--spc-border); }
.spc-trust .container { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; padding: 16px; }
.spc-trust-item { display: flex; align-items: center; gap: 12px; }
.spc-trust-ic { font-size: 1.55rem; line-height: 1; flex: 0 0 auto; }
.spc-trust-item strong { display: block; font-size: .9rem; color: var(--spc-primary-dark); }
.spc-trust-item small { color: var(--spc-muted); font-size: .78rem; }

/* Neden Biz (anasayfa) */
/* ===== Güvence bloğu — 1992 / HK Birlik Otomotiv (koyu premium) ===== */
.spc-guarantee { background: linear-gradient(150deg, #14202b 0%, #1b2c3b 60%, #20344a 100%); color: #fff; padding: 54px 0; }
.spc-guarantee-grid { display: grid; grid-template-columns: 0.95fr 1.15fr; gap: 48px; align-items: center; }
.spc-guarantee-eyebrow { color: #fb923c; font-weight: 800; letter-spacing: .14em; font-size: .8rem; }
.spc-guarantee-intro h2 { font-size: 2.05rem; line-height: 1.15; margin: 12px 0 14px; font-weight: 800; }
.spc-guarantee-intro h2 b { color: #fb923c; }
.spc-guarantee-intro p { color: #a8b7c6; font-size: 1rem; line-height: 1.6; margin: 0 0 22px; max-width: 440px; }
.spc-guarantee-cta { display: inline-flex; align-items: center; gap: 8px; background: var(--spc-primary); color: #fff; font-weight: 700; padding: 12px 22px; border-radius: 10px; text-decoration: none; }
.spc-guarantee-cta:hover { background: #ea580c; color: #fff; text-decoration: none; }
.spc-guarantee-points { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.spc-guarantee-pt { display: flex; gap: 13px; align-items: flex-start; background: rgba(255, 255, 255, .045); border: 1px solid rgba(255, 255, 255, .09); border-radius: 14px; padding: 16px; }
.spc-guarantee-ic { flex: 0 0 auto; width: 42px; height: 42px; border-radius: 11px; background: rgba(249, 115, 22, .16); color: #fb923c; display: inline-flex; align-items: center; justify-content: center; }
.spc-guarantee-ic .ic, .spc-guarantee-ic svg { width: 22px; height: 22px; }
.spc-guarantee-pt strong { display: block; font-size: 1rem; margin-bottom: 3px; }
.spc-guarantee-pt small { color: #9fb0c0; font-size: .83rem; line-height: 1.4; }

/* ===== Neden Biz — birleşik (başlık + sayı şeridi + özellik satırları) ===== */
.spc-why { padding: 54px 0 46px; background: #fff; }
.spc-why-head { text-align: center; max-width: 620px; margin: 0 auto 30px; }
.spc-why-eyebrow { color: var(--spc-primary); font-weight: 800; font-size: .8rem; letter-spacing: .14em; }
.spc-why-head h2 { font-size: 1.95rem; margin: 8px 0 8px; color: var(--spc-primary-dark); letter-spacing: -.01em; }
.spc-why-head p { color: var(--spc-muted); line-height: 1.55; margin: 0; }
.spc-why-stats { display: grid; grid-template-columns: repeat(4, 1fr); background: var(--spc-bg); border: 1px solid var(--spc-border); border-radius: 16px; overflow: hidden; margin-bottom: 34px; }
.spc-why-stat { padding: 22px 16px; text-align: center; border-left: 1px solid var(--spc-border); }
.spc-why-stat:first-child { border-left: 0; }
.spc-why-stat b { display: block; font-size: 1.7rem; font-weight: 800; color: var(--spc-primary-dark); }
.spc-why-stat span { color: var(--spc-muted); font-size: .82rem; }
.spc-why-feats { display: grid; grid-template-columns: 1fr 1fr; gap: 0 46px; }
.spc-why-row { display: flex; gap: 15px; align-items: flex-start; padding: 18px 0; border-top: 1px solid var(--spc-border); }
.spc-why-feats .spc-why-row:nth-child(1), .spc-why-feats .spc-why-row:nth-child(2) { border-top: 0; }
.spc-why-ic { flex: 0 0 auto; width: 44px; height: 44px; border-radius: 12px; background: linear-gradient(135deg, #fff2e8, #ffe0cc); color: var(--spc-primary); display: inline-flex; align-items: center; justify-content: center; }
.spc-why-ic .ic, .spc-why-ic svg { width: 22px; height: 22px; }
.spc-why-row strong { display: block; font-size: 1.04rem; color: var(--spc-primary-dark); margin-bottom: 3px; }
.spc-why-row small { color: var(--spc-muted); font-size: .87rem; line-height: 1.45; }
@media (max-width: 900px) {
  .spc-guarantee-grid { grid-template-columns: 1fr; gap: 28px; }
  .spc-guarantee { padding: 40px 0; }
  .spc-why { padding: 40px 0 34px; }
}
@media (max-width: 640px) {
  .spc-guarantee-points { grid-template-columns: 1fr; }
  .spc-why-stats { grid-template-columns: 1fr 1fr; }
  .spc-why-stat:nth-child(3) { border-left: 0; }
  .spc-why-stat:nth-child(-n+2) { border-bottom: 1px solid var(--spc-border); }
  .spc-why-feats { grid-template-columns: 1fr; }
  .spc-why-feats .spc-why-row:nth-child(2) { border-top: 1px solid var(--spc-border); }
}

/* Sabit (floating) WhatsApp butonu */
.spc-wafloat { position: fixed; right: 20px; bottom: 20px; z-index: 90; display: inline-flex; align-items: center; gap: 9px; background: #25d366; color: #fff; padding: 12px 18px; border-radius: 30px; box-shadow: 0 8px 24px rgba(37,211,102,.45); font-weight: 700; font-size: .95rem; transition: transform .15s, background .15s; }
.spc-wafloat:hover { background: #1ebe5a; color: #fff; text-decoration: none; transform: translateY(-2px); }
.spc-wafloat .ic, .spc-wafloat svg { width: 24px; height: 24px; }
@media (max-width: 700px) { .spc-wafloat { right: 14px; bottom: 14px; padding: 14px; } .spc-wafloat-txt { display: none; } }
@media (max-width: 820px) { .spc-trust .container { grid-template-columns: 1fr 1fr; } }

/* Bölüm/slider başlıklarına turuncu vurgu çizgisi */
.spc-slider-head h2 { position: relative; padding-left: 14px; }
.spc-slider-head h2::before {
  content: ""; position: absolute; left: 0; top: 3px; bottom: 3px; width: 5px;
  border-radius: 3px; background: linear-gradient(var(--spc-primary), var(--spc-accent));
}
.spc-slider-sub { padding-left: 14px; }

/* Kart cilası: daha yumuşak, premium */
.spc-card { box-shadow: 0 1px 2px rgba(16,24,40,.04); }
.spc-card:hover { box-shadow: 0 14px 34px rgba(16,24,40,.14); }
.spc-card-img { background: linear-gradient(160deg, #fbfcfe 0%, #eef2f7 100%); }
.spc-price { letter-spacing: -.02em; }
.spc-card-cta {
  background: #fff1e3; border-radius: 999px; padding: 4px 12px; transition: background .15s, color .15s;
}
.spc-card:hover .spc-card-cta { background: var(--spc-primary); color: #fff; }

/* Kart güven rozetleri */
.spc-card-badges { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 2px; }
.spc-card-badge {
  font-size: .68rem; font-weight: 600; color: #5b6675; background: #f3f5f9;
  border-radius: 6px; padding: 3px 8px; display: inline-flex; align-items: center; gap: 4px;
}

/* Hero cila */
.spc-vehicle-panel { box-shadow: 0 8px 24px rgba(16,24,40,.08); border-radius: 16px; }
.spc-promo { box-shadow: 0 12px 34px rgba(249,115,22,.22); border-radius: 16px; position: relative; overflow: hidden; }
.spc-promo::after {
  content: ""; position: absolute; right: -60px; top: -60px; width: 260px; height: 260px;
  background: radial-gradient(circle, rgba(255,255,255,.18) 0%, transparent 70%); pointer-events: none;
}
.spc-promo h2 { font-size: 2.15rem; letter-spacing: -.02em; }

/* Slider okları biraz daha belirgin */
.spc-slider-btn { box-shadow: 0 2px 6px rgba(16,24,40,.08); }

/* ============ PROFESYONEL TASARIM KATMANI ============ */
:root {
  --spc-shadow-sm: 0 1px 2px rgba(16,24,40,.05);
  --spc-shadow-md: 0 6px 20px rgba(16,24,40,.08);
  --spc-shadow-lg: 0 18px 44px rgba(16,24,40,.13);
}

body {
  font-family: "Inter", "Segoe UI", system-ui, -apple-system, Roboto, Arial, sans-serif;
  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}
h1, h2, h3 { letter-spacing: -.021em; }

/* İkon temel: metinle ölçeklenir */
.ic { width: 1em; height: 1em; display: inline-block; vertical-align: -0.14em; flex: 0 0 auto; }

/* Sticky, cilalı header — mobilde de sabit kalır (arama hep erişilebilir).
   Açılan mega mobilde absolute overlay olduğu için sticky header'ı şişirmez (kaydırma takılmaz). */
.spc-header { box-shadow: 0 1px 0 rgba(16,24,40,.06); }
/* Üst blok (header + arama + araç markaları) birlikte sabit kalsın (masaüstü) */
@media (min-width: 821px) {
  .spc-topbar { position: sticky; top: 0; z-index: 200; }
  .spc-mainnav { box-shadow: 0 6px 18px rgba(16, 24, 40, .12); }
}
/* Mobil: header (logo + arama) sabit; alttaki nav sütun olduğu için onu sabitlemeyiz */
@media (max-width: 820px) { .spc-header { position: sticky; top: 0; z-index: 200; } }

/* Logo: dişli ikon + wordmark */
.spc-logo-mark { display: inline-flex; align-items: center; justify-content: center; font-size: 1.25rem; padding: 8px; border-radius: 10px; }
.spc-logo-text { letter-spacing: -.03em; font-weight: 800; }

/* Arama: leading ikon + yumuşak çerçeve */
.spc-search { position: relative; box-shadow: var(--spc-shadow-sm); border-radius: 10px; }
.spc-search-ic { position: absolute; left: 14px; top: 50%; transform: translateY(-50%); font-size: 19px; color: var(--spc-muted); z-index: 1; pointer-events: none; }
.spc-search input {
  border: 1.5px solid var(--spc-border); border-right: none; border-radius: 10px 0 0 10px;
  padding: 12px 16px 12px 44px;
}
.spc-search input:focus { border-color: var(--spc-primary); }
.spc-search button { border-radius: 0 10px 10px 0; }
/* Mobil: buton gizli — input dort tarafi kapali yuvarlak kutu olsun (sag kenar acik kalmasin) */
@media (max-width: 820px) {
  .spc-search input { border: 1.5px solid var(--spc-border); border-radius: 10px; }
}

/* İletişim: telefon ikon rozeti + WhatsApp ikon */
.spc-phone { display: flex; flex-direction: row; align-items: center; gap: 9px; }
.spc-phone-ic {
  width: 36px; height: 36px; border-radius: 50%; background: #fff1e3; color: var(--spc-primary);
  display: inline-flex; align-items: center; justify-content: center; font-size: 17px; flex: 0 0 auto;
}
.spc-phone-txt { display: flex; flex-direction: column; line-height: 1.12; }
.spc-wa { display: inline-flex; align-items: center; gap: 7px; font-size: 17px; }
.spc-wa span { font-size: .92rem; }

/* Kategori butonu ikonu */
.spc-catbtn-icon { display: inline-flex; font-size: 17px; }

/* Trust şeridi: kare ikon rozetleri */
.spc-trust .container { padding: 20px 16px; }
.spc-trust-ic {
  width: 46px; height: 46px; border-radius: 13px; background: #fff1e3; color: var(--spc-primary);
  display: inline-flex; align-items: center; justify-content: center; font-size: 22px;
}
.spc-trust-item strong { font-weight: 700; }

/* Kart rozet ikonları */
.spc-card-badge { gap: 5px; }
.spc-card-badge .ic { font-size: 12px; color: var(--spc-primary); }

/* Slider okları: ikon */
.spc-slider-btn { font-size: 17px; }
.spc-slider-btn .ic { width: 18px; height: 18px; }

/* Başlık ölçeği */
.spc-slider-head h2 { font-size: 1.4rem; font-weight: 800; }
.spc-cathead h1 { font-weight: 800; }

/* Kart tipografi rafine */
.spc-card-brand { font-weight: 700; }
.spc-card-name { font-weight: 600; }

/* Bölüm ritmi: vitrinler beyaz zeminde */
.spc-showcase { background: #fff; border-top: 1px solid var(--spc-border); }

/* ---------- Hero promo slider ---------- */
.spc-heroslider { padding: 0; overflow: hidden; min-height: 340px; }
.spc-heroslide {
  position: absolute; inset: 0; padding: 44px; display: flex; flex-direction: column; justify-content: center;
  opacity: 0; transition: opacity .6s ease; pointer-events: none;
}
.spc-heroslide.is-active { opacity: 1; pointer-events: auto; }
/* Banner'ın tamamı tıklanabilir (kapak link); buton/metin üstte kalır */
.spc-heroslide-cover { position: absolute; inset: 0; z-index: 1; }
.spc-heroslide:has(.spc-heroslide-cover) { cursor: pointer; }
.spc-heroslide-text { position: relative; z-index: 2; }
.spc-heroslide--1 { background: linear-gradient(135deg, var(--spc-primary) 0%, var(--spc-primary-dark) 100%); }
.spc-heroslide--2 { background: linear-gradient(135deg, #14202b 0%, #2b3a4d 100%); }
.spc-heroslide--3 { background: linear-gradient(135deg, #ea580c 0%, #f59e0b 100%); }
.spc-heroslide h2 { margin: 0 0 12px; font-size: 2.05rem; letter-spacing: -.02em; color: #fff; }
.spc-heroslide p { margin: 0 0 22px; font-size: 1.06rem; opacity: .95; max-width: 560px; line-height: 1.6; }
.spc-heroslide .spc-btn { align-self: flex-start; padding: 12px 26px; border-radius: 10px; font-weight: 700; background: var(--spc-accent); color: #fff; }
.spc-heroslide--3 .spc-btn { background: #fff; color: var(--spc-primary-dark); }
.spc-heroslide .spc-btn:hover { text-decoration: none; filter: brightness(1.06); }
.spc-heroslider-dots { position: absolute; bottom: 18px; left: 44px; display: flex; gap: 8px; z-index: 3; }
.spc-heroslider-dots button { width: 9px; height: 9px; border-radius: 50%; border: none; background: rgba(255,255,255,.45); cursor: pointer; padding: 0; transition: width .2s, background .2s; }
.spc-heroslider-dots button.is-active { background: #fff; width: 26px; border-radius: 5px; }
@media (max-width: 900px) { .spc-heroslider { min-height: 300px; } .spc-heroslide { padding: 32px; } }

/* ---------- Hakkımızda ---------- */
.spc-about { max-width: 900px; margin: 0 auto; }
.spc-about-lead p { font-size: 1.06rem; line-height: 1.8; color: var(--spc-text); margin: 0 0 16px; }
.spc-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin: 32px 0; }
.spc-stat { background: #fff; border: 1px solid var(--spc-border); border-radius: 14px; padding: 22px 16px; text-align: center; box-shadow: var(--spc-shadow-sm); }
.spc-stat-num { display: block; font-size: 2rem; font-weight: 800; color: var(--spc-primary); letter-spacing: -.02em; }
.spc-stat-lbl { font-size: .84rem; color: var(--spc-muted); font-weight: 600; }
.spc-about-h2 { margin: 8px 0 18px; font-size: 1.5rem; }
.spc-valuegrid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; }
.spc-value { background: #fff; border: 1px solid var(--spc-border); border-radius: 14px; padding: 22px; }
.spc-value-ic { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; border-radius: 13px; background: #fff1e3; color: var(--spc-primary); font-size: 22px; margin-bottom: 12px; }
.spc-value strong { display: block; font-size: 1.05rem; margin-bottom: 6px; }
.spc-value p { margin: 0; color: var(--spc-muted); font-size: .92rem; line-height: 1.6; }
.spc-about-mv { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin: 28px 0; }
.spc-about-mv > div { background: #f8fafc; border: 1px solid var(--spc-border); border-radius: 14px; padding: 22px; }
.spc-about-mv h3 { font-size: 1.15rem; margin: 0 0 8px; color: var(--spc-primary-dark); }
.spc-about-mv p { margin: 0; color: var(--spc-text); line-height: 1.7; }
@media (max-width: 760px) { .spc-stats { grid-template-columns: 1fr 1fr; } .spc-valuegrid, .spc-about-mv { grid-template-columns: 1fr; } }

/* ============ Hakkımızda — kurumsal tasarım ============ */
.spc-ab-hero { position: relative; background: linear-gradient(150deg, #111c26 0%, #18293a 55%, #1f3850 100%); color: #fff; padding: 66px 0 60px; overflow: hidden; }
.spc-ab-hero::after { content: ""; position: absolute; right: -120px; top: -120px; width: 420px; height: 420px; border-radius: 50%; background: radial-gradient(circle, rgba(249, 115, 22, .22), transparent 62%); }
.spc-ab-bc { color: #8ea3b6; font-size: .85rem; margin-bottom: 16px; position: relative; z-index: 1; }
.spc-ab-bc a { color: #8ea3b6; }
.spc-ab-eyebrow { color: #fb923c; font-weight: 800; letter-spacing: .18em; font-size: .78rem; position: relative; z-index: 1; }
.spc-ab-hero h1 { font-size: 2.5rem; line-height: 1.12; margin: 12px 0 16px; font-weight: 800; max-width: 760px; position: relative; z-index: 1; }
.spc-ab-hero > .container > p { color: #b4c2d0; font-size: 1.08rem; max-width: 600px; margin: 0 0 30px; position: relative; z-index: 1; }
.spc-ab-herostats { display: flex; flex-wrap: wrap; gap: 36px; position: relative; z-index: 1; }
.spc-ab-hs b { display: block; font-size: 1.85rem; font-weight: 800; color: #fff; line-height: 1; }
.spc-ab-hs span { color: #9fb0c0; font-size: .82rem; }

.spc-ab-sec-eyebrow { color: var(--spc-primary); font-weight: 800; letter-spacing: .14em; font-size: .78rem; }
.spc-ab-story { padding: 62px 0; }
.spc-ab-story-grid { display: grid; grid-template-columns: 1.25fr 0.9fr; gap: 50px; align-items: start; }
.spc-ab-story h2 { font-size: 1.9rem; margin: 8px 0 18px; color: var(--spc-primary-dark); font-weight: 800; }
.spc-ab-story p { color: #48566a; margin: 0 0 16px; font-size: 1.02rem; line-height: 1.7; }
.spc-ab-kunye { background: var(--spc-primary-dark); color: #fff; border-radius: 18px; padding: 28px 26px; }
.spc-ab-kunye h3 { margin: 0 0 4px; font-size: 1.15rem; }
.spc-ab-kunye-sub { color: #8ea3b6; font-size: .85rem; margin: 0 0 16px; }
.spc-ab-krow { display: flex; gap: 12px; padding: 13px 0; border-top: 1px solid rgba(255, 255, 255, .1); }
.spc-ab-krow:first-of-type { border-top: 0; }
.spc-ab-kic { flex: 0 0 auto; width: 34px; height: 34px; border-radius: 9px; background: rgba(249, 115, 22, .16); color: #fb923c; display: inline-flex; align-items: center; justify-content: center; }
.spc-ab-kic .ic, .spc-ab-kic svg { width: 18px; height: 18px; }
.spc-ab-krow small { display: block; color: #8ea3b6; font-size: .72rem; text-transform: uppercase; letter-spacing: .06em; }
.spc-ab-krow b { font-size: .94rem; font-weight: 600; }
.spc-ab-krow b a { color: #fff; }

.spc-ab-tl { background: var(--spc-bg); padding: 58px 0; border-top: 1px solid var(--spc-border); border-bottom: 1px solid var(--spc-border); }
.spc-ab-tl-head { text-align: center; margin-bottom: 36px; }
.spc-ab-tl-head h2 { font-size: 1.8rem; margin: 8px 0 0; color: var(--spc-primary-dark); font-weight: 800; }
.spc-ab-tl-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 22px; }
.spc-ab-tl-item { position: relative; padding-top: 26px; }
.spc-ab-tl-item::before { content: ""; position: absolute; top: 6px; left: 0; right: 0; height: 2px; background: var(--spc-border); }
.spc-ab-tl-item::after { content: ""; position: absolute; top: 1px; left: 0; width: 12px; height: 12px; border-radius: 50%; background: var(--spc-primary); border: 3px solid var(--spc-bg); box-shadow: 0 0 0 1px var(--spc-border); }
.spc-ab-tl-year { font-size: 1.35rem; font-weight: 800; color: var(--spc-primary); }
.spc-ab-tl-item strong { display: block; margin: 6px 0 5px; color: var(--spc-primary-dark); font-size: 1rem; }
.spc-ab-tl-item p { margin: 0; color: var(--spc-muted); font-size: .9rem; line-height: 1.5; }

.spc-ab-vals { padding: 60px 0; }
.spc-ab-vals-head { text-align: center; margin-bottom: 32px; }
.spc-ab-vals-head h2 { font-size: 1.8rem; margin: 8px 0 0; color: var(--spc-primary-dark); font-weight: 800; }
.spc-ab-vals-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.spc-ab-val { background: #fff; border: 1px solid var(--spc-border); border-radius: 16px; padding: 26px 22px; transition: box-shadow .16s, transform .16s; }
.spc-ab-val:hover { box-shadow: 0 12px 30px rgba(28, 39, 51, .09); transform: translateY(-3px); }
.spc-ab-val-ic { width: 50px; height: 50px; border-radius: 14px; background: linear-gradient(135deg, #fff2e8, #ffe0cc); color: var(--spc-primary); display: inline-flex; align-items: center; justify-content: center; margin-bottom: 15px; }
.spc-ab-val-ic .ic, .spc-ab-val-ic svg { width: 24px; height: 24px; }
.spc-ab-val strong { display: block; font-size: 1.05rem; color: var(--spc-primary-dark); margin-bottom: 7px; }
.spc-ab-val p { margin: 0; color: var(--spc-muted); font-size: .9rem; line-height: 1.55; }

.spc-ab-mv { background: var(--spc-bg); padding: 54px 0; border-top: 1px solid var(--spc-border); }
.spc-ab-mv-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.spc-ab-mv-card { background: #fff; border: 1px solid var(--spc-border); border-radius: 16px; padding: 30px; }
.spc-ab-mv-ic { width: 46px; height: 46px; border-radius: 12px; background: linear-gradient(135deg, #fff2e8, #ffe0cc); color: var(--spc-primary); display: inline-flex; align-items: center; justify-content: center; margin-bottom: 14px; }
.spc-ab-mv-ic .ic, .spc-ab-mv-ic svg { width: 24px; height: 24px; }
.spc-ab-mv-card h3 { margin: 0 0 10px; font-size: 1.25rem; color: var(--spc-primary-dark); }
.spc-ab-mv-card p { margin: 0; color: #48566a; line-height: 1.7; }

.spc-ab-hk { padding: 58px 0; }
.spc-ab-hk-band { background: linear-gradient(150deg, #14202b, #1d2c3a); color: #fff; border-radius: 20px; padding: 46px 40px; text-align: center; position: relative; overflow: hidden; }
.spc-ab-hk-band::after { content: ""; position: absolute; left: -100px; bottom: -120px; width: 360px; height: 360px; border-radius: 50%; background: radial-gradient(circle, rgba(249, 115, 22, .16), transparent 60%); }
.spc-ab-hk-badge { display: inline-block; font-weight: 800; letter-spacing: .16em; font-size: .76rem; color: #fb923c; margin-bottom: 12px; position: relative; z-index: 1; }
.spc-ab-hk-band h2 { color: #fff; font-size: 1.7rem; margin: 0 0 12px; position: relative; z-index: 1; }
.spc-ab-hk-band p { color: #a8b7c6; max-width: 620px; margin: 0 auto 24px; line-height: 1.7; position: relative; z-index: 1; }
.spc-ab-hk-band p strong { color: #fff; }
.spc-ab-hk-cta { display: inline-flex; align-items: center; gap: 9px; background: var(--spc-primary); color: #fff; font-weight: 700; padding: 14px 28px; border-radius: 10px; text-decoration: none; position: relative; z-index: 1; transition: background .15s, transform .15s; }
.spc-ab-hk-cta:hover { background: #ea580c; color: #fff; text-decoration: none; transform: translateY(-2px); }
.spc-ab-hk-cta .ic, .spc-ab-hk-cta svg { width: 20px; height: 20px; }

.spc-ab-final { background: var(--spc-primary-dark); color: #fff; padding: 50px 0; text-align: center; }
.spc-ab-final h2 { font-size: 1.6rem; margin: 0 0 10px; }
.spc-ab-final p { color: #a8b7c6; margin: 0 0 22px; }
.spc-ab-final-btn { display: inline-flex; gap: 9px; align-items: center; background: var(--spc-primary); color: #fff; font-weight: 700; padding: 14px 30px; border-radius: 10px; text-decoration: none; }
.spc-ab-final-btn:hover { background: #ea580c; color: #fff; text-decoration: none; }

@media (max-width: 860px) {
  .spc-ab-hero h1 { font-size: 2rem; }
  .spc-ab-story-grid, .spc-ab-mv-grid { grid-template-columns: 1fr; }
  .spc-ab-tl-grid, .spc-ab-vals-grid { grid-template-columns: 1fr 1fr; }
  .spc-ab-tl-item::before { display: none; }
}
@media (max-width: 520px) {
  .spc-ab-tl-grid, .spc-ab-vals-grid { grid-template-columns: 1fr; }
  .spc-ab-herostats { gap: 22px; }
}

/* ---------- İletişim ---------- */
.spc-contactx { display: grid; grid-template-columns: 1fr 1.1fr; gap: 24px; align-items: start; }
.spc-contactx-info { display: flex; flex-direction: column; gap: 12px; }
.spc-contactx-card { display: flex; align-items: center; gap: 14px; background: #fff; border: 1px solid var(--spc-border); border-radius: 14px; padding: 16px 18px; box-shadow: var(--spc-shadow-sm); transition: box-shadow .15s, transform .15s, border-color .15s; }
a.spc-contactx-card:hover { box-shadow: var(--spc-shadow-md); transform: translateY(-2px); border-color: #ffd9b8; text-decoration: none; }
.spc-contactx-ic { flex: 0 0 auto; width: 48px; height: 48px; border-radius: 13px; background: #fff1e3; color: var(--spc-primary); display: inline-flex; align-items: center; justify-content: center; font-size: 22px; }
.spc-contactx-wa .spc-contactx-ic { background: #e7f9ee; color: #16a34a; }
.spc-contactx-txt { display: flex; flex-direction: column; line-height: 1.32; min-width: 0; }
.spc-contactx-txt small { font-size: .72rem; text-transform: uppercase; letter-spacing: .04em; color: var(--spc-muted); font-weight: 700; }
.spc-contactx-txt strong { font-size: 1.02rem; color: var(--spc-primary-dark); word-break: break-word; }
.spc-contactx-txt em { font-style: normal; font-size: .82rem; color: var(--spc-muted); }
.spc-hours { background: var(--spc-primary-dark); color: #fff; border-radius: 14px; padding: 18px 20px; margin-top: 4px; }
.spc-hours > strong { display: block; margin-bottom: 8px; }
.spc-hours-row { display: flex; justify-content: space-between; padding: 7px 0; border-top: 1px solid rgba(255,255,255,.12); font-size: .9rem; }
.spc-hours-row span:last-child { color: #ffd9b8; font-weight: 600; }
.spc-contactx-map { border-radius: 16px; overflow: hidden; border: 1px solid var(--spc-border); box-shadow: var(--spc-shadow-md); min-height: 440px; }
.spc-contactx-map iframe { width: 100%; height: 100%; min-height: 440px; border: 0; display: block; }
.spc-contactx-cta { margin-top: 24px; background: linear-gradient(135deg, var(--spc-primary) 0%, var(--spc-primary-dark) 100%); color: #fff; border-radius: 16px; padding: 26px 30px; display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap; box-shadow: var(--spc-shadow-md); }
.spc-contactx-cta strong { font-size: 1.2rem; display: block; }
.spc-contactx-cta p { margin: 4px 0 0; opacity: .92; max-width: 520px; }
.spc-contactx-cta-btns { display: flex; gap: 12px; }
.spc-btn-call, .spc-btn-wa { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 12px 22px; border-radius: 10px; font-weight: 700; font-size: 1rem; }
.spc-btn-call { background: #fff; color: var(--spc-primary-dark); }
.spc-btn-wa { background: #25d366; color: #fff; }
.spc-btn-call:hover, .spc-btn-wa:hover { text-decoration: none; filter: brightness(1.05); }
@media (max-width: 820px) { .spc-contactx { grid-template-columns: 1fr; } .spc-contactx-map, .spc-contactx-map iframe { min-height: 320px; } }

/* Slider sürükle-kaydır (grab & drag) */
.spc-slider { cursor: grab; }
.spc-slider.is-dragging { cursor: grabbing; user-select: none; scroll-behavior: auto; }
.spc-slider.is-dragging a { pointer-events: none; }
.spc-slider img { -webkit-user-drag: none; user-select: none; }
/* Hero biraz daha ferah (basık durmasın) */
.spc-heroslider { min-height: 380px; }

/* Harita linki */
.spc-map-link { display: inline-block; margin-top: 12px; font-weight: 700; color: var(--spc-primary); font-size: .9rem; }
.spc-map-link:hover { color: #ea580c; }

/* ============ ÜRÜN DETAY 2.0 ============ */
.spc-pd { display: grid; grid-template-columns: 440px 1fr; gap: 32px; padding: 8px 0 8px; align-items: start; }

/* Galeri */
.spc-pd-gallery { position: sticky; top: 96px; }
.spc-pd-main { position: relative; background: linear-gradient(160deg,#fbfcfe,#eef2f7); border: 1px solid var(--spc-border); border-radius: 16px; aspect-ratio: 1; display: flex; align-items: center; justify-content: center; padding: 28px; }
/* Ana görsel sağ/sol ok */
.spc-pd-nav { position: absolute; top: 50%; transform: translateY(-50%); z-index: 3; width: 42px; height: 42px; border-radius: 50%; background: rgba(255,255,255,.92); border: 1px solid var(--spc-border); color: var(--spc-primary-dark); font-size: 1.7rem; line-height: 1; display: flex; align-items: center; justify-content: center; cursor: pointer; box-shadow: 0 2px 10px rgba(16,24,40,.14); transition: background .15s, transform .15s; }
.spc-pd-nav:hover { background: #fff; }
.spc-pd-prev { left: 12px; }
.spc-pd-next { right: 12px; }
.spc-pd-prev:hover { transform: translateY(-50%) scale(1.06); }
.spc-pd-next:hover { transform: translateY(-50%) scale(1.06); }
.spc-pd-main img { max-width: 100%; max-height: 100%; object-fit: contain; }
.spc-pd-noimg { font-size: 4rem; color: #c2cbd8; }
.spc-pd-main .spc-card-stock { top: 14px; left: 14px; }

/* Bilgi + CTA */
.spc-pd-brandrow { display: flex; align-items: center; gap: 10px; margin-bottom: 6px; }
.spc-pd-brand { font-weight: 800; color: var(--spc-primary); text-transform: uppercase; letter-spacing: .04em; font-size: .82rem; }
.spc-pd-cat { font-size: .82rem; color: var(--spc-muted); }
.spc-pd-info h1 { font-size: 1.55rem; margin: 2px 0 12px; line-height: 1.3; }
.spc-pd-meta { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
.spc-pd-pricebox { background: #f8fafc; border: 1px solid var(--spc-border); border-radius: 14px; padding: 22px 24px; margin-bottom: 20px; }
.spc-pd-price { font-size: 2.25rem; font-weight: 800; color: var(--spc-primary-dark); letter-spacing: -.02em; line-height: 1.1; }
.spc-pd-price-ask { font-size: 1.4rem; color: var(--spc-primary); }
.spc-pd-pricebar { display: flex; align-items: center; gap: 14px; margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--spc-border); flex-wrap: wrap; }
.spc-pd-pricebar .spc-stock { font-size: .8rem; font-weight: 700; padding: 5px 13px; border-radius: 20px; white-space: nowrap; }
.spc-pd-pricebar .spc-stock.in { background: #e7f6ec; color: #067647; }
.spc-pd-pricebar .spc-stock.out { background: #fdeaea; color: #b42318; }
.spc-pd-freeship { display: inline-flex; align-items: center; gap: 7px; color: #067647; font-weight: 700; font-size: .95rem; }
.spc-pd-freeship svg { width: 18px; height: 18px; }
.spc-pd-freeship-hint { color: var(--spc-muted); font-size: .85rem; }

.spc-pd-cta { border: 1px solid var(--spc-border); border-radius: 14px; padding: 20px 22px; box-shadow: var(--spc-shadow-sm); }
.spc-pd-qty { display: flex; align-items: center; gap: 12px; }
.spc-pd-qty label { font-weight: 600; font-size: .9rem; }
.spc-qty { display: inline-flex; align-items: center; border: 1px solid var(--spc-border); border-radius: 10px; overflow: hidden; }
.spc-qty button { width: 40px; height: 42px; border: none; background: #f3f5f9; font-size: 1.2rem; cursor: pointer; color: var(--spc-primary-dark); }
.spc-qty button:hover { background: #fff1e3; color: var(--spc-primary); }
.spc-qty input { width: 52px; height: 42px; text-align: center; border: none; border-left: 1px solid var(--spc-border); border-right: 1px solid var(--spc-border); font-size: 1rem; font-weight: 700; }
.spc-pd-cta-btns { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.spc-pd-cta-note { margin: 12px 0 0; font-size: .8rem; color: var(--spc-muted); text-align: center; }
/* Mobil: "WhatsApp ile Sor" 2 satira dusmesin — yazi/ikon/padding kucult */
@media (max-width: 600px) {
    .spc-btn-call, .spc-btn-wa { font-size: .86rem; padding: 11px 10px; gap: 6px; white-space: nowrap; }
    .spc-btn-call .ic, .spc-btn-wa .ic { width: 16px; height: 16px; flex: none; }
    .spc-pd-cta-btns { gap: 8px; }
}
/* Cok dar ekran: yine de sigmazsa alt alta */
@media (max-width: 360px) {
    .spc-pd-cta-btns { grid-template-columns: 1fr; }
}

/* Şase (VIN) ile uygunluk doğrulama kutusu */
.spc-pd-vin { margin-top: 16px; padding: 16px; border: 1px dashed var(--spc-primary); border-radius: 12px; background: #fff8f2; }
.spc-pd-vin-head { display: flex; align-items: center; gap: 8px; color: var(--spc-primary-dark); font-size: .95rem; }
.spc-pd-vin-head .ic, .spc-pd-vin-head svg { width: 20px; height: 20px; color: var(--spc-primary); flex: none; }
.spc-pd-vin-sub { margin: 6px 0 12px; font-size: .85rem; color: var(--spc-muted); line-height: 1.5; }
.spc-pd-vin-row { display: flex; gap: 8px; flex-wrap: wrap; }
.spc-pd-vin-row input { flex: 1; min-width: 180px; padding: 11px 14px; border: 1px solid var(--spc-border); border-radius: 10px; font-size: .95rem; text-transform: uppercase; letter-spacing: .04em; font-family: inherit; }
.spc-pd-vin-row input:focus { outline: none; border-color: var(--spc-primary); box-shadow: 0 0 0 3px rgba(234,88,12,.12); }
.spc-pd-vin-row .spc-btn-wa { flex: none; }
.spc-pd-vin-note { display: block; margin-top: 8px; font-size: .78rem; color: var(--spc-muted); }
.spc-pd-vin-note.err { color: #b42318; }
.spc-pd-vin-note.ok { color: #067647; font-weight: 600; }

.spc-pd-trust { display: flex; flex-wrap: wrap; gap: 18px; margin-top: 20px; padding-top: 18px; border-top: 1px solid var(--spc-border); }
.spc-pd-trust span { display: inline-flex; align-items: center; gap: 7px; font-size: .85rem; font-weight: 600; color: var(--spc-primary-dark); }
.spc-pd-trust .ic { color: var(--spc-primary); font-size: 17px; }

/* Sekmeler */
.spc-tabs { margin: 28px 0 8px; background: #fff; border: 1px solid var(--spc-border); border-radius: 16px; overflow: hidden; }
.spc-tabbtns { display: flex; flex-wrap: wrap; gap: 2px; background: #f8fafc; border-bottom: 1px solid var(--spc-border); padding: 6px 6px 0; }
.spc-tabbtn { border: none; background: none; padding: 13px 18px; font-weight: 700; font-size: .92rem; color: var(--spc-muted); cursor: pointer; border-radius: 10px 10px 0 0; font-family: inherit; }
.spc-tabbtn:hover { color: var(--spc-primary-dark); }
.spc-tabbtn.is-active { color: var(--spc-primary); background: #fff; box-shadow: inset 0 -3px 0 var(--spc-primary); }
.spc-tabpanel { display: none; padding: 24px; }
.spc-tabpanel.is-active { display: block; }
.spc-tabpanel p { line-height: 1.8; color: var(--spc-text); margin: 0 0 14px; }
.spc-tab-lead { font-weight: 600; }
.spc-tab-h3 { font-size: 1rem; margin: 4px 0 10px; color: var(--spc-primary-dark); }
.spc-tab-note { font-size: .85rem; color: var(--spc-muted); margin-top: 14px; }

/* Uyumlu araç tablosu */
.spc-table-wrap { overflow-x: auto; }
.spc-fit-table { width: 100%; border-collapse: collapse; font-size: .9rem; }
.spc-fit-table th, .spc-fit-table td { text-align: left; padding: 11px 14px; border-bottom: 1px solid var(--spc-border); white-space: nowrap; }
.spc-fit-table thead th { background: #f8fafc; color: var(--spc-muted); font-size: .78rem; text-transform: uppercase; letter-spacing: .03em; }
.spc-fit-table tbody tr:hover { background: #fff8f2; }

/* SSS akordeon */
.spc-faq { display: flex; flex-direction: column; gap: 10px; }
.spc-faq-item { border: 1px solid var(--spc-border); border-radius: 12px; overflow: hidden; }
.spc-faq-item summary { cursor: pointer; padding: 15px 18px; font-weight: 700; font-size: .95rem; color: var(--spc-primary-dark); list-style: none; display: flex; justify-content: space-between; align-items: center; }
.spc-faq-item summary::-webkit-details-marker { display: none; }
.spc-faq-item summary::after { content: "+"; font-size: 1.3rem; color: var(--spc-primary); font-weight: 400; }
.spc-faq-item[open] summary::after { content: "−"; }
.spc-faq-item[open] summary { border-bottom: 1px solid var(--spc-border); }
.spc-faq-a { padding: 14px 18px; color: var(--spc-text); line-height: 1.7; font-size: .92rem; white-space: pre-line; }

@media (max-width: 900px) {
  .spc-pd { grid-template-columns: 1fr; }
  .spc-pd-gallery { position: static; max-width: 440px; }
}

/* Ürün galeri thumbnails + video */
.spc-pd-thumbs { display: flex; gap: 10px; margin-top: 12px; flex-wrap: wrap; }
.spc-pd-thumb { width: 64px; height: 64px; border: 1px solid var(--spc-border); border-radius: 10px; overflow: hidden; background: #fff; cursor: pointer; padding: 4px; display: flex; align-items: center; justify-content: center; }
.spc-pd-thumb:hover { border-color: #ffd9b8; }
.spc-pd-thumb.is-active { border-color: var(--spc-primary); box-shadow: 0 0 0 2px #ffd9b8; }
.spc-pd-thumb img { max-width: 100%; max-height: 100%; object-fit: contain; }
.spc-pd-thumb-video { background: var(--spc-primary-dark); color: #fff; font-size: 1.05rem; }

/* Ürün ana görseli: masaüstü hover-zoom (imleci takip eden büyütme) */
.spc-pd-main { overflow: hidden; }
.spc-pd-main.spc-zoomable { cursor: zoom-in; }
.spc-pd-main img { transition: transform .12s ease-out; will-change: transform; }
.spc-pd-zoomhint { position: absolute; bottom: 12px; right: 12px; background: rgba(15,23,32,.72); color: #fff;
  font-size: .72rem; font-weight: 600; padding: 5px 10px; border-radius: 20px; display: inline-flex; align-items: center; gap: 5px;
  pointer-events: none; opacity: .9; }

/* Görsel büyütme (lightbox): tam ekran + zoom + gezinme */
.spc-lb { position: fixed; inset: 0; z-index: 1000; display: none; align-items: center; justify-content: center; background: rgba(12,17,23,.93); }
.spc-lb.is-open { display: flex; }
.spc-lb-img { max-width: 92vw; max-height: 88vh; object-fit: contain; border-radius: 8px; cursor: zoom-in;
  transition: transform .12s ease-out; user-select: none; -webkit-user-select: none; -webkit-user-drag: none; touch-action: none; }
.spc-lb-img.is-zoomed { cursor: zoom-out; }
.spc-lb-x, .spc-lb-nav { position: absolute; border: none; background: rgba(255,255,255,.14); color: #fff; cursor: pointer;
  line-height: 1; display: flex; align-items: center; justify-content: center; transition: background .15s; }
.spc-lb-x:hover, .spc-lb-nav:hover { background: rgba(255,255,255,.28); }
.spc-lb-x { top: 16px; right: 20px; width: 44px; height: 44px; border-radius: 50%; font-size: 26px; }
.spc-lb-nav { top: 50%; transform: translateY(-50%); width: 52px; height: 52px; border-radius: 50%; font-size: 32px; }
.spc-lb-prev { left: 18px; } .spc-lb-next { right: 18px; }
.spc-lb-count { position: absolute; bottom: 20px; left: 50%; transform: translateX(-50%); color: #fff; font-size: .88rem;
  background: rgba(0,0,0,.45); padding: 4px 14px; border-radius: 20px; }
@media (max-width: 620px) { .spc-lb-nav { width: 42px; height: 42px; font-size: 26px; } .spc-lb-x { top: 10px; right: 12px; } }
.spc-pd-video { position: absolute; inset: 0; background: #000; border-radius: 16px; overflow: hidden; }
.spc-pd-video iframe { width: 100%; height: 100%; border: 0; }

/* Kategori SEO açıklama metni */
.spc-seotext { max-width: 940px; margin: 4px 0 28px; color: var(--spc-muted); line-height: 1.8; font-size: .95rem; }
.spc-seotext h2, .spc-seotext h3 { color: var(--spc-text); margin: 20px 0 8px; font-size: 1.15rem; }
.spc-seotext p { margin: 0 0 12px; }
.spc-seotext ul { padding-left: 20px; line-height: 1.9; }

/* Ayarlardan logo görseli */
.spc-logo-img { height: 46px; max-width: 300px; object-fit: contain; display: block; }
@media (max-width: 640px) { .spc-logo-img { height: 36px; max-width: 180px; } }

/* Ürün açıklaması zengin metin */
.spc-richtext { line-height: 1.8; color: var(--spc-text); }
/* Açıklama içi başlıklar kontrollü boyutta (dev H1/H2 sayfayı ezmesin; render'da zaten h4'e düşürülür) */
.spc-richtext h1, .spc-richtext h2, .spc-richtext h3, .spc-richtext h4, .spc-richtext h5, .spc-richtext h6 {
    font-size: 1.12rem; font-weight: 700; margin: 18px 0 8px; color: var(--spc-primary-dark); line-height: 1.4; }
.spc-richtext p { margin: 0 0 12px; }
.spc-richtext ul, .spc-richtext ol { padding-left: 22px; line-height: 1.9; margin: 0 0 12px; }
.spc-richtext a { color: var(--spc-primary); }

/* Hata sayfası (404/500) */
.spc-error { padding: 70px 0; text-align: center; }
.spc-error-code { font-size: 5rem; font-weight: 800; color: var(--spc-primary); letter-spacing: -.03em; line-height: 1; }
.spc-error h1 { font-size: 1.8rem; margin: 8px 0 10px; }
.spc-error p { color: var(--spc-muted); font-size: 1.05rem; margin: 0 0 24px; }
.spc-error-actions { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }
.spc-error-actions .spc-btn { background: var(--spc-primary); color: #fff; padding: 12px 24px; border-radius: 10px; font-weight: 700; }
.spc-error-actions .spc-btn-ghost2 { background: #fff; border: 1px solid var(--spc-border); color: var(--spc-text); padding: 12px 24px; border-radius: 10px; font-weight: 700; }
.spc-error-actions a:hover { text-decoration: none; }

/* ---------- Slider overlay oklar + peek ---------- */
.spc-slider-wrap { position: relative; }
.spc-slider-btn.left, .spc-slider-btn.right {
  position: absolute; top: 42%; transform: translateY(-50%); z-index: 6;
  width: 46px; height: 46px; background: #fff; box-shadow: 0 6px 18px rgba(16,24,40,.18);
}
.spc-slider-btn.left { left: -14px; }
.spc-slider-btn.right { right: -14px; }
@media (max-width: 700px) { .spc-slider-btn.left { left: 2px; } .spc-slider-btn.right { right: 2px; } }

/* ---------- Komple Motor öne çıkan banner ---------- */
.spc-motorfeature { background: linear-gradient(135deg, var(--spc-primary-dark) 0%, #23303f 100%); color: #fff; padding: 40px 0; }
.spc-motorfeature-inner { display: grid; grid-template-columns: 360px 1fr; gap: 34px; align-items: center; }
.spc-motorfeature-badge { display: inline-block; background: var(--spc-primary); color: #fff; font-size: .74rem; font-weight: 800; padding: 5px 13px; border-radius: 999px; letter-spacing: .04em; text-transform: uppercase; }
.spc-motorfeature-promo h2 { font-size: 2.2rem; margin: 14px 0 10px; color: #fff; letter-spacing: -.02em; }
.spc-motorfeature-promo p { color: #c8d2e0; line-height: 1.7; margin: 0 0 18px; }
.spc-motorfeature-list { list-style: none; padding: 0; margin: 0 0 24px; display: flex; flex-direction: column; gap: 9px; }
.spc-motorfeature-list li { display: flex; align-items: center; gap: 10px; font-weight: 600; }
.spc-motorfeature-list .ic { color: var(--spc-accent); font-size: 18px; }
.spc-motorfeature-promo .spc-btn { display: inline-block; background: var(--spc-accent); color: #fff; padding: 13px 28px; border-radius: 10px; font-weight: 700; }
.spc-motorfeature-promo .spc-btn:hover { filter: brightness(1.06); text-decoration: none; }
.spc-motorfeature-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 16px; }
@media (max-width: 980px) { .spc-motorfeature-inner { grid-template-columns: 1fr; } }

/* ============ SLIDER GÜZELLEŞTİRME ============ */
.spc-showcase { background: #fff; border-top: 1px solid var(--spc-border); padding: 30px 0; }
.spc-slider-head { align-items: center; margin-bottom: 18px; }
.spc-slider-all {
  display: inline-flex; align-items: center; gap: 4px; background: #fff1e3; color: var(--spc-primary);
  border: 1px solid #ffd9b8; border-radius: 999px; padding: 8px 16px; font-weight: 700; font-size: .85rem;
  transition: background .15s, color .15s;
}
.spc-slider-all:hover { background: var(--spc-primary); color: #fff; text-decoration: none; }

/* Kenar solması (daha var, kaydırılabilir hissi) */
.spc-slider-wrap::before, .spc-slider-wrap::after {
  content: ""; position: absolute; top: 0; bottom: 14px; width: 46px; z-index: 4; pointer-events: none;
}
.spc-slider-wrap::before { left: 0; background: linear-gradient(90deg, #fff, rgba(255,255,255,0)); }
.spc-slider-wrap::after { right: 0; background: linear-gradient(270deg, #fff, rgba(255,255,255,0)); }

/* Yumuşak snap + daha ferah kart */
.spc-slider { scroll-snap-type: x proximity; gap: 20px; padding: 4px 2px 16px; }
.spc-slider .spc-slide { flex-basis: 250px; }

/* Kart: görsel zoom + güçlü hover */
.spc-showcase .spc-card, .spc-motorfeature .spc-card { border-radius: 16px; }
.spc-card-img { overflow: hidden; }
.spc-card-img img { transition: transform .35s ease; }
.spc-card:hover .spc-card-img img { transform: scale(1.07); }
.spc-showcase .spc-card:hover, .spc-motorfeature .spc-card:hover {
  transform: translateY(-4px); box-shadow: 0 16px 36px rgba(16,24,40,.16); border-color: var(--spc-primary);
}
.spc-card-stock { backdrop-filter: saturate(1.2); }
/* Hover'da resim scale olunca rozetlerin üstünü örtmesin */
.spc-card-stock, .spc-card-type { z-index: 2; }

/* Oklar: primary tint hover */
.spc-slider-btn.left:hover, .spc-slider-btn.right:hover { background: var(--spc-primary); color: #fff; border-color: var(--spc-primary); box-shadow: 0 8px 22px rgba(249,115,22,.35); }

/* Fiyat vurgu */
.spc-showcase .spc-price, .spc-motorfeature .spc-price { font-size: 1.15rem; }

/* ============ HERO SLAYT GÖRSELLEŞTİRME ============ */
.spc-heroslide { flex-direction: row; align-items: center; gap: 28px; }
.spc-heroslide-text { display: flex; flex-direction: column; flex: 1 1 auto; min-width: 0; }
.spc-heroslide-visual {
  flex: 0 0 auto; width: 190px; height: 190px; border-radius: 50%; position: relative;
  display: flex; align-items: center; justify-content: center;
  background: radial-gradient(circle, rgba(255,255,255,.18) 0%, rgba(255,255,255,.05) 62%, transparent 72%);
}
.spc-heroslide-visual::before, .spc-heroslide-visual::after { content: ""; position: absolute; border-radius: 50%; }
.spc-heroslide-visual::before { inset: -16px; border: 2px solid rgba(255,255,255,.20); }
.spc-heroslide-visual::after { inset: -38px; border: 2px dashed rgba(255,255,255,.13); animation: spc-spin 22s linear infinite; }
.spc-heroslide-visual .ic { font-size: 94px; color: #fff; opacity: .96; filter: drop-shadow(0 8px 18px rgba(0,0,0,.28)); }
@keyframes spc-spin { to { transform: rotate(360deg); } }
@media (max-width: 760px) { .spc-heroslide-visual { display: none; } }
@media (prefers-reduced-motion: reduce) { .spc-heroslide-visual::after { animation: none; } }

/* Hero banner görsel slaytlar */
.spc-heroslide-img { background-size: cover; background-position: center right; }
.spc-heroslide-img .spc-heroslide-text { max-width: 540px; }
.spc-heroslide-img h2 { text-shadow: 0 2px 12px rgba(0,0,0,.35); }
.spc-heroslide-img p { text-shadow: 0 1px 8px rgba(0,0,0,.3); }

/* Mobil: geniş foto banner'ı TAM göster (kırpma yok) — kutuyu banner oranına yaklaştır */
@media (max-width: 900px) {
  .spc-heroslider { min-height: 0; aspect-ratio: 2.2 / 1; }
  .spc-heroslide-img { background-size: contain; background-repeat: no-repeat; background-position: center; background-color: #fbfbfb; }
  .spc-heroslide-img .spc-heroslide-text { display: none; } /* yazı görselde baskılı; overlay'i mobilde gizle */
  .spc-heroslider-dots { bottom: 8px; left: 50%; transform: translateX(-50%); }
}

/* ============================ E-TİCARET: sepet / sipariş / hesap ============================ */

/* Genel buton seti (yeni sayfalar) */
.spc-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 12px 24px; border-radius: 10px; font-weight: 700; font-size: 1rem; border: 1px solid transparent; cursor: pointer; text-align: center; transition: filter .15s, background .15s; }
.spc-btn-primary { background: var(--spc-primary); color: #fff; }
.spc-btn-primary:hover { filter: brightness(1.06); text-decoration: none; color: #fff; }
.spc-btn-ghost { background: #fff; color: var(--spc-primary-dark); border-color: var(--spc-border); }
.spc-btn-ghost:hover { background: #f6f8fb; text-decoration: none; }

/* Header: hesap + sepet */
.spc-acc, .spc-cart { display: inline-flex; align-items: center; gap: 8px; color: var(--spc-primary-dark); font-weight: 600; white-space: nowrap; }
.spc-acc .ic, .spc-cart .ic { width: 22px; height: 22px; }
.spc-acc:hover, .spc-cart:hover { color: var(--spc-primary); text-decoration: none; }
.spc-acc-txt, .spc-cart-txt { font-size: .82rem; }
.spc-cart-ic { position: relative; display: inline-flex; }
.spc-cart-badge { position: absolute; top: -8px; right: -9px; min-width: 17px; height: 17px; padding: 0 4px; border-radius: 9px; background: var(--spc-primary); color: #fff; font-size: .68rem; font-weight: 800; display: flex; align-items: center; justify-content: center; }

/* Slider sürüklenirken kart içindeki Sepete Ekle formuna yanlışlıkla basmayı engelle */
.spc-slider.is-dragging .spc-card-addform { pointer-events: none; }

/* Kırıntı + flash */
.spc-crumb { font-size: .84rem; color: var(--spc-muted); margin: 18px 0 6px; }
.spc-crumb a { color: var(--spc-muted); }
.spc-crumb a:hover { color: var(--spc-primary); }
.spc-flash { display: inline-flex; align-items: center; gap: 8px; background: #e8f7ee; color: #167a3c; border: 1px solid #b7e6c8; border-radius: 10px; padding: 10px 16px; font-weight: 600; margin: 8px 0 4px; }
.spc-flash .ic { width: 18px; height: 18px; }

/* Sepet sayfası */
.spc-cartpage { padding-bottom: 48px; }
.spc-cartpage > h1 { margin: 4px 0 20px; }
.spc-cart-empty { text-align: center; padding: 60px 20px; background: #fff; border: 1px solid var(--spc-border); border-radius: 14px; }
.spc-cart-empty-ic { display: inline-flex; color: var(--spc-primary); }
.spc-cart-empty-ic .ic { width: 54px; height: 54px; }
.spc-cart-empty h2 { margin: 12px 0 6px; }
.spc-cart-empty p { color: var(--spc-muted); max-width: 440px; margin: 0 auto 20px; }
.spc-cart-grid { display: grid; grid-template-columns: 1fr 340px; gap: 24px; align-items: start; }
.spc-cart-items { background: #fff; border: 1px solid var(--spc-border); border-radius: 14px; overflow: hidden; }
.spc-cart-item { display: grid; grid-template-columns: 84px 1fr auto auto auto; gap: 16px; align-items: center; padding: 16px; border-bottom: 1px solid var(--spc-border); }
.spc-cart-item:last-of-type { border-bottom: none; }
.spc-cart-thumb { width: 84px; height: 84px; border-radius: 10px; overflow: hidden; background: #f4f6f9; display: flex; align-items: center; justify-content: center; border: 1px solid var(--spc-border); }
.spc-cart-thumb img { width: 100%; height: 100%; object-fit: contain; }
.spc-cart-noimg { color: #c2ccd8; }
.spc-cart-noimg .ic { width: 30px; height: 30px; }
.spc-cart-info { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.spc-cart-name { font-weight: 700; color: var(--spc-primary-dark); }
.spc-cart-name:hover { color: var(--spc-primary); text-decoration: none; }
.spc-cart-meta { font-size: .8rem; color: var(--spc-muted); }
.spc-cart-unit { font-size: .84rem; color: #55617a; }
.spc-cart-ask { color: var(--spc-primary); font-weight: 700; }
.spc-stepper { display: inline-flex; align-items: center; border: 1px solid var(--spc-border); border-radius: 9px; overflow: hidden; }
.spc-stepper button { width: 32px; height: 34px; border: none; background: #f6f8fb; color: var(--spc-primary-dark); cursor: pointer; display: inline-flex; align-items: center; justify-content: center; }
.spc-stepper button:hover { background: #eef2f7; color: var(--spc-primary); }
.spc-stepper button .ic { width: 15px; height: 15px; }
.spc-stepper-val { min-width: 34px; text-align: center; font-weight: 700; }
.spc-cart-line { font-weight: 800; color: var(--spc-primary-dark); white-space: nowrap; }
.spc-cart-remove button { border: none; background: none; color: #b8c1cd; cursor: pointer; padding: 6px; display: inline-flex; }
.spc-cart-remove button:hover { color: #e0453a; }
.spc-cart-remove .ic { width: 19px; height: 19px; }
.spc-cart-clearwrap { padding: 12px 16px; }
.spc-cart-clear { border: none; background: none; color: var(--spc-muted); cursor: pointer; font-size: .84rem; }
.spc-cart-clear:hover { color: #e0453a; text-decoration: underline; }
.spc-cart-summary { background: #fff; border: 1px solid var(--spc-border); border-radius: 14px; padding: 20px; position: sticky; top: 16px; }
.spc-cart-summary h2 { margin: 0 0 14px; font-size: 1.05rem; }
.spc-cart-sumrow { display: flex; justify-content: space-between; align-items: baseline; padding: 8px 0; border-bottom: 1px dashed var(--spc-border); margin-bottom: 12px; }
.spc-cart-sumrow strong { font-size: 1.3rem; color: var(--spc-primary-dark); }
.spc-cart-note { font-size: .8rem; color: var(--spc-muted); line-height: 1.5; margin: 8px 0; }
.spc-cart-checkout { width: 100%; margin: 6px 0 8px; }
.spc-cart-summary .spc-btn-ghost { width: 100%; }
.spc-cart-alt { text-align: center; font-size: .82rem; color: var(--spc-muted); margin-top: 12px; }

/* Checkout */
.spc-checkout { padding-bottom: 48px; }
.spc-checkout > h1 { margin: 4px 0 16px; }
.spc-checkout-hint { background: #fff7ed; border: 1px solid #ffe0bd; border-radius: 10px; padding: 12px 16px; font-size: .9rem; margin-bottom: 18px; }
.spc-checkout-grid { display: grid; grid-template-columns: 1fr 360px; gap: 24px; align-items: start; }
.spc-checkout-form { background: #fff; border: 1px solid var(--spc-border); border-radius: 14px; padding: 24px; }
.spc-checkout-form h2 { margin: 0 0 16px; font-size: 1.1rem; }
.spc-field { display: flex; flex-direction: column; gap: 5px; margin-bottom: 14px; }
.spc-field label { font-weight: 600; font-size: .88rem; color: var(--spc-primary-dark); }
.spc-field input, .spc-field textarea { border: 1px solid var(--spc-border); border-radius: 9px; padding: 11px 13px; font: inherit; font-size: .95rem; width: 100%; }
.spc-field input:focus, .spc-field textarea:focus { outline: none; border-color: var(--spc-primary); box-shadow: 0 0 0 3px #fed7aa66; }
.spc-field textarea { resize: vertical; }
.spc-field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.spc-field span.field-validation-error, .spc-field span[data-valmsg-for] { color: #e0453a; font-size: .8rem; }
.spc-form-errors { background: #fdecec; border: 1px solid #f5c2c0; color: #c0362c; border-radius: 10px; padding: 10px 14px; font-size: .88rem; margin-bottom: 14px; }
.spc-form-errors ul { margin: 0; padding-left: 18px; }
.spc-checkout-submit { width: 100%; margin-top: 6px; }
.spc-checkout-terms { font-size: .8rem; color: var(--spc-muted); text-align: center; margin: 12px 0 0; }
/* Ödeme yöntemi seçici (radyo kartları) */
.spc-pay-methods { display: flex; flex-direction: column; gap: 8px; margin-top: 6px; }
.spc-pay-opt { display: flex; align-items: flex-start; gap: 10px; padding: 11px 13px; border: 1px solid var(--spc-border); border-radius: 10px; cursor: pointer; transition: border-color .15s, background .15s; }
.spc-pay-opt:hover { border-color: #ffd9b8; }
.spc-pay-opt:has(input:checked) { border-color: var(--spc-accent); background: #fff7ef; box-shadow: 0 0 0 2px rgba(230,126,34,.12); }
.spc-pay-opt input { width: auto; margin-top: 3px; }
.spc-pay-opt span { display: flex; flex-direction: column; }
.spc-pay-opt small { color: var(--spc-muted); font-size: .78rem; }

/* 3D Pay kart formu (kart sitede girilir) */
.spc-pay-wrap { max-width: 460px; margin: 0 auto; padding: 40px 16px 64px; }
.spc-pay-title { font-size: 1.4rem; text-align: center; margin: 0 0 4px; }
.spc-pay-total { text-align: center; color: var(--spc-muted); margin: 0 0 20px; }
.spc-pay-total strong { color: var(--spc-primary-dark); font-size: 1.1rem; }
.spc-pay-card { background: #fff; border: 1px solid var(--spc-border); border-radius: 14px; padding: 20px; box-shadow: 0 8px 24px rgba(15,23,42,.06); }
.spc-pay-field { margin-bottom: 14px; }
.spc-pay-field label { display: block; font-size: .82rem; font-weight: 600; color: var(--spc-primary-dark); margin-bottom: 5px; }
.spc-pay-field input, .spc-pay-field select { width: 100%; padding: 11px 12px; border: 1px solid var(--spc-border); border-radius: 9px; font-size: 1rem; box-sizing: border-box; background: #fff; }
.spc-pay-field input:focus, .spc-pay-field select:focus { outline: none; border-color: var(--spc-accent); box-shadow: 0 0 0 2px rgba(230,126,34,.15); }
.spc-pay-row { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 10px; }
.spc-pay-submit { width: 100%; margin-top: 4px; font-size: 1.02rem; }
.spc-pay-note { font-size: .78rem; color: var(--spc-muted); text-align: center; margin: 12px 0 0; line-height: 1.5; }

/* Canlı görsel kredi kartı */
.spc-cc { perspective: 1000px; width: 100%; max-width: 330px; margin: 0 auto 22px; }
.spc-cc-flip { position: relative; width: 100%; aspect-ratio: 1.586 / 1; transition: transform .55s cubic-bezier(.4,.2,.2,1); transform-style: preserve-3d; }
.spc-cc.flipped .spc-cc-flip { transform: rotateY(180deg); }
.spc-cc-face { position: absolute; inset: 0; border-radius: 14px; padding: 18px; box-sizing: border-box; color: #fff; backface-visibility: hidden; -webkit-backface-visibility: hidden; box-shadow: 0 14px 32px rgba(15,23,42,.30); overflow: hidden; }
.spc-cc-front { display: flex; flex-direction: column; justify-content: space-between; background: linear-gradient(135deg, #2b3446 0%, #171d29 100%); }
.spc-cc-back { transform: rotateY(180deg); padding: 0; background: linear-gradient(135deg, #262f3f 0%, #141a25 100%); }
.spc-cc[data-brand="visa"] .spc-cc-front { background: linear-gradient(135deg, #1a4bce 0%, #0e2870 100%); }
.spc-cc[data-brand="mc"] .spc-cc-front { background: linear-gradient(135deg, #30303a 0%, #121218 100%); }
.spc-cc[data-brand="amex"] .spc-cc-front { background: linear-gradient(135deg, #1291ad 0%, #0a5d76 100%); }
.spc-cc[data-brand="troy"] .spc-cc-front { background: linear-gradient(135deg, #0a9393 0%, #076a50 100%); }
.spc-cc-r1 { display: flex; align-items: center; justify-content: space-between; }
.spc-cc-chip { width: 42px; height: 31px; border-radius: 6px; background: linear-gradient(135deg, #f7d97a, #cfa736); box-shadow: inset 0 0 0 1px rgba(0,0,0,.18); position: relative; }
.spc-cc-chip::after { content: ""; position: absolute; inset: 6px 9px; border: 1px solid rgba(0,0,0,.28); border-radius: 3px; }
.spc-cc-brand { font-weight: 800; font-style: italic; font-size: 1.2rem; letter-spacing: .5px; text-shadow: 0 1px 2px rgba(0,0,0,.25); }
.spc-cc[data-brand="mc"] .spc-cc-brand, .spc-cc[data-brand="troy"] .spc-cc-brand { font-style: normal; }
.spc-cc-number { font-family: ui-monospace, 'Courier New', monospace; font-size: 1.3rem; letter-spacing: 2px; text-shadow: 0 1px 3px rgba(0,0,0,.3); }
.spc-cc-r3 { display: flex; align-items: flex-end; }
.spc-cc-cap { display: block; font-size: .55rem; letter-spacing: 1px; text-transform: uppercase; opacity: .7; margin-bottom: 2px; }
.spc-cc-exp { font-family: ui-monospace, 'Courier New', monospace; font-size: 1rem; }
.spc-cc-mag { height: 42px; background: #0b0e14; margin-top: 22px; }
.spc-cc-cvvrow { display: flex; align-items: center; justify-content: flex-end; gap: 10px; background: #e9edf2; color: #1a2130; margin: 14px 14px 0; padding: 8px 12px; border-radius: 5px; }
.spc-cc-cvvrow .spc-cc-cap { margin: 0; opacity: .85; }
.spc-cc-cvv { font-family: ui-monospace, 'Courier New', monospace; font-size: 1.05rem; letter-spacing: 2px; min-width: 46px; text-align: right; }
.spc-cc-brand-back { position: absolute; bottom: 12px; right: 16px; font-size: 1rem; opacity: .85; }
.spc-checkout-summary { background: #fff; border: 1px solid var(--spc-border); border-radius: 14px; padding: 20px; position: sticky; top: 16px; }
.spc-checkout-summary h2 { margin: 0 0 12px; font-size: 1.05rem; }
.spc-checkout-items, .spc-os-items { list-style: none; margin: 0 0 12px; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.spc-checkout-items li, .spc-os-items li { display: grid; grid-template-columns: auto 1fr auto; gap: 8px; align-items: baseline; font-size: .86rem; }
.spc-co-q { font-weight: 800; color: var(--spc-primary); }
.spc-co-n { min-width: 0; color: var(--spc-primary-dark); }
.spc-co-n small { display: block; color: var(--spc-muted); font-size: .76rem; }
.spc-co-p { font-weight: 700; white-space: nowrap; }
.spc-checkout-total { display: flex; justify-content: space-between; align-items: baseline; padding-top: 12px; border-top: 1px dashed var(--spc-border); }
.spc-checkout-total strong { font-size: 1.25rem; color: var(--spc-primary-dark); }
.spc-checkout-back { display: inline-block; margin-top: 12px; font-size: .85rem; }

/* Sipariş onay */
.spc-ordersuccess { max-width: 620px; margin: 0 auto; text-align: center; padding: 40px 16px 60px; }
.spc-os-badge { width: 74px; height: 74px; margin: 0 auto 18px; border-radius: 50%; background: #e8f7ee; color: #1aa34a; display: flex; align-items: center; justify-content: center; }
.spc-os-badge .ic { width: 40px; height: 40px; }
.spc-os-lead { font-size: 1.05rem; margin: 6px 0; }
.spc-os-info { color: var(--spc-muted); line-height: 1.6; margin: 0 auto 24px; max-width: 520px; }
.spc-os-card { background: #fff; border: 1px solid var(--spc-border); border-radius: 14px; padding: 22px; text-align: left; margin-bottom: 22px; }
.spc-os-card h2 { margin: 0 0 14px; font-size: 1.05rem; }
.spc-os-actions { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }

/* Auth (giriş/kayıt) */
.spc-auth { display: flex; justify-content: center; padding: 40px 16px 64px; }
.spc-authcard { width: 100%; max-width: 420px; background: #fff; border: 1px solid var(--spc-border); border-radius: 16px; padding: 32px; box-shadow: 0 8px 30px rgba(20,32,43,.06); }
.spc-authcard h1 { margin: 0 0 6px; font-size: 1.5rem; }
.spc-auth-sub { color: var(--spc-muted); font-size: .9rem; margin: 0 0 20px; }
.spc-auth-submit { width: 100%; margin-top: 8px; }
.spc-auth-alt { text-align: center; font-size: .88rem; margin: 16px 0 0; color: var(--spc-muted); }
.spc-check { display: flex; align-items: center; gap: 8px; font-size: .88rem; margin: 4px 0 6px; }
.spc-check input { width: auto; }

/* Hesabım */
.spc-account { padding: 24px 0 56px; }
.spc-account-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; flex-wrap: wrap; }
.spc-account-head h1 { margin: 0; }
.spc-account-sub { color: var(--spc-muted); font-size: .9rem; margin: 4px 0 0; }
.spc-account-h2 { margin: 26px 0 14px; font-size: 1.15rem; }
.spc-account-empty { background: #fff; border: 1px solid var(--spc-border); border-radius: 14px; padding: 40px; text-align: center; }
.spc-account-empty p { color: var(--spc-muted); margin: 0 0 16px; }
.spc-orderlist { display: flex; flex-direction: column; gap: 14px; }
.spc-orderrow { background: #fff; border: 1px solid var(--spc-border); border-radius: 14px; padding: 18px; }
.spc-order-top { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 10px; }
.spc-order-no { font-weight: 800; color: var(--spc-primary-dark); }
.spc-order-date { color: var(--spc-muted); font-size: .84rem; }
.spc-order-status { margin-left: auto; font-size: .78rem; font-weight: 700; padding: 3px 10px; border-radius: 999px; }
.spc-order-items { list-style: none; margin: 0 0 10px; padding: 0; font-size: .88rem; color: #44506a; }
.spc-order-items li { padding: 2px 0; }
.spc-order-items small { color: var(--spc-muted); }
.spc-order-foot { display: flex; align-items: baseline; gap: 10px; padding-top: 10px; border-top: 1px dashed var(--spc-border); }
.spc-order-foot strong { font-size: 1.1rem; color: var(--spc-primary-dark); }
.spc-order-foot .spc-cart-ask { font-size: .8rem; }

/* Durum rozet renkleri (hesap + admin ortak) */
.st-new { background: #fff3e0; color: #b45309; }
.st-ok { background: #e0edff; color: #1d4ed8; }
.st-ship { background: #ede9fe; color: #6d28d9; }
.st-done { background: #e8f7ee; color: #167a3c; }
.st-cancel { background: #fdecec; color: #c0362c; }

/* Ürün detay: Sepete Ekle butonu */
.spc-pd-buy { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin-bottom: 12px; }
.spc-btn-cart { display: inline-flex; align-items: center; gap: 8px; padding: 13px 26px; border-radius: 10px; border: none; background: var(--spc-primary); color: #fff; font-weight: 800; font-size: 1rem; cursor: pointer; flex: 1 1 auto; justify-content: center; min-height: 48px; }
.spc-btn-cart .ic { width: 20px; height: 20px; }
.spc-btn-cart:hover { filter: brightness(1.06); }

@media (max-width: 900px) {
    .spc-cart-grid, .spc-checkout-grid { grid-template-columns: 1fr; }
    .spc-cart-summary, .spc-checkout-summary { position: static; }
    .spc-cart-item { grid-template-columns: 64px 1fr auto; grid-template-areas: "thumb info remove" "thumb qty line"; row-gap: 10px; }
    .spc-cart-thumb { grid-area: thumb; width: 64px; height: 64px; }
    .spc-cart-info { grid-area: info; }
    .spc-stepper { grid-area: qty; }
    .spc-cart-line { grid-area: line; text-align: right; }
    .spc-cart-remove { grid-area: remove; justify-self: end; }
    .spc-field-row { grid-template-columns: 1fr; }
    .spc-acc-txt, .spc-cart-txt { display: none; }
}

/* ============================ Yasal sayfalar + çerez banner ============================ */
.spc-legal { max-width: 860px; padding-bottom: 56px; }
.spc-legal > h1 { margin: 4px 0 18px; font-size: 1.9rem; }
.spc-legal-seller { background: #f6f8fb; border: 1px solid var(--spc-border); border-radius: 12px; padding: 18px 22px; margin-bottom: 26px; }
.spc-legal-seller h2 { margin: 0 0 12px; font-size: 1.05rem; }
.spc-legal-seller dl { display: grid; grid-template-columns: 160px 1fr; gap: 6px 16px; margin: 0; }
.spc-legal-seller dt { color: var(--spc-muted); font-size: .88rem; font-weight: 600; }
.spc-legal-seller dd { margin: 0; font-size: .9rem; }
.spc-legal-body { color: #2b3646; line-height: 1.75; font-size: .96rem; }
.spc-legal-body h2 { font-size: 1.25rem; margin: 30px 0 10px; color: var(--spc-primary-dark); }
.spc-legal-body h3 { font-size: 1.05rem; margin: 22px 0 8px; color: var(--spc-primary-dark); }
.spc-legal-body p { margin: 0 0 12px; }
.spc-legal-body ul, .spc-legal-body ol { margin: 0 0 14px; padding-left: 22px; }
.spc-legal-body li { margin: 4px 0; }
.spc-legal-body strong { color: #1c2733; }
.spc-legal-body table { width: 100%; border-collapse: collapse; margin: 14px 0 18px; font-size: .9rem; }
.spc-legal-body th, .spc-legal-body td { border: 1px solid var(--spc-border); padding: 9px 12px; text-align: left; vertical-align: top; }
.spc-legal-body thead th { background: #f6f8fb; font-weight: 700; }
.spc-legal-updated { margin-top: 28px; padding-top: 14px; border-top: 1px solid var(--spc-border); color: var(--spc-muted); font-size: .82rem; }

.spc-cookie { position: fixed; left: 16px; right: 16px; bottom: 16px; max-width: 760px; margin: 0 auto; background: var(--spc-primary-dark); color: #fff; border-radius: 12px; padding: 14px 18px; display: flex; align-items: center; gap: 16px; box-shadow: 0 12px 44px rgba(0,0,0,.34); z-index: 300; flex-wrap: wrap; }
.spc-cookie p { margin: 0; font-size: .86rem; line-height: 1.5; flex: 1 1 320px; }
.spc-cookie a { color: var(--spc-accent); }
.spc-cookie .spc-btn { padding: 9px 22px; white-space: nowrap; }

.spc-checkbox { flex-direction: column; }
.spc-checkbox > label { display: flex; align-items: flex-start; gap: 9px; font-weight: 500; font-size: .9rem; cursor: pointer; }
.spc-checkbox input { width: auto; margin-top: 3px; }
.spc-checkbox a { font-weight: 600; }

/* ── Üretici sayfaları ──────────────────────────────────────── */
.spc-uret { padding: 28px 0 48px; }
.spc-crumb { font-size: .85rem; color: var(--spc-muted); margin-bottom: 18px; }
.spc-crumb a { color: var(--spc-muted); }
.spc-crumb a:hover { color: var(--spc-primary); }
.spc-crumb span { margin: 0 6px; opacity: .5; }
.spc-uret-top { margin-bottom: 24px; }
.spc-uret-top h1, .spc-uret-head-txt h1 { font-size: 1.9rem; font-weight: 800; letter-spacing: -.02em; margin: 0 0 6px; color: var(--spc-primary-dark); }
.spc-uret-top p { color: var(--spc-muted); margin: 0; }
.spc-empty { color: var(--spc-muted); padding: 30px 0; }

.spc-uret-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(158px, 1fr)); gap: 16px; }
.spc-uret-card { display: flex; flex-direction: column; align-items: center; gap: 10px; text-align: center;
  background: #fff; border: 1px solid var(--spc-border); border-radius: 14px; padding: 20px 14px;
  transition: box-shadow .15s, transform .15s, border-color .15s; }
.spc-uret-card:hover { box-shadow: var(--spc-shadow-md); transform: translateY(-3px); border-color: #ffd9b8; text-decoration: none; }
.spc-uret-logo { width: 100%; height: 60px; display: flex; align-items: center; justify-content: center; }
.spc-uret-logo img { max-width: 100%; max-height: 100%; object-fit: contain; }
.spc-uret-initial { width: 60px; height: 60px; border-radius: 14px; background: linear-gradient(135deg, var(--spc-primary), var(--spc-primary-dark));
  color: #fff; font-size: 1.7rem; font-weight: 800; display: flex; align-items: center; justify-content: center; }
.spc-uret-name { font-weight: 700; color: var(--spc-primary-dark); line-height: 1.2; }
.spc-uret-count { font-size: .78rem; color: var(--spc-muted); }

.spc-uret-head { display: flex; align-items: center; gap: 20px; margin-bottom: 26px; padding-bottom: 20px; border-bottom: 1px solid var(--spc-border); }
.spc-uret-head-logo { width: 110px; height: 80px; flex: 0 0 auto; display: flex; align-items: center; justify-content: center;
  background: #fff; border: 1px solid var(--spc-border); border-radius: 14px; padding: 12px; }
.spc-uret-head-logo img { max-width: 100%; max-height: 100%; object-fit: contain; }
.spc-uret-head-logo .spc-uret-initial { width: 100%; height: 100%; border-radius: 8px; }
.spc-uret-head-txt p { color: var(--spc-muted); margin: 0; }
@media (max-width: 560px) { .spc-uret-head-logo { width: 84px; height: 64px; } .spc-uret-top h1, .spc-uret-head-txt h1 { font-size: 1.5rem; } }

/* ── SEO başlık hiyerarşisi (H1→H6) — görsel tasarımı korur ── */
/* Ürün adı altındaki kategori + marka H2'leri küçük etiket görünümünde */
.spc-pd-brandrow { margin: 8px 0 12px; }
.spc-pd-brandrow h2 { margin: 0; font-size: .82rem; line-height: 1.3; }
.spc-pd-cat a { color: var(--spc-muted); }
.spc-pd-brand a { color: var(--spc-primary); }
.spc-pd-brandrow a:hover { text-decoration: underline; }
/* Ürün markası logosu — ürün fotoğrafının köşesinde rozet (üst-sağ): ürün + logo tek görselde */
.spc-pd-brandbadge { position: absolute; top: 12px; right: 12px; z-index: 3;
  display: inline-flex; align-items: center; justify-content: center; max-width: 46%; padding: 10px 15px;
  background: rgba(255,255,255,.97); border: 1px solid var(--spc-border); border-radius: 14px;
  box-shadow: 0 6px 18px rgba(16,24,40,.14); transition: box-shadow .18s, transform .18s; }
.spc-pd-brandbadge img { height: 38px; width: auto; max-width: 100%; object-fit: contain; display: block; }
.spc-pd-brandbadge:hover { box-shadow: 0 8px 24px rgba(16,24,40,.20); transform: translateY(-1px); text-decoration: none; }
@media (max-width: 600px) { .spc-pd-brandbadge { top: 10px; right: 10px; padding: 8px 12px; border-radius: 12px; }
  .spc-pd-brandbadge img { height: 30px; } }
/* Sekme paneli H3 başlıkları + H4 alt başlıklar */
.spc-tab-title { font-size: 1.15rem; font-weight: 800; margin: 0 0 14px; color: var(--spc-primary-dark); letter-spacing: -.01em; }
.spc-tab-h4 { font-size: 1rem; font-weight: 700; margin: 14px 0 8px; color: var(--spc-primary-dark); }
/* SSS sorusu H4 — summary içinde satır içi, mevcut görünüm korunur */
.spc-faq-item summary h4 { margin: 0; font: inherit; display: inline; }

/* Footer sosyal medya ikonları */
.spc-footer-social { display: flex; gap: 10px; margin-top: 14px; }
.spc-footer-social a { display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px;
  border-radius: 50%; background: rgba(255,255,255,.10); color: #fff; opacity: .9; transition: background .15s, opacity .15s; }
.spc-footer-social a:hover { background: var(--spc-primary); opacity: 1; text-decoration: none; }

/* Ürün sayfası paylaş butonları */
.spc-share { display: flex; align-items: center; gap: 8px; margin-top: 18px; flex-wrap: wrap; }
.spc-share-label { font-size: .85rem; color: var(--spc-muted); font-weight: 600; }
.spc-share-btn { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 6px; width: 38px; height: 38px;
  border-radius: 9px; border: 1px solid var(--spc-border); background: #fff; color: var(--spc-primary-dark); cursor: pointer;
  font-size: .85rem; font-weight: 600; transition: border-color .15s, background .15s, color .15s; }
.spc-share-btn.copy { width: auto; padding: 0 14px; }
.spc-share-btn:hover { border-color: var(--spc-primary); color: var(--spc-primary); text-decoration: none; }
.spc-share-btn.wa:hover { border-color: #25d366; color: #25d366; }
.spc-share-btn.fb:hover { border-color: #1877f2; color: #1877f2; }
.spc-share-btn.ig:hover, .spc-share-btn.ig.shared { border-color: #e1306c; color: #e1306c; }
.spc-share-btn.pin:hover { border-color: #e60023; color: #e60023; }
.spc-share-toast { position: absolute; bottom: calc(100% + 8px); left: 50%; transform: translateX(-50%);
  background: var(--spc-primary-dark); color: #fff; font-size: .72rem; font-weight: 600; white-space: nowrap;
  padding: 5px 9px; border-radius: 7px; box-shadow: 0 4px 14px rgba(0,0,0,.18); z-index: 5; pointer-events: none; }

/* Ürün etiketleri (tag) */
/* İlgili aramalar (etiketler): rafine çipler + katlanır */
.spc-pd-tags { margin-top: 20px; padding-top: 18px; border-top: 1px solid var(--spc-border); }
.spc-pd-tags-foot { margin-top: 32px; margin-bottom: 40px; }   /* sayfa dibi: Benzer Ürünler'den ayrık + iletişim barından nefes payı */
.spc-pd-tags-head { display: inline-flex; align-items: center; gap: 7px; font-size: .78rem; font-weight: 700; color: var(--spc-muted); margin-bottom: 12px; text-transform: uppercase; letter-spacing: .02em; }
.spc-pd-tags-head .ic { width: 15px; height: 15px; color: var(--spc-primary); }
.spc-pd-tags-list { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.spc-pd-tag { display: inline-flex; align-items: center; padding: 6px 13px; border-radius: 8px; background: #fff;
  border: 1px solid var(--spc-border); color: var(--spc-text); font-size: .8rem; font-weight: 500;
  transition: background .15s, color .15s, border-color .15s; }
.spc-pd-tag:hover { background: #fff7ed; border-color: var(--spc-primary); color: var(--spc-primary); text-decoration: none; }
.spc-pd-tags-list.is-collapsed .spc-pd-tag-extra { display: none; }
.spc-pd-tags-toggle { display: inline-flex; align-items: center; gap: 5px; padding: 6px 13px; border-radius: 8px;
  background: transparent; border: 1px dashed #cbd5e1; color: var(--spc-primary); font-size: .8rem; font-weight: 700;
  cursor: pointer; transition: background .15s, border-color .15s; }
.spc-pd-tags-toggle:hover { background: #fff7ed; border-color: var(--spc-primary); }
.spc-pd-tags-toggle .ic { width: 14px; height: 14px; transition: transform .2s; }
.spc-pd-tags-toggle[aria-expanded="true"] .ic { transform: rotate(180deg); }

/* OE numaraları tablosu (Muadil ve OE tabı) */
.spc-oe-count { background: #fff1e3; color: var(--spc-primary); font-size: .72rem; font-weight: 700; padding: 2px 9px; border-radius: 20px; vertical-align: middle; }
.spc-oe-search { display: flex; align-items: center; gap: 10px; border: 1.5px solid var(--spc-border); border-radius: 11px; padding: 10px 14px; margin: 4px 0 16px; color: var(--spc-muted); }
.spc-oe-search input { border: 0; outline: 0; flex: 1; font-size: .95rem; color: var(--spc-primary-dark); background: transparent; }
.spc-oe-wrap { overflow-x: auto; }
.spc-oe-table { width: 100%; border-collapse: collapse; font-size: .92rem; }
.spc-oe-table thead th { text-align: left; color: var(--spc-muted); font-size: .72rem; text-transform: uppercase; letter-spacing: .05em; font-weight: 700; padding: 0 10px 8px; border-bottom: 1px solid var(--spc-border); }
.spc-oe-table tbody td { padding: 10px; border-bottom: 1px solid #f1f5f9; }
.spc-oe-table tbody td:first-child { font-weight: 600; color: var(--spc-primary-dark); white-space: nowrap; }
.spc-oe-table tbody tr:hover { background: #f8fafc; }
.spc-oe-num { font-family: ui-monospace, Menlo, monospace; font-weight: 600; letter-spacing: .02em; width: 100%; }
.spc-oe-copy { float: right; border: 1px solid var(--spc-border); background: #fff; color: var(--spc-muted); border-radius: 7px; padding: 4px 10px; font-size: .74rem; cursor: pointer; font-weight: 600; }
.spc-oe-copy:hover { border-color: var(--spc-primary); color: var(--spc-primary); }

/* OE numaraları — üreticiye (araca) göre gruplu görünüm */
.spc-oe-groups { display: flex; flex-direction: column; gap: 16px; }
.spc-oe-group { border: 1px solid var(--spc-border); border-radius: 12px; padding: 12px 14px; }
.spc-oe-brand { display: flex; align-items: center; gap: 8px; font-weight: 700; font-size: .95rem; color: var(--spc-primary-dark); margin-bottom: 10px; }
.spc-oe-gcount { font-weight: 700; font-size: .7rem; color: var(--spc-primary); background: #fff1e3; border-radius: 20px; padding: 2px 9px; }
.spc-oe-nums { display: flex; flex-wrap: wrap; gap: 8px; }
.spc-oe-pill { font-family: ui-monospace, Menlo, monospace; font-weight: 600; font-size: .86rem; letter-spacing: .02em; color: var(--spc-primary-dark);
    background: #f8fafc; border: 1px solid var(--spc-border); border-radius: 8px; padding: 6px 11px; }
.spc-oe-noresult { color: var(--spc-muted); font-size: .92rem; padding: 8px 2px; }

/* ---- İndirim / Kampanya ---- */
/* Kart: indirim rozeti — sol üstte STOKTA'nın altında (sağ üstteki Orijinal/Muadil rozetiyle çakışmasın) */
.spc-card-disc { position: absolute; top: 40px; left: 10px; z-index: 2; background: #e11d48; color: #fff;
  font-weight: 800; font-size: .72rem; padding: 3px 9px; border-radius: 999px; letter-spacing: .02em;
  box-shadow: 0 2px 6px rgba(225,29,72,.35); }
/* Kart: eski (üzeri çizili) + indirimli fiyat */
.spc-price-wrap { display: inline-flex; align-items: baseline; gap: 7px; flex-wrap: wrap; }
.spc-price-old { color: var(--spc-muted); text-decoration: line-through; font-weight: 600; font-size: .86em; }
/* Ürün sayfası: kampanya rozet satırı — kurumsal/premium */
.spc-pd-campaign { display: inline-flex; gap: 8px; align-items: stretch; margin-bottom: 10px; flex-wrap: wrap; }
.spc-badge-disc { display: inline-flex; align-items: center; background: #dc2626; color: #fff; font-weight: 700;
  font-size: .82rem; letter-spacing: .01em; padding: 5px 12px; border-radius: 7px; }
.spc-badge-camp { display: inline-flex; align-items: center; background: #f1f5f9; color: #334155; border: 1px solid #e2e8f0;
  font-weight: 600; font-size: .72rem; text-transform: uppercase; letter-spacing: .09em; padding: 5px 12px; border-radius: 7px; }
/* Ürün sayfası: eski + indirimli fiyat yan yana */
.spc-pd-price-row { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.spc-pd-price-row .spc-price-old { font-size: 1.15rem; }

/* ===== Alt sabit mobil menü (bottom nav) — app benzeri, yalnız telefon ===== */
.spc-mobnav { display: none; }
@media (max-width: 820px) {
  .spc-mobnav {
    display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 350;
    background: #fff; border-top: 1px solid var(--spc-border);
    box-shadow: 0 -3px 14px rgba(15, 23, 42, .10);
    padding-bottom: env(safe-area-inset-bottom, 0px);
  }
  .spc-mobnav > a, .spc-mobnav > button {
    flex: 1 1 0; min-width: 0;
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    gap: 3px; padding: 7px 2px;
    font-size: .66rem; font-weight: 600; line-height: 1;
    color: #64748b; text-decoration: none;
    background: none; border: 0; cursor: pointer; -webkit-tap-highlight-color: transparent;
  }
  .spc-mobnav > a span, .spc-mobnav > button span { pointer-events: none; }
  .spc-mobnav .ic, .spc-mobnav svg { width: 23px; height: 23px; }
  .spc-mobnav > a.is-active { color: var(--spc-primary); }
  .spc-mobnav > a:active, .spc-mobnav > button:active { background: #f1f5f9; }
  .spc-mobnav-ic { position: relative; display: inline-flex; }
  .spc-mobnav-badge {
    position: absolute; top: -6px; left: 12px;
    min-width: 16px; height: 16px; padding: 0 4px; box-sizing: border-box;
    background: var(--spc-primary); color: #fff;
    border-radius: 9px; font-size: .6rem; font-weight: 800; line-height: 16px; text-align: center;
  }
  /* içerik + WhatsApp + çerez barı alt menünün üstünde kalsın */
  body { padding-bottom: calc(58px + env(safe-area-inset-bottom, 0px)); }
  .spc-wafloat { bottom: calc(74px + env(safe-area-inset-bottom, 0px)); }
  .spc-cookie { bottom: calc(72px + env(safe-area-inset-bottom, 0px)); }
}

/* ===== İletişim barı — tek panel, bölmeli (footer üstü) ===== */
.spc-contactbar { background: var(--spc-bg, #f5f7fa); border-top: 1px solid var(--spc-border); padding: 26px 0; }
.spc-cbar-panel { display: grid; grid-template-columns: repeat(3, 1fr); background: #fff; border: 1px solid var(--spc-border); border-radius: 18px; box-shadow: 0 8px 30px rgba(28, 39, 51, .08); overflow: hidden; }
.spc-cbar-item { display: flex; align-items: center; gap: 15px; padding: 20px 22px; border-left: 1px solid var(--spc-border); color: var(--spc-text); text-decoration: none; transition: background .15s; }
.spc-cbar-item:first-child { border-left: 0; }
.spc-cbar-item:hover { background: #fbfcfe; color: var(--spc-text); text-decoration: none; }
.spc-cbar-ic { flex: 0 0 auto; width: 50px; height: 50px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: linear-gradient(135deg, #fff2e8, #ffe0cc); color: var(--spc-primary); }
.spc-cbar-ic .ic { width: 24px; height: 24px; }
.spc-cbar-ic-wa { background: linear-gradient(135deg, #e4fbec, #c8f5d9); color: #16a34a; }
.spc-cbar-txt { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.spc-cbar-txt strong { font-size: 1.04rem; font-weight: 800; line-height: 1.2; color: var(--spc-text); }
.spc-cbar-txt small { font-size: .84rem; color: var(--spc-muted); line-height: 1.35; }
.spc-cbar-cta { color: var(--spc-primary); font-weight: 700; }
@media (max-width: 820px) {
  .spc-contactbar { padding: 18px 0; }
  .spc-cbar-panel { grid-template-columns: 1fr; }
  .spc-cbar-item { border-left: 0; border-top: 1px solid var(--spc-border); }
  .spc-cbar-item:first-child { border-top: 0; }
}

/* ============ Hesap alanı (profil / adres / garaj) ============ */
.spc-account { padding: 28px 0 60px; }
.spc-account-layout { display: grid; grid-template-columns: 260px 1fr; gap: 26px; align-items: start; }
.spc-account-side { position: sticky; top: 90px; }
.spc-account-hi { display: flex; align-items: center; gap: 12px; padding: 16px; background: var(--spc-primary-dark); color: #fff; border-radius: 14px 14px 0 0; }
.spc-account-avatar { flex: 0 0 auto; width: 42px; height: 42px; border-radius: 50%; background: rgba(249,115,22,.2); color: #fb923c; display: inline-flex; align-items: center; justify-content: center; }
.spc-account-avatar .ic { width: 22px; height: 22px; }
.spc-account-hi strong { display: block; font-size: .98rem; line-height: 1.2; }
.spc-account-hi small { color: #9fb0c0; font-size: .8rem; word-break: break-all; }
.spc-hesapmenu { display: flex; flex-direction: column; background: #fff; border: 1px solid var(--spc-border); border-top: 0; border-radius: 0 0 14px 14px; overflow: hidden; }
.spc-hesapmenu a, .spc-hesapmenu-cikis button { display: flex; align-items: center; gap: 10px; padding: 13px 16px; color: var(--spc-text); font-weight: 600; font-size: .92rem; text-decoration: none; border: 0; background: none; width: 100%; text-align: left; cursor: pointer; border-top: 1px solid var(--spc-border); }
.spc-hesapmenu > a:first-child { border-top: 0; }
.spc-hesapmenu a .ic { width: 18px; height: 18px; color: var(--spc-muted); }
.spc-hesapmenu a:hover { background: #fbfcfe; text-decoration: none; }
.spc-hesapmenu a.is-active { background: #fff2e8; color: var(--spc-primary); }
.spc-hesapmenu a.is-active .ic { color: var(--spc-primary); }
.spc-hesapmenu-cikis button { color: #b91c1c; }
.spc-hesapmenu-cikis button:hover { background: #fef2f2; }

.spc-account-main { min-width: 0; }
.spc-account-title { font-size: 1.6rem; margin: 0 0 6px; color: var(--spc-primary-dark); }
.spc-account-h2 { font-size: 1.2rem; margin: 26px 0 14px; color: var(--spc-primary-dark); }
.spc-account-muted { color: var(--spc-muted); margin: 0 0 18px; }

.spc-account-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin: 18px 0 8px; }
.spc-account-card { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; padding: 18px; background: #fff; border: 1px solid var(--spc-border); border-radius: 14px; text-decoration: none; color: var(--spc-text); transition: box-shadow .15s, transform .15s; }
.spc-account-card:hover { box-shadow: 0 10px 26px rgba(28,39,51,.08); transform: translateY(-2px); text-decoration: none; color: var(--spc-text); }
.spc-account-card-ic { width: 40px; height: 40px; border-radius: 11px; background: linear-gradient(135deg,#fff2e8,#ffe0cc); color: var(--spc-primary); display: inline-flex; align-items: center; justify-content: center; margin-bottom: 8px; }
.spc-account-card-ic .ic { width: 22px; height: 22px; }
.spc-account-card b { font-size: 1.5rem; font-weight: 800; color: var(--spc-primary-dark); line-height: 1; }
.spc-account-card span { color: var(--spc-muted); font-size: .84rem; }

/* Formlar */
.spc-formcard { background: #fff; border: 1px solid var(--spc-border); border-radius: 14px; padding: 22px; margin-bottom: 20px; }
.spc-formcard h2 { font-size: 1.1rem; margin: 0 0 16px; color: var(--spc-primary-dark); }
.spc-formcard label { display: block; font-weight: 600; font-size: .88rem; color: var(--spc-text); margin-bottom: 14px; }
.spc-formcard input, .spc-formcard textarea, .spc-garaj-select select { width: 100%; margin-top: 6px; padding: 11px 13px; border: 1px solid var(--spc-border); border-radius: 10px; font: inherit; background: #fff; }
.spc-formcard input:focus, .spc-formcard textarea:focus, .spc-garaj-select select:focus { outline: none; border-color: var(--spc-primary); box-shadow: 0 0 0 3px rgba(249,115,22,.12); }
.spc-formcard input:disabled { background: #f1f5f9; color: var(--spc-muted); }
.spc-form-row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.spc-form-hint { display: block; font-weight: 400; color: var(--spc-muted); font-size: .78rem; margin-top: 4px; }
.spc-form-err, .spc-formcard .field-validation-error, .spc-formcard .text-danger { display: block; color: #b91c1c; font-size: .8rem; font-weight: 500; margin-top: 4px; }
.spc-form-actions { display: flex; gap: 10px; }
.spc-check { display: flex; align-items: center; gap: 8px; font-weight: 500 !important; }
.spc-check input { width: auto !important; margin: 0 !important; }

.spc-alert { padding: 12px 16px; border-radius: 10px; margin-bottom: 18px; font-size: .9rem; font-weight: 500; }
.spc-alert-ok { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.spc-alert-err { background: #fef2f2; color: #b91c1c; border: 1px solid #fecaca; }
.spc-auth-info { display: flex; align-items: center; gap: 10px; margin: 0 0 18px; padding: 12px 16px; background: #fff7ef; border: 1px solid #ffd9b8; border-radius: 10px; color: #9a3412; font-size: .9rem; line-height: 1.4; }
.spc-auth-info .ic { flex: 0 0 auto; width: 22px; height: 22px; color: var(--spc-primary); }

.spc-link-btn { background: none; border: 0; color: var(--spc-primary); font-weight: 600; font-size: .85rem; cursor: pointer; padding: 0; }
.spc-link-btn:hover { text-decoration: underline; }
.spc-link-danger { color: #b91c1c; }
.spc-btn-sm { padding: 8px 14px !important; font-size: .85rem !important; }

/* Adres kartları */
.spc-adreslist { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 22px; }
.spc-adres { background: #fff; border: 1px solid var(--spc-border); border-radius: 12px; padding: 16px; }
.spc-adres.is-default { border-color: var(--spc-primary); box-shadow: 0 0 0 1px var(--spc-primary); }
.spc-adres-head { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.spc-adres-head strong { font-size: 1rem; }
.spc-adres-badge { background: #fff2e8; color: var(--spc-primary); font-size: .7rem; font-weight: 700; padding: 2px 8px; border-radius: 20px; }
.spc-adres p { margin: 2px 0; color: var(--spc-muted); font-size: .88rem; }
.spc-adres-actions { display: flex; gap: 14px; align-items: center; margin-top: 10px; }
.spc-adres-actions form { display: inline; }

/* Garaj kartları */
.spc-garajlist { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 22px; }
.spc-garaj-card { display: flex; gap: 14px; background: #fff; border: 1px solid var(--spc-border); border-radius: 14px; padding: 16px; }
.spc-garaj-ic { flex: 0 0 auto; width: 46px; height: 46px; border-radius: 12px; background: linear-gradient(135deg,#fff2e8,#ffe0cc); color: var(--spc-primary); display: inline-flex; align-items: center; justify-content: center; }
.spc-garaj-ic .ic { width: 24px; height: 24px; }
.spc-garaj-body { min-width: 0; }
.spc-garaj-nick { display: inline-block; background: var(--spc-primary-dark); color: #fff; font-size: .7rem; font-weight: 700; padding: 2px 8px; border-radius: 20px; margin-bottom: 4px; }
.spc-garaj-body strong { display: block; color: var(--spc-primary-dark); }
.spc-garaj-body small { color: var(--spc-muted); font-size: .84rem; }
.spc-garaj-actions { display: flex; gap: 12px; align-items: center; margin-top: 10px; flex-wrap: wrap; }
.spc-garaj-select { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 10px; margin-bottom: 14px; }
.spc-garaj-remove { display: inline-flex; align-items: center; gap: 6px; background: #fff; border: 1px solid var(--spc-border); color: var(--spc-muted); font-weight: 600; font-size: .82rem; padding: 7px 12px; border-radius: 9px; cursor: pointer; transition: background .15s, border-color .15s, color .15s; }
.spc-garaj-remove .ic { width: 15px; height: 15px; }
.spc-garaj-remove:hover { background: #fef2f2; border-color: #fecaca; color: #b91c1c; }

@media (max-width: 860px) {
  .spc-account-layout { grid-template-columns: 1fr; }
  .spc-account-side { position: static; }
  .spc-account-cards, .spc-form-row2, .spc-adreslist, .spc-garajlist, .spc-garaj-select { grid-template-columns: 1fr; }
}

/* Ürün sayfası: garajınızdaki araca "uyar" rozeti */
.spc-pd-garajuyar { display: flex; align-items: center; gap: 10px; margin: 4px 0 16px; padding: 12px 16px; background: #ecfdf5; border: 1px solid #a7f3d0; border-radius: 12px; color: #065f46; font-size: .92rem; line-height: 1.4; }
.spc-pd-garajuyar .ic { flex: 0 0 auto; width: 22px; height: 22px; color: #16a34a; }
.spc-pd-garajuyar strong { font-weight: 800; }
.spc-pd-garajuyar b { color: #047857; }

/* Ödeme: kayıtlı adresten seç */
.spc-checkout-adres { margin: 0 0 18px; padding: 14px 16px; background: var(--spc-bg); border: 1px solid var(--spc-border); border-radius: 12px; }
.spc-checkout-adres-head { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-bottom: 10px; font-size: .88rem; font-weight: 600; }
.spc-checkout-adres-head a { color: var(--spc-primary); font-weight: 700; font-size: .82rem; white-space: nowrap; }
.spc-checkout-adres-list { display: flex; flex-wrap: wrap; gap: 10px; }
.spc-adres-chip { text-align: left; background: #fff; border: 1px solid var(--spc-border); border-radius: 10px; padding: 10px 14px; cursor: pointer; transition: border-color .15s, box-shadow .15s; }
.spc-adres-chip:hover { border-color: var(--spc-primary); }
.spc-adres-chip.is-selected { border-color: var(--spc-primary); box-shadow: 0 0 0 2px rgba(249, 115, 22, .2); }
.spc-adres-chip strong { display: block; font-size: .9rem; color: var(--spc-text); }
.spc-adres-chip small { color: var(--spc-muted); font-size: .78rem; }
.spc-adres-chip.is-default strong::after { content: " ★"; color: var(--spc-primary); }