/*
Theme Name: Salient Child Theme
Description: This is a custom child theme for Salient
Theme URI:   https://themeforest.net/item/salient-responsive-multipurpose-theme/4363266
Author: ThemeNectar
Author URI:  https://themeforest.net/user/themenectar
Template: salient
Version: 1.0
*/


@font-face {
    font-family: 'Playfair Display';
    src: url('assets/fonts/PlayfairDisplay-Medium.eot');
    src: url('assets/fonts/PlayfairDisplay-Medium.eot?#iefix') format('embedded-opentype'),
        url('assets/fonts/PlayfairDisplay-Medium.woff2') format('woff2'),
        url('assets/fonts/PlayfairDisplay-Medium.woff') format('woff'),
        url('assets/fonts/PlayfairDisplay-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Playfair Display';
    src: url('assets/fonts/PlayfairDisplay-Bold.eot');
    src: url('assets/fonts/PlayfairDisplay-Bold.eot?#iefix') format('embedded-opentype'),
        url('assets/fonts/PlayfairDisplay-Bold.woff2') format('woff2'),
        url('assets/fonts/PlayfairDisplay-Bold.woff') format('woff'),
        url('assets/fonts/PlayfairDisplay-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Playfair Display';
    src: url('assets/fonts/PlayfairDisplay-Regular.eot');
    src: url('assets/fonts/PlayfairDisplay-Regular.eot?#iefix') format('embedded-opentype'),
        url('assets/fonts/PlayfairDisplay-Regular.woff2') format('woff2'),
        url('assets/fonts/PlayfairDisplay-Regular.woff') format('woff'),
        url('assets/fonts/PlayfairDisplay-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('assets/fonts/Poppins-Regular.eot');
    src: url('assets/fonts/Poppins-Regular.eot?#iefix') format('embedded-opentype'),
        url('assets/fonts/Poppins-Regular.woff2') format('woff2'),
        url('assets/fonts/Poppins-Regular.woff') format('woff'),
        url('assets/fonts/Poppins-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('assets/fonts/Poppins-Italic.eot');
    src: url('assets/fonts/Poppins-Italic.eot?#iefix') format('embedded-opentype'),
        url('assets/fonts/Poppins-Italic.woff2') format('woff2'),
        url('assets/fonts/Poppins-Italic.woff') format('woff'),
        url('assets/fonts/Poppins-Italic.ttf') format('truetype');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('assets/fonts/Poppins-Medium.eot');
    src: url('assets/fonts/Poppins-Medium.eot?#iefix') format('embedded-opentype'),
        url('assets/fonts/Poppins-Medium.woff2') format('woff2'),
        url('assets/fonts/Poppins-Medium.woff') format('woff'),
        url('assets/fonts/Poppins-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('assets/fonts/Poppins-Bold.eot');
    src: url('assets/fonts/Poppins-Bold.eot?#iefix') format('embedded-opentype'),
        url('assets/fonts/Poppins-Bold.woff2') format('woff2'),
        url('assets/fonts/Poppins-Bold.woff') format('woff'),
        url('assets/fonts/Poppins-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('assets/fonts/Poppins-Light.eot');
    src: url('assets/fonts/Poppins-Light.eot?#iefix') format('embedded-opentype'),
        url('assets/fonts/Poppins-Light.woff2') format('woff2'),
        url('assets/fonts/Poppins-Light.woff') format('woff'),
        url('assets/fonts/Poppins-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('assets/fonts/Poppins-ExtraBold.eot');
    src: url('assets/fonts/Poppins-ExtraBold.eot?#iefix') format('embedded-opentype'),
        url('assets/fonts/Poppins-ExtraBold.woff2') format('woff2'),
        url('assets/fonts/Poppins-ExtraBold.woff') format('woff'),
        url('assets/fonts/Poppins-ExtraBold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}


:root {
    --black: #000000;
    --white: #ffffff;
    --extra-color-4: #f9b537;
}


/*********************
GENERAL
*********************/
h1, .h1 ,h2, .h2, h3, h4, .h4, h5 { font-family: 'Poppins', sans-serif; font-weight: bold; }
body, h6, p, ul li, ol li { font-family: 'Poppins', sans-serif; font-weight: normal; }
a, button { transition: .5s all ease; -webkit-transition: .5s all ease; -moz-transition: .5s all ease; }

h1, .h1 { font-size: 70px; line-height: 80px; }
h2, .h2 { font-size: 48px; line-height: 55px; }
h3, .h3 { font-size: 40px; line-height: 50px; }
h4, .h4 { font-size: 30px; line-height: 35px; }
h5, .h5 { font-size: 20px; line-height: 25px; }
h6, .h6 { font-size: 20px; line-height: 25px; }
p, ul li, ol li { font-size: 18px; line-height: 25px; }

@media (max-width: 1299px) {
	h1, .h1 { font-size: 60px; line-height: 65px; }
    h2, .h2 { font-size: 45px; line-height: 55px; }
	h3, .h3 { font-size: 35px; line-height: 33px; }
	h4 { font-size: 23px; line-height: 28px; }
}

@media (max-width: 1180px) {
	h1, .h1 { font-size: 60px; line-height: 65px; }
	h2, .h2 { font-size: 40px; line-height: 50px; }
	h3, .h3 { font-size: 30px; line-height: 33px; }
	h4 { font-size: 20px; line-height: 28px; }
    p, ul li, ol li { font-size: 15px; line-height: 22px; }
}

@media (max-width: 999px) {
	h1, .h1 { font-size: 50px; line-height: 55px; }
	h3, .h3 { font-size: 28px; line-height: 30px; }
}

@media (max-width: 690px) {
	h1, .h1 { font-size: 45px; line-height: 50px; }
	
}

@media (max-width: 480px) {
	h1, .h1 { font-size: 40px; line-height: 45px; }
	h2, .h2 { font-size: 30px; line-height: 40px; }
	h3, .h3 { font-size: 25px; line-height: 30px; }
    h5 { font-size: 17px; line-height: 22px; }
    h6 { font-size: 17px; line-height: 22px; }
    body, p, ul li, ol li { font-size: 14px; line-height: 20px; }
}

.color-prin { color: var(--nectar-accent-color); }
.color-1 { color: var(--nectar-extra-color-1); }
.color-2 { color: var(--nectar-extra-color-2); }
.color-3 { color: var(--nectar-extra-color-3); }
.color-4 { color: var(--extra-color-4); }



/*********************
HEADER
*********************/
#slide-out-widget-area .menuwrapper .menu.menuopen { display: inline-block; text-transform: uppercase; }
#slide-out-widget-area .inner .off-canvas-menu-container li>a { font-size: 27px!important; }
#slide-out-widget-area .inner .off-canvas-menu-container li>a:hover { color: var(--extra-color-4); }
#slide-out-widget-area.fullscreen-inline-images.open .inner .off-canvas-menu-container li[class*="current"] a span:after { border-color: var(--nectar-extra-color-1); }



/*********************
FOOTER
*********************/
#global-footer a { color: var(--white); }
#global-footer a:hover { color: var(--extra-color-4); }
#global-footer i { color: var(--white)!important; }
#global-footer #menu-menu-principal, #menu-menu-principal > li { list-style: none; margin-bottom: 20px; margin-left: 0; padding-left: 0; text-align: center; }

body [class^=icon-].icon-default-style { line-height: 26pxhi; }

#footer-outer #copyright p { font-size: 14px; line-height: 20px; }
#footer-outer #copyright a:not(.nectar-button):hover { color: var(--extra-color-4)!important; }

@media (max-width: 690px) {
    #footer-outer #copyright p { font-size: 11px; line-height: 18px; text-align: center; }
}



/*********************
HOMEPAGE
*********************/
body #ajax-content-wrap .custom_font_size_2-4vw.font_size_max_48px.nectar-post-grid .nectar-post-grid-item .post-heading, 
body .custom_font_size_2-4vw.font_size_max_48px.nectar-post-grid .nectar-post-grid-item .post-heading { font-size: min(25px, 2.4rem); }



/*********************
PAGE
*********************/
.team-member[data-style=bio_fullscreen_alt] h3 { font-size: 28px; line-height: 32px; margin-bottom: 5px; margin-top: 12px; }
.row .team-member[data-style=bio_fullscreen_alt] h5 { font-size: 17px; font-weight: normal; line-height: 25px; }

.timeline{position:relative; padding-left:72px}
.timeline::before{
	content:""; position:absolute; left:36px; top:0; bottom:0; width:4px; border-radius:4px;
	background:linear-gradient(180deg, #aab0ff 0%, var(--accent-extra-color-1) 45%, #a7d0f4 100%);
	filter: drop-shadow(0 0 6px rgba(92,92,167,.25));
	mask: linear-gradient(180deg, transparent 0%, #000 12%, #000 88%, transparent 100%);
}

.item{position:relative; display:grid; grid-template-columns: 72px 1fr; gap:18px; margin-bottom:40px}

.node{position:relative; width:72px; height:72px; border-radius:50%; display:grid; place-items:center; margin-top:4px; isolation:isolate;
	background:
		radial-gradient(64px 64px at 30% 30%, #ffffff 0 50%, transparent 51%),
		conic-gradient(from 210deg, #e9ecff, #cdd2ff, #b5bbff, var(--accent-extra-color-1), #86a9e0, #e9ecff);
	box-shadow: 0 6px 24px rgba(92,92,167,.35), inset 0 1px 0 rgba(255,255,255,.7);
}
.node::after{ /* anillo de foco */
	content:""; position:absolute; inset:-8px; border-radius:inherit; pointer-events:none; opacity:.0; transition:opacity .3s ease;
	box-shadow: var(--accent-extra-color-2);
}
.node svg{width:30px; height:30px}

.card{
	position:relative; background:var(--cs-card); border-radius:var(--radius); overflow:hidden;
	box-shadow: 0 1px 0 rgba(255,255,255,.6) inset, 0 10px 30px rgba(7,40,55,.08);
	transition: transform .3s ease, box-shadow .3s ease;
}
.card:hover{ transform: translateY(-4px); box-shadow: 0 1px 0 rgba(255,255,255,.6) inset, 0 16px 48px rgba(7,40,55,.14); }

.card::before{
	content:""; position:absolute; inset:0; height:4px; background:linear-gradient(90deg, #aab0ff, var(--accent-extra-color-1), #86a9e0);
	opacity:.85;
}

/* contenido 2 columnas dentro de cada card */
.card-inner { display: grid; grid-template-columns:  repeat(2, 1fr); gap: 20px; padding: 22px 24px 24px}
.pill { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 600; letter-spacing: .04em; margin-bottom:  10px; text-transform: uppercase; background: #eef0ff; color: var(--accent-extra-color-1); padding: 8px 12px; border-radius: 999px}
.h { margin: 8px 0 6px; font-size: 22px; letter-spacing: -.02em}
.short p { margin: 0; color: var(--cs-muted)}
.long p { margin: 0; line-height: 1.65}

.separador { height: auto; position: relative; }
.separador::before { content: ""; position: absolute; left:  -20px; top: 8px; bottom: 8px; width: 3px; border-radius: 2px; background: linear-gradient(180deg, #e7e9ff, #dfe6ff); }

/* Estados/temas por item */
.item[data-type="mision"] .pill { background: #e8f2ff; color: #3b82f6}
.item[data-type="vision"] .pill { background: #ecfdf5; color: #059669}
.item[data-type="valores"] .pill { background: #fff7ed; color: #d97706}

/* RESPONSIVE */
@media (max-width: 900px){
	.card-inner { grid-template-columns: 1fr; gap: 14px }
	.separador::before { display: none }
}

@media (max-width: 640px){
	.timeline { padding-left: 24px }
	.timeline::before { left: 12px }
	.item { grid-template-columns: 40px 1fr }
	.node { width: 40px; height: 40px }
	.node svg { width: 20px; height: 20px }
}

.card:focus-within .node::after{opacity:1}


/*** Blog ***/
.masonry.material .post .post-featured-img img { aspect-ratio: 1 / 1; object-fit: cover; }
.masonry.material .masonry-blog-item h3 { font-size: 25px; line-height: 30px; }


/*********************
CONTACT
*********************/
.contact-form i { color: var(--nectar-extra-color-1)!important; }
.contact-form .wpcf7-form p span { color: black!important; font-size: 15px; line-height: 20px; }
.contact-form .wpcf7-form p span a { color: var(--nectar-accent-color)!important; font-size: 15px; line-height: 20px; text-decoration: underline; }
.contact-form .wpcf7-form p span a:hover { color: var(--nectar-extra-color-1)!important; }
.contact-form .small { color: black!important; font-size: 13px; line-height: 18px; margin-top: 10px; }
.contact-form .small a { color:var(--nectar-accent-color)!important; font-size: 13PX; line-height: 18px; text-decoration: underline; }
.contact-form .small a:hover { color: var(--nectar-extra-color-1)!important; }
body[data-form-submit=regular] .container-wrap input[type=submit] { background-color: var(--nectar-extra-color-2)!important; font-size: 18px; margin-top: 10px; text-transform: uppercase; width: 100%; }
.wpcf7-list-item { margin: 0!important; }