```css
/* =========================================================
   IGNITE MY CITY — COMPLETE SITE CSS
   ========================================================= */


/* =========================================================
   BASIC PAGE RESET
   ========================================================= */

html,
body {
    margin: 0 !important;
    padding: 0 !important;
}

body {
    overflow-x: hidden !important;
}

.wp-block-html {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 0 !important;
}


/* =========================================================
   HEADER — TRANSPARENT / NARROW / FULL WIDTH
   ========================================================= */

/* Make the main WordPress header transparent */
.site-header,
#masthead,
header.site-header {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    max-width: 100% !important;

    background: transparent !important;
    background-color: transparent !important;

    border: 0 !important;
    box-shadow: none !important;

    margin: 0 !important;
    padding: 0 !important;

    z-index: 99999 !important;
}


/* Keep the header narrow */
.site-header .container,
#masthead .container,
.site-header .inside-header,
#masthead .inside-header {
    min-height: 70px !important;
    height: 70px !important;

    padding-top: 0 !important;
    padding-bottom: 0 !important;

    display: flex !important;
    align-items: center !important;
}


/* Header stays over the hero */
.site-header *,
#masthead * {
    box-sizing: border-box !important;
}


/* =========================================================
   LOGO
   ========================================================= */

.site-branding,
.site-logo,
.custom-logo-link {
    margin: 0 !important;
    padding: 0 !important;
}

.site-branding img,
.site-logo img,
.custom-logo {
    max-height: 48px !important;
    width: auto !important;
    object-fit: contain !important;
}


/* Keep logo on the far left */
.site-branding,
.site-logo {
    margin-right: auto !important;
}


/* =========================================================
   MAIN MENU
   ========================================================= */

.main-navigation,
.primary-navigation,
.main-menu,
.menu-primary-container {
    margin: 0 auto !important;
    padding: 0 !important;
}


/* Menu links */
.main-navigation a,
.primary-navigation a,
.main-menu a {
    background: transparent !important;

    color: #ffffff !important;

    text-decoration: none !important;

    font-size: 14px !important;
    font-weight: 400 !important;
    letter-spacing: 1px !important;

    padding: 8px 12px !important;

    white-space: nowrap !important;
}


/* Menu stays horizontal */
.main-navigation ul,
.primary-navigation ul,
.main-menu ul {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    gap: 4px !important;

    margin: 0 !important;
    padding: 0 !important;

    list-style: none !important;
}


/* =========================================================
   GIVE BUTTON
   ========================================================= */

/*
   IMPORTANT:
   Add a menu item called "GIVE" to your WordPress menu.
   This styles that menu item as the white Give button.
*/

.main-navigation li:last-child a,
.primary-navigation li:last-child a,
.main-menu li:last-child a {
    background: #ffffff !important;
    color: #000000 !important;

    border: 1px solid #ffffff !important;
    border-radius: 0 !important;

    padding: 8px 22px !important;

    font-weight: 400 !important;
    letter-spacing: 1px !important;

    margin-left: 18px !important;
}


/* Give button hover */
.main-navigation li:last-child a:hover,
.primary-navigation li:last-child a:hover,
.main-menu li:last-child a:hover {
    background: transparent !important;
    color: #ffffff !important;
}


/* =========================================================
   REMOVE THE BLACK HOME / PAGE TITLE AREA
   ========================================================= */

.page-header,
.page-title,
.entry-header,
.entry-title,
.archive-header,
.page-banner,
.page-header-area {
    margin-top: 0 !important;
    margin-bottom: 0 !important;

    padding-top: 0 !important;
    padding-bottom: 0 !important;

    min-height: 0 !important;
}


/* Hide the separate HOME title */
.page-header .page-title,
.entry-header .entry-title,
.page-title {
    display: none !important;
}


/* Remove empty space before the first content */
.site-content,
#content,
.content-area,
main {
    margin-top: 0 !important;
}


/* =========================================================
   FIRST HERO
   ========================================================= */

.ignite-hero-wrapper-fixed,
.ignite-first-block {
    position: relative !important;

    width: 100vw !important;
    max-width: 100vw !important;

    margin-top: 0 !important;
    margin-bottom: 0 !important;

    margin-left: calc(50% - 50vw) !important;

    padding: 0 !important;

    box-sizing: border-box !important;

    overflow: hidden !important;
}

.ignite-hero-wrapper-fixed {
    height: 100svh !important;
    min-height: 600px !important;
}

.ignite-hero-wrapper-fixed .bg-slide,
.ignite-first-block .bg-slide {
    position: absolute !important;

    inset: 0 !important;

    width: 100% !important;
    height: 100% !important;

    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
}

.ignite-hero-wrapper-fixed .ignite-overlay,
.ignite-first-block .ignite-overlay {
    position: absolute !important;

    inset: 0 !important;

    width: 100% !important;
    height: 100% !important;

    padding: 25px 5vw 35px !important;

    box-sizing: border-box !important;

    display: flex !important;
    align-items: flex-end !important;

    z-index: 10 !important;
}

.ignite-hero-wrapper-fixed .bottom-row,
.ignite-first-block .bottom-row {
    width: 100% !important;

    display: flex !important;
    flex-direction: row !important;

    justify-content: space-between !important;
    align-items: flex-end !important;

    gap: 20px !important;
}

.ignite-hero-wrapper-fixed .big-tall-text,
.ignite-first-block .big-tall-text {
    max-width: 55% !important;

    color: #fff !important;

    font-size: clamp(35px, 5vw, 80px) !important;

    line-height: .9 !important;
}

.ignite-hero-wrapper-fixed .info-box,
.ignite-first-block .info-box {
    max-width: 40% !important;

    color: #fff !important;

    font-size: clamp(12px, 1.3vw, 20px) !important;

    line-height: 1.3 !important;

    text-align: right !important;
}


/* =========================================================
   CONNECT SECTION
   ========================================================= */

.right-side {
    width: 100% !important;
    max-width: 100% !important;

    box-sizing: border-box !important;

    overflow: visible !important;
}

.content-overlay {
    width: 100% !important;
    max-width: 900px !important;

    margin: 0 auto !important;

    padding: 60px 7vw !important;

    box-sizing: border-box !important;

    overflow: visible !important;
}

.connect-title {
    width: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    box-sizing: border-box !important;

    white-space: normal !important;
    overflow: visible !important;
}

.connect-title .bold-part {
    display: block !important;

    width: 100% !important;

    margin: 0 0 5px 0 !important;

    font-size: clamp(30px, 4vw, 55px) !important;

    line-height: 1.05 !important;

    font-weight: 700 !important;

    white-space: normal !important;

    overflow: visible !important;
}

.connect-title .thin-tall-part {
    display: block !important;

    width: 100% !important;

    margin: 0 !important;

    font-size: clamp(24px, 3.2vw, 45px) !important;

    line-height: 1.1 !important;

    font-weight: 300 !important;

    white-space: normal !important;

    overflow: visible !important;
}

.connect-text {
    width: 100% !important;

    max-width: 700px !important;

    margin: 25px 0 30px 0 !important;

    padding: 0 !important;

    font-size: 17px !important;

    line-height: 1.6 !important;

    white-space: normal !important;

    overflow: visible !important;

    overflow-wrap: normal !important;
}

.connect-button {
    display: inline-flex !important;

    align-items: center !important;
    justify-content: center !important;

    white-space: nowrap !important;
}


/* =========================================================
   WATCH / SCRIPTURE SECTION
   ========================================================= */

.watch-container-wrapper {
    width: 100vw !important;

    margin-left: calc(50% - 50vw) !important;
    margin-right: 0 !important;

    box-sizing: border-box !important;
}

.watch-content-inner {
    width: 100% !important;

    max-width: 1100px !important;

    margin: 0 auto !important;

    box-sizing: border-box !important;
}


/* =========================================================
   IGNITE CONNECT SPLIT SCREEN
   ========================================================= */

.ignite-connect-section {
    width: 100vw !important;

    margin-left: calc(50% - 50vw) !important;

    display: flex !important;

    flex-direction: row !important;

    align-items: stretch !important;

    padding: 0 !important;

    margin-top: 0 !important;
    margin-right: 0 !important;
    margin-bottom: 0 !important;

    box-sizing: border-box !important;

    overflow: hidden !important;
}

.ignite-connect-image {
    width: 50% !important;

    flex: 0 0 50% !important;

    min-width: 0 !important;

    height: 550px !important;

    overflow: hidden !important;
}

.ignite-connect-image img {
    display: block !important;

    width: 100% !important;
    height: 100% !important;

    object-fit: cover !important;

    object-position: center center !important;
}

.ignite-connect-content {
    width: 50% !important;

    flex: 0 0 50% !important;

    min-width: 0 !important;

    display: flex !important;

    flex-direction: column !important;

    justify-content: center !important;

    box-sizing: border-box !important;

    padding: 60px 6vw !important;

    overflow: visible !important;
}

.ignite-connect-title {
    width: 100% !important;

    margin: 0 !important;
    padding: 0 !important;
}

.ignite-connect-bold {
    display: block !important;

    margin: 0 0 12px 0 !important;

    padding: 0 !important;

    font-size: clamp(30px, 3.5vw, 54px) !important;

    line-height: 1.05 !important;

    font-weight: 700 !important;

    white-space: normal !important;
}

.ignite-connect-thin {
    display: block !important;

    margin: 0 !important;

    padding: 0 !important;

    font-size: clamp(24px, 2.8vw, 42px) !important;

    line-height: 1.15 !important;

    font-weight: 300 !important;

    white-space: normal !important;
}

.ignite-connect-text {
    width: 100% !important;

    max-width: 600px !important;

    margin: 28px 0 30px 0 !important;

    padding: 0 !important;

    font-size: 17px !important;

    line-height: 1.6 !important;

    white-space: normal !important;
}

.ignite-connect-button {
    display: inline-flex !important;

    align-items: center !important;

    justify-content: center !important;

    width: fit-content !important;

    padding: 12px 28px !important;

    text-decoration: none !important;

    white-space: nowrap !important;
}


/* =========================================================
   FOOTER — DO NOT ALTER DESIGN
   ========================================================= */

.footer-container {
    margin-bottom: 0 !important;
}

.site-footer {
    display: none !important;

    padding: 0 !important;

    margin: 0 !important;
}

#content {
    margin-bottom: 0 !important;

    padding-bottom: 0 !important;
}


/* =========================================================
   MOBILE
   SAME HORIZONTAL HEADER — NO STACKING
   ========================================================= */

@media screen and (max-width: 768px) {

    /* HEADER */

    .site-header,
    #masthead,
    header.site-header {
        height: 58px !important;

        min-height: 58px !important;
    }

    .site-header .container,
    #masthead .container,
    .site-header .inside-header,
    #masthead .inside-header {
        height: 58px !important;

        min-height: 58px !important;

        padding-left: 10px !important;
        padding-right: 10px !important;
    }

    .site-branding img,
    .site-logo img,
    .custom-logo {
        max-height: 38px !important;
    }

    .main-navigation a,
    .primary-navigation a,
    .main-menu a {
        font-size: 10px !important;

        padding: 5px 5px !important;

        letter-spacing: .5px !important;
    }

    .main-navigation ul,
    .primary-navigation ul,
    .main-menu ul {
        gap: 0 !important;
    }

    .main-navigation li:last-child a,
    .primary-navigation li:last-child a,
    .main-menu li:last-child a {
        padding: 6px 10px !important;

        margin-left: 5px !important;
    }


    /* HERO */

    .ignite-hero-wrapper-fixed,
    .ignite-first-block {
        width: 100vw !important;

        max-width: 100vw !important;

        height: 100svh !important;

        min-height: 560px !important;

        margin-left: calc(50% - 50vw) !important;
    }

    .ignite-hero-wrapper-fixed .ignite-overlay,
    .ignite-first-block .ignite-overlay {
        padding: 20px 15px 25px !important;
    }

    .ignite-hero-wrapper-fixed .bottom-row,
    .ignite-first-block .bottom-row {
        gap: 8px !important;
    }

    .ignite-hero-wrapper-fixed .big-tall-text,
    .ignite-first-block .big-tall-text {
        max-width: 55% !important;

        font-size: clamp(24px, 7vw, 40px) !important;
    }

    .ignite-hero-wrapper-fixed .info-box,
    .ignite-first-block .info-box {
        max-width: 43% !important;

        font-size: clamp(10px, 2.7vw, 14px) !important;
    }


    /* CONNECT */

    .right-side {
        width: 100% !important;

        max-width: 100% !important;
    }

    .content-overlay {
        width: 100% !important;

        max-width: 100% !important;

        padding: 40px 22px !important;
    }

    .connect-title .bold-part {
        font-size: clamp(28px, 8vw, 40px) !important;
    }

    .connect-title .thin-tall-part {
        font-size: clamp(22px, 6.5vw, 32px) !important;
    }

    .connect-text {
        font-size: 16px !important;

        line-height: 1.55 !important;

        margin-top: 22px !important;
    }


    /* WATCH / SCRIPTURE */

    .watch-content-inner {
        flex-direction: row !important;

        gap: 10px !important;

        text-align: center !important;

        align-items: center !important;
    }

    .logo-side,
    .scripture-side,
    .watch-side {
        width: auto !important;

        max-width: none !important;

        flex: 1 1 0 !important;

        text-align: center !important;
    }

    .logo-side img {
        max-width: 100% !important;

        height: auto !important;

        max-height: 90px !important;
    }

    .scripture-text {
        font-size: 11px !important;

        line-height: 1.35 !important;
    }

    .scripture-ref {
        font-size: 10px !important;
    }

    .watch-title {
        font-size: 16px !important;

        text-align: center !important;
    }

    .play-button {
        font-size: 10px !important;

        padding: 7px 10px !important;
    }


    /* SPLIT CONNECT */

    .ignite-connect-section {
        flex-direction: column !important;
    }

    .ignite-connect-image {
        width: 100% !important;

        flex: none !important;

        height: 380px !important;
    }

    .ignite-connect-content {
        width: 100% !important;

        flex: none !important;

        padding: 45px 25px 50px !important;
    }

    .ignite-connect-bold {
        font-size: clamp(28px, 8vw, 40px) !important;

        line-height: 1.08 !important;
    }

    .ignite-connect-thin {
        font-size: clamp(23px, 6.5vw, 32px) !important;
    }

    .ignite-connect-text {
        font-size: 16px !important;

        line-height: 1.55 !important;
    }


    /* FOOTER */

    .footer-container {
        height: auto !important;

        min-height: 350px !important;
    }

    .footer-content {
        flex-wrap: wrap !important;
    }

    .footer-links {
        margin-left: 0 !important;

        width: 100% !important;

        flex-wrap: wrap !important;
    }
}


/* =========================================================
   SMALL PHONES
   ========================================================= */

@media screen and (max-width: 480px) {

    .site-branding img,
    .site-logo img,
    .custom-logo {
        max-height: 34px !important;
    }

    .main-navigation a,
    .primary-navigation a,
    .main-menu a {
        font-size: 9px !important;

        padding-left: 3px !important;
        padding-right: 3px !important;
    }

    .main-navigation li:last-child a,
    .primary-navigation li:last-child a,
    .main-menu li:last-child a {
        padding: 5px 7px !important;

        margin-left: 3px !important;
    }

    .ignite-connect-image {
        height: 320px !important;
    }

    .ignite-connect-content {
        padding: 38px 20px 45px !important;
    }

    .ignite-connect-bold {
        font-size: 29px !important;
    }

    .ignite-connect-thin {
        font-size: 23px !important;
    }
}
```


