/* AESTHETICS MIX — SECCIÓN LEGAL ES v2 */
body.legal-document-page #imagen{display:none!important}
.legal-hub{background:#eee4da;color:#332f2d;border-bottom:1px solid rgba(87,66,51,.12)}
.legal-hub-shell{width:min(1120px,calc(100% - 48px));margin:0 auto;padding:48px 0 32px}
.legal-eyebrow{margin:0 0 8px;font-family:"Montserrat",sans-serif;font-size:.76rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:#9b7a35}
.legal-hub h1{margin:0 0 10px;font-family:"Montserrat",sans-serif;font-size:clamp(2rem,4vw,3.2rem);line-height:1.08;color:#302d2b}
.legal-summary{max-width:780px;margin:0 0 28px;font-family:"Lato",sans-serif;font-size:1.04rem;line-height:1.65;color:#645c57}
.legal-toolbar{display:grid;grid-template-columns:minmax(280px,520px) minmax(260px,1fr);gap:22px;align-items:stretch}
.legal-select-card,.legal-download-card{background:rgba(255,255,255,.68);border:1px solid rgba(87,66,51,.13);border-radius:16px;padding:18px 20px;box-shadow:0 10px 28px rgba(77,57,44,.05)}
.legal-select-label,.legal-doc-label{display:block;margin:0 0 8px;font:700 .72rem/1.2 "Montserrat",sans-serif;letter-spacing:.1em;text-transform:uppercase;color:#77675d}
.legal-select{width:100%;min-height:48px;border:1px solid #cbbfb5;border-radius:10px;background:#fff;padding:0 13px;font:600 .98rem/1.2 "Montserrat",sans-serif;color:#302d2b}
.legal-doc-row{display:flex;justify-content:space-between;gap:16px;align-items:center}
.legal-doc-meta{min-width:0}.legal-doc-title{margin:0 0 5px;font:700 .98rem/1.3 "Montserrat",sans-serif}.legal-doc-sub{margin:0;color:#756b65;font:400 .82rem/1.45 "Lato",sans-serif}
.legal-download{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;min-height:40px;padding:0 16px;border-radius:999px;background:#6f5d54;color:#fff!important;text-decoration:none!important;font:700 .82rem/1 "Montserrat",sans-serif}.legal-download:hover{opacity:.92}
.legal-doc-status{display:inline-block;margin-left:5px;color:#4f7356;font-weight:700}
.legal-rule{height:3px;background:linear-gradient(90deg,#aa7b16,#f2d374,#aa7b16);margin-top:32px}
body.legal-document-page main{background:#f8f4f0;padding-top:42px!important;padding-bottom:64px!important}
body.legal-document-page main>div[id]{width:min(980px,calc(100% - 48px));margin-left:auto!important;margin-right:auto!important;padding-left:0!important;padding-right:0!important}
body.legal-document-page main h1.titulo{display:none!important}
body.legal-document-page main p,body.legal-document-page main li{line-height:1.75!important}
body.legal-document-page main p>strong:first-child{font-family:"Montserrat",sans-serif;font-size:1.08em;color:#37312e}
body.legal-document-page main ul{margin-top:12px;margin-bottom:24px}
@media(max-width:760px){.legal-hub-shell{width:calc(100% - 36px);padding-top:36px}.legal-toolbar{grid-template-columns:1fr}.legal-doc-row{align-items:flex-start}.legal-download{margin-top:2px}body.legal-document-page main>div[id]{width:calc(100% - 36px)}}
@media(max-width:480px){.legal-doc-row{display:grid}.legal-download{width:100%;margin-top:8px}.legal-select-card,.legal-download-card{padding:16px}}


/* =========================================================
   AESTHETICS MIX — AJUSTE ESTÉTICO LEGAL ES v3
   Reutiliza estrictamente la paleta y el separador existentes.
   ========================================================= */

/* Zona superior: mismo chocolate corporativo del sitio */
.legal-hub{
  background:var(--tertiary-color,#6C5C54) !important;
  color:var(--secondary-text-color,#fff) !important;
  border-bottom:0 !important;
}

/* Marca y textos: sin mostaza; blancos/crema propios del bloque chocolate */
.legal-eyebrow{
  color:var(--secondary-text-color,#fff) !important;
  opacity:.92;
}
.legal-hub h1{
  color:var(--secondary-text-color,#fff) !important;
}
.legal-summary{
  color:var(--secondary-text-color,#fff) !important;
  opacity:.88;
}

/* Tarjetas: claras, como contrapunto al chocolate */
.legal-select-card,
.legal-download-card{
  background:var(--primary-color,#f3f1ef) !important;
  border-color:rgba(255,255,255,.20) !important;
  box-shadow:0 10px 28px rgba(35,26,22,.14) !important;
  color:var(--text-color,#333) !important;
}
.legal-select-label,
.legal-doc-label{
  color:var(--text-color,#333) !important;
}
.legal-doc-title{
  color:var(--text-color,#333) !important;
}
.legal-doc-sub{
  color:#6C5C54 !important;
}

/* Estado funcional: conserva verde */
.legal-doc-status{
  color:#4f7356 !important;
}

/* Botón: mismo chocolate corporativo */
.legal-download{
  background:var(--tertiary-color,#6C5C54) !important;
}

/* Separador CORPORATIVO REAL:
   la propia imagen degradado.webp mide 1440 × 25 px.
   Ocupa todo el ancho y separa físicamente ambos fondos. */
.legal-rule{
  position:relative !important;
  left:50% !important;
  width:100vw !important;
  height:25px !important;
  margin:32px 0 -32px !important;
  transform:translateX(-50%) !important;
  background:url("../images/degradado.webp") center center / 100% 25px no-repeat !important;
}

/* Fondo inferior: mantiene la familia clara original */
body.legal-document-page main{
  background:var(--primary-color,#f3f1ef) !important;
}

/* En móvil el separador conserva exactamente sus 25 px */
@media(max-width:760px){
  .legal-rule{
    width:100vw !important;
    height:25px !important;
    background-size:100% 25px !important;
  }
}


/* =========================================================
   AESTHETICS MIX — AJUSTE PLANTILLA PRINCIPAL v4
   El bloque legal respeta exactamente el contenedor de 1440 px
   de la portada. No se extiende al viewport.
   ========================================================= */

/* El separador ocupa SOLO el ancho del contenedor de la web,
   igual que degradado.webp en la portada. */
.legal-rule{
  position:relative !important;
  left:auto !important;
  right:auto !important;
  width:100% !important;
  max-width:100% !important;
  height:25px !important;
  margin:32px 0 -32px !important;
  transform:none !important;
  background:url("../images/degradado.webp") center center / 100% 25px no-repeat !important;
}

/* La zona legal nunca se sale del contenedor principal. */
body.legal-document-page #contenedor{
  width:100% !important;
  max-width:1440px !important;
  margin-left:auto !important;
  margin-right:auto !important;
  overflow:visible !important;
}
body.legal-document-page .legal-hub{
  width:100% !important;
  max-width:1440px !important;
  margin-left:0 !important;
  margin-right:0 !important;
}

/* Menú superior como en la portada: blanco sobre fondo chocolate. */
@media (min-width:769px){
  body.legal-document-page #menu > .menu-list > li > a,
  body.legal-document-page #menu > .menu-list > li > a:link,
  body.legal-document-page #menu > .menu-list > li > a:visited{
    color:#fff !important;
    text-shadow:none !important;
  }

  body.legal-document-page #menu > .menu-list > li > a:hover,
  body.legal-document-page #menu > .menu-list > li > a:focus{
    color:#fff !important;
    text-decoration:underline !important;
    text-decoration-color:#fff !important;
  }

  /* El desplegable de idiomas conserva el texto oscuro sobre fondo claro. */
  body.legal-document-page #menu .language-dropdown .dropdown a,
  body.legal-document-page #menu .language-dropdown .dropdown a:link,
  body.legal-document-page #menu .language-dropdown .dropdown a:visited{
    color:#2f2f2f !important;
  }
}

/* En móvil se mantiene el menú beige/oscuro ya validado del sitio. */
@media(max-width:768px){
  .legal-rule{
    width:100% !important;
    max-width:100% !important;
    height:25px !important;
    transform:none !important;
    background-size:100% 25px !important;
  }
}


/* =========================================================
   AESTHETICS MIX — PRUEBA LEGAL ES v5 · ANCHO COMPLETO
   Fondo chocolate y separador degradado a todo el viewport.
   El contenido interior conserva su ancho y alineación.
   ========================================================= */
body.legal-document-page .legal-hub{
  position:relative !important;
  left:50% !important;
  width:100vw !important;
  max-width:none !important;
  margin-left:-50vw !important;
  margin-right:0 !important;
}
body.legal-document-page .legal-rule{
  position:relative !important;
  left:50% !important;
  width:100vw !important;
  max-width:none !important;
  height:25px !important;
  margin:32px 0 -32px !important;
  transform:translateX(-50%) !important;
  background:url("../images/degradado.webp") center center / 100% 25px no-repeat !important;
}
@media(max-width:768px){
  body.legal-document-page .legal-rule{
    width:100vw !important;
    max-width:none !important;
    transform:translateX(-50%) !important;
  }
}


/* =========================================================
   AESTHETICS MIX — LEGAL ES v6 · CABECERA DINÁMICA REAL
   ========================================================= */

/* La zona corporativa queda fija al hacer scroll.
   El documento claro se desplaza por detrás. */
@media (min-width:769px){
  body.legal-document-page{
    overflow-x:hidden;
  }

  body.legal-document-page .legal-hub{
    position:sticky !important;
    top:0 !important;
    z-index:900 !important;
    left:50% !important;
    width:100vw !important;
    max-width:none !important;
    margin-left:-50vw !important;
    margin-right:0 !important;
  }

  /* El menú permanece por encima del bloque sticky. */
  body.legal-document-page #header{
    position:fixed !important;
    top:0 !important;
    left:0 !important;
    right:0 !important;
    width:100% !important;
    height:64px !important;
    padding:0 !important;
    background:transparent !important;
    z-index:1100 !important;
    pointer-events:none;
  }

  /* Misma retícula horizontal que el contenido legal.
     Menú compacto y pegado al borde derecho útil. */
  body.legal-document-page #menu{
    position:relative !important;
    top:0 !important;
    right:auto !important;
    left:50% !important;
    transform:translateX(-50%) !important;
    width:min(1120px,calc(100% - 48px)) !important;
    height:64px !important;
    padding:0 !important;
    margin:0 !important;
    display:flex !important;
    justify-content:flex-end !important;
    align-items:center !important;
    background:transparent !important;
    pointer-events:auto;
  }

  body.legal-document-page #menu .menu-list{
    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;
    gap:2px !important;
    margin:0 !important;
    padding:0 !important;
    width:auto !important;
  }

  body.legal-document-page #menu .menu-list > li{
    margin:0 !important;
    padding:0 !important;
  }

  body.legal-document-page #menu .menu-list > li > a{
    margin:0 !important;
    padding:9px 10px !important;
    white-space:nowrap !important;
  }

  /* Selector de idioma: sin margen lateral innecesario. */
  body.legal-document-page #menu .language-dropdown{
    margin-left:4px !important;
    display:flex !important;
    align-items:center !important;
  }

  body.legal-document-page #menu .language-dropdown > .main-flag{
    margin:0 2px 0 4px !important;
  }

  /* Retícula del bloque legal. Añadimos aire real bajo el menú. */
  body.legal-document-page .legal-hub-shell{
    width:min(1120px,calc(100% - 48px)) !important;
    margin:0 auto !important;
    padding:82px 0 32px !important;
  }

  /* Logo en la misma vertical del título, no flotando en el borde del viewport. */
  body.legal-document-page .legal-brand-logo{
    width:116px;
    margin:0 0 26px 0;
  }

  body.legal-document-page .legal-brand-logo a{
    display:block;
    width:100%;
  }

  body.legal-document-page .legal-brand-logo img{
    display:block;
    width:116px;
    height:auto;
    max-width:100%;
  }

  /* Más respiro entre la franja de navegación y el comienzo editorial. */
  body.legal-document-page .legal-eyebrow{
    margin-top:0 !important;
  }

  /* El separador pertenece al bloque fijo y sigue siendo 100vw × 25 px. */
  body.legal-document-page .legal-rule{
    position:relative !important;
    left:50% !important;
    width:100vw !important;
    max-width:none !important;
    height:25px !important;
    margin:32px 0 -32px !important;
    transform:translateX(-50%) !important;
    background:url("../images/degradado.webp") center center / 100% 25px no-repeat !important;
  }

  /* El cuerpo claro queda debajo del sticky. */
  body.legal-document-page main{
    position:relative !important;
    z-index:1 !important;
  }
}

/* En móvil no hacemos sticky toda la cabecera:
   preservamos el menú hamburguesa y la lectura ya validados. */
@media(max-width:768px){
  body.legal-document-page .legal-brand-logo{
    width:92px;
    margin:0 0 20px 0;
  }
  body.legal-document-page .legal-brand-logo img{
    width:92px;
    height:auto;
    display:block;
  }
}


/* =========================================================
   AESTHETICS MIX — LEGAL ES v7 · LOGO FLOTANTE / HERO COMPACTO
   Implementación real sobre las páginas ES.
   ========================================================= */

@media (min-width:769px){
  /* Hero sticky más compacto. */
  body.legal-document-page .legal-hub{
    position:sticky !important;
    top:0 !important;
    z-index:900 !important;
    left:50% !important;
    width:100vw !important;
    max-width:none !important;
    margin-left:-50vw !important;
    margin-right:0 !important;
  }

  /* Retícula editorial única y centrada. */
  body.legal-document-page .legal-hub-shell{
    position:relative !important;
    width:min(1120px,calc(100% - 48px)) !important;
    margin:0 auto !important;
    padding:104px 0 28px !important;
  }

  /* Logo flotante: no consume altura del flujo.
     Alineado ópticamente a la izquierda de la retícula editorial. */
  body.legal-document-page .legal-brand-logo{
    position:absolute !important;
    top:54px !important;
    left:-148px !important;
    width:124px !important;
    margin:0 !important;
    z-index:2 !important;
  }
  body.legal-document-page .legal-brand-logo a{
    display:block !important;
    width:100% !important;
  }
  body.legal-document-page .legal-brand-logo img{
    display:block !important;
    width:124px !important;
    height:auto !important;
    max-width:none !important;
  }

  /* El bloque editorial vuelve a empezar sin el hueco que antes ocupaba el logo. */
  body.legal-document-page .legal-eyebrow{
    margin:0 0 8px !important;
  }
  body.legal-document-page .legal-hub h1{
    margin-bottom:10px !important;
  }
  body.legal-document-page .legal-summary{
    margin-bottom:24px !important;
  }

  /* Tarjetas ligeramente más compactas sin cambiar su lenguaje visual. */
  body.legal-document-page .legal-select-card,
  body.legal-document-page .legal-download-card{
    padding:16px 18px !important;
  }
  body.legal-document-page .legal-select{
    min-height:42px !important;
  }

  /* Menú compacto y alineado al borde derecho de la MISMA retícula. */
  body.legal-document-page #menu{
    position:relative !important;
    top:0 !important;
    left:50% !important;
    right:auto !important;
    transform:translateX(-50%) !important;
    width:min(1120px,calc(100% - 48px)) !important;
    height:58px !important;
    padding:0 !important;
    margin:0 !important;
    display:flex !important;
    justify-content:flex-end !important;
    align-items:center !important;
    background:transparent !important;
  }
  body.legal-document-page #header{
    height:58px !important;
  }
  body.legal-document-page #menu .menu-list{
    gap:0 !important;
  }
  body.legal-document-page #menu .menu-list > li > a{
    padding:8px 9px !important;
  }

  /* Separador pegado al final del hero para reducir altura visual. */
  body.legal-document-page .legal-rule{
    height:25px !important;
    margin:26px 0 -28px !important;
  }
}

/* Cuando la ventana no permite sacar el logo fuera de la retícula,
   lo hacemos flotar DENTRO sin descentrar el contenido. */
@media (min-width:769px) and (max-width:1450px){
  body.legal-document-page .legal-hub-shell{
    width:min(1040px,calc(100% - 220px)) !important;
  }
  body.legal-document-page #menu{
    width:min(1040px,calc(100% - 220px)) !important;
  }
  body.legal-document-page .legal-brand-logo{
    left:-142px !important;
    width:118px !important;
  }
  body.legal-document-page .legal-brand-logo img{
    width:118px !important;
  }
}

/* Tablet/móvil: logo vuelve al flujo, evitando solapes con hamburguesa. */
@media(max-width:768px){
  body.legal-document-page .legal-brand-logo{
    position:static !important;
    width:104px !important;
    margin:0 0 18px 0 !important;
  }
  body.legal-document-page .legal-brand-logo img{
    width:104px !important;
    height:auto !important;
  }
}


/* =========================================================
   AESTHETICS MIX — LEGAL ES v8
   CENTRADO REAL + HERO COMPACTO + MÓVIL REDUCIDO
   ========================================================= */

/* La página legal deja de depender del max-width del #contenedor
   para calcular el centro del hero. */
body.legal-document-page #contenedor{
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
  overflow:visible !important;
}

/* HERO: ancho real disponible, centrado por sí mismo. */
body.legal-document-page .legal-hub{
  box-sizing:border-box !important;
  width:100% !important;
  max-width:none !important;
  left:auto !important;
  right:auto !important;
  margin-left:0 !important;
  margin-right:0 !important;
  transform:none !important;
}

/* RETÍCULA EDITORIAL ÚNICA: exactamente centrada. */
body.legal-document-page .legal-hub-shell{
  box-sizing:border-box !important;
  width:min(1080px,calc(100% - 64px)) !important;
  max-width:1080px !important;
  margin-left:auto !important;
  margin-right:auto !important;
  padding-left:0 !important;
  padding-right:0 !important;
}

/* MENÚ: misma retícula y centro geométrico que el contenido. */
@media (min-width:769px){
  body.legal-document-page #header{
    position:fixed !important;
    top:0 !important;
    left:0 !important;
    right:0 !important;
    width:100% !important;
    height:52px !important;
    z-index:1100 !important;
    background:transparent !important;
  }

  body.legal-document-page #menu{
    position:relative !important;
    left:auto !important;
    right:auto !important;
    top:0 !important;
    transform:none !important;
    width:min(1080px,calc(100% - 64px)) !important;
    max-width:1080px !important;
    height:52px !important;
    margin:0 auto !important;
    padding:0 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;
  }

  body.legal-document-page #menu .menu-list{
    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;
    gap:0 !important;
    margin:0 !important;
    padding:0 !important;
  }

  body.legal-document-page #menu .menu-list > li{
    margin:0 !important;
  }

  body.legal-document-page #menu .menu-list > li > a{
    padding:7px 8px !important;
    margin:0 !important;
    font-size:.88rem !important;
    line-height:1.1 !important;
  }

  /* Hero fijo, pero sensiblemente más bajo. */
  body.legal-document-page .legal-hub{
    position:sticky !important;
    top:0 !important;
    z-index:900 !important;
  }

  body.legal-document-page .legal-hub-shell{
    position:relative !important;
    padding-top:76px !important;
    padding-bottom:22px !important;
  }

  /* Logo flotante más visible, sin aumentar la altura. */
  body.legal-document-page .legal-brand-logo{
    position:absolute !important;
    top:60px !important;
    left:-132px !important;
    width:112px !important;
    margin:0 !important;
  }

  body.legal-document-page .legal-brand-logo img{
    width:112px !important;
    height:auto !important;
    display:block !important;
  }

  /* Tipografía contenida: página legal, no landing page. */
  body.legal-document-page .legal-eyebrow{
    margin:0 0 5px !important;
    font-size:.68rem !important;
    line-height:1.2 !important;
    letter-spacing:.13em !important;
  }

  body.legal-document-page .legal-hub h1{
    margin:0 0 6px !important;
    font-size:clamp(1.85rem,2.5vw,2.55rem) !important;
    line-height:1.05 !important;
  }

  body.legal-document-page .legal-summary{
    max-width:760px !important;
    margin:0 0 18px !important;
    font-size:.88rem !important;
    line-height:1.45 !important;
  }

  body.legal-document-page .legal-toolbar{
    grid-template-columns:minmax(300px,1fr) minmax(360px,1.12fr) !important;
    gap:16px !important;
  }

  body.legal-document-page .legal-select-card,
  body.legal-document-page .legal-download-card{
    border-radius:13px !important;
    padding:13px 15px !important;
  }

  body.legal-document-page .legal-select-label,
  body.legal-document-page .legal-doc-label{
    margin-bottom:5px !important;
    font-size:.66rem !important;
  }

  body.legal-document-page .legal-select{
    min-height:34px !important;
    height:34px !important;
    padding:0 10px !important;
    border-radius:7px !important;
    font-size:.83rem !important;
  }

  body.legal-document-page .legal-doc-title{
    margin-bottom:2px !important;
    font-size:.86rem !important;
  }

  body.legal-document-page .legal-doc-sub{
    font-size:.72rem !important;
    line-height:1.3 !important;
  }

  body.legal-document-page .legal-download{
    min-height:34px !important;
    padding:0 13px !important;
    font-size:.72rem !important;
  }

  /* Separador original, menos aire antes de él. */
  body.legal-document-page .legal-rule{
    left:50% !important;
    width:100vw !important;
    max-width:none !important;
    height:25px !important;
    margin:18px 0 -22px !important;
    transform:translateX(-50%) !important;
    background:url("../images/degradado.webp") center/100% 25px no-repeat !important;
  }

  /* Cuerpo: centrado con independencia del hero. */
  body.legal-document-page main{
    width:100% !important;
    box-sizing:border-box !important;
    padding-top:34px !important;
  }

  body.legal-document-page main > div[id]{
    width:min(980px,calc(100% - 64px)) !important;
    max-width:980px !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }
}

/* Si no hay suficiente margen para sacar el logo fuera,
   se mantiene flotante DENTRO del área chocolate sin desplazar la retícula. */
@media (min-width:769px) and (max-width:1390px){
  body.legal-document-page .legal-hub-shell,
  body.legal-document-page #menu{
    width:min(960px,calc(100% - 180px)) !important;
    max-width:960px !important;
  }

  body.legal-document-page .legal-brand-logo{
    left:-118px !important;
    width:98px !important;
  }

  body.legal-document-page .legal-brand-logo img{
    width:98px !important;
  }
}

/* MÓVIL: el hero no puede ocupar toda la pantalla.
   Se compacta deliberadamente y NO se fija completo. */
@media(max-width:768px){
  body.legal-document-page .legal-hub{
    position:relative !important;
    top:auto !important;
    width:100% !important;
    margin:0 !important;
  }

  body.legal-document-page .legal-hub-shell{
    width:calc(100% - 28px) !important;
    max-width:none !important;
    margin:0 auto !important;
    padding:58px 0 14px !important;
  }

  body.legal-document-page .legal-brand-logo{
    position:absolute !important;
    top:12px !important;
    left:0 !important;
    width:76px !important;
    margin:0 !important;
  }

  body.legal-document-page .legal-brand-logo img{
    width:76px !important;
  }

  body.legal-document-page .legal-eyebrow{
    margin:0 0 4px !important;
    font-size:.60rem !important;
    letter-spacing:.10em !important;
  }

  body.legal-document-page .legal-hub h1{
    margin:0 0 5px !important;
    font-size:1.65rem !important;
    line-height:1.05 !important;
  }

  body.legal-document-page .legal-summary{
    margin:0 0 12px !important;
    font-size:.76rem !important;
    line-height:1.35 !important;
  }

  body.legal-document-page .legal-toolbar{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:8px !important;
  }

  body.legal-document-page .legal-select-card,
  body.legal-document-page .legal-download-card{
    padding:10px 11px !important;
    border-radius:10px !important;
  }

  body.legal-document-page .legal-select-label,
  body.legal-document-page .legal-doc-label{
    margin-bottom:4px !important;
    font-size:.58rem !important;
  }

  body.legal-document-page .legal-select{
    min-height:32px !important;
    height:32px !important;
    font-size:.76rem !important;
  }

  body.legal-document-page .legal-doc-title{
    font-size:.78rem !important;
  }

  body.legal-document-page .legal-doc-sub{
    font-size:.66rem !important;
  }

  body.legal-document-page .legal-download{
    min-height:32px !important;
    padding:0 11px !important;
    font-size:.67rem !important;
  }

  body.legal-document-page .legal-rule{
    left:50% !important;
    width:100vw !important;
    height:25px !important;
    margin:12px 0 -14px !important;
    transform:translateX(-50%) !important;
    background:url("../images/degradado.webp") center/100% 25px no-repeat !important;
  }

  body.legal-document-page main{
    padding-top:24px !important;
  }

  body.legal-document-page main > div[id]{
    width:calc(100% - 24px) !important;
    max-width:none !important;
    margin:0 auto !important;
  }
}


/* =========================================================
   AESTHETICS MIX — LEGAL ES v9
   PATRÓN TIPO ZEISS: SOLO NAV FIJO
   ========================================================= */

/* La cabecera legal completa deja de ser sticky.
   Solo la navegación superior permanece fija. */
body.legal-document-page .legal-hub{
  position:relative !important;
  top:auto !important;
  z-index:1 !important;
  width:100% !important;
  max-width:none !important;
  left:auto !important;
  right:auto !important;
  margin:0 !important;
  transform:none !important;
}

/* El contenido legal se desplaza normalmente. */
body.legal-document-page main{
  position:relative !important;
  z-index:1 !important;
}

/* NAV fijo estilo documental: logo + navegación + idioma. */
@media (min-width:769px){
  body.legal-document-page #header{
    position:fixed !important;
    top:0 !important;
    left:0 !important;
    right:0 !important;
    width:100% !important;
    height:56px !important;
    padding:0 !important;
    margin:0 !important;
    background:var(--tertiary-color,#6C5C54) !important;
    z-index:1200 !important;
    box-shadow:0 1px 0 rgba(255,255,255,.08);
  }

  body.legal-document-page #menu{
    position:relative !important;
    top:0 !important;
    left:auto !important;
    right:auto !important;
    transform:none !important;
    width:min(1120px,calc(100% - 48px)) !important;
    max-width:1120px !important;
    height:56px !important;
    margin:0 auto !important;
    padding:0 !important;
    display:flex !important;
    justify-content:flex-end !important;
    align-items:center !important;
    background:transparent !important;
  }

  body.legal-document-page #menu .menu-list{
    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;
    gap:0 !important;
    margin:0 !important;
    padding:0 !important;
  }

  body.legal-document-page #menu .menu-list > li{
    margin:0 !important;
    padding:0 !important;
  }

  body.legal-document-page #menu .menu-list > li > a{
    margin:0 !important;
    padding:7px 8px !important;
    font-size:.86rem !important;
    line-height:1 !important;
    white-space:nowrap !important;
    color:#fff !important;
  }

  body.legal-document-page #menu .language-dropdown{
    margin-left:4px !important;
  }

  /* El bloque legal empieza debajo del nav fijo y se desplaza. */
  body.legal-document-page .legal-hub-shell{
    position:relative !important;
    width:min(1080px,calc(100% - 64px)) !important;
    max-width:1080px !important;
    margin:0 auto !important;
    padding:86px 0 22px !important;
  }

  /* Logo integrado en el bloque legal, no en la barra fija.
     Sigue flotante para no ganar altura innecesaria. */
  body.legal-document-page .legal-brand-logo{
    position:absolute !important;
    top:74px !important;
    left:-124px !important;
    width:104px !important;
    margin:0 !important;
  }

  body.legal-document-page .legal-brand-logo img{
    width:104px !important;
    height:auto !important;
    display:block !important;
  }

  /* Hero legal compacto */
  body.legal-document-page .legal-eyebrow{
    margin:0 0 4px !important;
    font-size:.66rem !important;
  }

  body.legal-document-page .legal-hub h1{
    margin:0 0 6px !important;
    font-size:clamp(1.75rem,2.35vw,2.4rem) !important;
    line-height:1.05 !important;
  }

  body.legal-document-page .legal-summary{
    margin:0 0 16px !important;
    font-size:.84rem !important;
    line-height:1.4 !important;
  }

  body.legal-document-page .legal-toolbar{
    grid-template-columns:minmax(280px,1fr) minmax(360px,1.1fr) !important;
    gap:14px !important;
  }

  body.legal-document-page .legal-select-card,
  body.legal-document-page .legal-download-card{
    padding:12px 14px !important;
  }

  body.legal-document-page .legal-select{
    min-height:32px !important;
    height:32px !important;
    font-size:.80rem !important;
  }

  body.legal-document-page .legal-doc-title{
    font-size:.82rem !important;
  }

  body.legal-document-page .legal-doc-sub{
    font-size:.69rem !important;
  }

  body.legal-document-page .legal-download{
    min-height:32px !important;
    font-size:.69rem !important;
  }

  body.legal-document-page .legal-rule{
    left:50% !important;
    width:100vw !important;
    max-width:none !important;
    height:25px !important;
    margin:16px 0 -22px !important;
    transform:translateX(-50%) !important;
    background:url("../images/degradado.webp") center/100% 25px no-repeat !important;
  }

  body.legal-document-page main{
    padding-top:32px !important;
  }

  body.legal-document-page main > div[id]{
    width:min(980px,calc(100% - 64px)) !important;
    max-width:980px !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }
}

