/* Üst bar — C tasarımı (2026-09-23): tam genişlik beyaz bar, solda logo + marka, ortada bağlantılar,
   sağda turuncu "Teklif Al". HTML tüm sayfalarda aynı (#top-nav, .op-*); görünüm yalnız bu dosyadan gelir.
   Logo HTML'e eklenmedi: .op-brand::before ile assets/images/logo.png gösterilir (111 sayfa + yeni ürün şablonu aynı kalır). */
/* Üst bar iki halli (Kağan Murat, 2026-09-23: "beyaz sayfada beyaz bar belli olmuyor, kaydırınca değişsin"):
   sayfanın en üstünde sıcak taş rengi (#F1F0EC, tasarım paletinden) + alt çizgi; aşağı kaydırılınca
   (sayfalardaki mevcut betik #top-nav'a .shadow-md ekler) yarı saydam buzlu beyaz + hafif gölge. */
.op-nav{position:fixed;top:0;left:0;right:0;z-index:50;background:#F1F0EC;border-bottom:1px solid #DDDCD5;box-shadow:none}
.op-nav.shadow-md{background:rgba(255,255,255,.78);-webkit-backdrop-filter:saturate(160%) blur(14px);backdrop-filter:saturate(160%) blur(14px);border-bottom-color:rgba(27,27,27,.06);box-shadow:0 6px 24px rgba(27,27,27,.07)}
.op-in{max-width:none;margin:0;height:88px;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:0 56px;background:transparent}
.op-nav.shadow-md .op-in{background:transparent;box-shadow:none}
.op-brand{display:inline-flex;align-items:center;gap:12px;font-family:'Archivo',system-ui,sans-serif;font-weight:800;font-size:20px;font-stretch:110%;letter-spacing:0;text-transform:none;color:#1B1B1B;white-space:nowrap;text-decoration:none}
.op-brand::before{content:"";width:44px;height:44px;flex-shrink:0;background:url(../images/logo-seffaf.png?v=1) center/contain no-repeat} /* logo-seffaf.png: logo.png'nin beyaz zemini saydam kopyası (taş renkli / buzlu barda kutu görünmesin); favicon logo.png'yi kullanmaya devam eder */
.op-links{display:flex;align-items:center;gap:8px;list-style:none;margin:0;padding:0}
.op-links a{display:block;padding:10px 16px;border-radius:6px;font-family:'Archivo',system-ui,sans-serif;font-weight:500;font-size:16px;line-height:1.2;color:#1B1B1B;text-decoration:none}
.op-links a:hover{background:#E7E6DF}
.op-links a.on{background:#fff;color:#1B1B1B;font-weight:700;box-shadow:inset 0 -3px 0 #D9502A}
.op-nav.shadow-md .op-links a:hover{background:#F1F0EC}
.op-nav.shadow-md .op-links a.on{background:#F1F0EC}
.op-cta{display:inline-flex;align-items:center;padding:14px 26px;border-radius:6px;background:#D9502A;color:#fff;font-family:'Archivo',system-ui,sans-serif;font-weight:700;font-size:15px;line-height:1.2;text-decoration:none;white-space:nowrap}
.op-cta:hover{background:#B63F1A;color:#fff}
.op-hb{display:none;align-items:center;justify-content:center;width:44px;height:44px;border:0;border-radius:6px;background:transparent;color:#1B1B1B;cursor:pointer}
.op-hb:hover{background:#E7E6DF}
.op-nav.shadow-md .op-hb:hover{background:#F1F0EC}
.op-mp{max-width:none;margin:0;padding:8px 20px 16px;background:#fff;border:0;border-top:1px solid #E7E6E1;border-radius:0;box-shadow:0 12px 24px rgba(27,27,27,.08)}
.op-mp a{padding:14px 0;font-family:'Archivo',system-ui,sans-serif;font-weight:500;font-size:17px;color:#1B1B1B;text-decoration:none;border-bottom:1px solid #F1F0EC}
.op-mp a:last-child{border-bottom:0}
.op-mp a.on{color:#D9502A;font-weight:700}
.op-mp a.op-mcta{margin-top:10px;padding:14px 20px;border:0;border-radius:6px;background:#D9502A;color:#fff;font-weight:700;text-align:center}
.op-nav a:focus-visible,.op-nav button:focus-visible{outline:2px solid #D9502A;outline-offset:2px}
@media (max-width:1023px){.op-in{padding:0 24px}.op-links a{padding:10px 12px}}
@media (min-width:768px) and (max-width:900px){.op-links{gap:2px}.op-links a{padding:10px 9px;font-size:15px;white-space:nowrap}.op-brand{font-size:18px}}
@media (max-width:767px){
  .op-links,.op-cta{display:none}
  .op-hb{display:inline-flex}
  .op-in{height:64px;padding:0 16px}
  .op-brand{font-size:18px;gap:10px}
  .op-brand::before{width:36px;height:36px}
}

/* === C tasarımı — genel ince ayarlar (HTML'e dokunmadan, tüm sayfalar) ===
   Teklif düğmeleri (ürün kartları, ürün detay, özel çözüm bölümü): tasarımda turuncu. Hepsi iletisim.html?urun=… adresine gider. */
a[href^="iletisim.html?urun="]{background:#D9502A!important;color:#fff!important;border-color:#D9502A!important}
a[href^="iletisim.html?urun="]:hover{background:#B63F1A!important;border-color:#B63F1A!important;color:#fff!important}

/* Footer (yerleşim eski, stil yeni — referans Footer.dc.html): marka adı normal harf, sosyal simgeler turuncu. */
footer a.font-display-lg[href="index.html"]{text-transform:none;font-stretch:110%;font-weight:800;font-size:22px;letter-spacing:0;line-height:1.2}
footer a[aria-label="Instagram"],footer a[aria-label="WhatsApp"],footer a[aria-label="E-posta"]{color:#D9502A;border-color:#3A3A36}
footer a[aria-label="Instagram"]:hover,footer a[aria-label="WhatsApp"]:hover,footer a[aria-label="E-posta"]:hover{color:#fff;background:#D9502A;border-color:#D9502A}
footer a[href^="mailto:"]{overflow-wrap:anywhere;min-width:0}footer .grid>div{min-width:0}

/* === EFEKTLER KAPALI (Kağan Murat, 2026-09-21: "şu an hiçbir efekt olmasın, sonra gerekirse ekleriz") ===
   Tüm geçiş ve animasyonları kapatır, yumuşak kaydırmayı iptal eder. Bunların DIŞINDA kalanlar:
   WhatsApp sohbet penceresi (.opwa-*) ve ürün sayfalarındaki kendiliğinden kayan galeri şeridi (.gallery-track).
   Efektleri geri açmak için bu bloğu sil. */
html{scroll-behavior:auto!important}
*:not(.opwa-panel):not(.opwa-panel *):not(a.opwa-btn):not(a.opwa-btn *):not(.gallery-track),
*:not(.opwa-panel):not(.opwa-panel *):not(a.opwa-btn):not(a.opwa-btn *):not(.gallery-track)::before,
*:not(.opwa-panel):not(.opwa-panel *):not(a.opwa-btn):not(a.opwa-btn *):not(.gallery-track)::after{transition:none!important;animation:none!important}

/* Boşluksuz çok uzun kelimeler (admin'den girilen metinlerde) kutudan taşmasın, gerektiğinde bölünsün (2026-09-25,
   admin alan testlerinde bulundu: Ürünler başlığı, teklif adımları, düğmeler, hukuki sayfalar telefonda taşıyordu).
   "anywhere" yalnızca kelime satıra sığmadığında devreye girer. Küçük etiket/tablo hücreleri BİLEREK dışarıda: onlarda
   geniş kural normal kelimeleri de bölüyordu ("MAKSİMU/M" — görsel regresyon testiyle yakalandı). */
h1,h2,h3,h4,h5,p,li,blockquote,.c-teklif-adimlar span,.c-vizyon-etiket span,.c-dugme,.c-oc-ad,.c-oc-ust,.c-il-deger,.c-il-etiket{overflow-wrap:anywhere}

/* Başlıklarda birim standardı (2026-09-23): büyük harfli metinde rakamdan sonraki g/kg/ml… küçük harf (assets/c-birim.js işaretler) */
.c-birim{text-transform:lowercase!important}

/* TELEFON: ürün görselinin altındaki 3'lü özellik kartları (2026-09-26 mobil tarama). 360px telefonda 97 üründe kart başlığı/
   değeri kartın dışına taşıyordu ("AYARLANABİLİR YÜKSEKLİK", "68 × 17 × 33 cm"...). Yalnız telefonda: kart iç boşluğu ve
   harf aralığı daraltılır, kısa değerlerdeki satır kırma yasağı (whitespace-nowrap, masaüstü için) kaldırılır. Masaüstü aynı.
   Ölçüm: 103 ürün × 360/375/390/414/430px'te taşma 0; 320px'te de 0. */
@media (max-width:639px){
[class*="grid-cols-"].gap-4.mt-6{gap:8px}
[class*="grid-cols-"].gap-4.mt-6>div{padding:12px 5px}
[class*="grid-cols-"].gap-4.mt-6 .font-label-caps{letter-spacing:.02em;font-size:11px}
[class*="grid-cols-"].gap-4.mt-6 .font-mono-data{font-size:14px;white-space:normal}
}
@media (max-width:374px){
[class*="grid-cols-"].gap-4.mt-6{gap:6px}
[class*="grid-cols-"].gap-4.mt-6>div{padding:12px 3px}
[class*="grid-cols-"].gap-4.mt-6 .font-label-caps{letter-spacing:0}
[class*="grid-cols-"].gap-4.mt-6 .font-mono-data{font-size:13.5px}
}
@media (max-width:339px){
[class*="grid-cols-"].gap-4.mt-6 .font-label-caps{font-size:10px}
[class*="grid-cols-"].gap-4.mt-6 .font-mono-data{font-size:12.5px}
}

/* Ürün sayfası "Ürün Özellikleri" listesi: numara sütunu (w-6) uzun metinli satırlarda 16-24px arası daralıyor, başlıklar
   ve ayırıcı çizgiler aynı hizada başlamıyordu (2026-09-26 mobil tarama). Numara sütunu sabit genişlikte kalır. */
.flex.gap-4.group>.w-6{flex-shrink:0}

/* Galeri büyütme penceresinin kapatma (X) düğmesi telefonda 24x32px'ti; görünüm aynı kalarak dokunma alanı ~44px'e büyür. */
#lightbox-close{padding:10px;margin:-10px}

/* Yatay tablet / küçük dizüstü (1024-1279px): sayfa iki sütuna geçince görsel sütunu daralıyor, özellik kartı başlıkları
   ("AYARLANABİLİR YÜKSEKLİK", "SIZDIRMAZLIK GENİŞLİĞİ") 40 kartta taşıyordu. Aynı hafif sıkılaştırma. 1280px+ aynı. */
@media (min-width:1024px) and (max-width:1279px){
[class*="grid-cols-"].gap-4.mt-6{gap:10px}
[class*="grid-cols-"].gap-4.mt-6>div{padding:14px 6px}
[class*="grid-cols-"].gap-4.mt-6 .font-label-caps{letter-spacing:.02em}
}

/* TELEFON boşlukları (Kağan 26 Eylül, 4. madde): ürün sayfasında görselden önce 80px, footer'da üst/alt 120px masaüstü ölçüsü
   kullanılıyordu, telefonda gereksiz boşluk bırakıyordu. Yalnız telefonda azaltılır; tablet/masaüstü aynı. */
@media (max-width:767px){
section.relative.py-20.border-b{padding-top:0}
footer.py-section-gap{padding-top:64px;padding-bottom:48px}
}

/* TELEFON dokunma alanları (2026-09-26 mobil tarama): bazı küçük linkler 14-23px yükseklikteydi (önerilen ≥24px, rahatı 44px).
   Linkin üstüne/altına taşan görünmez ::after katmanı: tıklanabilir alan büyür, yerleşim ve görünüm DEĞİŞMEZ.
   (Ana sayfa öne çıkan kartlar "İncele / Teklif Al", form KVKK linki, footer marka, İletişim telefon/e-posta/harita.) */
@media (max-width:767px){
.c-oc-kart a,.c-form-alt a,footer a.font-display-lg,.c-il-deger,.c-il-harita-ac{position:relative}
.c-oc-kart a::after,.c-form-alt a::after,footer a.font-display-lg::after,.c-il-deger::after,.c-il-harita-ac::after{content:"";position:absolute;left:0;right:0;top:-11px;bottom:-11px}
}