/* ============================================
   ACOLA Design System
   ============================================ */

/* Import Satoshi Font (local files) */
@import url('satoshi.css');

:root {
    /* Colors */
    --color-navy: #101828;
    --color-navy-dark: #020618;
    --color-blue: #0276CF;
    --color-blue-dark: #1C398E;
    --color-bg-warm: #FFF3D6;
    --color-gray-50: #F9FAFB;
    --color-gray-100: #F4F4F4;
    --color-gray-200: #E5E7EB;
    --color-gray-400: #9CA3AF;
    --color-gray-500: #6B7280;
    --color-gray-600: #4A5565;
    --color-gray-700: #374151;
    --color-gray-900: #101828;
    --color-gray-ack: #99A1AF;
    --color-white: #FFFFFF;
    --color-text-text-body-subtle: #6A7282;
    --color-border-border-base: #E5E7EB;
    
    /* Gradients */
    --grad-dark: linear-gradient(180deg, #1D2E4C 0%, #101828 100%);
    --grad-news: linear-gradient(0deg, #1C2E4A 0%, #020304 100%);
    
    /* Typography */
    --font-heading: 'Crimson Text', Georgia, serif;
    --font-body: 'Satoshi', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    
    /* Spacing */
    --container-max: 1280px;
    --section-padding: 80px;
    --section-padding-mobile: 48px;
    
    /* Transitions */
    --transition: 0.2s ease;
    --transition-slow: 0.3s ease;
}

/* ============================================
   Accessibility
   ============================================ */

/* Skip Link - WCAG 2.2 AA Requirement */
.skip-link {
    position: absolute;
    top: -100%;
    left: 50%;
    transform: translateX(-50%);
    background: var(--color-blue);
    color: var(--color-white);
    padding: 12px 24px;
    font-family: var(--font-body);
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    z-index: 10000;
    border-radius: 0 0 4px 4px;
    transition: top 0.2s ease;
}

.skip-link:focus {
    top: 0;
    outline: 2px solid var(--color-white);
    outline-offset: 2px;
}

/* Focus Visible States - WCAG 2.2 AA */
:focus-visible {
    outline: 2px solid var(--color-blue);
    outline-offset: 2px;
}

/* Remove default focus outline when not using keyboard */
:focus:not(:focus-visible) {
    outline: none;
}

/* Ensure focus states on interactive elements */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
[role="button"]:focus-visible,
[tabindex]:focus-visible {
    outline: 2px solid var(--color-blue);
    outline-offset: 2px;
}

/* Focus on dark backgrounds */
.hero a:focus-visible,
.reports-section a:focus-visible,
.news-section a:focus-visible,
.site-footer a:focus-visible {
    outline-color: var(--color-white);
}
.site-footer a:hover,
.site-footer a:focus-visible {
    text-decoration: underline;
}
/* Screen reader only utility */
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* ============================================
   Reset & Base
   ============================================ */

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

body {
    font-family: var(--font-body);
    font-size: 16px;
    line-height: 1.5;
    color: var(--color-gray-600);
    margin: 0;
    padding: 0;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

img {
    max-width: 100%;
    height: auto;
    display: block;
}

a {
    color: inherit;
    text-decoration: none;
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-heading);
    font-weight: 400;
    color: var(--color-gray-900);
    margin: 0;
    line-height: 1.2;
}

p {
    margin: 0 0 1rem;
}

.container {
    max-width: var(--container-max);
    margin: 0 auto;
    padding: 0 24px;
}

@media (min-width: 768px) {
    .container {
        padding: 0 40px;
    }
}

@media (min-width: 1340px) {
    .container {
        padding: 0px;
    }
}

/* ============================================
   Buttons
   ============================================ */

.btn {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-family: var(--font-body);
    font-size: 14px;
    font-weight: 700;
    padding: 12px 24px;
    border-radius: 0;
    border: none;
    cursor: pointer;
    transition: all var(--transition);
    text-decoration: none;
}

.btn svg {
    width: 20px;
    height: 20px;
}

.btn--primary {
    background-color: var(--color-navy);
    color: var(--color-white);
    transition: background-color 0.2s ease;
}

.btn--primary:hover {
    background-color: #0276CF;
    color: var(--color-white);
}

.btn--blue {
    background-color: var(--color-blue);
    color: var(--color-white);
}

.btn--blue:hover,
.content-section .btn--blue:hover {
    background-color: #0266B3;
    color: var(--color-white);
    text-decoration: none;
}

.btn--outline {
    background-color: transparent;
    color: var(--color-blue);
    border: 1px solid var(--color-blue);
}

.btn--outline:hover {
    background-color: var(--color-blue);
    color: var(--color-white);
}

.btn--dark {
    background-color: var(--color-blue-dark);
    color: var(--color-white);
}

.btn--dark:hover {
    background-color: #152970;
    color: var(--color-white);
}

.btn--black {
    background-color: #000000;
    color: var(--color-white);
}

.btn--black:hover {
    background-color: #1a1a1a;
    color: var(--color-white);
}

/* Near-black (used for high-emphasis CTAs) */
.btn--ink {
    background-color: #09090B;
    color: var(--color-white);
}

.btn--ink:hover {
    background-color: #0276CF;
    color: var(--color-white);
}

/* ============================================
   Breadcrumbs
   ============================================ */

.breadcrumbs {
    padding: 0;
    background-color: #F9FAFB;
    
}
.breadcrumbs .container {
    padding-top: 16px;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--color-gray-200);
}
/* On mobile, header is fixed, so breadcrumbs need top margin */
@media (max-width: 991px) {
    .breadcrumbs {
        margin-top: 88px;
    }
}

/* On desktop, header is absolute positioned, so breadcrumbs need margin-top */
@media (min-width: 992px) {
    .breadcrumbs {
        margin-top: 140px; /* Account for member-academies-bar + site-header */
    }
}

.breadcrumbs__list {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    list-style: none;
    margin: 0;
    padding: 0;
}

.breadcrumbs__item {
    display: flex;
    align-items: center;
    gap: 8px;
}

.breadcrumbs__separator {
    color: var(--color-gray-400);
    font-family: var(--font-body);
    font-size: 14px;
}

.breadcrumbs__link {
    font-family: var(--font-body);
    font-size: 14px;
    color: var(--color-text-text-body-subtle);
    text-decoration: none;
    transition: color var(--transition);
    display: inline-flex;
    align-items: center;
    font-weight: 500;
    gap: 6px;
}

.breadcrumbs__link:hover {
    color: var(--color-blue);
    text-decoration: underline;
}

.breadcrumbs__current {
    font-family: var(--font-body);
    font-size: 14px;
    color: var(--color-gray-600);
}

/* Breadcrumb icons */
.breadcrumbs__home-icon {
    width: 16px;
    height: 16px;
    display: inline-block;
    flex-shrink: 0;
}

.breadcrumbs__separator-icon {
    width: 12px;
    height: 12px;
    display: block;
}

/* Light variant breadcrumbs */
.breadcrumbs--light {
    
    
}

/* Mobile breadcrumbs - show only parent link with back chevron */


/*
@media (max-width: 767px) {
    .breadcrumbs__item {
        display: none;
    }

    .breadcrumbs__item:has(.breadcrumbs__current) {
        display: flex;
        align-items: center;
    }

    .breadcrumbs__item:has(.breadcrumbs__current) .breadcrumbs__separator-icon {
        display: inline-block;
        transform: rotate(180deg);
    }
}
*/


/* Mobile breadcrumbs - show only parent link with back chevron */
@media (max-width: 767px) {
    .breadcrumbs__item {
        display: none;
    }
    
    /* Show only the item right before the current page item */
    .breadcrumbs__item:has(+ .breadcrumbs__item > .breadcrumbs__current) {
        display: flex;
    }
    
    /* Flip the chevron to point left (back arrow) */
    .breadcrumbs__item:has(+ .breadcrumbs__item > .breadcrumbs__current) .breadcrumbs__separator-icon {
       /* transform: rotate(180deg);*/
    }

    /* First item is Home link - always show on mobile */
    .breadcrumbs__item:first-child {
        display: flex !important;
    }


}


/* ============================================
   Form Fields (reusable)
   ============================================ */

.form {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.form-field {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.form-label {
    font-family: var(--font-body);
    font-size: 14px;
    font-weight: 500;
    color: var(--color-gray-900);
}

.form-label__required {
    color: #DC2626;
}

.form-input,
.form-textarea,
.report-briefing-form__input,
.report-briefing-form__textarea {
    padding: 10px 12px;
    border: 1px solid #E5E7EB;
    border-radius: 4px;
    background: #FFF;
    font-family: var(--font-body);
    font-size: 14px;
    color: var(--color-gray-900);
    outline: none;
    transition: border-color var(--transition);
    /* shadow-sm */
    box-shadow: 0 1px 2px 0 rgba(29, 41, 61, 0.05);
}

.form-input:focus,
.form-textarea:focus,
.report-briefing-form__input:focus,
.report-briefing-form__textarea:focus {
    border-color: var(--color-blue);
}

.form-textarea,
.report-briefing-form__textarea {
    resize: vertical;
    min-height: 100px;
}

.form-help {
    font-family: var(--font-body);
    font-size: 14px;
    color: var(--color-text-text-body-subtle);
    font-weight: 400;
    margin: 0;
    line-height: 1.5;
}

.form-help a {
    color: var(--color-blue);
    text-decoration: underline;
}
.form-help a:hover {
    color: #000;
    
}
/* ============================================
   Member Academies Bar
   ============================================ */

.member-academies-bar {
    background-color: var(--color-bg-warm);
    padding: 10px 0;
    display: none;
    position: relative;
    z-index: 900;
    /* Let the aria-label tooltip extend below the bar without being clipped */
    overflow: visible;
}

@media (min-width: 992px) {
    .member-academies-bar {
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        z-index: 1002;
    }
}

.member-academies-bar__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    overflow: visible;
}

.member-academies-bar .container {
    overflow: visible;
}

.member-academies-bar__label {
    color: var(--colors-text-text-body, #4A5565);
    font-family: var(--typography-font-family-font-base, Satoshi);
    font-size: var(--typography-font-size-text-xs, 12px);
    font-style: normal;
    font-weight: 700;
    line-height: var(--typography-line-height-leading-4, 16px);
    letter-spacing: 0.6px;
    text-transform: uppercase;
}

.member-academies-bar__logos {
    display: flex;
    align-items: center;
    gap: 32px;
    overflow: visible;
}

.member-academy {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--color-gray-600);
    font-size: 12px;
    transition: color var(--transition);
    text-decoration: none;
    position: relative;
}

.member-academy:hover {
    color: var(--color-gray-900);
}

/* Tooltip popover showing aria-label on hover */
.member-academy::after {
    content: attr(aria-label);
    position: absolute;
    top: calc(100% + 8px);
    left: 50%;
    transform: translateX(-50%);
    padding: 8px 12px;
    background: #101828;
    color: #fff;
    font-family: Satoshi, sans-serif;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.4;
    white-space: nowrap;
    border-radius: 6px;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    z-index: 10002;
}

/* Tooltip arrow pointing up */
.member-academy::before {
    content: '';
    position: absolute;
    top: calc(100% + 2px);
    left: 50%;
    transform: translateX(-50%);
    border: 6px solid transparent;
    border-bottom-color: #101828;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    z-index: 10002;
}


.member-academy:hover::after,
.member-academy:hover::before {
    opacity: 0.8;
    visibility: visible;
}

.member-academy__name {
    font-family: var(--typography-font-family-font-base, Satoshi);
    font-size: 12px;
    font-weight: 700;
    line-height: 16px;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    color: var(--colors-text-text-body, #4A5565);
}

.member-academy__icon {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: block;
    overflow: hidden;
    flex-shrink: 0;
    background: #999384;
    position: relative;
}

/* Hide the actual image src */
.member-academy__icon img {
    display: none;
}

/* Create two layers - default (::after) and hover (::before) for smooth transitions */
.member-academy__icon::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: #999384;
    background-size: 28px 28px;
    background-position: center;
    background-repeat: no-repeat;
    opacity: 1;
    transition: opacity var(--transition, 0.2s ease);
}

.member-academy__icon::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: #999384;
    background-size: 28px 28px;
    background-position: center;
    background-repeat: no-repeat;
    opacity: 0;
    transition: opacity var(--transition, 0.2s ease);
    z-index: 1;
}

/* Set default state background images (::after) */
.member-academy[data-logo="01"] .member-academy__icon::after {
    background-image: url('../assets/icons/logo01_off.png');
}

.member-academy[data-logo="02"] .member-academy__icon::after {
    background-image: url('../assets/icons/logo02_off.png');
}

.member-academy[data-logo="03"] .member-academy__icon::after {
    background-image: url('../assets/icons/logo03_off.png');
}

.member-academy[data-logo="04"] .member-academy__icon::after {
    background-image: url('../assets/icons/logo04_off.png');
}

.member-academy[data-logo="05"] .member-academy__icon::after {
    background-image: url('../assets/icons/logo05_off.png');
}

/* Set hover state background images (::before) - preloaded */
.member-academy[data-logo="01"] .member-academy__icon::before {
    background-image: url('../assets/icons/logo01.png');
}

.member-academy[data-logo="02"] .member-academy__icon::before {
    background-image: url('../assets/icons/logo02.png');
}

.member-academy[data-logo="03"] .member-academy__icon::before {
    background-image: url('../assets/icons/logo03.png');
}

.member-academy[data-logo="04"] .member-academy__icon::before {
    background-image: url('../assets/icons/logo04.png');
}

.member-academy[data-logo="05"] .member-academy__icon::before {
    background-image: url('../assets/icons/logo05.png');
}

/* Hover state - fade out default, fade in hover */
.member-academy:hover .member-academy__icon::after {
    opacity: 0;
}

.member-academy:hover .member-academy__icon::before {
    opacity: 1;
}

/* ============================================
   Site Header
   ============================================ */

.site-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1001;
    padding: 16px 0;
    background-color: transparent;
    border-bottom: none;
    transition: background-color var(--transition), border-color var(--transition);
}