/* Ajuste cuando el viewport no permite logo fuera de retícula */
@media (min-width:769px) and (max-width:1370px){
  body.legal-document-page .legal-hub-shell,
  body.legal-document-page #menu{
    width:min(960px,calc(100% - 170px)) !important;
    max-width:960px !important;
  }

  body.legal-document-page .legal-brand-logo{
    left:-112px !important;
    width:94px !important;
  }

  body.legal-document-page .legal-brand-logo img{
    width:94px !important;
  }
}

/* MÓVIL: solo la barra nav/hamburguesa permanece fija.
   Todo el contenido legal se desplaza. */
@media(max-width:768px){
  body.legal-document-page #header{
    position:fixed !important;
    top:0 !important;
    left:0 !important;
    right:0 !important;
    width:100% !important;
    min-height:52px !important;
    background:var(--tertiary-color,#6C5C54) !important;
    z-index:1200 !important;
  }

  body.legal-document-page .legal-hub{
    position:relative !important;
    top:auto !important;
    margin:0 !important;
  }

  body.legal-document-page .legal-hub-shell{
    width:calc(100% - 28px) !important;
    max-width:none !important;
    margin:0 auto !important;
    padding:70px 0 14px !important;
  }

  body.legal-document-page .legal-brand-logo{
    position:static !important;
    width:76px !important;
    margin:0 0 10px 0 !important;
  }

  body.legal-document-page .legal-brand-logo img{
    width:76px !important;
  }

  body.legal-document-page .legal-hub h1{
    font-size:1.55rem !important;
    margin-bottom:4px !important;
  }

  body.legal-document-page .legal-summary{
    font-size:.74rem !important;
    margin-bottom:10px !important;
  }

  body.legal-document-page .legal-toolbar{
    grid-template-columns:1fr !important;
    gap:7px !important;
  }

  body.legal-document-page .legal-select-card,
  body.legal-document-page .legal-download-card{
    padding:9px 10px !important;
  }

  body.legal-document-page .legal-rule{
    left:50% !important;
    width:100vw !important;
    height:25px !important;
    margin:10px 0 -14px !important;
    transform:translateX(-50%) !important;
  }

  body.legal-document-page main{
    padding-top:22px !important;
  }
}


