/* Final responsive fixes loaded after all other styles.
   Keeps large desktop layout intact and only adjusts problematic widths. */

/* ══════════════════════════════════════════════════════════════════════
   992 – 1199.98 px  |  Medium laptops / tablets-landscape
   Navbar-toggler is HIDDEN; full horizontal nav is always visible.
   ══════════════════════════════════════════════════════════════════════ */
@media only screen and (min-width: 992px) and (max-width: 1199.98px) {
  html,
  body {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
  }

  .sticky-header-shell,
  .header-wrapper,
  .header-wrapper .container-fluid.position-relative.p-0,
  .carousel-header,
  .ticker-bar,
  .notice-bar,
  .news-bar {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
  }

  /* ── Navbar: desktop/horizontal mode ── */
  .navbar.navbar-expand-custom {
    flex-wrap: nowrap !important;
    align-items: center !important;
    width: 100% !important;
    gap: 4px !important;
    justify-content: flex-start !important;
  }

  /* Toggler is NEVER shown on laptop / desktop */
  .navbar.navbar-expand-custom .navbar-toggler {
    display: none !important;
  }

  /* Collapse always open / horizontal */
  .navbar.navbar-expand-custom .navbar-collapse {
    display: flex !important;
    flex-basis: auto !important;
    flex: 1 1 auto !important;
    width: auto !important;
    margin-top: 0 !important;
    padding: 0 !important;
    border-top: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    justify-content: flex-end !important;
    min-width: 0 !important;
  }

  .navbar.navbar-expand-custom .navbar-brand {
    flex: 0 0 auto !important;
    max-width: none !important;
    margin-right: 6px !important;
    gap: 5px !important;
  }

  /* Horizontal nav row */
  .navbar.navbar-expand-custom .navbar-nav {
    flex-direction: row !important;
    align-items: center !important;
    width: auto !important;
    gap: 0 !important;
    flex-wrap: nowrap !important;
    margin-left: auto !important;
    justify-content: flex-end !important;
  }

  .navbar.navbar-expand-custom .navbar-nav .nav-item {
    position: relative !important;
  }

  .navbar.navbar-expand-custom .navbar-nav .nav-link,
  .navbar.navbar-expand-custom .navbar-nav .dropdown-toggle {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: auto !important;
    font-size: 10px !important;
    line-height: 1.15 !important;
    padding: 10px 4px !important;
    white-space: nowrap !important;
    border-bottom: 0 !important;
  }

  /* Dropdown: absolute positioned (desktop style) */
  .navbar.navbar-expand-custom .dropdown-menu {
    display: none !important;
    position: absolute !important;
    inset: auto !important;
    float: none !important;
    width: auto !important;
    min-width: 190px !important;
    max-width: 240px !important;
    margin: 0 !important;
    border: 1px solid rgba(19, 53, 123, 0.12) !important;
    border-radius: 10px !important;
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.14) !important;
    transform: none !important;
    overflow: hidden !important;
  }

  .navbar.navbar-expand-custom .nav-item.dropdown:hover > .dropdown-menu,
  .navbar.navbar-expand-custom .nav-item.dropdown .dropdown-menu.show {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  .navbar.navbar-expand-custom .dropdown-item {
    white-space: normal !important;
    padding: 9px 12px !important;
    font-size: 11px !important;
  }

  .navbar.navbar-expand-custom .dropdown-toggle::after {
    margin-left: 4px !important;
  }

  /* Logo size for this range */
  .navbar.navbar-expand-custom .school-logo-img {
    width: 54px !important;
    height: 54px !important;
    min-width: 54px !important;
  }

  .navbar.navbar-expand-custom .brand-text {
    padding: 0 3px !important;
  }

  .navbar.navbar-expand-custom .brand-text h3 {
    font-size: 13.4px !important;
    line-height: 1.1 !important;
    letter-spacing: 0.1px !important;
    white-space: nowrap !important;
  }

  .navbar.navbar-expand-custom .brand-text span {
    font-size: 9.6px !important;
    line-height: 1.1 !important;
  }

  .navbar.navbar-expand-custom .brand-text small {
    font-size: 7.4px !important;
    line-height: 1.1 !important;
  }
}

/* ══════════════════════════════════════════════════════════════════════
   1200 px +  |  Base desktop rule
   Toggler always hidden, full horizontal nav.
   ══════════════════════════════════════════════════════════════════════ */
@media only screen and (min-width: 1200px) {
  .navbar.navbar-expand-custom {
    flex-wrap: nowrap !important;
  }

  .navbar.navbar-expand-custom .navbar-toggler {
    display: none !important;
  }

  .navbar.navbar-expand-custom .navbar-collapse {
    display: flex !important;
    flex-basis: auto !important;
    width: auto !important;
    margin-top: 0 !important;
    padding: 0 !important;
    border-top: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .navbar.navbar-expand-custom .navbar-nav {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    width: auto !important;
  }

  .navbar.navbar-expand-custom .dropdown-menu {
    display: none;
    position: absolute !important;
    inset: auto !important;
    width: auto !important;
    margin: 0 !important;
  }

  .navbar.navbar-expand-custom .nav-item.dropdown:hover > .dropdown-menu,
  .navbar.navbar-expand-custom .nav-item.dropdown .dropdown-menu.show {
    display: block !important;
  }
}

/* ══════════════════════════════════════════════════════════════════════
   1200 – 1499.98 px  |  Standard laptops
   ══════════════════════════════════════════════════════════════════════ */
@media only screen and (min-width: 1200px) and (max-width: 1499.98px) {
  .header-wrapper .navbar {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
    padding-left: 14px !important;
    padding-right: 14px !important;
  }

  .navbar.navbar-expand-custom {
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 6px !important;
  }

  .navbar.navbar-expand-custom .navbar-brand {
    flex: 0 0 auto !important;
    max-width: none !important;
    gap: 5px !important;
    overflow: visible !important;
    margin-right: 8px !important;
  }

  .navbar.navbar-expand-custom .school-logo-img {
    width: 66px !important;
    height: 66px !important;
    min-width: 66px !important;
  }

  .navbar.navbar-expand-custom .brand-text {
    padding: 0 3px !important;
  }

  .navbar.navbar-expand-custom .brand-text h3 {
    font-size: 15.8px !important;
    line-height: 1.15 !important;
    letter-spacing: 0.4px !important;
    margin: 0 0 2px 0 !important;
  }

  .navbar.navbar-expand-custom .brand-text span {
    font-size: 11.5px !important;
  }

  .navbar.navbar-expand-custom .brand-text small {
    font-size: 8.9px !important;
    letter-spacing: 0.3px !important;
  }

  .navbar.navbar-expand-custom .navbar-collapse {
    flex: 0 1 auto !important;
    justify-content: flex-start !important;
    min-width: 0 !important;
    margin-left: 0 !important;
  }

  .navbar.navbar-expand-custom .navbar-nav {
    gap: 0 !important;
    flex-wrap: nowrap !important;
    margin-left: 0 !important;
    justify-content: flex-start !important;
  }

  .navbar.navbar-expand-custom .navbar-nav .nav-item {
    position: relative !important;
  }

  .navbar.navbar-expand-custom .navbar-nav .nav-link,
  .navbar.navbar-expand-custom .navbar-nav .dropdown-toggle {
    width: auto !important;
    font-size: 11.2px !important;
    line-height: 1.15 !important;
    padding: 10px 6px !important;
    border-bottom: 0 !important;
    white-space: nowrap !important;
  }

  .navbar.navbar-expand-custom .dropdown-toggle::after {
    margin-left: 6px !important;
  }

  .navbar.navbar-expand-custom .dropdown-menu {
    min-width: 210px !important;
    width: max-content !important;
    max-width: 280px !important;
    margin-top: 0 !important;
    border: 1px solid rgba(19, 53, 123, 0.12) !important;
    border-radius: 10px !important;
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.14) !important;
    overflow: hidden !important;
  }

  .navbar.navbar-expand-custom .dropdown-item {
    padding: 10px 14px !important;
    font-size: 12px !important;
    white-space: normal !important;
  }
}

