/* =========================================================
Fonts
========================================================= */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Rajdhani:wght@300;400;500;600;700&display=swap');

body {
    font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    -webkit-font-smoothing: antialiased;
}

h1 {
    font-family: 'Rajdhani', sans-serif;
}
/* =========================================================
Container
========================================================= */
@media (max-width: 1399px) {
    .container {
        max-width: 100%;
    }
}

/* =========================================================
Breadcrumbs — responsive single-line with ellipsis
========================================================= */
#subpage-navbar,
#subpage-navbar .section-nav-list li a,
#subpage-navbar .section-subnav-list li a {
    font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    font-feature-settings: initial;
}

#subpage-navbar div.container {
    margin-left: calc(50% - 585px);
    margin-right: calc(50% - 585px);
    padding-left: 0;
    padding-right: 0;
}

ol.breadcrumb.fbi-breadcrumb {
    font-size: 12px;
}

/* Single-line flex container, clips overflow */
.fbi-breadcrumb {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    overflow: hidden;
    min-width: 0;
    background: none;
    padding: 0;
    margin: 0;
    font-size: 0.75rem;
    list-style: none;
}

/* Each breadcrumb item is a flex child that can shrink */
.fbi-breadcrumb .breadcrumb-item {
    display: inline-flex;
    align-items: center;
    min-width: 0;
    flex: 0 1 auto;
    white-space: nowrap;
}

/* Home (first item) never shrinks */
.fbi-breadcrumb .breadcrumb-item:first-child {
    flex-shrink: 0;
}

/* Separator — never shrinks, override Bootstrap float */
.fbi-breadcrumb .breadcrumb-item + .breadcrumb-item::before {
    content: ">";
    color: rgba(0, 0, 0, 0.35);
    float: none;
    padding-right: 0;
    margin: 0 0.3rem;
    flex-shrink: 0;
    display: inline-block;
}

/* Links — truncate with ellipsis */
.fbi-breadcrumb .breadcrumb-item a {
    display: block;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    min-width: 0;
    max-width: 200px;
    color: rgba(0, 0, 0, 0.55);
    text-decoration: none;
    transition: color 0.2s ease;
}

.fbi-breadcrumb .breadcrumb-item a:hover {
    color: #000;
}

/* Home link never truncates */
.fbi-breadcrumb .breadcrumb-item:first-child a {
    max-width: none;
}

/* Active (current page) */
.fbi-breadcrumb .breadcrumb-item.active {
    color: rgba(0, 0, 0, 0.85);
    min-width: 0;
    overflow: hidden;
    white-space: nowrap;
}

/* Span injected by JS around active item text for ellipsis */
.breadcrumb-active-text {
    display: block;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    min-width: 0;
    max-width: 200px;
}

/* Tablet: tighten max-widths */
@media (max-width: 992px) {
    .fbi-breadcrumb .breadcrumb-item a,
    .breadcrumb-active-text {
        max-width: 150px;
    }
    .fbi-breadcrumb .breadcrumb-item:first-child a {
        max-width: none;
    }
}

/* Small tablet */
@media (max-width: 768px) {
    .fbi-breadcrumb .breadcrumb-item a,
    .breadcrumb-active-text {
        max-width: 90px;
    }
    .fbi-breadcrumb .breadcrumb-item:first-child a {
        max-width: none;
    }
}

/* Mobile: hide full trail, show parent link */
@media (max-width: 575px) {
    .fbi-breadcrumb {
        display: none;
    }
    .fbi-breadcrumb-mobile-parent {
        display: inline-flex !important;
    }
}

/* Mobile parent link — hidden until <576px */
.fbi-breadcrumb-mobile-parent {
    display: none;
    align-items: center;
    gap: 0.1rem;
    color: rgba(0, 0, 0, 0.65);
    text-decoration: none;
    font-size: 0.85rem;
    max-width: 100%;
    overflow: hidden;
    white-space: nowrap;
}

.fbi-breadcrumb-mobile-parent:hover {
    color: #000;
}

.fbi-breadcrumb-mobile-parent .mobile-back-arrow {
    flex-shrink: 0;
    margin-right: 0.15rem;
}

.fbi-breadcrumb-mobile-parent .mobile-parent-text {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 0;
}

/* =========================================================
Section nav
========================================================= */

