/* PiyasaKuşu yeni site — paketler: dört paket kutusu, ücretsiz seçenekler ve hizmet tablosu.
   İki yerde yüklenir, ikisi de aynı kaynaktan üretilir (build/paketler.mjs):
     /uyelik/     kutular fiyatlı ve tek "Üye Ol" düğmeli → ücretsiz seçenekler → tablo (11.10.2026)
     ana sayfa    tablo (fiyatsız) → kutular (fiyatsız, düğmesiz) → Üyelik sayfasına bağlantı (12.10.2026, sahibi:
                  "ana sayfadaki satın alınacak paketleri veyahut da fiyatları kaldıralım")
   Yapı, sahibinin örnek gösterdiği üyelik sayfasındaki gibi; renkler sitenin kendi (yeni) renkleri: açık zemin,
   lacivert yazı, kobalt. Seçilemeyen paketler soluk gösterilir ve düğmesi yoktur ("Seçime kapalı").
   12.10.2026: kutuların altındaki ✓ listelerinin yerinde her paketin genel tanımı durur (.i-paket-aciklama). */
.i-paketler { margin-top: 8px; }
.i-paket-kartlar { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; align-items: stretch; }
.i-paket {
  display: flex; flex-direction: column; gap: 10px; min-width: 0; padding: 22px 20px 20px; border-radius: 16px;
  background: #fff; border: 1px solid #dde3eb; box-shadow: 0 1px 3px rgba(15, 27, 45, .06); color: #0f1b2d;
}
.i-paket-kartlar .i-paket h3 { margin: 0; font-size: 22px; font-weight: 500; line-height: 1.2; letter-spacing: 0; color: #0f1b2d; }
.i-paket-fiyat { margin: 0; font-size: 30px; font-weight: 300; line-height: 1.15; letter-spacing: -.01em; font-variant-numeric: tabular-nums; }
.i-paket-fiyat s { color: #5d6878; text-decoration-thickness: 2px; }
/* fiyatın gözden geçirme işareti: fiyatın altında kendi satırında (yanına sığmayıp alta kayıyordu), soldurulmaz */
.i-paket-isaret { margin: 0; line-height: 1.4; }
.i-paket-isaret .i-kontrol { margin-left: 0; }
.i-paket-ilk { margin: 0; font-size: 16px; font-weight: 500; line-height: 1.4; color: #23609f; }
.i-paket-durum { margin: 0; align-self: flex-start; padding: 3px 10px; border-radius: 999px; background: #eef1f5; border: 1px solid #c3ccd9; font-size: 13px; font-weight: 500; color: #3d4959; }
/* paketin genel tanımı: kutunun alt yarısı, ince bir çizgiyle ayrılır */
.i-paket-aciklama { margin: 6px 0 0; padding: 14px 0 0; border-top: 1px solid #dde3eb; font-size: 15px; line-height: 1.6; color: #3d4959; }
.i-paket-aciklama .i-kontrol { margin-left: 0; white-space: normal; }
.i-paket--acik { border: 2px solid var(--kobalt); box-shadow: 0 14px 34px rgba(42, 110, 183, .18); }
/* soluk: seçime kapalı olduğu belli olsun (sahibi, 11.10.2026). 12.10.2026'dan beri kutunun altında okunması gereken
   bir tanım durduğu için solukluk kutunun tamamına değil parçalarına verilir: ad ve fiyat soluk kalır; durumu
   söyleyen "Seçime kapalı" yazısı ve tanım soldurulmaz (tanım daha açık bir tonda: beyaz üstünde 5,65:1). */
.i-paket--kapali { box-shadow: none; border-color: #e6eaef; }
.i-paket--kapali > :not(.i-paket-aciklama):not(.i-paket-durum):not(.i-paket-isaret) { opacity: .55; }
.i-paket--kapali .i-paket-aciklama { color: #5d6878; border-top-color: #e6eaef; }
.i-ana .plan-dugme { min-height: 48px; display: flex; align-items: center; justify-content: center; padding: 0 18px; font-size: 16px; }
/* (stil.css bu düğmenin rengini yalnız eski üyelik bölümünün içinde tanımlar; burada açıkça yazılır) */
.i-ana .plan-dugme.mavi { background: var(--kobalt); border: 1px solid var(--kobalt); color: #fff; box-shadow: 0 8px 22px rgba(42, 110, 183, .3); }
.i-ana .plan-dugme.i-cizgi { background: #fff; border: 1px solid #c3ccd9; color: #0f1b2d; box-shadow: none; }
.i-ana .plan-dugme.i-cizgi:hover { border-color: var(--kobalt); }
/* Yan yana duran kutuların satırları hizalı dursun (ad · fiyat · ek satır · düğme ya da durum · tanım): her kutu,
   kutu sırasının satırlarını paylaşır (subgrid). Böylece TR'deki işaret satırı Global'deki "İlk 100 kişi" satırıyla,
   dört tanımın üstündeki çizgiler de birbiriyle aynı hizada olur. Desteklemeyen tarayıcıda yukarıdaki alt alta
   dizilim geçerlidir (kutular yine eşit boyda, yalnız iç satırlar hizalanmaz). */
@supports (grid-template-rows: subgrid) {
  .i-paket-kartlar { column-gap: 16px; row-gap: 0; margin-bottom: -16px; }
  .i-paket { display: grid; grid-template-rows: subgrid; grid-row: span 5; row-gap: 0; margin-bottom: 16px; }
  .i-paket > h3 { grid-row: 1; }
  .i-paket > .i-paket-fiyat { grid-row: 2; margin-top: 10px; }
  .i-paket > .i-paket-ilk, .i-paket > .i-paket-isaret { grid-row: 3; margin-top: 10px; }
  .i-paket > .plan-dugme, .i-paket > .i-paket-durum { grid-row: 4; margin-top: 10px; }
  .i-paket > .i-paket-durum { justify-self: start; align-self: start; }
  .i-paket > .i-paket-aciklama { grid-row: 5; margin-top: 16px; }
}
.i-paket-ucretsiz { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: 16px; }
.i-paket-ucretsiz .i-kutu { display: flex; flex-direction: column; gap: 6px; }
.i-paket-ucretsiz .plan-dugme { margin-top: 10px; align-self: flex-start; min-width: 200px; }

.i-paket-tablo { width: 100%; border-collapse: separate; border-spacing: 0; background: #fff; border: 1px solid #dde3eb; border-radius: 14px; font-size: 15px; line-height: 1.45; color: #0f1b2d; }
.i-paket-tablo th, .i-paket-tablo td { padding: 13px 12px; border-top: 1px solid #e6eaef; vertical-align: middle; }
.i-paket-tablo thead th {
  position: sticky; top: 66px; z-index: 3; background: #fff; border-top: 0; border-bottom: 1px solid #c3ccd9;
  font-size: 16px; font-weight: 500; text-align: center; padding-top: 16px; padding-bottom: 12px;
}
.i-paket-tablo thead th:first-child { text-align: left; border-top-left-radius: 14px; font-size: 14px; color: #5d6878; padding-left: 20px; }
.i-paket-tablo thead th:last-child { border-top-right-radius: 14px; }
.i-paket-tablo thead th.i-acik { color: #23609f; }
.i-paket-tablo thead small { display: block; margin-top: 2px; font-size: 13px; font-weight: 400; color: #3d4959; font-variant-numeric: tabular-nums; white-space: nowrap; }
.i-paket-tablo thead small s { color: #5d6878; }
.i-paket-tablo tbody th { text-align: left; font-weight: 400; color: #0f1b2d; padding-left: 20px; }
.i-paket-tablo tbody tr:first-child th, .i-paket-tablo tbody tr:first-child td { border-top: 0; }
/* alt köşeler: son satırın zemini tablonun yuvarlak kenarını örtmesin */
.i-paket-tablo tbody tr:last-child th { border-bottom-left-radius: 13px; }
.i-paket-tablo tbody tr:last-child td:last-child { border-bottom-right-radius: 13px; }
.i-paket-tablo td { width: 13%; text-align: center; font-size: 17px; }
/* seçilebilen paketin sütunu hafif mavi zeminli (sütunun yeri değil durumu belirler: .i-acik) */
.i-paket-tablo td.i-acik, .i-paket-tablo thead th.i-acik { background: #f3f8fd; }
.i-var { color: #1d6b3e; font-weight: 700; }
.i-yok { color: #5d6878; }
/* kapalı paketlerin sütunları soluk. Başlık hücreleri sayfaya yapışık kalır (sticky) ve altından satırlar geçer;
   saydamlıkla soldurulursa alttaki ✓ işaretleri TR / G7 / Emtia yazılarının içinden görünür. O yüzden başlıkta
   solukluk renkle verilir (lacivertin %55'i beyaz üstünde: #7b828c), zemin opak kalır. */
.i-paket-tablo td.i-kapali { opacity: .55; }
.i-paket-tablo thead th.i-kapali, .i-paket-tablo thead th.i-kapali small, .i-paket-tablo thead th.i-kapali small s { color: #7b828c; }
/* yalnız ekran okuyucunun okuduğu söz (başlıktaki "seçime kapalı"); ana sayfa ic.css yüklemediği için burada da durur */
.i-paket-tablo .i-gizli { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.i-paket-not { margin: 12px 0 0; max-width: 860px; font-size: 13.5px; line-height: 1.6; color: #4b5768; white-space: pre-wrap; }

/* ── Ana sayfadaki paket bölümü (#uyelik): komşu bölümlerle aynı genişlikte; önce tablo, altında kutular ── */
.y-paketler .i-paket-kartlar { margin-top: 40px; }
.y-paketler .y-uyelik-bag { margin: 22px 0 0; padding: 0; }
/* ana sayfa ic.css yüklemez: sahibinin gözden geçireceği metin işareti burada da aynı görünür */
.y-paketler .i-kontrol {
  display: inline-block; padding: 1px 7px; border-radius: 6px; vertical-align: 1px;
  font-size: 11.5px; font-weight: 500; letter-spacing: .02em; color: #7a5200; background: #fff4d6; border: 1px solid #efd28a;
}
.y-paketler .i-paket-not .i-kontrol { margin-left: 6px; white-space: nowrap; }

@media (max-width: 1000px) {
  .i-paket-kartlar { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
  .i-paket-kartlar, .i-paket-ucretsiz { grid-template-columns: 1fr; }
  .i-paket-ucretsiz .plan-dugme { align-self: stretch; }
  .i-paket-tablo { font-size: 13.5px; }
  .i-paket-tablo th, .i-paket-tablo td { padding: 11px 4px; }
  .i-paket-tablo tbody th, .i-paket-tablo thead th:first-child { padding-left: 12px; }
  .i-paket-tablo thead th { font-size: 13.5px; }
  .i-paket-tablo thead small { font-size: 11.5px; white-space: normal; }
  .i-paket-tablo td { width: 14%; font-size: 15px; }
  .y-paketler .i-paket-kartlar { margin-top: 28px; }
}
