/*
Theme Name: nuago
Author: Insight Designs
Author URI: https://www.insightdesigns.com/
Version: 1.0.0
Template: dt-the7
*/

/* ---------------------------------
- Color Legend
--------------------------------- */
/*
    PRIMARY COLORS
    ------------------------------------------
    Deep Blue:          #21478D     - Blue button/h2 underline gradient start
    Bright Blue:        #0B5FEF     - Blue button/h2 underline gradient end
    Bright Blue Alt:    #0B5EEF     - Press Releases badge
    Light Blue:         #79A7F9     - Filter button borders
    
    Purple:             #5B3FA0     - Title links, detail nav labels, content links, blockquote border
    Purple Hover:       #7B5FC0     - Link hover state
    Dark Purple:        #512584     - "In The News" category badge
    Deep Purple:        #2A0D4C     - Footer bottom bg, detail page h2/headings
    Nav Purple:         #4A254E     - Nav underline gradient start, alt h2 underline
    Muted Purple:       #604A7A     - Stats row h3
    Text Purple:        #3E2B54     - Body text, detail content text
    Heading Gray:       #54515D     - Heading text, nav link text
    Meta Purple:        #6B6278     - Detail page date/location text
    Divider Lilac:      #C8BDD6     - Detail page meta divider
    
    ACCENT COLORS
    ------------------------------------------
    Red:                #A6271E     - Red button gradient start, Publications badge
    Red Light:          #EA9D95     - Red button gradient end
    Red Bright:         #DA1206     - Events badge
    Burnt Orange:       #B2482C     - Mobile facet buttons
    
    Pink Light:         #E4B5D8     - Nav underline gradient end, dark bg h2 underline, stat dividers
    Pink Coral:         #FA8D86     - Dark bg h2 underline gradient end
    
    CATEGORY BADGE COLORS
    ------------------------------------------
    Press Releases:     #0B5EEF     - Blue
    In The News:        #512584     - Purple
    Publications:       #A6271E     - Red
    Events:             #DA1206     - Red
    
    NEUTRALS
    ------------------------------------------
    Black:              #000        - Stats row h4, modal close hover
    White:              #fff        - Light text, backgrounds, buttons
    Off White:          #fefefe     - Modal background (commented out)
    Light Gray:         #f5f5f5     - Hover backgrounds
    Border Gray:        #ddd        - Input borders
    Mid Gray:           #888        - Modal border (commented out)
    Placeholder Gray:   #aaaaaa     - Modal close icon (commented out)
    Text Gray:          #444        - Excerpt text
*/


/* ---------------------------------
- Global Styles - Font
--------------------------------- */
@import url("https://use.typekit.net/qwt8qho.css");