/* ══════════════════════════════════════════════════════════════════════
   1200 – 1366.98 px  |  1366×768 (most-common 13" laptop)
   ══════════════════════════════════════════════════════════════════════ */
@media only screen and (min-width: 1200px) and (max-width: 1366.98px) {
  .container-fluid.bg-primary {
    padding-left: 18px !important;
    padding-right: 18px !important;
  }

  .container-fluid.bg-primary .col-lg-6:first-child .d-flex,
  .container-fluid.bg-primary .col-lg-6:last-child .d-flex {
    gap: 10px !important;
  }

  .container-fluid.bg-primary .topbar-link {
    font-size: 11px !important;
    white-space: nowrap !important;
  }

  .header-wrapper .navbar {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }

  .navbar.navbar-expand-custom {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 5px !important;
  }

  .navbar.navbar-expand-custom .navbar-brand {
    flex: 0 1 auto !important;
    max-width: calc(100% - 545px) !important;
    margin-right: 4px !important;
    gap: 5px !important;
  }

  .navbar.navbar-expand-custom .school-logo-img {
    width: 58px !important;
    height: 58px !important;
    min-width: 58px !important;
  }

  .navbar.navbar-expand-custom .brand-text {
    padding: 0 3px !important;
  }

  .navbar.navbar-expand-custom .brand-text h3 {
    font-size: 13.8px !important;
    line-height: 1.1 !important;
    letter-spacing: 0.2px !important;
  }

  .navbar.navbar-expand-custom .brand-text span {
    font-size: 10.5px !important;
    line-height: 1.1 !important;
  }

  .navbar.navbar-expand-custom .brand-text small {
    font-size: 7.9px !important;
    line-height: 1.1 !important;
  }

  .navbar.navbar-expand-custom .navbar-collapse {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    margin-left: auto !important;
    justify-content: flex-end !important;
  }

  .navbar.navbar-expand-custom .navbar-nav {
    width: auto !important;
    margin-left: auto !important;
    justify-content: flex-end !important;
  }

  .navbar.navbar-expand-custom .navbar-nav .nav-link,
  .navbar.navbar-expand-custom .navbar-nav .dropdown-toggle {
    font-size: 10.2px !important;
    padding: 10px 4px !important;
    letter-spacing: 0 !important;
  }

  .navbar.navbar-expand-custom .dropdown-toggle::after {
    margin-left: 4px !important;
  }

  .navbar.navbar-expand-custom .dropdown-menu {
    min-width: 190px !important;
    max-width: 240px !important;
  }

  .navbar.navbar-expand-custom .dropdown-item {
    font-size: 11px !important;
    padding: 9px 12px !important;
  }
}

/* ══════════════════════════════════════════════════════════════════════
   1367 – 1499.98 px  |  1440×900 laptops (MacBook Air 13", etc.)
   ══════════════════════════════════════════════════════════════════════ */
@media only screen and (min-width: 1367px) and (max-width: 1499.98px) {
  .navbar.navbar-expand-custom .navbar-brand {
    max-width: calc(100% - 600px) !important;
  }

  .navbar.navbar-expand-custom .navbar-collapse {
    margin-left: auto !important;
    justify-content: flex-end !important;
  }

  .navbar.navbar-expand-custom .navbar-nav {
    margin-left: auto !important;
    justify-content: flex-end !important;
  }

  .navbar.navbar-expand-custom .navbar-nav .nav-link,
  .navbar.navbar-expand-custom .navbar-nav .dropdown-toggle {
    padding-left: 5px !important;
    padding-right: 5px !important;
  }
}

/* ══════════════════════════════════════════════════════════════════════
   MOBILE  max-width 767.98 px  — NO CHANGES
   ══════════════════════════════════════════════════════════════════════ */
@media only screen and (max-width: 767.98px) {
  .header-wrapper .navbar {
    padding: 10px 8px !important;
  }

  .header-wrapper .navbar > .container-fluid,
  .header-wrapper .container-fluid.position-relative.p-0 {
    padding-left: 8px !important;
    padding-right: 8px !important;
  }

  .navbar-brand {
    flex: 1 1 calc(100% - 52px) !important;
    max-width: calc(100% - 52px) !important;
    gap: 5px !important;
    overflow: visible !important;
  }

  .navbar-brand .school-logo-img,
  .navbar-brand .school-logo-img:nth-of-type(2),
  .navbar-brand .school-logo-img:nth-of-type(3) {
    display: flex !important;
    width: 36px !important;
    height: 36px !important;
    min-width: 36px !important;
    max-width: 36px !important;
    padding: 2px !important;
  }

  .navbar-brand .brand-text {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    padding: 0 2px !important;
    overflow: visible !important;
  }

  .navbar-brand .brand-text h3 {
    font-size: 9px !important;
    line-height: 1.15 !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
    word-break: break-word !important;
  }

  .navbar-brand .brand-text span {
    font-size: 6.5px !important;
    line-height: 1.2 !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
  }

  .navbar-brand .brand-text small {
    display: block !important;
    font-size: 5.9px !important;
    line-height: 1.2 !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
  }

  .sticky-header-shell > .container-fluid.bg-primary.px-3.px-lg-5 {
    padding-top: 6px !important;
    padding-bottom: 6px !important;
  }

  .sticky-header-shell > .container-fluid.bg-primary.px-3.px-lg-5 > .row.gx-0.align-items-center {
    height: auto !important;
  }

  .sticky-header-shell > .container-fluid.bg-primary.px-3.px-lg-5 .col-lg-6:first-child,
  .sticky-header-shell > .container-fluid.bg-primary.px-3.px-lg-5 .col-lg-6:last-child {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
  }

  .sticky-header-shell > .container-fluid.bg-primary.px-3.px-lg-5 .col-lg-6:first-child .d-flex {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 2px !important;
    height: auto !important;
  }

  .sticky-header-shell > .container-fluid.bg-primary.px-3.px-lg-5 .col-lg-6:first-child .topbar-link {
    display: block !important;
    width: 100% !important;
    font-size: 0.69rem !important;
    line-height: 1.25 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  .sticky-header-shell > .container-fluid.bg-primary.px-3.px-lg-5 .col-lg-6:last-child .d-flex {
    justify-content: flex-start !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    height: auto !important;
    padding-top: 4px !important;
  }

  .navbar-toggler {
    width: 36px !important;
    height: 36px !important;
    margin-left: 6px !important;
  }

  .carousel-header .carousel-inner {
    position: relative !important;
    height: clamp(190px, 54vw, 260px) !important;
    min-height: 190px !important;
    max-height: 260px !important;
    aspect-ratio: auto !important;
    background: #000000 !important;
  }

  .carousel-header .carousel-item {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: #000000 !important;
  }

  .carousel-header .carousel-item.active,
  .carousel-header .carousel-item.carousel-item-next,
  .carousel-header .carousel-item.carousel-item-prev,
  .carousel-header .carousel-item.carousel-item-start,
  .carousel-header .carousel-item.carousel-item-end {
    display: flex !important;
  }

  .carousel-header .carousel-item img,
  .carousel-header .carousel-item video {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
    background: #000000 !important;
  }

  .carousel-header .carousel-item .banner-overlay {
    height: 42% !important;
  }

  .carousel-header .carousel-item .banner-title-block {
    padding: 8px 12px 12px !important;
  }

  .carousel-header .banner-slide-title {
    font-size: clamp(0.66rem, 2.7vw, 0.88rem) !important;
    line-height: 1.25 !important;
    -webkit-line-clamp: 2 !important;
  }

  .carousel-header .carousel-control-prev,
  .carousel-header .carousel-control-next {
    position: absolute !important;
    top: 50% !important;
    bottom: auto !important;
    transform: translateY(-50%) !important;
    width: 42px !important;
    height: 42px !important;
    margin-top: 0 !important;
    border-radius: 50% !important;
    background: rgba(0, 0, 0, 0.45) !important;
    opacity: 1 !important;
    z-index: 6 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  .carousel-header .carousel-control-prev-icon,
  .carousel-header .carousel-control-next-icon {
    transform: none !important;
    width: 18px !important;
    height: 18px !important;
    background-size: 100% 100% !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
  }

  .carousel-header .carousel-control-prev-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'%3e%3cpath d='M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z'/%3e%3c/svg%3e") !important;
  }

  .carousel-header .carousel-control-next-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'%3e%3cpath d='M4.646 14.354a.5.5 0 0 1 0-.708L10.293 8 4.646 2.354a.5.5 0 1 1 .708-.708l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708 0z'/%3e%3c/svg%3e") !important;
  }

  .carousel-header .carousel-control-prev {
    left: 10px !important;
  }

  .carousel-header .carousel-control-next {
    right: 10px !important;
  }
}

