/* ==============================================================
   HERO SAHNELERİ — hero-sahneler.js'in enjekte ettiği
   diş hekimliği temalı animasyon sahneleri
   ============================================================== */

/* ---- Giriş ---- */
.hs-giris {
  opacity: 0;
  transform: scale(.9) translateY(26px);
  transition: opacity .9s ease, transform .9s cubic-bezier(.22, 1, .36, 1);
}
.hs-giris-aktif { opacity: 1; transform: none; }

/* ---- İç sayfa banner kabı — sahneler sağda, küçültülmüş ---- */
.banner-sahne .hs-banner-kap {
  position: absolute; top: 50%; right: 36%;
  width: 460px; height: 430px;
  display: grid; place-items: center;
  transform: translate(50%, -50%) scale(.58);
  transform-origin: center;
}
.banner-sahne .hs-banner-kap.hs-giris {
  transform: translate(50%, calc(-50% + 26px)) scale(.5);
}
.banner-sahne .hs-banner-kap.hs-giris-aktif {
  transform: translate(50%, -50%) scale(.58);
}
/* Banner'da parıltı ve halkalar taşmasın diye hafif kısılır */
.banner-sahne .hs-parilti { width: 300px; height: 300px; }
.banner-sahne .hs-kalkan-h2 { width: 330px; height: 330px; }

/* ---- Ortak parçalar ---- */
.hs-parilti {
  position: absolute; width: 380px; height: 380px; border-radius: 50%;
  filter: blur(6px); animation: hs-nefes 5s ease-in-out infinite;
}
.hs-parilti-cam     { background: radial-gradient(circle, rgba(34,211,238,.30), rgba(109,93,246,.12) 55%, transparent 70%); }
.hs-parilti-menekse { background: radial-gradient(circle, rgba(109,93,246,.35), rgba(34,211,238,.12) 55%, transparent 70%); }
.hs-parilti-pembe   { background: radial-gradient(circle, rgba(244,114,182,.28), rgba(139,124,248,.12) 55%, transparent 70%); }
.hs-parilti-yesil   { background: radial-gradient(circle, rgba(52,211,153,.28), rgba(34,211,238,.12) 55%, transparent 70%); }
@keyframes hs-nefes {
  0%, 100% { transform: scale(1); opacity: .8; }
  50%      { transform: scale(1.12); opacity: 1; }
}

.hs-pir {
  position: absolute; color: #fff; font-size: 1.1rem; z-index: 4;
  text-shadow: 0 0 12px rgba(34,211,238,.9);
  animation: hs-pirilti 2.6s ease-in-out infinite;
}
.hs-pr0 { top: 16%; left: 18%; animation-delay: 0s; }
.hs-pr1 { top: 10%; right: 20%; animation-delay: .7s; font-size: .85rem; }
.hs-pr2 { bottom: 20%; right: 14%; animation-delay: 1.3s; }
.hs-pr3 { bottom: 26%; left: 12%; animation-delay: 1.9s; font-size: .8rem; }
@keyframes hs-pirilti {
  0%, 100% { opacity: 0; transform: scale(.4) rotate(0deg); }
  50%      { opacity: 1; transform: scale(1.15) rotate(90deg); }
}

.hs-dis {
  width: min(210px, 48%); position: relative; z-index: 2;
  filter: drop-shadow(0 30px 50px rgba(10,14,40,.6)) drop-shadow(0 0 40px rgba(109,93,246,.35));
}

/* ==============================================================
   1) FIRÇALAMA — ağız sağlığı
   ============================================================== */
.hs-firca-dis { animation: hs-dis-titre 2.4s ease-in-out infinite; }
@keyframes hs-dis-titre {
  0%, 100% { transform: translateY(0) rotate(-1.5deg); }
  25%      { transform: translateY(-4px) rotate(1deg); }
  50%      { transform: translateY(-1px) rotate(-1deg); }
  75%      { transform: translateY(-5px) rotate(1.5deg); }
}

.hs-firca {
  position: absolute; width: min(300px, 68%); z-index: 3;
  top: calc(50% - 150px); left: 50%;
  filter: drop-shadow(0 14px 28px rgba(7,10,30,.55));
  animation: hs-fircala 2.4s ease-in-out infinite;
  transform-origin: 85% 50%;
}
@keyframes hs-fircala {
  0%   { transform: translateX(-78%) rotate(-10deg); }
  25%  { transform: translateX(-40%) rotate(-6deg) translateY(10px); }
  50%  { transform: translateX(-16%) rotate(-9deg); }
  75%  { transform: translateX(-52%) rotate(-5deg) translateY(8px); }
  100% { transform: translateX(-78%) rotate(-10deg); }
}

