/*
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: 'DM Sans';
    src: url('assets/fonts/DMSans-Regular.eot');
    src: url('assets/fonts/DMSans-Regular.eot?#iefix') format('embedded-opentype'),
        url('assets/fonts/DMSans-Regular.woff2') format('woff2'),
        url('assets/fonts/DMSans-Regular.woff') format('woff'),
        url('assets/fonts/DMSans-Regular.ttf') format('truetype'),
        url('assets/fonts/DMSans-Regular.svg#DMSans-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'DM Sans';
    src: url('assets/fonts/DMSans-Italic.eot');
    src: url('assets/fonts/DMSans-Italic.eot?#iefix') format('embedded-opentype'),
        url('assets/fonts/DMSans-Italic.woff2') format('woff2'),
        url('assets/fonts/DMSans-Italic.woff') format('woff'),
        url('assets/fonts/DMSans-Italic.ttf') format('truetype'),
        url('assets/fonts/DMSans-Italic.svg#DMSans-Italic') format('svg');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'DM Sans';
    src: url('assets/fonts/DMSans-Medium.eot');
    src: url('assets/fonts/DMSans-Medium.eot?#iefix') format('embedded-opentype'),
        url('assets/fonts/DMSans-Medium.woff2') format('woff2'),
        url('assets/fonts/DMSans-Medium.woff') format('woff'),
        url('assets/fonts/DMSans-Medium.ttf') format('truetype'),
        url('assets/fonts/DMSans-Medium.svg#DMSans-Medium') format('svg');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'DM Sans';
    src: url('assets/fonts/DMSans-SemiBold.eot');
    src: url('assets/fonts/DMSans-SemiBold.eot?#iefix') format('embedded-opentype'),
        url('assets/fonts/DMSans-SemiBold.woff2') format('woff2'),
        url('assets/fonts/DMSans-SemiBold.woff') format('woff'),
        url('assets/fonts/DMSans-SemiBold.ttf') format('truetype'),
        url('assets/fonts/DMSans-SemiBold.svg#DMSans-SemiBold') format('svg');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'DM Sans';
    src: url('assets/fonts/DMSans-Bold.eot');
    src: url('assets/fonts/DMSans-Bold.eot?#iefix') format('embedded-opentype'),
        url('assets/fonts/DMSans-Bold.woff2') format('woff2'),
        url('assets/fonts/DMSans-Bold.woff') format('woff'),
        url('assets/fonts/DMSans-Bold.ttf') format('truetype'),
        url('assets/fonts/DMSans-Bold.svg#DMSans-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'DM Sans';
    src: url('assets/fonts/DMSans-BoldItalic.eot');
    src: url('assets/fonts/DMSans-BoldItalic.eot?#iefix') format('embedded-opentype'),
        url('assets/fonts/DMSans-BoldItalic.woff2') format('woff2'),
        url('assets/fonts/DMSans-BoldItalic.woff') format('woff'),
        url('assets/fonts/DMSans-BoldItalic.ttf') format('truetype'),
        url('assets/fonts/DMSans-BoldItalic.svg#DMSans-BoldItalic') format('svg');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Marcellus';
    src: url('assets/fonts/Marcellus-Regular.eot');
    src: url('assets/fonts/Marcellus-Regular.eot?#iefix') format('embedded-opentype'),
        url('assets/fonts/Marcellus-Regular.woff2') format('woff2'),
        url('assets/fonts/Marcellus-Regular.woff') format('woff'),
        url('assets/fonts/Marcellus-Regular.ttf') format('truetype'),
        url('assets/fonts/Marcellus-Regular.svg#Marcellus-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

:root {
    --accent-warm: #d4a574;
    --black: #000000;
    --chocolate: #4e3028;
    --cream: #f9f5ef;
    --grey: #060607;
    --sage:      #8fa88a;
    --sage-light:#c8d9c4;
    --sage-pale: #eef3ec;
    --soft-brown: #8b6f5c;
    --terracota: #c97d5b;
    --warm-beige: #e8dfd0;
    --white: #ffffff;
}

/********************
 GENERAL
 ********************/