/* ══════════════════════════════════════════════════════════════════════
   TABLET  768 – 991.98 px  — NO CHANGES
   ══════════════════════════════════════════════════════════════════════ */
@media only screen and (min-width: 768px) and (max-width: 991.98px) {
  .carousel-header .carousel-inner {
    height: clamp(260px, 50vw, 420px) !important;
    min-height: 260px !important;
    max-height: 420px !important;
    background: #000000 !important;
  }

  .carousel-header .carousel-item img,
  .carousel-header .carousel-item video {
    object-fit: cover !important;
    object-position: center center !important;
    background: #000000 !important;
  }

  .carousel-header .carousel-control-prev,
  .carousel-header .carousel-control-next {
    top: 50% !important;
    bottom: auto !important;
    transform: translateY(-50%) !important;
    width: 46px !important;
    height: 46px !important;
    border-radius: 50% !important;
    background: rgba(0, 0, 0, 0.45) !important;
    opacity: 1 !important;
    z-index: 6 !important;
  }

  .carousel-header .carousel-control-prev-icon,
  .carousel-header .carousel-control-next-icon {
    width: 18px !important;
    height: 18px !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    background-size: 100% 100% !important;
  }

  .carousel-header .carousel-control-prev {
    left: 12px !important;
  }

  .carousel-header .carousel-control-next {
    right: 12px !important;
  }
}

/* ══════════════════════════════════════════════════════════════════════
   SMALL MOBILE  max-width 389.98 px  — NO CHANGES
   ══════════════════════════════════════════════════════════════════════ */
@media only screen and (max-width: 389.98px) {
  .navbar-brand .school-logo-img,
  .navbar-brand .school-logo-img:nth-of-type(2),
  .navbar-brand .school-logo-img:nth-of-type(3) {
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    max-width: 32px !important;
  }

  .navbar-brand .brand-text h3 {
    font-size: 8px !important;
  }

  .navbar-brand .brand-text span {
    font-size: 6px !important;
  }

  .navbar-brand .brand-text small {
    font-size: 5.4px !important;
  }
}

/* ══════════════════════════════════════════════════════════════════════
   992 – 1366.98 px  |  Desktop/laptop spacing calibration
   ══════════════════════════════════════════════════════════════════════ */
@media only screen and (min-width: 992px) and (max-width: 1366.98px) {
  .header-wrapper .navbar {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }

  .navbar.navbar-expand-custom {
    gap: 4px !important;
    justify-content: flex-start !important;
  }

  .navbar.navbar-expand-custom .navbar-brand {
    flex: 0 0 auto !important;
    max-width: none !important;
    gap: 5px !important;
    margin-right: 6px !important;
  }

  .navbar.navbar-expand-custom .school-logo-img {
    width: 54px !important;
    height: 54px !important;
    min-width: 54px !important;
  }

  .navbar.navbar-expand-custom .brand-text {
    padding: 0 3px !important;
  }

  .navbar.navbar-expand-custom .brand-text h3 {
    font-size: 13.4px !important;
    line-height: 1.1 !important;
    letter-spacing: 0.1px !important;
  }

  .navbar.navbar-expand-custom .brand-text span {
    font-size: 9.6px !important;
    line-height: 1.1 !important;
  }

  .navbar.navbar-expand-custom .brand-text small {
    font-size: 7.4px !important;
    line-height: 1.1 !important;
  }

  .navbar.navbar-expand-custom .navbar-collapse {
    flex: 0 1 auto !important;
    width: auto !important;
    justify-content: flex-start !important;
    margin-left: 0 !important;
  }

  .navbar.navbar-expand-custom .navbar-nav {
    margin-left: 8px !important;
    justify-content: flex-start !important;
    gap: 0 !important;
  }

  .navbar.navbar-expand-custom .navbar-nav .nav-link,
  .navbar.navbar-expand-custom .navbar-nav .dropdown-toggle {
    font-size: 9.7px !important;
    padding: 10px 4px !important;
  }
}

/* ══════════════════════════════════════════════════════════════════════
   1367 – 1599.98 px  |  1440p laptops / large laptops
   ══════════════════════════════════════════════════════════════════════ */
@media only screen and (min-width: 1367px) and (max-width: 1599.98px) {
  .navbar.navbar-expand-custom {
    gap: 5px !important;
    justify-content: flex-start !important;
  }

  .navbar.navbar-expand-custom .navbar-brand {
    flex: 0 0 auto !important;
    max-width: none !important;
    gap: 5px !important;
    margin-right: 8px !important;
  }

  .navbar.navbar-expand-custom .school-logo-img {
    width: 64px !important;
    height: 64px !important;
    min-width: 64px !important;
  }

  .navbar.navbar-expand-custom .brand-text {
    padding: 0 3px !important;
  }

  .navbar.navbar-expand-custom .brand-text h3 {
    font-size: 15.8px !important;
    line-height: 1.14 !important;
  }

  .navbar.navbar-expand-custom .brand-text span {
    font-size: 11.2px !important;
  }

  .navbar.navbar-expand-custom .brand-text small {
    font-size: 8.7px !important;
  }

  .navbar.navbar-expand-custom .navbar-collapse {
    flex: 0 1 auto !important;
    width: auto !important;
    justify-content: flex-start !important;
    margin-left: 0 !important;
  }

  .navbar.navbar-expand-custom .navbar-nav {
    margin-left: 10px !important;
    justify-content: flex-start !important;
  }

  .navbar.navbar-expand-custom .navbar-nav .nav-link,
  .navbar.navbar-expand-custom .navbar-nav .dropdown-toggle {
    font-size: 10.8px !important;
    padding-left: 5px !important;
    padding-right: 5px !important;
  }
}

/* ══════════════════════════════════════════════════════════════════════
   992 – 1599.98 px  |  Final desktop/laptop spacing correction
   ══════════════════════════════════════════════════════════════════════ */
