/* ===== TEXTO NOSOTROS ===== */

.about-text{

  max-width:680px;

  margin:auto;

  margin-bottom:55px;

  color:#999;

  line-height:2;

  font-size:1.05rem;

  text-align:center;

  animation:flicker 5s infinite;
}

/* ===== SEPARADOR ===== */

.separator{

  width:100%;

  height:1px;

  background:
  linear-gradient(
    to right,
    transparent,
    rgba(255,255,255,0.2),
    transparent
  );

  margin:45px 0;
}

/* ===== CONTENEDOR ===== */

.container{

  max-width:850px;

  width:90%;

  padding:70px 60px;

  backdrop-filter:blur(3px);

  background:rgba(10,10,10,0.88);

  border:1px solid rgba(255,255,255,0.08);
}

/* ===== TEXTO INFO ===== */

.text{

  margin-bottom:35px;

  text-align:center;

  color:#888;

  line-height:1.8;
}

/* ===== FORMULARIO ===== */

.contact-form{

  display:flex;

  flex-direction:column;

  gap:22px;

  margin-top:20px;
}

/* ===== INPUTS ===== */

.contact-form input,
.contact-form textarea{

  width:100%;

  padding:18px 20px;

  background:rgba(255,255,255,0.02);

  border:1px solid rgba(255,255,255,0.08);

  color:#bbb;

  font-family:'Inconsolata', monospace;

  font-size:0.9rem;

  outline:none;

  transition:0.3s;
}

/* ===== TEXTAREA ===== */

.contact-form textarea{

  min-height:180px;

  resize:vertical;
}

/* ===== FOCUS ===== */

.contact-form input:focus,
.contact-form textarea:focus{

  border-color:#5a0000;

  background:rgba(90,0,0,0.06);
}

/* ===== PLACEHOLDER ===== */

.contact-form input::placeholder,
.contact-form textarea::placeholder{

  color:#666;
}

/* ===== BOTÓN ===== */

.contact-form button{

  width:100%;

  padding:18px;

  border:1px solid rgba(255,255,255,0.08);

  background:rgba(255,255,255,0.02);

  color:#888;

  font-family:'Inconsolata', monospace;

  letter-spacing:3px;

  cursor:pointer;

  transition:0.3s;
}

/* ===== HOVER BOTÓN ===== */

.contact-form button:hover{

  color:#ddd;

  border-color:#5a0000;

  background:rgba(90,0,0,0.12);

  transform:translateY(-2px);
}

/* ===== REDES ===== */

.socials{

  display:flex;

  justify-content:center;

  gap:20px;

  margin-top:45px;

  flex-wrap:wrap;
}

/* ===== LINKS REDES ===== */

.socials a{

  padding:14px 24px;

  border:1px solid rgba(255,255,255,0.08);

  text-decoration:none;

  color:#777 !important;

  font-family:'Inconsolata', monospace;

  letter-spacing:2px;

  background:rgba(255,255,255,0.02);

  transition:0.3s;
}

/* ===== VISITED ===== */

.socials a:visited{

  color:#777 !important;
}

/* ===== HOVER ===== */

.socials a:hover{

  color:#ddd !important;

  border-color:#5a0000;

  background:rgba(90,0,0,0.12);

  transform:translateY(-2px);
}

/* ===== RESPONSIVE ===== */

@media(max-width:768px){

  .container{

    width:95%;

    padding:45px 25px;
  }

  .socials{

    flex-direction:column;
  }

}