/* ============================================================
   EdilBerat — intro.css (schermata d'ingresso animata)
   ============================================================ */
*{margin:0;padding:0;box-sizing:border-box}
html,body{height:100%}
body{background:#15110f;overflow:hidden;font-family:'Poppins',system-ui,sans-serif}

#intro{position:fixed;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;
  background:radial-gradient(circle at 50% 42%,#241c18 0%,#15110f 70%);transition:opacity .7s ease,visibility .7s}
#intro.hide{opacity:0;visibility:hidden}

.intro-logo{width:128px;height:auto;opacity:0;transform:scale(.78) translateY(12px);
  animation:introLogo 1.1s cubic-bezier(.22,.61,.36,1) .15s forwards;
  filter:drop-shadow(0 10px 30px rgba(0,0,0,.5))}
.intro-name{margin-top:18px;color:#fff;font-weight:700;font-size:1.9rem;letter-spacing:.5em;padding-left:.5em;
  opacity:0;transform:translateY(10px);animation:introName .9s cubic-bezier(.22,.61,.36,1) .6s forwards}
.intro-tag{margin-top:8px;color:#c9a24b;font-size:.72rem;letter-spacing:.42em;text-transform:uppercase;padding-left:.42em;
  opacity:0;animation:introFade .8s ease 1s forwards}
.intro-bar{margin-top:30px;width:180px;height:2px;background:rgba(255,255,255,.12);border-radius:2px;overflow:hidden}
.intro-bar i{display:block;height:100%;width:0;background:#8b0000;animation:introBar 1.7s ease .5s forwards}
.intro-skip{position:fixed;bottom:26px;right:28px;color:rgba(255,255,255,.45);font-size:.78rem;
  letter-spacing:.05em;cursor:pointer;background:none;border:none;font-family:inherit}
.intro-skip:hover{color:#fff}

@keyframes introLogo{to{opacity:1;transform:scale(1) translateY(0)}}
@keyframes introName{to{opacity:1;transform:translateY(0)}}
@keyframes introFade{to{opacity:1}}
@keyframes introBar{to{width:100%}}

@media (prefers-reduced-motion:reduce){
  .intro-logo,.intro-name,.intro-tag{animation:none;opacity:1;transform:none}
  .intro-bar i{animation:none;width:100%}
}