@media only screen and (min-width: 992px) and (max-width: 1599.98px) {
  .header-wrapper .navbar {
    gap: 2px !important;
    padding-top: clamp(9px, 0.95vw, 13px) !important;
    padding-bottom: clamp(9px, 0.95vw, 13px) !important;
    padding-right: 8px !important;
  }

  .navbar.navbar-expand-custom {
    justify-content: flex-start !important;
    gap: 2px !important;
  }

  .navbar.navbar-expand-custom .navbar-brand {
    flex: 0 0 auto !important;
    margin-right: 0 !important;
    align-items: center !important;
    gap: clamp(5px, 0.55vw, 8px) !important;
  }

  .navbar.navbar-expand-custom .brand-text {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: center !important;
    overflow: visible !important;
  }

  .navbar.navbar-expand-custom .brand-text span,
  .navbar.navbar-expand-custom .brand-text small {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    overflow: visible !important;
    max-height: none !important;
  }

  /* Logo size uses clamp so the specific breakpoint blocks still dominate.
     95px was overriding every finer rule — fixed. */
  .navbar.navbar-expand-custom .school-logo-img,
  .navbar.navbar-expand-custom .navbar-brand .school-logo-img,
  .navbar.navbar-expand-custom .navbar-brand .school-logo-img:nth-of-type(2),
  .navbar.navbar-expand-custom .navbar-brand .school-logo-img:nth-of-type(3) {
    width: clamp(54px, 5.2vw, 72px) !important;
    height: clamp(54px, 5.2vw, 72px) !important;
    min-width: clamp(54px, 5.2vw, 72px) !important;
  }

  .navbar.navbar-expand-custom .brand-text h3 {
    font-size: clamp(13.4px, 1.08vw, 16.4px) !important;
    line-height: 1.1 !important;
    letter-spacing: 0.15px !important;
    margin: 0 0 1px 0 !important;
    white-space: nowrap !important;
  }

  .navbar.navbar-expand-custom .brand-text span {
    font-size: clamp(9.5px, 0.78vw, 11.2px) !important;
    line-height: 1.14 !important;
  }

  .navbar.navbar-expand-custom .brand-text small {
    font-size: clamp(7px, 0.6vw, 8.6px) !important;
    line-height: 1.18 !important;
    letter-spacing: 0.15px !important;
    white-space: nowrap !important;
  }

  .navbar.navbar-expand-custom .navbar-collapse {
    flex: 1 1 auto !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    margin-left: 4px !important;
    justify-content: flex-end !important;
  }

  .navbar.navbar-expand-custom .navbar-nav {
    width: auto !important;
    margin-left: 0 !important;
    justify-content: flex-end !important;
    margin-right: 0 !important;
    padding-right: 0 !important;
    gap: 3px !important;
    flex-wrap: nowrap !important;
  }

  .navbar.navbar-expand-custom .navbar-nav.ms-auto {
    margin-left: 0 !important;
  }

  .navbar.navbar-expand-custom .navbar-nav > .nav-item:last-child,
  .navbar.navbar-expand-custom .navbar-nav > .nav-link:last-child {
    margin-right: 0 !important;
    padding-right: 0 !important;
  }

  .navbar.navbar-expand-custom .navbar-nav .nav-link,
  .navbar.navbar-expand-custom .navbar-nav .dropdown-toggle {
    font-size: clamp(10px, 0.82vw, 11.4px) !important;
    padding: 10px clamp(5px, 0.52vw, 8px) !important;
    white-space: nowrap !important;
  }
}

/* ══════════════════════════════════════════════════════════════════════
   1200 – 1366.98 px  |  Fine-tune: clamp sizes
   ══════════════════════════════════════════════════════════════════════ */
@media only screen and (min-width: 1200px) and (max-width: 1366.98px) {
  .navbar.navbar-expand-custom .school-logo-img {
    width: clamp(68px, 5.15vw, 80px) !important;
    height: clamp(68px, 5.15vw, 80px) !important;
    min-width: clamp(68px, 5.15vw, 80px) !important;
  }

  .navbar.navbar-expand-custom .brand-text h3 {
    font-size: clamp(17.4px, 1.15vw, 17px) !important;
  }

  .navbar.navbar-expand-custom .brand-text span {
    font-size: clamp(10px, 0.84vw, 11.4px) !important;
  }

  .navbar.navbar-expand-custom .brand-text small {
    font-size: clamp(7.4px, 0.62vw, 8.8px) !important;
  }

  .navbar.navbar-expand-custom .navbar-nav .nav-link,
  .navbar.navbar-expand-custom .navbar-nav .dropdown-toggle {
    font-size: clamp(10.5px, 0.86vw, 11.8px) !important;
    padding: 10px clamp(6px, 0.58vw, 9px) !important;
  }

  .navbar.navbar-expand-custom .navbar-collapse {
    flex: 0 1 auto !important;
    width: auto !important;
    max-width: none !important;
    margin-left: 90px !important;
  }

  .navbar.navbar-expand-custom .navbar-nav {
    width: auto !important;
    gap: 4px !important;
  }
}

/* ══════════════════════════════════════════════════════════════════════
   1367 – 1599.98 px  |  Fine-tune: clamp sizes
   ══════════════════════════════════════════════════════════════════════ */
@media only screen and (min-width: 1367px) and (max-width: 1599.98px) {
  .navbar.navbar-expand-custom .school-logo-img {
    width: clamp(74px, 5.35vw, 86px) !important;
    height: clamp(74px, 5.35vw, 86px) !important;
    min-width: clamp(74px, 5.35vw, 86px) !important;
  }

  .navbar.navbar-expand-custom .brand-text h3 {
    font-size: clamp(16px, 1.2vw, 18.4px) !important;
  }

  .navbar.navbar-expand-custom .brand-text span {
    font-size: clamp(10.8px, 0.86vw, 12px) !important;
  }

  .navbar.navbar-expand-custom .brand-text small {
    font-size: clamp(8px, 0.64vw, 9.2px) !important;
  }

  .navbar.navbar-expand-custom .navbar-nav .nav-link,
  .navbar.navbar-expand-custom .navbar-nav .dropdown-toggle {
    font-size: clamp(10.8px, 0.88vw, 12.2px) !important;
    padding: 10px clamp(7px, 0.62vw, 10px) !important;
  }

  .navbar.navbar-expand-custom .navbar-collapse {
    flex: 0 1 auto !important;
    width: auto !important;
    max-width: none !important;
    margin-left: 5px !important;
  }

  .navbar.navbar-expand-custom .navbar-nav {
    width: auto !important;
    gap: 6px !important;
  }
}

/* ══════════════════════════════════════════════════════════════════════
   1200 – 1599.98 px  |  Ticker + Carousel
   ══════════════════════════════════════════════════════════════════════ */
@media only screen and (min-width: 1200px) and (max-width: 1599.98px) {
  .ticker-bar {
    min-height: 38px !important;
    height: 38px !important;
  }

  .ticker-label {
    padding: 0 18px !important;
    font-size: 0.74rem !important;
  }

  .ticker-track-wrap {
    min-width: 0 !important;
  }

  .ticker-item {
    font-size: 0.8rem !important;
    line-height: 38px !important;
  }

  .ticker-sep {
    margin: 0 10px !important;
  }

  .carousel-header .carousel-inner {
    height: min(78vh, calc(100vw * 9 / 16)) !important;
    min-height: 420px !important;
    max-height: 640px !important;
  }

  .carousel-header .carousel-item img,
  .carousel-header .carousel-item video {
    object-fit: cover !important;
    object-position: center center !important;
    background: #000 !important;
    max-width: none !important;
    max-height: none !important;
  }
}

/* ══════════════════════════════════════════════════════════════════════
   ── NEWLY ADDED BREAKPOINTS ──────────────────────────────────────────
   The ranges below were present in the device list but had no explicit
   rules.  Navbar-toggler is always hidden; full horizontal nav shown.
   ══════════════════════════════════════════════════════════════════════ */

/* 1600 – 1709.98 px  |  HD+ desktops (1680×1050, WSXGA+, HD+ 900p)  */
@media only screen and (min-width: 1600px) and (max-width: 1709.98px) {
  .navbar.navbar-expand-custom .navbar-toggler {
    display: none !important;
  }

  .navbar.navbar-expand-custom .navbar-collapse {
    display: flex !important;
    flex-basis: auto !important;
    background: transparent !important;
    border-top: 0 !important;
    padding: 0 !important;
    margin-top: 0 !important;
  }

  .navbar.navbar-expand-custom {
    gap: 6px !important;
    justify-content: flex-start !important;
  }

  .navbar.navbar-expand-custom .navbar-brand {
    flex: 0 0 auto !important;
    margin-right: 10px !important;
    gap: 6px !important;
  }

  .navbar.navbar-expand-custom .school-logo-img {
    width: clamp(80px, 5.2vw, 92px) !important;
    height: clamp(80px, 5.2vw, 92px) !important;
    min-width: clamp(80px, 5.2vw, 92px) !important;
  }

  .navbar.navbar-expand-custom .brand-text h3 {
    font-size: clamp(16.4px, 1.12vw, 18px) !important;
    line-height: 1.1 !important;
  }

  .navbar.navbar-expand-custom .brand-text span {
    font-size: clamp(11px, 0.78vw, 12.4px) !important;
  }

  .navbar.navbar-expand-custom .brand-text small {
    font-size: clamp(8.2px, 0.6vw, 9.4px) !important;
  }

  .navbar.navbar-expand-custom .navbar-nav .nav-link,
  .navbar.navbar-expand-custom .navbar-nav .dropdown-toggle {
    font-size: clamp(11px, 0.78vw, 12.6px) !important;
    padding: 10px clamp(7px, 0.55vw, 10px) !important;
    white-space: nowrap !important;
  }

  .navbar.navbar-expand-custom .navbar-nav {
    gap: 4px !important;
    flex-wrap: nowrap !important;
    justify-content: flex-end !important;
  }

  .navbar.navbar-expand-custom .navbar-collapse {
    flex: 1 1 auto !important;
    justify-content: flex-end !important;
    margin-left: 6px !important;
  }

  .carousel-header .carousel-inner {
    height: min(80vh, calc(100vw * 9 / 16)) !important;
    min-height: 480px !important;
    max-height: 720px !important;
  }

  .carousel-header .carousel-item img,
  .carousel-header .carousel-item video {
    object-fit: cover !important;
    object-position: center center !important;
  }
}

