/* Basic Reset & Body Styling */
@import url('https://fonts.googleapis.com/css2?family=Merriweather:wght@400;700&display=swap');
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: 'Lato', sans-serif; /* Example font, choose appropriate in Wix */
    line-height: 1.6;
    color: #ffffff; /* Default text color */
    /* Apply gradient using Wix background settings */
    background: linear-gradient(to bottom, #004d4d, #000066);
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

/* Header Styling - Replicate using Wix Header Settings */
.site-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 40px; /* Adjust padding in Wix */
    width: 100%;
    position: relative; /* Change to relative for mobile nav positioning context */
    z-index: 100;
    overflow: hidden; /* Prevent potential overflow issues with nav */
}

/* Remove link styling from header logo link */
.header-logo-link {
    text-decoration: none;
    color: inherit; /* Inherit color from parent */
}

.logo-container {
    display: flex;
    align-items: center;
}

.logo-graphic {
    /* Style the graphic element in Wix */
    margin-right: 20px; /* Increased margin further for very large logo */
    /* Placeholder SVG styling */
    display: inline-block;
    vertical-align: middle;
}

/* Style the actual logo image */
.logo-graphic img {
    width: 160px;  /* Doubled size again */
    height: 160px; /* Doubled size again */
    object-fit: contain; /* Ensure image scales correctly */
    display: block; /* Prevents extra space below image */
}

.logo-text {
    display: flex;
    flex-direction: row; /* Place text on one line */
    align-items: baseline; /* Align the baseline of the two text parts */
    color: #ffffff;
}

.logo-main-text {
    font-size: 3.6em; /* Unified font size for both */
    font-weight: bold;
    line-height: 1.1;
}

.logo-sub-text {
    margin-left: 0.5rem; /* Space between Bright Spot and Insights */
    text-transform: none;
    letter-spacing: 1px;
    font-size: 3.6em; /* Match .logo-main-text size */
    font-weight: bold;
    line-height: 1.1; /* Align with baseline alignment */
}

.menu-icon {
    font-size: 2em; /* Adjust size in Wix */
    color: #ffffff;
    cursor: pointer;
    /* Link this to Wix's menu functionality */
}

/* Main Content Area */
.main-content {
    flex-grow: 1; /* Allows footer to stick to bottom if needed */
    padding: 20px 40px 40px 40px; /* Add vertical padding for improved spacing */
}

/* Headline Section - Style using Wix Text Element settings */
.headline-section {
    padding: 40px 20px 30px 20px; /* Reduced top padding for tighter spacing */
    text-align: center;
}

.main-headline {
    font-size: 3em; /* Adjust font size in Wix (~48px) */
    font-weight: bold;
    color: #ffffff;
    /* Apply outline/shadow using Wix text effects */
    text-shadow: 0 0 15px rgba(255, 255, 255, 0.7); /* Softer white glow */
    max-width: 800px; /* Control width if needed */
    margin: 0 auto; /* Center */
}

/* Service Buttons Section - Replicate using Wix container/repeater and buttons */
.service-buttons-section {
    padding: 40px 20px;
    text-align: center;
}

.button-container {
    display: flex;
    justify-content: center;
    gap: 30px; /* Adjust spacing between buttons in Wix */
    flex-wrap: wrap; /* Ensures stacking on smaller screens */
}

.service-button {
    padding: 30px 60px; /* Increase padding by 50% */
    border: none;
    border-radius: 8px; /* Adjust corner radius in Wix */
    color: #ffffff;
    font-size: 1.65em; /* Increase font size by 50% */
    font-weight: bold;
    cursor: pointer;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    display: flex; /* Helps align icon and text if needed */
    flex-direction: column; /* Stack icon above text */
    align-items: center;
    min-width: 270px; /* Increase min-width by 50% */
}

.service-button:hover {
    transform: translateY(-3px);
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
}

.button-icon {
    font-size: 3.75em; /* Increase icon size by 50% */
    margin-bottom: 15px; /* Increase margin by 50% */
     /* Use Wix icon settings for actual icons */
     /* These are just text placeholders */
}