/* Collapse the theme gap and remove the gray border lines on mobile */
.site-main, 
#content, 
.site-content {
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}

/* Eliminate the specific theme border dividing line above the footer */
.site-footer, 
.universal-slideshow-footer {
  border-top: none !important;
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* Ensure the beliefs section touches the footer flat */
.beliefs-container {
  padding-bottom: 15px !important;
  margin-bottom: 0 !important;
  border-bottom: none !important;
}

/* Remove the final gray divider underneath the last accordion list item */
.belief-item:last-of-type {
  border-bottom: none !important;
}

/* DESCRIPTION - DESKTOP + MOBILE */
.right-description {
    width: 100%;
    box-sizing: border-box;
}

.right-description .description {
    margin: 0;
    padding: 0;
    width: 100%;
    box-sizing: border-box;

    /* Keeps the desktop appearance */
    font-size: 18px;
    line-height: 1.6;
    letter-spacing: 0.5px;
    text-align: left;
    overflow-wrap: break-word;
}

/* TABLET */
@media (max-width: 768px) {
    .right-description {
        width: 100%;
        padding: 0 25px;
        box-sizing: border-box;
    }

    .right-description .description {
        font-size: 15px;
        line-height: 1.55;
        letter-spacing: 0.3px;
    }
}

/* PHONE */
@media (max-width: 480px) {
    .right-description {
        width: 100%;
        padding: 0 20px;
        box-sizing: border-box;
    }

    .right-description .description {
        font-size: 13px;
        line-height: 1.5;
        letter-spacing: 0.2px;
        text-align: left;
    }
}
/* Stack desktop sub-menu links vertically with custom brand transparent blue */
@media screen and (min-width: 768px) {
  .main-navigation ul li ul.sub-menu {
    display: flex !important;
    flex-direction: column !important;
    min-width: 200px !important; /* Gives the text plenty of breathing room */
    background: rgba(0, 95, 220, 0.75) !important; /* Brand blue at 75% opacity */
    padding: 5px 0 !important;
    border-radius: 4px;
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.3);
  }

  .main-navigation ul li ul.sub-menu li {
    width: 100% !important;
    float: none !important;
    display: block !important;
    margin: 0 !important;
  }
  
  .main-navigation ul li ul.sub-menu li a {
    display: block !important;
    width: 100% !important;
    color: #ffffff !important; /* Solid white text letters */
    padding: 12px 20px !important; /* Nice, clean spacing for each link */
    box-sizing: border-box !important;
    transition: background 0.2s ease-in-out;
  }

  /* Subtly lightens the brand blue when hovering over individual links */
  .main-navigation ul li ul.sub-menu li a:hover {
    background: rgba(255, 255, 255, 0.15) !important;
  }
}
/* Remove theme default backgrounds and shadows from the sub-menu container and items */
.main-navigation ul li ul.sub-menu,
.main-navigation ul li ul.sub-menu li {
  background-color: transparent !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* Re-apply our targeted brand blue background strictly to the main sub-menu outer container */
.main-navigation ul li:hover > ul.sub-menu {
  background: rgba(0, 95, 220, 0.75) !important; /* Your brand transparent blue */
}
/* Strip theme backgrounds from all states of the sub-menu items */
.main-navigation ul li ul.sub-menu li,
.main-navigation ul li ul.sub-menu li a,
.main-navigation ul li ul.sub-menu li:hover,
.main-navigation ul li ul.sub-menu li a:hover,
.main-navigation ul li:hover ul.sub-menu li a {
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

/* Force the main container box to always stay brand blue, mouse or no mouse */
.main-navigation ul li ul.sub-menu,
.main-navigation ul li:hover > ul.sub-menu {
  background: rgba(0, 95, 220, 0.75) !important;
}
/* Force absolute uniform alignment, shrink width, and round corners */
.main-navigation ul li ul.sub-menu {
  min-width: 160px !important; /* Shrinks the box width to closely fit the text */
  max-width: 180px !important;
  border-radius: 8px !important; /* Smoothly rounds the box corners */
  overflow: hidden !important;   /* Ensures the blue background matches the rounded shape */
  padding: 6px 0 !important;   /* Tightens the top and bottom padding */
}

/* Force every single list item in the dropdown to drop its margins/padding/shifts */
.main-navigation ul li ul.sub-menu li,
.main-navigation ul li ul.sub-menu li + li,
.site-header .main-navigation ul li ul.sub-menu li {
  padding: 0 !important;
  margin: 0 !important;
  text-indent: 0 !important;
  margin-left: 0 !important;
  padding-left: 0 !important;
}

/* Force both links to snap to the exact same starting line */
.main-navigation ul li ul.sub-menu li a,
.site-header .main-navigation ul li ul.sub-menu li a {
  padding-left: 18px !important; 
  padding-right: 18px !important;
  padding-top: 10px !important;
  padding-bottom: 10px !important;
  text-align: left !important;
  text-indent: 0 !important;
  margin-left: 0 !important;
}
/* Change only the GOT SAVED? text color to match the dropdown blue */
.main-navigation ul.nav-menu > li:nth-last-child(2) a,
.main-navigation ul.menu > li:nth-last-child(2) a {
  color: #1e73be !important; /* The exact bright blue shade from your dropdown */
  font-weight: bold !important; 
  transition: color 0.2s ease-in-out !important;
}

/* Elegant hover state change */
.main-navigation ul.nav-menu > li:nth-last-child(2) a:hover,
.main-navigation ul.menu > li:nth-last-child(2) a:hover {
  color: #ffffff !important; /* Brightens back up to white when hovered */
}
    right: 0 !important;
    margin-left: 0 !important;
  }
}
/* Style the GIVE button as an outlined button with white text and borders */
.main-navigation ul.nav-menu > li:last-child a,
.main-navigation ul.menu > li:last-child a {
  background-color: transparent !important;   /* Removes the blue background entirely */
  color: #ffffff !important;                  /* White letters */
  border: 2px solid #ffffff !important;        /* Smooth, crisp white border outline */
  border-radius: 8px !important;              /* Keeps the matching rounded edges */
  padding: 8px 20px !important;               /* Slightly adjusted to balance the border thickness */
  transition: all 0.2s ease-in-out !important;
}