/* Mobile: single-line horizontal scroll */
.section-nav-list {
    display: flex;
    flex-wrap: nowrap;
    list-style: none;
    margin: 0;
    padding: 0.5rem 0;
    gap: 0;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}

.section-nav-list::-webkit-scrollbar {
    display: none;
}

/* Desktop: no scroll, JS handles overflow via More button */
@media (min-width: 768px) {
    .section-nav-list {
        overflow: visible;
    }
}

.section-nav-list li {
    display: flex;
    align-items: center;
    flex-shrink: 0;
}

.section-nav-list li + li::before {
    content: '';
    display: inline-block;
    width: 1px;
    height: 0.9em;
    background-color: rgba(0, 0, 0, 0.2);
    margin: 0 0.1rem;
    align-self: center;
}

.section-nav-list li:first-child a {
    padding-left: 0;
}

.section-nav-list li a {
    display: block;
    padding: 0.3rem 0.65rem;
    color: rgba(0, 0, 0, 0.65);
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 500;
    white-space: nowrap;
    transition: color 0.2s ease;
}

.section-nav-list li a:hover {
    color: #000;
}

.section-nav-list li a.active {
    color: #000000;
    font-weight: 800;
}

.section-nav-list li button.active {
    color: #000000;
    font-weight: 800;
}

/* Background + connector — only when a subnav is present */
.section-nav-list.has-subnav li:has(> a.active) {
    background-color: #1a1a1a;
    border-radius: 4px 4px 0 0;
    align-self: stretch;
    display: flex;
    align-items: center;
    position: relative;
    z-index: 2;
    /* Extend right edge to overlap the separator on the next <li> */
    margin-right: calc(-0.1rem - 1px);
    padding-right: calc(0.1rem + 0.1rem + 1px);
}

.section-nav-list.has-subnav li:has(> button.active) {
    background-color: #1a1a1a;
    border-radius: 4px 4px 0 0;
    align-self: stretch;
    display: flex;
    align-items: center;
    position: relative;
    z-index: 2;
    /* Extend right edge to overlap the separator on the next <li> */
    margin-right: calc(-0.1rem - 1px);
    padding-right: calc(0.1rem + 0.1rem + 1px);
}

/* Suppress the separator on the active <li> — only with subnav */
.section-nav-list.has-subnav li:has(> a.active)::before {
    background-color: transparent !important;
}

.section-nav-list.has-subnav li:has(> button.active)::before {
    background-color: transparent !important;
}


/* Connector strip down to sub-nav — only when subnav is present */
.section-nav-list.has-subnav li:has(> a.active)::after {
    content: '';
    position: absolute;
    bottom: -0.75rem;
    left: 0;
    right: 0;
    height: 0.75rem;
    background-color: #1a1a1a;
    z-index: 1;
}

.section-nav-list.has-subnav li:has(> button.active)::after {
    content: '';
    position: absolute;
    bottom: -0.75rem;
    left: 0;
    right: 0;
    height: 0.75rem;
    background-color: #1a1a1a;
    z-index: 1;
}
/* Hidden overflow items (set by JS on desktop) */
.nav-item--hidden {
    display: none !important;
}

/* More button */
.nav-more-btn {
    position: relative;
    flex-shrink: 0;
}

.nav-more-btn::before {
    display: none !important;
}

.nav-more-toggle {
    display: flex;
    align-items: center;
    gap: 0.3rem;
    background: none;
    border: none;
    padding: 0.3rem 0.65rem;
    color: rgba(0, 0, 0, 0.65);
    font-size: 0.9rem;
    font-weight: 500;
    font-family: inherit;
    cursor: pointer;
    white-space: nowrap;
    transition: color 0.2s ease;
}

.nav-more-toggle:hover,
.nav-more-btn.open .nav-more-toggle {
    color: #000;
}

.nav-more-toggle .bi-chevron-down {
    font-size: 0.7em;
    transition: transform 0.2s ease;
}

.nav-more-btn.open .nav-more-toggle .bi-chevron-down {
    transform: rotate(180deg);
}

