/**
 * ============================================================
 * EMZO Corporate
 * layout.css
 * ------------------------------------------------------------
 * Layout principal del Framework.
 *
 * Responsabilidad:
 * Definir la estructura global del sitio.
 *
 * @package EMZO_Corporate
 * @version 1.0.0
 * ============================================================
 */

/* ============================================================
   CONTENEDOR PRINCIPAL
============================================================ */

.emzo-site {

    display: flex;
    flex-direction: column;

    min-height: 100vh;

}

/* ============================================================
   CONTENIDO PRINCIPAL
============================================================ */

.emzo-main {

    flex: 1;

}

/* ============================================================
   SECCIONES
============================================================ */

.emzo-section {

    padding-top: var(--emzo-space-8);
    padding-bottom: var(--emzo-space-8);

}

.emzo-section-sm {

    padding-top: var(--emzo-space-6);
    padding-bottom: var(--emzo-space-6);

}

.emzo-section-lg {

    padding-top: var(--emzo-space-9);
    padding-bottom: var(--emzo-space-9);

}

/* ============================================================
   CONTENEDORES
============================================================ */

.emzo-container {

    width: 100%;
    max-width: var(--emzo-container-xl);

    margin-inline: auto;

    padding-inline: var(--emzo-space-4);

}

/* ============================================================
   GRID FLEXIBLE
============================================================ */

.emzo-row {

    display: flex;

    flex-wrap: wrap;

    margin-inline: calc(var(--emzo-space-3) * -1);

}

.emzo-col {

    width: 100%;

    padding-inline: var(--emzo-space-3);

}

/* ============================================================
   ESPACIADOS
============================================================ */

.emzo-stack>*+* {

    margin-top: var(--emzo-space-5);

}

/* ============================================================
   CENTRADO
============================================================ */

.emzo-center {

    display: flex;

    justify-content: center;

    align-items: center;

}

/* ============================================================
   UTILIDAD
============================================================ */

.emzo-full-height {

    min-height: 100vh;

}
/*==========================================================
EMZO Vertical Rhythm
==========================================================*/

:root{

    --section-space-xl:120px;

    --section-space-lg:100px;

    --section-space-md:80px;

    --section-space-sm:60px;

}

.emzo-section{

    position:relative;

    padding:var(--section-space-lg) 0;

}

.emzo-section-title{

    margin-bottom:18px;

    font-size:clamp(2rem,3vw,2.8rem);

    font-weight:800;

    line-height:1.15;

}

.emzo-section-subtitle{

    max-width:760px;

    margin:0 auto;

    line-height:1.8;

    color:rgba(255,255,255,.72);

}