/* =========================================================
   AESTHETICS MIX — LEGAL ES v10
   LOGO INTEGRADO EN NAV FIJO
   ========================================================= */

/* El viejo logo flotante del hero queda definitivamente anulado. */
body.legal-document-page .legal-brand-logo{
  display:none !important;
}

/* Barra fija: logo izquierda, navegación derecha. */
@media (min-width:769px){
  body.legal-document-page #header{
    position:fixed !important;
    top:0 !important;
    left:0 !important;
    right:0 !important;
    width:100% !important;
    height:64px !important;
    padding:0 !important;
    margin:0 !important;
    background:var(--tertiary-color,#6C5C54) !important;
    z-index:1200 !important;
    box-shadow:0 1px 0 rgba(255,255,255,.08) !important;
  }

  /* Logo fijo alineado al borde izquierdo de la misma retícula */
  body.legal-document-page .legal-nav-logo{
    position:absolute !important;
    left:50% !important;
    top:50% !important;
    transform:translate(-560px,-50%) !important;
    width:88px !important;
    height:54px !important;
    display:flex !important;
    align-items:center !important;
    z-index:2 !important;
  }

  body.legal-document-page .legal-nav-logo a{
    display:block !important;
    width:88px !important;
  }

  body.legal-document-page .legal-nav-logo img{
    display:block !important;
    width:88px !important;
    height:auto !important;
    max-height:54px !important;
    object-fit:contain !important;
  }

  body.legal-document-page #menu{
    position:relative !important;
    top:0 !important;
    left:auto !important;
    right:auto !important;
    transform:none !important;
    width:min(1120px,calc(100% - 48px)) !important;
    max-width:1120px !important;
    height:64px !important;
    margin:0 auto !important;
    padding:0 !important;
    display:flex !important;
    justify-content:flex-end !important;
    align-items:center !important;
    background:transparent !important;
  }

  body.legal-document-page #menu .menu-list{
    margin-left:120px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;
    gap:0 !important;
  }

  body.legal-document-page #menu .menu-list > li > a{
    padding:7px 8px !important;
    font-size:.86rem !important;
  }

  /* El hero ya no reserva espacio para logo flotante. */
  body.legal-document-page .legal-hub-shell{
    width:min(1080px,calc(100% - 64px)) !important;
    max-width:1080px !important;
    margin:0 auto !important;
    padding:86px 0 22px !important;
  }
}