/* Dropdown panel */
.nav-more-dropdown {
    display: none;
    position: absolute;
    top: calc(100% + 0.25rem);
    right: 0;
    left: auto;
    list-style: none;
    margin: 0;
    padding: 0.25rem 0;
    background: #fff;
    border: 1px solid rgba(0, 0, 0, 0.12);
    border-radius: 4px;
    min-width: 220px;
    z-index: 200;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.5);
}

.nav-more-btn.open .nav-more-dropdown {
    display: block;
}

.nav-more-dropdown li::before {
    display: none !important;
}

.nav-more-dropdown li a {
    display: block;
    padding: 0.5rem 1.1rem;
    color: rgba(0, 0, 0, 0.65);
    text-decoration: none;
    font-size: 0.875rem;
    font-weight: 500;
    white-space: nowrap;
    transition: color 0.2s ease, background-color 0.2s ease;
}

.nav-more-dropdown li a:hover {
    color: #000;
    background-color: rgba(0, 0, 0, 0.05);
}

.nav-more-dropdown li:first-child a {
    padding-left: 1.1rem;
}

/* =========================================================
Shared scroll wrapper (mobile — both navs scroll together)
========================================================= */
@media (max-width: 767px) {
    .section-nav-scroll-wrap {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    .section-nav-scroll-wrap::-webkit-scrollbar {
        display: none;
    }

    /* Allow container divs and subnav wrapper to expand to content width */
    .section-nav-scroll-wrap > .container,
    .section-nav-scroll-wrap .section-subnav-wrap > .container {
        min-width: max-content;
        max-width: none;
        width: auto;
    }

    /* Stretch subnav wrapper background to match scrollable content width */
    .section-nav-scroll-wrap .section-subnav-wrap {
        min-width: max-content;
    }

    /* Disable individual list scroll — wrapper handles it */
    .section-nav-scroll-wrap .section-nav-list,
    .section-nav-scroll-wrap .section-subnav-list {
        overflow-x: visible;
        min-width: max-content;
    }
}

/* =========================================================
Victims sub-navigation
========================================================= */
.section-subnav-wrap {
    background-color: #1a1a1a;
    position: relative;
    z-index: 2;
}

.section-subnav-list {
    display: flex;
    flex-wrap: nowrap;
    list-style: none;
    margin: 0;
    padding: 0;
    gap: 0;
    background-color: transparent;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}

.section-subnav-list::-webkit-scrollbar {
    display: none;
}

@media (min-width: 768px) {
    .section-subnav-list {
        overflow: visible;
    }
}

.section-subnav-list li {
    display: flex;
    align-items: center;
    flex-shrink: 0;
}

.section-subnav-list li + li::before {
    content: '';
    display: inline-block;
    width: 1px;
    height: 0.9em;
    background-color: rgba(255, 255, 255, 0.2);
    margin: 0 0.1rem;
    align-self: center;
}

.section-subnav-list li a {
    display: block;
    padding: 0.3rem 0.65rem;
    color: rgba(255, 255, 255, 0.75);
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 500;
    white-space: nowrap;
    transition: color 0.2s ease;
}

.section-subnav-list li:first-child a {
    padding-left: 0;
}

.section-subnav-list li a:hover {
    color: #ffc000;
}

.section-subnav-list li a.active {
    color: #ffc000;
}

.section-subnav-list li button.active {
    color: #ffc000;
}

/* More button overrides for dark sub-nav */
.section-subnav-list .nav-more-toggle {
    color: rgba(255, 255, 255, 0.75);
}

.section-subnav-list .nav-more-toggle:hover,
.section-subnav-list .nav-more-btn.open .nav-more-toggle {
    color: #fff;
}

.section-subnav-list .nav-more-dropdown {
    background: #2a2a2a;
    border-color: rgba(255, 255, 255, 0.15);
}

.section-subnav-list .nav-more-dropdown li a {
    color: rgba(255, 255, 255, 0.75);
}

.section-subnav-list .nav-more-dropdown li a.active {
    color: #FFC000;
}

.section-subnav-list .nav-more-dropdown li a:hover {
    color: #fff;
    background-color: rgba(255, 255, 255, 0.08);
}

.section-subnav-list .nav-more-dropdown li:first-child a {
    padding-left: 1.1rem;
}
/* =========================================================
Black body background page overrides
========================================================= */

/* Page & section background */
.black-body-background {
    background-color: #000;
    color: #fff;
}

.black-body-background section,
.black-body-background .bg-white {
    background-color: #000 !important;
}

/* Headings */
.black-body-background h1,
.black-body-background h2,
.black-body-background h3 {
    color: #fff;
}

/* Breadcrumb — separator */
.black-body-background .fbi-breadcrumb .breadcrumb-item + .breadcrumb-item::before {
    color: rgba(255, 255, 255, 0.35);
}

/* Breadcrumb — links */
.black-body-background .fbi-breadcrumb .breadcrumb-item a {
    color: rgba(255, 255, 255, 0.6);
}

.black-body-background .fbi-breadcrumb .breadcrumb-item a:hover {
    color: #fff;
}

/* Breadcrumb — active (current page) */
.black-body-background .fbi-breadcrumb .breadcrumb-item.active {
    color: rgba(255, 255, 255, 0.9);
}

/* Breadcrumb — mobile parent link */
.black-body-background .fbi-breadcrumb-mobile-parent {
    color: rgba(255, 255, 255, 0.75);
}

.black-body-background .fbi-breadcrumb-mobile-parent:hover {
    color: #fff;
}

/* Section nav — pipe separators */
.black-body-background .section-nav-list li + li::before {
    background-color: rgba(255, 255, 255, 0.3);
}

/* Section nav — links */
.black-body-background .section-nav-list li a {
    color: rgba(255, 255, 255, 0.75);
}

.black-body-background .section-nav-list li a:hover {
    color: #fff;
}

/* Section nav — active item text color */
.black-body-background .section-nav-list li a.active {
    color: #ffc000;
}

.black-body-background .section-nav-list li button.active {
    color: #ffc000;
}

.has-subnav li a.active {
    color: #ffc000;
}

.has-subnav li button.active {
    color: #ffc000;
}

/* Section nav — active item background (matches sub-nav background) */
.black-body-background .section-nav-list.has-subnav li:has(> a.active) {
    background-color: #222;
}

.black-body-background .section-nav-list.has-subnav li:has(> button.active) {
    background-color: #222;
}

.black-body-background .section-nav-list.has-subnav li:has(> a.active)::after {
    background-color: #222;
}

.black-body-background .section-nav-list.has-subnav li:has(> button.active)::after {
    background-color: #222;
}
/* More button */
.black-body-background .nav-more-toggle {
    color: rgba(255, 255, 255, 0.75);
}

.black-body-background .nav-more-toggle:hover,
.black-body-background .nav-more-btn.open .nav-more-toggle {
    color: #fff;
}

/* More dropdown */
.black-body-background .nav-more-dropdown {
    background: #1a1a1a;
    border-color: rgba(255, 255, 255, 0.15);
}

.black-body-background .nav-more-dropdown li a {
    color: rgba(255, 255, 255, 0.75);
}

.black-body-background .nav-more-dropdown li a:hover {
    color: #fff;
    background-color: rgba(255, 255, 255, 0.08);
}

/* Sub-nav wrapper — slightly lighter than black for contrast */
.black-body-background .section-subnav-wrap {
    background-color: #222;
}

/* Sub-nav More dropdown */
.black-body-background .section-subnav-list .nav-more-dropdown {
    background: #2a2a2a;
}

.section-nav-list li + li#first-item:before {
    display: none; !important;
}

h1.display-4.fw-bold.mb-0 {
    font-size: 56px;
    line-height: 67.2px;
}

div.section-nav-scroll-wrap {
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
}

div.section-nav-scroll-wrap div.container{
    width: 1320px;
}

ul.section-nav-list li {
    font-size: 16px;
}

ul.section-nav-list li a,
ul.section-nav-list li ul.nav-more-dropdown a,
li.nav-more-btn ul li > a,
ul.section-subnav-list li a,
ul.section-subnav-list li button.nav-more-toggle,
ul.section-nav-list li button {
    font-size: 14.4px;
    line-height: 21.6px;
    padding-bottom: 4.8px;
    padding-left: 10.4px;
    padding-top: 4.8px;
    padding-right: 10.4px;
}

.section-nav-list li.nav-more-btn ul.nav-more-dropdown li:first-child a {
    padding-left: 10.4px !important;
}

h1.section-nav-title a {
  color: inherit;
  text-decoration: inherit;
  cursor: default;
}