/* ==========================================================================
   SKH HEADER — white two-row header (brand/info row + navigation row).
   Scoped to .skh-hdr; loaded after custom.css so it wins over legacy rules.
   Desktop sizes scale with the viewport (clamp + vw), matching the
   reference design at 1920px and shrinking smoothly down to 1200px.
   ========================================================================== */

.skh-hdr {
    --skh-hdr-blue: #063d78;
    --skh-hdr-blue-soft: #345b82;
    --skh-hdr-orange: #f36c0a;
    --skh-hdr-orange-dark: #d95c02;
    --skh-hdr-orange-tint: #fff3ea;
    --skh-hdr-border: #e7ecf1;
    --skh-hdr-font: 'Manrope', 'Inter', 'Segoe UI', Arial, sans-serif;
    --skh-hdr-serif: 'DM Serif Display', Georgia, 'Times New Roman', serif;
    --skh-hdr-gutter: clamp(18px, 1.67vw, 32px);
    /* Height of the NAAC A artwork; the other badges are sized from it. */
    --skh-badge-h: clamp(50px, 3.95vw, 76px);

    position: relative;
    z-index: 1050;
    width: 100%;
    background: #ffffff;
    border-bottom: 1px solid var(--skh-hdr-border);
    box-shadow: 0 4px 18px rgba(15, 52, 87, 0.07);
    font-family: var(--skh-hdr-font);
}

.skh-hdr.is-scrolled {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 9999;
}

.skh-hdr *,
.skh-hdr *::before,
.skh-hdr *::after {
    box-sizing: border-box;
}

.skh-hdr ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

/* --------------------------------------------------------------------------
   Body grid — the logo column spans the brand row and the menu strip
   -------------------------------------------------------------------------- */
.skh-hdr-body {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    grid-template-rows: auto auto;
}

.skh-hdr-logo {
    grid-column: 1;
    grid-row: 1 / span 2;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 8px 0 8px var(--skh-hdr-gutter);
    text-decoration: none !important;
}

.skh-hdr-main,
.skh-hdr-nav {
    grid-column: 2;
    min-width: 0;
}

.skh-hdr-main {
    grid-row: 1;
}

.skh-hdr-nav {
    grid-row: 2;
}

.skh-hdr .skh-hdr-main__inner,
.skh-hdr .skh-hdr-nav__inner {
    padding-left: clamp(16px, 1.45vw, 28px);
}

/* --------------------------------------------------------------------------
   Announcement marquee (top strip) — items come from the admin Marquees list
   -------------------------------------------------------------------------- */
