.w100{
    width:100%;
    max-width:1200px;
    margin:auto;
    padding:0px 15px;
}

footer{
    background-color:var(--black);
}

.bg-footer{
    background-color: var(--black);
    height:auto;
    width:100%;
    color:var(--white);
}

.descFooterEmpresa{
    color:var(--white);
    font-size:11px;
}


.flexItemsFooter{
    display:flex;
    justify-content:space-between;
    align-items: start;
    gap:20px;

    padding:50px 0px;
}


.itemFEmpresa{
    width:25%;
}

.itemFEmpresa img{
    width:200px;
    padding:10px 0px;
}

.itemEnlace{
    width:22%;
    display:flex;
    flex-direction:column;
    gap:10px;
}

.itemEnlace h5,.itemRds h5{
    color:var(--principal);
    font-size:16px;
    font-weight:600;
    padding-bottom:5px;
}

.itemEnlace a{
    color:var(--white);
    font-size:14px;
    transition: all ease .3s;
}

.itemEnlace a:hover{
    color:var(--principal);
}

.flexIconEnlace{
    display: flex;
    align-items: center;
    gap:10px;
}

.containerIconF{
    width:30px;
    height:30px;
    background-color:var(--principal);
    border-radius:50%;
    display:flex;
    justify-content:center;
    align-items: center;
    color:var(--black);
}

.flexIconEnlace a{
    font-size:12px;
    width:200px;
}

.itemRds{
    width:15%;
}

.flexRdsF{
    display:flex;
    justify-content:start;
    gap:10px;
    margin-top:10px;
}

.flexRdsF a{
    width:30px;
    height:30px;
    background-color:var(--principal);
    color:var(--black);
    display: flex;
    align-items:center;
    justify-content: center;
    border-radius:5px;
}

.flexRdsF a:hover{
    width:30px;
    height:30px;
    background-color:var(--white);
    color:var(--black);
}


.copyR{
    background-color:var(--principal);
    color:var(--white);
    display: flex;
    justify-content:center;
    align-items:center;
    gap:10px;
    padding:15px 10px;
    color:var(--black);
    font-size:12px;
}

.copyR a{
    color:var(--black);
    font-weight:600;
    transition: all ease .3s;
}

.copyR a:hover{
    text-decoration: underline;
}




/* BUTTON UP */

.btn-scrolltop {
    position: fixed;
    bottom: 15px;
    left:20px;
    padding: 10px 15px;
    background-color: var(--principal);
    color: var(--black);
    border:2px solid var(--black);box-shadow: rgba(0, 0, 0, 0.283) 0px 22px 70px 4px;
    cursor: pointer;
    transform: translateY(100px);
    border-radius:5px;
    transition: 0.3s;
  }
  
  .btn-scrolltop-active {
    transform: translateY(0);
  }

  .btn-scrolltop:hover{
    background-color: var(--black);
    color:var(--principal);
  }




/* Botón de WhatsApp Flotante */
.whatsapp-container {
    position: fixed;
    bottom: 10px;
    right: 10px;
    z-index: 3;
  }
  
  .whatsapp-btn {
    display: flex;
    justify-content:center;
    align-items: center;
    width: 60px;
    height: 60px;
    line-height: 60px;
    text-align: center;
    background-color: #25D366;
    color: #fff;
    border-radius: 50%;
    box-shadow: 0 4px 8px rgba(1, 193, 7, 0.15);
    font-size:25px;
    animation-name: pulse;
    animation-duration:3s;
  }
  
  /* WhatsApp button pulsing animation */
  @keyframes pulse {
    0% {
      transform: scale(1);
      box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
    }
    50% {
      transform: scale(1.1);
      box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
    }
    100% {
      transform: scale(1);
      box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
    }
  }
  
  
  /* Hover effect for the button (optional) */
  .whatsapp-btn:hover {
    background-color: var(--black);
  }




@media(max-width:1200px){
    .itemFEmpresa{width:20%}
}


@media(max-width:1150px){
    .flexItemsFooter{
        gap:10px;
    }
}


@media(max-width:1130px){
    .flexItemsFooter{
        flex-wrap:wrap;
    }

    .itemFEmpresa,.itemEnlace{
        width:30%;
    }

    .itemRds{
        width:100%;
    }
}

@media(max-width:900px){
    .flexItemsFooter{gap:40px;}
    .itemFEmpresa,.itemEnlace{
        width:50%;
    }
}


@media(max-width:576px){
    .itemFEmpresa,.itemEnlace{
        width:100%;
    }

    .copyR{
        flex-wrap:wrap;gap:5px;
    }
}