.kl-announcement-bar {
    width: 100%;
    background: #233ed4;
    color: #fff;
    text-align: center;
    font-size: 16px;
    padding: 11px 0;
    font-family: inherit;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1001;
  }
  .kl-announcement-bar b {
    font-weight: 700;
  }
  @media (max-width: 600px) {
    .kl-announcement-bar {
      font-size: 13px;
      padding: 8px 4px;
    }
  }
  .kl-announcement-bar-placeholder {
    height: 28px; /* Default height for desktop */
  }
  @media (max-width: 600px) {
    .kl-announcement-bar-placeholder {
      height: 29px; /* Height for mobile */
    }
  }
  .kl-header {
    margin-top: 44px;
  }
  @media (max-width: 600px) {
    .kl-header {
      margin-top: 34px;
    }
  }

  /* == DEFAULT SUBMENU STYLES (white background) == */
  /* Applied to submenus generated by render_submenu, not the Degrees & Programs megamenu */
  .kl-navbar-submenu-wrapper:not(.kl-megamenu-panel) .kl-navbar-submenu {
    background-color: #fff; /* White background */
    padding: 10px;
    list-style: none;
    margin: 0;
    min-width: 220px; /* Adjust as needed */
    border-radius: 0 0 4px 4px;
    border: 1px solid #eee;
    border-top: none; /* Assuming top border comes from parent or is not needed */
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
  }
  .kl-navbar-submenu-wrapper:not(.kl-megamenu-panel) .kl-navbar-submenu .kl-navbar-submenu__item .kl-navbar-submenu__button {
    color: #333; /* Dark text */
    padding: 8px 15px;
    display: block;
    text-decoration: none;
    background-color: transparent;
  }
  .kl-navbar-submenu-wrapper:not(.kl-megamenu-panel) .kl-navbar-submenu .kl-navbar-submenu__item .kl-navbar-submenu__button:hover,
  .kl-navbar-submenu-wrapper:not(.kl-megamenu-panel) .kl-navbar-submenu .kl-navbar-submenu__item .kl-navbar-submenu__button:hover span {
    background-color: #f5f5f5; /* Light grey background on hover */
    color: #f5a000; /* Orange text on hover, consistent with megamenu */
  }
  .kl-navbar-submenu-wrapper:not(.kl-megamenu-panel) .kl-navbar-submenu .kl-navbar-submenu__item .kl-navbar-submenu__button span {
    color: #333; /* Ensure span text is also dark */
  }


  /* == DEGREES & PROGRAMS MEGAMENU STYLES (new design) == */
  
  /* Styles for the mega menu panel wrapper */
  .kl-navbar__item--degrees-programs .kl-megamenu-panel {
    background-color: #fff; /* White background for the panel */
    border-top: 3px solid #f5a000; /* Orange top border */
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15); /* Subtle shadow */
    padding: 25px 30px; /* Padding around the content */
    /* display: none; /* Hidden by default, shown by JS/hover - handled by parent .kl-navbar-submenu-wrapper */
    position: absolute;
    left: 0;
    top: 100%; /* Position below the parent menu item */
    width: auto;
    min-width: 600px; /* Adjust as needed for content */
    z-index: 1000;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
  }

  /* Show the wrapper when parent is active (JS controlled) or hovered (CSS fallback) */
  /* This rule can remain somewhat general for all submenu wrappers, but the Degrees & Programs one has kl-megamenu-panel */
  .kl-navbar__item.kl-navbar__parent--active .kl-navbar-submenu-wrapper,
  .kl-navbar__item.kl-navbar__parent:hover .kl-navbar-submenu-wrapper {
    display: block;
  }

  /* The first UL inside the wrapper is the flex container for columns */
  .kl-navbar__item--degrees-programs .kl-megamenu-panel .kl-megamenu-columns {
    display: flex;
    flex-direction: row;
    list-style: none;
    padding: 0;
    margin: 0;
    background-color: transparent; /* Ensure no conflicting background */
  }

  /* Each direct child LI of the flex container is a column */
  .kl-navbar__item--degrees-programs .kl-megamenu-panel .kl-megamenu-column {
    flex: 1; /* Distribute space */
    padding: 0 20px; /* Spacing between columns */
  }
  .kl-navbar__item--degrees-programs .kl-megamenu-panel .kl-megamenu-column:first-child {
    padding-left: 0;
  }
  .kl-navbar__item--degrees-programs .kl-megamenu-panel .kl-megamenu-column:last-child {
    padding-right: 0;
  }

  /* Style for column titles (e.g., "School of Business") */
  .kl-navbar__item--degrees-programs .kl-megamenu-panel .kl-megamenu-column-title {
    color: #f5a000; /* Orange color for titles */
    font-weight: bold;
    font-size: 1em; /* Adjust as needed */
    text-decoration: none;
    display: block;
    margin-bottom: 15px; /* Space below title */
    background-color: transparent; /* Override general button styles */
    padding: 0; /* Reset padding if any from general button */
  }
  .kl-navbar__item--degrees-programs .kl-megamenu-panel .kl-megamenu-column-title:hover {
    color: #e09000; /* Darker orange on hover for titles */
    text-decoration: none; /* Titles typically don't underline */
  }

  /* Styling for the list of links under each column title (the nested ULs) */
  .kl-navbar__item--degrees-programs .kl-megamenu-panel .kl-megamenu-links {
    list-style: none;
    padding: 0;
    margin: 0;
    background-color: transparent; /* Ensure no conflicting background */
  }

  /* Styling for individual program links */
  .kl-navbar__item--degrees-programs .kl-megamenu-panel .kl-megamenu-links li a {
    color: #333; /* Dark grey/black text for links */
    text-decoration: none;
    display: block;
    padding: 6px 0; /* Vertical padding for links */
    font-weight: normal; /* Reset font-weight */
    font-size: 0.95em; /* Slightly smaller than title */
    background-color: transparent; /* Override general button styles */
  }
  .kl-navbar__item--degrees-programs .kl-megamenu-panel .kl-megamenu-links li a:hover {
    color: #f5a000; /* Orange hover for links */
    text-decoration: underline;
  }

  /* == MOBILE STYLES FOR SUBMENUS == */
  @media (max-width: 991px) { /* Adjust breakpoint as needed, e.g., where hamburger menu activates */
    
    
    .kl-navbar--active .kl-navbar__content {
      position: absolute; /* Or fixed, depending on desired scroll behavior relative to viewport vs .kl-navbar */
      top: 70px; /* As per your request */
      left: 0;
      width: 100%;
      height: calc(100vh - 120px); /* Full viewport height minus the top offset */
      background-color: #fff; /* Assuming a white background for the mobile menu panel */
      overflow-y: auto; /* Allow scrolling for menu content */
      z-index: 999; /* Ensure it's above other content but below fixed header elements like announcement bar */
    }

    .kl-navbar__item.kl-navbar__parent--active .kl-navbar-submenu-wrapper,
    .kl-navbar__item.kl-navbar__parent:hover .kl-navbar-submenu-wrapper {
        /* On mobile, ensure submenus are shown by click (JS toggling kl-navbar__parent--active) */
    }

    .kl-navbar-submenu-wrapper, /* General wrapper for all submenus */
    .kl-navbar__item--degrees-programs .kl-megamenu-panel { /* Specific for D&P megamenu */
        position: static; /* Flow within the mobile nav, not absolute */
        width: 100%;
        box-shadow: none;
        border-radius: 0;
        min-width: 0;
        border-left: none;
        border-right: none;
    }

    .kl-navbar__item--degrees-programs .kl-megamenu-panel {
        padding: 15px 10px; /* Panel padding: 15px top/bottom, 10px left/right */
        border-top: 1px solid #eee;
        border-bottom: 1px solid #eee;
    }

    .kl-navbar__item--degrees-programs .kl-megamenu-panel .kl-megamenu-columns {
        flex-direction: row; /* Ensure side-by-side columns */
        flex-wrap: wrap; /* Allow wrapping if more than 2 columns were ever used */
        margin: 0 -5px; /* Negative margin to counteract column padding for edge alignment */
    }

    .kl-navbar__item--degrees-programs .kl-megamenu-panel .kl-megamenu-column {
        flex: 0 0 50%; /* Each column takes 50% of the container width */
        max-width: 50%;
        padding: 0 5px; /* Creates a 10px gap between columns (5px on each side) */
        box-sizing: border-box; /* Padding included in the 50% width */
        margin-bottom: 15px; /* Space below columns if they wrap or before next section */
    }
    .kl-navbar__item--degrees-programs .kl-megamenu-panel .kl-megamenu-column:last-child {
        margin-bottom: 0; /* Remove bottom margin if it's the last item in the flow */
    }
    
    .kl-navbar__item--degrees-programs .kl-megamenu-panel .kl-megamenu-column-title {
        margin-bottom: 8px;
        font-size: 0.9em; /* Slightly smaller title for mobile */
        line-height: 1.3;
    }

    .kl-navbar__item--degrees-programs .kl-megamenu-panel .kl-megamenu-links li a {
        padding: 6px 0; /* Vertical padding, no horizontal as column padding handles it */
        font-size: 0.85em; /* Smaller link text */
        line-height: 1.4;
        display: block; /* Ensure links take full width for tap area and line wrapping */
    }

    /* Default submenus on mobile (single column, stacked) */
    .kl-navbar-submenu-wrapper:not(.kl-megamenu-panel) .kl-navbar-submenu {
        padding: 0;
        border-top: 1px solid #eee; /* Simpler border */
        border-bottom: 1px solid #eee;
        min-width: 0;
    }
    .kl-navbar-submenu-wrapper:not(.kl-megamenu-panel) .kl-navbar-submenu .kl-navbar-submenu__item .kl-navbar-submenu__button {
        padding: 10px 15px; /* Consistent padding */
        border-bottom: 1px solid #f0f0f0; /* Separator for items */
    }
    .kl-navbar-submenu-wrapper:not(.kl-megamenu-panel) .kl-navbar-submenu .kl-navbar-submenu__item:last-child .kl-navbar-submenu__button {
        border-bottom: none;
    }
  }