/* Add an interactive hover effect */
.main-navigation ul.nav-menu > li:last-child a:hover,
.main-navigation ul.menu > li:last-child a:hover {
  background-color: rgba(255, 255, 255, 0.15) !important; /* Subtle white tint on hover */
  color: #ffffff !important;
}
/* 1. Put the GIVE button back to the far right and center the other links */
@media screen and (min-width: 768px) {
  .main-navigation ul.nav-menu,
  .main-navigation ul.menu {
    display: flex !important;
    width: 100% !important;
    align-items: center !important;
    justify-content: center !important;
    position: relative !important;
  }

  .main-navigation ul.nav-menu > li:last-child,
  .main-navigation ul.menu > li:last-child {
    position: absolute !important;
    right: 0 !important;
    margin-left: 0 !important;
  }
}

/* 2. Restore the white rounded frame and white letters for the GIVE button */
.main-navigation ul.nav-menu > li:last-child a,
.main-navigation ul.menu > li:last-child a {
  background-color: transparent !important;   /* No blue background */
  color: #ffffff !important;                  /* White text */
  border: 2px solid #ffffff !important;        /* Crisp white border frame */
  border-radius: 8px !important;              /* Rounded corners */
  padding: 8px 20px !important;               /* Balanced padding */
  transition: all 0.2s ease-in-out !important;
}

