#vf-footer-2026{width:100%;max-width:1180px;margin:0 auto;overflow:visible;background:#021c33;color:#d8e1eb;font-family:Arial,Helvetica,sans-serif;font-size:14px;line-height:1.55;text-align:start;container-type:inline-size;container-name:vff}
#vf-footer-2026:before{content:"";display:block;width:100%;height:42px;background:#021c33}
#vf-footer-2026,#vf-footer-2026 *,#vf-footer-2026 *:before,#vf-footer-2026 *:after{box-sizing:border-box;min-width:0}
#vf-footer-2026 a{color:#d8e1eb;text-decoration:none!important;transition:color .15s ease,background-color .15s ease,border-color .15s ease}
#vf-footer-2026 a:hover{color:#fff}
#vf-footer-2026 a:focus-visible{color:#fff;outline:3px solid #60a5fa;outline-offset:3px}
#vf-footer-2026 p{margin:0}
#vf-footer-2026 ul{list-style:none;margin:0;padding:0}
#vf-footer-2026 li{margin:0 0 8px}
#vf-footer-2026 h2{margin:0 0 15px;color:#fff;font-size:12px;font-weight:800;letter-spacing:1.1px;text-transform:uppercase}

/* Cuerpo */
#vf-footer-2026 .vf-f-body{display:grid;grid-template-columns:minmax(230px,1.35fr) minmax(150px,.8fr) minmax(280px,1.45fr) minmax(190px,1fr);gap:34px;padding:0 40px 38px}

/* Marca */
#vf-footer-2026 .vf-f-brand{display:flex;align-items:center;gap:12px;margin-bottom:15px}
#vf-footer-2026 .vf-f-brand img{display:block;width:52px;height:52px;border-radius:12px;background:#fff;padding:5px}
#vf-footer-2026 .vf-f-brand strong{display:block;color:#fff;font-size:22px;font-weight:800;line-height:1.1;letter-spacing:-.4px}
#vf-footer-2026 .vf-f-brand span{display:block;margin-top:3px;color:#b8c6d3;font-size:12px;font-weight:600}
#vf-footer-2026 .vf-f-about{max-width:360px;margin-bottom:18px;color:#d8e1eb}
#vf-footer-2026 .vf-f-cta{display:flex;flex-wrap:wrap;gap:9px;margin-bottom:20px}
#vf-footer-2026 .vf-f-btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 16px;border:1px solid #1d4ed8;border-radius:9px;background:#1d4ed8;color:#fff!important;font-size:13px;font-weight:800;text-align:center}
#vf-footer-2026 .vf-f-btn:hover{background:#1e40af;border-color:#1e40af}
#vf-footer-2026 .vf-f-btn-ghost{background:transparent;border-color:#4a6b88;color:#fff!important}
#vf-footer-2026 .vf-f-btn-ghost:hover{background:#0b3558;border-color:#8aa4ba}

/* Contacto compacto */
#vf-footer-2026 .vf-f-contact{display:grid;gap:7px;padding-top:17px;border-top:1px solid #31516d;color:#b8c6d3;font-size:13px}
#vf-footer-2026 .vf-f-contact a{color:#fff;font-weight:700;overflow-wrap:anywhere}
#vf-footer-2026 .vf-f-contact address{font-style:normal;color:#d8e1eb}
#vf-footer-2026 .vf-f-contact address b{display:block;color:#b8c6d3;font-size:11px;font-weight:800;letter-spacing:.5px;text-transform:uppercase}

/* Enlaces */
#vf-footer-2026 .vf-f-links a{display:inline-block;max-width:100%;padding:2px 0;font-weight:600;overflow-wrap:anywhere}
#vf-footer-2026 .vf-f-sectors ul{columns:2;column-gap:18px}
#vf-footer-2026 .vf-f-sectors li{break-inside:avoid;font-size:13px}
#vf-footer-2026 .vf-f-subtitle{margin:20px 0 11px;color:#fff;font-size:12px;font-weight:800;letter-spacing:1.1px;text-transform:uppercase}

/* Franja inferior */
#vf-footer-2026 .vf-f-bottom{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 22px;padding:19px 40px 23px;border-top:1px solid #31516d;color:#b8c6d3;font-size:12px}
#vf-footer-2026 .vf-f-bottom b{color:#fff;font-weight:700}
#vf-footer-2026 .vf-f-legal{display:flex;flex-wrap:wrap;gap:6px 17px}
#vf-footer-2026 .vf-f-legal a{font-weight:600}
#vf-footer-2026 .vf-f-badge{display:inline-flex;align-items:center;gap:7px;padding:5px 10px;border:1px solid #4a6b88;border-radius:20px;color:#fff;font-size:11px;font-weight:800;white-space:nowrap}
#vf-footer-2026 .vf-f-badge:before{content:"";width:7px;height:7px;border-radius:50%;background:#35a947}