/* 1710 – 1727.98 px  |  MacBook Air 15" M2 (CSS 1710px)  */
@media only screen and (min-width: 1710px) and (max-width: 1727.98px) {
  .navbar.navbar-expand-custom .navbar-toggler {
    display: none !important;
  }

  .navbar.navbar-expand-custom .navbar-collapse {
    display: flex !important;
    flex-basis: auto !important;
    background: transparent !important;
    border-top: 0 !important;
    padding: 0 !important;
    margin-top: 0 !important;
  }

  .navbar.navbar-expand-custom .school-logo-img {
    width: clamp(88px, 5.3vw, 96px) !important;
    height: clamp(88px, 5.3vw, 96px) !important;
    min-width: clamp(88px, 5.3vw, 96px) !important;
  }

  .navbar.navbar-expand-custom .brand-text h3 {
    font-size: clamp(17px, 1.1vw, 19px) !important;
    line-height: 1.1 !important;
  }

  .navbar.navbar-expand-custom .brand-text span {
    font-size: clamp(11.4px, 0.8vw, 12.8px) !important;
  }

  .navbar.navbar-expand-custom .brand-text small {
    font-size: clamp(8.4px, 0.62vw, 9.6px) !important;
  }

  .navbar.navbar-expand-custom .navbar-nav .nav-link,
  .navbar.navbar-expand-custom .navbar-nav .dropdown-toggle {
    font-size: clamp(11.4px, 0.8vw, 13px) !important;
    padding: 10px clamp(8px, 0.56vw, 11px) !important;
  }
}

/* 1728 – 1919.98 px  |  MacBook Pro 16" M-series (CSS 1728px)  */
@media only screen and (min-width: 1728px) and (max-width: 1919.98px) {
  .navbar.navbar-expand-custom .navbar-toggler {
    display: none !important;
  }

  .navbar.navbar-expand-custom .navbar-collapse {
    display: flex !important;
    flex-basis: auto !important;
    background: transparent !important;
    border-top: 0 !important;
    padding: 0 !important;
    margin-top: 0 !important;
  }

  .navbar.navbar-expand-custom .school-logo-img {
    width: clamp(90px, 5.4vw, 100px) !important;
    height: clamp(90px, 5.4vw, 100px) !important;
    min-width: clamp(90px, 5.4vw, 100px) !important;
  }

  .navbar.navbar-expand-custom .brand-text h3 {
    font-size: clamp(17.4px, 1.12vw, 19.4px) !important;
    line-height: 1.1 !important;
  }

  .navbar.navbar-expand-custom .brand-text span {
    font-size: clamp(11.6px, 0.82vw, 13px) !important;
  }

  .navbar.navbar-expand-custom .brand-text small {
    font-size: clamp(8.6px, 0.64vw, 9.8px) !important;
  }

  .navbar.navbar-expand-custom .navbar-nav .nav-link,
  .navbar.navbar-expand-custom .navbar-nav .dropdown-toggle {
    font-size: clamp(11.6px, 0.82vw, 13.2px) !important;
    padding: 10px clamp(8px, 0.58vw, 12px) !important;
  }

  .carousel-header .carousel-inner {
    height: min(80vh, calc(100vw * 9 / 16)) !important;
    min-height: 500px !important;
    max-height: 760px !important;
  }
}

/* 1920 – 2239.98 px  |  Full HD / 1080p desktops (most-common desktop)  */
@media only screen and (min-width: 1920px) and (max-width: 2239.98px) {
  .navbar.navbar-expand-custom .navbar-toggler {
    display: none !important;
  }

  .navbar.navbar-expand-custom .navbar-collapse {
    display: flex !important;
    flex-basis: auto !important;
    background: transparent !important;
    border-top: 0 !important;
    padding: 0 !important;
    margin-top: 0 !important;
  }

  .header-wrapper .navbar {
    padding-left: 24px !important;
    padding-right: 24px !important;
    padding-top: 14px !important;
    padding-bottom: 14px !important;
  }

  .navbar.navbar-expand-custom {
    gap: 10px !important;
    justify-content: flex-start !important;
  }

  .navbar.navbar-expand-custom .navbar-brand {
    flex: 0 0 auto !important;
    gap: 2px !important;
    margin-right: 12px !important;
  }

  .navbar.navbar-expand-custom .school-logo-img {
    width: clamp(96px, 5.5vw, 110px) !important;
    height: clamp(96px, 5.5vw, 110px) !important;
    min-width: clamp(96px, 5.5vw, 110px) !important;
  }

  .navbar.navbar-expand-custom .brand-text h3 {
    font-size: clamp(30px, 1.15vw, 21px) !important;
    line-height: 1.1 !important;
  }

  .navbar.navbar-expand-custom .brand-text span {
    font-size: clamp(12px, 0.84vw, 14px) !important;
  }

  .navbar.navbar-expand-custom .brand-text small {
    font-size: clamp(11px, 0.65vw, 10.4px) !important;
  }

  .navbar.navbar-expand-custom .navbar-nav {
    gap: 6px !important;
    flex-wrap: nowrap !important;
    justify-content: flex-end !important;
  }

  .navbar.navbar-expand-custom .navbar-collapse {
    flex: 1 1 auto !important;
    justify-content: flex-end !important;
    margin-left: 8px !important;
  }

  .navbar.navbar-expand-custom .navbar-nav .nav-link,
  .navbar.navbar-expand-custom .navbar-nav .dropdown-toggle {
    font-size: clamp(12px, 0.84vw, 13.8px) !important;
    padding: 10px clamp(9px, 0.6vw, 13px) !important;
    white-space: nowrap !important;
  }

  .navbar.navbar-expand-custom .dropdown-menu {
    min-width: 220px !important;
    max-width: 300px !important;
    border-radius: 12px !important;
  }

  .navbar.navbar-expand-custom .dropdown-item {
    font-size: 13px !important;
    padding: 11px 16px !important;
  }

  .carousel-header .carousel-inner {
    height: min(82vh, calc(100vw * 9 / 16)) !important;
    min-height: 540px !important;
    max-height: 840px !important;
  }

  .carousel-header .carousel-item img,
  .carousel-header .carousel-item video {
    object-fit: cover !important;
    object-position: center center !important;
  }
}