/* En pantallas intermedias el logo se alinea a la retícula disponible. */
@media (min-width:769px) and (max-width:1200px){
  body.legal-document-page .legal-nav-logo{
    left:24px !important;
    transform:translateY(-50%) !important;
  }

  body.legal-document-page #menu{
    width:calc(100% - 48px) !important;
    max-width:none !important;
  }

  body.legal-document-page #menu .menu-list{
    margin-left:108px !important;
  }
}

/* MÓVIL:
   logo siempre visible a la izquierda;
   hamburguesa a la derecha;
   menú desplegable conserva su comportamiento ya validado. */
@media(max-width:768px){
  body.legal-document-page #header{
    position:fixed !important;
    top:0 !important;
    left:0 !important;
    right:0 !important;
    width:100% !important;
    min-height:56px !important;
    background:var(--tertiary-color,#6C5C54) !important;
    z-index:1200 !important;
  }

  body.legal-document-page .legal-nav-logo{
    position:fixed !important;
    top:5px !important;
    left:14px !important;
    width:72px !important;
    height:46px !important;
    z-index:1300 !important;
    display:flex !important;
    align-items:center !important;
  }

  body.legal-document-page .legal-nav-logo a{
    display:block !important;
    width:72px !important;
  }

  body.legal-document-page .legal-nav-logo img{
    display:block !important;
    width:72px !important;
    height:auto !important;
    max-height:46px !important;
    object-fit:contain !important;
  }

  /* El menú/hamburguesa mantiene margen para no pisar el logo. */
  body.legal-document-page #menu{
    min-height:56px !important;
  }

  body.legal-document-page #menu .hamburger{
    position:fixed !important;
    top:8px !important;
    right:16px !important;
    z-index:1300 !important;
  }

  /* El contenido legal empieza debajo de la barra fija. */
  body.legal-document-page .legal-hub-shell{
    padding-top:70px !important;
  }
}


