:root {
    --primary-color: #69a818; /* Bright Green from the leaves/plug */
    --secondary-color: #227015; /* Darker Green from the circle wire */
    --accent-color: #c20047; /* Incharz Pink / Magenta Accent */
    --text-dark: #333333;
    --text-light: #ffffff;
    --gradient-bg: linear-gradient(135deg, #87c220 0%, #227015 100%);
    --accent-gradient: linear-gradient(135deg, #d81b43 0%, #8c2491 100%);
}

/* Modern Geometric Font */
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800&display=swap');

body {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

/* Custom Text and Background Classes */
.text-primary-theme { color: var(--primary-color) !important; }
.text-accent-theme { color: var(--accent-color) !important; }
.bg-primary-theme { background-color: var(--primary-color) !important; }
.bg-accent-theme { background-color: var(--accent-color) !important; }
.bg-gradient-theme { background: var(--gradient-bg) !important; }
.bg-accent-gradient { background: var(--accent-gradient) !important; }

/* ---------------------------------
   TWO-TIER MODERN HEADER
--------------------------------- */


/* Top Dark Utility Bar */
.top-bar {
    background-color: #0f172a; /* Deep Slate Blue/Dark */
    color: #e2e8f0;
    font-size: 0.85rem;
    padding: 10px 0;
    font-weight: 400;
}
.top-bar a {
    color: #e2e8f0;
    text-decoration: none;
    transition: 0.3s;
}
.top-bar a:hover {
    color: #fca5a5;
}

/* Main Navbar */


.main-navbar .navbar-brand span {
    font-family: 'Outfit', sans-serif;
    letter-spacing: -0.5px;
}

/* Nav Links - Medium Font Style, Hover Kept */
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;500;600;700&display=swap');

.main-navbar .nav-link {
    font-family: 'Open Sans', Arial, sans-serif;
    color: #1e293b !important; /* Deep gray */
    font-weight: 500; /* Medium weight - perfectly between thin and bold */
    font-size: 1rem; /* Standard size */
    padding: 8px 18px !important;
    margin: 0 3px;
    border-radius: 30px;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.main-navbar .nav-link:hover {
    background: var(--gradient-bg);
    color: #ffffff !important;
    box-shadow: 0 4px 12px rgba(105, 168, 24, 0.25);
    transform: translateY(-2px);
}

/* Action Button in Header */
.main-navbar .btn-theme {
    font-family: 'Outfit', sans-serif;
    font-weight: 600;
    letter-spacing: 0.5px;
    background: var(--accent-gradient);
    color: white;
    border: none;
    border-radius: 30px;
    padding: 10px 24px !important;
    box-shadow: 0 4px 15px rgba(194, 0, 71, 0.25);
    transition: all 0.3s ease;
    border: 2px solid transparent;
}

.main-navbar .btn-theme:hover {
    background: transparent;
    background-clip: padding-box;
    color: var(--accent-color) !important;
    border: 2px solid var(--accent-color);
    box-shadow: none;
}

/* General Button Theme (for other pages) */
.btn-theme {
    background: var(--accent-gradient);
    color: var(--text-light);
    border-radius: 30px;
    padding: 10px 25px;
    border: none;
    transition: 0.3s;
}
.btn-theme:hover {
    background: var(--accent-color);
    color: white;
}

/* Form Styling */
.theme-form-input {
    background: transparent !important;
    border: 1px solid rgba(255, 255, 255, 0.7) !important;
    border-radius: 30px !important;
    color: white !important;
    padding: 12px 20px !important;
}
.theme-form-input::placeholder { color: rgba(255, 255, 255, 0.8) !important; }
.theme-form-input:focus {
    background: rgba(255, 255, 255, 0.1) !important;
    border-color: white !important;
    box-shadow: none !important;
}
.theme-form-input option { color: black; }
.form-check-input { background-color: transparent; border-color: rgba(255, 255, 255, 0.7); }
.form-check-input:checked { background-color: white; border-color: white; }
.form-check-label { color: white; }

/* Hero Slider Video Effect (Slow Zoom Out) */
@keyframes slowZoomOut {
    0% { transform: scale(1.15); }
    100% { transform: scale(1); }
}
#heroCarousel .carousel-item.active img {
    animation: slowZoomOut 6s ease-out forwards;
}






/* Prevent horizontal page scrolling on mobile */






@media (max-width: 768px) {  body { padding-top: 60px; } }





.main-navbar { position: sticky; top: 0; z-index: 1020; width: 100%; background-color: #ffffff; box-shadow: 0 4px 12px rgba(0,0,0,0.05); }