/* 2240 – 2559.98 px  |  iMac 24" M-series (CSS 2240px), QHD+ desktops  */
@media only screen and (min-width: 2240px) and (max-width: 2559.98px) {
  .navbar.navbar-expand-custom .navbar-toggler {
    display: none !important;
  }

  .navbar.navbar-expand-custom .navbar-collapse {
    display: flex !important;
    flex-basis: auto !important;
    background: transparent !important;
    border-top: 0 !important;
    padding: 0 !important;
    margin-top: 0 !important;
  }

  .header-wrapper .navbar {
    padding-left: 32px !important;
    padding-right: 32px !important;
    padding-top: 16px !important;
    padding-bottom: 16px !important;
  }

  .navbar.navbar-expand-custom {
    gap: 12px !important;
  }

  .navbar.navbar-expand-custom .school-logo-img {
    width: clamp(106px, 4.9vw, 118px) !important;
    height: clamp(106px, 4.9vw, 118px) !important;
    min-width: clamp(106px, 4.9vw, 118px) !important;
  }

  .navbar.navbar-expand-custom .brand-text h3 {
    font-size: clamp(20px, 1.0vw, 23px) !important;
    line-height: 1.1 !important;
  }

  .navbar.navbar-expand-custom .brand-text span {
    font-size: clamp(13px, 0.76vw, 15px) !important;
  }

  .navbar.navbar-expand-custom .brand-text small {
    font-size: clamp(9.6px, 0.6vw, 11px) !important;
  }

  .navbar.navbar-expand-custom .navbar-nav .nav-link,
  .navbar.navbar-expand-custom .navbar-nav .dropdown-toggle {
    font-size: clamp(13px, 0.76vw, 15px) !important;
    padding: 10px clamp(10px, 0.58vw, 14px) !important;
  }

  .navbar.navbar-expand-custom .navbar-nav {
    gap: 8px !important;
  }

  .navbar.navbar-expand-custom .navbar-collapse {
    flex: 1 1 auto !important;
    justify-content: flex-end !important;
    margin-left: 10px !important;
  }

  .navbar.navbar-expand-custom .dropdown-menu {
    min-width: 240px !important;
    max-width: 320px !important;
  }

  .navbar.navbar-expand-custom .dropdown-item {
    font-size: 14px !important;
    padding: 12px 18px !important;
  }
}

/* 2560 – 3439.98 px  |  QHD / 1440p / iMac 27" / 2K desktops  */
@media only screen and (min-width: 2560px) and (max-width: 3439.98px) {
  .navbar.navbar-expand-custom .navbar-toggler {
    display: none !important;
  }

  .navbar.navbar-expand-custom .navbar-collapse {
    display: flex !important;
    flex-basis: auto !important;
    background: transparent !important;
    border-top: 0 !important;
    padding: 0 !important;
    margin-top: 0 !important;
  }

  .header-wrapper .navbar {
    padding-left: 40px !important;
    padding-right: 40px !important;
    padding-top: 18px !important;
    padding-bottom: 18px !important;
  }

  .navbar.navbar-expand-custom .school-logo-img {
    width: clamp(116px, 4.7vw, 130px) !important;
    height: clamp(116px, 4.7vw, 130px) !important;
    min-width: clamp(116px, 4.7vw, 130px) !important;
  }

  .navbar.navbar-expand-custom .brand-text h3 {
    font-size: clamp(22px, 0.96vw, 26px) !important;
    line-height: 1.1 !important;
  }

  .navbar.navbar-expand-custom .brand-text span {
    font-size: clamp(14px, 0.72vw, 16.4px) !important;
  }

  .navbar.navbar-expand-custom .brand-text small {
    font-size: clamp(10px, 0.56vw, 12px) !important;
  }

  .navbar.navbar-expand-custom .navbar-nav .nav-link,
  .navbar.navbar-expand-custom .navbar-nav .dropdown-toggle {
    font-size: clamp(14px, 0.72vw, 16.4px) !important;
    padding: 12px clamp(11px, 0.55vw, 15px) !important;
  }

  .navbar.navbar-expand-custom .navbar-nav {
    gap: 10px !important;
  }

  .navbar.navbar-expand-custom .navbar-collapse {
    flex: 1 1 auto !important;
    justify-content: flex-end !important;
    margin-left: 12px !important;
  }

  .carousel-header .carousel-inner {
    height: min(84vh, calc(100vw * 9 / 16)) !important;
    min-height: 600px !important;
    max-height: 980px !important;
  }
}

/* 3440 px +  |  4K / 5K / UHD / 8K / ultrawide large displays  */
@media only screen and (min-width: 3440px) {
  .navbar.navbar-expand-custom .navbar-toggler {
    display: none !important;
  }

  .navbar.navbar-expand-custom .navbar-collapse {
    display: flex !important;
    flex-basis: auto !important;
    background: transparent !important;
    border-top: 0 !important;
    padding: 0 !important;
    margin-top: 0 !important;
  }

  .header-wrapper .navbar {
    padding-left: 56px !important;
    padding-right: 56px !important;
    padding-top: 22px !important;
    padding-bottom: 22px !important;
  }

  .navbar.navbar-expand-custom .school-logo-img {
    width: clamp(130px, 4.0vw, 160px) !important;
    height: clamp(130px, 4.0vw, 160px) !important;
    min-width: clamp(130px, 4.0vw, 160px) !important;
  }

  .navbar.navbar-expand-custom .brand-text h3 {
    font-size: clamp(26px, 0.88vw, 34px) !important;
    line-height: 1.08 !important;
  }

  .navbar.navbar-expand-custom .brand-text span {
    font-size: clamp(16px, 0.64vw, 20px) !important;
  }

  .navbar.navbar-expand-custom .brand-text small {
    font-size: clamp(11px, 0.5vw, 14px) !important;
  }

  .navbar.navbar-expand-custom .navbar-nav .nav-link,
  .navbar.navbar-expand-custom .navbar-nav .dropdown-toggle {
    font-size: clamp(16px, 0.62vw, 20px) !important;
    padding: 14px clamp(12px, 0.5vw, 18px) !important;
  }

  .navbar.navbar-expand-custom .navbar-nav {
    gap: 12px !important;
  }

  .navbar.navbar-expand-custom .navbar-collapse {
    flex: 1 1 auto !important;
    justify-content: flex-end !important;
    margin-left: 16px !important;
  }

  .navbar.navbar-expand-custom .dropdown-menu {
    min-width: 280px !important;
    max-width: 380px !important;
    border-radius: 14px !important;
  }

  .navbar.navbar-expand-custom .dropdown-item {
    font-size: 16px !important;
    padding: 14px 22px !important;
  }

  .carousel-header .carousel-inner {
    height: min(85vh, calc(100vw * 9 / 16)) !important;
    min-height: 700px !important;
    max-height: 1200px !important;
  }
}


@media only screen and (min-width: 992px) {

  /* Header shell — no bottom bleed */
  .sticky-header-shell {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
  }

  /* Header wrapper itself */
  .header-wrapper {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
  }

  /* Navbar — no extra gap below */
  .header-wrapper .navbar {
    margin-bottom: 0 !important;
  }

  /* Notice / ticker / news bar — flush against header */
/*  .notice-bar,*/
/*  .ticker-bar,*/
/*  .news-bar {*/
/*    margin-top: 0 !important;*/
/*    padding-top: 0 !important;*/
/*  }*/

  /* Carousel: no gap above or below */
/*  .carousel-header {*/
/*    margin-top: 0 !important;*/
/*    padding-top: 0 !important;*/
/*    margin-bottom: 0 !important;*/
/*    padding-bottom: 0 !important;*/
/*  }*/
 
/*   First element immediately after carousel */
/*  .carousel-header + section,*/
/*  .carousel-header + div,*/
/*  .carousel-header + .row,*/
/*  .carousel-header + .container,*/
/*  .carousel-header + .container-fluid {*/
/*    margin-top: 0 !important;*/
/*    padding-top: 0 !important;*/
/*  }*/

  /* Elements that follow directly after the header shell */
/*  .sticky-header-shell + .carousel-header,*/
/*  .sticky-header-shell + .notice-bar,*/
/*  .sticky-header-shell + .ticker-bar,*/
/*  .sticky-header-shell + .news-bar,*/
/*  .sticky-header-shell + section,*/
/*  .sticky-header-shell + div:not(.modal):not(.offcanvas) {*/
/*    margin-top: 0 !important;*/
/*  }*/
/*}*/
/* Keep school brand colors consistent across desktop and responsive rules */
.navbar-brand .brand-text h3,
.navbar.navbar-expand-custom .brand-text h3 {
  color: #fba831 !important;
  font-weight: 800 !important;
}

.navbar-brand .brand-text small,
.navbar.navbar-expand-custom .brand-text small {
  color: #555 !important;
}

/* Keep footer social icons visible on every responsive screen */
.footer-section .social-icons {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 8px !important;
}

.footer-section .social-icons a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 36px !important;
  height: 36px !important;
  min-width: 36px !important;
  min-height: 36px !important;
  border-radius: 6px !important;
  text-decoration: none !important;
  overflow: visible !important;
}