/* =========================================================
   AESTHETICS MIX — LEGAL ES v11
   ISOTIPO BLANCO EN NAV FIJO
   ========================================================= */

@media (min-width:769px){
  body.legal-document-page .legal-nav-logo{
    width:46px !important;
    height:52px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
  }

  body.legal-document-page .legal-nav-logo a{
    width:46px !important;
    height:52px !important;
    display:flex !important;
    align-items:center !important;
  }

  body.legal-document-page .legal-nav-logo img{
    width:46px !important;
    height:42px !important;
    max-height:42px !important;
    object-fit:contain !important;
  }

  body.legal-document-page #menu .menu-list{
    margin-left:72px !important;
  }
}

@media (min-width:769px) and (max-width:1200px){
  body.legal-document-page .legal-nav-logo{
    left:24px !important;
    transform:translateY(-50%) !important;
    width:44px !important;
  }

  body.legal-document-page .legal-nav-logo a{
    width:44px !important;
  }

  body.legal-document-page .legal-nav-logo img{
    width:44px !important;
    height:40px !important;
  }

  body.legal-document-page #menu .menu-list{
    margin-left:66px !important;
  }
}

@media(max-width:768px){
  body.legal-document-page .legal-nav-logo{
    top:6px !important;
    left:14px !important;
    width:40px !important;
    height:44px !important;
  }

  body.legal-document-page .legal-nav-logo a{
    width:40px !important;
    height:44px !important;
    display:flex !important;
    align-items:center !important;
  }

  body.legal-document-page .legal-nav-logo img{
    width:40px !important;
    height:38px !important;
    max-height:38px !important;
    object-fit:contain !important;
  }
}


