/* ==========================================================================
   1. MAIN NAVIGATION (BOXED & CENTERED)
   ========================================================================== */

/* Target the main menu container, override right-alignment, and center rows */
.main-navigation ul, 
#primary-menu, 
.nav-menu {
    display: flex !important;
    flex-wrap: wrap !important;        
    justify-content: center !important; /* Forces row 1 and row 2 to perfectly center align */
    align-items: center !important;
    gap: 8px !important;              
    float: none !important;            
    text-align: center !important;     /* Extra fallback to crush right-alignment */
    margin: 0 auto !important;
    padding: 0 !important;
    list-style: none !important;
}

/* Fix the inner container alignment that most classic themes use */
.main-navigation,
.menu-primary-container,
.nav-menu-container {
    text-align: center !important;
    display: flex !important;
    justify-content: center !important;
}

/* Ensure individual list items don't float right */
.main-navigation li,
#primary-menu li,
.nav-menu li {
    display: inline-block !important;
    float: none !important;
    margin: 0 !important;
}

/* Style the individual boxed links */
.main-navigation a, 
#primary-menu a, 
.nav-menu a {
    font-size: 13px !important;       
    font-weight: 600 !important;      
    color: #1a365d !important;        
    text-transform: uppercase !important;       
    letter-spacing: 0.5px !important;            
    display: inline-block !important;
    padding: 8px 14px !important;     
    border: 2px solid #1a365d !important; 
    border-radius: 4px !important;    
    background-color: transparent !important; 
    transition: all 0.3s ease !important; 
    text-decoration: none !important;
}

/* Hover effects */
.main-navigation a:hover, 
#primary-menu a:hover, 
.nav-menu a:hover {
    color: #ffffff !important;        
    background-color: #1a365d !important; 
    border-color: #1a365d !important; 
    cursor: pointer !important;
}

/* ==========================================================================
   2. SITE HEADER, TITLE, & TAGLINE
   ========================================================================== */

/* Stack the layout vertically so the title is centered above the menu */
.site-header,
.header-main,
.custom-header {
    display: flex !important;
    flex-direction: column !important; 
    align-items: center !important;    
    text-align: center !important;
    justify-content: center !important;
    width: 100% !important;
}

/* Title: Clean, perfectly inline, and centered */
.site-title, 
.site-title a,
#site-title {
    font-family: "Arial Black", "Impact", Gadget, sans-serif !important; 
    font-size: 32px !important;        /* Smaller size so it snaps perfectly onto one single line */
    font-weight: 900 !important;       
    color: #1a365d !important;         
    text-transform: none !important;   
    letter-spacing: -0.5px !important; /* Slight squeeze for that premium block feel */
    white-space: nowrap !important;    /* Absolute guarantee the text won't break into rows */
    display: block !important;
    text-align: center !important;
    margin: 15px auto 5px auto !important;      
}

/* Tagline: Centered directly underneath */
.site-description,
#site-description {
    font-family: "Trebuchet MS", Arial, sans-serif !important; 
    font-weight: bold !important;
    font-size: 11px !important;        
    color: #4a5568 !important;         
    text-transform: uppercase !important; 
    letter-spacing: 3px !important;    
    display: block !important;
    text-align: center !important;
    margin: 0 auto 20px auto !important; 
}

/* Menu: Centered neatly below the tagline */
.main-navigation,
.menu-primary-container,
.nav-menu-container {
    width: 100% !important;
    display: flex !important;
    justify-content: center !important;
    margin-top: 5px !important;
}

/* ==========================================================================
   3. ABOUT US PAGE FULL-WIDTH BREAKOUT (PAGE ID: 381)
   ========================================================================== */

/* Clean up the layout block specifically for the about page */
.page-slug-about .entry-content, 
.page-id-about .entry-content,
.about-us-page .entry-content {
    width: 100% !important;
    max-width: 1100px !important;
    margin: 0 auto !important;
}

/* Force the content wrap to ignore the sidebar space on this page */
.page-slug-about .content-wrap, 
.page-id-about .content-wrap {
    width: 100% !important;
    float: none !important;
}

/* Unconditionally force the About page container to full width and center it */
.page-id-381 #primary,
.page-id-381 .content-area,
.page-id-381 #main,
.page-id-381 .site-main,
.page-id-381 .col-md-8 {
    width: 100% !important;
    max-width: 1000px !important;
    float: none !important;
    margin: 0 auto !important;
}

/* Force the hidden/empty sidebar wrapper to stay out of the way */
.page-id-381 #secondary,
.page-id-381 .sidebar,
.page-id-381 .col-md-4 {
    display: none !important;
    width: 0 !important;
}

/* Add elegant side spacing for mobile screens so text doesn't touch the glass */
@media (max-width: 767px) {
    .page-id-381 #primary,
    .page-id-381 .entry-content,
    .page-id-381 .wp-block-columns {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }
}

/* ==========================================================================
   4. SOLID DARK BLUE LEGAL FOOTER BAR
   ========================================================================== */
body::after {
    content: "© 2026 Family Russell-Smith Travel | Click Here For Privacy Policy" !important;
    display: block !important;
    text-align: center !important;
    background-color: #1a365d !important; /* Matches your dark blue header boxes */
    color: #ffffff !important;
    padding: 18px 0 !important;
    font-family: "Trebuchet MS", Arial, sans-serif !important;
    font-size: 11px !important;
    letter-spacing: 1.5px !important;
    text-transform: uppercase !important;
    font-weight: bold !important;
    cursor: pointer !important;
    width: 100% !important;
    border-top: 3px solid #142b4a !important; /* Rugged shadow line on top */
}

/* Ensure the page layout accommodates the new footer bar perfectly */
html, body {
    margin: 0 !important;
    padding: 0 !important;
    min-height: 100% !important;
}





/* Fix mobile horizontal wobble and prevent title from cutting off */
html, body {
    max-width: 100% !important;
    overflow-x: hidden !important;
}

@media (max-width: 767px) {
    .site-header, 
    .header-main, 
    .site-title-container {
        max-width: 100% !important;
        padding-left: 10px !important;
        padding-right: 10px !important;
        box-sizing: border-box !important;
    }
    
    .site-title, .site-title a {
        font-size: 28px !important; /* Slightly scaling down on small screens so "Travel" never clips */
        white-space: normal !important; /* Allows it to wrap safely if a phone screen is exceptionally narrow */
    }
}