/* ============================================
   Wazo · legal.css
   Páginas de texto legal (plantilla "Legal (texto)").
   Master grid 12-col · contenido en cols 2-11 (mismo sistema que nosotros).
   Scope: body.wazo-page-legal
   ============================================ */

.wazo-page-legal .wazo-legal {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    column-gap: var(--wazo-grid-gutter);
}
.wazo-legal > section {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: subgrid;
    column-gap: var(--wazo-grid-gutter);
    position: relative;
}

/* ============================================
   1 · HEAD · eyebrow + H1 + fecha · divisora inferior
   ============================================ */
.wazo-legal__head {
    padding-block: var(--wazo-sp-section-block);
}
.wazo-legal__head::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: var(--wazo-grid-margin);
    right: var(--wazo-grid-margin);
    height: 1px;
    background: var(--wazo-color-ui-border);
}
.wazo-legal__head-inner {
    grid-column: 2 / 12;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--wazo-sp-phone-sm);
}
.wazo-legal__eyebrow {
    font-size: var(--wazo-fs-14);
    letter-spacing: var(--wazo-ls-display);
    line-height: var(--wazo-lh-none);
    color: var(--wazo-color-text);
    opacity: 0.85;
    margin: 0;
}
.wazo-legal__title {
    font-family: var(--wazo-font-sans);
    font-weight: var(--wazo-font-weight-medium);
    font-size: var(--wazo-fs-display-xl);
    line-height: var(--wazo-lh-display);
    letter-spacing: var(--wazo-ls-display);
    color: var(--wazo-color-text);
    margin: 0;
    text-wrap: balance;
}
.wazo-legal__updated {
    font-size: var(--wazo-fs-14);
    line-height: var(--wazo-lh-tight);
    letter-spacing: var(--wazo-ls-display);
    color: var(--wazo-color-text-sub);
    margin: 0;
}

/* ============================================
   2 · BODY (WYSIWYG) · cols 2-11, ancho legible
   ============================================ */
.wazo-legal__body-sec {
    padding-block: var(--wazo-sp-section-block);
}
.wazo-legal__body {
    grid-column: 2 / 12;
    max-width: 72ch;                 /* line-length legible dentro del grid 2-11 */
    color: rgba(255, 255, 255, 0.75);
    font-size: var(--wazo-fs-16);
    letter-spacing: var(--wazo-ls-display);
}

/* Tipografía del contenido enriquecido · canon: títulos lh-display, párrafos
   lh-body. Los <p> llevan line-height EXPLÍCITO porque el reset global
   * { line-height: none } gana al heredado (gotcha del proyecto). */
.wazo-legal__body h2 {
    font-size: var(--wazo-fs-32);
    line-height: var(--wazo-lh-display);
    font-weight: var(--wazo-font-weight-medium);
    color: var(--wazo-color-text);
    margin: var(--wazo-sp-phone-lg) 0 var(--wazo-sp-phone-sm);
}
.wazo-legal__body h3 {
    font-size: var(--wazo-fs-20);
    line-height: var(--wazo-lh-display);
    font-weight: var(--wazo-font-weight-medium);
    color: var(--wazo-color-text);
    margin: var(--wazo-sp-phone-md) 0 var(--wazo-sp-phone-xs);
}
.wazo-legal__body h4 {
    font-size: var(--wazo-fs-16);
    line-height: var(--wazo-lh-display);
    font-weight: var(--wazo-font-weight-medium);
    color: var(--wazo-color-text);
    margin: var(--wazo-sp-phone-md) 0 var(--wazo-sp-phone-xs);
}
.wazo-legal__body p {
    line-height: var(--wazo-lh-body);
    margin: 0 0 var(--wazo-sp-phone-sm);
}
.wazo-legal__body ul,
.wazo-legal__body ol {
    margin: 0 0 var(--wazo-sp-phone-sm);
    padding-left: var(--wazo-sp-phone-md);
}
.wazo-legal__body li {
    line-height: var(--wazo-lh-body);
    margin-bottom: var(--wazo-sp-phone-xs);
}
.wazo-legal__body ul li { list-style: disc; }
.wazo-legal__body ol li { list-style: decimal; }
.wazo-legal__body strong { color: var(--wazo-color-text); font-weight: var(--wazo-font-weight-medium); }
.wazo-legal__body a {
    color: var(--wazo-color-accent);
    text-decoration: underline;
    text-underline-offset: 2px;
}
.wazo-legal__body > *:first-child { margin-top: 0; }
.wazo-legal__body > *:last-child { margin-bottom: 0; }

/* ============================================
   RESPONSIVE
   ============================================ */
@media (max-width: 1200px) {
    .wazo-page-legal .wazo-legal {
        grid-template-columns: 1fr;
        padding-inline: 16px;
    }
    .wazo-legal > section { grid-template-columns: 1fr; }
    .wazo-legal__head-inner,
    .wazo-legal__body { grid-column: 1; }
    .wazo-legal__head::after { left: 16px; right: 16px; }
}
@media (max-width: 639px) {
    .wazo-legal__head { padding-block: var(--wazo-sp-phone-lg); }
    .wazo-legal__body-sec { padding-block: var(--wazo-sp-phone-lg); }
    .wazo-legal__head-inner { gap: var(--wazo-sp-phone-sm); }
}
