/* Basic Reset & Body Styles */
* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: Arial, Helvetica, sans-serif;
    line-height: 1.6;
    color: #333; /* Dark grey text */
    background-color: #fff;
    padding-top: 60px; /* Adjust based on final sticky nav height */
}

img {
    max-width: 100%;
    display: block;
}

a {
    text-decoration: none;
    transition: color 0.2s ease, opacity 0.2s ease;
}

/* General layout classes */
.container { max-width: 1100px; margin: 0 auto; padding: 0 25px; }
.content-section { padding: 60px 0; } /* Increased padding slightly */
.light-bg { background-color: #f8f9fa; } /* Light Grey Background */
.text-center { text-align: center; }

/* Headings */
.main-heading, .section-heading {
    font-family: Georgia, Times, 'Times New Roman', serif; /* Example serif font */
    color: #0A2F5B; /* Navy Blue */
    margin-bottom: 30px;
    font-size: 2.8em; /* Adjust as needed */
    font-weight: normal;
}
.section-heading.text-center { margin-bottom: 40px; }

h3.sub-heading { /* Used in #solutions */
    font-size: 1.1em;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 10px;
    color: #D4AF37; /* Gold Accent */
}

/* Buttons */
.button {
    display: inline-block;
    padding: 12px 25px;
    border-radius: 25px;
    font-weight: bold;
    text-transform: uppercase;
    font-size: 0.9em;
    text-decoration: none;
    transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
    cursor: pointer;
    border: 1.5px solid transparent;
    white-space: nowrap;
}
/* Primary Button Style (e.g., Hero, CTA) */
.button.hero-button, .button.cta-button, .button.footer-button {
    background-color: #D4AF37; /* Gold Background */
    color: #0A2F5B; /* Navy Text */
    border-color: #D4AF37; /* Gold Border */
}
.button.hero-button:hover, .button.cta-button:hover, .button.footer-button:hover {
    background-color: #c49d2b; /* Darker Gold */
    border-color: #c49d2b;
    color: #0A2F5B;
}

/* === STICKY NAVIGATION BAR STYLES === */
.sticky-nav {
    background-color: #fff; /* White background */
    color: #0A2F5B; /* Navy text */
    padding: 5px 0; /* Padding applied to container now */
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1000;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1); /* Subtle shadow */
    min-height: 50px;
    display: flex;
    justify-content: center; /* Center the container */
    align-items: center;
}

.sticky-nav-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    height: 100%;
}

.sticky-nav-logo-area {
   display: flex;
   align-items: center;
   gap: 10px;
   color: #0A2F5B; /* Navy text */
   text-decoration: none;
}

.sticky-nav-logo {
   display: block;
   max-height: 40px; /* Adjust as needed */
   width: auto;
}

.sticky-nav-logotext {
    font-weight: bold;
    font-size: 1.2em; /* Slightly larger */
    white-space: nowrap;
    color: #0A2F5B; /* Ensure navy color */
}

.sticky-nav-center {
     display: flex;
     justify-content: center;
     padding: 0 15px;
}

.dropdown-content { /* Desktop menu links */
    display: flex;
    list-style: none;
    padding: 0;
    margin: 0;
    gap: 25px; /* Spacing between links */
}

.dropdown-content li a {
    color: #0A2F5B; /* Navy */
    padding: 5px 0;
    text-decoration: none;
    font-size: 0.9em;
    font-weight: bold;
    white-space: nowrap;
    position: relative;
}
.dropdown-content li a::after { /* Underline hover effect */
    content: '';
    position: absolute;
    width: 0;
    height: 2px;
    bottom: -2px;
    left: 0;
    background-color: #D4AF37; /* Gold */
    transition: width 0.3s ease;
}
.dropdown-content li a:hover::after,
.dropdown-content li a:focus::after {
    width: 100%;
}
.dropdown-content li a:hover {
    color: #0A2F5B; /* Keep color */
    opacity: 1.0; /* No dimming */
}


.mobile-menu-toggle {
    display: none;
    background: transparent;
    border: none;
    color: #0A2F5B; /* Navy icon */
    font-size: 1.8em; /* Larger icon */
    cursor: pointer;
    padding: 5px;
    z-index: 1001;
}

.sticky-nav-actions {
    display: flex;
    align-items: center;
    gap: 15px; /* Space out actions */
}