/* =========================================================
   AESTHETICS MIX — LEGAL ES v12
   NAV CHOCOLATE + ISOTIPO ® + DEGRADADO FIJO + CUERPO CLARO
   ========================================================= */

:root{
  --legal-nav-h: 60px;
  --legal-rule-h: 25px;
}

/* 1) NAV fija y compacta */
body.legal-document-page #header{
  position:fixed !important;
  top:0 !important;
  left:0 !important;
  right:0 !important;
  width:100% !important;
  height:var(--legal-nav-h) !important;
  min-height:var(--legal-nav-h) !important;
  padding:0 !important;
  margin:0 !important;
  background:var(--tertiary-color,#6C5C54) !important;
  z-index:1200 !important;
  box-shadow:none !important;
}

/* 2) El degradado original pasa a ser el remate fijo del NAV */
body.legal-document-page #header::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:100%;
  width:100%;
  height:var(--legal-rule-h);
  background:url("../images/degradado.webp") center center / 100% 25px no-repeat;
  pointer-events:none;
}

/* El separador antiguo dentro del hero deja de mostrarse */
body.legal-document-page .legal-rule{
  display:none !important;
}

/* 3) Logo: isotipo blanco + ®, integrado en la barra */
@media (min-width:769px){
  body.legal-document-page .legal-nav-logo{
    position:absolute !important;
    left:50% !important;
    top:50% !important;
    transform:translate(-560px,-50%) !important;
    width:54px !important;
    height:50px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    z-index:2 !important;
  }

  body.legal-document-page .legal-nav-logo a{
    display:flex !important;
    align-items:center !important;
    width:54px !important;
    height:50px !important;
  }

  body.legal-document-page .legal-nav-logo img{
    display:block !important;
    width:54px !important;
    height:44px !important;
    max-height:44px !important;
    object-fit:contain !important;
  }

  body.legal-document-page #menu{
    position:relative !important;
    left:auto !important;
    right:auto !important;
    top:0 !important;
    transform:none !important;
    width:min(1120px,calc(100% - 48px)) !important;
    max-width:1120px !important;
    height:var(--legal-nav-h) !important;
    margin:0 auto !important;
    padding:0 !important;
    display:flex !important;
    justify-content:flex-end !important;
    align-items:center !important;
    background:transparent !important;
  }

  body.legal-document-page #menu .menu-list{
    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;
    gap:0 !important;
    margin:0 0 0 78px !important;
    padding:0 !important;
  }

  body.legal-document-page #menu .menu-list > li > a{
    color:#fff !important;
    padding:7px 8px !important;
    margin:0 !important;
    font-size:.86rem !important;
    line-height:1 !important;
    white-space:nowrap !important;
  }
}