.skh-hdr-marquee {
    background: linear-gradient(180deg, #f5791c 0%, #ec660a 100%);
    border-bottom: 1px solid rgba(130, 45, 0, 0.18);
    overflow: hidden;
}

.skh-hdr-marquee__inner {
    display: flex;
    align-items: center;
    gap: 14px;
    height: 38px;
    padding: 0 var(--skh-hdr-gutter);
}

.skh-hdr-marquee__label {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    flex-shrink: 0;
    height: 24px;
    padding: 0 11px;
    border-radius: 4px;
    background: var(--skh-hdr-blue);
    box-shadow: 0 2px 6px rgba(6, 61, 120, 0.25);
    color: #ffffff;
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.skh-hdr-marquee__label i {
    font-size: 11px;
}

.skh-hdr-marquee__viewport {
    position: relative;
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 24px, #000 calc(100% - 24px), transparent 100%);
    mask-image: linear-gradient(90deg, transparent 0, #000 24px, #000 calc(100% - 24px), transparent 100%);
}

.skh-hdr-marquee__track {
    display: flex;
    width: max-content;
    animation: skhHdrMarquee var(--skh-marquee-duration, 30s) linear infinite;
    will-change: transform;
}

.skh-hdr-marquee__viewport:hover .skh-hdr-marquee__track,
.skh-hdr-marquee__viewport:focus-within .skh-hdr-marquee__track {
    animation-play-state: paused;
}

/* Each copy is at least as wide as the screen, so the loop never shows a gap. */
.skh-hdr-marquee__set {
    display: flex;
    align-items: center;
    flex-shrink: 0;
    gap: 56px;
    min-width: 100vw;
    padding-right: 56px;
}

.skh-hdr-marquee__item {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #ffffff;
    font-size: 13px;
    font-weight: 500;
    line-height: 1;
    white-space: nowrap;
}

.skh-hdr-marquee__item + .skh-hdr-marquee__item {
    position: relative;
}

.skh-hdr-marquee__item + .skh-hdr-marquee__item::before {
    content: '';
    position: absolute;
    left: -31px;
    top: 50%;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.85);
    transform: translateY(-50%);
}

.skh-hdr-marquee__item i {
    font-size: 13px;
    color: #ffffff;
}

.skh-hdr-marquee__item strong {
    font-weight: 700;
}

.skh-hdr-marquee__link {
    margin-left: 4px;
    color: #fff1dc !important;
    font-weight: 700;
    text-decoration: underline !important;
    text-underline-offset: 3px;
    transition: color 0.2s ease;
}

.skh-hdr-marquee__link:hover {
    color: #ffffff !important;
}

@keyframes skhHdrMarquee {
    from {
        transform: translateX(0);
    }
    to {
        transform: translateX(-50%);
    }
}

/* Hidden in the compact sticky state to keep the header slim. */
.skh-hdr.is-scrolled .skh-hdr-marquee {
    display: none;
}

@media (max-width: 575px) {
    .skh-hdr-marquee__inner {
        gap: 10px;
        height: 34px;
    }

    .skh-hdr-marquee__label {
        padding: 0 8px;
    }

    .skh-hdr-marquee__label span {
        display: none;
    }

    .skh-hdr-marquee__item {
        font-size: 12.5px;
    }
}

/* --------------------------------------------------------------------------
   Row 1 — brand, contact info, accreditations, CTA
   -------------------------------------------------------------------------- */
.skh-hdr-main__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: clamp(14px, 1.05vw, 20px);
    min-height: clamp(112px, 7.3vw, 140px);
    margin: 0 auto;
    padding: clamp(10px, 0.73vw, 14px) var(--skh-hdr-gutter);
    transition: min-height 0.25s ease, padding 0.25s ease;
}

.skh-hdr-brand {
    display: flex;
    align-items: center;
    gap: clamp(14px, 1.45vw, 28px);
    flex: 0 1 auto;
    min-width: 0;
    text-decoration: none !important;
}

.skh-hdr-logo__img {
    display: block;
    flex-shrink: 0;
    width: auto;
    height: clamp(128px, 9.2vw, 176px);
    object-fit: contain;
    transition: height 0.25s ease;
}

.skh-hdr-brand__text {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.skh-hdr-brand__name {
    font-family: var(--skh-hdr-serif);
    font-size: clamp(28px, 2.25vw, 43px);
    font-weight: 400;
    line-height: 1.08;
    color: var(--skh-hdr-blue);
    white-space: nowrap;
    letter-spacing: -0.005em;
}

.skh-hdr-brand__tagline {
    margin-top: clamp(6px, 0.52vw, 10px);
    font-size: clamp(10px, 0.73vw, 14px);
    font-weight: 600;
    line-height: 1.3;
    letter-spacing: clamp(1.5px, 0.16vw, 3px);
    text-transform: uppercase;
    color: var(--skh-hdr-blue-soft);
    white-space: nowrap;
}

.skh-hdr-brand__accent {
    color: var(--skh-hdr-orange);
}

/* Contact items */
.skh-hdr-contact {
    display: flex;
    align-items: center;
    flex: 0 1 auto;
    min-width: 0;
}

.skh-hdr-contact__item {
    display: flex;
    align-items: center;
    gap: clamp(8px, 0.62vw, 12px);
    padding: 0 clamp(10px, 1.04vw, 20px);
    font-size: clamp(12.5px, 0.76vw, 14.5px);
    font-weight: 500;
    line-height: 1.3;
    color: var(--skh-hdr-blue);
    white-space: nowrap;
}

.skh-hdr-contact__item:first-child {
    padding-left: 0;
}

.skh-hdr-contact__item:last-child {
    padding-right: 0;
    font-size: clamp(13.5px, 0.86vw, 16.5px);
    font-weight: 600;
}

.skh-hdr-contact__item + .skh-hdr-contact__item {
    border-left: 1px solid var(--skh-hdr-border);
}

.skh-hdr-contact__item i {
    flex-shrink: 0;
    font-size: clamp(14px, 1.05vw, 20px);
    color: var(--skh-hdr-orange);
}

.skh-hdr-contact__item a {
    color: inherit !important;
    text-decoration: none !important;
    transition: color 0.2s ease;
}

.skh-hdr-contact__item a:hover {
    color: var(--skh-hdr-orange) !important;
}

/* Accreditation badges — original artwork, sized by height only */
.skh-hdr-badges {
    display: flex;
    align-items: center;
    gap: clamp(6px, 0.75vw, 14px);
    flex-shrink: 0;
}

.skh-hdr-badge {
    display: block;
    width: auto !important;
    max-width: none !important;
    object-fit: contain;
}

.skh-hdr-badge--naac {
    height: var(--skh-badge-h) !important;
}

.skh-hdr-badge--qci {
    height: calc(var(--skh-badge-h) * 1.15) !important;
}

.skh-hdr-badge--nba {
    height: calc(var(--skh-badge-h) * 0.85) !important;
}

/* The B++ artwork (1080x1080) has its badge at x212-866 / y240-712 inside
   transparent padding. The frame crops exactly that area, at the same visible
   height as the NAAC A badge, so both read as a matched pair. */
.skh-hdr .skh-naac-bpp-badge-frame {
    --bpp-h: calc(var(--skh-badge-h) * 0.947);
    position: relative;
    display: block;
    flex: 0 0 auto;
    width: calc(var(--bpp-h) * 1.3856) !important;
    height: var(--bpp-h) !important;
    overflow: hidden;
}

.skh-hdr .skh-naac-bpp-badge-frame .skh-naac-bpp-badge {
    position: absolute;
    top: calc(var(--bpp-h) * -0.5085);
    left: calc(var(--bpp-h) * -0.4492);
    width: calc(var(--bpp-h) * 2.2881) !important;
    height: auto !important;
    max-width: none !important;
    max-height: none !important;
}

/* Apply Now */
.skh-hdr-apply {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
    padding: clamp(13px, 0.85vw, 16px) clamp(18px, 1.3vw, 25px);
    border: none;
    border-radius: 5px;
    background: var(--skh-hdr-orange);
    box-shadow: 0 4px 10px rgba(243, 108, 10, 0.18);
    color: #ffffff !important;
    font-family: var(--skh-hdr-font);
    font-size: clamp(14px, 0.9vw, 17px);
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
    text-decoration: none !important;
    transition: background 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
}

.skh-hdr-apply:hover,
.skh-hdr-apply:focus-visible {
    background: var(--skh-hdr-orange-dark);
    box-shadow: 0 6px 14px rgba(243, 108, 10, 0.26);
    transform: translateY(-1px);
}

.skh-hdr-apply i {
    font-size: 0.92em;
    transition: transform 0.2s ease;
}

.skh-hdr-apply:hover i {
    transform: translateX(2px);
}

/* Menu toggle (hidden on desktop) */
.skh-hdr .skh-hdr-toggle {
    display: none;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    padding: 0;
    border: 1px solid var(--skh-hdr-border);
    border-radius: 6px;
    background: #ffffff;
    color: var(--skh-hdr-blue);
    font-size: 19px;
    cursor: pointer;
    transition: border-color 0.2s ease, color 0.2s ease, background 0.2s ease;
}

.skh-hdr .skh-hdr-toggle:hover,
.skh-hdr .skh-hdr-toggle.is-open {
    border-color: rgba(243, 108, 10, 0.45);
    background: var(--skh-hdr-orange-tint);
    color: var(--skh-hdr-orange);
}

/* --------------------------------------------------------------------------
   Row 2 — navigation
   -------------------------------------------------------------------------- */
.skh-hdr-nav {
    border-top: 1px solid var(--skh-hdr-border);
    background: #ffffff;
}

.skh-hdr-nav__inner {
    margin: 0 auto;
    padding: 0 var(--skh-hdr-gutter);
}

.skh-hdr .skh-hdr-menu {
    display: flex !important;
    align-items: stretch !important;
    justify-content: space-between !important;
    flex: 1 1 auto !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    gap: 4px !important;
    min-width: 0 !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
}

.skh-hdr .skh-hdr-menu > .nav-item {
    display: flex !important;
    align-items: stretch !important;
    flex: 0 0 auto !important;
    height: auto !important;
    width: auto !important;
    position: relative !important;
}

.skh-hdr .skh-hdr-menu > .nav-item > .nav-link {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    gap: clamp(5px, 0.4vw, 8px) !important;
    height: clamp(60px, 3.95vw, 76px) !important;
    /* No side padding at 1200px, growing to 12px at 1920px so the underline
       runs past the icon and label as in the reference. */
    padding: 0 clamp(0px, calc((100vw - 1200px) / 60), 12px) !important;
    border: none !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: var(--skh-hdr-blue) !important;
    font-family: var(--skh-hdr-font) !important;
    font-size: clamp(12px, 0.78vw, 15px) !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    letter-spacing: 0.01em !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
    text-shadow: none !important;
    white-space: nowrap !important;
    transform: none !important;
    transition: color 0.2s ease !important;
}

.skh-hdr .skh-hdr-menu > .nav-item > .nav-link .skh-nav-caret {
    margin: 0 0 0 -2px !important;
    font-size: clamp(9px, 0.55vw, 11px) !important;
    color: var(--skh-hdr-blue) !important;
    opacity: 0.9 !important;
    transition: transform 0.2s ease, color 0.2s ease !important;
}

/* Underline — also drawn for dropdown toggles (legacy CSS hides their ::after). */
.skh-hdr .skh-hdr-menu > .nav-item > .nav-link::after {
    content: '' !important;
    display: block !important;
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    top: auto !important;
    width: auto !important;
    height: 3px !important;
    border: none !important;
    border-radius: 0 !important;
    background: var(--skh-hdr-orange) !important;
    opacity: 0;
    transform: scaleX(0) !important;
    transform-origin: center !important;
    transition: transform 0.2s ease, opacity 0.2s ease !important;
}

.skh-hdr .skh-hdr-menu > .nav-item > .nav-link::before {
    display: none !important;
}

.skh-hdr .skh-hdr-menu > .nav-item > .nav-link:hover,
.skh-hdr .skh-hdr-menu > .nav-item.show > .nav-link,
.skh-hdr .skh-hdr-menu > .nav-item > .nav-link.active {
    color: var(--skh-hdr-orange) !important;
    background: transparent !important;
}

.skh-hdr .skh-hdr-menu > .nav-item > .nav-link:hover i,
.skh-hdr .skh-hdr-menu > .nav-item.show > .nav-link i,
.skh-hdr .skh-hdr-menu > .nav-item > .nav-link.active i {
    color: var(--skh-hdr-orange) !important;
}

.skh-hdr .skh-hdr-menu > .nav-item > .nav-link:hover::after,
.skh-hdr .skh-hdr-menu > .nav-item.show > .nav-link::after {
    opacity: 0.55;
    transform: scaleX(1) !important;
}

.skh-hdr .skh-hdr-menu > .nav-item > .nav-link.active::after {
    opacity: 1;
    transform: scaleX(1) !important;
}

.skh-hdr .skh-hdr-menu > .nav-item.show > .nav-link .skh-nav-caret {
    transform: rotate(180deg);
}

.skh-hdr .skh-hdr-menu > .nav-item > .nav-link:focus {
    outline: none !important;
}

.skh-hdr .skh-hdr-menu > .nav-item > .nav-link:focus-visible {
    outline: 2px solid var(--skh-hdr-orange) !important;
    outline-offset: -4px !important;
}

/* Dropdown panels (positioned by navbar.js on desktop) */
.skh-hdr .dropdown-menu,
.skh-hdr .navbar-nav .dropdown-menu {
    min-width: 240px !important;
    max-width: 340px !important;
    max-height: min(440px, 70vh) !important;
    padding: 8px 0 !important;
    border: 1px solid #e6ebf0 !important;
    border-top: 3px solid var(--skh-hdr-orange) !important;
    border-radius: 6px !important;
    background: #ffffff !important;
    box-shadow: 0 12px 28px rgba(20, 45, 70, 0.12) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    animation: skhHdrDropIn 0.18s ease-out !important;
}

.skh-hdr .dropdown-menu::-webkit-scrollbar {
    width: 6px !important;
}

.skh-hdr .dropdown-menu::-webkit-scrollbar-track {
    background: transparent !important;
}

.skh-hdr .dropdown-menu::-webkit-scrollbar-thumb {
    background: #cfd8e2 !important;
    border: 0 !important;
    border-radius: 6px !important;
}

.skh-hdr .dropdown-menu a {
    display: flex !important;
    align-items: flex-start !important;
    gap: 10px !important;
    padding: 10px 18px !important;
    border-left: 0 !important;
    background: transparent !important;
    color: #0b2f57 !important;
    font-family: var(--skh-hdr-font) !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    white-space: normal !important;
    transition: background 0.18s ease, color 0.18s ease !important;
}

.skh-hdr .dropdown-menu a::before {
    display: none !important;
}

.skh-hdr .dropdown-menu a i {
    min-width: 18px !important;
    margin-top: 2px !important;
    font-size: 13px !important;
    color: #6a86a6 !important;
    transform: none !important;
    transition: color 0.18s ease !important;
}

.skh-hdr .dropdown-menu a:hover,
.skh-hdr .dropdown-menu a:focus-visible,
.skh-hdr .dropdown-menu a.active {
    padding-left: 18px !important;
    background: var(--skh-hdr-orange-tint) !important;
    color: var(--skh-hdr-orange) !important;
}

.skh-hdr .dropdown-menu a:hover i,
.skh-hdr .dropdown-menu a:focus-visible i,
.skh-hdr .dropdown-menu a.active i {
    color: var(--skh-hdr-orange) !important;
    transform: none !important;
}

.skh-hdr .dropdown-menu a:focus {
    outline: none !important;
}

@keyframes skhHdrDropIn {
    from {
        opacity: 0;
        transform: translateY(-4px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Search */
.skh-hdr .skh-hdr-search {
    position: relative;
    display: flex;
    align-items: center;
    flex-shrink: 0;
    width: auto !important;
    margin-left: clamp(8px, 1.4vw, 28px);
    padding-left: clamp(8px, 1.25vw, 24px);
}

.skh-hdr .skh-hdr-search::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    width: 1px;
    height: clamp(28px, 2.3vw, 44px);
    background: var(--skh-hdr-border);
    transform: translateY(-50%);
}

.skh-hdr .skh-hdr-search__toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    width: clamp(40px, 2.4vw, 46px);
    height: clamp(40px, 2.4vw, 46px);
    padding: 0;
    border: none;
    border-radius: 6px;
    background: transparent;
    color: var(--skh-hdr-blue);
    font-size: clamp(19px, 1.25vw, 24px);
    cursor: pointer;
    transition: color 0.2s ease, background 0.2s ease;
}

.skh-hdr .skh-hdr-search__toggle:hover,
.skh-hdr .skh-hdr-search.is-open .skh-hdr-search__toggle {
    color: var(--skh-hdr-orange);
    background: var(--skh-hdr-orange-tint);
}

.skh-hdr .skh-hdr-search__panel {
    position: absolute;
    top: calc(100% + 13px);
    right: 0;
    z-index: 1300;
    width: 340px;
    padding: 10px;
    border: 1px solid #e6ebf0;
    border-top: 3px solid var(--skh-hdr-orange);
    border-radius: 6px;
    background: #ffffff;
    box-shadow: 0 12px 28px rgba(20, 45, 70, 0.12);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-4px);
    transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s;
}

.skh-hdr .skh-hdr-search.is-open .skh-hdr-search__panel {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.skh-hdr .skh-top-search-field,
.skh-hdr .skh-top-search-field:focus-within {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    height: auto;
    padding: 0;
    overflow: visible;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

.skh-hdr .skh-top-search-field .navbar-search-input,
.skh-hdr .skh-top-search-field:focus-within .navbar-search-input {
    flex: 1 1 auto;
    width: 100%;
    min-width: 0;
    height: 42px;
    padding: 0 12px;
    opacity: 1;
    border: 1px solid #dfe6ee;
    border-radius: 5px;
    background: #ffffff;
    color: var(--skh-hdr-blue);
    font-family: var(--skh-hdr-font);
    font-size: 14px;
    font-weight: 500;
    outline: none;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.skh-hdr .skh-top-search-field .navbar-search-input:focus {
    border-color: rgba(243, 108, 10, 0.6);
    box-shadow: 0 0 0 3px rgba(243, 108, 10, 0.12);
}

.skh-hdr .skh-top-search-field .navbar-search-button,
.skh-hdr .skh-top-search-field:focus-within .navbar-search-button {
    flex-shrink: 0;
    width: 42px;
    height: 42px;
    border: none;
    border-radius: 5px;
    background: var(--skh-hdr-orange);
    color: #ffffff;
    font-size: 15px;
    transition: background 0.2s ease;
}

.skh-hdr .skh-top-search-field .navbar-search-button:hover,
.skh-hdr .skh-top-search-field:focus-within .navbar-search-button:hover {
    background: var(--skh-hdr-orange-dark);
    color: #ffffff;
}

.skh-hdr .skh-hdr-mobile-contact {
    display: none;
}

/* --------------------------------------------------------------------------
   Desktop (>= 1200px)
   -------------------------------------------------------------------------- */
@media (min-width: 1200px) {
    .skh-hdr .navbar-collapse,
    .skh-hdr .navbar-collapse.collapse:not(.show) {
        display: flex !important;
        align-items: center !important;
        height: auto !important;
        overflow: visible !important;
    }

    /* Compact white menu strip with soft glass pills. */
    .skh-hdr-nav {
        border-top: 1px solid var(--skh-hdr-border);
        background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
        box-shadow: inset 0 1px 0 #ffffff;
    }

    .skh-hdr .skh-hdr-menu {
        --skh-menu-gap: clamp(8px, 0.7vw, 14px);
        justify-content: center !important;
        flex: 0 0 auto !important;
        gap: var(--skh-menu-gap) !important;
        margin: 0 auto !important;
        padding: 8px 0 !important;
    }

    .skh-hdr .skh-hdr-menu > .nav-item {
        align-items: center !important;
    }

    .skh-hdr .skh-hdr-menu > .nav-item > .nav-link {
        height: clamp(32px, 1.9vw, 36px) !important;
        padding: 0 clamp(9px, 0.7vw, 15px) !important;
        border: 1px solid transparent !important;
        border-radius: 7px !important;
        color: var(--skh-hdr-blue) !important;
        font-size: clamp(12px, 0.72vw, 14px) !important;
        transition: background 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, color 0.2s ease !important;
    }

    .skh-hdr .skh-hdr-menu > .nav-item > .nav-link .skh-nav-caret {
        color: var(--skh-hdr-blue) !important;
    }

    /* Thin divider lines between top-level items. */
    .skh-hdr .skh-hdr-menu > .nav-item + .nav-item::before {
        content: '';
        position: absolute;
        left: calc(var(--skh-menu-gap) / -2 - 0.5px);
        top: 50%;
        width: 1px;
        height: 16px;
        background: #d6dee8;
        transform: translateY(-50%);
        pointer-events: none;
    }

    /* Pills replace the underline on desktop. */
    .skh-hdr .skh-hdr-menu > .nav-item > .nav-link::after {
        display: none !important;
    }

    .skh-hdr .skh-hdr-menu > .nav-item > .nav-link:hover,
    .skh-hdr .skh-hdr-menu > .nav-item.show > .nav-link {
        border-color: rgba(243, 108, 10, 0.22) !important;
        background: linear-gradient(180deg, #fff9f4 0%, #fff0e4 100%) !important;
        box-shadow: inset 0 1px 0 #ffffff, 0 2px 6px rgba(243, 108, 10, 0.1) !important;
    }

    .skh-hdr .skh-hdr-menu > .nav-item > .nav-link.active {
        border-color: rgba(243, 108, 10, 0.4) !important;
        background: linear-gradient(180deg, #fff4ea 0%, #ffe4cf 100%) !important;
        box-shadow: inset 0 1px 0 #ffffff, 0 3px 10px rgba(243, 108, 10, 0.16) !important;
    }

    .skh-hdr .skh-hdr-menu > .nav-item > .nav-link:hover,
    .skh-hdr .skh-hdr-menu > .nav-item > .nav-link:hover i,
    .skh-hdr .skh-hdr-menu > .nav-item.show > .nav-link,
    .skh-hdr .skh-hdr-menu > .nav-item.show > .nav-link i,
    .skh-hdr .skh-hdr-menu > .nav-item > .nav-link.active,
    .skh-hdr .skh-hdr-menu > .nav-item > .nav-link.active i {
        color: var(--skh-hdr-orange) !important;
    }

    .skh-hdr .skh-hdr-menu > .nav-item > .nav-link:focus-visible {
        outline: 2px solid var(--skh-hdr-orange) !important;
        outline-offset: 1px !important;
    }

    .skh-hdr .skh-hdr-search {
        margin-left: clamp(8px, 0.8vw, 16px);
        padding-left: clamp(8px, 0.8vw, 16px);
    }

    .skh-hdr .skh-hdr-search::before {
        height: 24px;
    }

    .skh-hdr .skh-hdr-search__toggle {
        width: 36px;
        height: 36px;
        border: 1px solid transparent;
        border-radius: 7px;
        font-size: 18px;
    }

    .skh-hdr .skh-hdr-search__toggle:hover,
    .skh-hdr .skh-hdr-search.is-open .skh-hdr-search__toggle {
        border-color: rgba(243, 108, 10, 0.22);
        background: linear-gradient(180deg, #fff9f4 0%, #fff0e4 100%);
    }

    .skh-hdr .skh-hdr-search__panel {
        top: calc(100% + 15px);
    }

    /* Compact sticky state: slimmer brand row, secondary info hidden. */
    .skh-hdr.is-scrolled {
        --skh-badge-h: 46px;
    }

    .skh-hdr.is-scrolled .skh-hdr-main__inner {
        min-height: 0;
        padding-top: 6px;
        padding-bottom: 6px;
    }

    .skh-hdr.is-scrolled .skh-hdr-logo__img {
        height: 96px;
    }

    .skh-hdr.is-scrolled .skh-hdr-brand__name {
        font-size: clamp(26px, 1.8vw, 34px);
    }

    .skh-hdr.is-scrolled .skh-hdr-brand__tagline {
        margin-top: 4px;
        font-size: clamp(10px, 0.6vw, 11.5px);
    }

    .skh-hdr.is-scrolled .skh-hdr-contact {
        display: none;
    }

    .skh-hdr.is-scrolled .skh-hdr-apply {
        padding: 12px 20px;
        font-size: 14px;
    }

    .skh-hdr.is-scrolled .skh-hdr-menu {
        padding: 5px 0 !important;
    }

    .skh-hdr.is-scrolled .skh-hdr-menu > .nav-item > .nav-link {
        height: 32px !important;
    }

    .skh-hdr.is-scrolled .skh-hdr-search__panel {
        top: calc(100% + 11px);
    }
}

/* Tightest desktop width: slimmer pills so all items and search fit on one line. */
@media (min-width: 1200px) and (max-width: 1299px) {
    .skh-hdr .skh-hdr-menu {
        --skh-menu-gap: 7px;
    }

    .skh-hdr .skh-hdr-menu > .nav-item > .nav-link {
        gap: 4px !important;
        padding: 0 6px !important;
        font-size: 11.5px !important;
        letter-spacing: 0 !important;
    }

    .skh-hdr .skh-hdr-search {
        margin-left: 6px;
        padding-left: 6px;
    }
}

/* Hide the location first, then the email, as the row runs out of width. */
@media (min-width: 1200px) and (max-width: 1899px) {
    .skh-hdr-contact__item:nth-child(2) {
        display: none;
    }
}

@media (min-width: 1200px) and (max-width: 1319px) {
    .skh-hdr-contact__item:nth-child(1) {
        display: none;
    }

    .skh-hdr-contact__item + .skh-hdr-contact__item {
        border-left: 0;
    }
}


/* --------------------------------------------------------------------------
   Tablet & mobile (<= 1199px) — brand row + toggle, collapsible menu
   -------------------------------------------------------------------------- */
@media (max-width: 1199px) {
    .skh-hdr {
        --skh-hdr-gutter: 20px;
        --skh-badge-h: 50px;
    }

    .skh-hdr-logo {
        grid-row: 1;
        padding-top: 8px;
        padding-bottom: 8px;
    }

    .skh-hdr-nav {
        grid-column: 1 / -1;
    }

    .skh-hdr .skh-hdr-main__inner {
        padding-left: 12px;
    }

    .skh-hdr .skh-hdr-nav__inner {
        padding-left: 0;
    }

    .skh-hdr-main__inner {
        min-height: 0;
        gap: 14px;
        padding-top: 10px;
        padding-bottom: 10px;
    }

    .skh-hdr-brand {
        flex: 1 1 auto;
        margin-right: auto;
    }

    .skh-hdr-logo__img {
        height: 72px;
    }

    .skh-hdr-brand__name {
        font-size: 28px;
    }

    .skh-hdr-brand__tagline {
        font-size: 10px;
        letter-spacing: 1.5px;
    }

    .skh-hdr-contact {
        display: none;
    }

    .skh-hdr .skh-hdr-toggle {
        display: inline-flex;
    }

    .skh-hdr-nav {
        border-top: 0;
    }

    .skh-hdr-nav__inner {
        padding: 0;
    }

    .skh-hdr .navbar-collapse {
        border-top: 1px solid var(--skh-hdr-border);
        background: #ffffff;
    }

    .skh-hdr .navbar-collapse.show,
    .skh-hdr .navbar-collapse.collapsing {
        display: flex !important;
        flex-direction: column;
        align-items: stretch !important;
        max-height: calc(100vh - 84px);
        overflow-y: auto !important;
        overscroll-behavior: contain;
    }

    .skh-hdr .skh-hdr-menu {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 0 !important;
        width: 100% !important;
        padding: 4px 0 !important;
    }

    .skh-hdr .skh-hdr-menu > .nav-item {
        flex-direction: column !important;
        width: 100% !important;
        border-bottom: 1px solid #eef2f6;
    }

    .skh-hdr .skh-hdr-menu > .nav-item > .nav-link {
        height: auto !important;
        gap: 12px !important;
        padding: 15px var(--skh-hdr-gutter) !important;
        font-size: 13.5px !important;
    }

    .skh-hdr .skh-hdr-menu > .nav-item > .nav-link .skh-nav-caret {
        margin-left: auto !important;
        font-size: 11px !important;
    }

    .skh-hdr .skh-hdr-menu > .nav-item > .nav-link::after {
        left: 0 !important;
        right: auto !important;
        top: 0 !important;
        bottom: 0 !important;
        width: 3px !important;
        height: auto !important;
        transform: scaleY(0) !important;
    }

    .skh-hdr .skh-hdr-menu > .nav-item > .nav-link:hover::after,
    .skh-hdr .skh-hdr-menu > .nav-item.show > .nav-link::after,
    .skh-hdr .skh-hdr-menu > .nav-item > .nav-link.active::after {
        transform: scaleY(1) !important;
    }

    .skh-hdr .skh-hdr-menu > .nav-item > .nav-link.active {
        background: #fffaf6 !important;
    }

    /* Accordion sub-menus */
    .skh-hdr .dropdown-menu,
    .skh-hdr .navbar-nav .dropdown-menu {
        position: static !important;
        top: auto !important;
        left: auto !important;
        right: auto !important;
        display: none !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        max-height: none !important;
        padding: 0 0 8px !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: #f8fafc !important;
        box-shadow: none !important;
        transform: none !important;
        animation: none !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
    }

    .skh-hdr .nav-item.dropdown.show > .dropdown-menu {
        display: block !important;
    }

    .skh-hdr .nav-item.dropdown:hover > .dropdown-menu:not(.show) {
        display: none !important;
    }

    .skh-hdr .dropdown-menu a {
        padding: 11px var(--skh-hdr-gutter) 11px calc(var(--skh-hdr-gutter) + 30px) !important;
        font-size: 13.5px !important;
    }

    .skh-hdr .dropdown-menu a:hover,
    .skh-hdr .dropdown-menu a:focus-visible,
    .skh-hdr .dropdown-menu a.active {
        padding-left: calc(var(--skh-hdr-gutter) + 30px) !important;
    }

    /* Search sits at the top of the open menu. */
    .skh-hdr .skh-hdr-search {
        order: -1;
        width: 100% !important;
        margin: 0;
        padding: 14px var(--skh-hdr-gutter) 10px;
    }

    .skh-hdr .skh-hdr-search::before,
    .skh-hdr .skh-hdr-search__toggle {
        display: none;
    }

    .skh-hdr .skh-hdr-search__panel {
        position: static;
        width: 100%;
        padding: 0;
        border: 0;
        box-shadow: none;
        opacity: 1;
        visibility: visible;
        transform: none;
    }

    .skh-hdr .skh-hdr-mobile-contact {
        display: flex;
        flex-direction: column;
        gap: 12px;
        padding: 16px var(--skh-hdr-gutter) 20px !important;
        background: #f8fafc;
    }

    .skh-hdr .skh-hdr-mobile-contact li {
        display: flex;
        align-items: center;
        gap: 12px;
        font-size: 13.5px;
        font-weight: 500;
        color: var(--skh-hdr-blue);
    }

    .skh-hdr .skh-hdr-mobile-contact i {
        width: 18px;
        text-align: center;
        color: var(--skh-hdr-orange);
    }

    .skh-hdr .skh-hdr-mobile-contact a {
        color: inherit !important;
        text-decoration: none !important;
        word-break: break-word;
    }

    body.skh-mobile-nav-open {
        overflow: hidden;
    }
}

@media (max-width: 991px) {
    .skh-hdr-badges {
        display: none;
    }
}

@media (max-width: 767px) {
    .skh-hdr {
        --skh-hdr-gutter: 16px;
    }

    .skh-hdr-main__inner {
        gap: 10px;
    }

    .skh-hdr-brand {
        gap: 10px;
    }

    .skh-hdr-logo__img {
        height: 54px;
    }

    .skh-hdr-brand__name {
        font-size: 21px;
    }

    .skh-hdr-brand__tagline {
        margin-top: 4px;
        font-size: 8px;
        letter-spacing: 0.8px;
    }

    .skh-hdr-apply {
        padding: 11px 14px;
        font-size: 13px;
    }

    .skh-hdr .skh-hdr-toggle {
        width: 42px;
        height: 42px;
    }
}

@media (max-width: 575px) {
    .skh-hdr {
        --skh-hdr-gutter: 12px;
    }

    .skh-hdr-main__inner {
        gap: 8px;
        padding-top: 8px;
        padding-bottom: 8px;
    }

    .skh-hdr-brand {
        gap: 8px;
    }

    .skh-hdr-logo__img {
        height: 46px;
    }

    .skh-hdr-brand__name {
        font-size: 17px;
    }

    .skh-hdr-brand__tagline {
        display: none;
    }

    .skh-hdr-apply {
        gap: 0;
        padding: 10px 12px;
        font-size: 12.5px;
    }

    .skh-hdr-apply i {
        display: none !important;
    }

    .skh-hdr .skh-hdr-toggle {
        width: 40px;
        height: 40px;
        font-size: 17px;
    }
}

@media (max-width: 400px) {
    .skh-hdr-logo__img {
        height: 42px;
    }

    .skh-hdr-brand__name {
        font-size: 15.5px;
    }

    .skh-hdr-apply {
        padding: 10px;
        font-size: 12px;
    }

    .skh-hdr .skh-hdr-toggle {
        width: 38px;
        height: 38px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .skh-hdr *,
    .skh-hdr *::before,
    .skh-hdr *::after {
        transition: none !important;
        animation: none !important;
    }
}

/* Swap the toggle glyph to a close icon while the menu is open. */
.skh-hdr .skh-hdr-toggle.is-open .fa-bars::before {
    content: "\f00d";
}

/* "Knowledge" in the brand name picks up the brand orange. */
.skh-hdr-brand__highlight {
    color: var(--skh-hdr-orange);
}

/* --------------------------------------------------------------------------
   Long contact values (full street address, several phone numbers) must never
   push into the brand or badges: only the contact block shrinks, and each value
   truncates with an ellipsis (full text in the title tooltip). The address
   gives way first.
   -------------------------------------------------------------------------- */
@media (min-width: 1200px) {
    .skh-hdr-brand {
        flex: 0 0 auto;
    }

    .skh-hdr-contact {
        flex: 1 1 auto;
        justify-content: center;
        justify-content: safe center;
        overflow: hidden;
    }

    .skh-hdr-contact__item {
        flex: 0 1 auto;
        min-width: 0;
        padding: 0 clamp(10px, 0.8vw, 16px);
    }

    .skh-hdr-contact__item:first-child {
        padding-left: 0;
    }

    .skh-hdr-contact__item:last-child {
        padding-right: 0;
    }

    .skh-hdr-contact__item--email {
        flex: 0 0 auto;
    }

    .skh-hdr-contact__item--location {
        flex-shrink: 3;
        max-width: clamp(210px, 15vw, 300px);
        min-width: 185px;
    }

    .skh-hdr-contact__item--phone {
        flex-shrink: 1;
        max-width: clamp(160px, 11vw, 230px);
        min-width: 150px;
    }

    .skh-hdr-contact__item > a,
    .skh-hdr-contact__item > span {
        min-width: 0;
        white-space: nowrap;
    }

    /* Address and phone may wrap to two lines, then truncate. */
    .skh-hdr-contact__item--location > span,
    .skh-hdr-contact__item--phone > a {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        line-clamp: 2;
        overflow: hidden;
        white-space: normal;
        line-height: 1.35;
    }

    .skh-hdr-contact__item--location,
    .skh-hdr-contact__item--phone {
        white-space: normal;
    }
}
