/* Hide the header on every page by default */
#custom-header {
    display: none !important;
}

/* Show the header ONLY on the homepage */
.home #custom-header {
    display: block !important;
}
/* 1. TURN FOOTER BACKGROUND WHITE */
#footer-widgets-bg, 
#footer-bg, 
#footer-line-bg, 
.site-footer, 
#colophon {
    background-color: #ffffff !important;
    background: #ffffff !important;
    border-top: 1px solid #eeeeee;
}

/* 2. TURN ALL FOOTER TEXT & LINKS TO DYNAMIC RED */
.footer-widgets .widget-title, 
.footer-widgets .widget, 
.footer-widgets .widget ul li, 
.footer-widgets .widget ul li a, 
.footer-widgets a, 
#footer-line, 
#footer-line a, 
#footer-line .credit-link {
    color: #e64946 !important;
}

/* 3. REMOVE THE RANDOM SUBSCRIBE/FOLLOW BUTTON */
/* This targets the Jetpack button and the WordPress.com floating button */
.jetpack-sub-button, 
#subscribe-footer, 
.wp-block-jetpack-button, 
#infinite-footer, 
.subscribe-button-wrapper,
#subscribe-blog-blog_subscription-2 {
    display: none !important;
    visibility: hidden !important;
}
/* 1. HIDE THE SPECIFIC JETPACK SUBSCRIBE BUTTON */
button[name="jetpack_subscriptions_widget"],
.wp-block-button__link.no-border-radius[type="submit"] {
    display: none !important;
}

/* 2. ENSURE NO GHOST SPACING IS LEFT BEHIND */
.jetpack_subscription_widget, 
.wp-block-jetpack-subscriptions {
    display: none !important;
}
/* 1. Hide the old header */
#header-wrap {
    display: none !important;
}

/* 2. Target Dynamic News' EXACT wrapper to force the cream background */
#navi-wrap {
    background-color: #f6f5f1 !important; 
    border: none !important;
}

/* 3. Strip out the theme's default dark blocks and gradients */
#mainnav, 
#mainnav-menu, 
#mainnav-menu > li {
    background: transparent !important;
    background-image: none !important;
    border: none !important;
}

/* 4. Fix the wonky text, make it black, and perfectly center it vertically */
#mainnav-menu > li > a {
    color: #000000 !important; 
    text-shadow: none !important; /* This removes that blurry shadow! */
    font-weight: bold !important;
    background: transparent !important;
    height: 75px !important; /* This dictates the overall height of your navigation bar */
    display: flex !important; 
    align-items: center !important; /* This perfectly centers the text and logo vertically */
    padding: 0 15px !important; /* Keeps the spacing even */
}

/* 5. The red hover effect */
#mainnav-menu > li > a:hover,
#mainnav-menu > li.current-menu-item > a {
    color: #f1524e !important; 
    background: transparent !important; 
}

/* 6. Logo sizing */
img.custom-nav-logo {
    max-height: 50px !important; /* Keeps the logo inside the 75px bar */
    width: auto !important;
    padding-right: 15px !important;
}