.hs-kopuk {
  position: absolute; border-radius: 50%; z-index: 2;
  background: radial-gradient(circle at 32% 30%, rgba(255,255,255,.95), rgba(180,235,255,.35) 60%, transparent 75%);
  border: 1px solid rgba(255,255,255,.35);
  bottom: 44%; opacity: 0;
  animation: hs-kopuk-yuksel 3.4s ease-in infinite;
}
.hs-k0 { width: 14px; height: 14px; left: 34%; animation-delay: 0s; }
.hs-k1 { width: 10px; height: 10px; left: 46%; animation-delay: .4s; }
.hs-k2 { width: 18px; height: 18px; left: 56%; animation-delay: .9s; }
.hs-k3 { width: 8px;  height: 8px;  left: 40%; animation-delay: 1.3s; }
.hs-k4 { width: 12px; height: 12px; left: 62%; animation-delay: 1.7s; }
.hs-k5 { width: 16px; height: 16px; left: 30%; animation-delay: 2.1s; }
.hs-k6 { width: 9px;  height: 9px;  left: 52%; animation-delay: 2.5s; }
.hs-k7 { width: 13px; height: 13px; left: 66%; animation-delay: 2.9s; }
.hs-k8 { width: 11px; height: 11px; left: 44%; animation-delay: 3.2s; }
@keyframes hs-kopuk-yuksel {
  0%   { opacity: 0; transform: translateY(0) scale(.5); }
  12%  { opacity: .95; }
  100% { opacity: 0; transform: translateY(-190px) translateX(14px) scale(1.25); }
}

/* ==============================================================
   2) İMPLANT — cerrahi / protez
   ============================================================== */
.hs-implant-svg {
  width: min(280px, 62%); position: relative; z-index: 2;
  filter: drop-shadow(0 24px 44px rgba(10,14,40,.6));
}
.hs-vida {
  animation: hs-vida-tork 3.6s ease-in-out infinite;
  transform-box: fill-box; transform-origin: center 20%;
}
@keyframes hs-vida-tork {
  0%, 100% { transform: translateY(0) rotate(0deg); }
  20%      { transform: translateY(3px) rotate(-2.5deg); }
  40%      { transform: translateY(6px) rotate(2.5deg); }
  60%      { transform: translateY(8px) rotate(-1.5deg); }
  80%      { transform: translateY(4px) rotate(1.5deg); }
}
.hs-kuron {
  animation: hs-kuron-in 3.6s ease-in-out infinite;
  transform-box: fill-box; transform-origin: center;
}
@keyframes hs-kuron-in {
  0%, 100% { transform: translateY(-14px); }
  50%      { transform: translateY(0); }
}
.hs-osseo {
  transform-box: fill-box; transform-origin: center;
  animation: hs-osseo-nabiz 2.4s ease-out infinite;
}
.hs-osseo2 { animation-delay: 1.2s; }
@keyframes hs-osseo-nabiz {
  0%   { transform: scale(.55); opacity: .9; }
  100% { transform: scale(1.5); opacity: 0; }
}
.hs-kivilcim {
  position: absolute; width: 5px; height: 5px; border-radius: 50%;
  background: #67e8f9; box-shadow: 0 0 10px #22d3ee; z-index: 3;
  top: 58%; left: 50%; opacity: 0;
  animation: hs-kivilcim-sac 2.2s ease-out infinite;
}
.hs-kv0 { animation-delay: 0s;   --hx: -70px; --hy: -34px; }
.hs-kv1 { animation-delay: .35s; --hx: 64px;  --hy: -46px; }
.hs-kv2 { animation-delay: .7s;  --hx: -52px; --hy: 20px; }
.hs-kv3 { animation-delay: 1.1s; --hx: 78px;  --hy: 8px; }
.hs-kv4 { animation-delay: 1.5s; --hx: -30px; --hy: -60px; }
.hs-kv5 { animation-delay: 1.85s;--hx: 40px;  --hy: -70px; }
@keyframes hs-kivilcim-sac {
  0%   { opacity: 0; transform: translate(0, 0) scale(.4); }
  15%  { opacity: 1; }
  100% { opacity: 0; transform: translate(var(--hx), var(--hy)) scale(1.1); }
}

/* ==============================================================
   3) ORTODONTİ — hizalanan dişler
   ============================================================== */