.site-header--scrolled,
.site-header--menu-open {
    background-color: var(--color-white);
    border-bottom: 1px solid var(--color-gray-200);
}

@media (min-width: 992px) {
    .site-header {
        position: absolute;
        top: 50px; /* Below the member-academies-bar */
        left: 0;
        right: 0;
        background-color: transparent;
    }
    
    .site-header--scrolled,
    .site-header--menu-open {
        background-color: #101828;
        border-bottom: none;
    }
}

.site-header__nav {
    display: flex;
    align-items: center;
    gap: 16px;
    justify-content: flex-start;
}

.site-header__logo {
    display: flex;
    align-items: center;
    margin-right: auto;
}

.site-header__logo-img {
    height: 48px;
    width: auto;
}

/* Mobile: show white logo by default, colored when scrolled/menu open */
.site-header__logo-img--white {
    display: block;
}

.site-header__logo-img--color {
    display: none;
}

.site-header--scrolled .site-header__logo-img--white,
.site-header--menu-open .site-header__logo-img--white {
    display: none;
}

.site-header--scrolled .site-header__logo-img--color,
.site-header--menu-open .site-header__logo-img--color {
    display: block;
}

/* Desktop: always show white logo */
@media (min-width: 992px) {
    .site-header__logo-img--white {
        display: block;
    }
    
    .site-header__logo-img--color {
        display: none;
    }
    
    .site-header--scrolled .site-header__logo-img--white,
    .site-header--menu-open .site-header__logo-img--white {
        display: block;
    }
    
    .site-header--scrolled .site-header__logo-img--color,
    .site-header--menu-open .site-header__logo-img--color {
        display: none;
    }
}

