/* Ana sayfa (Views/Vitrin/Index) — onaylı prototipin index.css dosyasından (2026-09-25); vitrin v2'de (2026-09-28) yalnız kısa
   özetler kaldı: pakette neler var (bento), panel görüntüleri, fiyat + alan adı özeti. Açılış ("Sergi", 2026-10-16) sergi.css'te;
   eski kahraman (tarayıcı yığını, yüzen parçalar, canlı önizleme) ve koyu sayı bandı kaldırıldı. Belirteç ve bileşenler tasarim.css
   (21. bölüm işçilik katmanı dahil); vitrin sayfalarının ortakları (tema kartı, 3 adım, yenileme takvimi, son çağrı, SSS)
   vitrin.css. Önek: ah-. */

/* ═══ Pakette neler var: bento ═══ */
.ah-bento { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--b-5); margin-top: var(--b-7); }
.ah-bento-dolu { grid-column: span 2; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--b-6); align-items: center;
  background: radial-gradient(120% 100% at 100% 0%, rgba(240, 178, 84, .14), transparent 55%), var(--yuzey-1); }
.ah-dolu-liste { list-style: none; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.ah-dolu-liste li { display: flex; align-items: baseline; gap: 6px; padding: 10px 12px; border-radius: 10px; background: var(--yuzey-2); border: 1px solid var(--tas);
  font-size: var(--t-kucuk); font-weight: 600; box-shadow: var(--parilti); }
.ah-dolu-liste b { font: 800 1.125rem/1 var(--f-baslik); color: var(--mavi-metin); }


/* ═══ Panel görüntüleri (VIT-04) ═══ */
.ah-panel-izgara { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--b-5); margin-top: var(--b-7); }
.ah-panel-kart { margin: 0; padding: 10px 10px 18px; }
.ah-panel-kart .tk-kart-gorsel { border-radius: 12px; border: 1px solid rgba(22, 32, 44, .08); aspect-ratio: 16 / 10; }
.ah-panel-kart img { width: 100%; height: 100%; object-fit: cover; object-position: top left; }
.ah-panel-kart figcaption { display: grid; gap: 4px; padding: 14px 8px 0; font-size: var(--t-kucuk); color: var(--sis); }
.ah-panel-kart figcaption b { color: var(--murekkep); font-size: 1rem; }

/* ═══ 3 adım altı bağlantı ═══ */
.ah-orta-baglanti { display: flex; justify-content: center; margin-top: var(--b-7); }

/* ═══ Fiyat + alan adı özeti: 3 adım bölümü zeminliyse kartlar çizgiye yapışmasın (üst dolgu), zeminsizse boşluk bir kez ═══ */
.ah-ozet-bolum { padding-top: calc(var(--bolum) * .7); }
.tk-bolum:not(.tk-bolum--zemin) + .ah-ozet-bolum { padding-top: calc(var(--bolum) * .2); }
.ah-ozet { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: var(--b-5); align-items: stretch; }
.ah-ozet > .tk-kart > * + * { margin-top: var(--b-4); }
.ah-ozet h2 { font-size: clamp(1.75rem, 1.2rem + 1.8vw, 2.5rem); }
.ah-fiyat-ozet { background:
    radial-gradient(90% 70% at 0% 0%, rgba(47, 102, 255, .10), transparent 60%),
    radial-gradient(60% 50% at 100% 0%, rgba(240, 178, 84, .14), transparent 60%), var(--yuzey-1); }
.ah-fiyat-buyuk { background: var(--isilti); -webkit-background-clip: text; background-clip: text; color: transparent; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ah-dahil { list-style: none; padding: var(--b-5) 0 0; border-top: 1px solid var(--tas); display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 16px; }
.ah-dahil li { display: flex; align-items: center; gap: 10px; font-weight: 500; font-size: var(--t-arayuz); }
.ah-dahil svg { width: 22px; height: 22px; padding: 4px; border-radius: 50%; color: var(--mavi-metin); background: var(--mavi-acik); flex: none; }
.ah-fiyat-ozet .tk-dugme { margin-top: var(--b-6) !important; }
.ah-alan-ozet { display: flex; flex-direction: column; }
.ah-alan-ozet .tk-baglanti { margin-top: auto !important; padding-top: var(--b-4); }
.ah-alan-tablo th, .ah-alan-tablo td { padding-inline: 12px; }

/* Tasarım kartındaki tema renk örnekleri */
.ah-tema-renkler { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; margin-top: var(--b-5); }
.ah-tema-renkler li { display: inline-flex; align-items: center; gap: 8px; padding: 5px 12px 5px 5px; border-radius: 999px; border: 1px solid var(--tas); background: var(--yuzey-2); font-size: var(--t-kucuk); font-weight: 600; }
.ah-tema-renkler i { width: 22px; height: 22px; border-radius: 50%; box-shadow: inset 0 0 0 1px rgba(0,0,0,.08); }
.ah-dolu-ornek { display: grid; gap: 10px; }
.ah-dolu-etiket { font: 700 var(--t-mini)/1.2 var(--f-govde); letter-spacing: .08em; text-transform: uppercase; color: var(--sis); }

/* ═══ Duyarlılık ═══ */
@media (max-width: 1080px) {
  .ah-bento { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ah-bento-dolu { grid-column: 1 / -1; }
  .ah-ozet { grid-template-columns: minmax(0, 1fr); max-width: 720px; margin-inline: auto; }
  .ah-panel-izgara { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .ah-bento, .ah-panel-izgara { grid-template-columns: minmax(0, 1fr); }
  .ah-bento-dolu { grid-template-columns: minmax(0, 1fr); gap: var(--b-5); }
}
@media (max-width: 560px) {
  .ah-dolu-liste { grid-template-columns: 1fr 1fr; }
  .ah-dahil { grid-template-columns: minmax(0, 1fr); }
  .ah-alan-tablo th, .ah-alan-tablo td { padding-inline: 8px; }
  .ah-alan-tablo thead th, .ah-alan-tablo thead th.tk-tutar { white-space: normal; }
  /* Telefon: basit bento kartları yatay dizilir (simge solda) */
  .ah-bento > .tk-kart:not(.ah-bento-dolu) { display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: 14px; padding: 18px; }
  .ah-bento > .tk-kart:not(.ah-bento-dolu) > .tk-kart-simge { grid-row: span 3; width: 40px; height: 40px; }
  .ah-bento > .tk-kart:not(.ah-bento-dolu) > h3 { margin-top: 0; font-size: 1.1875rem; align-self: center; }
  .ah-bento > .tk-kart:not(.ah-bento-dolu) > p { margin-top: 4px; font-size: var(--t-arayuz); }
  .ah-bento > .tk-kart:not(.ah-bento-dolu) > .ah-tema-renkler { margin-top: 12px; }
  .ah-bento { gap: var(--b-4); }
}