/* Keep the interactive hover state */
.main-navigation ul.nav-menu > li:last-child a:hover,
.main-navigation ul.menu > li:last-child a:hover {
  background-color: rgba(255, 255, 255, 0.15) !important;
  color: #ffffff !important;
}
/* 2. Restore the white rounded frame and white letters for the GIVE button */
.main-navigation ul.nav-menu > li:last-child a,
.main-navigation ul.menu > li:last-child a {
  background-color: transparent !important;   /* No blue background */
  color: #ffffff !important;                  /* White text */
  border: 2px solid #ffffff !important;        /* Crisp white border frame */
  border-radius: 8px !important;              /* Rounded corners */
  padding: 6px 16px !important;               /* Marginally reduced vertical padding to prevent cutoff */
  line-height: 1 !important;                  /* Resets the theme's tall line-height spacing */
  display: inline-flex !important;            /* Treats the button text as an isolated layout box */
  align-items: center !important;             /* Vertically centers the text inside the border */
}

/* Keep the interactive hover state */
.main-navigation ul.nav-menu > li:last-child a:hover,
.main-navigation ul.menu > li:last-child a:hover {
  background-color: rgba(255, 255, 255, 0.15) !important;
  color: #ffffff !important;
}
@media screen and (min-width: 768px) {
  /* 1. Expand the navigation bar bounds and ensure it spans 100% width */
  .main-navigation {
    overflow: visible !important;
    padding-top: 15px !important;
    padding-bottom: 15px !important;
    width: 100% !important;
  }

  /* 2. Reset the container padding so the links can center perfectly on the screen */
  .main-navigation ul.nav-menu,
  .main-navigation ul.menu {
    padding-left: 0 !important; 
    padding-right: 0 !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    position: relative !important;
    width: 100% !important;
  }

  /* 3. Pull the logo completely out of the layout flow and lock it to the absolute left edge */
  .main-navigation::before {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important;  /* Perfect vertical alignment */
    width: 60px !important;                  
    height: 60px !important;                 
    background-image: url('https://ignitemycity.org/wp-content/uploads/2026/08/f77644fd-e7f0-4689-b5af-389f96318824.png') !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: left center !important;
    z-index: 999 !important;
  }

  /* 4. Force the GIVE button to lock to the absolute right edge */
  .main-navigation ul.nav-menu > li:last-child,
  .main-navigation ul.menu > li:last-child {
    position: absolute !important;
    right: 0 !important;
    margin-left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
  }
}
/* Move Mobile Menu Button to Center */
@media screen and (max-width: 768px) {
  
  .menu-toggle,
  .mobile-menu-toggle,
  button.menu-toggle,
  .site-header .menu-toggle {
    position: absolute !important;
    left: 50% !important;
    top: 20px !important;
    transform: translateX(-50%) !important;
    margin: 0 !important;
    float: none !important;
  }
  
}