/* bilirkisiportal.net — styles.css stillerine ek bölümler */

.btn--block { display: flex; width: 100%; justify-content: center; }
[hidden] { display: none !important; }

/* ================= Canlı kullanım gösterimi (hero) ================= */
.canli { position: relative; margin: 0; border-radius: 18px; overflow: hidden; background: #f6f6f7; color: #18181b;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.08), 0 40px 80px -30px rgba(0, 0, 0, 0.8), 0 18px 36px -18px rgba(0, 0, 0, 0.6);
  font-size: 11px; line-height: 1.35; }
.canli__bar { display: flex; align-items: center; gap: 6px; height: 30px; padding: 0 12px; background: linear-gradient(180deg, #2a2c31, #1c1d21); }
.canli__bar > i { width: 9px; height: 9px; border-radius: 50%; background: rgba(255, 255, 255, 0.2); }
.canli__bar span { margin-left: 8px; font-size: 11px; color: #a1a1aa; }
.canli__live { margin-left: auto; display: inline-flex; align-items: center; gap: 6px; font-size: 10px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: #d4d4d8; }
.canli__live em { width: 7px; height: 7px; border-radius: 50%; background: #34d399; box-shadow: 0 0 0 0 rgba(52, 211, 153, 0.6); animation: demoNabiz 1.8s infinite; }
@keyframes demoNabiz { 70% { box-shadow: 0 0 0 7px rgba(52, 211, 153, 0); } 100% { box-shadow: 0 0 0 0 rgba(52, 211, 153, 0); } }

.canli__win { display: grid; grid-template-columns: 128px minmax(0, 1fr); height: 340px; }
.canli__side { display: flex; flex-direction: column; gap: 2px; padding: 10px 8px; color: #c4c6cc; background: linear-gradient(180deg, #34373e, #1b1c20); }
.canli__logo { display: block; padding: 2px 4px 10px; }
.canli__logo img { display: block; width: 92px; height: auto; }
.canli__nav { position: relative; display: flex; align-items: center; gap: 7px; padding: 6px 7px; border-radius: 7px; font-size: 10.5px; transition: background 0.35s, color 0.35s; }
.canli__nav svg { width: 12px; height: 12px; flex: 0 0 auto; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.canli__nav.is-on { color: #fff; background: rgba(255, 255, 255, 0.12); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1); }
.canli__badge { margin-left: auto; min-width: 15px; height: 15px; padding: 0 4px; border-radius: 8px; font-style: normal; font-size: 9px; font-weight: 700; line-height: 15px; text-align: center; color: #fff; background: #e11d48; }
.canli__user { margin-top: auto; display: flex; align-items: center; gap: 6px; padding: 8px 4px 0; border-top: 1px solid rgba(255, 255, 255, 0.08); font-size: 10px; }
.canli__user i { display: grid; place-items: center; width: 20px; height: 20px; border-radius: 50%; font-style: normal; font-size: 8.5px; font-weight: 700; color: #18181b; background: linear-gradient(180deg, #fff, #a9b0ba); }

.canli__main { position: relative; overflow: hidden; padding: 12px 14px; }
.canli__sc { position: absolute; inset: 12px 14px; display: flex; flex-direction: column; gap: 9px; opacity: 0; visibility: hidden; transform: translateY(8px); transition: opacity 0.45s ease, transform 0.45s ease, visibility 0s 0.45s; }
.canli__sc.is-on { opacity: 1; visibility: visible; transform: none; transition: opacity 0.45s ease, transform 0.45s ease, visibility 0s; }

.d-hello { display: grid; gap: 2px; padding: 10px 12px; border-radius: 10px; color: #f4f4f5; background: linear-gradient(160deg, #3a3d44, #1d1e22); }
.d-hello small { font-size: 8.5px; letter-spacing: 0.08em; color: #a1a1aa; }
.d-hello b { font-size: 13px; }
.d-hello span { font-size: 10px; color: #c8cacf; }
.d-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 7px; }
.d-kpi { display: grid; gap: 3px; padding: 8px 9px; border-radius: 9px; background: #fff; box-shadow: 0 0 0 1px rgba(24, 24, 27, 0.07); }
.d-kpi small { font-size: 8.5px; letter-spacing: 0.04em; text-transform: uppercase; color: #71717a; }
.d-kpi b { font-size: 15px; font-weight: 800; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
.d-chart { flex: 1; display: flex; flex-direction: column; gap: 6px; padding: 9px 10px; border-radius: 10px; background: #fff; box-shadow: 0 0 0 1px rgba(24, 24, 27, 0.07); }
.d-chart small { font-size: 9px; color: #71717a; }
.d-bars { flex: 1; display: flex; align-items: flex-end; gap: 9px; padding: 0 2px; }
.d-bars i { flex: 1; height: 0; border-radius: 4px 4px 2px 2px; background: linear-gradient(180deg, #6b7280, #34373e); transition: height 0.9s cubic-bezier(.2, .8, .2, 1); }
.d-bars i:last-child { background: linear-gradient(180deg, #34d399, #047857); }
.is-on .d-bars i { height: var(--h); }
.is-on .d-bars i:nth-child(2) { transition-delay: 0.08s; } .is-on .d-bars i:nth-child(3) { transition-delay: 0.16s; }
.is-on .d-bars i:nth-child(4) { transition-delay: 0.24s; } .is-on .d-bars i:nth-child(5) { transition-delay: 0.32s; } .is-on .d-bars i:nth-child(6) { transition-delay: 0.4s; }

.d-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.d-head b { font-size: 12.5px; }
.d-pill { display: inline-grid; padding: 2px 8px; border-radius: 999px; font-size: 9.5px; font-weight: 600; color: #3f3f46; background: rgba(24, 24, 27, 0.06); }
.d-pill--state em { grid-area: 1 / 1; font-style: normal; transition: opacity 0.3s; }
.d-pill--state .b { opacity: 0; color: #047857; }
.d-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.d-row { display: flex; align-items: center; gap: 8px; padding: 8px 9px; border-radius: 9px; background: #fff; box-shadow: 0 0 0 1px rgba(24, 24, 27, 0.07); }
.d-row > div { display: grid; gap: 1px; min-width: 0; flex: 1; }
.d-row b { font-size: 10.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.d-row small { font-size: 9px; color: #71717a; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.d-av { display: grid; place-items: center; width: 24px; height: 24px; flex: 0 0 auto; border-radius: 50%; font-size: 8.5px; font-weight: 700; color: #3f3f46; background: #e4e4e7; }
.d-chip { flex: 0 0 auto; padding: 2px 7px; border-radius: 999px; font-size: 8.5px; font-weight: 600; color: #b45309; background: rgba(245, 158, 11, 0.13); }
.d-chip--ok { color: #0369a1; background: rgba(14, 165, 233, 0.12); }
.d-chip--new { color: #be123c; background: rgba(244, 63, 94, 0.12); }
.d-row--new { box-shadow: 0 0 0 1px rgba(244, 63, 94, 0.3), 0 8px 18px -10px rgba(244, 63, 94, 0.45); }
.is-on .d-row--new { animation: dGir 0.6s cubic-bezier(.2, .8, .2, 1) 0.35s both; }
@keyframes dGir { from { opacity: 0; transform: translateY(-14px) scale(0.97); } }
.d-actions { display: flex; justify-content: flex-end; gap: 6px; }
.d-btn { display: inline-flex; align-items: center; height: 26px; padding: 0 12px; border-radius: 7px; font-size: 10px; font-weight: 600; }
.d-btn--ghost { color: #3f3f46; background: #fff; box-shadow: 0 0 0 1px rgba(24, 24, 27, 0.1); }
.d-btn--dark { color: #fff; background: linear-gradient(160deg, #4a4e57, #23252a); }
.is-on .d-press { animation: dBas 0.35s ease 2.1s both; }
.is-on .d-press--late { animation-delay: 1.9s; }
@keyframes dBas { 50% { transform: scale(0.93); filter: brightness(1.25); } }
.d-toast { position: absolute; left: 0; right: 0; bottom: 0; display: flex; align-items: center; gap: 9px; padding: 9px 11px; border-radius: 10px; color: #f4f4f5; background: #18181b; box-shadow: 0 14px 30px -12px rgba(0, 0, 0, 0.6); opacity: 0; transform: translateY(12px); }
.d-toast svg { width: 16px; height: 16px; flex: 0 0 auto; fill: none; stroke: #34d399; stroke-width: 2; }
.d-toast div { display: grid; gap: 1px; }
.d-toast b { font-size: 10.5px; }
.d-toast small { font-size: 9px; color: #a1a1aa; }
.is-on .d-toast { animation: dToast 0.45s cubic-bezier(.2, .8, .2, 1) 2.5s both; }
@keyframes dToast { to { opacity: 1; transform: none; } }

.d-file { display: flex; align-items: center; gap: 9px; padding: 10px; border-radius: 10px; background: #fff; box-shadow: 0 0 0 1px rgba(24, 24, 27, 0.07); }
.d-file > div { display: grid; gap: 1px; flex: 1; }
.d-file b { font-size: 11px; }
.d-file small { font-size: 9px; color: #71717a; }
.d-file__ic { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 8px; color: #fff; background: linear-gradient(160deg, #4a4e57, #23252a); }
.d-file__ic svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2; }
.d-file__pct { font-size: 11px; font-weight: 700; font-variant-numeric: tabular-nums; }
.d-prog { height: 6px; border-radius: 99px; overflow: hidden; background: rgba(24, 24, 27, 0.08); }
.d-prog i { display: block; width: 0; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #6b7280, #18181b); }
.is-on .d-prog i { animation: dYuk 2.2s cubic-bezier(.4, 0, .2, 1) 0.3s forwards; }
@keyframes dYuk { to { width: 100%; background: linear-gradient(90deg, #10b981, #047857); } }
.d-hash { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.d-hash div { display: grid; gap: 2px; padding: 7px 8px; border-radius: 8px; background: #fff; box-shadow: 0 0 0 1px rgba(24, 24, 27, 0.07); opacity: 0; }
.d-hash small { font-size: 8.5px; color: #71717a; }
.d-hash code { font: 600 9.5px/1.2 ui-monospace, "SF Mono", Menlo, monospace; color: #27272a; }
.is-on .d-hash div { animation: dBelir 0.4s ease forwards; }
.is-on .d-hash div:nth-child(1) { animation-delay: 1.2s; } .is-on .d-hash div:nth-child(2) { animation-delay: 2.6s; }
.is-on .d-hash div:nth-child(3) { animation-delay: 1.5s; } .is-on .d-hash div:nth-child(4) { animation-delay: 2.8s; }
@keyframes dBelir { to { opacity: 1; } }
.d-match { display: flex; align-items: center; gap: 7px; padding: 8px 10px; border-radius: 9px; font-size: 10.5px; font-weight: 600; color: #047857; background: rgba(16, 185, 129, 0.12); box-shadow: inset 0 0 0 1px rgba(16, 185, 129, 0.3); opacity: 0; }
.d-match svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2.6; }
.is-on .d-match { animation: dGir 0.5s cubic-bezier(.2, .8, .2, 1) 3.1s both; }

.d-pay { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.d-pay > div { display: grid; gap: 2px; padding: 8px 9px; border-radius: 9px; background: #fff; box-shadow: 0 0 0 1px rgba(24, 24, 27, 0.07); }
.d-pay small { font-size: 8.5px; color: #71717a; }
.d-pay b { font-size: 11.5px; font-variant-numeric: tabular-nums; }
.d-pay .is-net { background: linear-gradient(160deg, #ecfdf5, #fff); }
.d-pay .is-net b { color: #047857; }
.d-pay__dk { grid-column: 1 / -1; display: flex !important; align-items: center; gap: 6px; font-size: 10px; color: #3f3f46; }
.d-pay__dk svg { width: 13px; height: 13px; fill: none; stroke: currentColor; stroke-width: 2; }
.is-on .d-pill--state .a { animation: dSon 0.3s ease 2.3s forwards; }
.is-on .d-pill--state .b { animation: dBelir 0.3s ease 2.3s forwards; }
@keyframes dSon { to { opacity: 0; } }
.d-fin { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; margin-top: auto; }
.d-fin div { display: grid; gap: 2px; padding: 9px 10px; border-radius: 9px; color: #f4f4f5; background: linear-gradient(160deg, #3a3d44, #1d1e22); }
.d-fin small { font-size: 8.5px; color: #a1a1aa; text-transform: uppercase; letter-spacing: 0.05em; }
.d-fin b { font-size: 13px; font-weight: 800; font-variant-numeric: tabular-nums; }
.d-fin div:last-child b { color: #6ee7b7; }

.canli__cursor { position: absolute; left: 70%; top: 105%; z-index: 3; width: 18px; height: 18px; pointer-events: none; transition: left 0.9s cubic-bezier(.4, 0, .2, 1), top 0.9s cubic-bezier(.4, 0, .2, 1), opacity 0.3s; opacity: 0; }
.canli__cursor svg { width: 100%; height: 100%; fill: #18181b; stroke: #fff; stroke-width: 1.4; stroke-linejoin: round; filter: drop-shadow(0 2px 3px rgba(0, 0, 0, 0.35)); }

.canli__steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; background: rgba(24, 24, 27, 0.08); border-top: 1px solid rgba(24, 24, 27, 0.08); }
.canli__steps button { position: relative; display: flex; align-items: center; justify-content: center; gap: 6px; height: 34px; padding: 0 6px; border: 0; font: 600 10.5px/1 var(--font); color: #71717a; background: #fafafa; cursor: pointer; overflow: hidden; }
.canli__steps button i { position: absolute; left: 0; bottom: 0; height: 2px; width: 0; background: #18181b; }
.canli__steps button.is-on { color: #18181b; background: #fff; }
.canli__steps button.is-on i { animation: dSure var(--sure, 6s) linear forwards; }
.canli.is-paused .canli__steps button.is-on i { animation-play-state: paused; }
@keyframes dSure { to { width: 100%; } }
.canli__steps button:focus-visible { outline: 2px solid #18181b; outline-offset: -2px; }

@media (prefers-reduced-motion: reduce) {
  .canli *, .canli *::before { animation: none !important; transition: none !important; }
  .d-toast, .d-hash div, .d-match, .d-row--new { opacity: 1 !important; transform: none !important; }
  .is-on .d-bars i { height: var(--h); }
  .d-prog i { width: 100%; }
}

/* ================= Özellikler: otomatik ilerleyen sekmeler ================= */
.svc-tab { position: relative; overflow: hidden; }
.svc-tab__sure { position: absolute; left: 0; bottom: 0; height: 3px; width: 0; border-radius: 0 3px 0 0; background: linear-gradient(90deg, #a9b0ba, #ffffff); opacity: 0.85; }
.services.is-oto .svc-tab[aria-selected="true"] .svc-tab__sure { animation: dSure var(--oto, 8s) linear forwards; }
.services.is-oto.is-durdu .svc-tab[aria-selected="true"] .svc-tab__sure { animation-play-state: paused; }
.services.is-tabbed .service.is-active > * { animation: svcGir 0.6s cubic-bezier(.2, .8, .2, 1) both; }
.services.is-tabbed .service.is-active > :nth-child(3) { animation-delay: 0.06s; }
.services.is-tabbed .service.is-active > :nth-child(4) { animation-delay: 0.12s; }
@keyframes svcGir { from { opacity: 0; transform: translateY(10px); } }
@media (prefers-reduced-motion: reduce) { .services.is-tabbed .service.is-active > * { animation: none; } .svc-tab__sure { display: none; } }

/* Ekran görüntüsü: üstteki kartla aynı genişlikte */
.shot { margin: 0; border-radius: 16px; overflow: hidden; background: #fff; box-shadow: 0 0 0 1px var(--glass-border), 0 30px 60px -24px rgba(9, 9, 11, 0.45), 0 12px 24px -12px rgba(9, 9, 11, 0.25); }
.shot__bar { display: flex; align-items: center; gap: 7px; height: 32px; padding: 0 12px; background: linear-gradient(180deg, #2a2c31, #1d1e22); }
.shot__bar i { width: 10px; height: 10px; border-radius: 50%; background: rgba(255, 255, 255, 0.22); }
.shot__bar span { margin-left: 8px; font-size: 12px; color: #a1a1aa; }
.shot img { display: block; width: 100%; height: auto; }
.shot--genis { margin-top: 24px; }

/* ================= Nasıl başlanır: animasyonlu yol ================= */
.yol { position: relative; margin-top: 8px; }
.yol__ray { position: absolute; left: 10%; right: 10%; top: 28px; height: 3px; border-radius: 3px; background: rgba(24, 24, 27, 0.1); }
.yol__ray i { display: block; height: 100%; width: var(--p, 0%); border-radius: inherit; background: linear-gradient(90deg, #4a4e57, #18181b); transition: width 0.9s cubic-bezier(.4, 0, .2, 1), height 0.9s cubic-bezier(.4, 0, .2, 1); }
.yol__adimlar { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 16px; }
.yol__adim { position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; opacity: 0.6; transition: opacity 0.4s; }
.yol__adim.is-gecti, .yol__adim.is-simdi { opacity: 1; }
.yol__ic { position: relative; z-index: 1; display: grid; place-items: center; width: 58px; height: 58px; border-radius: 18px; color: #71717a; background: #fff; box-shadow: 0 0 0 1px var(--glass-border), var(--glass-shadow); transition: color 0.4s, background 0.4s, box-shadow 0.4s, transform 0.4s; }
.yol__ic svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.yol__adim.is-gecti .yol__ic, .yol__adim.is-simdi .yol__ic { color: #f4f4f5; background: var(--brushed), var(--graphite-grad); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14), 0 14px 28px -14px rgba(9, 9, 11, 0.7); }
.yol__adim.is-simdi .yol__ic { transform: translateY(-4px) scale(1.06); }
.yol__adim.is-simdi .yol__ic::after { content: ""; position: absolute; inset: -6px; border-radius: 22px; border: 2px solid rgba(74, 78, 87, 0.35); animation: yolHalka 1.6s ease-out infinite; }
@keyframes yolHalka { from { opacity: 1; transform: scale(0.92); } to { opacity: 0; transform: scale(1.18); } }
.yol__no { margin-top: 16px; font-size: 0.72rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--muted); }
.yol__adim h3 { margin: 4px 0 8px; font-size: 1.08rem; }
.yol__adim p { margin: 0; font-size: 0.88rem; line-height: 1.55; color: var(--text-soft); }
.yol__adim a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
.yol__sure { margin-top: 12px; padding: 4px 10px; border-radius: 999px; font-size: 0.74rem; font-weight: 600; color: var(--graphite-2); background: rgba(24, 24, 27, 0.05); transition: background 0.4s, color 0.4s; }
.yol__adim.is-simdi .yol__sure { color: #fff; background: var(--graphite-2); }
@media (prefers-reduced-motion: reduce) {
  .yol__adim { opacity: 1; } .yol__ray i { --p: 100% !important; transition: none; } .yol__adim.is-simdi .yol__ic::after { display: none; }
}

/* Güvenlik: tek satırda dört kart */
.assure--4 { margin-top: 36px; grid-template-columns: repeat(4, minmax(0, 1fr)); }

/* ================= Fiyat: iki plan ================= */
.fiyat { margin-top: 8px; display: grid; grid-template-columns: repeat(2, minmax(0, 400px)); justify-content: center; gap: 24px; align-items: stretch; }
.fiyat__kart { position: relative; display: flex; flex-direction: column; padding: 32px 30px 28px; border-radius: var(--radius-lg); background: var(--glass-bg-strong); box-shadow: var(--glass-shadow), 0 0 0 1px var(--glass-border); }
.fiyat__kart--one { color: #f4f4f5; background: var(--brushed), var(--graphite-deep-grad); box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.08), 0 30px 60px -28px rgba(9, 9, 11, 0.8); }
.fiyat__rozet { position: absolute; top: -13px; left: 30px; padding: 5px 12px; border-radius: 999px; font-size: 0.74rem; font-weight: 700; color: #052e1f; background: linear-gradient(180deg, #a7f3d0, #34d399); box-shadow: 0 8px 18px -8px rgba(16, 185, 129, 0.7); }
.fiyat__ad { margin: 0; font-weight: 700; font-size: 0.95rem; letter-spacing: 0.04em; text-transform: uppercase; color: var(--muted); }
.fiyat__kart--one .fiyat__ad { color: #a1a1aa; }
.fiyat__tutar { margin: 10px 0 6px; display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.fiyat__tutar b { font-size: 3rem; font-weight: 800; letter-spacing: -0.03em; line-height: 1; color: transparent; background: linear-gradient(180deg, #34373e, #09090b); -webkit-background-clip: text; background-clip: text; }
.fiyat__kart--one .fiyat__tutar b { background: var(--silver-grad); -webkit-background-clip: text; background-clip: text; }
.fiyat__tutar span { color: var(--muted); font-weight: 500; }
.fiyat__kart--one .fiyat__tutar span { color: #a1a1aa; }
.fiyat__alt { margin: 0 0 20px; font-size: 0.88rem; color: var(--text-soft); min-height: 2.6em; }
.fiyat__kart--one .fiyat__alt { color: #c8cacf; }
.fiyat__liste { list-style: none; margin: 0 0 26px; padding: 18px 0 0; display: grid; gap: 11px; border-top: 1px solid var(--border); flex: 1; align-content: start; }
.fiyat__kart--one .fiyat__liste { border-top-color: rgba(255, 255, 255, 0.1); }
.fiyat__liste li { display: flex; gap: 10px; align-items: flex-start; font-size: 0.94rem; color: var(--text-soft); }
.fiyat__kart--one .fiyat__liste li { color: #e4e4e7; }
.fiyat__liste svg { flex: 0 0 auto; margin-top: 3px; fill: none; stroke: var(--ok); stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }
.fiyat__kart--one .fiyat__liste svg { stroke: var(--ok-on-dark); }
.fiyat__kart--one .btn--dark { color: var(--graphite-4); background: var(--silver-grad); border-color: rgba(255, 255, 255, 0.7); }
.fiyat__not { max-width: 824px; margin: 22px auto 0; font-size: 0.84rem; color: var(--muted); line-height: 1.6; text-align: center; }

/* ================= İndir ================= */
.indir__ana { padding: 28px; border-radius: var(--radius-lg); background: var(--glass-bg-strong); box-shadow: var(--glass-shadow), 0 0 0 1px var(--glass-border); }
.indir__bas { display: flex; align-items: center; gap: 16px; padding-bottom: 20px; margin-bottom: 20px; border-bottom: 1px solid var(--border); }
.indir__bas h3 { margin: 0 0 3px; font-size: 1.2rem; }
.indir__bas p { margin: 0; font-size: 0.84rem; color: var(--muted); }
.indir__os { display: inline-grid; place-items: center; width: 52px; height: 52px; flex: 0 0 auto; border-radius: 15px; color: #f4f4f5; background: var(--brushed), var(--graphite-grad); box-shadow: 0 12px 24px -12px rgba(9, 9, 11, 0.7); }
.indir__os svg { fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.indir__os--soluk { width: 42px; height: 42px; border-radius: 12px; color: var(--muted); background: rgba(24, 24, 27, 0.06); box-shadow: none; }
.indir__alanlar { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-bottom: 14px; }
.indir__hata { margin: 0 0 14px; padding: 10px 12px; border-radius: 10px; font-size: 0.86rem; color: #9f1239; background: rgba(244, 63, 94, 0.08); border: 1px solid rgba(244, 63, 94, 0.25); }
/* Lisans yok / geçersiz uyarısı (2026-10-19): hata değil, yönlendiren bilgi kartı */
.indir__yok { display: flex; gap: 14px; margin: 0 0 14px; padding: 16px; border-radius: 14px; background: rgba(24, 24, 27, 0.04); border: 1px solid var(--border); }
.indir__yok-ikon { display: inline-grid; place-items: center; width: 40px; height: 40px; flex: 0 0 auto; border-radius: 12px; color: #f4f4f5; background: var(--brushed), var(--graphite-grad); }
.indir__yok-ikon svg { fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.indir__yok h4 { margin: 2px 0 4px; font-size: 0.98rem; }
.indir__yok p { margin: 0; font-size: 0.86rem; line-height: 1.55; color: var(--text-soft); }
.indir__yok-eylem { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; margin-top: 12px; }
.indir__yok-eylem .btn { padding: 9px 16px; font-size: 0.85rem; }
.indir__yok-bag { font-size: 0.85rem; font-weight: 600; color: var(--graphite-2); text-decoration: underline; text-underline-offset: 3px; }
.indir__ipucu { margin: 14px 0 0; font-size: 0.8rem; color: var(--muted); line-height: 1.55; }
.indir__ipucu a { color: var(--graphite-2); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
.indir__ok { display: flex; align-items: center; gap: 8px; margin: 0 0 14px; padding: 10px 12px; border-radius: 10px; font-size: 0.88rem; color: var(--ok); background: var(--ok-bg); }
.indir__ok svg { fill: none; stroke: currentColor; stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
.indir__kunye { margin: 16px 0 0; display: grid; gap: 8px; font-size: 0.82rem; }
.indir__kunye div { display: grid; grid-template-columns: 70px minmax(0, 1fr); gap: 10px; align-items: start; }
.indir__kunye dt { color: var(--muted); }
.indir__kunye dd { margin: 0; display: flex; align-items: flex-start; gap: 8px; color: var(--text-soft); }
.indir__kunye code { word-break: break-all; font-size: 0.74rem; line-height: 1.5; }
.indir__kopya { flex: 0 0 auto; padding: 3px 9px; border-radius: 7px; border: 1px solid var(--border); font: 600 0.72rem/1.4 var(--font); color: var(--graphite-2); background: #fff; cursor: pointer; }
.indir__kur h3 { margin: 0 0 14px; font-size: 1.02rem; }
.indir__kur ol { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.indir__kur li { display: grid; grid-template-columns: 26px minmax(0, 1fr); gap: 12px; align-items: start; }
.indir__kur li span { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 8px; font-size: 0.78rem; font-weight: 700; color: var(--graphite-2); background: #fff; box-shadow: 0 0 0 1px var(--glass-border); }
.indir__kur li p { margin: 3px 0 0; font-size: 0.88rem; line-height: 1.55; color: var(--text-soft); }
.indir__not { margin: 16px 0 0; padding-top: 14px; border-top: 1px dashed var(--border); font-size: 0.8rem; color: var(--muted); line-height: 1.55; }

/* Açık zemin form alanları (indirme + soru formu) */
.cs-f { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.cs-f > span { font-size: 0.8rem; font-weight: 600; color: var(--text-soft); }
.cs-f input, .cs-f select, .cs-f textarea { width: 100%; min-height: 44px; padding: 10px 12px; border-radius: 11px; border: 1px solid var(--border); font: 400 0.92rem/1.4 var(--font); color: var(--text); background: #fff; transition: border-color 0.15s, box-shadow 0.15s; }
.cs-f textarea { resize: vertical; min-height: 96px; }
.cs-f select { -webkit-appearance: none; appearance: none; padding-right: 36px; cursor: pointer;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2371717a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 12px center / 16px; }
.cs-f input:focus, .cs-f select:focus, .cs-f textarea:focus { outline: none; border-color: #52525b; box-shadow: 0 0 0 3px rgba(82, 82, 91, 0.15); }
.cs-f [aria-invalid="true"] { border-color: rgba(225, 29, 72, 0.6); }
.cs-f__err { font-size: 0.76rem; color: #be123c; }
.cs-f__err:empty { display: none; }

/* Kapanış çağrısı: tek sütun + diğer siteye geçiş kartı */
.cta--tek { grid-template-columns: minmax(0, 1fr); }
.cta--tek .cta__side { flex-direction: row; align-items: center; justify-content: space-between; gap: 32px; }
.cta--tek .cta__copy h2 { margin-bottom: 8px; }
.gecis { display: flex; align-items: center; gap: 16px; margin-top: 18px; padding: 18px 22px; border-radius: 18px; background: var(--glass-bg-strong); box-shadow: var(--glass-shadow), 0 0 0 1px var(--glass-border); transition: transform 0.16s, box-shadow 0.16s; }
.gecis:hover { transform: translateY(-2px); box-shadow: var(--glass-shadow-hover), 0 0 0 1px var(--glass-border); }
.gecis__ic { display: grid; place-items: center; width: 44px; height: 44px; flex: 0 0 auto; border-radius: 13px; color: #f4f4f5; background: var(--brushed), var(--graphite-grad); }
.gecis__ic svg, .gecis__ok svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.gecis__metin { display: grid; gap: 2px; flex: 1; min-width: 0; }
.gecis__metin b { font-size: 1rem; color: var(--text); }
.gecis__metin small { font-size: 0.86rem; color: var(--muted); }
.gecis__ok { display: grid; place-items: center; width: 36px; height: 36px; flex: 0 0 auto; border-radius: 50%; color: var(--graphite-2); background: rgba(24, 24, 27, 0.06); transition: transform 0.16s; }
.gecis:hover .gecis__ok { transform: translateX(3px); }

@media (max-width: 1020px) {
  .assure--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  }
@media (max-width: 900px) {
  .cta--tek .cta__side { flex-direction: column; align-items: flex-start; }
  .canli__win { height: 320px; }
}
@media (max-width: 860px) {
  .yol__ray { left: 27px; right: auto; top: 10px; bottom: 10px; width: 3px; height: auto; }
  .yol__ray i { width: 100%; height: var(--p, 0%); background: linear-gradient(180deg, #4a4e57, #18181b); }
  .yol__adimlar { grid-template-columns: minmax(0, 1fr); gap: 22px; }
  .yol__adim { display: grid; grid-template-columns: 58px minmax(0, 1fr); column-gap: 16px; align-items: start; text-align: left; }
  .yol__ic { grid-row: 1 / span 4; }
  .yol__no { margin-top: 2px; }
  .yol__sure { justify-self: start; }
  .fiyat { grid-template-columns: minmax(0, 1fr); gap: 30px; }
}
@media (max-width: 640px) {
  .canli__win { grid-template-columns: minmax(0, 1fr); }
  .canli__side { display: none; }
  .canli__steps button { font-size: 9.5px; }
  .indir__ana { padding: 20px; }
  .fiyat__kart { padding: 28px 22px 22px; }
  .fiyat__tutar b { font-size: 2.5rem; }
  .gecis { padding: 16px; }
}

/* Hero: gösterim penceresine daha çok yer; alttaki güven şeridiyle çakışmasın */
@media (min-width: 901px) {
  .hero__inner { grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr); gap: 48px; padding-bottom: 128px; }
  .hero__title { font-size: clamp(2.2rem, 3.6vw, 3.1rem); }
}
.d-pill, .d-kpi b, .d-pay b, .d-fin b, .d-head b { white-space: nowrap; }
.d-head b { overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.d-fin { margin-top: 2px; }
.d-chart { justify-content: flex-start; }
.d-bars { flex: none; height: 118px; }
@media (max-width: 900px) { .d-bars { height: 104px; } }
.d-bars i:nth-child(1) { --h: 38%; } .d-bars i:nth-child(2) { --h: 52%; } .d-bars i:nth-child(3) { --h: 45%; }
.d-bars i:nth-child(4) { --h: 68%; } .d-bars i:nth-child(5) { --h: 61%; } .d-bars i:nth-child(6) { --h: 86%; }

/* ================= İndir: iki eşit kart ================= */
.indir { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; align-items: stretch; }
.indir__ana { display: flex; flex-direction: column; }
.indir__ana > form, .indir__ana > .indir__hazir { flex: 1; }
.indir__kur { display: flex; flex-direction: column; padding: 28px; border-radius: var(--radius-lg); background: var(--glass-bg-strong); box-shadow: var(--glass-shadow), 0 0 0 1px var(--glass-border); }
.indir__kur h3 { margin: 0 0 18px; padding-bottom: 18px; border-bottom: 1px solid var(--border); font-size: 1.2rem; }
.indir__kur ol { flex: 1; align-content: start; }
.indir__kur .indir__not { margin-top: 18px; }
/* İşletim sistemi seçici (2026-10-19); gizli platform bloğu flex/grid sınıflarına rağmen gizli kalsın */
[data-plat-goster][hidden] { display: none !important; }
.indir__plat { display: inline-grid; grid-template-columns: 1fr 1fr; gap: 4px; margin-bottom: 18px; padding: 4px; border-radius: 12px; background: rgba(24, 24, 27, 0.06); }
.indir__plat button { padding: 7px 18px; border: 0; border-radius: 9px; background: none; font: inherit; font-size: 0.86rem; font-weight: 600; color: var(--muted); cursor: pointer; }
.indir__plat button[aria-checked="true"] { color: var(--text); background: #fff; box-shadow: 0 1px 2px rgba(24, 24, 27, 0.08), 0 0 0 1px var(--glass-border); }
.indir__plat button:focus-visible { outline: 2px solid var(--graphite-1); outline-offset: 2px; }
.indir__win { display: flex; align-items: center; gap: 12px; margin-top: 20px; padding-top: 18px; border-top: 1px solid var(--border); }
.indir__win div { display: grid; gap: 2px; flex: 1; min-width: 0; }
.indir__win b { font-size: 0.9rem; }
.indir__win small { font-size: 0.78rem; color: var(--muted); }
.indir__yakinda { flex: 0 0 auto; padding: 4px 10px; border-radius: 999px; font-size: 0.74rem; font-weight: 600; color: var(--muted); border: 1px dashed var(--border); }

/* ================= SSS ================= */
.sss__head { max-width: 760px; }
.sss__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 20px; align-items: start; }
.sss__grid .faq { gap: 12px; }
.sss__grid .faq__item p { text-align: justify; }

/* Soru paneli: koyu, tam genişlik — solda tanıtım, sağda form */
.soru { position: relative; overflow: hidden; display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.5fr); gap: 48px; margin-top: 56px; padding: 44px 48px;
  border-radius: var(--radius-lg); color: #e4e4e7; background: var(--brushed), var(--graphite-deep-grad);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), 0 40px 80px -36px rgba(9, 9, 11, 0.8); }
.soru::before { content: ""; position: absolute; right: -10%; top: -40%; width: 60%; height: 120%; pointer-events: none; background: radial-gradient(closest-side, rgba(169, 176, 186, 0.14), transparent 70%); }
.soru > * { position: relative; }
.soru__ic { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 14px; color: #18181b; background: var(--silver-grad); box-shadow: inset 0 1px 0 #fff, 0 10px 24px -10px rgba(0, 0, 0, 0.7); }
.soru__ic svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.soru__tanit h3 { margin: 20px 0 10px; font-size: 1.6rem; font-weight: 800; letter-spacing: -0.02em; color: transparent; background: var(--silver-grad); -webkit-background-clip: text; background-clip: text; }
.soru__tanit > p { margin: 0 0 24px; font-size: 0.96rem; line-height: 1.65; color: #a1a1aa; }
.soru__bilgi { list-style: none; margin: 0; padding: 20px 0 0; display: grid; gap: 12px; border-top: 1px solid rgba(255, 255, 255, 0.08); }
.soru__bilgi li { display: flex; align-items: center; gap: 10px; font-size: 0.88rem; color: #c8cacf; }
.soru__bilgi svg { width: 16px; height: 16px; flex: 0 0 auto; fill: none; stroke: #a9b0ba; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.soru__bilgi a { color: #fff; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: rgba(255, 255, 255, 0.3); }
.soru__govde { display: grid; gap: 16px; }
.soru__iki { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.soru .cs-f > span { color: #d4d4d8; }
.soru .cs-f input, .soru .cs-f select, .soru .cs-f textarea { min-height: 48px; color: #f4f4f5; background-color: rgba(255, 255, 255, 0.05); border-color: rgba(255, 255, 255, 0.14); }
.soru .cs-f select { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23a1a1aa' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); }
.soru .cs-f select option { color: #18181b; }
.soru .cs-f textarea { min-height: 132px; }
.soru .cs-f input:hover, .soru .cs-f select:hover, .soru .cs-f textarea:hover { border-color: rgba(255, 255, 255, 0.24); }
.soru .cs-f input:focus, .soru .cs-f select:focus, .soru .cs-f textarea:focus { border-color: rgba(255, 255, 255, 0.5); background-color: rgba(255, 255, 255, 0.08); box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.08); }
.soru .cs-f [aria-invalid="true"] { border-color: rgba(251, 113, 133, 0.7); }
.soru .cs-f__err { color: #fda4af; }
.soru__tuzak { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.soru__alt { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-top: 4px; }
.soru__kvkk { margin: 0; max-width: 420px; font-size: 0.78rem; line-height: 1.55; color: #8b8f97; }
.soru__kvkk a { color: #d4d4d8; text-decoration: underline; text-underline-offset: 2px; }
.soru__alt .btn { flex: 0 0 auto; min-width: 160px; }
.soru__durum { margin: 0; padding: 10px 12px; border-radius: 10px; font-size: 0.86rem; color: #fecdd3; background: rgba(244, 63, 94, 0.12); border: 1px solid rgba(244, 63, 94, 0.3); }
.soru__tamam { display: grid; justify-items: center; align-content: center; gap: 8px; min-height: 100%; padding: 32px 8px; text-align: center; }
.soru__tamam h3 { margin: 8px 0 0; font-size: 1.3rem; color: #fff; }
.soru__tamam p { margin: 0; font-size: 0.94rem; color: #a1a1aa; }
.soru__tik { display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; color: #fff; background: linear-gradient(180deg, #34d399, #047857); box-shadow: 0 12px 28px -10px rgba(16, 185, 129, 0.7); }
.soru__tik svg { width: 26px; height: 26px; fill: none; stroke: currentColor; stroke-width: 2.8; stroke-linecap: round; stroke-linejoin: round; }

@media (max-width: 1020px) {
  .indir, .sss__grid { grid-template-columns: minmax(0, 1fr); }
  .soru { grid-template-columns: minmax(0, 1fr); gap: 32px; padding: 36px 32px; }
}
@media (max-width: 640px) {
  .assure--4, .indir__alanlar, .soru__iki { grid-template-columns: minmax(0, 1fr); }
  .soru { padding: 28px 20px; }
  .soru__alt { flex-direction: column; align-items: stretch; }
  .indir__kur { padding: 20px; }
}

/* Mağaza rozetleri (mobil uygulama yayınlanınca bağlantı olur) */
.fiyat__yakinda { cursor: default; opacity: 0.85; }
.magaza { display: flex; justify-content: center; gap: 18px; margin-top: 26px; flex-wrap: wrap; }
.magaza__rozet { margin: 0; display: grid; justify-items: center; gap: 6px; }
.magaza__rozet img { display: block; width: 170px; height: auto; opacity: 0.92; }
.magaza__rozet figcaption { font-size: 0.7rem; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted); }

/* Yasal sayfalar (gizlilik) */
.gizlilik { padding-top: 56px; }
.yasal { max-width: 820px; margin: 0 auto; padding: 36px 40px; border-radius: var(--radius-lg); background: var(--glass-bg-strong); box-shadow: var(--glass-shadow), 0 0 0 1px var(--glass-border); }
.yasal h1 { margin: 6px 0 6px; font-size: clamp(1.7rem, 3vw, 2.2rem); letter-spacing: -0.02em; }
.yasal__tarih { margin: 0 0 24px; color: var(--muted); font-size: 0.9rem; }
.yasal h2 { margin: 28px 0 10px; font-size: 1.15rem; }
.yasal h3 { margin: 16px 0 6px; font-size: 0.98rem; }
.yasal p { margin: 0 0 10px; line-height: 1.7; color: var(--text-soft); text-align: justify; }
.yasal a { color: var(--graphite-2); text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 640px) { .yasal { padding: 24px 18px; } }
.yasal__adim, .yasal__liste { margin: 0 0 12px; padding-left: 22px; display: grid; gap: 6px; color: var(--text-soft); line-height: 1.65; }

a.magaza__rozet { display: grid; justify-items: center; gap: 6px; text-decoration: none; }
a.magaza__rozet img { opacity: 1; transition: transform 0.2s ease; }
a.magaza__rozet:hover img { transform: translateY(-2px); }
a.magaza__rozet span { font-size: 0.75rem; font-weight: 700; letter-spacing: 0.02em; color: #047857; }
.fiyat__kdv { margin: -4px 0 6px; font-size: 0.78rem; font-weight: 600; color: var(--muted); }
.fiyat__kart--one .fiyat__kdv { color: #a1a1aa; }
/* İşletim sistemi logoları (Apple / Windows) */
.indir__os img { display: block; height: 30px; width: auto; }
.indir__os--soluk img { height: 22px; }
.indir__os--beyaz { background: #fff; border: 1px solid rgba(24, 24, 27, 0.08); }

/* Tutar: kuruş hanesi lira hanesinden küçük */
.kurus { font-size: 0.68em; font-weight: inherit; letter-spacing: 0; }

/* ---------- Talep ayrıntısı — canlı gösterim (1000×600 tasarım; JS genişliğe göre ölçekler) ---------- */
.td .canli__live { margin-left: auto; }
.td__kap { position: relative; height: calc(620px * var(--k, 1)); overflow: hidden; background: #f4f4f5; }
.td__olcek { position: absolute; left: 0; top: 0; width: 1000px; height: 620px; display: grid; grid-template-columns: 176px minmax(0, 1fr); transform: scale(var(--k, 1)); transform-origin: 0 0; color: #18181b; font-size: 12px; }
.td svg { fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.td__side { display: flex; flex-direction: column; gap: 2px; padding: 14px 10px; color: #c4c6cc; background: linear-gradient(180deg, #34373e, #1b1c20); }
.td__logo img { display: block; width: 128px; height: auto; margin: 0 4px 14px; }
.td__nav { display: flex; align-items: center; gap: 9px; padding: 8px 9px; border-radius: 9px; font-size: 12.5px; }
.td__nav svg { width: 15px; height: 15px; flex: 0 0 auto; }
.td__nav i { margin-left: auto; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px; font-style: normal; font-size: 10.5px; font-weight: 700; line-height: 18px; text-align: center; color: #fff; background: #e11d48; transition: transform .3s, opacity .3s; }
.td__nav.is-on { color: #fff; background: rgba(255, 255, 255, 0.12); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12); }
.td__user { margin-top: auto; display: flex; align-items: center; gap: 8px; padding: 10px 6px 0; border-top: 1px solid rgba(255, 255, 255, 0.08); font-size: 12px; }
.td__user i { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; font-style: normal; font-size: 10px; font-weight: 700; color: #18181b; background: #d4d4d8; }
.td__main { position: relative; display: flex; flex-direction: column; min-width: 0; overflow: hidden; }
.td__top { flex: 0 0 auto; display: flex; align-items: center; justify-content: space-between; height: 44px; padding: 0 18px; background: #fff; border-bottom: 1px solid rgba(24, 24, 27, 0.08); font-size: 13px; }
.td__ust-ic svg { width: 15px; height: 15px; color: #71717a; }
.td__icerik { display: flex; flex-direction: column; gap: 9px; padding: 11px 16px; }
.td-kart { flex: 0 0 auto; border-radius: 14px; background: #fff; box-shadow: 0 0 0 1px rgba(24, 24, 27, 0.08), 0 6px 16px -10px rgba(9, 9, 11, 0.25); }
.td-bas { display: flex; align-items: center; gap: 12px; padding: 10px 14px; border-bottom: 1px solid rgba(24, 24, 27, 0.07); }
.td-bas > div { flex: 1; display: grid; gap: 2px; }
.td-bas small { font-size: 9.5px; font-weight: 600; letter-spacing: 0.08em; color: #71717a; }
.td-bas b { font: 800 19px/1.1 ui-monospace, "SF Mono", Menlo, monospace; letter-spacing: -0.02em; }
.td-bas p { margin: 2px 0 0; display: flex; align-items: center; gap: 8px; }
.td-bas__ic { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; color: #fff; background: linear-gradient(160deg, #4a4e57, #23252a); }
.td-bas__ic svg { width: 19px; height: 19px; }
.td-soluk { font-size: 11px; color: #71717a; }
.td-durum { padding: 2px 8px; border-radius: 6px; font-size: 10.5px; font-weight: 700; color: #be123c; background: rgba(244, 63, 94, 0.1); box-shadow: inset 0 0 0 1px rgba(244, 63, 94, 0.25); transition: color .35s, background .35s, box-shadow .35s; }
.td-durum--onay { color: #b45309; background: rgba(245, 158, 11, 0.12); box-shadow: inset 0 0 0 1px rgba(245, 158, 11, 0.3); }
.td-durum--odendi { color: #0369a1; background: rgba(14, 165, 233, 0.1); box-shadow: inset 0 0 0 1px rgba(14, 165, 233, 0.28); }
.td-durum--tamam { color: #047857; background: rgba(16, 185, 129, 0.1); box-shadow: inset 0 0 0 1px rgba(16, 185, 129, 0.28); }
.td-btn { display: inline-flex; align-items: center; height: 30px; padding: 0 13px; border-radius: 8px; font-size: 11.5px; font-weight: 600; white-space: nowrap; transition: transform .15s, filter .15s; }
.td-btn--cizgi { color: #27272a; background: #fff; box-shadow: 0 0 0 1px rgba(24, 24, 27, 0.12); }
.td-btn--koyu { color: #fff; background: linear-gradient(160deg, #4a4e57, #23252a); }
.td-btn.is-bas { transform: scale(0.94); filter: brightness(1.3); }
.td-bilgi { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 9px; padding: 10px 14px 12px; }
.td-bilgi b span { font-size: inherit; color: inherit; }
.td-bilgi > div { display: grid; align-content: start; gap: 1px; padding: 9px 11px; border-radius: 11px; box-shadow: 0 0 0 1px rgba(24, 24, 27, 0.08); }
.td-bilgi small { margin-bottom: 4px; font-size: 9.5px; font-weight: 600; letter-spacing: 0.08em; color: #71717a; }
.td-bilgi span { font-size: 10.5px; color: #71717a; }
.td-bilgi b { margin-bottom: 3px; font-size: 12.5px; white-space: nowrap; }
.td-bilgi em { margin-left: 4px; padding: 1px 6px; border-radius: 5px; font-style: normal; font-size: 10px; font-weight: 600; color: #3f3f46; background: #f4f4f5; }
.td-gun { color: #0369a1 !important; background: rgba(14, 165, 233, 0.1) !important; opacity: 0; transition: opacity .4s; }
.td-gun--on { opacity: 1; }
.td-ucret { background: linear-gradient(180deg, #fff, #f0fdf4); }
.td-buyuk { font-size: 19px !important; font-weight: 800; letter-spacing: -0.02em; }
.td-buyuk i { font-style: normal; font-size: 10.5px; font-weight: 500; color: #71717a; }
.td [data-td] { font-variant-numeric: tabular-nums; }
.td-kalem table { width: 100%; border-collapse: collapse; }
.td-kalem th { padding: 7px 14px; font-size: 10.5px; font-weight: 600; text-align: right; color: #71717a; background: #fafafa; border-bottom: 1px solid rgba(24, 24, 27, 0.07); }
.td-kalem th:first-child, .td-kalem td:first-child { text-align: left; }
.td-kalem th:first-child { border-top-left-radius: 14px; } .td-kalem th:last-child { border-top-right-radius: 14px; }
.td-kalem td { padding: 6px 14px; font-size: 11.5px; text-align: right; border-bottom: 1px solid rgba(24, 24, 27, 0.06); }
.td-kalem td b { display: block; font-size: 12px; }
.td-kalem td small { font-size: 10px; color: #71717a; }
.td-kalem td:last-child { font-weight: 700; min-width: 96px; }
.td-girdi { display: inline-flex; align-items: center; justify-content: flex-end; min-width: 64px; height: 28px; padding: 0 9px; border-radius: 7px; font-size: 12px; font-weight: 600; background: #fff; box-shadow: inset 0 0 0 1px rgba(24, 24, 27, 0.16); transition: box-shadow .2s; }
.td-girdi--dolu { min-width: 92px; }
.td-girdi.is-odak { box-shadow: inset 0 0 0 1.5px #34373e, 0 0 0 3px rgba(52, 55, 62, 0.15); }
.td-girdi.is-odak::after { content: ""; width: 1px; height: 14px; margin-left: 2px; background: #18181b; animation: tdImlec 1s steps(1) infinite; }
.td-girdi--tarih, .td-girdi--secim { justify-content: flex-start; min-width: 150px; color: #18181b; }
.td-girdi--tarih:not(.is-dolu) { color: #a1a1aa; font-weight: 500; }
.td-girdi--secim::before { content: ""; order: 2; margin-left: auto; width: 6px; height: 6px; border-right: 1.5px solid #71717a; border-bottom: 1.5px solid #71717a; transform: rotate(45deg) translateY(-2px); }
.td-alt { display: flex; align-items: flex-end; gap: 14px; padding: 9px 14px 10px; }
.td-alt label { display: grid; gap: 4px; font-size: 10.5px; color: #71717a; }
.td-alt .td-btn { margin-left: auto; height: 30px; }
.td-odeme { flex: 0 0 auto; display: flex; align-items: center; gap: 12px; padding: 9px 14px; opacity: 0; transform: translateY(10px); transition: opacity .45s, transform .45s; }
.td-odeme.is-on { opacity: 1; transform: none; box-shadow: 0 0 0 1px rgba(14, 165, 233, 0.35), 0 10px 22px -12px rgba(14, 165, 233, 0.5); }
.td-odeme > div { flex: 1; display: grid; gap: 2px; }
.td-odeme b { font-size: 12.5px; }
.td-odeme small { font-size: 10.5px; color: #047857; }
.td-odeme__ic { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; color: #0369a1; background: rgba(14, 165, 233, 0.1); }
.td-odeme__ic svg { width: 17px; height: 17px; }
.td-odeme.is-tamam .td-btn { opacity: 0.45; }
.td-toast { position: absolute; right: 16px; bottom: 14px; z-index: 2; display: flex; align-items: center; gap: 10px; max-width: 360px; padding: 11px 14px; border-radius: 12px; color: #f4f4f5; background: #1c1d21; box-shadow: 0 16px 30px -12px rgba(0, 0, 0, 0.5); opacity: 0; transform: translateY(12px); transition: opacity .35s, transform .35s; }
.td-toast.is-on { opacity: 1; transform: none; }
.td-toast svg { width: 17px; height: 17px; flex: 0 0 auto; stroke: #34d399; }
.td-toast div { display: grid; gap: 1px; }
.td-toast b { font-size: 12px; }
.td-toast small { font-size: 10.5px; color: #a1a1aa; }
.td-imlec { width: 20px; height: 20px; }
@keyframes tdImlec { 50% { opacity: 0; } }
.td-flas { animation: tdFlas .9s ease; }
@keyframes tdFlas { 0% { background: rgba(52, 211, 153, 0.28); } 100% { background: transparent; } }
.td .kurus { font-size: 0.68em !important; color: inherit !important; }
.td--dar .td__olcek { width: 824px; grid-template-columns: minmax(0, 1fr); }
.td--dar .td__side { display: none; }
.td--dar .td-kalem th:nth-child(2), .td--dar .td-kalem td:nth-child(2) { display: none; }

/* Soru formu (2026-10-12): Cloudflare doğrulaması solda, koyu "Gönder" sağda; KVKK satırı en altta (üç sitede aynı düzen) */
.btn--koyu { color: #fff; border: 1px solid rgba(255, 255, 255, 0.22);
  background: linear-gradient(160deg, rgba(74, 78, 87, 0.94) 0%, rgba(43, 45, 51, 0.95) 50%, rgba(27, 28, 32, 0.97) 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 10px 24px -10px rgba(0, 0, 0, 0.7); }
.btn--koyu:hover { border-color: rgba(255, 255, 255, 0.32); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14), 0 16px 30px -10px rgba(0, 0, 0, 0.8), 0 0 0 3px rgba(228, 231, 236, 0.12); }
.soru__alt { gap: 16px; margin-top: 0; }
.soru__alt .btn { min-width: 0; padding-inline: 22px; }
.soru__ts { min-height: 56px; display: flex; align-items: center; }
.soru__ts .cf-turnstile { transform: scale(0.85); transform-origin: left center; margin-right: -45px; }
.soru__kvkk { max-width: none; margin-top: -4px; }
@media (max-width: 560px) {
  .soru__alt { flex-direction: column; align-items: stretch; }
  .soru__ts { justify-content: center; }
  .soru__ts .cf-turnstile { transform-origin: center; margin: 0 -22px; }
  .soru__alt .btn { justify-content: center; }
}

/* Bölüm başlıkları (2026-10-12): açıklama paragrafları 760px'e sıkışıp solda kalmasın — sayfa genişliğinde, iki yana yaslı */
.head { max-width: none; }
.head .section-lead, .section--dark .head .section-lead, .qa__intro .section-lead { text-align: justify; hyphens: auto; }
@media (max-width: 560px) { .head .section-lead, .section--dark .head .section-lead, .qa__intro .section-lead { text-align: left; hyphens: manual; } }
/* Soru formu ile alttaki "SGF ile yönetmeye başlayın" kartı arası daraltıldı */
.section:has(.soru) { padding-bottom: 40px; }
.section:has(.soru) + .section--cta { padding-top: 16px; }

/* 2026-10-18: canlı gösterim güncel uygulamaya göre — açık karşılama kartı, Gelir ve Gider çift çubuk (yeşil / kırmızı) */
.d-hello { color: #18181b; background: linear-gradient(180deg, #ffffff, #f4f5f7); box-shadow: 0 0 0 1px rgba(24, 24, 27, 0.08), 0 8px 18px -14px rgba(24, 24, 27, 0.35); }
.d-hello small { color: #71717a; } .d-hello span { color: #52525b; }
.d-chart__bas { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.d-chart__bas span { display: inline-flex; align-items: center; gap: 4px; font-size: 8.5px; }
.d-chart__bas em { display: inline-block; width: 7px; height: 7px; margin-left: 4px; border-radius: 2px; } .d-chart__bas em.g { background: #059669; } .d-chart__bas em.r { background: #e11d48; }
.d-bars--cift { gap: 10px; }
.d-bars--cift > span { flex: 1; height: 100%; display: flex; align-items: flex-end; gap: 3px; }
.d-bars--cift i { flex: 1; height: 0; border-radius: 3px 3px 1px 1px; transition: height 0.9s cubic-bezier(.2, .8, .2, 1); }
.d-bars--cift i:first-child { background: linear-gradient(180deg, #34d399, #059669); } .d-bars--cift i:last-child { background: linear-gradient(180deg, #fb7185, #e11d48); }
.is-on .d-bars--cift i { height: var(--h); }
.d-bars--cift > span:nth-child(1) i:first-child { --h: 42%; } .d-bars--cift > span:nth-child(1) i:last-child { --h: 14%; }
.d-bars--cift > span:nth-child(2) i:first-child { --h: 55%; } .d-bars--cift > span:nth-child(2) i:last-child { --h: 20%; }
.d-bars--cift > span:nth-child(3) i:first-child { --h: 48%; } .d-bars--cift > span:nth-child(3) i:last-child { --h: 11%; }
.d-bars--cift > span:nth-child(4) i:first-child { --h: 70%; } .d-bars--cift > span:nth-child(4) i:last-child { --h: 24%; }
.d-bars--cift > span:nth-child(5) i:first-child { --h: 63%; } .d-bars--cift > span:nth-child(5) i:last-child { --h: 17%; }
.d-bars--cift > span:nth-child(6) i:first-child { --h: 88%; } .d-bars--cift > span:nth-child(6) i:last-child { --h: 22%; }
.is-on .d-bars--cift > span:nth-child(2) i { transition-delay: 0.08s; } .is-on .d-bars--cift > span:nth-child(3) i { transition-delay: 0.16s; }
.is-on .d-bars--cift > span:nth-child(4) i { transition-delay: 0.24s; } .is-on .d-bars--cift > span:nth-child(5) i { transition-delay: 0.32s; } .is-on .d-bars--cift > span:nth-child(6) i { transition-delay: 0.4s; }
.canli__nav { padding-top: 5px; padding-bottom: 5px; }
.canli__nav { white-space: nowrap; font-size: 10px; } .canli__nav .canli__badge { margin-left: auto; }
/* 2026-10-18 (kullanıcı): en alttaki kart, üstündeki iletişim formuyla aynı koyu grafit */
.cta.cta--tek { background: var(--brushed), var(--graphite-deep-grad); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), 0 40px 80px -36px rgba(9, 9, 11, 0.8); }

/* İndirme kartları macOS / Windows'ta aynı yükseklik (2026-10-20, kullanıcı): iki platformun kurulum kartı aynı ızgara hücresine
   üst üste yerleşir, gizli olan görünmez ama yer kaplar → hücre ikisinin uzununa göre; sol kart aynı satırda uzar. Başlıktaki
   sürüm satırı iki satır yer ayırır (macOS iki, Windows bir satır). Ekran okuyucu yalnız görüneni okur (visibility: hidden). */
.indir > .indir__kur { grid-column: 2; grid-row: 1; }
.indir > .indir__kur[data-plat-goster][hidden] { display: flex !important; visibility: hidden; }
.indir__baslar { display: grid; }
.indir__baslar > .indir__bas { grid-area: 1 / 1; }
.indir__baslar > .indir__bas[data-plat-goster][hidden] { display: flex !important; visibility: hidden; }
@media (max-width: 1020px) { .indir > .indir__kur { grid-column: 1; grid-row: 2; } }

/* Gösterimlerde bildirimler gerçek uygulamadaki gibi sağ üstteki zilde (2026-10-20): menüde sayı rozeti yok */
.canli__main { padding-top: 46px; }
.canli__sc { top: 46px; }
.canli__top { position: absolute; left: 0; right: 0; top: 0; z-index: 2; display: flex; align-items: center; gap: 4px; height: 34px; padding: 0 10px 0 14px; background: #fff; border-bottom: 1px solid rgba(24, 24, 27, 0.08); }
.canli__baslik { margin-right: auto; font-size: 11px; font-weight: 700; color: #18181b; }
.canli__ikon { position: relative; display: grid; place-items: center; width: 24px; height: 24px; border-radius: 7px; color: #71717a; }
.canli__ikon svg { width: 13px; height: 13px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.canli__zil i, .td__zil i { position: absolute; top: -2px; right: -3px; min-width: 14px; height: 14px; padding: 0 3px; border-radius: 7px; font-style: normal; font-size: 8.5px; font-weight: 700; line-height: 14px; text-align: center; color: #fff; background: #e11d48; box-shadow: 0 0 0 2px #fff; }
.td__sag { display: inline-flex; align-items: center; gap: 12px; }
.td__zil { position: relative; display: inline-grid; }
.td__zil i { top: -6px; right: -8px; }
.td__zil svg { fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
/* Üst çubuk 34 px yer aldığı için pencere aynı ölçüde uzar; sahnelerin içerik alanı eskisi kadar kalır */
.canli__win { height: 374px; }
@media (max-width: 900px) { .canli__win { height: 354px; } }

/* Özellikler: 5. sekme Rapor Editörü (2026-10-20) */
.tone-iron { background: var(--brushed), linear-gradient(160deg, #6b7280, #374151); }
.svc-tabs { grid-template-columns: repeat(5, minmax(0, 1fr)); }
@media (max-width: 900px) { .svc-tabs { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 640px) { .svc-tabs { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* Kapalı test başvurusu (/test, 2026-10-21): soru kartının düzeni + aydınlatma onayı ve penceresi */
.tb { margin-top: 0; }
.tb .cs-f > span i { font-style: normal; font-weight: 500; color: #8b8f97; }
.tb .cs-f input::placeholder { color: #71717a; }
.tb__ipucu { font-size: 0.76rem; line-height: 1.5; color: #8b8f97; }
.tb__onay { display: flex; align-items: flex-start; gap: 10px; font-size: 0.86rem; line-height: 1.55; color: #c8cacf; cursor: pointer; }
.tb__onay input { flex: 0 0 auto; width: 20px; height: 20px; margin: 1px 0 0; accent-color: #d4d4d8; cursor: pointer; }
.tb__metin { padding: 0; border: 0; font: inherit; font-weight: 600; color: #fff; background: none; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: rgba(255, 255, 255, 0.35); cursor: pointer; }
.tb .cs-f__err[data-err="aydinlatma"] { margin-top: -10px; }
.tb-dlg { width: min(680px, calc(100% - 32px)); max-height: calc(100dvh - 48px); padding: 0; border: 0; border-radius: 20px; color: var(--text); background: #fff; box-shadow: 0 30px 80px -20px rgba(0, 0, 0, 0.55); }
.tb-dlg::backdrop { background: rgba(9, 9, 11, 0.6); backdrop-filter: blur(4px); }
.tb-dlg__kutu { display: flex; flex-direction: column; max-height: calc(100dvh - 48px); }
.tb-dlg h2 { margin: 0; padding: 22px 24px 14px; font-size: 1.1rem; font-weight: 800; border-bottom: 1px solid var(--border); }
.tb-dlg__metin { flex: 1 1 auto; overflow-y: auto; padding: 18px 24px; font-size: 0.88rem; line-height: 1.65; color: var(--text-soft); white-space: pre-line; }
.tb-dlg__alt { display: flex; justify-content: flex-end; gap: 10px; padding: 14px 24px 20px; border-top: 1px solid var(--border); }
@media (max-width: 560px) { .tb-dlg__alt { flex-direction: column-reverse; } .tb-dlg__alt .btn { justify-content: center; } }
.tb-dlg__kapat { color: #3f3f46; background: #fff; border: 1px solid var(--border); }
.tb-dlg__kapat:hover { background: #f4f4f5; }

/* /test kısa sayfa: içerik ekrandan kısa olunca html'in koyu zemini (#121316, Safari yaylanması için) footer'ın altında görünüp
   footer'ı uzun gösteriyordu → sayfa en az ekran boyu, footer en altta (2026-10-21) */
.tb-sayfa { box-sizing: border-box; min-height: 100vh; min-height: 100dvh; display: flex; flex-direction: column; }
.tb-sayfa > main { flex: 1 0 auto; }

/* ================= YARDIM (madde 32, 2026-10-22) — /yardim, site/scripts/yardim-uret.mjs üretir =================
   Solda yapışkan içindekiler, sağda konu kartları (yasal sayfalarla aynı cam kart dili); dar ekranda içindekiler üstte, katlanır. */
.yd-bas { max-width: 760px; margin: 0 0 28px; }
.yd-bas h1 { margin: 6px 0 10px; font-size: clamp(1.8rem, 3.2vw, 2.4rem); letter-spacing: -0.02em; }
.yd-bas p { margin: 0; color: var(--text-soft); line-height: 1.7; }
.yd-bas .yd-video { margin: 22px 0 8px; }   /* sayfa başındaki Üst Çubuk videosu */
.yd-duzen { display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: 28px; align-items: start; }
.yd-dizin { position: sticky; top: 88px; max-height: calc(100vh - 108px); overflow-y: auto; padding: 18px 16px; border-radius: var(--radius);
  background: var(--glass-bg-strong); box-shadow: var(--glass-shadow), 0 0 0 1px var(--glass-border); }
.yd-dizin summary { font-size: 0.78rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); cursor: pointer; list-style: none; }
.yd-dizin summary::-webkit-details-marker { display: none; }
.yd-dizin__grup h2 { margin: 16px 0 6px; font-size: 0.86rem; color: var(--text); }
.yd-dizin__grup ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 1px; }
.yd-dizin__grup a { display: block; padding: 6px 10px; border-radius: 8px; font-size: 0.88rem; color: var(--text-soft); text-decoration: none; }
.yd-dizin__grup a:hover, .yd-dizin__grup a:focus-visible { background: rgba(24, 24, 27, 0.06); color: var(--text); }
.yd-icerik { display: grid; gap: 18px; min-width: 0; }
.yd-grup-baslik { margin: 14px 0 -4px; font-size: 0.8rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); }
.yd-grup-baslik:first-child { margin-top: 0; }
.yd-konu { scroll-margin-top: 88px; padding: 28px 32px; border-radius: var(--radius-lg); background: var(--glass-bg-strong); box-shadow: var(--glass-shadow), 0 0 0 1px var(--glass-border); }
.yd-konu__yol { margin: 0; font-size: 0.8rem; color: var(--muted); }
.yd-konu h3 { margin: 4px 0 16px; font-size: 1.35rem; letter-spacing: -0.01em; }
.yd-video { display: block; width: 100%; max-width: 640px; aspect-ratio: 16 / 9; margin: 0 0 18px; border-radius: 14px; background: #0f1012; }
.yd-video--yok { display: grid; place-content: center; justify-items: center; gap: 10px; font-size: 0.85rem; font-weight: 600; color: #a1a1aa;
  background: radial-gradient(120% 90% at 30% 20%, #2a2c31 0%, #16171a 70%); }
.yd-video--yok span { width: 52px; height: 52px; border-radius: 50%; background: rgba(255, 255, 255, 0.08); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.14);
  position: relative; }
.yd-video--yok span::after { content: ""; position: absolute; left: 21px; top: 17px; border-style: solid; border-width: 9px 0 9px 14px; border-color: transparent transparent transparent #d4d4d8; }
.yd-ozet { margin: 0 0 18px; color: var(--text-soft); line-height: 1.7; }
.yd-gorev { margin: 0 0 16px; }
.yd-gorev h4, .yd-ipucu h4 { margin: 0 0 8px; font-size: 0.98rem; }
.yd-gorev ol { margin: 0; padding: 0; list-style: none; counter-reset: yd; display: grid; gap: 7px; }
.yd-gorev li { position: relative; padding-left: 32px; line-height: 1.6; color: var(--text-soft); counter-increment: yd; }
.yd-gorev li::before { content: counter(yd); position: absolute; left: 0; top: 2px; display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%;
  font-size: 0.72rem; font-weight: 700; color: #27292e; background: var(--silver-grad); box-shadow: inset 0 0 0 1px rgba(9, 9, 11, 0.1); }
.yd-ipucu { margin: 6px 0 0; padding: 14px 18px; border-radius: 14px; background: rgba(24, 24, 27, 0.035); box-shadow: inset 0 0 0 1px rgba(24, 24, 27, 0.07); }
.yd-ipucu ul { margin: 0; padding-left: 20px; display: grid; gap: 6px; color: var(--text-soft); line-height: 1.6; font-size: 0.94rem; }
.yd-yukari { display: inline-block; margin-top: 14px; font-size: 0.82rem; color: var(--muted); text-decoration: none; }
.yd-yukari:hover { color: var(--text); text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 900px) {
  .yd-duzen { grid-template-columns: 1fr; }
  .yd-dizin { position: static; max-height: none; }
  .yd-dizin summary { list-style: revert; }
  .yd-konu { padding: 22px 18px; }
}

/* Tanıtım filmi (2026-10-24): grafit sinema çerçevesi içinde ana reklam */
.film { padding-bottom: 72px; }
.film__cerceve { padding: 10px; border-radius: var(--radius-lg); background: var(--graphite-deep-grad); box-shadow: var(--shadow-lg), inset 0 0 0 1px rgba(255, 255, 255, 0.06); }
.film__video { display: block; width: 100%; aspect-ratio: 16 / 9; border-radius: calc(var(--radius-lg) - 8px); background: #0f1012; }
@media (max-width: 640px) {
  .film__cerceve { padding: 6px; border-radius: var(--radius); }
  .film__video { border-radius: calc(var(--radius) - 5px); }
}
