/* Açılış animasyonu: kağıt uçak uçar, sayfa kağıdın içine girer gibi açılır */
html.intro:not(.intro-on)::before{content:"";position:fixed;inset:0;z-index:9998;background:linear-gradient(135deg,#1d4ed8,#2563eb 55%,#38bdf8)}
html.intro body{overflow:hidden}
#intro{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;overflow:hidden;background:#fff;animation:in-bg 3.3s ease forwards}
#intro::before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,#1d4ed8,#2563eb 55%,#38bdf8);animation:in-blue 3.3s ease forwards}
#intro .paper{position:relative;z-index:1;width:min(300px,62vw);aspect-ratio:210/297;background:#fff;border-radius:10px;box-shadow:0 30px 80px rgba(8,25,70,.45);padding:7% 8%;transform-origin:50% 64%;animation:in-paper 3.3s cubic-bezier(.6,0,.2,1) forwards}
#intro .paper b{display:block;font:800 clamp(11px,3.4vw,15px)/1 "Segoe UI",system-ui,sans-serif;color:#2563eb;letter-spacing:.04em}
#intro .paper i{display:block;height:6px;border-radius:3px;background:#dbe7fb;margin-top:9px}
#intro .paper i:nth-of-type(2){width:70%}#intro .paper i:nth-of-type(4){width:55%}#intro .paper i:nth-of-type(6){width:80%}
#intro .paper .tot{position:absolute;left:8%;right:8%;bottom:7%;height:22px;border-radius:5px;background:#2563eb}
#intro svg{z-index:2;position:absolute;left:50%;top:50%;margin:-40px 0 0 -55px;width:clamp(90px,22vw,150px);height:auto;filter:drop-shadow(0 8px 14px rgba(8,25,70,.35));animation:in-plane 3.3s cubic-bezier(.45,.05,.3,1) forwards;opacity:0}
@keyframes in-paper{0%{opacity:0;transform:translateY(26px) scale(.92)}14%{opacity:1;transform:none}62%{transform:none}100%{transform:scale(9)}}
@keyframes in-plane{0%,12%{opacity:0;transform:translate(-48vw,34vh) rotate(8deg) scale(.7)}18%{opacity:1}
 50%{opacity:1;transform:translate(8vw,-6vh) rotate(-8deg) scale(1.1)}
 62%{opacity:1;transform:translate(34vw,-30vh) rotate(-14deg) scale(1)}70%,100%{opacity:0;transform:translate(60vw,-60vh) rotate(-14deg) scale(.6)}}
@keyframes in-blue{0%,60%{opacity:1}82%,100%{opacity:0}}
@keyframes in-bg{0%,84%{opacity:1}100%{opacity:0;visibility:hidden}}
#intro .skip{position:absolute;right:16px;bottom:16px;border:1px solid rgba(255,255,255,.5);color:#fff;background:rgba(255,255,255,.12);border-radius:99px;padding:6px 14px;font:600 13px "Segoe UI",system-ui,sans-serif;cursor:pointer}
@media (prefers-reduced-motion:reduce){html.intro::before,#intro{display:none!important}html.intro body{overflow:auto}}