/* General Reset */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

/* Base body styling */
body {
  font-family: 'Roboto', sans-serif;
  font-size: 16px;
  line-height: 1.6;
  color: #333; /* Default text color */
  background-color: #f9f9f9; /* Light background for readability */
}

/* Headings Styling */
h1, h2, h3, h4, h5, h6 {
  font-family: 'Montserrat', sans-serif;
  font-weight: 700; /* Bold for strong headings */
  margin-bottom: 1rem;
  color: #222; /* Darker shade for headings */
}

/* Subheadings (lighter weight than primary headings) */
h2, h3 {
  font-weight: 400;
}

/* Body Text (paragraphs, normal text) */
p, li {
  font-family: 'Roboto', sans-serif;
  font-size: 16px;
  line-height: 1.7;
  margin-bottom: 1rem;
}

/* Call-to-Action / Contact Info */
.cta, .email, .phone {
  font-family: 'Open Sans', sans-serif;
  font-size: 12px;
  font-weight: 200; /* Keep it light for clean readability */
  color: #555; /* Neutral color for informational text */
}

/* Links Styling */
a {
  font-family: 'Roboto', sans-serif;
  color: #0066cc; /* Blue links */
  text-decoration: none;
}

a:hover {
  color: #004a99; /* Slightly darker shade on hover */
}

/* Buttons (Call-to-Actions) */
button, .cta-button {
  font-family: 'Open Sans', sans-serif;
  font-size: 14px;
  font-weight: 400;
  background-color: #ff6600;
  color: #fff;
  padding: 10px 20px;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  transition: background-color 0.3s ease;
}

button:hover, .cta-button:hover {
  background-color: #e65c00;
}

/* Small Text */
small {
  font-family: 'Roboto', sans-serif;
  font-size: 0.875rem;
  color: #777; /* Lighter gray for subtle small text */
}

/* Optional Section Styling for CTA/Contact */
.contact-section {
  background-color: #f4f4f4; /* Light gray background for separation */
  padding: 20px;
  text-align: center;
}

.contact-section .cta, .contact-section .email, .contact-section .phone {
  margin-bottom: 10px;
  display: block; /* Ensure proper spacing in contact sections */
}
/* Mobile-Specific Styles */
@media (max-width: 768px) {  
    /* Ensure Headers Fit and Wrap Properly */
    h1, h2, h3 {  
        font-size: 5vw; /* Makes text dynamically adjust to screen */
        text-align: center;  
        white-space: normal; /* Allows natural wrapping */
        word-break: break-word; /* Ensures long words wrap properly */
        padding: 5px 15px; /* Adds breathing space */
        line-height: 1.2; /* Keeps text compact but readable */
    }  

    /* Force Buttons to Stay Side by Side */
    .button-container {
        display: flex;
        justify-content: center;  
        flex-wrap: wrap; /* Allows buttons to wrap if needed but prefers one row */
        gap: 10px; /* Adds space between buttons */
    }

    /* Optimize Buttons to Fit Horizontally */
    .btn, button {  
        width: auto; /* Adjusts width based on text */
        min-width: 120px; /* Keeps button small but readable */
        max-width: 160px; /* Ensures they fit side by side */
        padding: 10px 15px; /* Adjusts padding */
        font-size: 14px; /* Slightly smaller text */
        display: inline-flex; /* Forces buttons to stay in one row */
        justify-content: center;  
        text-align: center;
        white-space: nowrap; /* Prevents text from wrapping */
        margin: 5px; /* Adds spacing between buttons */
        border-radius: 5px; /* Softer corners */
    }  

    /* Stack Navigation Menu for Full Visibility */
    .menu {  
        display: flex;  
        flex-direction: column; /* Stacks menu items */
        align-items: center;  
        width: 100%;  
        padding: 10px 0;
    }  

    /* Make Menu Items Fully Visible and Spaced Out */
    .menu li {  
        display: block; /* Forces menu items to stack */
        width: 100%;  
        text-align: center;  
        padding: 12px 0;  
        border-bottom: 1px solid #ddd; /* Adds visual separation */
        font-size: 16px; /* Ensures readability */
    }  

    /* Ensure Images Scale Properly */
    img {  
        max-width: 100%;  
        height: auto;  
        display: block;
        margin: 0 auto;
    }  

    /* Adjust Footer for Mobile */
    .footer {  
        text-align: center;  
        padding: 15px;  
    }  
}
.page-id-468 a {
  color: white !important;
}

.page-id-468 a:visited {
  color: white !important;
}

.page-id-468 a:hover {
  color: #ccc !important; /* or change to another hover color */
}
