/* ===================================================================
   Triple — icons

   The template writes Font Awesome classes everywhere but never loads
   Font Awesome, so every icon on the site rendered as nothing. Loading
   the Pro stylesheet would cost 534 KB of CSS plus a webfont per weight,
   to draw about twenty-five shapes.

   Instead: the brand marks keep the Brands webfont, because a logo has
   to be the real logo, and everything else is an inline SVG written into
   the markup. Only the glyphs actually used are declared here.
   =================================================================== */

@font-face {
  font-family: "FA Brands";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/fa-brands-400.woff2") format("woff2"),
       url("../fonts/fa-brands-400.woff") format("woff");
}

.fab, .fa-brands {
  font-family: "FA Brands";
  font-weight: 400;
  font-style: normal;
  font-variant: normal;
  line-height: 1;
  display: inline-block;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
}

.fa-facebook-f::before  { content: "\f39e"; }
.fa-facebook::before    { content: "\f09a"; }
.fa-linkedin-in::before { content: "\f0e1"; }
.fa-whatsapp::before    { content: "\f232"; }
.fa-instagram::before   { content: "\f16d"; }
.fa-tiktok::before      { content: "\e07b"; }
.fa-twitter::before     { content: "\f099"; }
.fa-youtube::before     { content: "\f167"; }

/* ---- inline SVG icons ----------------------------------------------
   Sized and coloured like a font glyph would be, so they drop into the
   template's existing rules without touching them.
------------------------------------------------------------------- */
.ico {
  width: 1em; height: 1em;
  display: inline-block;
  vertical-align: -0.125em;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  flex: none;
}
.ico--fill { fill: currentColor; stroke: none; }
