/*****************************************************************
    STARTER INMOBILIARIO
    TYPOGRAPHY.CSS
*****************************************************************/


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

body{

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

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

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

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

    color:var(--texto);

    background:var(--gris-100);

}


/*==============================================================
    ENCABEZADOS
==============================================================*/

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

    margin:0 0 var(--space-4);

    color:var(--accent);

    font-weight:var(--font-semibold);

    line-height:1.2;

}

h1{

    font-size:var(--font-size-display);

}

h2{

    font-size:var(--font-size-xxl);

}

h3{

    font-size:var(--font-size-xl);

}

h4{

    font-size:var(--font-size-lg);

}

h5{

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

}

h6{

    font-size:var(--font-size-sm);

}


/*==============================================================
    PÁRRAFOS
==============================================================*/

p{

    margin:0 0 var(--space-4);

    color:var(--texto);

}


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

a{

    color:inherit;

    text-decoration:none;

    transition:var(--transition);

}

a:hover{

    color:var(--primary);

}


/*==============================================================
    TEXTO
==============================================================*/

strong{

    font-weight:var(--font-bold);

}

b{

    font-weight:var(--font-bold);

}

em{

    font-style:italic;

}

small{

    font-size:var(--font-size-sm);

}


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

ul,
ol{

    margin:0;

    padding:0;

}

li{

    margin:0;

}


/*==============================================================
    SELECCIÓN
==============================================================*/

::selection{

    background:var(--primary);

    color:var(--white);

}


/*==============================================================
    PLACEHOLDER
==============================================================*/

::placeholder{

    color:var(--gris-500);

    opacity:1;

}


/*==============================================================
    HR
==============================================================*/

hr{

    margin:var(--space-5) 0;

    border:0;

    border-top:1px solid var(--border-color);

}


/*==============================================================
    CLASES TIPOGRÁFICAS
==============================================================*/

.title{

    color:var(--secondary);

    font-weight:var(--font-bold);

}

.subtitle{

    color:var(--gris-700);

    font-size:var(--font-size-lg);

}

.lead{

    font-size:1.15rem;

    font-weight:300;

    line-height:1.8;

}

.text-justify{

    text-align:justify;

}

.uppercase{

    text-transform:uppercase;

}

.lowercase{

    text-transform:lowercase;

}

.capitalize{

    text-transform:capitalize;

}