body, p, ul li, ol li { color: #4a4a4a; font-family: 'DM Sans', sans-serif; font-weight: normal; font-size: 17px; line-height: 1.5; }
strong, b { font-weight: bold; }
a, button { transition: all 0.5s ease; }

h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 { color: var(--nectar-accent-color); font-family: 'Marcellus', serif; font-weight: normal; line-height: 1.2; }
h1, .h1 { font-size: 58px; }
h2, .h2 { font-size: 48px; }
h3, .h3 { font-size: 38px; }
h4, .h4 { font-size: 28px; }
h5, .h5 { font-size: 22px; }
h6, .h6 { font-size: 20px; letter-spacing: 1px; text-transform: uppercase; }
small { font-size: 13px; line-height: 15px; }

.nectar-button.large { font-size: 16px; font-weight: 500; }

@media (max-width: 1299px) {
    h1, .h1 { font-size: 48px; }
    h2, .h2 { font-size: 38px; }
    h3, .h3 { font-size: 28px; }
    h4, .h4 { font-size: 22px; }
    h5, .h5 { font-size: 18px; }
    h6, .h6 { font-size: 16px; }
    body, p, ul li, ol li { font-size: 16px; }
}

@media (max-width: 999px) {
    h1, .h1 { font-size: 40px; }
    h2, .h2 { font-size: 32px; }
    h3, .h3 { font-size: 24px; }
    h4, .h4 { font-size: 18px; }
    body, p, ul li, ol li { font-size: 15px; }
}

@media (max-width: 690px) {
    h1, .h1 { font-size: 32px; }
    h2, .h2 { font-size: 28px; }
    h3, .h3 { font-size: 22px; }
    .nectar-button.large { font-size: 13px; }
}


/*** Social Icons ***/
.social-icons, .social-icons > li { display: inline-block; list-style: none; margin-left: 0; }
.social-icons { margin-bottom: 0; }
.social-icons > li:not(:last-child) { margin-right: 10px; }
.social-icons > li > a { background: var(--nectar-accent-color); border-radius: 50%; color: var(--white); display: inline-block; height: 40px; line-height: 38px; text-align: center; width: 40px; }
.social-icons > li > a:hover { color: var(--white); }
.social-icons > li > a[href*="facebook"]:hover { background: #3b5998!important; }
.social-icons > li > a[href*="twitter"]:hover { background: var(--black)!important; }
.social-icons > li > a[href*="linkedin"]:hover { background: #007bb6!important; }
.social-icons > li > a[href*="instagram"]:hover { background: #3f729b!important; }
.social-icons > li > a[href*="youtube"]:hover { background: #bb0000!important; }


/********************
 HEADER
 ********************/
body #header-outer { background-color: #f8f8f8; }
#top nav ul > li > a  { color: var(--nectar-accent-color); font-family: 'Marcellus', sans-serif; font-weight: normal; font-size: 17px; line-height: 1.3; text-transform: uppercase; }
#top nav ul > li > a:hover { color: var(--nectar-accent-color); }
#top nav ul > li > a:active { color: var(--nectar-accent-color); }
#top nav ul > li > a:focus { color: var(--nectar-accent-color); }
#top nav ul > li > a:visited { color: var(--nectar-accent-color); }
#top nav ul > li > a:link { color: var(--nectar-accent-color); }
#top nav ul > li > a:hover { color: var(--nectar-accent-color); }
#top nav ul > li > a:active { color: var(--nectar-accent-color); }
#top nav ul > li > a:focus { color: var(--nectar-accent-color); }
#top nav ul > li > a:visited { color: var(--nectar-accent-color); }
#top nav ul > li > a:link { color: var(--nectar-accent-color); }


/********************
 FOOTER
 ********************/
#footer-top ul.menu, #footer-top ul.menu > li { display: inline-block; list-style: none; margin-left: 0; }
#footer-top ul.menu { margin-bottom: 0; }
#footer-top ul.menu > li:not(:last-child) { margin-right: 20px; }
#footer-top ul.menu > li > a { color: var(--nectar-extra-color-1); font-family: 'Marcellus', sans-serif; font-weight: normal; font-size: 17px; line-height: 1.3; }
#footer-top ul.menu > li > a:hover { color: var(--white); }

#footer .services-menu ul.menu, #footer .services-menu ul.menu > li { display: inline-block; list-style: none; margin-left: 0; width: 100%; }
#footer .services-menu ul.menu > li:not(:last-child) { margin-bottom: 10px; }
#footer .services-menu ul.menu > li > a { color: var(--nectar-extra-color-1); font-family: 'Marcellus', sans-serif; font-weight: normal; font-size: 17px; line-height: 1.3; }
#footer .services-menu ul.menu > li > a:hover { color: var(--white); }

#footer .social-icons > li > a { background: var(--white); color: var(--nectar-accent-color); }
#footer .social-icons > li > a:hover { color: var(--white); }

#footer #copyright p { font-size: 13px; }
#footer #copyright p > a { color: var(--white); opacity: 1; text-decoration: underline; }
#footer #copyright p > a:hover { color: var(--nectar-extra-color-1); }

@media (max-width: 1299px) {
    #footer-top ul.menu > li > a, #footer .services-menu ul.menu > li > a { font-size: 16px; }
}

@media (max-width: 999px) {
    #footer-top img { margin-bottom: 25px; max-width: 220px; }
    #footer .services-menu ul.menu { margin-bottom: 0; }
}

@media (max-width: 999px) {
    #footer-top ul.menu { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; text-align: left; }

    #footer #copyright p { font-size: 12px; }
}


/********************
 HOMEPAGE
 ********************/
.photo-side { align-items: center; animation: photo-float 1.8s ease-out 0.3s backwards; display: flex; justify-content: center; min-height: 600px; position: relative; }

.circles-container { align-items: center; display: flex; height: 100%; justify-content: center; position: absolute; width: 100%; }
.circle { aspect-ratio: 1/1; border: 2px solid; border-radius: 50%; opacity: 0.15; position: absolute; }
.circle:nth-child(1) { animation: expand 8s ease-in-out infinite; border-color: var(--chocolate); max-width: 250px; width: 40%; }
.circle:nth-child(2) { animation: expand 8s ease-in-out infinite 1s; border-color: var(--soft-brown); max-width: 350px; width: 60%; }
.circle:nth-child(3) { animation: expand 8s ease-in-out infinite 2s; border-color: var(--grey); max-width: 450px; width: 80%; }
.circle:nth-child(4) { animation: expand 8s ease-in-out infinite 3s; border-color: var(--accent-warm); max-width: 550px; width: 100%; }

.photo-container { max-width: 420px; position: relative; width: 100%; z-index: 5; }
.photo-wrapper { height: 100%; position: relative; width: 100%; }
.photo-wrapper img { display: block; height: 100%; object-fit: cover; object-position: center top; width: 100%; }

.connection-dots { height: 100%; position: absolute; width: 100%; z-index: 4; }

.dot { animation: pulse-dot 4s ease-in-out infinite; background: var(--chocolate); border-radius: 50%; height: 10px; opacity: 0.3; position: absolute; width: 10px; }
.dot:nth-child(1) { animation-delay: 0s; left: 15%; top: 10%; }
.dot:nth-child(2) { animation-delay: 0.5s; right: 10%; top: 20%; }
.dot:nth-child(3) { animation-delay: 1s; bottom: 25%; left: 8%; }
.dot:nth-child(4) { animation-delay: 1.5s; bottom: 15%; right: 12%; }

@media (max-width: 1199px) {
    .photo-side { min-height: 500px; }
    .photo-container { height: 370px; width: 280px; }
}

@media (max-width: 999px) {
    .circle { transform: scale(0.8); }
    .photo-container { height: 330px; width: 250px; }
}

@media (max-width: 600px) {
    .connection-dots { display: none; }
}


/********************
 PAGES
 ********************/
.header-anchor { display: inline-block; font-size: 40px; line-height: 1; margin-top: 15px; }

.spiral-one .row-bg-wrap:before, .spiral-two .row-bg-wrap:before, .spiral-three .row-bg-wrap:before { content: ''; background: url('assets/img/texture.png') no-repeat bottom left; background-size: contain; bottom: 15px; height: 50%; left: 0; max-width: 450px; opacity: 25%; position: absolute; width: 50%; z-index: 3; }
.spiral-two .row-bg-wrap:before { background-image: url('assets/img/texture-2.png'); opacity: 15%; }
.spiral-three .row-bg-wrap:before { background-image: url('assets/img/texture-3.png'); }

.service-box { background: var(--white); box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1); }
.service-box img { aspect-ratio: 4/3; margin-bottom: 0!important; object-fit: cover; object-position: center; }
.service-box .wpb_wrapper { padding: 20px; }
.service-box .wpb_wrapper h3, .service-box .wpb_wrapper h5 { margin-bottom: 15px; }
.service-box .wpb_wrapper h3 { font-size: 27px; font-weight: 500; }
.service-box .wpb_wrapper h5 { font-size: 19px; }

.service-box .wpb_wrapper ul, .service-box .wpb_wrapper ul > li { list-style: none; margin-left: 0; width: 100%; }
.service-box .wpb_wrapper ul > li { font-size: 16px; padding-left: 35px; position: relative; }
.service-box .wpb_wrapper ul > li:not(:last-child) { margin-bottom: 10px; }
.service-box .wpb_wrapper ul > li:before { content: "\f046"; color: var(--nectar-accent-color); font-family: 'FontAwesome'; font-size: 16px; left: 10px; position: absolute; top: -1px; }

.service-box .wpb_wrapper p > a { background-color: var(--nectar-accent-color); border-radius: 30px; color: var(--white); display: inline-block; font-size: 15px; line-height: 20px; margin-bottom: 15px; padding: 10px 25px; }
.service-box .wpb_wrapper p > a:after { content: "\f061"; font-family: 'FontAwesome'; font-size: 16px; margin-left: 10px; }
.service-box .wpb_wrapper p > a:hover { background-color: var(--nectar-extra-color-1); }

.iwithtext .iwt-icon .fa-envelope-o { top: -4px; }

.row .col img.img-with-animation.nectar-lazy:not([srcset]) { width: auto; }

@media (max-width: 1299px) {
    .header-anchor { font-size: 36px; margin-top: 5px; }

    .service-box .wpb_wrapper h3 { font-size: 22px; }
    .service-box .wpb_wrapper h5 { font-size: 16px; }
    .service-box .wpb_wrapper ul > li { font-size: 15px; padding-left: 30px; }
    .service-box .wpb_wrapper ul > li:before { left: 5px; }
}

@media (max-width: 999px) {
    .header-anchor { font-size: 32px; margin-top: 0; }

    .spiral-one .row-bg-wrap:before { opacity: 15%; }

    .offered-img { max-height: 120px; width: auto; }
}

@media (max-width: 690px) {
    .header-anchor { font-size: 28px; }

    .service-box .wpb_wrapper ul > li { font-size: 14px; }
}


/********************
 TEAM
 ********************/
.staff-img { aspect-ratio: 1/1; border-radius: 0 50% 50% 50%; object-fit: cover; object-position: center top; }
.spiral-img { border-radius: 60% 40% 30% 70% / 60% 30% 70% 40%; }
.spiral-img-two { border-radius: 70% 30% 50% 50% / 30% 50% 50% 70%; }
.spiral-img-three { border-radius: 40% 60% 70% 30% / 50% 40% 60% 50%; }

.nectar_single_testimonial .inner > p { padding-bottom: 0; }

@media (min-width: 1000px) {
    .staff-img.staff-img-right { border-radius: 50% 0 50% 50%; }
}


/********************
 SERVICES
 ********************/
.service-card { align-items: center; background: #fff; border-bottom: 1px solid rgba(143,168,138,.15); cursor: default; display: grid; gap: 0; grid-template-columns: 280px 1fr auto; overflow: hidden; position: relative; transition: box-shadow .4s; }
.service-card:first-child { border-top: 1px solid rgba(143,168,138,.15); }

.service-card::before { content: ''; background: var(--nectar-accent-color, var(--sage)); bottom: 0; left: 0; position: absolute; top: 0; transform: scaleY(0); transform-origin: top; transition: transform .5s cubic-bezier(.22,1,.36,1); width: 3px; }
.service-card:hover::before { transform: scaleY(1); }

.service-card::after { content: ''; background: var(--nectar-extra-color-1, rgba(143,168,138,.05)); border-radius: 60% 40% 30% 70% / 60% 30% 70% 40%; height: 220px; pointer-events: none; position: absolute; right: -80px; top: 50%; transform: translateY(-50%); transition: transform .6s cubic-bezier(.22,1,.36,1); width: 220px; }
.service-card:hover::after { transform: translateY(-50%) scale(1.2) translateX(-20px); }

.service-card:hover { box-shadow: 0 8px 40px rgba(42,38,32,.07); z-index: 1; }

.service-card:nth-child(1) { --nectar-accent-color: var(--sage); --nectar-extra-color-1: rgba(143,168,138,.07); }
.service-card:nth-child(2) { --nectar-accent-color: var(--terracota); --nectar-extra-color-1: rgba(201,125,91,.06); }
.service-card:nth-child(3) { --nectar-accent-color: var(--gold); --nectar-extra-color-1: rgba(200,169,110,.07); }

.service-card-left { align-items: flex-start; border-right: 1px solid rgba(143,168,138,.12); display: flex; flex-direction: column; gap: 1rem; padding: 3rem 2.5rem 3rem 3.5rem; }

.service-card-num { color: var(--sage-pale); font-family: 'Cormorant Garamond', serif; font-size: 5rem; font-weight: 300; line-height: 1; transition: color .3s; }
.service-card:nth-child(1):hover .service-card-num { color: rgba(143,168,138,.2); }
.service-card:nth-child(2):hover .service-card-num { color: rgba(201,125,91,.18); }
.service-card:nth-child(3):hover .service-card-num { color: rgba(200,169,110,.22); }

.service-card-icon { align-items: center; background: var(--nectar-extra-color-1); border-radius: 50%; display: flex; height: 64px; justify-content: center; width: 64px; }
.service-card-icon i { color: var(--nectar-accent-color); font-size: 28px; }

.service-card-body { padding: 3rem 3rem; }

.service-card h2 { color: var(--ink); font-family: 'Cormorant Garamond', serif; font-size: 2rem; font-weight: 400; line-height: 1.2; margin-bottom: 1rem; }

.service-card p { color: var(--ink-soft); font-size: .9rem; line-height: 1.8; margin-bottom: .6rem; max-width: 62ch; }
.service-card p:last-child { margin-bottom: 0; }

.service-card-action { align-items: center; display: flex; justify-content: flex-end; padding: 3rem 3.5rem 3rem 1rem; }
.service-card-action a { color: var(--nectar-accent-color); }
.service-card-action a:hover { color: var(--terracota); }

.service-card-link { align-items: center; color: var(--nectar-accent-color); display: inline-flex; font-size: .78rem; font-weight: 500; gap: .5rem; letter-spacing: .12em; text-decoration: none; text-transform: uppercase; transition: gap .3s; white-space: nowrap; }
.service-card-link:hover { gap: .9rem; }
.service-card-link svg { width: 16px; height: 16px; stroke: currentColor; fill: none; stroke-width: 2; }

.service-card { animation: fadeUp .7s ease forwards; opacity: 0; transform: translateY(30px); }
.service-card:nth-child(1) { animation-delay: .1s; }
.service-card:nth-child(2) { animation-delay: .25s; }
.service-card:nth-child(3) { animation-delay: .4s; }

@media (max-width: 900px) {
    .service-card { grid-template-columns: 1fr; }
    .service-card-left { align-items: center; border-right: none; flex-direction: row; padding: 2rem 2rem 1rem; }
    .service-card-body { padding: 1.5rem 2rem; }
    .service-card-action { padding: 1rem 2rem 2rem; justify-content: flex-start; }
}

/********************
 ACADEMIA
 ********************/
.course-box { background: var(--nectar-accent-color); border-radius: 30px 0 30px 0; box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1); margin-top: 25px; overflow: hidden; transition: all 0.5s ease; }
.course-box img { aspect-ratio: 16/9; border-radius: 30px 0 0 0; margin-bottom: 0!important; object-fit: cover; object-position: center; transition: all 0.5s ease; transform: scale(1); }
.course-box .wpb_wrapper { padding: 25px 25px 30px; }
.course-box .wpb_wrapper h3 { font-size: 25px; font-weight: 500; margin-bottom: 15px; }
.course-box .wpb_wrapper h3 > a, .course-box .wpb_wrapper p { color: var(--white); }
.course-box .wpb_wrapper p { font-size: 16px; }

.course-box:hover { background: #f8f8f8; }
.course-box:hover img { transform: scale(1.05); }
.course-box:hover h3 > a { color: var(--nectar-accent-color); }
.course-box:hover p { color: #4a4a4a; }

@media (max-width: 1299px) {
    .header-anchor { font-size: 36px; margin-top: 5px; }

    .course-box h3 { font-size: 22px; }
    .course-box p { font-size: 15px; }
}


/********************
 ANIMATIONS
 ********************/
@keyframes expand {
    0%, 100% {
        transform: scale(1);
        opacity: 0.15;
    }
    50% {
        transform: scale(1.08);
        opacity: 0.25;
    }
}

@keyframes fadeUp {
    to { opacity: 1; transform: translateY(0); }
}

@keyframes photo-float {
    from {
        opacity: 0;
        transform: scale(0.9);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

@keyframes pulse-dot {
    0%, 100% {
        transform: scale(1);
        opacity: 0.3;
    }
    50% {
        transform: scale(1.5);
        opacity: 0.6;
    }
}
