/* =========================================
   YELOSE TECH — TEXTOS LEGALES
   Estilos específicos del contenido de:
   aviso-legal.html, privacy.html y cookies.html.
   ========================================= */

/* =========================================
   CONTENIDO LEGAL
   ========================================= */

body > main > section[data-section="texto-legal"] {
    display: grid;
    padding: clamp(3rem, 8vw, 5.5rem) var(--content-padding-inline);
    gap: clamp(1.25rem, 3vw, 2rem);
    align-self: center;
    text-align: left;
    color: var(--color-black);
    background-color: var(--color-white);
}

/* =========================================
   TÍTULOS
   ========================================= */

body > main > section[data-section="texto-legal"] > h2 {
    font-size: clamp(1.35rem, 2.5vw, 1.75rem);
    font-weight: 600;
    line-height: 1.3;
    color: var(--color-primary-500);
}

body > main > section[data-section="texto-legal"] > h3 {
    font-size: clamp(1.1rem, 2vw, 1.35rem);
    font-weight: 600;
    line-height: 1.3;
    color: var(--color-secondary-500);
}

/* =========================================
   PÁRRAFOS Y LISTAS
   ========================================= */

body > main > section[data-section="texto-legal"] > p {
    font-weight: 300;
    line-height: 1.7;
    text-align: justify;
}

body > main > section[data-section="texto-legal"] > ul {
    display: grid;
    padding-left: 1.25rem;
    gap: 0.5rem;
    font-weight: 300;
    line-height: 1.7;
    text-align: justify;
}

body > main > section[data-section="texto-legal"] > ul > li::marker {
    color: var(--color-secondary-500);
}

/* =========================================
   ENLACES Y ÉNFASIS
   ========================================= */

body > main > section[data-section="texto-legal"] a {
    color: var(--color-primary-500);
    text-decoration: underline;
}

body > main > section[data-section="texto-legal"] strong {
    font-weight: 600;
}