@import url('./fonts.css');
:root {
  --Pangram_Medium: 'Pangram-Medium';
  --Pangram_ExtraBold: 'Pangram-ExtraBold';
  --Futura_Round-Bold: 'Futura-Round-Bold';
  --Futura_Round-Medium: 'Futura-Round-Medium';
  --BlackColor : #000;
  --BlueColor : #375f95;
  --DarkBlueColor : #085379;
  --LightBlueColor : #0088cc;
  --ExtraLightBlueColor : #b2dff3;
  --WhiteColor : #fff;
  --GreyColor : #78888e;
}
*{
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  scroll-behavior: smooth;
}
body{
  color: var(--WhiteColor);
  font-family: var(--Pangram_Medium);
  background-color: var(--WhiteColor);
  overflow-x: hidden;
}
.wa-icon{
  width: 40px;
  height: 40px;
  border-radius: 50px;
  background-image: url('../assets/icons/wa-icon.svg');
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  position: fixed;
  bottom: 50px;
  right: 50px;
  z-index: 5;
  cursor: pointer;
}

footer{
  background-color: var(--LightBlueColor);
  color: var(--WhiteColor);
  padding: 50px 20px 0 20px;
}
.footer_data{
  display: flex;
  justify-content: space-around;
  align-items: start;
}
.footer_logo{
  width: 200px;
  height: 100px;
  background-image: url('../assets/img/logos/logo_wh.svg');
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}
footer li{
  list-style: none;
}
footer a{
  text-decoration: none;
  color: var(--WhiteColor);
}
footer ul{
  display: flex;
  flex-direction: column;
  justify-content: start;
  align-items: start;
  gap: 10px;
}
.footer_contact li{
  display: flex;
  gap: 10px;
  &:nth-child(1) div {background-image: url('../assets/icons/phone_icon_wh.svg');}
  &:nth-child(2) div {background-image: url('../assets/icons/wa_icono_wh.svg');}
}
.footer_contact li div{
  width: 20px;
  height: 20px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}
.footer_copy{
  margin-top: 30px;
  padding: 10px 0 ;
  display: flex;
  justify-content: center;
  align-items: center;
  border-top: 2px solid var(--WhiteColor);
}

@media screen and (max-width:768px){
  .footer_data{
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 20px;
  }
  footer ul{
    flex-direction: row;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
  }
  .wa-icon{
    bottom: 20px;
    right: 20px;
  }
}