/* urun-sitesi.css: urun siteleri (navlun.pro, hafriyat.pro; PO 22.10 tek sayfa, IS-2802). site-ana.css'in
   yerlesim ve hareket parcalarini kullanir; burada yalniz urun sayfasinin bolum zeminleri, bolunmus metnin
   yeri ve yeni parcalar (gun zinciri, durum siniflari, bu surumde olmayanlar, logosuz urunun markasi) var.
   Kabuk bu dosyayi her sayfada yukler. Belirtecler kurumsal.css. */

/* ---- Logosu olmayan urun (Madde 21): sirketin isareti + urunun adi ---- */
.site-marka-isaret { display: block; inline-size: var(--sp-10); block-size: var(--sp-10); }
.site-marka-ad {
  margin-inline-start: var(--sp-3); font-family: var(--s-font-baslik); font-weight: 600;
  font-size: var(--fs-28); line-height: 1; color: var(--s-murekkep); white-space: nowrap;
}

/* ---- Zeminler (ardisik iki bolum ayni zeminde degil) ---- */
.u-kagit { background: var(--s-kagit); }
.u-zemin { background: var(--s-zemin); }
.u-gri { background: var(--s-zemin-2); }

/* ---- Kahraman: telefon gorseli yok ---- */
.u-giris .s-giris-gorsel figcaption { padding-inline-start: 0; }
.u-giris .s-dev { font-size: clamp(44px, 5.2vw, 84px); }

/* ---- Bolunmus duzende metnin yeri ---- */
.u-metin-sol { grid-column: kap-bas / span 5; grid-row: 1; }
.u-metin-sag { grid-column: 9 / kap-son; grid-row: 1; }
.u-baglar { display: flex; flex-wrap: wrap; gap: 0 var(--s-g-kutu-1); margin: 0; }

/* ---- Bant bolumlerinde uclu ---- */
.u-gri .s-uclu { max-inline-size: 1040px; margin: var(--s-g-kutu-2) auto 0; }
.u-ikon {
  display: inline-grid; place-items: center; inline-size: var(--sp-12); block-size: var(--sp-12);
  margin-block-end: var(--sp-3); border-radius: var(--s-r-kart);
  background: var(--s-kagit); color: var(--s-vurgu-metin); border: 1px solid var(--s-cizgi);
}
.u-ikon .icon { inline-size: 24px; block-size: 24px; }

/* ---- 10 Maliyet: uzun dokum bir ekrana sigar; ustteki sonuc satiri gorunur, alt kenar solar ---- */
.u-maliyet .s-cerceve {
  position: relative;
  max-block-size: calc(100dvh - var(--s-ust-h) - 2 * clamp(48px, 9vh, 96px));
}
.u-maliyet .s-cerceve::after {
  content: ""; position: absolute; inset-inline: 0; inset-block-end: 0; block-size: var(--s-g-makro-1);
  background: linear-gradient(transparent, var(--s-kagit)); pointer-events: none;
}

/* ---- 06 Gun: bes durak ---- */
.u-gun .s-zincir { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.u-gun .s-zincir h3 { margin-block-start: var(--sp-1); }
.u-zaman {
  margin: var(--sp-4) 0 0; font-size: var(--fs-13); font-weight: 600;
  letter-spacing: 0.12em; text-transform: uppercase; color: var(--s-turkuaz);
}
.u-gun .s-zincir .u-zaman { color: var(--s-turkuaz); font-size: var(--fs-13); }

/* ---- 08 Yakit (navlun) ve Is makinesi (hafriyat): 5/7, durum siniflari ---- */
.u-yakit-ic, .u-bes-yedi { display: grid; grid-template-columns: 5fr 7fr; gap: var(--s-g-kutu-3); align-items: center; }
.u-yakit-ic > div > p:not(.s-ust-etiket), .u-bes-yedi > div > p:not(.s-ust-etiket) { margin: var(--sp-4) 0 var(--s-g-kutu-1); font-size: var(--s-fs-govde); color: var(--s-soluk); }
.u-siniflar { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-g-kutu-1); margin: 0; padding: 0; list-style: none; }
/* Kartlar alcak golgede, ekran cerceveleri derin golgede (yukselti hiyerarsisi) */
.u-siniflar li {
  padding: var(--s-g-kutu-1); background: var(--s-zemin);
  border: 1px solid var(--s-cizgi); border-radius: var(--s-r-kart); box-shadow: 0 1px 2px var(--s-golge);
}
.u-siniflar .st { font-size: var(--fs-15); }
/* Notr rozet sitenin grisiyle (panelin --neutral-soft'u zemin-2'ye cok yakin; kurumsal .s-urun ile ayni) */
.u-siniflar .st-neutral { background: var(--s-zemin-2); }
.u-siniflar p { margin: var(--sp-3) 0 0; color: var(--s-soluk); }
.u-yakit-ic + .s-uclu { margin-block-start: var(--s-g-kutu-3); }