.footer-section .social-icons .social-icon,
.footer-section .social-icons a > svg {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 18px !important;
  height: 18px !important;
  opacity: 1 !important;
  visibility: visible !important;
  flex-shrink: 0 !important;
}

.footer-section .social-icons .social-icon svg,
.footer-section .social-icons a > svg {
  display: block !important;
  width: 18px !important;
  height: 18px !important;
  fill: #fff !important;
  opacity: 1 !important;
  visibility: visible !important;
}

@media only screen and (max-width: 767.98px) {
  .footer-section .social-icons {
    justify-content: center !important;
  }

  .footer-section .social-icons a {
    width: 38px !important;
    height: 38px !important;
    min-width: 38px !important;
    min-height: 38px !important;
  }
}

/* Homepage gap cleanup */
.carousel-header,
.carousel-header .carousel,
.carousel-header .carousel-inner {
  margin: 0 !important;
  padding: 0 !important;
}

.carousel-header {
  line-height: 0 !important;
}

.carousel-header .carousel-item .banner-title-block {
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  z-index: 4 !important;
  width: 100% !important;
  text-align: center !important;
  pointer-events: none !important;
}

.carousel-header .banner-slide-title {
  margin: 0 !important;
  color: #fff !important;
  font-weight: 900 !important;
  text-transform: uppercase !important;
  text-shadow:
    0 2px 8px rgba(0, 0, 0, 0.9),
    0 0 18px rgba(0, 0, 0, 0.8) !important;
  word-break: break-word !important;
}

@media only screen and (min-width: 992px) {
  .carousel-header .carousel {
    display: block !important;
  }

  .carousel-header .carousel-inner {
    position: relative !important;
    overflow: hidden !important;
    height: min(68vh, calc(100vw * 9 / 16)) !important;
    min-height: 360px !important;
    max-height: 620px !important;
  }

  .carousel-header .carousel-item {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: hidden !important;
    display: none !important;
    background: #000 !important;
  }

  .carousel-header .carousel-item.active,
  .carousel-header .carousel-item.carousel-item-next,
  .carousel-header .carousel-item.carousel-item-prev,
  .carousel-header .carousel-item.carousel-item-start,
  .carousel-header .carousel-item.carousel-item-end {
    display: block !important;
  }

  .carousel-header .carousel-item img,
  .carousel-header .carousel-item video {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
    display: block !important;
  }

  .carousel-header .carousel-item .banner-overlay {
    height: 38% !important;
  }

  .carousel-header .carousel-item .banner-title-block {
    padding: 18px 32px 20px !important;
    bottom: 0 !important;
  }

  .carousel-header .banner-slide-title {
    font-size: clamp(1rem, 1.55vw, 1.75rem) !important;
    line-height: 1.28 !important;
    -webkit-line-clamp: 2 !important;
    overflow: hidden !important;
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
  }
}

@media only screen and (min-width: 1600px) {
  .carousel-header .carousel-inner {
    height: min(72vh, calc(100vw * 9 / 16)) !important;
    min-height: 420px !important;
    max-height: 760px !important;
  }

  .carousel-header .carousel-item .banner-title-block {
    padding: 20px 40px 24px !important;
  }

  .carousel-header .banner-slide-title {
    font-size: clamp(1.08rem, 1.35vw, 1.95rem) !important;
  }
}

@media only screen and (min-width: 768px) and (max-width: 991.98px) {
  .carousel-header .carousel-item .banner-title-block {
    padding: 12px 18px 16px !important;
  }

  .carousel-header .banner-slide-title {
    font-size: clamp(0.82rem, 2vw, 1.1rem) !important;
    line-height: 1.25 !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
  }
}

@media only screen and (max-width: 767.98px) {
  .carousel-header .carousel-item .banner-title-block {
    padding: 8px 12px 12px !important;
  }

  .carousel-header .banner-slide-title {
    font-size: clamp(0.66rem, 2.7vw, 0.88rem) !important;
    line-height: 1.25 !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
  }
}

