/* Footer social controls: 44px targets with a diagonal neutral-layer reveal. */
.footer-social{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  flex-wrap:wrap;
  gap:12px;
  margin:4px 0 0;
  padding:0;
}
.footer-social-link{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 44px;
  box-sizing:border-box;
  width:44px;
  height:44px;
  min-height:44px;
  padding:9px;
  margin:0;
  border:1px solid var(--line,#e4dfd6);
  border-radius:var(--radius);
  background:var(--social-background,#ffffff);
  color:#151516;
  line-height:1;
  text-decoration:none;
}
.footer-social-link[data-social="instagram"]{
  --social-background:radial-gradient(ellipse at 20% 110%,#ffdc80 0%,#fcaf45 22%,#f56040 42%,transparent 65%),linear-gradient(145deg,#405de6 0%,#833ab4 22%,#c13584 40%,#e1306c 55%,#ff0080 75%,#ff0080 100%);
}
.footer-social-link[data-social="linkedin"]{
  --social-background:#0a66c2;
}
.footer-social-link[data-social="whatsapp"]{
  --social-background:#25d366;
}
.footer-social-link::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  border-radius:inherit;
  background:#ffffff;
  clip-path:polygon(0 0,100% 0,100% 100%,0 100%);
  pointer-events:none;
  transition:clip-path var(--dur-3) cubic-bezier(.7,0,.2,1);
}
.footer-social-link .social-icon-viewport{
  position:relative;
  z-index:1;
  display:block;
  flex:0 0 24px;
  width:24px;
  height:24px;
  overflow:hidden;
  pointer-events:none;
}
.footer-social-link .social-icon{
  display:block;
  width:24px;
  height:24px;
}
.footer-social-link svg{
  display:block;
  width:24px;
  height:24px;
  pointer-events:none;
}
.footer-social-link:hover,
.footer-social-link:focus-visible{
  color:#fff;
}
.footer-social-link:hover::before,
.footer-social-link:focus-visible::before{
  clip-path:polygon(0 0,100% 0,0 0,0 100%);
}
.footer-social-link:hover .social-icon,
.footer-social-link:focus-visible .social-icon{
  animation:footer-social-icon-cycle 400ms cubic-bezier(.7,0,.2,1) both;
}
.footer-social-link:focus-visible{
  outline:2px solid var(--focus,#0c0c0d);
  outline-offset:var(--focus-offset,3px);
}
/* The jump at 200ms happens outside the clipped 24px symbol viewport. */
@keyframes footer-social-icon-cycle{
  0%{transform:translateY(0);color:#151516}
  49.999%{transform:translateY(-100%);color:#151516}
  50%{transform:translateY(100%);color:#fff}
  100%{transform:translateY(0);color:#fff}
}
@supports not (clip-path:polygon(0 0,100% 0,100% 100%,0 100%)){
  .footer-social-link{background:#ffffff}
  .footer-social-link::before{display:none}
  .footer-social-link:hover,
  .footer-social-link:focus-visible{background:var(--social-background,#ffffff)}
}
@media(max-width:760px){
  .footer-social{justify-content:flex-start}
}
@media(prefers-reduced-motion:reduce){
  .footer-social-link::before{transition:none}
  .footer-social-link .social-icon,
  .footer-social-link:hover .social-icon,
  .footer-social-link:focus-visible .social-icon{animation:none;transform:none}
}
@media(forced-colors:active){
  .footer-social-link{
    forced-color-adjust:none;
    background:Canvas;
    border-color:CanvasText;
    color:CanvasText;
  }
  .footer-social-link::before{display:none}
  .footer-social-link:hover,
  .footer-social-link:focus-visible{
    background:Highlight;
    color:HighlightText;
  }
  .footer-social-link .social-icon,
  .footer-social-link:hover .social-icon,
  .footer-social-link:focus-visible .social-icon{animation:none;transform:none}
  .footer-social-link:focus-visible{outline-color:Highlight}
}



/* Facebook compartilha a revelacao diagonal, o ciclo do icone e o foco dos demais canais. */
.footer-social-link[data-social="facebook"]{--social-background:#1877f2}