/* ============================================
   Site Header Variants (Light/Dark)
   ============================================ */

/* Light Header Variant (white background, dark text/logo) */
.page-header-light .site-header,
.site-header--light {
    background-color: var(--color-white);
}

.page-header-light .site-header__logo-img--white,
.site-header--light .site-header__logo-img--white {
    display: none;
}

.page-header-light .site-header__logo-img--color,
.site-header--light .site-header__logo-img--color {
    display: block;
}

.page-header-light .site-header__nav-link,
.site-header--light .site-header__nav-link {
    color: #101828;
    font-family: var(--typography-font-family-font-base, Satoshi);
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px;
}

.page-header-light .site-header__nav-link:hover,
.site-header--light .site-header__nav-link:hover {
    color: #101828;
    text-decoration: underline;
    opacity: 1;
}

.page-header-light .site-header__nav-link svg,
.site-header--light .site-header__nav-link svg {
    fill: #101828;
}
#searchInput:focus {
    outline: none;
    border: none;
    box-shadow: none;
}
.page-header-light .site-header__search,
.site-header--light .site-header__search {
    color: #101828;
}

.page-header-light .site-header__mobile-toggle,
.site-header--light .site-header__mobile-toggle {
    color: #0276CF;
}

@media (min-width: 992px) {
    .page-header-light .site-header,
    .site-header--light {
        background-color: var(--color-white);
        border-bottom: 1px solid #E5E7EB;
    }
}

/* Dark Header Variant (dark background, white text/logo) - default */
.page-header-dark .site-header,
.site-header--dark {
    background-color: #101828;
}

.page-header-dark .site-header__logo-img--white,
.site-header--dark .site-header__logo-img--white {
    display: block;
}

.page-header-dark .site-header__logo-img--color,
.site-header--dark .site-header__logo-img--color {
    display: none;
}

.page-header-dark .site-header__nav-link,
.site-header--dark .site-header__nav-link {
    color: var(--color-white);
}

.page-header-dark .site-header__nav-link:hover,
.site-header--dark .site-header__nav-link:hover {
    color: var(--color-white);
    text-decoration: underline;
    opacity: 1;
}

.page-header-dark .site-header__nav-link svg,
.site-header--dark .site-header__nav-link svg {
    fill: var(--color-white);
}

.page-header-dark .site-header__search,
.site-header--dark .site-header__search {
    color: var(--color-white);
}

.page-header-dark .site-header__mobile-toggle,
.site-header--dark .site-header__mobile-toggle {
    color: var(--color-white);
}

/* Legacy support - keep page-white-header for backward compatibility */
.page-white-header .site-header {
    background-color: var(--color-white);
}

.page-white-header .site-header__logo-img--white {
    display: none;
}

.page-white-header .site-header__logo-img--color {
    display: block;
}

.page-white-header .site-header__nav-link {
    color: #101828;
    font-family: var(--typography-font-family-font-base, Satoshi);
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px;
}

.page-white-header .site-header__nav-link:hover {
    color: #101828;
    text-decoration: underline;
    opacity: 1;
}

.page-white-header .site-header__nav-link svg {
    fill: #101828;
}

.page-white-header .site-header__search {
    color: #101828;
}

.page-white-header .site-header__mobile-toggle {
    color: #0276CF;
}

@media (min-width: 992px) {
    .page-white-header .site-header {
        background-color: var(--color-white);
        border-bottom: 1px solid #E5E7EB;
    }
}

@media (min-width: 768px) {
    .site-header__logo-img {
        height: 56px;
    }
}

.site-header__menu {
    display: none;
}

@media (min-width: 992px) {
    .site-header__menu {
        display: flex;
        align-items: center;
        margin-left: auto;
    }
}

.site-header__nav-list {
    display: flex;
    align-items: center;
    gap: 8px;
    list-style: none;
    margin: 0;
    padding: 0;
}

.site-header__nav-link {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 8px 16px;
    font-family: var(--font-body);
    font-size: 20px;
    font-weight: 500;
    line-height: 20px;
    color: var(--color-white);
    text-decoration: none;
    transition: text-decoration var(--transition), opacity var(--transition);
}

