/* =========================================================
   RADYOMASYON — Satış sitesi
   Açık zeminli, sade ve premium dil; ürün ekranları HTML olarak
   birebir canlandırılır (.rx kapsamı, koyu uygulama teması).
   ========================================================= */
:root {
  --canvas: #fbfbfd;
  --canvas-2: #f2f2f7;
  --ink: #1d1d1f;
  --ink-2: #6e6e73;
  --ink-3: #a1a1a6;
  --hair: rgba(0, 0, 0, 0.08);
  --hair-2: rgba(0, 0, 0, 0.13);
  --blue: #0071e3;
  --blue-2: #2f8cff;
  --red: #ff3b30;
  --purple: #bf5af2;
  --green: #28b446;
  --cat-a: #ff375f; --cat-b: #ff9f0a; --cat-c: #30d158; --cat-d: #ffd60a;
  --font: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Inter", "Segoe UI", system-ui, sans-serif;
  --display: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Inter", "Segoe UI", system-ui, sans-serif;
  --ease: cubic-bezier(.2, .8, .2, 1);
  --wrap: 1180px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--canvas); color: var(--ink); font: 17px/1.5 var(--font); -webkit-font-smoothing: antialiased; letter-spacing: -0.01em; }
a { color: var(--blue); text-decoration: none; }
img { max-width: 100%; }
button { font: inherit; color: inherit; }
:focus-visible { outline: 2px solid var(--blue); outline-offset: 3px; border-radius: 8px; }
i.ph-duotone, i.ph-fill { line-height: 1; vertical-align: -0.12em; }
.wrap { max-width: var(--wrap); margin: 0 auto; padding: 0 24px; }
.hidden { display: none !important; }

/* ---------- düğmeler ---------- */
.b { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 44px; padding: 0 22px; border-radius: 22px; border: 0; cursor: pointer; font-weight: 600; font-size: 15px; transition: transform .12s, background .2s, box-shadow .2s; white-space: nowrap; }
.b:active { transform: scale(.97); }
.b.primary { background: var(--blue); color: #fff; box-shadow: 0 10px 26px -12px rgba(0,113,227,.8); }
.b.primary:hover { background: #0077ed; }
.b.ghost { background: rgba(0,0,0,.05); color: var(--ink); }
.b.ghost:hover { background: rgba(0,0,0,.08); }
.b.dark { background: var(--ink); color: #fff; }
.b.sm { height: 34px; padding: 0 15px; font-size: 13.5px; border-radius: 17px; }
.b.lg { height: 52px; padding: 0 28px; font-size: 16.5px; border-radius: 26px; }
.link-arrow { font-weight: 600; display: inline-flex; gap: 6px; align-items: center; }
.link-arrow i { transition: transform .2s; }
.link-arrow:hover i { transform: translateX(3px); }

/* ---------- navigasyon ---------- */
.nav { position: sticky; top: 0; z-index: 50; background: rgba(251,251,253,.8); backdrop-filter: saturate(180%) blur(20px); -webkit-backdrop-filter: saturate(180%) blur(20px); border-bottom: 0.5px solid var(--hair); }
.nav > .wrap { display: flex; align-items: center; height: 60px; gap: 26px; }
.brand { display: flex; align-items: center; gap: 10px; color: var(--ink); font-weight: 750; font-size: 17px; letter-spacing: -0.02em; }
.brand-mark { width: 30px; height: 30px; border-radius: 9px; display: grid; place-items: center; color: #fff; font-size: 16px; background: linear-gradient(160deg, #ff6a5f, #d7261b); box-shadow: 0 6px 16px -6px rgba(255,59,48,.8), inset 0 1px 0 rgba(255,255,255,.35); flex: none; }
.brand-mark.sm { width: 22px; height: 22px; border-radius: 7px; font-size: 12px; }
.menu { display: flex; gap: 2px; flex: 1; margin: 0; padding: 0; }
.menu > li { list-style: none; position: static; }
.menu > li > a, .menu > li > button { display: inline-flex; align-items: center; gap: 5px; height: 36px; padding: 0 12px; border-radius: 10px; border: 0; background: none; color: var(--ink); font-size: 14px; font-weight: 500; cursor: pointer; transition: background .15s; }
.menu > li > a:hover, .menu > li > button:hover, .menu > li.open > button { background: rgba(0,0,0,.05); }
.menu > li > button i { font-size: 11px; transition: transform .25s var(--ease); color: var(--ink-3); }
.menu > li.open > button i { transform: rotate(180deg); color: var(--ink); }
.nav-cta { display: flex; gap: 6px; align-items: center; }
.burger { display: none; width: 40px; height: 40px; border-radius: 12px; border: 0; background: rgba(0,0,0,.05); font-size: 20px; cursor: pointer; }

/* ---------- sekmeli mega menü ---------- */
.mega { position: absolute; left: 0; right: 0; top: 60px; background: #fff; border-bottom: 0.5px solid var(--hair); box-shadow: 0 50px 90px -50px rgba(0,0,0,.35); opacity: 0; visibility: hidden; transform: translateY(-8px); transition: opacity .22s var(--ease), transform .3s var(--ease), visibility .22s; }
.menu > li.open .mega { opacity: 1; visibility: visible; transform: none; }
.mm-dim { position: fixed; left: 0; right: 0; top: 100%; height: 100vh; background: rgba(20,20,24,.18); backdrop-filter: blur(2px); -webkit-backdrop-filter: blur(2px); opacity: 0; pointer-events: none; transition: opacity .25s; z-index: -1; }
.nav.mm-open .mm-dim { opacity: 1; }
.wrap.mm { display: grid; grid-template-columns: 250px minmax(0, 1fr) 316px; gap: 30px; padding-top: 24px; padding-bottom: 26px; align-items: stretch; }
.mm-rail { position: relative; display: flex; flex-direction: column; gap: 2px; padding-right: 22px; border-right: 0.5px solid var(--hair); }
.mm-rail::before { content: ""; position: absolute; left: 0; right: 22px; top: 0; height: var(--h, 58px); transform: translateY(var(--y, 0)); border-radius: 14px; background: color-mix(in srgb, var(--hc, #0071e3) 9%, #f5f5f7); transition: transform .32s var(--ease), height .32s var(--ease), background .32s; }
.mm-tab { position: relative; z-index: 1; display: grid; grid-template-columns: 36px 1fr; gap: 12px; align-items: center; text-align: left; padding: 10px 12px; border: 0; background: none; border-radius: 14px; cursor: pointer; color: var(--ink); }
.mm-tab .mt-i { width: 36px; height: 36px; border-radius: 11px; display: grid; place-items: center; font-size: 19px; color: var(--c); background: color-mix(in srgb, var(--c) 12%, #fff); transition: background .25s, color .25s, box-shadow .25s; }
.mm-tab.on .mt-i { background: var(--c); color: #fff; box-shadow: 0 8px 18px -8px var(--c); }
.mm-tab b { display: block; font-size: 14px; font-weight: 650; letter-spacing: -0.01em; }
.mm-tab small { display: block; font-size: 12px; color: var(--ink-2); margin-top: 1px; }
.mm-tab:focus-visible { outline-offset: -2px; }
.mm-panes { position: relative; min-width: 0; }
.mm-pane { display: none; animation: paneIn .34s var(--ease); }
.mm-pane.on { display: block; }
@keyframes paneIn { from { opacity: 0; transform: translateX(10px); } }
.mm-head h4 { margin: 2px 0 6px; font: 750 22px/1.15 var(--display); letter-spacing: -0.025em; }
.mm-head p { margin: 0 0 16px; color: var(--ink-2); font-size: 14px; max-width: 54ch; }
.mm-links { display: grid; grid-template-columns: 1fr 1fr; gap: 2px 14px; }
.ml { display: grid; grid-template-columns: 34px 1fr; gap: 11px; align-items: center; padding: 9px 10px; margin: 0 -10px; border-radius: 13px; color: var(--ink); transition: background .15s; }
.ml:hover { background: #f5f5f7; }
.ml-i { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; font-size: 18px; color: var(--c); background: color-mix(in srgb, var(--c) 11%, transparent); transition: transform .2s var(--ease); }
.ml:hover .ml-i { transform: scale(1.06); }
.ml-t b { display: block; font-size: 13.5px; font-weight: 620; }
.ml-t small { display: block; font-size: 12px; color: var(--ink-2); line-height: 1.35; }
.mm-ticks { list-style: none; margin: 0 0 18px; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 9px 18px; }
.mm-ticks li { display: flex; gap: 8px; font-size: 13.5px; align-items: flex-start; }
.mm-ticks i { color: var(--green); font-size: 16px; margin-top: 1px; }
.mm-actions { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-top: 4px; }
.mm-pk { font-size: 13px; color: var(--ink-2); display: inline-flex; gap: 6px; align-items: center; margin-right: auto; }
.mm-pk b { color: var(--ink); }
.mm-steps { list-style: none; counter-reset: s; margin: 0 0 18px; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.mm-steps li { counter-increment: s; padding: 14px 12px 12px; border-radius: 14px; background: #f5f5f7; position: relative; }
.mm-steps li::before { content: counter(s); display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: var(--blue); color: #fff; font-size: 12px; font-weight: 700; margin-bottom: 8px; }
.mm-steps b { display: block; font-size: 13px; }
.mm-steps small { display: block; font-size: 11.5px; color: var(--ink-2); line-height: 1.35; margin-top: 2px; }
.mm-pks { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.mm-pkc { padding: 14px; border-radius: 16px; border: 0.5px solid var(--hair-2); color: var(--ink); transition: border-color .2s, box-shadow .2s; }
.mm-pkc:hover { border-color: var(--blue); box-shadow: 0 0 0 3px rgba(0,113,227,.12); }
.mm-pkc.hl { background: #111214; color: #f5f5f7; border-color: transparent; }
.mm-pkc b { display: block; font-size: 15px; }
.mm-pkc small { display: block; font-size: 12px; color: var(--ink-2); margin: 3px 0 10px; min-height: 32px; }
.mm-pkc.hl small { color: #a1a1a6; }
.mm-pkc span { font-size: 11.5px; font-weight: 600; color: var(--green); }
.mm-foot { background: #f5f5f7; border-top: 0.5px solid var(--hair); }
.mm-foot .wrap { display: flex; gap: 26px; align-items: center; height: 46px; font-size: 13px; color: var(--ink-2); }
.mm-foot span { display: inline-flex; gap: 7px; align-items: center; }
.mm-foot i { font-size: 16px; color: var(--ink-3); }
.mm-foot a { margin-left: auto; font-weight: 600; display: inline-flex; gap: 6px; align-items: center; }

/* mega menü canlı ön izleme */
.mm-preview { position: relative; border-radius: 22px; padding: 18px; background: radial-gradient(260px 180px at 85% 0%, rgba(47,140,255,.22), transparent 70%), linear-gradient(165deg, #1d1e23, #0f1013); color: #f2f2f5; display: flex; flex-direction: column; overflow: hidden; min-height: 248px; box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.08); }
.mp { display: none; flex-direction: column; gap: 12px; flex: 1; }
.mp.on { display: flex; animation: paneIn .4s var(--ease); }
.mp-cta { margin-top: 14px; display: flex; justify-content: space-between; align-items: center; padding: 11px 14px; border-radius: 13px; background: rgba(255,255,255,.08); color: #f2f2f5; font-size: 13px; font-weight: 600; transition: background .2s; }
.mp-cta:hover { background: rgba(255,255,255,.14); }
.mp-cta i { transition: transform .2s; }
.mp-cta:hover i { transform: translateX(3px); }
.mp-player { display: grid; grid-template-columns: 46px 1fr auto; gap: 12px; align-items: center; }
.mp-player b { display: block; font-size: 14px; } .mp-player small { color: #a1a2ab; font-size: 12px; }
.mp-ring { position: relative; width: 46px; height: 46px; display: grid; place-items: center; }
.mp-ring svg { position: absolute; inset: 0; transform: rotate(-90deg); }
.mp-ring circle { fill: #fff; stroke: rgba(255,255,255,.15); stroke-width: 3; }
.mp-ring circle.v { fill: none; stroke: #32d74b; stroke-dasharray: 132; stroke-dashoffset: 132; animation: ring 9s linear infinite; }
.mp-ring i { position: relative; color: #111; font-size: 18px; }
@keyframes ring { to { stroke-dashoffset: 0; } }
.mp-cb, .mp-slots span { display: inline-grid; place-items: center; min-width: 24px; height: 24px; border-radius: 7px; font-size: 12px; font-weight: 800; color: #111; background: var(--k); }
.mp-wave { display: flex; align-items: center; gap: 3px; height: 54px; padding: 0 2px; }
.mp-wave i { flex: 1; border-radius: 2px; background: linear-gradient(180deg, #2f8cff, #5e9dff); height: 30%; animation: wv 1.4s ease-in-out infinite; }
.mp-wave i:nth-child(3n) { animation-delay: -.3s; } .mp-wave i:nth-child(3n+1) { animation-delay: -.7s; } .mp-wave i:nth-child(4n) { animation-delay: -1s; }
.mp-wave i:nth-child(n+15) { background: rgba(255,255,255,.22); }
@keyframes wv { 50% { height: 90%; } }
.mp-chips { display: flex; gap: 6px; flex-wrap: wrap; }
.mp-chips span { font-size: 11px; font-weight: 650; padding: 4px 8px; border-radius: 7px; }
.mp-chips .in { background: rgba(50,215,75,.16); color: #5be37a; } .mp-chips .sg { background: rgba(255,159,10,.16); color: #ffb340; } .mp-chips .air { background: rgba(255,69,58,.18); color: #ff6961; }
.mp-slots { display: flex; gap: 7px; flex-wrap: wrap; }
.mp-slots span { width: 38px; height: 38px; border-radius: 11px; font-size: 15px; animation: slotGlow 6s infinite; }
.mp-slots span.j { color: #fff; }
.mp-slots span:nth-child(2) { animation-delay: 1s; } .mp-slots span:nth-child(3) { animation-delay: 2s; } .mp-slots span:nth-child(4) { animation-delay: 3s; } .mp-slots span:nth-child(5) { animation-delay: 4s; } .mp-slots span:nth-child(6) { animation-delay: 5s; }
@keyframes slotGlow { 0%, 12% { box-shadow: 0 0 0 3px rgba(255,255,255,.85), 0 0 22px var(--k); transform: translateY(-3px); } 18%, 100% { box-shadow: none; transform: none; } }
.mp-rule { padding: 12px; border-radius: 13px; background: rgba(255,255,255,.06); }
.mp-rule span { font-size: 12.5px; font-weight: 650; } .mp-rule small { color: #a1a2ab; font-size: 11.5px; }
.mp-bar { position: relative; height: 7px; border-radius: 4px; background: rgba(255,255,255,.1); margin: 9px 0 7px; overflow: visible; }
.mp-bar i { position: absolute; left: 0; top: 0; bottom: 0; border-radius: 4px; background: linear-gradient(90deg, #ff9f0a, #32d74b); }
.mp-bar.o i { background: linear-gradient(90deg, #ff9f0a, #ffd60a); }
.mp-bar em { position: absolute; top: -3px; width: 2px; height: 13px; background: #fff; border-radius: 1px; }
.mp-break { position: relative; display: flex; gap: 4px; height: 52px; align-items: stretch; }
.mp-break span { display: grid; place-items: center; border-radius: 9px; font-size: 10.5px; font-weight: 700; padding: 0 4px; }
.mp-break .g { flex: 1.1; background: rgba(47,140,255,.22); color: #8cc0ff; } .mp-break .c { flex: 1.1; background: rgba(191,90,242,.24); color: #dda4ff; }
.mp-break .s { flex: 2.2; background: rgba(255,159,10,.22); color: #ffc46b; } .mp-break .x { flex: .9; background: rgba(255,255,255,.1); color: #c7c7cc; }
.mp-head-line { position: absolute; top: -5px; bottom: -5px; width: 2px; background: #fff; border-radius: 1px; box-shadow: 0 0 10px #fff; animation: playhead 7s linear infinite; }
@keyframes playhead { from { left: 0; } to { left: 100%; } }
.mp-adrow { padding: 12px; border-radius: 13px; background: rgba(255,255,255,.06); }
.mp-adrow b { font-size: 13px; } .mp-adrow small { color: #a1a2ab; font-size: 11.5px; margin-left: 6px; }
.mp-off .pill { display: inline-flex; gap: 10px; align-items: center; padding: 9px 14px 9px 11px; border-radius: 13px; background: rgba(255,159,10,.14); border: 0.5px solid rgba(255,159,10,.45); }
.mp-off .pill i { font-size: 20px; color: #ff9f0a; }
.mp-off b { display: block; font-size: 13px; } .mp-off small { font-size: 11px; color: #c7c7cc; }
.mp-q { display: flex; flex-direction: column; gap: 4px; font-size: 12.5px; }
.mp-q > div { padding: 8px 10px; border-radius: 10px; background: rgba(255,255,255,.05); color: #c7c7cc; }
.mp-q .now { background: linear-gradient(90deg, rgba(50,215,75,.22), rgba(50,215,75,.04)); color: #7cf08e; font-weight: 650; display: flex; gap: 7px; align-items: center; }
.mp-q .now small { color: #a1a2ab; font-weight: 400; }
.mp-bars { display: flex; gap: 6px; align-items: flex-end; height: 104px; }
.mp-bars i { flex: 1; border-radius: 5px 5px 2px 2px; background: linear-gradient(180deg, #8e8cff, #5e5ce6); transform-origin: bottom; animation: grow 1s var(--ease) both; }
.mp-bars i:nth-child(2n) { animation-delay: .08s; } .mp-bars i:nth-child(3n) { animation-delay: .16s; }
@keyframes grow { from { transform: scaleY(.1); } }
.mp-kpi { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.mp-kpi div { padding: 10px 12px; border-radius: 12px; background: rgba(255,255,255,.06); }
.mp-kpi b { font: 750 20px var(--display); display: block; } .mp-kpi small { color: #a1a2ab; font-size: 11.5px; }
.mp-daytitle b { display: block; font-size: 13.5px; } .mp-daytitle small { color: #a1a2ab; font-size: 11.5px; }
.mp-day { position: relative; height: 46px; border-radius: 11px; background: rgba(255,255,255,.06); overflow: hidden; }
.mp-day span { position: absolute; top: 0; bottom: 0; background: var(--k); opacity: .9; border-right: 2px solid #15161a; }
.mp-day span.ov { top: 50%; opacity: 1; border-radius: 4px 4px 0 0; }
.mp-day::after { content: ""; position: absolute; top: 0; bottom: 0; width: 2px; background: #fff; left: 0; animation: playhead 12s linear infinite; box-shadow: 0 0 8px #fff; }
.mp-legend { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; font-size: 12px; color: #d1d1d6; }
.mp-legend li { display: flex; gap: 8px; align-items: center; } .mp-legend i { width: 10px; height: 10px; border-radius: 3px; }
.mp-form { display: flex; flex-direction: column; gap: 8px; }
.mp-form .r { padding: 9px 12px; border-radius: 11px; background: rgba(255,255,255,.06); display: flex; justify-content: space-between; font-size: 12px; color: #a1a2ab; }
.mp-form .r b { color: #f2f2f5; font-weight: 600; } .mono { font-family: "SF Mono", ui-monospace, Menlo, monospace; }
.mp-go { margin-top: 4px; padding: 10px; border-radius: 11px; text-align: center; font-size: 13px; font-weight: 650; background: #2f8cff; box-shadow: 0 10px 22px -10px #2f8cff; }
.mp-pkbars { display: flex; flex-direction: column; gap: 14px; margin-top: 6px; }
.mp-pkbars span { font-size: 12.5px; font-weight: 600; display: block; margin-bottom: 6px; }
.mp-pkbars i { display: block; height: 9px; border-radius: 5px; background: linear-gradient(90deg, #bf5af2, #2f8cff); transform-origin: left; animation: growX 1s var(--ease) both; }
@keyframes growX { from { transform: scaleX(.05); } }
.mp-shield { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; gap: 6px; }
.mp-shield i { font-size: 54px; color: #32d74b; filter: drop-shadow(0 8px 24px rgba(50,215,75,.5)); }
.mp-shield b { font-size: 15px; } .mp-shield small { color: #a1a2ab; font-size: 12px; }

/* düğme türleri */
.b.text { background: none; color: var(--ink); padding: 0 10px; }
.b.text:hover { background: rgba(0,0,0,.05); }
.b.light { background: #fff; color: var(--ink); box-shadow: 0 16px 40px -18px rgba(0,0,0,.5); }
.b.glass { background: rgba(255,255,255,.16); color: #fff; backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.35); }
.b.glass:hover { background: rgba(255,255,255,.24); }
.b.dark:hover { background: #000; }

/* ---------- hero ---------- */
.hero { position: relative; padding: 76px 0 40px; text-align: center; overflow: hidden; }
.hero::before { content: ""; position: absolute; inset: -20% -10% auto; height: 760px; background:
  radial-gradient(520px 300px at 22% 30%, rgba(255,59,48,.14), transparent 70%),
  radial-gradient(560px 320px at 78% 26%, rgba(0,113,227,.16), transparent 70%),
  radial-gradient(480px 300px at 50% 60%, rgba(191,90,242,.12), transparent 70%); pointer-events: none; }
.hero .wrap { position: relative; }
.eyebrow { transition: box-shadow .2s, transform .2s; display: inline-flex; align-items: center; gap: 8px; height: 32px; padding: 0 14px 0 6px; border-radius: 16px; background: #fff; border: 0.5px solid var(--hair-2); font-size: 13px; font-weight: 600; color: var(--ink); box-shadow: 0 6px 20px -12px rgba(0,0,0,.25); }
.eyebrow .dot { width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; background: var(--red); color: #fff; font-size: 12px; }
.hero h1 { font: 800 clamp(42px, 7vw, 82px)/1.02 var(--display); letter-spacing: -0.045em; margin: 22px auto 18px; max-width: 14ch; }
.hero .sub { font-size: clamp(18px, 2vw, 21px); color: var(--ink-2); max-width: 46ch; margin: 0 auto 30px; line-height: 1.45; }
.hero .ctas { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }
.hero .meta { margin-top: 16px; font-size: 13px; color: var(--ink-3); display: flex; gap: 18px; justify-content: center; flex-wrap: wrap; }
.hero .meta span { display: inline-flex; gap: 6px; align-items: center; }
.stage { position: relative; margin: 54px auto 0; max-width: 1180px; }
.stage .rx-window { animation: rise 1s var(--ease) both .15s; }
@keyframes rise { from { opacity: 0; transform: translateY(40px) scale(.98); } }
.float { position: absolute; z-index: 3; display: flex; gap: 10px; align-items: center; padding: 10px 14px 10px 10px; border-radius: 16px; background: rgba(255,255,255,.86); backdrop-filter: blur(20px) saturate(180%); -webkit-backdrop-filter: blur(20px) saturate(180%); border: 0.5px solid var(--hair-2); box-shadow: 0 24px 50px -24px rgba(0,0,0,.35); text-align: left; animation: floatIn .9s var(--ease) both; }
.float .fi { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; color: #fff; font-size: 17px; flex: none; }
.float b { display: block; font-size: 13px; }
.float small { display: block; font-size: 11.5px; color: var(--ink-2); }
.float.f1 { left: -34px; top: 90px; animation-delay: .7s; }
.float.f2 { right: -40px; top: 150px; animation-delay: .85s; }
.float.f3 { left: -20px; bottom: 120px; animation-delay: 1s; }
.float.f4 { right: -26px; bottom: 60px; animation-delay: 1.15s; }
@keyframes floatIn { from { opacity: 0; transform: translateY(14px) scale(.96); } }
.float.pulse { animation: none; }
.float.flash { box-shadow: 0 0 0 3px rgba(191,90,242,.35), 0 24px 50px -24px rgba(0,0,0,.35); transition: box-shadow .3s; }

/* ---------- güven şeridi ---------- */
.strip { padding: 34px 0 10px; }
.strip .wrap { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; }
.strip .s { display: flex; gap: 10px; align-items: center; justify-content: center; padding: 14px; border-radius: 16px; font-size: 13.5px; font-weight: 600; color: var(--ink-2); background: #fff; border: 0.5px solid var(--hair); }
.strip .s i { font-size: 20px; color: var(--ink); }

/* ---------- bölümler ---------- */
.sec { padding: 110px 0; }
.sec.alt { background: var(--canvas-2); }
.sec.dark { background: #0b0b0d; color: #f5f5f7; }
.sec.dark .lead, .sec.dark .ink2 { color: #a1a1a6; }
.kicker { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 600; color: var(--c, var(--blue)); margin-bottom: 14px; }
.kicker i { font-size: 18px; }
.sec h2 { font: 800 clamp(34px, 4.8vw, 56px)/1.05 var(--display); letter-spacing: -0.04em; margin: 0 0 18px; max-width: 18ch; }
.sec .lead { font-size: clamp(17px, 1.6vw, 20px); color: var(--ink-2); max-width: 52ch; margin: 0 0 34px; line-height: 1.5; }
.split { display: grid; grid-template-columns: 1fr 1.15fr; gap: 56px; align-items: center; }
.split.rev { grid-template-columns: 1.15fr 1fr; }
.split.rev > :first-child { order: 2; }
.ticks { list-style: none; padding: 0; margin: 0 0 28px; display: grid; gap: 12px; }
.ticks li { display: grid; grid-template-columns: 26px 1fr; gap: 10px; font-size: 15.5px; color: var(--ink); line-height: 1.45; }
.ticks li i { font-size: 20px; color: var(--c, var(--blue)); margin-top: 1px; }
.ticks li b { font-weight: 650; }
.sec.dark .ticks li { color: #e5e5ea; }
.center { text-align: center; }
.center h2, .center .lead { margin-left: auto; margin-right: auto; }

/* ---------- bento ---------- */
.bento { display: grid; grid-template-columns: repeat(6, 1fr); gap: 16px; }
.tile { grid-column: span 2; padding: 26px; border-radius: 28px; background: #fff; border: 0.5px solid var(--hair); position: relative; overflow: hidden; min-height: 210px; display: flex; flex-direction: column; }
.tile.w3 { grid-column: span 3; } .tile.w4 { grid-column: span 4; } .tile.w6 { grid-column: span 6; }
.tile .ti { width: 44px; height: 44px; border-radius: 13px; display: grid; place-items: center; font-size: 24px; color: var(--c, var(--blue)); background: color-mix(in srgb, var(--c, var(--blue)) 12%, transparent); margin-bottom: 16px; }
.tile h3 { margin: 0 0 6px; font: 700 20px/1.2 var(--display); letter-spacing: -0.02em; }
.tile p { margin: 0; color: var(--ink-2); font-size: 15px; line-height: 1.5; }
.tile .big { font: 800 52px/1 var(--display); letter-spacing: -0.04em; margin-top: auto; padding-top: 18px; }
.tile.ink { background: #111214; color: #f5f5f7; border-color: transparent; }
.tile.ink p { color: #a1a1a6; }

/* ---------- fiyat ---------- */
.plans { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; align-items: stretch; }
.plan { padding: 30px; border-radius: 28px; background: #fff; border: 0.5px solid var(--hair); display: flex; flex-direction: column; }
.plan.featured { background: #111214; color: #f5f5f7; border-color: transparent; box-shadow: 0 40px 80px -40px rgba(0,0,0,.6); position: relative; }
.plan .tag { position: absolute; top: 18px; right: 18px; font-size: 12px; font-weight: 700; padding: 4px 10px; border-radius: 10px; background: linear-gradient(90deg, var(--red), var(--purple)); color: #fff; }
.plan h3 { margin: 0; font: 750 24px var(--display); letter-spacing: -0.02em; }
.plan .for { color: var(--ink-2); font-size: 14px; margin: 6px 0 22px; }
.plan.featured .for, .plan.featured .pl-li.off { color: #a1a1a6; }
.plan ul { list-style: none; margin: 0 0 26px; padding: 0; display: grid; gap: 10px; flex: 1; }
.pl-li { display: grid; grid-template-columns: 22px 1fr; gap: 8px; font-size: 14.5px; }
.pl-li i { font-size: 17px; color: var(--green); margin-top: 2px; }
.pl-li.off { color: var(--ink-3); }
.pl-li.off i { color: var(--ink-3); }

/* ---------- SSS ---------- */
.faq { max-width: 820px; margin: 0 auto; }
.faq details { border-bottom: 0.5px solid var(--hair-2); }
.faq summary { list-style: none; cursor: pointer; padding: 22px 0; font: 650 19px var(--display); letter-spacing: -0.015em; display: flex; justify-content: space-between; gap: 20px; align-items: center; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary i { transition: transform .25s var(--ease); color: var(--ink-3); font-size: 20px; flex: none; }
.faq details[open] summary i { transform: rotate(45deg); color: var(--blue); }
.faq details p { margin: -6px 0 22px; color: var(--ink-2); font-size: 16px; max-width: 64ch; }

/* ---------- iletişim / CTA ---------- */
.cta-band { border-radius: 36px; padding: 70px 48px; text-align: center; color: #fff; position: relative; overflow: hidden;
  background: radial-gradient(500px 260px at 15% 0%, rgba(255,255,255,.2), transparent 60%), linear-gradient(135deg, #ff453a 0%, #bf5af2 50%, #0071e3 100%); }
.cta-band h2 { color: #fff; margin: 0 auto 14px; }
.cta-band p { font-size: 19px; opacity: .9; margin: 0 auto 30px; max-width: 48ch; }
.cta-band .b.primary { background: #fff; color: var(--ink); box-shadow: 0 16px 40px -18px rgba(0,0,0,.5); }
.cta-band .b.ghost { background: rgba(255,255,255,.18); color: #fff; }
.contact-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-top: 40px; }
.contact-card { padding: 24px; border-radius: 22px; background: #fff; border: 0.5px solid var(--hair); }
.contact-card i { font-size: 26px; color: var(--blue); }
.contact-card b { display: block; margin: 12px 0 2px; font-size: 15px; }
.contact-card span, .contact-card a { font-size: 14.5px; color: var(--ink-2); }
.contact-card a { color: var(--blue); font-weight: 600; }

/* ---------- footer ---------- */
.foot { background: #0b0b0d; color: #a1a1a6; padding: 80px 0 34px; margin-top: 0; }
.foot .top { display: grid; grid-template-columns: 1.4fr repeat(4, 1fr); gap: 34px; padding-bottom: 46px; border-bottom: 0.5px solid rgba(255,255,255,.1); }
.foot .brand { color: #f5f5f7; }
.foot p { font-size: 14px; line-height: 1.6; margin: 14px 0 20px; max-width: 34ch; }
.foot h6 { color: #f5f5f7; font-size: 13px; margin: 6px 0 14px; }
.foot ul { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; }
.foot ul a { color: #a1a1a6; font-size: 14px; }
.foot ul a:hover { color: #f5f5f7; }
.foot .badges { display: flex; gap: 8px; flex-wrap: wrap; }
.foot .badges span { display: inline-flex; gap: 6px; align-items: center; font-size: 12px; padding: 6px 10px; border-radius: 10px; background: rgba(255,255,255,.06); color: #d1d1d6; }
.foot .bottom { display: flex; justify-content: space-between; gap: 20px; padding-top: 26px; font-size: 12.5px; flex-wrap: wrap; }
.foot .bottom a { color: #a1a1a6; }
.foot-sig { font: 800 clamp(60px, 13vw, 168px)/0.9 var(--display); letter-spacing: -0.06em; color: transparent; background: linear-gradient(180deg, rgba(255,255,255,.14), rgba(255,255,255,0)); -webkit-background-clip: text; background-clip: text; margin: 46px 0 -10px; user-select: none; }

/* ---------- demo isteği penceresi ---------- */
.dlg { position: fixed; inset: 0; z-index: 100; background: rgba(0,0,0,.35); backdrop-filter: blur(8px); display: grid; place-items: center; padding: 20px; }
.dlg-card { width: 100%; max-width: 480px; background: #fff; border-radius: 26px; padding: 30px; box-shadow: 0 40px 100px -30px rgba(0,0,0,.5); animation: rise .35s var(--ease); position: relative; }
.dlg-card h3 { margin: 0 0 6px; font: 750 26px var(--display); letter-spacing: -0.02em; }
.dlg-card p { margin: 0 0 20px; color: var(--ink-2); font-size: 15px; }
.dlg-x { position: absolute; right: 16px; top: 16px; width: 34px; height: 34px; border-radius: 50%; border: 0; background: rgba(0,0,0,.05); cursor: pointer; font-size: 16px; }
.fld { display: block; margin-bottom: 12px; font-size: 13px; color: var(--ink-2); }
.fld input, .fld select, .fld textarea { display: block; width: 100%; margin-top: 5px; height: 46px; padding: 0 14px; border-radius: 13px; border: 0.5px solid var(--hair-2); background: var(--canvas); font: inherit; font-size: 15px; color: var(--ink); outline: none; }
.fld textarea { height: 90px; padding: 12px 14px; resize: vertical; }
.fld input:focus, .fld select:focus, .fld textarea:focus { border-color: var(--blue); box-shadow: 0 0 0 4px rgba(0,113,227,.15); }
.seg-pick { display: flex; gap: 6px; margin-bottom: 14px; flex-wrap: wrap; }
.seg-pick label { flex: 1; min-width: 120px; }
.seg-pick input { display: none; }
.seg-pick span { display: flex; gap: 6px; align-items: center; justify-content: center; height: 42px; border-radius: 12px; border: 0.5px solid var(--hair-2); cursor: pointer; font-size: 14px; font-weight: 600; color: var(--ink-2); }
.seg-pick input:checked + span { border-color: var(--blue); color: var(--blue); background: rgba(0,113,227,.07); }
.dlg-ok { text-align: center; padding: 20px 0; }
.dlg-ok i { font-size: 56px; color: var(--green); }

/* =========================================================
   .rx — ürün ekranı canlandırmaları (uygulamanın koyu teması)
   ========================================================= */
.rx { --bg: #16171b; --panel: #22232a; --panel-2: #1c1d22; --line: rgba(255,255,255,.075); --line-2: rgba(255,255,255,.13); --tx: #f2f2f5; --tx2: #a1a2ab; --tx3: #6d6e78;
  --acc: #2f8cff; --deckb: #ffb340; --tally: #ff453a; --grn: #32d74b; --org: #ff9f0a; --pur: #bf5af2; --fg: 255,255,255; --well: rgba(0,0,0,.28);
  color: var(--tx); font-size: 12px; line-height: 1.4; letter-spacing: -0.005em; text-align: left; }
.rx.rx-light { --bg: #f2f2f7; --panel: #ffffff; --panel-2: #fbfbfd; --line: rgba(0,0,0,.08); --line-2: rgba(0,0,0,.13); --tx: #1d1d1f; --tx2: #6e6e73; --tx3: #a1a1a6; --acc: #007aff; --deckb: #ff9500; --fg: 0,0,0; --well: #ffffff; }
.rx-window { border-radius: 18px; overflow: hidden; background: var(--bg); box-shadow: 0 60px 120px -50px rgba(20,20,40,.55), 0 0 0 0.5px rgba(0,0,0,.25), 0 0 0 6px rgba(255,255,255,.6); transition: background .4s; }
.rx-bar { display: flex; align-items: center; gap: 8px; height: 34px; padding: 0 14px; background: color-mix(in srgb, var(--bg) 85%, #000 15%); border-bottom: 0.5px solid var(--line); }
.rx.rx-light .rx-bar { background: #e8e8ed; }
.rx-bar span { width: 11px; height: 11px; border-radius: 50%; background: #ff5f57; }
.rx-bar span:nth-child(2) { background: #febc2e; } .rx-bar span:nth-child(3) { background: #28c840; }
.rx-bar em { font-style: normal; margin: 0 auto; color: var(--tx3); font-size: 11.5px; padding-right: 50px; }
.rx i.ph-duotone, .rx i.ph-fill { font-size: 1.15em; }
.rx-app { display: grid; grid-template-columns: 168px 1fr; min-height: 560px; }
.rx-side { padding: 12px 8px; border-right: 0.5px solid var(--line); background: rgba(var(--fg),.02); }
.rx-brand { display: flex; gap: 8px; align-items: center; padding: 2px 6px 12px; }
.rx-brand .bm { width: 26px; height: 26px; border-radius: 8px; display: grid; place-items: center; color: #fff; background: linear-gradient(160deg, #ff6a5f, #d7261b); font-size: 15px; }
.rx-brand b { display: block; font-size: 12px; } .rx-brand small { color: var(--tx3); font-size: 10px; }
.rx-nav a { display: flex; align-items: center; gap: 8px; height: 26px; padding: 0 8px; border-radius: 7px; color: var(--tx2); font-size: 11.5px; font-weight: 500; }
.rx-nav a i { color: var(--tx3); }
.rx-nav a.on { background: rgba(var(--fg),.09); color: var(--tx); } .rx-nav a.on i { color: var(--acc); }
.rx-nav .g { font-size: 10px; font-weight: 600; color: var(--tx3); padding: 9px 8px 3px; }
.rx-main { min-width: 0; display: flex; flex-direction: column; }
.rx-top { display: flex; align-items: center; gap: 10px; height: 42px; padding: 0 14px; border-bottom: 0.5px solid var(--line); }
.rx-top b { font-size: 13px; }
.rx-chip { display: inline-flex; align-items: center; gap: 5px; height: 19px; padding: 0 7px; border-radius: 10px; font-size: 10.5px; font-weight: 600; background: rgba(var(--fg),.08); color: var(--tx2); white-space: nowrap; }
.rx-chip.g { color: var(--grn); background: rgba(50,215,75,.13); }
.rx-chip.o { color: var(--org); background: rgba(255,159,10,.14); }
.rx-chip.p { color: var(--pur); background: rgba(191,90,242,.15); }
.rx-chip .d { width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.rx-seg { display: inline-flex; padding: 2px; border-radius: 8px; background: var(--well); border: 0.5px solid var(--line); }
.rx-seg span { height: 22px; padding: 0 9px; border-radius: 6px; font-size: 11px; font-weight: 600; display: inline-flex; align-items: center; gap: 4px; color: var(--tx2); }
.rx-seg span.on { background: rgba(50,215,75,.2); color: var(--grn); }
.rx-tally { display: inline-flex; align-items: center; gap: 6px; height: 24px; padding: 0 9px; border-radius: 7px; font-size: 10.5px; font-weight: 800; letter-spacing: .04em; color: var(--tx3); background: rgba(var(--fg),.05); }
.rx-tally .l { width: 7px; height: 7px; border-radius: 50%; background: #4a4a52; }
.rx-tally.live { color: #fff; background: linear-gradient(180deg, #ff5247, #d9261c); box-shadow: 0 0 22px -4px rgba(255,69,58,.85); }
.rx-tally.live .l { background: #fff; box-shadow: 0 0 8px #fff; animation: rxlamp 1.6s infinite; }
@keyframes rxlamp { 50% { opacity: .5; } }
.rx-clock { font: 650 15px var(--display); font-variant-numeric: tabular-nums; }
.rx-sp { flex: 1; }

/* player */
.rx-player { display: grid; grid-template-columns: minmax(170px, 230px) minmax(0, 1fr) auto; gap: 16px; align-items: center; padding: 10px 14px; border-bottom: 0.5px solid var(--line); background: var(--well); }
.rx-now { display: grid; grid-template-columns: 46px 1fr; gap: 10px; align-items: center; min-width: 0; }
.rx-art { position: relative; width: 46px; height: 46px; border-radius: 12px; display: grid; place-items: center; font-size: 22px; color: #fff; background: linear-gradient(145deg, var(--a1, #2f8cff), #5e5ce6); box-shadow: 0 10px 22px -12px var(--a1, #2f8cff); transition: background .5s; }
.rx-art .cd { position: absolute; left: 4px; top: 3px; font-size: 9px; font-weight: 800; background: rgba(0,0,0,.28); padding: 0 4px; border-radius: 4px; }
.rx-art .eq { position: absolute; right: 4px; bottom: 4px; }
.rx-now b { display: block; font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rx-now small { display: block; color: var(--tx2); font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rx-tags { display: flex; gap: 4px; margin-top: 4px; }
.rx-center { display: flex; flex-direction: column; gap: 5px; min-width: 0; }
.rx-ctrl { display: flex; justify-content: center; align-items: center; gap: 8px; }
.rx-btn { width: 30px; height: 30px; border-radius: 50%; border: 0; background: none; color: var(--tx); display: grid; place-items: center; cursor: pointer; font-size: 15px; }
.rx-btn:hover { background: rgba(var(--fg),.08); }
.rx-btn.main { position: relative; width: 40px; height: 40px; background: var(--tx); color: var(--bg); font-size: 18px; }
.rx-btn.main svg { position: absolute; inset: -4px; width: 48px; height: 48px; transform: rotate(-90deg); }
.rx-btn.main circle { fill: none; stroke: rgba(var(--fg),.12); stroke-width: 2.5; }
.rx-btn.main circle.v { stroke: var(--grn); stroke-linecap: round; stroke-dasharray: 138.2; }
.rx-btn.next { width: auto; height: 28px; padding: 0 11px; border-radius: 14px; font-size: 11px; font-weight: 700; gap: 5px; display: inline-flex; background: rgba(50,215,75,.15); color: var(--grn); }
.rx-scrub { display: grid; grid-template-columns: 34px 1fr 40px; gap: 8px; align-items: center; font-size: 10.5px; color: var(--tx2); font-variant-numeric: tabular-nums; }
.rx-scrub .r { text-align: right; color: var(--tx); font-weight: 600; }
.rx-scrub .r.crit { color: var(--tally); }
.rx-wave { height: 26px; width: 100%; display: block; }
.rx-right { display: flex; align-items: center; gap: 10px; }
.rx-next { padding: 5px 9px; border-radius: 10px; background: rgba(var(--fg),.045); border: 0.5px solid var(--line); max-width: 160px; }
.rx-next small { display: block; font-size: 9.5px; color: var(--tx3); font-variant-numeric: tabular-nums; }
.rx-next b { display: block; font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rx-talk { height: 26px; padding: 0 10px; border-radius: 13px; border: 0.5px solid var(--line-2); background: none; color: var(--tx2); font-size: 11px; font-weight: 600; display: inline-flex; gap: 5px; align-items: center; cursor: pointer; user-select: none; }
.rx-talk.on { background: var(--tally); color: #fff; border-color: transparent; box-shadow: 0 0 18px -4px var(--tally); }
.rx-spec { width: 64px; height: 26px; }
.rx-vu { display: flex; gap: 2px; height: 30px; }
.rx-vu i { width: 5px; border-radius: 3px; background: rgba(var(--fg),.08); position: relative; overflow: hidden; }
.rx-vu i b { position: absolute; left: 0; right: 0; bottom: 0; height: 0; background: linear-gradient(0deg, #32d74b 0%, #32d74b 62%, #ffd60a 80%, #ff453a 96%); background-size: 100% 30px; background-position: bottom; transition: height .08s; }
.rx .eq { display: inline-flex; align-items: flex-end; gap: 2px; height: 12px; }
.rx .eq i { width: 2.5px; border-radius: 2px; background: currentColor; height: 30%; animation: rxeq .9s ease-in-out infinite; }
.rx .eq i:nth-child(2) { animation-delay: -.3s; } .rx .eq i:nth-child(3) { animation-delay: -.6s; } .rx .eq i:nth-child(4) { animation-delay: -.15s; }
.rx .eq.paused i { animation-play-state: paused; }
@keyframes rxeq { 0%, 100% { height: 25%; } 50% { height: 100%; } }
.rx-ic { display: inline-flex; align-items: center; gap: 4px; height: 18px; padding: 0 6px; border-radius: 9px; font-size: 10px; font-weight: 700; font-variant-numeric: tabular-nums; }
.rx-ic.in { color: var(--grn); background: rgba(50,215,75,.14); } .rx-ic.sg { color: var(--org); background: rgba(255,159,10,.14); }

/* içerik */
.rx-body { display: grid; grid-template-columns: minmax(0, 1fr) 230px; gap: 12px; padding: 12px; flex: 1; }
.rx-panel { border-radius: 12px; background: color-mix(in srgb, var(--panel) 70%, transparent); border: 0.5px solid var(--line); overflow: hidden; }
.rx-ph { display: flex; align-items: center; gap: 7px; padding: 8px 11px; border-bottom: 0.5px solid var(--line); font-size: 11.5px; font-weight: 600; }
.rx-ph i { color: var(--tx2); }
.rx-rot { display: flex; align-items: center; gap: 8px; padding: 7px 11px; background: linear-gradient(90deg, rgba(191,90,242,.16), transparent); border-bottom: 0.5px solid var(--line); font-size: 11px; }
.rx-rot b { font-size: 11.5px; } .rx-rot span { color: var(--tx2); }
.rx-q { position: relative; }
.rx-row { display: grid; grid-template-columns: 14px 46px 22px minmax(0, 1fr) 24px 40px; gap: 8px; align-items: center; padding: 6px 11px; border-bottom: 0.5px solid var(--line); position: relative; transition: background .4s, opacity .4s; }
.rx-row .t { color: var(--tx2); font-size: 10.5px; font-variant-numeric: tabular-nums; }
.rx-row .k { width: 22px; height: 22px; border-radius: 6px; display: grid; place-items: center; font-size: 12px; color: #6db0ff; background: rgba(47,140,255,.14); }
.rx-row .k.j { color: #d48cff; background: rgba(191,90,242,.15); }
.rx-row .k.ad { color: var(--org); background: rgba(255,159,10,.14); }
.rx-row .ti b { display: block; font-size: 11.5px; font-weight: 550; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rx-row .ti small { display: block; color: var(--tx2); font-size: 10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rx-row .du { text-align: right; color: var(--tx2); font-variant-numeric: tabular-nums; font-size: 10.5px; }
.rx-row.played { opacity: .42; } .rx-row.played .t { text-decoration: line-through; }
.rx-row.now { background: linear-gradient(90deg, rgba(50,215,75,.2), rgba(47,140,255,.08) 70%, transparent); }
.rx-row.now::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: var(--grn); }
.rx-row.now .ti b, .rx-row.now .t { color: #7cf08e; font-weight: 700; }
.rx.rx-light .rx-row.now .ti b, .rx.rx-light .rx-row.now .t { color: #1f8a3a; }
.rx-row.now .pr { position: absolute; left: 11px; right: 11px; bottom: 2px; height: 2px; border-radius: 2px; background: rgba(var(--fg),.08); }
.rx-row.now .pr i { display: block; height: 100%; background: var(--grn); width: 0; }
.rx-row .g { color: var(--tx3); font-size: 11px; }
.rx-loop { display: flex; align-items: center; gap: 6px; padding: 5px 11px; font-size: 10.5px; font-weight: 700; color: #d48cff; background: rgba(191,90,242,.08); border-bottom: 0.5px solid var(--line); }
.rx-loop .ln { flex: 1; height: 1px; background: currentColor; opacity: .25; }
.rx-loop.fresh { animation: rxfresh 1.4s var(--ease); }
@keyframes rxfresh { from { background: rgba(191,90,242,.45); } }
.cb { display: inline-grid; place-items: center; min-width: 20px; height: 20px; padding: 0 4px; border-radius: 6px; font: 800 10.5px var(--font); color: #fff; background: var(--c, #8e8e93); box-shadow: inset 0 -1px 0 rgba(0,0,0,.18); }
.cb.lg { min-width: 30px; height: 30px; border-radius: 9px; font-size: 14px; }
.cb.xl { min-width: 46px; height: 46px; border-radius: 13px; font-size: 21px; }
.cb[data-c=A] { --c: var(--cat-a); } .cb[data-c=B] { --c: var(--cat-b); } .cb[data-c=C] { --c: var(--cat-c); } .cb[data-c=D] { --c: var(--cat-d); }
.rx-pads { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; padding: 9px; }
.rx-pad { position: relative; height: 50px; border-radius: 9px; border: 0.5px solid var(--line-2); background: rgba(var(--fg),.045); padding: 6px 8px; text-align: left; cursor: pointer; overflow: hidden; display: flex; flex-direction: column; justify-content: space-between; color: var(--tx); }
.rx-pad::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: var(--p, var(--pur)); }
.rx-pad b { font-size: 10.5px; line-height: 1.2; position: relative; z-index: 1; }
.rx-pad small { display: flex; justify-content: space-between; font-size: 9.5px; color: var(--tx3); position: relative; z-index: 1; }
.rx-pad .fill { position: absolute; inset: 0; width: 0; background: color-mix(in srgb, var(--p, var(--pur)) 32%, transparent); }
.rx-pad.on { border-color: var(--p, var(--pur)); box-shadow: 0 0 18px -6px var(--p, var(--pur)); }
.rx-pad.empty { border-style: dashed; color: var(--tx3); justify-content: center; align-items: center; cursor: default; font-size: 10px; }
.rx-pad.empty::before { display: none; }
.rx-up li { list-style: none; display: flex; align-items: center; gap: 8px; padding: 6px 11px; border-bottom: 0.5px solid var(--line); font-size: 11px; }
.rx-up ul { margin: 0; padding: 0; }
.rx-up .w { font-weight: 700; font-variant-numeric: tabular-nums; width: 36px; }
.rx-up .c { margin-left: auto; color: var(--tx3); font-variant-numeric: tabular-nums; font-size: 10.5px; }
.rx-up .ki { width: 20px; height: 20px; border-radius: 6px; display: grid; place-items: center; }

/* bağımsız demo panelleri */
.demo { position: relative; }
.demo .rx-window { box-shadow: 0 50px 100px -50px rgba(20,20,40,.5), 0 0 0 0.5px rgba(0,0,0,.2); }
.demo-pad { padding: 16px; }
.slots { display: flex; flex-wrap: wrap; gap: 8px; }
.slot { width: 62px; height: 68px; border-radius: 13px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; background: color-mix(in srgb, var(--c) 16%, transparent); border: 0.5px solid color-mix(in srgb, var(--c) 45%, transparent); position: relative; }
.slot .n { position: absolute; top: 3px; left: 6px; font-size: 9px; color: var(--tx3); }
.slot small { font-size: 9px; color: var(--tx2); }
.slot.end { border-style: dashed; background: transparent; --c: #8e8e93; }
.fillrows { margin-top: 14px; }
.fr { display: grid; grid-template-columns: 22px 28px minmax(0, 1fr) auto; gap: 9px; align-items: center; padding: 7px 4px; border-bottom: 0.5px solid var(--line); font-size: 11.5px; }
.fr .n { color: var(--tx3); font-variant-numeric: tabular-nums; text-align: center; }
.fr b { font-weight: 600; } .fr small { color: var(--tx2); }
.fr .cnt { font-size: 10.5px; color: var(--tx2); font-variant-numeric: tabular-nums; }
.fr.swap { animation: rxswap .6s var(--ease); }
@keyframes rxswap { from { opacity: 0; transform: translateX(8px); } }
.rx-btnrow { display: flex; gap: 8px; margin-top: 12px; flex-wrap: wrap; }
.rx-b { height: 30px; padding: 0 12px; border-radius: 9px; border: 0.5px solid var(--line-2); background: rgba(var(--fg),.06); color: var(--tx); font-size: 11.5px; font-weight: 600; display: inline-flex; gap: 6px; align-items: center; cursor: pointer; }
.rx-b:hover { background: rgba(var(--fg),.1); }
.rx-b.p { background: var(--grn); color: #04230b; border-color: transparent; }
.rx-b.blue { background: var(--acc); color: #fff; border-color: transparent; }
.catcard { padding: 16px; }
.catcard .hd { display: flex; gap: 12px; align-items: center; margin-bottom: 12px; }
.catcard .hd b { display: block; font-size: 14px; } .catcard .hd small { color: var(--tx2); }
.rules { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
.rules label { font-size: 10.5px; color: var(--tx2); display: block; }
.rules .ctl { display: flex; align-items: center; gap: 8px; margin-top: 5px; }
.rules input[type=range] { flex: 1; accent-color: var(--cat-a); }
.rules .v { min-width: 26px; height: 26px; border-radius: 8px; display: grid; place-items: center; background: var(--well); border: 0.5px solid var(--line-2); font-weight: 700; font-variant-numeric: tabular-nums; }
.meter { height: 8px; border-radius: 8px; overflow: hidden; display: flex; background: rgba(var(--fg),.08); margin-top: 14px; }
.meter i { height: 100%; transition: width .5s var(--ease); }
.dist { display: flex; align-items: flex-end; gap: 4px; height: 56px; margin: 12px 0 18px; }
.dist div { flex: 1; border-radius: 4px 4px 1px 1px; background: var(--cat-a); opacity: .85; position: relative; transition: height .5s var(--ease); min-height: 3px; }
.dist div span { position: absolute; bottom: -15px; left: 0; right: 0; text-align: center; font-size: 9px; color: var(--tx3); }
.capnote { font-size: 11px; color: var(--tx2); }
.capnote b { color: var(--tx); }
.plan-rows .prw { display: grid; grid-template-columns: 50px 1fr 82px; gap: 10px; align-items: center; padding: 9px 12px; border-bottom: 0.5px solid var(--line); }
.plan-rows .tm { font: 650 13px var(--display); font-variant-numeric: tabular-nums; }
.spots { display: flex; gap: 4px; flex-wrap: wrap; }
.spot { height: 20px; display: inline-flex; align-items: center; padding: 0 7px; border-radius: 6px; font-size: 10px; background: rgba(255,159,10,.15); color: #ffc46b; white-space: nowrap; }
.fb { height: 5px; border-radius: 5px; background: rgba(var(--fg),.08); overflow: hidden; margin-top: 4px; }
.fb i { display: block; height: 100%; background: var(--org); }
.wheel svg { width: 100%; max-width: 220px; display: block; margin: 0 auto; }
.grid7 { display: grid; grid-template-columns: 28px repeat(24, 1fr); gap: 2px; margin-top: 14px; }
.grid7 .d { font-size: 9px; color: var(--tx2); font-weight: 600; display: flex; align-items: center; }
.grid7 .c { height: 14px; border-radius: 3px; background: rgba(var(--fg),.06); }
.fold { display: grid; grid-template-columns: 34px 1fr auto; gap: 10px; align-items: center; padding: 10px 12px; border-bottom: 0.5px solid var(--line); }
.fold .fi { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; font-size: 17px; }
.fold b { display: block; font-size: 12px; } .fold small { color: var(--tx2); font-size: 10.5px; }
.lic-demo { display: grid; grid-template-columns: 1fr 1fr; gap: 0; }
.lic-demo .side { padding: 14px; border-right: 0.5px solid var(--line); }
.tg { display: flex; align-items: center; justify-content: space-between; padding: 7px 0; font-size: 11.5px; border-bottom: 0.5px solid var(--line); }
.sw { position: relative; width: 32px; height: 19px; border-radius: 10px; background: rgba(var(--fg),.16); cursor: pointer; transition: background .2s; border: 0; flex: none; }
.sw::after { content: ""; position: absolute; left: 2px; top: 2px; width: 15px; height: 15px; border-radius: 50%; background: #fff; transition: transform .2s var(--ease); box-shadow: 0 1px 4px rgba(0,0,0,.35); }
.sw.on { background: var(--grn); } .sw.on::after { transform: translateX(13px); }
.lic-client { position: relative; padding: 14px; min-height: 280px; }
.lic-client .navi a { display: flex; gap: 7px; align-items: center; padding: 6px 8px; border-radius: 7px; font-size: 11.5px; color: var(--tx2); transition: opacity .3s; }
.lic-client .navi a.off { opacity: .2; text-decoration: line-through; }
.lic-lock { position: absolute; inset: 0; display: grid; place-items: center; background: rgba(16,16,19,.82); backdrop-filter: blur(6px); text-align: center; padding: 20px; opacity: 0; pointer-events: none; transition: opacity .35s; }
.lic-lock.on { opacity: 1; pointer-events: auto; }
.lic-lock .ic { width: 46px; height: 46px; border-radius: 14px; display: grid; place-items: center; margin: 0 auto 10px; font-size: 24px; color: #ff6961; background: rgba(255,69,58,.15); }
.lic-banner { display: flex; gap: 8px; align-items: center; padding: 7px 10px; border-radius: 9px; margin-bottom: 10px; font-size: 11px; background: rgba(255,159,10,.14); color: #ffd28a; opacity: 0; transform: translateY(-4px); transition: all .35s var(--ease); }
.lic-banner.on { opacity: 1; transform: none; }
.rx-sel { height: 28px; border-radius: 8px; border: 0.5px solid var(--line-2); background: var(--well); color: var(--tx); font-size: 11.5px; padding: 0 8px; }
.deckmini { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; padding: 12px; }
.dk { border-radius: 12px; padding: 10px; background: color-mix(in srgb, var(--panel) 70%, transparent); border: 0.5px solid var(--line); position: relative; overflow: hidden; }
.dk::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 2px; background: var(--dc); opacity: .4; }
.dk.on { border-color: color-mix(in srgb, var(--dc) 45%, transparent); box-shadow: 0 14px 40px -22px var(--dc); }
.dk.on::before { opacity: 1; }
.dk .tg2 { display: inline-grid; place-items: center; width: 18px; height: 18px; border-radius: 5px; background: var(--dc); color: #111; font-size: 10px; font-weight: 800; }
.dk b { display: block; margin: 7px 0 1px; font-size: 13px; } .dk small { color: var(--tx2); }
.dk canvas { width: 100%; height: 46px; display: block; margin: 8px 0 6px; border-radius: 7px; background: var(--well); }
.dk .rm { font: 650 20px var(--display); font-variant-numeric: tabular-nums; }

/* ---------- duyarlı ---------- */
@media (max-width: 1100px) {
  .float.f1, .float.f3 { left: 8px; } .float.f2, .float.f4 { right: 8px; }
  .rx-body { grid-template-columns: 1fr; } .rx-body > :last-child { display: none; }
}
@media (max-width: 900px) {
  .menu, .nav-cta .b.ghost { display: none; }
  .burger { display: grid; place-items: center; margin-left: auto; }
  .nav.mobile .menu { display: flex; flex-direction: column; position: absolute; left: 0; right: 0; top: 60px; background: var(--canvas); padding: 12px 18px 20px; border-bottom: 0.5px solid var(--hair); max-height: calc(100vh - 60px); overflow: auto; }
  .nav.mobile .mega { position: static; opacity: 1; visibility: visible; transform: none; box-shadow: none; background: none; border: 0; display: none; }
  .nav.mobile .menu > li.open .mega { display: block; }
  .split, .split.rev { grid-template-columns: 1fr; gap: 34px; } .split.rev > :first-child { order: 0; }
  .strip .wrap { grid-template-columns: repeat(2, 1fr); }
  .bento { grid-template-columns: 1fr; } .tile, .tile.w3, .tile.w4, .tile.w6 { grid-column: auto; }
  .plans, .contact-grid { grid-template-columns: 1fr; }
  .foot .top { grid-template-columns: 1fr 1fr; }
  .rx-app { grid-template-columns: 1fr; } .rx-side { display: none; }
  .rx-player { grid-template-columns: 1fr; } .rx-right { display: none; }
  .float { display: none; }
  .sec { padding: 76px 0; }
  .lic-demo { grid-template-columns: 1fr; }
  .cta-band { padding: 50px 22px; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; } html { scroll-behavior: auto; } }

/* ---------- ince ayarlar ---------- */
.rx-app { grid-template-columns: 186px 1fr; }
.rx-nav a { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#playerDemo .rx-player { grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); row-gap: 10px; }
#playerDemo .rx-right { grid-column: 1 / -1; justify-content: flex-end; display: flex; }
.lic-hint { text-align: center; color: #86868b; font-size: 13px; margin: 14px 0 0; }
.split > * { min-width: 0; }
.rx-window { max-width: 100%; }
html, body { overflow-x: clip; }

/* =================== v1.3 =================== */
.eyebrow:hover { transform: translateY(-1px); box-shadow: 0 10px 26px -12px rgba(0,0,0,.3); }
.eyebrow .dot { background: var(--green); }
.eyebrow > i { font-size: 11px; color: var(--ink-3); }

/* ---------- reklam kuşağı dizisi ---------- */
.brk { padding: 14px 14px 4px; }
.brk-h { display: flex; align-items: baseline; gap: 8px; margin-bottom: 9px; color: #f2f2f5; }
.brk-h b { font-size: 13px; } .brk-h small { color: #8e8e93; font-size: 11.5px; }
.brk-t { margin-left: auto; font: 600 11.5px var(--display); color: #a1a2ab; font-variant-numeric: tabular-nums; }
.brk-line { position: relative; display: flex; gap: 3px; height: 40px; }
.bk { display: flex; align-items: center; justify-content: center; gap: 5px; border-radius: 8px; font-size: 10.5px; font-weight: 700; white-space: nowrap; overflow: hidden; min-width: 0; transition: filter .3s, box-shadow .3s; }
.bk i { font-size: 12px; }
.bk.g { background: rgba(47,140,255,.2); color: #8cc0ff; } .bk.c { background: rgba(191,90,242,.22); color: #dda4ff; }
.bk.s { background: rgba(255,159,10,.2); color: #ffc46b; } .bk.x { background: rgba(255,255,255,.09); color: #c7c7cc; }
.bk.live { filter: brightness(1.45); box-shadow: inset 0 0 0 1px rgba(255,255,255,.45); }
.brk-ph { position: absolute; top: -4px; bottom: -4px; width: 2px; left: 0; background: #fff; border-radius: 1px; box-shadow: 0 0 10px rgba(255,255,255,.9); }

/* ---------- çevrimdışı ---------- */
.off-sec { background: radial-gradient(700px 420px at 80% 20%, rgba(50,215,75,.12), transparent 70%), radial-gradient(600px 400px at 10% 90%, rgba(47,140,255,.1), transparent 70%), #08090b; color: #f5f5f7; overflow: hidden; }
.off-sec .lead { color: #a1a1a6; }
.off-sec h2 { font-size: clamp(40px, 5.6vw, 68px); max-width: none; }
.off-grid { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 60px; align-items: center; }
.off-switch { display: flex; align-items: center; gap: 18px; padding: 18px 20px; border-radius: 22px; background: rgba(255,255,255,.05); box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.12); max-width: 470px; transition: background .4s, box-shadow .4s; }
.off-switch.off { background: rgba(255,159,10,.09); box-shadow: inset 0 0 0 0.5px rgba(255,159,10,.45); }
.os-l { flex: 1; } .os-l b { display: block; font-size: 16px; } .os-l small { color: #a1a1a6; font-size: 13px; }
.os-btn { position: relative; width: 64px; height: 36px; border-radius: 18px; border: 0; cursor: pointer; background: rgba(255,255,255,.18); transition: background .3s; flex: none; }
.os-btn span { position: absolute; top: 3px; left: 3px; width: 30px; height: 30px; border-radius: 50%; background: #fff; box-shadow: 0 3px 8px rgba(0,0,0,.35); transition: transform .3s var(--ease); }
.os-btn.on { background: #32d74b; } .os-btn.on span { transform: translateX(28px); }
.off-try { font-size: 13px; color: #6e6e73; margin: 10px 0 34px; }
.off-facts { display: grid; gap: 18px; }
.off-facts > div { display: grid; grid-template-columns: 40px 1fr; column-gap: 14px; }
.off-facts .of-i { grid-row: span 2; width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; font-size: 21px; background: rgba(255,255,255,.07); color: #7cf08e; }
.off-facts b { font-size: 15px; } .off-facts small { color: #a1a1a6; font-size: 13.5px; line-height: 1.45; }
.off-win { box-shadow: 0 60px 120px -50px rgba(0,0,0,.9), 0 0 0 0.5px rgba(255,255,255,.1); }
.off-top { display: flex; align-items: center; gap: 10px; padding: 12px 16px; border-bottom: 0.5px solid var(--line); }
.off-top > b { font-size: 14px; }
.off-pill { display: inline-flex; align-items: center; gap: 8px; height: 36px; padding: 0 12px 0 10px; border-radius: 11px; background: rgba(50,215,75,.1); box-shadow: inset 0 0 0 0.5px rgba(50,215,75,.4); transition: background .4s, box-shadow .4s; }
.off-pill > i { font-size: 18px; color: #32d74b; }
.off-pill b { display: block; font-size: 12px; line-height: 1.1; } .off-pill small { display: block; font-size: 10.5px; color: #a1a2ab; line-height: 1.1; }
.off-win.off .off-pill { background: rgba(255,159,10,.14); box-shadow: inset 0 0 0 0.5px rgba(255,159,10,.5); }
.off-win.off .off-pill > i { color: #ff9f0a; animation: offBlink 1.6s infinite; }
.off-win.sync .off-pill > i { color: #2f8cff; animation: spin 1s linear infinite; }
@keyframes offBlink { 50% { opacity: .35; } }
@keyframes spin { to { transform: rotate(360deg); } }
.off-now { display: grid; grid-template-columns: 52px 1fr auto; gap: 14px; align-items: center; padding: 16px; border-bottom: 0.5px solid var(--line); }
.off-now .rx-art { width: 52px; height: 52px; }
.off-meta b { display: block; font-size: 15px; } .off-meta small { color: #a1a2ab; font-size: 12px; }
.off-prog { height: 4px; border-radius: 2px; background: rgba(255,255,255,.1); margin-top: 9px; overflow: hidden; }
.off-prog i { display: block; height: 100%; width: 0; background: #32d74b; border-radius: 2px; }
.off-rem { font: 650 20px var(--display); font-variant-numeric: tabular-nums; color: #f2f2f5; }
.off-body { display: grid; grid-template-columns: 1.15fr 1fr; min-height: 270px; }
.off-q { padding: 10px 12px; border-right: 0.5px solid var(--line); display: flex; flex-direction: column; gap: 4px; }
.off-q .qr { display: grid; grid-template-columns: 22px 1fr auto; gap: 9px; align-items: center; padding: 7px 8px; border-radius: 9px; font-size: 12px; animation: qIn .5s var(--ease); }
.off-q .qr small { display: block; color: #8e8e93; font-size: 10.5px; }
.off-q .qr .d { color: #8e8e93; font-variant-numeric: tabular-nums; font-size: 11px; }
.off-q .qr.loop { grid-template-columns: 1fr; padding: 4px 8px; font-size: 10.5px; color: #d48cff; font-weight: 700; background: rgba(191,90,242,.1); }
@keyframes qIn { from { opacity: 0; transform: translateY(6px); } }
.off-log { padding: 12px 14px; display: flex; flex-direction: column; }
.off-lh { font-size: 11.5px; font-weight: 700; color: #a1a2ab; display: flex; gap: 6px; align-items: center; margin-bottom: 8px; }
.off-lh i { font-size: 15px; color: #6db0ff; transition: color .3s; }
.off-win.off .off-lh i { color: #32d74b; }
.off-log ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; flex: 1; overflow: hidden; }
.off-log li { font-size: 11.5px; color: #d1d1d6; display: grid; grid-template-columns: 40px 1fr; gap: 6px; animation: qIn .45s var(--ease); line-height: 1.35; }
.off-log li em { font-style: normal; color: #6e6e73; font-variant-numeric: tabular-nums; }
.off-log li.ok { color: #7cf08e; } .off-log li.warn { color: #ffc46b; } .off-log li.blue { color: #8cc0ff; }
.off-out { display: flex; justify-content: space-between; align-items: center; margin-top: 10px; padding: 9px 11px; border-radius: 10px; background: rgba(255,255,255,.05); font-size: 11.5px; color: #a1a2ab; }
.off-out b { font: 750 18px var(--display); color: #f2f2f5; font-variant-numeric: tabular-nums; transition: color .3s; }
.off-win.off .off-out b { color: #ffb340; }
.off-days { display: flex; gap: 10px; margin-top: 18px; flex-wrap: wrap; align-items: stretch; }
.off-days > div { flex: 1; min-width: 92px; padding: 12px 14px; border-radius: 16px; background: rgba(255,255,255,.05); box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.1); }
.off-days > div.hl { background: rgba(50,215,75,.1); box-shadow: inset 0 0 0 0.5px rgba(50,215,75,.45); }
.off-days b { display: block; font: 750 22px var(--display); letter-spacing: -0.02em; } .off-days small { color: #a1a1a6; font-size: 12.5px; }
.off-days p { flex-basis: 100%; margin: 2px 0 0; font-size: 12.5px; color: #6e6e73; }

/* ---------- nasıl başlarsınız ---------- */
.steps4 { list-style: none; margin: 10px 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; counter-reset: st; position: relative; }
.steps4 li { counter-increment: st; position: relative; }
.steps4 li > b { display: flex; align-items: center; gap: 10px; font: 700 18px var(--display); letter-spacing: -0.015em; margin: 18px 0 6px; }
.steps4 li > b::before { content: counter(st); width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; font-size: 13px; color: #fff; background: var(--ink); flex: none; }
.steps4 li:last-child > b::before { background: var(--green); }
.steps4 li > p { margin: 0; color: var(--ink-2); font-size: 14.5px; line-height: 1.5; }
.st-vis { height: 168px; border-radius: 22px; background: linear-gradient(165deg, #1d1e23, #0f1013); display: grid; place-items: center; padding: 16px; color: #f2f2f5; position: relative; overflow: hidden; box-shadow: 0 30px 60px -36px rgba(0,0,0,.6); }
.steps4 li:not(:last-child) .st-vis::after { content: ""; position: absolute; right: -18px; top: 50%; width: 18px; height: 2px; background: var(--hair-2); }
.sv-form { width: 100%; display: grid; grid-template-columns: auto 1fr; gap: 6px 10px; font-size: 11.5px; align-items: center; }
.sv-form span { color: #8e8e93; } .sv-form b { padding: 7px 9px; border-radius: 8px; background: rgba(255,255,255,.07); font-weight: 600; }
.sv-pend { text-align: center; } .sv-pend i { font-size: 38px; color: #2f8cff; animation: offBlink 2s infinite; } .sv-pend b { display: block; font-size: 13.5px; margin-top: 6px; } .sv-pend small { color: #a1a2ab; font-size: 11.5px; }
.sv-fold { display: flex; flex-direction: column; gap: 7px; width: 100%; }
.sv-fold span { display: flex; gap: 8px; align-items: center; padding: 9px 11px; border-radius: 10px; background: rgba(255,255,255,.06); font-size: 12.5px; font-weight: 600; }
.sv-fold i { color: var(--k); font-size: 16px; }
.sv-air { display: flex; flex-direction: column; align-items: center; gap: 14px; }
.sv-slots { display: flex; gap: 6px; } .sv-slots i { font-style: normal; width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; font-weight: 800; color: #111; background: var(--k); animation: slotGlow 4s infinite; }
.sv-slots i:nth-child(2) { animation-delay: 1s; } .sv-slots i:nth-child(3) { animation-delay: 2s; } .sv-slots i:nth-child(4) { animation-delay: 3s; }

/* ---------- paketler ---------- */
.plan .price { margin: -8px 0 16px; display: flex; align-items: baseline; gap: 6px; }
.plan .price .pr { font: 800 34px var(--display); letter-spacing: -0.03em; } .plan .price .pr.sm { font-size: 22px; } .plan .price .pu { color: var(--ink-2); font-size: 14px; }
.plan-lims { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 20px; }
.plan-lims span { display: inline-flex; gap: 5px; align-items: center; font-size: 12px; font-weight: 600; padding: 5px 9px; border-radius: 9px; background: rgba(0,0,0,.05); }
.plan.featured .plan-lims span { background: rgba(255,255,255,.1); }
.plan-cta { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.plan.featured .b.ghost { background: rgba(255,255,255,.12); color: #fff; }
.cmp { margin: 34px auto 0; max-width: 980px; border-radius: 24px; background: #fff; border: 0.5px solid var(--hair); overflow: hidden; }
.cmp summary { list-style: none; cursor: pointer; padding: 18px 24px; display: flex; gap: 10px; align-items: center; font-weight: 650; font-size: 15px; }
.cmp summary::-webkit-details-marker { display: none; }
.cmp summary .cv { margin-left: auto; transition: transform .25s var(--ease); color: var(--ink-3); }
.cmp[open] summary .cv { transform: rotate(180deg); }
.cmp-scroll { overflow-x: auto; }
.cmp table { width: 100%; border-collapse: collapse; font-size: 14px; }
.cmp th, .cmp td { padding: 12px 18px; text-align: center; border-top: 0.5px solid var(--hair); }
.cmp th:first-child, .cmp td:first-child { text-align: left; color: var(--ink-2); }
.cmp th { font-size: 14px; } .cmp th.hl { color: var(--blue); }
.cmp .y { color: var(--green); font-size: 18px; } .cmp .n { color: var(--ink-3); }

/* ---------- karşılaştırma ---------- */
.vs { max-width: 1000px; margin: 10px auto 0; border-radius: 28px; overflow: hidden; background: #fff; border: 0.5px solid var(--hair); box-shadow: 0 40px 80px -60px rgba(0,0,0,.35); }
.vs-h, .vs-r { display: grid; grid-template-columns: 0.8fr 1fr 1.2fr; }
.vs-h > * { padding: 18px 22px; display: flex; gap: 9px; align-items: center; font-size: 15px; }
.vs-h .old { color: var(--ink-2); } .vs-h .new { background: #111214; color: #f5f5f7; }
.vs-r > span { padding: 15px 22px; border-top: 0.5px solid var(--hair); font-size: 14.5px; }
.vs-r > span:first-child { font-weight: 650; }
.vs-r .old { color: var(--ink-2); }
.vs-r .new { background: #111214; color: #e5e5ea; border-top-color: rgba(255,255,255,.08); display: flex; gap: 9px; align-items: flex-start; }
.vs-r .new i { color: #32d74b; margin-top: 3px; }

/* ---------- SSS sekmeleri ---------- */
.faq-tabs { display: flex; gap: 6px; justify-content: center; flex-wrap: wrap; margin: -6px 0 26px; }
.faq-tabs button { height: 38px; padding: 0 16px; border-radius: 19px; border: 0; background: rgba(0,0,0,.05); font-size: 14px; font-weight: 600; cursor: pointer; transition: background .2s, color .2s; }
.faq-tabs button.on { background: var(--ink); color: #fff; }
.faq details[hidden] { display: none; }

/* ---------- CTA dalgası ---------- */
.cta-band { background: radial-gradient(600px 300px at 50% 120%, rgba(50,215,75,.35), transparent 70%), linear-gradient(160deg, #15161a, #0a0b0d); }
.cta-band h2, .cta-band p { position: relative; }
.cta-band .ctas { position: relative; display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }
.cta-wave { position: absolute; left: 0; right: 0; bottom: 0; height: 58%; display: flex; align-items: flex-end; gap: 4px; padding: 0 20px; opacity: .55; pointer-events: none; }
.cta-wave i { flex: 1; height: var(--h); border-radius: 3px 3px 0 0; background: linear-gradient(180deg, rgba(47,140,255,.55), rgba(191,90,242,.05)); transform-origin: bottom; animation: ctaw 2.6s ease-in-out infinite; animation-delay: var(--d); }
@keyframes ctaw { 50% { transform: scaleY(.45); } }

/* ---------- altbilgi ---------- */
.foot-cta { display: flex; gap: 6px; }
.foot .b.text { color: #d1d1d6; } .foot .b.text:hover { background: rgba(255,255,255,.08); }
.foot .bottom { align-items: center; }
.holding { display: inline-flex; gap: 6px; align-items: baseline; padding: 8px 14px; border-radius: 12px; background: rgba(255,255,255,.05); box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.1); transition: background .2s; }
.holding:hover { background: rgba(255,255,255,.1); }
.holding span { color: #86868b; } .holding b { color: #f5f5f7; font-weight: 650; letter-spacing: -0.01em; }

/* ---------- duyarlı ---------- */
@media (max-width: 1180px) {
  .wrap.mm { grid-template-columns: 230px minmax(0, 1fr); }
  .mm-preview { display: none; }
}
@media (max-width: 1000px) {
  .steps4 { grid-template-columns: 1fr 1fr; } .steps4 li .st-vis::after { display: none; }
  .off-grid { grid-template-columns: 1fr; }
}
@media (max-width: 900px) {
  .nav-cta .b.text, .nav-cta .b.ghost { display: none; }
  .nav.mobile .mega { display: none; position: static; opacity: 1; visibility: visible; transform: none; box-shadow: none; border: 0; background: none; }
  .nav.mobile .menu > li.open .mega { display: block; }
  .wrap.mm { grid-template-columns: 1fr; padding: 6px 0 12px; gap: 12px; }
  .mm-rail { flex-direction: row; overflow-x: auto; border-right: 0; padding: 0 0 4px; gap: 6px; }
  .mm-rail::before { display: none; }
  .mm-tab { grid-template-columns: 28px auto; padding: 8px 10px; background: #f5f5f7; white-space: nowrap; }
  .mm-tab small { display: none; } .mm-tab .mt-i { width: 28px; height: 28px; font-size: 15px; }
  .mm-links, .mm-ticks, .mm-pks { grid-template-columns: 1fr; } .mm-steps { grid-template-columns: 1fr 1fr; }
  .mm-foot { display: none; } .mm-dim { display: none; }
  .off-body { grid-template-columns: 1fr; } .off-log { border-top: 0.5px solid var(--line); }
  .vs-h, .vs-r { grid-template-columns: 1fr 1fr; } .vs-h > :first-child, .vs-r > :first-child { grid-column: 1 / -1; } .vs-h > :first-child { display: none; }
  .vs-r > span:first-child { background: #f5f5f7; padding: 10px 16px; }
  .foot .bottom { flex-direction: column; align-items: flex-start; }
}
@media (max-width: 560px) {
  .steps4 { grid-template-columns: 1fr; }
  .plan-cta { grid-template-columns: 1fr; }
  .off-now { grid-template-columns: 44px 1fr; } .off-rem { display: none; }
}
.bk.g, .bk.c { min-width: 58px; flex-shrink: 0; }
@media (max-width: 900px) { .nav-cta { margin-left: auto; } .burger { margin-left: 0; } }

/* ---------- Stüdyo bölümü (v1.4) ---------- */
.st-sec .center { margin-bottom: 54px; }
.st-sec .center h2, .st-sec .center .lead { margin-left: auto; margin-right: auto; }
.st-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 40px; align-items: center; }
.st-win { background: #141518; box-shadow: 0 60px 120px -40px rgba(255,55,95,.25), 0 0 0 0.5px rgba(255,255,255,.12); }
.st-win .rx-bar em { color: #8e8e93; }
.st-enc { padding: 18px; display: flex; flex-direction: column; gap: 14px; color: #f5f5f7; }
.st-src { display: grid; grid-template-columns: 40px minmax(0, 1fr) 120px; gap: 12px; align-items: center; padding: 12px; border-radius: 14px; background: rgba(255,255,255,.05); }
.st-src small, .st-out small { display: block; color: #8e8e93; font-size: 12px; }
.st-src b { font-size: 13.5px; }
.st-ic { width: 40px; height: 40px; border-radius: 11px; display: grid; place-items: center; background: linear-gradient(135deg, #ff9f0a, #ff375f); font-size: 20px; color: #fff; }
.st-vu { display: flex; flex-direction: column; gap: 5px; }
.st-vu i { height: 6px; border-radius: 4px; background: linear-gradient(90deg, #30d158 60%, #ffd60a 82%, #ff453a); transform-origin: left; animation: stVu 1.1s ease-in-out infinite alternate; }
.st-vu i + i { animation-duration: .9s; animation-delay: -.3s; }
@keyframes stVu { 0% { transform: scaleX(.45); } 40% { transform: scaleX(.8); } 70% { transform: scaleX(.6); } 100% { transform: scaleX(.92); } }
.st-outs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.st-out { padding: 12px; border-radius: 14px; background: rgba(48,209,88,.06); border: 0.5px solid rgba(48,209,88,.35); display: flex; flex-direction: column; gap: 8px; }
.st-oh { display: flex; justify-content: space-between; align-items: center; gap: 6px; }
.st-oh b { font-size: 13.5px; }
.st-live { font-size: 10.5px; font-weight: 700; color: #30d158; background: rgba(48,209,88,.14); padding: 2px 7px; border-radius: 10px; }
.st-chips { display: flex; gap: 4px; flex-wrap: wrap; }
.st-chips span { font-size: 10.5px; padding: 2px 6px; border-radius: 6px; background: rgba(255,255,255,.07); color: #c7c7cc; }
.st-chips .c1 { color: #bf5af2; background: rgba(191,90,242,.16); } .st-chips .c2 { color: #64d2ff; background: rgba(100,210,255,.14); } .st-chips .c3 { color: #ff9f0a; background: rgba(255,159,10,.14); }
.st-kb { font-size: 12px; color: #8e8e93; } .st-kb b { color: #f5f5f7; font-size: 16px; font-variant-numeric: tabular-nums; }
.st-rec { display: grid; grid-template-columns: 14px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 12px 14px; border-radius: 14px; background: rgba(255,59,48,.08); border: 0.5px solid rgba(255,59,48,.3); }
.st-rec b { font-size: 13.5px; display: block; } .st-rec small { color: #8e8e93; font: 12px ui-monospace, Menlo, monospace; }
.st-dot { width: 12px; height: 12px; border-radius: 50%; background: #ff3b30; box-shadow: 0 0 0 4px rgba(255,59,48,.2); animation: stRec 1.4s ease-in-out infinite; }
@keyframes stRec { 50% { opacity: .3; } }
.st-rt { font: 600 15px ui-monospace, Menlo, monospace; color: #ff6961; }
.st-feats { display: grid; gap: 14px; }
.st-f { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 16px; padding: 20px; border-radius: 22px; background: rgba(255,255,255,.04); border: 0.5px solid rgba(255,255,255,.08); transition: background .25s, transform .25s; }
.st-f:hover { background: rgba(255,255,255,.07); transform: translateY(-2px); }
.st-f .ti { width: 44px; height: 44px; border-radius: 13px; display: grid; place-items: center; font-size: 24px; color: var(--c); background: color-mix(in srgb, var(--c) 16%, transparent); }
.st-f h3 { margin: 0 0 4px; font: 700 18px/1.25 var(--display); letter-spacing: -0.02em; color: #f5f5f7; }
.st-f p { margin: 0; color: #a1a1a6; font-size: 14.5px; line-height: 1.5; }
.st-f p b { color: #f5f5f7; }
.mp-enc { display: grid; grid-template-columns: 10px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 9px 11px; border-radius: 12px; background: rgba(48,209,88,.08); margin-bottom: 8px; }
.mp-enc .dot { width: 8px; height: 8px; border-radius: 50%; background: #30d158; }
.mp-enc b { display: block; font-size: 12.5px; } .mp-enc small { font-size: 11px; opacity: .65; }
.mp-enc em { font-style: normal; font-size: 11px; font-weight: 700; color: #28b446; }
.mp-enc.rec { background: rgba(255,59,48,.08); } .mp-enc.rec .dot { background: #ff3b30; animation: stRec 1.4s infinite; } .mp-enc.rec em { color: #ff3b30; }
@media (max-width: 1000px) { .st-grid { grid-template-columns: 1fr; } }
@media (max-width: 640px) { .st-outs { grid-template-columns: 1fr; } .st-src { grid-template-columns: 40px minmax(0, 1fr); } .st-vu { grid-column: 1 / -1; } }

/* =========================================================
   v1.6 — macOS uygulama canlandırması (menü çubuğu, pencere, Dock)
   ========================================================= */
.rx-mac { position: relative; border-radius: 22px; overflow: hidden; animation: rise 1s var(--ease) both .15s;
  background: radial-gradient(900px 500px at 15% -10%, rgba(94,92,230,.55), transparent 60%), radial-gradient(800px 500px at 110% 120%, rgba(255,55,95,.35), transparent 60%), radial-gradient(600px 400px at 60% 50%, rgba(47,140,255,.25), transparent 70%), #0c0d12;
  box-shadow: 0 80px 140px -60px rgba(20,20,60,.6), 0 0 0 0.5px rgba(0,0,0,.4), 0 0 0 7px rgba(255,255,255,.55), 0 0 0 7.5px rgba(0,0,0,.06); }
.rx-mac::after { content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; box-shadow: inset 0 1px 0 rgba(255,255,255,.18); }
.rx-mb { display: flex; align-items: center; gap: 14px; height: 26px; padding: 0 14px; font-size: 11.5px; font-weight: 500; color: #f5f5f7; background: rgba(18,18,24,.55); backdrop-filter: blur(20px); border-bottom: 0.5px solid rgba(255,255,255,.08); white-space: nowrap; overflow: hidden; }
.rx-mb .lg i { color: #ff453a; font-size: 13px; }
.rx-mb b { font-weight: 700; }
.rx-mb .rec { display: inline-flex; align-items: center; gap: 4px; font-weight: 700; font-size: 10.5px; }
.rx-mb .rec i { width: 6px; height: 6px; border-radius: 50%; background: #ff453a; animation: stRec 1.4s infinite; }
.rx-mb .dt { font-variant-numeric: tabular-nums; }
.rx-deskarea { position: relative; padding: 18px 20px 86px; }
.rx-win { position: relative; border-radius: 13px; overflow: hidden; background: var(--bg); border: 0.5px solid rgba(255,255,255,.12);
  box-shadow: 0 0 0 0.5px rgba(0,0,0,.6), 0 40px 80px -24px rgba(0,0,0,.75), 0 12px 30px -12px rgba(0,0,0,.5); }
.rx-win .rx-top { height: 46px; gap: 9px; background: linear-gradient(180deg, rgba(255,255,255,.04), transparent); }
.rx-lights { display: inline-flex; gap: 6px; margin-right: 6px; }
.rx-lights i { width: 11px; height: 11px; border-radius: 50%; background: #ff5f57; box-shadow: inset 0 0 0 0.5px rgba(0,0,0,.25); }
.rx-lights i:nth-child(2) { background: #febc2e; } .rx-lights i:nth-child(3) { background: #28c840; }
.rx-ttl b { display: block; font-size: 12.5px; line-height: 1.1; } .rx-ttl small { display: block; font-size: 10px; color: var(--tx3); }
.rx-pills { display: flex; gap: 6px; padding: 10px 14px 0; }
.rx-pills span { display: inline-flex; align-items: center; gap: 6px; height: 26px; padding: 0 10px 0 4px; border-radius: 8px; background: rgba(var(--fg),.05); border: 0.5px solid var(--line); font-size: 11px; font-weight: 600; }
.rx-pills i { width: 18px; height: 18px; border-radius: 5px; display: grid; place-items: center; font-size: 11px !important; color: #fff; background: linear-gradient(160deg, color-mix(in srgb, var(--c) 75%, #fff), var(--c)); }
.rx-status { display: flex; align-items: center; gap: 12px; height: 24px; padding: 0 12px; border-top: 0.5px solid var(--line); background: rgba(var(--fg),.025); font-size: 10.5px; color: var(--tx2); white-space: nowrap; overflow: hidden; }
.rx-status .rx-chip { height: 16px; font-size: 9.5px; }
/* yüzen Parçalar penceresi */
.rx-fwin { position: absolute; right: 44px; bottom: 116px; width: 262px; border-radius: 12px; overflow: hidden; z-index: 3;
  background: rgba(38, 39, 46, .86); backdrop-filter: blur(30px) saturate(170%); border: 0.5px solid rgba(255,255,255,.14);
  box-shadow: 0 0 0 0.5px rgba(0,0,0,.6), 0 30px 60px -16px rgba(0,0,0,.8); animation: fwinIn 1s var(--ease) both .9s; }
@keyframes fwinIn { from { opacity: 0; transform: translateY(18px) scale(.96); } }
.rx-fbar { display: flex; align-items: center; gap: 8px; height: 30px; padding: 0 10px; border-bottom: 0.5px solid var(--line); }
.rx-fbar .rx-lights i { width: 9px; height: 9px; }
.rx-fbar b { font-size: 11px; display: inline-flex; align-items: center; gap: 4px; } .rx-fbar b i { color: #0a84ff; }
.rx-fbar small { color: var(--tx3); font-size: 9.5px; }
.rx-fsearch { margin: 8px 10px 6px; height: 24px; border-radius: 7px; background: rgba(0,0,0,.28); border: 0.5px solid var(--line); display: flex; align-items: center; gap: 6px; padding: 0 8px; font-size: 11px; color: var(--tx); }
.rx-fsearch i { color: var(--tx3); }
.rx-fchips { display: flex; gap: 4px; padding: 0 10px 8px; }
.rx-fchips span { height: 18px; padding: 0 7px; border-radius: 9px; font-size: 9.5px; font-weight: 700; border: 0.5px solid var(--line-2); color: var(--tx2); display: inline-flex; align-items: center; }
.rx-fchips span[style] { color: var(--k); }
.rx-fchips span.on { background: #0a84ff; color: #fff; border-color: transparent; }
.rx-frow { display: grid; grid-template-columns: 20px 1fr auto; gap: 8px; align-items: center; padding: 5px 10px; border-top: 0.5px solid var(--line); font-size: 11px; }
.rx-frow .bd { width: 18px; height: 18px; border-radius: 5px; display: grid; place-items: center; font-size: 9.5px; font-weight: 800; color: #fff; background: var(--k); }
.rx-frow b { display: block; font-size: 11px; } .rx-frow small { display: block; font-size: 9.5px; color: var(--tx2); }
.rx-frow em { font-style: normal; color: var(--tx3); font-size: 10px; font-variant-numeric: tabular-nums; }
.rx-frow.sel { background: rgba(10,132,255,.22); }
.rx-ghost { position: absolute; left: 30px; top: 150px; display: inline-flex; align-items: center; gap: 5px; padding: 5px 10px; border-radius: 8px; background: #0a84ff; color: #fff; font-size: 11px; font-weight: 700; box-shadow: 0 10px 24px -6px rgba(10,132,255,.7); animation: ghostDrag 6s var(--ease) infinite 2s; opacity: 0; }
@keyframes ghostDrag { 0% { opacity: 0; transform: translate(0, 0); } 8% { opacity: 1; transform: translate(0, 0) scale(1.04); } 45% { opacity: 1; transform: translate(-360px, 40px); } 55%, 100% { opacity: 0; transform: translate(-380px, 44px) scale(.9); } }
/* Dock */
.rx-dock { position: absolute; left: 50%; bottom: 14px; transform: translateX(-50%); display: flex; align-items: flex-end; gap: 6px; padding: 6px 8px; border-radius: 16px;
  background: rgba(255,255,255,.12); border: 0.5px solid rgba(255,255,255,.2); backdrop-filter: blur(24px) saturate(180%); box-shadow: 0 16px 34px -12px rgba(0,0,0,.6); }
.rx-dock span { position: relative; width: 38px; height: 38px; border-radius: 10px; display: grid; place-items: center; color: #fff; font-size: 20px;
  background: linear-gradient(160deg, color-mix(in srgb, var(--ic) 72%, #fff), var(--ic) 55%, color-mix(in srgb, var(--ic) 80%, #000)); box-shadow: inset 0 1px 0 rgba(255,255,255,.35), 0 4px 8px -4px rgba(0,0,0,.5); transition: transform .2s var(--ease); transform-origin: bottom; }
.rx-dock span:hover { transform: scale(1.3) translateY(-4px); }
.rx-dock span.on::after { content: ""; position: absolute; bottom: -5px; left: 50%; width: 3px; height: 3px; margin-left: -1.5px; border-radius: 50%; background: rgba(255,255,255,.85); }
.rx-dock em { width: 0.5px; align-self: stretch; margin: 2px 2px; background: rgba(255,255,255,.3); }
@keyframes stRec { 50% { opacity: .3; } }
@media (max-width: 1000px) { .rx-fwin { display: none; } .rx-mb span:not(.lg):not(.dt):not(.rec) { display: none; } }
@media (max-width: 760px) { .rx-deskarea { padding: 10px 10px 66px; } .rx-dock span { width: 28px; height: 28px; font-size: 15px; border-radius: 8px; } .rx-dock { gap: 4px; padding: 5px 6px; bottom: 10px; } .rx-dock span:nth-child(n+9) { display: none; } .rx-pills span:nth-child(n+3) { display: none; } .rx-status span:nth-child(n+3) { display: none; } .rx-mac { box-shadow: 0 40px 80px -40px rgba(20,20,60,.6), 0 0 0 4px rgba(255,255,255,.55); } }

/* =========================================================
   v1.6 — Premium footer
   ========================================================= */
.foot { position: relative; overflow: hidden; background: #060608; padding: 0 0 30px; }
.foot-aura { position: absolute; inset: 0; pointer-events: none; }
.foot-aura i { position: absolute; border-radius: 50%; filter: blur(110px); opacity: .5; }
.foot-aura i:nth-child(1) { width: 640px; height: 640px; left: -160px; top: -260px; background: #2f5bff; opacity: .35; }
.foot-aura i:nth-child(2) { width: 560px; height: 560px; right: -140px; top: -180px; background: #bf5af2; opacity: .28; }
.foot-aura i:nth-child(3) { width: 700px; height: 300px; left: 30%; bottom: -200px; background: #ff375f; opacity: .18; }
.foot > .wrap { position: relative; }
.foot::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 1px; background: linear-gradient(90deg, transparent, rgba(255,255,255,.35), rgba(110,160,255,.6), rgba(255,255,255,.35), transparent); }
.foot-band { position: relative; display: grid; grid-template-columns: 1.3fr 1fr; gap: 40px; align-items: center; margin: 90px 0 70px; padding: 44px 48px; border-radius: 30px;
  background: linear-gradient(140deg, rgba(255,255,255,.08), rgba(255,255,255,.02)); backdrop-filter: blur(30px); -webkit-backdrop-filter: blur(30px);
  box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.14), inset 0 1px 0 rgba(255,255,255,.18), 0 40px 80px -40px rgba(0,0,0,.8); }
.foot-band::before { content: ""; position: absolute; inset: -1px; border-radius: inherit; padding: 1px; background: linear-gradient(130deg, rgba(110,160,255,.7), rgba(191,90,242,.35) 40%, transparent 60%, rgba(255,55,95,.45)); -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude; pointer-events: none; }
.fb-kick { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; color: #8fd6a0; letter-spacing: .01em; }
.fb-kick .dot { width: 8px; height: 8px; border-radius: 50%; background: #32d74b; box-shadow: 0 0 0 4px rgba(50,215,75,.18), 0 0 14px #32d74b; }
.foot-band h3 { font: 800 clamp(28px, 3.4vw, 42px)/1.08 var(--display); letter-spacing: -0.035em; color: #f5f5f7; margin: 14px 0 12px; }
.foot-band .grad { background: linear-gradient(90deg, #8ab4ff, #d59bff 55%, #ff8aa5); -webkit-background-clip: text; background-clip: text; color: transparent; }
.foot-band p { color: #a1a1a6; font-size: 15.5px; line-height: 1.55; margin: 0; max-width: 46ch; }
.fb-act { display: flex; flex-direction: column; gap: 12px; align-items: stretch; }
.fb-act .b { width: 100%; }
.fb-meta { display: flex; gap: 16px; justify-content: center; flex-wrap: wrap; font-size: 12.5px; color: #8e8e93; margin-top: 4px; }
.fb-meta i { color: #32d74b; }
.foot .top { grid-template-columns: 1.35fr repeat(3, 1fr) 1.2fr; gap: 34px; padding-bottom: 50px; border-bottom: 0; position: relative; }
.foot .top::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: linear-gradient(90deg, transparent, rgba(255,255,255,.16) 20%, rgba(255,255,255,.16) 80%, transparent); }
.foot h6 { font-size: 12px; text-transform: uppercase; letter-spacing: .08em; color: #8e8e93; font-weight: 600; margin: 8px 0 16px; }
.foot ul a { color: #d1d1d6; font-size: 14px; position: relative; transition: color .2s; }
.foot ul a::after { content: ""; position: absolute; left: 0; right: 100%; bottom: -3px; height: 1px; background: linear-gradient(90deg, #8ab4ff, #d59bff); transition: right .3s var(--ease); }
.foot ul a:hover { color: #fff; } .foot ul a:hover::after { right: 0; }
.fstatus { display: inline-flex; align-items: center; gap: 9px; padding: 7px 12px; border-radius: 20px; font-size: 12.5px; color: #d1d1d6; background: rgba(255,255,255,.05); box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.1); }
.fstatus .pulse { position: relative; width: 8px; height: 8px; border-radius: 50%; background: #32d74b; }
.fstatus .pulse::after { content: ""; position: absolute; inset: -4px; border-radius: 50%; border: 1.5px solid #32d74b; animation: fpulse 2s ease-out infinite; }
@keyframes fpulse { from { opacity: .9; transform: scale(.6); } to { opacity: 0; transform: scale(1.6); } }
.fplat { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 14px; }
.fplat span, .fplat a { display: inline-flex; align-items: center; gap: 6px; height: 28px; padding: 0 10px; border-radius: 9px; font-size: 12px; color: #c7c7cc; background: rgba(255,255,255,.04); box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.08); }
.fcol-contact { display: flex; flex-direction: column; gap: 8px; }
.fc { display: grid; grid-template-columns: 34px 1fr; gap: 10px; align-items: center; padding: 8px 10px; border-radius: 13px; color: #f5f5f7; font-size: 13.5px; background: rgba(255,255,255,.03); box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.07); transition: background .2s, transform .2s; border: 0; text-align: left; font-family: inherit; cursor: pointer; }
.fc:hover { background: rgba(255,255,255,.07); transform: translateY(-1px); }
.fci { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; font-size: 17px; color: #8ab4ff; background: rgba(110,160,255,.12); }
.fc small { display: block; font-size: 11px; color: #8e8e93; }
.fc span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.foot-sig { position: relative; margin: 30px 0 6px; text-align: center; user-select: none; }
.foot-sig span { display: inline-block; font: 800 clamp(56px, 12.4vw, 168px)/.95 var(--display); letter-spacing: -0.06em; padding: 0 .04em .06em; color: transparent;
  background: linear-gradient(100deg, rgba(255,255,255,.07) 30%, rgba(255,255,255,.4) 45%, rgba(170,200,255,.5) 50%, rgba(255,255,255,.07) 62%) 0 0 / 260% 100%, linear-gradient(180deg, rgba(255,255,255,.16), rgba(255,255,255,0));
  -webkit-background-clip: text; background-clip: text; animation: sigSweep 7s ease-in-out infinite; }
@keyframes sigSweep { 0%, 15% { background-position: 120% 0, 0 0; } 60%, 100% { background-position: -40% 0, 0 0; } }
.foot .bottom { position: relative; padding-top: 22px; align-items: center; color: #8e8e93; }
.foot .bottom::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 1px; background: linear-gradient(90deg, transparent, rgba(255,255,255,.12), transparent); }
.blinks { display: flex; gap: 18px; flex-wrap: wrap; }
.blinks a { color: #a1a1a6; font-size: 12.5px; } .blinks a:hover { color: #fff; }
.blinks .totop { display: inline-flex; align-items: center; gap: 5px; }
.foot .holding { display: inline-flex; align-items: center; gap: 6px; padding: 7px 14px; border-radius: 20px; font-size: 12.5px; color: #8e8e93; background: linear-gradient(140deg, rgba(255,255,255,.07), rgba(255,255,255,.02)); box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.12); }
.foot .holding b { color: #f5f5f7; background: linear-gradient(90deg, #fff, #c9d6ff); -webkit-background-clip: text; background-clip: text; color: transparent; }
@media (max-width: 1000px) { .foot-band { grid-template-columns: 1fr; padding: 32px 26px; margin: 60px 0 50px; } .foot .top { grid-template-columns: 1fr 1fr; } .fcol-brand, .fcol-contact { grid-column: 1 / -1; } }
@media (max-width: 560px) { .foot .top { grid-template-columns: 1fr 1fr; gap: 26px 18px; } .foot .bottom { flex-direction: column; align-items: flex-start; } .foot-band h3 br { display: none; } }

/* =========================================================
   v1.6 — Premium hatlar: bölüm ayraçları, kenar ışıkları
   ========================================================= */
.sec { position: relative; }
.sec + .sec::before { content: ""; position: absolute; left: 50%; top: 0; width: min(1080px, 86vw); height: 1px; transform: translateX(-50%); background: linear-gradient(90deg, transparent, rgba(0,0,0,.1) 20%, rgba(0,113,227,.35) 50%, rgba(0,0,0,.1) 80%, transparent); }
.sec.dark + .sec::before, .sec + .sec.dark::before { background: linear-gradient(90deg, transparent, rgba(255,255,255,.12) 20%, rgba(110,160,255,.5) 50%, rgba(255,255,255,.12) 80%, transparent); }
.rx-window { box-shadow: 0 60px 120px -50px rgba(20,20,40,.55), 0 0 0 0.5px rgba(0,0,0,.25), 0 0 0 6px rgba(255,255,255,.6), 0 0 0 6.5px rgba(0,0,0,.06); position: relative; }
.rx-window::after { content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; box-shadow: inset 0 1px 0 rgba(255,255,255,.12); }
.sec.dark .rx-window { box-shadow: 0 60px 120px -50px rgba(0,0,0,.8), 0 0 0 0.5px rgba(255,255,255,.12), 0 0 0 6px rgba(255,255,255,.04); }
.tile { box-shadow: 0 1px 0 rgba(255,255,255,.8) inset, 0 20px 40px -30px rgba(20,20,50,.25); transition: transform .35s var(--ease), box-shadow .35s var(--ease); }
.tile:hover { transform: translateY(-4px); box-shadow: 0 1px 0 rgba(255,255,255,.8) inset, 0 30px 60px -30px rgba(20,20,50,.35); }
.tile::after { content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; padding: 1px; background: linear-gradient(140deg, color-mix(in srgb, var(--c, #0071e3) 45%, transparent), transparent 40%); -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude; opacity: 0; transition: opacity .35s; }
.tile:hover::after { opacity: 1; }
.tile.ink::after { background: linear-gradient(140deg, rgba(110,160,255,.6), transparent 45%); }

/* =========================================================
   v1.6 — Premium mobil menü
   ========================================================= */
.burger { position: relative; width: 42px; height: 42px; border-radius: 14px; background: rgba(0,0,0,.05); box-shadow: inset 0 0 0 0.5px rgba(0,0,0,.06); }
.burger span { position: absolute; left: 12px; right: 12px; height: 1.8px; border-radius: 2px; background: var(--ink); transition: transform .35s var(--ease), top .35s var(--ease); }
.burger span:nth-child(1) { top: 16px; } .burger span:nth-child(2) { top: 24px; }
body.ms-open .burger span:nth-child(1) { top: 20px; transform: rotate(45deg); }
body.ms-open .burger span:nth-child(2) { top: 20px; transform: rotate(-45deg); }
.msheet { position: fixed; inset: 60px 0 0 0; z-index: 49; display: flex; flex-direction: column; visibility: hidden; opacity: 0;
  background: rgba(251,251,253,.86); backdrop-filter: blur(30px) saturate(180%); -webkit-backdrop-filter: blur(30px) saturate(180%); transition: opacity .3s var(--ease), visibility .3s; }
body.ms-open { overflow: hidden; }
body.ms-open .msheet { visibility: visible; opacity: 1; }
body.ms-open .nav { background: rgba(251,251,253,.92); }
.ms-scroll { flex: 1; overflow: auto; padding: 14px 20px 20px; -webkit-overflow-scrolling: touch; }
.ms-grp, .ms-link, .ms-contact { opacity: 0; transform: translateY(14px); transition: opacity .45s var(--ease), transform .45s var(--ease); transition-delay: calc(var(--d) * 55ms + 60ms); }
body.ms-open .ms-grp, body.ms-open .ms-link, body.ms-open .ms-contact { opacity: 1; transform: none; }
.ms-grp { border-bottom: 0.5px solid var(--hair); }
.ms-head { width: 100%; display: flex; align-items: center; gap: 14px; height: 64px; border: 0; background: none; padding: 0; font: inherit; color: var(--ink); cursor: pointer; text-align: left; }
.ms-head b { flex: 1; font: 700 24px var(--display); letter-spacing: -0.03em; }
.ms-ic { width: 36px; height: 36px; border-radius: 11px; display: grid; place-items: center; color: #fff; font-size: 18px; background: linear-gradient(160deg, color-mix(in srgb, var(--c) 75%, #fff), var(--c)); box-shadow: 0 8px 18px -8px var(--c); }
.ms-car { color: var(--ink-3, #86868b); font-size: 14px; transition: transform .35s var(--ease); }
.ms-grp.open .ms-car { transform: rotate(180deg); }
.ms-body { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .4s var(--ease); }
.ms-grp.open .ms-body { grid-template-rows: 1fr; }
.ms-in { overflow: hidden; display: flex; flex-direction: column; gap: 2px; }
.ms-grp.open .ms-in { padding-bottom: 14px; }
.ms-in a { display: grid; grid-template-columns: 38px 1fr 16px; gap: 12px; align-items: center; padding: 9px 10px; border-radius: 14px; color: var(--ink); }
.ms-in a:active { background: rgba(0,0,0,.05); }
.ms-li { width: 38px; height: 38px; border-radius: 11px; display: grid; place-items: center; font-size: 19px; color: var(--c); background: color-mix(in srgb, var(--c) 12%, transparent); }
.ms-in b { display: block; font-size: 15.5px; } .ms-in small { display: block; font-size: 13px; color: var(--ink-2); }
.ms-go { color: var(--ink-3, #86868b); font-size: 13px; }
.ms-link { display: flex; align-items: center; justify-content: space-between; height: 64px; border-bottom: 0.5px solid var(--hair); color: var(--ink); }
.ms-link b { font: 700 24px var(--display); letter-spacing: -0.03em; }
.ms-link i { color: var(--ink-3, #86868b); }
.ms-contact { padding: 20px 0 6px; }
.ms-contact a { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; color: var(--ink-2); }
.ms-foot { flex: none; display: flex; flex-direction: column; gap: 8px; padding: 14px 20px calc(16px + env(safe-area-inset-bottom)); border-top: 0.5px solid var(--hair); background: rgba(255,255,255,.7); backdrop-filter: blur(20px);
  transform: translateY(30px); opacity: 0; transition: transform .45s var(--ease) .2s, opacity .45s var(--ease) .2s; }
body.ms-open .ms-foot { transform: none; opacity: 1; }
.ms-foot .b { width: 100%; }
.ms-row { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
@media (min-width: 901px) { .msheet { display: none; } }
@media (max-width: 900px) { .nav.mobile .menu { display: none !important; } }

/* ===== v1.6 — macOS premium pencere çubuğu (tüm HTML mock'lar) ===== */
.rx-window { border-radius: 14px; background: var(--bg); }
.rx-bar { position: relative; height: 40px; padding: 0 14px; gap: 8px;
  background: linear-gradient(180deg, color-mix(in srgb, var(--bg) 78%, #fff 22%), color-mix(in srgb, var(--bg) 88%, #000 12%));
  border-bottom: 0.5px solid color-mix(in srgb, var(--line) 100%, #000 10%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.14); }
.rx.rx-light .rx-bar { background: linear-gradient(180deg, #f6f6f8, #e6e6eb); box-shadow: inset 0 1px 0 #fff; }
.rx-bar span { width: 12px; height: 12px; box-shadow: inset 0 0 0 0.5px rgba(0,0,0,.28), inset 0 1px 1px rgba(255,255,255,.35); position: relative; }
.rx-bar span::after { content: ""; position: absolute; inset: 3.5px; border-radius: 50%; background: rgba(0,0,0,.35); opacity: 0; transition: opacity .2s; }
.rx-window:hover .rx-bar span::after { opacity: .55; }
.rx-bar em { position: absolute; left: 0; right: 0; text-align: center; margin: 0; padding: 0 90px; pointer-events: none;
  font-weight: 600; font-size: 12px; letter-spacing: -.01em; color: var(--tx2, var(--tx3)); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rx-bar::after { content: ""; margin-left: auto; width: 46px; height: 14px; border-radius: 4px; opacity: .55;
  background:
    radial-gradient(circle at 7px 7px, var(--tx3) 1.6px, transparent 2.2px),
    radial-gradient(circle at 23px 7px, var(--tx3) 1.6px, transparent 2.2px),
    radial-gradient(circle at 39px 7px, var(--tx3) 1.6px, transparent 2.2px); }
.rx-window { outline: 0.5px solid rgba(255,255,255,.08); outline-offset: -1px; }
.rx-window > .rx-bar + * { background: linear-gradient(180deg, rgba(255,255,255,.025), transparent 120px); }
.sec.dark .rx-bar em { color: #c7c7cc; }

/* Hero mock — mobil üst çubuk */
@media (max-width: 760px) {
  .rx-win .rx-top { gap: 7px; padding: 0 10px; }
  .rx-win .rx-top .rx-ttl { white-space: nowrap; min-width: 0; }
  .rx-win .rx-top .rx-ttl small, .rx-win .rx-top .rx-seg, .rx-win .rx-top .rx-chip.o { display: none; }
  .rx-win .rx-top .rx-lights { margin-right: 2px; }
  .rx-bar em { padding: 0 70px; font-size: 11px; }
  .rx-bar::after { display: none; }
}
@media (max-width: 420px) { .rx-win .rx-top #rxClock { display: none; } }

/* ===== v1.8 — "Hâlâ radyo otomasyonu mu?" hikâye bölümü ===== */
.story { position: relative; overflow: hidden; background: radial-gradient(900px 420px at 15% 0%, rgba(255,55,95,.07), transparent 60%), radial-gradient(900px 420px at 90% 10%, rgba(0,113,227,.07), transparent 60%), var(--canvas); }
.hk-head { text-align: center; max-width: 860px; margin: 0 auto 54px; }
.hk-head h2 { max-width: none; margin-left: auto; margin-right: auto; }
.hk-head .lead { margin-left: auto; margin-right: auto; }
.hk-kick { display: inline-flex; align-items: center; gap: 7px; padding: 6px 13px; border-radius: 99px; background: #fff; box-shadow: 0 0 0 0.5px var(--hair-2), 0 6px 16px -10px rgba(0,0,0,.25); font-size: 13px; font-weight: 600; color: var(--ink-2); margin-bottom: 18px; }
.hk-kick i { color: #ff375f; }
.story .grad { background: linear-gradient(90deg, #ff375f, #bf5af2 50%, #0071e3); -webkit-background-clip: text; background-clip: text; color: transparent; }
.hk-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.hk-card { display: flex; flex-direction: column; border-radius: 24px; background: #fff; box-shadow: 0 0 0 0.5px var(--hair), 0 30px 60px -40px rgba(0,0,0,.35); overflow: hidden; transition: transform .35s var(--ease), box-shadow .35s; }
.hk-card:hover { transform: translateY(-4px); box-shadow: 0 0 0 0.5px var(--hair-2), 0 40px 70px -40px rgba(0,0,0,.45); }
.hk-old { display: flex; gap: 12px; padding: 20px 22px; background: repeating-linear-gradient(135deg, #f6f6f8 0 10px, #f2f2f5 10px 20px); color: var(--ink-3); font-size: 14px; line-height: 1.45; }
.hk-old > i { font-size: 22px; flex: none; margin-top: 2px; }
.hk-old b { display: block; color: var(--ink-2); text-decoration: line-through; text-decoration-color: rgba(255,59,48,.55); text-decoration-thickness: 2px; margin-bottom: 2px; }
.hk-arrow { display: grid; place-items: center; height: 0; position: relative; z-index: 1; }
.hk-arrow i { width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; background: var(--ink); color: #fff; font-size: 14px; box-shadow: 0 0 0 5px #fff; }
.hk-new { padding: 30px 24px 26px; flex: 1; }
.hk-new b { display: block; font: 750 21px/1.2 var(--display); letter-spacing: -0.02em; margin: 14px 0 8px; }
.hk-new p { margin: 0; color: var(--ink-2); font-size: 15.5px; }
.hk-ic { width: 46px; height: 46px; border-radius: 14px; display: grid; place-items: center; font-size: 24px; color: #fff; background: linear-gradient(160deg, color-mix(in srgb, var(--c) 70%, #fff), var(--c)); box-shadow: 0 10px 22px -10px var(--c); }
.hk-foot { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-top: 34px; padding: 22px 26px; border-radius: 20px; background: linear-gradient(120deg, rgba(255,55,95,.06), rgba(0,113,227,.06)); box-shadow: inset 0 0 0 0.5px var(--hair); }
.hk-foot p { margin: 0; color: var(--ink-2); max-width: 70ch; }
.hk-foot p b { color: var(--ink); }
@media (max-width: 900px) { .hk-grid { grid-template-columns: 1fr; } .hk-foot { flex-direction: column; align-items: flex-start; } }

/* ===== v1.8 — İç sayfalar (SEO) ===== */
.pg-hero { position: relative; overflow: hidden; padding: 140px 0 70px; background: var(--canvas); }
.pg-aura i { position: absolute; border-radius: 50%; filter: blur(80px); opacity: .45; pointer-events: none; }
.pg-aura i:first-child { width: 520px; height: 520px; left: -140px; top: -220px; background: color-mix(in srgb, var(--pc) 45%, transparent); }
.pg-aura i:last-child { width: 480px; height: 480px; right: -160px; top: -120px; background: rgba(0,113,227,.25); }
.pg-hero .wrap { position: relative; }
.crumbs { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; font-size: 13px; color: var(--ink-3); margin-bottom: 26px; }
.crumbs a { color: var(--ink-2); }
.crumbs a:hover { color: var(--blue); }
.crumbs i { font-size: 9px; }
.pg-kick { display: inline-flex; align-items: center; gap: 10px; font-size: 14px; font-weight: 650; color: var(--pc); margin-bottom: 14px; }
.pg-ic { width: 34px; height: 34px; border-radius: 10px; display: inline-grid; place-items: center; font-size: 19px; color: #fff; background: linear-gradient(160deg, color-mix(in srgb, var(--pc, var(--blue)) 70%, #fff), var(--pc, var(--blue))); box-shadow: 0 8px 18px -8px var(--pc, var(--blue)); }
.pg-hero h1 { font: 800 clamp(36px, 5.6vw, 66px)/1.04 var(--display); letter-spacing: -0.045em; margin: 0 0 20px; max-width: 18ch; }
.pg-hero .lead { font-size: clamp(17px, 1.7vw, 21px); color: var(--ink-2); max-width: 62ch; margin: 0 0 30px; }
.pg-hero .ctas { display: flex; gap: 12px; flex-wrap: wrap; }
.pg-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-top: 44px; max-width: 860px; }
.pg-stats div { padding: 16px 18px; border-radius: 16px; background: rgba(255,255,255,.75); box-shadow: 0 0 0 0.5px var(--hair), 0 14px 30px -24px rgba(0,0,0,.35); backdrop-filter: blur(20px); }
.pg-stats b { display: block; font: 800 22px var(--display); letter-spacing: -0.03em; }
.pg-stats small { color: var(--ink-2); font-size: 13px; }
.pg-body { padding-top: 40px; }
.pg-grid { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 56px; align-items: start; }
.pg-art h2 { font: 750 clamp(24px, 2.6vw, 32px)/1.15 var(--display); letter-spacing: -0.03em; margin: 40px 0 14px; max-width: none; }
.pg-art h2:first-child { margin-top: 0; }
.pg-art p { color: #3a3a3f; font-size: 17.5px; line-height: 1.7; margin: 0 0 16px; }
.pg-art p b, .pg-list b { color: var(--ink); }
.pg-list { list-style: none; padding: 0; margin: 6px 0 18px; display: grid; gap: 10px; }
.pg-list li { display: flex; gap: 12px; align-items: flex-start; padding: 13px 16px; border-radius: 14px; background: #fff; box-shadow: 0 0 0 0.5px var(--hair); font-size: 16px; line-height: 1.55; color: #3a3a3f; }
.pg-list li > i { color: var(--green); font-size: 19px; margin-top: 1px; flex: none; }
.pg-side { display: grid; gap: 16px; }
.pg-card { padding: 22px; border-radius: 22px; background: linear-gradient(160deg, #16171b, #0b0b0d); color: #f5f5f7; display: grid; gap: 10px; box-shadow: 0 30px 60px -30px rgba(0,0,0,.6); }
.pg-card b { font: 750 19px/1.2 var(--display); }
.pg-card p { margin: 0 0 6px; color: #a1a1a6; font-size: 14px; }
.pg-card .b { justify-content: center; }
.pg-card .b.ghost { background: rgba(255,255,255,.1); color: #fff; }
.pg-toc { padding: 16px; border-radius: 18px; background: #fff; box-shadow: 0 0 0 0.5px var(--hair); display: grid; gap: 2px; }
.pg-toc h6 { margin: 0 0 6px; font-size: 12px; text-transform: uppercase; letter-spacing: .06em; color: var(--ink-3); }
.pg-toc a { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 10px; color: var(--ink); font-size: 14.5px; }
.pg-toc a:hover { background: var(--canvas-2); }
.pg-toc a i { font-size: 18px; }
.pg-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.pg-cd { display: grid; gap: 8px; align-content: start; padding: 24px; border-radius: 22px; background: #fff; box-shadow: 0 0 0 0.5px var(--hair), 0 20px 40px -32px rgba(0,0,0,.35); color: var(--ink); transition: transform .3s var(--ease), box-shadow .3s; }
a.pg-cd:hover { transform: translateY(-3px); box-shadow: 0 0 0 0.5px var(--hair-2), 0 30px 50px -30px rgba(0,0,0,.4); }
.pg-cd b { font: 700 19px var(--display); letter-spacing: -0.02em; margin-top: 8px; }
.pg-cd p { margin: 0; color: var(--ink-2); font-size: 15px; }
.pg-cd em, .pg-rel em { font-style: normal; font-size: 14px; font-weight: 600; color: var(--blue); display: inline-flex; gap: 6px; align-items: center; margin-top: 6px; }
.pg-faq { max-width: 860px; }
.pg-faq h2 { margin-bottom: 26px; }
.pg-rh { font: 800 clamp(28px, 3.4vw, 40px)/1.1 var(--display); letter-spacing: -0.035em; margin: 0 0 26px; }
.pg-rel { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 16px; }
.pg-rel a { display: grid; gap: 8px; align-content: start; padding: 22px; border-radius: 22px; background: #fff; box-shadow: 0 0 0 0.5px var(--hair); color: var(--ink); transition: transform .3s var(--ease), box-shadow .3s; position: relative; overflow: hidden; }
.pg-rel a::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 3px; background: var(--pc); }
.pg-rel a:hover { transform: translateY(-3px); box-shadow: 0 0 0 0.5px var(--hair-2), 0 30px 50px -30px rgba(0,0,0,.4); }
.pg-rel small { color: var(--pc); font-weight: 650; font-size: 13px; margin-top: 8px; }
.pg-rel b { font: 700 18px/1.25 var(--display); letter-spacing: -0.02em; }
@media (max-width: 980px) { .pg-grid { grid-template-columns: 1fr; } .pg-side { position: static; } .pg-cards { grid-template-columns: 1fr 1fr; } .pg-stats { grid-template-columns: 1fr 1fr; } }
@media (max-width: 620px) { .pg-hero { padding: 110px 0 50px; } .pg-cards { grid-template-columns: 1fr; } }
.hero h1 .h1-kw { display: block; font: 650 clamp(14px, 1.4vw, 17px)/1.3 var(--font); letter-spacing: .08em; text-transform: uppercase; color: var(--ink-2); margin-bottom: 14px; }

/* ===== v1.9 — Neden Radyomasyon (premium, koyu sinematik bölüm) ===== */
.why { position: relative; overflow: hidden; padding: 130px 0 120px; color: #f5f5f7; background: #07070a; isolation: isolate; }
.why::before { content: ""; position: absolute; inset: 0; background: radial-gradient(1200px 600px at 50% -10%, rgba(255,255,255,.07), transparent 60%); z-index: -1; }
.why-aura i { position: absolute; border-radius: 50%; filter: blur(100px); z-index: -1; opacity: .55; animation: whyFloat 18s ease-in-out infinite; }
.why-aura i:nth-child(1) { width: 620px; height: 620px; left: -220px; top: 60px; background: radial-gradient(circle, rgba(255,55,95,.55), transparent 65%); }
.why-aura i:nth-child(2) { width: 700px; height: 700px; right: -260px; top: 360px; background: radial-gradient(circle, rgba(10,132,255,.5), transparent 65%); animation-delay: -6s; }
.why-aura i:nth-child(3) { width: 520px; height: 520px; left: 35%; bottom: -260px; background: radial-gradient(circle, rgba(191,90,242,.45), transparent 65%); animation-delay: -12s; }
@keyframes whyFloat { 50% { transform: translate(40px, -30px) scale(1.08); } }
.why-grain { position: absolute; inset: 0; z-index: -1; opacity: .05; pointer-events: none; background-image: radial-gradient(rgba(255,255,255,.9) 0.6px, transparent 0.7px); background-size: 3px 3px; }
.why-head { text-align: center; max-width: 900px; margin: 0 auto 70px; }
.why-chip { display: inline-flex; align-items: center; gap: 9px; padding: 7px 15px; border-radius: 99px; font-size: 13px; font-weight: 600; letter-spacing: .02em; color: #e5e5ea;
  background: rgba(255,255,255,.06); box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.18); backdrop-filter: blur(12px); margin-bottom: 26px; }
.why-chip .dot { width: 7px; height: 7px; border-radius: 50%; background: #ff375f; box-shadow: 0 0 12px #ff375f; }
.why-head h2 { font: 800 clamp(38px, 5.6vw, 72px)/1.02 var(--display); letter-spacing: -0.045em; margin: 0 0 24px; color: #fff; }
.why-grad { display: block; background: linear-gradient(92deg, #ff6b8b 0%, #d58bff 45%, #6fb5ff 100%); -webkit-background-clip: text; background-clip: text; color: transparent; padding-bottom: 6px; }
.why-head p { font-size: clamp(17px, 1.7vw, 21px); line-height: 1.55; color: #a1a1aa; max-width: 64ch; margin: 0 auto; }

.why-founder { position: relative; display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 44px; padding: 52px; border-radius: 32px;
  background: linear-gradient(160deg, rgba(255,255,255,.075), rgba(255,255,255,.02)); box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.14), 0 60px 120px -60px rgba(0,0,0,.9); backdrop-filter: blur(24px); -webkit-backdrop-filter: blur(24px); }
.why-founder::before { content: ""; position: absolute; inset: 0; border-radius: inherit; padding: 1px; background: linear-gradient(135deg, rgba(255,107,139,.55), rgba(255,255,255,.04) 35%, rgba(255,255,255,.04) 65%, rgba(111,181,255,.5)); -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude; pointer-events: none; }
.wf-kick { display: inline-flex; align-items: center; gap: 8px; font-size: 13.5px; font-weight: 650; color: #ff8aa5; letter-spacing: .01em; margin-bottom: 18px; }
.wf-kick i { font-size: 18px; }
.wf-story h3 { font: 700 clamp(24px, 2.6vw, 34px)/1.2 var(--display); letter-spacing: -0.03em; margin: 0 0 20px; color: #fff; }
.wf-story h3 span { background: linear-gradient(90deg, #fff, #ffc2cf); -webkit-background-clip: text; background-clip: text; color: transparent; }
.wf-story p { color: #b9b9c2; font-size: 16.5px; line-height: 1.7; margin: 0 0 14px; }
.wf-sign { display: flex; align-items: center; gap: 14px; margin-top: 26px; padding-top: 22px; border-top: 0.5px solid rgba(255,255,255,.12); }
.wf-mono { width: 52px; height: 52px; border-radius: 50%; display: grid; place-items: center; font: 800 18px var(--display); letter-spacing: -0.02em; color: #fff;
  background: conic-gradient(from 210deg, #ff375f, #bf5af2, #0a84ff, #ff375f); box-shadow: 0 0 0 3px rgba(255,255,255,.08), 0 14px 30px -10px rgba(191,90,242,.7); }
.wf-sign b { display: block; font-size: 17px; color: #fff; }
.wf-sign small { color: #8e8e98; font-size: 13.5px; }
.wf-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; align-content: center; }
.ws { position: relative; overflow: hidden; padding: 24px 22px 22px; border-radius: 22px; background: rgba(255,255,255,.04); box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.12); transition: transform .4s var(--ease), background .4s; }
.ws:hover { transform: translateY(-4px); background: rgba(255,255,255,.07); }
.ws b { display: flex; align-items: baseline; gap: 6px; font: 800 clamp(34px, 3.4vw, 46px)/1 var(--display); letter-spacing: -0.04em; color: #fff; }
.ws b small { font-size: 15px; font-weight: 600; color: #a1a1aa; letter-spacing: 0; }
.ws span { display: block; margin-top: 10px; color: #a1a1aa; font-size: 14px; line-height: 1.45; max-width: 22ch; }
.ws i { position: absolute; right: -10px; bottom: -14px; font-size: 92px; opacity: .08; color: #fff; }
.ws:nth-child(1) b { background: linear-gradient(90deg, #fff, #ff9fb3); -webkit-background-clip: text; background-clip: text; color: transparent; }
.ws:nth-child(2) b { background: linear-gradient(90deg, #fff, #d9a6ff); -webkit-background-clip: text; background-clip: text; color: transparent; }
.ws:nth-child(3) b { background: linear-gradient(90deg, #fff, #8fd0ff); -webkit-background-clip: text; background-clip: text; color: transparent; }

.why-vs { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.6fr); gap: 52px; margin-top: 90px; align-items: start; }
.wv-intro { position: sticky; top: 110px; }
.wv-intro h3 { font: 750 clamp(26px, 2.8vw, 38px)/1.12 var(--display); letter-spacing: -0.035em; margin: 0 0 18px; color: #fff; }
.wv-intro h3 span { display: block; color: #8e8e98; }
.wv-intro p { color: #a1a1aa; font-size: 16.5px; line-height: 1.65; margin: 0; }
.wv-table { border-radius: 26px; overflow: hidden; background: rgba(255,255,255,.03); box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.12); }
.wv-row { display: grid; grid-template-columns: 170px minmax(0, 1fr) minmax(0, 1.15fr); align-items: stretch; border-top: 0.5px solid rgba(255,255,255,.08); }
.wv-row > span { padding: 20px 20px; font-size: 15px; line-height: 1.5; display: flex; gap: 10px; align-items: flex-start; }
.wv-th { border-top: 0; background: rgba(255,255,255,.03); }
.wv-th > span { padding: 16px 20px; font-size: 12.5px; font-weight: 650; text-transform: uppercase; letter-spacing: .07em; color: #8e8e98; align-items: center; }
.wv-th .n { color: #fff; text-transform: none; letter-spacing: -0.01em; font-size: 15px; }
.wv-row .k { font-weight: 650; color: #fff; align-items: center; }
.wv-row .ki { width: 32px; height: 32px; flex: none; border-radius: 10px; display: grid; place-items: center; font-size: 17px; color: #fff; background: rgba(255,255,255,.08); }
.wv-row .o { color: #8e8e98; }
.wv-row .o i { color: #6e6e78; font-size: 18px; flex: none; margin-top: 1px; }
.wv-row .n { color: #f5f5f7; background: linear-gradient(90deg, rgba(48,209,88,.08), rgba(10,132,255,.06)); box-shadow: inset 0.5px 0 0 rgba(255,255,255,.1); }
.wv-row .n i { color: #30d158; font-size: 18px; flex: none; margin-top: 1px; }
.wv-th .n { background: linear-gradient(90deg, rgba(48,209,88,.12), rgba(10,132,255,.1)); }
.wv-row:not(.wv-th) { opacity: 0; transform: translateY(14px); transition: opacity .7s var(--ease), transform .7s var(--ease); transition-delay: calc(var(--i) * 90ms); }
.why.in .wv-row { opacity: 1; transform: none; }
.why-cta { display: flex; align-items: center; justify-content: space-between; gap: 30px; margin-top: 70px; padding: 30px 34px; border-radius: 26px;
  background: linear-gradient(120deg, rgba(255,55,95,.14), rgba(191,90,242,.1) 45%, rgba(10,132,255,.14)); box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.16); }
.why-cta p { margin: 0; color: #c7c7cf; font-size: 17px; line-height: 1.55; max-width: 62ch; }
.why-cta p b { color: #fff; }
.why-btns { display: flex; gap: 12px; flex: none; }
@media (max-width: 1080px) {
  .why-founder { grid-template-columns: 1fr; padding: 36px; }
  .why-vs { grid-template-columns: 1fr; gap: 28px; }
  .wv-intro { position: static; }
}
@media (max-width: 760px) {
  .why { padding: 90px 0 80px; }
  .why-founder { padding: 26px 20px; border-radius: 24px; gap: 28px; }
  .wf-stats { gap: 10px; }
  .ws { padding: 18px 16px; }
  .wv-th { display: none; }
  .wv-row { grid-template-columns: 1fr; }
  .wv-row > span { padding: 12px 18px; }
  .wv-row .k { padding-top: 18px; }
  .wv-row .o { padding-top: 0; }
  .wv-row .n { margin: 0 12px 14px; border-radius: 14px; }
  .why-cta { flex-direction: column; align-items: flex-start; padding: 24px 20px; }
  .why-btns { flex-direction: column; width: 100%; }
  .why-btns .b { justify-content: center; }
}
/* v1.9.1 — kurumsal ilke listesi (yıl kartlarının yerine) */
.wf-pillars { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; align-content: center; border-radius: 22px; overflow: hidden; box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.12); background: rgba(255,255,255,.02); }
.wf-pillars li { display: flex; gap: 16px; align-items: flex-start; padding: 20px 22px; background: rgba(255,255,255,.03); transition: background .35s; }
.wf-pillars li + li { box-shadow: inset 0 0.5px 0 rgba(255,255,255,.08); }
.wf-pillars li:hover { background: rgba(255,255,255,.065); }
.wp-ic { flex: none; width: 44px; height: 44px; border-radius: 13px; display: grid; place-items: center; font-size: 22px; color: #fff;
  background: linear-gradient(160deg, color-mix(in srgb, var(--c) 72%, #fff), var(--c)); box-shadow: 0 10px 24px -12px var(--c), inset 0 1px 0 rgba(255,255,255,.3); }
.wf-pillars b { display: block; font: 650 16.5px/1.3 var(--display); letter-spacing: -0.015em; color: #fff; margin-bottom: 4px; }
.wf-pillars p { margin: 0; color: #9d9da8; font-size: 14px; line-height: 1.5; }
.wf-mono { font-size: 22px; background: linear-gradient(160deg, #ff6a5f, #d7261b); box-shadow: 0 0 0 3px rgba(255,255,255,.08), 0 14px 30px -10px rgba(255,59,48,.7); }
/* v1.9.2 — İki dünya, tek vizyon (radyo + teknoloji buluşması) */
.why-conv { position: relative; padding: 56px 52px 50px; border-radius: 32px; background: linear-gradient(160deg, rgba(255,255,255,.075), rgba(255,255,255,.02));
  box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.14), 0 60px 120px -60px rgba(0,0,0,.9); backdrop-filter: blur(24px); -webkit-backdrop-filter: blur(24px); }
.why-conv::before { content: ""; position: absolute; inset: 0; border-radius: inherit; padding: 1px; background: linear-gradient(135deg, rgba(255,107,139,.55), rgba(255,255,255,.04) 35%, rgba(255,255,255,.04) 65%, rgba(111,181,255,.5)); -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude; pointer-events: none; }
.wc-head { text-align: center; max-width: 800px; margin: 0 auto 44px; }
.wc-head h3 { font: 750 clamp(28px, 3.2vw, 42px)/1.12 var(--display); letter-spacing: -0.035em; color: #fff; margin: 0 0 18px; }
.wc-head h3 span { display: block; background: linear-gradient(92deg, #ff8aa5, #c9a2ff 50%, #8fc4ff); -webkit-background-clip: text; background-clip: text; color: transparent; }
.wc-head p { color: #b4b4be; font-size: 17px; line-height: 1.7; margin: 0; }
.wc-stage { display: grid; grid-template-columns: minmax(0, 1fr) 220px minmax(0, 1fr); align-items: center; gap: 0; }
.wc-side { position: relative; padding: 28px 26px; border-radius: 24px; background: rgba(255,255,255,.035); box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.12); transition: transform .45s var(--ease), background .45s; }
.wc-side:hover { transform: translateY(-4px); background: rgba(255,255,255,.06); }
.wc-side.l { box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.12), -30px 0 80px -50px rgba(255,55,95,.7); }
.wc-side.r { box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.12), 30px 0 80px -50px rgba(10,132,255,.7); }
.wc-ic { width: 48px; height: 48px; border-radius: 14px; display: grid; place-items: center; font-size: 24px; color: #fff; background: linear-gradient(160deg, color-mix(in srgb, var(--c) 70%, #fff), var(--c)); box-shadow: 0 12px 26px -12px var(--c), inset 0 1px 0 rgba(255,255,255,.3); }
.wc-side small { display: block; margin-top: 18px; font-size: 12.5px; font-weight: 650; letter-spacing: .08em; text-transform: uppercase; color: #8e8e98; }
.wc-side b { display: block; font: 800 30px/1.1 var(--display); letter-spacing: -0.035em; color: #fff; margin: 4px 0 10px; }
.wc-side p { margin: 0 0 16px; color: #a8a8b2; font-size: 15px; line-height: 1.6; }
.wc-side ul { list-style: none; margin: 0; padding: 14px 0 0; border-top: 0.5px solid rgba(255,255,255,.1); display: grid; gap: 9px; }
.wc-side li { display: flex; gap: 9px; align-items: center; color: #e5e5ea; font-size: 14.5px; }
.wc-side.l li i { color: #ff6b8b; } .wc-side.r li i { color: #64a8ff; }
.wc-core { position: relative; height: 220px; display: grid; place-items: center; }
.wc-line { position: absolute; top: 50%; height: 2px; width: 50%; margin-top: -1px; overflow: hidden; }
.wc-line.l { left: 0; background: linear-gradient(90deg, rgba(255,55,95,.15), rgba(255,55,95,.9)); }
.wc-line.r { right: 0; background: linear-gradient(90deg, rgba(10,132,255,.9), rgba(10,132,255,.15)); }
.wc-line::after { content: ""; position: absolute; top: 0; bottom: 0; width: 40%; background: linear-gradient(90deg, transparent, #fff, transparent); animation: wcFlow 2.4s linear infinite; }
.wc-line.r::after { animation-direction: reverse; }
@keyframes wcFlow { from { left: -40%; } to { left: 100%; } }
.wc-orb { position: relative; z-index: 1; width: 96px; height: 96px; border-radius: 50%; display: grid; place-items: center;
  background: radial-gradient(circle at 30% 25%, rgba(255,255,255,.25), rgba(255,255,255,.04) 60%), #121218; box-shadow: 0 0 0 1px rgba(255,255,255,.14), 0 0 60px -6px rgba(191,90,242,.7), 0 0 0 10px rgba(255,255,255,.03); }
.wc-orb::before { content: ""; position: absolute; inset: -14px; border-radius: 50%; border: 1px solid rgba(255,255,255,.12); animation: wcPulse 3s ease-out infinite; }
@keyframes wcPulse { from { transform: scale(.85); opacity: 1; } to { transform: scale(1.35); opacity: 0; } }
.wc-orb .brand-mark { width: 52px; height: 52px; border-radius: 16px; font-size: 26px; }
.wc-core em { position: absolute; bottom: 18px; font-style: normal; font: 700 13px var(--display); letter-spacing: .06em; text-transform: uppercase; color: #d9d9e0; }
.wc-quote { position: relative; max-width: 860px; margin: 40px auto 0; padding: 22px 28px 22px 34px; border-radius: 18px; color: #c9c9d1; font-size: 16.5px; line-height: 1.7; background: rgba(255,255,255,.035); }
.wc-quote::before { content: ""; position: absolute; left: 0; top: 18px; bottom: 18px; width: 3px; border-radius: 3px; background: linear-gradient(#ff375f, #bf5af2, #0a84ff); }
@media (max-width: 980px) {
  .why-conv { padding: 34px 22px; }
  .wc-stage { grid-template-columns: 1fr; }
  .wc-core { height: 130px; }
  .wc-line { width: 2px; height: 50%; left: 50% !important; right: auto !important; margin: 0 0 0 -1px; top: 0; }
  .wc-line.r { top: 50%; }
  .wc-line::after { width: auto; height: 40%; left: 0; right: 0; animation: none; }
  .wc-core em { bottom: 4px; right: 12px; }
}

/* ===== v2.0 — İki dünya, tek vizyon: radyo | teknoloji bölünmüş sahne ===== */
.tw { position: relative; }
.tw-head { text-align: center; max-width: 820px; margin: 0 auto 46px; }
.tw-kick { display: inline-flex; align-items: center; gap: 8px; padding: 7px 14px; border-radius: 99px; font-size: 13px; font-weight: 650; color: #f2f2f7;
  background: linear-gradient(90deg, rgba(255,55,95,.18), rgba(10,132,255,.18)); box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.2); margin-bottom: 22px; }
.tw-kick i { font-size: 16px; }
.tw-head h3 { font: 800 clamp(32px, 4vw, 54px)/1.06 var(--display); letter-spacing: -0.042em; color: #fff; margin: 0 0 20px; }
.tw-head h3 em { display: block; font-style: normal; background: linear-gradient(92deg, #ff6b8b 0%, #d58bff 48%, #6fb5ff 100%); -webkit-background-clip: text; background-clip: text; color: transparent; padding-bottom: 4px; }
.tw-head p { color: #b4b4be; font-size: 17.5px; line-height: 1.7; margin: 0; }

.tw-split { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) 0 minmax(0, 1fr); border-radius: 34px; overflow: hidden;
  box-shadow: 0 0 0 0.5px rgba(255,255,255,.14), 0 70px 140px -70px rgba(0,0,0,.95); }
.tw-half { position: relative; padding: 46px 46px 40px; min-height: 520px; display: flex; flex-direction: column; overflow: hidden; }
.tw-radio { background: radial-gradient(120% 90% at 0% 0%, rgba(255,55,95,.34), transparent 60%), radial-gradient(80% 60% at 100% 100%, rgba(255,159,10,.14), transparent 60%), linear-gradient(160deg, #1a0d12, #0d0a0c); }
.tw-tech { background: radial-gradient(120% 90% at 100% 0%, rgba(10,132,255,.34), transparent 60%), radial-gradient(80% 60% at 0% 100%, rgba(191,90,242,.16), transparent 60%), linear-gradient(200deg, #0b1220, #090b10); padding-left: 64px; }
.tw-radio { padding-right: 64px; }
.tw-half::after { content: ""; position: absolute; inset: 0; pointer-events: none; background-image: radial-gradient(rgba(255,255,255,.7) .5px, transparent .6px); background-size: 4px 4px; opacity: .05; }
.tw-top { display: flex; align-items: center; gap: 12px; }
.tw-chip { display: inline-flex; align-items: center; gap: 7px; height: 26px; padding: 0 11px; border-radius: 7px; font: 800 11.5px var(--display); letter-spacing: .12em; color: #fff; }
.tw-chip.red { background: #ff3b30; box-shadow: 0 0 24px -4px rgba(255,59,48,.9); }
.tw-chip.red .pulse { width: 7px; height: 7px; border-radius: 50%; background: #fff; animation: twBlink 1.2s ease-in-out infinite; }
.tw-chip.blue { background: rgba(10,132,255,.22); color: #8fc4ff; box-shadow: inset 0 0 0 0.5px rgba(10,132,255,.6); }
.tw-chip.blue i { color: #30d158; font-size: 13px; }
@keyframes twBlink { 50% { opacity: .25; } }
.tw-tag { font-size: 12px; font-weight: 650; letter-spacing: .1em; text-transform: uppercase; color: rgba(255,255,255,.55); }
.tw-half h4 { font: 850 clamp(46px, 5.4vw, 76px)/.95 var(--display); letter-spacing: -0.05em; margin: 26px 0 14px; color: #fff; }
.tw-radio h4 { background: linear-gradient(180deg, #fff 30%, #ffb3c2); -webkit-background-clip: text; background-clip: text; color: transparent; }
.tw-tech h4 { background: linear-gradient(180deg, #fff 30%, #a9d2ff); -webkit-background-clip: text; background-clip: text; color: transparent; }
.tw-half > p { color: #c3c3cc; font-size: 16.5px; line-height: 1.6; max-width: 40ch; margin: 0 0 26px; }
.tw-wave { display: flex; align-items: center; gap: 4px; height: 96px; margin: auto 0 26px; padding: 0 2px; }
.tw-wave i { flex: 1; height: var(--h); min-width: 3px; border-radius: 3px; background: linear-gradient(180deg, #ff8aa5, #ff375f 60%, rgba(255,55,95,.4)); animation: twBar 1.6s ease-in-out infinite alternate; animation-delay: var(--d); transform-origin: center; }
@keyframes twBar { 0% { transform: scaleY(.35); opacity: .55; } 100% { transform: scaleY(1); opacity: 1; } }
.tw-code { margin: auto 0 26px; border-radius: 14px; overflow: hidden; background: rgba(5,8,14,.75); box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.12), 0 30px 60px -30px rgba(0,0,0,.8); }
.tw-code-bar { display: flex; align-items: center; gap: 6px; height: 30px; padding: 0 12px; background: rgba(255,255,255,.04); border-bottom: 0.5px solid rgba(255,255,255,.08); }
.tw-code-bar i { width: 9px; height: 9px; border-radius: 50%; background: #ff5f57; } .tw-code-bar i:nth-child(2) { background: #febc2e; } .tw-code-bar i:nth-child(3) { background: #28c840; }
.tw-code-bar span { margin-left: 8px; font: 500 11.5px ui-monospace, SFMono-Regular, Menlo, monospace; color: #8e8e98; }
.tw-code pre { margin: 0; padding: 14px 16px 16px; font: 12.5px/1.7 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; color: #d8dee9; white-space: pre; overflow: hidden; }
.tw-code .c { color: #6b7385; } .tw-code .k { color: #ff7ab2; } .tw-code .f { color: #6fb5ff; } .tw-code .s { color: #ffd479; } .tw-code .n { color: #b4f08a; }
.tw-code .caret { display: inline-block; width: 7px; height: 15px; margin-left: 2px; vertical-align: -3px; background: #6fb5ff; animation: twBlink 1s steps(1) infinite; }
.tw-facts { list-style: none; margin: 0; padding: 18px 0 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; border-top: 0.5px solid rgba(255,255,255,.12); }
.tw-facts li { display: flex; flex-direction: column; gap: 8px; font-size: 13.5px; font-weight: 550; color: #e9e9ee; line-height: 1.35; }
.tw-facts i { font-size: 22px; }
.tw-radio .tw-facts i { color: #ff8aa5; } .tw-tech .tw-facts i { color: #8fc4ff; }
.tw-seam { position: relative; z-index: 3; }
.tw-beam { position: absolute; top: 0; bottom: 0; left: -1px; width: 2px; background: linear-gradient(180deg, transparent, rgba(255,107,139,.9) 30%, rgba(213,139,255,1) 50%, rgba(111,181,255,.9) 70%, transparent); box-shadow: 0 0 30px 4px rgba(191,90,242,.55); }
.tw-core { position: absolute; top: 50%; left: 0; width: 120px; height: 120px; margin: -60px 0 0 -60px; border-radius: 50%; display: grid; place-items: center;
  background: radial-gradient(circle at 30% 25%, rgba(255,255,255,.22), rgba(255,255,255,.03) 55%), #0d0d12; box-shadow: 0 0 0 1px rgba(255,255,255,.18), 0 0 80px 0 rgba(191,90,242,.65), 0 30px 60px -20px rgba(0,0,0,.9); }
.tw-core .brand-mark { width: 60px; height: 60px; border-radius: 18px; font-size: 30px; }
.tw-ring { position: absolute; inset: -10px; border-radius: 50%; border: 1px solid rgba(255,255,255,.22); animation: twRing 3.2s ease-out infinite; }
.tw-ring.two { animation-delay: 1.6s; }
@keyframes twRing { from { transform: scale(.8); opacity: .9; } to { transform: scale(1.6); opacity: 0; } }
.tw-name { position: absolute; top: calc(50% + 74px); left: 0; transform: translateX(-50%); white-space: nowrap; font: 800 12px var(--display); letter-spacing: .18em; text-transform: uppercase; color: #fff;
  padding: 6px 12px; border-radius: 99px; background: rgba(13,13,18,.85); box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.2); backdrop-filter: blur(10px); }
.tw-quote { position: relative; margin: 34px auto 0; max-width: 940px; padding: 30px 36px 30px 84px; border-radius: 24px; background: linear-gradient(120deg, rgba(255,255,255,.06), rgba(255,255,255,.02)); box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.14); }
.tw-quote > i { position: absolute; left: 30px; top: 28px; font-size: 34px; background: linear-gradient(135deg, #ff6b8b, #6fb5ff); -webkit-background-clip: text; background-clip: text; color: transparent; }
.tw-quote p { margin: 0; color: #c9c9d1; font-size: 18px; line-height: 1.7; }
.tw-quote b { color: #fff; }
@media (max-width: 980px) {
  .tw-split { grid-template-columns: 1fr; border-radius: 26px; }
  .tw-half { min-height: 0; padding: 34px 26px 30px !important; }
  .tw-seam { height: 0; }
  .tw-beam { top: -1px; bottom: auto; left: 0; right: 0; width: auto; height: 2px; background: linear-gradient(90deg, transparent, #ff6b8b 30%, #d58bff 50%, #6fb5ff 70%, transparent); }
  .tw-core { left: 50%; top: 0; width: 88px; height: 88px; margin: -44px 0 0 -44px; }
  .tw-core .brand-mark { width: 44px; height: 44px; font-size: 22px; border-radius: 13px; }
  .tw-name { display: none; }
  .tw-tech { padding-top: 64px !important; }
  .tw-quote { padding: 24px 22px 24px 62px; }
  .tw-quote > i { left: 20px; top: 22px; font-size: 26px; }
  .tw-quote p { font-size: 16px; }
}
@media (max-width: 520px) { .tw-facts { grid-template-columns: 1fr; } .tw-facts li { flex-direction: row; align-items: center; } .tw-code pre { font-size: 11px; } }
.tw-head h3, .why-head h2, .wv-intro h3 { text-wrap: balance; }
@media (max-width: 980px) { .tw-radio { padding-bottom: 72px !important; } }

/* =========================================================
   v1.9.8 — Yerel veritabanı · Çoklu yayın · Bildiğiniz düzen
   ========================================================= */
/* ---------- Yerel veritabanı ---------- */
.ldb-sec { background: #07070b; color: #f5f5f7; overflow: hidden; }
.ldb-sec .lead { color: #a1a1a6; } .ldb-sec .lead b { color: #f5f5f7; font-weight: 600; }
.ldb-aura { position: absolute; inset: 0; pointer-events: none; }
.ldb-aura i { position: absolute; border-radius: 50%; filter: blur(90px); opacity: .55; }
.ldb-aura i:nth-child(1) { width: 520px; height: 420px; left: -120px; top: 120px; background: #5e5ce6; opacity: .28; }
.ldb-aura i:nth-child(2) { width: 460px; height: 380px; right: -80px; top: 40px; background: #0a84ff; opacity: .22; }
.ldb-aura i:nth-child(3) { width: 600px; height: 300px; left: 30%; bottom: -160px; background: #bf5af2; opacity: .2; }
.ldb-sec .wrap { position: relative; }
.ldb-head h2 { max-width: none; font-size: clamp(38px, 5.4vw, 66px); }
.ldb-grad { background: linear-gradient(92deg, #a78bfa, #64d2ff 55%, #30d158); -webkit-background-clip: text; background-clip: text; color: transparent; }
.ldb-stage { position: relative; display: grid; grid-template-columns: 1.25fr .85fr; gap: 26px; margin: 54px 0 46px; align-items: start; }
.ldb-explorer { grid-row: span 2; border-radius: 18px; overflow: hidden; background: rgba(28,28,34,.82); backdrop-filter: blur(30px); border: 0.5px solid rgba(255,255,255,.12); box-shadow: 0 60px 120px -40px rgba(0,0,0,.9), inset 0 1px 0 rgba(255,255,255,.06); }
.lx-bar { display: flex; align-items: center; gap: 7px; height: 36px; padding: 0 14px; background: rgba(255,255,255,.04); border-bottom: 0.5px solid rgba(255,255,255,.08); }
.lx-bar > span { width: 11px; height: 11px; border-radius: 50%; background: #ff5f57; } .lx-bar > span:nth-child(2) { background: #febc2e; } .lx-bar > span:nth-child(3) { background: #28c840; }
.lx-bar em { font-style: normal; margin: 0 auto; padding-right: 46px; font-size: 12px; color: #8e8e93; display: inline-flex; gap: 6px; align-items: center; }
.lx-bar.light { background: #ececf0; border-color: rgba(0,0,0,.08); } .lx-bar.light em { color: #6e6e73; }
.lx-body { display: grid; grid-template-columns: 170px 1fr; min-height: 360px; }
.lx-side { padding: 14px 10px; border-right: 0.5px solid rgba(255,255,255,.07); display: flex; flex-direction: column; gap: 3px; font-size: 13px; color: #c7c7cc; }
.lx-side small { font-size: 11px; color: #6e6e73; font-weight: 600; padding: 0 8px 6px; }
.lx-side span { display: flex; gap: 8px; align-items: center; padding: 6px 8px; border-radius: 8px; }
.lx-side span.on { background: rgba(10,132,255,.22); color: #fff; }
.lx-side i { color: #64d2ff; font-size: 16px; }
.lx-main { position: relative; padding: 14px 16px 18px; display: flex; flex-direction: column; gap: 4px; }
.lx-row { position: relative; display: flex; align-items: center; gap: 10px; padding: 9px 10px; border-radius: 10px; font-size: 14px; }
.lx-row > i { font-size: 20px; color: #64d2ff; }
.lx-row b { font-weight: 600; } .lx-row em { margin-left: auto; font-style: normal; font-size: 12px; color: #8e8e93; display: inline-flex; gap: 5px; align-items: center; font-variant-numeric: tabular-nums; }
.lx-row.l1 { margin-left: 26px; } .lx-row.l2 { margin-left: 52px; }
.lx-row.root { background: rgba(255,255,255,.05); }
.lx-row.db { background: linear-gradient(90deg, rgba(94,92,230,.28), rgba(10,132,255,.12)); box-shadow: inset 0 0 0 0.5px rgba(167,139,250,.45); min-height: 52px; }
.lx-row.rms { background: rgba(48,209,88,.1); box-shadow: inset 0 0 0 0.5px rgba(48,209,88,.35); }
.lx-row.rms em { color: #30d158; }
.lx-row.txt > i { color: #8e8e93; }
.lx-dbic, .lx-rmsic { position: relative; width: 32px; height: 32px; border-radius: 9px; display: grid; place-items: center; color: #fff; font-size: 17px; flex: none; }
.lx-dbic { background: linear-gradient(140deg, #8b5cf6, #0a84ff); box-shadow: 0 8px 20px -6px rgba(94,92,230,.8); }
.lx-rmsic { background: linear-gradient(140deg, #30d158, #0a9b3a); }
.lx-pulse { position: absolute; inset: -4px; border-radius: 12px; border: 1.5px solid rgba(167,139,250,.7); animation: lxPulse 2.8s ease-out infinite; }
@keyframes lxPulse { 0% { opacity: .9; transform: scale(.9); } 100% { opacity: 0; transform: scale(1.5); } }
.lx-flow { position: absolute; left: 0; right: 0; top: -150px; height: 150px; pointer-events: none; }
.lx-flow span { position: absolute; right: 30%; top: 0; display: inline-flex; gap: 6px; align-items: center; font-size: 11.5px; font-weight: 600; padding: 5px 10px; border-radius: 20px; background: rgba(28,28,34,.95); border: 0.5px solid rgba(255,255,255,.14); color: #f5f5f7; white-space: nowrap; opacity: 0; animation: lxFly 5.6s var(--d) infinite cubic-bezier(.5,.05,.4,1); }
.lx-flow span i { color: var(--k); }
@keyframes lxFly { 0% { opacity: 0; transform: translate(120px, -10px) scale(.9); } 12% { opacity: 1; } 55% { opacity: 1; transform: translate(-40px, 110px) scale(.96); } 70%, 100% { opacity: 0; transform: translate(-150px, 150px) scale(.4); } }
.lx-copy { margin-top: auto; display: grid; grid-template-columns: 26px 1fr auto; gap: 2px 10px; align-items: center; padding: 12px 14px; border-radius: 12px; background: rgba(255,255,255,.04); border: 0.5px dashed rgba(255,255,255,.16); font-size: 12.5px; color: #c7c7cc; }
.lx-copy > i { grid-row: span 2; font-size: 22px; color: #a78bfa; }
.lx-copy b { font-weight: 600; color: #f5f5f7; text-align: right; font-size: 12px; }
.lx-cbar { grid-column: 2 / -1; height: 4px; border-radius: 3px; background: rgba(255,255,255,.08); overflow: hidden; }
.lx-cbar i { display: block; height: 100%; width: 40%; border-radius: 3px; background: linear-gradient(90deg, #a78bfa, #64d2ff); animation: lxCopy 4s ease-in-out infinite; }
@keyframes lxCopy { 0% { width: 0; } 80%, 100% { width: 100%; } }
.ldb-note { border-radius: 14px; overflow: hidden; background: #fff; color: #1d1d1f; box-shadow: 0 40px 80px -30px rgba(0,0,0,.8); transform: rotate(1.2deg); }
.ldb-note pre { margin: 0; padding: 14px 16px; height: 120px; overflow: hidden; font: 12.5px/1.55 ui-monospace, "SF Mono", Menlo, Consolas, monospace; color: #3a3a3c; white-space: pre-wrap; word-break: break-all; }
.ln-foot { display: flex; justify-content: space-between; gap: 8px; padding: 9px 14px; border-top: 0.5px solid rgba(0,0,0,.08); font-size: 12px; font-weight: 600; background: #f7f7f9; }
.ln-foot span { display: inline-flex; gap: 5px; align-items: center; color: #1d7a34; } .ln-foot .bad { color: #d70015; }
.ldb-wiz { border-radius: 18px; background: rgba(28,28,34,.86); border: 0.5px solid rgba(255,255,255,.12); padding: 16px; box-shadow: 0 50px 100px -40px rgba(0,0,0,.9); }
.lw-h { display: flex; align-items: center; gap: 10px; font-size: 14px; margin-bottom: 12px; }
.lw-steps { margin-left: auto; display: flex; align-items: center; gap: 4px; }
.lw-steps span { width: 20px; height: 20px; border-radius: 50%; display: grid; place-items: center; font-size: 11px; font-weight: 700; background: rgba(255,255,255,.08); color: #8e8e93; }
.lw-steps span.on { background: #0a84ff; color: #fff; } .lw-steps i { width: 14px; height: 1px; background: rgba(255,255,255,.15); }
.lw-pick { display: inline-flex; gap: 7px; align-items: center; height: 34px; padding: 0 14px; border-radius: 10px; background: rgba(255,255,255,.08); border: 0.5px solid rgba(255,255,255,.14); font-size: 13px; font-weight: 600; margin-bottom: 10px; }
.lw-list { list-style: none; margin: 0; padding: 0; border-radius: 12px; overflow: hidden; display: flex; flex-direction: column; gap: 2px; }
.lw-list li { display: flex; gap: 10px; align-items: flex-start; padding: 9px 11px; background: rgba(255,255,255,.045); opacity: .25; transition: opacity .4s, background .4s; }
.lw-list li > i { font-size: 18px; color: #48484a; transition: color .3s, transform .3s; }
.lw-list li.ok { opacity: 1; } .lw-list li.ok > i { color: #30d158; transform: scale(1.08); }
.lw-list b { display: block; font-size: 13px; font-weight: 600; } .lw-list small { font-size: 11.5px; color: #8e8e93; }
.lw-foot { display: flex; align-items: center; gap: 10px; margin-top: 12px; }
.lw-hint { font-size: 11.5px; color: #8e8e93; display: inline-flex; gap: 5px; align-items: center; transition: opacity .3s; }
.lw-next { margin-left: auto; display: inline-flex; gap: 6px; align-items: center; height: 34px; padding: 0 16px; border-radius: 10px; background: rgba(10,132,255,.25); color: rgba(255,255,255,.45); font-size: 13px; font-weight: 600; transition: background .35s, color .35s, box-shadow .35s; }
.lw-next.on { background: #0a84ff; color: #fff; box-shadow: 0 10px 24px -8px rgba(10,132,255,.9); }
.ldb-wiz.ready .lw-hint { opacity: 0; }
.ldb-feats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.ldb-feats > div { display: grid; grid-template-columns: 40px 1fr; gap: 4px 14px; padding: 18px; border-radius: 18px; background: rgba(255,255,255,.04); border: 0.5px solid rgba(255,255,255,.09); }
.lf-i { grid-row: span 2; width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; font-size: 21px; color: var(--c); background: color-mix(in srgb, var(--c) 18%, transparent); }
.ldb-feats b { font-size: 15.5px; font-weight: 650; } .ldb-feats small { font-size: 13.5px; color: #a1a1a6; line-height: 1.5; }
.ldb-lic { display: grid; grid-template-columns: 1fr 1fr; gap: 34px; align-items: center; margin-top: 58px; padding: 34px; border-radius: 26px; background: linear-gradient(140deg, rgba(94,92,230,.16), rgba(10,132,255,.06) 60%, rgba(255,255,255,.02)); border: 0.5px solid rgba(167,139,250,.25); }
.ldb-lic h3 { font: 750 clamp(22px, 2.4vw, 30px)/1.15 var(--display); letter-spacing: -0.03em; margin: 0 0 12px; }
.ldb-lic p { color: #a1a1a6; margin: 0; font-size: 15.5px; } .ldb-lic p b { color: #f5f5f7; }
.ll-graph { position: relative; display: grid; grid-template-columns: 150px 1fr 1.3fr; align-items: center; min-height: 190px; }
.lg-folder { display: flex; flex-direction: column; align-items: center; gap: 4px; text-align: center; }
.lg-folder > i { font-size: 52px; color: #64d2ff; filter: drop-shadow(0 10px 20px rgba(10,132,255,.45)); }
.lg-folder b { font-size: 13px; } .lg-folder small { font-size: 11px; color: #8e8e93; }
.lg-lines { width: 100%; height: 180px; } .lg-lines path { fill: none; stroke: #30d158; stroke-width: 1.6; stroke-dasharray: 5 6; animation: lgDash 1.4s linear infinite; }
.lg-lines path.off { stroke: #ff453a; opacity: .55; animation: none; }
@keyframes lgDash { to { stroke-dashoffset: -22; } }
.lg-lics { display: flex; flex-direction: column; gap: 18px; }
.lg-lics > span { display: flex; gap: 10px; align-items: center; padding: 9px 12px; border-radius: 12px; background: rgba(48,209,88,.12); border: 0.5px solid rgba(48,209,88,.35); }
.lg-lics > span i { font-size: 18px; color: #30d158; } .lg-lics b { display: block; font-size: 13px; } .lg-lics small { font-size: 11px; color: #a1a1a6; }
.lg-lics > span.no { background: rgba(255,69,58,.1); border-color: rgba(255,69,58,.35); } .lg-lics > span.no i { color: #ff453a; } .lg-lics > span.no b { text-decoration: line-through; text-decoration-color: rgba(255,69,58,.7); }
.ldb-cta { margin-top: 44px; }

/* ---------- Çoklu yayın ---------- */
.mx-sec { background: radial-gradient(700px 360px at 90% 0%, rgba(255,159,10,.1), transparent 70%), var(--canvas); }
.mx-headrow { display: flex; align-items: flex-end; gap: 30px; justify-content: space-between; flex-wrap: wrap; }
.mx-headrow .lead { margin-bottom: 0; }
.mx-seg { display: inline-flex; padding: 3px; border-radius: 12px; background: rgba(0,0,0,.05); gap: 2px; }
.mx-seg button { border: 0; background: none; height: 34px; padding: 0 14px; border-radius: 9px; font-size: 13.5px; font-weight: 600; color: var(--ink-2); cursor: pointer; display: inline-flex; gap: 6px; align-items: center; }
.mx-seg button.on { background: #fff; color: var(--ink); box-shadow: 0 2px 8px rgba(0,0,0,.12); }
.mx-board { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin: 38px 0 30px; padding: 14px; border-radius: 26px; background: #111114; box-shadow: 0 60px 120px -60px rgba(20,20,40,.7), 0 0 0 6px rgba(255,255,255,.7), 0 0 0 0.5px rgba(0,0,0,.2); transition: grid-template-columns .5s var(--ease); }
.mx-board[data-l="cols"] { grid-template-columns: repeat(4, 1fr); }
.mx-board[data-l="rows"] { grid-template-columns: 1fr; }
.mx-board[data-l="rows"] .mx-tile { grid-template-columns: 200px 1fr 1fr; align-items: center; } .mx-board[data-l="rows"] .mt-q, .mx-board[data-l="rows"] .mt-news { display: none; }
.mx-board[data-l="cols"] .mt-out span:last-child { display: none; }
.mx-tile { position: relative; display: grid; gap: 10px; padding: 14px; border-radius: 16px; background: linear-gradient(170deg, color-mix(in srgb, var(--k) 16%, #1c1c21), #17171b 60%); border: 0.5px solid color-mix(in srgb, var(--k) 40%, transparent); color: #f2f2f5; overflow: hidden; }
.mt-top { display: flex; align-items: center; gap: 8px; font-size: 13px; }
.mt-dot { width: 9px; height: 9px; border-radius: 50%; background: var(--k); box-shadow: 0 0 10px var(--k); }
.mt-air { font-size: 9.5px; font-weight: 800; letter-spacing: .06em; padding: 2px 6px; border-radius: 5px; background: rgba(255,59,48,.22); color: #ff6961; }
.mt-sp { flex: 1; }
.mt-vu { display: inline-flex; gap: 2px; align-items: flex-end; height: 14px; } .mt-vu i { width: 3px; border-radius: 2px; background: var(--k); animation: rxeq .9s ease-in-out infinite; } .mt-vu i:nth-child(2) { animation-delay: -.3s; } .mt-vu i:nth-child(3) { animation-delay: -.6s; } .mt-vu i:nth-child(4) { animation-delay: -.15s; }
.mt-now { display: grid; grid-template-columns: 38px 1fr auto; gap: 10px; align-items: center; }
.mt-cd { width: 38px; height: 38px; border-radius: 10px; display: grid; place-items: center; font-weight: 800; color: #fff; background: var(--k); box-shadow: 0 8px 18px -8px var(--k); }
.mt-now b { display: block; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .mt-now small { font-size: 12px; color: #8e8e93; }
.mt-now em { font-style: normal; font-size: 13px; font-variant-numeric: tabular-nums; color: #c7c7cc; }
.mt-prog { height: 4px; border-radius: 3px; background: rgba(255,255,255,.08); overflow: hidden; } .mt-prog i { display: block; height: 100%; width: calc(var(--p) * 100%); background: var(--k); border-radius: 3px; transition: width 1s linear; }
.mt-q { display: flex; flex-direction: column; gap: 3px; } .mt-q span { font-size: 12px; color: #a1a1a6; display: flex; gap: 6px; align-items: center; padding: 5px 8px; border-radius: 7px; background: rgba(255,255,255,.04); } .mt-q i { color: var(--k); }
.mt-out { display: flex; gap: 6px; flex-wrap: wrap; } .mt-out span { font-size: 11px; display: inline-flex; gap: 5px; align-items: center; padding: 4px 8px; border-radius: 7px; background: rgba(255,255,255,.06); color: #d1d1d6; } .mt-out i { color: var(--k); }
.mt-news { position: absolute; left: 10px; right: 10px; bottom: 10px; display: flex; gap: 6px; align-items: center; justify-content: center; font-size: 12px; font-weight: 600; padding: 8px; border-radius: 10px; background: rgba(10,132,255,.9); color: #fff; transform: translateY(140%); transition: transform .5s var(--ease); }
.mx-board.news .mt-news { transform: none; }
.mx-tile.hl { box-shadow: 0 0 0 2px var(--k), 0 0 30px -6px var(--k); }
.mx-cases { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.mx-cases > div { padding: 20px; border-radius: 20px; background: #fff; box-shadow: 0 0 0 0.5px var(--hair), 0 18px 40px -30px rgba(0,0,0,.35); display: flex; flex-direction: column; gap: 6px; }
.mc-i { width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; font-size: 21px; color: var(--c); background: color-mix(in srgb, var(--c) 13%, transparent); margin-bottom: 6px; }
.mx-cases b { font-size: 16px; } .mx-cases small { font-size: 14px; color: var(--ink-2); line-height: 1.5; }
.mc-row { display: flex; gap: 5px; flex-wrap: wrap; margin-top: 8px; } .mc-row span { font-size: 11.5px; font-weight: 600; padding: 4px 9px; border-radius: 8px; }
.mc-row .s { background: rgba(0,113,227,.1); color: #0060c4; } .mc-row .a1 { background: rgba(255,55,95,.12); color: #c8002d; } .mc-row .a2 { background: rgba(10,132,255,.12); color: #0060c4; } .mc-row .a3 { background: rgba(255,159,10,.16); color: #b25a00; }
.mx-cta { display: flex; gap: 18px; align-items: center; flex-wrap: wrap; margin-top: 26px; } .mx-cta span { font-size: 13.5px; color: var(--ink-3); }

/* ---------- Bildiğiniz düzen ---------- */
.so-bento { display: grid; grid-template-columns: 1.15fr 1fr; gap: 16px; margin-top: 44px; }
.so-card { border-radius: 24px; background: #fff; padding: 20px; box-shadow: 0 0 0 0.5px var(--hair), 0 30px 60px -40px rgba(0,0,0,.35); display: flex; flex-direction: column; gap: 14px; overflow: hidden; }
.so-tool { grid-row: span 3; }
.so-h { display: flex; gap: 12px; align-items: center; } .so-h b { display: block; font-size: 16.5px; } .so-h small { font-size: 13px; color: var(--ink-2); }
.so-i { width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; font-size: 21px; color: var(--c); background: color-mix(in srgb, var(--c) 13%, transparent); flex: none; }
.tl-win { position: relative; border-radius: 16px; background: #17171b; color: #f2f2f5; padding: 10px; flex: 1; min-height: 380px; }
.tl-bar { display: flex; align-items: center; gap: 6px; padding: 4px 4px 10px; font-size: 13px; border-bottom: 0.5px solid rgba(255,255,255,.08); }
.tl-sp { flex: 1; }
.tl-btn { height: 28px; min-width: 30px; padding: 0 7px; border-radius: 8px; background: rgba(255,255,255,.08); display: inline-flex; gap: 2px; align-items: center; justify-content: center; font-size: 13px; }
.tl-btn.add { background: rgba(48,209,88,.2); color: #30d158; } .tl-btn.add i + i { font-size: 9px; } .tl-btn.del { color: #ff6961; }
.tl-menu { position: absolute; right: 52px; top: 44px; z-index: 2; width: 250px; padding: 5px; border-radius: 12px; background: rgba(44,44,52,.96); backdrop-filter: blur(20px); border: 0.5px solid rgba(255,255,255,.14); box-shadow: 0 30px 60px -20px rgba(0,0,0,.8); display: flex; flex-direction: column; animation: tlIn 7s infinite; transform-origin: top right; }
.tl-menu span { display: flex; gap: 8px; align-items: center; padding: 7px 9px; border-radius: 8px; font-size: 12.5px; }
.tl-menu span i { color: #64d2ff; font-size: 15px; } .tl-menu em { margin-left: auto; font-style: normal; font-size: 10.5px; color: #8e8e93; }
.tl-menu span.on { background: #0a84ff; } .tl-menu span.on i, .tl-menu span.on em { color: #fff; }
@keyframes tlIn { 0%, 6% { opacity: 0; transform: scale(.92); } 12%, 42% { opacity: 1; transform: none; } 50%, 100% { opacity: 0; transform: scale(.96); } }
.tl-rows { display: flex; flex-direction: column; gap: 3px; margin-top: 8px; }
.tl-rows > div { display: grid; grid-template-columns: 26px 1fr auto; gap: 10px; align-items: center; padding: 8px; border-radius: 9px; background: rgba(255,255,255,.035); font-size: 13px; }
.tl-rows small { color: #8e8e93; font-variant-numeric: tabular-nums; font-size: 12px; }
.tl-rows .k { width: 26px; height: 26px; border-radius: 7px; display: grid; place-items: center; font-style: normal; font-weight: 800; font-size: 12px; color: #fff; background: var(--k); }
.tl-rows .k i { font-size: 13px; }
.tl-rows .sl { background: rgba(191,90,242,.13); animation: tlRow 7s infinite; } .tl-rows .al { background: rgba(255,159,10,.15); } .tl-rows .ur { background: rgba(10,132,255,.14); }
@keyframes tlRow { 0%, 46% { opacity: 0; transform: translateX(-10px); max-height: 0; padding: 0 8px; } 54%, 100% { opacity: 1; transform: none; max-height: 50px; } }
.pt-tiles { display: flex; gap: 8px; flex-wrap: wrap; position: relative; }
.pt-tiles span { width: 46px; height: 46px; border-radius: 13px; display: grid; place-items: center; font-weight: 800; color: #fff; background: var(--k); box-shadow: 0 10px 20px -10px var(--k); font-size: 16px; }
.pt-tiles span.r { font-size: 13px; }
.pt-tiles .pt-drag { position: absolute; left: 0; top: 0; z-index: 2; animation: ptDrag 4.5s var(--ease) infinite; box-shadow: 0 18px 30px -10px rgba(255,55,95,.7); }
@keyframes ptDrag { 0%, 10% { transform: translate(0, 0) rotate(0); opacity: 0; } 15% { opacity: 1; transform: translate(0,0) rotate(-6deg) scale(1.08); } 55% { transform: translate(180px, 78px) rotate(4deg) scale(1.08); opacity: 1; } 65%, 100% { transform: translate(180px, 78px) scale(.6); opacity: 0; } }
.pt-strip { display: flex; gap: 5px; padding: 10px; border-radius: 14px; background: #f2f2f7; overflow: hidden; }
.pt-strip span { flex: 1; min-width: 0; height: 40px; border-radius: 9px; display: grid; place-items: center; font-weight: 800; font-size: 13px; color: color-mix(in srgb, var(--k) 75%, #000); background: color-mix(in srgb, var(--k) 18%, #fff); border: 1px solid color-mix(in srgb, var(--k) 40%, transparent); transition: transform .3s, background .3s, color .3s; }
.pt-strip span.on { background: var(--k); color: #fff; transform: translateY(-3px); box-shadow: 0 10px 18px -10px var(--k); }
.pt-note { display: flex; gap: 14px; flex-wrap: wrap; font-size: 12.5px; color: var(--ink-2); } .pt-note span { display: inline-flex; gap: 5px; align-items: center; } .pt-note i { color: #ff375f; }
.th-seg { display: inline-flex; align-self: flex-start; padding: 3px; border-radius: 11px; background: rgba(0,0,0,.05); gap: 2px; }
.th-seg button { border: 0; background: none; height: 30px; padding: 0 12px; border-radius: 8px; font-size: 12.5px; font-weight: 600; color: var(--ink-2); cursor: pointer; }
.th-seg button.on { background: #fff; color: var(--ink); box-shadow: 0 2px 6px rgba(0,0,0,.12); }
.th-desk { position: relative; height: 170px; border-radius: 16px; overflow: hidden; transition: background .5s; }
.th-w { position: absolute; border-radius: 10px; overflow: hidden; box-shadow: 0 16px 30px -16px rgba(0,0,0,.5); transition: background .5s, border-color .5s; border: 0.5px solid rgba(0,0,0,.1); }
.th-w.w1 { left: 14px; top: 16px; width: 58%; height: 120px; } .th-w.w2 { right: 14px; top: 34px; width: 38%; height: 84px; } .th-w.w3 { right: 30px; bottom: 12px; width: 44%; height: 58px; }
.th-b { display: flex; align-items: center; gap: 4px; height: 20px; padding: 0 8px; transition: background .5s, color .5s; }
.th-b span { width: 6px; height: 6px; border-radius: 50%; background: #ff5f57; } .th-b span:nth-child(2) { background: #febc2e; } .th-b span:nth-child(3) { background: #28c840; }
.th-b em { font-style: normal; font-size: 9.5px; font-weight: 600; margin-left: 6px; }
.th-c { padding: 8px; display: flex; flex-direction: column; gap: 5px; } .th-c i { height: 8px; border-radius: 4px; transition: background .5s; } .th-c i:nth-child(2) { width: 70%; } .th-c i:nth-child(3) { width: 45%; }
.th-desk[data-th="vivid"] { background: linear-gradient(135deg, #5e5ce6, #bf5af2 45%, #ff375f 75%, #ff9f0a); }
.th-desk[data-th="vivid"] .th-w { background: rgba(28,28,34,.82); border-color: rgba(255,255,255,.14); }
.th-desk[data-th="vivid"] .w1 .th-b { background: linear-gradient(90deg, #0a84ff, #64d2ff); color: #fff; } .th-desk[data-th="vivid"] .w2 .th-b { background: linear-gradient(90deg, #ff9f0a, #ffd60a); color: #3a2400; } .th-desk[data-th="vivid"] .w3 .th-b { background: linear-gradient(90deg, #30d158, #64d2ff); color: #00321a; }
.th-desk[data-th="vivid"] .th-c i { background: rgba(255,255,255,.18); }
.th-desk[data-th="pearl"] { background: linear-gradient(160deg, #f5f5f7, #e5e5ea); }
.th-desk[data-th="pearl"] .th-w { background: #fff; } .th-desk[data-th="pearl"] .th-b { background: #f2f2f5; color: #6e6e73; } .th-desk[data-th="pearl"] .th-c i { background: #e5e5ea; }
.th-desk[data-th="dark"] { background: linear-gradient(160deg, #1c1c21, #0b0b0d); }
.th-desk[data-th="dark"] .th-w { background: #26262c; border-color: rgba(255,255,255,.1); } .th-desk[data-th="dark"] .th-b { background: #2e2e35; color: #a1a1a6; } .th-desk[data-th="dark"] .th-c i { background: rgba(255,255,255,.1); }
.av-search { display: flex; gap: 8px; align-items: center; height: 38px; padding: 0 12px; border-radius: 11px; background: #f2f2f7; font-size: 14px; }
.av-search i { color: var(--ink-3); } .av-caret { width: 1.5px; height: 16px; background: var(--blue); animation: avBlink 1s steps(1) infinite; }
@keyframes avBlink { 50% { opacity: 0; } }
.av-rows { display: flex; flex-direction: column; border-radius: 13px; overflow: hidden; box-shadow: 0 0 0 0.5px var(--hair); }
.av-rows > div { display: grid; grid-template-columns: 28px 1fr auto; gap: 10px; align-items: center; padding: 9px 12px; border-bottom: 0.5px solid var(--hair); font-size: 13.5px; }
.av-rows > div:last-child { border-bottom: 0; } .av-rows > div:first-child { background: rgba(255,214,10,.12); }
.av-rows b { display: block; font-weight: 600; } .av-rows small { font-size: 11.5px; color: var(--ink-3); }
.av-rows .sc, .av-leg i { width: 24px; height: 24px; border-radius: 7px; display: grid; place-items: center; font-size: 12px; }
.av-rows .sc.db { background: rgba(0,113,227,.12); color: #0060c4; } .av-rows .sc.pc { background: rgba(48,209,88,.15); color: #1d7a34; }
.av-rows .num { font-style: normal; font-size: 13px; font-weight: 600; padding: 3px 9px; border-radius: 7px; background: #f2f2f7; font-variant-numeric: tabular-nums; }
.av-rows .tg { width: 34px; height: 20px; border-radius: 10px; background: #30d158; position: relative; } .av-rows .tg::after { content: ""; position: absolute; right: 2px; top: 2px; width: 16px; height: 16px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.25); }
.av-leg { display: flex; gap: 14px; font-size: 12px; color: var(--ink-2); } .av-leg span { display: inline-flex; gap: 6px; align-items: center; } .av-leg i { width: 18px; height: 18px; border-radius: 5px; font-size: 10px; }
.av-leg span:first-child i { background: rgba(0,113,227,.12); color: #0060c4; } .av-leg span:last-child i { background: rgba(48,209,88,.15); color: #1d7a34; }
.so-cta { margin-top: 34px; display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }

/* ---------- mega menü ön izlemeleri ---------- */
.mp-tree { display: flex; flex-direction: column; gap: 4px; font-size: 12.5px; }
.mp-tree div { display: flex; gap: 7px; align-items: center; padding: 6px 8px; border-radius: 8px; background: rgba(255,255,255,.05); }
.mp-tree div i { color: #64d2ff; } .mp-tree .l1 { margin-left: 16px; } .mp-tree .l2 { margin-left: 32px; }
.mp-tree .db { background: linear-gradient(90deg, rgba(94,92,230,.35), rgba(10,132,255,.12)); } .mp-tree .db i { color: #c4b5fd; }
.mp-tree em { margin-left: auto; font-style: normal; color: #8e8e93; font-size: 11px; } .mp-tree .rms em { color: #30d158; }
.mp-mx { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.mp-mx span { display: flex; flex-direction: column; gap: 4px; padding: 8px; border-radius: 10px; background: color-mix(in srgb, var(--k) 20%, #1c1c21); border: 0.5px solid color-mix(in srgb, var(--k) 45%, transparent); font-size: 11.5px; font-weight: 600; }
.mp-mx span small { font-size: 10px; color: #a1a1a6; font-weight: 500; } .mp-mx span i { display: block; height: 3px; border-radius: 2px; background: var(--k); width: var(--w); }

/* ---------- duyarlı ---------- */
@media (max-width: 1000px) {
  .ldb-stage { grid-template-columns: 1fr; } .ldb-explorer { grid-row: auto; }
  .ldb-feats, .mx-cases { grid-template-columns: 1fr 1fr; }
  .ldb-lic { grid-template-columns: 1fr; }
  .so-bento { grid-template-columns: 1fr; } .so-tool { grid-row: auto; }
  .mx-board[data-l="cols"] { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px) {
  .lx-body { grid-template-columns: 1fr; } .lx-side { display: none; } .lx-row.l2 { margin-left: 30px; } .lx-row.l1 { margin-left: 14px; }
  .ldb-feats, .mx-cases { grid-template-columns: 1fr; }
  .mx-board, .mx-board[data-l="cols"] { grid-template-columns: 1fr; } .mx-board[data-l="rows"] .mx-tile { grid-template-columns: 1fr; }
  .ll-graph { grid-template-columns: 90px 60px 1fr; } .lg-folder > i { font-size: 38px; }
  .ldb-lic { padding: 22px; } .tl-menu { right: 10px; width: 220px; }
  .lx-flow { display: none; }
}
@media (prefers-reduced-motion: reduce) { .lx-flow span, .tl-menu, .tl-rows .sl, .pt-drag, .lx-cbar i, .lx-pulse { animation: none !important; } .tl-menu { opacity: 1; } }
.mm-new { font-style: normal; font-size: 9.5px; font-weight: 750; letter-spacing: .03em; padding: 1px 6px; border-radius: 6px; margin-left: 4px; color: #fff; background: linear-gradient(90deg, #8b5cf6, #0a84ff); vertical-align: 1px; }
.lw-next { white-space: nowrap; }
@media (max-width: 640px) { .lx-copy { grid-template-columns: 26px 1fr; } .lx-copy b { grid-column: 2; text-align: left; } .lw-foot { flex-wrap: wrap; } }
.tl-win { display: flex; flex-direction: column; }
.tl-rows .fl { background: rgba(142,142,147,.14); }
.tl-stat { margin-top: auto; padding-top: 10px; display: flex; gap: 6px; flex-wrap: wrap; }
.tl-stat span { font-size: 10.5px; letter-spacing: .04em; color: #8e8e93; padding: 4px 8px; border-radius: 7px; background: rgba(255,255,255,.06); }
.tl-stat b { color: #f2f2f5; margin-left: 4px; font-variant-numeric: tabular-nums; }

/* ---------- Yerel veritabanı: aydınlık premium sürüm ---------- */
.nav-new { gap: 6px !important; } .nav-new em { font-style: normal; font-size: 10px; font-weight: 750; padding: 2px 6px; border-radius: 6px; color: #fff; background: linear-gradient(90deg, #8b5cf6, #0a84ff); }
.ldb-sec { background:
    radial-gradient(900px 520px at 12% 8%, rgba(167,139,250,.22), transparent 62%),
    radial-gradient(800px 480px at 92% 18%, rgba(100,210,255,.22), transparent 62%),
    radial-gradient(900px 500px at 50% 105%, rgba(48,209,88,.12), transparent 60%),
    linear-gradient(180deg, #fbfbfd, #f5f4ff 60%, #fbfbfd);
  color: var(--ink); }
.ldb-sec::before { content: ""; position: absolute; inset: 0; pointer-events: none; background-image: linear-gradient(rgba(94,92,230,.05) 1px, transparent 1px), linear-gradient(90deg, rgba(94,92,230,.05) 1px, transparent 1px); background-size: 44px 44px; mask-image: radial-gradient(ellipse at 50% 30%, #000 30%, transparent 75%); -webkit-mask-image: radial-gradient(ellipse at 50% 30%, #000 30%, transparent 75%); }
.ldb-aura { display: none; }
.ldb-sec .lead { color: var(--ink-2); } .ldb-sec .lead b { color: var(--ink); }
.ldb-grad { background: linear-gradient(92deg, #7c3aed, #0a84ff 55%, #14b866); -webkit-background-clip: text; background-clip: text; }
/* dosya gezgini */
.ldb-explorer { background: rgba(255,255,255,.78); border: 0.5px solid rgba(0,0,0,.08); box-shadow: 0 50px 100px -40px rgba(60,50,140,.35), 0 0 0 6px rgba(255,255,255,.7); backdrop-filter: blur(30px) saturate(180%); }
.ldb-explorer .lx-bar { background: rgba(246,246,250,.9); border-bottom-color: rgba(0,0,0,.07); } .ldb-explorer .lx-bar em { color: #6e6e73; }
.lx-side { border-right-color: rgba(0,0,0,.06); color: #3a3a3c; background: rgba(242,242,247,.55); }
.lx-side small { color: #8e8e93; } .lx-side span.on { background: rgba(10,132,255,.12); color: #0060c4; } .lx-side i { color: #0a84ff; }
.lx-row em { color: #8e8e93; } .lx-row > i { color: #0a84ff; }
.lx-row.root { background: rgba(0,0,0,.035); }
.lx-row.db { background: linear-gradient(90deg, rgba(139,92,246,.14), rgba(10,132,255,.07)); box-shadow: inset 0 0 0 0.5px rgba(139,92,246,.35), 0 10px 24px -16px rgba(94,92,230,.6); }
.lx-row.db em { color: #5b3fd6; font-weight: 600; }
.lx-row.rms { background: rgba(48,209,88,.09); box-shadow: inset 0 0 0 0.5px rgba(48,209,88,.35); } .lx-row.rms em { color: #1d8a3a; font-weight: 600; }
.lx-pulse { border-color: rgba(139,92,246,.55); }
.lx-flow span { background: #fff; border: 0.5px solid rgba(0,0,0,.08); color: var(--ink); box-shadow: 0 12px 26px -12px rgba(30,30,80,.35); }
.lx-copy { background: rgba(255,255,255,.7); border-color: rgba(94,92,230,.3); color: #3a3a3c; } .lx-copy b { color: var(--ink); } .lx-copy > i { color: #7c3aed; }
.lx-cbar { background: rgba(0,0,0,.06); } .lx-cbar i { background: linear-gradient(90deg, #8b5cf6, #0a84ff); }
/* not defteri */
.ldb-note { box-shadow: 0 40px 80px -40px rgba(30,30,80,.45), 0 0 0 0.5px rgba(0,0,0,.08); }
/* sihirbaz */
.ldb-wiz { background: rgba(255,255,255,.85); border: 0.5px solid rgba(0,0,0,.08); box-shadow: 0 40px 80px -40px rgba(30,30,80,.4); backdrop-filter: blur(24px); }
.lw-steps span { background: #f2f2f7; color: #8e8e93; } .lw-steps i { background: rgba(0,0,0,.1); }
.lw-pick { background: #f2f2f7; border-color: rgba(0,0,0,.06); color: var(--ink); }
.lw-list { box-shadow: 0 0 0 0.5px rgba(0,0,0,.07); } .lw-list li { background: #fafafc; opacity: .35; } .lw-list li.ok { opacity: 1; background: #fff; }
.lw-list li > i { color: #c7c7cc; } .lw-list small { color: #8e8e93; }
.lw-next { background: rgba(10,132,255,.14); color: rgba(0,96,196,.45); }
/* özellik kartları */
.ldb-feats > div { background: rgba(255,255,255,.82); border: 0; box-shadow: 0 0 0 0.5px rgba(0,0,0,.07), 0 20px 40px -30px rgba(30,30,80,.35); transition: transform .3s var(--ease), box-shadow .3s; }
.ldb-feats > div:hover { transform: translateY(-3px); box-shadow: 0 0 0 0.5px rgba(0,0,0,.07), 0 30px 50px -30px rgba(30,30,80,.45); }
.lf-i { background: color-mix(in srgb, var(--c) 14%, #fff); }
.ldb-feats small { color: var(--ink-2); }
/* lisans paneli */
.ldb-lic { background: linear-gradient(135deg, #ffffff, #f4f1ff 55%, #eef7ff); border: 0; box-shadow: 0 0 0 0.5px rgba(94,92,230,.18), 0 40px 80px -50px rgba(60,50,140,.45); }
.ldb-lic p { color: var(--ink-2); } .ldb-lic p b { color: var(--ink); }
.lg-folder > i { color: #0a84ff; } .lg-folder small { color: #8e8e93; }
.lg-lics > span { background: #fff; border: 0.5px solid rgba(48,209,88,.35); box-shadow: 0 12px 24px -18px rgba(20,120,60,.5); }
.lg-lics small { color: #8e8e93; } .lg-lics > span.no { background: #fff; }
/* ---------- Yeni bilgisayarda yayında (taşıma) ---------- */
.ldb-move { border-radius: 18px; background: rgba(255,255,255,.88); border: 0.5px solid rgba(0,0,0,.08); box-shadow: 0 40px 80px -40px rgba(30,30,80,.4); padding: 16px; backdrop-filter: blur(24px); display: flex; flex-direction: column; gap: 14px; }
.mv-h b { display: block; font-size: 14px; } .mv-h small { font-size: 12px; color: var(--ink-3); }
.mv-steps { display: grid; grid-template-columns: 1fr 34px 1fr 34px 1fr; align-items: start; }
.mv-s { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 3px; opacity: .45; transition: opacity .4s; }
.mv-s span { width: 44px; height: 44px; border-radius: 13px; display: grid; place-items: center; font-size: 22px; background: #f2f2f7; color: #8e8e93; transition: background .4s, color .4s, box-shadow .4s, transform .4s; }
.mv-s b { font-size: 12.5px; } .mv-s small { font-size: 11px; color: var(--ink-3); }
.mv-s.on { opacity: 1; } .mv-s.on span { color: #fff; transform: translateY(-2px); }
.mv-s[data-s="0"].on span { background: linear-gradient(140deg, #8b5cf6, #5e5ce6); box-shadow: 0 10px 22px -10px rgba(94,92,230,.8); }
.mv-s[data-s="1"].on span { background: linear-gradient(140deg, #0a84ff, #32ade6); box-shadow: 0 10px 22px -10px rgba(10,132,255,.8); }
.mv-s[data-s="2"].on span { background: linear-gradient(140deg, #30d158, #14b866); box-shadow: 0 10px 22px -10px rgba(48,209,88,.8); }
.mv-ln { display: block; height: 3px; margin-top: 21px; border-radius: 2px; background: #ececf2; overflow: hidden; }
.mv-ln i { display: block; height: 100%; width: 0; background: linear-gradient(90deg, #8b5cf6, #0a84ff); transition: width .8s var(--ease); }
.mv-ln.on i { width: 100%; }
.mv-play { display: grid; grid-template-columns: 40px 1fr auto; gap: 12px; align-items: center; padding: 10px 12px; border-radius: 13px; background: linear-gradient(100deg, rgba(48,209,88,.12), rgba(10,132,255,.06)); box-shadow: inset 0 0 0 0.5px rgba(48,209,88,.3); opacity: .4; transition: opacity .5s; }
.ldb-move.live .mv-play { opacity: 1; }
.mv-cd { width: 40px; height: 40px; border-radius: 11px; display: grid; place-items: center; color: #fff; font-weight: 800; background: #ff375f; box-shadow: 0 8px 18px -8px rgba(255,55,95,.8); }
.mv-meta b { display: block; font-size: 13.5px; } .mv-meta small { font-size: 11.5px; color: #1d7a34; display: inline-flex; gap: 4px; align-items: center; font-weight: 600; }
.mv-bar { height: 4px; border-radius: 2px; background: rgba(0,0,0,.07); margin-top: 6px; overflow: hidden; } .mv-bar i { display: block; height: 100%; width: 0; background: #30d158; border-radius: 2px; transition: width 1s linear; }
.mv-eq { display: inline-flex; gap: 2px; align-items: flex-end; height: 18px; } .mv-eq i { width: 3px; height: 30%; border-radius: 2px; background: #30d158; }
.ldb-move.live .mv-eq i { animation: rxeq .9s ease-in-out infinite; } .mv-eq i:nth-child(2) { animation-delay: -.3s !important; } .mv-eq i:nth-child(3) { animation-delay: -.6s !important; } .mv-eq i:nth-child(4) { animation-delay: -.15s !important; } .mv-eq i:nth-child(5) { animation-delay: -.45s !important; }
.mv-foot { display: flex; gap: 12px; flex-wrap: wrap; font-size: 11.5px; color: var(--ink-2); } .mv-foot span { display: inline-flex; gap: 5px; align-items: center; } .mv-foot i { color: #8b5cf6; } .mv-foot b { color: var(--ink); }
@media (max-width: 640px) { .mv-steps { grid-template-columns: 1fr 14px 1fr 14px 1fr; } .mv-s small { display: none; } }
.th-desk[data-th="prism"] { background: radial-gradient(220px 140px at 10% 10%, rgba(139,92,246,.22), transparent 70%), radial-gradient(240px 150px at 95% 20%, rgba(50,173,230,.24), transparent 70%), radial-gradient(240px 150px at 80% 100%, rgba(255,149,0,.16), transparent 70%), #fbfbfd; }
.th-desk[data-th="prism"] .th-w { background: #fff; border-color: rgba(20,20,60,.08); }
.th-desk[data-th="prism"] .w1 .th-b { background: linear-gradient(90deg, #dbeafe, #ede9fe); color: #0060c4; box-shadow: inset 0 2px 0 #0a84ff; }
.th-desk[data-th="prism"] .w2 .th-b { background: linear-gradient(90deg, #ffedd5, #ffe4e6); color: #b25a00; box-shadow: inset 0 2px 0 #ff9500; }
.th-desk[data-th="prism"] .w3 .th-b { background: linear-gradient(90deg, #dcfce7, #e0f2fe); color: #1d7a34; box-shadow: inset 0 2px 0 #28b446; }
.th-desk[data-th="prism"] .th-c i { background: #eef0f6; }

/* ---------- Yeniden İletim Modülü ---------- */
.rt-sec { background:
    radial-gradient(800px 460px at 50% 0%, rgba(255,106,0,.12), transparent 65%),
    radial-gradient(700px 420px at 0% 60%, rgba(255,45,85,.07), transparent 60%),
    radial-gradient(700px 420px at 100% 70%, rgba(10,132,255,.08), transparent 60%), #fbfbfd; overflow: hidden; }
.rt-head h2 { max-width: none; font-size: clamp(38px, 5.4vw, 66px); }
.rt-head .lead { max-width: 62ch; } .rt-head .lead b { color: var(--ink); }
.rt-grad { background: linear-gradient(92deg, #ff6a00, #ff2d55 55%, #af52de); -webkit-background-clip: text; background-clip: text; color: transparent; }
.rt-badge { display: inline-flex; gap: 7px; align-items: center; padding: 7px 14px; border-radius: 999px; font-size: 13px; font-weight: 700; color: #b23a00; background: linear-gradient(90deg, rgba(255,149,0,.16), rgba(255,45,85,.12)); box-shadow: inset 0 0 0 0.5px rgba(255,106,0,.35); margin-bottom: 16px; }
.rt-badge i { color: #ff6a00; font-size: 16px; }
.rt-head .kicker { display: flex; justify-content: center; }
/* harita */
.rt-map { position: relative; height: 440px; margin: 46px 0 40px; }
.rt-lines { position: absolute; inset: 0; width: 100%; height: 100%; }
.rt-lines path { fill: none; stroke: url(#rtg); stroke-width: 2; stroke-dasharray: 6 9; opacity: .55; animation: rtDash 1.2s linear infinite; }
@keyframes rtDash { to { stroke-dashoffset: -30; } }
.rt-hub { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 220px; padding: 22px 18px 18px; border-radius: 26px; background: rgba(255,255,255,.92); text-align: center; box-shadow: 0 0 0 0.5px rgba(0,0,0,.06), 0 40px 80px -30px rgba(255,80,40,.45); display: flex; flex-direction: column; align-items: center; gap: 4px; z-index: 2; }
.rt-hub-ic { width: 60px; height: 60px; border-radius: 18px; display: grid; place-items: center; font-size: 30px; color: #fff; background: linear-gradient(140deg, #ff9500, #ff2d55); box-shadow: 0 16px 30px -12px rgba(255,45,85,.7); margin-bottom: 6px; position: relative; }
.rt-hub-ic::after { content: ""; position: absolute; inset: -8px; border-radius: 24px; border: 2px solid rgba(255,106,0,.45); animation: lxPulse 2.4s ease-out infinite; }
.rt-hub b { font-size: 17px; } .rt-hub small { font-size: 12.5px; color: var(--ink-2); }
.rt-onair { margin-top: 8px; display: inline-flex; gap: 6px; align-items: center; font-size: 10.5px; font-weight: 800; letter-spacing: .08em; color: #fff; background: #ff3b30; padding: 4px 10px; border-radius: 7px; } .rt-onair i { width: 6px; height: 6px; border-radius: 50%; background: #fff; animation: avBlink 1s steps(1) infinite; }
.rt-city { position: absolute; width: 250px; padding: 12px 14px; border-radius: 18px; background: rgba(255,255,255,.94); box-shadow: 0 0 0 0.5px rgba(0,0,0,.06), 0 24px 50px -30px color-mix(in srgb, var(--k) 70%, rgba(0,0,0,.4)); display: flex; flex-direction: column; gap: 8px; transform: translateY(-50%); transition: transform .4s var(--ease), box-shadow .4s; z-index: 2; }
.rt-city.l1, .rt-city.l2, .rt-city.l3 { left: 0; } .rt-city.r1, .rt-city.r2, .rt-city.r3 { right: 0; }
.rt-city.l1, .rt-city.r1 { top: 16.7%; } .rt-city.l2, .rt-city.r2 { top: 50%; } .rt-city.l3, .rt-city.r3 { top: 83.3%; }
.rt-city.say { box-shadow: 0 0 0 2px var(--k), 0 30px 60px -26px var(--k); transform: translateY(-50%) scale(1.04); }
.rc-top { display: flex; align-items: center; gap: 8px; } .rc-top b { font-size: 15px; }
.rc-dot { width: 10px; height: 10px; border-radius: 50%; background: var(--k); box-shadow: 0 0 0 4px color-mix(in srgb, var(--k) 20%, transparent); }
.rc-eq { margin-left: auto; display: inline-flex; gap: 2px; align-items: flex-end; height: 14px; } .rc-eq i { width: 3px; height: 40%; border-radius: 2px; background: var(--k); animation: rxeq .9s ease-in-out infinite; } .rc-eq i:nth-child(2) { animation-delay: -.3s; } .rc-eq i:nth-child(3) { animation-delay: -.6s; }
.rc-id { display: flex; gap: 7px; align-items: center; font-size: 12px; font-weight: 600; padding: 7px 9px; border-radius: 10px; background: color-mix(in srgb, var(--k) 10%, #fff); color: color-mix(in srgb, var(--k) 75%, #1d1d1f); }
.rc-id i { font-size: 14px; color: var(--k); }
.rt-city.say .rc-id { background: var(--k); color: #fff; } .rt-city.say .rc-id i { color: #fff; }
.rc-outs { display: flex; gap: 5px; } .rc-outs span { width: 30px; height: 26px; border-radius: 8px; display: grid; place-items: center; background: #f2f2f7; color: #5f5f6e; font-size: 14px; } .rc-outs .rec { color: #ff3b30; } .rc-outs .rec i { animation: avBlink 1.2s steps(1) infinite; }
.rt-more { position: absolute; left: 50%; bottom: 0; transform: translateX(-50%); display: inline-flex; gap: 6px; align-items: center; font-size: 13px; font-weight: 700; color: #b23a00; padding: 7px 14px; border-radius: 999px; background: #fff; box-shadow: 0 0 0 0.5px rgba(255,106,0,.35), 0 12px 24px -16px rgba(255,80,40,.6); }
/* konsol */
.rt-console { border-radius: 28px; padding: 16px; background: rgba(255,255,255,.85); box-shadow: 0 0 0 0.5px rgba(0,0,0,.06), 0 60px 120px -60px rgba(60,30,20,.45); }
.rt-chead { display: flex; align-items: center; gap: 14px; padding: 2px 4px 14px; flex-wrap: wrap; }
.rt-ctitle { display: flex; gap: 10px; align-items: center; } .rt-ctitle b { display: block; font-size: 14.5px; } .rt-ctitle small { font-size: 12px; color: var(--ink-3); }
.rt-capp { width: 36px; height: 36px; border-radius: 11px; display: grid; place-items: center; color: #fff; font-size: 18px; background: linear-gradient(140deg, #ff9500, #ff2d55); }
.rt-pills { display: flex; gap: 5px; flex: 1; min-width: 0; overflow: hidden; }
.rt-pills span { display: inline-flex; align-items: center; gap: 6px; height: 26px; padding: 0 10px; border-radius: 999px; font-size: 12px; font-weight: 600; background: #f2f2f7; color: var(--ink-2); white-space: nowrap; }
.rt-pills span::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--k); }
.rt-pills span.on { background: color-mix(in srgb, var(--k) 12%, #fff); color: var(--ink); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--k) 40%, transparent); }
.rt-pg { display: inline-flex; gap: 8px; align-items: center; font-size: 12.5px; color: var(--ink-2); padding: 5px 10px; border-radius: 10px; background: #f2f2f7; white-space: nowrap; } .rt-pg b { color: var(--ink); }
.rt-console .mx-board { margin: 0; box-shadow: none; }
.mt-rec { display: inline-flex; gap: 4px; align-items: center; font-size: 9.5px; font-weight: 800; letter-spacing: .05em; color: #ff6961; } .mt-rec i { width: 6px; height: 6px; border-radius: 50%; background: #ff3b30; animation: avBlink 1.2s steps(1) infinite; }
.mt-q span.id { color: #fff; background: color-mix(in srgb, var(--k) 35%, transparent); font-weight: 600; }
.rt-cfoot { display: flex; gap: 16px; align-items: center; flex-wrap: wrap; padding: 14px 4px 2px; font-size: 13px; color: var(--ink-2); } .rt-cfoot span { display: inline-flex; gap: 6px; align-items: center; } .rt-cfoot i { color: #ff6a00; } .rt-cfoot .mx-seg { margin-left: auto; }
/* yetenekler */
.rt-caps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-top: 34px; }
.rt-caps > div { padding: 20px; border-radius: 20px; background: #fff; box-shadow: 0 0 0 0.5px rgba(0,0,0,.06), 0 20px 40px -30px rgba(60,30,20,.35); display: flex; flex-direction: column; gap: 6px; transition: transform .3s var(--ease); }
.rt-caps > div:hover { transform: translateY(-3px); }
.rc-i { width: 42px; height: 42px; border-radius: 13px; display: grid; place-items: center; font-size: 22px; color: var(--c); background: color-mix(in srgb, var(--c) 12%, #fff); margin-bottom: 4px; }
.rt-caps b { font-size: 15px; line-height: 1.3; } .rt-caps small { font-size: 13.5px; color: var(--ink-2); line-height: 1.5; }
.rt-cta { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; margin-top: 38px; }
@media (max-width: 1000px) {
  .rt-caps { grid-template-columns: 1fr 1fr; }
  .rt-map { height: auto; display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
  .rt-lines, .rt-more { display: none; }
  .rt-hub { position: relative; left: auto; top: auto; transform: none; grid-column: 1 / -1; width: auto; }
  .rt-city { position: relative; left: auto !important; right: auto !important; top: auto !important; transform: none; width: auto; }
  .rt-city.say { transform: scale(1.02); }
}
@media (max-width: 640px) { .rt-caps, .rt-map { grid-template-columns: 1fr; } .rt-pills { display: none; } .rt-cfoot .mx-seg { margin-left: 0; } }
/* iç sayfalar: hero üstte ve kısa; canlı bölüm hemen ardından */
.pg-hero { padding: 56px 0 44px; }
.pg-hero h1 { font-size: clamp(34px, 4.8vw, 58px); }
.pg-hero + .sec, .pg-hero + section { padding-top: 56px; }
.pg-show-h { text-align: center; font-size: 13px; font-weight: 700; color: var(--ink-3); letter-spacing: .04em; text-transform: uppercase; margin: 0 0 -20px; padding-top: 30px; }
@media (max-width: 620px) { .pg-hero { padding: 36px 0 34px; } }

.mp-rtp { display: flex; align-items: center; justify-content: space-between; margin-top: 10px; padding: 6px 8px; border-radius: 10px; background: rgba(255,255,255,0.06); font-size: 11px; color: #d1d1d6; }
.mp-rtp span { width: 20px; height: 20px; border-radius: 6px; display: grid; place-items: center; background: rgba(255,255,255,0.08); font-size: 10px; }
.mp-rto { display: grid; gap: 6px; margin-top: 10px; }
.mp-rto div { display: grid; grid-template-columns: 26px 1fr; column-gap: 8px; align-items: center; padding: 7px 8px; border-radius: 10px; background: rgba(255,255,255,0.04); border: 0.5px solid rgba(255,255,255,0.08); }
.mp-rto em { grid-row: span 2; font-style: normal; line-height: 1; width: 26px; height: 26px; border-radius: 8px; display: grid; place-items: center; font-size: 15px; color: var(--k); background: color-mix(in srgb, var(--k) 18%, transparent); }
.mp-rto em i { position: static; font-size: 15px; }
.mp-rto b { font-size: 11.5px; font-weight: 600; color: #f5f5f7; } .mp-rto small { font-size: 10px; color: #a1a1a6; }


/* ---------- iletişim: premium radyo girişi kartı ---------- */
.contact-card.cc-login { display: block; position: relative; overflow: hidden; color: #fff; border: 0; background: radial-gradient(120% 140% at 100% 0%, #2f8cff 0%, #1d4ed8 38%, #111827 100%); box-shadow: 0 22px 46px -24px rgba(29,78,216,.75); transition: transform .25s ease, box-shadow .25s ease; }
.contact-card.cc-login::after { content: ''; position: absolute; inset: 0; background: linear-gradient(115deg, transparent 30%, rgba(255,255,255,.14) 50%, transparent 70%); transform: translateX(-100%); transition: transform .8s ease; }
.contact-card.cc-login:hover { transform: translateY(-3px); box-shadow: 0 28px 56px -24px rgba(29,78,216,.9); }
.contact-card.cc-login:hover::after { transform: translateX(100%); }
.contact-card.cc-login .cc-ic { width: 44px; height: 44px; border-radius: 14px; display: grid; place-items: center; background: rgba(255,255,255,.16); border: 0.5px solid rgba(255,255,255,.28); backdrop-filter: blur(8px); }
.cc-login .cc-ic i { font-size: 22px; color: #fff; }
.contact-card.cc-login b { color: #fff; }
.contact-card.cc-login span { color: rgba(255,255,255,.78); font-size: 13.5px; display: block; }
.cc-login em { display: inline-flex; align-items: center; gap: 6px; margin-top: 14px; padding: 8px 14px; border-radius: 999px; background: #fff; color: #0b1f4d; font-weight: 600; font-size: 13.5px; line-height: 1; font-style: normal; }
.cc-login em i { font-size: 13px; color: inherit; transition: transform .2s; }
.cc-login:hover em i { transform: translateX(3px); }

/* ---------- canlı mesaj (ekip yazınca açılır) ---------- */
.rmc { position: fixed; right: 20px; bottom: 20px; z-index: 90; display: none; font-family: inherit; }
.rmc.has { display: block; }
.rmc-fab { width: 58px; height: 58px; border-radius: 20px; border: 0; cursor: pointer; display: grid; place-items: center; position: relative; color: #fff;
  background: linear-gradient(145deg, #2f8cff, #5e5ce6); box-shadow: 0 16px 34px -14px rgba(47,140,255,.85), inset 0 1px 0 rgba(255,255,255,.35); transition: transform .2s; }
.rmc-fab:hover { transform: translateY(-2px) scale(1.03); }
.rmc-fab i { font-size: 28px; }
.rmc.on .rmc-fab { display: none; }
.rmc-n { position: absolute; top: -5px; right: -5px; min-width: 22px; height: 22px; padding: 0 6px; border-radius: 11px; background: #ff3b30; color: #fff; font-weight: 700; font-size: 12px; line-height: 22px; box-shadow: 0 0 0 3px #fbfbfd; }
.rmc-card { width: min(370px, calc(100vw - 32px)); max-height: min(560px, calc(100vh - 40px)); display: flex; flex-direction: column; border-radius: 26px; overflow: hidden;
  background: rgba(255,255,255,.86); backdrop-filter: saturate(180%) blur(24px); -webkit-backdrop-filter: saturate(180%) blur(24px); border: 0.5px solid var(--hair-2);
  box-shadow: 0 40px 80px -30px rgba(0,0,0,.35), 0 12px 24px -16px rgba(0,0,0,.2); animation: rmcIn .35s cubic-bezier(.2,.9,.3,1.2); }
.rmc-card[hidden] { display: none; }
@keyframes rmcIn { from { opacity: 0; transform: translateY(16px) scale(.96); } to { opacity: 1; transform: none; } }
.rmc-card header { display: flex; align-items: center; gap: 12px; padding: 16px 16px 14px; border-bottom: 0.5px solid var(--hair); }
.rmc-av { width: 42px; height: 42px; border-radius: 14px; display: grid; place-items: center; color: #fff; background: linear-gradient(145deg, #2f8cff, #5e5ce6); flex: none; }
.rmc-av i { font-size: 21px; }
.rmc-card header div { flex: 1; min-width: 0; }
.rmc-card header b { display: block; font-size: 15px; color: var(--ink); }
.rmc-card header small { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--ink-2); }
.rmc-dot { width: 7px; height: 7px; border-radius: 50%; background: #30d158; box-shadow: 0 0 0 3px rgba(48,209,88,.2); }
.rmc-x { width: 32px; height: 32px; border-radius: 10px; border: 0; background: rgba(0,0,0,.05); cursor: pointer; display: grid; place-items: center; color: var(--ink-2); }
.rmc-x i { font-size: 16px; }
.rmc-list { flex: 1; overflow-y: auto; padding: 14px; display: flex; flex-direction: column; gap: 8px; min-height: 140px; }
.rmc-m { max-width: 82%; align-self: flex-start; }
.rmc-m p { margin: 0; padding: 10px 13px; border-radius: 18px 18px 18px 6px; background: #f1f2f6; color: var(--ink); font-size: 14px; line-height: 1.45; word-wrap: break-word; }
.rmc-m small { display: block; font-size: 10.5px; color: var(--ink-3, #86868b); margin: 3px 6px 0; }
.rmc-m.me { align-self: flex-end; text-align: right; }
.rmc-m.me p { background: linear-gradient(145deg, #2f8cff, #0071e3); color: #fff; border-radius: 18px 18px 6px 18px; text-align: left; }
.rmc-m.p { opacity: .6; }
.rmc-f { display: flex; align-items: flex-end; gap: 8px; padding: 10px 12px; border-top: 0.5px solid var(--hair); }
.rmc-f textarea { flex: 1; resize: none; border: 0.5px solid var(--hair-2); border-radius: 16px; padding: 10px 13px; font-family: inherit; font-size: 14px; line-height: 1.4; background: #fff; outline: none; max-height: 120px; }
.rmc-f textarea:focus { border-color: var(--blue); box-shadow: 0 0 0 3px rgba(0,113,227,.15); }
.rmc-f button { width: 40px; height: 40px; border-radius: 13px; border: 0; cursor: pointer; background: var(--blue); color: #fff; display: grid; place-items: center; flex: none; }
.rmc-f button i { font-size: 18px; }
.rmc-legal { margin: 0; padding: 0 14px 10px; font-size: 11px; color: var(--ink-3, #86868b); }
.rmc-legal a { color: inherit; text-decoration: underline; }
@media (max-width: 560px) { .rmc { right: 12px; bottom: 12px; } }

.rmc.off { display: none !important; }
.rmc-m.note p b { display: block; margin-bottom: 3px; }
.rmc-m p a { display: inline-flex; align-items: center; gap: 4px; margin-top: 6px; font-weight: 600; font-size: 13px; }

/* ---------- bildirim (ekibin gönderdiği duyuru) ---------- */
.rmn { position: fixed; left: 50%; bottom: 24px; z-index: 95; width: min(460px, calc(100vw - 24px)); transform: translate(-50%, 30px) scale(.97); opacity: 0; transition: transform .45s cubic-bezier(.2,.9,.3,1.15), opacity .3s; pointer-events: none; }
.rmn.in { transform: translate(-50%, 0) scale(1); opacity: 1; pointer-events: auto; }
.rmn-card { position: relative; display: flex; gap: 14px; padding: 18px 18px 16px; border-radius: 24px; background: rgba(22,23,27,.92); color: #fff; backdrop-filter: saturate(180%) blur(24px); -webkit-backdrop-filter: saturate(180%) blur(24px);
  border: 0.5px solid rgba(255,255,255,.14); box-shadow: 0 40px 80px -28px rgba(0,0,0,.55), 0 0 0 1px rgba(0,0,0,.04); overflow: hidden; }
.rmn-card::before { content: ''; position: absolute; inset: -40% -10% auto auto; width: 260px; height: 260px; background: radial-gradient(closest-side, rgba(47,140,255,.45), transparent); pointer-events: none; }
.rmn-ic { width: 46px; height: 46px; border-radius: 15px; flex: none; display: grid; place-items: center; background: linear-gradient(145deg, #2f8cff, #5e5ce6); box-shadow: 0 10px 22px -10px rgba(47,140,255,.9), inset 0 1px 0 rgba(255,255,255,.3); position: relative; }
.rmn-ic i { font-size: 22px; }
.rmn-b { position: relative; min-width: 0; flex: 1; padding-right: 22px; }
.rmn-b small { display: block; font-size: 11.5px; color: rgba(255,255,255,.55); margin-bottom: 3px; }
.rmn-b b { display: block; font-size: 16px; letter-spacing: -0.01em; margin-bottom: 3px; }
.rmn-b p { margin: 0; font-size: 14px; line-height: 1.5; color: rgba(255,255,255,.86); }
.rmn-a { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 12px; }
.rmn-a:empty { display: none; }
.rmn-cta, .rmn-r { display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 0 14px; border-radius: 17px; font-size: 13.5px; font-weight: 600; cursor: pointer; border: 0; font-family: inherit; }
.rmn-cta { background: #fff; color: #0b1f4d; }
.rmn-cta i { font-size: 12px; }
.rmn-r { background: rgba(255,255,255,.12); color: #fff; }
.rmn-r i { font-size: 16px; }
.rmn-x { position: absolute; top: 10px; right: 10px; z-index: 1; width: 28px; height: 28px; border-radius: 50%; border: 0; background: rgba(255,255,255,.1); color: rgba(255,255,255,.8); cursor: pointer; display: grid; place-items: center; }
.rmn-x i { font-size: 14px; }
@media (max-width: 560px) { .rmn { bottom: 12px; } }

/* ---------- engel ekranı ve kısıtlama ---------- */
.rmg { position: fixed; inset: 0; z-index: 2147483000; display: grid; place-items: center; padding: 24px; background: radial-gradient(800px 500px at 50% -10%, rgba(255,59,48,.22), transparent 60%), radial-gradient(700px 500px at 100% 110%, rgba(94,92,230,.18), transparent 60%), rgba(11,12,16,.97); backdrop-filter: blur(20px); color: #f5f5f7; animation: rmcIn .4s ease; }
.rmg-c { max-width: 440px; width: 100%; text-align: center; padding: 36px 30px; border-radius: 28px; background: rgba(28,29,35,.72); border: 0.5px solid rgba(255,255,255,.12); box-shadow: 0 40px 90px -40px rgba(0,0,0,.8); }
.rmg-i { width: 64px; height: 64px; margin: 0 auto 18px; border-radius: 20px; display: grid; place-items: center; background: linear-gradient(150deg, #ff6961, #ff3b30); box-shadow: 0 16px 34px -14px rgba(255,59,48,.9), inset 0 1px 0 rgba(255,255,255,.35); }
.rmg-i i { font-size: 30px; color: #fff; }
.rmg h2 { font-size: 23px; letter-spacing: -0.02em; margin: 0 0 8px; color: #fff; }
.rmg p { margin: 0 0 6px; color: rgba(245,245,247,.72); }
.rmg-r { margin: 14px 0 4px; padding: 10px 14px; border-radius: 14px; background: rgba(255,255,255,.06); font-size: 14px; }
.rmg-u { font-size: 13px; color: rgba(245,245,247,.55) !important; }
.rmg a { color: #64a8ff; font-weight: 600; }
.rmg-b { margin-top: 22px; font-size: 12px; color: rgba(245,245,247,.4); letter-spacing: .04em; }
.rmg-note { display: flex; align-items: center; gap: 8px; margin-top: 12px; padding: 10px 14px; border-radius: 12px; background: rgba(255,59,48,.1); color: #c4291f; font-size: 13.5px; font-weight: 500; }
.rm-limited .rmc { display: none !important; }

/* =========================================================
   DAB+ sayfası (.dxp) — koyu, ışıyan vitrin; alıcı HTML ile çizilir
   ========================================================= */
.dx-badge { display: inline-flex; align-items: center; height: 24px; padding: 0 9px; border-radius: 7px; font: 800 12.5px/1 var(--display); letter-spacing: .01em; color: #fff;
  background: linear-gradient(135deg, #ff375f 0%, #ff6a3d 45%, #ff9f0a 75%, #ffd60a 100%); box-shadow: 0 6px 18px -6px rgba(255,55,95,.7), inset 0 0 0 0.5px rgba(255,255,255,.4); }
.dx-badge.lg { height: 40px; padding: 0 16px; border-radius: 12px; font-size: 20px; margin-bottom: 22px; }
.dx-grad { background: linear-gradient(100deg, #ff375f 0%, #ff8a3d 40%, #ffd60a 75%, #ff9f0a 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.dx-h2 { max-width: 20ch !important; text-wrap: balance; }
.dx-hero h1, .dx-home h2 { text-wrap: balance; }
@media (max-width: 400px) { .dx-hero h1 .dx-grad, .dx-home h2 .dx-grad { white-space: normal; } }
.center .dx-h2 { margin-left: auto !important; margin-right: auto !important; }
.dx-c { margin-left: auto; margin-right: auto; }
.dx-rv { opacity: 0; transform: translateY(26px); transition: opacity .9s var(--ease), transform .9s var(--ease); }
.dx-rv.in { opacity: 1; transform: none; }
.dx-cards .dx-rv:nth-child(2), .dx-outs4 .dx-rv:nth-child(2), .dx-ways .dx-rv:nth-child(2) { transition-delay: .1s; }
.dx-cards .dx-rv:nth-child(3), .dx-outs4 .dx-rv:nth-child(3) { transition-delay: .2s; }
.dx-outs4 .dx-rv:nth-child(4) { transition-delay: .3s; }

/* ---------- hero ---------- */
.dx-hero { position: relative; overflow: hidden; background: #05050a; color: #f5f5f7; padding: 64px 0 56px; isolation: isolate; }
.dx-aura { position: absolute; inset: 0; z-index: -1; pointer-events: none; }
.dx-aura i { position: absolute; border-radius: 50%; animation: dxDrift 18s ease-in-out infinite alternate; }
.dx-aura i:nth-child(1) { width: 900px; height: 900px; left: -380px; top: -440px; background: radial-gradient(closest-side, rgba(255,55,95,.42), rgba(255,55,95,.12) 55%, transparent); }
.dx-aura i:nth-child(2) { width: 800px; height: 800px; right: -340px; top: -100px; background: radial-gradient(closest-side, rgba(94,92,230,.36), rgba(94,92,230,.1) 55%, transparent); animation-delay: -6s; }
.dx-aura i:nth-child(3) { width: 700px; height: 700px; left: 30%; bottom: -460px; background: radial-gradient(closest-side, rgba(255,159,10,.28), rgba(255,159,10,.08) 55%, transparent); animation-delay: -11s; }
@keyframes dxDrift { to { transform: translate(60px, 40px) scale(1.12); } }
.dx-rings { position: absolute; right: 8%; top: 46%; width: 0; height: 0; z-index: -1; pointer-events: none; }
.dx-rings i { position: absolute; left: 50%; top: 50%; width: 300px; height: 300px; margin: -150px 0 0 -150px; border-radius: 50%; border: 1px solid rgba(255,159,10,.35); animation: dxRing 6s linear infinite; opacity: 0; }
.dx-rings i:nth-child(2) { animation-delay: 1.5s; } .dx-rings i:nth-child(3) { animation-delay: 3s; } .dx-rings i:nth-child(4) { animation-delay: 4.5s; }
@keyframes dxRing { 0% { transform: scale(.6); opacity: 0; } 15% { opacity: .7; } 100% { transform: scale(3.4); opacity: 0; } }
.dx-crumbs { color: rgba(255,255,255,.45); } .dx-crumbs a { color: rgba(255,255,255,.7); }
.dx-hero-g { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: 40px; align-items: center; }
.dx-pill { display: inline-flex; align-items: center; gap: 10px; padding: 5px 14px 5px 5px; border-radius: 30px; background: rgba(255,255,255,.07); box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.16); font-size: 14px; font-weight: 600; color: #e5e5ea; margin-bottom: 22px; }
.dx-hero h1 { font: 800 clamp(36px, 4.3vw, 58px)/1.04 var(--display); letter-spacing: -0.05em; margin: 0 0 22px; text-wrap: balance; }
.dx-lead { font-size: clamp(17px, 1.6vw, 20px); color: #a1a1a6; max-width: 54ch; margin: 0 0 32px; line-height: 1.55; }
.dx-hero .ctas { display: flex; gap: 12px; flex-wrap: wrap; }
.dx-hero-v { position: relative; padding: 40px 10px; }
.dx-float { position: absolute; display: flex; gap: 10px; align-items: center; padding: 10px 14px 10px 10px; border-radius: 16px; background: rgba(28,28,34,.72); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px);
  box-shadow: 0 20px 40px -20px rgba(0,0,0,.8), inset 0 0 0 0.5px rgba(255,255,255,.14); font-size: 13px; animation: dxFloat 7s ease-in-out infinite; }
.dx-float > i { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; font-size: 19px; background: rgba(255,159,10,.16); color: #ffb340; }
.dx-float b { display: block; color: #fff; font-size: 13.5px; } .dx-float small { color: #a1a1a6; font-size: 11.5px; }
.dx-float.f1 { right: 0; top: -34px; } .dx-float.f2 { right: 0; bottom: -2px; animation-delay: -2.4s; } .dx-float.f3 { left: 4%; bottom: -2px; animation-delay: -4.6s; }
.dx-float.f2 > i { background: rgba(255,55,95,.16); color: #ff6482; } .dx-float.f3 > i { background: rgba(191,90,242,.18); color: #d48cf5; }
@keyframes dxFloat { 50% { transform: translateY(-8px); } }
.dx-strip { list-style: none; margin: 46px 0 0; padding: 18px 0 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 18px; border-top: 0.5px solid rgba(255,255,255,.12); }
.dx-strip li { display: grid; gap: 3px; } .dx-strip b { font: 700 16px var(--display); color: #fff; letter-spacing: -0.01em; } .dx-strip span { font-size: 13px; color: #8e8e93; }

/* ---------- alıcı ---------- */
.dx-rx { position: relative; width: 100%; max-width: 660px; margin: 0 auto; }
.dx-rx-body { position: relative; display: grid; grid-template-columns: 17% 1fr 60px; gap: 18px; align-items: center; padding: 20px; border-radius: 30px;
  background: linear-gradient(165deg, #34353c 0%, #1b1b20 46%, #101013 100%);
  box-shadow: 0 60px 100px -40px rgba(0,0,0,.95), 0 0 0 0.5px rgba(255,255,255,.12) inset, 0 1px 0 rgba(255,255,255,.18) inset, 0 -2px 0 rgba(0,0,0,.6) inset; }
.dx-rx-body::after { content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; background: linear-gradient(120deg, rgba(255,255,255,.08), transparent 35%); }
.dx-grille { align-self: stretch; border-radius: 16px; background-color: #0d0d10; background-image: radial-gradient(circle at center, #2c2c33 1.4px, transparent 1.9px); background-size: 7px 7px; box-shadow: inset 0 2px 8px rgba(0,0,0,.8), inset 0 0 0 0.5px rgba(255,255,255,.05); min-height: 150px; }
.dx-scr { display: grid; grid-template-columns: 1.25fr 1fr; gap: 12px; padding: 10px; border-radius: 12px; background: #020203; box-shadow: inset 0 0 0 1px rgba(255,255,255,.07), inset 0 12px 30px rgba(0,0,0,.7), 0 0 30px -10px rgba(255,159,10,.25); min-width: 0; }
.dx-sls { position: relative; aspect-ratio: 4 / 3; align-self: start; border-radius: 5px; overflow: hidden; background: #0b0b0e; container-type: inline-size; }
.dx-side { display: flex; flex-direction: column; min-width: 0; color: #f2f2f7; font-variant-numeric: tabular-nums; }
.dx-top { display: flex; align-items: center; gap: 5px; font-size: 10px; color: rgba(255,255,255,.55); }
.dx-top i { color: #32d74b; font-size: 12px; } .dx-top b { color: #ffd60a; font-weight: 800; letter-spacing: .04em; } .dx-top span { margin-left: auto; }
.dx-lbl { margin-top: 8px; font: 800 clamp(13px, 1.6vw, 17px)/1.15 var(--display); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dx-pty { font-size: 10.5px; color: rgba(255,255,255,.45); margin-top: 1px; }
.dx-tags { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 8px; min-height: 18px; }
.dx-tags span { display: inline-flex; align-items: center; gap: 4px; max-width: 100%; font-size: 9.5px; color: #ffe8b0; padding: 1px 6px 1px 2px; border-radius: 9px; background: rgba(255,159,10,.14); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; animation: dxTag .5s var(--ease) both; }
.dx-tags span:nth-child(2) { animation-delay: .12s; }
.dx-tags small { font-size: 8px; font-weight: 800; padding: 1px 4px; border-radius: 6px; background: #ff9f0a; color: #1b1300; }
@keyframes dxTag { from { opacity: 0; transform: translateY(4px); } }
.dx-dls { margin-top: auto; padding-top: 8px; overflow: hidden; white-space: nowrap; -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.dx-dls span { display: inline-block; padding-left: 100%; font-size: 12px; font-weight: 700; color: #ffd60a; text-shadow: 0 0 12px rgba(255,214,10,.45); animation: dxMarq 9s linear infinite; }
@keyframes dxMarq { to { transform: translateX(-100%); } }
.dx-knobs { display: grid; gap: 14px; justify-items: center; }
.dx-knobs i { width: 30px; height: 30px; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #5a5b63, #1d1d22 70%); box-shadow: 0 6px 12px rgba(0,0,0,.6), inset 0 0 0 0.5px rgba(255,255,255,.18); position: relative; }
.dx-knobs i.big { width: 50px; height: 50px; }
.dx-knobs i::after { content: ""; position: absolute; left: 50%; top: 5px; width: 2px; height: 9px; margin-left: -1px; border-radius: 1px; background: #ff9f0a; box-shadow: 0 0 6px #ff9f0a; }
.dx-feet { display: flex; justify-content: space-between; padding: 0 60px; }
.dx-feet i { width: 70px; height: 8px; border-radius: 0 0 6px 6px; background: #0e0e11; }
/* slaytlar (320×240 kartların birebir HTML karşılığı) */
.dx-sl { position: absolute; left: 0; top: 0; width: 100%; height: 100%; padding: 6.5cqw 6cqw; color: #fff; opacity: 0; transform: scale(1.04); transition: opacity .7s var(--ease), transform .9s var(--ease); display: flex; flex-direction: column; overflow: hidden; }
.dx-sl.on { opacity: 1; transform: none; }
.dx-sl.dx-now, .dx-sl.dx-prog { background: radial-gradient(70% 80% at 20% 10%, rgba(255,59,48,.7), transparent 60%), radial-gradient(60% 70% at 90% 100%, rgba(94,92,230,.6), transparent 60%), radial-gradient(30% 40% at 95% 0%, rgba(255,159,10,.3), transparent 70%), #07070a; }
.dx-sl.dx-prog { background: radial-gradient(70% 80% at 85% 10%, rgba(191,90,242,.6), transparent 60%), radial-gradient(60% 70% at 10% 100%, rgba(255,55,95,.55), transparent 60%), #07070a; }
.dx-brand { font: 800 4cqw/1 var(--display); letter-spacing: .06em; opacity: .9; }
.dx-k { align-self: flex-start; margin-top: 7cqw; display: inline-flex; align-items: center; gap: 1.6cqw; padding: 1.2cqw 3cqw 1.2cqw 2.4cqw; border-radius: 4cqw; background: rgba(255,255,255,.16); font: 800 3.3cqw/1 var(--display); letter-spacing: .04em; }
.dx-k::before { content: ""; width: 2.2cqw; height: 2.2cqw; border-radius: 50%; background: #ff453a; box-shadow: 0 0 6px #ff453a; }
.dx-t { font: 800 10.5cqw/1.04 var(--display); letter-spacing: -0.03em; margin-top: 3cqw; }
.dx-a { font: 600 5.2cqw/1.2 var(--display); opacity: .8; margin-top: 2cqw; }
.dx-n { margin-top: auto; font: 600 3.6cqw/1 var(--display); opacity: .6; }
.dx-eq { position: absolute; right: 6cqw; bottom: 6cqw; display: flex; align-items: flex-end; gap: 1.6cqw; height: 8cqw; }
.dx-eq i { width: 1.6cqw; background: #ff453a; border-radius: 1cqw; animation: dxEq 1s ease-in-out infinite alternate; height: 40%; }
.dx-eq i:nth-child(2) { background: #fff; animation-delay: -.3s; } .dx-eq i:nth-child(3) { animation-delay: -.6s; } .dx-eq i:nth-child(4) { background: #fff; animation-delay: -.15s; } .dx-eq i:nth-child(5) { animation-delay: -.45s; }
@keyframes dxEq { to { height: 100%; } }
.dx-sl.dx-ad { background: #0a0a0c; padding: 7cqw; justify-content: center; }
.dx-adbg { position: absolute; inset: 0; background: radial-gradient(90% 90% at 100% 0%, #ff9f0a, transparent 60%), linear-gradient(135deg, #0a84ff 0%, #5e5ce6 55%, #bf5af2 100%); }
.dx-adbg::after { content: ""; position: absolute; right: -10cqw; bottom: -22cqw; width: 70cqw; height: 70cqw; border-radius: 50%; border: 5cqw solid rgba(255,255,255,.12); }
.dx-adk, .dx-adt, .dx-ada, .dx-adp { position: relative; }
.dx-adk { font: 800 3.6cqw/1 var(--display); letter-spacing: .12em; opacity: .85; }
.dx-adt { font: 900 11cqw/.95 var(--display); letter-spacing: -0.02em; margin: 3cqw 0; }
.dx-ada { font: 600 4.6cqw/1.2 var(--display); opacity: .9; }
.dx-adp { position: absolute; right: 6cqw; top: 6cqw; font: 900 13cqw/1 var(--display); letter-spacing: -0.04em; color: #ffd60a; text-shadow: 0 6px 20px rgba(0,0,0,.35); }
.dx-sl.dx-logo { background: radial-gradient(80% 80% at 50% 0%, rgba(255,59,48,.55), transparent 65%), #07070a; align-items: center; justify-content: center; text-align: center; }
.dx-logo span { width: 22cqw; height: 22cqw; border-radius: 6cqw; display: grid; place-items: center; margin: 0 auto 4cqw; font-size: 12cqw; background: linear-gradient(160deg, #ff6a5f, #d7261b); box-shadow: 0 4cqw 10cqw -3cqw rgba(255,59,48,.8); }
.dx-logo b { display: block; font: 800 10cqw/1 var(--display); letter-spacing: -0.03em; } .dx-logo small { display: block; margin-top: 2cqw; font: 600 4.6cqw var(--display); opacity: .7; }
/* araç ekranı görünümü */
.dx-rx.car .dx-rx-body { grid-template-columns: 1fr; padding: 16px; border-radius: 26px; background: linear-gradient(170deg, #26272d, #0c0c0f 60%); }
.dx-rx.car .dx-grille, .dx-rx.car .dx-knobs { display: none; }
.dx-rx.car .dx-scr { grid-template-columns: 1.35fr 1fr; padding: 12px; }
.dx-rx.car + .dx-feet, .dx-rx.car .dx-feet { display: none; }

/* ---------- üç katman ---------- */
.dx-three { background: var(--canvas); }
.dx-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; margin-top: 40px; }
.dx-card { position: relative; padding: 30px 28px; border-radius: 28px; background: #fff; box-shadow: 0 30px 60px -40px rgba(0,0,0,.35), 0 0 0 0.5px var(--hair); overflow: hidden; }
.dx-card::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 4px; background: var(--c); }
.dx-card::after { content: ""; position: absolute; right: -80px; top: -80px; width: 220px; height: 220px; border-radius: 50%; background: radial-gradient(circle, color-mix(in srgb, var(--c) 22%, transparent), transparent 70%); }
.dx-ic { width: 52px; height: 52px; border-radius: 16px; display: grid; place-items: center; font-size: 27px; color: var(--c); background: color-mix(in srgb, var(--c) 12%, transparent); margin-bottom: 18px; position: relative; z-index: 1; }
.dx-ic.sm { width: 44px; height: 44px; font-size: 23px; border-radius: 13px; }
.dx-card h3 { font: 750 24px/1.15 var(--display); letter-spacing: -0.025em; margin: 0 0 8px; }
.dx-card p { color: var(--ink-2); margin: 0 0 16px; font-size: 15.5px; }
.dx-card ul { list-style: none; margin: 0; padding: 14px 0 0; border-top: 0.5px solid var(--hair); display: grid; gap: 9px; }
.dx-card li { position: relative; padding-left: 18px; font-size: 14.5px; color: #3a3a3c; }
.dx-card li::before { content: ""; position: absolute; left: 2px; top: .62em; width: 6px; height: 6px; border-radius: 50%; background: var(--c); }

/* ---------- reklam ---------- */
.dx-ad { position: relative; overflow: hidden; background: #070709; color: #f5f5f7; }
.dx-ad-glow { position: absolute; left: -10%; top: 10%; width: 60%; height: 80%; background: radial-gradient(closest-side, rgba(94,92,230,.45), rgba(191,90,242,.18) 50%, transparent); pointer-events: none; }
.dx-ad-g { position: relative; display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 60px; align-items: center; }
.dx-ad .lead { color: #a1a1a6; }
.dx-ticks { list-style: none; padding: 0; margin: 0 0 26px; display: grid; gap: 14px; }
.dx-ticks li { display: flex; gap: 12px; color: #c7c7cc; font-size: 15.5px; line-height: 1.5; }
.dx-ticks li i { color: #ff9f0a; font-size: 20px; flex: none; margin-top: 1px; }
.dx-ticks b { color: #fff; }
.dx-ad .link-arrow { color: #ffb340; }

/* ---------- akış ---------- */
.dx-flow { background: var(--canvas); }
.dx-pipe { display: grid; grid-template-columns: 1fr 56px 1.35fr 56px 1fr 56px 1fr; align-items: center; margin: 46px 0 34px; }
.dx-node { text-align: center; padding: 22px 14px; border-radius: 22px; background: #fff; box-shadow: 0 20px 40px -30px rgba(0,0,0,.35), 0 0 0 0.5px var(--hair); }
.dx-node > span { width: 48px; height: 48px; border-radius: 14px; display: grid; place-items: center; margin: 0 auto 10px; font-size: 25px; color: var(--c); background: color-mix(in srgb, var(--c) 12%, transparent); }
.dx-node b { display: block; font: 700 16px var(--display); } .dx-node small { display: block; color: var(--ink-2); font-size: 12.5px; margin-top: 3px; line-height: 1.4; }
.dx-node.main { background: #0b0b0d; color: #fff; padding: 26px 16px; box-shadow: 0 40px 80px -40px rgba(255,55,95,.6), 0 0 0 1px rgba(255,159,10,.35); }
.dx-node.main small { color: #a1a1a6; }
.dx-mark { width: 54px !important; height: 54px !important; border-radius: 16px !important; color: #fff !important; background: linear-gradient(160deg, #ff6a5f, #d7261b) !important; box-shadow: 0 10px 24px -8px rgba(255,59,48,.8); }
.dx-outs { display: flex; flex-wrap: wrap; gap: 5px; justify-content: center; margin-top: 12px; }
.dx-outs em { font-style: normal; font-size: 11px; font-weight: 600; padding: 3px 8px; border-radius: 10px; background: rgba(255,255,255,.08); color: #ffd60a; display: inline-flex; gap: 4px; align-items: center; }
.dx-link { height: 2px; position: relative; overflow: hidden; background: linear-gradient(90deg, rgba(255,55,95,.25), rgba(255,159,10,.25)); }
.dx-link i { position: absolute; top: -2px; width: 22px; height: 6px; border-radius: 3px; background: linear-gradient(90deg, transparent, #ff9f0a); animation: dxFlow 1.8s linear infinite; }
@keyframes dxFlow { from { left: -24px; } to { left: 100%; } }
.dx-ways { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.dx-way { padding: 28px; border-radius: 24px; background: var(--canvas-2); }
.dx-way h3 { font: 700 21px var(--display); letter-spacing: -0.02em; margin: 0 0 8px; } .dx-way p { color: var(--ink-2); font-size: 15px; margin: 0 0 16px; }
.dx-codes { display: flex; flex-wrap: wrap; gap: 6px; } .dx-codes code { font-size: 12.5px; padding: 5px 10px; border-radius: 8px; background: #fff; box-shadow: 0 0 0 0.5px var(--hair); }
.dx-tree { display: grid; gap: 4px; font-size: 13.5px; padding: 12px 14px; border-radius: 12px; background: #fff; box-shadow: 0 0 0 0.5px var(--hair); }
.dx-tree span { display: flex; gap: 7px; align-items: center; } .dx-tree i { color: #ff9f0a; } .dx-tree .l1 { padding-left: 22px; } .dx-tree .l2 { padding-left: 44px; color: var(--ink-2); }

/* ---------- rehber ---------- */
.dx-epg { overflow: hidden; }
.dx-epg-g { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 440px); gap: 60px; align-items: center; }
.dx-specs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.dx-specs div { padding: 14px 16px; border-radius: 16px; background: rgba(255,255,255,.05); box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.1); }
.dx-specs small { display: block; color: #8e8e93; font-size: 12.5px; } .dx-specs b { font: 700 16px var(--display); color: #fff; }
.dx-guide { padding: 16px; border-radius: 26px; background: linear-gradient(165deg, #2a2b31, #111114 55%); box-shadow: 0 50px 90px -40px rgba(0,0,0,.9), inset 0 0 0 0.5px rgba(255,255,255,.12); }
.dx-guide-h { display: flex; justify-content: space-between; align-items: center; padding: 4px 8px 12px; font-size: 13px; color: #8e8e93; } .dx-guide-h b { color: #fff; font: 800 17px var(--display); }
.dx-gr { display: grid; grid-template-columns: 54px 1fr auto; gap: 12px; align-items: center; padding: 11px 12px; border-radius: 12px; margin-top: 4px; background: rgba(255,255,255,.03); font-variant-numeric: tabular-nums; }
.dx-gr time { color: #8e8e93; font-weight: 700; font-size: 14px; }
.dx-gr b { display: block; color: #fff; font-size: 15px; } .dx-gr small { color: #8e8e93; font-size: 12px; }
.dx-gr em { font-style: normal; font-size: 11px; font-weight: 800; padding: 3px 8px; border-radius: 8px; background: #ff375f; color: #fff; }
.dx-gr.on { background: linear-gradient(90deg, rgba(255,55,95,.22), rgba(255,159,10,.08)); box-shadow: inset 0 0 0 0.5px rgba(255,55,95,.45); } .dx-gr.on time { color: #ffd60a; }

/* ---------- tek akış ---------- */
.dx-all { background: var(--canvas); }
.dx-outs4 { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin-top: 40px; }
.dx-o { padding: 26px 22px; border-radius: 22px; background: #fff; box-shadow: 0 24px 50px -36px rgba(0,0,0,.4), 0 0 0 0.5px var(--hair); display: grid; gap: 4px; justify-items: start; }
.dx-o > i { font-size: 30px; color: var(--c); margin-bottom: 10px; } .dx-o .dx-badge { margin: 3px 0 13px; }
.dx-o b { font: 700 17px var(--display); } .dx-o small { color: var(--ink-2); font-size: 13.5px; }

/* ---------- teknik ---------- */
.dx-table { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin-top: 34px; }
.dx-tg { padding: 26px 28px; border-radius: 22px; background: #fff; box-shadow: 0 0 0 0.5px var(--hair); }
.dx-tg h4 { display: flex; align-items: center; gap: 8px; margin: 0 0 14px; font: 700 18px var(--display); } .dx-tg h4 i { color: #ff375f; font-size: 22px; }
.dx-tg dl { margin: 0; display: grid; grid-template-columns: 150px 1fr; gap: 0; }
.dx-tg dt, .dx-tg dd { margin: 0; padding: 10px 0; border-top: 0.5px solid var(--hair); font-size: 14.5px; }
.dx-tg dt { color: var(--ink-2); font-weight: 600; } .dx-tg dd { color: var(--ink); }

/* ---------- son çağrı ---------- */
.dx-end { position: relative; overflow: hidden; isolation: isolate; background: #05050a; color: #f5f5f7; padding: 120px 0; }
.dx-end h2 { font: 800 clamp(38px, 5.4vw, 68px)/1.02 var(--display); letter-spacing: -0.045em; margin: 0 0 18px; }
.dx-end p { color: #a1a1a6; font-size: clamp(17px, 1.6vw, 20px); max-width: 52ch; margin: 0 auto 32px; }
.dx-end .ctas { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }

@media (max-width: 1020px) {
  .dx-hero-g, .dx-ad-g, .dx-epg-g { grid-template-columns: 1fr; gap: 34px; }
  .dx-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dx-cards, .dx-outs4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dx-pipe { grid-template-columns: 1fr; gap: 0; } .dx-link { width: 2px; height: 34px; margin: 0 auto; background: linear-gradient(rgba(255,55,95,.25), rgba(255,159,10,.25)); } .dx-link i { left: -2px !important; width: 6px; height: 18px; animation: dxFlowV 1.6s linear infinite; background: linear-gradient(transparent, #ff9f0a); }
  .dx-float.f1 { right: 0; }
}
@keyframes dxFlowV { from { top: -20px; } to { top: 100%; } }
@media (max-width: 680px) {
  .dx-hero { padding: 40px 0 44px; }
  .dx-cards, .dx-outs4, .dx-ways, .dx-table, .dx-specs { grid-template-columns: 1fr; }
  .dx-rx-body { grid-template-columns: 1fr; padding: 14px; border-radius: 22px; } .dx-grille, .dx-knobs { display: none; }
  .dx-scr { grid-template-columns: 1fr; } .dx-feet { display: none; }
  .dx-float { display: none; }
  .dx-tg dl { grid-template-columns: 1fr; } .dx-tg dd { border-top: 0; padding-top: 0; }
  .dx-strip { grid-template-columns: 1fr 1fr; }
}
@media (prefers-reduced-motion: reduce) { .dx-aura i, .dx-rings i, .dx-float, .dx-link i, .dx-eq i, .dx-dls span { animation: none !important; } .dx-rv { opacity: 1; transform: none; } }
/* ana sayfa DAB+ tanıtımı */
.dx-home { position: relative; overflow: hidden; isolation: isolate; background: #05050a; color: #f5f5f7; padding: 100px 0; }
.dx-home-g { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: 56px; align-items: center; }
.dx-home h2 { font: 800 clamp(36px, 5vw, 62px)/1.02 var(--display); letter-spacing: -0.045em; margin: 0 0 18px; }
.dx-home p { color: #a1a1a6; font-size: clamp(16px, 1.5vw, 19px); max-width: 52ch; margin: 0 0 20px; }
.dx-home ul { list-style: none; padding: 0; margin: 0 0 28px; display: grid; gap: 10px; }
.dx-home li { display: flex; gap: 10px; align-items: flex-start; color: #d1d1d6; font-size: 15px; } .dx-home li i { color: #ff9f0a; font-size: 19px; flex: none; }
.dx-home .ctas { display: flex; gap: 12px; flex-wrap: wrap; }
@media (max-width: 1020px) { .dx-home-g { grid-template-columns: 1fr; gap: 36px; } .dx-home { padding: 70px 0; } }
.sec + .dx-home::before, .dx-home + .sec::before { display: none; }
.dx-era { background: linear-gradient(180deg, #05050a, #0d0d12); color: #f5f5f7; padding: 0 0 80px; }
.dx-era-g { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 40px; align-items: center; padding: 40px 44px; border-radius: 30px; background: linear-gradient(120deg, rgba(255,55,95,.14), rgba(255,159,10,.07) 50%, rgba(94,92,230,.12)); box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.14); }
.dx-era-k { display: grid; gap: 14px; justify-items: start; } .dx-era-k b { font: 800 30px/1.05 var(--display); letter-spacing: -0.03em; }
.dx-era p { margin: 0; font-size: clamp(17px, 1.6vw, 21px); line-height: 1.55; color: #c7c7cc; } .dx-era p b { color: #fff; }
@media (max-width: 760px) { .dx-era-g { grid-template-columns: 1fr; gap: 18px; padding: 28px 24px; } }
/* Ürün menüsü DAB+ önizlemesi */
.mp-dab { display: grid; grid-template-columns: 1.2fr 1fr; gap: 8px; padding: 8px; border-radius: 14px; background: #050507; box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.1); }
.mp-dab-s { aspect-ratio: 4 / 3; border-radius: 6px; padding: 10px; display: flex; flex-direction: column; justify-content: center; gap: 2px; color: #fff; background: radial-gradient(80% 90% at 15% 10%, rgba(255,59,48,.75), transparent 60%), radial-gradient(70% 80% at 95% 100%, rgba(94,92,230,.65), transparent 60%), #07070a; }
.mp-dab-s span { font-size: 8px; font-weight: 800; letter-spacing: .05em; opacity: .85; } .mp-dab-s b { font: 800 16px/1.05 var(--display); } .mp-dab-s small { font-size: 10px; opacity: .8; }
.mp-dab-i { display: flex; flex-direction: column; color: #f2f2f7; min-width: 0; padding: 2px 0; }
.mp-dab-i em { font-style: normal; font-size: 9px; font-weight: 800; color: #ffd60a; } .mp-dab-i b { font: 800 13px var(--display); margin-top: 4px; } .mp-dab-i small { font-size: 9.5px; color: #8e8e93; }
.mp-dab-i i { margin-top: auto; font-style: normal; font-size: 10px; font-weight: 700; color: #ffd60a; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* ---------- cihaz sekmeleri ---------- */
.dx-devs { position: relative; text-align: center; } .dx-dev { text-align: left; }
.dx-dtabs { display: inline-flex; gap: 3px; padding: 3px; margin: 0 auto 18px; border-radius: 14px; background: rgba(255,255,255,.07); box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.14); }
.dx-dtabs button { display: inline-flex; align-items: center; gap: 7px; height: 34px; padding: 0 16px; border: 0; border-radius: 11px; background: transparent; color: #a1a1a6; font-weight: 650; font-size: 14px; cursor: pointer; transition: .2s; }
.dx-dtabs button i { font-size: 17px; }
.dx-dtabs button.on { background: rgba(255,255,255,.16); color: #fff; box-shadow: 0 4px 14px -6px rgba(0,0,0,.6); }
.dx-dtabs button.on i { color: #ff9f0a; }
.dx-dev { display: none; } .dx-dev.on { display: block; animation: dxDev .55s var(--ease); }
@keyframes dxDev { from { opacity: 0; transform: translateY(10px) scale(.985); } }
/* ---------- araç konsolu ---------- */
.dx-car { position: relative; width: 100%; max-width: 680px; margin: 0 auto; }
.dx-dash { display: grid; grid-template-columns: 34px minmax(0, 1fr) 34px; gap: 12px; align-items: center; padding: 18px 16px 14px; border-radius: 34px 34px 18px 18px;
  background: linear-gradient(175deg, #2b2c31 0%, #17171b 40%, #0e0e11 100%); box-shadow: 0 60px 100px -40px rgba(0,0,0,.95), inset 0 1px 0 rgba(255,255,255,.12), inset 0 0 0 0.5px rgba(255,255,255,.08); }
.dx-vent { align-self: stretch; display: grid; gap: 7px; align-content: center; padding: 10px 5px; border-radius: 10px; background: #0a0a0c; box-shadow: inset 0 2px 6px rgba(0,0,0,.8); }
.dx-vent i { height: 4px; border-radius: 2px; background: linear-gradient(90deg, #34353b, #1b1b1f); box-shadow: 0 1px 0 rgba(255,255,255,.05); }
.dx-bezel { padding: 7px; border-radius: 20px; background: linear-gradient(180deg, #050506, #000); box-shadow: 0 0 0 1px rgba(255,255,255,.08), 0 10px 30px -10px rgba(0,0,0,.9), inset 0 0 0 1px rgba(0,0,0,.6); }
.dx-cs { position: relative; border-radius: 14px; overflow: hidden; padding: 8px 10px 10px; color: #f2f2f7; background: radial-gradient(70% 90% at 15% 0%, rgba(255,55,95,.16), transparent 60%), radial-gradient(60% 80% at 100% 100%, rgba(94,92,230,.18), transparent 60%), #08080b; }
.dx-cs::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(115deg, rgba(255,255,255,.07), transparent 28%); }
.dx-cs-bar { display: flex; align-items: center; gap: 10px; font-size: 10px; color: rgba(255,255,255,.6); padding: 0 2px 6px; }
.dx-cs-bar .dx-top { display: flex; align-items: center; gap: 5px; flex: 1; } .dx-cs-bar .dx-top span { margin-left: 4px; color: #fff; font-weight: 700; font-variant-numeric: tabular-nums; }
.dx-cs-bar em { font-style: normal; display: inline-flex; align-items: center; gap: 3px; }
.dx-cs-g { display: grid; grid-template-columns: 30px minmax(0, 1.05fr) minmax(0, 1fr); gap: 10px; align-items: stretch; }
.dx-cs-apps { display: grid; align-content: space-between; gap: 6px; padding: 6px 0; border-radius: 10px; background: rgba(255,255,255,.05); }
.dx-cs-apps span { display: grid; place-items: center; height: 22px; color: rgba(255,255,255,.45); font-size: 13px; }
.dx-cs-apps span.on { color: #ff9f0a; position: relative; } .dx-cs-apps span.on::before { content: ""; position: absolute; left: 0; top: 4px; bottom: 4px; width: 2px; border-radius: 1px; background: #ff9f0a; }
.dx-car .dx-sls { align-self: start; border-radius: 8px; box-shadow: 0 10px 24px -12px rgba(0,0,0,.9); }
.dx-cs-info { display: flex; flex-direction: column; min-width: 0; padding: 2px 0; }
.dx-cs-src { font-size: 9.5px; font-weight: 800; letter-spacing: .06em; color: #ffd60a; }
.dx-car .dx-lbl { margin-top: 4px; font-size: clamp(14px, 1.9vw, 20px); }
.dx-car .dx-dls { padding-top: 6px; }
.dx-cs-ctl { display: flex; gap: 6px; margin-top: 8px; }
.dx-cs-ctl span { width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; background: rgba(255,255,255,.08); color: #fff; }
.dx-cs-ctl span.pl { background: #fff; color: #000; }
.dx-cs-pre { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 5px; margin-top: 9px; }
.dx-cs-pre span { display: flex; align-items: center; gap: 5px; min-width: 0; padding: 5px 6px; border-radius: 8px; background: rgba(255,255,255,.06); font-size: 9.5px; color: rgba(255,255,255,.75); white-space: nowrap; overflow: hidden; }
.dx-cs-pre b { flex: none; width: 14px; height: 14px; border-radius: 4px; display: grid; place-items: center; font-size: 8.5px; background: rgba(255,255,255,.12); }
.dx-cs-pre span.on { background: linear-gradient(90deg, rgba(255,55,95,.35), rgba(255,159,10,.2)); color: #fff; box-shadow: inset 0 0 0 0.5px rgba(255,159,10,.5); } .dx-cs-pre span.on b { background: #ff9f0a; color: #1b1300; }
.dx-dash-b { display: flex; align-items: center; justify-content: center; gap: 22px; margin: -2px 40px 0; padding: 12px 18px; border-radius: 0 0 22px 22px; background: linear-gradient(180deg, #121215, #0a0a0c); box-shadow: 0 20px 40px -20px rgba(0,0,0,.9), inset 0 1px 0 rgba(255,255,255,.04); }
.dx-hz { width: 30px; height: 30px; border-radius: 9px; display: grid; place-items: center; color: #ff453a; font-size: 14px; background: #1d1d22; box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.1); }
.dx-vol { width: 42px; height: 42px; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #5a5b63, #1d1d22 70%); box-shadow: 0 6px 12px rgba(0,0,0,.6), inset 0 0 0 0.5px rgba(255,255,255,.18); position: relative; }
.dx-vol::after { content: ""; position: absolute; left: 50%; top: 5px; width: 2px; height: 9px; margin-left: -1px; border-radius: 1px; background: #ff9f0a; box-shadow: 0 0 6px #ff9f0a; }
.dx-btns { display: flex; gap: 7px; } .dx-btns i { width: 34px; height: 12px; border-radius: 6px; background: #1d1d22; box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.1); }
@media (max-width: 680px) {
  .dx-dash { grid-template-columns: 1fr; padding: 12px; border-radius: 24px 24px 14px 14px; } .dx-vent { display: none; }
  .dx-cs-g { grid-template-columns: 1fr; } .dx-cs-apps { display: none; } .dx-cs-pre { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .dx-dash-b { margin: -2px 20px 0; }
}
.dx-qa { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 26px; }
.dx-qa div { display: grid; gap: 2px; padding: 10px 14px; border-radius: 14px 14px 14px 4px; background: rgba(255,255,255,.06); box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.12); }
.dx-qa small { font-size: 12px; color: #8e8e93; } .dx-qa b { font: 750 15px var(--display); color: #fff; }
.dx-qa div:nth-child(2) b { background: linear-gradient(90deg, #ff6a3d, #ffd60a); -webkit-background-clip: text; background-clip: text; color: transparent; }

/* =========================================================
   Yenilikler sayfası (.yxp)
   ========================================================= */
.yx-hero { position: relative; overflow: hidden; isolation: isolate; background: #05050a; color: #f5f5f7; padding: 64px 0 40px; }
.yx-grid { position: absolute; inset: 0; z-index: -1; background-image: linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px); background-size: 56px 56px; -webkit-mask-image: radial-gradient(70% 80% at 50% 0%, #000, transparent 75%); mask-image: radial-gradient(70% 80% at 50% 0%, #000, transparent 75%); }
.yx-hero-t { text-align: center; max-width: 780px; margin: 10px auto 34px; }
.yx-ver { display: inline-flex; align-items: center; gap: 7px; padding: 6px 14px; border-radius: 20px; font-weight: 700; font-size: 13.5px; color: #ffd60a; background: rgba(255,214,10,.1); box-shadow: inset 0 0 0 0.5px rgba(255,214,10,.35); }
.yx-hero h1 { font: 800 clamp(54px, 9vw, 120px)/.95 var(--display); letter-spacing: -0.055em; margin: 18px 0 18px; background: linear-gradient(180deg, #fff 30%, rgba(255,255,255,.55)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.yx-hero p { font-size: clamp(17px, 1.6vw, 21px); color: #a1a1a6; margin: 0; line-height: 1.5; } .yx-hero p b { color: #fff; }
.yx-filter { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; }
.yx-filter button { display: inline-flex; align-items: center; gap: 7px; height: 38px; padding: 0 16px; border-radius: 19px; border: 0; cursor: pointer; font-weight: 650; font-size: 14px; color: #c7c7cc; background: rgba(255,255,255,.07); box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.12); transition: .2s; }
.yx-filter button i { font-size: 17px; } .yx-filter button:hover { background: rgba(255,255,255,.12); }
.yx-filter button.on { background: #fff; color: #111; } .yx-filter button.on i { color: #ff375f; }
/* öne çıkan */
.yx-feat { background: linear-gradient(180deg, #05050a, #0b0b10); padding: 30px 0 90px; }
.yx-star { position: relative; overflow: hidden; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: 40px; align-items: center; padding: 46px; border-radius: 36px; color: #f5f5f7;
  background: linear-gradient(140deg, rgba(255,55,95,.14), rgba(255,159,10,.06) 40%, rgba(94,92,230,.14)), #0d0d12; box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.14), 0 60px 120px -60px rgba(255,55,95,.5); }
.yx-star::before { content: ""; position: absolute; inset: 0; border-radius: inherit; padding: 1px; background: linear-gradient(130deg, rgba(255,55,95,.8), rgba(255,214,10,.5) 40%, transparent 60%, rgba(94,92,230,.6)); -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude; pointer-events: none; }
.yx-star-glow { position: absolute; right: -120px; top: -160px; width: 520px; height: 520px; border-radius: 50%; background: radial-gradient(closest-side, rgba(255,159,10,.22), transparent); pointer-events: none; }
.yx-tags { display: flex; align-items: center; gap: 8px; margin-bottom: 18px; }
.yx-new { font-size: 12px; font-weight: 800; padding: 4px 10px; border-radius: 10px; background: #30d158; color: #002b0b; }
.yx-v18 { font-size: 12px; font-weight: 700; padding: 4px 10px; border-radius: 10px; color: #c7c7cc; background: rgba(255,255,255,.08); }
.yx-star h2 { font: 800 clamp(30px, 3.6vw, 46px)/1.04 var(--display); letter-spacing: -0.04em; margin: 0 0 16px; text-wrap: balance; }
.yx-star p { color: #a1a1a6; font-size: 16.5px; line-height: 1.55; margin: 0 0 22px; }
.yx-dabgrid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-bottom: 26px; }
.yx-dabgrid div { display: grid; grid-template-columns: 30px 1fr; column-gap: 10px; padding: 12px; border-radius: 14px; background: rgba(255,255,255,.05); box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.08); }
.yx-dabgrid i { grid-row: span 2; font-size: 24px; color: #ff9f0a; } .yx-dabgrid b { font-size: 14.5px; color: #fff; } .yx-dabgrid small { font-size: 12.5px; color: #8e8e93; }
.yx-star .ctas { display: flex; gap: 12px; flex-wrap: wrap; }
.yx-star-v { position: relative; }
/* bu sürümde */
.yx-now { background: var(--canvas); padding: 100px 0; }
.yx-sh { display: flex; align-items: center; gap: 12px; margin-bottom: 30px; }
.yx-sh h2 { font: 800 clamp(30px, 3.8vw, 46px)/1.05 var(--display); letter-spacing: -0.04em; margin: 0; }
.yx-dot { width: 12px; height: 12px; border-radius: 50%; background: #ff375f; box-shadow: 0 0 0 6px rgba(255,55,95,.15); } .yx-dot.g { background: #8e8e93; box-shadow: 0 0 0 6px rgba(142,142,147,.15); }
.yx-count { margin-left: auto; font-size: 14px; font-weight: 600; color: var(--ink-2); padding: 6px 12px; border-radius: 14px; background: var(--canvas-2); }
.yx-bento { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.yx-card { position: relative; overflow: hidden; display: flex; flex-direction: column; padding: 26px; border-radius: 26px; background: #fff; color: var(--ink); box-shadow: 0 24px 50px -36px rgba(0,0,0,.35), 0 0 0 0.5px var(--hair); transition: transform .3s var(--ease), box-shadow .3s; animation: yxIn .6s var(--ease) both; animation-delay: var(--d); }
.yx-card[hidden] { display: none; }
@keyframes yxIn { from { opacity: 0; transform: translateY(14px); } }
.yx-card:hover { transform: translateY(-4px); box-shadow: 0 34px 60px -34px rgba(0,0,0,.4), 0 0 0 0.5px color-mix(in srgb, var(--c) 40%, transparent); }
.yx-card::after { content: ""; position: absolute; right: -70px; top: -70px; width: 200px; height: 200px; border-radius: 50%; background: radial-gradient(circle, color-mix(in srgb, var(--c) 18%, transparent), transparent 70%); pointer-events: none; }
.yx-card.w { grid-column: span 2; }
.yx-ic { width: 48px; height: 48px; border-radius: 14px; display: grid; place-items: center; font-size: 25px; color: var(--c); background: color-mix(in srgb, var(--c) 12%, transparent); margin-bottom: 16px; }
.yx-card h3 { font: 750 20px/1.2 var(--display); letter-spacing: -0.02em; margin: 0 0 8px; }
.yx-card p { margin: 0 0 16px; color: var(--ink-2); font-size: 14.5px; line-height: 1.5; }
.yx-card em { margin-top: auto; font-style: normal; font-weight: 650; font-size: 14px; color: var(--c); display: inline-flex; gap: 6px; align-items: center; }
.yx-card em i { transition: transform .2s; } .yx-card:hover em i { transform: translateX(3px); }
.yx-v { margin: 0 0 16px; }
.yx-cards { display: grid; gap: 6px; } .yx-cards span { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-radius: 10px; background: var(--canvas-2); font-size: 13px; color: var(--ink-2); }
.yx-cards span.on { background: color-mix(in srgb, var(--c) 12%, #fff); color: var(--ink); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--c) 45%, transparent); } .yx-cards i { color: var(--c); }
.yx-inv { display: grid; gap: 0; max-width: 420px; padding: 12px 16px; border-radius: 14px; background: var(--canvas-2); font-variant-numeric: tabular-nums; }
.yx-inv div { display: flex; justify-content: space-between; padding: 6px 0; font-size: 13.5px; border-bottom: 0.5px solid var(--hair); } .yx-inv span { color: var(--ink-2); }
.yx-inv .t b { color: #ff9f0a; } .yx-inv .s { border: 0; font-weight: 700; } .yx-inv .s b { font-size: 16px; }
.yx-tree { display: grid; gap: 4px; padding: 12px; border-radius: 12px; background: var(--canvas-2); font-size: 13px; } .yx-tree span { display: flex; gap: 7px; align-items: center; } .yx-tree i { color: var(--c); } .yx-tree .l1 { padding-left: 20px; } .yx-tree .l2 { padding-left: 40px; font-weight: 600; }
.yx-th { display: flex; gap: 10px; } .yx-th i { flex: 1; height: 54px; border-radius: 12px; background: linear-gradient(135deg, var(--a) 0 55%, var(--b) 55%); box-shadow: inset 0 0 0 0.5px var(--hair-2); }
.yx-pat { display: flex; gap: 6px; } .yx-pat i { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; font-style: normal; font-weight: 800; color: #fff; background: var(--k); box-shadow: 0 6px 14px -6px var(--k); }
/* zaman çizelgesi */
.yx-past { background: var(--canvas-2); padding: 100px 0; }
.yx-tl { list-style: none; margin: 0; padding: 0; position: relative; display: grid; gap: 14px; }
.yx-tl::before { content: ""; position: absolute; left: 60px; top: 10px; bottom: 10px; width: 2px; background: linear-gradient(#ff375f, #ff9f0a 30%, var(--hair-2)); }
.yx-tl > li { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 18px; align-items: start; }
.yx-tl-v { position: relative; display: flex; justify-content: center; padding-top: 18px; }
.yx-tl-v b { position: relative; z-index: 1; padding: 5px 11px; border-radius: 12px; background: #fff; font: 750 13.5px var(--display); box-shadow: 0 0 0 0.5px var(--hair-2), 0 6px 16px -10px rgba(0,0,0,.4); }
.yx-tl-c { padding: 20px 24px; border-radius: 20px; background: #fff; box-shadow: 0 0 0 0.5px var(--hair); }
.yx-tl-c h3 { margin: 0 0 10px; font: 700 18px var(--display); letter-spacing: -0.02em; }
.yx-tl-c ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 18px; }
.yx-tl-c li { display: flex; gap: 8px; font-size: 14px; color: var(--ink-2); } .yx-tl-c li i { color: #30d158; margin-top: 2px; }
.yx-end { background: var(--canvas); padding: 100px 0; }
.yx-end h2 { font: 800 clamp(30px, 4vw, 50px)/1.05 var(--display); letter-spacing: -0.04em; margin: 0 0 12px; }
.yx-end p { color: var(--ink-2); font-size: 18px; margin: 0 auto 28px; max-width: 52ch; }
.yx-end .ctas { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }
@media (max-width: 1020px) { .yx-star { grid-template-columns: 1fr; padding: 30px; } .yx-bento { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 680px) {
  .yx-bento { grid-template-columns: 1fr; } .yx-card.w { grid-column: auto; } .yx-dabgrid { grid-template-columns: 1fr; }
  .yx-star { padding: 22px; border-radius: 26px; } .yx-tl::before { left: 34px; } .yx-tl > li { grid-template-columns: 68px minmax(0, 1fr); gap: 10px; } .yx-tl-c ul { grid-template-columns: 1fr; }
}
/* Kapat (X) simgesinin çift tonlu arka katmanı küçük boyutta kare gibi kayıyordu: tek katman */
.ph-duotone.ph-x::before { content: none !important; }
.ph-duotone.ph-x::after { margin-left: 0 !important; }

/* =========================================================
   NÖBETÇİ YAYIN — modül sayfası, ana sayfa bölümü ve menü önizlemesi
   ========================================================= */
.nb-badge { display: inline-flex; align-items: center; gap: 6px; height: 24px; padding: 0 9px; border-radius: 7px; font: 800 12.5px/1 var(--display); color: #fff; background: linear-gradient(135deg, #30d158, #0a84ff); box-shadow: 0 6px 16px -6px rgba(48,209,88,.7); white-space: nowrap; }
.nb-badge i { font-size: 14px; }
.nb-badge.lg { width: 56px; height: 56px; padding: 0; justify-content: center; border-radius: 17px; margin-bottom: 22px; } .nb-badge.lg i { font-size: 30px; }
.nb-grad { background: linear-gradient(100deg, #30d158 0%, #64d2ff 45%, #0a84ff 75%, #5e5ce6 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.nb-aura i:nth-child(1) { background: radial-gradient(closest-side, rgba(48,209,88,.36), rgba(48,209,88,.1) 55%, transparent) !important; }
.nb-aura i:nth-child(2) { background: radial-gradient(closest-side, rgba(10,132,255,.38), rgba(10,132,255,.1) 55%, transparent) !important; }
.nb-aura i:nth-child(3) { background: radial-gradient(closest-side, rgba(94,92,230,.3), rgba(94,92,230,.08) 55%, transparent) !important; }
.nbp .dx-qa div:nth-child(2) b { background: linear-gradient(90deg, #30d158, #64d2ff); -webkit-background-clip: text; background-clip: text; color: transparent; }
.nb-f > i { background: rgba(48,209,88,.16) !important; color: #4cd964 !important; }
.nb-f.f3 > i { background: rgba(10,132,255,.18) !important; color: #64b5ff !important; }

/* kesinti senaryosu monitörü */
.nb-mon { position: relative; padding: 18px; border-radius: 28px; color: #f5f5f7; background: linear-gradient(165deg, #23242a, #0f0f12 60%); box-shadow: 0 60px 100px -40px rgba(0,0,0,.95), 0 0 0 0.5px rgba(255,255,255,.14), 0 0 90px -30px rgba(48,209,88,.35); display: grid; gap: 10px; transition: box-shadow .6s; }
.nb-mon[data-ph=cut] { box-shadow: 0 60px 100px -40px rgba(0,0,0,.95), 0 0 0 0.5px rgba(255,255,255,.14), 0 0 90px -30px rgba(255,69,58,.45); }
.nb-mon[data-ph=nb] { box-shadow: 0 60px 100px -40px rgba(0,0,0,.95), 0 0 0 0.5px rgba(255,255,255,.14), 0 0 90px -30px rgba(10,132,255,.5); }
.nb-mon-h { display: flex; align-items: center; gap: 10px; padding: 2px 4px 6px; font-size: 14px; } .nb-mon-h em { margin-left: auto; font-style: normal; color: #8e8e93; font-variant-numeric: tabular-nums; }
.nb-dot { width: 9px; height: 9px; border-radius: 50%; background: #30d158; box-shadow: 0 0 0 4px rgba(48,209,88,.18); animation: nbPulse 1.6s ease-in-out infinite; }
.nb-mon[data-ph=cut] .nb-dot { background: #ff453a; box-shadow: 0 0 0 4px rgba(255,69,58,.2); }
@keyframes nbPulse { 50% { opacity: .45; } }
.nb-lane { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 18px; background: rgba(255,255,255,.05); box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.1); transition: background .5s, box-shadow .5s, opacity .5s; }
.nb-lane .grow { flex: 1; min-width: 0; display: grid; gap: 2px; } .nb-lane b { font-size: 14.5px; } .nb-lane small { color: #a1a1a6; font-size: 12.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nb-li { width: 38px; height: 38px; border-radius: 12px; display: grid; place-items: center; font-size: 21px; flex: none; color: #8e8e93; background: rgba(255,255,255,.07); transition: color .5s, background .5s; }
.nb-st { flex: none; font: 700 11.5px/1 var(--display); letter-spacing: .02em; padding: 6px 9px; border-radius: 8px; color: #a1a1a6; background: rgba(255,255,255,.08); transition: color .5s, background .5s; }
.nb-lane.on { background: rgba(48,209,88,.1); box-shadow: inset 0 0 0 0.5px rgba(48,209,88,.45); } .nb-lane.on .nb-li { color: #30d158; background: rgba(48,209,88,.16); } .nb-lane.on .nb-st { color: #052e12; background: #30d158; }
.nb-lane[data-lane=nb].on { background: rgba(10,132,255,.12); box-shadow: inset 0 0 0 0.5px rgba(10,132,255,.55); } .nb-lane[data-lane=nb].on .nb-li { color: #64b5ff; background: rgba(10,132,255,.18); } .nb-lane[data-lane=nb].on .nb-st { color: #fff; background: #0a84ff; }
.nb-lane.down { opacity: .55; } .nb-lane.down .nb-li { color: #ff453a; background: rgba(255,69,58,.14); } .nb-lane.down .nb-st { color: #fff; background: #ff453a; }
.nb-lane.wait .nb-li { color: #ffd60a; background: rgba(255,214,10,.14); } .nb-lane.wait .nb-st { color: #2b2300; background: #ffd60a; }
.nb-lane.boot .nb-li { color: #ffd60a; background: rgba(255,214,10,.14); } .nb-lane.boot .nb-st { color: #2b2300; background: #ffd60a; }
.nb-bar { height: 4px; border-radius: 3px; background: rgba(255,255,255,.08); overflow: hidden; } .nb-bar i { display: block; height: 100%; width: 0; background: linear-gradient(90deg, #ffd60a, #ff9f0a); }
.nb-mon:not([data-ph=cut]) .nb-bar { opacity: .35; }
.nb-air { display: flex; align-items: center; gap: 16px; padding: 14px; border-radius: 18px; background: rgba(0,0,0,.35); box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.08); }
.nb-wave { flex: 1; height: 44px; display: flex; align-items: center; gap: 3px; }
.nb-wave i { flex: 1; height: 100%; border-radius: 2px; background: linear-gradient(#30d158, #0a84ff); transform-origin: center; animation: nbWave 1.1s ease-in-out infinite; animation-delay: calc(var(--i) * -0.09s); transition: opacity .4s; }
@keyframes nbWave { 0%, 100% { transform: scaleY(.18); } 50% { transform: scaleY(1); } }
.nb-mon[data-ph=cut] .nb-wave i { animation: none; transform: scaleY(.05); opacity: .4; background: #ff453a; }
.nb-now { width: 150px; display: grid; gap: 1px; } .nb-now small { color: #8e8e93; font-size: 11px; } .nb-now b { font-size: 15px; } .nb-now span { color: #a1a1a6; font-size: 12.5px; }
.nb-outs { display: flex; flex-wrap: wrap; gap: 6px; } .nb-outs span { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; padding: 6px 10px; border-radius: 20px; color: #d1d1d6; background: rgba(48,209,88,.12); box-shadow: inset 0 0 0 0.5px rgba(48,209,88,.4); transition: all .4s; } .nb-outs i { color: #30d158; }
.nb-mon[data-ph=cut] .nb-outs span { background: rgba(255,255,255,.05); box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.1); color: #6e6e73; } .nb-mon[data-ph=cut] .nb-outs i { color: #6e6e73; }
.nb-mon[data-ph=nb] .nb-outs span { background: rgba(10,132,255,.14); box-shadow: inset 0 0 0 0.5px rgba(10,132,255,.5); } .nb-mon[data-ph=nb] .nb-outs i { color: #64b5ff; }
.nb-log { min-height: 18px; font-size: 12px; color: #8e8e93; padding: 0 4px; }

/* adımlar */
.nb-steps { list-style: none; padding: 0; margin: 44px 0 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; counter-reset: s; }
.nb-steps li { position: relative; padding: 28px 24px 26px; border-radius: 26px; background: #fff; box-shadow: 0 30px 60px -42px rgba(0,0,0,.35), 0 0 0 0.5px var(--hair); }
.nb-steps li::after { content: ""; position: absolute; top: 50px; right: -18px; width: 18px; height: 2px; background: linear-gradient(90deg, var(--c), transparent); }
.nb-steps li:last-child::after { display: none; }
.nb-steps h3 { font: 750 21px/1.15 var(--display); letter-spacing: -0.02em; margin: 0 0 8px; } .nb-steps p { margin: 0; color: var(--ink-2); font-size: 15px; line-height: 1.5; }
.nb-n { position: absolute; right: 22px; top: 20px; font: 800 44px/1 var(--display); letter-spacing: -0.04em; color: color-mix(in srgb, var(--c) 22%, transparent); }
.nb-steps .dx-rv:nth-child(2) { transition-delay: .1s; } .nb-steps .dx-rv:nth-child(3) { transition-delay: .2s; } .nb-steps .dx-rv:nth-child(4) { transition-delay: .3s; }
.nb-era .dx-era-g { background: linear-gradient(120deg, rgba(48,209,88,.14), rgba(10,132,255,.08) 50%, rgba(94,92,230,.12)); }
.nb-era .dx-era-k .nb-badge.lg { margin: 0; }

/* akış */
.nb-flow .dx-link { background: linear-gradient(90deg, rgba(48,209,88,.3), rgba(10,132,255,.3)); } .nb-flow .dx-link i { background: linear-gradient(90deg, transparent, #30d158); }
.nb-flow .dx-link.nb-cut { background: repeating-linear-gradient(90deg, rgba(255,69,58,.5) 0 6px, transparent 6px 12px); } .nb-flow .dx-link.nb-cut i { display: none; }
.nb-off { opacity: .6; filter: grayscale(1); }
.nb-main { box-shadow: 0 40px 80px -40px rgba(10,132,255,.6), 0 0 0 1px rgba(48,209,88,.4) !important; }
.nb-mark { background: linear-gradient(160deg, #30d158, #0a84ff) !important; box-shadow: 0 10px 24px -8px rgba(10,132,255,.8) !important; }

/* elektrik gelince */
.nb-back-g { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 460px); gap: 60px; align-items: center; }
.nb-ticks li i { color: #30d158 !important; }
.nb-boot { padding: 18px; border-radius: 26px; background: linear-gradient(165deg, #2a2b31, #111114 55%); box-shadow: 0 50px 90px -40px rgba(0,0,0,.9), inset 0 0 0 0.5px rgba(255,255,255,.12); display: grid; gap: 6px; }
.nb-bt { display: grid; grid-template-columns: 70px 22px 1fr; gap: 10px; align-items: center; padding: 11px 12px; border-radius: 14px; font-size: 13.5px; color: #d1d1d6; background: rgba(255,255,255,.04); }
.nb-bt time { font-variant-numeric: tabular-nums; color: #8e8e93; font-size: 12.5px; } .nb-bt i { font-size: 18px; }
.nb-bt.on { background: rgba(191,90,242,.14); box-shadow: inset 0 0 0 0.5px rgba(191,90,242,.45); color: #fff; }

@media (max-width: 1020px) {
  .nb-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); } .nb-steps li::after { display: none; }
  .nb-back-g { grid-template-columns: 1fr; gap: 34px; }
  .nb-flow .dx-link { background: linear-gradient(rgba(48,209,88,.3), rgba(10,132,255,.3)); } .nb-flow .dx-link i { background: linear-gradient(transparent, #30d158); }
  .nb-flow .dx-link.nb-cut { background: repeating-linear-gradient(180deg, rgba(255,69,58,.5) 0 6px, transparent 6px 12px); }
}
@media (max-width: 680px) {
  .nb-steps { grid-template-columns: 1fr; }
  .nb-now { width: 112px; } .nb-air { gap: 10px; padding: 12px; }
  .nb-bt { grid-template-columns: 62px 20px 1fr; font-size: 12.5px; }
}
@media (prefers-reduced-motion: reduce) { .nb-wave i, .nb-dot { animation: none !important; } }

/* ana sayfa bölümü */
.nb-home { position: relative; overflow: hidden; isolation: isolate; background: #05050a; color: #f5f5f7; padding: 100px 0; }
.nb-home-g { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: 56px; align-items: center; }
.nb-home h2 { font: 800 clamp(34px, 4vw, 54px)/1.04 var(--display); letter-spacing: -0.045em; margin: 0 0 20px; text-wrap: balance; }
.nb-home p { color: #a1a1a6; font-size: clamp(16px, 1.4vw, 18.5px); line-height: 1.55; margin: 0 0 22px; }
.nb-home ul { list-style: none; padding: 0; margin: 0 0 28px; display: grid; gap: 10px; } .nb-home li { display: flex; gap: 10px; color: #e5e5ea; font-size: 15.5px; } .nb-home li i { color: #30d158; font-size: 19px; flex: none; margin-top: 1px; }
.nb-home .ctas { display: flex; gap: 12px; flex-wrap: wrap; }
@media (max-width: 1020px) { .nb-home-g { grid-template-columns: 1fr; gap: 36px; } .nb-home { padding: 70px 0; } .nb-home-v { order: 2; } }

/* menü önizlemesi */
.mp-nb { display: grid; gap: 6px; }
.mp-nb div { display: flex; align-items: center; gap: 8px; padding: 10px 12px; border-radius: 12px; font-size: 12px; color: #f5f5f7; background: rgba(255,255,255,.06); box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.1); }
.mp-nb div b { font-size: 12.5px; } .mp-nb div em { margin-left: auto; font-style: normal; font-size: 11px; font-weight: 700; padding: 3px 7px; border-radius: 6px; color: #fff; background: var(--k); }
.mp-nb div i { font-size: 16px; color: var(--k); }
.mp-nb div.off { opacity: .55; }
.yx-feat-nb { padding-bottom: 30px; }
.yx-star-nb .yx-star-glow { background: radial-gradient(closest-side, rgba(48,209,88,.22), transparent); }
.yx-star-v .nb-mon { max-width: 520px; margin-left: auto; }
.nb-boot-sm { padding: 10px; border-radius: 18px; margin-top: 4px; } .nb-boot-sm .nb-bt { grid-template-columns: 46px 20px 1fr; padding: 8px 10px; font-size: 12.5px; }
/* çift tonlu simge bir grid kutusunda: iki katman aynı hücrede üst üste */
.dx-float > i.ph-duotone::before, .dx-float > i.ph-duotone::after { grid-area: 1 / 1; margin-left: 0; }
.nbp .dx-float.f1 { top: -20px; } .nbp .dx-float.f3 { left: -18px; bottom: -34px; }

/* =================================================================
   YOUTUBE CANLI YAYIN
   ================================================================= */
.dx-sh { text-align: center; max-width: 760px; margin: 0 auto 44px; }
.dx-sh h2 { margin-left: auto; margin-right: auto; text-wrap: balance; }
.dx-sh p { color: var(--ink-2); font-size: clamp(16px, 1.4vw, 18.5px); line-height: 1.55; margin: 0 auto; max-width: 60ch; }
.dx-kick { display: inline-flex; align-items: center; gap: 6px; height: 28px; padding: 0 12px; border-radius: 14px; font-size: 12.5px; font-weight: 700; letter-spacing: .02em; color: #5e5ce6; background: rgba(94,92,230,.1); margin-bottom: 14px; }
.yt-badge { display: inline-flex; align-items: center; gap: 6px; height: 24px; padding: 0 9px; border-radius: 7px; font: 800 12.5px/1 var(--display); color: #fff; background: linear-gradient(135deg, #ff2d55, #ff6a3d); box-shadow: 0 6px 16px -6px rgba(255,45,85,.8); white-space: nowrap; }
.yt-grad { background: linear-gradient(100deg, #ff2d55 0%, #ff6a3d 35%, #ffd60a 65%, #ff4fd8 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.yt-aura i:nth-child(1) { background: radial-gradient(closest-side, rgba(255,45,85,.42), rgba(255,45,85,.1) 55%, transparent) !important; }
.yt-aura i:nth-child(2) { background: radial-gradient(closest-side, rgba(109,93,252,.4), rgba(109,93,252,.1) 55%, transparent) !important; }
.yt-aura i:nth-child(3) { background: radial-gradient(closest-side, rgba(25,195,255,.3), rgba(25,195,255,.08) 55%, transparent) !important; }
.yt-home { position: relative; overflow: hidden; isolation: isolate; background: #05050a; color: #f5f5f7; padding: 100px 0; }
.yt-home-g { display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1.1fr); gap: 56px; align-items: center; }
.yt-home h2 { font: 800 clamp(34px, 4.4vw, 58px)/1.03 var(--display); letter-spacing: -0.045em; margin: 0 0 20px; text-wrap: balance; }
.yt-home p { color: #a1a1a6; font-size: clamp(16px, 1.4vw, 18.5px); line-height: 1.55; margin: 0 0 22px; }
.yt-home ul { list-style: none; padding: 0; margin: 0 0 28px; display: grid; gap: 10px; } .yt-home li { display: flex; gap: 10px; color: #e5e5ea; font-size: 15.5px; } .yt-home li i { color: #ff375f; font-size: 19px; flex: none; margin-top: 1px; }
.yt-home .ctas { display: flex; gap: 12px; flex-wrap: wrap; }
.yt-home-v { position: relative; padding: 30px 0; }
.yt-f > i { background: rgba(255,45,85,.16) !important; color: #ff6482 !important; }
.yt-f.f3 > i { background: rgba(25,195,255,.16) !important; color: #64d2ff !important; }
.yt-win { position: relative; border-radius: 22px; padding: 10px; background: linear-gradient(180deg, rgba(255,255,255,.1), rgba(255,255,255,.03)); box-shadow: 0 60px 120px -50px rgba(0,0,0,.9), inset 0 0 0 0.5px rgba(255,255,255,.16), 0 0 0 1px rgba(0,0,0,.4); animation: ytRise 1.1s var(--ease) both; }
@keyframes ytRise { from { opacity: 0; transform: translateY(26px) scale(.97); } }
.yt-frame { position: relative; aspect-ratio: 16 / 9; border-radius: 14px; overflow: hidden; background: #000; }
.yt-frame canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.yt-chrome { display: flex; align-items: center; gap: 12px; padding: 12px 6px 4px; font-size: 12.5px; color: #c7c7cc; }
.yt-live { display: inline-flex; align-items: center; gap: 6px; height: 22px; padding: 0 9px; border-radius: 6px; font-weight: 800; font-size: 11px; letter-spacing: .08em; color: #fff; background: #ff2a3d; }
.yt-live i { width: 6px; height: 6px; border-radius: 50%; background: #fff; animation: ytDot 1.2s ease-in-out infinite; }
@keyframes ytDot { 50% { opacity: .25; } }
.yt-prog { flex: 1; height: 4px; border-radius: 2px; background: rgba(255,255,255,.15); overflow: hidden; }
.yt-prog i { display: block; height: 100%; width: 100%; background: linear-gradient(90deg, #ff2a3d, #ff6a3d); }
.yt-view { display: inline-flex; gap: 6px; align-items: center; white-space: nowrap; }
.yt-themes { display: flex; gap: 8px; flex-wrap: wrap; padding: 12px 4px 4px; }
.yt-themes button { display: inline-flex; align-items: center; gap: 8px; height: 34px; padding: 0 12px 0 6px; border-radius: 17px; border: 0; cursor: pointer; font: 600 12.5px var(--text, inherit); color: #e5e5ea; background: rgba(255,255,255,.07); box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.14); transition: background .2s, transform .2s; }
.yt-themes button i { width: 22px; height: 22px; border-radius: 50%; background: radial-gradient(circle at 30% 30%, var(--c1), var(--c2)); box-shadow: 0 0 12px var(--c1); }
.yt-themes button:hover { transform: translateY(-1px); }
.yt-themes button.on { background: rgba(255,255,255,.18); color: #fff; box-shadow: inset 0 0 0 1px rgba(255,255,255,.4); }
.yt-hero .dx-hero-g { grid-template-columns: minmax(0, .9fr) minmax(0, 1.15fr); }
.yt-steps { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; counter-reset: s; }
.yt-steps li { position: relative; padding: 28px 24px 24px; border-radius: 26px; background: #fff; box-shadow: 0 0 0 0.5px var(--hair), 0 30px 60px -44px rgba(0,0,0,.4); overflow: hidden; }
.yt-steps li > i { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 16px; font-size: 26px; color: #fff; background: linear-gradient(135deg, #ff2d55, #ff9f0a); box-shadow: 0 14px 30px -14px rgba(255,45,85,.8); margin-bottom: 18px; }
.yt-steps li:nth-child(2) > i { background: linear-gradient(135deg, #bf5af2, #5e5ce6); box-shadow: 0 14px 30px -14px rgba(94,92,230,.8); }
.yt-steps li:nth-child(3) > i { background: linear-gradient(135deg, #30d158, #0a84ff); box-shadow: 0 14px 30px -14px rgba(10,132,255,.8); }
.yt-steps b { display: block; font: 750 19px var(--display); letter-spacing: -0.02em; margin-bottom: 8px; }
.yt-steps p { margin: 0; color: var(--ink-2); font-size: 15px; line-height: 1.55; }
.yt-n { position: absolute; right: 18px; top: 8px; font: 800 86px/1 var(--display); letter-spacing: -0.06em; color: rgba(0,0,0,.05); }
.yt-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.yt-cd { padding: 24px; border-radius: 24px; background: #fff; box-shadow: 0 0 0 0.5px var(--hair), 0 24px 50px -40px rgba(0,0,0,.4); transition: transform .35s var(--ease), box-shadow .35s; }
.yt-cd:hover { transform: translateY(-4px); box-shadow: 0 0 0 0.5px var(--hair-2), 0 34px 60px -40px rgba(0,0,0,.5); }
.yt-ic { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 13px; font-size: 22px; color: var(--k); background: color-mix(in srgb, var(--k) 12%, #fff); margin-bottom: 14px; }
.yt-cd b { display: block; font: 700 17px var(--display); letter-spacing: -0.01em; margin-bottom: 6px; }
.yt-cd p { margin: 0; color: var(--ink-2); font-size: 14.5px; line-height: 1.55; }
.yt-sig { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 50px; align-items: center; }
.yt-sig p { color: var(--ink-2); font-size: 17px; line-height: 1.6; }
.yt-sig-b { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.yt-sig-b button { height: 38px; padding: 0 14px; border-radius: 19px; border: 0; cursor: pointer; font: 600 13.5px inherit; color: var(--ink); background: #fff; box-shadow: 0 0 0 0.5px var(--hair-2); transition: all .2s; }
.yt-sig-b button.on { color: #fff; background: #1d1d1f; box-shadow: 0 10px 24px -12px rgba(0,0,0,.6); }
.yt-sig .yt-win { background: linear-gradient(180deg, #1c1c22, #0b0b0f); }
@media (max-width: 1020px) { .yt-home-g, .yt-sig { grid-template-columns: 1fr; gap: 36px; } .yt-home { padding: 70px 0; } .yt-steps, .yt-grid { grid-template-columns: 1fr; } .yt-hero .dx-hero-g { grid-template-columns: 1fr; } }
@media (min-width: 700px) and (max-width: 1020px) { .yt-grid { grid-template-columns: 1fr 1fr; } }

/* =================================================================
   YAYIN MASASI DÜZENİ
   ================================================================= */
.lay-badge { display: inline-flex; align-items: center; gap: 6px; height: 24px; padding: 0 9px; border-radius: 7px; font: 800 12.5px/1 var(--display); color: #fff; background: linear-gradient(135deg, #5e5ce6, #0a84ff); box-shadow: 0 6px 16px -6px rgba(94,92,230,.8); white-space: nowrap; }
.lay-grad { background: linear-gradient(100deg, #5e5ce6 0%, #0a84ff 40%, #30d158 75%, #64d2ff 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.lay-aura i:nth-child(1) { background: radial-gradient(closest-side, rgba(94,92,230,.42), rgba(94,92,230,.1) 55%, transparent) !important; }
.lay-aura i:nth-child(2) { background: radial-gradient(closest-side, rgba(10,132,255,.36), rgba(10,132,255,.1) 55%, transparent) !important; }
.lay-aura i:nth-child(3) { background: radial-gradient(closest-side, rgba(48,209,88,.26), rgba(48,209,88,.08) 55%, transparent) !important; }
.lay-home { position: relative; overflow: hidden; padding: 110px 0; background: radial-gradient(70% 60% at 0% 20%, rgba(94,92,230,.1), transparent 60%), radial-gradient(60% 60% at 100% 100%, rgba(10,132,255,.08), transparent 60%), var(--canvas-2, #f5f5f7); }
.lay-home-g { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, .9fr); gap: 56px; align-items: center; }
.lay-home .dx-pill { background: #fff; color: var(--ink-2); box-shadow: 0 0 0 0.5px var(--hair-2), 0 8px 20px -14px rgba(0,0,0,.3); }
.lay-home h2 { font: 800 clamp(34px, 4.2vw, 56px)/1.04 var(--display); letter-spacing: -0.045em; margin: 0 0 20px; text-wrap: balance; }
.lay-home p { color: var(--ink-2); font-size: clamp(16px, 1.4vw, 18.5px); line-height: 1.55; margin: 0 0 22px; }
.lay-home ul { list-style: none; padding: 0; margin: 0 0 28px; display: grid; gap: 10px; } .lay-home li { display: flex; gap: 10px; font-size: 15.5px; color: var(--ink); } .lay-home li i { color: #5e5ce6; font-size: 19px; flex: none; margin-top: 1px; }
@media (max-width: 1020px) { .lay-home-g { grid-template-columns: 1fr; gap: 36px; } .lay-home { padding: 70px 0; } }
/* iki monitörlü canlandırma */
.lm { position: relative; }
.lm-stage { position: relative; aspect-ratio: 16 / 8.2; }
.lm-mon { position: absolute; top: 0; display: flex; flex-direction: column; align-items: center; }
.lm-mon.m1 { left: 0; width: 62%; height: 90%; }
.lm-mon.m2 { left: 66.5%; width: 33.5%; top: 9%; height: 72%; }
.lm-scr { position: relative; width: 100%; flex: 1; border-radius: 12px; background: radial-gradient(120% 90% at 0% 0%, rgba(94,92,230,.22), transparent 55%), radial-gradient(100% 80% at 100% 100%, rgba(10,132,255,.16), transparent 60%), #0d0e12; box-shadow: 0 0 0 5px #1d1d22, 0 0 0 6px #2c2c33, 0 40px 80px -40px rgba(0,0,0,.7); overflow: hidden; }
.lm-bar { display: flex; align-items: center; gap: 4px; height: 7.5%; padding: 0 2.5%; border-bottom: 0.5px solid rgba(255,255,255,.08); }
.lm-bar i { width: 6px; height: 6px; border-radius: 50%; background: #ff5f57; } .lm-bar i:nth-child(2) { background: #febc2e; } .lm-bar i:nth-child(3) { background: #28c840; }
.lm-bar b { margin-left: 8px; font-size: 9px; color: rgba(255,255,255,.55); font-weight: 600; }
.lm-neck { width: 10%; height: 6%; background: linear-gradient(180deg, #2c2c33, #1a1a1f); }
.lm-foot { width: 32%; height: 2.4%; border-radius: 6px 6px 2px 2px; background: #26262c; box-shadow: 0 8px 18px -8px rgba(0,0,0,.6); }
.lm-empty { position: absolute; inset: 7.5% 0 0; display: grid; place-content: center; justify-items: center; gap: 6px; color: rgba(255,255,255,.35); font-size: 10px; transition: opacity .5s; }
.lm-empty i { font-size: 22px; }
.lm.s2on .lm-empty { opacity: 0; }
.lm-b { position: absolute; z-index: 2; border-radius: 8px; padding: 1.4% 1.2%; display: flex; flex-direction: column; gap: 6%; overflow: hidden; background: rgba(255,255,255,.055); box-shadow: inset 0 0 0 0.5px color-mix(in srgb, var(--bc) 45%, transparent); color: #fff;
  transition: left .9s cubic-bezier(.65,0,.2,1), top .9s cubic-bezier(.65,0,.2,1), width .9s cubic-bezier(.65,0,.2,1), height .9s cubic-bezier(.65,0,.2,1), opacity .5s, transform .5s; }
.lm-b.hid { opacity: 0; transform: scale(.85); pointer-events: none; }
.lm-b.on2 { box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--bc) 70%, transparent), 0 0 30px -6px var(--bc); }
.lm-h { display: flex; align-items: center; gap: 5px; font-size: clamp(7px, .75vw, 10px); font-weight: 600; color: rgba(255,255,255,.85); white-space: nowrap; }
.lm-h i { color: var(--bc); font-size: 1.25em; }
.lm-decks { flex: 1; display: grid; grid-template-columns: 1fr 1fr; gap: 6%; min-height: 0; }
.lm-decks div { position: relative; border-radius: 6px; background: rgba(255,255,255,.05); padding: 6%; }
.lm-decks b { font-size: 8px; width: 13px; height: 13px; border-radius: 3px; display: grid; place-items: center; background: #0a84ff; color: #000; }
.lm-decks div:last-child b { background: #ff9f0a; }
.lm-decks span { position: absolute; left: 6%; right: 6%; bottom: 10%; height: 28%; background: repeating-linear-gradient(90deg, rgba(255,255,255,.45) 0 2px, transparent 2px 4px); mask: radial-gradient(60% 100% at 40% 100%, #000, transparent); opacity: .7; }
.lm-decks em { position: absolute; right: 6%; top: 6%; font: 700 clamp(7px, .8vw, 11px) var(--display); font-style: normal; }
.lm-q { flex: 1; display: grid; align-content: start; gap: 5px; min-height: 0; overflow: hidden; }
.lm-row { display: flex; align-items: center; gap: 5px; height: 8px; flex: none; }
.lm-row span { width: 14%; height: 4px; border-radius: 2px; background: rgba(255,255,255,.22); }
.lm-row i { height: 4px; border-radius: 2px; background: rgba(255,255,255,.4); }
.lm-row em { margin-left: auto; width: 10%; height: 4px; border-radius: 2px; background: rgba(255,255,255,.22); }
.lm-row.nx { background: rgba(48,209,88,.14); border-radius: 3px; box-shadow: inset 2px 0 0 #30d158; height: 10px; }
.lm-cart { flex: 1; display: grid; grid-template-columns: repeat(3, 1fr); grid-auto-rows: 1fr; gap: 5px; min-height: 0; }
.lm-cart span { border-radius: 4px; background: hsla(var(--h), 75%, 60%, .28); box-shadow: inset 0 0 0 0.5px hsla(var(--h), 75%, 60%, .55); animation: lmPad 3s ease-in-out infinite; }
.lm-cart span:nth-child(4) { animation-delay: -1s; } .lm-cart span:nth-child(7) { animation-delay: -2s; }
@keyframes lmPad { 50% { background: hsla(var(--h), 75%, 60%, .5); } }
.lm-up { display: grid; gap: 6px; } .lm-up div { display: flex; gap: 5px; align-items: center; font-size: 7px; color: rgba(255,255,255,.7); } .lm-up i { flex: 1; height: 4px; border-radius: 2px; background: rgba(255,159,10,.45); }
.lm-s { height: 14px; border-radius: 4px; background: rgba(255,255,255,.08); display: flex; align-items: center; padding: 0 5px; } .lm-s span { flex: 1; height: 3px; border-radius: 2px; background: rgba(255,255,255,.2); }
.lm-clock { flex: 1; display: grid; place-content: center; justify-items: center; gap: 6px; }
.lm-clock b { font: 650 clamp(14px, 2.4vw, 34px)/1 var(--display); letter-spacing: -0.04em; }
.lm-tally { font-size: 7px; font-weight: 800; letter-spacing: .12em; padding: 2px 7px; border-radius: 6px; background: #ff2a3d; box-shadow: 0 0 14px rgba(255,42,61,.7); }
.lm-clock span { width: 70%; height: 4px; border-radius: 2px; background: rgba(255,255,255,.12); overflow: hidden; } .lm-clock span i { display: block; height: 100%; width: 40%; background: linear-gradient(90deg, #30d158, #64d2ff); animation: lmProg 8s linear infinite; }
@keyframes lmProg { from { width: 5%; } to { width: 100%; } }
.lm-tabs { display: flex; justify-content: center; gap: 6px; flex-wrap: wrap; margin-top: 22px; }
.lm-tabs button { height: 34px; padding: 0 14px; border-radius: 17px; border: 0; cursor: pointer; font: 600 13px inherit; color: var(--ink-2); background: #fff; box-shadow: 0 0 0 0.5px var(--hair-2); transition: all .25s; }
.lm-tabs button.on { color: #fff; background: linear-gradient(135deg, #5e5ce6, #0a84ff); box-shadow: 0 10px 24px -10px rgba(94,92,230,.8); }
.dx-hero .lm-tabs button { background: rgba(255,255,255,.08); color: #e5e5ea; box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.16); }
.dx-hero .lm-tabs button.on { color: #fff; background: linear-gradient(135deg, #5e5ce6, #0a84ff); }
.lay-hero-g { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.25fr); gap: 46px; align-items: center; }
@media (max-width: 1020px) { .lay-hero-g { grid-template-columns: 1fr; } }
.lay-feat { display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); gap: 56px; align-items: center; }
.lay-feat.rev .lay-feat-t { order: 2; }
.lay-feat p { color: var(--ink-2); font-size: 17px; line-height: 1.6; }
.lay-ul { list-style: none; padding: 0; margin: 18px 0 0; display: grid; gap: 10px; }
.lay-ul li { display: flex; gap: 10px; align-items: center; font-size: 15px; } .lay-ul li i { color: #5e5ce6; font-size: 19px; }
@media (max-width: 1020px) { .lay-feat { grid-template-columns: 1fr; gap: 34px; } .lay-feat.rev .lay-feat-t { order: 0; } }
.lay-edit-v { position: relative; padding: 14px; border-radius: 24px; background: #0d0e12; box-shadow: 0 50px 100px -50px rgba(0,0,0,.7); color: #fff; }
.lev-bar { display: flex; align-items: center; gap: 10px; padding: 9px 12px; border-radius: 14px; background: rgba(255,255,255,.07); font-size: 12.5px; margin-bottom: 12px; }
.lev-bar > i { color: #0a84ff; font-size: 18px; }
.lev-bar span { display: inline-flex; gap: 6px; align-items: center; height: 24px; padding: 0 10px; border-radius: 12px; border: 1px dashed rgba(255,55,95,.6); background: rgba(255,55,95,.12); font-size: 11.5px; }
.lev-bar em { margin-left: auto; font-style: normal; font-weight: 700; padding: 5px 12px; border-radius: 9px; background: #0a84ff; }
.lev-g { position: relative; display: flex; gap: 0; height: 300px; }
.lev-col { flex: 1.4; display: flex; flex-direction: column; gap: 10px; } .lev-col.n { flex: 1; }
.lev-split { flex: 0 0 18px; margin: 0 4px; border-radius: 9px; background: rgba(10,132,255,.0); animation: levSplit 5s ease-in-out infinite; }
@keyframes levSplit { 0%, 30%, 75%, 100% { background: rgba(10,132,255,0); box-shadow: none; } 45%, 62% { background: rgba(10,132,255,.45); box-shadow: 0 0 24px rgba(10,132,255,.6); } }
.lev-b { display: flex; align-items: center; gap: 8px; padding: 0 12px; height: 54px; border-radius: 12px; font-size: 13px; font-weight: 600; background: color-mix(in srgb, var(--bc) 14%, #16171c); box-shadow: inset 0 0 0 0.5px color-mix(in srgb, var(--bc) 55%, transparent); }
.lev-b i { color: rgba(255,255,255,.4); }
.lev-b.grow { flex: 1; align-items: flex-start; padding-top: 16px; }
.lev-b.fly { animation: levFly 5s cubic-bezier(.65,0,.2,1) infinite; position: relative; z-index: 2; }
@keyframes levFly { 0%, 20% { transform: none; } 45%, 62% { transform: translate(-58px, 6px) rotate(-2deg); box-shadow: 0 30px 60px -20px rgba(0,0,0,.8), inset 0 0 0 1px #bf5af2; } 85%, 100% { transform: none; } }
.lev-cursor { position: absolute; right: 22%; top: 18px; font-size: 26px; color: #fff; filter: drop-shadow(0 6px 10px rgba(0,0,0,.6)); animation: levCur 5s cubic-bezier(.65,0,.2,1) infinite; }
@keyframes levCur { 0%, 20% { transform: none; } 45%, 62% { transform: translate(-58px, 6px); } 85%, 100% { transform: none; } }
.lay-clock-v { display: flex; flex-direction: column; align-items: center; }
.lcv-scr { width: 100%; aspect-ratio: 4 / 3; border-radius: 18px; padding: 6%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; color: #fff; background: radial-gradient(110% 80% at 50% 0%, rgba(255,55,95,.22), transparent 60%), #0d0e12; box-shadow: 0 0 0 7px #1d1d22, 0 0 0 8px #2c2c33, 0 50px 100px -50px rgba(0,0,0,.7); }
.lcv-tally { font-size: 11px; font-weight: 800; letter-spacing: .14em; padding: 4px 12px; border-radius: 10px; background: #ff2a3d; box-shadow: 0 0 24px rgba(255,42,61,.7); animation: lcvT 2s ease-in-out infinite; }
@keyframes lcvT { 50% { box-shadow: 0 0 8px rgba(255,42,61,.4); } }
.lcv-scr > b { font: 650 clamp(56px, 7vw, 96px)/1 var(--display); letter-spacing: -0.04em; margin-top: 6px; }
.lcv-scr > small { color: #a1a1a6; font-size: 13px; }
.lcv-now { width: 100%; margin-top: 14px; padding: 12px 14px; border-radius: 14px; background: rgba(255,255,255,.06); }
.lcv-now small, .lcv-next small { font-size: 10px; font-weight: 700; letter-spacing: .12em; color: #8e8e93; }
.lcv-now b { display: block; font-size: 17px; } .lcv-now > span { color: #a1a1a6; font-size: 13px; }
.lcv-now > i { display: block; height: 5px; border-radius: 3px; background: rgba(255,255,255,.1); margin: 10px 0 6px; overflow: hidden; } .lcv-now > i em { display: block; height: 100%; background: linear-gradient(90deg, #30d158, #64d2ff); animation: lmProg 12s linear infinite; }
.lcv-now > div { display: flex; justify-content: space-between; font-size: 12px; color: #a1a1a6; } .lcv-now strong { font: 700 22px var(--display); color: #fff; }
.lcv-next { width: 100%; padding: 6px 4px 0; } .lcv-next b { display: block; font-size: 14px; }
.lq { max-width: 860px; margin: 0 auto; border-radius: 24px; background: #fff; box-shadow: 0 0 0 0.5px var(--hair), 0 40px 80px -60px rgba(0,0,0,.45); overflow: hidden; }
.lq-ctl { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; padding: 14px 16px; border-bottom: 0.5px solid var(--hair); background: #fbfbfd; }
.lq-seg { display: inline-flex; padding: 3px; border-radius: 11px; background: rgba(0,0,0,.05); gap: 2px; }
.lq-seg button { border: 0; background: transparent; padding: 6px 12px; border-radius: 8px; font: 600 13px inherit; color: var(--ink-2); cursor: pointer; transition: all .2s; }
.lq-seg button.on { background: #fff; color: var(--ink); box-shadow: 0 1px 4px rgba(0,0,0,.14); }
.lq-acc { display: flex; gap: 7px; margin-left: auto; }
.lq-acc button { width: 24px; height: 24px; border-radius: 50%; border: 2px solid #fff; background: var(--c); box-shadow: 0 0 0 1px var(--hair-2); cursor: pointer; }
.lq-acc button.on { box-shadow: 0 0 0 2px var(--c); }
.lq-list { --acc: #30d158; padding: 6px 0; transition: padding .3s; }
.lq-row { display: grid; grid-template-columns: 18px 70px 30px minmax(0, 1fr) 36px 52px; gap: 12px; align-items: center; padding: 10px 16px; border-bottom: 0.5px solid var(--hair); transition: padding .3s var(--ease), background .3s, border-radius .3s, margin .3s; position: relative; }
.lq-row > i { color: #c7c7cc; }
.lq-t { font-variant-numeric: tabular-nums; font-size: 13px; color: var(--ink-2); }
.lq-k { width: 26px; height: 26px; border-radius: 8px; display: grid; place-items: center; color: #0a84ff; background: rgba(10,132,255,.1); } .lq-k.j { color: #bf5af2; background: rgba(191,90,242,.12); }
.lq-n b { display: block; font-size: 14.5px; font-weight: 600; } .lq-n small { color: var(--ink-2); font-size: 12.5px; }
.lq-c { font-style: normal; font-weight: 800; font-size: 11px; width: 22px; height: 22px; border-radius: 6px; display: grid; place-items: center; color: #ff375f; background: rgba(255,55,95,.12); } .lq-row em:empty { visibility: hidden; }
.lq-d { text-align: right; font-variant-numeric: tabular-nums; color: var(--ink-2); font-size: 13px; }
.lq-row.nx { background: color-mix(in srgb, var(--acc) 9%, transparent); } .lq-row.nx::before { content: ""; position: absolute; left: 0; top: 7px; bottom: 7px; width: 3px; border-radius: 3px; background: var(--acc); }
.lq-list.d-compact .lq-row { padding-top: 4px; padding-bottom: 4px; } .lq-list.d-compact .lq-n { display: flex; gap: 8px; align-items: baseline; }
.lq-list.d-comfort .lq-row { padding-top: 16px; padding-bottom: 16px; } .lq-list.d-comfort .lq-n b { font-size: 16px; }
.lq-list.r-zebra .lq-row:nth-child(even):not(.nx) { background: rgba(0,0,0,.025); }
.lq-list.r-cards { padding: 8px 10px; } .lq-list.r-cards .lq-row { border: 0; border-radius: 14px; margin-bottom: 6px; box-shadow: 0 0 0 0.5px var(--hair-2); background: #fff; } .lq-list.r-cards .lq-row.nx { background: color-mix(in srgb, var(--acc) 9%, #fff); }
.lay-custom { display: flex; gap: 28px; align-items: center; max-width: 900px; margin: 0 auto; padding: 34px; border-radius: 30px; background: linear-gradient(120deg, rgba(94,92,230,.08), rgba(10,132,255,.06)); box-shadow: inset 0 0 0 0.5px var(--hair); }
.lc-ic { flex: none; width: 84px; height: 84px; border-radius: 24px; display: grid; place-items: center; font-size: 42px; color: #fff; background: linear-gradient(135deg, #5e5ce6, #0a84ff); box-shadow: 0 20px 40px -18px rgba(94,92,230,.8); }
.lay-custom h2 { font-size: clamp(28px, 3vw, 40px) !important; margin-bottom: 10px !important; }
.lay-custom p { color: var(--ink-2); margin: 0; font-size: 16.5px; line-height: 1.6; }
@media (max-width: 700px) { .lay-custom { flex-direction: column; text-align: center; } .lq-row { grid-template-columns: 0 54px 26px minmax(0, 1fr) 0 44px; gap: 8px; } .lq-row > i, .lq-row .lq-c { visibility: hidden; } }
/* mega menü ön izlemeleri */
.mp-yt { padding: 4px 0 10px; }
.mp-yt-v { position: relative; aspect-ratio: 16 / 9; border-radius: 12px; overflow: hidden; background: #070814; }
.mp-yt-v > i { position: absolute; width: 70%; aspect-ratio: 1; border-radius: 50%; filter: blur(18px); opacity: .7; animation: dxDrift 9s ease-in-out infinite alternate; }
.mp-yt-v > i:nth-child(1) { left: -20%; top: -30%; background: #6d5dfc; } .mp-yt-v > i:nth-child(2) { right: -25%; bottom: -40%; background: #ff4fd8; animation-delay: -4s; }
.mp-yt-live { position: absolute; left: 7px; top: 7px; font-size: 8px; font-weight: 800; letter-spacing: .1em; color: #fff; padding: 2px 6px; border-radius: 4px; background: #ff2a3d; }
.mp-yt-d { position: absolute; left: 50%; top: 42%; width: 30%; aspect-ratio: 1; transform: translate(-50%, -50%); border-radius: 50%; display: grid; place-items: center; background: linear-gradient(135deg, #ff375f, #ff9f0a); box-shadow: 0 0 0 4px rgba(255,255,255,.14), 0 0 0 9px rgba(255,255,255,.06); animation: ytPulse 1.2s ease-in-out infinite; }
.mp-yt-d b { color: #fff; font: 800 18px var(--display); }
@keyframes ytPulse { 50% { box-shadow: 0 0 0 6px rgba(255,255,255,.2), 0 0 0 13px rgba(255,255,255,.06); } }
.mp-yt-np { position: absolute; left: 18%; right: 18%; bottom: 7px; padding: 4px 8px; border-radius: 7px; background: rgba(255,255,255,.1); color: #fff; font-size: 10px; font-weight: 700; backdrop-filter: blur(6px); }
.mp-yt-np small { display: block; font-size: 6.5px; letter-spacing: .1em; color: #8fd3ff; }
.mp-lay { display: flex; gap: 8px; align-items: flex-end; padding: 6px 0 12px; }
.mp-lay > div { display: flex; gap: 4px; padding: 5px; border-radius: 8px; background: #0d0e12; box-shadow: 0 0 0 3px #1d1d22; }
.mp-lay .m1 { flex: 1.6; height: 96px; flex-direction: column; } .mp-lay .m2 { flex: 1; height: 72px; }
.mp-lay i { flex: 0 0 30%; border-radius: 4px; background: color-mix(in srgb, var(--k) 30%, transparent); box-shadow: inset 0 0 0 0.5px var(--k); } .mp-lay i.g { flex: 1; }
.mp-lay .m2 i { flex: 1; animation: lmPad 2.4s ease-in-out infinite; }
.yt-home .dx-float.f3, .yt-hero .dx-float.f3 { left: -28px; bottom: auto; top: 58%; }
.yt-home .dx-float.f1 { right: -10px; top: -6px; }
@media (max-width: 1020px) { .yt-home .dx-float { display: none; } }
@media (min-width: 901px) {
  #mm-urun .mm-tab { padding: 6px 10px; gap: 10px; grid-template-columns: 30px 1fr; }
  #mm-urun .mm-tab .mt-i { width: 30px; height: 30px; font-size: 16px; border-radius: 9px; }
  #mm-urun .mm-tab b, #mm-urun .mm-tab small { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  #mm-urun .mm-tab b { font-size: 13.5px; } #mm-urun .mm-tab small { font-size: 11.5px; }
  #mm-urun .mm-rail { min-width: 260px; }
}

/* ---------- Yayın masası düzeni canlandırması: premium monitörler ve şablon seçici ---------- */
.lm-scr { border-radius: 14px; border: 5px solid #0a0a0c; box-shadow: 0 0 0 1px #3a3a42, 0 0 0 1.5px rgba(255,255,255,.08), 0 40px 70px -34px rgba(0,0,0,.65), 0 18px 30px -22px rgba(0,0,0,.5); overflow: hidden; transition: box-shadow .8s, filter .8s; }
.lm-scr::after { content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 3; background: linear-gradient(118deg, rgba(255,255,255,.09) 0%, rgba(255,255,255,.02) 32%, transparent 33%); }
.lm-neck { width: 11%; height: 7%; background: linear-gradient(90deg, #a9abb3, #e6e7eb 45%, #c4c6cc 60%, #9a9ca4); box-shadow: inset 0 6px 8px -6px rgba(0,0,0,.35); }
.lm-foot { width: 30%; height: 2.6%; border-radius: 3px 3px 10px 10px; background: linear-gradient(180deg, #e8e9ed, #b7b9c0); box-shadow: 0 10px 20px -8px rgba(0,0,0,.4), inset 0 1px 0 #fff; }
.lm-mon { position: absolute; }
.lm-cap { position: absolute; top: calc(100% + 12px); left: 50%; transform: translateX(-50%); display: inline-flex; align-items: center; gap: 6px; font: 600 12px/1 var(--display); letter-spacing: .01em; color: var(--ink-2); white-space: nowrap; }
.lm-cap i { font-size: 15px; color: #5e5ce6; }
.lm-cap em { width: 7px; height: 7px; border-radius: 50%; background: #c7c7cc; transition: background .5s, box-shadow .5s; }
.lm.s2on .lm-cap em { background: #30d158; box-shadow: 0 0 8px #30d158; }
.dx-hero .lm-cap { color: #a1a1a6; } .dx-hero .lm-cap i { color: #8e8cff; }
.lm-bar { position: relative; z-index: 4; }
.lm-live { margin-left: auto; display: inline-flex; align-items: center; gap: 4px; font: 800 7px/1 var(--display); letter-spacing: .12em; color: #fff; padding: 3px 6px; border-radius: 5px; background: #ff2a3d; box-shadow: 0 0 10px rgba(255,42,61,.6); font-style: normal; }
.lm-live i { width: 4px !important; height: 4px !important; background: #fff !important; animation: awBlinkS 1.3s ease-in-out infinite; }
@keyframes awBlinkS { 50% { opacity: .25; } }
.lm-mon.m2 .lm-scr { filter: saturate(.6) brightness(.8); }
.lm.s2on .lm-mon.m2 .lm-scr { filter: none; box-shadow: 0 0 0 1px #3a3a42, 0 0 0 1.5px rgba(255,255,255,.08), 0 0 60px -14px rgba(94,92,230,.75), 0 40px 70px -34px rgba(0,0,0,.65); }
.lm-empty small { font: 600 10px var(--display); letter-spacing: .14em; text-transform: uppercase; }
.lm-b { border-radius: 9px; background: linear-gradient(160deg, rgba(255,255,255,.085), rgba(255,255,255,.03)); box-shadow: inset 0 0 0 0.5px color-mix(in srgb, var(--bc) 50%, transparent), inset 0 1px 0 rgba(255,255,255,.06), 0 10px 20px -14px rgba(0,0,0,.7);
  transition: left 1s cubic-bezier(.2,.9,.15,1), top 1s cubic-bezier(.2,.9,.15,1), width 1s cubic-bezier(.2,.9,.15,1), height 1s cubic-bezier(.2,.9,.15,1), opacity .5s, transform .6s cubic-bezier(.2,.9,.15,1), box-shadow .6s; }
.lm-b.hid { transform: scale(.8) translateY(8%); }
/* Şablon seçici: kayan seçim, ilerleme çizgisi */
.lm-ctl { display: flex; align-items: center; justify-content: center; margin-top: 52px; }
.lm-seg { position: relative; display: flex; gap: 2px; padding: 5px; border-radius: 18px; max-width: 100%; overflow-x: auto; scrollbar-width: none;
  background: rgba(255,255,255,.72); -webkit-backdrop-filter: blur(20px) saturate(1.6); backdrop-filter: blur(20px) saturate(1.6); box-shadow: 0 0 0 0.5px rgba(0,0,0,.08), 0 1px 0 rgba(255,255,255,.9) inset, 0 18px 40px -22px rgba(30,30,60,.35); }
.lm-seg::-webkit-scrollbar { display: none; }
.lm-thumb { position: absolute; left: 0; top: 5px; bottom: 5px; border-radius: 13px; overflow: hidden; background: #fff; box-shadow: 0 0 0 0.5px rgba(0,0,0,.06), 0 6px 16px -6px rgba(30,30,80,.28), 0 1px 2px rgba(0,0,0,.08); transition: transform .55s cubic-bezier(.2,.9,.15,1), width .55s cubic-bezier(.2,.9,.15,1); }
.lm-thumb i { position: absolute; left: 12px; right: 12px; bottom: 3px; height: 2px; border-radius: 2px; background: rgba(94,92,230,.14); overflow: hidden; }
.lm-thumb i::after { content: ""; position: absolute; inset: 0; transform: scaleX(0); transform-origin: left; background: linear-gradient(90deg, #5e5ce6, #0a84ff); }
.lm-thumb.run i::after { animation: lmRun var(--lmiv, 4200ms) linear forwards; }
.lm.paused .lm-thumb i { opacity: 0; }
@keyframes lmRun { to { transform: scaleX(1); } }
.lm-seg button { position: relative; z-index: 1; flex: none; display: inline-flex; align-items: center; gap: 8px; height: 44px; padding: 0 13px 0 10px; border: 0; border-radius: 13px; background: transparent; cursor: pointer; font: 600 13px/1 var(--display); letter-spacing: -0.01em; color: var(--ink-2); transition: color .3s; white-space: nowrap; }
.lm-seg button:hover { color: var(--ink); }
.lm-seg button.on { color: var(--ink); }
.lm-seg button:focus-visible { outline: 2px solid #0a84ff; outline-offset: -2px; }
.lm-gl { display: inline-flex; gap: 2px; flex: none; }
.lm-gl > span { position: relative; width: 25px; height: 16px; border-radius: 4px; background: #1c1c22; box-shadow: inset 0 0 0 1px rgba(0,0,0,.4); overflow: hidden; transition: transform .4s, box-shadow .4s; }
.lm-gl.two .g1 { width: 19px; } .lm-gl .g2 { width: 11px; }
.lm-gl i { position: absolute; border-radius: 1.5px; background: var(--c); opacity: .55; transform: scale(.86); transition: opacity .3s; }
.lm-seg button.on .lm-gl > span { box-shadow: inset 0 0 0 1px rgba(0,0,0,.4), 0 4px 10px -4px rgba(94,92,230,.7); }
.lm-seg button.on .lm-gl i, .lm-seg button:hover .lm-gl i { opacity: 1; }
.lm-play { flex: none; width: 28px; height: 28px; font-size: 11px !important; border-radius: 50%; border: 0; cursor: pointer; display: grid; place-items: center; font-size: 16px; color: var(--ink);
  background: rgba(255,255,255,.72); -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); box-shadow: 0 0 0 0.5px rgba(0,0,0,.08), 0 18px 40px -22px rgba(30,30,60,.35); transition: transform .2s; }
.lm-play:hover { transform: scale(1.06); } .lm-play:active { transform: scale(.96); }
.lm-desc { display: flex; align-items: center; justify-content: center; gap: 10px; margin: 16px auto 0; max-width: 560px; min-height: 28px; text-align: left; font-size: 13.5px; color: var(--ink-2); }
.lm-play i { color: inherit; }
.lm-desc.in span { animation: lmDesc .6s cubic-bezier(.2,.9,.15,1); }
@keyframes lmDesc { from { opacity: 0; transform: translateY(5px); filter: blur(3px); } }
/* koyu hero */
.dx-hero .lm-seg, .dx-hero .lm-play { background: rgba(255,255,255,.07); box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.14), 0 20px 44px -24px rgba(0,0,0,.8); }
.dx-hero .lm-thumb { background: rgba(255,255,255,.14); box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.22), inset 0 1px 0 rgba(255,255,255,.12), 0 8px 20px -8px rgba(0,0,0,.6); }
.dx-hero .lm-thumb i { background: rgba(255,255,255,.12); }
.dx-hero .lm-thumb i::after { background: linear-gradient(90deg, #8e8cff, #64d2ff); }
.dx-hero .lm-seg button { color: #a1a1a6; } .dx-hero .lm-seg button.on, .dx-hero .lm-seg button:hover { color: #fff; }
.dx-hero .lm-play { color: #fff; }
.dx-hero .lm-desc { color: #a1a1a6; }
.dx-hero .lm-gl > span { background: #2a2a32; box-shadow: inset 0 0 0 1px rgba(255,255,255,.1); }
.lm-tabs { display: none !important; }
@media (max-width: 700px) {
  .lm-seg button { height: 42px; padding: 0 10px; gap: 0; font-size: 13px; }
  .lm-seg button b { max-width: 0; overflow: hidden; opacity: 0; transition: max-width .45s cubic-bezier(.2,.9,.15,1), opacity .3s, margin .45s; }
  .lm-seg button.on b { max-width: 120px; opacity: 1; margin-left: 8px; }
  .lm-cap { font-size: 10px; margin-top: 8px; } .lm-cap i { font-size: 12px; }
  .lm-scr { border-width: 3px; border-radius: 9px; }
}
@media (prefers-reduced-motion: reduce) { .lm-b, .lm-thumb { transition: none; } }
/* Kuyruk görünümü demosu: pencere başlığı ve premium ayar çubuğu */
.lq { border-radius: 26px; box-shadow: 0 0 0 0.5px var(--hair), 0 50px 100px -60px rgba(20,20,60,.5), 0 20px 40px -30px rgba(0,0,0,.2); }
.lq-top { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; height: 44px; padding: 0 16px; background: linear-gradient(180deg, #fbfbfd, #f3f3f6); border-bottom: 0.5px solid var(--hair); }
.lq-tl { display: flex; gap: 7px; } .lq-tl i { width: 12px; height: 12px; border-radius: 50%; background: #ff5f57; box-shadow: inset 0 0 0 0.5px rgba(0,0,0,.12); } .lq-tl i:nth-child(2) { background: #febc2e; } .lq-tl i:nth-child(3) { background: #28c840; }
.lq-top b { display: inline-flex; align-items: center; gap: 7px; font: 600 13px var(--display); color: var(--ink); } .lq-top b i { color: #30d158; font-size: 16px; }
.lq-live { justify-self: end; display: inline-flex; align-items: center; gap: 6px; height: 22px; padding: 0 9px; border-radius: 11px; font: 800 10px/1 var(--display); letter-spacing: .12em; color: #fff; background: #ff2a3d; box-shadow: 0 4px 14px -4px rgba(255,42,61,.7); }
.lq-live i { width: 6px; height: 6px; border-radius: 50%; background: #fff; animation: awBlinkS 1.3s ease-in-out infinite; }
.lq-ctl { gap: 18px 22px; padding: 16px 18px 18px; background: #fff; align-items: flex-end; }
.lq-grp { display: grid; gap: 7px; }
.lq-grp > small { font: 700 10.5px/1 var(--display); letter-spacing: .1em; text-transform: uppercase; color: var(--ink-3, #8e8e93); padding-left: 2px; }
.lq-accg { margin-left: auto; }
.lq-seg { position: relative; padding: 3px; border-radius: 13px; gap: 0; background: rgba(118,118,128,.12); box-shadow: inset 0 0 0 0.5px rgba(0,0,0,.04); }
.lq-th { position: absolute; left: 3px; top: 3px; bottom: 3px; border-radius: 10px; background: #fff; box-shadow: 0 0 0 0.5px rgba(0,0,0,.05), 0 3px 10px -2px rgba(0,0,0,.16), 0 1px 2px rgba(0,0,0,.08); transition: transform .45s cubic-bezier(.2,.9,.15,1), width .45s cubic-bezier(.2,.9,.15,1); }
.lq-seg button { position: relative; z-index: 1; display: inline-flex; align-items: center; gap: 7px; height: 38px; padding: 0 16px; border-radius: 10px; font: 600 13.5px var(--display); background: transparent !important; box-shadow: none !important; color: var(--ink-2); transition: color .25s; }
.lq-seg button i { font-size: 16px; color: var(--ink-3, #8e8e93); transition: color .25s; }
.lq-seg button.on { color: var(--ink); } .lq-seg button.on i { color: #0a84ff; }
.lq-seg button:focus-visible { outline: 2px solid #0a84ff; outline-offset: -2px; }
.lq-acc { gap: 8px; margin: 0; height: 44px; align-items: center; padding: 0 4px; }
.lq-acc button { position: relative; width: 30px; height: 30px; border: 0; display: grid; place-items: center; color: #fff; font-size: 13px; background: radial-gradient(circle at 35% 30%, color-mix(in srgb, var(--c) 70%, #fff), var(--c) 60%); box-shadow: inset 0 0 0 0.5px rgba(0,0,0,.15), 0 4px 10px -4px var(--c); transition: transform .25s cubic-bezier(.2,.9,.15,1), box-shadow .25s; }
.lq-acc button i { opacity: 0; transform: scale(.5); transition: opacity .2s, transform .3s cubic-bezier(.2,.9,.15,1); }
.lq-acc button:hover { transform: translateY(-2px); }
.lq-acc button.on { box-shadow: 0 0 0 2.5px #fff, 0 0 0 4.5px var(--c), 0 8px 18px -6px var(--c); } .lq-acc button.on i { opacity: 1; transform: none; }
@media (max-width: 700px) { .lq-accg { margin-left: 0; } .lq-ctl { gap: 14px; } .lq-seg button { padding: 0 11px; height: 36px; font-size: 13px; } .lq-top { grid-template-columns: auto 1fr auto; gap: 10px; } .lq-top b { justify-self: center; } }
.lay-home .lm-desc { font-size: 13.5px; line-height: 1.45; margin: 16px auto 0; color: var(--ink-2); }
.lq-acc button i { font-size: 15px; }
.lq-acc button i::before { opacity: 0 !important; }

/* ---------- hero slider ---------- */
.hs { position: relative; margin: 20px auto 6px; max-width: 1040px; }
.hs-stack { display: grid; }
.hs-slide { grid-area: 1 / 1; display: flex; flex-direction: column; align-items: center; opacity: 0; visibility: hidden; transform: translateY(14px) scale(.985); filter: blur(6px); transition: opacity .7s cubic-bezier(.2,.7,.2,1), transform .9s cubic-bezier(.2,.7,.2,1), filter .7s, visibility 0s .9s; pointer-events: none; }
.hs-slide.on { opacity: 1; visibility: visible; transform: none; filter: none; transition-delay: .12s, .12s, .12s, 0s; pointer-events: auto; }
.hs-slide.out { transform: translateY(-14px) scale(.985); }
.hs-kw { display: inline-flex; align-items: center; gap: 8px; font: 650 13px/1 var(--font); letter-spacing: .08em; text-transform: uppercase; color: var(--ink-2); padding: 8px 14px 8px 8px; border-radius: 999px; background: rgba(255,255,255,.7); box-shadow: inset 0 0 0 .5px rgba(0,0,0,.08), 0 6px 20px -10px rgba(0,0,0,.18); backdrop-filter: blur(12px); }
.hs-kw i { width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; font-size: 13px; color: #fff; background: linear-gradient(135deg, var(--a), var(--b)); box-shadow: 0 4px 12px -4px var(--a); }
.hs-slide h1, .hs-slide .hs-h { font: 800 clamp(36px, 5.4vw, 68px)/1.03 var(--display); letter-spacing: -0.045em; margin: 22px auto 18px; max-width: 22ch; text-wrap: balance; color: var(--ink); }
.hs-g { display: block; background: linear-gradient(100deg, var(--a), var(--b) 55%, var(--a)); background-size: 200% 100%; -webkit-background-clip: text; background-clip: text; color: transparent; animation: hsGrad 6s ease-in-out infinite; padding-bottom: .06em; }
@keyframes hsGrad { 50% { background-position: 100% 0; } }
.hs-slide .sub { margin: 0 auto 4px; max-width: 54ch; }
.hs-rail { display: flex; justify-content: center; align-items: center; gap: 6px; margin: 26px auto 30px; flex-wrap: wrap; }
.hs-dot { appearance: none; border: 0; cursor: pointer; display: inline-flex; flex-direction: column; align-items: stretch; gap: 7px; padding: 8px 12px 9px; min-width: 104px; border-radius: 14px; background: transparent; color: var(--ink-3); font: 600 12.5px/1 var(--font); transition: background .3s, color .3s; }
.hs-dot span { text-align: left; }
.hs-dot i { display: block; height: 3px; border-radius: 3px; background: rgba(0,0,0,.09); overflow: hidden; }
.hs-dot i b { display: block; height: 100%; width: 0; background: var(--a); border-radius: inherit; }
.hs-dot.on { color: var(--ink); background: rgba(255,255,255,.75); box-shadow: inset 0 0 0 .5px rgba(0,0,0,.07), 0 8px 24px -14px rgba(0,0,0,.25); }
.hs-dot.on i b { animation: hsFill var(--dur, 7s) linear forwards; }
.hs-dot.done i b { width: 100%; }
.hs.paused .hs-dot.on i b { animation-play-state: paused; }
@keyframes hsFill { to { width: 100%; } }
.hs-dot:hover { color: var(--ink); }
.hs-dot:focus-visible, .hs-pp:focus-visible { outline: 2px solid var(--a, #0071e3); outline-offset: 2px; }
.hs-pp { appearance: none; border: 0; cursor: pointer; width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; color: var(--ink-2); background: rgba(0,0,0,.05); margin-left: 4px; transition: background .2s; }
.hs-pp:hover { background: rgba(0,0,0,.09); }
.hero::after { content: ""; position: absolute; left: 50%; top: 90px; width: min(900px, 90vw); height: 420px; transform: translateX(-50%); background: radial-gradient(closest-side, var(--hs-a, rgba(255,55,95,.22)), transparent); opacity: .55; filter: blur(30px); pointer-events: none; transition: background .9s; z-index: 0; }
.hero > .wrap { z-index: 1; }
@media (max-width: 720px) {
  .hs-rail { gap: 4px; margin: 20px auto 24px; }
  .hs-dot { min-width: 0; flex: 1 1 0; padding: 7px 6px 8px; font-size: 11px; }
  .hs-dot span { text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .hs-kw { font-size: 11px; letter-spacing: .06em; }
}
@media (max-width: 460px) { .hs-dot span { display: none; } .hs-dot { padding: 10px 4px; } }
@media (prefers-reduced-motion: reduce) { .hs-slide { transition: opacity .3s; transform: none !important; filter: none !important; } .hs-g { animation: none; } }

/* ---------- dil modülü (ana sayfa bölümü + canlandırma) ---------- */
.lg-home { position: relative; overflow: hidden; isolation: isolate; padding: 120px 0; background: #05050a; color: #f5f5f7; }
.lg-home::before { content: ""; position: absolute; inset: -30% -10%; z-index: -1; background: radial-gradient(40% 50% at 15% 30%, rgba(10,132,255,.32), transparent 70%), radial-gradient(35% 45% at 85% 70%, rgba(191,90,242,.28), transparent 70%), radial-gradient(30% 40% at 60% 10%, rgba(48,209,88,.14), transparent 70%); filter: blur(10px); animation: lgAur 18s ease-in-out infinite alternate; }
@keyframes lgAur { to { transform: translate3d(-3%, 2%, 0) rotate(4deg) scale(1.05); } }
.lg-glyphs { position: absolute; inset: 0; z-index: -1; pointer-events: none; }
.lg-glyphs span { position: absolute; font: 700 clamp(40px, 6vw, 96px)/1 var(--display); color: rgba(255,255,255,.045); animation: lgFloat 14s ease-in-out infinite; }
.lg-glyphs span:nth-child(1) { left: 4%; top: 12%; } .lg-glyphs span:nth-child(2) { left: 18%; top: 72%; animation-delay: -2s; } .lg-glyphs span:nth-child(3) { left: 36%; top: 6%; animation-delay: -4s; }
.lg-glyphs span:nth-child(4) { left: 48%; top: 82%; animation-delay: -6s; } .lg-glyphs span:nth-child(5) { left: 62%; top: 4%; animation-delay: -8s; } .lg-glyphs span:nth-child(6) { left: 92%; top: 18%; animation-delay: -1s; }
.lg-glyphs span:nth-child(7) { left: 86%; top: 80%; animation-delay: -3s; } .lg-glyphs span:nth-child(8) { left: 8%; top: 44%; animation-delay: -5s; } .lg-glyphs span:nth-child(9) { left: 72%; top: 48%; animation-delay: -7s; }
.lg-glyphs span:nth-child(10) { left: 28%; top: 38%; animation-delay: -9s; } .lg-glyphs span:nth-child(11) { left: 56%; top: 30%; animation-delay: -11s; } .lg-glyphs span:nth-child(12) { left: 96%; top: 56%; animation-delay: -12s; }
@keyframes lgFloat { 50% { transform: translateY(-18px) rotate(-4deg); color: rgba(255,255,255,.08); } }
.lg-home-g { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.2fr); gap: 56px; align-items: center; }
.lg-home h2 { font: 800 clamp(36px, 4.6vw, 60px)/1.04 var(--display); letter-spacing: -0.045em; margin: 0 0 22px; }
.lg-grad { background: linear-gradient(100deg, #64d2ff, #5e5ce6 45%, #bf5af2 70%, #64d2ff); background-size: 220% 100%; -webkit-background-clip: text; background-clip: text; color: transparent; animation: hsGrad 7s ease-in-out infinite; }
.lg-home p { color: #a1a1a6; font-size: 18px; line-height: 1.55; margin: 0 0 22px; }
.lg-home ul { list-style: none; padding: 0; margin: 0 0 28px; display: grid; gap: 10px; }
.lg-home li { display: flex; gap: 10px; align-items: center; color: #e5e5ea; font-size: 16px; }
.lg-home li i { color: #64d2ff; }
.lg-badge { display: inline-flex; align-items: center; gap: 6px; padding: 5px 11px; border-radius: 20px; color: #fff; font-size: 13px; background: linear-gradient(135deg, #0a84ff, #5e5ce6); }

.lgm { --lw: #1c1c22; position: relative; }
.lgm-win { position: relative; border-radius: 16px; background: linear-gradient(180deg, #1d1d24, #141419); box-shadow: 0 0 0 .5px rgba(255,255,255,.14), 0 40px 90px -30px rgba(0,0,0,.8), 0 0 80px -20px rgba(94,92,230,.35); overflow: hidden; color: #f5f5f7; font: 13px/1.3 var(--font); transition: box-shadow .4s; }
.lgm-win > * { transition: opacity .26s, filter .26s, transform .26s; }
.lgm-win.sw > * { opacity: .15; filter: blur(5px); transform: translateY(2px); }
.lgm-win[dir=rtl] { font-family: "Segoe UI", Tahoma, var(--font); }
.lgm-mb { display: flex; align-items: center; gap: 14px; padding: 7px 14px; background: rgba(255,255,255,.04); border-bottom: .5px solid rgba(255,255,255,.08); font-size: 12px; color: #c7c7cc; white-space: nowrap; overflow: hidden; }
.lgm-mb b { color: #fff; }
.lgm-lg { width: 18px; height: 18px; border-radius: 5px; display: grid; place-items: center; background: linear-gradient(135deg, #ff375f, #ff9f0a); color: #fff; font-size: 11px; }
.lgm-sp { flex: 1; }
.lgm-dt { color: #8e8e93; font-variant-numeric: tabular-nums; }
.lgm-top { display: flex; align-items: center; gap: 12px; padding: 12px 16px; border-bottom: .5px solid rgba(255,255,255,.07); }
.lgm-lights { display: inline-flex; gap: 6px; } .lgm-lights i { width: 10px; height: 10px; border-radius: 50%; background: #ff5f57; } .lgm-lights i:nth-child(2) { background: #febc2e; } .lgm-lights i:nth-child(3) { background: #28c840; }
.lgm-ttl b { display: block; font-size: 14px; } .lgm-ttl small { color: #8e8e93; font-size: 11px; }
.lgm-seg { display: inline-flex; padding: 2px; border-radius: 9px; background: rgba(255,255,255,.07); font-size: 11.5px; }
.lgm-seg span { padding: 5px 10px; border-radius: 7px; color: #a1a1a6; white-space: nowrap; } .lgm-seg .on { background: rgba(48,209,88,.18); color: #30d158; box-shadow: inset 0 0 0 .5px rgba(48,209,88,.4); }
.lgm-tally { display: inline-flex; align-items: center; gap: 6px; padding: 5px 10px; border-radius: 8px; background: #ff3b30; color: #fff; font: 700 11px/1 var(--font); letter-spacing: .04em; white-space: nowrap; box-shadow: 0 0 18px -2px rgba(255,59,48,.7); }
.lgm-tally i { width: 6px; height: 6px; border-radius: 50%; background: #fff; animation: lgBlink 1.4s infinite; } @keyframes lgBlink { 50% { opacity: .3; } }
.lgm-pl { display: flex; align-items: center; gap: 12px; padding: 14px 16px 10px; }
.lgm-art { width: 46px; height: 46px; border-radius: 12px; background: linear-gradient(135deg, #0a84ff, #5e5ce6); display: grid; place-items: center; flex: none; }
.lgm-art .eq { display: inline-flex; gap: 2px; align-items: flex-end; height: 18px; } .lgm-art .eq i { width: 3px; background: #fff; border-radius: 2px; animation: lgEq 1s ease-in-out infinite; } .lgm-art .eq i:nth-child(2) { animation-delay: -.3s; } .lgm-art .eq i:nth-child(3) { animation-delay: -.6s; } .lgm-art .eq i:nth-child(4) { animation-delay: -.15s; }
@keyframes lgEq { 0%, 100% { height: 5px; } 50% { height: 18px; } }
.lgm-np { min-width: 0; display: flex; flex-direction: column; } .lgm-np small { color: #64d2ff; font-size: 10.5px; font-weight: 600; letter-spacing: .03em; } .lgm-np b { font-size: 15px; } .lgm-np em { font-style: normal; color: #8e8e93; font-size: 12px; }
.lgm-btn { width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; background: #fff; color: #111; flex: none; }
.lgm-nx, .lgm-talk { display: inline-flex; align-items: center; gap: 6px; padding: 7px 11px; border-radius: 9px; font-size: 12px; font-weight: 600; white-space: nowrap; }
.lgm-nx { background: rgba(48,209,88,.16); color: #30d158; } .lgm-talk { background: rgba(255,255,255,.08); color: #e5e5ea; }
.lgm-prog { margin: 0 16px 12px; height: 3px; border-radius: 3px; background: rgba(255,255,255,.08); overflow: hidden; }
.lgm-prog i { display: block; height: 100%; width: 38%; background: linear-gradient(90deg, #0a84ff, #64d2ff); border-radius: inherit; animation: lgProg 12s linear infinite; }
.lgm-win[dir=rtl] .lgm-prog { transform: scaleX(-1); }
@keyframes lgProg { from { width: 8%; } to { width: 96%; } }
.lgm-body { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 12px; padding: 0 16px 16px; }
.lgm-q { border-radius: 12px; background: rgba(255,255,255,.035); box-shadow: inset 0 0 0 .5px rgba(255,255,255,.07); padding: 4px 0 6px; min-width: 0; }
.lgm-ph { display: flex; align-items: center; gap: 7px; padding: 8px 12px; font-weight: 600; font-size: 12px; color: #e5e5ea; } .lgm-ph em { font-style: normal; color: #8e8e93; font-weight: 500; font-variant-numeric: tabular-nums; }
.lgm-row { display: flex; align-items: center; gap: 10px; padding: 6px 12px; } .lgm-row.now { background: rgba(10,132,255,.14); box-shadow: inset 3px 0 0 #0a84ff; } .lgm-win[dir=rtl] .lgm-row.now { box-shadow: inset -3px 0 0 #0a84ff; }
.lgm-row .cd { width: 20px; height: 20px; border-radius: 6px; display: grid; place-items: center; font: 700 10.5px/1 var(--font); color: #111; background: var(--k); flex: none; }
.lgm-row .tx { min-width: 0; flex: 1; display: flex; flex-direction: column; } .lgm-row .tx b { font-size: 12.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .lgm-row .tx small { color: #8e8e93; font-size: 11px; }
.lgm-row em { font-style: normal; color: #a1a1a6; font-size: 11.5px; font-variant-numeric: tabular-nums; }
.lgm-side { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.lgm-ad { display: flex; gap: 10px; align-items: center; padding: 12px; border-radius: 12px; background: rgba(255,159,10,.1); box-shadow: inset 0 0 0 .5px rgba(255,159,10,.3); color: #ff9f0a; } .lgm-ad i { font-size: 22px; } .lgm-ad b { display: block; color: #fff; font-size: 12.5px; } .lgm-ad small { color: #ffb340; font-size: 12px; font-variant-numeric: tabular-nums; }
.lgm-pads { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; flex: 1; }
.lgm-pads span { border-radius: 9px; display: grid; place-items: center; font: 700 11px/1 var(--font); color: #fff; min-height: 36px; background: linear-gradient(160deg, hsl(var(--h) 70% 52% / .55), hsl(var(--h) 70% 40% / .35)); box-shadow: inset 0 0 0 .5px hsl(var(--h) 80% 70% / .4); }
.lgm-chips { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin-top: 18px; }
.lgm-chip { appearance: none; border: 0; cursor: pointer; padding: 7px 12px; border-radius: 999px; font: 600 13px/1 var(--font); color: #c7c7cc; background: rgba(255,255,255,.06); box-shadow: inset 0 0 0 .5px rgba(255,255,255,.12); transition: background .25s, color .25s, box-shadow .25s, transform .25s; }
.lgm-chip:hover { color: #fff; background: rgba(255,255,255,.1); }
.lgm-chip.on { color: #fff; background: linear-gradient(135deg, #0a84ff, #5e5ce6); box-shadow: 0 6px 18px -6px rgba(10,132,255,.7); transform: translateY(-1px); }
.lgm.light .lgm-chip { color: var(--ink-2); background: #fff; box-shadow: inset 0 0 0 .5px var(--hair-2); } .lgm.light .lgm-chip.on { color: #fff; background: linear-gradient(135deg, #0a84ff, #5e5ce6); }
@media (max-width: 1020px) { .lg-home-g { grid-template-columns: 1fr; gap: 40px; } .lg-home { padding: 80px 0; } }
@media (max-width: 620px) {
  .lgm-body { grid-template-columns: 1fr; } .lgm-side { display: none; }
  .lgm-mb span:not(.lgm-lg):not(.lgm-dt):not(.lgm-sp) { display: none; }
  .lgm-talk, .lgm-seg span:not(.on) { display: none; }
  .lgm-top { gap: 8px; padding: 10px 12px; } .lgm-pl { padding: 12px 12px 8px; gap: 8px; } .lgm-body { padding: 0 12px 12px; } .lgm-prog { margin: 0 12px 10px; }
  .lgm-chip { padding: 6px 10px; font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) { .lg-home::before, .lg-glyphs span, .lgm-art .eq i, .lgm-prog i { animation: none; } }

/* ---------- çok dilli radyo otomasyonu sayfası ---------- */
.lgp-hero { padding-bottom: 50px; }
.lgp-aura i:nth-child(1) { background: radial-gradient(closest-side, rgba(10,132,255,.42), rgba(10,132,255,.12) 55%, transparent); }
.lgp-aura i:nth-child(2) { background: radial-gradient(closest-side, rgba(191,90,242,.36), rgba(191,90,242,.1) 55%, transparent); }
.lgp-aura i:nth-child(3) { background: radial-gradient(closest-side, rgba(100,210,255,.26), rgba(100,210,255,.08) 55%, transparent); }
.lgp-hero-g { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.2fr); gap: 50px; align-items: center; }
.lgp-hero h1 { font: 800 clamp(38px, 4.6vw, 62px)/1.04 var(--display); letter-spacing: -0.05em; margin: 0 0 22px; }
.lgp-hello { display: block; font: 700 clamp(22px, 2.4vw, 30px)/1.2 var(--display); letter-spacing: -0.02em; color: #64d2ff; margin-bottom: 10px; min-height: 1.25em; transition: opacity .28s, filter .28s, transform .28s; }
.lgp-hello.sw { opacity: 0; filter: blur(6px); transform: translateY(6px); }
.lgp-hero .lg-glyphs span { color: rgba(255,255,255,.035); }
.lgp-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin-top: 40px; }
.lgp-card { position: relative; display: flex; flex-direction: column; gap: 6px; padding: 22px 20px 18px; border-radius: 22px; background: #fff; box-shadow: 0 0 0 .5px var(--hair), 0 24px 50px -36px rgba(0,0,0,.35); overflow: hidden; transition: transform .35s var(--ease), box-shadow .35s; transition-delay: var(--d, 0ms); }
.lgp-card::after { content: ""; position: absolute; right: -60px; top: -60px; width: 160px; height: 160px; border-radius: 50%; background: radial-gradient(circle, color-mix(in srgb, var(--c) 20%, transparent), transparent 70%); }
.lgp-card:hover { transform: translateY(-4px); box-shadow: 0 0 0 .5px var(--hair-2), 0 30px 60px -30px rgba(0,0,0,.35); }
.lgp-c-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.lgp-code { font: 700 11px/1 var(--font); letter-spacing: .08em; padding: 5px 8px; border-radius: 7px; color: var(--c); background: color-mix(in srgb, var(--c) 12%, transparent); }
.lgp-rtl { display: inline-flex; gap: 4px; align-items: center; font: 600 11px/1 var(--font); color: #28b446; }
.lgp-native { font: 750 25px/1.2 var(--display); letter-spacing: -0.02em; margin-top: 8px; }
.lgp-tr { color: var(--ink-3); font-size: 13px; }
.lgp-desk { display: inline-flex; gap: 6px; align-items: center; margin-top: 10px; padding-top: 12px; border-top: .5px solid var(--hair); font-size: 14px; font-weight: 600; color: var(--ink); }
.lgp-desk i { color: var(--c); }
.lgp-date { font-style: normal; font-size: 13px; color: var(--ink-2); font-variant-numeric: tabular-nums; min-height: 1.4em; }
.lgp-card [dir=rtl] { text-align: right; } .lgp-card .lgp-desk[dir=rtl] { justify-content: flex-end; flex-direction: row-reverse; }
.lgp-tiles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: 40px; }
.lgp-tile { padding: 26px 24px; border-radius: 24px; background: #fff; box-shadow: 0 0 0 .5px var(--hair), 0 24px 50px -38px rgba(0,0,0,.35); }
.lgp-tile .ti, .lgp-ti { width: 44px; height: 44px; border-radius: 13px; display: grid; place-items: center; font-size: 24px; color: var(--c); background: color-mix(in srgb, var(--c) 13%, transparent); margin-bottom: 14px; }
.lgp-tile h3 { font: 750 20px/1.2 var(--display); letter-spacing: -0.02em; margin: 0 0 6px; }
.lgp-tile p { margin: 0; color: var(--ink-2); font-size: 15px; }
.lgp-rtl-g { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: 56px; align-items: center; }
.lgp-mirror { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.lgp-mw { border-radius: 16px; background: linear-gradient(180deg, #1d1d24, #141419); color: #f5f5f7; box-shadow: 0 0 0 .5px rgba(0,0,0,.2), 0 30px 60px -30px rgba(0,0,0,.5); overflow: hidden; font: 12.5px/1.3 var(--font); }
.lgp-mw[dir=rtl] { font-family: "Segoe UI", Tahoma, var(--font); }
.lgp-mw-b { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-bottom: .5px solid rgba(255,255,255,.08); } .lgp-mw-b b { flex: 1; font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lgp-mw .lgm-tally { padding: 4px 8px; font-size: 10px; }
.lgp-mw-p { display: flex; align-items: center; gap: 10px; padding: 12px; } .lgp-mw-p .lgm-np { flex: 1; } .lgp-mw .lgm-art { width: 38px; height: 38px; }
.lgp-mw .lgm-prog { margin: 0 12px 10px; }
.lgp-mw[dir=rtl] .lgm-prog { transform: scaleX(-1); }
.lgp-mw-q { padding: 0 6px 10px; } .lgp-mw-q small { display: block; padding: 4px 6px 6px; color: #8e8e93; font-weight: 600; }
.lgp-mw .lgm-row { padding: 6px; border-radius: 8px; }
.lgp-modes .lgp-ti { margin-bottom: 12px; }
.lgp-std { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-top: 36px; }
.lgp-s { display: flex; align-items: center; gap: 12px; padding: 16px; border-radius: 18px; background: #fff; box-shadow: 0 0 0 .5px var(--hair); }
.lgp-s span { width: 38px; height: 38px; border-radius: 11px; flex: none; display: grid; place-items: center; font-size: 20px; color: var(--c); background: color-mix(in srgb, var(--c) 12%, transparent); }
.lgp-s b { font-size: 14.5px; font-weight: 600; line-height: 1.3; }
@media (max-width: 1020px) { .lgp-hero-g, .lgp-rtl-g { grid-template-columns: 1fr; gap: 36px; } .lgp-grid, .lgp-std { grid-template-columns: repeat(2, minmax(0, 1fr)); } .lgp-tiles { grid-template-columns: 1fr 1fr; } }
@media (max-width: 620px) { .lgp-grid, .lgp-std, .lgp-tiles, .lgp-mirror { grid-template-columns: 1fr; } .lgp-native { font-size: 22px; } }
.lg-tile { min-height: 0; text-decoration: none; color: inherit; background: linear-gradient(120deg, #fff 40%, color-mix(in srgb, #0a84ff 7%, #fff)); }
.lg-tile:hover { box-shadow: 0 24px 50px -36px rgba(10,132,255,.6); }
.lg-tile-l { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 14px; }
.lg-tile-l span { padding: 6px 11px; border-radius: 999px; font-size: 13px; font-weight: 600; color: var(--ink-2); background: #fff; box-shadow: inset 0 0 0 .5px var(--hair-2); }
.mp-lang { display: flex; flex-wrap: wrap; gap: 5px; padding: 10px; border-radius: 14px; background: #050507; box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.1); }
.mp-lang span { padding: 4px 8px; border-radius: 999px; font-size: 11.5px; font-weight: 600; color: #c7c7cc; background: rgba(255,255,255,.07); }
.mp-lang span.on { color: #fff; background: linear-gradient(135deg, #0a84ff, #5e5ce6); }

/* =========================================================
   RADYOMASYON TV — kontrol odası vitrini (.tvm) ve sayfaları (.tvh, .tvp)
   ========================================================= */
.tvm { --bg: #0d0d12; --pn: #16161d; --ln: rgba(255,255,255,.08); position: relative; border-radius: 20px; padding: 10px; background: linear-gradient(180deg, #1d1d25, #0b0b10); color: #e5e5ea; font-size: 12px; box-shadow: 0 70px 130px -50px rgba(0,0,0,.95), inset 0 0 0 0.5px rgba(255,255,255,.16), 0 0 0 1px rgba(0,0,0,.5); user-select: none; -webkit-user-select: none; }
.tvm canvas { display: block; width: 100%; height: 100%; }
.tvm-bar { display: flex; align-items: center; gap: 12px; padding: 4px 6px 10px; white-space: nowrap; overflow: hidden; }
.tvm-brand { display: flex; align-items: center; gap: 8px; } .tvm-brand b { font: 700 13px var(--display); color: #fff; }
.tvm-logo { width: 22px; height: 22px; border-radius: 6px; display: grid; place-items: center; background: linear-gradient(135deg, #ff375f, #bf5af2); color: #fff; font-size: 13px; }
.tvm-brand em { font-style: normal; font-size: 10.5px; font-weight: 700; color: #ff8fab; background: rgba(255,55,95,.14); padding: 2px 7px; border-radius: 6px; }
.tvm-link { color: #64d2ff; display: inline-flex; gap: 5px; align-items: center; font-weight: 600; }
.tvm-np { display: inline-flex; gap: 6px; align-items: center; color: #a1a1a6; } .tvm-np b { color: #fff; font-weight: 600; }
.tvm-sp { flex: 1; }
.tvm-rec, .tvm-live { display: inline-flex; align-items: center; gap: 6px; height: 24px; padding: 0 10px; border-radius: 12px; font-weight: 700; font-size: 11px; }
.tvm-rec { background: rgba(255,255,255,.06); color: #e5e5ea; } .tvm-rec i { width: 8px; height: 8px; border-radius: 50%; background: #ff453a; animation: tvBlink 1.6s ease-in-out infinite; }
.tvm-live { background: #ff2d55; color: #fff; box-shadow: 0 6px 18px -6px rgba(255,45,85,.9); } .tvm-live i { width: 7px; height: 7px; border-radius: 50%; background: #fff; animation: tvBlink 1.2s ease-in-out infinite; } .tvm-live b { font-variant-numeric: tabular-nums; font-weight: 600; opacity: .9; }
@keyframes tvBlink { 50% { opacity: .25; } }
.tvm-stage { display: grid; grid-template-columns: minmax(0, .82fr) 92px minmax(0, 1.25fr); gap: 10px; align-items: start; }
.tvm-mon { border-radius: 12px; padding: 6px; background: var(--pn); box-shadow: inset 0 0 0 0.5px var(--ln); }
.tvm-mh { display: flex; align-items: center; gap: 8px; padding: 2px 4px 6px; font-size: 11px; color: #a1a1a6; white-space: nowrap; overflow: hidden; }
.tvm-mh b { font-size: 10.5px; letter-spacing: .08em; } .pvw .tvm-mh b { color: #30d158; } .pgm .tvm-mh b { color: #ff375f; }
.tvm-mh em { margin-left: auto; font-style: normal; font-size: 10px; font-weight: 800; color: #fff; background: #ff2d55; padding: 1px 6px; border-radius: 4px; }
.tvm-scr { position: relative; aspect-ratio: 16 / 9; border-radius: 8px; overflow: hidden; background: #000; }
.pvw .tvm-scr { box-shadow: 0 0 0 2px #30d158; } .pgm .tvm-scr { box-shadow: 0 0 0 2px #ff2d55, 0 0 40px -10px rgba(255,45,85,.6); }
.tvm-tr { display: grid; gap: 7px; padding-top: 24px; }
.tvm-btn { display: grid; place-items: center; height: 34px; border-radius: 9px; font: 800 12px var(--display); letter-spacing: .06em; cursor: pointer; transition: transform .15s; }
.tvm-btn:active { transform: scale(.96); }
.tvm-btn.cut { background: linear-gradient(180deg, #ff4d6d, #e0244a); color: #fff; box-shadow: 0 8px 18px -8px rgba(255,45,85,.9); }
.tvm-btn.auto { background: #2a2a33; color: #fff; box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.14); }
.tvm-btn.ftb { background: transparent; color: #8e8e93; box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.14); height: 28px; font-size: 11px; }
.tvm-tbar { position: relative; height: 8px; border-radius: 4px; background: #2a2a33; margin: 6px 4px; }
.tvm-tbar i { position: absolute; left: -4px; top: -5px; width: 18px; height: 18px; border-radius: 50%; background: #ff375f; box-shadow: 0 2px 8px rgba(0,0,0,.6); }
.tvm-tbar i { left: 0; margin-left: -9px; }
.tvm-ts { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; }
.tvm-ts span { font-size: 10px; text-align: center; padding: 4px 0; border-radius: 6px; background: rgba(255,255,255,.04); color: #a1a1a6; box-shadow: inset 0 0 0 0.5px var(--ln); }
.tvm-ts span.on { color: #ff8fab; box-shadow: inset 0 0 0 1px rgba(255,55,95,.5); background: rgba(255,55,95,.1); }
.tvm-low { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 10px; margin-top: 10px; }
.tvm-srcs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; padding: 8px; border-radius: 12px; background: var(--pn); box-shadow: inset 0 0 0 0.5px var(--ln); }
.tvm-src { position: relative; border-radius: 9px; padding: 4px; background: #1e1e26; cursor: pointer; box-shadow: inset 0 0 0 1px transparent; transition: box-shadow .2s; }
.tvm-src:hover { background: #24242e; }
.tvm-src.pvw { box-shadow: inset 0 0 0 2px #30d158; } .tvm-src.pgm { box-shadow: inset 0 0 0 2px #ff2d55; }
.tvm-th { aspect-ratio: 16 / 9; border-radius: 6px; overflow: hidden; background: #000; }
.tvm-sn { position: absolute; left: 8px; top: 8px; z-index: 1; width: 18px; height: 18px; border-radius: 5px; display: grid; place-items: center; font-size: 10.5px; font-weight: 800; background: rgba(0,0,0,.6); color: #fff; }
.tvm-src.pgm .tvm-sn { background: #ff2d55; } .tvm-src.pvw .tvm-sn { background: #30d158; }
.tvm-sl { display: flex; gap: 5px; align-items: center; padding: 5px 2px 1px; font-size: 10.5px; color: #c7c7cc; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .tvm-sl i { color: #8e8e93; flex: none; }
.tvm-mix { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; padding: 8px; border-radius: 12px; background: var(--pn); box-shadow: inset 0 0 0 0.5px var(--ln); }
.tvm-ch { display: grid; gap: 6px; justify-items: center; padding: 6px 4px; border-radius: 9px; background: #1e1e26; }
.tvm-cn { display: flex; gap: 4px; align-items: center; font-size: 10px; color: #c7c7cc; white-space: nowrap; overflow: hidden; max-width: 100%; } .tvm-cn i { color: var(--k); flex: none; }
.tvm-fd { display: flex; gap: 8px; height: 92px; }
.tvm-vu { position: relative; width: 6px; border-radius: 3px; background: rgba(255,255,255,.06); overflow: hidden; }
.tvm-vu i { position: absolute; inset: 0; transform-origin: bottom; background: linear-gradient(0deg, #30d158 0%, #30d158 60%, #ffd60a 80%, #ff453a 100%); transition: transform .08s linear; }
.tvm-rail { position: relative; width: 4px; border-radius: 2px; background: #2c2c35; }
.tvm-rail i { position: absolute; left: -7px; width: 18px; height: 10px; border-radius: 3px; bottom: calc(var(--f) - 5px); background: linear-gradient(180deg, #f2f2f7, #9a9aa2); box-shadow: 0 2px 5px rgba(0,0,0,.6); }
.tvm-cb { display: flex; gap: 4px; } .tvm-cb b { font-size: 9px; font-weight: 800; padding: 2px 5px; border-radius: 4px; background: rgba(255,255,255,.06); color: #8e8e93; }
.tvm-cb b.m.on { background: #ff453a; color: #fff; } .tvm-cb b.a.on { background: rgba(10,132,255,.25); color: #64d2ff; }
@media (max-width: 900px) {
  .tvm-stage { grid-template-columns: 1fr; } .tvm-tr { grid-template-columns: 1fr 1fr 2fr; padding: 0; align-items: center; } .tvm-ts, .tvm-btn.ftb { display: none; } .tvm-tbar { width: auto; }
  .tvm-mon.pvw { display: none; } .tvm-low { grid-template-columns: 1fr; } .tvm-np, .tvm-link { display: none; }
}
@media (max-width: 520px) { .tvm-srcs { grid-template-columns: repeat(2, minmax(0, 1fr)); } .tvm-rec { display: none; } .tvm-fd { height: 70px; } }
@media (prefers-reduced-motion: reduce) { .tvm-rec i, .tvm-live i { animation: none; } }

/* ---------- ana sayfa bölümü ---------- */
.tv-grad { background: linear-gradient(100deg, #ff375f 0%, #bf5af2 45%, #64d2ff 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.tv-badge { display: inline-flex; align-items: center; gap: 6px; height: 24px; padding: 0 9px; border-radius: 7px; font: 800 12.5px/1 var(--display); color: #fff; background: linear-gradient(135deg, #ff375f, #bf5af2); box-shadow: 0 6px 16px -6px rgba(191,90,242,.8); white-space: nowrap; }
.tvh { position: relative; overflow: hidden; isolation: isolate; background: #05050a; color: #f5f5f7; padding: 110px 0 100px; }
.tvh .dx-aura i:nth-child(1) { background: radial-gradient(closest-side, rgba(255,55,95,.36), rgba(255,55,95,.1) 55%, transparent); }
.tvh .dx-aura i:nth-child(2) { background: radial-gradient(closest-side, rgba(191,90,242,.36), rgba(191,90,242,.1) 55%, transparent); }
.tvh .dx-aura i:nth-child(3) { background: radial-gradient(closest-side, rgba(100,210,255,.22), rgba(100,210,255,.06) 55%, transparent); }
.tvh-t { text-align: center; max-width: 860px; margin: 0 auto 50px; }
.tvh h2 { font: 800 clamp(36px, 5vw, 66px)/1.02 var(--display); letter-spacing: -0.05em; margin: 0 0 20px; text-wrap: balance; }
.tvh-t p { color: #a1a1a6; font-size: clamp(16px, 1.5vw, 19px); line-height: 1.55; margin: 0 auto 28px; max-width: 64ch; }
.tvh .ctas { display: flex; gap: 12px; flex-wrap: wrap; justify-content: center; }
.tvh-v { position: relative; max-width: 1120px; margin: 0 auto; }
.tvh-v::before { content: ""; position: absolute; inset: 8% 4% -6%; z-index: -1; border-radius: 40px; background: radial-gradient(closest-side, rgba(191,90,242,.35), transparent); filter: blur(40px); }
.tvh-pts { list-style: none; padding: 0; margin: 40px auto 0; max-width: 1120px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.tvh-pts li { display: grid; grid-template-columns: 40px 1fr; gap: 12px; align-items: start; padding: 16px; border-radius: 18px; background: rgba(255,255,255,.04); box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.1); }
.tvh-pts li > i { width: 40px; height: 40px; border-radius: 12px; display: flex; align-items: center; justify-content: center; font-size: 22px; color: var(--k); background: color-mix(in srgb, var(--k) 16%, transparent); }
.tvh-pts b { display: block; color: #fff; font: 700 15px var(--display); margin-bottom: 2px; } .tvh-pts span { color: #8e8e93; font-size: 13.5px; line-height: 1.45; }
@media (max-width: 1000px) { .tvh-pts { grid-template-columns: 1fr 1fr; } .tvh { padding: 76px 0; } }
@media (max-width: 560px) { .tvh-pts { grid-template-columns: 1fr; } }

/* ---------- YouTube sayfasındaki TV tanıtımı ---------- */
.yt-tv-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 18px 0 22px; padding: 0; list-style: none; }
.yt-tv-chips li { display: inline-flex; align-items: center; gap: 7px; height: 36px; padding: 0 13px 0 10px; border-radius: 18px; background: #fff; box-shadow: 0 0 0 0.5px var(--hair-2); font-size: 13.5px; font-weight: 600; color: var(--ink); }
.yt-tv-chips li i { font-size: 17px; color: var(--k); }
.yt-tv-on { position: absolute; left: 22px; bottom: 22px; z-index: 2; display: inline-flex; gap: 6px; align-items: center; height: 26px; padding: 0 10px; border-radius: 8px; background: rgba(12,12,18,.78); color: #fff; font-size: 12px; font-weight: 700; backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
.yt-tv-on i { width: 16px; height: 16px; border-radius: 4px; display: grid; place-items: center; font-size: 10px; font-style: normal; background: #30d158; }

/* ---------- iç sayfa ---------- */
.tvp .dx-hero { padding-bottom: 70px; }
.tvp-hero-t { text-align: center; max-width: 900px; margin: 0 auto 46px; }
.tvp-hero-t .dx-lead { margin-left: auto; margin-right: auto; }
.tvp-hero-t .ctas { justify-content: center; }
.tvp-hero-v { max-width: 1180px; margin: 0 auto; position: relative; }
.tvp-hero-v::before { content: ""; position: absolute; inset: 10% 6% -8%; z-index: -1; background: radial-gradient(closest-side, rgba(255,55,95,.3), transparent); filter: blur(50px); }
.tvp-hint { text-align: center; color: #8e8e93; font-size: 13px; margin: 16px 0 0; } .tvp-hint i { color: #ff8fab; }
.tvp-two { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 50px; align-items: center; }
.tvp-two p { color: var(--ink-2); font-size: 17px; line-height: 1.6; }
.tvp-two h2 { font: 800 clamp(30px, 3.4vw, 44px)/1.06 var(--display); letter-spacing: -0.04em; margin: 0 0 16px; text-wrap: balance; }
.tvp-audio { display: grid; gap: 12px; }
.tvp-am { display: grid; grid-template-columns: 46px 1fr; gap: 14px; align-items: start; padding: 18px; border-radius: 20px; background: #fff; box-shadow: 0 0 0 0.5px var(--hair), 0 20px 40px -30px rgba(0,0,0,.35); }
.tvp-am > i { width: 46px; height: 46px; border-radius: 14px; display: flex; align-items: center; justify-content: center; font-size: 24px; color: var(--k); background: color-mix(in srgb, var(--k) 12%, transparent); }
.tvp-am b { display: block; font: 700 17px var(--display); margin-bottom: 3px; } .tvp-am span { color: var(--ink-2); font-size: 14.5px; line-height: 1.5; }
.tvp-am small { display: inline-block; margin-top: 8px; font-size: 12px; font-weight: 700; color: var(--k); }
.tvp-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.tvp-cd { padding: 24px; border-radius: 22px; background: #fff; box-shadow: 0 0 0 0.5px var(--hair), 0 24px 50px -40px rgba(0,0,0,.4); }
.alt .tvp-cd { background: #fff; }
.tvp-cd .ti { width: 46px; height: 46px; border-radius: 14px; display: grid; place-items: center; font-size: 25px; color: var(--k); background: color-mix(in srgb, var(--k) 12%, transparent); margin-bottom: 14px; }
.tvp-cd h3 { font: 700 19px/1.25 var(--display); letter-spacing: -0.02em; margin: 0 0 8px; } .tvp-cd p { color: var(--ink-2); font-size: 15px; line-height: 1.55; margin: 0; }
.tvp-cd kbd { font: 700 11.5px var(--font); padding: 1px 6px; border-radius: 5px; background: var(--canvas-2); box-shadow: inset 0 -1px 0 var(--hair-2); }
/* senaryo */
.tvp-scn { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, .9fr); gap: 34px; align-items: start; }
.tvp-scn-l { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; counter-reset: s; }
.tvp-scn-l li { position: relative; display: grid; grid-template-columns: 34px 1fr; gap: 12px; padding: 14px 16px; border-radius: 16px; background: rgba(255,255,255,.04); box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.1); color: #a1a1a6; font-size: 14.5px; line-height: 1.5; transition: background .4s, box-shadow .4s, color .4s; }
.tvp-scn-l li b { display: block; color: #fff; font: 700 15.5px var(--display); margin-bottom: 2px; }
.tvp-scn-l li > span:first-child { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; font: 800 14px var(--display); color: #fff; background: rgba(255,255,255,.08); transition: background .4s; }
.tvp-scn-l li.on { background: rgba(255,55,95,.1); box-shadow: inset 0 0 0 1px rgba(255,55,95,.5); color: #e5e5ea; }
.tvp-scn-l li.on > span:first-child { background: #ff2d55; }
.tvp-dark { position: relative; overflow: hidden; isolation: isolate; background: #05050a; color: #f5f5f7; padding: 96px 0; }
.tvp-dark .dx-sh p { color: #a1a1a6; } .tvp-dark .dx-kick { color: #ff8fab; background: rgba(255,55,95,.14); }
.tvp-dark h2 { color: #fff; font: 800 clamp(34px, 4.4vw, 56px)/1.04 var(--display); letter-spacing: -0.045em; margin: 0 0 16px; }
/* otomasyon akışı */
.tvp-run { border-radius: 22px; padding: 16px; background: linear-gradient(180deg, #1d1d25, #0b0b10); color: #e5e5ea; box-shadow: 0 50px 90px -50px rgba(0,0,0,.8), inset 0 0 0 0.5px rgba(255,255,255,.14); }
.tvp-run-h { display: flex; align-items: center; gap: 8px; font: 700 13px var(--display); color: #fff; padding: 2px 4px 12px; } .tvp-run-h i { color: #bf5af2; font-size: 17px; } .tvp-run-h em { margin-left: auto; font-style: normal; font-size: 11px; font-weight: 700; color: #30d158; background: rgba(48,209,88,.14); padding: 3px 8px; border-radius: 6px; }
.tvp-run ol { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.tvp-run li { display: grid; grid-template-columns: 22px 30px 1fr auto; gap: 10px; align-items: center; padding: 9px 10px; border-radius: 11px; background: rgba(255,255,255,.04); font-size: 13px; }
.tvp-run li.now { background: rgba(255,55,95,.14); box-shadow: inset 0 0 0 1px rgba(255,55,95,.45); }
.tvp-run li > span:first-child { color: #8e8e93; font-weight: 700; font-size: 11.5px; text-align: center; }
.tvp-run li > i { width: 30px; height: 30px; border-radius: 8px; display: flex; align-items: center; justify-content: center; font-size: 16px; color: var(--k); background: color-mix(in srgb, var(--k) 18%, transparent); }
.tvp-run li b { display: block; color: #fff; font-weight: 600; font-size: 13.5px; } .tvp-run li small { color: #8e8e93; font-size: 11.5px; }
.tvp-run li em { font-style: normal; color: #a1a1a6; font-variant-numeric: tabular-nums; font-size: 12px; }
.tvp-run-f { display: flex; gap: 8px; flex-wrap: wrap; padding: 12px 4px 0; font-size: 12px; color: #a1a1a6; } .tvp-run-f span { display: inline-flex; gap: 6px; align-items: center; padding: 5px 10px; border-radius: 8px; background: rgba(255,255,255,.05); } .tvp-run-f i { color: #30d158; }
/* uygulama */
.tvp-apps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.tvp-app { position: relative; padding: 26px; border-radius: 24px; background: #fff; box-shadow: 0 0 0 0.5px var(--hair), 0 24px 50px -40px rgba(0,0,0,.4); overflow: hidden; }
.tvp-app .ai { width: 56px; height: 56px; border-radius: 16px; display: grid; place-items: center; font-size: 30px; color: #fff; background: var(--g); box-shadow: 0 14px 28px -14px var(--k); margin-bottom: 16px; }
.tvp-app h3 { font: 700 20px var(--display); letter-spacing: -0.02em; margin: 0 0 8px; } .tvp-app p { margin: 0; color: var(--ink-2); font-size: 15px; line-height: 1.55; }
/* lite / pro */
.tvp-lv { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; max-width: 980px; margin: 0 auto; }
.tvp-lv > div { padding: 30px; border-radius: 26px; background: #fff; box-shadow: 0 0 0 0.5px var(--hair), 0 30px 60px -45px rgba(0,0,0,.45); }
.tvp-lv > div.pro { background: linear-gradient(180deg, #1c1c24, #0d0d12); color: #f5f5f7; box-shadow: 0 40px 80px -40px rgba(191,90,242,.55), inset 0 0 0 0.5px rgba(255,255,255,.14); }
.tvp-lv h3 { display: flex; align-items: center; gap: 10px; font: 800 26px var(--display); letter-spacing: -0.03em; margin: 0 0 6px; }
.tvp-lv h3 i { width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; font-size: 22px; color: #fff; background: linear-gradient(135deg, #0a84ff, #64d2ff); }
.tvp-lv .pro h3 i { background: linear-gradient(135deg, #ff375f, #bf5af2); }
.tvp-lv > div > p { margin: 0 0 18px; color: var(--ink-2); font-size: 15px; } .tvp-lv .pro > p { color: #a1a1a6; }
.tvp-lv ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 9px; }
.tvp-lv li { display: flex; gap: 10px; font-size: 14.5px; line-height: 1.45; } .tvp-lv li i { font-size: 18px; flex: none; margin-top: 1px; color: #30d158; }
.tvp-lv li.no { color: var(--ink-3); } .tvp-lv li.no i { color: var(--ink-3); }
.tvp-lv .pro li i { color: #ff8fab; }
.tvp-note { text-align: center; color: var(--ink-2); font-size: 14px; margin: 22px auto 0; max-width: 70ch; }
/* bağlantı rehberi */
.tvp-wire { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.tvp-w { display: grid; grid-template-columns: 54px 1fr; gap: 16px; padding: 24px; border-radius: 22px; background: #fff; box-shadow: 0 0 0 0.5px var(--hair), 0 24px 50px -40px rgba(0,0,0,.4); }
.tvp-w > i { width: 54px; height: 54px; border-radius: 16px; display: flex; align-items: center; justify-content: center; font-size: 28px; color: var(--k); background: color-mix(in srgb, var(--k) 12%, transparent); }
.tvp-w h3 { font: 700 18px/1.3 var(--display); margin: 0 0 6px; letter-spacing: -0.02em; } .tvp-w p { margin: 0 0 10px; color: var(--ink-2); font-size: 14.5px; line-height: 1.55; }
.tvp-flow { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 600; color: var(--ink); }
.tvp-flow span { padding: 4px 9px; border-radius: 8px; background: var(--canvas-2); } .tvp-flow i { color: var(--ink-3); font-size: 13px; }
.tvp-tips { margin: 26px auto 0; max-width: 980px; padding: 22px 26px; border-radius: 22px; background: linear-gradient(135deg, rgba(10,132,255,.08), rgba(191,90,242,.08)); box-shadow: inset 0 0 0 0.5px rgba(10,132,255,.25); }
.tvp-tips h3 { display: flex; gap: 8px; align-items: center; font: 700 17px var(--display); margin: 0 0 10px; } .tvp-tips h3 i { color: #0a84ff; font-size: 20px; }
.tvp-tips ul { margin: 0; padding: 0 0 0 4px; list-style: none; display: grid; grid-template-columns: 1fr 1fr; gap: 8px 22px; }
.tvp-tips li { display: flex; gap: 8px; font-size: 14.5px; color: var(--ink-2); line-height: 1.5; } .tvp-tips li i { color: #0a84ff; flex: none; margin-top: 3px; }
@media (max-width: 1000px) {
  .tvp-two, .tvp-scn { grid-template-columns: minmax(0, 1fr); gap: 30px; } .tvp-grid, .tvp-apps { grid-template-columns: 1fr 1fr; } .tvp-wire { grid-template-columns: 1fr; } .tvp-dark { padding: 70px 0; }
}
@media (max-width: 640px) { .tvp-grid, .tvp-apps, .tvp-lv, .tvp-tips ul { grid-template-columns: 1fr; } .tvp-w { grid-template-columns: 1fr; } }

/* ---------- Dil seçici: Apple Silicon tarzı cam segment, kayan seçim göstergesi (v2.1.1) ---------- */
.lgm-chips { position: relative; display: flex; flex-wrap: wrap; justify-content: center; gap: 2px; margin: 22px auto 0; padding: 6px; max-width: 760px; border-radius: 22px;
  background: linear-gradient(180deg, rgba(255,255,255,.075), rgba(255,255,255,.03)); box-shadow: inset 0 0 0 .5px rgba(255,255,255,.14), inset 0 1px 0 rgba(255,255,255,.08), 0 24px 50px -28px rgba(0,0,0,.9);
  backdrop-filter: blur(24px) saturate(160%); -webkit-backdrop-filter: blur(24px) saturate(160%); isolation: isolate; }
.lgm-chip { position: relative; z-index: 1; padding: 9px 14px; border-radius: 15px; font: 600 13px/1 var(--font); letter-spacing: -.005em; color: rgba(235,235,245,.62); background: transparent; box-shadow: none; transform: none;
  transition: color .35s cubic-bezier(.2,.8,.2,1), transform .25s cubic-bezier(.2,.8,.2,1); -webkit-tap-highlight-color: transparent; }
.lgm-chip:hover { color: #fff; background: transparent; }
.lgm-chip:active { transform: scale(.96); }
.lgm-chip.on { color: #fff; background: transparent; box-shadow: none; transform: none; }
.lgm-chip:focus-visible { outline: 2px solid rgba(10,132,255,.8); outline-offset: 1px; }
.lgm-ind { position: absolute; z-index: 0; left: 0; top: 0; width: 0; height: 0; border-radius: 15px; pointer-events: none;
  background: linear-gradient(180deg, rgba(120,160,255,.42), rgba(94,92,230,.34)), linear-gradient(180deg, rgba(255,255,255,.22), rgba(255,255,255,.05));
  box-shadow: inset 0 0 0 .5px rgba(255,255,255,.35), inset 0 1px 0 rgba(255,255,255,.4), 0 10px 24px -10px rgba(10,132,255,.75), 0 2px 6px -2px rgba(0,0,0,.5);
  transition: transform .55s cubic-bezier(.22,1,.36,1), width .55s cubic-bezier(.22,1,.36,1), height .55s cubic-bezier(.22,1,.36,1), opacity .3s; will-change: transform, width; }
/* Geçiş: pencere kararmaz; yalnızca yazılar yumuşakça yer değiştirir, yükseklik sabit kalır */
.lgm-win > * { transition: none; }
.lgm-win.sw > * { opacity: 1; filter: none; transform: none; }
.lgm-win [data-k], .lgm-win [data-lgdate], .lgm-win [data-lgtime], .lgm-win [data-lgad], .lgm-win .lgm-row em { transition: opacity .22s ease, transform .32s cubic-bezier(.22,1,.36,1), filter .22s ease; display: inline-block; }
.lgm-win.tx [data-k], .lgm-win.tx [data-lgdate], .lgm-win.tx [data-lgtime], .lgm-win.tx [data-lgad], .lgm-win.tx .lgm-row em { opacity: 0; transform: translateY(4px); filter: blur(2px); }
.lgm-win { transition: box-shadow .4s; }
.lgm-win.flip { animation: lgFlip .62s cubic-bezier(.22,1,.36,1); }
@keyframes lgFlip { 0% { opacity: 1; transform: none; } 45% { opacity: .55; transform: perspective(1400px) rotateY(4deg) scale(.992); } 100% { opacity: 1; transform: none; } }
.lgm-mb span[data-k], .lgm-ttl b, .lgm-seg span, .lgm-nx span, .lgm-talk span, .lgm-ph span[data-k], .lgm-ad b { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; vertical-align: bottom; }
@media (max-width: 560px) { .lgm-chips { border-radius: 18px; } .lgm-chip { padding: 8px 11px; font-size: 12.5px; } }
@media (prefers-reduced-motion: reduce) { .lgm-ind, .lgm-win [data-k] { transition: none; } .lgm-win.flip { animation: none; } }
.lgm-win .lgm-ttl b[data-k] { display: block; } .lgm-ad b[data-k] { display: block; }

/* =========================================================
   Radyomasyon TV — özellik kartları (bento, canlı mini arayüzlerle) (v2.1.2)
   ========================================================= */
.tvb { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.tvb-cd { position: relative; display: flex; flex-direction: column; border-radius: 28px; overflow: hidden; background: #fff;
  box-shadow: 0 0 0 .5px rgba(0,0,0,.07), 0 1px 2px rgba(0,0,0,.04), 0 30px 60px -42px rgba(20,20,60,.45); transition: transform .5s cubic-bezier(.22,1,.36,1), box-shadow .5s; }
.tvb-cd.w2 { grid-column: span 2; }
.tvb-cd:hover { transform: translateY(-4px); box-shadow: 0 0 0 .5px rgba(0,0,0,.08), 0 40px 80px -40px color-mix(in srgb, var(--k) 45%, rgba(20,20,60,.5)); }
.tvb-cd::after { content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; background: radial-gradient(120% 60% at 50% 0%, color-mix(in srgb, var(--k) 10%, transparent), transparent 60%); }
.tvb-v { position: relative; height: 230px; margin: 10px 10px 0; border-radius: 20px; overflow: hidden; color: #e5e5ea; font: 11px/1.2 var(--font);
  background: radial-gradient(90% 120% at 50% 0%, color-mix(in srgb, var(--k) 22%, #15151c), #0b0b10 70%); box-shadow: inset 0 0 0 .5px rgba(255,255,255,.1), inset 0 1px 0 rgba(255,255,255,.06); }
.tvb-t { padding: 20px 26px 26px; position: relative; z-index: 1; }
.tvb-t h3 { font: 700 21px/1.2 var(--display); letter-spacing: -.025em; margin: 0 0 8px; }
.tvb-t h3::before { content: ""; display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--k); margin: 0 10px 3px 0; box-shadow: 0 0 12px var(--k); }
.tvb-t p { margin: 0; color: var(--ink-2); font-size: 15px; line-height: 1.55; }
.tvb-t kbd { font: 700 11.5px var(--font); padding: 1px 6px; border-radius: 5px; background: var(--canvas-2); box-shadow: inset 0 -1px 0 var(--hair-2); }

/* kamera sahneleri (CSS ile çizilir) */
i.sc { position: absolute; inset: 0; display: block; background-size: cover; }
i.sc.s1 { background:
  radial-gradient(9% 14% at 36% 44%, #0d0d14 98%, transparent 100%), radial-gradient(20% 26% at 36% 82%, #0d0d14 98%, transparent 100%),
  radial-gradient(8% 13% at 64% 47%, #111119 98%, transparent 100%), radial-gradient(18% 24% at 64% 84%, #111119 98%, transparent 100%),
  linear-gradient(0deg, #262630 0 14%, transparent 14%),
  radial-gradient(6% 8% at 18% 20%, rgba(255,159,10,.55), transparent), radial-gradient(5% 7% at 82% 26%, rgba(10,132,255,.6), transparent), radial-gradient(7% 9% at 54% 14%, rgba(191,90,242,.5), transparent),
  linear-gradient(180deg, #1b2244, #2c1840); }
i.sc.s2 { background:
  radial-gradient(12% 19% at 50% 38%, #120c12 98%, transparent 100%), radial-gradient(30% 34% at 50% 95%, #120c12 98%, transparent 100%),
  radial-gradient(40% 50% at 50% 42%, rgba(255,180,110,.55), transparent 70%),
  radial-gradient(5% 7% at 20% 26%, rgba(255,214,10,.5), transparent), radial-gradient(6% 8% at 80% 20%, rgba(255,100,130,.5), transparent),
  radial-gradient(120% 120% at 50% 30%, #5a2a1a, #120a14 70%); }
i.sc.s3 { background: radial-gradient(10% 15% at 30% 50%, #0b1020 98%, transparent 100%), radial-gradient(22% 26% at 30% 92%, #0b1020 98%, transparent 100%), linear-gradient(135deg, #0a3d7a, #0e7490 60%, #134e4a); }
i.sc.s4 { background: radial-gradient(9% 13% at 30% 46%, rgba(10,6,20,.9) 98%, transparent), radial-gradient(9% 13% at 52% 42%, rgba(10,6,20,.9) 98%, transparent), radial-gradient(9% 13% at 74% 46%, rgba(10,6,20,.9) 98%, transparent),
  linear-gradient(100deg, transparent 20%, rgba(255,255,255,.25) 24%, transparent 28%, transparent 60%, rgba(255,255,255,.2) 64%, transparent 68%), linear-gradient(135deg, #ff2d55, #bf5af2 50%, #0a84ff); background-size: 100% 100%, 100% 100%, 100% 100%, 200% 100%, 300% 300%; animation: scClip 6s linear infinite; }
@keyframes scClip { to { background-position: 0 0, 0 0, 0 0, -200% 0, 100% 100%; } }
i.sc.s5 { background: linear-gradient(90deg, transparent 49.6%, rgba(255,255,255,.5) 49.6% 50.4%, transparent 50.4%), linear-gradient(0deg, transparent 49.4%, rgba(255,255,255,.5) 49.4% 50.6%, transparent 50.6%),
  radial-gradient(10% 18% at 25% 30%, #0d0d14 98%, transparent), radial-gradient(10% 18% at 75% 30%, #1a0c10 98%, transparent), linear-gradient(135deg, #1b2244 50%, #3a1d1d 50%); }
i.sc.s6 { background: radial-gradient(18% 32% at 50% 46%, #ff6a3d, #ff2d55 98%, transparent 100%), radial-gradient(26% 44% at 50% 46%, transparent 64%, rgba(255,255,255,.35) 66%, transparent 74%), radial-gradient(80% 90% at 30% 20%, rgba(109,93,252,.6), transparent 60%), radial-gradient(80% 90% at 80% 90%, rgba(255,79,216,.45), transparent 60%), #0b1030; }
i.sc.s7 { background: linear-gradient(0deg, rgba(0,0,0,.6), transparent 50%), radial-gradient(40% 60% at 70% 40%, #ffd60a, transparent 70%), linear-gradient(135deg, #ff9f0a, #ff375f); }
i.sc.s8 { background: linear-gradient(135deg, #30d158, #0a84ff); }
i.sc.s1, i.sc.s2, i.sc.s3 { animation: scSway 9s ease-in-out infinite alternate; transform-origin: 50% 60%; }
@keyframes scSway { to { transform: scale(1.06) translateX(-2%); } }

/* önizleme / program */
.v-pp { display: grid; grid-template-columns: 1fr 64px 1.25fr; gap: 12px; align-items: center; padding: 22px; }
.pp-mon { position: relative; aspect-ratio: 16/9; border-radius: 10px; overflow: hidden; }
.pp-mon.pvw { box-shadow: 0 0 0 2px #30d158; } .pp-mon.pgm { box-shadow: 0 0 0 2px #ff2d55, 0 0 40px -6px rgba(255,45,85,.6); }
.pp-mon b { position: absolute; z-index: 2; left: 8px; top: 7px; font-size: 9.5px; letter-spacing: .1em; color: #30d158; } .pp-mon.pgm b { color: #ff6482; }
.pp-mon em { position: absolute; z-index: 2; right: 7px; top: 6px; font-style: normal; font-size: 9px; font-weight: 800; color: #fff; background: #ff2d55; padding: 2px 6px; border-radius: 4px; }
.pp-mon .x { animation: ppMix 5s ease-in-out infinite; }
@keyframes ppMix { 0%, 40% { opacity: 0; } 55%, 85% { opacity: 1; } 100% { opacity: 0; } }
.pp-mid { display: grid; gap: 7px; }
.pp-btn { display: grid; place-items: center; height: 28px; border-radius: 8px; font: 800 10.5px var(--display); letter-spacing: .08em; background: #2a2a33; color: #fff; box-shadow: inset 0 0 0 .5px rgba(255,255,255,.14); }
.pp-btn.cut { background: linear-gradient(180deg, #ff4d6d, #e0244a); box-shadow: 0 6px 14px -6px rgba(255,45,85,.9); }
.pp-tb { position: relative; height: 6px; border-radius: 3px; background: #2a2a33; margin: 6px 2px; }
.pp-tb i { position: absolute; top: -5px; left: 0; width: 16px; height: 16px; margin-left: -8px; border-radius: 50%; background: #ff375f; box-shadow: 0 2px 8px rgba(0,0,0,.6); animation: ppTb 5s ease-in-out infinite; }
@keyframes ppTb { 0%, 40% { left: 0; } 55%, 85% { left: 100%; } 100% { left: 0; } }

/* geçişler */
.v-tr { padding: 18px; display: grid; gap: 12px; align-content: center; }
.tr-scr { position: relative; aspect-ratio: 16/8; border-radius: 10px; overflow: hidden; box-shadow: 0 0 0 1.5px #ff2d55; }
.tr-scr .wipe { clip-path: inset(0 100% 0 0); animation: trWipe 4.5s cubic-bezier(.65,0,.35,1) infinite; }
.tr-scr .wipe::after { content: ""; position: absolute; top: 0; bottom: 0; right: 0; width: 2px; background: rgba(255,255,255,.8); }
@keyframes trWipe { 0%, 20% { clip-path: inset(0 100% 0 0); } 55%, 80% { clip-path: inset(0 0 0 0); } 100% { clip-path: inset(0 0 0 0); opacity: 0; } }
.tr-chips { display: grid; grid-template-columns: repeat(4, 1fr); gap: 5px; }
.tr-chips span { text-align: center; padding: 5px 0; border-radius: 7px; font-size: 10px; color: #a1a1a6; background: rgba(255,255,255,.05); box-shadow: inset 0 0 0 .5px rgba(255,255,255,.1); }
.tr-chips span:nth-child(3) { color: #ff8fab; background: rgba(255,55,95,.12); box-shadow: inset 0 0 0 1px rgba(255,55,95,.45); }
.tr-chips span.on { color: #a1a1a6; background: rgba(255,255,255,.05); box-shadow: inset 0 0 0 .5px rgba(255,255,255,.1); }
.tr-tbar { position: relative; height: 6px; border-radius: 3px; background: #2a2a33; margin: 2px 8px 0; }
.tr-tbar i { position: absolute; top: -5px; width: 16px; height: 16px; margin-left: -8px; border-radius: 50%; background: #bf5af2; box-shadow: 0 2px 10px rgba(191,90,242,.7); animation: trTb 4.5s cubic-bezier(.65,0,.35,1) infinite; }
@keyframes trTb { 0%, 20% { left: 0; } 55%, 100% { left: 100%; } }

/* klavye */
.v-kb { display: grid; gap: 7px; align-content: center; justify-content: center; padding: 18px; }
.kb-row { display: flex; gap: 7px; justify-content: center; }
.v-kb kbd { display: grid; place-items: center; width: 44px; height: 40px; border-radius: 9px; font: 700 13px var(--display); color: #e5e5ea;
  background: linear-gradient(180deg, #34343e, #24242c); box-shadow: inset 0 1px 0 rgba(255,255,255,.12), inset 0 0 0 .5px rgba(255,255,255,.1), 0 3px 0 #111116, 0 6px 12px -4px rgba(0,0,0,.6); }
.v-kb kbd.w { width: 64px; font-size: 11px; } .v-kb kbd.w2 { width: 96px; font-size: 11px; }
.v-kb kbd.p1 { animation: kbP 3.6s infinite; --kc: #30d158; } .v-kb kbd.p2 { animation: kbP 3.6s 1.2s infinite; --kc: #ff375f; } .v-kb kbd.p3 { animation: kbP 3.6s 2.4s infinite; --kc: #bf5af2; }
@keyframes kbP { 0%, 6% { transform: translateY(3px); box-shadow: inset 0 0 0 1.5px var(--kc), 0 0 0 #111116, 0 0 20px -2px var(--kc); color: #fff; } 18%, 100% { transform: none; } }

/* kaynaklar */
.v-src { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; padding: 18px; align-content: center; }
.src-t { position: relative; aspect-ratio: 16/9; border-radius: 9px; overflow: hidden; box-shadow: inset 0 0 0 .5px rgba(255,255,255,.12); }
.src-t.pg { box-shadow: 0 0 0 2px #ff2d55; } .src-t.pv { box-shadow: 0 0 0 2px #30d158; }
.src-t > span { position: absolute; left: 0; right: 0; bottom: 0; display: flex; gap: 5px; align-items: center; padding: 14px 7px 5px; font-size: 9.5px; color: #fff; background: linear-gradient(0deg, rgba(0,0,0,.75), transparent); white-space: nowrap; overflow: hidden; }
.src-t > span b { display: grid; place-items: center; width: 14px; height: 14px; border-radius: 4px; background: rgba(0,0,0,.6); font-size: 9px; }
.src-t.pg > span b { background: #ff2d55; } .src-t.pv > span b { background: #30d158; }

/* ikinci ekran */
.v-mon { display: grid; place-items: center; }
.mon { width: 78%; } .mon-scr { position: relative; aspect-ratio: 16/9; border-radius: 8px; overflow: hidden; box-shadow: 0 0 0 4px #1c1c22, 0 0 0 5px rgba(255,255,255,.12), 0 30px 50px -20px rgba(48,209,88,.4); }
.mon-neck { width: 14%; height: 18px; margin: 0 auto; background: linear-gradient(180deg, #2a2a32, #1a1a20); } .mon-foot { width: 38%; height: 6px; margin: 0 auto; border-radius: 4px; background: #2a2a32; }
.mon-live { position: absolute; left: 7px; top: 7px; font-size: 8.5px; font-weight: 800; color: #fff; background: #ff2d55; padding: 2px 6px; border-radius: 4px; }
.mon-lt { position: absolute; left: 8px; bottom: 10px; font-size: 9.5px; font-weight: 700; color: #fff; background: rgba(10,10,16,.82); padding: 5px 8px; border-radius: 6px; box-shadow: inset 2px 0 0 #ff2d55; animation: ltIn 5s ease-in-out infinite; }
@keyframes ltIn { 0%, 15% { opacity: 0; transform: translateX(-10px); } 25%, 80% { opacity: 1; transform: none; } 90%, 100% { opacity: 0; } }

/* kayıt */
.v-rec { padding: 18px 20px; display: grid; gap: 14px; align-content: center; }
.rec-top { display: flex; align-items: center; gap: 9px; font-size: 11px; } .rec-top b { letter-spacing: .1em; color: #ff6482; } .rec-top em { font-style: normal; font-variant-numeric: tabular-nums; color: #fff; font-size: 13px; font-weight: 600; }
.rec-dot { width: 10px; height: 10px; border-radius: 50%; background: #ff453a; box-shadow: 0 0 12px #ff453a; animation: tvBlink 1.4s ease-in-out infinite; }
.rec-sp { flex: 1; } .rec-f { display: inline-flex; gap: 6px; align-items: center; padding: 5px 9px; border-radius: 8px; background: rgba(255,255,255,.06); color: #c7c7cc; }
.rec-wave { display: flex; align-items: center; gap: 3px; height: 56px; }
.rec-wave i { flex: 1; height: var(--h); border-radius: 2px; background: linear-gradient(180deg, #ff6482, #bf5af2); opacity: .85; animation: recW 1.2s var(--d) ease-in-out infinite alternate; }
@keyframes recW { to { transform: scaleY(.45); } }
.rec-film { display: grid; grid-template-columns: repeat(6, 1fr); gap: 6px; }
.rec-film i { position: relative; aspect-ratio: 16/9; border-radius: 6px; box-shadow: inset 0 0 0 .5px rgba(255,255,255,.15); }

/* mikser */
.v-mix { display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; padding: 18px 22px; }
.mx-ch { display: grid; grid-template-rows: auto 1fr auto; gap: 8px; justify-items: center; padding: 10px 6px; border-radius: 12px; background: rgba(255,255,255,.04); box-shadow: inset 0 0 0 .5px rgba(255,255,255,.08); }
.mx-n { display: flex; gap: 4px; align-items: center; font-size: 10px; color: #c7c7cc; white-space: nowrap; } .mx-n i { color: var(--c); font-size: 13px; }
.mx-f { display: flex; gap: 10px; height: 100%; min-height: 110px; }
.mx-vu { position: relative; width: 6px; border-radius: 3px; background: rgba(255,255,255,.06); overflow: hidden; }
.mx-vu i { position: absolute; inset: 0; transform-origin: bottom; background: linear-gradient(0deg, #30d158, #30d158 60%, #ffd60a 82%, #ff453a); animation: vu 1.1s var(--d) ease-in-out infinite alternate; }
.mx-vu.off i { animation: none; transform: scaleY(.03); }
@keyframes vu { 0% { transform: scaleY(.35); } 30% { transform: scaleY(.8); } 55% { transform: scaleY(.5); } 80% { transform: scaleY(.92); } 100% { transform: scaleY(.6); } }
.mx-rail { position: relative; width: 4px; border-radius: 2px; background: #2c2c35; }
.mx-rail i { position: absolute; left: -8px; width: 20px; height: 11px; border-radius: 3px; bottom: calc(var(--f) - 5px); background: linear-gradient(180deg, #f2f2f7, #9a9aa2); box-shadow: 0 2px 6px rgba(0,0,0,.6); }
.mx-b { display: flex; gap: 4px; } .mx-b b { font-size: 8.5px; font-weight: 800; padding: 2px 5px; border-radius: 4px; background: rgba(255,255,255,.07); color: #8e8e93; }
.mx-b b.on { background: #ff453a; color: #fff; } .mx-b b.a.on { background: rgba(10,132,255,.25); color: #64d2ff; }

/* AFV */
.v-afv { display: grid; grid-template-columns: 1.3fr 60px 54px; gap: 8px; align-items: center; padding: 22px; }
.afv-cam { position: relative; aspect-ratio: 16/9; border-radius: 9px; overflow: hidden; animation: afvCam 4s infinite; }
.afv-cam span { position: absolute; left: 6px; bottom: 5px; font-size: 9.5px; color: #fff; font-weight: 600; }
@keyframes afvCam { 0%, 45% { box-shadow: 0 0 0 2px #ff2d55; } 50%, 95% { box-shadow: 0 0 0 .5px rgba(255,255,255,.2); } }
.afv-link { position: relative; display: flex; gap: 5px; justify-content: center; align-items: center; }
.afv-link i { width: 6px; height: 6px; border-radius: 50%; background: #64d2ff; animation: afvDot 4s infinite; } .afv-link i:nth-child(2) { animation-delay: .1s; } .afv-link i:nth-child(3) { animation-delay: .2s; }
.afv-link b { position: absolute; top: -22px; font-size: 9px; color: #64d2ff; background: rgba(10,132,255,.2); padding: 2px 6px; border-radius: 4px; }
@keyframes afvDot { 0%, 45% { opacity: 1; } 50%, 95% { opacity: .15; } }
.afv-ch { display: grid; justify-items: center; gap: 6px; } .afv-ch small { font-size: 9.5px; color: #c7c7cc; }
.afv-ch { grid-template-columns: auto auto; } .afv-ch small { grid-column: 1 / -1; }
.afv-vu, .afv-rail { position: relative; height: 110px; border-radius: 3px; }
.afv-vu { width: 6px; background: rgba(255,255,255,.06); overflow: hidden; } .afv-vu i { position: absolute; inset: 0; transform-origin: bottom; background: linear-gradient(0deg, #30d158, #ffd60a 85%, #ff453a); animation: afvVu 4s infinite; }
@keyframes afvVu { 0%, 45% { transform: scaleY(.75); } 50%, 95% { transform: scaleY(.04); } 100% { transform: scaleY(.75); } }
.afv-rail { width: 4px; background: #2c2c35; } .afv-rail i { position: absolute; left: -8px; width: 20px; height: 11px; border-radius: 3px; background: linear-gradient(180deg, #f2f2f7, #9a9aa2); animation: afvF 4s cubic-bezier(.65,0,.35,1) infinite; }
@keyframes afvF { 0%, 45% { bottom: 72%; } 50%, 95% { bottom: 2%; } 100% { bottom: 72%; } }

/* mini ekran + grafikler */
.v-scr, .v-bugs { padding: 18px; display: grid; gap: 10px; align-content: center; }
.mini { position: relative; aspect-ratio: 16/9; border-radius: 10px; overflow: hidden; box-shadow: 0 0 0 1.5px #ff2d55, 0 20px 40px -20px rgba(0,0,0,.8); }
.v-bugs .mini.wide { aspect-ratio: 16/6.4; }
.mini .lt { position: absolute; left: 6%; bottom: 12%; padding: 7px 12px 7px 14px; border-radius: 7px; background: rgba(12,12,18,.84); box-shadow: inset 3px 0 0 #ff9f0a; animation: ltIn 5s ease-in-out infinite; }
.mini .lt b { display: block; font-size: 12px; color: #fff; } .mini .lt small { font-size: 9.5px; color: rgba(255,255,255,.7); }
.lt-pre { display: flex; gap: 6px; } .lt-pre span { flex: 1; text-align: center; font-size: 10px; padding: 6px 0; border-radius: 8px; background: rgba(255,255,255,.05); color: #a1a1a6; box-shadow: inset 0 0 0 .5px rgba(255,255,255,.1); }
.lt-pre span.on { color: #ffd08a; background: rgba(255,159,10,.14); box-shadow: inset 0 0 0 1px rgba(255,159,10,.5); }
.bg-live { position: absolute; left: 12px; top: 10px; font-size: 9.5px; font-weight: 800; color: #fff; background: #ff2d55; padding: 3px 7px; border-radius: 5px; }
.bg-clock { position: absolute; left: 70px; top: 10px; font-size: 9.5px; font-weight: 700; color: #fff; background: rgba(0,0,0,.45); padding: 3px 7px; border-radius: 5px; font-variant-numeric: tabular-nums; }
.bg-logo { position: absolute; right: 12px; top: 8px; width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; align-content: center; background: linear-gradient(135deg, #ff6a3d, #ff2d55); color: #fff; font-family: Georgia, serif; box-shadow: 0 6px 16px -6px rgba(255,45,85,.9); }
.bg-logo b { font-size: 15px; line-height: 1; } .bg-logo small { font-size: 5.5px; letter-spacing: .05em; }
.bg-np { position: absolute; left: 50%; bottom: 34px; transform: translateX(-50%); display: flex; gap: 8px; align-items: center; padding: 6px 12px; border-radius: 9px; background: rgba(255,255,255,.12); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); box-shadow: inset 0 0 0 .5px rgba(255,255,255,.25); }
.bg-np small { display: block; font-size: 7.5px; letter-spacing: .1em; color: rgba(255,255,255,.65); } .bg-np b { font-size: 11px; color: #fff; }
.bg-np .eq { display: inline-flex; gap: 2px; align-items: flex-end; height: 12px; } .bg-np .eq i { width: 2px; background: #fff; border-radius: 1px; animation: eqB .9s ease-in-out infinite alternate; }
.bg-np .eq i:nth-child(1) { height: 50%; } .bg-np .eq i:nth-child(2) { height: 100%; animation-delay: .2s; } .bg-np .eq i:nth-child(3) { height: 70%; animation-delay: .4s; } .bg-np .eq i:nth-child(4) { height: 40%; animation-delay: .1s; }
@keyframes eqB { to { transform: scaleY(.3); } }
.bg-tick { position: absolute; left: 0; right: 0; bottom: 0; display: flex; height: 24px; background: rgba(10,10,16,.88); font-size: 10px; color: #fff; overflow: hidden; }
.bg-tick b { flex: none; display: grid; place-items: center; padding: 0 10px; background: #ff2d55; font-size: 9px; letter-spacing: .05em; }
.bg-tick span { flex: 1; overflow: hidden; display: flex; align-items: center; } .bg-tick em { font-style: normal; white-space: nowrap; padding-left: 10px; animation: tick 16s linear infinite; }
@keyframes tick { to { transform: translateX(-50%); } }

@media (max-width: 1000px) { .tvb { grid-template-columns: 1fr 1fr; } .tvb-cd.w2 { grid-column: span 2; } }
@media (max-width: 680px) { .tvb { grid-template-columns: 1fr; } .tvb-cd.w2 { grid-column: auto; } .tvb-v { height: 200px; } .v-src { grid-template-columns: repeat(3, 1fr); } .v-src .src-t:nth-child(n+7) { display: none; } .v-mix { grid-template-columns: repeat(5, 1fr); gap: 5px; padding: 14px; } .mx-n { font-size: 0; } .mx-n i { font-size: 14px; } .v-pp { padding: 14px; gap: 8px; grid-template-columns: 1fr 48px 1.2fr; } .rec-film { display: none; } }
@media (prefers-reduced-motion: reduce) { .tvb-v *, .tvb-v *::after { animation: none !important; } }
.v-scr, .v-bugs { grid-template-rows: 1fr auto; height: 230px; box-sizing: border-box; }
.v-bugs { grid-template-rows: 1fr; }
.v-scr .mini, .v-bugs .mini, .v-bugs .mini.wide { aspect-ratio: auto; height: 100%; min-height: 0; }
.v-tr { grid-template-rows: 1fr auto auto; height: 230px; box-sizing: border-box; } .v-tr .tr-scr { aspect-ratio: auto; min-height: 0; }
@media (max-width: 680px) { .v-scr, .v-bugs, .v-tr { height: 200px; } .bg-np { bottom: 30px; } .bg-clock { left: 64px; } }

/* ---------- Ürün mega menüsü: sekmeler her ekran yüksekliğine sığar ----------
   Yüksek ekranda sekmeler alt yazılıdır; dizüstü yüksekliklerinde tek satırlık, aynı ritimde kompakt sekmelere geçer
   (alt yazının anlattığını sağdaki bölüm başlığı zaten söyler). Çok kısa ekranlarda menü kendi içinde kayar. */
@media (min-width: 901px) {
  .mega { max-height: calc(100vh - 60px); max-height: calc(100dvh - 60px); overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: none; }
  .mega::-webkit-scrollbar { display: none; }
}
@media (min-width: 901px) and (max-height: 999px) {
  /* Kompakt sekme: satır yüksekliği sabit (menü zıplamaz). Seçili ve üzerine gelinen sekmede başlık yukarı süzülür,
     alt yazı altında belirir; diğerlerinde başlık ortada sade durur. */
  #mm-urun .wrap.mm { padding-top: 18px; padding-bottom: 18px; }
  #mm-urun .mm-rail { gap: 1px; }
  #mm-urun .mm-tab { padding: 4px 10px; grid-template-columns: 30px 1fr; height: 40px; }
  #mm-urun .mm-tab .mt-i { width: 30px; height: 30px; font-size: 16px; border-radius: 9px; }
  #mm-urun .mm-tab > span:last-child { position: relative; display: block; height: 32px; min-width: 0; }
  #mm-urun .mm-tab b { position: absolute; left: 0; right: 0; top: 7px; font-size: 13.5px; line-height: 18px; display: flex; align-items: center; gap: 6px; transition: transform .38s var(--ease); }
  #mm-urun .mm-tab small { display: block; position: absolute; left: 0; right: 0; top: 19px; margin: 0; font-size: 11.5px; line-height: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
    opacity: 0; transform: translateY(6px); filter: blur(2px); transition: opacity .3s var(--ease), transform .38s var(--ease), filter .3s var(--ease); }
  #mm-urun .mm-tab.on b, #mm-urun .mm-tab:hover b, #mm-urun .mm-tab:focus-visible b { transform: translateY(-7px); }
  #mm-urun .mm-tab.on small, #mm-urun .mm-tab:hover small, #mm-urun .mm-tab:focus-visible small { opacity: 1; transform: none; filter: none; }
  #mm-urun .mm-rail::before { border-radius: 12px; }
}
@media (min-width: 901px) and (max-height: 760px) {
  #mm-urun .wrap.mm { padding-top: 12px; padding-bottom: 12px; }
  #mm-urun .mm-tab { height: 37px; padding: 3px 10px; }
  #mm-urun .mm-tab .mt-i { width: 28px; height: 28px; font-size: 15px; }
  #mm-urun .mm-tab > span:last-child { height: 31px; }
  #mm-urun .mm-tab b { top: 6px; } #mm-urun .mm-tab small { top: 18px; }
}

/* =========================================================
   RADYOMASYON PROCESSOR — ana sayfa bölümü, ön panel vitrini, iç sayfa
   ========================================================= */
.pr-badge { display: inline-flex; align-items: center; gap: 5px; height: 24px; padding: 0 9px; border-radius: 7px; font: 750 12px var(--display); color: #fff; background: linear-gradient(100deg, #bf5af2, #5e5ce6 55%, #0a84ff); }
.pr-grad { background: linear-gradient(100deg, #bf5af2 0%, #ff375f 45%, #ff9f0a 80%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.pr-home { position: relative; overflow: hidden; isolation: isolate; padding: 120px 0; background: #05050a; color: #f5f5f7; }
.pr-home-glow { position: absolute; inset: 0; z-index: -1; pointer-events: none; }
.pr-home-glow i { position: absolute; border-radius: 50%; filter: blur(20px); animation: dxDrift 18s ease-in-out infinite alternate; }
.pr-home-glow i:nth-child(1) { width: 760px; height: 760px; left: -260px; top: -300px; background: radial-gradient(closest-side, rgba(191,90,242,.30), transparent); }
.pr-home-glow i:nth-child(2) { width: 700px; height: 700px; right: -240px; bottom: -340px; background: radial-gradient(closest-side, rgba(255,55,95,.22), transparent); animation-delay: -6s; }
.pr-home-glow i:nth-child(3) { width: 520px; height: 520px; left: 45%; top: 20%; background: radial-gradient(closest-side, rgba(10,132,255,.16), transparent); animation-delay: -11s; }
.pr-home-g { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.2fr); gap: 56px; align-items: center; }
.pr-home-t h2 { font: 800 clamp(34px, 4.2vw, 56px)/1.04 var(--display); letter-spacing: -0.045em; margin: 20px 0 18px; }
.pr-home-t p { color: #a1a1a6; font-size: 17px; line-height: 1.55; margin: 0 0 18px; }
.pr-home-t ul { list-style: none; padding: 0; margin: 0 0 26px; display: grid; gap: 9px; }
.pr-home-t li { display: flex; gap: 9px; align-items: center; color: #d1d1d6; font-size: 15px; } .pr-home-t li i { color: #bf5af2; font-size: 18px; }

/* ön panel vitrini */
.pm { --pc: #ff375f; position: relative; }
.pm-rack { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr); border-radius: 22px; overflow: hidden; background: linear-gradient(180deg, #1c1c22, #111115); border: 0.5px solid rgba(255,255,255,.1); box-shadow: 0 50px 100px -40px rgba(0,0,0,.9), 0 0 0 1px rgba(0,0,0,.5), 0 1px 0 rgba(255,255,255,.08) inset; color: #f2f2f7; }
.pm-face { position: relative; padding: 18px; display: flex; flex-direction: column; gap: 12px; border-right: 0.5px solid rgba(255,255,255,.07); }
.pm-face::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(120% 90% at 0% 0%, color-mix(in srgb, var(--pc) 26%, transparent), transparent 62%); transition: background .6s; }
.pm-brand { position: relative; display: flex; align-items: center; gap: 10px; }
.pm-brand b { display: block; font: 800 12px var(--display); letter-spacing: .22em; } .pm-brand small { display: block; font-size: 9.5px; font-weight: 600; letter-spacing: .42em; color: rgba(255,255,255,.5); }
.pm-logo { width: 32px; height: 32px; border-radius: 9px; display: grid; place-items: center; font-size: 18px; background: linear-gradient(135deg, var(--pc), color-mix(in srgb, var(--pc) 40%, #000)); box-shadow: 0 6px 18px -6px var(--pc); transition: background .6s, box-shadow .6s; }
.pm-led { margin-left: auto; width: 8px; height: 8px; border-radius: 50%; background: #30d158; box-shadow: 0 0 10px #30d158; animation: pmLed 2s ease-in-out infinite; }
@keyframes pmLed { 50% { opacity: .45; } }
.pm-lcd { position: relative; background: #060708; border-radius: 12px; padding: 11px 13px 0; border: 0.5px solid rgba(255,255,255,.06); box-shadow: 0 2px 10px rgba(0,0,0,.6) inset; overflow: hidden; }
.pm-lcd small { display: block; font: 600 9.5px ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .12em; color: color-mix(in srgb, var(--pc) 70%, #fff); text-transform: uppercase; transition: color .6s; }
.pm-lcd b { display: flex; align-items: center; gap: 7px; font: 700 17px var(--display); margin: 4px 0 2px; letter-spacing: -0.01em; } .pm-lcd b i { color: var(--pc); transition: color .6s; }
.pm-lcd > span { display: block; font-size: 11.5px; line-height: 1.4; color: rgba(255,255,255,.55); min-height: 32px; }
.pm-curve { display: block; width: calc(100% + 26px); height: 36px; margin: 4px -13px 0; }
.pm-curve .f { fill: color-mix(in srgb, var(--pc) 18%, transparent); transition: d .7s var(--ease), fill .6s; } .pm-curve .l { fill: none; stroke: var(--pc); stroke-width: 1.6; vector-effect: non-scaling-stroke; transition: d .7s var(--ease), stroke .6s; }
.pm-btns { display: flex; gap: 8px; position: relative; }
.pm-pw, .pm-ab { flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 7px; height: 38px; border-radius: 11px; border: 0.5px solid rgba(255,255,255,.1); background: linear-gradient(180deg, #2a2a31, #1d1d22); color: #f2f2f7; font-family: inherit; font-size: 12.5px; font-weight: 600; box-shadow: 0 1px 0 rgba(255,255,255,.07) inset; }
.pm-pw i { color: var(--pc); filter: drop-shadow(0 0 6px var(--pc)); transition: color .6s; }
.pm-ab { cursor: pointer; user-select: none; transition: .15s; } .pm-ab.hold, .pm-ab:active { background: linear-gradient(180deg, #ff9f0a, #c76f00); color: #111; border-color: transparent; }
.pm-meters { display: flex; gap: 5px; padding: 16px 16px 14px; }
.pm-m { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 6px; min-width: 0; }
.pm-m small { font-size: 8.5px; font-weight: 700; letter-spacing: .05em; color: rgba(255,255,255,.5); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.pm-bar { flex: 1; width: 100%; max-width: 26px; min-height: 170px; border-radius: 6px; position: relative; overflow: hidden; background: repeating-linear-gradient(0deg, rgba(255,255,255,.05) 0 2px, transparent 2px 6px), #0a0b0d; box-shadow: 0 1px 6px rgba(0,0,0,.7) inset; }
.pm-bar i { position: absolute; left: 3px; right: 3px; border-radius: 3px; transition: transform .09s linear; will-change: transform; }
.pm-bar.lvl i { bottom: 3px; top: 3px; transform-origin: bottom; transform: scaleY(.6); background: linear-gradient(0deg, #30d158 0 62%, #ffd60a 62% 85%, #ff453a 85%); -webkit-mask: repeating-linear-gradient(0deg, #000 0 3px, transparent 3px 5px); mask: repeating-linear-gradient(0deg, #000 0 3px, transparent 3px 5px); }
.pm-bar.lvl.out i { background: linear-gradient(0deg, #0a84ff 0 62%, #64d2ff 62% 85%, #ff453a 85%); }
.pm-bar.gr i { top: 3px; bottom: 3px; transform-origin: top; transform: scaleY(.2); background: linear-gradient(180deg, #ffb340, #ff6a00); -webkit-mask: repeating-linear-gradient(180deg, #000 0 3px, transparent 3px 5px); mask: repeating-linear-gradient(180deg, #000 0 3px, transparent 3px 5px); }
.pm-bar.gr.lim i { background: linear-gradient(180deg, #ff6482, #ff2d55); }
.pm-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 14px; }
.pm-chip { display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 12px 0 9px; border-radius: 99px; border: 0.5px solid rgba(255,255,255,.12); background: rgba(255,255,255,.05); color: #d1d1d6; font-family: inherit; font-size: 12.5px; font-weight: 600; cursor: pointer; transition: background .2s, color .2s, border-color .2s, box-shadow .25s; backdrop-filter: blur(10px); }
.pm-chip i { color: var(--c); font-size: 15px; }
.pm-chip:hover { background: rgba(255,255,255,.1); color: #fff; }
.pm-chip.on { background: color-mix(in srgb, var(--c) 22%, rgba(255,255,255,.04)); border-color: color-mix(in srgb, var(--c) 60%, transparent); color: #fff; box-shadow: 0 8px 22px -10px var(--c); }
.pm.raw .pm-lcd small { color: #ff9f0a; }

/* iç sayfa */
.prp-aura i:nth-child(1) { background: radial-gradient(closest-side, rgba(191,90,242,.32), transparent) !important; }
.prp-aura i:nth-child(2) { background: radial-gradient(closest-side, rgba(255,55,95,.24), transparent) !important; }
.prp-wave { position: absolute; left: 0; right: 0; bottom: 0; height: 160px; display: flex; align-items: flex-end; gap: 4px; padding: 0 2%; z-index: -1; opacity: .35; pointer-events: none; -webkit-mask: linear-gradient(90deg, transparent, #000 15%, #000 85%, transparent); mask: linear-gradient(90deg, transparent, #000 15%, #000 85%, transparent); }
.prp-wave i { flex: 1; border-radius: 3px 3px 0 0; background: linear-gradient(0deg, rgba(191,90,242,.0), rgba(191,90,242,.7)); height: 20%; animation: prpWave 1.8s ease-in-out infinite alternate; animation-delay: calc(var(--i) * -97ms); }
@keyframes prpWave { 0% { height: 12%; } 40% { height: 64%; } 100% { height: 30%; } }
.prp-hero-g { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: 48px; align-items: center; }
.prp-chain { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; }
.prp-st { position: relative; padding: 22px 18px 20px; border-radius: 22px; background: #fff; border: 0.5px solid var(--hair); box-shadow: 0 20px 40px -32px rgba(0,0,0,.35); transition-delay: var(--d); }
.prp-st .n { position: absolute; right: 16px; top: 14px; font: 800 13px var(--display); color: color-mix(in srgb, var(--c) 70%, #999); opacity: .7; }
.prp-st .ti, .prp-card .ti { width: 44px; height: 44px; border-radius: 13px; display: grid; place-items: center; font-size: 22px; color: var(--c); background: color-mix(in srgb, var(--c) 13%, #fff); margin-bottom: 14px; }
.prp-st h3 { font: 700 16px var(--display); margin: 0 0 6px; letter-spacing: -0.01em; } .prp-st p { margin: 0; font-size: 13.5px; color: var(--ink-2); line-height: 1.5; }
.prp-flow { position: absolute; right: -14px; top: 40px; width: 14px; height: 2px; background: color-mix(in srgb, var(--c) 40%, transparent); overflow: hidden; }
.prp-flow i { position: absolute; inset: 0; background: var(--c); animation: prpFlow 1.4s linear infinite; }
.prp-st:last-child .prp-flow { display: none; }
@keyframes prpFlow { from { transform: translateX(-100%); } to { transform: translateX(100%); } }
.prp-gal { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.prp-card { padding: 20px 18px 0; border-radius: 22px; background: #fff; border: 0.5px solid var(--hair); overflow: hidden; display: flex; flex-direction: column; transition: transform .3s var(--ease), box-shadow .3s, opacity .9s var(--ease); transition-delay: var(--d); }
.prp-card:hover { transform: translateY(-4px); box-shadow: 0 24px 44px -26px var(--c); }
.prp-card b { font: 700 15.5px var(--display); } .prp-card p { flex: 1; margin: 5px 0 10px; font-size: 13px; color: var(--ink-2); line-height: 1.45; }
.prp-card svg { display: block; width: calc(100% + 36px); height: 44px; margin: 0 -18px; }
.prp-card svg .f, .prp-hero .pm-curve .f { fill: color-mix(in srgb, var(--c) 14%, transparent); } .prp-card svg .l { fill: none; stroke: var(--c); stroke-width: 1.6; vector-effect: non-scaling-stroke; }
.prp-route-g, .prp-ed-g, .prp-sep-g { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: 56px; align-items: center; }
.prp-ed-g { grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); }
.prp-route { display: grid; grid-template-columns: 1fr 90px 1.4fr; align-items: center; padding: 28px; border-radius: 28px; background: #05050a; box-shadow: 0 40px 80px -40px rgba(0,0,0,.6); color: #f2f2f7; }
.prp-src { display: grid; justify-items: center; text-align: center; gap: 6px; }
.prp-src span { width: 60px; height: 60px; border-radius: 18px; display: grid; place-items: center; font-size: 28px; background: linear-gradient(135deg, #bf5af2, #5e5ce6); box-shadow: 0 12px 30px -10px #bf5af2; }
.prp-src b { font-size: 14px; } .prp-src small { font-size: 11.5px; color: #8e8e93; }
.prp-wires { width: 100%; height: 300px; } .prp-wires path { fill: none; stroke: rgba(191,90,242,.55); stroke-width: 1.6; vector-effect: non-scaling-stroke; stroke-dasharray: 5 6; animation: prpDash 1.2s linear infinite; animation-delay: calc(var(--k) * -.3s); }
@keyframes prpDash { to { stroke-dashoffset: -22; } }
.prp-outs { display: grid; gap: 12px; }
.prp-out { display: grid; grid-template-columns: 38px 1fr auto; gap: 10px; align-items: center; padding: 11px 12px; border-radius: 16px; background: rgba(255,255,255,.05); border: 0.5px solid rgba(255,255,255,.08); }
.prp-out > span:first-child { width: 38px; height: 38px; border-radius: 11px; display: grid; place-items: center; font-size: 19px; color: var(--c); background: color-mix(in srgb, var(--c) 18%, transparent); }
.prp-out b { display: block; font-size: 13.5px; } .prp-out em { display: inline-flex; align-items: center; gap: 5px; font-style: normal; font-size: 11.5px; font-weight: 600; color: color-mix(in srgb, var(--c) 80%, #fff); }
.prp-out em i { width: 6px; height: 6px; border-radius: 50%; background: var(--c); box-shadow: 0 0 8px var(--c); }
.prp-vu { display: flex; gap: 2px; align-items: flex-end; height: 22px; } .prp-vu i { width: 3px; border-radius: 2px; background: var(--c); animation: prpVu .9s ease-in-out infinite alternate; }
.prp-vu i:nth-child(1) { animation-delay: -.2s; } .prp-vu i:nth-child(2) { animation-delay: -.5s; } .prp-vu i:nth-child(3) { animation-delay: -.1s; } .prp-vu i:nth-child(4) { animation-delay: -.7s; } .prp-vu i:nth-child(5) { animation-delay: -.35s; }
@keyframes prpVu { from { height: 25%; } to { height: 100%; } }
.prp-ed { padding: 22px; border-radius: 26px; background: #fff; border: 0.5px solid var(--hair); box-shadow: 0 40px 80px -46px rgba(0,0,0,.45); }
.prp-ed-h { display: flex; align-items: center; gap: 10px; margin-bottom: 16px; } .prp-ed-h b { font: 700 16px var(--display); }
.prp-ed-h .ti { width: 36px; height: 36px; border-radius: 11px; display: grid; place-items: center; font-size: 19px; color: #bf5af2; background: rgba(191,90,242,.12); }
.prp-live { margin-left: auto; display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 600; color: #28b446; } .prp-live i { width: 7px; height: 7px; border-radius: 50%; background: #30d158; box-shadow: 0 0 8px #30d158; animation: pmLed 1.6s infinite; }
.prp-ed-seg { display: flex; padding: 3px; border-radius: 11px; background: #f2f2f5; margin-bottom: 16px; } .prp-ed-seg span { flex: 1; text-align: center; font-size: 12px; font-weight: 600; padding: 6px 2px; border-radius: 8px; color: var(--ink-2); } .prp-ed-seg .on { background: #fff; color: var(--ink); box-shadow: 0 1px 4px rgba(0,0,0,.12); }
.prp-sl { display: grid; grid-template-columns: 110px 1fr 70px; gap: 12px; align-items: center; margin-bottom: 12px; font-size: 13px; color: var(--ink-2); }
.prp-sl > i { position: relative; height: 6px; border-radius: 3px; background: #e9e9ee; }
.prp-sl > i b { position: absolute; left: 0; top: 0; bottom: 0; width: var(--v); border-radius: 3px; background: linear-gradient(90deg, #bf5af2, #5e5ce6); animation: prpSl 6s ease-in-out infinite alternate; animation-delay: var(--d); }
.prp-sl > i b::after { content: ""; position: absolute; right: -9px; top: -6px; width: 18px; height: 18px; border-radius: 50%; background: #fff; box-shadow: 0 1px 6px rgba(0,0,0,.25); }
@keyframes prpSl { 0% { width: var(--v); } 50% { width: calc(var(--v) + 12%); } 100% { width: calc(var(--v) - 6%); } }
.prp-sl em { font-style: normal; text-align: right; font: 600 12.5px ui-monospace, SFMono-Regular, Menlo, monospace; color: var(--ink); }
.prp-ed-f { display: flex; justify-content: flex-end; gap: 8px; margin-top: 18px; }
.prp-ti { color: var(--c) !important; background: color-mix(in srgb, var(--c) 13%, #fff) !important; }
.prp-sep { display: grid; grid-template-columns: 1fr 36px 1.2fr 36px 1fr; align-items: center; gap: 4px; }
.prp-pc { display: grid; justify-items: center; text-align: center; gap: 6px; padding: 22px 12px; border-radius: 22px; background: #fff; border: 0.5px solid var(--hair); }
.prp-pc > i { font-size: 30px; color: #6e6e73; } .prp-pc b { font-size: 14px; } .prp-pc small { font-size: 11.5px; color: var(--ink-2); line-height: 1.4; }
.prp-pc.on { background: #05050a; color: #f2f2f7; border-color: transparent; box-shadow: 0 30px 60px -30px rgba(191,90,242,.7); } .prp-pc.on > i { color: #bf5af2; } .prp-pc.on small { color: #a1a1a6; }
.prp-cable { position: relative; height: 2px; background: rgba(191,90,242,.25); overflow: hidden; } .prp-cable i { position: absolute; inset: 0; background: linear-gradient(90deg, transparent, #bf5af2, transparent); animation: prpFlow 1.6s linear infinite; }
@media (max-width: 1100px) { .prp-chain { grid-template-columns: repeat(2, minmax(0, 1fr)); } .prp-flow { display: none; } .prp-gal { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 980px) { .pr-home-g, .prp-hero-g, .prp-route-g, .prp-ed-g, .prp-sep-g { grid-template-columns: 1fr; gap: 36px; } .pr-home { padding: 80px 0; } }
@media (max-width: 640px) {
  .pm-rack { grid-template-columns: 1fr; } .pm-face { border-right: 0; border-bottom: 0.5px solid rgba(255,255,255,.07); } .pm-bar { min-height: 110px; } .pm-m small { font-size: 7.5px; }
  .prp-chain, .prp-gal { grid-template-columns: 1fr; } .prp-route { grid-template-columns: 1fr; padding: 20px; } .prp-wires { display: none; } .prp-src { margin-bottom: 14px; }
  .prp-sep { grid-template-columns: 1fr; } .prp-cable { height: 24px; width: 2px; justify-self: center; } .prp-sl { grid-template-columns: 90px 1fr 60px; }
}
@media (prefers-reduced-motion: reduce) { .prp-wave i, .prp-wires path, .prp-vu i, .prp-sl > i b, .prp-cable i, .prp-flow i, .pm-led { animation: none; } }
/* mega menü önizlemesi: Processor */
.mpp-lcd { padding: 10px 12px; border-radius: 12px; background: #050507; box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.1); }
.mpp-lcd small { display: block; font: 600 8.5px ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .12em; color: #ff8aa5; }
.mpp-lcd b { display: flex; align-items: center; gap: 6px; font-size: 14px; color: #fff; margin-top: 3px; } .mpp-lcd b i { color: #ff375f; }
.mpp-m { display: flex; gap: 5px; height: 112px; padding: 10px 2px 12px; }
.mpp-m span { flex: 1; position: relative; border-radius: 4px; background: repeating-linear-gradient(0deg, rgba(255,255,255,.06) 0 2px, transparent 2px 5px), #0a0b0d; overflow: hidden; }
.mpp-m i { position: absolute; left: 2px; right: 2px; border-radius: 2px; animation: mppM 1.1s ease-in-out infinite alternate; animation-delay: calc(var(--i) * -.17s); }
.mpp-m .lv i { bottom: 2px; height: calc(var(--v) * 100%); background: linear-gradient(0deg, #30d158 0 60%, #ffd60a 60% 85%, #ff453a 85%); transform-origin: bottom; }
.mpp-m .gr i { top: 2px; height: calc(var(--v) * 70%); background: linear-gradient(180deg, #ffb340, #ff6a00); transform-origin: top; }
@keyframes mppM { from { transform: scaleY(.55); } to { transform: scaleY(1); } }

/* Processor sayfası: ayrı işlemci bilgisayarı sahnesi (devir töreni) */
.prs { position: relative; overflow: hidden; isolation: isolate; padding: 120px 0 110px; background: #05050a; color: #f5f5f7; }
.prs-aura { position: absolute; inset: 0; z-index: -1; pointer-events: none; }
.prs-aura i { position: absolute; border-radius: 50%; filter: blur(30px); animation: dxDrift 20s ease-in-out infinite alternate; }
.prs-aura i:nth-child(1) { width: 820px; height: 820px; left: -300px; top: -360px; background: radial-gradient(closest-side, rgba(100,210,255,.18), transparent); }
.prs-aura i:nth-child(2) { width: 760px; height: 760px; left: 30%; top: 10%; background: radial-gradient(closest-side, rgba(191,90,242,.22), transparent); animation-delay: -7s; }
.prs-aura i:nth-child(3) { width: 700px; height: 700px; right: -260px; bottom: -340px; background: radial-gradient(closest-side, rgba(255,55,95,.18), transparent); animation-delay: -13s; }
.prs-sh h2 { color: #fff; } .prs-sh p { color: #a1a1a6; } .prs-kick { background: rgba(191,90,242,.16) !important; color: #d8a6ff !important; }
.prs-stage { position: relative; display: grid; grid-template-columns: 1fr 1.15fr 1fr; gap: 6%; align-items: end; margin: 56px auto 0; max-width: 1060px; padding: 0 1%; }
.prs-wires { position: absolute; left: 0; right: 0; top: 0; width: 100%; height: 300px; overflow: visible; pointer-events: none; }
.prs-wires .w { fill: none; stroke: rgba(255,255,255,.1); stroke-width: 2; vector-effect: non-scaling-stroke; }
.prs-wires .p { fill: none; stroke: url(#prsG); stroke-width: 3; vector-effect: non-scaling-stroke; stroke-linecap: round; stroke-dasharray: 2 26; opacity: 0; transition: opacity .6s; animation: prsFlow 1s linear infinite; filter: drop-shadow(0 0 6px rgba(191,90,242,.9)); }
@keyframes prsFlow { to { stroke-dashoffset: -28; } }
.prs[data-st="1"] .p1, .prs[data-st="1"] .p2, .prs[data-st="4"] .p3, .prs[data-st="3"] .p3 { opacity: 1; }
.prs-dev { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; }
.prs-dev > em { margin-top: 14px; font-style: normal; font-size: 13px; font-weight: 600; color: #a1a1a6; letter-spacing: .01em; }
.prs-scr { position: relative; width: 100%; aspect-ratio: 16 / 10.5; border-radius: 14px; border: 5px solid #0b0b0e; background: linear-gradient(180deg, #17171c, #0e0e12); box-shadow: 0 0 0 1px #3a3a42, 0 40px 70px -34px rgba(0,0,0,.9); overflow: hidden; padding: 10px; display: flex; flex-direction: column; gap: 8px; transition: box-shadow .8s, filter .8s; }
.prs-scr::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(118deg, rgba(255,255,255,.08), rgba(255,255,255,.015) 32%, transparent 33%); }
.prs-stand { width: 16%; height: 18px; background: linear-gradient(90deg, #8e9098, #dcdde2 45%, #b9bbc1 60%, #8a8c94); clip-path: polygon(18% 0, 82% 0, 100% 100%, 0 100%); }
.prs-stand::after { content: ""; display: block; }
.prs-bar { display: flex; align-items: center; gap: 7px; font-size: 10px; } .prs-bar b { font-size: 10.5px; color: #e5e5ea; }
.prs-bar .l { display: flex; gap: 3px; } .prs-bar .l i { width: 6px; height: 6px; border-radius: 50%; background: #ff5f57; } .prs-bar .l i:nth-child(2) { background: #febc2e; } .prs-bar .l i:nth-child(3) { background: #28c840; }
.prs-bar .tally { margin-left: auto; padding: 2px 6px; border-radius: 5px; background: #ff3b30; color: #fff; font-weight: 800; font-size: 8.5px; letter-spacing: .05em; box-shadow: 0 0 12px rgba(255,59,48,.6); }
.prs-bar .pill { margin-left: auto; display: inline-flex; align-items: center; gap: 4px; padding: 2px 7px; border-radius: 99px; font-weight: 700; font-size: 8.5px; background: rgba(48,209,88,.16); color: #30d158; transition: .5s; }
.prs-bar .pill > i { width: 5px; height: 5px; border-radius: 50%; background: currentColor; box-shadow: 0 0 6px currentColor; }
.prs-np { display: flex; gap: 8px; align-items: center; } .prs-np .art { width: 30px; height: 30px; border-radius: 8px; display: grid; place-items: center; background: linear-gradient(135deg, #0a84ff, #5e5ce6); font-size: 15px; }
.prs-np b { display: block; font-size: 11px; } .prs-np small { font-size: 9.5px; color: #8e8e93; }
.prs-wave { flex: 1; display: flex; align-items: center; gap: 2px; min-height: 26px; }
.prs-wave i { flex: 1; border-radius: 2px; background: #0a84ff; height: 30%; animation: prpWave 1.2s ease-in-out infinite alternate; animation-delay: calc(var(--i) * -83ms); }
.prs-proc { position: relative; display: flex; align-items: center; gap: 6px; height: 24px; padding: 0 8px; border-radius: 7px; background: rgba(255,255,255,.05); font-size: 9.5px; font-weight: 600; color: #8e8e93; transition: background .6s, color .6s, box-shadow .6s; }
.prs-proc > i { font-size: 13px; }
.prs .t2, .prs .t3 { display: none; }
.prs[data-st="3"] .prs-proc, .prs[data-st="4"] .prs-proc { background: rgba(191,90,242,.18); color: #e3b8ff; box-shadow: 0 0 0 1px rgba(191,90,242,.45), 0 0 24px -4px rgba(191,90,242,.7); }
.prs[data-st="3"] .prs-desk .prs-proc .t1, .prs[data-st="4"] .prs-desk .prs-proc .t1 { display: none; } .prs[data-st="3"] .prs-desk .prs-proc .t2, .prs[data-st="4"] .prs-desk .prs-proc .t2 { display: inline; }
.prs[data-st="3"] .prs-desk .prs-scr, .prs[data-st="4"] .prs-desk .prs-scr { box-shadow: 0 0 0 1px #3a3a42, 0 0 60px -10px rgba(191,90,242,.55), 0 40px 70px -34px rgba(0,0,0,.9); }
.prs-lcd { padding: 7px 9px; border-radius: 8px; background: #050507; box-shadow: inset 0 0 0 .5px rgba(255,255,255,.08); }
.prs-lcd small { display: block; font: 600 7.5px ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .1em; color: #ff8aa5; } .prs-lcd b { display: flex; gap: 5px; align-items: center; font-size: 11.5px; margin-top: 2px; } .prs-lcd b i { color: #ff375f; }
.prs-meters { flex: 1; display: flex; gap: 3px; }
.prs-meters span { flex: 1; position: relative; border-radius: 3px; overflow: hidden; background: repeating-linear-gradient(0deg, rgba(255,255,255,.06) 0 2px, transparent 2px 4px), #09090b; }
.prs-meters i { position: absolute; left: 1px; right: 1px; border-radius: 2px; animation: mppM .9s ease-in-out infinite alternate; animation-delay: calc(var(--i) * -.13s); }
.prs-meters .lv i { bottom: 1px; height: 78%; background: linear-gradient(0deg, #30d158 0 60%, #ffd60a 60% 85%, #ff453a 85%); transform-origin: bottom; }
.prs-meters .lv.o i { background: linear-gradient(0deg, #0a84ff 0 60%, #64d2ff 60% 85%, #ff453a 85%); }
.prs-meters .gr i { top: 1px; height: 42%; background: linear-gradient(180deg, #ffb340, #ff6a00); transform-origin: top; } .prs-meters .gr.lim i { background: linear-gradient(180deg, #ff6482, #ff2d55); }
.prs-pc .prs-scr { box-shadow: 0 0 0 1px #3a3a42, 0 0 70px -12px rgba(191,90,242,.6), 0 40px 70px -34px rgba(0,0,0,.9); }
.prs-off { position: absolute; inset: 0; display: grid; place-content: center; justify-items: center; gap: 4px; text-align: center; background: rgba(5,5,8,.92); opacity: 0; transition: opacity .6s; }
.prs-off i { font-size: 26px; color: #ff453a; } .prs-off b { font-size: 12px; } .prs-off small { font-size: 9.5px; color: #8e8e93; max-width: 80%; }
.prs[data-st="2"] .prs-off, .prs[data-st="3"] .prs-off { opacity: 1; }
.prs[data-st="2"] .prs-pc .prs-scr, .prs[data-st="3"] .prs-pc .prs-scr { box-shadow: 0 0 0 1px #3a3a42, 0 40px 70px -34px rgba(0,0,0,.9); }
.prs[data-st="2"] .prs-pc .pill, .prs[data-st="3"] .prs-pc .pill { background: rgba(255,69,58,.16); color: #ff453a; }
.prs[data-st="2"] .prs-pc .pill .t1, .prs[data-st="3"] .prs-pc .pill .t1 { display: none; } .prs[data-st="2"] .prs-pc .pill .t2, .prs[data-st="3"] .prs-pc .pill .t2 { display: inline; }
.prs-tower { position: relative; width: 58%; aspect-ratio: 80 / 120; display: grid; place-items: end center; }
.prs-tower svg { width: 100%; height: 100%; } .prs-tower svg path { fill: none; stroke: #c7c7cc; stroke-width: 2.2; stroke-linecap: round; } .prs-tower svg circle { fill: #ff375f; filter: drop-shadow(0 0 6px #ff375f); }
.prs-tower .r { position: absolute; left: 50%; top: 11.5%; width: 0; height: 0; }
.prs-tower .r i { position: absolute; left: -60px; top: -60px; width: 120px; height: 120px; border-radius: 50%; border: 1.5px solid rgba(255,55,95,.6); animation: prsRing 2.4s ease-out infinite; opacity: 0; }
.prs-tower .r i:nth-child(2) { animation-delay: .8s; } .prs-tower .r i:nth-child(3) { animation-delay: 1.6s; }
@keyframes prsRing { 0% { transform: scale(.15); opacity: .9; } 100% { transform: scale(1.5); opacity: 0; } }
.prs[data-st="2"] .prs-tower .r i { border-color: rgba(255,214,10,.5); }
.prs-src { margin-top: 10px; text-align: center; min-height: 44px; } .prs-src small { display: block; font-size: 10.5px; color: #8e8e93; }
.prs-src b { display: inline-flex; align-items: center; gap: 6px; margin-top: 4px; padding: 4px 10px; border-radius: 99px; font-size: 11.5px; background: rgba(191,90,242,.16); color: #e3b8ff; }
.prs-src b i { width: 6px; height: 6px; border-radius: 50%; background: #bf5af2; box-shadow: 0 0 8px #bf5af2; }
.prs[data-st="3"] .prs-src .t1, .prs[data-st="4"] .prs-src .t1 { display: none; } .prs[data-st="3"] .prs-src .t2, .prs[data-st="4"] .prs-src .t2 { display: inline-flex; }
.prs-lock { display: flex; align-items: center; gap: 14px; max-width: 560px; margin: 42px auto 0; padding: 12px 14px; border-radius: 18px; background: rgba(255,255,255,.06); border: .5px solid rgba(255,255,255,.1); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); }
.prs-lock .ic { width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; font-size: 21px; color: #bf5af2; background: rgba(191,90,242,.16); }
.prs-lock .who { flex: 1; } .prs-lock .who small { display: block; font-size: 11px; color: #8e8e93; } .prs-lock .who b { font-size: 14px; }
.prs[data-st="3"] .prs-lock .t1, .prs[data-st="4"] .prs-lock .t1 { display: none; } .prs[data-st="3"] .prs-lock .t2 { display: inline; } .prs[data-st="4"] .prs-lock .t3 { display: inline; }
.prs[data-st="2"] .prs-lock .who b { color: #ffd60a; }
.prs-take { display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 0 14px; border-radius: 99px; font-size: 12.5px; font-weight: 700; background: rgba(255,255,255,.08); color: #8e8e93; transition: .5s; white-space: nowrap; }
.prs[data-st="4"] .prs-take { background: #0071e3; color: #fff; box-shadow: 0 0 0 6px rgba(0,113,227,.2), 0 10px 26px -8px #0071e3; animation: prsPulse 1.2s ease-in-out infinite; }
@keyframes prsPulse { 50% { box-shadow: 0 0 0 12px rgba(0,113,227,0), 0 10px 26px -8px #0071e3; } }
.prs-steps { list-style: none; padding: 0; margin: 44px 0 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.prs-steps li { position: relative; display: flex; gap: 12px; padding: 16px; border-radius: 18px; background: rgba(255,255,255,.035); border: .5px solid rgba(255,255,255,.07); transition: background .5s, border-color .5s, transform .5s var(--ease); cursor: pointer; overflow: hidden; }
.prs-steps li > span { flex: none; width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 800; background: rgba(255,255,255,.08); color: #a1a1a6; transition: .5s; }
.prs-steps b { display: block; font-size: 14px; } .prs-steps small { display: block; font-size: 12.5px; color: #8e8e93; line-height: 1.45; margin-top: 3px; }
.prs-steps li::after { content: ""; position: absolute; left: 0; bottom: 0; height: 2px; width: 0; background: linear-gradient(90deg, #bf5af2, #ff375f); }
.prs[data-st="1"] li[data-s="1"], .prs[data-st="2"] li[data-s="2"], .prs[data-st="3"] li[data-s="3"], .prs[data-st="4"] li[data-s="4"] { background: rgba(191,90,242,.12); border-color: rgba(191,90,242,.4); transform: translateY(-3px); }
.prs[data-st="1"] li[data-s="1"] > span, .prs[data-st="2"] li[data-s="2"] > span, .prs[data-st="3"] li[data-s="3"] > span, .prs[data-st="4"] li[data-s="4"] > span { background: #bf5af2; color: #fff; }
.prs[data-st="1"] li[data-s="1"]::after, .prs[data-st="2"] li[data-s="2"]::after, .prs[data-st="3"] li[data-s="3"]::after, .prs[data-st="4"] li[data-s="4"]::after { animation: prsProg var(--dur, 4s) linear forwards; }
@keyframes prsProg { to { width: 100%; } }
.prp-end-g { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 56px; align-items: center; }
.prp-end h2 { font: 800 clamp(30px, 3.6vw, 48px)/1.05 var(--display); letter-spacing: -0.04em; margin: 14px 0 14px; } .prp-end p { color: var(--ink-2); font-size: 17px; line-height: 1.55; margin: 0 0 24px; }
.prp-end .ctas { display: flex; gap: 12px; flex-wrap: wrap; }
.prp-end-l { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.prp-end-l li { padding: 20px; border-radius: 22px; background: #fff; border: .5px solid var(--hair); box-shadow: 0 20px 40px -32px rgba(0,0,0,.35); }
.prp-end-l i { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 13px; font-size: 22px; color: var(--c); background: color-mix(in srgb, var(--c) 13%, #fff); margin-bottom: 12px; }
.prp-end-l b { display: block; font-size: 15px; } .prp-end-l small { color: var(--ink-2); font-size: 13px; }
@media (max-width: 980px) { .prs-steps { grid-template-columns: 1fr 1fr; } .prp-end-g { grid-template-columns: 1fr; } }
@media (max-width: 720px) {
  .prs { padding: 80px 0; } .prs-stage { grid-template-columns: 1fr; gap: 26px; max-width: 360px; } .prs-wires { display: none; }
  .prs-tower { width: 34%; } .prs-steps { grid-template-columns: 1fr; } .prs-lock { flex-wrap: wrap; } .prp-end-l { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) { .prs-wires .p, .prs-wave i, .prs-meters i, .prs-tower .r i, .prs-take { animation: none !important; } }
.prs-sh h2 { font: 800 clamp(34px, 4.4vw, 60px)/1.05 var(--display) !important; letter-spacing: -0.045em; text-wrap: balance; margin: 16px 0 18px; }
.prs-sh p { max-width: 62ch; margin-left: auto; margin-right: auto; font-size: 18px; }
.prs-wires .p { stroke-width: 4; stroke-dasharray: 10 16; }
@keyframes prsFlow { to { stroke-dashoffset: -52; } }
.prs-meters .gr i { height: 46%; }
@media (max-width: 720px) { .prs-lock .who { flex: 1 1 calc(100% - 60px); min-width: 0; } .prs-take { flex: 1 1 100%; justify-content: center; } }

/* Radyomasyon logosu (küçük r · yayın dalgası) */
.brand-mark:has(> .ph-broadcast) { background: url(../img/radyomasyon-simge.svg) center / 100% 100% no-repeat !important; border-radius: 0 !important; box-shadow: none !important; filter: drop-shadow(0 4px 10px rgba(215,15,90,.28)); }
.brand-mark:has(> .ph-broadcast) > i { visibility: hidden; }
.brand { text-transform: lowercase; letter-spacing: -0.03em; }
/* Radyomasyon TV: grafik kategorileri ve üç seviye */
.tvp-cats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.tvp-cat { display: flex; gap: 14px; align-items: flex-start; padding: 20px; border-radius: 22px; background: #fff; box-shadow: 0 0 0 0.5px var(--hair), 0 24px 50px -40px rgba(0,0,0,.4); }
.tvp-cat .ai { width: 44px; height: 44px; flex: none; border-radius: 13px; display: grid; place-items: center; font-size: 24px; color: var(--k); background: rgba(0,0,0,.045); background: color-mix(in srgb, var(--k) 14%, transparent); }
.tvp-cat h3 { margin: 2px 0 6px; font: 700 17px var(--display); letter-spacing: -0.02em; }
.tvp-cat p { margin: 0; font-size: 14px; line-height: 1.5; color: var(--ink-2); }
.tvp-more { margin-top: 22px; }
.tvp-lv.tvp-lv3 { grid-template-columns: repeat(3, 1fr); max-width: 1160px; }
@media (max-width: 960px) { .tvp-cats, .tvp-lv.tvp-lv3 { grid-template-columns: 1fr; } }

/* =========================================================
   TV VE VİDEO — çoklu platform, CaptStudio, masaüstü uygulaması (v2.1.29)
   ========================================================= */
.nav-dot { font-style: normal; font-size: 10px; font-weight: 800; letter-spacing: .02em; padding: 2px 6px; border-radius: 6px; margin-left: 2px; color: #fff; background: linear-gradient(135deg, #ff375f, #ff9f0a); vertical-align: 1px; }
/* mega menü ön izlemeleri */
.mp-tv-v { position: relative; height: 128px; border-radius: 12px; overflow: hidden; background: radial-gradient(60% 80% at 30% 40%, #ff9f6a, transparent 60%), radial-gradient(50% 70% at 75% 30%, #5e5ce6, transparent 60%), linear-gradient(135deg, #2b1055, #0b0b1f); }
.mp-tv-v > i { position: absolute; left: 40%; bottom: 0; width: 70px; height: 90px; border-radius: 40px 40px 0 0; background: rgba(0,0,0,.55); }
.mp-tv-lt { position: absolute; left: 10px; bottom: 12px; padding: 5px 10px 5px 12px; border-radius: 6px; background: rgba(15,15,20,.82); border-left: 3px solid #ff375f; animation: mpLt 4s var(--ease) infinite; }
.mp-tv-lt b { display: block; color: #fff; font-size: 11.5px; } .mp-tv-lt small { color: #c7c7cc; font-size: 10px; }
@keyframes mpLt { 0%, 8% { opacity: 0; transform: translateX(-12px); } 18%, 82% { opacity: 1; transform: none; } 92%, 100% { opacity: 0; transform: translateX(-12px); } }
.mp-tv-src { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; margin-top: 8px; }
.mp-tv-src i { height: 34px; border-radius: 7px; background: linear-gradient(135deg, #2a2f3a, #14161c); box-shadow: inset 0 0 0 1px rgba(0,0,0,.06); }
.mp-tv-src i.pg { box-shadow: inset 0 0 0 2px #ff375f; background: linear-gradient(135deg, #ff9f6a, #5e5ce6); } .mp-tv-src i.pv { box-shadow: inset 0 0 0 2px #30d158; }
.mp-pf { position: relative; height: 164px; }
.mp-pf .c { position: absolute; left: 50%; top: 50%; width: 46px; height: 46px; margin: -23px 0 0 -23px; border-radius: 14px; display: grid; place-items: center; color: #fff; font-size: 22px; background: linear-gradient(135deg, #0a84ff, #5e5ce6); box-shadow: 0 0 0 6px rgba(10,132,255,.12), 0 10px 30px -8px rgba(10,132,255,.8); z-index: 1; animation: mpPulse 2s ease-in-out infinite; }
@keyframes mpPulse { 50% { box-shadow: 0 0 0 12px rgba(10,132,255,.06), 0 10px 30px -8px rgba(10,132,255,.8); } }
.mp-pf .n { position: absolute; left: 50%; top: 50%; width: 32px; height: 32px; margin: -16px 0 0 -16px; border-radius: 10px; display: grid; place-items: center; font-size: 17px; color: var(--k); background: #fff; box-shadow: 0 0 0 0.5px var(--hair), 0 6px 14px -8px rgba(0,0,0,.4); transform: rotate(var(--a)) translate(66px) rotate(calc(-1 * var(--a))); }
.mp-pf .n::before { content: ""; position: absolute; right: 50%; top: 50%; width: 40px; height: 2px; transform-origin: right center; transform: rotate(var(--a)) translateX(-16px); opacity: 0; }
.mp-cap-v { height: 96px; border-radius: 12px; display: grid; place-items: center; background: linear-gradient(180deg, #2b1055, #d2546a 60%, #ffb36b); overflow: hidden; position: relative; }
.mp-cap-v b { color: #fff; font: 900 20px var(--display); letter-spacing: -0.02em; text-shadow: 0 4px 20px rgba(0,0,0,.4); animation: mpCap 3.2s var(--ease) infinite; }
@keyframes mpCap { 0% { opacity: 0; transform: translateY(10px) scale(.9); } 20%, 80% { opacity: 1; transform: none; } 100% { opacity: 0; } }
.mp-cap-tl { position: relative; margin-top: 8px; padding: 6px; border-radius: 10px; background: #1c1c22; display: grid; gap: 4px; }
.mp-cap-tl span { height: 12px; border-radius: 4px; display: flex; gap: 2px; }
.mp-cap-tl .t { width: 46%; margin-left: 4%; background: linear-gradient(90deg, rgba(255,214,10,.5), rgba(255,159,10,.35)); }
.mp-cap-tl .v i { flex: 1; border-radius: 3px; background: linear-gradient(135deg, #3a5a9a, #1f3157); } .mp-cap-tl .v i:nth-child(2) { background: linear-gradient(135deg, #ff9f6a, #d2546a); } .mp-cap-tl .v i:nth-child(4) { background: linear-gradient(135deg, #30d158, #0f3b2a); }
.mp-cap-tl .a { background: repeating-linear-gradient(90deg, #30d158 0 2px, transparent 2px 5px); opacity: .7; }
.mp-cap-tl em { position: absolute; top: 2px; bottom: 2px; width: 2px; background: #ffd60a; left: 8%; animation: mpPh 4s linear infinite; }
@keyframes mpPh { to { left: 92%; } }
.mp-ln { display: flex; justify-content: center; gap: 10px; padding: 34px 0; }
.mp-ln span { width: 46px; height: 46px; border-radius: 14px; display: grid; place-items: center; font-size: 22px; color: #fff; background: var(--k); box-shadow: 0 10px 24px -10px var(--k); animation: mpLn 5s var(--ease) infinite; animation-delay: calc(var(--i) * 1s); }
@keyframes mpLn { 0%, 30%, 100% { transform: none; } 10% { transform: translateY(-10px) scale(1.12); } }

/* ---- ortak rozetler ve degradeler ---- */
.cp-badge { display: inline-flex; align-items: center; gap: 6px; height: 24px; padding: 0 9px; border-radius: 7px; font: 800 12.5px/1 var(--display); color: #1a1200; background: linear-gradient(135deg, #ffe14d, #ff9f0a); box-shadow: 0 6px 16px -6px rgba(255,159,10,.8); white-space: nowrap; }
.cp-grad { background: linear-gradient(100deg, #ffd60a 0%, #ff9f0a 35%, #ff3d8b 70%, #7d5cff 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.mu-badge { display: inline-flex; align-items: center; gap: 6px; height: 24px; padding: 0 9px; border-radius: 7px; font: 800 12.5px/1 var(--display); color: #fff; background: linear-gradient(135deg, #0a84ff, #5e5ce6); box-shadow: 0 6px 16px -6px rgba(10,132,255,.8); white-space: nowrap; }
.mu-grad { background: linear-gradient(100deg, #64d2ff 0%, #0a84ff 35%, #5e5ce6 65%, #ff375f 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.cpp-aura i:nth-child(1) { background: radial-gradient(closest-side, rgba(255,159,10,.4), rgba(255,159,10,.1) 55%, transparent) !important; }
.cpp-aura i:nth-child(2) { background: radial-gradient(closest-side, rgba(255,61,139,.34), rgba(255,61,139,.08) 55%, transparent) !important; }
.cpp-aura i:nth-child(3) { background: radial-gradient(closest-side, rgba(125,92,255,.3), rgba(125,92,255,.08) 55%, transparent) !important; }

/* ---- koyu bölümler ---- */
.cpp-dark, .pfs { position: relative; overflow: hidden; isolation: isolate; background: #040406; color: #f5f5f7; padding: 110px 0; }
.cpp-dark .dx-sh p, .pfs .dx-sh p { color: #a1a1a6; }
.cpp-dark .dx-kick { color: #ffc95c; background: rgba(255,159,10,.14); }
.pfs .dx-kick { color: #7cc4ff; background: rgba(10,132,255,.16); }
.cpp-dark h2, .pfs h2 { color: #fff; font: 800 clamp(34px, 4.6vw, 60px)/1.03 var(--display); letter-spacing: -0.05em; margin: 0 0 16px; text-wrap: balance; }
.cpp-dark p { color: #a1a1a6; }

/* ---- çoklu platform ekranı ---- */
.pfs .dx-aura i:nth-child(1) { background: radial-gradient(closest-side, rgba(10,132,255,.36), rgba(10,132,255,.08) 55%, transparent); }
.pfs .dx-aura i:nth-child(2) { background: radial-gradient(closest-side, rgba(255,55,95,.3), rgba(255,55,95,.08) 55%, transparent); }
.pf { position: relative; max-width: 1080px; height: 560px; margin: 0 auto; }
.pf-beams { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; overflow: visible; }
.pf-ln { fill: none; stroke: rgba(255,255,255,.1); stroke-width: 1.2; transition: opacity .3s; }
.pf-pk { fill: none; stroke-width: 2.4; stroke-linecap: round; stroke-dasharray: 10 90; animation: pfFlow 1.6s linear infinite; filter: drop-shadow(0 0 6px currentColor); transition: opacity .3s; }
.pf-ln.off, .pf-pk.off { opacity: .08; animation-play-state: paused; }
@keyframes pfFlow { from { stroke-dashoffset: 100; } to { stroke-dashoffset: 0; } }
.pf-core { position: absolute; left: 50%; top: 50%; width: 300px; transform: translate(-50%, -50%); display: grid; gap: 10px; z-index: 2; }
.pf-mon { position: relative; aspect-ratio: 16/9; border-radius: 16px; overflow: hidden; background: #000; box-shadow: 0 0 0 1px rgba(255,255,255,.14), 0 30px 80px -20px rgba(10,132,255,.55), 0 0 120px -30px rgba(255,55,95,.6); }
.pf-mon canvas { width: 100%; height: 100%; display: block; }
.pf-mon-b { position: absolute; right: 8px; top: 8px; font-size: 11px; font-weight: 700; color: #fff; padding: 3px 8px; border-radius: 6px; background: rgba(0,0,0,.55); backdrop-filter: blur(8px); }
.pf-enc { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 14px; background: rgba(28,28,34,.8); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.14); }
.pf-enc-i { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; color: #fff; font-size: 18px; background: conic-gradient(from 0deg, #0a84ff, #5e5ce6, #ff375f, #ff9f0a, #0a84ff); animation: pfSpin 4s linear infinite; }
@keyframes pfSpin { to { filter: hue-rotate(360deg); } }
.pf-enc b { display: block; color: #fff; font-size: 13.5px; } .pf-enc small { color: #8e8e93; font-size: 11.5px; }
.pf-sum { position: absolute; left: 50%; top: -74px; transform: translateX(-50%); display: flex; align-items: center; gap: 8px; white-space: nowrap; }
.pf-sum b { font: 800 40px/1 var(--display); letter-spacing: -0.04em; background: linear-gradient(135deg, #fff, #7cc4ff); -webkit-background-clip: text; background-clip: text; color: transparent; }
.pf-sum span { font-size: 12px; line-height: 1.2; color: #a1a1a6; text-align: left; }
.pf-node { position: absolute; z-index: 3; display: grid; grid-template-columns: 38px auto; grid-template-rows: auto auto; column-gap: 10px; align-items: center; padding: 9px 12px 9px 9px; border: 0; border-radius: 16px; cursor: pointer; text-align: left; color: #fff; background: rgba(22,22,28,.78); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.14), 0 18px 40px -20px rgba(0,0,0,.9); transition: transform .25s var(--ease), opacity .25s; animation: pfIn .7s var(--ease) both; animation-delay: calc(var(--i) * 70ms); }
.pf-node:hover { transform: translateY(-3px); }
.pf-node.off { opacity: .4; }
.pf-node.off .pf-st::after { content: " · kapalı"; }
@keyframes pfIn { from { opacity: 0; transform: scale(.85); } }
.pf-ic { grid-row: span 2; width: 38px; height: 38px; border-radius: 11px; display: grid; place-items: center; font-size: 21px; color: var(--k); background: color-mix(in srgb, var(--k) 16%, rgba(255,255,255,.04)); box-shadow: inset 0 0 0 0.5px color-mix(in srgb, var(--k) 40%, transparent); }
.pf-t b { display: block; font: 700 13.5px var(--display); }
.pf-t small { display: flex; align-items: center; gap: 4px; font-size: 11px; color: #8e8e93; white-space: nowrap; }
.pf-dot { width: 6px; height: 6px; border-radius: 50%; background: #30d158; box-shadow: 0 0 8px #30d158; animation: pfBlink 1.6s ease-in-out infinite; }
.pf-node.off .pf-dot { background: #8e8e93; box-shadow: none; animation: none; }
@keyframes pfBlink { 50% { opacity: .35; } }
.pf-vw { position: absolute; right: 10px; top: -9px; font-size: 10.5px; font-weight: 700; padding: 2px 7px; border-radius: 8px; background: rgba(255,45,85,.92); color: #fff; display: inline-flex; align-items: center; gap: 4px; font-variant-numeric: tabular-nums; }
.pf-node.off .pf-vw { background: #3a3a3c; }
/* düğümlerin yerleri: iki kolon halinde çekirdeğin çevresi */
.pf-node:nth-of-type(1) { left: 2%; top: 4%; } .pf-node:nth-of-type(2) { left: 0; top: 26%; } .pf-node:nth-of-type(3) { left: 1%; top: 48%; } .pf-node:nth-of-type(4) { left: 4%; top: 70%; } .pf-node:nth-of-type(5) { left: 22%; top: 88%; }
.pf-node:nth-of-type(6) { right: 2%; top: 4%; } .pf-node:nth-of-type(7) { right: 0; top: 26%; } .pf-node:nth-of-type(8) { right: 1%; top: 48%; } .pf-node:nth-of-type(9) { right: 4%; top: 70%; } .pf-node:nth-of-type(10) { right: 22%; top: 88%; }
.pfs-pts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-top: 56px; }
.pfs-pts > div { padding: 20px; border-radius: 20px; background: rgba(255,255,255,.04); box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.1); }
.pfs-pts i { font-size: 26px; color: #7cc4ff; } .pfs-pts b { display: block; color: #fff; font: 700 16px var(--display); margin: 10px 0 6px; } .pfs-pts span { color: #8e8e93; font-size: 13.5px; line-height: 1.5; }
.pfs-logos, .tvh-pf { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 34px; }
.pfs-logos span, .tvh-pf span { display: inline-flex; align-items: center; gap: 7px; height: 34px; padding: 0 13px 0 10px; border-radius: 17px; font-size: 13px; font-weight: 600; color: #e5e5ea; background: rgba(255,255,255,.05); box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.12); }
.pfs-logos i, .tvh-pf i { color: var(--k); font-size: 17px; }
.tvh-pf { margin: 26px auto 0; max-width: 1120px; }
.tvh-pf .tvh-pf-l { background: none; box-shadow: none; color: #8e8e93; } .tvh-pf .tvh-pf-l i { color: #ff8fab; }
.pfs-note { text-align: center; color: #8e8e93; font-size: 13.5px; margin: 22px 0 0; } .pfs-note a { color: #7cc4ff; }
.pf.sm { height: 440px; }

/* ---- CaptStudio düzenleyici ekranı ---- */
.cpm { --cpb: #0d0d10; position: relative; border-radius: 18px; overflow: hidden; background: var(--cpb); color: #eeeef3; font-size: 12px; box-shadow: 0 0 0 1px rgba(255,255,255,.1), 0 60px 120px -40px rgba(0,0,0,.9), 0 0 140px -40px rgba(255,159,10,.45); text-align: left; user-select: none; }
.cpm-bar { display: flex; align-items: center; gap: 10px; height: 42px; padding: 0 12px; background: rgba(20,20,24,.95); border-bottom: 1px solid rgba(255,255,255,.06); }
.cpm-dots { display: inline-flex; gap: 6px; } .cpm-dots i { width: 11px; height: 11px; border-radius: 50%; background: #ff5f57; } .cpm-dots i:nth-child(2) { background: #febc2e; } .cpm-dots i:nth-child(3) { background: #28c840; }
.cpm-brand { display: inline-flex; align-items: center; gap: 7px; font-size: 13px; margin-left: 6px; }
.cpm-logo { width: 22px; height: 22px; border-radius: 6px; display: grid; place-items: center; font-size: 13px; color: #1a1200; background: linear-gradient(135deg, #ffe14d, #ff9f0a); }
.cpm-name { color: rgba(255,255,255,.55); font-weight: 600; }
.cpm-sp { flex: 1; }
.cpm-asp { display: inline-flex; gap: 2px; padding: 2px; border-radius: 8px; background: rgba(255,255,255,.06); } .cpm-asp em { font-style: normal; font-size: 11px; font-weight: 600; padding: 3px 7px; border-radius: 6px; color: rgba(255,255,255,.5); } .cpm-asp em.on { background: rgba(255,255,255,.14); color: #fff; }
.cpm-magic { border: 0; cursor: pointer; font: inherit; font-size: 12px; font-weight: 700; color: #fff; padding: 6px 11px; border-radius: 9px; display: inline-flex; align-items: center; gap: 6px; background: linear-gradient(135deg, #7d5cff, #ff3d8b 55%, #ff9f0a); box-shadow: 0 8px 20px -8px rgba(255,61,139,.9); position: relative; overflow: hidden; }
.cpm-magic::after { content: ""; position: absolute; inset: 0; background: linear-gradient(110deg, transparent 30%, rgba(255,255,255,.4) 50%, transparent 70%); transform: translateX(-120%); animation: cpShine 3.5s ease-in-out infinite; }
@keyframes cpShine { 0%, 60% { transform: translateX(-120%); } 100% { transform: translateX(120%); } }
.cpm-exp { font-size: 12px; font-weight: 700; color: #1a1200; padding: 6px 11px; border-radius: 9px; display: inline-flex; align-items: center; gap: 6px; background: linear-gradient(180deg, #ffe14d, #ffb800); }
.cpm-mid { display: grid; grid-template-columns: 210px minmax(0, 1fr) 190px; height: 330px; }
.cpm-lib { display: flex; border-right: 1px solid rgba(255,255,255,.06); background: #111114; min-width: 0; }
.cpm-rail { width: 40px; display: flex; flex-direction: column; align-items: center; gap: 14px; padding-top: 12px; border-right: 1px solid rgba(255,255,255,.05); font-size: 17px; color: rgba(255,255,255,.35); } .cpm-rail .on { color: #ffd60a; }
.cpm-media { flex: 1; display: grid; grid-template-columns: 1fr 1fr; gap: 7px; padding: 10px; align-content: start; min-width: 0; }
.cpm-th { position: relative; aspect-ratio: 16/10; border-radius: 7px; overflow: hidden; display: block; }
.cpm-th em { position: absolute; right: 4px; top: 4px; font-style: normal; font-size: 9px; font-weight: 700; padding: 1px 4px; border-radius: 3px; background: rgba(0,0,0,.6); }
.cpm-th b { position: absolute; left: 0; right: 0; bottom: 0; padding: 10px 5px 3px; font-size: 9px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; background: linear-gradient(transparent, rgba(0,0,0,.75)); }
.sc-sunset { background: linear-gradient(180deg, #2b1055 0%, #d2546a 55%, #ffb36b 75%, #3a1d4f 76%); }
.sc-city { background: linear-gradient(180deg, #060a1c, #1a1f4a 50%, #121540 60%, #0d1030); }
.sc-concert { background: radial-gradient(60% 50% at 50% 60%, rgba(255,120,200,.6), transparent), linear-gradient(160deg, #3a0f5a, #07030f); }
.sc-mount { background: linear-gradient(180deg, #7ec8ff, #bfe6ff 45%, #4f6f9e 46%, #1d3352); }
.sc-waves { background: linear-gradient(180deg, #0a4a7a, #1b8ec2 50%, #2c86b8 51%, #0e5a8a); }
.sc-forest { background: linear-gradient(180deg, #0f3b2a, #2f7a4c 55%, #123a23); }
.cpm-view { display: flex; flex-direction: column; background: #060607; min-width: 0; }
.cpm-stage { flex: 1; position: relative; min-height: 0; overflow: hidden; }
.cpm-cv { position: absolute; top: 10px; bottom: 10px; left: 50%; transform: translateX(-50%); height: calc(100% - 20px); width: auto; max-width: calc(100% - 20px); aspect-ratio: 16/9; display: block; border-radius: 4px; background: #000; box-shadow: 0 20px 50px -20px rgba(0,0,0,.9); }
.cpm-tr { display: flex; align-items: center; justify-content: space-between; height: 40px; padding: 0 12px; border-top: 1px solid rgba(255,255,255,.06); }
.cpm-tc { font: 700 12px ui-monospace, Menlo, Consolas, monospace; color: #ffd60a; font-variant-numeric: tabular-nums; }
.cpm-ctl { display: inline-flex; align-items: center; gap: 12px; color: rgba(255,255,255,.6); font-size: 14px; }
.cpm-play { width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; background: #ffd60a; color: #111; font-size: 13px; }
.cpm-q { font-size: 11px; color: rgba(255,255,255,.4); }
.cpm-insp { padding: 12px; border-left: 1px solid rgba(255,255,255,.06); background: #111114; display: flex; flex-direction: column; gap: 9px; min-width: 0; }
.cpm-ih { display: flex; align-items: center; gap: 6px; font-size: 12px; padding-bottom: 8px; border-bottom: 1px solid rgba(255,255,255,.06); } .cpm-ih i { color: #ffd60a; font-size: 16px; }
.cpm-insp .cpm-row { display: flex; justify-content: space-between; font-size: 11px; color: rgba(255,255,255,.5); height: auto; border: 0; } .cpm-insp .cpm-row em { font-style: normal; color: #fff; font-weight: 600; }
.cpm-sl { display: grid; gap: 4px; font-size: 10.5px; color: rgba(255,255,255,.5); }
.cpm-sl i { height: 3px; border-radius: 3px; background: linear-gradient(90deg, #fff var(--v), rgba(255,255,255,.12) var(--v)); position: relative; }
.cpm-sl i::after { content: ""; position: absolute; left: var(--v); top: 50%; width: 9px; height: 9px; margin: -4.5px 0 0 -4.5px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.6); }
.cpm-tl { display: flex; height: 196px; border-top: 1px solid rgba(255,255,255,.1); background: #111114; }
.cpm-heads { width: 40px; display: grid; grid-template-rows: 22px repeat(5, 1fr); border-right: 1px solid rgba(255,255,255,.06); }
.cpm-heads span { display: grid; place-items: center; font-size: 14px; border-bottom: 1px solid rgba(255,255,255,.05); }
.cpm-heads span:nth-child(1) { color: #ffd60a; } .cpm-heads span:nth-child(2) { color: #bf5af2; } .cpm-heads span:nth-child(3) { color: #64a6ff; } .cpm-heads span:nth-child(4) { color: #4be08a; } .cpm-heads span:nth-child(5) { color: #ff6ba1; }
.cpm-heads::before { content: ""; }
.cpm-tracks { position: relative; flex: 1; display: grid; grid-template-rows: 22px repeat(5, 1fr); min-width: 0; padding: 0 8px; }
.cpm-ruler { position: relative; border-bottom: 1px solid rgba(255,255,255,.06); }
.cpm-ruler span { position: absolute; top: 5px; font-size: 9px; color: rgba(255,255,255,.35); transform: translateX(-50%); font-variant-numeric: tabular-nums; }
.cpm-tracks > .cpm-row { position: relative; border-bottom: 1px solid rgba(255,255,255,.05); }
.cpm-c { position: absolute; top: 4px; bottom: 4px; border-radius: 6px; display: flex; align-items: center; gap: 5px; padding: 0 7px; font-size: 10px; font-weight: 650; white-space: nowrap; overflow: hidden; box-shadow: inset 0 0 0 1px rgba(255,255,255,.14); transition: left .9s var(--ease), width .9s var(--ease), opacity .5s, transform .9s var(--ease); }
.cpm-tt .cpm-c { background: linear-gradient(180deg, rgba(255,214,10,.36), rgba(255,159,10,.22)); color: #fff6c8; }
.cpm-v2 .cpm-c { background: linear-gradient(180deg, #4a2c6a, #2a1a3d); }
.cpm-v1 .cpm-c { padding: 0; border-radius: 6px; }
.cpm-v1 .cpm-c.on { box-shadow: inset 0 0 0 2px #ffd60a; }
.cpm-trb { position: absolute; left: -9px; top: 50%; margin-top: -9px; width: 18px; height: 18px; border-radius: 5px; display: grid; place-items: center; font-size: 10px; color: #111; background: linear-gradient(135deg, #ffe14d, #ff9f0a); font-style: normal; z-index: 2; box-shadow: 0 2px 6px rgba(0,0,0,.6); }
.cpm-a1 .cpm-c { background: linear-gradient(180deg, #123d24, #0d2a19); flex-direction: column; align-items: stretch; justify-content: center; gap: 1px; padding: 2px 6px; }
.cpm-wave { display: flex; align-items: center; gap: 1px; height: 60%; } .cpm-wave i { flex: 1; height: var(--h); background: rgba(75,224,138,.6); border-radius: 1px; } .cpm-wave i.b { background: #6dffa6; }
.cpm-a1 small { font-size: 9px; color: rgba(255,255,255,.6); }
.cpm-beat { position: absolute; top: 0; width: 1.5px; height: 6px; background: #6dffa6; box-shadow: 0 0 5px #6dffa6; }
.cpm-a2 .cpm-c { background: linear-gradient(180deg, #4a1a31, #331222); }
.cpm-ph { position: absolute; top: 0; bottom: 0; width: 1.5px; background: #ffd60a; box-shadow: 0 0 10px rgba(255,214,10,.8); z-index: 4; left: 0; margin-left: 8px; }
.cpm-ph::before { content: ""; position: absolute; top: 0; left: -5px; width: 12px; height: 12px; background: #ffd60a; clip-path: polygon(0 0, 100% 0, 100% 55%, 50% 100%, 0 55%); }
.cpm-scan { position: absolute; inset: 22px 0 0; display: grid; place-items: center; background: rgba(10,10,14,.6); backdrop-filter: blur(3px); opacity: 0; pointer-events: none; transition: opacity .3s; z-index: 5; }
.cpm-scan span { font-size: 12px; font-weight: 700; padding: 8px 14px; border-radius: 20px; background: linear-gradient(135deg, rgba(125,92,255,.9), rgba(255,61,139,.9)); box-shadow: 0 10px 30px -8px rgba(255,61,139,.9); }
.cpm-scan::after { content: ""; position: absolute; top: 0; bottom: 0; width: 40%; left: -40%; background: linear-gradient(90deg, transparent, rgba(255,255,255,.12), transparent); animation: cpScan 1.1s linear infinite; }
@keyframes cpScan { to { left: 100%; } }
.cpm.cpm-run .cpm-scan { opacity: 1; }
.cpm:not(.cpm-built) .cpm-v1 .cpm-c { transform: translateY(-70px) scale(.8); opacity: 0; }
.cpm:not(.cpm-built) .cpm-tt .cpm-c, .cpm:not(.cpm-built) .cpm-v2 .cpm-c { opacity: 0; transform: translateY(-20px); }
.cpm.cpm-built .cpm-c { transition-delay: calc(var(--i) * 90ms); }
.cpm.sm .cpm-mid { grid-template-columns: 170px minmax(0, 1fr) 0; height: 360px; } .cpm.sm .cpm-insp { display: none; } .cpm.sm .cpm-tl { height: 170px; }

/* ---- CaptStudio sayfası ---- */
.cpp .dx-hero { padding-bottom: 70px; }
.cpp-hero-t { text-align: center; max-width: 920px; margin: 0 auto 46px; }
.cpp-hero-t .dx-lead { margin-left: auto; margin-right: auto; }
.cpp-hero-t .ctas { justify-content: center; }
.cpp-hero-v { max-width: 1180px; margin: 0 auto; position: relative; }
.cpp-hero-v::before { content: ""; position: absolute; inset: 10% 6% -8%; z-index: -1; background: radial-gradient(closest-side, rgba(255,159,10,.35), transparent); filter: blur(50px); }
.am-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.am-st { position: relative; padding: 18px 18px 22px; border-radius: 24px; background: rgba(255,255,255,.04); box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.1); }
.am-v { aspect-ratio: 16/10; border-radius: 14px; overflow: hidden; background: #0b0b0f; margin-bottom: 18px; box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.08); }
.am-v canvas { width: 100%; height: 100%; display: block; }
.am-n { position: absolute; left: 30px; top: 30px; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; font: 800 13px var(--display); color: #111; background: linear-gradient(135deg, #ffe14d, #ff9f0a); box-shadow: 0 6px 14px -4px rgba(255,159,10,.8); }
.am-st h3 { color: #fff; font: 700 20px var(--display); letter-spacing: -0.02em; margin: 0 0 8px; }
.am-st p { font-size: 14.5px; line-height: 1.55; margin: 0; }
.am-st:nth-child(2) { transition-delay: .12s; } .am-st:nth-child(3) { transition-delay: .24s; }
.am-remix { display: flex; align-items: center; gap: 16px; max-width: 760px; margin: 34px auto 0; padding: 18px 22px; border-radius: 20px; background: linear-gradient(135deg, rgba(125,92,255,.16), rgba(255,61,139,.12)); box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.14); }
.am-remix > i { font-size: 30px; color: #ff8fc7; } .am-remix b { display: block; color: #fff; font: 700 16px var(--display); } .am-remix span { color: #a1a1a6; font-size: 14px; }
.mq { overflow: hidden; display: grid; gap: 12px; padding: 6px 0 40px; -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.mq-row { display: flex; gap: 12px; width: max-content; animation: mqGo 60s linear infinite; }
.mq-row.rev { animation-direction: reverse; animation-duration: 70s; }
.mq:hover .mq-row, .mq.still .mq-row { animation-play-state: paused; }
@keyframes mqGo { to { transform: translateX(-50%); } }
.mq-it { display: inline-flex; align-items: center; gap: 10px; height: 54px; padding: 0 20px 0 10px; border-radius: 27px; font: 700 15.5px var(--display); letter-spacing: -0.01em; background: #fff; box-shadow: 0 0 0 0.5px var(--hair), 0 14px 30px -24px rgba(0,0,0,.5); white-space: nowrap; }
.mq-it i { width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; font-size: 18px; color: #fff; background: var(--k); box-shadow: 0 6px 14px -6px var(--k); }
.cpp-cats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.trg { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.trg-it { margin: 0; }
.trg-it canvas { width: 100%; aspect-ratio: 16/9; display: block; border-radius: 14px; background: #111; box-shadow: 0 0 0 0.5px var(--hair), 0 18px 34px -24px rgba(0,0,0,.6); }
.trg-it figcaption { font: 600 14px var(--display); margin-top: 8px; text-align: center; }
.cpp-two { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 54px; align-items: center; }
.cpp-two h2 { font-size: clamp(32px, 3.8vw, 50px); }
.cpp-two p { font-size: 17px; line-height: 1.6; }
.cpp-dim { font-size: 14px !important; color: #8e8e93 !important; }
.lk-v { position: relative; aspect-ratio: 16/9; border-radius: 18px; overflow: hidden; background: #000; cursor: ew-resize; box-shadow: 0 0 0 1px rgba(255,255,255,.12), 0 40px 80px -30px rgba(0,0,0,.9); touch-action: none; }
.lk-v canvas { width: 100%; height: 100%; display: block; }
.lk-split { position: absolute; top: 0; bottom: 0; width: 2px; margin-left: -1px; background: #fff; box-shadow: 0 0 12px rgba(0,0,0,.6); pointer-events: none; }
.lk-split b { position: absolute; top: 50%; left: 50%; width: 36px; height: 36px; margin: -18px 0 0 -18px; border-radius: 50%; display: grid; place-items: center; background: #fff; color: #111; font-size: 16px; box-shadow: 0 6px 18px rgba(0,0,0,.5); }
.lk-a, .lk-b { position: absolute; top: 12px; font-size: 12px; font-weight: 700; padding: 4px 10px; border-radius: 8px; background: rgba(0,0,0,.55); color: #fff; backdrop-filter: blur(8px); pointer-events: none; } .lk-a { left: 12px; } .lk-b { right: 12px; }
.lk-btns { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.lk-btns button { border: 0; cursor: pointer; height: 34px; padding: 0 14px; border-radius: 17px; font-weight: 600; font-size: 13.5px; color: #e5e5ea; background: rgba(255,255,255,.07); box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.14); transition: background .2s; }
.lk-btns button.on { background: linear-gradient(135deg, #ffe14d, #ff9f0a); color: #1a1200; box-shadow: 0 8px 20px -10px rgba(255,159,10,.9); }
.cpp-feat { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.cpp-f { padding: 24px; border-radius: 22px; background: #fff; box-shadow: 0 0 0 0.5px var(--hair), 0 24px 50px -40px rgba(0,0,0,.4); }
.cpp-f .ai { width: 48px; height: 48px; border-radius: 14px; display: grid; place-items: center; font-size: 26px; color: var(--k); background: color-mix(in srgb, var(--k) 14%, transparent); margin-bottom: 14px; }
.cpp-f h3 { font: 700 18px var(--display); letter-spacing: -0.02em; margin: 0 0 6px; } .cpp-f p { color: var(--ink-2); font-size: 14.5px; line-height: 1.55; margin: 0; }
.cpp-feat.dark .cpp-f { background: rgba(255,255,255,.04); box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.1); } .cpp-feat.dark .cpp-f h3 { color: #fff; } .cpp-feat.dark .cpp-f p { color: #8e8e93; }
.fmt { display: flex; align-items: flex-end; justify-content: center; gap: 22px; flex-wrap: wrap; }
.fmt figure { margin: 0; text-align: center; }
.fmt .fmt-fr { border-radius: 14px; overflow: hidden; background: #000; box-shadow: 0 0 0 6px #1d1d1f, 0 0 0 7px rgba(0,0,0,.2), 0 30px 60px -30px rgba(0,0,0,.6); }
.fmt .fmt-fr.ph { border-radius: 22px; }
.fmt canvas { width: 100%; height: 100%; display: block; }
.fmt .f169 .fmt-fr { width: 300px; height: 169px; } .fmt .f916 .fmt-fr { width: 112px; height: 199px; } .fmt .f11 .fmt-fr { width: 170px; height: 170px; } .fmt .f45 .fmt-fr { width: 144px; height: 180px; } .fmt .f219 .fmt-fr { width: 300px; height: 129px; }
.fmt figcaption { margin-top: 16px; font-size: 13px; color: var(--ink-2); } .fmt figcaption b { display: block; color: var(--ink); font: 800 17px var(--display); }
/* yonga */
.cpp-chipg { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 60px; align-items: center; max-width: 1040px; margin: 0 auto; }
.chip { position: relative; width: min(380px, 80vw); aspect-ratio: 1; margin: 0 auto; }
.chip-pins { position: absolute; inset: 0; }
.chip-pins span { position: absolute; display: flex; justify-content: space-around; }
.chip-pins span:nth-child(1), .chip-pins span:nth-child(2) { left: 14%; right: 14%; height: 10%; } .chip-pins span:nth-child(1) { top: 0; } .chip-pins span:nth-child(2) { bottom: 0; }
.chip-pins span:nth-child(3), .chip-pins span:nth-child(4) { top: 14%; bottom: 14%; width: 10%; flex-direction: column; } .chip-pins span:nth-child(3) { left: 0; } .chip-pins span:nth-child(4) { right: 0; }
.chip-pins i { display: block; background: linear-gradient(180deg, #8e8e93, #3a3a3c); border-radius: 2px; }
.chip-pins span:nth-child(-n+2) i { width: 4px; height: 100%; } .chip-pins span:nth-child(n+3) i { height: 4px; width: 100%; }
.chip-die { position: absolute; inset: 9%; border-radius: 26px; padding: 2px; background: conic-gradient(from var(--chipA, 0deg), var(--c1), var(--c2), #64d2ff, var(--c1)); animation: chipSpin 6s linear infinite; box-shadow: 0 0 80px -10px color-mix(in srgb, var(--c1) 70%, transparent), 0 0 140px -30px color-mix(in srgb, var(--c2) 70%, transparent); }
@property --chipA { syntax: '<angle>'; inherits: false; initial-value: 0deg; }
@keyframes chipSpin { to { --chipA: 360deg; } }
.chip-die::before { content: ""; position: absolute; inset: 2px; border-radius: 24px; background: radial-gradient(120% 120% at 30% 20%, #26262c, #0c0c0f 70%); }
.chip-grid { position: absolute; inset: 10% 10% 34%; display: grid; grid-template-columns: repeat(4, 1fr); gap: 7px; }
.chip-grid span { position: relative; border-radius: 8px; background: rgba(255,255,255,.04); box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.12); overflow: hidden; display: grid; place-items: end center; padding-bottom: 5px; }
.chip-grid span i { position: absolute; inset: 0; background: linear-gradient(135deg, var(--c1), var(--c2)); opacity: 0; animation: chipCore 3.2s ease-in-out infinite; animation-delay: calc(var(--i) * .35s); }
@keyframes chipCore { 0%, 100% { opacity: .05; } 40% { opacity: .55; } }
.chip-grid small { position: relative; font-size: 9.5px; font-weight: 700; color: rgba(255,255,255,.75); letter-spacing: .02em; }
.chip-name { position: absolute; left: 10%; right: 10%; bottom: 9%; display: grid; grid-template-columns: auto 1fr; column-gap: 12px; align-items: center; }
.chip-logo { grid-row: span 2; width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; color: #fff; font-size: 22px; background: linear-gradient(135deg, var(--c1), var(--c2)); }
.chip-name b { color: #fff; font: 800 22px var(--display); letter-spacing: -0.03em; } .chip-name small { color: #8e8e93; font-size: 12px; }
.cpp-specs { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.cpp-specs .sp { padding: 22px; border-radius: 20px; background: rgba(255,255,255,.04); box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.1); }
.cpp-specs b { display: block; font: 800 clamp(34px, 4vw, 48px)/1 var(--display); letter-spacing: -0.04em; background: linear-gradient(135deg, #fff, #ffd60a); -webkit-background-clip: text; background-clip: text; color: transparent; margin-bottom: 8px; font-variant-numeric: tabular-nums; }
.tvp-chip .cpp-specs b { background-image: linear-gradient(135deg, #fff, #ff8fab); }
.cpp-specs small { color: #8e8e93; font-size: 13.5px; line-height: 1.4; display: block; }
.cpp-specs .sp:nth-child(2) { transition-delay: .1s; } .cpp-specs .sp:nth-child(3) { transition-delay: .2s; } .cpp-specs .sp:nth-child(4) { transition-delay: .3s; }
.rd { display: grid; grid-template-columns: 300px 1fr; gap: 22px; align-items: center; max-width: 900px; margin: 60px auto 0; padding: 16px; border-radius: 22px; background: rgba(255,255,255,.04); box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.1); }
.rd canvas { width: 100%; aspect-ratio: 16/9; display: block; border-radius: 12px; background: #000; }
.rd-i b { display: flex; align-items: center; gap: 8px; color: #fff; font: 700 17px var(--display); } .rd-i b i { color: #ffd60a; }
.rd-i > span { color: #8e8e93; font-size: 13px; }
.rd-bar { height: 8px; border-radius: 8px; background: rgba(255,255,255,.1); overflow: hidden; margin: 14px 0 8px; }
.rd-bar i { display: block; height: 100%; width: 0; border-radius: 8px; background: linear-gradient(90deg, #ffd60a, #ff9f0a, #ff3d8b); box-shadow: 0 0 14px rgba(255,159,10,.8); }
.rd-st { display: flex; justify-content: space-between; color: #a1a1a6; font-size: 13px; font-variant-numeric: tabular-nums; }
.rd.done .rd-st span:last-child { color: #30d158; font-weight: 700; }
.cpp-dl { display: flex; align-items: center; gap: 16px; margin-top: 26px; padding: 18px 22px; border-radius: 22px; background: linear-gradient(135deg, rgba(255,214,10,.14), rgba(255,159,10,.08)); box-shadow: inset 0 0 0 0.5px rgba(255,159,10,.3); }
.cpp-dl-i { width: 48px; height: 48px; border-radius: 14px; display: grid; place-items: center; font-size: 24px; color: #1a1200; background: linear-gradient(135deg, #ffe14d, #ff9f0a); flex: none; }
.cpp-dl div { flex: 1; } .cpp-dl b { display: block; font: 700 17px var(--display); } .cpp-dl span { color: var(--ink-2); font-size: 14px; }
/* ana sayfa bölümü */
.cph { position: relative; overflow: hidden; isolation: isolate; background: #040406; color: #f5f5f7; padding: 110px 0 100px; }
.cph-t { text-align: center; max-width: 860px; margin: 0 auto 50px; }
.cph h2 { font: 800 clamp(36px, 5vw, 66px)/1.02 var(--display); letter-spacing: -0.05em; margin: 0 0 20px; text-wrap: balance; }
.cph-t p { color: #a1a1a6; font-size: clamp(16px, 1.5vw, 19px); line-height: 1.55; margin: 0 auto 28px; max-width: 64ch; }
.cph .ctas { display: flex; gap: 12px; flex-wrap: wrap; justify-content: center; }
.cph-v { position: relative; max-width: 1060px; margin: 0 auto; }
.cph-v::before { content: ""; position: absolute; inset: 8% 4% -6%; z-index: -1; border-radius: 40px; background: radial-gradient(closest-side, rgba(255,159,10,.35), transparent); filter: blur(40px); }

/* ---- uygulama seçici ---- */
.ln { position: relative; }
.ln-win { border-radius: 18px; overflow: hidden; background: #0c0c10; box-shadow: 0 0 0 1px rgba(255,255,255,.1), 0 50px 100px -40px rgba(0,0,0,.9), 0 0 120px -40px rgba(10,132,255,.5); color: #eeeef3; text-align: left; }
.ln-top { display: flex; align-items: center; gap: 12px; height: 36px; padding: 0 12px; background: rgba(22,22,26,.95); border-bottom: 1px solid rgba(255,255,255,.06); }
.ln-brand { font-size: 12px; font-weight: 700; color: rgba(255,255,255,.7); display: inline-flex; align-items: center; gap: 6px; } .ln-brand i { color: #ff375f; }
.ln-body { display: grid; grid-template-columns: 200px 1fr; min-height: 330px; }
.ln-form { display: flex; flex-direction: column; gap: 9px; padding: 22px 18px; border-right: 1px solid rgba(255,255,255,.06); background: radial-gradient(120% 80% at 0% 0%, rgba(10,132,255,.16), transparent 60%); }
.ln-form small { color: #8e8e93; font-size: 11px; } .ln-form > b { font: 800 20px var(--display); letter-spacing: -0.02em; margin-bottom: 6px; }
.ln-in { display: flex; align-items: center; gap: 7px; height: 32px; padding: 0 10px; border-radius: 9px; font-size: 11px; color: rgba(255,255,255,.75); background: rgba(255,255,255,.06); box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.1); white-space: nowrap; overflow: hidden; }
.ln-go { margin-top: auto; height: 36px; border-radius: 10px; display: grid; place-items: center; font-size: 12px; font-weight: 700; color: #fff; background: #0a84ff; box-shadow: 0 10px 22px -10px rgba(10,132,255,.9); transition: background .3s; }
.ln-pick { padding: 18px; display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.ln-q { color: #8e8e93; font-size: 11.5px; font-weight: 600; }
.ln-hero { position: relative; flex: 1; min-height: 190px; }
.ln-card { position: absolute; inset: 0; padding: 18px; border-radius: 18px; overflow: hidden; display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto 1fr auto; column-gap: 12px; align-content: start; background: radial-gradient(120% 120% at 0% 0%, color-mix(in srgb, var(--a) 32%, transparent), transparent 60%), radial-gradient(120% 120% at 100% 100%, color-mix(in srgb, var(--b) 26%, transparent), transparent 60%), #15151b; box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--a) 40%, transparent); opacity: 0; transform: translateY(14px) scale(.97); transition: opacity .5s var(--ease), transform .6s var(--ease); }
.ln-card.prev { transform: translateY(-14px) scale(.97); }
.ln-card.on { opacity: 1; transform: none; }
.ln-ic { width: 52px; height: 52px; border-radius: 15px; display: grid; place-items: center; font-size: 27px; color: #fff; background: linear-gradient(135deg, var(--a), var(--b)); box-shadow: 0 14px 30px -12px var(--a); }
.ln-t b { display: block; font: 800 19px var(--display); letter-spacing: -0.02em; } .ln-t small { color: #a1a1a6; font-size: 11.5px; }
.ln-card p { grid-column: 1 / -1; color: #c7c7cc; font-size: 12.5px; line-height: 1.5; margin: 14px 0 0; }
.ln-chips { grid-column: 1 / -1; display: flex; gap: 6px; flex-wrap: wrap; margin-top: 10px; }
.ln-chips em { font-style: normal; font-size: 10.5px; font-weight: 700; padding: 3px 8px; border-radius: 7px; background: rgba(255,255,255,.08); color: #fff; }
.ln-dock { display: flex; justify-content: center; gap: 8px; padding: 8px; border-radius: 18px; background: rgba(255,255,255,.05); box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.1); }
.ln-dock button { position: relative; width: 44px; height: 44px; border: 0; border-radius: 13px; cursor: pointer; display: grid; place-items: center; font-size: 22px; color: #fff; background: linear-gradient(135deg, var(--a), var(--b)); opacity: .45; transform: scale(.9); transition: opacity .3s, transform .3s var(--ease); }
.ln-dock button.on { opacity: 1; transform: translateY(-4px) scale(1.06); box-shadow: 0 12px 24px -10px var(--a); }
.ln-dock button span { position: absolute; bottom: -18px; left: 50%; transform: translateX(-50%); font-size: 9.5px; white-space: nowrap; color: #a1a1a6; opacity: 0; transition: opacity .3s; }
.ln-dock button.on span { opacity: 1; }
.tvp-ln { align-items: center; }
.tvp-ln .b { margin-top: 22px; }

/* ---- masaüstü uygulaması sayfası ---- */
.mup-g { display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); gap: 50px; align-items: center; }
.mup-dl { display: flex; gap: 12px; flex-wrap: wrap; }
.mup-req { color: #8e8e93; font-size: 13px; margin: 18px 0 0; display: flex; gap: 8px; align-items: flex-start; }
.mup-v { position: relative; }
.mup-v::before { content: ""; position: absolute; inset: 10% 0 -6%; z-index: -1; background: radial-gradient(closest-side, rgba(10,132,255,.35), transparent); filter: blur(50px); }
.mup-apps { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 14px; }
.mup-app { display: flex; flex-direction: column; padding: 22px; border-radius: 22px; color: var(--ink); background: #fff; box-shadow: 0 0 0 0.5px var(--hair), 0 24px 50px -40px rgba(0,0,0,.45); transition: transform .25s var(--ease), box-shadow .25s; }
.mup-app:hover { transform: translateY(-4px); box-shadow: 0 0 0 0.5px var(--hair), 0 30px 60px -36px rgba(0,0,0,.5); }
.mup-app .ai { width: 52px; height: 52px; border-radius: 15px; display: grid; place-items: center; font-size: 27px; color: #fff; background: linear-gradient(135deg, var(--a), var(--b)); box-shadow: 0 14px 28px -14px var(--a); margin-bottom: 16px; }
.mup-app h3 { font: 700 18px var(--display); margin: 0 0 6px; letter-spacing: -0.02em; } .mup-app p { color: var(--ink-2); font-size: 14px; line-height: 1.5; margin: 0 0 14px; flex: 1; }
.mup-app em { font-style: normal; font-size: 13.5px; font-weight: 600; color: var(--blue); display: inline-flex; align-items: center; gap: 5px; }
.mup-steps { list-style: none; padding: 0; margin: 0 auto; max-width: 980px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; counter-reset: s; }
.mup-steps li { padding: 24px; border-radius: 22px; background: var(--canvas-2); }
.mup-steps span { width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; font: 800 15px var(--display); color: #fff; background: linear-gradient(135deg, #0a84ff, #5e5ce6); margin-bottom: 14px; }
.mup-steps b { display: block; font: 700 17px var(--display); margin-bottom: 6px; } .mup-steps small { color: var(--ink-2); font-size: 14px; line-height: 1.5; }

@media (max-width: 1100px) {
  .pf { height: auto; display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; padding-top: 10px; }
  .pf-beams { display: none; }
  .pf-core { position: relative; left: auto; top: auto; transform: none; width: min(420px, 100%); margin: 70px auto 24px; flex-basis: 100%; }
  .pf-node { position: relative; left: auto !important; right: auto !important; top: auto !important; }
  .pfs-pts, .am-steps, .cpp-feat, .cpp-cats { grid-template-columns: 1fr 1fr; }
  .trg { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .cpp-two, .cpp-chipg, .mup-g { grid-template-columns: 1fr; }
  .mup-apps { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .cpm-mid { grid-template-columns: 150px minmax(0, 1fr) 0; } .cpm-insp { display: none; }
}
@media (max-width: 720px) {
  .pfs-pts, .am-steps, .cpp-feat, .cpp-cats, .mup-apps, .mup-steps, .cpp-specs { grid-template-columns: 1fr; }
  .trg { grid-template-columns: 1fr 1fr; }
  .cpm-mid { grid-template-columns: 0 minmax(0, 1fr) 0; height: 230px; } .cpm-lib { display: none; }
  .cpm-asp, .cpm-name, .cpm-exp { display: none; }
  .ln-body { grid-template-columns: 1fr; } .ln-form { display: none; }
  .rd { grid-template-columns: 1fr; }
  .cpp-dl { flex-direction: column; align-items: flex-start; }
  .fmt .f169 .fmt-fr, .fmt .f219 .fmt-fr { width: 260px; }
}
@media (prefers-reduced-motion: reduce) {
  .pf-pk, .mq-row, .chip-die, .chip-grid span i, .cpm-magic::after, .mp-cap-v b, .mp-cap-tl em, .mp-ln span, .mp-tv-lt { animation: none !important; }
}

/* üst menü: TV ve Video eklendi; dar ekranlarda sıkışmasın */
.menu > li > a, .menu > li > button { white-space: nowrap; }
@media (max-width: 1520px) { .menu > li.nav-opt { display: none; } .menu > li > a, .menu > li > button { padding: 0 10px; } }
@media (max-width: 1380px) { .nav-dot { display: none; } .nav-cta .b.text { display: none; } .menu > li > a, .menu > li > button { padding: 0 9px; } }
@media (max-width: 1100px) { .menu > li > a, .menu > li > button { padding: 0 7px; font-size: 13.5px; } .nav-new em { display: none; } }
@media (max-width: 1010px) { .nav-cta .b.ghost { display: none; } }

/* =========================================================
   AUDIOSSTUDIO — ses montaj ve miks stüdyosu vitrinleri (asd-, aup-, auh-)
   ========================================================= */
.au-badge { display: inline-flex; align-items: center; gap: 6px; height: 24px; padding: 0 9px; border-radius: 7px; font: 800 12.5px/1 var(--display); color: #00180a; background: linear-gradient(135deg, #5af08a, #30d158 45%, #0aa4ff); box-shadow: 0 6px 16px -6px rgba(48,209,88,.8); white-space: nowrap; }
.au-grad { background: linear-gradient(100deg, #7dfb9b 0%, #30d158 30%, #0a84ff 68%, #7d5cff 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.aup-aura i:nth-child(1) { background: radial-gradient(closest-side, rgba(48,209,88,.36), rgba(48,209,88,.09) 55%, transparent) !important; }
.aup-aura i:nth-child(2) { background: radial-gradient(closest-side, rgba(10,132,255,.36), rgba(10,132,255,.09) 55%, transparent) !important; }
.aup-aura i:nth-child(3) { background: radial-gradient(closest-side, rgba(125,92,255,.28), rgba(125,92,255,.07) 55%, transparent) !important; }
.aup-dark .dx-kick, .aup-hero .dx-kick { color: #7dfb9b; background: rgba(48,209,88,.14); }
.aup .dx-kick { color: #1f9d4a; background: rgba(48,209,88,.12); }
.aup-dark .dx-kick { color: #7dfb9b; background: rgba(48,209,88,.14); }
.aup-hero-v::before, .auh-v::before { background: radial-gradient(closest-side, rgba(48,209,88,.32), rgba(10,132,255,.18) 60%, transparent) !important; }

/* ---- ana ekran (DAW penceresi) ---- */
.asd-mix { color: #eceef4; }
.asd { --ab: #0b0c0f; position: relative; border-radius: 18px; overflow: hidden; background: var(--ab); color: #eceef4; font-size: 11.5px; box-shadow: 0 0 0 1px rgba(255,255,255,.1), 0 60px 120px -40px rgba(0,0,0,.9), 0 0 140px -40px rgba(48,209,88,.4); text-align: left; user-select: none; }
.asd-bar { display: flex; align-items: center; gap: 10px; height: 46px; padding: 0 12px; background: rgba(16,17,21,.96); border-bottom: 1px solid rgba(255,255,255,.06); white-space: nowrap; }
.asd-brand { display: inline-flex; align-items: center; gap: 7px; font-size: 13px; }
.asd-logo { width: 24px; height: 24px; border-radius: 7px; display: flex; align-items: center; justify-content: center; background: linear-gradient(135deg, #30d158, #0a84ff); color: #fff; font-size: 15px; box-shadow: 0 4px 12px -4px rgba(48,209,88,.8); }
.asd-name { color: #a1a1a6; font-weight: 600; }
.asd-sp { flex: 1; }
.asd-tr { display: inline-flex; gap: 2px; background: rgba(0,0,0,.35); border: 1px solid rgba(255,255,255,.06); border-radius: 10px; padding: 3px; }
.asd-tr i { width: 26px; height: 24px; display: flex; align-items: center; justify-content: center; border-radius: 7px; font-size: 14px; color: #d8dae2; }
.asd-tr i.on { color: #30d158; background: rgba(48,209,88,.16); } .asd-tr i.r { color: #ff6961; } .asd-tr i.y { color: #ffd60a; background: rgba(255,214,10,.12); }
.asd-lcd { display: inline-flex; align-items: center; gap: 10px; padding: 3px 10px; border-radius: 10px; background: linear-gradient(180deg, #07080a, #0d0f12); border: 1px solid rgba(48,209,88,.2); font-family: 'SF Mono', ui-monospace, Menlo, Consolas, monospace; }
.asd-lcd > b { color: #7dfb9b; font-size: 14px; text-shadow: 0 0 10px rgba(48,209,88,.45); min-width: 74px; }
.asd-lcd > small { color: rgba(125,251,155,.55); font-size: 9.5px; min-width: 66px; }
.asd-lcd span { display: flex; flex-direction: column; line-height: 1.1; padding-left: 9px; border-left: 1px solid rgba(255,255,255,.07); } .asd-lcd span b { font-size: 12.5px; color: #fff; } .asd-lcd span small { font-size: 8.5px; color: #8e8e93; }
.asd-rnd { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; font-size: 12px; padding: 6px 12px; border-radius: 9px; color: #fff; background: linear-gradient(135deg, #30d158, #0a84ff); box-shadow: 0 6px 18px -8px rgba(10,132,255,.9); }
.asd-mid { display: flex; height: 330px; }
.asd-rail { width: 38px; flex: none; display: flex; flex-direction: column; gap: 6px; align-items: center; padding-top: 10px; border-right: 1px solid rgba(255,255,255,.05); background: rgba(10,11,14,.6); color: #636366; font-size: 17px; }
.asd-rail .on { color: #30d158; }
.asd-arr { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.asd-tools { height: 32px; display: flex; align-items: center; gap: 10px; padding: 0 10px; border-bottom: 1px solid rgba(255,255,255,.05); background: #121318; color: #a1a1a6; white-space: nowrap; overflow: hidden; }
.asd-seg { display: inline-flex; gap: 1px; background: rgba(255,255,255,.05); border-radius: 7px; padding: 2px; } .asd-seg i { width: 22px; height: 20px; display: flex; align-items: center; justify-content: center; border-radius: 5px; font-size: 13px; } .asd-seg i.on { background: #2a2d37; color: #fff; }
.asd-tl { display: inline-flex; align-items: center; gap: 4px; font-size: 10.5px; font-weight: 600; }
.asd-body { flex: 1; display: flex; min-height: 0; }
.asd-hds { width: 150px; flex: none; display: flex; flex-direction: column; border-right: 1px solid rgba(255,255,255,.1); }
.asd-rh { height: 22px; flex: none; background: #101116; border-bottom: 1px solid rgba(255,255,255,.08); }
.asd-hd { flex: 1; min-height: 0; position: relative; padding: 5px 8px 4px 11px; display: flex; flex-direction: column; justify-content: center; gap: 4px; background: linear-gradient(90deg, #181a20, #15171c); border-bottom: 1px solid rgba(0,0,0,.6); overflow: hidden; }
.asd-hd::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: var(--c); }
.asd-hd.sel { background: linear-gradient(90deg, #1f2430, #1a1d25); }
.asd-hd b { display: flex; align-items: center; gap: 5px; font-size: 11px; white-space: nowrap; } .asd-hd b i { color: var(--c); font-size: 12px; }
.asd-hd span { display: flex; gap: 3px; } .asd-hd em { font-style: normal; font-size: 8.5px; font-weight: 800; width: 17px; height: 14px; display: flex; align-items: center; justify-content: center; border-radius: 4px; border: 1px solid rgba(255,255,255,.12); color: #8e8e93; }
.asd-hd em.r.on { background: #ff453a; border-color: transparent; color: #fff; } .asd-hd em.a { color: #ffd60a; border-color: rgba(255,214,10,.4); }
.asd-hm { position: absolute; left: 11px; right: 8px; bottom: 3px; height: 3px; border-radius: 2px; background: rgba(255,255,255,.06); overflow: hidden; }
.asd-hm::after { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: var(--l, 0%); background: linear-gradient(90deg, #30d158, #a3e635 75%, #ffd60a); transition: width .05s linear; }
.asd-lanes { flex: 1; min-width: 0; position: relative; }
.asd-cv { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.asd-insp { width: 190px; flex: none; border-left: 1px solid rgba(255,255,255,.06); background: #121318; padding: 8px; display: flex; flex-direction: column; gap: 6px; overflow: hidden; }
.asd-ib { background: #181a20; border: 1px solid rgba(255,255,255,.06); border-radius: 9px; padding: 7px; display: flex; flex-direction: column; gap: 4px; }
.asd-ib > b { display: flex; gap: 5px; align-items: center; font-size: 11.5px; } .asd-ib > b i { color: #ff6b6b; } .asd-ib > small { color: #8e8e93; font-size: 9.5px; }
.asd-il { font-size: 8.5px !important; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: #636366 !important; }
.asd-slot { display: flex; align-items: center; gap: 5px; font-size: 10px; font-weight: 600; padding: 3px 5px; border-radius: 5px; background: linear-gradient(180deg, #2a2f3b, #232731); } .asd-slot i { color: #30d158; }
.asd-snd { display: grid; grid-template-columns: 1fr 50px; align-items: center; gap: 6px; font-size: 9.5px; color: #a1a1a6; } .asd-snd i { height: 4px; border-radius: 2px; background: linear-gradient(90deg, #0a84ff var(--w), rgba(255,255,255,.08) var(--w)); }
.asd-eqm canvas { width: 100%; height: 54px; display: block; background: #0a0b0e; border-radius: 6px; }
.asd-gr { height: 6px; border-radius: 3px; background: #07080a; overflow: hidden; display: flex; justify-content: flex-end; } .asd-gr i { height: 100%; width: 0; background: linear-gradient(270deg, #ffd60a, #ff9f0a); border-radius: 3px; }
.asd-mix { display: flex; gap: 4px; padding: 6px; height: 186px; background: linear-gradient(180deg, #121318, #0e0f13); border-top: 1px solid rgba(255,255,255,.08); overflow: hidden; }
.asd-st { flex: 1; min-width: 0; max-width: 92px; position: relative; display: flex; flex-direction: column; gap: 3px; padding: 6px 5px 5px; border-radius: 8px; background: linear-gradient(180deg, #1c1f27, #16181e); border: 1px solid rgba(255,255,255,.06); overflow: hidden; }
.asd-st::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 2.5px; background: var(--c); }
.asd-st.mst { margin-left: auto; max-width: 104px; background: linear-gradient(180deg, #1f2a22, #161c18); border-color: rgba(48,209,88,.25); }
.asd-st > b { display: flex; gap: 4px; align-items: center; font-size: 9.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .asd-st > b i { color: var(--c); font-size: 10px; flex: none; }
.asd-fx { display: flex; flex-direction: column; gap: 2px; min-height: 30px; } .asd-fx em { font-style: normal; font-size: 8px; font-weight: 600; padding: 1px 4px; border-radius: 3px; background: #2b303c; color: #cfe3ff; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.asd-pan { height: 4px; border-radius: 2px; background: rgba(255,255,255,.08); position: relative; margin: 2px 6px; } .asd-pan i { position: absolute; left: calc(50% + var(--p) * 0.6%); top: -2px; width: 8px; height: 8px; margin-left: -4px; border-radius: 50%; background: #8fd3ff; }
.asd-fd { flex: 1; min-height: 0; position: relative; display: block; }
.asd-sc { position: absolute; left: 30%; top: 4px; bottom: 4px; width: 3px; margin-left: -1.5px; border-radius: 2px; background: #07080a; }
.asd-fd .th { position: absolute; left: 30%; bottom: calc(var(--v) * 100% - 10px); width: 20px; height: 20px; margin-left: -10px; border-radius: 4px; background: linear-gradient(180deg, #4a4f5c, #2a2e38 45%, #20232b 55%, #3a3e49); box-shadow: 0 3px 8px rgba(0,0,0,.6); } .asd-fd .th::after { content: ""; position: absolute; left: 3px; right: 3px; top: 9px; height: 2px; background: var(--c); }
.asd-mt { position: absolute; right: 8%; top: 4px; bottom: 4px; width: 14px; display: flex; gap: 2px; align-items: flex-end; }
.asd-mt i { flex: 1; height: 0; border-radius: 1px; background: linear-gradient(0deg, #30d158 0%, #a3e635 70%, #ffd60a 86%, #ff453a 100%); background-size: 100% 140px; background-position: bottom; box-shadow: 0 0 6px rgba(48,209,88,.3); transition: height .04s linear; }
.asd-mt::before { content: ""; position: absolute; inset: 0; background: rgba(255,255,255,.04); border-radius: 2px; z-index: -1; }
.asd-db { font: 9px 'SF Mono', ui-monospace, monospace; text-align: center; background: #08090b; border-radius: 3px; padding: 1px; color: #c7c7cc; }
.asd-ms { display: flex; gap: 2px; } .asd-ms em { flex: 1; font-style: normal; text-align: center; font-size: 8px; font-weight: 800; border: 1px solid rgba(255,255,255,.1); border-radius: 3px; color: #8e8e93; padding: 1px 0; } .asd-ms em.r { color: #ff6961; }
.asd-rms { font: 9px 'SF Mono', ui-monospace, monospace; color: #7dfb9b; text-align: center; }
.asd.sm .asd-mid { height: 320px; } .asd.sm .asd-mix { height: 150px; }
.asd-mix.big { height: 300px; border-radius: 18px; border: 1px solid rgba(255,255,255,.08); padding: 10px; gap: 6px; box-shadow: 0 40px 100px -40px rgba(0,0,0,.6); }
.asd-mix.big .asd-st { max-width: 104px; padding: 8px 7px 7px; } .asd-mix.big .asd-st > b { font-size: 11px; } .asd-mix.big .asd-fx em { font-size: 9.5px; padding: 2px 5px; } .asd-mix.big .asd-mt i { background-size: 100% 220px; }

/* ---- sayfa ---- */
.aup-dark { padding: 110px 0; }
.aup-xf { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: 34px; align-items: center; }
.aup-xfv { position: relative; border-radius: 22px; background: #0b0c0f; box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.12), 0 40px 90px -40px rgba(0,0,0,.9); height: 360px; overflow: hidden; }
.aup-xfv canvas { position: absolute; inset: 14px 14px 48px; width: calc(100% - 28px); height: calc(100% - 62px); }
.aup-xfl { position: absolute; left: 18px; right: 18px; bottom: 14px; display: flex; justify-content: space-between; align-items: center; font-size: 13px; color: #a1a1a6; }
.aup-xfl span { color: #ffd60a; font-weight: 700; font-size: 15px; } .aup-xfl em { font-style: normal; }
.aup-xft { display: grid; gap: 14px; }
.aup-pt { display: grid; grid-template-columns: 44px 1fr; gap: 14px; padding: 16px; border-radius: 18px; background: rgba(255,255,255,.04); box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.1); }
.aup-pt > i { width: 44px; height: 44px; border-radius: 13px; display: flex; align-items: center; justify-content: center; font-size: 23px; color: var(--k); background: color-mix(in srgb, var(--k) 16%, transparent); }
.aup-pt h3 { color: #fff; font: 700 16px var(--display); margin: 0 0 4px; } .aup-pt p { font-size: 14px; line-height: 1.5; margin: 0; color: #a1a1a6; }
.aup-mixv { max-width: 1120px; margin: 0 auto; }
.aup-four { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-top: 34px; }
.aup-c { padding: 20px; border-radius: 20px; background: var(--card, #fff); box-shadow: 0 0 0 0.5px rgba(0,0,0,.08), 0 12px 30px -18px rgba(0,0,0,.25); }
.aup-dark .aup-c { background: rgba(255,255,255,.04); box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.1); }
.aup-c > i { width: 42px; height: 42px; border-radius: 12px; display: flex; align-items: center; justify-content: center; font-size: 22px; color: var(--k); background: color-mix(in srgb, var(--k) 15%, transparent); margin-bottom: 12px; }
.aup-c h3 { font: 700 16.5px var(--display); margin: 0 0 6px; letter-spacing: -0.01em; } .aup-dark .aup-c h3 { color: #fff; }
.aup-c p { font-size: 14px; line-height: 1.5; margin: 0; color: var(--ink-2, #6e6e73); } .aup-dark .aup-c p { color: #a1a1a6; }
.aup-plug { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(0, .9fr); gap: 18px; align-items: start; }
.aup-eq, .aup-comp, .aup-pr { border-radius: 20px; overflow: hidden; background: rgba(22,24,30,.96); box-shadow: 0 0 0 1px rgba(255,255,255,.1), 0 40px 90px -40px rgba(0,0,0,.9); display: flex; flex-direction: column; }
.aup-wh { display: flex; align-items: center; gap: 8px; padding: 10px 14px; background: linear-gradient(180deg, #262a34, #1d2028); border-bottom: 1px solid rgba(255,255,255,.07); color: #fff; font-size: 13px; }
.aup-wh > i { color: #30d158; font-size: 16px; } .aup-ps { margin-left: auto; font-size: 11.5px; padding: 3px 9px; border-radius: 7px; background: #20232b; color: #c7c7cc; border: 1px solid rgba(255,255,255,.08); }
.aup-eq canvas { width: 100%; height: 300px; display: block; background: radial-gradient(600px 200px at 50% 100%, rgba(48,209,88,.07), transparent), #0a0b0e; }
.aup-bands { display: flex; flex-wrap: wrap; gap: 5px; padding: 10px 12px 12px; } .aup-bands em { font-style: normal; font-size: 11px; font-weight: 600; padding: 3px 8px; border-radius: 7px; color: var(--c); border: 1px solid color-mix(in srgb, var(--c) 40%, transparent); }
.aup-comp canvas { width: calc(100% - 28px); aspect-ratio: 1 / .78; margin: 14px; display: block; background: #0a0b0e; border-radius: 12px; border: 1px solid rgba(255,255,255,.06); }
.aup-knobs { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; padding: 0 14px; }
.aup-knobs span { display: flex; flex-direction: column; align-items: center; gap: 2px; } .aup-knobs i { width: 34px; height: 34px; border-radius: 50%; background: conic-gradient(from 225deg, #0a84ff calc(var(--v) * 270deg), rgba(255,255,255,.1) 0 270deg, transparent 0); -webkit-mask: radial-gradient(circle, transparent 11px, #000 12px); mask: radial-gradient(circle, transparent 11px, #000 12px); }
.aup-knobs b { font: 600 11px 'SF Mono', ui-monospace, monospace; color: #fff; } .aup-knobs small { font-size: 10px; color: #8e8e93; }
.aup-gr { display: grid; grid-template-columns: auto 1fr; gap: 10px; align-items: center; padding: 14px; font-size: 11px; color: #8e8e93; } .aup-gr span { height: 8px; border-radius: 4px; background: #07080a; overflow: hidden; display: flex; justify-content: flex-end; } .aup-gr i { height: 100%; width: 0; background: linear-gradient(270deg, #ffd60a, #ff9f0a); border-radius: 4px; }
.aup-pl { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin: 34px auto 0; max-width: 980px; }
.aup-pi { display: inline-flex; align-items: center; gap: 8px; padding: 9px 14px; border-radius: 30px; background: rgba(255,255,255,.05); box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.12); color: #e5e5ea; font-size: 13.5px; font-weight: 600; }
.aup-pi i { color: var(--k); font-size: 17px; }
.aup-wam { display: flex; gap: 14px; align-items: center; max-width: 760px; margin: 30px auto 0; padding: 16px 20px; border-radius: 18px; background: linear-gradient(135deg, rgba(255,214,10,.08), rgba(255,255,255,.03)); box-shadow: inset 0 0 0 0.5px rgba(255,214,10,.25); }
.aup-wam > i { font-size: 28px; color: #ffd60a; } .aup-wam b { display: block; color: #fff; font: 700 15px var(--display); } .aup-wam span { color: #a1a1a6; font-size: 14px; line-height: 1.5; }
.aup-ul { list-style: none; padding: 0; margin: 18px 0 0; display: grid; gap: 8px; } .aup-ul li { display: flex; gap: 9px; align-items: flex-start; font-size: 15px; } .aup-ul i { color: #30d158; font-size: 18px; margin-top: 1px; }
.aup-bm { position: relative; border-radius: 22px; background: #0b0c0f; box-shadow: 0 0 0 1px rgba(0,0,0,.08), 0 40px 90px -40px rgba(0,0,0,.6); height: 340px; overflow: hidden; }
.aup-bm canvas { position: absolute; inset: 16px 16px 48px; width: calc(100% - 32px); height: calc(100% - 64px); }
.aup-bml { position: absolute; left: 18px; right: 18px; bottom: 14px; display: flex; gap: 16px; align-items: center; font-size: 12px; color: #a1a1a6; } .aup-bml i { display: inline-block; width: 10px; height: 3px; border-radius: 2px; margin-right: 5px; vertical-align: middle; } .aup-bml b { margin-left: auto; color: #ffd60a; font: 700 15px 'SF Mono', ui-monospace, monospace; }
.aup-ctl { max-width: 1040px; margin: 0 auto; }
.aup-ctlw { border-radius: 22px; background: linear-gradient(180deg, #23252c, #17181d); box-shadow: 0 0 0 1px rgba(255,255,255,.1), 0 50px 100px -40px rgba(0,0,0,.95); overflow: hidden; }
.aup-ctlh { display: flex; align-items: center; gap: 12px; padding: 12px 16px; border-bottom: 1px solid rgba(255,255,255,.06); color: #fff; font-size: 13px; } .aup-led { margin-left: auto; font: 700 11px 'SF Mono', ui-monospace, monospace; color: #7dfb9b; background: #07130b; padding: 4px 10px; border-radius: 6px; border: 1px solid rgba(48,209,88,.3); }
.aup-ctlb { display: flex; gap: 8px; padding: 16px; align-items: stretch; }
.aup-ch { flex: 1; min-width: 0; display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 10px 4px; border-radius: 12px; background: rgba(0,0,0,.22); }
.aup-ch .vp { width: 30px; height: 30px; border-radius: 50%; background: radial-gradient(circle at 50% 35%, #555b68, #2b2f38 60%); box-shadow: 0 0 0 3px rgba(10,132,255,.25), 0 3px 8px rgba(0,0,0,.6); position: relative; } .aup-ch .vp::after { content: ""; position: absolute; left: 50%; top: 3px; width: 2px; height: 9px; margin-left: -1px; background: #fff; border-radius: 1px; }
.aup-ch .b { font-style: normal; font: 800 8.5px var(--display); letter-spacing: .04em; width: 100%; text-align: center; padding: 4px 0; border-radius: 5px; background: #2a2d36; color: #8e8e93; }
.aup-ch .b.r.on { background: #ff453a; color: #fff; box-shadow: 0 0 12px rgba(255,69,58,.6); } .aup-ch .b.s.on { background: #ffd60a; color: #1a1600; box-shadow: 0 0 12px rgba(255,214,10,.5); } .aup-ch .b.m.on { background: #ff9f0a; color: #1a1000; }
.aup-ch .fd { width: 10px; flex: 1; min-height: 130px; border-radius: 5px; background: #07080a; position: relative; box-shadow: inset 0 1px 3px rgba(0,0,0,.8); }
.aup-ch .fd i { position: absolute; left: 50%; bottom: 50%; width: 34px; height: 18px; margin: 0 0 -9px -17px; border-radius: 4px; background: linear-gradient(180deg, #5a5f6c, #2a2e38 45%, #20232b 55%, #4a4e59); box-shadow: 0 4px 10px rgba(0,0,0,.7); }
.aup-ch .fd i::after { content: ""; position: absolute; left: 4px; right: 4px; top: 8px; height: 2px; background: #fff; }
.aup-ch small { font-size: 10px; color: #a1a1a6; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.aup-ch.mst { flex: 1.2; background: rgba(48,209,88,.06); justify-content: flex-end; }
.aup-trn { flex: 2.2; display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; align-content: start; padding: 6px; }
.aup-trn em { font-style: normal; height: 38px; display: flex; align-items: center; justify-content: center; border-radius: 9px; background: #2a2d36; color: #c7c7cc; font-size: 17px; box-shadow: 0 3px 6px rgba(0,0,0,.5); }
.aup-trn em.on { color: #30d158; box-shadow: 0 0 14px rgba(48,209,88,.4); } .aup-trn em.r { color: #ff453a; } .aup-trn em.y { color: #ffd60a; }
.aup-trn .jog { grid-column: 1 / -1; justify-self: center; width: 96px; height: 96px; margin-top: 8px; border-radius: 50%; background: radial-gradient(circle at 50% 40%, #4a4f5c, #20232b 70%); box-shadow: 0 8px 20px rgba(0,0,0,.6), inset 0 0 0 6px rgba(255,255,255,.04); position: relative; }
.aup-trn .jog i { position: absolute; inset: 0; } .aup-trn .jog i::after { content: ""; position: absolute; left: 50%; top: 12px; width: 10px; height: 10px; margin-left: -5px; border-radius: 50%; background: #1a1b20; box-shadow: inset 0 1px 2px rgba(0,0,0,.8); }
.aup-pr canvas { width: 100%; height: 300px; display: block; background: #0d0e12; }
.aup-inst { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 18px; }
.aup-inst span { display: grid; grid-template-columns: 34px 1fr; grid-template-rows: auto auto; column-gap: 10px; padding: 10px 12px; border-radius: 14px; background: var(--card, #fff); box-shadow: 0 0 0 0.5px rgba(0,0,0,.08); }
.aup-inst i { grid-row: 1 / 3; width: 34px; height: 34px; border-radius: 10px; display: flex; align-items: center; justify-content: center; font-size: 19px; color: var(--k); background: color-mix(in srgb, var(--k) 14%, transparent); } .aup-inst b { font: 700 14px var(--display); } .aup-inst small { font-size: 12px; color: var(--ink-2, #6e6e73); }
.aup-fmts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; max-width: 980px; margin: 0 auto; }
.aup-fmt { padding: 22px 18px; border-radius: 20px; text-align: center; background: linear-gradient(180deg, color-mix(in srgb, var(--k) 16%, transparent), rgba(255,255,255,.02)); box-shadow: inset 0 0 0 0.5px color-mix(in srgb, var(--k) 45%, transparent); }
.aup-fmt b { display: block; font: 800 30px var(--display); color: #fff; letter-spacing: -0.03em; } .aup-fmt span { color: #a1a1a6; font-size: 13.5px; }
.aup-rates { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin: 20px auto 0; max-width: 900px; }
.aup-rates em { font-style: normal; font: 700 13px 'SF Mono', ui-monospace, monospace; padding: 7px 12px; border-radius: 10px; background: rgba(48,209,88,.1); color: #7dfb9b; box-shadow: inset 0 0 0 0.5px rgba(48,209,88,.3); }
.aup-rates em.o { font-family: inherit; font-weight: 600; background: rgba(255,255,255,.05); color: #e5e5ea; box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.12); }
.aup-proj { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 40px; align-items: center; margin-top: 70px; }
.aup-tree { border-radius: 20px; overflow: hidden; background: rgba(22,24,30,.96); box-shadow: 0 0 0 1px rgba(255,255,255,.1), 0 40px 90px -40px rgba(0,0,0,.9); }
.aup-tree ul { list-style: none; margin: 0; padding: 12px 10px 16px; font-size: 13.5px; color: #e5e5ea; }
.aup-tree li { display: flex; align-items: center; gap: 8px; padding: 6px 8px; border-radius: 8px; } .aup-tree li i { font-size: 17px; color: #8fd3ff; } .aup-tree li.f i { color: #64d2ff; } .aup-tree li.ras i { color: #30d158; }
.aup-tree li em { margin-left: auto; font-style: normal; font-size: 11px; color: #8e8e93; } .aup-tree .d1 { padding-left: 30px; } .aup-tree .d2 { padding-left: 54px; color: #c7c7cc; }
.aup-tree li.new { animation: aupNew 3.2s ease-in-out infinite; } .aup-tree li.new em { color: #30d158; font-weight: 700; }
@keyframes aupNew { 0%, 100% { background: transparent; } 40%, 60% { background: rgba(48,209,88,.14); } }
.aup-ptx h3 { color: #fff; font: 700 24px var(--display); letter-spacing: -0.02em; margin: 0 0 10px; } .aup-ptx p { color: #a1a1a6; font-size: 16px; line-height: 1.6; margin: 0 0 24px; } .aup-ptx p b { color: #fff; }
.aup-ext { display: flex; flex-wrap: wrap; gap: 6px; } .aup-ext em { font-style: normal; font: 700 12.5px 'SF Mono', ui-monospace, monospace; padding: 5px 10px; border-radius: 8px; background: rgba(10,132,255,.12); color: #8fd3ff; }
.auh .tvh-pts li > i { background: color-mix(in srgb, var(--k) 16%, transparent); }
@media (max-width: 1080px) {
  .asd-insp { display: none; } .aup-xf, .aup-plug, .aup-proj { grid-template-columns: 1fr; } .aup-four, .aup-fmts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .aup-ctlb { flex-wrap: wrap; } .aup-trn { flex-basis: 100%; grid-template-columns: repeat(6, 1fr); } .aup-trn .jog { display: none; }
}
@media (max-width: 720px) {
  .asd-mid { height: 230px; } .asd-lcd span, .asd-rnd { display: none; } .asd-hds { width: 92px; } .asd-hd span, .asd-tools .asd-tl, .asd-name, .asd-lcd > small, .asd-lcd span:last-child, .asd-tr i:nth-child(n+5) { display: none; } .asd-rail { display: none; }
  .asd-mix { height: 130px; } .asd-st:nth-child(n+5):not(.mst) { display: none; } .asd-fx { display: none; } .asd-bar { gap: 6px; padding: 0 8px; } .asd-brand b { display: none; }
  .asd-mix.big .asd-st:nth-child(n+5):not(.mst) { display: none; } .asd-mix.big { height: 240px; }
  .aup-four, .aup-fmts, .aup-inst { grid-template-columns: 1fr; } .aup-xfv { height: 280px; } .aup-bm { height: 300px; } .aup-ch:nth-child(n+5):not(.mst) { display: none; } .aup-trn { grid-template-columns: repeat(3, 1fr); }
  .aup-eq canvas, .aup-pr canvas { height: 220px; }
}
@media (prefers-reduced-motion: reduce) { .aup-tree li.new { animation: none; } }
/* menü önizlemesi: AudiosStudio */
.mp-aud { border-radius: 12px; background: #0b0c0f; padding: 8px; box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.1); }
.mp-aud-l { position: relative; display: grid; grid-template-rows: repeat(3, 14px); gap: 4px; padding: 4px 0; }
.mp-aud-l i { grid-column: 1; height: 14px; margin-left: var(--x); width: var(--w); border-radius: 4px; background: repeating-linear-gradient(90deg, color-mix(in srgb, var(--c) 85%, transparent) 0 1px, color-mix(in srgb, var(--c) 30%, transparent) 1px 3px); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--c) 70%, transparent); }
.mp-aud-l i:nth-child(1), .mp-aud-l i:nth-child(2) { grid-row: 1; } .mp-aud-l i:nth-child(3), .mp-aud-l i:nth-child(4) { grid-row: 2; } .mp-aud-l i:nth-child(5) { grid-row: 3; } .mp-aud-l i:nth-child(6) { grid-row: 3; opacity: 0; }
.mp-aud-l em { position: absolute; top: 0; bottom: 0; width: 2px; background: #fff; left: 0; animation: mpPh 4s linear infinite; box-shadow: 0 0 8px rgba(255,255,255,.6); }
.mp-aud-m { display: flex; gap: 5px; height: 46px; margin-top: 8px; padding: 4px; border-radius: 8px; background: #121318; }
.mp-aud-m span { flex: 1; position: relative; border-radius: 3px; background: rgba(255,255,255,.05); overflow: hidden; }
.mp-aud-m span i { position: absolute; left: 0; right: 0; bottom: 0; height: 40%; background: linear-gradient(0deg, #30d158, #a3e635 70%, #ffd60a); animation: mpVu 1.1s ease-in-out infinite alternate; animation-delay: calc(var(--i) * -.17s); }
@keyframes mpVu { 0% { height: 22%; } 35% { height: 78%; } 60% { height: 46%; } 100% { height: 88%; } }
.mp-ln { gap: 8px; } .mp-ln span { width: 40px; height: 40px; font-size: 20px; border-radius: 12px; }
@media (prefers-reduced-motion: reduce) { .mp-aud-m span i, .mp-aud-l em { animation: none; } }
/* uygulama sayfası: tam sürüm komutları */
.mup-cmd { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; max-width: 1080px; margin: 0 auto; }
.mup-cc { padding: 24px; border-radius: 22px; background: rgba(255,255,255,.04); box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.12); display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.mup-ch { display: flex; align-items: center; gap: 10px; color: #fff; } .mup-ch i { font-size: 26px; } .mup-ch b { font: 700 19px var(--display); }
.mup-cc ol { margin: 0; padding-left: 20px; color: #c7c7cc; font-size: 15px; line-height: 1.7; }
.mup-cc kbd { font: 600 12.5px var(--font, inherit); padding: 2px 7px; border-radius: 6px; background: rgba(255,255,255,.1); box-shadow: inset 0 -1px 0 rgba(255,255,255,.12); color: #fff; }
.mup-code { display: flex; align-items: stretch; gap: 8px; padding: 6px 6px 6px 14px; border-radius: 14px; background: #0a0a0c; box-shadow: inset 0 0 0 0.5px rgba(255,255,255,.14); min-width: 0; }
.mup-code code { flex: 1; min-width: 0; align-self: center; font: 500 12.5px/1.5 'SF Mono', ui-monospace, Menlo, Consolas, monospace; color: #7dfb9b; white-space: nowrap; overflow-x: auto; scrollbar-width: none; }
.mup-code code::-webkit-scrollbar { display: none; }
.mup-code button { flex: none; display: inline-flex; align-items: center; gap: 6px; border: 0; border-radius: 10px; padding: 0 14px; height: 38px; cursor: pointer; font-family: inherit; font-size: 13px; font-weight: 600; color: #fff; background: linear-gradient(135deg, #0a84ff, #5e5ce6); }
.mup-cc small { color: #8e8e93; font-size: 13px; line-height: 1.5; }
.mup-note { text-align: center; color: #a1a1a6; font-size: 14px; margin: 22px 0 0; display: flex; gap: 8px; justify-content: center; align-items: center; }
@media (max-width: 860px) { .mup-cmd { grid-template-columns: 1fr; } }