/* ---- 11 Gecis: 7/5, bu surumde olmayanlar ---- */
.u-gecis-ic { display: grid; grid-template-columns: 7fr 5fr; gap: var(--s-g-kutu-3); align-items: start; }
.u-gecis-ic > div > p:not(.s-ust-etiket) { margin: var(--sp-4) 0 var(--s-g-kutu-1); max-inline-size: 56ch; font-size: var(--s-fs-govde); color: var(--s-soluk); }
.u-gecis-ic .s-maddeler { max-inline-size: 56ch; }
.u-yok {
  padding: var(--s-g-kutu-2); background: var(--s-kagit);
  border: 1px solid var(--s-cizgi); border-block-start: 4px solid var(--s-murekkep); border-radius: var(--s-r-kart);
  box-shadow: 0 1px 2px var(--s-golge);
}
.u-yok h3 { display: flex; align-items: center; gap: var(--sp-2); margin: 0 0 var(--sp-4); font-family: var(--s-font-baslik); font-size: var(--fs-28); }
.u-yok h3 .icon { color: var(--s-vurgu-metin); }
.u-yok dl { margin: 0 0 var(--sp-4); }
.u-yok dl div { padding-block: var(--sp-4); border-block-start: 1px solid var(--s-cizgi); }
.u-yok dt { font-weight: 600; color: var(--s-murekkep); }
.u-yok dd { margin: var(--sp-1) 0 0; color: var(--s-soluk); }

/* ---- 12 Kapanis ---- */
.u-kapanis .s-dev { max-inline-size: 18ch; }
.u-kapanis-alt { margin: var(--s-g-kutu-1) 0 var(--s-g-kutu-2); max-inline-size: 48ch; font-size: var(--fs-20); color: var(--s-buz-soluk); }

/* ---- Kisa dizustu ekrani (or. 1366x768): bolunmus metin bir ekrana sigsin ---- */
@media (min-width: 1101px) and (max-height: 820px) {
  .u-site { --s-fs-h2: clamp(32px, 3vw, 44px); }
  .s-bolunmus-metin > p { margin-block-end: var(--sp-4); }
  .s-maddeler li { padding-block: var(--sp-3); }
}

/* ---- Duyarlilik ---- */
@media (max-width: 1100px) {
  .u-metin-sol, .u-metin-sag { grid-column: kap-bas / kap-son; }
  .u-gun .s-zincir { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .u-yakit-ic, .u-bes-yedi, .u-gecis-ic { grid-template-columns: 1fr; gap: var(--s-g-kutu-2); }
}
@media (max-width: 860px) {
  .u-gun .s-zincir { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 700px) {
  .site-marka-isaret { inline-size: var(--sp-8); block-size: var(--sp-8); }
  .site-marka-ad { margin-inline-start: var(--sp-2); font-size: var(--fs-24); }
  .u-siniflar { grid-template-columns: 1fr; }
  .u-gun .s-zincir { grid-template-columns: 1fr; }
  .u-yok { padding: var(--s-g-kutu-1); }
}