.site-header__nav-link:hover {
    text-decoration: underline;
    opacity: 1;
    color: var(--color-white);
}

.site-header__dropdown-icon {
    opacity: 0.7;
    transition: transform var(--transition);
}

/* Desktop Dropdown Navigation */
.site-header__nav-item {
    position: relative;
}

.site-header__dropdown {
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 280px;
    background: var(--color-white);
    border: 1px solid #E5E7EB;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1);
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);
    transition: opacity 0.2s ease, visibility 0.2s ease, transform 0.2s ease;
    z-index: 1000;
    padding: 8px 0;
}

.site-header__nav-item:hover .site-header__dropdown,
.site-header__nav-item:focus-within .site-header__dropdown {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.site-header__nav-item:hover .site-header__dropdown-icon,
.site-header__nav-item:focus-within .site-header__dropdown-icon {
    transform: rotate(180deg);
}

.site-header__dropdown-link {
    display: block;
    padding: 12px 24px;
    font-family: var(--font-body);
    font-size: 16px;
    font-weight: 500;
    color: #101828;
    text-decoration: none;
    transition: background-color 0.15s ease, color 0.15s ease;
}

.site-header__dropdown-link:hover,
.site-header__dropdown-link:focus {
    background-color: #F9FAFB;
    color: #0276CF;
}

.site-header__dropdown-link--active {
    color: #0276CF;
}

/* Dropdown divider */
.site-header__dropdown-divider {
    height: 1px;
    background: #E5E7EB;
    margin: 8px 0;
}

/* For light header state */
.site-header--scrolled .site-header__dropdown,
.page-white-header .site-header__dropdown,
.page-header-light .site-header__dropdown {
    background: var(--color-white);
}

.site-header__actions {
    display: flex;
    align-items: center;
    gap: 16px;
}

.site-header__search {
    background: none;
    border: none;
    padding: 8px;
    cursor: pointer;
    transition: opacity var(--transition);
}

.site-header__search--desktop {
    display: none;
    color: var(--color-white);
}

.site-header__search--desktop img {
    width: 24px;
    height: 24px;
    display: block;
    filter: brightness(0) saturate(100%) invert(27%) sepia(96%) saturate(1352%) hue-rotate(194deg) brightness(99%) contrast(101%);
}

/* Default dark header on desktop: white search icon */
@media (min-width: 992px) {
    .site-header__search--desktop img {
        filter: brightness(0) invert(1);
    }
    
    /* Light header: blue search icon (override desktop default) */
    .page-header-light .site-header__search--desktop img,
    .site-header--light .site-header__search--desktop img,
    .page-white-header .site-header__search--desktop img {
        filter: brightness(0) saturate(100%) invert(27%) sepia(96%) saturate(1352%) hue-rotate(194deg) brightness(99%) contrast(101%);
    }
}

/* Dark header: white search icon (explicit dark header classes) */
.page-header-dark .site-header__search--desktop img,
.site-header--dark .site-header__search--desktop img {
    filter: brightness(0) invert(1);
}

.site-header__search--mobile {
    display: none;
}

.site-header__search--mobile-white {
    display: block;
}

.site-header--scrolled .site-header__search--mobile-white,
.site-header--menu-open .site-header__search--mobile-white {
    display: none;
}

.site-header--scrolled .site-header__search--mobile,
.site-header--menu-open .site-header__search--mobile {
    display: block;
}

@media (min-width: 992px) {
    .site-header__search--desktop {
        display: block;
    }
    
    .site-header__search--mobile,
    .site-header__search--mobile-white {
        display: none;
    }
    
    .site-header--scrolled .site-header__search--mobile,
    .site-header--menu-open .site-header__search--mobile {
        display: none;
    }
}

.site-header__search:hover {
    opacity: 0.7;
}

.site-header--dark .site-header__search {
    color: var(--color-white);
}

/* Hide mobile search icons on all pages */
.site-header__search--mobile,
.site-header__search--mobile-white,
.site-header--scrolled .site-header__search--mobile-white,
.site-header--menu-open .site-header__search--mobile-white,
.site-header--scrolled .site-header__search--mobile,
.site-header--menu-open .site-header__search--mobile {
    display: none;
}

.site-header__mobile-toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    position: relative;
    color: var(--color-white); /* White by default on homepage */
}

@media (max-width: 991px) {
    .site-header__mobile-toggle {
        display: flex !important;
    }
}

@media (min-width: 992px) {
    .site-header__mobile-toggle {
        display: none !important;
    }
}

.site-header--scrolled .site-header__mobile-toggle,
.site-header--menu-open .site-header__mobile-toggle {
    color: #0276CF; /* Blue when scrolled or menu open */
}

.site-header__mobile-toggle svg {
    transition: opacity 0.3s ease, transform 0.3s ease;
}

.site-header__mobile-toggle .mobile-toggle__close {
    position: absolute;
    opacity: 0;
    transform: rotate(-90deg);
    pointer-events: none;
}

.site-header--menu-open .site-header__mobile-toggle .mobile-toggle__hamburger {
    opacity: 0;
    transform: rotate(90deg);
    pointer-events: none;
}

.site-header--menu-open .site-header__mobile-toggle .mobile-toggle__close {
    opacity: 1;
    transform: rotate(0deg);
    pointer-events: auto;
}


/* ============================================
   Search Overlay
   ============================================ */

.search-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1010;
    background-color: rgba(0, 0, 0, 0.7);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    visibility: hidden;
    transition: opacity var(--transition-slow), visibility var(--transition-slow);
}

.search-overlay--open {
    opacity: 1;
    visibility: visible;
}

.search-overlay__content {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 24px;
}

.search-overlay__label {
    font-family: var(--font-body);
    font-size: 14px;
    font-weight: 500;
    color: var(--color-white);
}

.search-overlay__form {
    display: flex;
    align-items: center;
    gap: 16px;
}

.search-overlay__form form {
    display: flex;
    align-items: center;
    gap: 16px;
    flex: 1;
    min-width: 0;
}

.search-overlay__input-wrapper {
    display: flex;
    align-items: center;
    background-color: var(--color-white);
    padding: 4px 4px 4px 16px;
    min-width: 480px;
}

.search-overlay__input-icon {
    color: var(--color-gray-400);
    flex-shrink: 0;
}

.search-overlay__input {
    flex: 1;
    border: none;
    padding: 16px 12px;
    font-family: var(--font-body);
    font-size: 16px;
    color: var(--color-gray-900);
    outline: none;
    background: transparent;
}

