:root {
  --bg-main: #005082;
  --accent: #4dd4ff;
  --text-soft: rgba(255,255,255,.88);
}

*{margin:0;padding:0;box-sizing:border-box;}

body{
  background:var(--bg-main);
  color:white;
  font-family:"Montserrat", Arial, sans-serif;
  font-weight:800;
  display:flex;
  justify-content:center;
  align-items:center;
  min-height:100vh;
  min-height:100svh;
  overflow-x:hidden;
  overflow-y:auto;
  text-align:center;
}

.bg-container{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;}
.bg-layer{position:absolute;inset:-1.5%;opacity:0;will-change:opacity,transform;}
.bg-base{background:var(--bg-main);opacity:1;inset:0;}
.bg-waves{background:url("../img/waves.png") center/cover no-repeat;}
.bg-glow{background:url("../img/glow.png") center/cover no-repeat;mix-blend-mode:screen;}

.content{position:relative;z-index:1;max-width:960px;padding:2.5rem 1.5rem;}
.logo-block{margin-bottom:-2.0rem;opacity:0;transform:translateY(10px) scale(.965);}
.logo-wrap{position:relative;display:inline-block;width:640px;max-width:98%;line-height:0;}
.logo-img{width:100%;height:auto;display:block;}

.status{
  margin:20px 0;
  font-weight:800;
  font-style:italic;
  font-size:2.2rem;
  letter-spacing:.10em;
  color:var(--accent);
  opacity:0;
  transform:translateY(10px);
}

.contact{
  color:#fff;
  font-weight:800;
  font-size:1.03rem;
  line-height:1.45;
  opacity:0;
  transform:translateY(10px);
}
.contact-name{
  display:block;
  margin-bottom:1.15rem;
  color:#fff;
}
.links_contacto{
  display:flex;
  justify-content:center;
  align-items:center;
  flex-wrap:wrap;
  gap:.7rem .95rem;
  max-width:820px;
  margin:0 auto;
}
.links_contacto a{
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  padding:.46rem .66rem;
  border:1px solid rgba(77,212,255,.22);
  border-radius:999px;
  color:var(--accent);
  text-decoration:none;
  background:rgba(255,255,255,.035);
  transition:color .35s ease, background-color .35s ease, border-color .35s ease, transform .35s ease;
}
.links_contacto a:hover{
  color:#fff;
  background:rgba(255,255,255,.07);
  border-color:rgba(255,255,255,.28);
  transform:translateY(-1px);
}
.contact-icon{
  width:1em;
  height:1em;
  flex:0 0 auto;
  fill:currentColor;
  opacity:.78;
}

footer{
  opacity:0;
  transform:translateY(8px);
  margin-top:22px;
  font-size:.8rem;
  color:rgba(215,232,245,.7);
}

@keyframes fadeIn{from{opacity:0;}to{opacity:1;}}
@keyframes fadeInUpSoft{from{opacity:0;transform:translateY(12px);}to{opacity:1;transform:translateY(0);}}
@keyframes fadeInScaleSoft{from{opacity:0;transform:translateY(12px) scale(.965);}to{opacity:1;transform:translateY(0) scale(1);}}
@keyframes wavesFadeOnly{
  from{opacity:0;}
  to{opacity:.96;}
}
@keyframes glowBreath{
  0%{opacity:.64;transform:scale(1);}
  50%{opacity:.78;transform:scale(1.012);}
  100%{opacity:.64;transform:scale(1);}
}
body.ready .bg-waves{animation:wavesFadeOnly 2.15s ease-out .35s forwards;}
body.ready .logo-block{animation:fadeInScaleSoft .95s cubic-bezier(.2,.75,.2,1) .55s forwards;}
body.ready .bg-glow{animation:fadeIn 2.2s ease-out 1.1s forwards, glowBreath 10s ease-in-out 3.3s infinite;}
body.ready .status{animation:fadeInUpSoft 1.15s cubic-bezier(.2,.75,.2,1) .78s forwards;}
body.ready .contact{animation:fadeInUpSoft 1.15s cubic-bezier(.2,.75,.2,1) .95s forwards;}
body.ready footer{animation:fadeInUpSoft 1.15s cubic-bezier(.2,.75,.2,1) 1.12s forwards;}

@media (max-width:680px){
  body{align-items:center;}
  .content{width:100%;padding:2rem 1.05rem;}
  .logo-block{margin-bottom:-1.05rem;}
  .logo-wrap{width:min(476px,91.8vw);max-width:92vw;margin-left:auto;margin-right:auto;}
  .status{font-size:clamp(1.18rem,5.6vw,1.55rem);letter-spacing:.065em;margin:18px 0;}
  .contact{font-size:.88rem;}
  .contact-name{max-width:320px;margin-left:auto;margin-right:auto;margin-bottom:1.2rem;line-height:1.35;}
  .links_contacto{
    flex-direction:column;
    align-items:center;
    flex-wrap:nowrap;
    gap:.62rem;
    width:100%;
    max-width:365px;
  }
  .links_contacto a{
    width:100%;
    min-height:42px;
    justify-content:flex-start;
    padding:.64rem .82rem;
    border-radius:14px;
    text-align:left;
    line-height:1.25;
  }
  .contact-icon{width:1.05em;height:1.05em;}
  footer{font-size:.72rem;margin-top:18px;}
}

@media (max-width:390px){
  .content{padding:1.65rem .9rem;}
  .logo-block{margin-bottom:-.85rem;}
  .status{font-size:1.08rem;}
  .contact{font-size:.8rem;}
  .links_contacto{max-width:330px;}
}

@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;}
}