/* Specific button colors - Apply in Wix button design settings */
/* .btn-consulting { background-color: #008080; } */ /* Renamed */
.btn-services { background-color: #008080; } /* New class name */
.btn-data { background-color: #0066cc; } /* Renamed from .btn-marketplace */
/* Color for the Home nav button */
.btn-home { background-color: #666666; }

/* Personal Message Section - Use Wix Strip/Section and Text Element */
.personal-message-section {
    background-color: #0a0a3c; /* Darker, slightly purplish-blue */
    padding: 70px 60px 100px 60px; /* Increased bottom padding */
    margin-top: 50px; /* Space above this section */
    text-align: center;
    border-radius: 15px; /* Add rounded corners */
    max-width: 870px; /* Match width of 3 buttons + gaps */
    margin-left: auto;  /* Center the section */
    margin-right: auto; /* Center the section */
    overflow: hidden; /* Add overflow hidden to contain floated elements */
}

/* Style for the image within the personal message section */
.personal-image {
    float: right; /* Justify image to the right */
    width: 270px; /* Increase width by 50% (180 * 1.5) */
    height: auto; /* Maintain aspect ratio */
    border-radius: 15px; /* Round the corners */
    margin-top: 0.5em; /* Adjust vertical position (changed from -1em) */
    margin-left: 1em; /* Reduce left margin */
    margin-bottom: 1em; /* Space below the image before signature */
    /* Fade effect using opacity and a subtle shadow */
    opacity: 0.85; 
    box-shadow: 0 0 15px 5px #0a0a3c; /* Glow matching the background */
    /* Alternative: Mask image for a fade-out effect (might need browser prefixes) */
    /* -webkit-mask-image: linear-gradient(to bottom, black 70%, transparent 100%); */
    /* mask-image: linear-gradient(to bottom, black 70%, transparent 100%); */
}

.message-content {
    font-family: 'Merriweather', serif; /* Warm, inviting serif font */
    text-align: left; /* Left-justify text for a more authentic feel */
    font-size: 1.4em; /* Balanced readable size */
    line-height: 1.8; /* Increased line spacing */
    letter-spacing: 0.02em; /* Subtle letter spacing */
    color: #ffffff;
    margin: 0 auto; /* Center text block */
}

/* Add margin below paragraphs in the message section for better spacing */
.message-content > p {
    margin-bottom: 1.5em; /* Increase spacing between paragraphs for warmth */
}

.signature {
    margin-top: 1.5em; /* Restore positive margin, adjust if needed */
    margin-bottom: 0; /* Reset bottom margin for the signature itself */
    font-style: normal; /* Keep signature normal style */
    font-weight: bold;
}

/* Style for social media links/icons */
.social-link {
    text-decoration: none; /* Remove underline from link */
    display: inline-block; /* Allows margin */
    margin-top: 10px;      /* Space above the icon */
}

.social-link i {
    font-size: 1.5em;      /* Adjust icon size as needed */
    color: #ffffff;       /* Match text color */
    transition: color 0.2s ease; /* Smooth hover effect */
}

.social-link:hover i {
    color: #00cc99; /* Change color on hover - example */
}

/* Updated Secondary Navigation Layout */
.secondary-nav-section {
    text-align: center; /* Center the nav container */
    padding-bottom: 30px; /* Add space below nav */
}

.secondary-nav-container {
    display: inline-flex;
    justify-content: space-around; /* Distribute space */
    gap: 10px; /* Smaller gap between buttons */
    max-width: 600px; /* Constrain container width */
    width: 100%; /* Allow shrinking */
}

/* Generic secondary nav link styling */
.secondary-nav-link {
    padding: 10px 20px; /* Slightly smaller padding */
    color: #ffffff;
    font-size: 1.1em; /* Slightly larger font */
    font-weight: bold;
    text-decoration: none;
    border-radius: 50px; /* Pill shape */
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    text-align: center;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 1; /* Make all buttons grow equally */
    white-space: nowrap; /* Prevent text wrapping */
}
.secondary-nav-link:hover {
    transform: translateY(-2px);
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
}

.secondary-nav-link.btn-home {
    background-color: #0a0a3c; /* Revert to Dark blue background */
    color: #ffffff;
}

/* Specific overrides for secondary buttons (non-Home) */
.secondary-nav-link:not(.btn-home) {
    /* Retain existing background colors defined by .btn-services, .btn-tools, .btn-marketplace */
    flex: 1; /* Allow buttons to grow equally */
}

/* Apply specific background colors for secondary nav buttons */
.secondary-nav-link.btn-services:not(.active) {
    background-color: #008080;
}
.secondary-nav-link.btn-data:not(.active) { /* Renamed class */
    background-color: #0066cc;
}
/* Ensure Home doesn't get overlay */
.secondary-nav-link.btn-home.active {
    background-color: #0a0a3c; /* Keep dark blue when active */
}

@media (max-width: 768px) {
    .secondary-nav-container {
        flex-direction: column; /* Stack all buttons vertically on smaller screens */
        align-items: center;
    }
    .secondary-nav-link {
        flex: 0 1 100%; /* Full width on mobile */
    }
}

/* Active page indicator - Overlay only non-Home buttons */
.secondary-nav-link.active {
    /* Apply overlay to any active button */
    position: relative;
}
.secondary-nav-link.active::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background-color: rgba(255,255,255,0.15);
    border-radius: 50px;
    z-index: 1;
}
.secondary-nav-link.active span { /* Ensure text is above overlay */
    position: relative;
    z-index: 2;
}

/* Mobile Navigation Styles */
.mobile-nav {
    position: fixed; /* Or absolute if you prefer it scrolls with header */
    top: 0;
    right: -250px; /* Start off-screen */
    width: 250px;
    height: 100vh;
    background-color: #003333; /* Slightly different background */
    padding-top: 80px; /* Space for header */
    box-shadow: -2px 0 5px rgba(0,0,0,0.2);
    transition: right 0.3s ease-in-out;
    z-index: 99; /* Below header but above content */
    display: flex;
    flex-direction: column;
}

.mobile-nav a {
    color: #ffffff;
    padding: 15px 20px;
    text-decoration: none;
    font-size: 1.2em;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    transition: background-color 0.2s ease;
}

.mobile-nav a:hover {
    background-color: rgba(255, 255, 255, 0.1);
}

.mobile-nav-active {
    right: 0; /* Slide into view */
}

/* --- Responsiveness --- */
/* Use Wix's built-in responsive settings */

/* Example Media Query for stacking buttons (adjust breakpoint as needed) */
@media (max-width: 768px) {
    .site-header {
        padding: 15px 20px;
    }

    .main-headline {
        font-size: 2.2em; /* Adjust for mobile */
    }

    .button-container {
        flex-direction: column; /* Stack buttons vertically */
        align-items: center; /* Center stacked buttons */
        gap: 20px;
    }

    .service-button {
        width: 80%; /* Make buttons wider on mobile */
        max-width: 300px;
        padding: 15px 20px;
    }

    .personal-message-section {
        padding: 40px 20px;
    }

    .menu-icon {
        font-size: 1.8em;
    }
}

@media (max-width: 480px) {
     .main-headline {
        font-size: 1.8em;
    }
    .service-button {
         font-size: 1em;
     }
     .message-content {
        font-size: 1em;
    }
}

/* Add styling for content-section to improve spacing */
.content-section {
    padding: 60px 20px !important; /* Increase vertical padding, override inline */
    margin-bottom: 60px; /* Add spacing below content */
    max-width: 800px; /* Constrain width */
    margin-left: auto;
    margin-right: auto;
    text-align: left; /* Ensure text is left-aligned for readability */
    font-size: 1.1em; /* Slightly larger base font size for content */
    line-height: 1.7; /* More spacing between lines */
    color: #ffffff; /* Ensure high contrast */
}

/* Style for the h3 heading within the content section */
.content-section h3 {
    font-size: 1.8em; /* Increase font size */
    font-weight: bold;
    color: #ffffff;
    text-shadow: 0 0 15px rgba(255, 255, 255, 0.7); /* Add glow effect */
    margin-bottom: 1em; /* Space below the heading */
    text-align: left; /* Left align the heading */
}

.content-section p {
    margin-bottom: 1em; /* Add spacing between paragraphs */
}

/* Improve list spacing within content section */
.content-section ul {
    list-style-position: outside; /* Standard bullet position */
    margin-left: 20px; /* Indent list */
    margin-bottom: 1em; /* Space below list */
}

.content-section li {
    margin-bottom: 0.5em; /* Space between list items */
}

/* Styling for Discovery Call Button */
.discovery-call-link {
    text-decoration: none; /* Remove underline from link */
    display: inline-block; /* Allow margin/padding */
    margin-top: 20px; /* Space above the button */
}

.btn-discovery-call {
    background-color: #f0ad4e; /* Warm yellow/gold */
    color: #333333; /* Dark text for contrast */
    padding: 15px 30px; /* Generous padding */
    border: none;
    border-radius: 50px; /* Pill shape */
    font-size: 1.2em; /* Readable font size */
    font-weight: bold;
    cursor: pointer;
    transition: background-color 0.2s ease, transform 0.2s ease;
    animation: bounce 2s infinite; /* Add bounce animation */
}

.btn-discovery-call:hover {
    background-color: #ec971f; /* Slightly darker yellow on hover */
    transform: translateY(-2px);
    animation-play-state: paused; /* Optional: Pause bounce on hover */
}

/* Keyframes for bounce animation */
@keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    transform: translateY(0);
  }
  40% {
    transform: translateY(-10px); /* Bounce up */
  }
  60% {
    transform: translateY(-5px); /* Slight bounce back */
  }
}

/* Client Examples Section Styling */
.client-examples-section {
    margin-top: 60px; /* Space above this section */
    padding: 40px 20px; /* Padding within the section */
    max-width: 800px; /* Match content section width */
    margin-left: auto;
    margin-right: auto;
    text-align: left; /* Align text left */
    color: #ffffff; /* White text */
    font-size: 1.1em; /* Match content section font size */
    line-height: 1.7; /* Match content section line height */
}

.client-examples-section h2 {
    font-size: 2.5em; /* Slightly smaller than main headline */
    font-weight: bold;
    color: #ffffff;
    text-shadow: 0 0 15px rgba(255, 255, 255, 0.7); /* Apply the same glow effect */
    margin-bottom: 30px; /* Space below the heading */
    text-align: center;
}

.client-examples-section p {
    margin-bottom: 1em; /* Space between paragraphs */
}