.hero-overlay {
  background: linear-gradient(
    90deg,
    rgba(48, 50, 52, 0.68),
    rgba(48, 50, 52, 0.37) 48%,
    rgba(48, 50, 52, 0.04)
  ) !important;
}
.empresa-overlay {
  background: linear-gradient(
    90deg,
    rgba(48, 50, 52, 0.62),
    rgba(48, 50, 52, 0.32) 50%,
    rgba(48, 50, 52, 0.06)
  ) !important;
}
.megashield-section {
  background: linear-gradient(150deg, #515457, #3f4245) !important;
}
.products-section {
  background: #56595b !important;
}
.product-grid article {
  background: #44474a !important;
}
footer {
  display: block !important;
  padding: 0 !important;
  background: #f7f7f5 !important;
  color: #222 !important;
}
.footer-main {
  display: grid;
  grid-template-columns: 1.35fr 1fr 1.25fr .8fr .9fr;
  gap: 35px;
  align-items: start;
  width: min(1440px, calc(100% - 80px));
  margin: auto;
  padding: 48px 0 38px;
}
.footer-brand {
  display: block;
  width: 240px;
  height: auto;
}
.footer-brand img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
}
.footer-main h3 {
  margin: 5px 0 15px;
  font-size: 12px;
  letter-spacing: 0.8px;
  text-transform: uppercase;
  color: #333;
}
.footer-main div:not(.footer-main) a,
.footer-main > div a,
.footer-main address a {
  display: block;
  margin: 0 0 10px;
  font-size: 13px;
  color: #555;
}
.footer-main a:hover {
  color: #f45100;
}
.footer-whatsapp {
  font-weight: 800 !important;
  color: #a63700 !important;
}
.footer-identity p { max-width: 280px; margin: 15px 0 18px; color: #666; font-size: 13px; line-height: 1.5; }
.footer-identity { min-width: 0; }
.footer-brand { max-width: 100%; }
.footer-socials { display: flex; flex-wrap: wrap; gap: 12px; }
.footer-socials a { width: 52px; height: 52px; margin: 0 !important; padding: 12px; display: grid !important; place-items: center; border: 0; border-radius: 12px; color: #fff !important; box-shadow: 0 3px 8px #0002; transition: transform .2s; }
.footer-socials a:hover { transform: translateY(-3px); }
.footer-socials a:focus-visible { outline: 3px solid #222; outline-offset: 4px; }
.footer-socials .social-instagram { background: radial-gradient(circle at 25% 110%, #ffdc80 0%, #f77737 30%, #e1306c 55%, #833ab4 85%); }
.footer-socials .social-linkedin { background: #0a66c2; }
.footer-socials .social-facebook { background: #0866ff; }
.footer-socials .social-linkedin svg, .footer-socials .social-facebook svg { fill: currentColor; stroke: none; }
.footer-socials svg { width: 28px; height: 28px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.footer-socials .social-dot { fill: currentColor; stroke: none; }
.footer-main address { font-style: normal; }
.footer-main address a { line-height: 1.55; }
.footer-addresses { display: grid; gap: 22px; }
.footer-addresses h3 { margin-bottom: 8px; }
.footer-bottom {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  justify-content: space-between;
  width: min(1440px, calc(100% - 80px));
  margin: auto;
  padding: 18px 0;
  border-top: 1px solid #ddd;
  color: #686868;
  font-size: 12px;
}
.footer-bottom a {
  color: #a63700 !important;
  font-weight: bold;
}
.footer-bottom .developer-credit { color: #686868 !important; font-weight: 400; }
.footer-bottom .developer-credit strong { color: #a63700; }
.footer-bottom .developer-credit:hover { color: #a63700 !important; }
@media (max-width: 850px) {
  .footer-main {
    grid-template-columns: 1fr 1fr;
    width: calc(100% - 40px);
    gap: 28px;
    padding: 35px 0;
  }
  .footer-bottom {
    width: calc(100% - 40px);
    gap: 15px;
    flex-direction: column;
  }
  .footer-brand {
    width: 170px;
  }
}
@media (min-width: 1600px) {
  .footer-main,
  .footer-bottom { width: min(1680px, calc(100% - 128px)); }
  .footer-main { gap: 50px; padding: 62px 0 48px; }
  .footer-main h3 { font-size: 14px; }
  .footer-main div:not(.footer-main) a,
  .footer-main > div a,
  .footer-main address a,
  .footer-identity p { font-size: 15px; }
}
@media (max-width: 1150px) and (min-width: 851px) {
  .footer-main { grid-template-columns: 1.2fr 1fr 1.2fr; }
}
@media (max-width: 540px) { .footer-main { grid-template-columns: minmax(0, 1fr); } .footer-brand { width: 220px; } }