.sticky-nav-button { /* Style for phone button */
    color: #0A2F5B; /* Navy */
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 0.85em;
    font-weight: bold;
    transition: opacity 0.2s ease;
    white-space: nowrap;
}
.sticky-nav-button:hover { color: #D4AF37; /* Gold hover */ }
.sticky-nav-icon { height: 16px; width: auto; }

/* === PRE-HERO IMAGE SECTION === */
.pre-hero-image-section {
    padding: 20px 0; /* Add some padding */
    background-color: #fff; /* Explicit white background */
    text-align: center; /* Center the image within the container */
}
.pre-hero-image {
    max-width: 100%; /* Ensure image is responsive */
    height: auto;
    display: inline-block; /* Allows centering via text-align */
    border-radius: 8px; /* Optional: Add rounded corners */
    box-shadow: 0 4px 8px rgba(0,0,0,0.1); /* Optional: Add subtle shadow */
}


/* === HERO SECTION === */
.hero {
    background-color: #0A2F5B; /* Navy background */
    color: #fff; /* White text */
    padding: 80px 0; /* Reduced padding slightly */
    text-align: center;
    background-image: url('images/hero-background.jpg'); /* PLACEHOLDER BACKGROUND IMAGE */
    background-size: cover;
    background-position: center center;
    position: relative;
}
.hero::before { /* Overlay for text readability */
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(10, 47, 91, 0.6); /* Semi-transparent navy overlay */
    z-index: 1;
}
.hero-content {
    position: relative;
    z-index: 2;
}
.hero-headline {
    font-size: 3em; /* Adjust size */
    color: #fff;
    margin-bottom: 15px;
    font-family: Georgia, Times, 'Times New Roman', serif;
    line-height: 1.2;
}
.hero-subheadline {
    font-size: 1.2em;
    margin-bottom: 30px;
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
    opacity: 0.9;
}
.hero-button {
    font-size: 1em;
}

/* General Content Image Styling */
.content-image {
    max-width: 100%;
    height: auto;
    display: block;
    margin: 30px auto; /* Vertical margin and centering */
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}


/* === Problem/Solution (About) Section === */
.about-section { background-color: #ffffff; color: #333; }
.about-section .main-heading { color: #0A2F5B; } /* Navy */
.about-section p { margin-bottom: 1em; max-width: 800px; margin-left:auto; margin-right:auto; } /* Center align text block */
.about-section h3.sub-heading { color: #D4AF37; } /* Gold */

/* === Benefits Section === */
#benefits .main-heading { color: #0A2F5B; }
.focus-list { list-style: none; padding-left: 0; margin-bottom: 1.2em; max-width: 800px; margin-left: auto; margin-right: auto; }
.focus-list li { margin-bottom: 1em; padding-left: 30px; position: relative; color: #333; }
.focus-list li::before { content: '✔'; position: absolute; left: 0; color: #0A2F5B; /* Navy Checkmark */ font-size: 1.2em; font-weight: bold; top: 0; }

/* === Testimonials Section === */
.reviews-section { /* Re-using class */
    background: linear-gradient(to right, #0A2F5B, #1E508B); /* Navy gradient */
    color: #fff;
}
.reviews-section .main-heading { color: #fff; }
.reviews-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; margin-bottom: 40px; }
.review-item {
    background-color: rgba(255, 255, 255, 0.08); /* Slightly transparent white */
    padding: 30px;
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    text-align: center;
    border: 1px solid rgba(255, 255, 255, 0.2);
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    color: #fff; /* White text */
}
.review-item:hover { transform: translateY(-5px); box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15); }
.review-item blockquote { font-style: italic; margin-bottom: 15px; flex-grow: 1; font-size: 1em; line-height: 1.6; border: none; padding: 0; }
.review-item cite { font-weight: bold; margin-top: auto; font-style: normal; display: block; padding-top: 15px; }
.review-stars { color: #FFD700; /* Standard Gold */ font-size: 1.4em; margin: 10px auto 0 auto; line-height: 1; }

/* === Services Section === */
.services-section { background-color: #f8f9fa; } /* Light Grey */
.services-section .main-heading { color: #0A2F5B; } /* Navy */
.services-list li { margin-bottom: 0.8em; } /* Slightly tighter spacing */
.services-list li::before { color: #0A2F5B; } /* Navy checkmark */

/* === FAQ Section === */
#faq .main-heading { color: #0A2F5B; }
.faq-list { max-width: 800px; margin: 0 auto; }
.faq-item { margin-bottom: 25px; }
.faq-item h4 { margin-bottom: 8px; color: #0A2F5B; /* Navy Question */ font-size: 1.1em; }
.faq-item p { margin-bottom: 0; color: #333; font-size: 0.95em; }

/* === CTA Section === */
.cta-section { background-color: #f8f9fa; }
.cta-section .main-heading { color: #0A2F5B; }
.cta-section p { margin-bottom: 25px; font-size: 1.1em; color: #333; }

/* === Footer Styles === */
footer { background-color: #0A2F5B; /* Navy Footer */ color: #ccc; /* Light grey text */ padding-top: 40px; padding-bottom: 30px; font-size: 0.9em; }
.footer-divider { display: none; /* Removed divider */ }
.footer-bottom { display: flex; justify-content: space-between; align-items: flex-start; flex-wrap: wrap; gap: 40px; margin-bottom: 30px; }
.footer-column { flex: 1; min-width: 200px; padding: 0 10px; }
.footer-column h4 { margin-bottom: 15px; font-size: 1.2em; color: #fff; /* White heading */ }
.footer-contact p { margin-bottom: 8px; }
.footer-contact a { color: #fff; /* White links */ text-decoration: none; }
.footer-contact a:hover { color: #D4AF37; /* Gold hover */ }
.footer-cta-social h4 { margin-bottom: 20px; } /* Space above button */
.footer-button { /* Specific styling for footer button if needed */
    padding: 10px 20px;
    font-size: 0.85em;
}
.footer-social { margin-top: 25px; }
.social-icons { display: flex; gap: 15px; justify-content: flex-start; /* Align left in this column */ }
.social-icons a img { height: 24px; width: auto; transition: opacity 0.2s ease; filter: brightness(0) invert(1); /* Make icons white */ }
.social-icons a:hover img { opacity: 0.8; }

.footer-legal { text-align: center; font-size: 0.85em; color: #aaa; border-top: 1px solid #3a5f8b; /* Lighter navy border */ padding-top: 20px; margin-top: 30px;}
.footer-legal p { margin-bottom: 5px; }
.footer-legal a { color: #ccc; margin: 0 5px; text-decoration: none; }
.footer-legal a:hover { color: #fff; text-decoration: underline; }

/* === Media Queries === */

/* Desktop styles (Base styles are desktop-first) */

/* Tablet & Smaller Desktop */
@media (max-width: 992px) {
    body { padding-top: 55px; } /* Adjust if nav height changes */
    .sticky-nav-logo { max-height: 35px; }
    .sticky-nav-logotext { font-size: 1.1em; }
    .dropdown-content { gap: 20px; }
    .dropdown-content li a { font-size: 0.85em;}
    .sticky-nav-button { font-size: 0.8em; }

    .hero { padding: 70px 0; } /* Adjust padding */
    .hero-headline { font-size: 2.5em; }
    .hero-subheadline { font-size: 1.1em; }

    .content-section { padding: 50px 0; }
    .main-heading, .section-heading { font-size: 2.5em; }
    .reviews-grid { grid-template-columns: repeat(2, 1fr); gap: 25px; }
}

/* Mobile styles */
@media (max-width: 768px) {
    body { padding-top: 50px; } /* Adjust if nav height changes */
    .sticky-nav { min-height: 50px; }
    .sticky-nav-content.container { padding: 0 15px; } /* Add padding back for mobile */
    .sticky-nav-logo-area { /* Keep logo */ }
    .sticky-nav-logo { max-height: 30px; }
    .sticky-nav-logotext { display: none; } /* Hide text on mobile */

    .sticky-nav-center { /* Mobile menu container */
        display: none;
        position: absolute;
        top: 100%; /* Position below nav */
        left: 0;
        width: 100%;
        background-color: #08264A; /* Darker Navy background */
        box-shadow: 0 5px 10px rgba(0,0,0,0.2);
        z-index: 999;
        flex-direction: column;
        padding: 10px 0;
        border-top: 1px solid #3a5f8b;
    }
    .sticky-nav-center.active { display: flex; } /* Show menu */
    .dropdown-content { /* Mobile menu list */
        flex-direction: column;
        gap: 0;
        width: 100%;
    }
    .dropdown-content li { width: 100%; text-align: center; }
    .dropdown-content li a {
        color: white;
        padding: 12px 25px; /* More padding */
        display: block;
        width: 100%;
        font-size: 1em;
        font-weight: normal;
    }
     .dropdown-content li a::after { display: none; } /* Hide underline effect */
    .dropdown-content li a:hover { background-color: rgba(255, 255, 255, 0.1); }

    .mobile-menu-toggle { display: block; } /* Show hamburger */
    .sticky-nav-actions { gap: 10px; }
    .sticky-nav-button span { display: none; } /* Hide "CALL" text */
    .sticky-nav-icon { height: 20px; } /* Slightly larger icon */

    .pre-hero-image-section { padding: 15px 0; } /* Reduce padding on mobile */
    .hero { padding: 50px 0; } /* Adjust padding */
    .hero-headline { font-size: 2em; }
    .hero-subheadline { font-size: 1em; }
    .hero-button { font-size: 0.9em; padding: 10px 20px;}

    .container { padding: 0 15px; }
    .content-section { padding: 40px 0; }
    .main-heading, .section-heading { font-size: 2.2em; }
    .reviews-grid { grid-template-columns: 1fr; gap: 20px; }
    .focus-list li { padding-left: 25px; }
    .focus-list li::before { font-size: 1.1em; }

    .footer-bottom { flex-direction: column; align-items: center; text-align: center; gap: 30px; }
    .footer-column { padding: 0; min-width: 100%; }
    .social-icons { justify-content: center; }
}

/* Very Small Screens */
@media (max-width: 400px) {
    body { padding-top: 45px; }
    .sticky-nav { min-height: 45px; }
    .sticky-nav-logo { max-height: 28px; }

    .pre-hero-image-section { padding: 10px 0; }
    .hero { padding: 40px 0; }
    .hero-headline { font-size: 1.8em; }
    .hero-subheadline { font-size: 0.9em; }

    .main-heading, .section-heading { font-size: 2em; }
    .review-item { padding: 20px; }
    .review-item blockquote { font-size: 0.9em; }

    .button { font-size: 0.8em; padding: 10px 18px;}
    .footer-button { font-size: 0.8em;}
    .social-icons a img { height: 22px; }
}