/* ==================================================================
   ANA SAYFA v120 (2026-10-17) — kullanicinin verdigi referans tasarim:
   1) .tb-r1 HIZMETLERIMIZ: solda baslik + 6 hizmet karti + dugme, sagda
      izometrik sunucu kulesi + kalkan (SVG) ve ucan rozetler.
   2) .tb-r2 VERILERINIZ EMIN ELLERDE: koyu bant, solda veri merkezi
      fotografi, ortada baslik + 3 olcu, sagda canli performans karti.
   3) .tb-r3 DUNYAYA ACILAN KAPINIZ: solda baslik + dugme, sagda noktali
      dunya haritasi (canvas, Bursa merkez), altta 4 ozellik.
   Tum sayilar gercek: durum.json (her dakika), sozlesmedeki SLA.
   ================================================================== */
.tb-r-ust { display: inline-flex; align-items: center; gap: .6rem; margin: 0 0 .9rem; font: 700 .78rem/1 var(--tb-font-baslik); letter-spacing: .14em; text-transform: uppercase; color: #C62338; }
.tb-r-ust::before { content: ""; width: 22px; height: 2px; background: #C62338; border-radius: 2px; }
.tb-r-h2 { margin: 0 0 1rem; font: 700 clamp(1.85rem, 3.1vw, 2.65rem)/1.12 var(--tb-font-baslik); letter-spacing: -.025em; color: var(--tb-ink); max-width: 20ch; }
.tb-r-lead { margin: 0 0 1.8rem; max-width: 52ch; font-size: 1.02rem; line-height: 1.65; color: var(--tb-ink-soft); }
.tb-r-btn { display: inline-flex; align-items: center; gap: .6rem; padding: .78rem 1.35rem; border-radius: 999px; font: 600 .95rem/1 var(--tb-font-govde, "Open Sans", sans-serif); color: #fff; background: linear-gradient(135deg, #C62338, #E0334B); box-shadow: 0 14px 30px -14px rgba(198,35,56,.9); text-decoration: none; transition: transform .2s, box-shadow .2s; }
.tb-r-btn:hover { color: #fff; transform: translateY(-2px); box-shadow: 0 18px 34px -14px rgba(198,35,56,1); }
.tb-r-btn i { font-size: 1rem; }


/* ---------- ALAN ADI KARTI: referanstaki beyaz kart (her kipte aydinlik) ---------- */
.tb-domain-wrap .tb-domain { background: #fff; box-shadow: 0 30px 70px -30px rgba(15,32,55,.45), 0 0 0 1px rgba(15,32,55,.05); }
.tb-domain-wrap .tb-domain::before, .tb-domain-wrap .tb-domain::after, .tb-domain-wrap .tb-domain-canvas { display: none !important; }
.tb-domain-wrap .tb-domain-ikon { background: rgba(53,100,175,.1); border-color: rgba(53,100,175,.18); color: #3564AF; border-radius: 50%; }
.tb-domain-wrap .tb-domain-head h2 { color: #0C1627; }
.tb-domain-wrap .tb-domain-head p { color: #5b6b7c; }
.tb-domain-wrap .tb-domain-form { background: #f6f8fb; border-color: #e3e8ef; padding-right: .38rem; }
.tb-domain-wrap .tb-domain-form:focus-within { border-color: rgba(198,35,56,.45); box-shadow: 0 0 0 4px rgba(198,35,56,.1); }
.tb-domain-wrap .tb-domain-form input { color: #0C1627; }
.tb-domain-wrap .tb-domain-form input::placeholder { color: #8d9aab; }
.tb-domain-wrap .tb-domain-form > button[type="submit"] { background: #C62338; box-shadow: 0 10px 22px -10px rgba(198,35,56,.85); }
.tb-domain-wrap .tb-domain-form > button[type="submit"]::after { content: "→"; margin-left: .2rem; }
.tb-domain-tld { position: relative; flex: 0 0 auto; }
.tb-domain-tld-btn { all: unset; cursor: pointer; display: inline-flex; align-items: center; gap: .45rem; padding: .5rem .85rem; border-radius: 999px; font: 600 .9rem/1 var(--tb-font-govde, "Open Sans", sans-serif); color: #0C1627; border-left: 1px solid #e3e8ef; border-radius: 0; }
.tb-domain-tld-btn i { font-size: .7rem; color: #5b6b7c; transition: transform .2s; }
.tb-domain-tld.acik .tb-domain-tld-btn i { transform: rotate(180deg); }
.tb-domain-wrap .tb-domain-exts { position: absolute; right: 0; top: calc(100% + .6rem); z-index: 20; margin: 0; display: none; flex-direction: column; gap: .15rem; min-width: 150px; padding: .4rem; border-radius: 14px; background: #fff; border: 1px solid #e3e8ef; box-shadow: 0 24px 50px -24px rgba(15,32,55,.5); }
.tb-domain-tld.acik .tb-domain-exts { display: flex; }
.tb-domain-wrap .tb-domain-exts button, .tb-domain-wrap .tb-domain-exts span { all: unset; cursor: pointer; display: block; padding: .5rem .75rem; border-radius: 9px; font: 600 .86rem/1 var(--tb-font-govde, "Open Sans", sans-serif); color: #0C1627; }
.tb-domain-wrap .tb-domain-exts button:hover, .tb-domain-wrap .tb-domain-exts button.is-active { background: rgba(53,100,175,.08); color: #3564AF; }
.tb-domain-wrap .tb-domain-oneriler { color: #0C1627; }

/* ---------- 1) HIZMETLERIMIZ — aydinlik, buyuk yumusak parilti ---------- */
.tb-r1 { position: relative; padding-block: clamp(3.4rem, 6vw, 6rem) clamp(3rem, 5vw, 5rem); color: #0C1627; overflow: hidden;
    background: radial-gradient(62% 75% at 80% 48%, rgba(141,184,255,.55) 0%, rgba(141,184,255,.18) 45%, rgba(141,184,255,0) 72%), linear-gradient(180deg, #ffffff 0%, #f3f6fa 100%); }
.tb-r1::before { content: ""; position: absolute; left: 50%; top: 10%; width: 62%; height: 80%; border-radius: 50%; background: radial-gradient(closest-side, rgba(255,255,255,.95), rgba(255,255,255,0)); pointer-events: none; }
.tb-r1 .tb-r-h2 { color: #0C1627; } .tb-r1 .tb-r-lead { color: #5b6b7c; }
.tb-r1-izgara { position: relative; display: grid; gap: 2.5rem; align-items: center; }
@media (min-width: 1100px) { .tb-r1-izgara { grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: clamp(1.5rem, 3vw, 3rem); } }
.tb-r1-kartlar { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .9rem; margin: 0 0 1.5rem; }
@media (min-width: 640px) { .tb-r1-kartlar { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.tb-r1-kart { display: flex; flex-direction: column; gap: .55rem; padding: 1.15rem 1.05rem 1.05rem; border-radius: 16px; background: #fff; border: 1px solid rgba(15,32,55,.06); box-shadow: 0 18px 40px -26px rgba(15,32,55,.35); color: #0C1627; text-decoration: none; transition: transform .22s, box-shadow .22s; }
.tb-r1-kart:hover { transform: translateY(-3px); box-shadow: 0 26px 48px -26px rgba(53,100,175,.45); color: #0C1627; }
.tb-r1-kart i { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%; background: rgba(53,100,175,.1); color: #3564AF; font-size: 1.15rem; margin-bottom: .2rem; }
.tb-r1-kart b { font: 700 .98rem/1.2 var(--tb-font-baslik); }
.tb-r1-kart small { font-size: .8rem; line-height: 1.45; color: #5b6b7c; }
.tb-r1-dugme { display: inline-flex; align-items: center; gap: .6rem; padding: .72rem 1.4rem; border-radius: 999px; background: #fff; border: 1.5px solid rgba(198,35,56,.35); color: #C62338; font: 600 .92rem/1 var(--tb-font-govde, "Open Sans", sans-serif); text-decoration: none; box-shadow: 0 10px 24px -16px rgba(15,32,55,.4); transition: background .2s, color .2s, transform .2s; }
.tb-r1-dugme:hover { background: #C62338; color: #fff; transform: translateY(-2px); }
.tb-r1-sahne { position: relative; min-height: 440px; display: grid; place-items: center; }
.tb-r1-sahne img { width: min(100%, 600px); height: auto; display: block; }
.tb-r1-rozet { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: .6rem; }
.tb-r1-rozet li { display: inline-flex; align-items: center; gap: .6rem; padding: .55rem 1rem .55rem .6rem; border-radius: 999px; background: #fff; border: 1px solid rgba(15,32,55,.06); box-shadow: 0 16px 34px -20px rgba(15,32,55,.5); }
.tb-r1-rozet i { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: rgba(53,100,175,.1); color: #3564AF; font-size: .9rem; }
.tb-r1-rozet b { display: block; font: 700 .86rem/1.15 var(--tb-font-baslik); color: #0C1627; }
.tb-r1-rozet small { display: block; font-size: .7rem; color: #5b6b7c; }
@media (min-width: 1100px) {
    .tb-r1-sahne { min-height: 540px; }
    .tb-r1-sahne img { justify-self: start; margin-left: -6%; width: min(100%, 620px); }
    .tb-r1-rozet { position: absolute; inset: 0; display: block; pointer-events: none; }
    .tb-r1-rozet li { position: absolute; right: 0; pointer-events: auto; animation: tbRozet 6s ease-in-out infinite; }
    .tb-r1-rozet li:nth-child(1) { top: 14%; }
    .tb-r1-rozet li:nth-child(2) { top: 28%; animation-delay: 1.2s; }
    .tb-r1-rozet li:nth-child(3) { top: 42%; animation-delay: 2.4s; }
}
@keyframes tbRozet { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }
@media (prefers-reduced-motion: reduce) { .tb-r1-rozet li { animation: none; } }

/* ---------- 2) VERILERINIZ EMIN ELLERDE — tam kenar fotograf, koyu bant ---------- */
.tb-r2 { position: relative; padding-block: clamp(3rem, 6vw, 5rem); background: #0A1428; color: #fff; overflow: hidden; }
.tb-r2-foto { position: absolute; left: 0; top: 0; bottom: 0; width: 46%; }
.tb-r2-foto img { width: 100%; height: 100%; object-fit: cover; display: block; filter: saturate(1.15) brightness(.95); }
.tb-r2-foto::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(10,20,40,0) 35%, rgba(10,20,40,.75) 75%, #0A1428 100%), linear-gradient(180deg, rgba(10,20,40,.2), rgba(10,20,40,0) 30%, rgba(10,20,40,0) 70%, rgba(10,20,40,.5)); }
.tb-r2::before { content: ""; position: absolute; inset: 0; background: radial-gradient(50% 70% at 90% 50%, rgba(53,100,175,.3), transparent 70%); pointer-events: none; }
.tb-r2-izgara { position: relative; display: grid; gap: 2rem; align-items: center; }
@media (min-width: 992px) { .tb-r2-izgara { grid-template-columns: 38% minmax(0, 1fr) minmax(0, 420px); gap: clamp(1.4rem, 3vw, 3rem); } .tb-r2-bos { min-height: 1px; } }
@media (max-width: 991.98px) { .tb-r2-foto { position: relative; width: auto; aspect-ratio: 16 / 9; border-radius: 18px; overflow: hidden; } .tb-r2-foto::after { background: linear-gradient(180deg, rgba(10,20,40,0) 50%, #0A1428 100%); } }
.tb-r2 .tb-r-h2 { color: #fff; max-width: 14ch; }
.tb-r2 .tb-r-lead { color: rgba(255,255,255,.72); max-width: 46ch; }
.tb-r2-olcu { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; }
.tb-r2-olcu li { padding: 0 1.5rem 0 0; margin: 0 1.5rem .8rem 0; border-right: 1px solid rgba(255,255,255,.14); }
.tb-r2-olcu li:last-child { border-right: 0; margin-right: 0; padding-right: 0; }
.tb-r2-olcu b { display: block; font: 700 1.75rem/1.1 var(--tb-font-baslik); color: #fff; letter-spacing: -.02em; }
.tb-r2-olcu b em { font-style: normal; color: #6FA8FF; }
.tb-r2-olcu small { display: block; margin-top: .25rem; font-size: .78rem; color: rgba(255,255,255,.6); }
.tb-r2-kart { position: relative; padding: 1.15rem 1.2rem 1.1rem; border-radius: 18px; border: 1px solid rgba(255,255,255,.12); background: linear-gradient(160deg, rgba(20,34,62,.85), rgba(10,20,40,.9)); box-shadow: 0 34px 64px -30px rgba(0,0,0,.85), inset 0 1px 0 rgba(255,255,255,.1); }
.tb-r2-kart-bas b { display: block; margin-bottom: .75rem; font: 700 .98rem/1.2 var(--tb-font-baslik); }
.tb-r2-sekme { display: flex; gap: .3rem; padding: .25rem; border-radius: 999px; background: rgba(255,255,255,.07); margin-bottom: .8rem; }
.tb-r2-sekme button { all: unset; cursor: pointer; flex: 1; text-align: center; padding: .42rem .5rem; border-radius: 999px; font: 600 .74rem/1 var(--tb-font-govde, "Open Sans", sans-serif); color: rgba(255,255,255,.7); }
.tb-r2-sekme button[aria-selected="true"] { background: #C62338; color: #fff; box-shadow: 0 8px 18px -8px rgba(198,35,56,.9); }
.tb-r2-sekme button:focus-visible { outline: 2px solid #8DB8FF; outline-offset: 2px; }
.tb-r2-grafik { position: relative; height: 150px; border-radius: 12px; background: rgba(0,0,0,.22); overflow: hidden; }
.tb-r2-grafik canvas { display: block; width: 100%; height: 100%; }
.tb-r2-grafik-not { position: absolute; left: .7rem; bottom: .45rem; font-size: .66rem; color: rgba(255,255,255,.5); }
.tb-r2-metrik { list-style: none; margin: .9rem 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .6rem; }
.tb-r2-metrik small { display: block; font-size: .72rem; color: rgba(255,255,255,.55); }
.tb-r2-metrik b { display: block; margin-top: .2rem; font: 700 1.5rem/1.1 var(--tb-font-baslik); color: #fff; letter-spacing: -.02em; }
.tb-r2-metrik b i { font-style: normal; font-weight: 400; font-size: .85rem; color: rgba(255,255,255,.7); margin-right: .05rem; }
.tb-r2-canli { display: inline-flex; align-items: center; gap: .4rem; margin-top: .7rem; font-size: .68rem; color: rgba(255,255,255,.5); }
.tb-r2-canli::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: #4ADE80; box-shadow: 0 0 0 3px rgba(74,222,128,.25); }

/* ---------- 3) DUNYAYA ACILAN KAPINIZ — aydinlik, koyu kitali harita ---------- */
.tb-r3 { position: relative; padding-block: clamp(3rem, 6vw, 5.5rem) clamp(2.4rem, 5vw, 4rem); color: #0C1627; overflow: hidden; background: radial-gradient(55% 70% at 70% 40%, rgba(141,184,255,.28), rgba(141,184,255,0) 70%), linear-gradient(180deg, #f6f8fb, #eef2f7); }
.tb-r3 .tb-r-h2 { color: #0C1627; max-width: 12ch; } .tb-r3 .tb-r-lead { color: #5b6b7c; }
.tb-r3-izgara { display: grid; gap: 2rem; align-items: center; }
@media (min-width: 992px) { .tb-r3-izgara { grid-template-columns: minmax(0, .8fr) minmax(0, 1.5fr); gap: clamp(1.6rem, 3vw, 3rem); } }
.tb-r3-harita { position: relative; aspect-ratio: 2 / 1; background: url(/canli/dunya-kara-v2.svg) center / 100% 100% no-repeat; filter: drop-shadow(0 24px 30px rgba(15,32,55,.28)); }
.tb-r3-harita canvas { position: absolute; inset: 0; display: block; width: 100%; height: 100%; }
.tb-r3-pin { position: absolute; transform: translate(-50%, -100%); margin-top: -16px; padding: .4rem .8rem; border-radius: 8px; background: #C62338; color: #fff; font: 700 .76rem/1 var(--tb-font-baslik); letter-spacing: .02em; white-space: nowrap; box-shadow: 0 10px 24px -10px rgba(198,35,56,.9); z-index: 2; }
.tb-r3-pin::after { content: ""; position: absolute; left: 50%; top: 100%; transform: translateX(-50%); border: 6px solid transparent; border-top-color: #C62338; }
.tb-r3-ozellik { list-style: none; margin: clamp(2rem, 4vw, 3rem) 0 0; padding: clamp(1.4rem, 3vw, 2rem) 0 0; border-top: 1px solid rgba(15,32,55,.08); display: grid; gap: 1.2rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 992px) { .tb-r3-ozellik { grid-template-columns: repeat(4, minmax(0, 1fr)); } .tb-r3-ozellik li + li { border-left: 1px solid rgba(15,32,55,.08); padding-left: 1.4rem; } }
.tb-r3-ozellik li { display: flex; gap: .8rem; align-items: flex-start; }
.tb-r3-ozellik i { flex: none; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; border: 1px solid rgba(15,32,55,.1); background: #fff; color: #0C1627; font-size: 1.05rem; box-shadow: 0 10px 20px -14px rgba(15,32,55,.4); }
.tb-r3-ozellik b { display: block; font: 700 .95rem/1.2 var(--tb-font-baslik); color: #0C1627; }
.tb-r3-ozellik small { display: block; margin-top: .2rem; font-size: .8rem; line-height: 1.45; color: #5b6b7c; }
/* duzeltmeler v121.1 */
.tb-domain-wrap .tb-domain-form .tb-domain-tld-btn { all: unset; cursor: pointer; display: inline-flex; align-items: center; gap: .45rem; padding: .5rem .9rem; margin-right: .2rem; font: 600 .92rem/1 var(--tb-font-govde, "Open Sans", sans-serif); color: #0C1627; border-left: 1px solid #e3e8ef; }
.tb-domain-wrap .tb-domain-form .tb-domain-tld-btn i { font-size: .7rem; color: #5b6b7c; }
.tb-domain-wrap .tb-domain-form .tb-domain-exts button { all: unset; cursor: pointer; display: block; padding: .5rem .75rem; border-radius: 9px; font: 600 .86rem/1 var(--tb-font-govde, "Open Sans", sans-serif); color: #0C1627; }
.tb-domain-wrap .tb-domain-form .tb-domain-exts button:hover, .tb-domain-wrap .tb-domain-form .tb-domain-exts button.is-active { background: rgba(53,100,175,.08); color: #3564AF; }
.tb-domain-wrap .tb-domain-form { background: #fff; }
@media (min-width: 992px) { .tb-r2-izgara { grid-template-columns: 33% minmax(0, 1fr) minmax(0, 400px); } }
.tb-r2-olcu li { padding-right: 1.2rem; margin-right: 1.2rem; }
.tb-r2-olcu b { font-size: 1.55rem; }
@media (max-width: 575.98px) { .tb-domain-wrap .tb-domain-form { flex-wrap: wrap; border-radius: 22px; padding: .5rem; gap: .45rem; } .tb-domain-wrap .tb-domain-form input { flex: 1 1 100%; padding: .55rem .5rem; } .tb-domain-wrap .tb-domain-form .tb-domain-tld-btn { border-left: 0; } .tb-domain-tld { margin-left: auto; } }

/* ===== v122: referanstaki KAVİSLİ GEÇİŞLER — aydınlık yüzeyler koyu zeminin üstünde büyük yaylarla biner ===== */
.tb-domain-wrap { background: #0B1526; padding-bottom: 110px; margin-bottom: 0; }
.tb-r1 { margin-top: -110px; padding-top: calc(110px + clamp(2.4rem, 5vw, 4.5rem)); padding-bottom: calc(100px + clamp(2.4rem, 5vw, 4rem)); margin-bottom: -100px; z-index: 2; border-radius: 50% 50% 50% 50% / 110px 110px 100px 100px; box-shadow: 0 -30px 60px -30px rgba(0,0,0,.25), 0 40px 60px -40px rgba(0,0,0,.45); }
.tb-r1::before { top: 18%; }
.tb-r2 { padding-top: calc(100px + clamp(2.4rem, 5vw, 4rem)); padding-bottom: calc(100px + clamp(2.4rem, 5vw, 4rem)); z-index: 1; }
.tb-r2-foto { top: 60px; bottom: 60px; }
.tb-r3 { margin-top: -100px; padding-top: calc(100px + clamp(2.4rem, 5vw, 4.5rem)); z-index: 2; border-radius: 50% 50% 0 0 / 100px 100px 0 0; box-shadow: 0 -30px 60px -30px rgba(0,0,0,.35); }
@media (max-width: 767.98px) {
    .tb-domain-wrap { padding-bottom: 70px; }
    .tb-r1 { margin-top: -70px; padding-top: calc(70px + 2.4rem); margin-bottom: -60px; padding-bottom: calc(60px + 2.4rem); border-radius: 50% 50% 50% 50% / 70px 70px 60px 60px; }
    .tb-r2 { padding-top: calc(60px + 2.4rem); padding-bottom: calc(60px + 2.4rem); }
    .tb-r2-foto { top: 0; bottom: 0; }
    .tb-r3 { margin-top: -60px; padding-top: calc(60px + 2.4rem); border-radius: 50% 50% 0 0 / 60px 60px 0 0; }
}
/* rozetler: referanstaki gibi tek satir, kisa pill */
.tb-r1-rozet li { padding: .6rem 1.05rem .6rem .65rem; }
.tb-r1-rozet b { font-size: .88rem; }
/* v122.1: kavis duzeltme — beyaz yuzey kartin sarmalayicisinin USTUNDE, menu yukari acilir, yaylar yumusak */
.tb-domain-wrap { padding-bottom: 96px; }
.tb-r1 { z-index: 6; margin-top: -96px; padding-top: calc(96px + clamp(2.4rem, 5vw, 4.5rem)); margin-bottom: -64px; padding-bottom: calc(64px + clamp(2.4rem, 5vw, 4rem)); border-radius: 50% 50% 50% 50% / 96px 96px 64px 64px; }
.tb-r2 { padding-top: calc(64px + clamp(2.4rem, 5vw, 4rem)); padding-bottom: calc(64px + clamp(2.4rem, 5vw, 4rem)); }
.tb-r2-foto { top: 30px; bottom: 30px; }
.tb-r3 { margin-top: -64px; padding-top: calc(64px + clamp(2.4rem, 5vw, 4.5rem)); border-radius: 50% 50% 0 0 / 64px 64px 0 0; }
.tb-domain-wrap .tb-domain-exts { top: auto; bottom: calc(100% + .6rem); }
@media (max-width: 767.98px) {
    .tb-domain-wrap { padding-bottom: 60px; }
    .tb-r1 { margin-top: -60px; padding-top: calc(60px + 2.4rem); margin-bottom: -44px; padding-bottom: calc(44px + 2.4rem); border-radius: 50% 50% 50% 50% / 60px 60px 44px 44px; }
    .tb-r2 { padding-top: calc(44px + 2.4rem); padding-bottom: calc(44px + 2.4rem); }
    .tb-r2-foto { top: 0; bottom: 0; }
    .tb-r3 { margin-top: -44px; padding-top: calc(44px + 2.4rem); border-radius: 50% 50% 0 0 / 44px 44px 0 0; }
}

/* ===== v123: referans birebir — koyu zemin ASAGI sisen yay, ayrik Sorgula dugmesi, ok etiketi ===== */
.tb-domain-wrap { z-index: 7; padding-bottom: 150px; border-radius: 0 0 50% 50% / 0 0 150px 150px; }
.tb-r1 { z-index: 6; margin-top: -150px; padding-top: calc(150px + clamp(2rem, 4vw, 3.5rem)); border-radius: 0 0 50% 50% / 0 0 64px 64px; box-shadow: 0 40px 60px -40px rgba(0,0,0,.45); }
.tb-domain-wrap .tb-domain-exts { top: calc(100% + .6rem); bottom: auto; }
.tb-domain-wrap .tb-domain { border-radius: 24px; padding: clamp(1.25rem, 3vw, 1.7rem) clamp(1.25rem, 3vw, 1.9rem) clamp(1.4rem, 3vw, 1.9rem); }
.tb-domain-wrap .tb-domain-ikon { width: 48px; height: 48px; flex-basis: 48px; }
.tb-domain-wrap .tb-domain-form, .tb-domain-wrap .tb-domain-form:focus-within { background: none; border: 0; padding: 0; gap: .8rem; box-shadow: none; }
.tb-domain-giris { flex: 1 1 auto; min-width: 0; display: flex; align-items: center; gap: .4rem; padding: .35rem .55rem .35rem 1.15rem; border-radius: 999px; background: #F2F5F9; border: 1px solid #E5EAF1; transition: border-color .2s, box-shadow .2s; }
.tb-domain-giris:focus-within { border-color: rgba(198,35,56,.4); box-shadow: 0 0 0 4px rgba(198,35,56,.08); background: #fff; }
.tb-domain-wrap .tb-domain-form input { padding: .8rem 0; font-size: .95rem; }
.tb-domain-wrap .tb-domain-form .tb-domain-tld-btn { border-left: 0; padding: .45rem .6rem .45rem .9rem; }
.tb-domain-wrap .tb-domain-form > button[type="submit"] { padding: .9rem 1.6rem; font-size: .92rem; }
.tb-r-ust::before { content: "➜"; width: auto; height: auto; background: none; font-size: .8rem; line-height: 1; }
.tb-r1-kart { border-radius: 18px; padding: 1.25rem 1.1rem 1.15rem; box-shadow: 0 20px 44px -28px rgba(15,32,55,.4), 0 2px 6px rgba(15,32,55,.04); }
.tb-r1-kart i { width: 44px; height: 44px; background: #E3EEFF; color: #2F6FE0; }
.tb-r1-kart b { font-size: .95rem; }
.tb-r1-dugme { padding: .8rem 1.6rem; border-color: rgba(198,35,56,.45); }
.tb-r1-sahne img { width: min(100%, 640px); }
@media (min-width: 1100px) { .tb-r1-izgara { grid-template-columns: minmax(0, .95fr) minmax(0, 1.15fr); } .tb-r1-sahne { min-height: 600px; } .tb-r1-sahne img { margin-left: -8%; width: min(100%, 660px); } .tb-r1-rozet li:nth-child(1) { top: 18%; } .tb-r1-rozet li:nth-child(2) { top: 31%; } .tb-r1-rozet li:nth-child(3) { top: 44%; } }
.tb-r1-rozet li { padding: .7rem 1.2rem .7rem .7rem; border-radius: 14px; box-shadow: 0 18px 36px -20px rgba(15,32,55,.45); }
.tb-r1-rozet i { width: 28px; height: 28px; background: #E3EEFF; color: #2F6FE0; font-size: .85rem; }
.tb-r1 { background: radial-gradient(70% 80% at 76% 55%, rgba(205,226,255,.75) 0%, rgba(205,226,255,.25) 40%, rgba(205,226,255,0) 70%), linear-gradient(180deg, #F7F9FC 0%, #EEF2F8 100%); }
.tb-r1::after { content: ""; position: absolute; right: -10%; top: 6%; width: 58%; aspect-ratio: 1; border-radius: 50%; border: 1px solid rgba(255,255,255,.9); box-shadow: inset 0 0 80px rgba(255,255,255,.7), 0 0 0 40px rgba(255,255,255,.25); pointer-events: none; }
.tb-r1 .tb-shell { position: relative; z-index: 1; }
@media (max-width: 767.98px) { .tb-domain-wrap { padding-bottom: 90px; border-radius: 0 0 50% 50% / 0 0 70px 70px; } .tb-r1 { margin-top: -90px; padding-top: calc(90px + 2.2rem); border-radius: 0 0 50% 50% / 0 0 44px 44px; } .tb-r1::after { display: none; } .tb-domain-wrap .tb-domain-form { flex-wrap: wrap; } .tb-domain-giris { flex-basis: 100%; } }

/* referanstaki kucuk yuvarlak ok: slider'in alt ortasinda, kartin ustunde */
.tb-domain-ok { position: absolute; left: 50%; top: 0; transform: translate(-50%, -50%); z-index: 8; display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; border: 1px solid rgba(255,255,255,.35); background: rgba(11,21,38,.6); color: #fff; font-size: .9rem; text-decoration: none; backdrop-filter: blur(6px); transition: background .2s, transform .2s; }
.tb-domain-ok:hover { color: #fff; background: #C62338; transform: translate(-50%, -50%) scale(1.06); }
.tb-domain-wrap { margin-top: -1.2rem; padding-top: 2.4rem; }
/* ===== v124: GEÇİŞ birebir — koyu yay kartın ARKASINDAN geçer (üst yarı koyu, alt yarı aydınlık), aydınlık zeminde yumuşak dalgalar ===== */
.tb-domain-wrap { position: relative; z-index: 7; margin-top: 0; padding-top: 118px; padding-bottom: 1.6rem; background: #F7F9FC; border-radius: 0; overflow: visible; }
.tb-domain-wrap::before { content: ""; position: absolute; left: 0; right: 0; top: -2px; height: 66%; z-index: 0; pointer-events: none;
    background: radial-gradient(120% 110% at 72% -30%, #16305e 0%, transparent 60%), linear-gradient(180deg, #060b1c 0%, #081026 60%, #0B1526 100%);
    border-radius: 0 0 50% 50% / 0 0 150px 150px; box-shadow: 0 30px 60px -30px rgba(6,11,28,.7); }
.tb-domain-wrap::after { content: ""; position: absolute; left: -12%; right: -12%; top: 66%; height: 190%; z-index: 0; pointer-events: none; border-radius: 50%;
    background: radial-gradient(closest-side, rgba(255,255,255,.95) 0%, rgba(255,255,255,.7) 40%, rgba(236,241,248,0) 100%); box-shadow: 0 0 0 1px rgba(255,255,255,.9), 0 0 0 48px rgba(255,255,255,.28), 0 0 0 96px rgba(255,255,255,.16); }
.tb-domain-wrap .tb-shell { position: relative; z-index: 2; }
.tb-domain-wrap .tb-domain { box-shadow: 0 40px 80px -36px rgba(6,11,28,.55), 0 0 0 1px rgba(15,32,55,.04); }
.tb-domain-ok { top: 40px; transform: translate(-50%, 0); z-index: 3; }
.tb-domain-ok:hover { transform: translate(-50%, 0) scale(1.06); }
.tb-r1 { margin-top: 0; padding-top: clamp(1.6rem, 3vw, 2.6rem); border-radius: 0 0 50% 50% / 0 0 64px 64px; background: radial-gradient(70% 80% at 76% 55%, rgba(205,226,255,.75) 0%, rgba(205,226,255,.25) 40%, rgba(205,226,255,0) 70%), linear-gradient(180deg, #F7F9FC 0%, #EEF2F8 100%); }
.tb-domain-wrap .tb-domain-exts { top: calc(100% + .6rem); bottom: auto; }
@media (max-width: 767.98px) { .tb-domain-wrap { padding-top: 84px; border-radius: 0; } .tb-domain-wrap::before { height: 58%; border-radius: 0 0 50% 50% / 0 0 80px 80px; } .tb-domain-wrap::after { display: none; } .tb-domain-ok { top: 26px; } .tb-r1 { margin-top: 0; padding-top: 2rem; } }
.tb-domain-wrap { overflow-x: clip; overflow-y: visible; }
/* v124.1: dalga sekli r1'in ARKA PLANINDA (metnin altinda) */
.tb-domain-wrap::after { display: none; }
.tb-r1::before { content: ""; position: absolute; left: -12%; right: -12%; top: -120px; height: 460px; width: auto; border-radius: 50%; z-index: 0; pointer-events: none;
    background: radial-gradient(closest-side, rgba(255,255,255,.96) 0%, rgba(255,255,255,.6) 45%, rgba(236,241,248,0) 100%);
    box-shadow: 0 0 0 1px rgba(255,255,255,.95), 0 0 0 52px rgba(255,255,255,.3), 0 0 0 104px rgba(255,255,255,.16); }
.tb-r1::after { z-index: 0; }
/* v124.2: kart dar (referans ~%72), koyu yay kartin iki yaninda giris satiri hizasina kadar iner */
.tb-domain-wrap .tb-shell { max-width: min(1120px, 94%); }
.tb-domain-wrap::before { height: 78%; border-radius: 0 0 50% 50% / 0 0 110px 110px; }
.tb-r1 { padding-top: clamp(2.4rem, 4vw, 3.6rem); }
@media (max-width: 767.98px) { .tb-domain-wrap::before { height: 62%; border-radius: 0 0 50% 50% / 0 0 70px 70px; } }

/* ===== v125 (2026-10-18): referans k11 — bolum gecisleri HAFIF, saga dogru yukselen yaylar; buyuk beyaz halka; kart sade ===== */
.tb-r1 { margin-bottom: 0; padding-bottom: clamp(2.6rem, 5vw, 4.5rem); z-index: 6; border-radius: 0 0 46% 54% / 0 0 18px 34px; box-shadow: 0 30px 50px -36px rgba(0,0,0,.5); }
.tb-r1::after { right: -16%; top: 0; width: 66%; aspect-ratio: 1 / .82; border: 1px solid rgba(255,255,255,.95); background: radial-gradient(60% 60% at 50% 48%, rgba(255,255,255,.96) 0%, rgba(255,255,255,.6) 55%, rgba(240,244,250,.1) 100%); box-shadow: inset 0 0 90px rgba(255,255,255,.8), 0 30px 60px -30px rgba(15,32,55,.35), 0 0 0 64px rgba(255,255,255,.28), 0 0 0 65px rgba(255,255,255,.75); }
.tb-r2 { margin-top: -34px; padding-top: calc(34px + clamp(2.6rem, 5vw, 4rem)); padding-bottom: calc(36px + clamp(2.6rem, 5vw, 4rem)); z-index: 3; border-radius: 0 0 46% 54% / 0 0 20px 36px; }
.tb-r2-foto { top: 0; bottom: 0; }
.tb-r3 { margin-top: -36px; padding-top: calc(36px + clamp(2.4rem, 5vw, 4.5rem)); z-index: 2; border-radius: 0; box-shadow: none; }
.tb-r2 .tb-r-h2 { max-width: none; }
.tb-r2-grafik { height: 170px; background: rgba(0,0,0,.18); border: 1px solid rgba(255,255,255,.06); }
.tb-r2-kart { padding: 1.25rem 1.3rem 1.25rem; }
.tb-r2-metrik { margin-top: 1rem; }
.tb-r2-metrik li { background: none; padding: .2rem 0; }
.tb-r2-metrik b { font-size: 1.6rem; }
@media (max-width: 767.98px) {
    .tb-r1 { border-radius: 0 0 46% 54% / 0 0 10px 20px; margin-bottom: 0; padding-bottom: 2.4rem; }
    .tb-r2 { margin-top: -20px; padding-top: calc(20px + 2.4rem); padding-bottom: calc(22px + 2.4rem); border-radius: 0 0 46% 54% / 0 0 12px 22px; }
    .tb-r3 { margin-top: -22px; padding-top: calc(22px + 2.4rem); border-radius: 0; }
}

/* CC BY kaynak notu (lisans geregi), fotografin sol alt kosesinde, sakin */
.tb-r2-kredi { position: absolute; left: .8rem; bottom: .6rem; z-index: 2; font-size: .62rem; line-height: 1; color: rgba(255,255,255,.45); text-decoration: none; letter-spacing: .02em; }
.tb-r2-kredi:hover { color: rgba(255,255,255,.8); }
@media (min-width: 992px) { .tb-r2-kredi { left: 1rem; bottom: 1rem; } }
/* v125.1: yay yonu duzeltme — kisayolda 3. deger SAG-alt, 4. deger SOL-alt; referansta sinir SAGA dogru yukselir */
.tb-r1 { border-radius: 0 0 54% 46% / 0 0 34px 18px; }
.tb-r2 { border-radius: 0 0 54% 46% / 0 0 36px 20px; }
.tb-r2-kredi { bottom: 2.6rem; }
@media (min-width: 992px) { .tb-r2-kredi { bottom: 2.8rem; left: 1rem; } }
@media (max-width: 767.98px) { .tb-r1 { border-radius: 0 0 54% 46% / 0 0 20px 10px; } .tb-r2 { border-radius: 0 0 54% 46% / 0 0 22px 12px; } .tb-r2-kredi { bottom: .6rem; } }

/* ===== v126 (2026-10-18): hero→kart yayi (k14), kart %73; yeni alt bolumler r4/r5/r6 ===== */
.tb-domain-wrap { background: linear-gradient(180deg, #E4EAF3 0%, #F3F6FA 55%, #F7F9FC 100%); }
.tb-domain-wrap::before { height: calc(100% - 18px); border-radius: 0 0 50% 50% / 0 0 170px 170px; }
.tb-domain-wrap .tb-shell { max-width: min(1400px, 73%); }
@media (max-width: 767.98px) { .tb-domain-wrap .tb-shell { max-width: 94%; } .tb-domain-wrap::before { height: 62%; border-radius: 0 0 50% 50% / 0 0 90px 90px; } }

/* ---------- r4: teknoloji partneri (koyu, ic kart) ---------- */
.tb-r4 { position: relative; z-index: 1; padding: clamp(1rem, 2vw, 1.5rem) clamp(.8rem, 1.6vw, 1.5rem) clamp(1.6rem, 3vw, 2.4rem); background: var(--tb-surface-2, #f5f7fa); }
.tb-r4-ic { position: relative; max-width: 1400px; margin: 0 auto; padding: clamp(2.2rem, 4.5vw, 4rem) clamp(1.4rem, 3.5vw, 3.6rem); border-radius: 28px; overflow: hidden; background: #0B1526; color: #fff; box-shadow: 0 40px 80px -40px rgba(6,11,28,.6); }
.tb-r4-foto { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 68% 40%; }
.tb-r4-ic::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, #0B1526 0%, rgba(11,21,38,.94) 32%, rgba(11,21,38,.55) 58%, rgba(11,21,38,.25) 100%), linear-gradient(180deg, rgba(11,21,38,.15) 0%, rgba(11,21,38,0) 40%, rgba(11,21,38,.75) 100%); }
.tb-r4-ic::after { content: ""; position: absolute; right: 12%; top: -20%; width: 46%; aspect-ratio: 1; border-radius: 50%; background: radial-gradient(closest-side, rgba(255,255,255,.28), rgba(141,184,255,.12) 45%, transparent 72%); pointer-events: none; }
.tb-r4-izgara { position: relative; z-index: 1; display: grid; gap: 2rem; align-items: center; }
@media (min-width: 992px) { .tb-r4-izgara { grid-template-columns: minmax(0, 1.05fr) minmax(0, .55fr); gap: clamp(2rem, 6vw, 8rem); } }
.tb-r4 .tb-r-h2 { color: #fff; max-width: none; }
.tb-r4 .tb-r-lead { color: rgba(255,255,255,.72); max-width: 48ch; margin-bottom: 0; }
.tb-r4-kart { position: relative; padding: 1.5rem 1.6rem 1.5rem; border-radius: 20px; border: 1px solid rgba(255,255,255,.16); background: linear-gradient(160deg, rgba(14,26,52,.72), rgba(8,16,34,.78)); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); box-shadow: 0 30px 60px -30px rgba(0,0,0,.8), inset 0 1px 0 rgba(255,255,255,.12); }
.tb-r4-kart blockquote { margin: 0 0 1.2rem; }
.tb-r4-kart blockquote p { margin: 0 0 .7rem; font: 600 1.05rem/1.5 var(--tb-font-baslik); color: #fff; }
.tb-r4-cizgi { display: block; width: 72px; height: 3px; border-radius: 3px; background: #C62338; margin: 0 0 .7rem; }
.tb-r4-kart cite { display: block; font-style: normal; font-size: .82rem; color: rgba(255,255,255,.6); }
.tb-r4-btn { display: inline-flex; align-items: center; gap: .6rem; padding: .7rem 1.3rem; border-radius: 999px; border: 1px solid rgba(255,255,255,.35); color: #fff; font: 600 .9rem/1 var(--tb-font-govde, "Open Sans", sans-serif); text-decoration: none; transition: background .2s, border-color .2s; }
.tb-r4-btn:hover { color: #fff; background: #C62338; border-color: #C62338; }
.tb-r4-ozellik { position: relative; z-index: 1; list-style: none; margin: clamp(2rem, 4vw, 3.2rem) 0 0; padding: clamp(1.4rem, 3vw, 2rem) 0 0; border-top: 1px solid rgba(255,255,255,.12); display: grid; gap: 1.2rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 992px) { .tb-r4-ozellik { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.tb-r4-ozellik li { display: flex; gap: .85rem; align-items: center; }
.tb-r4-ozellik i { flex: none; display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%; border: 1.5px solid rgba(255,255,255,.55); color: #fff; font-size: 1.1rem; }
.tb-r4-ozellik b { display: block; font: 700 .95rem/1.2 var(--tb-font-baslik); color: #fff; }
.tb-r4-ozellik small { display: block; margin-top: .2rem; font-size: .78rem; color: rgba(255,255,255,.58); }

/* ---------- r5: guclu markalarla (acik) ---------- */
.tb-r5 { position: relative; padding-block: clamp(2.6rem, 5vw, 4.5rem) clamp(2.4rem, 4vw, 3.6rem); background: linear-gradient(180deg, #F7F9FC, #EEF2F8); color: #0C1627; overflow: hidden; }
.tb-r5-izgara { display: grid; gap: 2rem; align-items: center; }
@media (min-width: 992px) { .tb-r5-izgara { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(2rem, 5vw, 5rem); } }
.tb-r5 .tb-r-h2 { color: #0C1627; } .tb-r5 .tb-r-lead { color: #5b6b7c; margin-bottom: 0; max-width: 46ch; }
.tb-r5-sahne { position: relative; display: grid; place-items: center; min-height: 300px; }
.tb-r5-halka { position: absolute; left: 50%; top: 50%; width: 118%; aspect-ratio: 1; transform: translate(-50%, -50%) rotate(-12deg); border-radius: 50%; border: 1px solid rgba(53,100,175,.22); background: radial-gradient(closest-side, rgba(255,255,255,.9), rgba(255,255,255,.3) 60%, transparent 100%); }
.tb-r5-halka2 { width: 82%; border-color: rgba(53,100,175,.35); background: none; border-style: dashed; }
.tb-r5-foto { position: relative; width: min(100%, 320px); height: auto; border-radius: 50%; box-shadow: 0 40px 70px -36px rgba(15,32,55,.6), 0 0 0 10px rgba(255,255,255,.85); }
.tb-r5-rozet { position: absolute; right: 0; top: 8%; display: inline-flex; align-items: center; gap: .7rem; padding: .7rem 1rem .7rem .75rem; border-radius: 14px; background: linear-gradient(135deg, #1B2E55, #0B1526); color: #fff; box-shadow: 0 24px 44px -24px rgba(6,11,28,.8); }
.tb-r5-rozet i { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; background: rgba(141,184,255,.18); color: #8DB8FF; font-size: 1rem; }
.tb-r5-rozet b { display: block; font: 700 .88rem/1.15 var(--tb-font-baslik); } .tb-r5-rozet small { display: block; font-size: .7rem; color: rgba(255,255,255,.65); }
.tb-r5-logolar { list-style: none; margin: clamp(2rem, 4vw, 3.2rem) 0 0; padding: 0; display: flex; flex-wrap: wrap; align-items: center; gap: .8rem; }
.tb-r5-logolar li { display: inline-flex; align-items: center; gap: .6rem; padding: .75rem 1.25rem; border-radius: 14px; background: #fff; border: 1px solid rgba(15,32,55,.07); box-shadow: 0 14px 30px -22px rgba(15,32,55,.45); font: 700 1rem/1 var(--tb-font-baslik); color: #0C1627; }
.tb-r5-logolar img { width: 26px; height: 26px; object-fit: contain; }

/* ---------- r6: blog (acik ic panel, 4 kart) ---------- */
.tb-r6 { position: relative; padding-block: 0 clamp(2.6rem, 5vw, 4.5rem); background: #EEF2F8; color: #0C1627; }
.tb-r6-ic { padding: clamp(1.6rem, 3.5vw, 2.8rem); border-radius: 28px; background: #fff; border: 1px solid rgba(15,32,55,.06); box-shadow: 0 30px 60px -40px rgba(15,32,55,.35); }
.tb-r6-bas { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 1rem 2rem; margin-bottom: clamp(1.4rem, 3vw, 2.2rem); }
.tb-r6 .tb-r-h2 { color: #0C1627; margin-bottom: .6rem; } .tb-r6 .tb-r-lead { color: #5b6b7c; margin-bottom: 0; max-width: 52ch; }
.tb-r6-tum { display: inline-flex; align-items: center; gap: .5rem; font: 600 .92rem/1 var(--tb-font-govde, "Open Sans", sans-serif); color: #0C1627; text-decoration: none; padding-bottom: .4rem; }
.tb-r6-tum:hover { color: #C62338; }
.tb-r6-izgara { display: grid; gap: 1.2rem; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 640px) { .tb-r6-izgara { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .tb-r6-izgara { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.tb-r6-kart { display: flex; flex-direction: column; border-radius: 18px; overflow: hidden; background: #fff; border: 1px solid rgba(15,32,55,.08); box-shadow: 0 16px 34px -26px rgba(15,32,55,.4); color: #0C1627; text-decoration: none; transition: transform .22s, box-shadow .22s; }
.tb-r6-kart:hover { transform: translateY(-4px); box-shadow: 0 26px 48px -26px rgba(53,100,175,.45); color: #0C1627; }
.tb-r6-kapak { display: block; aspect-ratio: 16 / 9; background: #0B1526; overflow: hidden; }
.tb-r6-kapak img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .5s; }
.tb-r6-kart:hover .tb-r6-kapak img { transform: scale(1.04); }
.tb-r6-govde { display: flex; flex-direction: column; gap: .9rem; padding: 1.1rem 1.1rem 1.05rem; flex: 1; }
.tb-r6-govde b { font: 700 .98rem/1.35 var(--tb-font-baslik); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.tb-r6-alt { display: flex; align-items: center; justify-content: space-between; gap: .6rem; margin-top: auto; }
.tb-r6-alt small { font-size: .76rem; color: #5b6b7c; }
.tb-r6-alt em { font-style: normal; font: 600 .7rem/1 var(--tb-font-govde, "Open Sans", sans-serif); padding: .35rem .6rem; border-radius: 999px; background: rgba(53,100,175,.08); color: #3564AF; white-space: nowrap; }

/* v126.1: kelime-logolar (Plesk, Windows Server) SVG olarak okunur boyutta; kart altinda beyaz dalga parıltısı (k14) */
.tb-r5-logolar .tb-r5-logo-yazi img { width: auto; height: 22px; max-width: 150px; }
.tb-domain-wrap::after { content: ""; display: block; position: absolute; left: 28%; right: -14%; top: 52%; bottom: 0; z-index: 1; pointer-events: none; border-radius: 50%; background: radial-gradient(60% 70% at 50% 60%, rgba(255,255,255,.95) 0%, rgba(255,255,255,.55) 45%, rgba(255,255,255,0) 100%); }
.tb-domain-wrap { overflow-x: clip; overflow-y: visible; }
@media (max-width: 767.98px) { .tb-domain-wrap::after { display: none; } }

/* v126.2: partner bandi — referans: sol yari koyu lacivert (metin okunur), zirvedeki kisinin arkasinda isik */
.tb-r4-foto { object-position: 70% 30%; filter: saturate(.9); }
.tb-r4-ic::before { background: linear-gradient(90deg, #0B1526 0%, #0B1526 22%, rgba(11,21,38,.92) 40%, rgba(11,21,38,.45) 62%, rgba(11,21,38,.2) 100%), linear-gradient(180deg, rgba(11,21,38,.2) 0%, rgba(11,21,38,0) 35%, rgba(11,21,38,.85) 100%); }
.tb-r4-ic::after { right: 6%; top: -28%; width: 52%; background: radial-gradient(closest-side, rgba(255,255,255,.55), rgba(190,214,255,.22) 40%, transparent 70%); }
@media (max-width: 991.98px) { .tb-r4-ic::before { background: linear-gradient(180deg, #0B1526 0%, rgba(11,21,38,.9) 35%, rgba(11,21,38,.6) 70%, rgba(11,21,38,.9) 100%); } .tb-r4-foto { object-position: 70% 50%; } }

/* v126.3: zirve fotografi bant oraninda; kisi saga-ustte, arkasinda isik; sol yari koyu */
.tb-r4-foto { object-position: 65% 18%; filter: none; }
.tb-r4-ic::before { background: linear-gradient(90deg, #0B1526 0%, #0B1526 24%, rgba(11,21,38,.9) 42%, rgba(11,21,38,.35) 60%, rgba(11,21,38,.1) 100%), linear-gradient(180deg, rgba(11,21,38,.1) 0%, rgba(11,21,38,0) 45%, rgba(11,21,38,.8) 100%); }
.tb-r4-ic::after { right: 10%; top: -30%; width: 48%; background: radial-gradient(closest-side, rgba(255,255,255,.62), rgba(200,220,255,.26) 38%, transparent 68%); }
@media (max-width: 991.98px) { .tb-r4-foto { object-position: 65% 25%; } }
/* v126.4: eski kuraldan kalan height:190% yeni parıltıyı r1 başlığına taşırıyordu — top+bottom ile sınırlı */
.tb-domain-wrap::after { height: auto; box-shadow: none; }

/* v126.5: zirve v4 — kisi %55, bas ustte */
.tb-r4-foto { object-position: 55% 0%; }
@media (max-width: 991.98px) { .tb-r4-foto { object-position: 55% 10%; } }

/* =====================================================================
   v127 (2026-10-18): HERO → ALAN ADI KARTI GECISI — referans (prnt.sc/t7MaQGdLMTBi) birebir
   Referanstan olculen (C = kart yuksekligi): yay ekran kenarlarinda kart ustunun 0,11C USTUNDE
   baslar, derinligi 0,967C, kartin yan kenarini 0,55C'de keser, en alt noktasi kartin ARKASINDA
   kalir. Yayin disinda celik mavisi serit (#8EA6C2), altinda beyaz elips dalga.
   Yay artik HERO'NUN KENDISI (eski koyu katman + dikis cizgisi kalkti): kure tuvali yaya
   kesintisiz akar. Hero gradyanlari eski kutu yuksekligine sabitlendi (calc) — ust kisim
   piksel piksel ayni kalir. Kure yerlesimi turkbil-canvas.js'te --tb-hero-alt'i dusurur.
   Masaustu: C=185 → B=179px, e=20px; uzanti 277px = 118px eski bosluk + 159px bindirme.
   Katmanlar: hero z7 > zemin (wrap::before) z1; kart z9; ok z10; r1 z6.
   ===================================================================== */
.tb-hero {
    --tb-hero-alt: 277px;
    z-index: 7;
    padding-bottom: var(--tb-hero-alt);
    border-radius: 0 0 50% 50% / 0 0 179px 179px;
    /* DIKKAT: radial-gradient BOYUTUNDA %+px karisik calc() bu Chromium'da GECERSIZ — bildirim dusup
       hero seffaflasiyordu (olculdu). Bu yuzden: orijinal 4 katman (turkbil-ui.css) AYNEN, background-size
       ile ESKI kutuya sabit; uzanti kutusuna (yay) ayri 3 katman. Ust 3 katman yalnizca uzantida boyanir. */
    background-image:
        radial-gradient(45% 75% at 92% 85%, rgba(0,38,92,.6) 0%, rgba(0,38,92,0) 100%),
        radial-gradient(46% 62% at 58% 64%, rgba(22,48,94,.6) 0%, rgba(22,48,94,0) 70%),
        linear-gradient(180deg, rgba(6,11,28,0) 0, #060b1c 140px),
        linear-gradient(90deg, rgba(53,100,175,.226) 0%, rgba(53,100,175,.229) 3%, rgba(53,100,175,.212) 10%, rgba(53,100,175,.185) 15%, rgba(53,100,175,.15) 20%, rgba(53,100,175,.11) 25%, rgba(53,100,175,.068) 30%, rgba(53,100,175,.026) 35%, rgba(53,100,175,0) 38.3%),
        radial-gradient(120% 95% at 72% 45%, #16305e 0%, transparent 58%),
        radial-gradient(70% 80% at 97% 25%, rgba(140, 40, 90, .45) 0%, transparent 60%),
        radial-gradient(60% 70% at 3% 85%, rgba(53, 100, 175, .35) 0%, transparent 62%),
        linear-gradient(180deg, #050a18 0%, #081026 52%, #060b1c 100%);
    background-size: 100% var(--tb-hero-alt), 100% var(--tb-hero-alt), 100% var(--tb-hero-alt), 100% var(--tb-hero-alt), 100% calc(100% - var(--tb-hero-alt)), 100% calc(100% - var(--tb-hero-alt)), 100% calc(100% - var(--tb-hero-alt)), 100% calc(100% - var(--tb-hero-alt));
    background-position: center bottom, center bottom, center bottom, center bottom, center top, center top, center top, center top;
    background-repeat: no-repeat;
    background-color: #060b1c;
}
.tb-domain-wrap { position: relative; z-index: auto; margin-top: -159px; padding-top: 0; padding-bottom: 1.6rem; background: none; border-radius: 0; overflow-x: clip; overflow-y: visible; }
.tb-domain-wrap::before { content: ""; position: absolute; z-index: 1; left: 0; right: 0; top: -40px; bottom: -190px; width: auto; height: auto; border-radius: 0; box-shadow: none; filter: none; pointer-events: none;
    background:
        linear-gradient(180deg, rgba(247,249,252,0) 0, rgba(247,249,252,0) 200px, rgba(247,249,252,.55) 290px, #F7F9FC 351px, #F7F9FC 100%),
        radial-gradient(58% 109px at 50% 248px, #F6F7F9 0%, #EEF1F5 55%, #E3E9EF 93%, rgba(227,233,239,0) 100%),
        linear-gradient(180deg, rgba(232,237,242,0) 248px, #E8EDF2 248px),
        linear-gradient(90deg, #9AB0CA 0%, #90A8C4 6%, #87A1BE 13%, #87A1BE 87%, #90A8C4 94%, #9AB0CA 100%);
}
.tb-domain-wrap::after { content: ""; display: block; position: absolute; z-index: 1; left: 0; right: 0; top: -40px; bottom: -190px; width: auto; height: auto; border-radius: 0; box-shadow: none; filter: none; pointer-events: none;
    background:
        linear-gradient(180deg, rgba(247,249,252,0) 0, rgba(247,249,252,0) 200px, rgba(247,249,252,.55) 290px, #F7F9FC 351px, #F7F9FC 100%),
        radial-gradient(30% 90px at 72% 330px, rgba(219,232,246,.9) 0%, rgba(219,232,246,0) 75%),
        linear-gradient(90deg, #E9EDF2 0%, #E2E8EE 4%, #DBE2EA 10%, #DCE3EB 15%, #E8ECF1 40%, #EFF2F6 62%, #F3F5F8 80%, #EEF2F7 86%, #F8F9FA 90%, #FBFBFB 94%, #FBFBFB 100%);
    -webkit-mask-image: radial-gradient(58% 109px at 50% 248px, #000 92%, transparent 100%), linear-gradient(180deg, transparent 248px, #000 248px);
            mask-image: radial-gradient(58% 109px at 50% 248px, #000 92%, transparent 100%), linear-gradient(180deg, transparent 248px, #000 248px); }
.tb-domain-wrap .tb-shell { position: relative; z-index: 9; }
.tb-domain-ok { top: -78px; transform: translate(-50%, 0); z-index: 10; }
.tb-domain-ok:hover { transform: translate(-50%, 0) scale(1.06); }
.tb-domain-wrap .tb-domain { border-radius: 22px;
    background: radial-gradient(36% 85% at 60% 18%, rgba(205,223,246,.55) 0%, rgba(205,223,246,0) 70%), linear-gradient(180deg, #FCFDFE 0%, #F6F8FB 52%, #F0F4F8 100%);
    box-shadow: 0 58px 96px -34px rgba(64,92,135,.48), 0 16px 30px -22px rgba(40,65,105,.22), inset 0 1px 0 rgba(255,255,255,.95), 0 0 0 1px rgba(255,255,255,.6); }   /* olculdu: hedef golge profiline ort. fark 5,2 */
.tb-domain-giris, .tb-domain-giris:focus-within { background: #fff; }
.tb-domain-giris { border-color: rgba(15,32,55,.05); box-shadow: 0 12px 26px -18px rgba(30,55,95,.5), 0 1px 2px rgba(15,32,55,.04); }
.tb-domain-giris:focus-within { box-shadow: 0 0 0 4px rgba(198,35,56,.08), 0 12px 26px -18px rgba(30,55,95,.5); }
.tb-r1::before { top: 0; box-shadow: none; }
.tb-r1 { background: radial-gradient(70% 80% at 76% 55%, rgba(205,226,255,.75) 0%, rgba(205,226,255,.25) 40%, rgba(205,226,255,0) 70%), linear-gradient(180deg, rgba(247,249,252,0) 0, rgba(247,249,252,0) 100px, #F7F9FC 150px, #EEF2F8 100%); }
@media (max-width: 767.98px) {
    .tb-hero { --tb-hero-alt: 154px; border-radius: 0 0 50% 50% / 0 0 84px 84px; }
    .tb-domain-wrap { margin-top: -70px; padding-top: 0; }
    .tb-domain-ok { top: -58px; }
    .tb-domain-wrap::before { background:
        linear-gradient(180deg, rgba(247,249,252,0) 0, rgba(247,249,252,0) 300px, #F7F9FC 420px, #F7F9FC 100%),
        radial-gradient(72% 124px at 50% 196px, #F6F7F9 0%, #EEF1F5 55%, #E3E9EF 93%, rgba(227,233,239,0) 100%),
        linear-gradient(180deg, rgba(232,237,242,0) 196px, #E8EDF2 196px),
        linear-gradient(90deg, #9AB0CA 0%, #8FA7C3 18%, #87A1BE 50%, #8FA7C3 82%, #9AB0CA 100%); }
    .tb-domain-wrap::after { background: linear-gradient(180deg, rgba(247,249,252,0) 0, rgba(247,249,252,0) 300px, #F7F9FC 420px, #F7F9FC 100%), linear-gradient(90deg, #E9EDF2 0%, #E2E8EE 6%, #E6EBF0 40%, #F2F4F7 75%, #FAFAFB 100%);
        -webkit-mask-image: radial-gradient(72% 124px at 50% 196px, #000 92%, transparent 100%), linear-gradient(180deg, transparent 196px, #000 196px); mask-image: radial-gradient(72% 124px at 50% 196px, #000 92%, transparent 100%), linear-gradient(180deg, transparent 196px, #000 196px); }
}

/* =====================================================================
   v128 (2026-10-18) — kullanici: "sanatsal calis, gecis hatasini duzelt, gorseli degistir,
   partner bandi kotu, canvas destekli olsun, koyu/aydinlik uyumu, aydinlikta slider bozuk".
   1) AYDINLIK KIP = KOYU KIPTEKI CALISMA: ana sayfa hero'su, gecisi ve karti iki kipte AYNI
      (turkbil-ui.css'teki aydinlik hero kurallari burada etkisizlestirilir; kure betigi
      data-tb-sabit-kip="koyu" ile atlas dalina girmez).
   2) Hizmetlerimiz -> koyu bant -> harita gecisi REFERANSTAN OLCULDU (prnt.sc/HM2QZ9dH6RAU):
      r1 alt kenari solda duz, sagda yukselir (yatay %55, dikey ~4,1vw = 1910'da 78px);
      bantin alt kenari ortada sarkar (sag 1,62vw / sol 1,05vw; derin nokta x=%55).
   3) Tuval katmanlari: turkbil-sahne.js (kenar, gecis, hizmet, bant, zirve, marka).
   ===================================================================== */
/* --- 1) aydinlik kipte hero: koyu kipteki degerler --- */
html:not([data-bs-theme="dark"]) .tb-hero { color: #fff;
    background-image:
        radial-gradient(45% 75% at 92% 85%, rgba(0,38,92,.6) 0%, rgba(0,38,92,0) 100%),
        radial-gradient(46% 62% at 58% 64%, rgba(22,48,94,.6) 0%, rgba(22,48,94,0) 70%),
        linear-gradient(180deg, rgba(6,11,28,0) 0, #060b1c 140px),
        linear-gradient(90deg, rgba(53,100,175,.226) 0%, rgba(53,100,175,.229) 3%, rgba(53,100,175,.212) 10%, rgba(53,100,175,.185) 15%, rgba(53,100,175,.15) 20%, rgba(53,100,175,.11) 25%, rgba(53,100,175,.068) 30%, rgba(53,100,175,.026) 35%, rgba(53,100,175,0) 38.3%),
        radial-gradient(120% 95% at 72% 45%, #16305e 0%, transparent 58%),
        radial-gradient(70% 80% at 97% 25%, rgba(140, 40, 90, .45) 0%, transparent 60%),
        radial-gradient(60% 70% at 3% 85%, rgba(53, 100, 175, .35) 0%, transparent 62%),
        linear-gradient(180deg, #050a18 0%, #081026 52%, #060b1c 100%);
    background-size: 100% var(--tb-hero-alt), 100% var(--tb-hero-alt), 100% var(--tb-hero-alt), 100% var(--tb-hero-alt), 100% calc(100% - var(--tb-hero-alt)), 100% calc(100% - var(--tb-hero-alt)), 100% calc(100% - var(--tb-hero-alt)), 100% calc(100% - var(--tb-hero-alt));
    background-position: center bottom, center bottom, center bottom, center bottom, center top, center top, center top, center top;
    background-repeat: no-repeat;
    background-color: #060b1c;
}
html:not([data-bs-theme="dark"]) .tb-hero::after { background: linear-gradient(100deg, rgba(5,10,24,.93) 0%, rgba(5,10,24,.72) 32%, rgba(5,10,24,.15) 55%, transparent 70%); }
@media (max-width: 992px) {
    html:not([data-bs-theme="dark"]) .tb-hero::after { background: linear-gradient(180deg, rgba(5,10,24,.92) 0%, rgba(5,10,24,.7) 45%, rgba(5,10,24,.3) 100%); }
    html:not([data-bs-theme="dark"]) .tb-hero-canvas { opacity: .5; }
}
html:not([data-bs-theme="dark"]) .tb-hero h1, html:not([data-bs-theme="dark"]) .tb-hero h1 .tb-accent { color: #fff; }
html:not([data-bs-theme="dark"]) .tb-hero .tb-vurgu { background: linear-gradient(90deg, #D4203C 0%, #F0456B 55%, #FF7AA6 100%); -webkit-background-clip: text; background-clip: text; color: transparent; -webkit-text-fill-color: transparent; filter: drop-shadow(0 0 16px rgba(217,36,70,.35)); }
html:not([data-bs-theme="dark"]) .tb-hero-lead { color: rgba(255,255,255,.82); }
html:not([data-bs-theme="dark"]) .tb-hero-eyebrow { border-color: rgba(255,255,255,.22); background: rgba(255,255,255,.05); color: rgba(255,255,255,.9); }
html:not([data-bs-theme="dark"]) .tb-hero-eyebrow::before { background: #C62338; box-shadow: 0 0 8px 1px rgba(198,35,56,.9); }
html:not([data-bs-theme="dark"]) .tb-hero .tb-play { color: rgba(255,255,255,.9); }
html:not([data-bs-theme="dark"]) .tb-hero .tb-play:hover { color: #fff; }
html:not([data-bs-theme="dark"]) .tb-hero .tb-play-ring { border-color: rgba(255,255,255,.3); background: rgba(255,255,255,.07); color: inherit; }
html:not([data-bs-theme="dark"]) .tb-hero .tb-play:hover .tb-play-ring { background: rgba(255,255,255,.13); }
html:not([data-bs-theme="dark"]) .tb-hero .tb-btn-primary, html:not([data-bs-theme="dark"]) .tb-hero .tb-btn-solid { background: linear-gradient(135deg, #D94256 0%, #C62338 100%); box-shadow: 0 12px 28px -10px rgba(198,35,56,.85); }
html:not([data-bs-theme="dark"]) .tb-hero .tb-btn-primary:hover, html:not([data-bs-theme="dark"]) .tb-hero .tb-btn-solid:hover { background: linear-gradient(135deg, #D94256 0%, #C62338 100%); box-shadow: 0 18px 36px -12px rgba(198,35,56,1); }
/* kart: aydinlik temanin krem kart/form kurallari yerine koyu kipteki ayni gorunum */
html:not([data-bs-theme="dark"]) .tb-domain-wrap .tb-domain { background: radial-gradient(36% 85% at 60% 18%, rgba(205,223,246,.55) 0%, rgba(205,223,246,0) 70%), linear-gradient(180deg, #FCFDFE 0%, #F6F8FB 52%, #F0F4F8 100%);
    box-shadow: 0 58px 96px -34px rgba(64,92,135,.48), 0 16px 30px -22px rgba(40,65,105,.22), inset 0 1px 0 rgba(255,255,255,.95), 0 0 0 1px rgba(255,255,255,.6); }
html:not([data-bs-theme="dark"]) .tb-domain-wrap .tb-domain-form, html:not([data-bs-theme="dark"]) .tb-domain-wrap .tb-domain-form:focus-within { background: none; border: 0; padding: 0; box-shadow: none; }
html:not([data-bs-theme="dark"]) .tb-domain-wrap .tb-domain-ikon { background: rgba(53,100,175,.1); border-color: rgba(53,100,175,.18); color: #3564AF; }
html:not([data-bs-theme="dark"]) .tb-domain-wrap .tb-domain-head h2 { color: #0C1627; }
html:not([data-bs-theme="dark"]) .tb-domain-wrap .tb-domain-head p { color: #5b6b7c; }
html:not([data-bs-theme="dark"]) .tb-domain-wrap .tb-domain-form input { color: #0C1627; }
html:not([data-bs-theme="dark"]) .tb-domain-wrap .tb-domain-form input::placeholder { color: #8d9aab; }
.tb-domain-wrap .tb-domain-form .tb-domain-tld-btn:hover, html:not([data-bs-theme="dark"]) .tb-domain-wrap .tb-domain-form .tb-domain-tld-btn:hover { background: none; box-shadow: none; transform: none; color: #3564AF; }
.tb-domain-wrap .tb-domain-form .tb-domain-exts button:hover, html:not([data-bs-theme="dark"]) .tb-domain-wrap .tb-domain-form .tb-domain-exts button:hover { box-shadow: none; transform: none; }
html:not([data-bs-theme="dark"]) .tb-domain-wrap .tb-domain-form > button[type="submit"] { background: #C62338; box-shadow: 0 10px 22px -10px rgba(198,35,56,.85); }
html:not([data-bs-theme="dark"]) .tb-domain-wrap .tb-domain-form > button[type="submit"]:hover { background: #C62338; box-shadow: 0 14px 28px -10px rgba(198,35,56,1); }

/* --- tuval katmanlari --- */
.tb-hero-kenar { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 0; pointer-events: none; display: block; }
.tb-gecis-tuval { position: absolute; left: 0; top: -40px; width: 100%; height: calc(100% + 230px); z-index: 2; pointer-events: none; display: block; }
.tb-r1-sahne { isolation: isolate; }
.tb-r1-tuval { position: absolute; left: -12%; top: -8%; width: 124%; height: 116%; z-index: 0; pointer-events: none; display: block; }
.tb-r1-sahne img { position: relative; z-index: 1; }
.tb-r1-rozet { z-index: 2; }
.tb-r2-isik { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; display: block; }
.tb-r5-sahne { isolation: isolate; }
.tb-r5-tuval { position: absolute; left: -16%; top: 50%; width: 132%; aspect-ratio: 1; height: auto; transform: translateY(-50%); z-index: 0; pointer-events: none; display: block; }
.tb-r5-foto { z-index: 1; }
.tb-r5-rozet { z-index: 2; }

/* --- 2) Hizmetlerimiz -> koyu bant -> harita: referanstan olculen yaylar --- */
.tb-r1, .tb-r2, .tb-r3 { --tb-r1-yay: max(18px, 4.1vw); --tb-r2-sag: max(12px, 1.62vw); --tb-r2-sol: max(8px, 1.05vw); }
.tb-r1 { border-radius: 0 0 55% 0 / 0 0 var(--tb-r1-yay) 0; margin-bottom: 0; padding-bottom: clamp(2.6rem, 5vw, 4.5rem); box-shadow: 0 26px 44px -34px rgba(0,0,0,.55); }
.tb-r2 { margin-top: calc(-1 * var(--tb-r1-yay)); padding-top: calc(var(--tb-r1-yay) + clamp(2.6rem, 5vw, 4rem)); padding-bottom: calc(var(--tb-r2-sag) + clamp(2.6rem, 5vw, 4rem)); border-radius: 0 0 45% 55% / 0 0 var(--tb-r2-sag) var(--tb-r2-sol); }
.tb-r3 { margin-top: calc(-1 * var(--tb-r2-sag)); padding-top: calc(var(--tb-r2-sag) + clamp(2.4rem, 5vw, 4.5rem)); border-radius: 0; }
.tb-r2-foto { top: 0; bottom: 0; }

/* --- 4) teknoloji partneri: tam genislik bant + tuval sahnesi (fotograf yerine) --- */
.tb-r4 { position: relative; z-index: 1; padding: clamp(3.4rem, 6.5vw, 6rem) 0 clamp(2.6rem, 4.5vw, 3.8rem); background: #071226; color: #fff; overflow: hidden; }
.tb-r4-tuval { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 0; display: block; }
.tb-r4::before { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
    background: linear-gradient(90deg, rgba(4,10,24,.88) 0%, rgba(4,10,24,.7) 26%, rgba(4,10,24,.18) 46%, rgba(4,10,24,0) 60%), linear-gradient(180deg, rgba(4,10,24,.35) 0%, rgba(4,10,24,0) 22%, rgba(4,10,24,0) 62%, rgba(4,10,24,.82) 100%); }
.tb-r4-govde { position: relative; z-index: 2; }
.tb-r4 .tb-r4-ozellik { border-top-color: rgba(255,255,255,.14); }
.tb-r4 .tb-r4-ozellik i { background: rgba(7,18,38,.45); backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px); }
.tb-r4 .tb-r4-kart { background: linear-gradient(160deg, rgba(14,28,58,.62), rgba(6,14,32,.72)); }
@media (max-width: 991.98px) {
    .tb-r4::before { background: linear-gradient(180deg, rgba(4,10,24,.86) 0%, rgba(4,10,24,.55) 34%, rgba(4,10,24,.25) 55%, rgba(4,10,24,.85) 100%); }
}

/* =====================================================================
   v129 (2026-10-18) — kullanici: "neon cerceveyi musteri paneli dugmesindeki gibi geri koy,
   sorgulama penceresini gelistir (temaya tam uyum, yenilikci); cok yapay -> gercekci, sanatsal;
   gorseli degistir + canvas dokunusu; el sikismaya canvas; koyu ve aydinlik kipte TAM uyum".
   1) Alan adi karti: donen neon cerceve geri acildi (turkbil-ui.css'teki kart neonu; panel
      dugmesiyle ayni @property --tb-neon-aci), odakta parlar; giris kutusunda odak akisi,
      daktilo yer tutucu (turkbil-sahne.js 'yazim'), oneriler kademeli belirir. ("/" ipucu v130'da kalkti.)
   2) Gorseller: fotogercekci sunucu render'i (sunucu-v7, sahne-uret/render_sunucu.py), gercek
      kabin fotografi (kabin-led, Unsplash), gercek gece fotografi (zirve-gece, CC BY-SA 4.0, kredili).
   3) KOYU KIP: ana sayfanin butun aydinlik yuzeyleri lacivert karsiliklarina gecer (gecis seridi,
      kart, hizmetler, harita, markalar, blog). Aydinlik kip referans tasarimdir, korunur.
   Koyu palet: zemin #0A1426/#0B1629, yuzey #101E38-#12213D, cizgi rgba(141,184,255,.12-.18),
   metin #E8EEF7/#F2F6FC, ikincil #A3B3C9 (yuzeyde >=7:1), vurgu mavi #8DB8FF, kirmizi #FF6B7D (>=6:1).
   ===================================================================== */

/* ---------- 1) ALAN ADI KARTI: neon cerceve + sorgulama alani ---------- */
.tb-domain-wrap .tb-domain::before, .tb-domain-wrap .tb-domain::after { display: block !important; }
.tb-domain-wrap .tb-domain::before { padding: 1.5px; animation-duration: 6s; }
.tb-domain-wrap .tb-domain::after { inset: -3px; border-radius: 25px; padding: 3px; filter: blur(9px); opacity: .7; animation-duration: 6s; transition: opacity .3s ease, filter .3s ease; }
.tb-domain-wrap .tb-domain:focus-within::after { opacity: 1; filter: blur(12px); }
.tb-domain-giris { position: relative; }
.tb-domain-giris::after { content: ""; position: absolute; left: 20px; right: 20px; bottom: -1px; height: 2px; border-radius: 2px; pointer-events: none; opacity: 0;
    background: linear-gradient(90deg, rgba(53,100,175,0), #3564AF 30%, #D04555 70%, rgba(208,69,85,0)); background-size: 200% 100%; transition: opacity .25s ease; }
.tb-domain-giris:focus-within::after { opacity: .9; animation: tbGirisAkis 2.4s linear infinite; }
@keyframes tbGirisAkis { from { background-position: 100% 0; } to { background-position: -100% 0; } }
.tb-domain-wrap .tb-domain-oneriler { gap: .5rem; margin-top: .95rem; }
.tb-domain-wrap .tb-domain-oner { align-items: center; gap: 0; padding: .48rem .85rem; font-size: .86rem; animation: tbOnerGel .32s cubic-bezier(.2,.7,.2,1) both; }
.tb-domain-wrap .tb-domain-oner:nth-child(2) { animation-delay: .04s; } .tb-domain-wrap .tb-domain-oner:nth-child(3) { animation-delay: .08s; }
.tb-domain-wrap .tb-domain-oner:nth-child(4) { animation-delay: .12s; } .tb-domain-wrap .tb-domain-oner:nth-child(5) { animation-delay: .16s; }
.tb-domain-wrap .tb-domain-oner::after { content: "→"; margin-left: .45rem; color: #C62338; opacity: 0; transform: translateX(-4px); transition: opacity .18s ease, transform .18s ease; }
.tb-domain-wrap .tb-domain-oner:hover::after, .tb-domain-wrap .tb-domain-oner:focus-visible::after { opacity: 1; transform: none; }
@keyframes tbOnerGel { from { opacity: 0; transform: translateY(6px) scale(.98); } to { opacity: 1; transform: none; } }
html:not([data-bs-theme="dark"]) .tb-domain-wrap .tb-domain-oner { background: #fff; border-color: rgba(53,100,175,.2); box-shadow: 0 8px 18px -12px rgba(30,55,95,.45); }
html:not([data-bs-theme="dark"]) .tb-domain-wrap .tb-domain-oner b { color: #0C1627; }
html:not([data-bs-theme="dark"]) .tb-domain-wrap .tb-domain-oner span { color: #3564AF; }
html:not([data-bs-theme="dark"]) .tb-domain-wrap .tb-domain-oner:hover { border-color: rgba(198,35,56,.45); background: #fff; }
@media (prefers-reduced-motion: reduce) { .tb-domain-wrap .tb-domain-oner { animation: none; } .tb-domain-giris:focus-within::after { animation: none; } }

/* ---------- 2) GORSELLER ---------- */
/* r1: fotogercekci render + LED tuvali (gorselle ayni kutu) */
.tb-r1-gorsel { position: relative; z-index: 1; width: min(100%, 640px); }
.tb-r1-sahne .tb-r1-gorsel img { position: relative; z-index: 1; display: block; width: 100%; height: auto; margin: 0; }
.tb-r1-led { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 2; pointer-events: none; display: block; }
@media (min-width: 1100px) { .tb-r1-gorsel { justify-self: start; margin-left: -8%; width: min(100%, 660px); } }
/* r2: kabin fotografi (zaten lacivert derecelendirildi) */
.tb-r2 .tb-r2-foto img { filter: none; object-position: 40% 50%; }
/* r4: gercek gece fotografi; kisi metin ile kart arasinda kalir */
.tb-r4 .tb-r4-foto { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 58% 74%; z-index: 0; filter: none; display: block; }
@media (max-width: 991.98px) { .tb-r4 .tb-r4-foto { object-position: 58% 72%; } }
/* koyu bantlarda bolum etiketi okunur kirmizi (#C62338 lacivert uzerinde 2,2:1 kaliyordu) */
.tb-r2 .tb-r-ust, .tb-r4 .tb-r-ust { color: #FF6B7D; }
/* r5: fotograf cembere sarildi; uzerinden yavas cam parilti gecer */
.tb-r5-cember { position: relative; z-index: 1; display: block; width: min(100%, 320px); border-radius: 50%; }
.tb-r5-cember .tb-r5-foto { display: block; width: 100%; }
.tb-r5-parilti { position: absolute; inset: 0; z-index: 2; border-radius: 50%; overflow: hidden; pointer-events: none; }
.tb-r5-parilti::before { content: ""; position: absolute; top: -25%; bottom: -25%; left: -70%; width: 46%; transform: skewX(-20deg);
    background: linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.16) 42%, rgba(255,255,255,.26) 50%, rgba(255,255,255,.16) 58%, rgba(255,255,255,0) 100%);
    animation: tbR5Parilti 8s cubic-bezier(.45,.05,.35,1) infinite; }
@keyframes tbR5Parilti { 0%, 58% { left: -70%; } 100% { left: 135%; } }
@media (prefers-reduced-motion: reduce) { .tb-r5-parilti::before { animation: none; display: none; } }

/* ---------- 3) KOYU KIP ---------- */
/* gecis: celik serit -> derin lacivert serit, beyaz elips -> koyu elips, zemin -> #0A1426 */
html[data-bs-theme="dark"] .tb-domain-wrap::before { background:
    linear-gradient(180deg, rgba(10,20,38,0) 0, rgba(10,20,38,0) 200px, rgba(10,20,38,.6) 290px, #0A1426 351px, #0A1426 100%),
    radial-gradient(58% 109px at 50% 248px, #10203B 0%, #0E1C35 55%, #0C192F 93%, rgba(12,25,47,0) 100%),
    linear-gradient(180deg, rgba(12,24,45,0) 248px, #0C182D 248px),
    linear-gradient(90deg, #243B60 0%, #203658 6%, #1C3051 13%, #1C3051 87%, #203658 94%, #243B60 100%); }
html[data-bs-theme="dark"] .tb-domain-wrap::after { background:
    linear-gradient(180deg, rgba(10,20,38,0) 0, rgba(10,20,38,0) 200px, rgba(10,20,38,.6) 290px, #0A1426 351px, #0A1426 100%),
    radial-gradient(30% 90px at 72% 330px, rgba(53,100,175,.26) 0%, rgba(53,100,175,0) 75%),
    linear-gradient(90deg, #0F1D36 0%, #0E1B33 10%, #0D1A31 40%, #0E1C34 62%, #111F39 80%, #0F1D36 100%); }
@media (max-width: 767.98px) {
    html[data-bs-theme="dark"] .tb-domain-wrap::before { background:
        linear-gradient(180deg, rgba(10,20,38,0) 0, rgba(10,20,38,0) 300px, #0A1426 420px, #0A1426 100%),
        radial-gradient(72% 124px at 50% 196px, #10203B 0%, #0E1C35 55%, #0C192F 93%, rgba(12,25,47,0) 100%),
        linear-gradient(180deg, rgba(12,24,45,0) 196px, #0C182D 196px),
        linear-gradient(90deg, #243B60 0%, #203658 18%, #1C3051 50%, #203658 82%, #243B60 100%); }
    html[data-bs-theme="dark"] .tb-domain-wrap::after { background: linear-gradient(180deg, rgba(10,20,38,0) 0, rgba(10,20,38,0) 300px, #0A1426 420px, #0A1426 100%), linear-gradient(90deg, #0F1D36 0%, #0E1B33 20%, #0D1A31 50%, #0F1D36 100%); }
}
/* kart */
html[data-bs-theme="dark"] .tb-domain-wrap .tb-domain { background: radial-gradient(36% 85% at 60% 18%, rgba(53,100,175,.24) 0%, rgba(53,100,175,0) 70%), linear-gradient(180deg, #14243F 0%, #101D36 55%, #0D1930 100%);
    box-shadow: 0 58px 96px -34px rgba(0,0,0,.78), 0 16px 30px -22px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.07); }
html[data-bs-theme="dark"] .tb-domain-wrap .tb-domain-head h2 { color: #F2F6FC; }
html[data-bs-theme="dark"] .tb-domain-wrap .tb-domain-head p { color: #A3B3C9; }
html[data-bs-theme="dark"] .tb-domain-wrap .tb-domain-ikon { background: rgba(141,184,255,.12); border-color: rgba(141,184,255,.24); color: #8DB8FF; }
html[data-bs-theme="dark"] .tb-domain-giris, html[data-bs-theme="dark"] .tb-domain-giris:focus-within { background: #0A1528; border-color: rgba(141,184,255,.16); box-shadow: inset 0 1px 0 rgba(255,255,255,.03), 0 12px 26px -18px rgba(0,0,0,.8); }
html[data-bs-theme="dark"] .tb-domain-giris:focus-within { border-color: rgba(255,107,125,.45); box-shadow: 0 0 0 4px rgba(198,35,56,.16), 0 12px 26px -18px rgba(0,0,0,.8); }
html[data-bs-theme="dark"] .tb-domain-wrap .tb-domain-form input { color: #E8EEF7; }
html[data-bs-theme="dark"] .tb-domain-wrap .tb-domain-form input::placeholder { color: #8394AB; }
html[data-bs-theme="dark"] .tb-domain-wrap .tb-domain-form .tb-domain-tld-btn { color: #E8EEF7; }
html[data-bs-theme="dark"] .tb-domain-wrap .tb-domain-form .tb-domain-tld-btn i { color: #A3B3C9; }
html[data-bs-theme="dark"] .tb-domain-wrap .tb-domain-form .tb-domain-tld-btn:hover { color: #8DB8FF; }
html[data-bs-theme="dark"] .tb-domain-wrap .tb-domain-exts { background: #0F1C33; border-color: rgba(141,184,255,.16); box-shadow: 0 24px 50px -24px rgba(0,0,0,.9); }
html[data-bs-theme="dark"] .tb-domain-wrap .tb-domain-form .tb-domain-exts button { color: #E8EEF7; }
html[data-bs-theme="dark"] .tb-domain-wrap .tb-domain-form .tb-domain-exts button:hover, html[data-bs-theme="dark"] .tb-domain-wrap .tb-domain-form .tb-domain-exts button.is-active { background: rgba(141,184,255,.12); color: #8DB8FF; }
html[data-bs-theme="dark"] .tb-domain-wrap .tb-domain-oner { background: rgba(141,184,255,.06); border-color: rgba(141,184,255,.18); box-shadow: none; }
html[data-bs-theme="dark"] .tb-domain-wrap .tb-domain-oner b { color: #F2F6FC; }
html[data-bs-theme="dark"] .tb-domain-wrap .tb-domain-oner span { color: #8DB8FF; }
html[data-bs-theme="dark"] .tb-domain-wrap .tb-domain-oner::after { color: #FF6B7D; }
html[data-bs-theme="dark"] .tb-domain-wrap .tb-domain-oner:hover { border-color: rgba(255,107,125,.5); background: rgba(141,184,255,.1); }
/* ortak metin */
html[data-bs-theme="dark"] .tb-r-ust { color: #FF6B7D; }
html[data-bs-theme="dark"] .tb-r1 .tb-r-h2, html[data-bs-theme="dark"] .tb-r3 .tb-r-h2, html[data-bs-theme="dark"] .tb-r5 .tb-r-h2, html[data-bs-theme="dark"] .tb-r6 .tb-r-h2 { color: #F2F6FC; }
html[data-bs-theme="dark"] .tb-r1 .tb-r-lead, html[data-bs-theme="dark"] .tb-r3 .tb-r-lead, html[data-bs-theme="dark"] .tb-r5 .tb-r-lead, html[data-bs-theme="dark"] .tb-r6 .tb-r-lead { color: #A3B3C9; }
/* r1 hizmetler */
html[data-bs-theme="dark"] .tb-r1 { color: #E8EEF7;
    background: radial-gradient(70% 80% at 76% 55%, rgba(53,100,175,.30) 0%, rgba(53,100,175,.10) 40%, rgba(53,100,175,0) 70%), linear-gradient(180deg, rgba(10,20,38,0) 0, rgba(10,20,38,0) 100px, #0A1426 150px, #0B1629 100%);
    box-shadow: 0 1px 0 rgba(141,184,255,.16), 0 26px 44px -30px rgba(0,0,0,.9); }
html[data-bs-theme="dark"] .tb-r1::before { background: radial-gradient(closest-side, rgba(53,100,175,.14) 0%, rgba(53,100,175,.05) 45%, rgba(53,100,175,0) 100%); box-shadow: none; }
html[data-bs-theme="dark"] .tb-r1::after { border-color: rgba(141,184,255,.10); background: radial-gradient(60% 60% at 50% 48%, rgba(70,120,210,.20) 0%, rgba(53,100,175,.07) 55%, rgba(53,100,175,0) 100%); box-shadow: inset 0 0 90px rgba(53,100,175,.10); }
html[data-bs-theme="dark"] .tb-r1-kart { background: linear-gradient(180deg, #12213D 0%, #0F1C35 100%); border-color: rgba(141,184,255,.12); box-shadow: 0 20px 44px -28px rgba(0,0,0,.85), inset 0 1px 0 rgba(255,255,255,.04); color: #E8EEF7; }
html[data-bs-theme="dark"] .tb-r1-kart:hover { color: #fff; border-color: rgba(141,184,255,.3); box-shadow: 0 26px 48px -26px rgba(53,100,175,.55); }
html[data-bs-theme="dark"] .tb-r1-kart i { background: rgba(111,168,255,.14); color: #8DB8FF; }
html[data-bs-theme="dark"] .tb-r1-kart small { color: #A3B3C9; }
html[data-bs-theme="dark"] .tb-r1-dugme { background: rgba(255,255,255,.02); border-color: rgba(255,107,125,.5); color: #FF7A8C; box-shadow: none; }
html[data-bs-theme="dark"] .tb-r1-dugme:hover { background: #C62338; border-color: #C62338; color: #fff; }
html[data-bs-theme="dark"] .tb-r1-rozet li { background: rgba(15,28,53,.86); border-color: rgba(141,184,255,.16); box-shadow: 0 18px 36px -20px rgba(0,0,0,.85); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
html[data-bs-theme="dark"] .tb-r1-rozet b { color: #E8EEF7; }
html[data-bs-theme="dark"] .tb-r1-rozet i { background: rgba(111,168,255,.14); color: #8DB8FF; }
/* r2 -> r3 siniri koyu zeminde ince isikla belirir */
html[data-bs-theme="dark"] .tb-r2 { box-shadow: 0 1px 0 rgba(141,184,255,.12); }
/* r3 harita */
html[data-bs-theme="dark"] .tb-r3 { color: #E8EEF7; background: radial-gradient(55% 70% at 70% 40%, rgba(53,100,175,.22), rgba(53,100,175,0) 70%), linear-gradient(180deg, #0B1629, #0A1426); }
html[data-bs-theme="dark"] .tb-r3-harita { background-image: url(/canli/dunya-kara-v2-koyu.svg); filter: drop-shadow(0 24px 30px rgba(0,0,0,.5)); }
html[data-bs-theme="dark"] .tb-r3-ozellik { border-top-color: rgba(141,184,255,.12); }
html[data-bs-theme="dark"] .tb-r3-ozellik li + li { border-left-color: rgba(141,184,255,.12); }
html[data-bs-theme="dark"] .tb-r3-ozellik i { background: #101E38; border-color: rgba(141,184,255,.18); color: #E8EEF7; box-shadow: 0 10px 20px -14px rgba(0,0,0,.8); }
html[data-bs-theme="dark"] .tb-r3-ozellik b { color: #F2F6FC; }
html[data-bs-theme="dark"] .tb-r3-ozellik small { color: #A3B3C9; }
/* r5 markalar */
html[data-bs-theme="dark"] .tb-r5 { color: #E8EEF7; background: linear-gradient(180deg, #0A1426, #0B1629); }
html[data-bs-theme="dark"] .tb-r5-halka { border-color: rgba(141,184,255,.14); background: radial-gradient(closest-side, rgba(53,100,175,.16), rgba(53,100,175,.05) 60%, transparent 100%); }
html[data-bs-theme="dark"] .tb-r5-halka2 { border-color: rgba(141,184,255,.22); background: none; }
html[data-bs-theme="dark"] .tb-r5-foto { box-shadow: 0 40px 70px -36px rgba(0,0,0,.85), 0 0 0 10px rgba(255,255,255,.05); }
html[data-bs-theme="dark"] .tb-r5-rozet { box-shadow: 0 24px 44px -24px rgba(0,0,0,.9), 0 0 0 1px rgba(141,184,255,.16); }
html[data-bs-theme="dark"] .tb-r5-logolar li { background: #101E38; border-color: rgba(141,184,255,.12); box-shadow: 0 14px 30px -22px rgba(0,0,0,.8); color: #E8EEF7; }
html[data-bs-theme="dark"] .tb-r5-logolar img { filter: brightness(0) invert(1); opacity: .88; }
/* r6 blog */
html[data-bs-theme="dark"] .tb-r6 { color: #E8EEF7; background: #0B1629; }
html[data-bs-theme="dark"] .tb-r6-ic { background: linear-gradient(180deg, #0F1C34, #0D192F); border-color: rgba(141,184,255,.12); box-shadow: 0 30px 60px -40px rgba(0,0,0,.85); }
html[data-bs-theme="dark"] .tb-r6-tum { color: #E8EEF7; }
html[data-bs-theme="dark"] .tb-r6-tum:hover { color: #FF7A8C; }
html[data-bs-theme="dark"] .tb-r6-kart { background: #12213D; border-color: rgba(141,184,255,.12); box-shadow: 0 16px 34px -26px rgba(0,0,0,.85); color: #E8EEF7; }
html[data-bs-theme="dark"] .tb-r6-kart:hover { color: #fff; box-shadow: 0 26px 48px -26px rgba(53,100,175,.5); }
html[data-bs-theme="dark"] .tb-r6-alt small { color: #A3B3C9; }
html[data-bs-theme="dark"] .tb-r6-alt em { background: rgba(141,184,255,.12); color: #8DB8FF; }

/* =====================================================================
   v130 (2026-10-18) — kullanici: kureyi ortala; foto kaynak notunu kaldir; "/" ipucunu kaldir;
   kart basligi daha yaratici + ortali; markalar KAYAN SERIT olsun (eski .tb-serit'ten); performans
   kartina yaratici canvas. Kaynak notu yasal olarak kalkabilsin diye r4 fotografi CC0 esdegeriyle
   degisti (Greg Rakozy, Tony Grove Lake — atif gerekmez); eski CC BY-SA dosyalari yayindan alindi.
   ===================================================================== */
/* kart basligi: simge baslik satirinda, grup ortali; kart yuksekligi korunur (gecis yayi karta gore olculdu) */
.tb-domain-wrap .tb-domain-head { display: block; text-align: center; margin-bottom: .7rem; }
.tb-domain-wrap .tb-domain-head h2 { display: inline-flex; align-items: center; justify-content: center; gap: .6rem; max-width: 100%; margin: 0;
    font-size: clamp(1.12rem, 1.75vw, 1.42rem); line-height: 1.2; letter-spacing: -.02em; text-wrap: balance; }
.tb-domain-wrap .tb-domain-head .tb-domain-ikon { width: 30px; height: 30px; flex: 0 0 30px; font-size: .92rem; }
.tb-domain-wrap .tb-domain-head p { margin: .25rem 0 0; font-size: .9rem; text-wrap: balance; }
@media (max-width: 575.98px) { .tb-domain-wrap .tb-domain-head h2 { gap: .5rem; } .tb-domain-wrap .tb-domain-head .tb-domain-ikon { width: 28px; height: 28px; flex-basis: 28px; } }

/* r4: CC0 gece fotografi — kisi metin ile alinti karti arasinda, ozellik satirinin ustunde */
.tb-r4 .tb-r4-foto { object-position: 49.4% 100%; }

/* r2: performans karti — LED segment olcerler + imlec */
.tb-r2-seg { display: block; width: min(100%, 118px); height: 7px; margin-top: .6rem; }
.tb-r2-grafik canvas { cursor: crosshair; touch-action: pan-y; }

/* r5: KAYAN MARKA SERIDI (yontem eski .tb-serit, 2026-10-06): tam genislik ray, kenarlar maskeyle soner;
   liste 6 kez yazilir, -%50 kayar (yari = 3 takim → 2560 px ekranda bile bosluk yok); gap degil margin
   (her oge esit pay alir, dongu ziplamaz); fare ustundeyken / klavye odaginda durur; hareket azaltmada kaymaz. */
.tb-r5-serit { position: relative; z-index: 1; margin-top: clamp(2rem, 4vw, 3rem); padding-block: 1.05rem; overflow: hidden;
    border-block: 1px solid rgba(15,32,55,.07);
    -webkit-mask-image: linear-gradient(90deg, transparent, #000 9%, #000 91%, transparent);
            mask-image: linear-gradient(90deg, transparent, #000 9%, #000 91%, transparent); }
.tb-r5-serit .tb-r5-logolar { margin: 0; padding: 0; display: flex; flex-wrap: nowrap; gap: 0; width: max-content; animation: tbR5Kay 92s linear infinite; }
.tb-r5-serit .tb-r5-logolar li { flex: 0 0 auto; margin-inline-end: .9rem; }
.tb-r5-serit:hover .tb-r5-logolar, .tb-r5-serit:focus-within .tb-r5-logolar { animation-play-state: paused; }
@keyframes tbR5Kay { from { transform: translate3d(0, 0, 0); } to { transform: translate3d(-50%, 0, 0); } }
@media (prefers-reduced-motion: reduce) { .tb-r5-serit .tb-r5-logolar { animation: none; } }
html[data-bs-theme="dark"] .tb-r5-serit { border-color: rgba(141,184,255,.1); }

/* =====================================================================
   v131 (2026-10-20) — kullanici: fotograftaki insan yerine "logoya bakarak bir maskot olustur ve onu ekle".
   r4 fotografi: insan silindi, yerine logodan turetilen maskot (3B render, sahne-uret/maskot/) → zirve-maskot-*.webp.
   Telefon/tablet: fotograf bandin ALTINA sabitlenir (yukseklik clamp(420px,150vw,760px)), maskot icerigin altinda
   yildizlarin altinda tek basina gorunur (once alinti kartinin arkasinda kaliyordu). Tepelik, gorselin %50'sinde →
   alt bosluk = gorsel yuksekliginin yarisi + 48px (frekans halkalari ozellik listesine degmez).
   ===================================================================== */
@media (max-width: 991.98px) {
    .tb-r4 { --tb-r4-foto-h: clamp(420px, 150vw, 760px); padding-bottom: calc(var(--tb-r4-foto-h) * .5 + 48px); }
    .tb-r4 .tb-r4-foto { top: auto; bottom: 0; height: var(--tb-r4-foto-h); object-position: 49.9% 100%; }
    .tb-r4::before { background:
        linear-gradient(180deg, #071226 0%, #071226 calc(100% - var(--tb-r4-foto-h)), rgba(7,18,38,.55) calc(100% - var(--tb-r4-foto-h) + 70px), rgba(7,18,38,.25) calc(100% - var(--tb-r4-foto-h) + 170px), rgba(7,18,38,0) calc(100% - var(--tb-r4-foto-h) * .55), rgba(4,10,24,0) 82%, rgba(4,10,24,.55) 100%); }
}

/* =====================================================================
   v132 (2026-10-20) — kullanici: referans gorseldeki maskot "uyarla"; "kayan yildizlara tepkili olsun, yildiz nereden
   kayarsa onu takip etsin". Maskot artik fotografa gomulu degil: zirve-bos-*.webp ustunde canli 3B cizilir
   (turkbil-maskot.js). Tuvalin yeri/olcusu sahne betiginden gelir (fotografin object-fit esleminden); betik
   konumlayana kadar sifir boyutta durur (canvas varsayilan 300x150 sol-ust tuzagi).
   ===================================================================== */
.tb-r4 .tb-r4-maskot { position: absolute; left: 0; top: 0; width: 0; height: 0; z-index: 0; display: block; pointer-events: none; }

/* 2026-10-22 QA: yuzde isareti Turkce'de once (%24), diger dillerde sonra (24 %/24%); isaretli <i> ilk dugum, JS son metin dugumunu gunceller */
html:not([lang="tr"]):not([lang="az"]):not([lang="ar"]):not([lang="fa"]) .tb-r2-metrik b { display: flex; flex-direction: row-reverse; justify-content: flex-end; align-items: baseline; }
html[lang="de"] .tb-r2-metrik b i, html[lang="fr"] .tb-r2-metrik b i, html[lang="es"] .tb-r2-metrik b i, html[lang="ru"] .tb-r2-metrik b i, html[lang="it"] .tb-r2-metrik b i, html[lang="pt"] .tb-r2-metrik b i, html[lang="pt-br"] .tb-r2-metrik b i, html[lang="uk"] .tb-r2-metrik b i, html[lang="el"] .tb-r2-metrik b i, html[lang="nl"] .tb-r2-metrik b i { margin-inline-start: .18em; }
/* sekme metni uzun dillerde (Letzte 24 Stunden, Últimas 24 horas) iki satira kiriliyordu: genislik icerige gore, tek satir */
.tb-r2-sekme button { flex: 1 1 auto; white-space: nowrap; padding-inline: .6rem; }

/* 2026-10-22: hizmetler bolumu — sahne tuvali (left:-12%) sol sutuna tasiyor, yorunge/kesikli cizgiler kartlarin ustune ciziliyordu.
   Sol sutun tuvalin ustunde; tuvalin sol kenari sutun bosluguna dogru sonumlenir. RTL'de ayna. */
.tb-r1-sol { position: relative; z-index: 2; }
.tb-r1-tuval { -webkit-mask-image: linear-gradient(90deg, transparent 0, transparent 6%, #000 22%); mask-image: linear-gradient(90deg, transparent 0, transparent 6%, #000 22%); }
html[dir="rtl"] .tb-r1-tuval { -webkit-mask-image: linear-gradient(270deg, transparent 0, transparent 6%, #000 22%); mask-image: linear-gradient(270deg, transparent 0, transparent 6%, #000 22%); }

/* =====================================================================
   v133 (2026-10-22) — kullanici: "maskot cok yapay duruyor ve zemine tam oturmamis".
   Fotograf zirve-bos3: alta 420 px zemin eklendi; yerlesimi sahne betigi yapar (kaya tepesi ozellik cizgisinin 52 px
   ustunde, metin ile kart arasindaki bosluğun ortasinda). Betik yoksa: eklenen zemin bandin altina itilir, kompozisyon
   v132 ile ayni (420/3840 = %10,94 genislik).
   ===================================================================== */
@media (min-width: 992px) { .tb-r4 .tb-r4-foto { object-position: 49.4% calc(100% + 10.94vw); } }

/* 2026-10-22 HIZMETLER DAIRESI — kullanici: "orani ve oturdugu yer uygun degil, altin oranla yerlestir".
   OLCUM: daire bolumun %66'si genislikte yatay elipsti (1/.82), right:-16% top:0 → merkez sahnenin 196 px sagi,
   genis ekranda alttan 291 px tasiyordu. YENI KURAL: daire gorsele bagli, yorungelerle ORTAK MERKEZ
   (platform merkezi = gorselin 330/660, 330/580 noktasi; turkbil-sahne.js PC). Yaricap = dis yorunge yaricapi
   (KY*1.42 = 420/660 → cap %127.27): daire bir kurenin silueti, egik dis yorunge onun ekvatoru.
   Bu merkez 1990 px'te bolumun %61.5'inde (altin nokta %61.8). Gorunum (renk, kenar, hale) iki kipte aynen korunur. */
@media (min-width: 1100px) {
    .tb-r1::after { display: none !important; }
    .tb-r1-sahne .tb-r1-gorsel { position: relative; }
    .tb-r1-sahne .tb-r1-gorsel::before {
        content: ""; position: absolute; left: 50%; top: 56.9%; width: 127.27%; aspect-ratio: 1;
        transform: translate(-50%, -50%); border-radius: 50%; z-index: -1; pointer-events: none;
        border: 1px solid rgba(255,255,255,.95);
        background: radial-gradient(60% 60% at 50% 48%, rgba(255,255,255,.96) 0%, rgba(255,255,255,.6) 55%, rgba(240,244,250,.1) 100%);
        box-shadow: inset 0 0 90px rgba(255,255,255,.8), 0 30px 60px -30px rgba(15,32,55,.35), 0 0 0 64px rgba(255,255,255,.28), 0 0 0 65px rgba(255,255,255,.75);
    }
    html[data-bs-theme="dark"] .tb-r1-sahne .tb-r1-gorsel::before {
        border-color: rgba(141,184,255,.10);
        background: radial-gradient(60% 60% at 50% 48%, rgba(70,120,210,.20) 0%, rgba(53,100,175,.07) 55%, rgba(53,100,175,0) 100%);
        box-shadow: inset 0 0 90px rgba(53,100,175,.10);
    }
}

/* 2026-10-22 HIZMETLER BULUTU v3 — kullanici: "bulut oldugu belli olmuyor, biraz buyut". Stil dairenin birebir aynisi (SVG icinde).
   Klasik siluet: duz taban + derin girintili 4 tumsek; en/boy tam 1.618; ekranda 1000x618 px (v2: 854x530). Orta kubbe kulenin ustunde gorunur.
   Merkez: gorsel ortasi, dikeyde %47.2 (alt kenar bolum icinde). Kaynak: qa-20261022/koyu3.svg, acik3.svg. Geri donus: bu blogu sil → daire. */
@media (min-width:1100px){ .tb-r1-sahne .tb-r1-gorsel::before{ border:0 !important; border-radius:0 !important; box-shadow:none !important; filter:none !important; left:50% !important; top:47.24% !important; width:184.85% !important; aspect-ratio:1974/1356 !important; transform:translate(-50%,-50%) !important; background:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%22-178%20-178%201974%201356%22%3E%3Cdefs%3E%3CradialGradient%20id%3D%22g%22%20gradientUnits%3D%22objectBoundingBox%22%20cx%3D%22.5%22%20cy%3D%22.48%22%20r%3D%22.6%22%3E%3Cstop%20offset%3D%220%22%20stop-color%3D%22%23fff%22%20stop-opacity%3D%220.96%22/%3E%3Cstop%20offset%3D%220.55%22%20stop-color%3D%22%23fff%22%20stop-opacity%3D%220.6%22/%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22rgb%28240%2C244%2C250%29%22%20stop-opacity%3D%220.1%22/%3E%3C/radialGradient%3E%3CclipPath%20id%3D%22c%22%3E%3Ccircle%20cx%3D%22230%22%20cy%3D%22640%22%20r%3D%22230%22/%3E%3Ccircle%20cx%3D%22520%22%20cy%3D%22470%22%20r%3D%22300%22/%3E%3Ccircle%20cx%3D%22860%22%20cy%3D%22330%22%20r%3D%22330%22/%3E%3Ccircle%20cx%3D%221180%22%20cy%3D%22450%22%20r%3D%22290%22/%3E%3Ccircle%20cx%3D%221400%22%20cy%3D%22620%22%20r%3D%22218%22/%3E%3Crect%20x%3D%220%22%20y%3D%22620%22%20width%3D%221618%22%20height%3D%22380%22%20rx%3D%22190%22/%3E%3C/clipPath%3E%3Cfilter%20id%3D%22k%22%20x%3D%22-20%25%22%20y%3D%22-20%25%22%20width%3D%22140%25%22%20height%3D%22140%25%22%3E%3CfeMorphology%20operator%3D%22dilate%22%20radius%3D%221.62%22%20in%3D%22SourceAlpha%22%20result%3D%22d%22/%3E%3CfeComposite%20in%3D%22d%22%20in2%3D%22SourceAlpha%22%20operator%3D%22out%22%20result%3D%22o%22/%3E%3CfeFlood%20flood-color%3D%22%23fff%22%20flood-opacity%3D%220.95%22/%3E%3CfeComposite%20in2%3D%22o%22%20operator%3D%22in%22/%3E%3C/filter%3E%3Cfilter%20id%3D%22i%22%20x%3D%22-20%25%22%20y%3D%22-20%25%22%20width%3D%22140%25%22%20height%3D%22140%25%22%3E%3CfeComponentTransfer%20in%3D%22SourceAlpha%22%20result%3D%22ters%22%3E%3CfeFuncA%20type%3D%22table%22%20tableValues%3D%221%200%22/%3E%3C/feComponentTransfer%3E%3CfeGaussianBlur%20in%3D%22ters%22%20stdDeviation%3D%2272.8%22%20result%3D%22b%22/%3E%3CfeComposite%20in%3D%22b%22%20in2%3D%22SourceAlpha%22%20operator%3D%22in%22%20result%3D%22ib%22/%3E%3CfeFlood%20flood-color%3D%22%23fff%22%20flood-opacity%3D%220.8%22/%3E%3CfeComposite%20in2%3D%22ib%22%20operator%3D%22in%22/%3E%3C/filter%3E%3Cfilter%20id%3D%22h0%22%20x%3D%22-30%25%22%20y%3D%22-30%25%22%20width%3D%22160%25%22%20height%3D%22160%25%22%3E%3CfeMorphology%20operator%3D%22dilate%22%20radius%3D%22105.2%22%20in%3D%22SourceAlpha%22%20result%3D%22d%22/%3E%3CfeComposite%20in%3D%22d%22%20in2%3D%22SourceAlpha%22%20operator%3D%22out%22%20result%3D%22o%22/%3E%3CfeFlood%20flood-color%3D%22%23fff%22%20flood-opacity%3D%220.75%22/%3E%3CfeComposite%20in2%3D%22o%22%20operator%3D%22in%22/%3E%3C/filter%3E%3Cfilter%20id%3D%22h1%22%20x%3D%22-30%25%22%20y%3D%22-30%25%22%20width%3D%22160%25%22%20height%3D%22160%25%22%3E%3CfeMorphology%20operator%3D%22dilate%22%20radius%3D%22103.6%22%20in%3D%22SourceAlpha%22%20result%3D%22d%22/%3E%3CfeComposite%20in%3D%22d%22%20in2%3D%22SourceAlpha%22%20operator%3D%22out%22%20result%3D%22o%22/%3E%3CfeFlood%20flood-color%3D%22%23fff%22%20flood-opacity%3D%220.28%22/%3E%3CfeComposite%20in2%3D%22o%22%20operator%3D%22in%22/%3E%3C/filter%3E%3Cfilter%20id%3D%22s%22%20x%3D%22-30%25%22%20y%3D%22-30%25%22%20width%3D%22160%25%22%20height%3D%22170%25%22%3E%3CfeMorphology%20operator%3D%22erode%22%20radius%3D%2248.5%22%20in%3D%22SourceAlpha%22%20result%3D%22e%22/%3E%3CfeOffset%20dy%3D%2248.5%22%20in%3D%22e%22%20result%3D%22o%22/%3E%3CfeGaussianBlur%20in%3D%22o%22%20stdDeviation%3D%2248.5%22%20result%3D%22b%22/%3E%3CfeFlood%20flood-color%3D%22rgb%2815%2C32%2C55%29%22%20flood-opacity%3D%220.35%22/%3E%3CfeComposite%20in2%3D%22b%22%20operator%3D%22in%22%20result%3D%22sg%22/%3E%3CfeComposite%20in%3D%22sg%22%20in2%3D%22SourceAlpha%22%20operator%3D%22out%22/%3E%3C/filter%3E%3C/defs%3E%3Cg%20filter%3D%22url%28%23h0%29%22%3E%3Ccircle%20cx%3D%22230%22%20cy%3D%22640%22%20r%3D%22230%22/%3E%3Ccircle%20cx%3D%22520%22%20cy%3D%22470%22%20r%3D%22300%22/%3E%3Ccircle%20cx%3D%22860%22%20cy%3D%22330%22%20r%3D%22330%22/%3E%3Ccircle%20cx%3D%221180%22%20cy%3D%22450%22%20r%3D%22290%22/%3E%3Ccircle%20cx%3D%221400%22%20cy%3D%22620%22%20r%3D%22218%22/%3E%3Crect%20x%3D%220%22%20y%3D%22620%22%20width%3D%221618%22%20height%3D%22380%22%20rx%3D%22190%22/%3E%3C/g%3E%3Cg%20filter%3D%22url%28%23h1%29%22%3E%3Ccircle%20cx%3D%22230%22%20cy%3D%22640%22%20r%3D%22230%22/%3E%3Ccircle%20cx%3D%22520%22%20cy%3D%22470%22%20r%3D%22300%22/%3E%3Ccircle%20cx%3D%22860%22%20cy%3D%22330%22%20r%3D%22330%22/%3E%3Ccircle%20cx%3D%221180%22%20cy%3D%22450%22%20r%3D%22290%22/%3E%3Ccircle%20cx%3D%221400%22%20cy%3D%22620%22%20r%3D%22218%22/%3E%3Crect%20x%3D%220%22%20y%3D%22620%22%20width%3D%221618%22%20height%3D%22380%22%20rx%3D%22190%22/%3E%3C/g%3E%3Cg%20filter%3D%22url%28%23s%29%22%3E%3Ccircle%20cx%3D%22230%22%20cy%3D%22640%22%20r%3D%22230%22/%3E%3Ccircle%20cx%3D%22520%22%20cy%3D%22470%22%20r%3D%22300%22/%3E%3Ccircle%20cx%3D%22860%22%20cy%3D%22330%22%20r%3D%22330%22/%3E%3Ccircle%20cx%3D%221180%22%20cy%3D%22450%22%20r%3D%22290%22/%3E%3Ccircle%20cx%3D%221400%22%20cy%3D%22620%22%20r%3D%22218%22/%3E%3Crect%20x%3D%220%22%20y%3D%22620%22%20width%3D%221618%22%20height%3D%22380%22%20rx%3D%22190%22/%3E%3C/g%3E%3Crect%20x%3D%220%22%20y%3D%220%22%20width%3D%221618%22%20height%3D%221000%22%20fill%3D%22url%28%23g%29%22%20clip-path%3D%22url%28%23c%29%22/%3E%3Cg%20filter%3D%22url%28%23i%29%22%3E%3Ccircle%20cx%3D%22230%22%20cy%3D%22640%22%20r%3D%22230%22/%3E%3Ccircle%20cx%3D%22520%22%20cy%3D%22470%22%20r%3D%22300%22/%3E%3Ccircle%20cx%3D%22860%22%20cy%3D%22330%22%20r%3D%22330%22/%3E%3Ccircle%20cx%3D%221180%22%20cy%3D%22450%22%20r%3D%22290%22/%3E%3Ccircle%20cx%3D%221400%22%20cy%3D%22620%22%20r%3D%22218%22/%3E%3Crect%20x%3D%220%22%20y%3D%22620%22%20width%3D%221618%22%20height%3D%22380%22%20rx%3D%22190%22/%3E%3C/g%3E%3Cg%20filter%3D%22url%28%23k%29%22%3E%3Ccircle%20cx%3D%22230%22%20cy%3D%22640%22%20r%3D%22230%22/%3E%3Ccircle%20cx%3D%22520%22%20cy%3D%22470%22%20r%3D%22300%22/%3E%3Ccircle%20cx%3D%22860%22%20cy%3D%22330%22%20r%3D%22330%22/%3E%3Ccircle%20cx%3D%221180%22%20cy%3D%22450%22%20r%3D%22290%22/%3E%3Ccircle%20cx%3D%221400%22%20cy%3D%22620%22%20r%3D%22218%22/%3E%3Crect%20x%3D%220%22%20y%3D%22620%22%20width%3D%221618%22%20height%3D%22380%22%20rx%3D%22190%22/%3E%3C/g%3E%3C/svg%3E") center/100% 100% no-repeat !important; } html[data-bs-theme="dark"] .tb-r1-sahne .tb-r1-gorsel::before{ background:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%22-178%20-178%201974%201356%22%3E%3Cdefs%3E%3CradialGradient%20id%3D%22g%22%20gradientUnits%3D%22objectBoundingBox%22%20cx%3D%22.5%22%20cy%3D%22.48%22%20r%3D%22.6%22%3E%3Cstop%20offset%3D%220%22%20stop-color%3D%22rgb%2870%2C120%2C210%29%22%20stop-opacity%3D%220.2%22/%3E%3Cstop%20offset%3D%220.55%22%20stop-color%3D%22rgb%2853%2C100%2C175%29%22%20stop-opacity%3D%220.07%22/%3E%3Cstop%20offset%3D%221%22%20stop-color%3D%22rgb%2853%2C100%2C175%29%22%20stop-opacity%3D%220%22/%3E%3C/radialGradient%3E%3CclipPath%20id%3D%22c%22%3E%3Ccircle%20cx%3D%22230%22%20cy%3D%22640%22%20r%3D%22230%22/%3E%3Ccircle%20cx%3D%22520%22%20cy%3D%22470%22%20r%3D%22300%22/%3E%3Ccircle%20cx%3D%22860%22%20cy%3D%22330%22%20r%3D%22330%22/%3E%3Ccircle%20cx%3D%221180%22%20cy%3D%22450%22%20r%3D%22290%22/%3E%3Ccircle%20cx%3D%221400%22%20cy%3D%22620%22%20r%3D%22218%22/%3E%3Crect%20x%3D%220%22%20y%3D%22620%22%20width%3D%221618%22%20height%3D%22380%22%20rx%3D%22190%22/%3E%3C/clipPath%3E%3Cfilter%20id%3D%22k%22%20x%3D%22-20%25%22%20y%3D%22-20%25%22%20width%3D%22140%25%22%20height%3D%22140%25%22%3E%3CfeMorphology%20operator%3D%22dilate%22%20radius%3D%221.62%22%20in%3D%22SourceAlpha%22%20result%3D%22d%22/%3E%3CfeComposite%20in%3D%22d%22%20in2%3D%22SourceAlpha%22%20operator%3D%22out%22%20result%3D%22o%22/%3E%3CfeFlood%20flood-color%3D%22rgb%28141%2C184%2C255%29%22%20flood-opacity%3D%220.1%22/%3E%3CfeComposite%20in2%3D%22o%22%20operator%3D%22in%22/%3E%3C/filter%3E%3Cfilter%20id%3D%22i%22%20x%3D%22-20%25%22%20y%3D%22-20%25%22%20width%3D%22140%25%22%20height%3D%22140%25%22%3E%3CfeComponentTransfer%20in%3D%22SourceAlpha%22%20result%3D%22ters%22%3E%3CfeFuncA%20type%3D%22table%22%20tableValues%3D%221%200%22/%3E%3C/feComponentTransfer%3E%3CfeGaussianBlur%20in%3D%22ters%22%20stdDeviation%3D%2272.8%22%20result%3D%22b%22/%3E%3CfeComposite%20in%3D%22b%22%20in2%3D%22SourceAlpha%22%20operator%3D%22in%22%20result%3D%22ib%22/%3E%3CfeFlood%20flood-color%3D%22rgb%2853%2C100%2C175%29%22%20flood-opacity%3D%220.1%22/%3E%3CfeComposite%20in2%3D%22ib%22%20operator%3D%22in%22/%3E%3C/filter%3E%3C/defs%3E%3Crect%20x%3D%220%22%20y%3D%220%22%20width%3D%221618%22%20height%3D%221000%22%20fill%3D%22url%28%23g%29%22%20clip-path%3D%22url%28%23c%29%22/%3E%3Cg%20filter%3D%22url%28%23i%29%22%3E%3Ccircle%20cx%3D%22230%22%20cy%3D%22640%22%20r%3D%22230%22/%3E%3Ccircle%20cx%3D%22520%22%20cy%3D%22470%22%20r%3D%22300%22/%3E%3Ccircle%20cx%3D%22860%22%20cy%3D%22330%22%20r%3D%22330%22/%3E%3Ccircle%20cx%3D%221180%22%20cy%3D%22450%22%20r%3D%22290%22/%3E%3Ccircle%20cx%3D%221400%22%20cy%3D%22620%22%20r%3D%22218%22/%3E%3Crect%20x%3D%220%22%20y%3D%22620%22%20width%3D%221618%22%20height%3D%22380%22%20rx%3D%22190%22/%3E%3C/g%3E%3Cg%20filter%3D%22url%28%23k%29%22%3E%3Ccircle%20cx%3D%22230%22%20cy%3D%22640%22%20r%3D%22230%22/%3E%3Ccircle%20cx%3D%22520%22%20cy%3D%22470%22%20r%3D%22300%22/%3E%3Ccircle%20cx%3D%22860%22%20cy%3D%22330%22%20r%3D%22330%22/%3E%3Ccircle%20cx%3D%221180%22%20cy%3D%22450%22%20r%3D%22290%22/%3E%3Ccircle%20cx%3D%221400%22%20cy%3D%22620%22%20r%3D%22218%22/%3E%3Crect%20x%3D%220%22%20y%3D%22620%22%20width%3D%221618%22%20height%3D%22380%22%20rx%3D%22190%22/%3E%3C/g%3E%3C/svg%3E") center/100% 100% no-repeat !important; } }


/* ======================================================================
   2026-10-22 DUNYAYA ACILAN KAPINIZ — sahne (kullanicinin referans gorseli): sehir dugumleri, cam kalkan, isik gecidi.
   Tuval: turkbil-sahne.js 8) KALKAN. Kalkan ve etiketlerin konumunu tuval belirler (ayni koordinat).
   ====================================================================== */
.tb-r3-sahne { position: relative; aspect-ratio: 545 / 305; width: 100%; min-width: 0; }
.tb-r3-sahne canvas { position: absolute; inset: 0; display: block; width: 100%; height: 100%; }
.tb-r3-kalkan { position: absolute; left: 39.5%; top: 50%; width: 22%; transform: none; pointer-events: none; z-index: 1;
    filter: drop-shadow(0 18px 30px rgba(15,32,55,.28)); }
.tb-r3-kalkan img { display: block; width: 100%; height: 100%; }
.tb-r3-kalkan-koyu { display: none !important; }
html[data-bs-theme="dark"] .tb-r3-kalkan-koyu { display: block !important; }
html[data-bs-theme="dark"] .tb-r3-kalkan-acik { display: none !important; }
html[data-bs-theme="dark"] .tb-r3-kalkan { filter: drop-shadow(0 0 2px rgba(225,238,255,.9)) drop-shadow(0 0 14px rgba(150,190,255,.55)) drop-shadow(0 0 34px rgba(90,140,235,.35)); }
.tb-r3-sehir { position: absolute; z-index: 2; transform: translate(-50%, calc(-100% - 16px)); white-space: nowrap; pointer-events: none;
    padding: .34rem .66rem; border-radius: 7px; font: 600 .78rem/1 var(--tb-font-govde, "Open Sans", sans-serif); letter-spacing: .01em;
    color: #13213A; background: rgba(255,255,255,.92); border: 1px solid rgba(19,33,58,.14); box-shadow: 0 10px 22px -14px rgba(15,32,55,.45); }
.tb-r3-sehir::after { content: ""; position: absolute; left: 50%; top: 100%; width: 7px; height: 7px; transform: translate(-50%, -50%) rotate(45deg);
    background: inherit; border-right: inherit; border-bottom: inherit; }
html[data-bs-theme="dark"] .tb-r3-sehir { color: #E8EEF7; background: rgba(16,27,50,.9); border-color: rgba(150,180,235,.28); box-shadow: 0 10px 24px -14px rgba(0,0,0,.9); }
@media (max-width: 991.98px) { .tb-r3-sahne { aspect-ratio: 16 / 10; } .tb-r3-sehir { font-size: .72rem; } }
html[dir="rtl"] .tb-r3-sahne { direction: ltr; }   /* sahne bir cizim: sol-sag akisi tum dillerde ayni */

/* 2026-10-22 KALKAN v2 (Gemini istemi): opak dolgu kalkti → %15 buzlu cam (backdrop-filter blur 8px) + 1px siber-mavi neon cerceve,
   yalniz ince cizgili siber kilit, arkada kirmizi→mavi neon isima. KATMANLAR AYRI: isima filtresi cam kutusuna verilirse tarayici
   backdrop-filter'i devre disi birakir (filtreli ata = backdrop koku). 1) .tb-r3-isima 2) .tb-r3-cam 3) cizgi SVG. */
.tb-r3-kalkan { filter: none !important; }
html[data-bs-theme="dark"] .tb-r3-kalkan { filter: none !important; }
.tb-r3-kalkan > * { position: absolute; inset: 0; width: 100%; height: 100%; }
.tb-r3-isima { filter: drop-shadow(0 0 25px rgba(255,77,90,.45)) drop-shadow(0 0 25px rgba(56,189,248,.45)) drop-shadow(0 0 40px rgba(56,189,248,.25)); }
.tb-r3-isima i { position: absolute; inset: 0; display: block;
    -webkit-mask: url(../images/sahne/kalkan-maske.svg) center / 100% 100% no-repeat; mask: url(../images/sahne/kalkan-maske.svg) center / 100% 100% no-repeat;
    background: linear-gradient(140deg, rgba(56,189,248,.62) 0%, rgba(56,189,248,.28) 45%, rgba(255,77,90,.58) 100%); }
.tb-r3-cam {
    -webkit-mask: url(../images/sahne/kalkan-maske.svg) center / 100% 100% no-repeat; mask: url(../images/sahne/kalkan-maske.svg) center / 100% 100% no-repeat;
    background: linear-gradient(160deg, rgba(255,255,255,.22) 0%, rgba(255,255,255,.15) 40%, rgba(255,255,255,.08) 100%);
    -webkit-backdrop-filter: blur(8px) saturate(140%); backdrop-filter: blur(8px) saturate(140%); }
.tb-r3-kalkan img { filter: drop-shadow(0 0 4px rgba(56,189,248,.75)) drop-shadow(0 0 12px rgba(56,189,248,.35)); }
html:not([data-bs-theme="dark"]) .tb-r3-cam { background: linear-gradient(160deg, rgba(255,255,255,.55) 0%, rgba(255,255,255,.35) 45%, rgba(255,255,255,.2) 100%); }
html:not([data-bs-theme="dark"]) .tb-r3-isima { filter: drop-shadow(0 0 22px rgba(255,77,90,.32)) drop-shadow(0 0 22px rgba(2,132,199,.32)); }
html:not([data-bs-theme="dark"]) .tb-r3-kalkan img { filter: drop-shadow(0 0 3px rgba(2,132,199,.45)); }


/* 2026-10-22 KALKAN v3 — kullanicinin HD gorseli (fotograf sahne). Tuval sahnesi bu bolumde kullanilmiyor (data-tb-kalkan yok).
   Koyu kipte kenarlar zemine erir; aydinlik kipte gorsel koyu bir pencere olarak durur. Etiketler: kuyruk ucu = eski etiket ucu. */
.tb-r3-foto { aspect-ratio: 2752 / 1364; }
.tb-r3-foto img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
html[data-bs-theme="dark"] .tb-r3-foto img {
    -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%), linear-gradient(180deg, transparent 0, #000 7%, #000 93%, transparent 100%);
    -webkit-mask-composite: source-in; mask-image: linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%), linear-gradient(180deg, transparent 0, #000 7%, #000 93%, transparent 100%); mask-composite: intersect; }
html:not([data-bs-theme="dark"]) .tb-r3-foto { border-radius: 22px; overflow: hidden; box-shadow: 0 30px 60px -32px rgba(15,32,55,.55), 0 0 0 1px rgba(19,33,58,.08); }
.tb-r3-foto .tb-r3-sehir { transform: translate(-50%, calc(-100% - 7px)); font-size: clamp(.68rem, .78vw, .86rem); padding: .42em .8em; border-radius: .55em;
    color: #EEF3FB; background: rgba(22,33,58,.92); border-color: rgba(150,180,235,.32); box-shadow: 0 10px 24px -14px rgba(0,0,0,.9); }
.tb-r3-nabiz { position: absolute; z-index: 1; width: 2.2%; aspect-ratio: 1; border-radius: 50%; transform: translate(-50%, -50%); pointer-events: none;
    box-shadow: 0 0 0 1px rgba(255,120,110,.55); animation: tbR3Nabiz 2.6s ease-out infinite; }
.tb-r3-nabiz:nth-of-type(2) { animation-delay: .8s; } .tb-r3-nabiz:nth-of-type(3) { animation-delay: 1.6s; }
@keyframes tbR3Nabiz { 0% { transform: translate(-50%, -50%) scale(.6); opacity: .9; } 100% { transform: translate(-50%, -50%) scale(2.6); opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .tb-r3-nabiz { animation: none; opacity: 0; } }


/* 2026-10-22 KALKAN v4 — saydam zemin + marka renkleri, daha buyuk, SAG KENARI DUVARA DAYALI (kullanici referansi).
   Tasma: kabuk (.tb-shell) disindaki bosluk + gutter kadar inline-end'e uzar; .tb-r3 overflow:hidden kaydirma cubugunu keser. */
.tb-r3-saydam { aspect-ratio: 1600 / 793; margin-inline-end: calc(-1 * (max(0px, (100vw - var(--tb-shell)) / 2) + var(--tb-gutter))); width: auto; }
.tb-r3-saydam img { -webkit-mask-image: none !important; mask-image: none !important; }
html:not([data-bs-theme="dark"]) .tb-r3-saydam { border-radius: 0; overflow: visible; box-shadow: none; }
.tb-r3-foto-koyu { display: none !important; }
html[data-bs-theme="dark"] .tb-r3-foto-koyu { display: block !important; }
html[data-bs-theme="dark"] .tb-r3-foto-acik { display: none !important; }
@media (min-width: 992px) { .tb-r3-izgara:has(.tb-r3-saydam) { grid-template-columns: minmax(0, .68fr) minmax(0, 1.62fr); gap: clamp(1rem, 2vw, 2rem); } }
html:not([data-bs-theme="dark"]) .tb-r3-saydam .tb-r3-sehir { color: #13213A; background: rgba(255,255,255,.92); border-color: rgba(19,33,58,.12); box-shadow: 0 10px 24px -14px rgba(15,32,55,.45); }
html:not([data-bs-theme="dark"]) .tb-r3-saydam .tb-r3-nabiz { box-shadow: 0 0 0 1px rgba(198,35,56,.5); }
/* kaynak gorselin sag ust kosesindeki soluk cerceve izi + ust/alt kesik cizgiler: yumusak kenar */
.tb-r3-saydam img { -webkit-mask-image: linear-gradient(90deg, #000 93%, transparent 100%), linear-gradient(180deg, transparent 0, #000 6%, #000 94%, transparent 100%) !important; -webkit-mask-composite: source-in; mask-image: linear-gradient(90deg, #000 93%, transparent 100%), linear-gradient(180deg, transparent 0, #000 6%, #000 94%, transparent 100%) !important; mask-composite: intersect; }

/* 2026-10-22 KALKAN v5 — son dokunuslar (kullanici istemi):
   1) sehir etiketleri cam: rgba(15,23,42,.65) + 1px rgba(56,189,248,.35) + blur(8px)
   2) kalkan isimasi: arkada kirmizi/mavi patlama (.tb-r3-isik) + ustte screen ile parlaklik (.tb-r3-parla); kalkan merkezi gorselde %42 / %50
   3) blok dikeyde ortali, >=992px'te 24px saga (RTL'de sola) */
.tb-r3-saydam .tb-r3-sehir { background: rgba(15,23,42,.65) !important; border: 1px solid rgba(56,189,248,.35) !important; color: #EEF3FB !important;
    -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); box-shadow: 0 8px 22px -12px rgba(0,0,0,.8), inset 0 1px 0 rgba(255,255,255,.06) !important; }
.tb-r3-saydam img { z-index: 1; }
.tb-r3-saydam .tb-r3-sehir { z-index: 4; } .tb-r3-saydam .tb-r3-nabiz { z-index: 3; }
.tb-r3-isik { position: absolute; z-index: 0; left: 42%; top: 50%; width: 46%; aspect-ratio: 1; transform: translate(-50%, -50%); border-radius: 50%; pointer-events: none;
    background: radial-gradient(closest-side at 38% 40%, rgba(56,189,248,.42), rgba(56,189,248,0) 70%), radial-gradient(closest-side at 64% 66%, rgba(255,77,90,.40), rgba(255,77,90,0) 72%), radial-gradient(closest-side, rgba(53,100,175,.30), rgba(53,100,175,0));
    filter: blur(18px); animation: tbR3Isik 5s ease-in-out infinite alternate; }
.tb-r3-parla { position: absolute; z-index: 2; left: 42%; top: 50%; width: 24%; aspect-ratio: .82; transform: translate(-50%, -50%); pointer-events: none; mix-blend-mode: screen;
    background: radial-gradient(closest-side at 46% 44%, rgba(190,225,255,.30), rgba(190,225,255,0) 75%), radial-gradient(closest-side at 70% 74%, rgba(255,90,105,.30), rgba(255,90,105,0) 70%); }
@keyframes tbR3Isik { from { opacity: .82; transform: translate(-50%, -50%) scale(.96); } to { opacity: 1; transform: translate(-50%, -50%) scale(1.04); } }
@media (prefers-reduced-motion: reduce) { .tb-r3-isik { animation: none; } }
html:not([data-bs-theme="dark"]) .tb-r3-saydam .tb-r3-sehir { background: rgba(255,255,255,.72) !important; color: #13213A !important; border-color: rgba(53,100,175,.35) !important; box-shadow: 0 8px 22px -14px rgba(15,32,55,.45) !important; }
html:not([data-bs-theme="dark"]) .tb-r3-isik { opacity: .55; }
html:not([data-bs-theme="dark"]) .tb-r3-parla { display: none; }
.tb-r3-izgara:has(.tb-r3-saydam) { align-items: center; }
.tb-r3-saydam { align-self: center; }
@media (min-width: 992px) { .tb-r3-saydam { translate: 24px 0; } html[dir="rtl"] .tb-r3-saydam { translate: -24px 0; } }

/* 2026-10-22 KALKAN v6 — az hareket: fiber boyunca isik damlalari (turkbil-sahne.js 9) + gecit agzinda yavas nefes */
.tb-r3-saydam canvas.tb-r3-akis { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 2; pointer-events: none; }
.tb-r3-saydam::after { content: ""; position: absolute; z-index: 0; left: 75.5%; top: 50%; width: 15%; aspect-ratio: .62; transform: translate(-50%, -50%); border-radius: 50%; pointer-events: none;
    background: radial-gradient(closest-side, rgba(141,184,255,.30), rgba(198,35,56,.14) 55%, rgba(198,35,56,0)); filter: blur(10px); animation: tbR3Gecit 6s ease-in-out infinite alternate; }
@keyframes tbR3Gecit { from { opacity: .35; } to { opacity: .9; } }
html:not([data-bs-theme="dark"]) .tb-r3-saydam::after { opacity: .5; animation: none; }
@media (prefers-reduced-motion: reduce) { .tb-r3-saydam::after { animation: none; } }

/* 2026-10-22 HIZMETLER RENK UYUMU (KIRMIZI GERI ALINDI: kullanici 'kirmizi oraya uymadi' — yalniz camgobegi/mavi isima kaldi) — "Dunyaya acilan kapiniz" kalkan sahnesindeki kirmizi/mavi dil, hafif dozda
   (kullanici: koklu degisiklik degil, ust/alt bolumlerle uyum). Bulutun rengi/stili DEGISMEDI.
   Tuval: 2. yayilan halka + dis yorunge/uydular + zerrelerin 1/3'u marka kirmizisi (turkbil-sahne.js 3). */
.tb-r1-isik { position: absolute; z-index: 0; left: 50%; top: 62%; width: 78%; aspect-ratio: 1.35; transform: translate(-50%, -50%); border-radius: 50%; pointer-events: none;
    background: radial-gradient(closest-side at 36% 40%, rgba(56,189,248,.30), rgba(56,189,248,0) 70%), radial-gradient(closest-side at 66% 66%, rgba(99,140,255,.2), rgba(99,140,255,0) 72%);
    filter: blur(22px); animation: tbR3Isik 6s ease-in-out infinite alternate; }
html:not([data-bs-theme="dark"]) .tb-r1-isik { opacity: .45; }
@media (prefers-reduced-motion: reduce) { .tb-r1-isik { animation: none; } }
/* isik kaidenin arkasinda kaliyordu: kaideden tasacak boyut, odaklar kenarlarda */
.tb-r1-isik { top: 58%; width: 128%; aspect-ratio: 1.55;
    background: radial-gradient(closest-side at 26% 36%, rgba(56,189,248,.34), rgba(56,189,248,0) 72%), radial-gradient(closest-side at 76% 70%, rgba(99,140,255,.24), rgba(99,140,255,0) 72%), radial-gradient(closest-side, rgba(53,100,175,.16), rgba(53,100,175,0)); filter: blur(26px); }

/* ===================================================================
   MISYON & VIZYON — "IKI PANEL" v2 (.tb-mvp, 2026-10-26). ALTIN ORAN:
   bosluk 21/34/55/89 px (Fibonacci), yazi olcegi kok-phi adimli 1 -> 1.272 -> 1.618 -> 2.058 (cumle) -> 2.618 rem (h2 sitenin ortak .tb-r-h2'si = ~2.65rem),
   satir yuksekligi govdede 1.618, panel 1.618:1. RENK (kullanici: "temaya uyumlu degil"): dolu kirmizi/lacivert bloklar
   KALDIRILDI; paneller sitenin kart yuzeyi (aydinlik #fff, koyu #12213D->#0F1C34), kirmizi #C62338 / mavi #3564AF yalniz vurgu.
   =================================================================== */
.tb-mvp { padding-block: clamp(3.4375rem, 6.2vw, 5.5625rem); }
.tb-mvp-bas { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 1.3125rem 3.4375rem; margin-bottom: clamp(2.125rem, 3.8vw, 3.4375rem); }
.tb-mvp-bas > div { flex: 1 1 34rem; min-width: 0; }
.tb-mvp .tb-r-h2 { max-width: 16ch; margin-bottom: 1.3125rem; }
html:lang(ja) .tb-mvp .tb-r-h2, html:lang(ko) .tb-mvp .tb-r-h2, html:lang(zh) .tb-mvp .tb-r-h2 { max-width: 13em; }
.tb-mvp .tb-r-lead { max-width: 50ch; margin: 0; line-height: 1.618; }
.tb-mvp .tb-r-btn { flex: none; }
.tb-mvp-iki { display: grid; gap: 1.3125rem; }
@media (min-width: 900px) { .tb-mvp-iki { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
.tb-mvp-p { --mvp-vurgu: #C62338; --mvp-hale: rgba(198,35,56,.07); position: relative; isolation: isolate; overflow: hidden; display: flex; flex-direction: column; margin: 0;
    padding: clamp(2.125rem, 3.8vw, 3.4375rem); border-radius: 21px; color: #0C1627;
    background: radial-gradient(61.8% 61.8% at 100% 100%, var(--mvp-hale) 0%, transparent 100%), #fff;
    border: 1px solid rgba(15,32,55,.08); box-shadow: 0 30px 60px -40px rgba(15,32,55,.35); }
.tb-mvp-v { --mvp-vurgu: #3564AF; --mvp-hale: rgba(53,100,175,.08); }
html[dir="rtl"] .tb-mvp-p { background: radial-gradient(61.8% 61.8% at 0% 100%, var(--mvp-hale) 0%, transparent 100%), #fff; }
/* ustte vurgu cizgisi: icerigin baslangicina hizali, 89px (sitenin "aktif cizgi" dili) */
.tb-mvp-p::before { content: ""; position: absolute; top: -1px; inset-inline-start: clamp(2.125rem, 3.8vw, 3.4375rem); width: 89px; height: 3px; border-radius: 0 0 3px 3px; background: var(--mvp-vurgu); }
/* altin dikdortgen: yukseklik ALT SINIR olarak sutun genisligi / 1.618 (kapsayici birimi). aspect-ratio + overflow:hidden
   uzun dillerde (de/fr/ru/pl...) aciklamayi kesiyordu (17 dil x 4 genislik taramasinda 50 durum) — min-height ile icerik uzarsa kutu da uzar. */
.tb-mvp-iki { container-type: inline-size; }
@media (min-width: 900px) { .tb-mvp-p { min-height: calc((100cqi - 1.3125rem) / 2 / 1.618); } }
/* markanin noktali halkalari: panelin alt koselinde odak noktasi, vurgu renginde */
.tb-mvp-halka { position: absolute; z-index: -1; inset-inline-end: -89px; bottom: -89px; width: 288px; height: 288px; color: var(--mvp-vurgu); opacity: .28; }
/* ust satir: r4 ozellik simgesiyle ayni olcu (46px halka), vurgu renginde */
.tb-mvp-ust { display: flex; align-items: center; gap: .8125rem; }
.tb-mvp-ust i { flex: none; display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%; border: 1.5px solid color-mix(in srgb, var(--mvp-vurgu) 45%, transparent);
    background: color-mix(in srgb, var(--mvp-vurgu) 7%, transparent); font-size: 1.1rem; color: var(--mvp-vurgu); }
.tb-mvp-ust h3 { margin: 0; font: 700 1rem/1.236 var(--tb-font-baslik); color: var(--mvp-vurgu); }
.tb-mvp-ust small { display: block; margin-top: .125rem; font: 600 .786rem/1.236 var(--tb-font-govde, "Open Sans", sans-serif); color: #5b6b7c; }
.tb-mvp-soz { margin: 2.125rem 0 2.125rem; max-width: 30ch; font: 700 clamp(1.5rem, 2.4vw, 2.058rem)/1.236 var(--tb-font-baslik); letter-spacing: -.02em; color: #0C1627; text-wrap: balance; }
.tb-mvp-alt { margin: auto 0 0; padding-top: 1.3125rem; max-width: 46ch; font-size: 1rem; line-height: 1.618; color: #4F5F72; border-top: 1px solid rgba(15,32,55,.1); }
@media (max-width: 899.98px) { .tb-mvp-halka { width: 233px; height: 233px; inset-inline-end: -89px; bottom: -89px; opacity: .2; } }
html[dir="rtl"] .tb-mvp .tb-r-btn i { transform: scaleX(-1); }
/* koyu kip: sitenin lacivert kart yuzeyi (tb-r6-kart ile ayni), vurgular acik tonlar */
html[data-bs-theme="dark"] .tb-mvp-p { --mvp-vurgu: #FF6B7D; --mvp-hale: rgba(255,107,125,.08); color: #E8EEF7;
    background: radial-gradient(61.8% 61.8% at 100% 100%, var(--mvp-hale) 0%, transparent 100%), linear-gradient(180deg, #12213D, #0F1C34);
    border-color: rgba(141,184,255,.12); box-shadow: 0 30px 60px -40px rgba(0,0,0,.85); }
html[data-bs-theme="dark"] .tb-mvp-v { --mvp-vurgu: #8DB8FF; --mvp-hale: rgba(141,184,255,.08); }
html[dir="rtl"][data-bs-theme="dark"] .tb-mvp-p { background: radial-gradient(61.8% 61.8% at 0% 100%, var(--mvp-hale) 0%, transparent 100%), linear-gradient(180deg, #12213D, #0F1C34); }
html[data-bs-theme="dark"] .tb-mvp-soz { color: #F2F6FC; }
html[data-bs-theme="dark"] .tb-mvp-alt { color: #A3B3C9; border-top-color: rgba(141,184,255,.14); }
html[data-bs-theme="dark"] .tb-mvp-ust small { color: #8C9BB0; }