/* footer.css — overrides for orange icons, fixed size */
:root{
  --mp-orange: #FF8562;      /* ← set your orange here */
  --mp-line: rgba(255,255,255,.08);
}

.sep-top { border-top: 1px solid var(--mp-line); }

.mp-footer {
  background:#000;
  color:#fff;
  padding:2rem 1rem;
  text-align:center;
}

/* social row */
.mp-footer .footer-social-bar{
  display:flex;justify-content:center;align-items:center;
  gap:1.5rem;margin-bottom:1.5rem;
}

/* ICON COLOR + SIZE (no hover color change) */
.mp-footer .footer-social-bar a {
  color: var(--mp-orange) !important;   /* force orange even if HTML has text-white */
  text-decoration: none;
}
.mp-footer .footer-social-bar a svg {
  width: 40px !important;               /* same as w-10 h-10 */
  height: 40px !important;
  display: block;
  color: inherit;                        /* use the anchor’s orange */
  fill: currentColor;                    /* keep using currentColor */
}

/* keep hover behavior neutral (no color change) */
.mp-footer .footer-social-bar a:hover,
.mp-footer .footer-social-bar a:focus {
  color: var(--mp-orange) !important;
  opacity: 1;
  transform: none;
  outline: none;
}

/* copyright */
.mp-footer .footer-copy{
  font-size:.875rem;
  color:rgba(255,255,255,.7);
}

/* mobile size */
@media (max-width:480px){
  .mp-footer .footer-social-bar a svg { width:32px; height:32px; }
}