.search-overlay__input::placeholder {
    color: var(--color-gray-400);
}

.search-overlay__submit {
    background-color: var(--color-blue);
    color: var(--color-white);
    border: none;
    padding: 16px 24px;
    font-family: var(--font-body);
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: background-color var(--transition);
}

.search-overlay__submit:hover {
    background-color: #0266B3;
}

.search-overlay__cancel {
    display: flex;
    align-items: center;
    gap: 8px;
    background: none;
    border: none;
    color: var(--color-white);
    font-family: var(--font-body);
    font-size: 16px;
    font-weight: 500;
    cursor: pointer;
    padding: 8px;
    transition: opacity var(--transition);
}

.search-overlay__cancel:hover {
    opacity: 0.7;
}

.search-overlay__cancel svg {
    width: 20px;
    height: 20px;
}

/* ============================================
   Mobile Menu
   ============================================ */

.mobile-menu {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1002;
    background-color: var(--color-white);
    opacity: 0;
    visibility: hidden;
    transition: opacity var(--transition-slow), visibility var(--transition-slow);
    overflow-y: auto;
    display: flex;
    flex-direction: column;
}

.mobile-menu--open {
    opacity: 1;
    visibility: visible;
}

.mobile-menu__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 24px;
    border-bottom: 1px solid var(--color-gray-200);
    flex-shrink: 0;
}

.mobile-menu__logo-img {
    height: 48px;
}

.mobile-menu__actions {
    display: flex;
    align-items: center;
    gap: 16px;
}

.mobile-menu__search,
.mobile-menu__close {
    background: none;
    border: none;
    padding: 8px;
    cursor: pointer;
    color: #0276CF; /* Default color */
}

.page-header-light .mobile-menu__close,
.site-header--light .mobile-menu__close,
.page-white-header .mobile-menu__close {
    color: #0276CF;
}

.page-header-dark .mobile-menu__close,
.site-header--dark .mobile-menu__close {
    color: #0276CF;
}

.mobile-menu__nav {
    padding: 24px;
    flex: 1;
}

.mobile-menu__list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.mobile-menu__item {
    border-bottom: 1px solid var(--color-gray-200);
}

.mobile-menu__link {
    display: block;
    padding: 12px 0;
    font-family: var(--font-body);
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    color: #101828;
}

.mobile-menu__accordion-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 12px 0;
    font-family: var(--font-body);
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    color: #101828;
    background: none;
    border: none;
    cursor: pointer;
    text-align: left;
}

.mobile-menu__item--accordion.is-open .mobile-menu__accordion-toggle {
    color: var(--color-blue);
}

.mobile-menu__chevron {
    transition: transform var(--transition);
}

.mobile-menu__chevron path {
    fill: #101828;
    transition: fill var(--transition);
}

.mobile-menu__item--accordion.is-open .mobile-menu__chevron path {
    fill: var(--color-blue);
}

.mobile-menu__accordion-toggle[aria-expanded="true"] .mobile-menu__chevron {
    transform: rotate(180deg);
}

.mobile-menu__submenu {
    list-style: none;
    margin: 0;
    padding: 0 0 16px 0;
    display: none;
}

.mobile-menu__item--accordion.is-open .mobile-menu__submenu {
    display: block;
}

.mobile-menu__sublink {
    display: block;
    padding: 12px 0;
    font-family: var(--font-body);
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    color: #4A5565;
    text-decoration: none;
}

.mobile-menu__sublink:hover {
    color: var(--color-blue);
}

.mobile-menu__search {
    display: flex;
}

.mobile-menu[aria-hidden="false"] .mobile-menu__search {
    display: none;
}

.mobile-menu__search-box {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    border-radius: 4px;
    border: 1px solid #E5E7EB;
    background: #FFF;
    box-shadow: 0 1px 2px 0 rgba(29, 41, 61, 0.05);
    margin-top: 24px;
}

.mobile-menu__search-box svg {
    fill: #0276CF;
    color: #0276CF;
}

.mobile-menu__search-input {
    flex: 1;
    border: none;
    font-family: var(--font-body);
    font-size: 16px;
    color: var(--color-gray-600);
    outline: none;
    background: transparent;
}

.mobile-menu__search-input::placeholder {
    color: var(--color-gray-400);
}

.mobile-menu__academies {
    background-color: var(--color-bg-warm);
    padding: 24px;
    flex-shrink: 0;
}

.mobile-menu__academies-label {
    display: block;
    font-size: 11px;
    font-weight: 500;
    letter-spacing: 0.05em;
    color: var(--color-gray-600);
    text-transform: uppercase;
    margin-bottom: 16px;
}

.mobile-menu__academies-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}

.mobile-menu__academy {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    color: var(--color-gray-600);
}

.mobile-menu__academy-icon {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    object-fit: contain;
}

.mobile-menu__academy-icon--placeholder {
    background-color: #C9A227;
}

/* ============================================
   Hero Section
   ============================================ */

.hero {
    position: relative;
    min-height: 500px;
    display: flex;
    align-items: flex-start;
    padding-top: 120px;
    overflow: hidden;
}

@media (min-width: 768px) {
    .hero {
        min-height: 689px;
        padding-top: 120px;
        align-items: center;
    }
}

.hero__background {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
}

.hero__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.hero__overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.00) 43.76%, rgba(0, 0, 0, 0.80) 92.6%);
}

.hero__content {
    position: relative;
    z-index: 1;
    width: 100%;
    padding-bottom: 120px;
}
@media (max-width: 767px) {
    .hero__content {
        padding-bottom: 0px;
        padding-top: 120px;
    }
    .hero__content .container {
        padding: 0px;
    }
}
@media (min-width: 768px) {
    .hero__content {
        padding-bottom: 10px;
    }
}

.hero__inner {
    max-width: 631px;
    background: rgba(0, 0, 0, 0.40);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    padding: 24px;
}

@media (max-width: 767px) {
    .hero__inner {
        max-width:100%;
        margin: 0px;
    }
}

@media (min-width: 768px) {
    .hero__inner {
        padding: 32px;
    }
}

.hero__title {
    font-size: 36px;
    line-height: 1;
    color: var(--color-white);
    margin-bottom: 16px;
    letter-spacing: -0.8px;
}

@media (min-width: 768px) {
    .hero__title {
        font-size: 48px;
        margin-bottom: 20px;
    }
}

@media (min-width: 992px) {
    .hero__title {
        font-size: 60px;
    }
}

.hero__text {
    font-size: 16px;
    line-height: 28px;
    letter-spacing: 1px;
    color: rgba(255, 255, 255, 0.85);
    margin-bottom: 24px;
}