.hs-ort-svg {
  width: min(330px, 76%); position: relative; z-index: 2;
  filter: drop-shadow(0 22px 40px rgba(10,14,40,.55));
}
.hs-ort-dis {
  transform-box: fill-box; transform-origin: center 30%;
  animation: hs-hizala 6s ease-in-out infinite;
}
.hs-ort-0 { --kacik: -14deg; --dus: 10px; animation-delay: 0s; }
.hs-ort-1 { --kacik: 9deg;   --dus: -8px; animation-delay: .15s; }
.hs-ort-2 { --kacik: -6deg;  --dus: 12px; animation-delay: .3s; }
.hs-ort-3 { --kacik: 12deg;  --dus: -6px; animation-delay: .45s; }
.hs-ort-4 { --kacik: -10deg; --dus: 8px;  animation-delay: .6s; }
@keyframes hs-hizala {
  0%       { transform: rotate(var(--kacik)) translateY(var(--dus)); }
  32%, 78% { transform: rotate(0deg) translateY(0); }
  100%     { transform: rotate(var(--kacik)) translateY(var(--dus)); }
}
.hs-braket {
  fill: rgba(139,124,248,.9); stroke: rgba(255,255,255,.5); stroke-width: 1;
}
.hs-braket-isik {
  fill: #fff; opacity: 0;
  animation: hs-braket-parla 6s ease-in-out infinite;
}
.hs-ort-0 .hs-braket-isik { animation-delay: 1.9s; }
.hs-ort-1 .hs-braket-isik { animation-delay: 2.1s; }
.hs-ort-2 .hs-braket-isik { animation-delay: 2.3s; }
.hs-ort-3 .hs-braket-isik { animation-delay: 2.5s; }
.hs-ort-4 .hs-braket-isik { animation-delay: 2.7s; }
@keyframes hs-braket-parla {
  0%, 100% { opacity: 0; }
  4%       { opacity: 1; }
  10%      { opacity: 0; }
}
.hs-tel-isik {
  stroke-dasharray: 26 460;
  animation: hs-tel-ak 3.2s linear infinite;
  opacity: .8;
}
@keyframes hs-tel-ak {
  from { stroke-dashoffset: 486; }
  to   { stroke-dashoffset: 0; }
}

/* ==============================================================
   4) KALKAN — koruyucu diş hekimliği
   ============================================================== */
.hs-kalkan-dis {
  width: min(190px, 42%);
  animation: hs-kalkan-yuzen 5s ease-in-out infinite;
}
@keyframes hs-kalkan-yuzen {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(-12px); }
}
.hs-kalkan-halka {
  position: absolute; width: 310px; height: 310px; border-radius: 50%;
  border: 2px dashed rgba(52,211,153,.55); z-index: 1;
  animation: hs-halka-don 22s linear infinite;
  box-shadow: 0 0 34px rgba(52,211,153,.18), inset 0 0 34px rgba(52,211,153,.12);
}
.hs-kalkan-h2 {
  width: 360px; height: 360px;
  border-color: rgba(34,211,238,.35); border-style: dotted;
  animation: hs-halka-don 34s linear infinite reverse;
  box-shadow: none;
}
@keyframes hs-halka-don { to { transform: rotate(360deg); } }
.hs-kalkan-nabiz {
  position: absolute; width: 310px; height: 310px; border-radius: 50%;
  border: 2px solid rgba(52,211,153,.5); z-index: 1;
  animation: hs-kalkan-nabiz-a 3s ease-out infinite;
}
@keyframes hs-kalkan-nabiz-a {
  0%   { transform: scale(.9); opacity: .9; }
  100% { transform: scale(1.45); opacity: 0; }
}

