.sayfa-perde{
  --sp-giris-sure:260ms;
  --sp-cikis-sure:180ms;
  --sp-yay:cubic-bezier(.34,1.56,.64,1);
  --sp-zemin:
    radial-gradient(circle at 50% 42%, color-mix(in srgb, var(--on-primary) 16%, transparent) 0%, transparent 52%),
    linear-gradient(165deg, var(--primary-dolgu) 0%, var(--primary-dolgu-600) 100%);
  --sp-yazi:var(--on-primary);
  --sp-kart:var(--logo-kart, #FFFFFF);
  --sp-kart-golge:0 18px 40px rgba(0,0,0,.20);
}
[data-bs-theme="dark"] .sayfa-perde{
  --sp-zemin:radial-gradient(circle at 50% 42%, color-mix(in srgb, var(--primary) 30%, var(--bg)) 0%, var(--bg) 64%);
  --sp-yazi:var(--text);
  --sp-kart-golge:0 18px 44px rgba(0,0,0,.55);
}
.sayfa-perde{
  position:fixed; inset:0; z-index:2200;
  display:grid; place-items:center;
  background:var(--sp-zemin); color:var(--sp-yazi);
  opacity:0; visibility:hidden; pointer-events:none;
  transition:opacity var(--sp-cikis-sure) ease, visibility 0s linear var(--sp-cikis-sure);
}
.sayfa-perde.acik,
html.perde-devam .sayfa-perde{
  opacity:1; visibility:visible; pointer-events:auto;
  transition:opacity var(--sp-giris-sure) ease;
}
html.perde-devam .sayfa-perde{
  transition:none;
  animation:spDevamSon var(--sp-cikis-sure) ease 5s forwards;
}
.sayfa-perde.sp-aninda{ transition:none !important; }
@keyframes spDevamSon{ to{ opacity:0; visibility:hidden; pointer-events:none; } }
.sp-orta{
  display:flex; flex-direction:column; align-items:center; text-align:center;
  padding:24px; max-width:100%;
  transform:scale(.94);
  transition:transform var(--sp-cikis-sure) ease;
}
.sayfa-perde.acik .sp-orta{ transform:scale(1); transition:transform var(--sp-giris-sure) var(--sp-yay); }
html.perde-devam .sp-orta{ transform:none; transition:none; }
.sp-logo{ position:relative; display:grid; place-items:center; }
.sp-logo img{ width:100%; height:100%; object-fit:contain; display:block; }
.sp-logo-gorsel.logo-beyaz-var{ width:min(58vw, 210px); height:104px; }
.sp-logo-gorsel:not(.logo-beyaz-var){
  width:min(62vw, 224px); height:124px; padding:18px 22px;
  background:var(--sp-kart); border-radius:26px; box-shadow:var(--sp-kart-golge);
}
.sp-logo-ikon{
  width:92px; height:92px; border-radius:28px; font-size:2.6rem;
  background:var(--sp-kart); color:var(--primary); box-shadow:var(--sp-kart-golge);
}
[data-bs-theme="dark"] .sp-logo-ikon{ background:linear-gradient(140deg, var(--primary), var(--primary-600)); color:var(--on-primary); }
.sp-logo-kap{ position:relative; display:grid; place-items:center; }
.sp-logo-kap::before{
  content:""; position:absolute; left:50%; top:50%; width:170px; height:170px; margin:-85px 0 0 -85px;
  border-radius:50%; z-index:-1; pointer-events:none; opacity:0;
  background:radial-gradient(circle, color-mix(in srgb, var(--sp-yazi) 22%, transparent) 0%, transparent 70%);
}
.sp-orta{ isolation:isolate; }
.sp-ad{
  margin-top:18px; font-size:1.35rem; font-weight:700; line-height:1.2; color:var(--sp-yazi);
  max-width:80vw; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.sp-cubuk{
  width:128px; height:4px; margin-top:24px; border-radius:999px; overflow:hidden;
  background:color-mix(in srgb, var(--sp-yazi) 22%, transparent);
}
.sp-cubuk span{
  display:block; width:40%; height:100%; border-radius:inherit; background:var(--sp-yazi);
  transform:translate3d(-100%,0,0);
}
.sayfa-perde.acik .sp-logo,
html.perde-devam .sp-logo{ animation:spNefes 1.6s ease-in-out infinite alternate; }
.sayfa-perde.acik .sp-logo-kap::before,
html.perde-devam .sp-logo-kap::before{ animation:spHale 1.8s ease-out infinite; }
.sayfa-perde.acik .sp-cubuk span,
html.perde-devam .sp-cubuk span{ animation:spCubuk 1.1s ease-in-out infinite; }
@keyframes spNefes{ from{ transform:scale(1); } to{ transform:scale(1.04); } }
@keyframes spHale{
  0%  { transform:scale(.7);  opacity:.9; }
  100%{ transform:scale(1.3); opacity:0; }
}
@keyframes spCubuk{
  0%  { transform:translate3d(-100%,0,0); }
  100%{ transform:translate3d(250%,0,0); }
}
@media (prefers-reduced-motion: reduce){
  .sayfa-perde .sp-logo, .sayfa-perde .sp-logo-kap::before, .sayfa-perde .sp-cubuk span{ animation:none !important; }
  .sp-orta, .sayfa-perde.acik .sp-orta{ transform:none; transition:none; }
  .sp-cubuk{ display:none; }
}