@media (min-width: 768px) {
    .hero__text {
        font-size: 20px;
        margin-bottom: 32px;
    }
}

.hero__cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    background-color: var(--color-blue);
    color: var(--color-white);
    font-size: 14px;
    font-weight: 600;
    padding: 14px 24px;
    border-radius: 0;
    transition: background-color var(--transition);
}

.hero__cta:hover {
    background-color: #0266B3;
    color: var(--color-white);
}

@media (max-width: 767px) {
    .hero__cta {
        width: 100%;
    }
}

.hero__cta svg {
    width: 20px;
    height: 20px;
}

.hero__curve {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 2;
    pointer-events: none;
    display: none;
}

@media (min-width: 992px) {
    .hero__curve {
        display: block;
    }
}

.hero__curve-grey {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 223px;
    z-index: 2;
}

.hero__curve-white {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100px;
    z-index: 3;
}

@media (min-width: 768px) {
    .hero__curve-white {
        height: 150px;
    }
}

.hero__curve svg {
    display: block;
}

/* ============================================
   Policy Section
   ============================================ */

.policy-section {
    padding: 48px 0;
    background-color: var(--color-white);
}

@media (min-width: 768px) {
    .policy-section {
        padding: 64px 0;
    }
}

.policy-grid {
    display: grid;
    gap: 24px;
}

@media (min-width: 768px) {
    .policy-grid {
        grid-template-columns: 1fr 1fr;
        gap: 32px 56px;
    }
}

@media (min-width: 992px) {
    .policy-grid {
        grid-template-columns: 1fr 1fr 1fr;
        grid-template-rows: auto auto;
    }
    
    .policy-card--main {
        grid-row: 1 / 3;
    }
}

.policy-card {
    padding: 0;
}

.policy-card--main {
    padding: 0;
}

.policy-card--small {
    display: flex;
    align-items: flex-start;
    gap: 16px;
}

.policy-card__icon {
    margin-bottom: 20px;
}

.policy-card__icon--small {
    margin-bottom: 0;
    flex-shrink: 0;
    width: 64px;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 99px;
}

.policy-card__icon--blue {
    background: linear-gradient(0deg, #FFF 0%, #E8F4FC 88.75%);
    transition: background 0.3s ease;
}

.policy-card__icon--warm {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.00) 11.25%, #FFF 100%), var(--color-bg-warm);
}

/* On hover, switch blue icons to warm */
.policy-card:hover .policy-card__icon--blue {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.00) 11.25%, #FFF 100%), var(--color-bg-warm);
}

.policy-card__icon svg {
    display: block;
}

.policy-card__icon-image {
    transition: filter 0.3s ease;
    /* Blue color filter - matches site blue */
    filter: brightness(0) saturate(100%) invert(32%) sepia(93%) saturate(1352%) hue-rotate(183deg) brightness(91%) contrast(101%);
}

.policy-card:hover .policy-card__icon-image {
    /* Orange color filter - matches #D03801 */
    filter: brightness(0) saturate(100%) invert(24%) sepia(95%) saturate(2814%) hue-rotate(16deg) brightness(92%) contrast(98%);
}

.policy-card__content {
    flex: 1;
}

.policy-card__title {
    font-size: 32px;
    margin-bottom: 16px;
    letter-spacing: -0.4px;
}

.policy-card__title--small {
    font-size: 20px;
    font-weight: 700;
    font-family: var(--font-body);
    margin-bottom: 8px;
    line-height: 1.2;
}

.policy-card__text {
    font-size: 16px;
    line-height: 24px;
    color: var(--color-gray-600);
    margin: 0;
}

.policy-card__text--small {
    font-size: 14px;
    line-height: 1.4;
}

/* ============================================
   Reports Section
   ============================================ */

.reports-section {
    padding: var(--section-padding-mobile) 0;
    background: var(--grad-dark);
}

@media (min-width: 768px) {
    .reports-section {
        padding: var(--section-padding) 0;
    }
}

.reports-section__header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 32px;
}

@media (max-width: 767px) {
    .reports-section__header {
        flex-direction: column;
        gap: 16px;
    }
}

@media (min-width: 768px) {
    .reports-section__header {
        margin-bottom: 40px;
    }
}

.reports-section__title {
    font-size: 32px;
    margin-bottom: 8px;
    color: var(--color-white);
    letter-spacing: -0.4px;
}

@media (min-width: 768px) {
    .reports-section__title {
        font-size: 48px;
    }
}

.reports-section__subtitle {
    font-size: 16px;
    color: rgba(255, 255, 255, 0.7);
    margin: 0;
}

.reports-section__nav {
    display: flex;
    align-items: center;
    gap: 12px;
}

.reports-nav__btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border: none;
    background: none;
    cursor: pointer;
    color: var(--color-white);
    transition: opacity var(--transition);
}

.reports-nav__btn svg,
.reports-nav__btn img {
    width: 32px;
    height: 32px;
    display: block;
}

.reports-nav__btn:hover {
    opacity: 0.7;
}

.reports-nav__count {
    font-size: 14px;
    color: rgba(255, 255, 255, 0.7);
    min-width: 40px;
    text-align: center;
}

.reports-grid {
    display: grid;
    gap: 24px;
    margin-bottom: 40px;
}

@media (min-width: 768px) {
    .reports-grid {
        grid-template-columns: 1fr 1fr;
        gap: 32px;
    }
}

.report-card {
    background-color: var(--color-white);
    overflow: hidden;
}

.report-card__image {
    aspect-ratio: 16 / 10;
    overflow: hidden;
    background-color: var(--color-gray-200);
}

.report-card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.report-card__content {
    padding: 24px;
}

@media (min-width: 768px) {
    .report-card__content {
        padding: 32px;
    }
}

.report-card__title {
    font-size: 20px;
    margin-bottom: 12px;
    letter-spacing: -0.4px;
}
.report-card__title a:hover {
    text-decoration: underline;
}

@media (min-width: 768px) {
    .report-card__title {
        font-size: 24px;
        margin-bottom: 16px;
    }
}

.report-card__text {
    font-size: 14px;
    line-height: 1.4;
    color: var(--color-gray-600);
    margin-bottom: 16px;
}

