/*
Theme Name: Hello Elementor Child
Theme URI: https://elementor.com/hello-theme/?utm_source=wp-themes&utm_campaign=theme-uri&utm_medium=wp-dash
Template: hello-elementor
Author: Elementor Team
Author URI: https://elementor.com/?utm_source=wp-themes&utm_campaign=author-uri&utm_medium=wp-dash
Description: Hello Elementor is a lightweight and minimalist WordPress theme that was built specifically to work seamlessly with the Elementor site builder plugin. The theme is free, open-source, and designed for users who want a flexible, easy-to-use, and customizable website. The theme, which is optimized for performance, provides a solid foundation for users to build their own unique designs using the Elementor drag-and-drop site builder. Its simplicity and flexibility make it a great choice for both beginners and experienced Web Creators.
Tags: accessibility-ready,flexible-header,custom-colors,custom-menu,custom-logo,featured-images,rtl-language-support,threaded-comments,translation-ready
Version: 3.4.5.1767711571
Updated: 2026-01-06 15:59:31

*/

body, html {margin:0; padding:0;}


/**
 * STICKY HEADER REWRITE
 * Clean SVG Fill swap & Shrink Effect
 */

/* 1. Header & Logo Dimensions (Default) */
.my-sticky-header {
	width:100vw;
    padding-top: 25px !important;
    padding-bottom: 25px !important;
    transition: all 0.4s ease-in-out !important;
}

/* Base Logo Style - Targets the SVG within the widget */
.my-sticky-header .elementor-widget-image img {
    /* Turn black SVG into white */
    filter: brightness(0) invert(1);
    max-width: 180px; 
    height: auto;
    transition: filter 0.4s ease-in-out, max-width 0.4s ease-in-out !important;
}

/* 2. Menu Text & Dropdown Icons (Default State) */
.my-sticky-header .elementor-nav-menu .menu-item .elementor-item,
.my-sticky-header .elementor-widget-n-menu .e-n-menu-title .e-n-menu-title-container .e-n-menu-title-text {
    color: #ffffff !important;
    transition: all 0.4s ease-in-out !important;
}

.my-sticky-header .elementor-nav-menu .menu-item .elementor-item:hover,
.my-sticky-header .elementor-widget-n-menu .e-n-menu-title .e-n-menu-dropdown-icon svg {
    fill: #ffffff !important;
}

/* 3. SCROLLED STATE (Applied via JS) */

/* Header Shrink */
.my-sticky-header.header-scrolled {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
    background-color: #ffffff !important; /* Ensure background is solid white when text turns black */
}

/* Logo "Fill" Swap & Shrink */
.my-sticky-header.header-scrolled .elementor-widget-image img {
    filter: brightness(1) invert(0); /* Reverts to original black */
    max-width: 140px; /* Shrink effect */
}

/* Menu Text & Active Link Color Swap */
.my-sticky-header.header-scrolled .elementor-nav-menu .menu-item .elementor-item,
.my-sticky-header.header-scrolled .elementor-widget-n-menu .e-n-menu-title .e-n-menu-title-container .e-n-menu-title-text,
.my-sticky-header.header-scrolled .elementor-widget-n-menu .e-n-menu-title.e-current .e-n-menu-title-container .e-n-menu-title-text {
    color: #000000 !important;
}

/* Dropdown Icon Swap */
.my-sticky-header.header-scrolled .elementor-nav-menu .menu-item .elementor-item:hover,
.my-sticky-header.header-scrolled .elementor-widget-n-menu .e-n-menu-title .e-n-menu-dropdown-icon svg {
    fill: #000000 !important;
}
/** 
 * PROJECTS MENU 
*/


/* Full width */
#project-menu-wrapper {
    width: 100vw !important;
    position: relative;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
    display: flex;
    justify-content: center;
    pointer-events: none;
}

/* 3-column grid */
#custom-project-nav {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 30px !important;
    width: 100% !important;
    max-width: 1200px !important;
    list-style: none !important;
    padding: 40px !important;
    margin: 0 !important;
    pointer-events: auto !important;
}

/* Fix for list items */
#custom-project-nav .menu-item {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    cursor: pointer !important;
}

#custom-project-nav .menu-item:hover .p-name,
#custom-project-nav .menu-item.is-active .p-name {background-color:#FFFFFFB8;}
#custom-project-nav .p-name {transition: background-color 0.3s ease, color 0.3s ease;}

.p-name {font-size:16px; font-weight;400; padding:5px;}
.p-name .p-location {font-weight:200;}


/**
* PRODUCTS & SERVICES
*/

.product-text:hover {color:#ffffff!important;}
.product-text:hover {background-color:#000000!important;}

.e-n-tabs-heading {z-index:10!important; margin-bottom:-1px;}