/* Responsive de Website X5 */
@container vff (max-width:959px){
  #vf-footer-2026 .vf-f-body{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 28px;padding:0 30px 34px}
  #vf-footer-2026 .vf-f-brand-col{grid-column:1/-1}
  #vf-footer-2026 .vf-f-about{max-width:620px}
  #vf-footer-2026 .vf-f-sectors{grid-column:1/-1;order:5}
  #vf-footer-2026 .vf-f-sectors ul{columns:3}
  #vf-footer-2026 .vf-f-bottom{padding:18px 30px 22px}
}
@container vff (max-width:719px){
  #vf-footer-2026 .vf-f-body{grid-template-columns:1fr;gap:27px;padding:0 21px 29px}
  #vf-footer-2026 .vf-f-brand-col,#vf-footer-2026 .vf-f-sectors{grid-column:auto}
  #vf-footer-2026 .vf-f-links:not(.vf-f-sectors) ul{columns:2;column-gap:20px}
  #vf-footer-2026 .vf-f-sectors ul{columns:2}
  #vf-footer-2026 .vf-f-links li{break-inside:avoid}
  #vf-footer-2026 .vf-f-cta{flex-direction:column}
  #vf-footer-2026 .vf-f-btn{width:100%}
  #vf-footer-2026 .vf-f-bottom{flex-direction:column;align-items:flex-start;padding:17px 21px 23px}
}
/* Portatil de Website X5: el area util suele quedar entre 600 y 719 px.
   Se recuperan dos columnas para evitar un pie excesivamente largo. */
@container vff (min-width:600px) and (max-width:800px){
  #vf-footer-2026 .vf-f-body{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 26px;padding:0 28px 32px}
  #vf-footer-2026 .vf-f-brand-col{grid-column:1/-1}
  #vf-footer-2026 .vf-f-about{max-width:620px}
  #vf-footer-2026 .vf-f-cta{flex-direction:row}
  #vf-footer-2026 .vf-f-btn{width:auto}
  #vf-footer-2026 .vf-f-links:not(.vf-f-sectors) ul{columns:1}
  #vf-footer-2026 .vf-f-sectors{grid-column:1/-1;order:5}
  #vf-footer-2026 .vf-f-sectors ul{columns:3}
  #vf-footer-2026 .vf-f-bottom{flex-direction:row;align-items:center;padding:18px 28px 22px}
}
/* Movil: se usa grid en vez de columnas tipograficas. Asi cada enlace queda
   limitado a su mitad y nunca ensancha el objeto HTML de Website X5. */
@container vff (max-width:599px){
  #vf-footer-2026 .vf-f-links ul,#vf-footer-2026 .vf-f-sectors ul{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:0 16px;
    columns:auto;
    width:100%;
    max-width:100%
  }
  #vf-footer-2026 .vf-f-links li{width:100%;max-width:100%;min-width:0}
  #vf-footer-2026 .vf-f-links a{display:block;width:100%;min-width:0;word-break:normal;overflow-wrap:anywhere}
}
@container vff (max-width:479px){
  #vf-footer-2026:before{height:26px}
  #vf-footer-2026 .vf-f-body{gap:22px;padding:0 14px 22px}
  #vf-footer-2026 .vf-f-about{margin-bottom:14px;font-size:13px;line-height:1.5}
  #vf-footer-2026 .vf-f-cta{gap:8px;margin-bottom:15px}
  #vf-footer-2026 .vf-f-contact{gap:5px;padding-top:14px;font-size:12px}
  #vf-footer-2026 .vf-f-links ul,#vf-footer-2026 .vf-f-sectors ul{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 12px;columns:auto}
  #vf-footer-2026 .vf-f-links li{margin-bottom:7px;font-size:12px;line-height:1.35;break-inside:avoid;overflow-wrap:anywhere}
  #vf-footer-2026 .vf-f-subtitle{margin-top:16px}
  #vf-footer-2026 .vf-f-bottom{gap:9px;padding:14px 14px 18px;font-size:11px}
  #vf-footer-2026 .vf-f-brand strong{font-size:20px}
}
@supports not (container-type:inline-size){
  @media screen and (max-width:959px){
    #vf-footer-2026 .vf-f-body{grid-template-columns:repeat(2,minmax(0,1fr))}
    #vf-footer-2026 .vf-f-brand-col,#vf-footer-2026 .vf-f-sectors{grid-column:1/-1}
    #vf-footer-2026 .vf-f-sectors{order:5}
  }
  @media screen and (max-width:719px){
    #vf-footer-2026 .vf-f-body{grid-template-columns:1fr;padding:0 21px 29px}
    #vf-footer-2026 .vf-f-brand-col,#vf-footer-2026 .vf-f-sectors{grid-column:auto}
    #vf-footer-2026 .vf-f-bottom{flex-direction:column;align-items:flex-start}
  }
  @media screen and (max-width:599px){
    #vf-footer-2026 .vf-f-links ul,#vf-footer-2026 .vf-f-sectors ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 16px;columns:auto;width:100%;max-width:100%}
    #vf-footer-2026 .vf-f-links li,#vf-footer-2026 .vf-f-links a{width:100%;max-width:100%;min-width:0;overflow-wrap:anywhere}
    #vf-footer-2026 .vf-f-links a{display:block}
  }
  @media screen and (min-width:600px) and (max-width:800px){
    #vf-footer-2026 .vf-f-body{grid-template-columns:repeat(2,minmax(0,1fr));padding:0 28px 32px}
    #vf-footer-2026 .vf-f-brand-col,#vf-footer-2026 .vf-f-sectors{grid-column:1/-1}
    #vf-footer-2026 .vf-f-sectors{order:5}
    #vf-footer-2026 .vf-f-sectors ul{columns:3}
    #vf-footer-2026 .vf-f-bottom{flex-direction:row;align-items:center}
  }
}
@media (prefers-reduced-motion:reduce){
  #vf-footer-2026 *,#vf-footer-2026 *:before,#vf-footer-2026 *:after{transition:none!important}
}