.report-card__footer {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.report-card__link {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 14px;
    font-weight: 600;
    color: var(--color-gray-900);
    transition: color var(--transition);
}

.report-card__link:hover {
    color: var(--color-blue);
}

.report-card__tags {
    display: flex;
    gap: 12px;
}

.report-card__tag {
    font-size: 12px;
    color: var(--color-blue);
}

.reports-section__actions {
    text-align: center;
}

@media (max-width: 767px) {
    .reports-section__actions .btn {
        width: 100%;
        justify-content: center;
    }
    .reports-section__actions::before,
    .reports-section__actions::after {
        display: none;
    }
}

/* ============================================
   Submissions Section
   ============================================ */

.submissions-section {
    padding: var(--section-padding-mobile) 0;
    background-color: var(--color-white);
}

@media (min-width: 768px) {
    .submissions-section {
        padding: var(--section-padding) 0;
    }
}

.submissions-section__header {
    margin-bottom: 32px;
}

@media (min-width: 768px) {
    .submissions-section__header {
        margin-bottom: 40px;
    }
}

.submissions-section__title {
    font-size: 32px;
    margin-bottom: 8px;
    letter-spacing: -0.4px;
}

@media (min-width: 768px) {
    .submissions-section__title {
        font-size: 48px;
    }
}

.submissions-section__subtitle {
    font-size: 16px;
    color: var(--color-gray-500);
    margin: 0;
}

.submissions-grid {
    display: grid;
    gap: 32px;
    margin-bottom: 40px;
}

@media (min-width: 768px) {
    .submissions-grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 0;
    }
}

.submission-card {
    padding: 0 24px;
    border-left: 1px solid var(--color-gray-200);
}

.submission-card:first-child {
    border-left: none;
}

.submission-card:last-child {
    padding-right: 0;
}

@media (max-width: 767px) {
    .submission-card {
        border-left: none;
        border-bottom: 1px solid var(--color-gray-200);
        padding: 0 0 32px 0;
    }
    
    .submission-card:last-child {
        border-bottom: none;
        padding-bottom: 0;
    }
}

.submission-card__date {
    display: block;
    font-size: 12px;
    color: var(--color-gray-500);
    margin-bottom: 8px;
}

.submission-card__title {
    font-size: 18px;
    font-weight: 700;
    font-family: var(--font-body);
    margin-bottom: 12px;
    line-height: 1.2;
}
.submission-card__title a:hover {
    text-decoration: underline;
}

@media (min-width: 768px) {
    .submission-card__title {
        font-size: 20px;
    }
}

.submission-card__text {
    font-size: 14px;
    line-height: 1.4;
    color: var(--color-gray-600);
    margin-bottom: 16px;
}

.submission-card__link {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 14px;
    font-weight: 600;
    color: var(--color-blue-dark);
    transition: color var(--transition);
}

.submission-card__link:hover {
    color: var(--color-blue);
}

.submission-card__link svg {
    width: 20px;
    height: 20px;
}

.submissions-section__actions {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 40px;
}

@media (max-width: 767px) {
    .submissions-section__actions {
        margin-top: 24px;
    }
    .submissions-section__actions .btn {
        width: 100%;
        box-shadow: none;
        justify-content: center;
    }
    .submissions-section__actions::before {
        display: none;
    }
}

.submissions-section__actions::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    height: 1px;
    background-color: var(--color-gray-200);
    transform: translateY(-50%);
}

.submissions-section__actions .btn {
    box-shadow: -48px 0 0 var(--color-white), 48px 0 0 var(--color-white);
}

/* ============================================
   News Section
   ============================================ */

.news-section {
    padding: var(--section-padding-mobile) 0;
    background: var(--grad-news);
}

@media (min-width: 768px) {
    .news-section {
        padding: var(--section-padding) 0;
    }
}

.news-section__header {
    margin-bottom: 32px;
}

@media (min-width: 768px) {
    .news-section__header {
        margin-bottom: 40px;
    }
}

.news-section__title {
    font-size: 32px;
    color: var(--color-white);
    margin-bottom: 8px;
    letter-spacing: -0.4px;
}

@media (min-width: 768px) {
    .news-section__title {
        font-size: 48px;
    }
}

.news-section__subtitle {
    font-size: 16px;
    color: rgba(255, 255, 255, 0.7);
    margin: 0;
}

.news-grid {
    display: grid;
   
    margin-bottom: 40px;
}

@media (min-width: 768px) {
    .news-grid {
        grid-template-columns: repeat(3, 1fr);
        
    }
}

.news-card {
    background-color: var(--color-white);
    overflow: hidden;
}

