/* ====== KARTLAR (beyaz tema) ====== */
.package-cards{display:grid;grid-template-columns:repeat(auto-fit, minmax(260px, 1fr));gap:16px;margin:20px;color:#0b1220;font-family:inherit}
.package-card{position:relative;background:#fff;border:1px solid #e6e8ec;border-radius:14px;padding:18px;box-shadow:0 6px 18px rgba(2,8,23,.06)}
.package-card.is-sale{border-color:#fecaca;box-shadow:0 6px 18px rgba(220,38,38,.08)}
.package-card .sale-badge{position:absolute;top:12px;right:12px;background:#dc2626;color:#fff;font-size:11px;font-weight:800;padding:4px 8px;border-radius:999px}
.package-card .price s{color:#94a3b8;font-size:16px;font-weight:600;margin-right:8px}
.package-card .stock{margin-top:8px;font-size:12px;font-weight:700}
.package-card .stock.in{color:#16a34a}
.package-card .stock.out{color:#dc2626}
.package-card h3{margin:0 0 6px 0;font-size:18px;font-weight:800}
.package-card .price{font-size:28px;font-weight:900}
.package-card .per{font-size:12px;color:#64748b;margin-left:6px}
.package-card .mini{font-size:12px;color:#334155;margin-top:6px}
.package-card .line{height:1px;background:#f0f2f6;margin:12px 0}
.package-card ul{list-style:none;padding:0;margin:10px 0 0 0;display:flex;flex-direction:column;gap:8px;font-size:13px}
.package-card ul li{display:flex;gap:8px;align-items:flex-start}
.package-card .tick{color:#16a34a;font-weight:900;line-height:1}
.package-card .cta{margin-top:14px;display:flex;gap:10px;justify-content: center;}
.package-card .btn{flex:1;background:#0b1220;color:#fff;border:1px solid #0b1220;padding:10px 12px;border-radius:10px;font-weight:700;cursor:pointer;text-align:center;transition:.2s}
.package-card .btn:hover{filter:brightness(1.05)}
.package-card .btn,
.package-card a.btn {
  display: flex;                 /* metni kutu içinde ortalamak için */
  align-items: center;           /* dikey merkez */
  justify-content: center;       /* yatay merkez */
  gap: 8px;                      /* ikon vs. eklersen */
  line-height: 1;                /* satır yüksekliği şaşırtmasın */
  min-height: 44px;              /* dokunmatik için ideal yükseklik */
  padding: 0 14px;               /* yatay dolgu */
}

/* ====== TOOLBAR (mavi şerit) ====== */
.package-toolbar{display:flex;gap:12px;align-items:center;justify-content:space-between;margin:0 20px;background:#f2f6ff;border:1px solid #e1e9ff;border-top-left-radius:12px;border-top-right-radius:12px;padding:10px 12px}
.package-search{position:relative;min-width:260px;flex:1}
.package-search input{width:100%;background:#fff;border:1px solid #e6e8ec;border-radius:8px;color:#0b1220;padding:10px 36px 10px 12px;font-size:14px}
.package-search .icon{position:absolute;pointer-events: none;right:10px;top:50%;transform:translateY(-50%);opacity:.55}
.package-switch{display:flex;align-items:center;gap:10px}
.package-switch input{appearance:none;width:44px;height:24px;border-radius:999px;background:#dfe9ff;border:1px solid #cfe0ff;position:relative;cursor:pointer}
.package-switch input:checked{background:#c7d7ff}
.package-switch input::after{content:"";position:absolute;width:18px;height:18px;border-radius:50%;background:#0b1220;top:50%;left:3px;transform:translateY(-50%);transition:.2s}
.package-switch input:checked::after{left:23px}
.package-switch label{font-size:13px;color:#334155}

/* ====== TABLO ====== */
.package-table{margin:0 20px 20px;border:1px solid #e6e8ec;border-top:none;border-bottom-left-radius:12px;border-bottom-right-radius:12px;overflow:hidden;background:#fff;box-shadow:0 6px 18px rgba(2,8,23,.06);color:#0b1220;font-family:inherit;position:relative}
.package-table .thead,.package-table .row{display:grid;grid-template-columns:minmax(140px,260px) repeat(var(--pkg-count, 3), minmax(110px, 1fr));margin-left:0;margin-right:0}

.package-table .thead{background:#fff;border-bottom:1px solid #e6e8ec;position:sticky;top:0;z-index:3}
.package-table .thead .cell{padding:14px 16px;font-weight:800;text-align:center}
.package-table .thead .cell:first-child{text-align:left}
.package-table .pkg{display:flex;flex-direction:column;align-items:center;gap:4px}
.package-table .pkg .name{font-weight:800}
.package-table .pkg small{display:block;color:#64748b;font-weight:600;line-height:1.2}

.package-table .section-row{display:grid;grid-template-columns:minmax(140px,260px) repeat(var(--pkg-count, 3), minmax(110px, 1fr));background:#fff}
.package-table .section-row .section-title{grid-column:1 / -1;color:#1e3a8a;font-weight:800;padding:16px 16px 10px 16px;border-top:1px solid #eef2ff}

.package-table .row{border-bottom:1px solid #f2f4f8;background:#fff}
.package-table .cell{padding:14px 16px;border-right:1px solid #f0f2f6;display:flex;align-items:center;justify-content:center;font-size:14px}
.package-table .cell:first-child{justify-content:flex-start;font-weight:700;color:#0b1220;background:#fafbff;position:sticky;left:0;z-index:2;border-right:1px solid #ebedf1}
.package-table .cell .desc{display:block;color:#5b6780;font-weight:500;font-size:12px;margin-top:6px}

.package-table .foot{display:flex;justify-content:center;padding:14px;background:#fafafa;border-top:1px solid #e6e8ec}
.package-table .foot a{display:inline-flex;gap:8px;align-items:center;padding:8px 12px;border:1px solid #e6e8ec;border-radius:10px;text-decoration:none;color:#0b1220;font-weight:700;background:#fff}

/* ====== RESPONSIVE ====== */
@media (max-width:1024px){
  .package-cards{grid-template-columns:repeat(auto-fit, minmax(240px, 1fr))}
  .package-table .thead,.package-table .row,.package-table .section-row{grid-template-columns:200px repeat(var(--pkg-count, 3), minmax(110px, 1fr))}
}
@media (max-width:820px){
  .package-cards{display:grid;grid-template-columns:1fr;overflow:visible;gap:14px;margin:12px}
  .package-card{min-width:0;width:100%}
  .package-table{overflow:auto}
  .package-table .thead,.package-table .row,.package-table .section-row{min-width:calc(180px + var(--pkg-count, 3) * 140px);grid-template-columns:180px repeat(var(--pkg-count, 3), minmax(120px, 1fr))}
  .package-table::-webkit-scrollbar{height:8px}
  .package-table::-webkit-scrollbar-thumb{background:#e6e8ec;border-radius:8px}
}
@media (max-width:480px){
  .package-card{min-width:0}
  .package-table .thead,.package-table .row,.package-table .section-row{min-width:calc(160px + var(--pkg-count, 3) * 130px);grid-template-columns:160px repeat(var(--pkg-count, 3), minmax(110px, 1fr))}
}

/* === Kart hizalama sabitlemesi === */
.package-cards{
  display: grid;                 /* zaten grid ise sorun yok */
  align-items: stretch;          /* tüm kartlar aynı yükseklikte gerilsin */
}

.package-card{
  display: flex;
  flex-direction: column;        /* içerik üstten alta aksın */
  height: 100%;                  /* grid hücresini tam doldursun */
}

/* Listeler/özellikler ne kadar uzun olursa olsun, CTA hep en alta insin */
.package-card .cta{
  margin-top: auto;              /* sihir burada */
}

/* Butonlar tam ortalı ve aynı yükseklik */
.package-card .btn,
.package-card a.btn{
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 52px;              /* tek tip buton yüksekliği */
  padding: 0 16px;
  line-height: 1;
}

/* Dikey dalgalanmayı azaltmak için başlık+fiyat bölgesine sabit alt boşluklar */
.package-card h3{ margin-bottom: 8px; }
.package-card .price{ margin-bottom: 6px; }
.package-card .mini{ margin-bottom: 10px; }

/* Liste altı ekstra boşluk kalmasın */
.package-card ul{ margin-bottom: 0; }

/* === KART HİZALAMA – Nihai Düzeltme === */
/* 1) Kartları eşit yükseklik + dikey kolon yap */
.package-cards{
  display: grid;
  grid-template-columns: repeat(var(--pkg-count, auto-fit), minmax(240px, 1fr));
  gap: 16px;
  align-items: stretch;             /* tüm kartlar aynı yükseklik */
}
.package-card{
  display: flex !important;         /* dış stil çakışmalarına karşı */
  flex-direction: column !important;
  height: 100% !important;
}

/* 2) İçerik ne kadar uzun olursa olsun CTA en alta insin */
.package-card ul{
  flex: 1 1 auto;                   /* liste kalan alanı doldursun */
  margin-bottom: 0 !important;      /* altta boşluk bırakmasın */
}
.package-card .cta{
  margin-top: 12px !important;      /* küçük bir ara, ama sabit */
}

/* 3) Butonlar aynı yükseklik ve tam ortalı */
.package-card .btn,
.package-card a.btn{
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  min-height: 52px !important;      /* tek tip yükseklik */
  padding: 0 16px !important;
  line-height: 1 !important;
}

/* 4) Başlık/fiyat bloklarında tutarlı alt boşluklar */
.package-card h3{ margin-bottom: 8px !important; }
.package-card .price{ margin-bottom: 6px !important; }
.package-card .mini{ margin-bottom: 10px !important; }

/* 5) Tablet/mobilde de aynı mantık geçerli */
@media (max-width: 1024px){
  .package-cards{ grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
}
@media (max-width: 820px){
  .package-cards{
    display: flex;
    gap: 12px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
  }
  .package-card{ min-width: 80%; scroll-snap-align: center; }
}
@media (max-width: 480px){
  .package-card{ min-width: 92%; }
}

.package-table .pkg-quote-btn{
  margin-top:8px;
  background:#0b1220;
  color:#fff;
  border:0;
  border-radius:8px;
  padding:8px 12px;
  font-size:12px;
  font-weight:700;
  cursor:pointer;
  min-height:40px;
}
.package-table .pkg-quote-btn:hover{filter:brightness(1.08)}

.product-faq__list{max-width:860px;margin:0 auto;display:flex;flex-direction:column;gap:10px}
.product-faq__item{background:#fff;border:1px solid #e6e8ec;border-radius:12px;padding:0;box-shadow:0 4px 14px rgba(2,8,23,.04)}
.product-faq__item summary{cursor:pointer;list-style:none;padding:16px 18px;font-weight:700;position:relative;padding-right:42px}
.product-faq__item summary::-webkit-details-marker{display:none}
.product-faq__item summary::after{content:"+";position:absolute;right:16px;top:50%;transform:translateY(-50%);font-size:22px;color:#1e3a8a;line-height:1}
.product-faq__item[open] summary::after{content:"–"}
.product-faq__answer{padding:0 18px 16px;color:#334155;line-height:1.6}

.quote-modal{position:fixed;inset:0;z-index:9999;display:flex;align-items:flex-end;justify-content:center}
.quote-modal[hidden]{display:none !important}
.quote-modal__backdrop{position:absolute;inset:0;background:rgba(11,18,32,.55)}
.quote-modal__dialog{position:relative;z-index:1;background:#fff;width:100%;max-width:480px;max-height:92vh;overflow:auto;border-radius:16px 16px 0 0;padding:22px 20px 24px;box-shadow:0 -8px 30px rgba(2,8,23,.18);-webkit-overflow-scrolling:touch}
.quote-modal__close{position:absolute;right:12px;top:10px;border:0;background:transparent;font-size:28px;line-height:1;cursor:pointer;color:#334155;width:44px;height:44px}
.quote-modal__dialog h3{margin:0 36px 6px 0;font-size:20px;font-weight:800}
.quote-modal__product{margin:0 0 16px;color:#64748b;font-weight:600}
.quote-field{display:flex;flex-direction:column;gap:6px;margin-bottom:12px;font-size:13px;font-weight:700;color:#0b1220}
.quote-field input,.quote-field textarea{width:100%;border:1px solid #e6e8ec;border-radius:10px;padding:12px;font-size:16px;font-weight:500;min-height:44px}
.quote-modal__submit{width:100%;min-height:48px;border:0;border-radius:10px;background:#0b1220;color:#fff;font-weight:800;cursor:pointer;margin-top:6px}
.quote-alert{padding:10px 12px;border-radius:8px;margin-bottom:12px;font-size:14px}
.quote-alert--ok{background:#ecfdf5;color:#166534}
.quote-alert--err{background:#fef2f2;color:#b91c1c}
body.quote-modal-open{overflow:hidden;touch-action:none}

@media (min-width:640px){
  .quote-modal{align-items:center;padding:16px}
  .quote-modal__dialog{border-radius:16px;max-height:90vh}
}