html,
body,
body *:not(i):not(.fa):not([class*="icon"]):not(h1):not(h2):not(h3):not(h4):not(h5):not(h6) {
    font-family: "area-inktrap", sans-serif !important;
    line-height: 1.6;
}
body {
    font-style: normal;
}
p {
    font-style: normal;
    font-size: inherit;
    /* color: #3E2B54; */
}
a {
    color: #5B3FA0;
    text-decoration: none;
    transition: color 0.2s ease;
}
a:hover {
    color: #7B5FC0;
}
h1, 
h2, 
h3, 
h4, 
h5, 
h6{
    font-family: "area-inktrap-extended", sans-serif !important;
    font-style: normal;
    color: #54515D;
    --textColor: #54515D;
    --the7-h1-color: #54515D;
    --the7-h2-color: #54515D;
    --the7-h3-color: #54515D;
    --the7-h4-color: #54515D;
    --the7-h5-color: #54515D;
    --the7-h6-color: #54515D;
}
h1 {
    font-size: 3rem;
    font-weight: 900;
}
h2 {
    font-size: 2rem; 
    font-weight: 700;
    margin-bottom: 30px !important;
}
h3 {
    font-size: 1.5rem;
    font-weight: 600;
}
h4 {
    font-size: 1.125rem;
    font-weight: 900;
    color: #5B3FA0;
    line-height: 1.5rem!important;
}
h1.center,
h2.center,
h3.center,
h4.center,
h5.center,
h6.center,
.center h1,
.center h2,
.center h3,
.center h4,
.center h5,
.center h6{
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}
h2 {
    position: relative;
    width: fit-content;
    padding-bottom: 15px;
}
h2::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 5px;
    background: linear-gradient(to right, #21478D, #0B5FEF);
    border-radius: 2px;
}
/* Alternate h2 underline gradients */
.underline_alt_pink h2::after {
    background: linear-gradient(to right, #FA8D86, #E4B5D8);
}
.underline_alt_purple_pink h2::after {
    background: linear-gradient(to right, #4A254E, #E4B5D8);
}
.dark-bg,
.dark-bg h1,
.dark-bg h2,
.dark-bg h3,
.dark-bg h4,
.dark-bg h5,
.dark-bg h6,
.dark-bg p,
.dark-bg span,
.dark-bg a,
.dark-bg li,
.dark-bg label,
.elementor-tab-content.dark-bg h1,
.elementor-tab-content.dark-bg h2,
.elementor-tab-content.dark-bg h3,
.elementor-tab-content.dark-bg h4,
.elementor-tab-content.dark-bg h5,
.elementor-tab-content.dark-bg h6,
.elementor-widget-text-editor.dark-bg h1,
.elementor-widget-text-editor.dark-bg h2,
.elementor-widget-text-editor.dark-bg h3,
.elementor-widget-text-editor.dark-bg h4,
.elementor-widget-text-editor.dark-bg h5,
.elementor-widget-text-editor.dark-bg h6,
.the7-e-tab-content.the7-e-tab-text-content.dark-bg h1,
.the7-e-tab-content.the7-e-tab-text-content.dark-bg h2,
.the7-e-tab-content.the7-e-tab-text-content.dark-bg h3,
.the7-e-tab-content.the7-e-tab-text-content.dark-bg h4,
.the7-e-tab-content.the7-e-tab-text-content.dark-bg h5,
.the7-e-tab-content.the7-e-tab-text-content.dark-bg h6 {
    color: #fff;
}
.dark-bg h2::after {
    background: linear-gradient(to right, #E4B5D8, #FA8D86);
}

/* ---------------------------------
- Global Styles - Menu/Navigation Styles
--------------------------------- */
#primary-menu.main-nav .menu-item a {
    font-family: "area-inktrap-extended", sans-serif !important;
    font-weight: 700;
    font-size: 0.9375rem; /* 15px */
    line-height: 1; /* 100% */
    letter-spacing: -0.05em; /* -5% */
    color: #54515D;
    text-decoration: none;
}
#primary-menu.main-nav .menu-item a .menu-text {
    font-family: "area-inktrap-extended", sans-serif !important;
    font-weight: 700;
}
/* Active state - purple-pink gradient underline (always visible) */
#primary-menu.main-nav .menu-item.current-menu-item .underline,
#primary-menu.main-nav .menu-item.current_page_item .underline,
#primary-menu.main-nav .menu-item.act .underline,
#primary-menu.main-nav .menu-item.current-menu-item i.underline,
#primary-menu.main-nav .menu-item.current_page_item i.underline,
#primary-menu.main-nav .menu-item.act i.underline {
    background: linear-gradient(to right, #4A254E, #E4B5D8) !important;
    background-image: linear-gradient(to right, #4A254E, #E4B5D8) !important;
    background-color: transparent !important;
    opacity: 1 !important;
    height: 3px !important;
    visibility: visible !important;
    transform: scaleX(1) !important;
}
/* Hover state - purple-pink gradient underline */
#primary-menu.main-nav .menu-item a:hover .underline,
#primary-menu.main-nav .menu-item a:hover i.underline,
#primary-menu.main-nav .menu-item:hover .underline,
#primary-menu.main-nav .menu-item:hover i.underline {
    background: linear-gradient(to right, #4A254E, #E4B5D8) !important;
    background-image: linear-gradient(to right, #4A254E, #E4B5D8) !important;
    background-color: transparent !important;
    opacity: 1 !important;
    height: 3px !important;
}
/* Override l-to-r-line theme default teal gradient */
.l-to-r-line > li > a i.underline,
.l-to-r-line > li > a:hover i.underline,
.l-to-r-line > li.act > a i.underline,
.l-to-r-line > li.current-menu-item > a i.underline,
.l-to-r-line > li.current_page_item > a i.underline,
#primary-menu.l-to-r-line > li > a i.underline {
    background: linear-gradient(to right, #4A254E, #E4B5D8) !important;
    background-image: linear-gradient(to right, #4A254E, #E4B5D8) !important;
    background-color: transparent !important;
}
/* Force gradient on all underline states */
#primary-menu.main-nav i.underline {
    --the7-underline-gradient: linear-gradient(to right, #4A254E, #E4B5D8);
}

/* ---------------------------------
- Global Styles - Button Styles
--------------------------------- */
.elementor-widget-button .elementor-button.elementor-button-link.elementor-size-sm {
    background: linear-gradient(to right, #A6271E, #EA9D95);
    color: #fff;
    text-transform: uppercase;
    font-family: "area-inktrap-extended", sans-serif !important;
    font-weight: 700;
    font-size: 1.1rem;
    line-height: 1.1rem;
    padding: 10px 20px;
    border-radius: 10px;
    border: none;
    position: relative;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    transition: opacity 0.3s ease;
    margin-top: 30px;
}
.elementor-widget-button .elementor-button.elementor-button-link.elementor-size-sm:hover {
    opacity: 0.8;
    color: #fff;
}
.elementor-widget-button .elementor-button.elementor-button-link .elementor-button-text {
    color: #fff;
    text-transform: uppercase;
    font-family: "area-inktrap-extended", sans-serif !important;
    font-weight: 700;
    font-size: 1.1rem;
    line-height: 1.2;
}
.elementor-widget-button .elementor-button-content-wrapper {
    display: inline-flex;
    align-items: center;
    position: relative;
}
.elementor-widget-button .elementor-button-content-wrapper::before {
    content: '';
    display: inline-block;
    width: 24px;
    height: 24px;
    margin-right: 5px;
    background: url('/wp-content/themes/nuago/img_assets/dna_icon_v1.png') no-repeat center center;
    background-size: contain;
    flex-shrink: 0;
}
.blue-btn.elementor-widget-button .elementor-button.elementor-button-link.elementor-size-sm {
    background: linear-gradient(to right, #21478D, #0B5FEF);
}
/* Override Elementor lazy load background removal for buttons */
.e-con.e-parent:nth-of-type(n+3):not(.e-lazyloaded) .elementor-widget-button .elementor-button.elementor-button-link.elementor-size-sm,
.e-con.e-parent:nth-of-type(n+4):not(.e-lazyloaded) .elementor-widget-button .elementor-button.elementor-button-link.elementor-size-sm {
    background-image: linear-gradient(to right, #A6271E, #EA9D95) !important;
}
.e-con.e-parent:nth-of-type(n+3):not(.e-lazyloaded) .blue-btn.elementor-widget-button .elementor-button.elementor-button-link.elementor-size-sm,
.e-con.e-parent:nth-of-type(n+4):not(.e-lazyloaded) .blue-btn.elementor-widget-button .elementor-button.elementor-button-link.elementor-size-sm {
    background-image: linear-gradient(to right, #21478D, #0B5FEF) !important;
}
.e-con.e-parent:nth-of-type(n+3):not(.e-lazyloaded) .elementor-widget-button .elementor-button-content-wrapper::before,
.e-con.e-parent:nth-of-type(n+4):not(.e-lazyloaded) .elementor-widget-button .elementor-button-content-wrapper::before {
    background-image: url('/wp-content/themes/nuago/img_assets/dna_icon_v1.png') !important;
}

/* ---------------------------------
- Home Styles
--------------------------------- */
#home-hero,
#home-hero h1,
#home-hero h2,
#home-hero h3,
#home-hero h4,
#home-hero h5,
#home-hero h6,
#home-hero p,
#home-hero span,
#home-hero a,
#home-hero li {
    color: #fff;
}
#home-hero h1{
    padding-bottom: 5px;
}
#home-hero h2{
    font-family: "area-inktrap", sans-serif !important;
    margin-bottom: 0;
    padding-bottom: 10px;
}
#home-hero h2::after {
    background: none;
}
#home-hero .elementor-widget-button .elementor-button.elementor-button-link.elementor-size-sm {
    margin-top: 0px;
}
/* Home Our Science Section - Transition Images */
#home_our_science {
    position: relative;
}
#home_our_science::before {
    content: '';
    position: absolute;
    top: 24px;
    left: 0;
    right: 0;
    width: 100%;
    height: 90px;
    background: url(/wp-content/uploads/2026/03/NUAgo-Wavey-Borders-3.svg) no-repeat center bottom;
    background-repeat: repeat-x;
    transform: translateY(-100%) scaleY(.5);
    z-index: 10;
    pointer-events: none;
}
/* Home Our Pipeline Section - Transition Images */
#home_our_pipline {
    position: relative;
}
/* Transition graphic */
#home_our_pipline::before {
    content: '';
    position: absolute;
    top: 66px;
    left: 0;
    right: 0;
    width: 100%;
    height: 90px;
    background: url(/wp-content/uploads/2026/03/NUAgo-Wavey-Borders-3.svg) no-repeat center bottom;
    background-repeat: repeat-x;
    transform: translateY(-100%) scaleY(-.5);
    z-index: 10;
    pointer-events: none;
    background-size: 100%;
    background-position-x: -90px;
}
#info_stats_row h4{
    font-size: 1rem;
    color: #000;
    margin-bottom: 0;
}
#info_stats_row h3{
    color: #604A7A;

}
/* Purple to pink gradient divider lines between stat columns */
#info_stats_row > .e-con-inner > .e-con.e-child {
    position: relative;
}
/* #info_stats_row >.e-con.e-child:not(:last-child)::after {
    content: '';
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 5px;
    height: 100%;
    background: linear-gradient(180deg, #5B3FA0 0%, #E4B5D8 100%);
} */
#info_stats_row span.small {
    font-size: 1rem;
}
#info_stats_row h3::after {
    content: '';
    display: inline-block;
    width: 19px;
    height: 32px;
    margin-left: 8px;
    vertical-align: baseline;
    background: url('/wp-content/themes/nuago/img_assets/counter_up_arrows.png') no-repeat center center;
    background-size: contain;
}

