/* Fiyatlandırma sayfası — paket sekmeleri → ödeme dönemi → fiyat kartı + pakete dahil listesi.
   Renkler sitenin paletinden (sarı #eab308 vurgu, koyu #1f2937 kart, gri tonlar); site-style.css'teki
   .feature-list ve .plan-cta yeniden kullanılır, mevcut sınıflara dokunulmaz. */

.pricingHead{text-align:center;max-width:40rem;margin:0 auto 2rem}
.pricingHead .pricing-h1{margin-bottom:.75rem}
.pricingHead .pricing-sub{margin:0 auto}
.pricingShell{max-width:64rem;margin:0 auto}

/* ── 1) Paket türü sekmeleri ── */
.planTabs{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem;max-width:44rem;margin:0 auto}
.planTab{display:flex;flex-direction:column;align-items:center;gap:.25rem;padding:1.1rem .75rem;background:#fff;border:1px solid #f3f4f6;border-radius:1rem;box-shadow:0 1px 3px rgba(0,0,0,.05);cursor:pointer;color:#374151;transition:all .2s;font:inherit}
.planTab:hover{border-color:#e5e7eb;box-shadow:0 10px 25px -5px rgba(0,0,0,.1);transform:translateY(-2px)}
.planTab.active{background:linear-gradient(135deg,#facc15,#eab308);border-color:#eab308;color:#111827;box-shadow:0 10px 25px -5px rgba(234,179,8,.35)}
.planTabIcon{width:1.75rem;height:1.75rem;color:#ca8a04;margin-bottom:.15rem}
.planTab.active .planTabIcon{color:#111827}
.planTabName{font-size:.9375rem;font-weight:700}
.planTabCaption{font-size:.75rem;color:#6b7280}
.planTab.active .planTabCaption{color:#3f3f46}
.planTabDesc{display:none;text-align:center;font-size:.9375rem;font-weight:600;color:#374151;margin:1rem 0 1.25rem}
.pricingShell[data-plan="single"] .planTabDesc[data-for="single"],
.pricingShell[data-plan="team"] .planTabDesc[data-for="team"],
.pricingShell[data-plan="enterprise"] .planTabDesc[data-for="enterprise"]{display:block}

/* ── 2) Ödeme dönemi ── */
.periodWrap{max-width:30rem;margin:0 auto 1.75rem}
.pricingShell[data-plan="enterprise"] .periodWrap{display:none}
.periodToggle{display:flex;gap:.25rem;background:#fff;border:1px solid #f3f4f6;border-radius:1rem;padding:.3rem;box-shadow:0 1px 3px rgba(0,0,0,.05)}
.periodBtn{position:relative;flex:1;display:flex;flex-direction:column;align-items:center;gap:.1rem;padding:.6rem .75rem;border:none;border-radius:.625rem;background:transparent;color:#6b7280;cursor:pointer;font:inherit;transition:background .2s,color .2s}
.periodBtn:hover{color:#111827}
.periodBtn.active{background:#1f2937;color:#fff;box-shadow:0 4px 12px rgba(31,41,55,.25)}
.periodName{font-size:.9375rem;font-weight:700}
.periodCaption{font-size:.7rem;color:#9ca3af}
.periodBtn.active .periodCaption{color:#d1d5db}
.periodBadge{position:absolute;top:-.7rem;right:.6rem;padding:.15rem .5rem;border-radius:.3rem;background:#eab308;color:#000;font-size:.65rem;font-weight:800;letter-spacing:.02em;box-shadow:0 2px 6px rgba(0,0,0,.12)}
.periodNote{text-align:center;font-size:.8125rem;color:#6b7280;margin-top:.75rem}
.pricingShell[data-period="monthly"] .onlyAnnual{display:none !important}
.pricingShell[data-period="annual"] .onlyMonthly{display:none !important}

/* ── 3) Paneller ── */
.planPanel{display:none}
.pricingShell[data-plan="single"] .planPanel[data-plan="single"],
.pricingShell[data-plan="team"] .planPanel[data-plan="team"],
.pricingShell[data-plan="enterprise"] .planPanel[data-plan="enterprise"]{display:block}
.planRow{display:grid;grid-template-columns:1.15fr 1fr;gap:1.25rem;align-items:stretch}

/* Fiyat kartı (koyu) */
.priceCard{position:relative;background:#1f2937;color:#fff;border-radius:1.25rem;padding:1.75rem;box-shadow:0 20px 25px -5px rgba(0,0,0,.12);display:flex;flex-direction:column}
.priceCardTag{align-self:flex-start;padding:.25rem .7rem;border-radius:.375rem;background:#eab308;color:#000;font-size:.75rem;font-weight:700}
.priceCardTitle{font-size:1.375rem;font-weight:800;margin:.85rem 0 .25rem;color:#fff}
.priceCardSub{font-size:.875rem;color:#9ca3af;margin-bottom:1.25rem}
.priceLine{display:flex;align-items:baseline;gap:.5rem;flex-wrap:wrap}
.oldPrice{font-size:1rem;font-weight:600;color:#9ca3af;text-decoration:line-through;text-decoration-color:#eab308;text-decoration-thickness:2px}
.bigPrice{font-size:2.5rem;font-weight:800;line-height:1.05;color:#facc15}
.perMonth{font-size:1rem;color:#9ca3af}
.breakdown{font-size:.8125rem;color:#9ca3af;margin-top:.35rem}
.yearNote{font-size:.875rem;color:#d1d5db;margin-top:.5rem}
.yearNote strong{color:#fff}
.yearNote .muted{color:#9ca3af;font-size:.8125rem}
.saveChip{display:inline-block;align-self:flex-start;margin-top:.75rem;padding:.3rem .7rem;border-radius:.375rem;background:rgba(234,179,8,.15);color:#facc15;font-size:.75rem;font-weight:700}
/* CTA: sitenin .btn-primary sarı düğme stiliyle aynı (yumuşak köşe, sarı gölge) */
.priceCta{display:block;text-align:center;margin-top:1.5rem;padding:1rem 1.5rem;border-radius:1rem;font-size:1rem;font-weight:700;background:linear-gradient(135deg,#facc15,#eab308);box-shadow:0 10px 25px -5px rgba(234,179,8,.3);transition:all .2s}
.priceCta:hover{background:linear-gradient(135deg,#facc15,#eab308);box-shadow:0 20px 25px -5px rgba(234,179,8,.4);transform:scale(1.03)}
.ctaNote{text-align:center;font-size:.75rem;color:#9ca3af;margin-top:.6rem}

/* Ekip: kişi sayısı seçici */
.seatPicker{display:flex;align-items:center;justify-content:space-between;gap:.75rem;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:.75rem;padding:.6rem .9rem;margin-bottom:1rem}
.seatLabel{font-size:.875rem;color:#d1d5db}
.seatControls{display:flex;align-items:center;gap:.5rem}
.seatBtn{width:2rem;height:2rem;border-radius:.5rem;border:none;background:#374151;color:#fff;font-size:1.125rem;font-weight:700;cursor:pointer;line-height:1;transition:background .15s}
.seatBtn:hover{background:#4b5563}
.seatBtn:disabled{opacity:.35;cursor:not-allowed}
.seatValue{min-width:4.5rem;text-align:center;font-weight:800;color:#facc15}

/* Pakete dahil (beyaz kart, site-style .feature-list üstüne) */
.includedCard{display:flex;flex-direction:column}
.includedTitle{font-size:.8125rem;font-weight:700;color:#6b7280;text-transform:uppercase;letter-spacing:.06em;margin:0 0 .5rem .25rem}
.includedList{flex:1;padding:1rem 1.5rem}
.includedList .feature-list-item{padding:.6rem 0}
.includedList .feature-list-item span{font-size:.875rem}

.pricingShell .plan-note{margin-top:1.5rem}

@media(max-width:899px){
  .planRow{grid-template-columns:1fr}
}
@media(max-width:479px){
  .pricingHead{margin-bottom:1.5rem}
  .planTabs{gap:.5rem}
  .planTab{padding:.85rem .4rem;border-radius:.875rem}
  .planTabIcon{width:1.5rem;height:1.5rem}
  .planTabName{font-size:.8125rem}
  .planTabCaption{font-size:.65rem}
  .planTabDesc{font-size:.875rem}
  .periodBtn{padding:.5rem .4rem}
  .periodName{font-size:.875rem}
  .periodBadge{right:.35rem;font-size:.6rem}
  .priceCard{padding:1.25rem;border-radius:1rem}
  .bigPrice{font-size:2.125rem}
  .includedList{padding:.75rem 1.1rem}
}