/* Tanıtım ana sayfası — "Süreç boyunca yanınızda" sahneleri (13 Eki 2026).
   İki kart: şantiye kayıtlarının dosyaya düşmesi + Lila ile kısa sohbet.
   HTML son kareyi taşır (ph1-3 / st1-3 sınıfları dolu); tanitim_sahne.js
   sahneyi başa sarıp oynatır. Script yoksa ya da hareket azaltılmışsa
   sahne durağan ve eksiksiz görünür.

   Ölçek: sahne içindeki her ölçü em; 1em kart genişliğine bağlı (cqw).
   Geniş kartta tasarım 60×37.5em, dar kartta (≤520px) 36×32em. */

/* ================= Süreç çizgisi ================= */
/* Solda yukarıdan aşağı inen çizgi sayfa kaydıkça dolar (--tl-p, JS);
   her durakta metin + çerçeveli sahne. Ekranın ortasına en yakın durak
   aktiftir: o oynar, diğeri soluk ve son karesinde bekler. */
.t-tl { position: relative; display: grid; gap: 56px; padding-left: 64px; --tl-p: 1; }
.t-tl::before, .t-tl::after {
  content: ""; position: absolute; left: 21px; top: 10px; bottom: 10px;
  width: 3px; border-radius: 3px;
}
.t-tl::before { background: var(--t-line); }
.t-tl::after {
  background: linear-gradient(180deg, var(--t-icon), var(--t-navy));
  transform: scaleY(var(--tl-p)); transform-origin: top;
}
.t-tl__item {
  position: relative;
  display: grid; grid-template-columns: minmax(240px, .8fr) minmax(0, 1.5fr);
  align-items: center; gap: 48px;
}
.t-tl__dot {
  position: absolute; left: -54px; top: 50%; z-index: 1;
  width: 26px; height: 26px; margin-top: -13px; border-radius: 50%;
  background: var(--t-canvas); border: 3px solid var(--t-line);
  transition: border-color .35s, background-color .35s, box-shadow .35s;
}
.t-tl:not(.is-live) .t-tl__dot,
.t-tl__item.is-reached .t-tl__dot { border-color: var(--t-navy); background: #fff; }
.t-tl__item.is-active .t-tl__dot { background: var(--t-navy); box-shadow: 0 0 0 7px rgba(31, 43, 71, .10); }
.t-tl__kicker { color: var(--t-link); font-size: 13px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.t-tl__text h3 { margin-top: 10px; font-size: clamp(24px, 2.2vw, 32px); line-height: 1.15; font-weight: 800; }
.t-tl__text p { margin-top: 12px; color: var(--t-muted); font-size: 17px; }
.t-tl__text .t-link { margin-top: 18px; }
.t-tl__scene {
  container-type: inline-size;
  overflow: hidden;
  border: 1px solid var(--t-line); border-radius: 24px;
  box-shadow: var(--t-shadow);
}
.t-tl__text, .t-tl__scene { transition: opacity .5s, filter .5s; }
.t-tl.is-live .t-tl__item:not(.is-active) .t-tl__text { opacity: .45; }
.t-tl.is-live .t-tl__item:not(.is-active) .t-tl__scene { opacity: .55; filter: saturate(.6); }

@media (max-width: 900px) {
  .t-tl { gap: 40px; padding-left: 36px; }
  .t-tl::before, .t-tl::after { left: 9px; }
  .t-tl__item { grid-template-columns: minmax(0, 1fr); gap: 18px; }
  .t-tl__dot { left: -36px; top: 4px; margin-top: 0; width: 21px; height: 21px; }
  .t-tl__scene { border-radius: 18px; }
}

.t-scene {
  position: relative;
  overflow: hidden;
  height: 37.5em;
  font-size: 9.5px;
  font-size: min(calc(100cqw / 60), 11px);
  line-height: 1.3;
}
.t-scene__stage {
  position: absolute; top: 0; left: 50%;
  width: 60em; height: 100%;
  transform: translateX(-50%);
}
.t-scene b { font-weight: 800; }
.t-scene img { max-width: none; }

/* ================= Şantiye sahnesi ================= */
.t-scene--site {
  background:
    radial-gradient(55% 70% at 88% 8%, #E1EFF9 0%, rgba(225, 239, 249, 0) 70%),
    linear-gradient(180deg, #F4F9FC 0%, #FAFAF7 100%);
}
.t-site__sky { position: absolute; left: 0; bottom: 0; width: 100%; height: 9em; fill: #E5EEF4; }

.t-site__log {
  position: absolute; left: 3em; top: 3.4em; width: 31em;
  padding: 1.4em 1.6em 1.5em;
  background: #fff; border: 1px solid #E7EBEF; border-radius: 1.6em;
  box-shadow: 0 .1em .3em rgba(31, 43, 71, .05), 0 1.2em 3em rgba(31, 43, 71, .10);
}
.t-site__head { display: flex; align-items: center; justify-content: space-between; gap: 1em; }
.t-site__head b { font-size: 1.3em; color: var(--t-navy); }
.t-site__count {
  font-size: 1em; font-weight: 700; color: var(--t-link);
  background: var(--t-ice); padding: .3em .8em; border-radius: 2em;
  font-variant-numeric: tabular-nums;
}
.t-site__count.is-bump { animation: t-bump .45s cubic-bezier(.3, 1.6, .5, 1); }

.t-site__rows { position: relative; display: grid; gap: .8em; margin-top: 1.1em; }
/* Dikey ray: gri iz + kayıt geldikçe uzayan lacivert dolgu */
.t-site__rows::before, .t-site__rows::after {
  content: ""; position: absolute; left: .51em; top: 3.6em;
  width: .18em; height: 16em; border-radius: 1em;
}
.t-site__rows::before { background: #E3E8EE; }
.t-site__rows::after {
  background: var(--t-navy);
  transform: scaleY(0); transform-origin: top;
  transition: transform .7s cubic-bezier(.65, 0, .35, 1);
}
.st2 .t-site__rows::after { transform: scaleY(.5); }
.st3 .t-site__rows::after { transform: none; }

.t-site__row {
  position: relative;
  display: grid; grid-template-columns: 1.2em 12em minmax(0, 1fr);
  align-items: center; column-gap: 1.2em;
  height: 7.2em; border-radius: 1em;
}
/* Henüz gelmemiş kaydın yeri: kesik çizgili boş çerçeve */
.t-site__row::after {
  content: ""; position: absolute; left: 2.4em; top: .3em;
  width: 12em; height: 6.6em;
  border: .12em dashed #D3DBE4; border-radius: .8em;
  transition: opacity .2s;
}
.t-site__dot {
  position: relative; z-index: 1;
  width: 1.2em; height: 1.2em; border-radius: 50%;
  background: #fff; box-shadow: inset 0 0 0 .2em #D3DBE4;
  transform: scale(.75);
  transition: transform .5s cubic-bezier(.3, 1.6, .5, 1) .1s, background-color .2s .1s, box-shadow .2s .1s;
}
.t-site__thumb {
  width: 12em; height: 6.6em; object-fit: cover;
  border-radius: .8em; background: #EEF2F5;
  opacity: 0;
}
.t-site__meta {
  display: flex; flex-direction: column; align-items: flex-start; gap: .45em; min-width: 0;
  opacity: 0; transform: translateX(-.8em);
  transition: opacity .4s .15s, transform .5s cubic-bezier(.2, .8, .2, 1) .15s;
}
.t-site__date {
  font-size: 1.02em; font-weight: 700; color: #4A5670;
  background: #F1F5F8; padding: .25em .65em; border-radius: .5em;
}
.t-site__meta b { font-size: 1.45em; color: var(--t-navy); white-space: nowrap; }

.st1 .t-site__row:nth-child(1)::after,
.st2 .t-site__row:nth-child(2)::after,
.st3 .t-site__row:nth-child(3)::after { opacity: 0; }
.st1 .t-site__row:nth-child(1) .t-site__thumb,
.st2 .t-site__row:nth-child(2) .t-site__thumb,
.st3 .t-site__row:nth-child(3) .t-site__thumb { opacity: 1; }
.st1 .t-site__row:nth-child(1) .t-site__meta,
.st2 .t-site__row:nth-child(2) .t-site__meta,
.st3 .t-site__row:nth-child(3) .t-site__meta { opacity: 1; transform: none; }
.st1 .t-site__row:nth-child(1) .t-site__dot,
.st2 .t-site__row:nth-child(2) .t-site__dot,
.st3 .t-site__row:nth-child(3) .t-site__dot {
  background: #F47735; transform: none;
  box-shadow: 0 0 0 .28em #fff, 0 0 0 .4em rgba(244, 119, 53, .25);
}
.t-site__row.is-new { animation: t-row-flash 1.4s ease-out; }
/* Son kaydın noktası yavaşça nabız atar */
.st3 .t-site__row:nth-child(3) .t-site__dot::after {
  content: ""; position: absolute; inset: 0; border-radius: 50%;
  border: .15em solid #F47735;
  animation: t-ping 2.4s cubic-bezier(0, 0, .2, 1) 1s infinite;
}

/* Telefon */
.t-phone {
  position: absolute; right: 3.8em; top: 2.8em;
  width: 18em; height: 37em; padding: .55em;
  background: #1B2130; border-radius: 3em;
  box-shadow: inset 0 0 0 .12em #3A4254, 0 2em 4em -1em rgba(31, 43, 71, .35), 0 .6em 1.2em rgba(31, 43, 71, .12);
}
.t-phone__screen {
  position: relative; height: 100%; overflow: hidden;
  padding: 0 1.1em;
  background: linear-gradient(180deg, #FFFFFF 0%, #F6F9FB 100%);
  border-radius: 2.5em;
}
.t-phone__status {
  display: flex; align-items: center; justify-content: space-between;
  height: 2.8em; padding: 0 .6em;
  font-size: .95em; font-weight: 800; color: var(--t-navy);
}
.t-phone__island {
  position: absolute; left: 50%; top: .7em;
  width: 5.6em; height: 1.6em; margin-left: -2.8em;
  background: #0E121B; border-radius: 1em;
}
.t-phone__bars { display: inline-flex; align-items: flex-end; gap: .16em; height: .85em; }
.t-phone__bars i { width: .24em; border-radius: .1em; background: var(--t-navy); }
.t-phone__bars i:nth-child(1) { height: 45%; }
.t-phone__bars i:nth-child(2) { height: 72%; }
.t-phone__bars i:nth-child(3) { height: 100%; }
.t-phone__app { display: flex; flex-direction: column; margin-top: .5em; line-height: 1.2; }
.t-phone__app small { font-size: .9em; font-weight: 600; color: var(--t-muted); }
.t-phone__app b { font-size: 1.55em; color: var(--t-navy); letter-spacing: -.02em; }
.t-phone__foot { display: block; margin-top: 1.1em; text-align: center; font-size: .8em; font-weight: 600; color: #9AA2B2; }

/* Bildirim: üstten düşer, fotoğrafı dosyaya "uçar" */
.t-notif {
  position: absolute; z-index: 3; left: .55em; right: .55em; top: 2.9em;
  display: flex; flex-direction: column;
  padding: .8em .85em .85em;
  background: rgba(255, 255, 255, .97);
  border: 1px solid #E7EBEF; border-radius: 1.4em;
  box-shadow: 0 1.2em 2.4em -.6em rgba(31, 43, 71, .30);
  transform: translateY(-160%);
  transition: transform .55s cubic-bezier(.2, 1.2, .35, 1);
}
.t-notif.is-in { transform: none; }
.t-notif__app {
  display: flex; align-items: center; gap: .45em;
  font-size: .74em; font-weight: 700; color: #6B7385; text-transform: uppercase; letter-spacing: .04em;
}
.t-notif__app img { width: auto; height: 1.5em; }
.t-notif__app small { margin-left: auto; font-size: 1em; font-weight: 600; text-transform: none; letter-spacing: 0; }
.t-notif__title { margin-top: .45em; font-size: .98em; color: var(--t-navy); }
.t-notif__text { font-size: .88em; font-weight: 600; color: var(--t-muted); }
.t-notif__thumb { width: 100%; height: 5.6em; margin-top: .55em; object-fit: cover; border-radius: .7em; background: #EEF2F5; }

.t-fly {
  position: absolute; z-index: 5; margin: 0;
  object-fit: cover; border-radius: .8em;
  box-shadow: 0 1.4em 2.6em -.6em rgba(31, 43, 71, .45);
  pointer-events: none;
}

/* Telefondaki çizim: temel → kat kat betonarme → cephe */
.t-build {
  display: block; width: 100%; height: 15em; margin-top: .7em;
  border-radius: 1.2em;
  background: linear-gradient(180deg, #EAF4FB 0%, #F7FAFC 100%);
}
.b-far rect { fill: #DCE8F1; }
.b-crane path { fill: none; stroke: #E8A33D; stroke-width: .8; stroke-linejoin: round; }
.b-crane__cab { fill: #E8A33D; }
.b-crane__weight { fill: #5C6478; }
.b-ground { fill: #EADFCB; }
.b-pit { fill: #D8C4A0; transition: opacity .4s; }
.b-rebar { transition: opacity .5s .3s; }
.b-rebar path, .b-stubs { fill: none; stroke: #B5652E; stroke-width: .7; }
.b-slab { fill: #8E9BB0; }
.b-floor rect { fill: #C5CED9; }
.b-floor .b-slab { fill: #8E9BB0; }
.b-panel { fill: #F7F8FA; stroke: #DCE3EA; stroke-width: .4; }
.b-win { fill: #41587A; }
.b-win--lit { fill: #FFD9A6; }
.b-roof { fill: #8E9BB0; }
.b-scaf { fill: none; stroke: #4F86A6; stroke-width: .55; opacity: .85; transition: opacity .4s; }
.b-trolley rect, .b-trolley path { fill: #5C6478; }
.b-trolley .b-cable { fill: none; stroke: #5C6478; stroke-width: .4; }
.b-trolley .b-load { fill: #8E9BB0; }
.b-trolley { animation: t-trolley 9s ease-in-out infinite alternate; }

.t-build .b-el {
  transform-box: fill-box; transform-origin: 50% 100%;
  transition: transform .55s cubic-bezier(.2, .9, .25, 1.1), opacity .35s;
  transition-delay: calc(var(--i, 0) * 70ms);
}
.t-build .b-floor { transition-delay: calc(var(--i) * 260ms); }
.t-build .b-face, .t-build .b-roof { transform-origin: 0 50%; transition-delay: calc(.35s + var(--i) * 220ms); }
.b-stubs { transition: opacity .3s .9s; }

.t-scene--site:not(.ph1) .b-p1 .b-el { transform: scaleY(0); opacity: 0; }
.t-scene--site:not(.ph1) .b-pit { opacity: 0; }
.t-scene--site.ph2 .b-rebar { opacity: 0; }
.t-scene--site:not(.ph2) .b-p2 .b-el { transform: scaleY(0); opacity: 0; }
.t-scene--site:not(.ph2) .b-stubs,
.t-scene--site.ph3 .b-stubs { opacity: 0; transition-delay: 0s; }
.t-scene--site:not(.ph3) .b-p3 .b-el { transform: scaleX(0); opacity: 0; }
.t-scene--site:not(.ph3) .b-scaf { opacity: 0; }
.t-scene--site.ph3 .b-win--lit { animation: t-twinkle 3.4s ease-in-out 1.6s infinite; }
.t-scene--site.ph3 .b-face:nth-child(2) .b-win--lit { animation-delay: 2.7s; }
.t-scene--site.ph3 .b-face:nth-child(3) .b-win--lit { animation-delay: 3.5s; }

.t-stepper { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .5em; margin-top: 1em; }
.t-stepper li {
  display: flex; flex-direction: column; gap: .4em;
  font-size: .8em; font-weight: 700; color: #8A93A6;
  transition: color .3s;
}
.t-stepper i { position: relative; display: block; height: .45em; overflow: hidden; border-radius: 1em; background: #E3E8EE; }
.t-stepper i::after {
  content: ""; position: absolute; inset: 0; background: #F47735;
  transform: scaleX(0); transform-origin: left;
  transition: transform 1.2s cubic-bezier(.65, 0, .35, 1);
}
.ph1 .t-stepper li:nth-child(1), .ph2 .t-stepper li:nth-child(2), .ph3 .t-stepper li:nth-child(3) { color: var(--t-navy); }
.ph1 .t-stepper li:nth-child(1) i::after,
.ph2 .t-stepper li:nth-child(2) i::after,
.ph3 .t-stepper li:nth-child(3) i::after { transform: none; }

/* Döngü sonunda kayıtlar ve çizim birlikte söner, sahne başa sarılır */
.t-scene--site.is-rewind .t-site__rows,
.t-scene--site.is-rewind .t-build .b-p1,
.t-scene--site.is-rewind .t-build .b-p2,
.t-scene--site.is-rewind .t-build .b-p3,
.t-scene--site.is-rewind .t-stepper i::after { opacity: 0; transition: opacity .5s; }

/* ================= Lila sahnesi ================= */
.t-scene--lila {
  background:
    radial-gradient(40% 60% at 17% 58%, #E6DEFC 0%, rgba(230, 222, 252, 0) 72%),
    linear-gradient(180deg, #F6F3FE 0%, #FBFAFF 100%);
}
.t-bot { position: absolute; left: 3.2em; top: 8.2em; width: 15em; }
.t-bot__halo {
  position: absolute; left: 50%; top: 42%;
  width: 21em; height: 21em; margin: -10.5em 0 0 -10.5em; border-radius: 50%;
  background: radial-gradient(circle, rgba(124, 92, 214, .20) 0%, rgba(124, 92, 214, 0) 65%);
  animation: t-halo 5s ease-in-out infinite;
}
.t-bot__fig { position: relative; display: block; animation: t-bot-float 3.6s ease-in-out infinite; }
.t-bot__body { display: block; width: 100%; height: auto; background: none; user-select: none; }
/* Kol kutusu ve omuz pivotu lila_mascot.css ile aynı ölçüler (lila.png'den) */
.t-bot__arm {
  position: absolute; left: 73.75%; top: 57.8%; width: 24.58%; height: auto;
  background: none; transform-origin: 11.7% 9.6%; user-select: none;
}
.t-bot.is-waving .t-bot__arm { animation: t-bot-wave 2.4s cubic-bezier(.45, 0, .35, 1); }
.t-bot__core {
  position: absolute; left: 50.8%; top: 69.4%;
  width: 14%; aspect-ratio: 1; border-radius: 50%;
  transform: translate(-50%, -50%);
  pointer-events: none;
}
.t-bot__shadow {
  display: block; width: 58%; height: 1.2em; margin: .4em auto 0; border-radius: 50%;
  background: radial-gradient(ellipse at center, rgba(76, 29, 149, .22) 0%, rgba(76, 29, 149, 0) 70%);
  animation: t-bot-shadow 3.6s ease-in-out infinite;
}
.t-scene--lila.is-thinking .t-bot__fig { animation: t-bot-think 1.1s ease-in-out infinite; }
.t-scene--lila.is-speaking .t-bot__core { animation: t-core .8s ease-in-out infinite; }

.t-chat {
  position: absolute; left: 21em; top: 3em; width: 36em; height: 31.5em;
  display: flex; flex-direction: column;
  background: #fff; border: 1px solid #ECE8F8; border-radius: 1.8em;
  box-shadow: 0 .1em .3em rgba(49, 46, 129, .05), 0 1.4em 3.2em rgba(49, 46, 129, .12);
  overflow: hidden;
}
.t-chat__head { display: flex; align-items: center; gap: .8em; padding: 1em 1.3em; border-bottom: 1px solid #F0EDF8; }
.t-chat__head img { width: 2.8em; height: 2.8em; border-radius: 50%; background: #F3EFFD; }
.t-chat__head span { display: flex; flex-direction: column; line-height: 1.25; }
.t-chat__head b { font-size: 1.2em; color: var(--t-navy); }
.t-chat__head small {
  display: inline-flex; align-items: center; gap: .4em;
  font-size: .92em; font-weight: 600; color: #2E8F5B;
  transition: color .2s;
}
.t-chat__head small::before { content: ""; width: .55em; height: .55em; border-radius: 50%; background: currentColor; }
.t-scene--lila.is-thinking .t-chat__head small,
.t-scene--lila.is-speaking .t-chat__head small { color: #7C5CD6; }

.t-chat__log {
  flex: 1; min-height: 0;
  display: flex; flex-direction: column; justify-content: flex-end; gap: .8em;
  padding: 1em 1.3em .4em;
  overflow: hidden;
  -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 3.2em);
  mask-image: linear-gradient(180deg, transparent 0, #000 3.2em);
}
.t-msg {
  flex: none; max-width: 84%; margin: 0;
  padding: .72em 1em; border-radius: 1.2em;
  font-size: 1.3em; line-height: 1.42; font-weight: 600;
}
.t-msg--me {
  align-self: flex-end; transform-origin: 100% 100%;
  background: var(--t-navy); color: #fff; border-bottom-right-radius: .35em;
}
.t-msg--lila {
  align-self: flex-start; transform-origin: 0 100%;
  background: #F3EFFD; color: #2A2350; border-bottom-left-radius: .35em;
}
.t-msg .w { opacity: 0; filter: blur(.12em); transition: opacity .35s, filter .35s; }
.t-msg .w.is-on { opacity: 1; filter: none; }
.t-msg__src {
  display: flex; align-items: center; gap: .4em; width: fit-content;
  margin-top: .6em; padding: .3em .75em;
  font-size: .74em; font-weight: 700; color: #6445C0;
  background: #fff; border: 1px solid #E2DAFB; border-radius: 2em;
  transition: opacity .35s, transform .45s cubic-bezier(.3, 1.5, .5, 1);
}
.t-msg__src .t-ic { width: 1.15em; height: 1.15em; stroke-width: 2; }
.t-msg__src.is-pending { opacity: 0; transform: translateY(.4em) scale(.92); }
.t-msg--dots { display: inline-flex; gap: .32em; padding: 1em 1.1em; }
.t-msg--dots span { width: .5em; height: .5em; border-radius: 50%; background: #9B87E0; animation: t-dot 1.1s ease-in-out infinite; }
.t-msg--dots span:nth-child(2) { animation-delay: .15s; }
.t-msg--dots span:nth-child(3) { animation-delay: .3s; }

.t-chat__input {
  display: flex; align-items: center; gap: .8em;
  height: 3.8em; margin: .6em 1em 1em; padding: 0 .5em 0 1.2em;
  background: #FBFAFF; border: 1px solid #E6E1F5; border-radius: 2em;
}
.t-chat__field {
  display: flex; flex: 1; min-width: 0; overflow: hidden; white-space: nowrap;
  font-size: 1.08em; font-weight: 600; color: #9A94B5;
}
/* Yazılırken metnin sonu görünsün (gerçek giriş kutusu gibi) */
.t-chat__field.is-typing { justify-content: flex-end; color: var(--t-navy); }
.t-chat__field.is-typing::after {
  content: ""; flex: none; align-self: center;
  width: .09em; height: 1.15em; margin-left: .1em;
  background: var(--t-navy); animation: t-caret 1s steps(1) infinite;
}
.t-wave { display: flex; align-items: center; gap: .18em; height: 2em; }
.t-wave i {
  display: block; width: .22em; height: 100%; border-radius: 1em; background: #B9A8F0;
  transform: scaleY(calc(var(--h) * .3));
  transition: transform .3s;
}
.t-scene--lila.is-speaking .t-wave i {
  background: #8B6FE0;
  animation: t-wave .85s ease-in-out infinite;
  animation-delay: calc(var(--h) * -1.3s);
}
.t-chat__mic {
  position: relative; flex: none;
  display: grid; place-items: center;
  width: 2.8em; height: 2.8em; border-radius: 50%;
  background: var(--t-navy); color: #fff;
}
.t-chat__mic .t-ic { width: 1.3em; height: 1.3em; stroke-width: 2; }
.t-scene--lila.is-speaking .t-chat__mic::after {
  content: ""; position: absolute; inset: 0; border-radius: 50%;
  border: .15em solid #8B6FE0;
  animation: t-ping 1.2s cubic-bezier(0, 0, .2, 1) infinite;
}

/* ================= Dar kart (telefon, tablet iki sütun) ================= */
@container (max-width: 520px) {
  .t-scene { height: 32em; font-size: min(calc(100cqw / 36), 10.5px); }
  .t-scene__stage { width: 36em; }
  .t-site__sky { height: 7em; }

  .t-site__log { left: 1.4em; top: 2.6em; width: 20.2em; padding: 1.1em 1.1em 1.2em; border-radius: 1.3em; }
  .t-site__head b { font-size: 1.15em; }
  .t-site__count { font-size: .88em; padding: .25em .65em; }
  .t-site__rows { gap: .6em; margin-top: .9em; }
  .t-site__rows::before, .t-site__rows::after { left: .41em; top: 2.8em; height: 12.4em; }
  .t-site__row { grid-template-columns: 1em 7em minmax(0, 1fr); column-gap: .8em; height: 5.6em; }
  .t-site__row::after { left: 1.8em; top: .5em; width: 7em; height: 4.6em; }
  .t-site__dot { width: 1em; height: 1em; }
  .t-site__thumb { width: 7em; height: 4.6em; border-radius: .6em; }
  .t-site__date { font-size: .9em; }
  .t-site__meta { gap: .35em; }
  .t-site__meta b { font-size: 1.1em; }
  .t-phone { right: 1.2em; top: 2.4em; font-size: .74em; }

  .t-bot { left: .6em; top: 11.4em; width: 9.6em; }
  .t-bot__halo { width: 15em; height: 15em; margin: -7.5em 0 0 -7.5em; }
  .t-chat { left: 10.6em; top: 1.6em; width: 24.2em; height: 28.8em; border-radius: 1.4em; }
  .t-chat__head { padding: .8em 1em; }
  .t-chat__head img { width: 2.4em; height: 2.4em; }
  .t-chat__log { padding: .8em 1em .3em; gap: .65em; }
  .t-msg { max-width: 90%; font-size: 1.08em; }
  .t-chat__input { height: 3.4em; margin: .5em .7em .7em; padding: 0 .4em 0 1em; gap: .6em; }
  .t-chat__field { font-size: 1em; }
  .t-chat__mic { width: 2.5em; height: 2.5em; }
  .t-wave i:nth-child(n+11) { display: none; }
}

/* ================= Hero: canlı bina dosyası ================= */
/* Sahne kabın iki boyutuna da sığar: 1em = min(genişlik/60, yükseklik/52).
   Dar kapta (≤560px) 38×38em düzen. Konum tanitim.css'te (.t-hero__media .t-hs).
   HTML ilk kareyi taşır (boş dosya); JS tapu → malikler → oylama → teklif
   akışını oynatır. Hareket azaltmada JS doğrudan son kareyi kurar. */
.t-hs {
  container-type: size;
  overflow: hidden;
  background:
    radial-gradient(55% 50% at 58% 38%, rgba(255, 255, 255, .9) 0%, rgba(255, 255, 255, 0) 70%),
    linear-gradient(180deg, #E1F0FA 0%, #ECF5FB 55%, #F6F9F9 100%);
  --mx: 0; --my: 0;
}
.t-hs__stage {
  position: absolute; left: 50%; top: 50%;
  width: 60em; height: 52em;
  transform: translate(-50%, -50%);
  font-size: 10px;
  font-size: min(calc(100cqw / 60), calc(100cqh / 52), 12px);
  line-height: 1.3;
}
.t-hs img { max-width: none; }
.t-hs b { font-weight: 800; }

/* Fare paralaksı: katmanlar derinliklerine göre kayar (yalnız ince imleçte) */
.t-hs__pos {
  position: absolute;
  --d: 1;
  translate: calc(var(--mx) * var(--d) * 1em) calc(var(--my) * var(--d) * 1em);
  transition: translate .7s cubic-bezier(.2, .8, .2, 1);
}
.t-hs__pos--map { left: 1em; top: 20.5em; width: 25em; height: 23em; --d: -.5; }
.t-hs__pos--phone { left: 23.5em; top: 3.5em; width: 21em; height: 45em; --d: .6; }
.t-hs__pos--tapu { left: 4em; top: 9em; --d: 1.3; }
.t-hs__pos--vote { left: 38.5em; top: 16em; width: 18.5em; --d: 1.1; }
.t-hs__pos--offer { left: 36.5em; top: 35.5em; --d: 1.5; }

.t-hs__map {
  position: relative; width: 100%; height: 100%;
  overflow: hidden; border: .45em solid #fff; border-radius: 1.6em;
  transform: rotate(-6deg);
  box-shadow: 0 1.6em 3.2em -1em rgba(31, 43, 71, .35);
}
.t-hs__map img, .t-hs__map svg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.t-hs__parcel { fill: #F47735; fill-opacity: 0; animation: t-hs-parcel 3.2s ease-in-out infinite; }

.t-hs__phone {
  width: 100%; height: 100%; padding: .55em;
  background: #1B2130; border-radius: 3em;
  box-shadow: inset 0 0 0 .12em #3A4254, 0 2.4em 4.4em -1.2em rgba(31, 43, 71, .45), 0 .6em 1.2em rgba(31, 43, 71, .12);
  animation: t-hs-float 7s ease-in-out infinite;
}
.t-hs__screen {
  position: relative; height: 100%; overflow: hidden;
  padding: 0 1.2em;
  background: #fff; border-radius: 2.5em;
}
.t-hs__bar { display: flex; align-items: center; gap: .6em; margin-top: .4em; }
.t-hs__bar img { width: auto; height: 1.8em; }
.t-hs__bar b { font-size: 1.5em; color: var(--t-navy); letter-spacing: -.02em; }
.t-hs__menu { display: grid; gap: .22em; margin-left: auto; }
.t-hs__menu i { display: block; width: 1.1em; height: .14em; border-radius: 1em; background: #9AA2B2; }
.t-hs__aerial { position: relative; height: 12em; margin-top: .9em; overflow: hidden; border-radius: 1.1em; }
.t-hs__aerial img { width: 100%; height: 100%; object-fit: cover; object-position: 60% 54%; }
.t-hs__pin {
  position: absolute; left: 52%; top: 50%;
  width: 1.1em; height: 1.1em; margin: -.55em 0 0 -.55em; border-radius: 50%;
  background: #F47735; box-shadow: 0 0 0 .25em #fff;
}
.t-hs__pin::after {
  content: ""; position: absolute; inset: 0; border-radius: 50%;
  border: .16em solid #fff;
  animation: t-ping 2.2s cubic-bezier(0, 0, .2, 1) infinite;
}
.t-hs__row { display: flex; align-items: baseline; justify-content: space-between; margin-top: 1.2em; }
.t-hs__row span { font-size: .95em; font-weight: 700; color: var(--t-muted); }
.t-hs__row b { font-size: 1em; color: var(--t-navy); font-variant-numeric: tabular-nums; }
.t-hs__avatars { display: flex; justify-content: space-between; margin-top: .6em; }
.t-hs__avatars i {
  width: 1.2em; height: 1.2em; border-radius: 50%;
  background: #fff; box-shadow: inset 0 0 0 .12em #D3DBE4;
  transition: background-color .25s, box-shadow .25s, transform .45s cubic-bezier(.3, 1.8, .5, 1);
}
.t-hs__avatars i.is-on { transform: scale(1.12); box-shadow: 0 0 0 .14em #fff; }
.t-hs__avatars i.is-on:nth-child(4n+1) { background: #1F2B47; }
.t-hs__avatars i.is-on:nth-child(4n+2) { background: #6F9DB5; }
.t-hs__avatars i.is-on:nth-child(4n+3) { background: #F47735; }
.t-hs__avatars i.is-on:nth-child(4n) { background: #A9C9DA; }
.t-hs__progress { position: relative; display: block; height: .45em; margin-top: .8em; overflow: hidden; border-radius: 1em; background: #E3E8EE; }
.t-hs__progress i {
  position: absolute; inset: 0; background: #6F9DB5;
  transform: scaleX(var(--p, 0)); transform-origin: left;
  transition: transform .35s ease-out;
}
.t-hs__next {
  display: flex; align-items: center; gap: .65em;
  margin-top: 1.2em; padding: .8em .75em .8em .8em;
  background: var(--t-ice); border: 1px solid var(--t-border); border-radius: 1.1em;
}
.t-hs__next-ic { display: grid; place-items: center; width: 2.2em; height: 2.2em; flex: none; border-radius: 50%; background: #fff; color: var(--t-link); }
.t-hs__next-ic .t-ic { width: 1.3em; height: 1.3em; }
.t-hs__next-tx { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.t-hs__next-tx small { font-size: .8em; font-weight: 700; color: var(--t-muted); }
.t-hs__next-tx b {
  font-size: 1em; line-height: 1.2; color: var(--t-navy);
  transition: opacity .2s, transform .25s;
}
.t-hs__next-tx b.is-out { opacity: 0; transform: translateY(.4em); }
.t-hs__chev { width: 1.2em; height: 1.2em; color: var(--t-link); stroke-width: 2.2; }
.t-hs__tiles { display: grid; grid-template-columns: 1fr 1fr; gap: .8em; margin-top: 1em; }
.t-hs__tiles span {
  display: flex; flex-direction: column; align-items: center; gap: .35em;
  padding: .8em 0 .7em; border: 1px solid #E7EBEF; border-radius: 1em;
  font-size: .85em; font-weight: 700; color: var(--t-muted);
}
.t-hs__tiles .t-ic { width: 1.8em; height: 1.8em; color: var(--t-navy); stroke-width: 1.6; }
.t-hs__foot { display: block; margin-top: 1em; text-align: center; font-size: .78em; font-weight: 600; color: #9AA2B2; }

/* Yüzen kartlar */
.t-hs__card {
  display: flex; align-items: center; gap: .8em;
  padding: .85em 1.1em;
  font-size: 1.2em;
  background: rgba(255, 255, 255, .97);
  border: 1px solid #E7EBEF; border-radius: 1.2em;
  box-shadow: 0 .1em .3em rgba(31, 43, 71, .05), 0 1.2em 2.6em -.6em rgba(31, 43, 71, .25);
  opacity: 0; transform: translateY(1em) scale(.92);
  transition: opacity .35s, transform .6s cubic-bezier(.2, 1.3, .35, 1);
  animation: t-hs-bob 6s ease-in-out infinite;
}
.t-hs__pos--vote .t-hs__card { animation-delay: -2s; }
.t-hs__pos--offer .t-hs__card { animation-delay: -4s; }
.t-hs.is-tapu .t-hs__card--tapu,
.t-hs.is-vote .t-hs__card--vote,
.t-hs.is-offer .t-hs__card--offer { opacity: 1; transform: none; }
.t-hs__ic { display: grid; place-items: center; width: 2.3em; height: 2.3em; flex: none; border-radius: .7em; background: var(--t-ice); color: var(--t-link); }
.t-hs__ic .t-ic { width: 1.3em; height: 1.3em; }
.t-hs__tx { display: flex; flex-direction: column; line-height: 1.25; }
.t-hs__tx b { color: var(--t-navy); white-space: nowrap; }
.t-hs__tx small { font-size: .75em; font-weight: 600; color: var(--t-muted); white-space: nowrap; }
.t-hs__ok { display: grid; place-items: center; width: 1.6em; height: 1.6em; flex: none; border-radius: 50%; background: #2E8F5B; }
.t-hs__ok svg { width: 1.1em; height: 1.1em; fill: none; stroke: #fff; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.t-hs__ok path { stroke-dasharray: 20; stroke-dashoffset: 20; transition: stroke-dashoffset .45s ease-out .35s; }
.t-hs.is-tapu .t-hs__ok path { stroke-dashoffset: 0; }

.t-hs__card--vote { flex-direction: column; align-items: stretch; gap: .35em; }
.t-hs__card--vote small { font-size: .72em; font-weight: 700; color: var(--t-muted); }
.t-hs__card--vote b { color: var(--t-navy); font-variant-numeric: tabular-nums; }
.t-hs__split { display: flex; gap: .2em; height: .5em; margin-top: .2em; }
.t-hs__split i { display: block; border-radius: 1em; transform: scaleX(0); transform-origin: left; transition: transform 1s cubic-bezier(.65, 0, .35, 1) .2s; }
.t-hs__split i:first-child { flex: 8; background: #F47735; }
.t-hs__split i:last-child { flex: 1; background: var(--t-navy); transition-delay: 1.1s; }
.t-hs.is-vote .t-hs__split i { transform: none; }

.t-hs__firms { display: flex; flex: none; }
.t-hs__firms i {
  display: grid; place-items: center;
  width: 2em; height: 2em; border-radius: 50%;
  font-size: .8em; font-style: normal; font-weight: 800; color: #fff;
  box-shadow: 0 0 0 .18em #fff;
  opacity: 0; transform: scale(.4);
  transition: opacity .25s, transform .45s cubic-bezier(.3, 1.8, .5, 1);
}
.t-hs__firms i + i { margin-left: -.5em; }
.t-hs__firms i:nth-child(1) { background: #1F2B47; }
.t-hs__firms i:nth-child(2) { background: #4F86A6; }
.t-hs__firms i:nth-child(3) { background: #F47735; }
.t-hs__firms i.is-on { opacity: 1; transform: none; }

/* Döngü sonu: kartlar söner, dosya boşalır */
.t-hs.is-rewind .t-hs__card { opacity: 0; transform: translateY(.6em) scale(.96); transition-duration: .45s; }

@container (max-width: 560px) {
  .t-hs__stage { width: 38em; height: 38em; font-size: min(calc(100cqw / 38), calc(100cqh / 38), 12px); }
  /* Kartlar telefonun yalnız süs alanlarına biner: uydu kenarı, menü, alt kısım */
  .t-hs__pos--map { left: .4em; top: 13.6em; width: 14em; height: 13em; }
  .t-hs__pos--phone { left: 13.8em; top: 2.2em; font-size: .74em; }
  .t-hs__pos--tapu { left: .4em; top: 8.4em; font-size: .82em; }
  .t-hs__pos--vote { left: 25.2em; top: 6.8em; width: 15em; font-size: .82em; }
  .t-hs__pos--offer { left: .8em; top: 31.6em; font-size: .82em; }
  .t-hs__map { border-width: .35em; border-radius: 1.2em; }
}

/* ================= Hareketler ================= */
@keyframes t-bump { 50% { transform: scale(1.18); } }
@keyframes t-row-flash {
  0% { background: #EAF4FB; box-shadow: 0 0 0 .5em #EAF4FB; }
  100% { background: rgba(234, 244, 251, 0); box-shadow: 0 0 0 .5em rgba(234, 244, 251, 0); }
}
@keyframes t-ping { 0% { transform: scale(1); opacity: .7; } 80%, 100% { transform: scale(2.4); opacity: 0; } }
@keyframes t-trolley { 0% { transform: translateX(0); } 100% { transform: translateX(-24px); } }
@keyframes t-twinkle { 0%, 100% { fill: #FFD9A6; } 50% { fill: #FFF1DD; } }
@keyframes t-halo { 0%, 100% { transform: scale(1); opacity: .9; } 50% { transform: scale(1.08); opacity: 1; } }
@keyframes t-bot-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-.5em); } }
@keyframes t-bot-shadow { 0%, 100% { transform: scaleX(1); opacity: 1; } 50% { transform: scaleX(.82); opacity: .7; } }
@keyframes t-bot-think { 0%, 100% { transform: translateY(0) rotate(0); } 50% { transform: translateY(-.35em) rotate(-3deg); } }
/* Negatif açı = saat yönünün tersi → kol yukarı kalkar (lila_mascot.css) */
@keyframes t-bot-wave {
  0% { transform: rotate(0); }
  16% { transform: rotate(-104deg); }
  27% { transform: rotate(-82deg); }
  38% { transform: rotate(-108deg); }
  49% { transform: rotate(-82deg); }
  60% { transform: rotate(-104deg); }
  70% { transform: rotate(-92deg); }
  86%, 100% { transform: rotate(0); }
}
@keyframes t-core {
  0%, 100% { box-shadow: 0 0 .3em .1em rgba(139, 92, 246, .35); }
  50% { box-shadow: 0 0 1em .35em rgba(139, 92, 246, .6); }
}
@keyframes t-dot { 0%, 60%, 100% { transform: translateY(0); opacity: .5; } 30% { transform: translateY(-.35em); opacity: 1; } }
@keyframes t-caret { 50% { opacity: 0; } }
@keyframes t-hs-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-.6em); } }
@keyframes t-hs-bob { 0%, 100% { translate: 0 0; } 50% { translate: 0 -.35em; } }
@keyframes t-hs-parcel { 0%, 100% { fill-opacity: 0; } 50% { fill-opacity: .22; } }
@keyframes t-wave {
  0%, 100% { transform: scaleY(calc(var(--h) * .3)); }
  50% { transform: scaleY(var(--h)); }
}

/* Başa sarma anı: geçişsiz */
.is-instant *, .is-instant *::before, .is-instant *::after { transition: none !important; }
/* Ekran dışındaki sahnede sonsuz döngüler durur */
.is-offscreen.is-offscreen *,
.is-offscreen.is-offscreen *::before,
.is-offscreen.is-offscreen *::after { animation-play-state: paused; }

@media (prefers-reduced-motion: reduce) {
  .t-scene *, .t-scene *::before, .t-scene *::after,
  .t-hs *, .t-hs *::before, .t-hs *::after { animation: none !important; transition: none !important; }
}