/* style Lic. Lupe Calcatelli */

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400..900;1,400..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');

:root{
    --color_base: #fefefe; /* #imagen de fondo, retocar */
    --bg_color1: #efe8dA;
    --bg_color1: #fffaefee;
    /* --bg_color2: #f6f4f1; */
    --bg_color2: #7c9885;
    --bg_color2: #93a599;
    --color_borde1: #dad6ce;

    --color1: #2e2e2e; /*principal*/
    --color2: #6b6b6b; /*secundario*/
    --color2: #4b4a4a; /*secundario*/
    --color2a: #dbdbdb; /*secundario*/

    --color_hover1: #5f7f6e;

    --font_base: 'Roboto', sans-serif;
    --font_heading: 'Playfair Display', serif;
    --font_secondary: 'Inter', sans-serif;

    --btn1_fondo: #7c9885; /* links */

    --btn2_fondo: #7c9885;
    --btn2_texto: #ffffff;
    --btn2_hover: #5f7f6e;
}

.color_base{ background-color: var(--color_base); }
.bg_color1{ background-color: var(--bg_color1); }
.bg_color2{ background-color: var(--bg_color2); }

.color1{ color: var(--color1); }
.color2{ color: var(--color2); }
.color2a{ color: var(--color2a); }

.bg_color2{ background-color: var(--bg_color2); }
.color_hover1{ background-color: var(--color_hover1); }


.font_base{
    font-family: var(--font_base);
}

.font_heading{
    font-family: var(--font_heading);
    font-weight: 500;
}

.font_secondary{
    font-family: var(--font_secondary); 
}

.btn1{ /* links */
    background-color: var(--btn1_fondo);
}

.btn2{
    background-color: var(--btn2_fondo) !important;
    color: var(--btn2_texto) !important;
    border-color: var(--btn2_hover) !important;
}

.btn2:hover{
    background-color: var(--btn2_hover) !important;
    color: white !important;
    border-color: var(--btn2_hover) !important;
}


body{
    background-color: var(--color_base);
    font-family: 'Roboto', sans-serif;
    font-size: 16px;
    line-height: 1.5;
}

.hero{
    min-height: 95vh;
    display: flex;
    align-items: center;
    position: relative;
    overflow: hidden; /* clave para que no se desmadre */
}


/* IMAGEN */
.hero-img{
    max-height: 95vh;
    transform: scale(1.2); /* agranda sin romper layout */
}

/* TEXTO */
.hero-text{
    position: relative;
    z-index: 2;
}

/* SUPERPOSICIÓN SOLO EN MD+ */
@media (min-width: 768px){
    .hero-text{
        margin-left: -40px; 
    }
}

.cards1 {
    display: flex;
    flex-direction: column;
    height: 100%;
    max-width: 90vw;
    padding: 20px 20px 30px;
    border-radius: 5px;
    background-color: var(--color_base);
    border: 1px solid var(--color_borde1);
    margin: auto;
    margin-bottom:1em;
    color: var(--color2);
}

.cards1 button{
    margin-top: 1em;
    margin-bottom: 1em;
}

/* .card1_title{
    font-weight: 600;
    font-size: 1.1rem;
}

.card1_text{
    font-size: 0.9rem;
} */

.iconos1{
    /* max-width: 200px; */
    max-width: 350px;
    height: auto;
}

/* ************************************************ */
/* HEADER */

.header-title{
    padding-top: 1.5rem;   /* separación del navbar */
    padding-bottom: 2rem;  /* respiración antes del contenido */
}


.header-separator{
    height: 1px;
    background: linear-gradient(
        to right,
        transparent,
        rgba(0,0,0,0.12),
        transparent
    );
}


.icon_recursos {
    max-width: 150px;
    height: auto;
    margin: auto;
}
/* ************************************************ */
/* FOOTER */
.small_{font-size: 0.8rem;}
.color_dw{color:#cccccc !important;}
.color_dw:hover{color:#969595 !important;}

@media screen and (max-width: 991px){
    .align_dw{text-align:center !important;}
}


a:link {color: white;}
a:link {color: inherit;}
a:visited {color: inherit;}
a:link {text-decoration: none;}
a:visited {text-decoration: none;}
a:hover {text-decoration: none;}
a:active {text-decoration: none;}

/* a:hover{color: var(--azul) !important;} */

.cp{cursor:pointer}
.ca{cursor:default}