.hs-mikrop {
  position: absolute; width: 30px; height: 30px; border-radius: 46% 54% 52% 48%;
  background: radial-gradient(circle at 35% 32%, #bef264, #65a30d);
  box-shadow: 0 0 14px rgba(163,230,53,.45);
  z-index: 3; display: grid; place-items: center;
}
.hs-mikrop::before, .hs-mikrop::after {
  content: ""; position: absolute; background: #84cc16; border-radius: 2px;
}
.hs-mikrop::before { width: 3px; height: 9px; top: -8px; left: 8px; transform: rotate(-24deg); }
.hs-mikrop::after  { width: 3px; height: 9px; bottom: -8px; right: 7px; transform: rotate(-24deg); }
.hs-mikrop-goz {
  width: 7px; height: 7px; border-radius: 50%; background: #1a2e05;
  box-shadow: -6px 1px 0 -2px #1a2e05;
}
.hs-m0 { top: 6%;  left: 6%;  animation: hs-saldiri-a 4.2s ease-in-out infinite; }
.hs-m1 { top: 10%; right: 4%; animation: hs-saldiri-b 5s ease-in-out infinite .8s; }
.hs-m2 { bottom: 8%; left: 10%; animation: hs-saldiri-c 4.6s ease-in-out infinite 1.6s; }
.hs-m3 { bottom: 12%; right: 8%; animation: hs-saldiri-d 5.4s ease-in-out infinite 2.4s; }
@keyframes hs-saldiri-a {
  0%, 100% { transform: translate(0,0) rotate(0deg); }
  45%      { transform: translate(96px, 84px) rotate(40deg) scale(1.08); }
  55%      { transform: translate(78px, 66px) rotate(-30deg) scale(.82); }
}
@keyframes hs-saldiri-b {
  0%, 100% { transform: translate(0,0) rotate(0deg); }
  45%      { transform: translate(-92px, 88px) rotate(-46deg) scale(1.08); }
  55%      { transform: translate(-70px, 68px) rotate(30deg) scale(.82); }
}
@keyframes hs-saldiri-c {
  0%, 100% { transform: translate(0,0) rotate(0deg); }
  45%      { transform: translate(88px, -92px) rotate(38deg) scale(1.08); }
  55%      { transform: translate(66px, -70px) rotate(-26deg) scale(.82); }
}
@keyframes hs-saldiri-d {
  0%, 100% { transform: translate(0,0) rotate(0deg); }
  45%      { transform: translate(-90px, -86px) rotate(-42deg) scale(1.08); }
  55%      { transform: translate(-68px, -64px) rotate(24deg) scale(.82); }
}
.hs-carpma {
  position: absolute; width: 26px; height: 26px; border-radius: 50%;
  background: radial-gradient(circle, rgba(255,255,255,.9), rgba(52,211,153,.4) 55%, transparent 70%);
  z-index: 2; opacity: 0;
}
.hs-c0 { top: 26%; left: 24%; animation: hs-carpma-a 4.2s ease-out infinite 1.85s; }
.hs-c1 { bottom: 30%; right: 26%; animation: hs-carpma-a 5.4s ease-out infinite 4.8s; }
@keyframes hs-carpma-a {
  0%, 100% { opacity: 0; transform: scale(.3); }
  4%       { opacity: 1; transform: scale(1.5); }
  12%      { opacity: 0; transform: scale(2.1); }
}

/* ==============================================================
   5) GÜLÜŞ — çene & estetik
   ============================================================== */
.hs-gulus-svg {
  width: min(330px, 74%); position: relative; z-index: 2;
  filter: drop-shadow(0 24px 44px rgba(10,14,40,.6));
  animation: hs-gulus-yuzen 6s ease-in-out infinite;
}
@keyframes hs-gulus-yuzen {
  0%, 100% { transform: translateY(0) rotate(-1deg); }
  50%      { transform: translateY(-14px) rotate(1deg); }
}
.hs-gd {
  transform-box: fill-box; transform-origin: center;
  animation: hs-dis-parla 4.8s ease-in-out infinite;
}
.hs-gd0 { animation-delay: 0s; }
.hs-gd1 { animation-delay: .22s; }
.hs-gd2 { animation-delay: .44s; }
.hs-gd3 { animation-delay: .66s; }
.hs-gd4 { animation-delay: .88s; }
.hs-gd5 { animation-delay: 1.1s; }
@keyframes hs-dis-parla {
  0%, 100% { filter: brightness(1); transform: scale(1); }
  8%       { filter: brightness(1.65) drop-shadow(0 0 8px rgba(255,255,255,.9)); transform: scale(1.06); }
  16%      { filter: brightness(1); transform: scale(1); }
}
.hs-dudak-ust, .hs-dudak-alt {
  stroke-dasharray: 420;
  animation: hs-dudak-ciz 7s ease-in-out infinite;
}
@keyframes hs-dudak-ciz {
  0%       { stroke-dashoffset: 420; opacity: .4; }
  22%, 82% { stroke-dashoffset: 0; opacity: 1; }
  100%     { stroke-dashoffset: -420; opacity: .4; }
}
.hs-isilti {
  position: absolute; width: 46px; height: 46px; z-index: 4;
  top: 32%; left: 26%;
  background:
    radial-gradient(circle, rgba(255,255,255,.95) 0 12%, transparent 24%),
    conic-gradient(from 0deg, transparent 0 8%, rgba(255,255,255,.9) 10%, transparent 14%,
      transparent 33%, rgba(255,255,255,.9) 35%, transparent 39%,
      transparent 58%, rgba(255,255,255,.9) 60%, transparent 64%,
      transparent 83%, rgba(255,255,255,.9) 85%, transparent 89%);
  border-radius: 50%; filter: blur(.4px);
  animation: hs-isilti-gez 4.8s ease-in-out infinite;
}
@keyframes hs-isilti-gez {
  0%, 18%  { opacity: 0; transform: translate(0,0) scale(.3) rotate(0deg); }
  22%      { opacity: 1; transform: translate(0,0) scale(1) rotate(40deg); }
  30%      { opacity: 0; transform: translate(30px,6px) scale(.3) rotate(80deg); }
  46%      { opacity: 1; transform: translate(96px,10px) scale(.9) rotate(140deg); }
  54%      { opacity: 0; transform: translate(130px,12px) scale(.3) rotate(180deg); }
  70%      { opacity: 1; transform: translate(180px,4px) scale(1) rotate(240deg); }
  78%, 100%{ opacity: 0; transform: translate(210px,0) scale(.3) rotate(280deg); }
}
.hs-kalp {
  position: absolute; color: #f472b6; z-index: 3; opacity: 0;
  text-shadow: 0 0 12px rgba(244,114,182,.7);
  animation: hs-kalp-uc 5s ease-in-out infinite;
}
.hs-kp0 { bottom: 24%; left: 22%; font-size: 1rem;  animation-delay: 0s; }
.hs-kp1 { bottom: 20%; right: 24%; font-size: 1.3rem; animation-delay: 1.7s; }
.hs-kp2 { bottom: 28%; left: 52%; font-size: .85rem; animation-delay: 3.4s; }
@keyframes hs-kalp-uc {
  0%   { opacity: 0; transform: translateY(0) scale(.5); }
  12%  { opacity: 1; }
  60%  { opacity: .9; }
  100% { opacity: 0; transform: translateY(-120px) translateX(16px) scale(1.15) rotate(12deg); }
}

/* ==============================================================
   6) BEYAZLATMA — estetik/beyazlatma
   ============================================================== */
.hs-parilti-altin { background: radial-gradient(circle, rgba(250,204,21,.26), rgba(255,255,255,.12) 55%, transparent 70%); }
.hs-beyaz-dis { animation: hs-beyazla 6s ease-in-out infinite; }
@keyframes hs-beyazla {
  0%, 12% { filter: sepia(.5) brightness(.85) drop-shadow(0 30px 50px rgba(10,14,40,.6)); }
  38%, 80% {
    filter: brightness(1.35)
      drop-shadow(0 30px 50px rgba(10,14,40,.6))
      drop-shadow(0 0 34px rgba(255,255,255,.75))
      drop-shadow(0 0 70px rgba(250,204,21,.35));
  }
  100% { filter: sepia(.5) brightness(.85) drop-shadow(0 30px 50px rgba(10,14,40,.6)); }
}
.hs-lamba {
  position: absolute; width: 150px; z-index: 3;
  top: 4%; left: 14%; transform: rotate(18deg);
  filter: drop-shadow(0 10px 24px rgba(7,10,30,.5));
}
.hs-huzme, .hs-lamba-cam { animation: hs-huzme-nabiz 6s ease-in-out infinite; }
@keyframes hs-huzme-nabiz {
  0%, 12%, 100% { opacity: .12; }
  20%, 72%      { opacity: .8; }
  80%           { opacity: .25; }
}
.hs-tarama {
  position: absolute; width: 26px; height: 220px; z-index: 3;
  top: calc(50% - 110px); left: 38%; opacity: 0;
  background: linear-gradient(105deg, transparent, rgba(255,255,255,.9), transparent);
  filter: blur(2px); transform: rotate(14deg);
  animation: hs-tarama-gec 6s ease-in-out infinite;
}
@keyframes hs-tarama-gec {
  0%, 20%   { opacity: 0; transform: rotate(14deg) translateX(-70px); }
  30%       { opacity: 1; }
  46%       { opacity: 0; transform: rotate(14deg) translateX(120px); }
  100%      { opacity: 0; transform: rotate(14deg) translateX(120px); }
}
.hs-ton {
  position: absolute; bottom: 10%; left: 50%; transform: translateX(-50%);
  display: flex; gap: 7px; z-index: 3;
  background: rgba(16,22,54,.65); border: 1px solid rgba(139,124,248,.3);
  padding: 8px 12px; border-radius: 12px; backdrop-filter: blur(8px);
}
.hs-ton-c { width: 17px; height: 26px; border-radius: 5px; animation: hs-ton-yan 6s ease-in-out infinite; }
.hs-t0 { background: #d9c58a; animation-delay: 0s; }
.hs-t1 { background: #e3d4a5; animation-delay: .25s; }
.hs-t2 { background: #ecdfc2; animation-delay: .5s; }
.hs-t3 { background: #f4ecdd; animation-delay: .75s; }
.hs-t4 { background: #ffffff; animation-delay: 1s; }
@keyframes hs-ton-yan {
  0%, 30%, 100% { box-shadow: none; transform: translateY(0); }
  40%, 75%      { box-shadow: 0 0 14px rgba(255,255,255,.8); transform: translateY(-4px); }
}
.hs-foton {
  position: absolute; width: 6px; height: 6px; border-radius: 50%;
  background: #fef9c3; box-shadow: 0 0 10px rgba(250,204,21,.8);
  bottom: 34%; opacity: 0; z-index: 2;
  animation: hs-foton-yuksel 3.6s ease-out infinite;
}
.hs-f0 { left: 36%; animation-delay: 0s; }
.hs-f1 { left: 44%; animation-delay: .5s; }
.hs-f2 { left: 52%; animation-delay: 1s; }
.hs-f3 { left: 60%; animation-delay: 1.5s; }
.hs-f4 { left: 40%; animation-delay: 2s; }
.hs-f5 { left: 56%; animation-delay: 2.5s; }
.hs-f6 { left: 48%; animation-delay: 3s; }
@keyframes hs-foton-yuksel {
  0%   { opacity: 0; transform: translateY(0) scale(.5); }
  15%  { opacity: 1; }
  100% { opacity: 0; transform: translateY(-160px) scale(1.2); }
}

/* ==============================================================
   7) RÖNTGEN — radyoloji
   ============================================================== */
.hs-film {
  position: relative; z-index: 2;
  width: min(300px, 68%); aspect-ratio: 10 / 11;
  display: grid; place-items: center;
  background:
    linear-gradient(rgba(34,211,238,.06) 1px, transparent 1px) 0 0 / 100% 22px,
    linear-gradient(90deg, rgba(34,211,238,.06) 1px, transparent 1px) 0 0 / 22px 100%,
    rgba(4,10,26,.82);
  border: 1px solid rgba(34,211,238,.35); border-radius: 18px;
  box-shadow: 0 24px 50px rgba(4,8,26,.6), inset 0 0 50px rgba(34,211,238,.07);
  overflow: hidden;
  animation: hs-film-titre 7s ease-in-out infinite;
}
@keyframes hs-film-titre {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(-10px); }
}
.hs-xray-dis {
  width: 62%;
  filter: drop-shadow(0 0 18px rgba(34,211,238,.5));
  animation: hs-xray-nabiz 3.4s ease-in-out infinite;
}
@keyframes hs-xray-nabiz {
  0%, 100% { opacity: .75; }
  50%      { opacity: 1; }
}
.hs-xray-mine { animation: hs-xray-mine-a 3.4s ease-in-out infinite; }
@keyframes hs-xray-mine-a {
  0%, 100% { opacity: .4; }
  50%      { opacity: 1; }
}
.hs-tarayici {
  position: absolute; left: 4%; right: 4%; height: 3px; top: 0;
  background: linear-gradient(90deg, transparent, #22d3ee, transparent);
  box-shadow: 0 0 18px rgba(34,211,238,.9), 0 0 44px rgba(34,211,238,.4);
  animation: hs-tarayici-in 4.4s ease-in-out infinite;
}
@keyframes hs-tarayici-in {
  0%   { top: 6%; opacity: 0; }
  8%   { opacity: 1; }
  46%  { top: 90%; opacity: 1; }
  54%  { opacity: 0; }
  60%  { top: 90%; opacity: 1; }
  96%  { top: 6%; opacity: 1; }
  100% { top: 6%; opacity: 0; }
}
.hs-kose { position: absolute; width: 20px; height: 20px; border: 2.5px solid rgba(103,232,249,.8); z-index: 3; }
.hs-ko0 { top: 10px; left: 10px; border-right: 0; border-bottom: 0; border-radius: 6px 0 0 0; }
.hs-ko1 { top: 10px; right: 10px; border-left: 0; border-bottom: 0; border-radius: 0 6px 0 0; }
.hs-ko2 { bottom: 10px; left: 10px; border-right: 0; border-top: 0; border-radius: 0 0 0 6px; }
.hs-ko3 { bottom: 10px; right: 10px; border-left: 0; border-top: 0; border-radius: 0 0 6px 0; }
.hs-blip {
  position: absolute; width: 9px; height: 9px; border-radius: 50%;
  background: #67e8f9; box-shadow: 0 0 12px rgba(103,232,249,.9);
  opacity: 0; animation: hs-blip-a 4.4s ease-in-out infinite;
}
.hs-b0 { top: 28%; left: 32%; animation-delay: .9s; }
.hs-b1 { top: 55%; right: 30%; animation-delay: 2s; }
.hs-b2 { bottom: 24%; left: 42%; animation-delay: 3.1s; }
@keyframes hs-blip-a {
  0%, 100% { opacity: 0; transform: scale(.4); }
  6%       { opacity: 1; transform: scale(1.4); }
  16%      { opacity: 0; transform: scale(.6); }
}

/* ==============================================================
   8) ÇOCUK — pedodonti
   ============================================================== */
.hs-cocuk-dis {
  width: min(200px, 46%);
  animation: hs-cocuk-zipla 2.8s ease-in-out infinite;
  transform-origin: 50% 90%;
}
@keyframes hs-cocuk-zipla {
  0%, 100% { transform: translateY(0) rotate(0deg); }
  18%      { transform: translateY(-22px) rotate(-4deg) scaleY(1.04); }
  36%      { transform: translateY(0) rotate(0deg) scaleY(.96); }
  46%      { transform: translateY(-10px) rotate(3deg); }
  60%      { transform: translateY(0) rotate(0deg); }
}
.hs-gokkusagi {
  position: absolute; width: min(320px, 76%); z-index: 1;
  top: 16%; opacity: .85;
  animation: hs-gok-nefes 6s ease-in-out infinite;
}
@keyframes hs-gok-nefes {
  0%, 100% { transform: scale(1); opacity: .7; }
  50%      { transform: scale(1.05); opacity: 1; }
}
.hs-balon {
  position: absolute; width: 34px; height: 42px; border-radius: 50% 50% 48% 52%;
  z-index: 3; bottom: 18%;
  animation: hs-balon-uc 7s ease-in-out infinite;
}
.hs-balon::after {
  content: ""; position: absolute; left: 50%; top: 100%;
  width: 1.5px; height: 34px; background: rgba(255,255,255,.4);
}
.hs-ba0 { left: 16%; background: radial-gradient(circle at 32% 28%, #fda4af, #e11d48); animation-delay: 0s; }
.hs-ba1 { right: 14%; background: radial-gradient(circle at 32% 28%, #a5f3fc, #0891b2); animation-delay: 2.3s; width: 28px; height: 35px; }
.hs-ba2 { left: 30%; background: radial-gradient(circle at 32% 28%, #fde68a, #d97706); animation-delay: 4.6s; width: 24px; height: 30px; }
@keyframes hs-balon-uc {
  0%   { opacity: 0; transform: translateY(30px) rotate(-4deg); }
  12%  { opacity: 1; }
  50%  { transform: translateY(-120px) rotate(5deg); }
  88%  { opacity: 1; }
  100% { opacity: 0; transform: translateY(-250px) rotate(-3deg); }
}
.hs-konfeti {
  position: absolute; width: 8px; height: 12px; border-radius: 2px;
  top: -4%; opacity: 0; z-index: 2;
  animation: hs-konfeti-dus 5s linear infinite;
}
.hs-kf0 { left: 18%; background: #f472b6; animation-delay: 0s; }
.hs-kf1 { left: 30%; background: #22d3ee; animation-delay: .7s; }
.hs-kf2 { left: 44%; background: #facc15; animation-delay: 1.3s; }
.hs-kf3 { left: 58%; background: #34d399; animation-delay: 1.9s; }
.hs-kf4 { left: 72%; background: #a78bfa; animation-delay: 2.5s; }
.hs-kf5 { left: 84%; background: #fb923c; animation-delay: 3.2s; }
.hs-kf6 { left: 24%; background: #67e8f9; animation-delay: 3.8s; }
.hs-kf7 { left: 66%; background: #fda4af; animation-delay: 4.4s; }
@keyframes hs-konfeti-dus {
  0%   { opacity: 0; transform: translateY(0) rotate(0deg); }
  10%  { opacity: 1; }
  100% { opacity: 0; transform: translateY(420px) rotate(540deg); }
}

/* ==============================================================
   9) DOLGU — restoratif tedavi
   ============================================================== */
.hs-dolgu-dis { animation: hs-kalkan-yuzen 5.5s ease-in-out infinite; }
.hs-curuk {
  transform-box: fill-box; transform-origin: center;
  animation: hs-curuk-a 7s ease-in-out infinite;
}
@keyframes hs-curuk-a {
  0%, 30%  { opacity: 1; transform: scale(1); }
  36%      { opacity: 1; transform: scale(1.15); }
  44%, 96% { opacity: 0; transform: scale(.3); }
  100%     { opacity: 1; transform: scale(1); }
}
.hs-yama {
  transform-box: fill-box; transform-origin: center;
  opacity: 0; animation: hs-yama-a 7s ease-in-out infinite;
}
@keyframes hs-yama-a {
  0%, 34%  { opacity: 0; transform: scale(.2); }
  44%, 90% { opacity: 1; transform: scale(1); }
  98%, 100%{ opacity: 0; transform: scale(.6); }
}
.hs-onarim {
  position: absolute; z-index: 4; font-size: 2rem; color: #fff;
  top: 30%; left: 57%; opacity: 0;
  text-shadow: 0 0 16px rgba(255,255,255,.95), 0 0 34px rgba(139,124,248,.7);
  animation: hs-onarim-a 7s ease-in-out infinite;
}
@keyframes hs-onarim-a {
  0%, 32%  { opacity: 0; transform: scale(.2) rotate(0deg); }
  38%      { opacity: 1; transform: scale(1.5) rotate(160deg); }
  48%      { opacity: 0; transform: scale(.4) rotate(300deg); }
  100%     { opacity: 0; }
}
.hs-onay {
  position: absolute; width: 56px; z-index: 4;
  bottom: 22%; right: 20%; opacity: 0;
  filter: drop-shadow(0 8px 18px rgba(52,211,153,.35));
  animation: hs-onay-a 7s ease-in-out infinite;
}
@keyframes hs-onay-a {
  0%, 46%  { opacity: 0; transform: scale(.3) translateY(10px); }
  54%, 88% { opacity: 1; transform: scale(1) translateY(0); }
  96%, 100%{ opacity: 0; transform: scale(.5); }
}
.hs-dolgu-m0 { top: 12%; left: 12%; animation: hs-kacis-a 7s ease-in-out infinite; }
.hs-dolgu-m1 { bottom: 14%; right: 10%; animation: hs-kacis-b 7s ease-in-out infinite; }
@keyframes hs-kacis-a {
  0%, 28%  { transform: translate(0,0); opacity: 1; }
  40%      { transform: translate(60px, 40px) rotate(30deg); opacity: 1; }
  46%      { transform: translate(-40px, -30px) rotate(-260deg) scale(.7); opacity: .9; }
  62%, 100%{ transform: translate(-160px, -120px) rotate(-420deg) scale(.3); opacity: 0; }
}
@keyframes hs-kacis-b {
  0%, 28%  { transform: translate(0,0); opacity: 1; }
  40%      { transform: translate(-56px, -36px) rotate(-30deg); opacity: 1; }
  46%      { transform: translate(40px, 30px) rotate(260deg) scale(.7); opacity: .9; }
  62%, 100%{ transform: translate(170px, 130px) rotate(420deg) scale(.3); opacity: 0; }
}
.hs-zap {
  position: absolute; width: 22px; height: 22px; border-radius: 50%;
  background: radial-gradient(circle, rgba(255,255,255,.95), rgba(139,124,248,.4) 55%, transparent 72%);
  opacity: 0; z-index: 3;
}
.hs-zp0 { top: 24%; left: 26%; animation: hs-carpma-a 7s ease-out infinite 2.9s; }
.hs-zp1 { bottom: 28%; right: 24%; animation: hs-carpma-a 7s ease-out infinite 3.1s; }

/* ==============================================================
   ORTAK SÜS KATMANI — tüm sahnelere eklenir
   ============================================================== */
.hs-pr4 { top: 40%; left: 6%; animation-delay: .4s; font-size: .75rem; }
.hs-pr5 { top: 6%; left: 46%; animation-delay: 1.1s; font-size: .9rem; }
.hs-pr6 { bottom: 8%; right: 34%; animation-delay: 2.2s; font-size: .7rem; }
.hs-kuyruk {
  position: absolute; width: 90px; height: 2px; z-index: 1; opacity: 0;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.85), transparent);
  filter: drop-shadow(0 0 6px rgba(103,232,249,.8));
  transform: rotate(-24deg);
  animation: hs-kuyruk-kay 9s ease-in infinite;
}
.hs-ky0 { top: 12%; right: -4%; animation-delay: 1.5s; }
.hs-ky1 { top: 34%; right: -10%; animation-delay: 6s; width: 60px; }
@keyframes hs-kuyruk-kay {
  0%, 88%  { opacity: 0; transform: rotate(-24deg) translateX(0); }
  90%      { opacity: 1; }
  100%     { opacity: 0; transform: rotate(-24deg) translateX(-420px) translateY(70px); }
}
.hs-zerre {
  position: absolute; width: 4px; height: 4px; border-radius: 50%;
  background: rgba(170,178,248,.8); box-shadow: 0 0 8px rgba(139,124,248,.6);
  z-index: 1; animation: hs-zerre-suzul 8s ease-in-out infinite;
}
.hs-z0 { top: 24%; left: 10%; animation-delay: 0s; }
.hs-z1 { top: 64%; left: 6%; animation-delay: 1.4s; }
.hs-z2 { top: 16%; right: 12%; animation-delay: 2.8s; }
.hs-z3 { top: 70%; right: 8%; animation-delay: 4.2s; }
.hs-z4 { bottom: 12%; left: 40%; animation-delay: 5.6s; }
.hs-z5 { top: 8%; left: 68%; animation-delay: 7s; }
@keyframes hs-zerre-suzul {
  0%, 100% { transform: translate(0, 0); opacity: .35; }
  25%      { transform: translate(14px, -22px); opacity: .9; }
  50%      { transform: translate(-8px, -38px); opacity: .55; }
  75%      { transform: translate(-18px, -14px); opacity: .85; }
}

/* ---- Mobil ---- */
@media (max-width: 900px) {
  .hs-parilti { width: 260px; height: 260px; }
  .banner-sahne .hs-banner-kap {
    right: 50%; transform: translate(50%, -50%) scale(.4); opacity: .5;
  }
  .banner-sahne .hs-banner-kap.hs-giris-aktif {
    transform: translate(50%, -50%) scale(.4);
  }
  .hs-kalkan-halka { width: 220px; height: 220px; }
  .hs-kalkan-h2 { width: 258px; height: 258px; }
  .hs-kalkan-nabiz { width: 220px; height: 220px; }
  .hs-firca { top: calc(50% - 118px); }
  @keyframes hs-kopuk-yuksel {
    0%   { opacity: 0; transform: translateY(0) scale(.5); }
    12%  { opacity: .95; }
    100% { opacity: 0; transform: translateY(-120px) translateX(10px) scale(1.2); }
  }
}

/* Not: Animasyonlar, işletim sistemi "hareketi azalt" ayarına
   bakılmaksızın her zaman çalışacak şekilde bilinçli olarak tasarlandı. */