/* News cards on dark background (homepage news section) */
.news-section .news-card {
    background-color: transparent;
    border-left: 1px solid var(--colors-border-border-base-medium, #333E4F);
    padding-left: 20px;
    padding-right: 20px;
}
@media (max-width: 767px) {
    .news-section .news-card {
       margin-bottom: 32px;
       padding-left: 12px;
       padding-right: 12px;
    }
}
.news-section .news-card__title {
    color: var(--color-white);
}

.news-section .news-card__text,
.news-section .news-card__text p {
    color: var(--color-white);
}

.news-section .news-card__date {
    color: rgba(255, 255, 255, 0.7);
}

.news-section .news-card__link {
    color: #279CF5;
}

.news-section .news-card__link:hover {
    color: #5CB8FF;
}

.news-card__image {
    aspect-ratio: 16 / 10;
    overflow: hidden;
    background-color: var(--color-gray-200);
}

.news-card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.news-card__content {
    padding: 20px 0;
}



.news-card__date {
    display: block;
    font-size: 14px;
    color: var(--color-gray-500);
    margin-bottom: 8px;
}

.news-card__title {
    font-size: 16px;
    font-weight: 700;
    font-family: var(--font-body);
    margin-bottom: 12px;
    line-height: 1.2;
    color: var(--color-gray-900);
}
.news-card__title a:hover {
    text-decoration: underline;
}
@media (min-width: 768px) {
    .news-card__title {
        font-size: 20px;
    }
}

.news-card__text {
    font-size: 16px;
    line-height: 1.4;
    color: var(--color-gray-600);
    margin-bottom: 16px;
}

.news-card__text p {
    margin: 0 0 12px 0;
}

.news-card__text p:last-child {
    margin-bottom: 0;
}

.news-card__link {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 16px;
    font-weight: 600;
    color: var(--color-blue-dark);
    transition: color var(--transition);
}

.news-card__link:hover {
    color: var(--color-blue);
}

.news-card__link svg {
    width: 20px;
    height: 20px;
}

.news-section__actions {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 40px;
}

.news-section__actions::before,
.news-section__actions::after {
    content: '';
    position: absolute;
    top: 50%;
    height: 1px;
    background-color: rgba(255, 255, 255, 0.1);
    transform: translateY(-50%);
}

.news-section__actions::before {
    left: 0;
    right: calc(50% + 48px + 90px);
}

.news-section__actions::after {
    right: 0;
    left: calc(50% + 48px + 90px);
}

@media (max-width: 767px) {
    .news-section__actions {
        margin-top: 24px;
    }
    .news-section__actions .btn {
        width: 100%;
        justify-content: center;
    }
    .news-section__actions::before,
    .news-section__actions::after {
        display: none;
    }
}

/* ============================================
   Newsletter Section
   ============================================ */

.newsletter-section {
    padding: 40px 0;
    background-color: var(--color-bg-warm);
}

@media (min-width: 768px) {
    .newsletter-section {
        padding: var(--section-padding) 0;
    }
}

.newsletter-section__inner {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

@media (max-width: 767px) {
    .newsletter-section__inner {
        align-items: left;
        text-align: left;
    }
    .newsletter-section__inner .btn {
       justify-content: center;
    }
}

@media (min-width: 768px) {
    .newsletter-section__inner {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
    }
}

.newsletter-section__title {
    font-size: 40px;
    font-weight: 400;
    line-height: 1.1;
    color: var(--color-gray-900);
    margin-bottom: 8px;
    letter-spacing: -0.4px;
}

@media (min-width: 768px) {
    .newsletter-section__title {
        font-size: 48px;
    }
}

.newsletter-section__subtitle {
    font-size: 16px;
    color: var(--color-gray-600);
    margin: 0;
}

/* ============================================
   Footer
   ============================================ */

.site-footer {
    background-color: var(--color-navy-dark);
    padding: 48px 0 24px;
    color: var(--color-white);
}

@media (min-width: 768px) {
    .site-footer {
        padding: 64px 0 32px;
    }
}

.site-footer__main {
    display: grid;
    gap: 40px;
    margin-bottom: 40px;
}

@media (min-width: 768px) {
    .site-footer__main {
        grid-template-columns: 1fr 2fr;
        gap: 64px;
    }
}

.site-footer__logo {
    display: inline-block;
    margin-bottom: 16px;
}

.site-footer__logo img {
    height: 48px;
}

.site-footer__description {
    font-size: 16px;
    line-height: 1.4;
    color: var(--color-white);
    margin-bottom: 16px;
}

.site-footer__copyright {
    font-size: 12px;
    color: var(--color-white);
    margin: 0;
}

.site-footer__nav {
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.site-footer__links {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 100%;
    gap: 16px;
}

@media (max-width: 767px) {
    .site-footer__links {
        flex-direction: column;
        align-items: flex-start;
        justify-content: flex-start;
    }
}

.site-footer__link {
    color: var(--colors-text-text-white, #FFF);
    font-family: var(--typography-font-family-font-base, Satoshi);
    font-size: var(--typography-font-size-text-base, 16px);
    font-style: normal;
    font-weight: 700;
    line-height: var(--typography-line-height-leading-6, 24px);
    transition: opacity var(--transition);
}

.site-footer__link:hover {
    opacity: 0.7;
    color: var(--color-white);
}

.site-footer__acknowledgment {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.site-footer__flags {
    display: flex;
    gap: 8px;
}

.site-footer__flag {
    width: 24px;
    height: 16px;
    border-radius: 2px;
    object-fit: cover;
}

.site-footer__acknowledgment-text {
    font-size: 14px;
    line-height: 1.6;
    color: var(--color-gray-ack);
}

.site-footer__acknowledgment-text strong {
    display: block;
    color: var(--color-gray-ack);
    margin-bottom: 8px;
}

.site-footer__acknowledgment-text p {
    margin: 0 0 8px;
}

.site-footer__acknowledgment-text p:last-child {
    margin-bottom: 0;
}

.site-footer__bottom {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding-top: 24px;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

@media (min-width: 768px) {
    .site-footer__bottom {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
    }
}

.site-footer__legal {
    display: flex;
    gap: 24px;
}

.site-footer__legal-link {
    font-size: 14px;
    color: var(--color-white);
    transition: opacity var(--transition);
}

.site-footer__legal-link:hover {
    opacity: 0.7;
    color: var(--color-white);
}

.site-footer__social {
    display: flex;
    gap: 16px;
}

.site-footer__social-link {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, 0.1);
    color: var(--color-white);
    transition: background-color var(--transition);
}

.site-footer__social-link:hover {
    background-color: rgba(255, 255, 255, 0.2);
    color: var(--color-white);
}

.site-footer__social-link svg {
    width: 20px;
    height: 20px;
}


.homepage .news-section__title
 {
    font-size: 48px;
    color: var(--color-white);
    margin-bottom: 8px;
    letter-spacing: -0.4px;
    font-family: var(--font-heading);
    font-weight: 400;
}

.homepage .news-section {
    margin-bottom: 0;
}

.search-results-wrapper h2 {
    display: none;
}

 .content-detail-page .content-section:first-of-type .content-section__content.no-leading-paragraph > p:first-of-type {
    margin: 0 0 16px 0;
    color: var(--colors-text-text-body, #4A5565);
    font-family: var(--font-body);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
 }

  html .content-sidebar__roles {
    padding-left: 0px;
 }

 .related-item:hover {
    box-shadow:none !important;
}

html .content-accordion__content p a
html .content-section__content p a,
html .content-section p a,html .form-help a,
html .content-accordion__content li a
html .content-section__content li a,
html .content-section li a,html .form-help li a
{
    color: #000;
    text-decoration: underline;

}

html .content-accordion__content a:hover,
html .content-section__content a:hover,
html .content-section a:hover,html .form-help a:hover,
html .content-accordion__content li a:hover,
html .content-section__content li a:hover,
html .content-section li a:hover,html .form-help a:hover {
    color: var(--color-blue);
    text-decoration: underline;
}

/* ============================================
   Report Funding Partners Grid
   ============================================ */

.content-project-funding-partners-grid {
    display: grid;
    gap: 24px;
    align-items: center;
}

@media (min-width: 768px) {
    .content-project-funding-partners-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

/* Report page: Project Funding & Support partners only – 2 per row */
@media (min-width: 768px) {
    .content-project-funding-partners-grid--report-two-col {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

.content-project-funding-partner-item {
    display: flex;
    justify-content: center;
    align-items: center;
}


.page-node--homepage .report-card-listing {
    border:0px solid #fff;
}

img[data-align="center"] {
    display: block;
    margin: 0 auto;
}

img[data-align="left"] {
    float: left;
    margin: 0 1rem 1rem 0;
    max-width: 100%;
    height: auto;
  }

img[data-align="right"] {
    float: right;
    margin: 0 0 1rem 1rem;
    max-width: 100%;
    height: auto;
  }

  

.page-node--theme-detail-page .featured-content-section__image {
    position: relative;
    aspect-ratio: 16 / 10;
    overflow: hidden;
}

.page-node--theme-detail-page .featured-content-section__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.bg-acola-grey {
    background-color: #F9FAFB;
}