/* =====================================================================
   E-Dönüşüm sayfaları (bursa-e-fatura, e-donusum-kontor, bursa-e-imza-satin-al)
   bs-ortak.css üzerine kurulur · önek .sed-*
   ===================================================================== */

/* ---------- Hero ek parçaları ---------- */
.sed-hap { display: flex; flex-wrap: wrap; gap: 8px; margin: 22px 0 0; padding: 0; list-style: none; }
.sed-hap li { display: inline-flex; align-items: center; gap: 7px; padding: 8px 13px; border-radius: 999px; background: rgba(255,255,255,.85); border: 1px solid var(--bo-cizgi); font-size: 13.5px; font-weight: 700; color: var(--bo-lac); box-shadow: var(--bo-g1); }
.sed-hap .bi { color: var(--bo-kir); }
.sed-hero-rakam { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 30px; max-width: 520px; }
.sed-hero-rakam div { padding: 14px 16px; border-radius: 16px; background: #fff; border: 1px solid var(--bo-cizgi); box-shadow: var(--bo-g1); }
.sed-hero-rakam b { display: block; font: 800 clamp(20px, 2.4vw, 26px)/1.1 var(--bo-f-bas); color: var(--bo-lac); }
.sed-hero-rakam small { display: block; margin-top: 4px; font-size: 12.5px; font-weight: 600; color: var(--bo-yazi-3); }

/* ---------- İllüstrasyon animasyonları ---------- */
.sed-svg .sed-yuz { animation: sedYuz 6s ease-in-out infinite; transform-box: fill-box; }
.sed-svg .sed-yuz--2 { animation-delay: -2s; }
.sed-svg .sed-yuz--3 { animation-delay: -4s; }
.sed-svg .sed-nabiz { animation: sedNabiz 2.4s ease-in-out infinite; transform-box: fill-box; transform-origin: center; }
.sed-svg .sed-akis { stroke-dasharray: 6 8; animation: sedAkis 1.6s linear infinite; }
.sed-svg .sed-imza { stroke-dasharray: 260; stroke-dashoffset: 260; animation: sedImza 5s ease-in-out infinite; }
.sed-svg .sed-isik { animation: sedIsik 1.8s steps(2, jump-none) infinite; }
@keyframes sedYuz { 50% { transform: translateY(-9px); } }
@keyframes sedNabiz { 50% { transform: scale(1.12); opacity: .75; } }
@keyframes sedAkis { to { stroke-dashoffset: -28; } }
@keyframes sedImza { 0%, 10% { stroke-dashoffset: 260; } 55%, 85% { stroke-dashoffset: 0; } 100% { stroke-dashoffset: -260; } }
@keyframes sedIsik { 50% { opacity: .25; } }

/* ---------- Güven şeridi ---------- */
.sed-serit { position: relative; z-index: 2; margin-top: -26px; }
.sed-serit ul { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin: 0; padding: 14px; list-style: none; border-radius: 20px; background: rgba(255,255,255,.92); border: 1px solid var(--bo-cizgi); box-shadow: var(--bo-g2); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.sed-serit li { display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border-radius: 12px; background: var(--bo-zemin); font-size: 13.5px; font-weight: 700; color: var(--bo-lac); }
.sed-serit .bi { color: var(--bo-kir); }

/* ---------- Karşılaştırma tablosu ---------- */
.sed-tablo-kap { overflow-x: auto; -webkit-overflow-scrolling: touch; border-radius: var(--bo-r); background: #fff; border: 1px solid var(--bo-cizgi); box-shadow: var(--bo-g2); }
.sed-tablo { width: 100%; min-width: 620px; border-collapse: separate; border-spacing: 0; font-size: 15px; }
.sed-tablo caption { caption-side: bottom; padding: 12px 18px; font-size: 13px; color: var(--bo-yazi-3); text-align: left; }
.sed-tablo th, .sed-tablo td { padding: 15px 14px; text-align: center; border-bottom: 1px solid var(--bo-cizgi); }
.sed-tablo thead th { font: 700 14px/1.3 var(--bo-f-bas); color: var(--bo-lac); background: var(--bo-zemin); }
.sed-tablo tbody th { text-align: left; padding-left: 22px; font-weight: 700; color: var(--bo-lac); }
.sed-tablo tbody tr:last-child > * { border-bottom: 0; }
.sed-tablo tbody tr:hover > * { background: #f8faff; }
.sed-tablo .sed-onerilen { background: linear-gradient(180deg, rgba(225,37,27,.06), rgba(225,37,27,.02)); }
.sed-tablo thead .sed-onerilen { background: linear-gradient(180deg, var(--bo-kir), var(--bo-kir-2)); color: #fff; }
.sed-tablo thead .sed-onerilen small { display: block; margin-top: 3px; font: 700 11px/1 var(--bo-f-govde); letter-spacing: .08em; text-transform: uppercase; color: var(--bo-alt); }
.sed-var { color: #059669; font-size: 20px; }
.sed-yok { color: #b91c1c; font-size: 18px; opacity: .8; }

/* ---------- Sekmeler (Bootstrap pill davranışı korunur) ---------- */
.sed-sekmeler { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin: 0 auto 26px; padding: 6px; width: fit-content; max-width: 100%; list-style: none; border-radius: 18px; background: #fff; border: 1px solid var(--bo-cizgi); box-shadow: var(--bo-g1); }
.sed-sekmeler .nav-link { display: inline-flex; align-items: center; gap: 7px; min-height: 44px; padding: 0 18px; border: 0; border-radius: 13px; background: transparent; font: 700 14.5px/1 var(--bo-f-govde); color: var(--bo-yazi-2); transition: background .25s, color .25s, box-shadow .25s; }
.sed-sekmeler .nav-link:hover { color: var(--bo-lac); background: var(--bo-zemin); }
.sed-sekmeler .nav-link.active { color: #fff; background: linear-gradient(180deg, var(--bo-lac-2), var(--bo-lac)); box-shadow: 0 10px 20px -10px rgba(11,33,80,.6); }
.sed-sekmeler .nav-link.active .bi { color: var(--bo-alt); }
.sed-fiyat-alan { max-width: 820px; margin: 0 auto; }

/* ---------- Bilgi notu ---------- */
.sed-not { display: flex; gap: 14px; align-items: flex-start; margin-bottom: 18px; padding: 16px 18px; border-radius: 18px; background: #ecfdf5; border: 1px solid #a7f3d0; color: #065f46; font-size: 14.5px; line-height: 1.6; }
.sed-not > .bi { flex: none; display: grid; place-items: center; width: 42px; height: 42px; border-radius: 13px; background: #fff; font-size: 20px; color: #059669; box-shadow: var(--bo-g1); }
.sed-not h3 { margin: 0 0 2px; font-size: 16.5px; color: inherit; }
.sed-not p { margin: 0; }
.sed-not--mavi { background: #eef4ff; border-color: #cfdcf5; color: var(--bo-lac-2); }
.sed-not--mavi > .bi { color: var(--bo-lac-3); }
.sed-not--altin { background: #fffbeb; border-color: #fde68a; color: #854d0e; }
.sed-not--altin > .bi { color: #b45309; }

/* ---------- Fiyat tablosu ---------- */
.sed-fiyat { overflow: hidden; border-radius: var(--bo-r); background: #fff; border: 1px solid var(--bo-cizgi); box-shadow: var(--bo-g2); }
.sed-fiyat__kap { overflow-x: auto; }
.sed-fiyat table { width: 100%; border-collapse: collapse; font-size: 15px; }
.sed-fiyat thead th { padding: 14px 18px; text-align: left; font: 700 12.5px/1.2 var(--bo-f-govde); letter-spacing: .06em; text-transform: uppercase; color: rgba(226,234,252,.9); background: linear-gradient(160deg, var(--bo-lac-2), var(--bo-lac)); }
.sed-fiyat thead th:last-child, .sed-fiyat td:last-child { text-align: right; }
.sed-fiyat td { padding: 14px 18px; border-bottom: 1px solid var(--bo-cizgi); vertical-align: middle; }
.sed-fiyat tbody tr { transition: background .2s; }
.sed-fiyat tbody tr:hover { background: #f8faff; }
.sed-kontor { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 10px; background: var(--bo-zemin-2); font-weight: 800; color: var(--bo-lac); white-space: nowrap; }
.sed-birim { font-weight: 600; color: var(--bo-yazi-2); white-space: nowrap; }
.sed-tutar { font: 800 17px/1.2 var(--bo-f-bas); color: var(--bo-lac); white-space: nowrap; }
.sed-fiyat tr.sed-populer { background: linear-gradient(90deg, rgba(255,210,94,.28), rgba(255,210,94,.08)); }
.sed-fiyat tr.sed-populer .sed-kontor { background: var(--bo-alt); }
.sed-fiyat tr.sed-populer .sed-tutar { color: var(--bo-kir-2); }
.sed-populer-etiket { display: inline-flex; align-items: center; gap: 4px; margin-left: 6px; padding: 3px 8px; border-radius: 999px; background: var(--bo-kir); color: #fff; font-size: 11px; font-weight: 800; white-space: nowrap; }
.sed-fiyat__alt { padding: 16px; background: var(--bo-zemin); border-top: 1px solid var(--bo-cizgi); }

/* ---------- e-Defter kutusu ---------- */
.sed-edefter { position: relative; overflow: hidden; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 28px; align-items: center; padding: clamp(26px, 4.5vw, 48px); border-radius: 30px; color: #fff; box-shadow: var(--bo-g3);
  background: radial-gradient(500px 260px at 100% 0%, rgba(255,210,94,.22), transparent 60%), radial-gradient(600px 300px at 0% 100%, rgba(225,37,27,.3), transparent 60%), linear-gradient(150deg, #12306f, var(--bo-lac) 60%, #071838); }
.sed-edefter h2 { margin: 10px 0 8px; font-size: clamp(26px, 3.4vw, 38px); color: #fff; }
.sed-edefter p { margin: 0; color: rgba(226,234,252,.88); line-height: 1.65; }
.sed-edefter__rozet { display: inline-block; padding: 6px 12px; border-radius: 999px; background: var(--bo-alt); color: var(--bo-lac); font-size: 12.5px; font-weight: 800; }
.sed-edefter__dip { margin-top: 12px !important; font-size: 13.5px; color: #fde68a !important; }
.sed-edefter__fiyat { min-width: 240px; padding: 22px; text-align: center; border-radius: 22px; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.18); }
.sed-edefter__fiyat small { display: block; font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: rgba(226,234,252,.75); }
.sed-edefter__fiyat b { display: block; margin: 6px 0 2px; font: 800 44px/1 var(--bo-f-bas); color: #fff; }
.sed-edefter__fiyat b span { font-size: 22px; }
.sed-edefter__fiyat .bo-btn { margin-top: 14px; width: 100%; }

/* ---------- Paket kartları (e-imza) ---------- */
.sed-paketler { display: grid; gap: 20px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 270px), 1fr)); align-items: stretch; }
.sed-paket { padding: 30px 26px 26px; }
.sed-paket h3 { font-size: 19px; }
.sed-paket__fiyat { display: flex; align-items: flex-start; gap: 4px; margin: 6px 0 4px; font: 800 46px/1 var(--bo-f-bas); color: var(--bo-lac); letter-spacing: -.02em; }
.sed-paket__fiyat small { margin-top: 6px; font-size: 22px; color: var(--bo-kir); }
.sed-paket__sure { font-size: 13px; font-weight: 600; color: var(--bo-yazi-3); }
.sed-paket ul { display: grid; gap: 10px; margin: 20px 0 22px; padding: 18px 0 0; list-style: none; border-top: 1px dashed var(--bo-cizgi-2); }
.sed-paket li { display: flex; gap: 9px; align-items: flex-start; font-size: 14.5px; color: var(--bo-yazi-2); }
.sed-paket li .bi { flex: none; margin-top: 2px; color: #059669; }
.sed-paket__alt { margin-top: auto; }
.sed-paket__alt small { display: block; margin-top: 8px; text-align: center; font-size: 12.5px; color: var(--bo-yazi-3); }
.sed-paket--one { border: 2px solid var(--bo-kir); box-shadow: var(--bo-g3); }
.sed-paket__rozet { position: absolute; top: -13px; left: 50%; translate: -50% 0; padding: 6px 14px; border-radius: 999px; background: linear-gradient(180deg, #f0352a, var(--bo-kir-2)); color: #fff; font-size: 12px; font-weight: 800; letter-spacing: .04em; white-space: nowrap; box-shadow: 0 10px 20px -10px rgba(225,37,27,.8); }

/* ---------- Rehber kartları ---------- */
.sed-rehber h3 { display: flex; align-items: center; gap: 10px; margin: 0 0 10px; font-size: 19px; }
.sed-rehber h3 .bi { flex: none; display: grid; place-items: center; width: 38px; height: 38px; border-radius: 12px; background: linear-gradient(145deg, #ff5a3c, var(--bo-kir)); color: #fff; font-size: 17px; }
.sed-rehber p + h3 { margin-top: 22px; }
.sed-rehber p { font-size: 15px; line-height: 1.75; }
.sed-rehber a { color: var(--bo-lac-2); font-weight: 700; text-underline-offset: 3px; }
.sed-rehber a:hover { color: var(--bo-kir-2); }

/* ---------- WhatsApp yüzen düğme ---------- */
.sed-wa { position: fixed; left: 18px; bottom: 18px; z-index: 1030; display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; background: #128c4a; color: #fff; font-size: 26px; text-decoration: none; box-shadow: 0 14px 30px -10px rgba(18,140,74,.75); transition: transform .25s var(--bo-ease); }
.sed-wa:hover { color: #fff; transform: translateY(-3px) scale(1.05); }
.sed-wa:focus-visible { outline: 3px solid var(--bo-lac); outline-offset: 3px; }

@media (max-width: 767.98px) {
  .sed-serit ul { gap: 6px; padding: 10px; }
  .sed-serit li { padding: 6px 10px; font-size: 12.5px; gap: 6px; }
  .sed-edefter { grid-template-columns: 1fr; text-align: center; }
  .sed-edefter__fiyat { min-width: 0; }
  .sed-fiyat thead th, .sed-fiyat td { padding: 12px 10px; }
  .sed-fiyat table { font-size: 14px; }
  .sed-tutar { font-size: 15.5px; }
  .sed-populer-etiket { margin: 6px 0 0; }
  .sed-kontor-hucre { display: flex; flex-direction: column; align-items: flex-start; }
  .sed-sekmeler { width: 100%; }
  .sed-sekmeler .nav-item { flex: 1 1 calc(50% - 8px); }
  .sed-sekmeler .nav-link { width: 100%; justify-content: center; padding: 0 10px; font-size: 13.5px; }
}
@media (max-width: 420px) {
  .sed-hero-rakam { gap: 8px; }
  .sed-hero-rakam div { padding: 12px 10px; }
  .sed-fiyat .sed-birim small { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .sed-svg *, .sed-wa { animation: none !important; transition: none !important; }
  .sed-svg .sed-imza { stroke-dashoffset: 0; }
}