/* 4) El hero legal deja de ser chocolate: todo el documento respira sobre fondo claro */
body.legal-document-page .legal-hub{
  position:relative !important;
  top:auto !important;
  left:auto !important;
  right:auto !important;
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
  transform:none !important;
  background:var(--primary-color,#f3f1ef) !important;
  color:var(--text-color,#333) !important;
  z-index:1 !important;
}

body.legal-document-page .legal-hub-shell{
  position:relative !important;
  width:min(1080px,calc(100% - 64px)) !important;
  max-width:1080px !important;
  margin:0 auto !important;
  padding:calc(var(--legal-nav-h) + var(--legal-rule-h) + 32px) 0 22px !important;
}

/* Anulamos definitivamente cualquier logo antiguo en el contenido */
body.legal-document-page .legal-brand-logo{
  display:none !important;
}

body.legal-document-page .legal-eyebrow{
  color:var(--text-color,#333) !important;
  opacity:.78 !important;
  margin:0 0 5px !important;
  font-size:.66rem !important;
  line-height:1.2 !important;
  letter-spacing:.13em !important;
}

body.legal-document-page .legal-hub h1{
  color:var(--text-color,#333) !important;
  margin:0 0 7px !important;
  font-size:clamp(1.75rem,2.3vw,2.35rem) !important;
  line-height:1.06 !important;
}

body.legal-document-page .legal-summary{
  color:var(--text-color,#333) !important;
  opacity:.84 !important;
  margin:0 0 17px !important;
  max-width:780px !important;
  font-size:.83rem !important;
  line-height:1.42 !important;
}

/* 5) Tarjetas legales discretas sobre el mismo fondo claro */
body.legal-document-page .legal-toolbar{
  grid-template-columns:minmax(280px,1fr) minmax(360px,1.1fr) !important;
  gap:14px !important;
}

body.legal-document-page .legal-select-card,
body.legal-document-page .legal-download-card{
  background:#fff !important;
  color:var(--text-color,#333) !important;
  border:1px solid rgba(108,92,84,.13) !important;
  border-radius:12px !important;
  padding:12px 14px !important;
  box-shadow:0 5px 16px rgba(58,44,37,.06) !important;
}

body.legal-document-page .legal-select-label,
body.legal-document-page .legal-doc-label,
body.legal-document-page .legal-doc-title{
  color:var(--text-color,#333) !important;
}

body.legal-document-page .legal-doc-sub{
  color:#6C5C54 !important;
}

/* 6) Cuerpo del documento: mismo fondo continuo, sin salto cromático */
body.legal-document-page main{
  position:relative !important;
  z-index:1 !important;
  width:100% !important;
  box-sizing:border-box !important;
  background:var(--primary-color,#f3f1ef) !important;
  padding-top:24px !important;
}

body.legal-document-page main > div[id]{
  width:min(980px,calc(100% - 64px)) !important;
  max-width:980px !important;
  margin-left:auto !important;
  margin-right:auto !important;
}

/* Escritorio intermedio */
@media (min-width:769px) and (max-width:1200px){
  body.legal-document-page .legal-nav-logo{
    left:24px !important;
    transform:translateY(-50%) !important;
    width:50px !important;
  }

  body.legal-document-page .legal-nav-logo a,
  body.legal-document-page .legal-nav-logo img{
    width:50px !important;
  }

  body.legal-document-page #menu{
    width:calc(100% - 48px) !important;
    max-width:none !important;
  }
}

/* 7) MÓVIL: barra muy compacta, isotipo visible y degradado inmediatamente debajo */
@media(max-width:768px){
  :root{
    --legal-nav-h: 54px;
    --legal-rule-h: 18px;
  }

  body.legal-document-page #header{
    height:var(--legal-nav-h) !important;
    min-height:var(--legal-nav-h) !important;
  }

  body.legal-document-page #header::after{
    height:var(--legal-rule-h) !important;
    background-size:100% 18px !important;
  }

  body.legal-document-page .legal-nav-logo{
    position:fixed !important;
    top:5px !important;
    left:14px !important;
    width:44px !important;
    height:44px !important;
    z-index:1300 !important;
    display:flex !important;
    align-items:center !important;
  }

  body.legal-document-page .legal-nav-logo a{
    display:flex !important;
    align-items:center !important;
    width:44px !important;
    height:44px !important;
  }

  body.legal-document-page .legal-nav-logo img{
    width:44px !important;
    height:38px !important;
    max-height:38px !important;
    object-fit:contain !important;
  }

  body.legal-document-page #menu .hamburger{
    position:fixed !important;
    top:7px !important;
    right:14px !important;
    z-index:1300 !important;
  }

  body.legal-document-page .legal-hub-shell{
    width:calc(100% - 28px) !important;
    max-width:none !important;
    margin:0 auto !important;
    padding:calc(var(--legal-nav-h) + var(--legal-rule-h) + 18px) 0 13px !important;
  }

  body.legal-document-page .legal-eyebrow{
    font-size:.58rem !important;
    margin-bottom:4px !important;
  }

  body.legal-document-page .legal-hub h1{
    font-size:1.48rem !important;
    margin-bottom:4px !important;
  }

  body.legal-document-page .legal-summary{
    font-size:.72rem !important;
    line-height:1.35 !important;
    margin-bottom:10px !important;
  }

  body.legal-document-page .legal-toolbar{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:7px !important;
  }

  body.legal-document-page .legal-select-card,
  body.legal-document-page .legal-download-card{
    padding:9px 10px !important;
    border-radius:9px !important;
  }

  body.legal-document-page main{
    padding-top:16px !important;
  }

  body.legal-document-page main > div[id]{
    width:calc(100% - 24px) !important;
    max-width:none !important;
    margin:0 auto !important;
  }
}



/* v13.1 — alineación consistente del bloque DOCUMENTO OFICIAL */
.legal-download-card .legal-doc-row,
.legal-download-card .legal-doc-meta,
.legal-download-card .legal-doc-title,
.legal-download-card .legal-doc-sub {
  text-align: left !important;
}
.legal-download-card .legal-doc-meta {
  align-items: flex-start !important;
}