/* style.css - Pro Modern Custom Stylesheet (Updated for Royal Blue & Safety Red Logo) */

:root {
    --primary-color: #083B1E;     /* Deep Forest Green */
    --secondary-color: #2A723D;   /* Safety Foliage Green */
    --dark-color: #091F11;        /* Midnight Pine */
    --light-color: #F1F7F3;       /* Pale Ice Mint Tint */
    --transition-speed: 0.3s;
}

body {
    font-family: 'Plus Jakarta Sans', sans-serif;
    color: #4b5563;
    background-color: #ffffff;
    line-height: 1.7;
}

h1, h2, h3, h4, h5, h6, .font-family-poppins {
    font-family: 'Poppins', sans-serif;
    color: var(--dark-color);
}

/* Scrollbar styling */
::-webkit-scrollbar {
    width: 8px;
}
::-webkit-scrollbar-track {
    background: var(--light-color);
}
::-webkit-scrollbar-thumb {
    background: var(--primary-color);
    border-radius: 4px;
}

/* Nav & header styles */
#mainHeaderNav {
    border-bottom: 1px solid rgba(8, 59, 30, 0.08); /* Derived from primary green #083B1E */
    transition: all var(--transition-speed) ease-in-out;
}
#mainHeaderNav.nav-shrunk {
    padding-top: 10px;
    padding-bottom: 10px;
    background-color: rgba(255, 255, 255, 0.98) !important;
    backdrop-filter: blur(8px);
}
.nav-link {
    color: #4b5563 !important;
    font-weight: 600;
    font-size: 0.92rem;
    transition: color var(--transition-speed);
}
.nav-link:hover, .nav-link.active {
    color: var(--secondary-color) !important; /* Highlights with Red */
}
.dynamic-btn {
    transition: all var(--transition-speed);
    border: 1px solid transparent !important;
}
.dynamic-btn:hover {
    background-color: var(--secondary-color) !important; /* Red call highlights */
    transform: translateY(-2px);
    box-shadow: 0 10px 20px rgba(220, 30, 36, 0.25) !important; /* Branded red shadow glow */
}

/* Form Glassmorphism styling */
.form-glass {
    background: rgba(255, 255, 255, 0.98);
    border: 1px solid rgba(20, 85, 172, 0.15); /* Sleek blue glass border */
    box-shadow: 0 30px 60px rgba(11, 19, 37, 0.15) !important; /* Midnight Navy drop shadow */
}
.form-control, .form-select {
    border: 1.5px solid #e5e7eb;
    border-radius: 10px;
    padding: 11px 15px;
    font-size: 0.88rem;
    color: #1f2937;
    transition: all var(--transition-speed);
}
.form-control:focus, .form-select:focus {
    border-color: var(--primary-color); /* Focus switches to Royal Blue */
    box-shadow: 0 0 0 4px rgba(20, 85, 172, 0.12); /* Blue outline highlight */
}

/* Custom Interactive Tabs */
#pest-tab .nav-link {
    background-color: #ffffff;
    border: 1.5px solid #e5e7eb !important;
    border-radius: 12px !important;
    color: var(--dark-color) !important;
    transition: all var(--transition-speed);
}
#pest-tab .nav-link:hover {
    border-color: var(--secondary-color) !important;
}
#pest-tab .nav-link.active {
    background-color: var(--primary-color) !important;
    color: #ffffff !important;
    border-color: var(--primary-color) !important;
}
#pest-tab .nav-link.active .small {
    color: rgba(255, 255, 255, 0.8);
}
#pest-tab .nav-link.active i {
    color: var(--secondary-color); /* Active icon switches to Safety Red */
}

/* Process Timelines */
.process-step-num {
    position: relative;
    z-index: 2;
}

/* Cards & Components */
.custom-card {
    border-radius: 20px;
    border: 1.5px solid #f1f5f9;
    transition: all var(--transition-speed) ease-in-out;
}
.custom-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 40px rgba(20, 85, 172, 0.05) !important; /* Soft royal blue drop shadow */
    border-color: var(--primary-color); /* Interactive border switches to Royal Blue */
}