.section-what-we-do {
    background: linear-gradient(87deg,rgba(255, 255, 255, 1) 41%, rgba(250, 141, 134, 1) 100%);
}

.section-what-we-do:before {
    content: '';
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url(/wp-content/uploads/2026/03/NUAgo_Helix.svg);
    background-repeat: no-repeat;
    background-position: right center;
    opacity: .3;
    background-size: 60%;
}

.mission-vision {
    margin: auto;
    width: 330px;
	text-align: center;
}

.mission-vision h3 {
    color: #512584 !important;
    font-weight: 900;
    text-shadow: 1px 1px 6px #ffffff, 1px 1px 12px #ffffff;
	display: inline-block;
	position: relative;
    font-size: 2rem;
}

.mission-vision h3:before {
    content: '';
    bottom: -4px;
    left: 0;
    width: 100%;
    height: 3px;
    background: #512584;
    position: absolute;
}

.mission-vision p {
    color: #512584;
    font-weight: 800 !important;
    font-size: 1.5rem;
    line-height: 1.3 !important;
    text-shadow: 1px 1px 6px #ffffff, 1px 1px 12px #ffffff;
}




/* ---------------------------------
- Body Styles
--------------------------------- */


/* ---------------------------------
- Footer Styles
--------------------------------- */
#footer.nuago-footer {
    margin-top: 0;
    padding: 0;
    background: none;
}
.footer-main {
    background: url('/wp-content/themes/nuago/img_assets/footer_img_v1.jpg') no-repeat center center;
    background-size: cover;
    padding: 60px 0;
}
.footer-main .footer-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 30px;
}
.footer-logo img {
    max-width: 200px;
    height: auto;
}
.footer-info {
    text-align: left;
}
.footer-bottom {
    background: #2A0D4C;
    padding: 15px 0;
}
.footer-bottom .footer-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 30px;
}
.footer-nav {
    display: flex;
    gap: 30px;
}
.footer-nav a {
    color: #fff;
    font-size: 0.875rem;
    text-decoration: none;
    transition: opacity 0.2s ease;
}
#footer a:hover {
    opacity: 0.8;
    color: #fff;
}
.footer-copyright {
    color: #fff;
    font-size: 0.875rem;
}
.footer-social {
    display: flex;
    gap: 15px;
}
.footer-social a {
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: opacity 0.2s ease;
}
.footer-social a:hover {
    opacity: 0.8;
    color: #fff;
}

/* ---------------------------------
- Responsive Styles
--------------------------------- */
@media only screen and (max-width: 991px) {
    .footer-main .footer-container {
        flex-direction: column;
        text-align: center;
        gap: 30px;
    }
    .footer-info {
        text-align: center;
    }
    .footer-bottom .footer-container {
        flex-direction: column;
        gap: 15px;
        text-align: center;
    }
    .footer-nav {
        flex-wrap: wrap;
        justify-content: center;
    }
}


/* Contact Form  */

#gform_1 input#gform_submit_button_1
 {
    background: linear-gradient(to right, #A6271E, #EA9D95);
    background: linear-gradient(to right, #A6271E, #EA9D95);
    color: #fff;
    text-transform: uppercase !important;
    font-family: "area-inktrap-extended", sans-serif !important;
    font-weight: 700;
    font-size: 1.1rem;
    line-height: 1.1rem;
    padding: 10px 35px 12px;
    border-radius: 10px;
    border: none;
    position: relative;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    transition: opacity 0.3s ease;
}
#gform_1 input#gform_submit_button_1:hover {
    opacity: 0.8;
}

.no-p-margin p {
    margin: 0;
}