/* =============================================================================
   Documentos legales (page-legal.php)
   Documento de consulta: fondo blanco, un solo eje de alineación, sin rejilla
   oscura ni animaciones. Todo va bajo .page-template-page-legal para no tocar
   ninguna otra página.
   ========================================================================== */

.page-template-page-legal,
.page-template-page-legal #content,
.page-template-page-legal .site-content{background:#fff}

/* Astra encierra el contenido en .ast-container, que es flex y encoge a sus
   ítems: se sale a sangre como .gi-cat y se vuelve a centrar dentro. */
.page-template-page-legal .legal{
  width:100vw;min-width:100vw;margin-left:calc(50% - 50vw);
  color:var(--gi-texto);font-family:var(--gi-cuerpo);
}
.legal__cabecera-int,
.legal__cuerpo{max-width:1180px;margin-inline:auto;padding-inline:var(--gi-gutter)}

/* --- Cabecera del documento ---------------------------------------------- */
.legal__cabecera{border-bottom:1px solid var(--gi-linea);padding-block:clamp(2rem,1.5rem + 2vw,3.5rem) 1.25rem}
.legal__etiqueta{
  margin:0 0 .5rem;font-family:var(--gi-titular);font-size:var(--gi-t-xs);font-weight:600;
  letter-spacing:.14em;text-transform:uppercase;color:var(--gi-verde-oscuro);
}
.legal__titulo{
  margin:0;font-family:var(--gi-titular);font-weight:600;font-size:var(--gi-t-xl);
  line-height:1.2;color:var(--gi-texto);
}
.legal__fecha{margin:.75rem 0 0;font-size:var(--gi-t-s);color:var(--gi-texto-suave)}

.legal__docs{margin-top:1.5rem}
.legal__docs ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.25rem 1.5rem}
.legal__docs a{
  display:inline-block;padding:.35rem 0;font-size:var(--gi-t-s);
  color:var(--gi-texto-suave);text-decoration:none;border-bottom:2px solid transparent;
}
.legal__docs a:hover{color:var(--gi-texto);border-bottom-color:var(--gi-linea)}
.legal__docs a[aria-current="page"]{color:var(--gi-texto);font-weight:600;border-bottom-color:var(--gi-verde)}

/* --- Cuerpo: índice + texto ---------------------------------------------- */
.legal__cuerpo{padding-block:2rem clamp(3rem,2rem + 4vw,5rem)}

.legal__indice{border:1px solid var(--gi-linea);border-radius:var(--gi-radio);padding:.75rem 1rem;margin-bottom:2rem}
.legal__indice summary{
  cursor:pointer;font-family:var(--gi-titular);font-weight:600;font-size:var(--gi-t-s);color:var(--gi-texto);
}
.legal__indice ol{list-style:none;margin:.75rem 0 0;padding:0}
.legal__indice li{margin:0}
.legal__indice a{
  display:block;padding:.3rem 0;font-size:var(--gi-t-s);line-height:1.4;
  color:var(--gi-texto-suave);text-decoration:none;
}
.legal__indice a:hover{color:var(--gi-texto);text-decoration:underline}
/* En el índice el número es texto pequeño: el verde de marca sobre blanco da
   3,1:1 y no llega a 4,5:1, así que aquí va el verde oscuro. */
.legal__indice .legal__num{color:var(--gi-verde-oscuro);font-weight:600}

@media (min-width:64rem){
  .legal__cuerpo{display:grid;grid-template-columns:15rem minmax(0,72ch);gap:3.5rem;align-items:start}
  .legal__cuerpo--sin-indice{grid-template-columns:minmax(0,72ch)}
  .legal__aside{position:sticky;top:calc(var(--gi-alto-cabecera,80px) + 1.5rem)}
  .legal__indice{border:0;border-left:1px solid var(--gi-linea);border-radius:0;padding:0 0 0 1rem;margin:0}
  /* En escritorio el índice va siempre abierto (lo abre legal.js): el
     summary no aporta nada. */
  .legal__indice summary{list-style:none;pointer-events:none;margin-bottom:.25rem}
  .legal__indice summary::-webkit-details-marker{display:none}
  .legal__indice ol{margin-top:.25rem}
}

