/* Extraido de los widgets HTML de Elementor: footer.
   Mismo codigo, movido a un archivo para que no viaje en el HTML de cada
   visita y el navegador lo pueda cachear. */

#fde-footer { background:#063B22; color:rgba(255,255,255,.7); padding:56px 24px 28px;
                font-family:'Nunito',sans-serif; -webkit-font-smoothing:antialiased; }
  #fde-footer *{ box-sizing:border-box; }
  #fde-footer .fde-foot-inner{ max-width:1200px; margin:0 auto; }
  #fde-footer .fde-foot{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1.3fr; gap:36px; }
  #fde-footer a{ color:rgba(255,255,255,.7); text-decoration:none; transition:color .2s; }
  #fde-footer a:hover{ color:#fff; }
  #fde-footer .fde-logo{ display:inline-flex; margin-bottom:16px; }
  #fde-footer .fde-logo img{ height:34px; width:auto; display:block; }
  #fde-footer .fde-about{ font-size:14.5px; line-height:1.6; max-width:280px; margin:0 0 18px; }
  #fde-footer .fde-social{ display:flex; gap:10px; }
  #fde-footer .fde-social a{ width:40px; height:40px; border-radius:999px;
    border:1px solid rgba(255,255,255,.16); display:flex; align-items:center; justify-content:center; color:#fff; }
  #fde-footer .fde-social a:hover{ background:rgba(255,255,255,.1); }
  #fde-footer .fde-col-title{ font-weight:700; font-size:14px; color:#fff; letter-spacing:.04em; margin-bottom:16px; }
  #fde-footer .fde-links{ display:flex; flex-direction:column; gap:11px; font-size:14.5px; }
  #fde-footer .fde-contact{ display:flex; flex-direction:column; gap:13px; font-size:14.5px; }
  #fde-footer .fde-contact-row{ display:flex; gap:11px; align-items:center; }
  #fde-footer .fde-contact-row.top{ align-items:flex-start; }
  #fde-footer .fde-contact-row svg{ flex-shrink:0; stroke:#81C784; }
  #fde-footer .fde-wa{ margin-top:4px; display:inline-flex; align-items:center; justify-content:center; gap:9px;
    background:#4caf50; color:#063b22; border-radius:999px; transition:background-color .2s cubic-bezier(.4,0,.2,1), scale .12s cubic-bezier(.4,0,.2,1); padding:12px 20px; font-weight:700; font-size:15px; width:max-content; }
  /* 29/09/2026: era #25D366 con texto blanco (contraste 1,98:1, ilegible). Ahora
   usa el verde del sitio con texto verde oscuro del footer: 4,6:1. Sobre fondo
   oscuro el hover aclara en vez de oscurecer. */
#fde-footer .fde-wa:hover{ background:#66bb6a; color:#063b22; }
#fde-footer .fde-wa:active{ scale:.98; }
#fde-footer .fde-wa:focus-visible{ outline:3px solid rgba(165,214,167,.7); outline-offset:2px; }
  #fde-footer .fde-bar{ border-top:1px solid rgba(255,255,255,.1); margin-top:40px; padding-top:22px;
    display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap;
    font-size:13px; color:rgba(255,255,255,.5); }
  @media (max-width:860px){ #fde-footer .fde-foot{ grid-template-columns:1fr 1fr; gap:32px; } }
  @media (max-width:520px){ #fde-footer .fde-foot{ grid-template-columns:1fr; } }

/* alineacion-home-23092026 */
/* Una sola medida para todo el sitio. Convivian seis anchos maximos (1140,
   1200, 1280, 1300, 1350 y 1360) y nueve margenes laterales, por eso unas
   secciones terminaban antes que otras.
   1300px no es un valor elegido al azar: es el container_width que ya
   declara el kit de Elementor, asi que las secciones nativas del editor ya
   estaban en esa medida y son las de codigo las que se salian.
   Los cortes son 1024 y 767, los mismos que usa Elementor en este sitio y
   los mismos de la tarjeta de producto. Antes habia ocho cortes distintos
   (1440, 1120, 1024, 980, 767, 600, 540, 480): en tablet unas secciones ya
   habian cambiado de medida y otras no, y se desalineaban. */
:root { --fde-ancho: 1300px; --fde-gutter: 24px; --fde-sec-y: 48px; }
@media (max-width: 1024px) { :root { --fde-gutter: 20px; --fde-sec-y: 36px; } }
@media (max-width: 767px)  { :root { --fde-gutter: 16px; --fde-sec-y: 28px; } }
/* El footer era el mas angosto de todos: 1200. */
#fde-footer .fde-foot-inner { max-width: var(--fde-ancho); padding-inline: var(--fde-gutter); box-sizing: border-box; }