/**
 * ============================================================
 * EMZO Corporate
 * base.css
 * ------------------------------------------------------------
 * Estilos base del Framework.
 *
 * Responsabilidad:
 * Definir el comportamiento global de los elementos HTML
 * sin aplicar estilos específicos de componentes.
 *
 * @package EMZO_Corporate
 * @version 1.0.0
 * ============================================================
 */


/* ============================================================
   RESET
============================================================ */

*,
*::before,
*::after {

    box-sizing: border-box;

}


/* ============================================================
   HTML
============================================================ */

html {

    font-size: 16px;

    scroll-behavior: smooth;

}


/* ============================================================
   BODY
============================================================ */

body {

    margin: 0;

    padding: 0;

    min-width: 320px;

    font-family: var(--emzo-font-family);

    font-size: var(--emzo-font-size-md);

    font-weight: var(--emzo-font-weight-normal);

    line-height: var(--emzo-line-height);

    color: var(--emzo-gray-800);

    background-color: var(--emzo-white);

    text-rendering: optimizeLegibility;

    -webkit-font-smoothing: antialiased;

}


/* ============================================================
   IMÁGENES
============================================================ */

img,
picture {

    display: block;

    max-width: 100%;

    height: auto;

}


/* ============================================================
   ENLACES
============================================================ */

a {

    color: inherit;

    text-decoration: none;

    transition: color var(--emzo-transition-fast);

}

a:hover {

    color: var(--emzo-primary);

}


/* ============================================================
   LISTAS
============================================================ */

ul,
ol {

    margin: 0;

    padding: 0;

    list-style: none;

}


/* ============================================================
   TIPOGRAFÍA
============================================================ */

h1,
h2,
h3,
h4,
h5,
h6,
p {

    margin-top: 0;

}

p:last-child {

    margin-bottom: 0;

}


/* ============================================================
   FORMULARIOS
============================================================ */

input,
textarea,
select,
button {

    font: inherit;

}


/* ============================================================
   TABLAS
============================================================ */

table {

    width: 100%;

    border-collapse: collapse;

}


/* ============================================================
   ACCESIBILIDAD
============================================================ */

:focus-visible {

    outline: 2px solid var(--emzo-primary);

    outline-offset: 2px;

}


/* ============================================================
   REDUCCIÓN DE MOVIMIENTO
============================================================ */

@media (prefers-reduced-motion: reduce) {

    html {

        scroll-behavior: auto;

    }

    *,
    *::before,
    *::after {

        animation-duration: .01ms !important;

        animation-iteration-count: 1 !important;

        transition-duration: .01ms !important;

    }

}


/* ============================================================
   WORDPRESS EDITOR CONTENT
============================================================ */

.emzo-editor-content {

    color: var(--emzo-text-color);

    font-size: 1.05rem;

    line-height: 1.9;

}

.emzo-editor-content > *:last-child {

    margin-bottom: 0;

}


/* ============================================================
   EDITOR — HEADINGS
============================================================ */

.emzo-editor-content h2,
.emzo-editor-content h3,
.emzo-editor-content h4,
.emzo-editor-content h5,
.emzo-editor-content h6 {

    color: var(--emzo-primary);

    font-weight: 700;

    margin-top: 2.5rem;

    margin-bottom: 1rem;

    line-height: 1.25;

}

.emzo-editor-content h2 {

    font-size: 2rem;

}

.emzo-editor-content h3 {

    font-size: 1.65rem;

}

.emzo-editor-content h4 {

    font-size: 1.35rem;

}


/* ============================================================
   EDITOR — PARAGRAPHS
============================================================ */

.emzo-editor-content p {

    margin-bottom: 1.35rem;

}


/* ============================================================
   EDITOR — LISTS
============================================================ */

.emzo-editor-content ul,
.emzo-editor-content ol {

    padding-left: 1.4rem;

    margin-bottom: 1.5rem;

}

.emzo-editor-content li {

    margin-bottom: .55rem;

}


/* ============================================================
   EDITOR — LINKS
============================================================ */

.emzo-editor-content a {

    color: var(--emzo-accent);

    text-decoration: none;

    transition: .25s;

}

.emzo-editor-content a:hover {

    color: var(--emzo-primary);

}


/* ============================================================
   EDITOR — IMAGES
============================================================ */

.emzo-editor-content img {

    max-width: 100%;

    height: auto;

    border-radius: 18px;

    margin: 2rem 0;

    display: block;

}


/* ============================================================
   EDITOR — TABLES
============================================================ */

.emzo-editor-content table {

    width: 100%;

    border-collapse: collapse;

    margin: 2rem 0;

}

.emzo-editor-content th {

    background: var(--emzo-primary);

    color: #fff;

    padding: 1rem;

}

.emzo-editor-content td {

    border: 1px solid #e5e5e5;

    padding: 1rem;

}


/* ============================================================
   EDITOR — BLOCKQUOTE
============================================================ */

.emzo-editor-content blockquote {

    border-left: 4px solid var(--emzo-accent);

    padding: 1rem 1.5rem;

    margin: 2rem 0;

    background: #f8f9fb;

    font-style: italic;

}