.carousel-header + .ticker-bar,
.carousel-header + .news-bar,
.carousel-header + .notice-bar,
.ticker-bar + section,
.news-bar + section,
.notice-bar + section {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

.achievement-gallery-section {
  margin-top: 0 !important;
}

.achievement-gallery-section.py-5 {
  padding-top: 0 !important;
}

.achievement-gallery-section .container-fluid.about {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* Final mobile/tablet carousel stability */
@media only screen and (max-width: 991.98px) {
  .carousel-header,
  .carousel-header .carousel,
  .carousel-header .carousel-inner,
  .carousel-header .carousel-item,
  .carousel-header .carousel-item img,
  .carousel-header .carousel-item video {
    background: transparent !important;
  }

  .carousel-header .carousel {
    overflow: hidden !important;
  }

  .carousel-header .carousel-inner {
    position: relative !important;
    overflow: hidden !important;
  }

  .carousel-header .carousel-item {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    max-height: none !important;
    display: none !important;
  }

  .carousel-header .carousel-item.active,
  .carousel-header .carousel-item.carousel-item-next,
  .carousel-header .carousel-item.carousel-item-prev,
  .carousel-header .carousel-item.carousel-item-start,
  .carousel-header .carousel-item.carousel-item-end {
    display: block !important;
  }

  .carousel-header .carousel-item img,
  .carousel-header .carousel-item video {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
    display: block !important;
  }

  .carousel-header .carousel-item .banner-overlay {
    height: 46% !important;
  }

  .carousel-header .carousel-item .banner-title-block {
    z-index: 8 !important;
    padding-bottom: 22px !important;
  }

  .carousel-header .banner-slide-title {
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    text-align: center !important;
  }

  .carousel-header .carousel-indicators {
    bottom: 6px !important;
    z-index: 7 !important;
    margin-bottom: 0 !important;
  }

  .carousel-header .carousel-control-prev,
  .carousel-header .carousel-control-next {
    top: 50% !important;
    bottom: auto !important;
    transform: translateY(-50%) !important;
    margin-top: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    z-index: 9 !important;
  }
}

/* Absolute final mobile/tablet carousel override */
@media only screen and (max-width: 991.98px) {
  .carousel-header {
    position: relative !important;
    overflow: hidden !important;
  }

  .carousel-header .carousel,
  .carousel-header .carousel-inner {
    position: relative !important;
    overflow: hidden !important;
  }

  .carousel-header .carousel-item .banner-overlay {
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    height: 52% !important;
    z-index: 6 !important;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.92) 0%, rgba(0, 0, 0, 0.58) 52%, transparent 100%) !important;
  }

  .carousel-header .carousel-item .banner-title-block {
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 28px !important;
    width: 100% !important;
    padding: 0 14px !important;
    z-index: 8 !important;
    text-align: center !important;
    pointer-events: none !important;
  }

  .carousel-header .banner-slide-title {
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
    overflow: hidden !important;
    margin: 0 auto !important;
    max-width: 96% !important;
    color: #ffffff !important;
    font-size: clamp(0.7rem, 2.9vw, 0.95rem) !important;
    line-height: 1.3 !important;
    font-weight: 800 !important;
    text-align: center !important;
    text-transform: uppercase !important;
    text-shadow:
      0 2px 8px rgba(0, 0, 0, 0.95),
      0 0 14px rgba(0, 0, 0, 0.85) !important;
  }

  .carousel-header .carousel-indicators {
    position: absolute !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    bottom: 6px !important;
    z-index: 8 !important;
    margin: 0 !important;
  }

  .carousel-header .carousel-control-prev,
  .carousel-header .carousel-control-next {
    position: absolute !important;
    top: 50% !important;
    bottom: auto !important;
    transform: translateY(-50%) !important;
    width: 40px !important;
    height: 40px !important;
    margin: 0 !important;
    border-radius: 50% !important;
    background: rgba(0, 0, 0, 0.38) !important;
    opacity: 1 !important;
    z-index: 9 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  .carousel-header .carousel-control-prev {
    left: 10px !important;
  }

  .carousel-header .carousel-control-next {
    right: 10px !important;
  }

  .carousel-header .carousel-control-prev .carousel-control-prev-icon,
  .carousel-header .carousel-control-next .carousel-control-next-icon,
  .carousel-header .carousel-control-prev-icon,
  .carousel-header .carousel-control-next-icon {
    position: static !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    transform: none !important;
    padding: 0 !important;
    margin: 0 !important;
    width: 18px !important;
    height: 18px !important;
    min-width: 18px !important;
    min-height: 18px !important;
    background-size: 18px 18px !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    display: block !important;
    flex: 0 0 18px !important;
  }

  .carousel-header .mobile-carousel-arrow {
    display: block !important;
    width: 18px !important;
    height: 18px !important;
    min-width: 18px !important;
    min-height: 18px !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    background-size: 18px 18px !important;
    flex: 0 0 18px !important;
    pointer-events: none !important;
  }

  .carousel-header .mobile-carousel-arrow-prev {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M9.8 2.2L4.4 8l5.4 5.8' stroke='%23ffffff' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
  }

  .carousel-header .mobile-carousel-arrow-next {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M6.2 2.2L11.6 8l-5.4 5.8' stroke='%23ffffff' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
  }

  .carousel-header .carousel-control-prev-icon,
  .carousel-header .carousel-control-next-icon {
    opacity: 0 !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
    min-width: 0 !important;
    min-height: 0 !important;
    flex: 0 0 0 !important;
  }
}

/* Final cross-screen consistency cleanup */
.footer-section,
.footer-section .container,
.footer-section .row,
.footer-section .footer-col,
.footer-section .social-icons {
  overflow: visible !important;
}

.footer-section .social-icons {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  row-gap: 8px !important;
  column-gap: 8px !important;
}

.footer-section .social-icons a,
.footer-section .social-icons a.fb,
.footer-section .social-icons a.ig,
.footer-section .social-icons a.tw,
.footer-section .social-icons a.em,
.footer-section .social-icons a.wa,
.footer-section .social-icons a.yt {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 38px !important;
  height: 38px !important;
  min-width: 38px !important;
  min-height: 38px !important;
  flex: 0 0 38px !important;
  overflow: visible !important;
  opacity: 1 !important;
  visibility: visible !important;
}

.footer-section .social-icons .social-icon,
.footer-section .social-icons .social-icon svg,
.footer-section .social-icons a > svg {
  display: block !important;
  width: 18px !important;
  height: 18px !important;
  min-width: 18px !important;
  min-height: 18px !important;
  opacity: 1 !important;
  visibility: visible !important;
  fill: #fff !important;
}

.navbar-toggler {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.navbar-toggler .navbar-toggler-icon {
  display: block !important;
  width: 20px !important;
  height: 20px !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3E%3Cpath stroke='rgba(19,53,123,0.95)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2.4' d='M5 7h20M5 15h20M5 23h20'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  background-size: 20px 20px !important;
}

.sticky-header-shell,
.header-wrapper,
.carousel-header,
.carousel-header + .ticker-bar,
.carousel-header + .notice-bar,
.carousel-header + .news-bar,
.ticker-bar + section,
.news-bar + section,
.notice-bar + section,
.achievement-gallery-section,
.achievement-gallery-section.py-5,
.achievement-gallery-section .container-fluid.about {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding-top: 0 !important;
}

.carousel-header,
.carousel-header .carousel,
.carousel-header .carousel-inner,
.carousel-header .carousel-item,
.carousel-header .carousel-item img,
.carousel-header .carousel-item video {
  background: transparent !important;
}

.carousel-header .carousel {
  margin-bottom: 0 !important;
}

.carousel-header .carousel-inner {
  overflow: hidden !important;
}

.carousel-header .carousel-item {
  background: transparent !important;
  backface-visibility: hidden !important;
  -webkit-backface-visibility: hidden !important;
}

.carousel-header .carousel.slide .carousel-item,
.carousel-header .carousel.slide .carousel-item-next,
.carousel-header .carousel.slide .carousel-item-prev,
.carousel-header .carousel.slide .carousel-item-start,
.carousel-header .carousel.slide .carousel-item-end {
  background: transparent !important;
}

/* Gallery image cards: keep a uniform card size across all gallery images */
.event-photo-grid .photo-cell {
  aspect-ratio: 4 / 3 !important;
  height: auto !important;
  min-height: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: linear-gradient(180deg, #f8fafc 0%, #e2e8f0 100%) !important;
  overflow: hidden !important;
}

.event-photo-grid .photo-cell img,
.event-photo-grid .photo-cell .photo-cell-media {
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
  object-fit: cover !important;
  object-position: center center !important;
  image-orientation: from-image !important;
  background: linear-gradient(180deg, #f8fafc 0%, #e2e8f0 100%) !important;
  padding: 0 !important;
  transform: none !important;
}

.event-photo-grid .photo-cell video {
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
  object-fit: cover !important;
  object-position: center center !important;
  background: linear-gradient(180deg, #f8fafc 0%, #e2e8f0 100%) !important;
}

.event-photo-grid .photo-cell:hover img,
.event-photo-grid .photo-cell:hover .photo-cell-media,
.event-photo-grid .photo-cell:hover video {
  transform: none !important;
}

@media only screen and (max-width: 767.98px) {
  .footer-section .social-icons {
    justify-content: center !important;
  }

  .navbar-toggler {
    width: 38px !important;
    height: 38px !important;
    padding: 0 !important;
  }

  .navbar-toggler .navbar-toggler-icon {
    width: 18px !important;
    height: 18px !important;
    background-size: 18px 18px !important;
  }
}

@media only screen and (max-width: 767.98px) {
  .carousel-header {
    line-height: normal !important;
  }

  .carousel-header .carousel-item {
    position: relative !important;
  }

  .carousel-header .carousel-item.active .banner-title-block,
  .carousel-header .carousel-item.carousel-item-next .banner-title-block,
  .carousel-header .carousel-item.carousel-item-prev .banner-title-block,
  .carousel-header .carousel-item.carousel-item-start .banner-title-block,
  .carousel-header .carousel-item.carousel-item-end .banner-title-block {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  .carousel-header .carousel-item .banner-title-block {
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 34px !important;
    padding: 0 12px !important;
    width: 100% !important;
    z-index: 9 !important;
    text-align: center !important;
  }

  .carousel-header .carousel-item .banner-title-block::before {
    content: attr(data-banner-title) !important;
    display: block !important;
    position: relative !important;
    visibility: visible !important;
    opacity: 1 !important;
    max-width: 100% !important;
    min-height: 1.35em !important;
    height: auto !important;
    padding: 6px 10px !important;
    font-size: clamp(0.82rem, 3.6vw, 1rem) !important;
    line-height: 1.35 !important;
    font-weight: 800 !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    white-space: normal !important;
    overflow: visible !important;
    word-break: break-word !important;
    text-transform: uppercase !important;
    text-align: center !important;
    text-shadow:
      0 2px 8px rgba(0, 0, 0, 0.98),
      0 0 14px rgba(0, 0, 0, 0.92) !important;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.08) 0%, rgba(0, 0, 0, 0.42) 100%) !important;
    border-radius: 10px !important;
  }

  .carousel-header .banner-slide-title {
    display: none !important;
  }

  .carousel-header .carousel-control-prev,
  .carousel-header .carousel-control-next {
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    min-height: 42px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: rgba(0, 0, 0, 0.52) !important;
    backdrop-filter: blur(2px) !important;
    -webkit-backdrop-filter: blur(2px) !important;
    opacity: 1 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    z-index: 12 !important;
  }

  .carousel-header .mobile-carousel-arrow {
    position: static !important;
    inset: auto !important;
    width: 18px !important;
    height: 18px !important;
    min-width: 18px !important;
    min-height: 18px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #ffffff !important;
    font-size: 30px !important;
    line-height: 1 !important;
    font-weight: 400 !important;
    text-indent: 0 !important;
    margin: auto !important;
    background: none !important;
  }

  .carousel-header .mobile-carousel-arrow-prev,
  .carousel-header .mobile-carousel-arrow-next {
    background-image: none !important;
  }

  .carousel-header .carousel-control-prev::after,
  .carousel-header .carousel-control-next::after {
    display: none !important;
  }
}