/* --- Texto: un solo eje de alineación ------------------------------------
   Todo empieza en el mismo margen izquierdo. Astra da a ul/ol un margen de
   3em y el tema hijo centra cada hijo de .entry-content; aquí no hay
   .entry-content y las listas se reinician: la viñeta cae en el eje y el
   texto justo a su derecha. */
.legal__texto{max-width:72ch;font-size:var(--gi-t-m);line-height:1.7}
.legal__texto > *{margin-inline:0}
.legal__texto p{margin:0 0 1em}
.legal__texto ul,
.legal__texto ol{margin:0 0 1.25em;padding-left:1.25em}
.legal__texto li{margin:0 0 .4em}
.legal__texto li > p{margin:0 0 .4em}
.legal__texto li > ul,
.legal__texto li > ol{margin:.4em 0 .4em}

.legal__texto h2{
  font-family:var(--gi-titular);font-weight:600;
  /* ≥ 24 px siempre: la numeración va en verde de marca (3,1:1 sobre
     blanco), que solo vale para texto grande. */
  font-size:max(1.5rem, var(--gi-t-l));line-height:1.3;
  margin:2.75rem 0 1rem;padding-bottom:.5rem;border-bottom:1px solid var(--gi-linea);
  color:var(--gi-texto);scroll-margin-top:calc(var(--gi-alto-cabecera,80px) + 1rem);
}
.legal__texto > h2:first-child{margin-top:0}
.legal__texto h2 .legal__num{color:var(--gi-verde);margin-right:.15em}
.legal__texto h3{
  font-family:var(--gi-titular);font-weight:600;font-size:1.125rem;line-height:1.35;
  margin:2.25rem 0 .75rem;color:var(--gi-texto);
}

.legal__texto a{color:var(--gi-verde-oscuro);text-decoration:underline;text-underline-offset:.15em}
.legal__texto code{
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.88em;
  background:var(--gi-fondo);border:1px solid var(--gi-linea);border-radius:4px;padding:.05em .3em;
}

/* Datos de contacto del aviso legal */
.legal-contacto{margin:0 0 1.25em;display:grid;grid-template-columns:1fr;gap:.15rem 1.5rem}
.legal-contacto dt{font-weight:600;margin:0}
.legal-contacto dd{margin:0 0 .6rem}
@media (min-width:40rem){
  .legal-contacto{grid-template-columns:max-content 1fr}
  .legal-contacto dd{margin:0}
}

/* Tablas: en móvil desplaza la tabla, no la página */
.legal-tabla{overflow-x:auto;margin:0 0 1.5em}
.legal-tabla table{border-collapse:collapse;width:100%;min-width:32rem;font-size:var(--gi-t-s);line-height:1.5}
.legal-tabla th,
.legal-tabla td{text-align:left;vertical-align:top;padding:.6rem .75rem;border-bottom:1px solid var(--gi-linea)}
.legal-tabla th{font-family:var(--gi-titular);font-weight:600;background:var(--gi-fondo)}

/* Botón «Cambiar mis preferencias de cookies» (páginas 70 y 71). La clase
   cky-banner-element es la que escucha CookieYes para reabrir el panel; el
   aspecto es el del botón global primario (.gi-cta--primario, tokens.css). Va
   con la cadena completa de clases para ganar a los estilos de botón de Astra. */
.page-template-page-legal .legal__cuerpo .cky-banner-element{
  display:inline-block;margin:.25rem 0 1.5em;padding:.85em 1.6em;
  font-family:var(--gi-titular);font-weight:600;font-size:var(--gi-t-s);
  letter-spacing:.01em;line-height:1.3;text-transform:none;
  color:#fff;background:var(--gi-verde);border:2px solid var(--gi-verde);
  border-radius:var(--gi-radio);box-shadow:none;cursor:pointer;transition:.18s ease;
}
.page-template-page-legal .legal__cuerpo .cky-banner-element:hover,
.page-template-page-legal .legal__cuerpo .cky-banner-element:active{
  color:#fff;background:var(--gi-verde-oscuro);border-color:var(--gi-verde-oscuro);
}

/* Marcadores pendientes ⟦…⟧: que no se escapen al publicar */
.legal-placeholder{
  background:#FFF1C2;border:1px solid #D9A400;border-radius:3px;
  padding:0 .25em;color:#4A3800;font-weight:600;
}