/* Icon helper (mask-based). Put your brand color via `color:` on the link/button. */
.btn-icon{ display:inline-flex; align-items:center; gap:.5rem; text-decoration:none; }
.btn-icon .ico{
  width:1.3em; height:1.31em; background: currentColor;
  -webkit-mask: no-repeat center / contain;
          mask: no-repeat center / contain;
}

/* Map each class to its SVG (self-hosted) */
.btn-icon.wa  .ico{ -webkit-mask-image:url(/assets/icons/whatsapp.svg); mask-image:url(/assets/icons/whatsapp.svg); }
.btn-icon.li  .ico{ -webkit-mask-image:url(/assets/icons/linkedin.svg);  mask-image:url(/assets/icons/linkedin.svg);  }
.btn-icon.ig  .ico{ -webkit-mask-image:url(/assets/icons/instagram.svg); mask-image:url(/assets/icons/instagram.svg); }
.btn-icon.yt  .ico{ -webkit-mask-image:url(/assets/icons/youtube.svg);   mask-image:url(/assets/icons/youtube.svg);   }
.btn-icon.fb  .ico{ -webkit-mask-image:url(/assets/icons/facebook.svg);  mask-image:url(/assets/icons/facebook.svg);  }
.btn-icon.tt  .ico{ -webkit-mask-image:url(/assets/icons/tiktok.svg);    mask-image:url(/assets/icons/tiktok.svg);    }
.btn-icon.x   .ico{ -webkit-mask-image:url(/assets/icons/x.svg);         mask-image:url(/assets/icons/x.svg);         }

.footer-social a{ color: #fff; }         /* default */
.footer-social a.wa{ color: #fff; }
.footer-social a.li{ color: #fff; }
.footer-social a.ig{ color: #fff; }
.footer-social a.yt{ color: #fff; }
.footer-social a.fb{ color: #fff; }
.footer-social a.tt{ color: #fff; }
.footer-social a.x { color: #fff; }

.contact-list{ margin:0; padding:0; list-style:none }
.contact-list li{ margin: .25rem 0 }
.contact-list a{
  display:inline-flex; align-items:center; gap:.5rem;
  color: #fff; text-decoration:none;
}
.contact-list a:hover{ text-decoration:underline }
.contact-list .icon{ width:1.1em; height:1.1em; flex:0 0 auto; }