/* Footer elements */
.footer-links a {
    transition: all var(--transition-speed);
}
.footer-links a:hover {
    color: var(--secondary-color) !important; /* Footnotes link hover shifts to Red */
    padding-left: 6px;
}

/* App-Like Mobile Offcanvas Left Menu Custom Styling */
.offcanvas-start {
    width: 290px !important;
    border-right: 1.5px solid rgba(20, 85, 172, 0.15) !important; /* Branded blue sidebar border */
}
.offcanvas-body .nav-link {
    font-size: 1rem;
    font-weight: 500;
    transition: all var(--transition-speed) ease-in-out;
}
.offcanvas-body .nav-link:hover {
    background-color: rgba(255, 255, 255, 0.05);
    color: var(--secondary-color) !important; /* Sidebar text hover highlights in Red */
    padding-left: 30px !important;
}

/* Fixed Bottom Quick-Contact Dock (Mobile Viewports Only) */
.mobile-fixed-action-bar {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    height: 60px;
    z-index: 1045; /* Positions above global page sections but beneath standard modals */
    box-shadow: 0 -8px 25px rgba(11, 19, 37, 0.12) !important; /* Deep navy protective shadow shadow */
}
.contact-action-link {
    font-size: 0.98rem;
    letter-spacing: 0.3px;
    transition: background var(--transition-speed);
}
.contact-action-link:active {
    opacity: 0.85;
}
.page-banner h1{color: #ffffff;}
/* Responsive Structural Padding: Keeps content from overlapping with the bottom dock */
@media (max-width: 991.98px) {
    body {
        margin-bottom: 60px !important;
    }
    .hero-section {
        padding-top: 2.5rem !important;
        padding-bottom: 2.5rem !important;
    }
}

.form-control:focus, .form-select:focus {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 4px rgba(8, 59, 30, 0.12); /* Branded green glow */
}

/* Update dynamic primary buttons on hover */
.dynamic-btn:hover {
    background-color: var(--secondary-color) !important;
    box-shadow: 0 10px 20px rgba(42, 114, 61, 0.25) !important; /* Safety green glow */
}

/* Update Glassmorphic search cards */
.form-glass {
    background: rgba(255, 255, 255, 0.98);
    border: 1px solid rgba(8, 59, 30, 0.15); /* Soft forest border */
    box-shadow: 0 30px 60px rgba(9, 31, 17, 0.15) !important; /* Midnight Pine shadow */
}

/* Update Hovering interactive cards */
.custom-card:hover {
    box-shadow: 0 20px 40px rgba(8, 59, 30, 0.05) !important;
}

/* Update App-Like Mobile Menu Sidebar */
.offcanvas-start {
    border-right: 1.5px solid rgba(8, 59, 30, 0.15) !important;
}

/* Responsive Hero Content Styles */
.hero-top-badge {
    background-color: transparent !important;
    border: 1.5px solid var(--secondary-color) !important;
    color: #ffffff !important;
    font-size: 0.85rem;
    font-weight: 600;
    letter-spacing: 0.5px;
}

/* Yellow Promo Capsule */
.promo-yellow-capsule {
    background-color: #FFB703; /* Matches yellow warning fill */
    border: 1.5px solid #FFD166;
    color: #000000;
    font-family: 'Poppins', sans-serif;
}

/* Locations Bar */
.location-bar {
    font-size: 0.88rem;
    font-weight: 700;
    letter-spacing: 1.2px;
    color: #ffffff;
}
.loc-divider {
    color: rgba(255, 255, 255, 0.25);
    font-weight: 300;
}

/* Mobile CTA Button active clicks */
.mobile-hero-cta {
    font-size: 1.05rem;
    letter-spacing: 0.3px;
    transition: transform 0.15s ease-in-out;
}
.mobile-hero-cta:active {
    transform: scale(0.95);
}

@media (max-width: 991.98px) {
    .hero-title {
        font-size: 2.1rem !important; /* Balanced heading scale for mobile viewports */
    }
}