:root {
    --bg: #f6f8fb;
    --home-section-offwhite: #f8f9fa;
    --card: #ffffff;
    --primary: #0f6c5d;
    --primary-dark: #0b5348;
    --text: #1a1f2b;
    --muted: #697386;
    --border: #dde3ea;
}
* { box-sizing: border-box; }
body {
    margin: 0;
    font-family: Arial, sans-serif;
    color: var(--text);
    background: var(--bg);
    line-height: 1.5;
}
/* Home — fixed parallax + section gaps (matches portal.akosuadankwaafoundation.org) */
body.is-home {
    overflow-x: hidden;
}
.parallax-bg {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: url("../../pictures/bg.png");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: fixed;
    z-index: -2;
    pointer-events: none;
}
.section-gap {
    height: 250px;
    background-color: transparent;
    position: relative;
    z-index: 0;
}
body.is-home .section-gap.parallax-1 {
    background-image: url("../../pictures/bg.png");
    background-size: cover;
    background-position: center top;
    background-repeat: no-repeat;
    background-attachment: fixed;
}
body.is-home .section-gap.parallax-2 {
    background-image: url("../../pictures/bg1.png");
    background-size: cover;
    background-position: center top;
    background-repeat: no-repeat;
    background-attachment: fixed;
}
@media (max-width: 1024px) {
    .parallax-bg,
    body.is-home .section-gap.parallax-1,
    body.is-home .section-gap.parallax-2 {
        background-attachment: scroll !important;
    }
}
.container { width: min(1150px, 92%); margin: 0 auto; }
.mobile-header-bar,
.mobile-nav-drawer,
.mobile-nav-overlay,
.portal-mobile-menu-btn,
.portal-overlay { display: none; }
.site-header { background: #fff; position: sticky; top: 0; z-index: 100; box-shadow: 0 4px 12px rgba(0,0,0,0.05); }
.header-top-bar { background: var(--bg); border-bottom: 1px solid var(--border); }
.header-top-inner {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    padding: 0.5rem 0;
    gap: 0.75rem;
}
.header-social {
    display: flex;
    gap: 0.8rem;
    align-items: center;
    justify-self: start;
    min-width: 0;
}
.header-social a { color: var(--muted); font-size: 1.1rem; transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), color 0.3s ease; display: inline-block; }
.header-social a:hover { color: var(--primary); transform: translateY(-3px) scale(1.1); }
.header-logo {
    display: flex;
    justify-content: center;
    justify-self: center;
    min-width: 0;
}
.brand-logo { height: 60px; width: auto; display: block; transition: transform 0.4s ease; }
.brand:hover .brand-logo { transform: scale(1.04); }
.header-apply {
    display: flex;
    justify-content: flex-end;
    justify-self: end;
    min-width: 0;
}
.header-nav-bar { border-bottom: 1px solid var(--border); background: #fff; }
.site-nav { display: flex; justify-content: center; gap: 2rem; align-items: center; padding: 0.8rem 0; flex-wrap: wrap; }
.site-nav a { position: relative; color: var(--text); font-weight: 500; padding: 0.3rem 0; transition: color 0.3s ease; }
.site-nav a::after {
    content: '';
    position: absolute;
    width: 0;
    height: 2px;
    bottom: -2px;
    left: 50%;
    background-color: var(--primary);
    transition: width 0.3s ease, left 0.3s ease;
}
.site-nav a:hover, .site-nav a.active { color: var(--primary); }
.site-nav a:hover::after, .site-nav a.active::after { width: 100%; left: 0; }
/* Section 3: hero banner — isolated above parallax / body BG so design stays consistent on every page */
.header-banner {
    position: relative;
    z-index: 2;
    isolation: isolate;
}
body.is-home .header-banner {
    background: #000;
}
a { color: inherit; text-decoration: none; }
.btn {
    border: 0; background: var(--primary); color: #fff; padding: .7rem 1rem; border-radius: 8px; cursor: pointer;
    transition: .2s ease;
}
.btn:hover { background: var(--primary-dark); transform: translateY(-1px); }
.btn-sm { padding: .45rem .8rem; }
.btn-outline { background: #fff; color: var(--primary); border: 1px solid var(--primary); }
.btn-outline:hover { background: #eef9f6; }
.hero {
    display: grid; gap: 1rem; grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: center; padding: 3.2rem 0;
}
.hero h1 { font-size: clamp(1.8rem, 4vw, 3rem); margin: 0 0 .5rem; }
.hero p { color: var(--muted); }
.card {
    background: var(--card); border: 1px solid var(--border); border-radius: 12px; padding: 1rem;
    box-shadow: 0 3px 20px rgba(11, 40, 70, .06);
}
.grid-3 { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 1rem; }
.grid-2 { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 1rem; }
.section { padding: 2rem 0; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(8px);} to { opacity: 1; transform: translateY(0);} }
.reveal-on-scroll {
    opacity: 0;
    transform: translateY(24px) scale(.985);
    transition: opacity .65s ease, transform .65s cubic-bezier(.2, .75, .28, 1);
    transition-delay: var(--reveal-delay, 0ms);
    will-change: transform, opacity;
}
.reveal-on-scroll.is-visible {
    opacity: 1;
    transform: translateY(0) scale(1);
}
@media (prefers-reduced-motion: reduce) {
    .reveal-on-scroll,
    .reveal-on-scroll.is-visible {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }
}
.site-footer { background: #0f172a; color: #d7dfec; margin-top: 2rem; }
body.is-home .site-footer {
    margin-top: 0;
}
.site-footer a { color: #d7dfec; }
.site-footer .footer-grid a {
    position: relative;
    display: inline-block;
    transition: color .2s ease, transform .2s ease;
}
.site-footer .footer-grid a::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -2px;
    width: 100%;
    height: 1px;
    background: #f2c94c;
    transform: scaleX(0);
    transform-origin: left;
    transition: transform .2s ease;
}
.site-footer .footer-grid a:hover {
    color: #f2c94c;
    transform: translateX(2px);
}
.site-footer .footer-grid a:hover::after {
    transform: scaleX(1);
}
.site-footer .footer-grid .btn::after {
    display: none;
}
.footer-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 1rem; padding: 2rem 0 1rem; }
.footer-copy { border-top: 1px solid rgba(255,255,255,.14); padding: .8rem 0 1.2rem; font-size: .9rem; color: #b8c4d8; }
input, select, textarea {
    width: 100%; border: 1px solid var(--border); background: #fff; border-radius: 8px; padding: .7rem;
}
.form-row { display: grid; gap: .75rem; margin-bottom: .75rem; }
.portal-layout { display: grid; grid-template-columns: 260px 1fr; gap: 1rem; padding: 1rem 0 2rem; align-items: start; height: calc(100vh - 130px); overflow: hidden; }
.portal-sidebar { position: sticky; top: 1rem; height: calc(100vh - 150px); overflow-y: scroll; }
.portal-main { height: calc(100vh - 150px); overflow-y: scroll; padding-right: .25rem; }
.portal-sidebar a, .portal-tab-link { display: flex; align-items: center; gap: .55rem; width: 100%; padding: .6rem; border-radius: 8px; margin-bottom: .45rem; }
.portal-tab-link { border: 0; background: transparent; color: inherit; font: inherit; text-align: left; cursor: pointer; }
.portal-sidebar a i, .portal-tab-link i { width: 18px; text-align: center; color: var(--muted); }
.portal-sidebar a span, .portal-tab-link span { min-width: 0; overflow-wrap: anywhere; }
.portal-sidebar a:hover, .portal-sidebar a.active, .portal-tab-link:hover, .portal-tab-link.active { background: #e6f5f2; color: var(--primary-dark); }
.portal-sidebar a:hover i, .portal-sidebar a.active i, .portal-tab-link:hover i, .portal-tab-link.active i { color: var(--primary-dark); }
.portal-sidebar-divider { border: 0; border-top: 1px solid var(--border); margin: .8rem 0; }
.profile-cover { height: 220px; border-radius: 12px; background-size: cover; background-position: center; position: relative; }
.profile-avatar { width: 112px; height: 112px; border-radius: 50%; border: 4px solid #fff; position: absolute; bottom: -56px; left: 1.2rem; background-size: cover; background-position: center; background-color: #c4ceda; }
.profile-meta { padding-top: 3.8rem; }
.tabs { display: flex; gap: .55rem; flex-wrap: wrap; margin: .7rem 0 1rem; }
.tab-btn { background: #eef2f7; border: 0; padding: .5rem .8rem; border-radius: 999px; cursor: pointer; }
.tab-btn.active { background: var(--primary); color: #fff; }
.chat-box { max-height: 360px; overflow-y: auto; padding: .8rem; background: #f9fbff; border: 1px solid var(--border); border-radius: 12px; }
.chat-compose { margin-top: .65rem; display: grid; gap: .45rem; }
.chat-picker-panel {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(2.35rem, 1fr));
    gap: .28rem;
    max-height: 190px;
    overflow-y: auto;
    padding: .55rem;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: #fff;
}
.chat-picker-panel[hidden] {
    display: none !important;
}
.chat-picker-cell {
    font-size: 1.35rem;
    line-height: 1;
    padding: .38rem;
    border: none;
    border-radius: 10px;
    background: #f1f4fb;
    cursor: pointer;
    transition: background .15s ease;
}
.chat-picker-cell:hover {
    background: #e3e9f7;
}
.chat-attachment-preview {
    font-size: .85rem;
    display: none;
    align-items: center;
    gap: .45rem;
    flex-wrap: wrap;
}
.chat-attachment-preview.is-visible {
    display: flex;
}
.chat-sticker {
    text-align: center;
    padding: .12rem 0 .08rem;
}
.chat-sticker-char {
    font-size: 2.85rem;
    line-height: 1;
    display: inline-block;
}
.inline { display: flex; gap: .6rem; align-items: center; }
.muted { color: var(--muted); font-size: .92rem; }
.card h1, .card h2, .card h3, .card h4, .card p, .muted { overflow-wrap: anywhere; word-break: break-word; }
.inline { flex-wrap: wrap; }
.dashboard-summary-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .8rem; margin-top: .8rem; }
.dashboard-summary-card { display: flex; gap: .8rem; align-items: center; padding: .85rem; border: 1px solid var(--border); border-radius: 10px; background: #f9fbff; }
.dashboard-summary-card-clickable { cursor: pointer; transition: transform .15s ease, box-shadow .15s ease; }
.dashboard-summary-card-clickable:hover { transform: translateY(-1px); box-shadow: 0 4px 12px rgba(11, 40, 70, .08); }
.dashboard-summary-icon { width: 38px; height: 38px; border-radius: 8px; background: #e6f5f2; color: var(--primary-dark); display: grid; place-items: center; font-size: 1rem; flex-shrink: 0; }
.dashboard-summary-label { margin: 0; color: var(--muted); font-size: .83rem; }
.dashboard-summary-value { margin: 0; font-size: 1.15rem; line-height: 1.2; }
.auth-modal-overlay { position: fixed; inset: 0; background: rgba(15, 23, 42, 0.55); z-index: 1200; display: grid; place-items: center; padding: 1rem; }
.auth-modal { width: min(540px, 96vw); position: relative; }
.auth-modal-close { position: absolute; right: .75rem; top: .4rem; border: 0; background: transparent; font-size: 1.5rem; cursor: pointer; color: var(--muted); }
.media-card img { width: 100%; height: 200px; object-fit: cover; border-radius: 10px; margin-bottom: .7rem; background: #eff3f7; }
.news-page-section {
    background: linear-gradient(180deg, #f8fafd 0%, #f2f6fb 100%);
}
.news-layout { display: grid; grid-template-columns: 1fr 320px; gap: 1rem; align-items: start; }
.news-main { display: grid; gap: 1rem; max-height: calc(100vh - 150px); overflow-y: auto; padding-right: .25rem; }
.news-side { display: grid; gap: 1rem; align-content: start; max-height: calc(100vh - 150px); overflow-y: auto; padding-right: .1rem; }
.news-main > .card,
.news-side > .card {
    border-radius: 16px;
    border: 1px solid #dbe4ef;
    box-shadow: 0 10px 24px rgba(16, 36, 51, .06);
}
.news-section-title {
    margin: 0 0 1rem;
    font-size: clamp(1.95rem, 3.1vw, 2.55rem);
    line-height: 1.15;
    font-family: "Playfair Display", "Times New Roman", serif;
    color: #102433;
    letter-spacing: .01em;
    position: relative;
    padding-bottom: .55rem;
}
.news-section-title::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 72px;
    height: 3px;
    border-radius: 6px;
    background: linear-gradient(90deg, #0f6c5d 0%, #6da88f 100%);
}
.news-feed-list { display: grid; gap: .75rem; }
.news-feed-item h4 {
    margin: 0 0 .45rem;
    color: #113f36;
    font-size: clamp(1.45rem, 2.1vw, 1.85rem);
    line-height: 1.25;
}
.news-feed-item p { margin: 0 0 .55rem; line-height: 1.6; }
.news-feed-item .news-read-toggle {
    margin-bottom: .5rem;
}
.news-slider {
    display: grid;
    gap: .65rem;
}
.news-slider-window {
    overflow: hidden;
}
.news-slider-track {
    display: flex;
    transition: transform .35s ease;
}
.news-slide {
    min-width: 100%;
}
.news-slider-controls {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .65rem;
}
.news-slider-controls .btn {
    border-radius: 999px;
    padding-inline: .95rem;
}
.news-section-banner {
    margin-bottom: .75rem;
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid #d8e2ec;
}
.news-section-banner img {
    width: 100%;
    height: 255px;
    object-fit: cover;
    display: block;
    background: #eef2f7;
}
.news-recent-item {
    border: 1px solid var(--border);
    border-radius: 10px;
    background: #f9fbff;
    padding: .6rem .7rem;
    margin-bottom: .55rem;
}
.news-recent-item h5 {
    margin: 0 0 .2rem;
    font-size: .95rem;
    color: #1f2937;
}
.news-recent-item p { margin: 0; }
.news-side .card h4 {
    margin: 0 0 .75rem;
    font-size: 1.25rem;
    color: #1f2937;
}
.news-side input {
    border-radius: 10px;
    background: #f9fbff;
}
.news-category-item {
    display: flex;
    align-items: center;
    gap: .65rem;
    border: 1px solid #dbe4ef;
    border-radius: 12px;
    background: #f9fbff;
    padding: .55rem .65rem;
    margin-bottom: .55rem;
}
.news-category-item .muted {
    margin: 0;
    display: flex;
    justify-content: space-between;
    width: 100%;
    font-size: .98rem;
    color: #4b5563;
}
.news-category-item strong {
    color: #113f36;
}
.news-category-thumb {
    width: 34px;
    height: 34px;
    border-radius: 10px;
    display: grid;
    place-items: center;
    background: linear-gradient(145deg, #e6f5f2 0%, #edf7f4 100%);
    color: #0f6c5d;
    border: 1px solid rgba(15, 108, 93, .22);
}
.news-category-thumb--articles {
    background: linear-gradient(145deg, #eef3ff 0%, #e8f0ff 100%);
    color: #2f5aa8;
    border-color: rgba(47, 90, 168, .22);
}
.news-category-thumb--scholarship {
    background: linear-gradient(145deg, #fff6e8 0%, #fff2de 100%);
    color: #b8860b;
    border-color: rgba(184, 134, 11, .24);
}
.user-message-btn {
    border-radius: 999px;
    padding: .35rem .72rem .35rem .38rem;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    font-size: .88rem;
    background: #ffffff;
    border: 1px solid #d9e3f1;
    color: #1f2d3d;
    box-shadow: 0 3px 8px rgba(16, 36, 51, .08);
    transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.user-message-btn-thumb {
    width: 24px;
    height: 24px;
    border-radius: 999px;
    display: grid;
    place-items: center;
    background: linear-gradient(135deg, #1877f2 0%, #8a3ab9 100%);
    color: #fff;
    font-size: .72rem;
    box-shadow: 0 4px 8px rgba(24, 119, 242, .24);
}
.user-message-btn:hover {
    border-color: #d9e3f1;
    background: #f8fbff;
    transform: translateY(-1px);
    box-shadow: 0 6px 12px rgba(16, 36, 51, .14);
}
.group-share-btn {
    width: fit-content;
    max-width: max-content;
    justify-self: start;
    align-self: start;
    border-radius: 999px;
    padding: .45rem .85rem;
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    background: #ffffff;
    color: #1f2d3d;
    border: 1px solid #d7e0ec;
    box-shadow: 0 3px 8px rgba(16, 36, 51, .1);
}
.group-share-btn:hover {
    background: #f7faff;
    color: #1f2d3d;
    border-color: #c7d6e8;
    box-shadow: 0 5px 11px rgba(16, 36, 51, .14);
}
.group-open-feed-thumb {
    width: 40px;
    height: 40px;
    padding: 0;
    border-radius: 12px;
    display: inline-grid;
    place-items: center;
    background: linear-gradient(145deg, #eef4ff 0%, #f4f8ff 100%);
    border-color: rgba(47, 90, 168, .3);
    color: #2f5aa8;
}
.group-open-feed-thumb:hover {
    background: linear-gradient(145deg, #e5eeff 0%, #edf3ff 100%);
    border-color: rgba(47, 90, 168, .45);
    color: #204a95;
}

/* Portal Groups: feed left, Create + Available stacked right with independent scroll */
.groups-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(280px, 400px);
    gap: 1rem;
    align-items: stretch;
    min-height: 0;
    min-width: 0;
}
.groups-feed-card {
    min-width: 0;
    display: flex;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
}
.groups-feed-shell {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 280px;
    min-width: 0;
    overflow: hidden;
}
.groups-feed-shell.is-feed-open {
    flex: 1 1 auto;
    min-height: 0;
    max-height: min(80vh, calc(100dvh - 150px));
}
.group-feed-conversations-state {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
    overflow: hidden;
}
/* Same as messages: author `display:flex` beats `[hidden]`, so hide via shell class */
.groups-feed-shell.is-feed-open #group-feed-conversations-state {
    display: none !important;
}
.group-feed-conversations-top {
    display: flex;
    align-items: center;
    margin-bottom: 0.75rem;
    flex-shrink: 0;
}
.group-feed-conversations-top h3 {
    margin: 0;
    color: #0f172a;
    font-size: 1.95rem;
}
.group-feed-conversations-search {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    background: #f8fafc;
    border: 1px solid #dbe3ee;
    border-radius: 999px;
    padding: 0.55rem 0.85rem;
    margin-bottom: 0.85rem;
    flex-shrink: 0;
}
.group-feed-conversations-search i {
    color: #64748b;
}
.group-feed-conversations-search input {
    border: 0;
    background: transparent;
    color: #0f172a;
    padding: 0;
    width: 100%;
}
.group-feed-conversations-search input::placeholder {
    color: #64748b;
}
.group-feed-conversations-search input:focus {
    outline: none;
}
.group-feed-inbox-list {
    flex: 1;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    padding-right: 0.25rem;
}
.group-feed-inbox-row {
    width: 100%;
    display: flex;
    gap: 0.7rem;
    align-items: center;
    border: 0;
    border-radius: 12px;
    background: transparent;
    color: var(--text);
    text-align: left;
    padding: 0.62rem 0.58rem;
    cursor: pointer;
    font: inherit;
}
.group-feed-inbox-row:hover,
.group-feed-inbox-row.is-active {
    background: #eaf6f4;
}
.group-feed-inbox-avatar {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    flex-shrink: 0;
    display: grid;
    place-items: center;
    background: linear-gradient(145deg, #e6f5f2 0%, #d8efe9 100%);
    color: #0f6c5d;
    font-size: 1.15rem;
}
.group-feed-inbox-body {
    min-width: 0;
    flex: 1;
}
.group-feed-inbox-top {
    display: flex;
    justify-content: space-between;
    gap: 0.45rem;
}
.group-feed-inbox-top strong {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 1.04rem;
}
.group-feed-inbox-preview {
    margin: 0.1rem 0 0;
    color: #64748b;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 0.92rem;
}
.group-feed-thread-active {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
}
.groups-feed-shell:not(.is-feed-open) #group-feed-thread-active {
    display: none !important;
}
.groups-feed-shell.is-feed-open #group-feed-thread-active {
    display: flex !important;
}
.group-feed-thread-header {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    border-bottom: 1px solid var(--border);
    padding-bottom: 0.55rem;
    margin-bottom: 0.5rem;
    flex-shrink: 0;
}
.group-feed-thread-back {
    display: inline-flex;
}
.group-feed-thread-avatar {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    flex-shrink: 0;
    display: grid;
    place-items: center;
    background: linear-gradient(145deg, #e6f5f2 0%, #c8e8df 100%);
    color: #0f6c5d;
    font-size: 0.95rem;
}
.group-feed-thread-header-text {
    min-width: 0;
}
.group-feed-thread-header-text strong {
    display: block;
    color: #0f172a;
    font-size: 1.05rem;
}
.group-feed-thread-header-text .muted {
    color: #64748b;
    font-size: 0.88rem;
}
/* Group + DM thread: scroll region fills space above sticky composer */
.group-feed-posts,
.chat-messages-thread {
    flex: 1 1 0;
    min-height: 0;
    max-height: none;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    margin-top: 0;
    padding: 0.65rem 0.5rem 0.85rem;
    background: linear-gradient(180deg, #e8e4df 0%, #ddd8d2 100%);
    border-radius: 12px;
    border: 1px solid rgba(0, 0, 0, 0.06);
    scrollbar-width: thin;
    scrollbar-color: rgba(0, 0, 0, 0.22) transparent;
}
.group-feed-posts::-webkit-scrollbar,
.chat-messages-thread::-webkit-scrollbar {
    width: 6px;
}
.group-feed-posts::-webkit-scrollbar-track,
.chat-messages-thread::-webkit-scrollbar-track {
    background: transparent;
}
.group-feed-posts::-webkit-scrollbar-thumb,
.chat-messages-thread::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.2);
    border-radius: 999px;
}
.group-feed-posts::-webkit-scrollbar-thumb:hover,
.chat-messages-thread::-webkit-scrollbar-thumb:hover {
    background: rgba(0, 0, 0, 0.32);
}
.group-feed-messages-empty {
    text-align: center;
    padding: 2rem 1rem;
    margin: 0;
    max-width: 18rem;
    margin-left: auto;
    margin-right: auto;
    background: rgba(255, 255, 255, 0.85);
    border-radius: 14px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
}
/* Messenger rows */
.messenger-thread-pane .gc-msg {
    display: flex;
    width: 100%;
    margin-bottom: 0.35rem;
}
.messenger-thread-pane .gc-msg--theirs {
    justify-content: flex-start;
}
.messenger-thread-pane .gc-msg--mine {
    justify-content: flex-end;
}
.messenger-thread-pane .gc-msg__col {
    max-width: min(88%, 400px);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.2rem;
}
.messenger-thread-pane .gc-msg--mine .gc-msg__col {
    align-items: flex-end;
}
.messenger-thread-pane .gc-msg__meta {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 0.2rem 0.35rem;
    font-size: 0.68rem;
    line-height: 1.25;
    color: #5c6670;
    padding: 0 0.35rem;
    max-width: 100%;
}
.messenger-thread-pane .gc-msg__meta--mine {
    justify-content: flex-end;
}
.messenger-thread-pane .gc-msg__author {
    font-weight: 600;
    color: #3d4f5f;
}
.messenger-thread-pane .gc-msg__dot {
    opacity: 0.55;
    user-select: none;
}
.messenger-thread-pane .gc-msg__time {
    color: #6b7780;
    white-space: nowrap;
}
.messenger-thread-pane .gc-msg__bubble {
    padding: 0.5rem 0.7rem 0.55rem;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.06);
}
.messenger-thread-pane .gc-msg__bubble--theirs {
    background: #f3f4f6;
    color: #111827;
    border-radius: 18px 18px 18px 5px;
    border: 1px solid rgba(0, 0, 0, 0.05);
}
.messenger-thread-pane .gc-msg__bubble--mine {
    background: linear-gradient(180deg, rgba(15, 108, 93, 0.14) 0%, rgba(15, 108, 93, 0.1) 100%);
    border: 1px solid rgba(15, 108, 93, 0.22);
    color: #0f172a;
    border-radius: 18px 18px 5px 18px;
}
.messenger-thread-pane .gc-msg__quote {
    font-size: 0.72rem;
    line-height: 1.3;
    color: #5c6570;
    background: rgba(0, 0, 0, 0.06);
    border-left: 2px solid rgba(15, 108, 93, 0.4);
    padding: 0.22rem 0.38rem 0.22rem 0.42rem;
    margin: 0 0 0.32rem 0;
    border-radius: 6px;
}
.messenger-thread-pane .gc-msg__bubble--mine .gc-msg__quote {
    background: rgba(255, 255, 255, 0.5);
    border-left-color: var(--primary);
}
.messenger-thread-pane .gc-msg__quote-author {
    display: block;
    font-weight: 700;
    font-size: 0.65rem;
    color: var(--primary-dark);
    margin-bottom: 0.06rem;
}
.messenger-thread-pane .gc-msg__quote-text {
    display: block;
    opacity: 0.88;
}
.messenger-thread-pane .gc-msg__attach-wrap {
    display: block;
    margin: 0 0 0.35rem 0;
    border-radius: 10px;
    overflow: hidden;
    max-width: 100%;
}
.messenger-thread-pane .gc-msg__attach-img {
    display: block;
    max-width: 100%;
    max-height: 220px;
    width: auto;
    height: auto;
    object-fit: contain;
}
.messenger-thread-pane .gc-msg__attach-doc {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--primary-dark);
    text-decoration: none;
    margin-bottom: 0.25rem;
}
.messenger-thread-pane .gc-msg__attach-doc:hover {
    text-decoration: underline;
}
.messenger-thread-pane .gc-msg__text {
    margin: 0;
    font-size: 0.92rem;
    line-height: 1.4;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    word-break: break-word;
}
.messenger-thread-pane .gc-msg__reply {
    border: 0;
    background: none;
    padding: 0.1rem 0.35rem 0;
    margin: 0;
    font: inherit;
    font-size: 0.7rem;
    font-weight: 600;
    color: var(--primary);
    cursor: pointer;
    text-align: inherit;
}
.messenger-thread-pane .gc-msg--mine .gc-msg__reply {
    text-align: right;
}
.messenger-thread-pane .gc-msg__reply:hover {
    text-decoration: underline;
}
.group-feed-replying-indicator {
    flex-shrink: 0;
    margin-top: 0.35rem;
}
/* Sticky composer: always visible at bottom of chat pane */
.group-feed-compose {
    flex-shrink: 0;
    margin-top: auto;
    padding-top: 0.55rem;
    border-top: 1px solid var(--border);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #fff 12%);
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}
.group-compose-attachment-preview {
    font-size: 0.8rem;
    display: none;
    align-items: center;
    gap: 0.45rem;
    flex-wrap: wrap;
    padding: 0.25rem 0;
}
.group-compose-attachment-preview.is-visible {
    display: flex;
}
.group-feed-compose-bar {
    position: relative;
    display: flex;
    align-items: flex-end;
    gap: 0.35rem;
    padding: 0.35rem 0.45rem;
    background: #f1f5f4;
    border: 1px solid #d8e3df;
    border-radius: 999px;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.65);
}
.group-compose-icon-btn {
    flex-shrink: 0;
    width: 38px;
    height: 38px;
    border: 0;
    border-radius: 50%;
    background: transparent;
    color: #4a5d56;
    cursor: pointer;
    display: grid;
    place-items: center;
    font-size: 1.05rem;
    transition: background 0.15s ease, color 0.15s ease;
}
.group-compose-icon-btn:hover {
    background: rgba(15, 108, 93, 0.1);
    color: var(--primary-dark);
}
.group-feed-compose-input-wrap {
    flex: 1;
    min-width: 0;
    display: flex;
    align-items: center;
    padding: 0.15rem 0;
}
.group-feed-compose-input {
    width: 100%;
    margin: 0;
    border: 0;
    background: transparent;
    resize: none;
    min-height: 22px;
    max-height: 120px;
    line-height: 1.45;
    font: inherit;
    font-size: 0.95rem;
    padding: 0.35rem 0.25rem;
    overflow-y: auto;
}
.group-feed-compose-input:focus {
    outline: none;
}
.group-compose-send-btn {
    flex-shrink: 0;
    width: 42px;
    height: 42px;
    border: 0;
    border-radius: 50%;
    background: var(--primary);
    color: #fff;
    cursor: pointer;
    display: grid;
    place-items: center;
    font-size: 1rem;
    box-shadow: 0 2px 8px rgba(15, 108, 93, 0.35);
    transition: transform 0.12s ease, background 0.15s ease;
}
.group-compose-send-btn:hover {
    background: var(--primary-dark);
    transform: scale(1.04);
}
.group-compose-send-btn:active {
    transform: scale(0.96);
}
.group-compose-emoji-panel {
    position: absolute;
    bottom: calc(100% + 6px);
    left: 0;
    right: 0;
    max-height: 200px;
    z-index: 5;
    box-shadow: 0 -4px 24px rgba(15, 23, 42, 0.12);
}
.groups-right-column {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    min-width: 0;
    min-height: 0;
}
.groups-panel {
    display: flex;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
    margin: 0;
}
.groups-panel--create {
    flex: 0 1 auto;
    max-height: 50%;
    min-height: 0;
}
.groups-panel--list {
    flex: 1 1 0;
    min-height: 8rem;
}
.groups-panel h3 {
    margin-top: 0;
}
.groups-panel-scroll {
    flex: 1 1 auto;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    padding-right: 0.15rem;
}
@media (max-width: 960px) {
    .groups-layout {
        grid-template-columns: 1fr;
    }
    .groups-layout:has(.groups-feed-shell.is-feed-open) .groups-right-column {
        display: none;
    }
    .groups-right-column {
        flex: none;
    }
    .groups-panel {
        flex: 0 1 auto;
    }
    .groups-panel--create {
        max-height: none;
    }
    .groups-panel--list {
        flex: 0 1 auto;
        min-height: 0;
    }
    .groups-panel-scroll {
        max-height: min(22rem, 52vh);
    }
}

/* Messages page — viewport height, independent pane scroll, no document scroll */
body.is-portal-messages {
    height: 100vh;
    height: 100dvh;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}
body.is-portal-messages .site-footer,
body.is-portal-messages #back-to-top {
    display: none !important;
}
body.is-portal-messages > main {
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}
/* Messages page — inner panes scroll; portal main does not */
.section.container.portal-layout:has(.messages-portal-main) {
    /* Avoid stacking .section + .portal-layout padding past the viewport */
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    flex: 1 1 auto;
    min-height: 0;
    box-sizing: border-box;
    overflow: hidden;
}
.portal-layout:has(.messages-portal-main) {
    align-items: stretch;
    align-content: stretch;
    box-sizing: border-box;
    flex: 1 1 auto;
    min-height: 0;
    height: 100%;
    max-height: 100%;
    padding: 0;
    overflow: hidden;
    /* minmax(0, 1fr) lets columns shrink so nested panes scroll instead of growing the page */
    grid-template-columns: minmax(0, 260px) minmax(0, 1fr);
    grid-template-rows: minmax(0, 1fr);
}
.portal-layout:has(.messages-portal-main) .portal-sidebar {
    position: static;
    align-self: stretch;
    height: 100%;
    max-height: 100%;
    min-height: 0;
    min-width: 0;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    scrollbar-color: rgba(0, 0, 0, 0.22) transparent;
}
.portal-layout:has(.messages-portal-main) .portal-sidebar::-webkit-scrollbar {
    width: 6px;
}
.portal-layout:has(.messages-portal-main) .portal-sidebar::-webkit-scrollbar-track {
    background: transparent;
}
.portal-layout:has(.messages-portal-main) .portal-sidebar::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.2);
    border-radius: 999px;
}
.portal-layout:has(.messages-portal-main) .portal-sidebar::-webkit-scrollbar-thumb:hover {
    background: rgba(0, 0, 0, 0.32);
}
.portal-main.messages-portal-main {
    overflow: hidden;
    min-height: 0;
    min-width: 0;
    width: 100%;
    max-width: 100%;
    align-self: stretch;
    height: 100%;
    max-height: 100%;
    display: flex;
    flex-direction: column;
}
.messages-portal-main { min-height: 0; }
.messages-shell {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 1rem;
    flex: 1 1 0;
    min-height: 0;
    min-width: 0;
    width: 100%;
    max-height: 100%;
    overflow: hidden;
    align-items: stretch;
}
/* Grid items default to min-height:auto which blocks child overflow scrolling */
.messages-shell > .messages-users-pane,
.messages-shell > .messages-thread-pane.messenger-pane {
    min-height: 0;
    min-width: 0;
    height: 100%;
    max-height: 100%;
    align-self: stretch;
}
.messages-users-pane {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-width: 0;
}
.messages-thread-pane.messenger-pane {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-width: 0;
}
.messages-users-title { margin: 0; flex-shrink: 0; }
.messages-users-caption { margin: .3rem 0 .8rem; flex-shrink: 0; }
.messages-users-pane #user-search {
    flex-shrink: 0;
}
.messages-search-results {
    margin-top: .65rem;
    flex: 1 1 auto;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    scrollbar-color: rgba(0, 0, 0, 0.22) transparent;
}
.messages-search-results::-webkit-scrollbar {
    width: 6px;
}
.messages-search-results::-webkit-scrollbar-track {
    background: transparent;
}
.messages-search-results::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.2);
    border-radius: 999px;
}
.messages-user-row {
    display: grid;
    grid-template-columns: 48px 1fr auto;
    gap: .65rem;
    align-items: center;
    padding: .6rem 0;
    border-bottom: 1px solid var(--border);
}
.messages-user-row:last-child { border-bottom: 0; }
.messages-user-avatar {
    border-radius: 50%;
    object-fit: cover;
    background: #e8ecf1;
}
.messages-user-main { min-width: 0; }
.messages-user-main strong {
    display: block;
    font-size: .95rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.messages-user-actions {
    display: flex;
    gap: .4rem;
    align-items: center;
}

.messenger-pane {
    background: #ffffff;
    color: var(--text);
    border: 1px solid var(--border);
}
.chat-conversations-state {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
    overflow: hidden;
}
.messages-shell.is-thread-open #chat-conversations-state {
    display: none;
}
.chat-conversations-top,
.chat-conversations-search {
    flex-shrink: 0;
}
.chat-conversations-top {
    display: flex;
    align-items: center;
    margin-bottom: .75rem;
}
.chat-conversations-top h3 {
    margin: 0;
    color: #0f172a;
    font-size: 1.95rem;
}
.chat-conversations-search {
    display: flex;
    align-items: center;
    gap: .5rem;
    background: #f8fafc;
    border: 1px solid #dbe3ee;
    border-radius: 999px;
    padding: .55rem .85rem;
    margin-bottom: .85rem;
}
.chat-conversations-search i { color: #64748b; }
.chat-conversations-search input {
    border: 0;
    background: transparent;
    color: #0f172a;
    padding: 0;
}
.chat-conversations-search input::placeholder { color: #64748b; }
.chat-conversations-search input:focus { outline: none; }

.chat-inbox-list {
    flex: 1;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    padding-right: .25rem;
    max-height: none;
    scrollbar-width: thin;
    scrollbar-color: rgba(0, 0, 0, 0.22) transparent;
}
.chat-inbox-list::-webkit-scrollbar {
    width: 6px;
}
.chat-inbox-list::-webkit-scrollbar-track {
    background: transparent;
}
.chat-inbox-list::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.2);
    border-radius: 999px;
}
.chat-inbox-row {
    width: 100%;
    display: flex;
    gap: .7rem;
    align-items: center;
    border: 0;
    border-radius: 12px;
    background: transparent;
    color: var(--text);
    text-align: left;
    padding: .62rem .58rem;
    cursor: pointer;
}
.chat-inbox-row:hover,
.chat-inbox-row.is-active { background: #eaf6f4; }
.chat-inbox-avatar {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0;
}
.chat-inbox-body { min-width: 0; flex: 1; }
.chat-inbox-top { display: flex; justify-content: space-between; gap: .45rem; }
.chat-inbox-top strong {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 1.04rem;
}
.chat-inbox-preview {
    margin: .1rem 0 0;
    color: #64748b;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.chat-inbox-you { color: #334155; font-weight: 600; }
.chat-inbox-badge {
    background: var(--primary);
    color: #fff;
    font-size: .72rem;
    border-radius: 999px;
    padding: .08rem .42rem;
}

.chat-thread-active {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
    overflow: hidden;
}
.messages-shell:not(.is-thread-open) #chat-thread-active {
    display: none !important;
}
.messages-shell.is-thread-open #chat-thread-active {
    display: flex !important;
}
.chat-thread-header {
    display: flex;
    align-items: center;
    gap: .55rem;
    border-bottom: 1px solid var(--border);
    padding-bottom: .55rem;
    margin-bottom: 0.5rem;
    flex-shrink: 0;
}
.chat-thread-back { display: inline-flex; }
.chat-thread-avatar { border-radius: 50%; object-fit: cover; background: #334155; }
.chat-thread-header-text strong { color: #0f172a; }
.chat-thread-header-text .muted { color: #64748b; }

.chat-thread-hero {
    text-align: center;
    padding: 1rem .5rem .8rem;
    flex-shrink: 0;
}
.chat-thread-hero-avatar {
    width: 108px;
    height: 108px;
    border-radius: 50%;
    object-fit: cover;
    background: #334155;
}
.chat-thread-hero h4 {
    margin: .75rem 0 .15rem;
    font-size: 1.9rem;
    color: #0f172a;
}
.chat-thread-hero .muted {
    color: #64748b;
    margin: 0;
}

.chat-replying-indicator {
    color: #64748b;
    flex-shrink: 0;
}
.messenger-pane .chat-compose {
    flex-shrink: 0;
}
.messenger-thread-pane .gc-msg__bubble .chat-sticker {
    margin: 0;
    padding: 0;
}

@media (max-width: 980px) {
    .portal-main.messages-portal-main {
        height: 100%;
        max-height: 100%;
        overflow: hidden;
    }
    .messages-shell {
        grid-template-columns: 1fr;
        flex: 1;
        min-height: 0;
        max-height: 100%;
    }
    .messages-users-pane { display: none; }
    .messages-thread-pane.messenger-pane {
        max-height: 100%;
        min-height: 0;
    }
    /* Inbox + thread live inside .messages-thread-pane; do not hide the whole pane on mobile. */
    .messages-shell.is-thread-open .messages-users-pane { display: none; }
}
@media (max-width: 1023px) {
    body.is-portal-messages .portal-layout:has(.messages-portal-main) .portal-sidebar {
        display: none !important;
    }
}
.impact-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; align-items: start; }
.impact-past-section {
    background: linear-gradient(180deg, #f3f7fb 0%, #edf3f9 100%);
}
.impact-past-head {
    text-align: center;
    margin-bottom: 1.2rem;
}
.impact-past-head p {
    margin: 0;
    color: #0f6c5d;
    font-size: .78rem;
    letter-spacing: 3px;
    font-weight: 700;
}
.impact-past-head h2 {
    margin: .3rem 0 0;
    font-size: clamp(1.6rem, 3.3vw, 2.35rem);
    color: #102433;
    font-family: "Playfair Display", "Times New Roman", serif;
}

/* Reports page — live site content, ADF layout */
.reports-page {
    padding-bottom: 2.5rem;
    overflow-x: hidden;
}
.reports-page .reports-intro-shell.impact-intro-card {
    max-width: 100%;
    padding: clamp(1.35rem, 2.8vw, 2.1rem) clamp(1rem, 2.5vw, 1.85rem) clamp(1.15rem, 2vw, 1.5rem);
    background: linear-gradient(165deg, #ffffff 0%, #f6f9fd 42%, #eef4fb 100%);
    border: 1px solid rgba(15, 108, 93, 0.14);
    box-shadow:
        0 1px 2px rgba(15, 23, 42, 0.04),
        0 20px 50px -18px rgba(15, 108, 93, 0.14);
}
.reports-intro-shell--header-only .reports-intro-header {
    margin-bottom: 0;
}
.reports-intro-slider-bleed + .container {
    margin-top: 1.75rem;
}
.reports-intro-slider-bleed {
    width: 100vw;
    max-width: 100%;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    padding: 0 clamp(0.65rem, 2.5vw, 1.5rem);
    box-sizing: border-box;
    margin-top: 0.35rem;
    margin-bottom: 0.15rem;
}
.reports-intro-header {
    text-align: center;
    margin-bottom: 1.15rem;
}
.reports-intro-header .impact-intro-title {
    margin-bottom: 0;
}
.reports-intro-slider {
    position: relative;
    margin-top: 0;
    padding: 3px;
    border-radius: 18px;
    background: linear-gradient(
        135deg,
        rgba(15, 108, 93, 0.52) 0%,
        rgba(215, 179, 67, 0.4) 48%,
        rgba(11, 83, 72, 0.5) 100%
    );
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.28),
        0 12px 36px rgba(8, 45, 42, 0.16);
}
.reports-intro-viewport {
    overflow: hidden;
    border-radius: 15px;
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, 0.1),
        0 2px 20px rgba(0, 0, 0, 0.12);
}
.reports-intro-track {
    display: flex;
    transition: transform 0.5s cubic-bezier(0.33, 1, 0.68, 1);
    will-change: transform;
}
.reports-intro-slide {
    position: relative;
    flex: 0 0 100%;
    min-height: clamp(168px, 22vw, 236px);
    width: 100%;
    box-sizing: border-box;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: clamp(0.4rem, 1.6vw, 0.75rem) clamp(0.45rem, 1.8vw, 0.95rem);
    border-radius: 14px;
    isolation: isolate;
}
.reports-intro-slide::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    opacity: 0.2;
    background: linear-gradient(
        118deg,
        transparent 38%,
        rgba(255, 255, 255, 0.2) 50%,
        transparent 62%
    );
    pointer-events: none;
    z-index: 0;
}
.reports-intro-slide::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.07);
    pointer-events: none;
    z-index: 0;
}
.reports-intro-slide--theme-1 {
    background:
        radial-gradient(120% 100% at 12% 0%, rgba(232, 200, 90, 0.26) 0%, transparent 50%),
        linear-gradient(158deg, #0f564c 0%, #0a3d37 50%, #061f1c 100%);
}
.reports-intro-slide--theme-2 {
    background:
        radial-gradient(100% 92% at 88% 8%, rgba(109, 168, 143, 0.28) 0%, transparent 50%),
        linear-gradient(168deg, #0d453e 0%, #135a4e 52%, #082824 100%);
}
.reports-intro-slide--theme-3 {
    background:
        radial-gradient(95% 88% at 50% -6%, rgba(242, 201, 76, 0.28) 0%, transparent 44%),
        linear-gradient(142deg, #104a42 0%, #0b342f 48%, #061a18 100%);
}
.reports-intro-slide-frame {
    position: relative;
    z-index: 1;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    max-width: min(54rem, 92vw);
    margin: 0 auto;
    padding: clamp(0.85rem, 2vw, 1.35rem) clamp(1rem, 2.5vw, 1.75rem);
    border-radius: 22px;
    background: rgba(255, 255, 255, 0.07);
    border: 1px solid rgba(248, 244, 235, 0.38);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow:
        0 12px 40px rgba(0, 0, 0, 0.28),
        inset 0 1px 0 rgba(255, 255, 255, 0.1);
}
.reports-intro-slide-text {
    margin: 0;
    max-width: min(46rem, 86vw);
    color: #f8f4eb;
    font-size: clamp(1.02rem, 2vw, 1.22rem);
    line-height: 1.68;
    text-align: center;
    font-weight: 500;
    letter-spacing: 0.01em;
    text-shadow:
        0 0 14px rgba(242, 201, 76, 0.2),
        0 2px 8px rgba(0, 0, 0, 0.35);
    box-sizing: border-box;
}
.reports-intro-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 3;
    width: 44px;
    height: 44px;
    border: 1px solid rgba(255, 255, 255, 0.35);
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.14);
    color: #fff;
    display: grid;
    place-items: center;
    cursor: pointer;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.2);
    transition: background 0.2s ease, transform 0.2s ease, border-color 0.2s ease;
}
.reports-intro-nav:hover {
    background: rgba(215, 179, 67, 0.35);
    border-color: rgba(242, 201, 76, 0.65);
    color: #fffbea;
}
.reports-intro-nav:focus-visible {
    outline: 2px solid #e8c85a;
    outline-offset: 3px;
}
.reports-intro-prev {
    left: clamp(0.55rem, 2.5vw, 1.15rem);
}
.reports-intro-next {
    right: clamp(0.55rem, 2.5vw, 1.15rem);
}
.reports-intro-dots {
    position: absolute;
    bottom: clamp(0.55rem, 2vw, 0.95rem);
    left: 50%;
    transform: translateX(-50%);
    z-index: 3;
    display: flex;
    gap: 0.5rem;
    padding: 0.35rem 0.55rem;
    border-radius: 999px;
    background: rgba(8, 28, 26, 0.4);
    border: 1px solid rgba(255, 255, 255, 0.14);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}
.reports-intro-dot {
    width: 9px;
    height: 9px;
    padding: 0;
    border: 0;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.35);
    cursor: pointer;
    transition: width 0.25s ease, background 0.2s ease, opacity 0.2s ease;
}
.reports-intro-dot.is-active {
    width: 26px;
    border-radius: 999px;
    background: linear-gradient(90deg, #e8c85a, #f2e6bc);
    box-shadow: 0 0 12px rgba(242, 201, 76, 0.45);
}
.reports-intro-dot:hover:not(.is-active) {
    background: rgba(255, 255, 255, 0.55);
}
.reports-intro-dot:focus-visible {
    outline: 2px solid #e8c85a;
    outline-offset: 2px;
}
@media (prefers-reduced-motion: reduce) {
    .reports-intro-track {
        transition: none;
    }
}
.reports-strategic-panel {
    margin-top: 0.25rem;
    padding: clamp(1.75rem, 3.5vw, 2.5rem) clamp(1.25rem, 3vw, 2rem);
    border-radius: 22px;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.95) 0%, rgba(246, 250, 252, 0.98) 45%, rgba(237, 244, 250, 1) 100%);
    border: 1px solid rgba(15, 108, 93, 0.1);
    box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.85) inset,
        0 18px 48px -20px rgba(15, 108, 93, 0.12),
        0 8px 24px rgba(16, 36, 51, 0.06);
}
.reports-academic-panel {
    margin-top: 2.25rem;
    padding: clamp(1.85rem, 3.6vw, 2.65rem) clamp(1.25rem, 3vw, 2rem) clamp(2rem, 3.5vw, 2.5rem);
    border-radius: 22px;
    background: linear-gradient(160deg, #0c3d36 0%, #0f4a41 38%, #0a322d 100%);
    border: 1px solid rgba(215, 179, 67, 0.22);
    box-shadow:
        0 0 0 1px rgba(255, 255, 255, 0.06) inset,
        0 24px 56px -18px rgba(4, 24, 21, 0.55);
    color: #e8f4f1;
}
.reports-strategic-head,
.reports-academic-head {
    text-align: center;
    max-width: 40rem;
    margin: 0 auto 1.5rem;
}
.reports-academic-head {
    margin-bottom: 1rem;
}
.reports-panel-badge {
    display: inline-block;
    margin: 0 0 0.5rem;
    padding: 0.35rem 0.9rem;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: #0f6c5d;
    background: rgba(15, 108, 93, 0.1);
    border: 1px solid rgba(15, 108, 93, 0.18);
    border-radius: 999px;
}
.reports-panel-badge--light {
    color: #f2e6bc;
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(242, 201, 76, 0.35);
}
.reports-panel-title {
    margin: 0;
    font-family: "Playfair Display", "Times New Roman", serif;
    font-size: clamp(1.75rem, 3.2vw, 2.35rem);
    font-weight: 700;
    color: #102433;
    line-height: 1.15;
}
.reports-panel-title--light {
    color: #faf8f3;
    text-shadow: 0 2px 20px rgba(0, 0, 0, 0.2);
}
.reports-strategic-tagline {
    margin: 0.65rem 0 0;
    font-size: clamp(1rem, 1.9vw, 1.15rem);
    font-weight: 500;
    color: #475569;
    letter-spacing: 0.02em;
}
.reports-pillars--modern {
    gap: clamp(1rem, 2vw, 1.35rem);
    margin-bottom: 0;
}
.reports-pillar-card--modern {
    position: relative;
    margin: 0;
    padding: 1.35rem 1.4rem 1.45rem 1.35rem;
    border-radius: 16px;
    background: #fff;
    border: 1px solid rgba(148, 163, 184, 0.22);
    box-shadow: 0 4px 16px rgba(15, 23, 42, 0.05);
    overflow: hidden;
    transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
}
.reports-pillar-card--modern::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    border-radius: 4px 0 0 4px;
    background: linear-gradient(180deg, #e8c85a, #0f6c5d);
}
.reports-pillar-card--modern:hover {
    transform: translateY(-3px);
    box-shadow: 0 14px 36px rgba(15, 108, 93, 0.12);
    border-color: rgba(15, 108, 93, 0.2);
}
.reports-pillar-card-top {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    margin-bottom: 0.65rem;
}
.reports-pillar-step-ring {
    flex-shrink: 0;
    display: grid;
    place-items: center;
    width: 2.65rem;
    height: 2.65rem;
    border-radius: 50%;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    color: #0f6c5d;
    background: linear-gradient(145deg, #f0fdf9, #e0f2ec);
    border: 1px solid rgba(15, 108, 93, 0.2);
    box-shadow: 0 2px 8px rgba(15, 108, 93, 0.08);
}
.reports-pillar-card--modern h3 {
    margin: 0;
    font-size: 1.12rem;
    color: #102433;
    line-height: 1.25;
}
.reports-pillar-card--modern p {
    margin: 0;
    color: #475569;
    font-size: 0.96rem;
    line-height: 1.65;
}
.reports-academic-lead {
    margin: 0 auto 1.5rem;
    max-width: 46rem;
    text-align: center;
    font-size: clamp(0.98rem, 1.5vw, 1.08rem);
    line-height: 1.68;
    color: rgba(232, 244, 241, 0.88);
}
.reports-academic-grid {
    gap: clamp(1rem, 2vw, 1.35rem);
    align-items: stretch;
}
.reports-academic-card {
    margin: 0;
    padding: 1.45rem 1.35rem 1.5rem;
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.07);
    border: 1px solid rgba(255, 255, 255, 0.12);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.15);
    transition: background 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}
.reports-academic-card:hover {
    background: rgba(255, 255, 255, 0.11);
    border-color: rgba(242, 201, 76, 0.28);
    transform: translateY(-2px);
}
.reports-academic-icon {
    width: 3rem;
    height: 3rem;
    margin: 0 auto 1rem;
    display: grid;
    place-items: center;
    border-radius: 14px;
    font-size: 1.2rem;
    color: #0c3d36;
    background: linear-gradient(145deg, #f2e6bc, #e8c85a);
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.2);
}
.reports-academic-card h3 {
    margin: 0 0 0.55rem;
    text-align: center;
    font-size: 1.08rem;
    font-weight: 700;
    color: #faf8f3;
}
.reports-academic-card p {
    margin: 0;
    text-align: center;
    font-size: 0.94rem;
    line-height: 1.65;
    color: rgba(232, 244, 241, 0.86);
}
.reports-cta {
    margin-top: 2rem;
    text-align: center;
    font-size: 0.95rem;
}
.impact-card {
    border-radius: 16px;
    border: 1px solid #d9e4ef;
    box-shadow: 0 10px 24px rgba(16, 36, 51, .08);
    transition: transform .2s ease, box-shadow .2s ease;
    background: #fff;
}
.impact-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 30px rgba(16, 36, 51, .12);
}
.impact-card img {
    width: 100%;
    height: 320px;
    object-fit: cover;
    object-position: center top;
    border-radius: 10px;
    margin-bottom: .75rem;
    background: #f1f5f9;
}
.impact-card h3 { margin: .2rem 0; }
.impact-quote {
    font-style: italic;
    color: #2a3342;
    line-height: 1.65;
    position: relative;
}
.impact-card .muted {
    display: inline-block;
    padding: .2rem .55rem;
    border-radius: 999px;
    background: #ebf5f3;
    color: #0f6c5d;
    font-weight: 600;
    margin-bottom: .25rem;
}
.impact-quote-collapsed {
    display: -webkit-box;
    -webkit-line-clamp: 5;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.impact-showcase-head {
    text-align: center;
    margin-bottom: 1rem;
}
.impact-intro-section {
    padding-top: 2.2rem;
    padding-bottom: 1.3rem;
    background: linear-gradient(180deg, #f6f9fd 0%, #eef4fb 100%);
}
.impact-intro-card {
    max-width: 900px;
    margin: 0 auto;
    text-align: center;
    padding: clamp(1.4rem, 2.6vw, 2.2rem) clamp(1rem, 3.2vw, 2.2rem);
    background: #ffffff;
    border: 1px solid #dbe5f0;
    border-radius: 18px;
    box-shadow: 0 14px 34px rgba(16, 36, 51, 0.08);
}
.impact-intro-kicker {
    margin: 0;
    color: #0f6c5d;
    font-size: .8rem;
    font-weight: 700;
    letter-spacing: .17em;
    text-transform: uppercase;
}
.impact-intro-title {
    margin: .45rem 0 .7rem;
    color: #102433;
    font-size: clamp(1.8rem, 3.5vw, 2.8rem);
    line-height: 1.15;
    font-family: "Playfair Display", "Times New Roman", serif;
}
.impact-intro-text {
    margin: 0 auto;
    max-width: 68ch;
    color: #425466;
    font-size: clamp(1rem, 1.3vw, 1.12rem);
    line-height: 1.7;
}
.impact-showcase {
    background: linear-gradient(180deg, #0b3f39 0%, #0e4d44 42%, #0b3f39 100%);
}
.impact-showcase-head p {
    margin: 0;
    color: #d7b343;
    letter-spacing: 4px;
    font-size: .78rem;
    font-weight: 700;
}
.impact-showcase-head h2 {
    margin: .3rem 0 .5rem;
    color: #f3f5f6;
    font-size: clamp(2rem, 3.5vw, 3rem);
    font-family: "Playfair Display", "Times New Roman", serif;
}
.impact-showcase-line {
    display: inline-block;
    width: 64px;
    height: 3px;
    border-radius: 4px;
    background: #d7b343;
}
.impact-slider {
    position: relative;
    padding: 1.2rem 3rem 3rem;
    border-radius: 16px;
    background: radial-gradient(circle at 20% 0%, #0f5a4f 0%, #0a3f39 55%, #082d2a 100%);
    border: 1px solid rgba(215, 179, 67, 0.65);
    box-shadow: 0 12px 30px rgba(8, 45, 42, 0.35);
}
.impact-slider-window { overflow: hidden; border-radius: 12px; }
.impact-slider-track {
    display: flex;
    transition: transform .45s ease;
    will-change: transform;
}
.impact-slide {
    min-width: 100%;
    display: grid;
    grid-template-columns: 160px 1fr;
    gap: 1.1rem;
    align-items: center;
}
.impact-slide img {
    width: 140px;
    height: 140px;
    object-fit: cover;
    object-position: center 18%;
    border-radius: 50%;
    border: 4px solid #d7b343;
    box-shadow: 0 0 0 6px rgba(215, 179, 67, 0.15);
    margin-inline: auto;
}
.impact-slide h3 {
    margin: 0 0 .35rem;
    color: #f2f5f4;
}
.impact-slide .impact-quote {
    color: #eef4f2;
    font-size: 1.05rem;
    line-height: 1.6;
}
.impact-slider-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 38px;
    height: 38px;
    border-radius: 999px;
    border: 0;
    background: #d7b343;
    color: #102a27;
    display: grid;
    place-items: center;
    cursor: pointer;
    box-shadow: 0 6px 14px rgba(15, 108, 93, 0.25);
}
.impact-slider-prev { left: .8rem; }
.impact-slider-next { right: .8rem; }
.impact-slider-dots {
    position: absolute;
    bottom: .9rem;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: .45rem;
}
.impact-dot {
    width: 10px;
    height: 10px;
    border-radius: 999px;
    border: 0;
    background: #c8d1df;
    cursor: pointer;
}
.impact-dot.active { background: #0f6c5d; }
.impact-read-toggle {
    margin-top: .2rem;
    border-radius: 999px;
    border-color: #0f6c5d;
    color: #0f6c5d;
    background: #f4fbf9;
    font-weight: 600;
}
.impact-read-toggle:hover {
    background: #0f6c5d;
    color: #fff;
}
.about-story-grid {
    display: grid;
    grid-template-columns: 390px 1fr;
    gap: 1.2rem;
    align-items: stretch;
}
.about-photo-card {
    background: #fff;
    border-radius: 14px;
    border: 1px solid #dce4ec;
    padding: .45rem;
    box-shadow: 0 8px 22px rgba(16, 36, 51, .08);
}
.about-photo-card img {
    width: 100%;
    height: 100%;
    min-height: 680px;
    object-fit: cover;
    object-position: center 15%;
    border-radius: 10px;
}
.about-story-card {
    background: #f6f8fa;
    border: 1px solid #e3e9ef;
    border-radius: 16px;
    padding: 1.2rem 1.3rem;
}
.about-kicker {
    margin: 0;
    color: #4a7d5f;
    letter-spacing: 2px;
    font-size: .72rem;
    font-weight: 700;
}
.about-story-card h1 {
    margin: .4rem 0 .7rem;
    font-family: "Playfair Display", "Times New Roman", serif;
    color: #163f35;
    font-size: clamp(1.8rem, 3.4vw, 2.9rem);
    line-height: 1.12;
}
.about-story-columns {
    columns: 2;
    column-gap: 1.3rem;
}
.about-story-columns p {
    margin: 0 0 .8rem;
    color: #425466;
    break-inside: avoid;
}
.about-story-card blockquote {
    margin: .65rem 0 0;
    padding-left: .8rem;
    border-left: 3px solid #8cae9c;
    color: #4a7d5f;
    font-style: italic;
}
.about-biography-section {
    background: linear-gradient(180deg, #f9fbfd 0%, #f2f6fb 100%);
}
.about-biography-section .container { max-width: 1100px; }
.about-bio-head h2 {
    margin: 0;
    font-size: clamp(2.2rem, 4vw, 3.3rem);
    letter-spacing: 1px;
    color: #1a2d3f;
    text-transform: uppercase;
    font-family: "Playfair Display", "Times New Roman", serif;
}
.about-bio-head p {
    margin: .35rem 0 1.2rem;
    color: #d14f47;
    font-size: clamp(1rem, 1.6vw, 1.35rem);
    border-top: 2px solid rgba(209, 79, 71, 0.45);
    border-bottom: 2px solid rgba(209, 79, 71, 0.45);
    padding: .45rem 0;
    font-weight: 500;
}
.about-bio-hero {
    display: grid;
    grid-template-columns: 300px 1fr;
    gap: 1.2rem;
    margin-bottom: 1.2rem;
}
.about-wireframe-grid {
    display: grid;
    grid-template-columns: 400px 1fr;
    grid-template-areas:
        "image main"
        "quote followup";
    gap: 1rem 1.2rem;
    align-items: start;
    margin-bottom: 1rem;
}
.about-wireframe-image { grid-area: image; }
.about-wireframe-main { grid-area: main; }
.about-wireframe-quote { grid-area: quote; }
.about-wireframe-followup { grid-area: followup; }
.about-bio-left-stack {
    display: grid;
    gap: 1rem;
    align-content: start;
    padding-right: .9rem;
    border-right: 1px dotted #9ca3af;
}
.about-bio-image-card {
    background: #fff;
    border: 1px solid #dce4ec;
    border-radius: 14px;
    padding: .45rem;
    box-shadow: 0 8px 18px rgba(16, 36, 51, .06);
}
.about-bio-right-stack {
    display: grid;
    grid-template-rows: auto 1fr;
    gap: .6rem;
}
.about-bio-text-head {
    border-top: 1px solid rgba(209, 79, 71, 0.75);
    border-bottom: 1px solid rgba(209, 79, 71, 0.75);
    padding: .25rem 0 .45rem;
}
.about-bio-intro-text {
    background: #fff;
    border: 0;
    border-radius: 0;
    padding: .7rem 0 0;
    box-shadow: none;
}
.about-bio-intro-text h1 {
    margin: .2rem 0 .55rem;
    font-family: "Inter", Arial, sans-serif;
    color: #595e67;
    font-size: clamp(1.45rem, 2.1vw, 2rem);
    line-height: 1.2;
    text-transform: uppercase;
    font-weight: 500;
    letter-spacing: .4px;
}
.about-intro-columns {
    column-count: 2;
    column-gap: 1.25rem;
    padding-left: .9rem;
    border-left: 1px dotted #9ca3af;
}
.about-intro-columns p {
    break-inside: avoid;
    margin: 0 0 1.25rem;
}
.about-intro-columns p:first-child::first-letter {
    float: left;
    font-family: "Playfair Display", "Times New Roman", serif;
    font-size: 4.4rem;
    line-height: .82;
    color: #d05d55;
    margin-right: .38rem;
    margin-top: .16rem;
}
.about-bio-intro-text blockquote {
    margin: .7rem 0 0;
    padding-left: .8rem;
    border-left: 3px solid #8cae9c;
    color: #4a7d5f;
    font-style: italic;
}
.about-bio-text-head .about-kicker {
    margin: 0;
    color: #d04d46;
    letter-spacing: 0;
    font-size: clamp(1.05rem, 1.35vw, 1.45rem);
    font-weight: 400;
    font-family: "Playfair Display", "Times New Roman", serif;
}
.about-bio-media-row {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .9rem;
    margin: 1.15rem 0;
}
.about-bio-media-card {
    border: 1px solid #dbe4ee;
    border-radius: 12px;
    overflow: hidden;
    background: #fff;
}
.about-bio-media-card img {
    width: 100%;
    height: 230px;
    object-fit: cover;
    display: block;
    object-position: center 20%;
}
.about-bio-continuation {
    border-top: 1px solid #dbe4ee;
    padding-top: 1rem;
}
.about-bio-newspaper {
    column-count: 2;
    column-gap: 1.5rem;
}
.about-bio-newspaper p {
    margin: 0 0 .85rem;
    color: #3e4d5d;
    line-height: 1.72;
    break-inside: avoid;
}
.about-bio-block {
    display: grid;
    grid-template-columns: 340px 1fr;
    gap: 1.2rem;
    align-items: stretch;
    background: #fff;
    border: 1px solid #d7e2ed;
    border-radius: 18px;
    padding: .8rem;
    box-shadow: 0 14px 30px rgba(16, 36, 51, .08);
    margin-bottom: 1.2rem;
}
.about-bio-block-alt {
    grid-template-columns: 1fr 320px;
}
.about-bio-block-alt .about-bio-image { order: 2; }
.about-bio-image img {
    width: 100%;
    height: 100%;
    min-height: 420px;
    object-fit: cover;
    border-radius: 14px;
    object-position: center 18%;
}
.about-bio-image-lg img {
    min-height: 700px;
}
.about-bio-quote {
    border: 1px solid #dce4ec;
    border-radius: 14px;
    background: #fff;
    padding: .9rem .8rem .7rem;
    min-height: 170px;
    display: grid;
    align-items: center;
}
.about-bio-quote p {
    margin: 0;
    text-align: center;
}
.about-bio-quote p::before {
    content: "";
    display: block;
    width: 120px;
    height: 1px;
    margin: 0 auto .25rem;
    background: linear-gradient(90deg, #de625a 0 34%, transparent 34% 66%, #de625a 66% 100%);
}
.about-quote-mark {
    display: block;
    color: #de625a;
    font-size: 3.2rem;
    line-height: .7;
    margin-top: .1rem;
}
.about-quote-text {
    display: block;
    margin-top: .1rem;
    color: #de625a;
    font-size: 1.02rem;
    line-height: 1.35;
    font-family: "Playfair Display", "Times New Roman", serif;
}
.about-bio-text {
    display: grid;
    gap: .8rem;
    align-content: center;
    padding: .2rem .2rem .2rem 0;
}
.about-bio-text p {
    margin: 0;
    color: #3e4d5d;
    line-height: 1.72;
    font-size: 1.03rem;
}
.about-bio-followup-text {
    border-left: 1px dotted #9ca3af;
    padding-left: .9rem;
}
.about-bio-followup-text p {
    margin: 0;
    color: #3e4d5d;
    line-height: 1.7;
}
.about-legacy-section {
    background: radial-gradient(circle at 20% 0%, #0f5a4f 0%, #0a3f39 55%, #082d2a 100%);
    position: relative;
    z-index: 2;
    margin-top: 0;
    border-top-left-radius: 22px;
    border-top-right-radius: 22px;
    overflow: hidden;
    box-shadow: 0 -14px 28px rgba(8, 45, 42, 0.35);
}
.about-legacy-grid {
    display: grid;
    grid-template-columns: 1fr 420px;
    gap: 1.4rem;
    align-items: center;
}
.about-legacy-copy h2 {
    margin: .35rem 0;
    color: #fff;
    font-size: clamp(1.9rem, 3.2vw, 3rem);
    font-family: "Playfair Display", "Times New Roman", serif;
}
.about-legacy-copy h2 span { color: #f2c94c; }
.about-legacy-line {
    width: 86px;
    height: 3px;
    border-radius: 4px;
    background: #f2c94c;
    margin: .85rem 0 1rem;
}
.about-legacy-copy blockquote {
    margin: 0;
    color: #e7f4f0;
    font-style: italic;
    border-left: 3px solid #f2c94c;
    padding-left: .85rem;
    line-height: 1.7;
}
.about-legacy-copy > p {
    color: #d5ebe5;
    margin-top: 1rem;
}
.about-legacy-photo-wrap {
    position: relative;
    background: rgba(255, 255, 255, 0.08);
    border-radius: 18px;
    padding: .45rem;
    border: 1px solid rgba(255, 255, 255, 0.2);
    transition: transform .25s ease, box-shadow .25s ease;
}
.about-legacy-photo-wrap img {
    width: 100%;
    height: 440px;
    object-fit: cover;
    border-radius: 14px;
    transition: transform .35s ease;
}
.about-legacy-photo-wrap:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 30px rgba(8, 45, 42, 0.35);
}
.about-legacy-photo-wrap:hover img {
    transform: scale(1.02);
}
.about-legacy-accent {
    position: absolute;
    right: -14px;
    bottom: -14px;
    width: 80px;
    height: 80px;
    border-radius: 18px;
    transform: rotate(18deg);
    background: rgba(142, 178, 84, 0.35);
}
.about-gallery-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
}
.about-gallery-card {
    border-radius: 14px;
    border: 1px solid #dbe5ef;
    overflow: hidden;
    box-shadow: 0 8px 22px rgba(16, 36, 51, .08);
    background: #fff;
}
.about-gallery-card img {
    display: block;
    width: 100%;
    height: 300px;
    object-fit: cover;
    object-position: center 20%;
}

/* ——— Gallery smartphone mockup ——— */
.gallery-page-inner {
    max-width: 1360px;
}
@keyframes gallery-intro-shimmer {
    0% {
        background-position: 0% 50%;
    }
    100% {
        background-position: 100% 50%;
    }
}
.gallery-page-intro-block {
    margin: 0 0 1.25rem;
    padding: 0 0.5rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.85rem;
    text-align: center;
}
.gallery-page-intro-title {
    margin: 0;
    font-family: "Playfair Display", "Times New Roman", Georgia, serif;
    font-size: clamp(1.5rem, 3vw, 2.35rem);
    font-weight: 600;
    letter-spacing: 0.05em;
    line-height: 1.25;
    background: linear-gradient(
        110deg,
        #1e293b 0%,
        #0e7490 28%,
        #b45309 52%,
        #0f766e 72%,
        #1e293b 100%
    );
    background-size: 220% auto;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    filter: drop-shadow(0 2px 14px rgba(14, 116, 144, 0.22))
        drop-shadow(0 1px 2px rgba(180, 83, 9, 0.12));
    animation: gallery-intro-shimmer 7s ease-in-out infinite alternate;
}
.gallery-page-intro-thumbs {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 0.45rem 0.35rem;
}
.gallery-page-intro-thumb {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-width: 6.5rem;
    padding: 0.55rem 0.85rem 0.6rem;
    border-radius: 12px;
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    font-size: clamp(0.78rem, 1.35vw, 0.92rem);
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #0f172a;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, rgba(248, 250, 252, 0.94) 100%);
    border: 1px solid rgba(171, 133, 76, 0.45);
    box-shadow:
        0 4px 14px rgba(92, 66, 28, 0.1),
        inset 0 1px 0 rgba(255, 255, 255, 0.95);
    position: relative;
    overflow: hidden;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.gallery-page-intro-thumb::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, #0e7490, #b45309, #0f766e);
    border-radius: 12px 12px 0 0;
}
.gallery-page-intro-thumb:hover {
    transform: translateY(-2px);
    box-shadow:
        0 8px 22px rgba(14, 116, 144, 0.18),
        inset 0 1px 0 rgba(255, 255, 255, 0.95);
}
.gallery-page-intro-sep {
    font-weight: 300;
    color: rgba(71, 85, 105, 0.55);
    font-size: 1.1rem;
    line-height: 1;
    user-select: none;
    padding: 0 0.15rem;
}
@media (prefers-reduced-motion: reduce) {
    .gallery-page-intro-title {
        animation: none;
        background-position: 50% 50%;
    }
    .gallery-page-intro-thumb {
        transition: none;
    }
    .gallery-page-intro-thumb:hover {
        transform: none;
    }
}
@media (max-width: 520px) {
    .gallery-page-intro-sep {
        display: none;
    }
    .gallery-page-intro-thumbs {
        gap: 0.5rem;
    }
}
.gallery-modern-frame {
    position: relative;
    padding: 0.9rem 2rem;
    border-radius: 22px;
    background:
        linear-gradient(140deg, rgba(255, 252, 245, 0.97), rgba(250, 245, 235, 0.94)),
        radial-gradient(140% 140% at 0% 0%, rgba(180, 145, 83, 0.14), rgba(180, 145, 83, 0));
    border: 1px solid rgba(171, 133, 76, 0.42);
    box-shadow:
        0 14px 34px rgba(92, 66, 28, 0.16),
        inset 0 1px 0 rgba(255, 255, 255, 0.8);
}
.gallery-split-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.85rem;
    align-items: stretch;
    max-width: 1120px;
    margin: 0 auto;
}
.gallery-media-card {
    overflow: hidden;
    padding: 0;
    border-radius: 14px;
    height: 420px;
    min-height: 0;
    border: 1px solid rgba(15, 23, 42, 0.08);
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.08);
    transition: transform 0.22s ease, box-shadow 0.22s ease;
}
.gallery-media-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 14px 26px rgba(15, 23, 42, 0.14);
}
.gallery-media-image {
    width: 100%;
    height: 100%;
    min-height: 0;
    object-fit: cover;
    display: block;
}
.gallery-slider-card {
    position: relative;
    grid-column: span 2;
}
.gallery-image-slider-track {
    position: relative;
    width: 100%;
    height: 100%;
    min-height: 0;
}
.gallery-slider-image {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 18%;
    opacity: 0;
    transform: scale(1.05);
    filter: blur(1.5px);
    transition:
        opacity 0.95s cubic-bezier(0.22, 1, 0.36, 1),
        transform 1.4s cubic-bezier(0.22, 1, 0.36, 1),
        filter 0.95s ease;
}
.gallery-slider-image.is-active {
    opacity: 1;
    transform: scale(1);
    filter: blur(0);
    z-index: 1;
}
.gallery-split-grid .gallery-slider-image[data-gallery-slide="0"] {
    object-position: center 4%;
}
.gallery-slider-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 2;
    width: 2.2rem;
    height: 2.2rem;
    border: none;
    border-radius: 999px;
    display: grid;
    place-items: center;
    cursor: pointer;
    color: #fff;
    background: rgba(7, 12, 23, 0.62);
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.28);
    transition: transform 0.2s ease, background-color 0.2s ease;
}
.gallery-slider-btn:hover {
    background: rgba(7, 12, 23, 0.84);
}
.gallery-slider-btn:active {
    transform: translateY(-50%) scale(0.95);
}
.gallery-slider-btn.prev {
    left: 0.55rem;
}
.gallery-slider-btn.next {
    right: 0.55rem;
}
.gallery-slider-dots {
    position: absolute;
    left: 50%;
    bottom: 0.7rem;
    transform: translateX(-50%);
    z-index: 2;
    display: flex;
    align-items: center;
    gap: 0.36rem;
}
.gallery-slider-dot {
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 999px;
    border: none;
    background: rgba(255, 255, 255, 0.5);
    cursor: pointer;
    transition: all 0.2s ease;
    padding: 0;
}
.gallery-slider-dot.is-active {
    width: 1.2rem;
    background: #fff;
}
.gallery-feed-video-wrap {
    position: relative;
    width: 100%;
    height: 100%;
    min-height: 0;
    overflow: hidden;
    background: transparent;
}
.gallery-feed-video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    background: #000;
}
.gallery-audio-toggle {
    position: absolute;
    right: 0.9rem;
    bottom: 0.9rem;
    z-index: 2;
    width: 2.6rem;
    height: 2.6rem;
    border: none;
    border-radius: 999px;
    cursor: pointer;
    color: #fff;
    background: rgba(10, 17, 31, 0.68);
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.3);
    display: grid;
    place-items: center;
    transition: transform 0.15s ease, background-color 0.2s ease;
}
.gallery-audio-toggle:hover {
    background: rgba(10, 17, 31, 0.84);
}
.gallery-audio-toggle:active {
    transform: scale(0.95);
}
.gallery-audio-toggle:focus-visible {
    outline: 2px solid #fff;
    outline-offset: 2px;
}
.gallery-quote-card {
    position: relative;
    height: 420px;
    min-height: 0;
    padding: 0.95rem 0.95rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 0.7rem;
    background:
        radial-gradient(120% 120% at 100% 0%, rgba(241, 196, 15, 0.2) 0%, rgba(241, 196, 15, 0) 42%),
        linear-gradient(155deg, #0f172a 0%, #1e3a5f 52%, #0c4a6e 100%);
    color: #f8fafc;
}
.gallery-quote-card::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    background: linear-gradient(180deg, #f59e0b 0%, #facc15 100%);
    box-shadow: 0 0 18px rgba(250, 204, 21, 0.48);
}
.gallery-quote-card:hover {
    transform: translateY(-3px) scale(1.01);
}
.gallery-quote-text {
    margin: 0;
    font-size: 1.06rem;
    line-height: 1.7;
    letter-spacing: 0.01em;
    font-weight: 500;
    text-wrap: pretty;
    font-family: "Segoe Print", "Lucida Handwriting", "Bradley Hand", "Brush Script MT", cursive;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 12;
    -webkit-box-orient: vertical;
}
.gallery-quote-author {
    margin: 0;
    font-size: 0.92rem;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    color: rgba(241, 245, 249, 0.92);
    font-weight: 700;
    font-family: "Segoe Print", "Lucida Handwriting", "Bradley Hand", "Brush Script MT", cursive;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.gallery-showcase {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    width: 100%;
}
.gallery-phone-stage {
    width: min(380px, 100%);
    max-width: 100%;
}
.gallery-phone-stage.card {
    padding: 0.85rem;
}
.gallery-phone-frame {
    position: relative;
    display: block;
    width: 100%;
    line-height: 0;
}
.gallery-phone-bg {
    width: 100%;
    height: auto;
    display: block;
    vertical-align: middle;
    user-select: none;
    -webkit-user-drag: none;
    pointer-events: none;
}
/* Green-screen mockup: expanded mask + centered overscan + inset ring to eliminate green bleed */
.gallery-phone-screen-slot {
    position: absolute;
    left: 12.65%;
    top: 4.95%;
    width: 74.2%;
    height: 90.5%;
    border-radius: 12.5%;
    overflow: hidden;
    box-sizing: border-box;
    background: #020204;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}
.gallery-phone-screen-slot > .gallery-video-shell {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    max-height: none;
    aspect-ratio: unset;
    border-radius: inherit;
    background: #020204;
    isolation: isolate;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
    overflow: hidden;
    transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    box-shadow:
        inset 0 0 0 3px #020204,
        inset 0 0 0 1px rgba(255, 255, 255, 0.06),
        inset 0 18px 48px rgba(0, 0, 0, 0.28);
}
/* Subtle glass glare over video (below notch / chrome) */
.gallery-phone-screen-slot > .gallery-video-shell::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    pointer-events: none;
    z-index: 1;
    background: linear-gradient(
        125deg,
        rgba(255, 255, 255, 0.14) 0%,
        rgba(255, 255, 255, 0.02) 36%,
        transparent 52%,
        transparent 68%,
        rgba(255, 255, 255, 0.04) 100%
    );
    opacity: 0.42;
}
.gallery-phone-notch {
    position: absolute;
    top: 2.6%;
    left: 50%;
    transform: translateX(-50%);
    width: 36%;
    height: 5.2%;
    min-height: 11px;
    border-radius: 999px;
    background: linear-gradient(180deg, #151518 0%, #070708 55%, #101012 100%);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.1),
        inset 0 -1px 0 rgba(0, 0, 0, 0.45),
        0 2px 8px rgba(0, 0, 0, 0.35);
    z-index: 2;
    pointer-events: none;
}
.gallery-video-chrome {
    position: absolute;
    inset: 0;
    z-index: 3;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    pointer-events: none;
    opacity: 1;
    transition: opacity 0.42s cubic-bezier(0.33, 1, 0.68, 1);
}
.gallery-video-chrome.is-hidden {
    opacity: 0;
    pointer-events: none;
}
.gallery-video-chrome-shade {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 48%;
    pointer-events: none;
    background: linear-gradient(
        to top,
        rgba(4, 6, 12, 0.94) 0%,
        rgba(4, 6, 12, 0.72) 28%,
        rgba(4, 6, 12, 0.35) 56%,
        rgba(4, 6, 12, 0) 100%
    );
}
.gallery-video-bar {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    gap: 0.42rem;
    padding: 0.42rem 0.55rem calc(0.55rem + env(safe-area-inset-bottom, 0px));
    pointer-events: auto;
}
.gallery-v-btn {
    flex-shrink: 0;
    border: none;
    background: rgba(255, 255, 255, 0.06);
    color: #fff;
    width: 2.05rem;
    height: 2.05rem;
    border-radius: 10px;
    cursor: pointer;
    display: grid;
    place-items: center;
    font-size: 0.78rem;
    opacity: 0.96;
    transition: background 0.2s ease, transform 0.15s ease;
}
.gallery-v-btn:hover {
    background: rgba(255, 255, 255, 0.14);
    opacity: 1;
}
.gallery-v-btn:active {
    transform: scale(0.94);
}
.gallery-v-track-wrap {
    flex: 1;
    min-width: 0;
    display: grid;
    gap: 0.18rem;
}
.gallery-v-seek {
    width: 100%;
    height: 8px;
    margin: 0;
    accent-color: rgba(255, 255, 255, 0.95);
    cursor: pointer;
    border-radius: 4px;
}
.gallery-v-time {
    font-size: 0.62rem;
    font-variant-numeric: tabular-nums;
    letter-spacing: 0.04em;
    color: rgba(255, 255, 255, 0.82);
    font-weight: 500;
}
.gallery-v-audio {
    display: flex;
    align-items: center;
    gap: 0.2rem;
    flex-shrink: 0;
}
.gallery-v-audio .gallery-v-btn {
    width: 1.95rem;
    height: 1.95rem;
}
.gallery-v-volume {
    width: clamp(44px, 14vw, 64px);
    height: 7px;
    margin: 0;
    accent-color: rgba(255, 255, 255, 0.92);
    cursor: pointer;
    border-radius: 4px;
}
.gallery-page .visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}
.gallery-video-shell {
    position: relative;
    margin: 0 auto;
    width: min(220px, 100%);
    max-height: min(320px, 42vh);
    aspect-ratio: 9 / 16;
    border-radius: 22px;
    overflow: hidden;
    background: #0a0a0c;
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.18);
}
.gallery-simple-video {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 126%;
    height: 126%;
    transform: translate(-50%, -50%) translateZ(0);
    object-fit: cover;
    object-position: center center;
    display: block;
    border-radius: inherit;
    background: #020204;
    vertical-align: middle;
    z-index: 0;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}
.gallery-page img,
.gallery-page video {
    -webkit-touch-callout: none;
}
@media (prefers-reduced-motion: reduce) {
    .gallery-video-chrome {
        transition: none;
    }
    .gallery-v-btn {
        transition: none;
    }
    .gallery-media-card,
    .gallery-quote-card {
        transition: none;
    }
    .gallery-slider-image {
        transition: none;
    }
}
@media (max-width: 960px) {
    .gallery-split-grid {
        grid-template-columns: 1fr 1fr;
    }
    .gallery-slider-card {
        grid-column: span 2;
    }
    .gallery-media-card,
    .gallery-media-image,
    .gallery-feed-video-wrap {
        height: 370px;
        min-height: 0;
    }
    .gallery-image-slider-track {
        min-height: 0;
    }
    .gallery-quote-card {
        height: 370px;
        min-height: 0;
    }
    .gallery-phone-stage {
        width: min(340px, 92vw);
    }
    .gallery-modern-frame {
        padding: 0.8rem 1.25rem;
        border-radius: 18px;
    }
}
@media (max-width: 700px) {
    .gallery-split-grid {
        grid-template-columns: 1fr;
        max-width: 380px;
    }
    .gallery-slider-card {
        grid-column: auto;
    }
    .gallery-modern-frame {
        padding: 0.75rem 0.9rem;
        border-radius: 16px;
    }
}

/* Gallery: Graduation & Summit + optional compact row */
.gallery-page-highlights {
    padding-top: 2.35rem;
}
.gallery-highlights-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.75rem;
    align-items: start;
    max-width: 1360px;
    margin: 1rem auto 0;
}
.gallery-highlight-col {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    min-width: 0;
}
.gallery-highlight-card {
    background: #fff;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    overflow: hidden;
    box-shadow: 0 1px 4px rgba(15, 23, 42, 0.07);
}
.gallery-page-highlights-main .gallery-highlight-viewport {
    position: relative;
    width: 100%;
    height: 300px;
    margin: 0;
    border-radius: 0;
    background: #f1f5f9;
}
.gallery-highlight-label {
    margin: 0.35rem 0 0;
    text-align: center;
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    font-weight: 700;
    font-size: clamp(0.95rem, 1.4vw, 1.05rem);
    color: #111827;
    letter-spacing: 0.01em;
}
.gallery-compact-highlights {
    padding-top: 0.85rem;
}
.gallery-compact-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.25rem;
    align-items: start;
    max-width: 1200px;
    margin: 0 auto;
}
.gallery-compact-highlights .gallery-compact-card {
    border-radius: 8px;
    min-width: 0;
}
.gallery-compact-highlights .gallery-compact-viewport {
    position: relative;
    width: auto;
    height: 220px;
    margin: 12px 12px 0;
    border-radius: 4px;
    overflow: hidden;
    background: #f1f5f9;
}
.gallery-highlight-viewport[data-gallery-highlight-lightbox] {
    cursor: zoom-in;
}
.gallery-highlight-viewport[data-gallery-highlight-lightbox]:focus-visible {
    outline: 2px solid #2563eb;
    outline-offset: 2px;
}
.gallery-highlight-card .gallery-image-slider-track {
    position: relative;
    width: 100%;
    height: 100%;
    min-height: 0;
}
/* Fill viewport; vertical % below ~top trims empty sky/headroom so subjects sit higher */
.gallery-highlight-card .gallery-slider-image {
    object-fit: cover;
    object-position: center 30%;
    transform: none;
    filter: none;
    transition: opacity 0.5s cubic-bezier(0.22, 1, 0.36, 1);
}
.gallery-highlight-card .gallery-slider-image.is-active {
    transform: none;
    filter: none;
}
.gallery-page-highlights-main .gallery-highlight-nav {
    padding: 0.65rem 0.9rem;
    border-top: 1px solid #e5e7eb;
}
.gallery-compact-highlights .gallery-compact-nav {
    padding: 0.85rem 12px 12px;
    border-top: none;
}
.gallery-highlight-nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.65rem;
    background: #fff;
}
.gallery-highlight-arrow {
    flex-shrink: 0;
    width: 2.35rem;
    height: 2.35rem;
    margin: 0;
    padding: 0;
    border: 1px solid #64748b;
    border-radius: 3px;
    background: #fff;
    cursor: pointer;
    display: grid;
    place-items: center;
    color: #0f172a;
    transition: background-color 0.15s ease, border-color 0.15s ease;
}
.gallery-highlight-arrow:hover {
    background: #f8fafc;
    border-color: #334155;
}
.gallery-highlight-arrow:active {
    background: #e2e8f0;
}
.gallery-highlight-arrow-icon {
    font-size: 1.5rem;
    line-height: 1;
    font-weight: 300;
    margin-top: -2px;
}
.gallery-highlight-counter {
    flex: 1;
    text-align: center;
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    font-size: 0.94rem;
    font-weight: 500;
    color: #374151;
    letter-spacing: 0.02em;
}
.gallery-page-highlights .gallery-slider-card {
    grid-column: auto;
    width: 100%;
}
@media (max-width: 960px) {
    .gallery-page-highlights-main .gallery-highlight-viewport {
        height: 260px;
    }
    .gallery-compact-highlights .gallery-compact-viewport {
        height: 200px;
    }
}
@media (max-width: 900px) {
    .gallery-highlights-grid {
        grid-template-columns: 1fr;
    }
    .gallery-compact-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
@media (max-width: 560px) {
    .gallery-compact-grid {
        grid-template-columns: 1fr;
    }
    .gallery-compact-highlights .gallery-compact-viewport {
        height: 220px;
    }
}

.gallery-highlights-lightbox {
    position: fixed;
    inset: 0;
    z-index: 1250;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    box-sizing: border-box;
}
.gallery-highlights-lightbox.is-open {
    display: flex;
}
.gallery-highlights-lightbox-scrim {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, 0.88);
    cursor: pointer;
}
.gallery-highlights-lightbox-content {
    position: relative;
    z-index: 1;
    max-width: min(96vw, 1600px);
    max-height: 92vh;
    margin: auto;
}
.gallery-highlights-lightbox-img {
    display: block;
    max-width: 100%;
    max-height: 92vh;
    width: auto;
    height: auto;
    object-fit: contain;
    border-radius: 4px;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.35);
}
.gallery-highlights-lightbox-close {
    position: absolute;
    top: 0.5rem;
    right: 0.5rem;
    width: 2.5rem;
    height: 2.5rem;
    border: 1px solid rgba(255, 255, 255, 0.35);
    border-radius: 4px;
    background: rgba(15, 23, 42, 0.92);
    color: #fff;
    font-size: 1.75rem;
    line-height: 1;
    cursor: pointer;
    display: grid;
    place-items: center;
    padding: 0;
    transition: background-color 0.15s ease, border-color 0.15s ease;
}
.gallery-highlights-lightbox-close:hover {
    background: rgba(30, 41, 59, 0.98);
    border-color: rgba(255, 255, 255, 0.55);
}
.gallery-highlights-lightbox-close:focus-visible {
    outline: 2px solid #93c5fd;
    outline-offset: 2px;
}
.header-video-wrap { position: relative; width: 100%; height: 380px; overflow: hidden; background: #000; }
.header-video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: fill; display: block; opacity: 0.85; }
.header-video-overlay { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(8,26,40,.6), rgba(8,26,40,.2)); color: #fff; display: grid; align-items: center; }
.header-video-overlay .container { opacity: 0; animation: slideUpFade 0.8s cubic-bezier(0.2, 0.8, 0.2, 1) 0.2s forwards; }
.header-video-overlay h2 { margin: 0 0 .3rem; font-size: clamp(1.4rem, 3vw, 2.2rem); text-shadow: 0 2px 4px rgba(0,0,0,0.5); }
.header-video-overlay p { margin: 0; font-size: 1rem; opacity: .95; text-shadow: 0 1px 2px rgba(0,0,0,0.5); }
.hero-video-content {
    max-width: 760px;
    margin: 0 auto;
    text-align: center;
    background: rgba(16, 24, 40, 0.36);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 16px;
    padding: 1.6rem 1.2rem;
    backdrop-filter: blur(2px);
}
.hero-video-content h1 {
    margin: 0;
    font-size: clamp(2rem, 5vw, 3.6rem);
    font-family: "Playfair Display", "Times New Roman", serif;
    letter-spacing: 6px;
    line-height: 1.08;
    color: #f5e9bf;
    text-transform: uppercase;
    text-shadow: 0 4px 14px rgba(0, 0, 0, 0.55);
}
.hero-video-content p {
    margin: .9rem 0 0;
    text-transform: uppercase;
    letter-spacing: 5px;
    font-size: .98rem;
    color: #e7e9ee;
    display: inline-flex;
    align-items: center;
    gap: 12px;
}
.hero-video-content p::before,
.hero-video-content p::after {
    content: "";
    width: 34px;
    height: 1px;
    background: rgba(255, 255, 255, 0.45);
    display: inline-block;
}
.hero-video-actions {
    margin-top: 1.5rem;
    display: flex;
    justify-content: center;
    gap: .85rem;
    flex-wrap: wrap;
}
.hero-video-btn-outline {
    background: transparent;
    border: 2px solid rgba(255, 255, 255, 0.85);
    color: #fff;
}
.hero-video-btn-outline:hover {
    background: rgba(255, 255, 255, 0.12);
    border-color: #fff;
}
/* Inner pages only — Section 3 title banner (home uses video hero) */
.header-title-banner {
    position: relative;
    height: 288px;
    background-color: #152920;
    background-image: url("../../pictures/bg.png");
    background-size: cover;
    /*
     * bg.png: faces sit ~20–45% from top; ceiling/AC is above that, table below.
     * center top → only room/equipment; too low (e.g. 62%) → heads clip off.
     * ~36% anchors the face band into this short wide crop.
     */
    background-position: center 36%;
    background-repeat: no-repeat;
    isolation: isolate;
}
.header-title-banner::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background:
        radial-gradient(ellipse 120% 70% at 50% 20%, rgba(242, 201, 76, 0.09), transparent 52%),
        radial-gradient(circle at 15% 75%, rgba(255, 255, 255, 0.04), transparent 38%),
        radial-gradient(circle at 88% 40%, rgba(255, 255, 255, 0.035), transparent 35%),
        repeating-linear-gradient(
            125deg,
            transparent 0,
            transparent 14px,
            rgba(255, 255, 255, 0.018) 14px,
            rgba(255, 255, 255, 0.018) 15px
        ),
        linear-gradient(180deg, rgba(21, 41, 32, 0.82), rgba(15, 36, 28, 0.92));
}
.header-title-overlay {
    position: absolute;
    inset: 0;
    z-index: 1;
    background: transparent;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    text-align: center;
}
.banner-content-box {
    position: relative;
    z-index: 1;
    max-width: min(92vw, 52rem);
    background: rgba(255, 255, 255, 0.07);
    border: 1px solid rgba(248, 244, 235, 0.38);
    border-radius: 22px;
    padding: 2.1rem 3.25rem;
    backdrop-filter: blur(10px);
    box-shadow:
        0 12px 40px rgba(0, 0, 0, 0.28),
        inset 0 1px 0 rgba(255, 255, 255, 0.1);
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    opacity: 0;
    transform: translateY(25px);
    animation: slideUpFade 0.8s cubic-bezier(0.2, 0.8, 0.2, 1) 0.1s forwards;
}
@keyframes slideUpFade {
    to { opacity: 1; transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
    .banner-content-box {
        animation: none;
        opacity: 1;
        transform: none;
    }
}
.header-title-overlay h1 {
    margin: 0;
    font-size: clamp(2rem, 4.2vw, 3.15rem);
    font-family: "Playfair Display", "Times New Roman", serif;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    color: #f8f4eb;
    font-weight: 700;
    line-height: 1.15;
    text-shadow:
        0 0 18px rgba(242, 201, 76, 0.65),
        0 0 42px rgba(242, 201, 76, 0.28),
        0 2px 6px rgba(0, 0, 0, 0.45);
}
.banner-divider {
    width: min(280px, 72vw);
    height: 2px;
    margin: 0.85rem auto 0;
    border: 0;
    background: linear-gradient(
        90deg,
        transparent 0%,
        rgba(242, 201, 76, 0.15) 12%,
        #e8c85a 50%,
        rgba(242, 201, 76, 0.15) 88%,
        transparent 100%
    );
    box-shadow: 0 0 12px rgba(242, 201, 76, 0.35);
}
.banner-subtitle {
    margin: 0.75rem 0 0;
    font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    font-size: 0.82rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.22em;
    color: #f0ebe3;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
}
.banner-subtitle span {
    flex-shrink: 0;
}
.banner-subtitle::before,
.banner-subtitle::after {
    content: "";
    display: block;
    width: clamp(28px, 8vw, 48px);
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(248, 244, 235, 0.75));
}
.banner-subtitle::after {
    background: linear-gradient(90deg, rgba(248, 244, 235, 0.75), transparent);
}

/* Reports banner — room for subtitle + horizontal marquee */
.header-title-banner--reports .banner-content-box {
    max-width: min(96vw, 58rem);
    width: min(96vw, 58rem);
    box-sizing: border-box;
    padding: 2rem clamp(1.35rem, 4.5vw, 2.75rem) 2.15rem;
}
.banner-subtitle--marquee-wrap {
    position: relative;
    width: 100%;
    max-width: 100%;
    margin: 0.75rem 0 0;
    padding: 0 0.15rem;
    box-sizing: border-box;
    display: block;
    text-align: center;
}
.banner-subtitle--marquee-wrap::before,
.banner-subtitle--marquee-wrap::after {
    display: none;
}
.banner-subtitle-marquee-sr {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}
.banner-subtitle-marquee {
    display: block;
    overflow: hidden;
    width: 100%;
    min-height: 1.55em;
    -webkit-mask-image: linear-gradient(
        90deg,
        transparent 0%,
        #000 5%,
        #000 95%,
        transparent 100%
    );
    mask-image: linear-gradient(90deg, transparent 0%, #000 5%, #000 95%, transparent 100%);
}
.banner-subtitle-marquee-track {
    display: inline-flex;
    flex-wrap: nowrap;
    width: max-content;
    animation: banner-subtitle-marquee 38s linear infinite;
}
.banner-subtitle-marquee-seg {
    flex-shrink: 0;
    padding-right: clamp(2.75rem, 7vw, 5rem);
    margin: 0;
    white-space: nowrap;
    font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    font-size: clamp(0.58rem, 1.15vw, 0.74rem);
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    line-height: 1.45;
    color: #f0ebe3;
}
@keyframes banner-subtitle-marquee {
    from {
        transform: translateX(0);
    }
    to {
        transform: translateX(-50%);
    }
}
@media (prefers-reduced-motion: reduce) {
    .banner-subtitle-marquee {
        display: none;
    }
    .banner-subtitle-marquee-sr {
        position: static;
        width: auto;
        height: auto;
        margin: 0;
        padding: 0 0.35rem;
        overflow: visible;
        clip: auto;
        clip-path: none;
        white-space: normal;
        border: 0;
        display: block;
        font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
        font-size: clamp(0.62rem, 2.4vw, 0.76rem);
        font-weight: 500;
        text-transform: uppercase;
        letter-spacing: 0.1em;
        line-height: 1.5;
        color: #f0ebe3;
        text-align: center;
        max-width: 42rem;
        margin-left: auto;
        margin-right: auto;
    }
    .banner-subtitle-marquee-track {
        animation: none;
    }
}

/* Back to Top Button */
#back-to-top {
    position: fixed;
    bottom: 25px;
    right: 25px;
    width: 45px;
    height: 45px;
    background: var(--primary);
    color: #fff;
    border: none;
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
    opacity: 0;
    visibility: hidden;
    transform: translateY(15px);
    transition: all 0.3s ease;
    z-index: 999;
}
#back-to-top.show {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}
#back-to-top:hover {
    background: var(--primary-dark);
    transform: translateY(-3px);
    box-shadow: 0 6px 16px rgba(0,0,0,0.2);
}

/* Team page — full-bleed cards, bottom gradient + caption; hover: split + green bio panel */
.team-page {
    background: linear-gradient(180deg, #eef2f7 0%, #e8ecf1 40%, #e8ecf1 100%);
    padding-top: 1.35rem;
    padding-bottom: 3.5rem;
}
.team-page-inner {
    max-width: 1180px;
}
.team-page-intro-shell {
    position: relative;
    width: 100%;
    margin: 0 0 2rem;
    padding: 1.45rem 1.65rem 1.55rem;
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.72);
    border: 1px solid rgba(148, 163, 184, 0.28);
    box-shadow:
        0 1px 2px rgba(15, 23, 42, 0.04),
        0 12px 40px -12px rgba(15, 23, 42, 0.08);
    backdrop-filter: blur(10px);
    box-sizing: border-box;
}
.team-page-intro-label {
    margin: 0 0 0.5rem;
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    font-size: 0.78rem;
    font-weight: 600;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--primary-dark);
}
.team-page-intro-sr {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}
.team-page-intro-marquee {
    overflow: hidden;
    width: 100%;
    min-height: 1.65em;
    -webkit-mask-image: linear-gradient(
        90deg,
        transparent,
        #000 6%,
        #000 94%,
        transparent
    );
    mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
}
.team-page-intro-track {
    display: inline-flex;
    flex-wrap: nowrap;
    width: max-content;
    animation: team-intro-marquee 32s linear infinite;
}
.team-page-intro.team-page-intro-segment {
    flex-shrink: 0;
    padding-right: clamp(3rem, 8vw, 6rem);
    margin: 0;
    white-space: nowrap;
    text-align: left;
    font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    font-size: clamp(1.18rem, 1.65vw, 1.42rem);
    font-weight: 400;
    line-height: 1.62;
    letter-spacing: -0.018em;
    color: #475569;
}
@keyframes team-intro-marquee {
    from {
        transform: translateX(0);
    }
    to {
        transform: translateX(-50%);
    }
}
@media (min-width: 768px) {
    .team-page-intro-shell {
        padding: 1.65rem 2rem 1.75rem;
    }
}
@media (prefers-reduced-motion: reduce) {
    .team-page-intro-marquee {
        display: none;
    }
    .team-page-intro-sr {
        position: static;
        width: auto;
        height: auto;
        margin: 0;
        padding: 0;
        overflow: visible;
        clip: auto;
        clip-path: none;
        white-space: normal;
        border: 0;
        font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
        font-size: clamp(1.18rem, 1.65vw, 1.42rem);
        font-weight: 400;
        line-height: 1.62;
        letter-spacing: -0.018em;
        color: #475569;
    }
}
/* Team: slightly larger title in the shared inner banner */
.header-title-banner--team .header-title-overlay h1 {
    font-size: clamp(2.35rem, 4.5vw, 3.45rem);
}
.header-title-banner--team .banner-subtitle {
    font-size: 0.92rem;
    letter-spacing: 0.24em;
}
.team-page-sets .team-cards-grid + .team-cards-grid {
    margin-top: 2.25rem;
}
.team-cards-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.75rem;
    align-items: stretch;
    list-style: none;
    margin: 0;
    padding: 0;
}
/* One card in a row: same width as other cards, aligned to the left column */
.team-cards-grid.team-cards-grid--single .team-card-wrap {
    grid-column: 1;
    justify-self: stretch;
}
.team-card-wrap {
    min-width: 0;
    list-style: none;
}
.team-card {
    height: 100%;
    outline: none;
    position: relative;
    padding: 11px 11px 13px;
    border-radius: 22px;
    background: linear-gradient(168deg, #faf7f0 0%, #ebe3d4 42%, #ddd2c0 100%);
    box-shadow:
        inset 0 2px 5px rgba(255, 255, 255, 0.85),
        inset 0 -3px 8px rgba(45, 36, 24, 0.07),
        0 0 0 1px rgba(48, 38, 26, 0.42),
        0 0 0 4px rgba(196, 160, 72, 0.5),
        0 0 0 5px rgba(90, 72, 44, 0.28),
        0 12px 28px rgba(15, 23, 42, 0.14),
        0 4px 10px rgba(15, 23, 42, 0.08);
    transition:
        opacity 0.7s cubic-bezier(0.22, 1, 0.36, 1),
        transform 0.7s cubic-bezier(0.22, 1, 0.36, 1),
        filter 0.65s ease,
        box-shadow 0.3s ease;
}
.team-card-box {
    display: flex;
    flex-direction: column;
    height: 100%;
    aspect-ratio: 3 / 3.55;
    border-radius: 14px;
    overflow: hidden;
    background: #0a1f1a;
    box-shadow:
        inset 0 0 0 1px rgba(0, 0, 0, 0.35),
        inset 0 1px 0 rgba(255, 255, 255, 0.06);
}
.team-page .team-card-wrap:not(.team-card-wrap--in-view) .team-card {
    opacity: 0;
    filter: blur(3px);
}
/* Per-card motion (each card reveals from a different direction) */
.team-page .team-card-wrap[data-team-reveal="up"]:not(.team-card-wrap--in-view) .team-card {
    transform: translateY(2.25rem) scale(0.96);
}
.team-page .team-card-wrap[data-team-reveal="left"]:not(.team-card-wrap--in-view) .team-card {
    transform: translateX(-2rem) scale(0.96);
}
.team-page .team-card-wrap[data-team-reveal="right"]:not(.team-card-wrap--in-view) .team-card {
    transform: translateX(2rem) scale(0.96);
}
.team-page .team-card-wrap[data-team-reveal="zoom"]:not(.team-card-wrap--in-view) .team-card {
    transform: scale(0.9);
    filter: blur(4px);
}
.team-page .team-card-wrap--in-view .team-card {
    opacity: 1;
    transform: translateY(0) translateX(0) scale(1);
    filter: blur(0);
}
@media (prefers-reduced-motion: reduce) {
    .team-page .team-card-wrap .team-card {
        opacity: 1 !important;
        transform: none !important;
        filter: none !important;
    }
}
@media (hover: hover) {
    .team-page .team-card-wrap--in-view .team-card:hover,
    .team-page .team-card-wrap--in-view .team-card:focus-within {
        transform: translateY(-4px);
        box-shadow:
            inset 0 2px 5px rgba(255, 255, 255, 0.85),
            inset 0 -3px 8px rgba(45, 36, 24, 0.07),
            0 0 0 1px rgba(48, 38, 26, 0.48),
            0 0 0 4px rgba(212, 175, 55, 0.58),
            0 0 0 5px rgba(90, 72, 44, 0.32),
            0 18px 38px rgba(15, 23, 42, 0.2),
            0 6px 14px rgba(15, 23, 42, 0.1);
    }
}
.team-card-media {
    position: relative;
    flex: 1 1 auto;
    min-height: 0;
    transition: flex 0.38s cubic-bezier(0.4, 0, 0.2, 1);
}
.team-card-photo {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
}
.team-card-gradient {
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(
        to top,
        rgba(0, 0, 0, 0.88) 0%,
        rgba(0, 0, 0, 0.45) 36%,
        rgba(0, 0, 0, 0.12) 55%,
        transparent 72%
    );
}
.team-card-caption {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 1.4rem 1.25rem 1.45rem;
    text-align: left;
    z-index: 2;
    transition: opacity 0.28s ease;
}
.team-card-name {
    margin: 0 0 0.4rem;
    font-family: "Playfair Display", Georgia, serif;
    font-size: clamp(1.02rem, 1.85vw, 1.32rem);
    font-weight: 700;
    line-height: 1.22;
    color: #fff;
}
.team-card-role {
    margin: 0;
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    font-size: clamp(0.68rem, 1vw, 0.78rem);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    color: #efd569;
}
.team-card-panel {
    flex: 0 0 0;
    min-height: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 0.45rem;
    padding: 0 1.35rem;
    background: #0b2e26;
    opacity: 0;
    transition:
        flex 0.38s cubic-bezier(0.4, 0, 0.2, 1),
        opacity 0.32s ease,
        padding 0.38s cubic-bezier(0.4, 0, 0.2, 1);
}
.team-card-panel-name {
    margin: 0;
    font-family: "Playfair Display", Georgia, serif;
    font-size: clamp(1rem, 1.75vw, 1.22rem);
    font-weight: 700;
    line-height: 1.22;
    color: #fff;
}
.team-card-panel-role {
    margin: 0;
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    font-size: clamp(0.66rem, 0.95vw, 0.76rem);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    color: #efd569;
}
.team-card-panel-msg {
    margin: 0.35rem 0 0;
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    font-size: clamp(0.78rem, 1.05vw, 0.88rem);
    font-weight: 400;
    line-height: 1.55;
    color: rgba(255, 255, 255, 0.94);
}
.team-card:hover .team-card-media,
.team-card:focus-within .team-card-media {
    flex: 0 0 52%;
}
.team-card:hover .team-card-panel,
.team-card:focus-within .team-card-panel {
    flex: 1 1 auto;
    opacity: 1;
    padding: 1.25rem 1.35rem 1.45rem;
}
.team-card:hover .team-card-caption,
.team-card:focus-within .team-card-caption {
    opacity: 0;
    pointer-events: none;
}
@media (max-width: 900px) {
    .team-cards-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .team-cards-grid.team-cards-grid--single .team-card-wrap {
        grid-column: 1;
        justify-self: stretch;
        width: 100%;
    }
}
@media (max-width: 600px) {
    .team-cards-grid {
        grid-template-columns: 1fr;
        max-width: 380px;
        margin-left: auto;
        margin-right: auto;
    }
    .team-cards-grid.team-cards-grid--single {
        margin-left: 0;
        margin-right: auto;
    }
    .team-cards-grid.team-cards-grid--single .team-card-wrap {
        grid-column: auto;
        justify-self: stretch;
        width: 100%;
    }
}

.about-page-biography {
    position: relative;
    background: linear-gradient(180deg, #f8fafc 0%, #eef3f8 100%);
    padding-bottom: 10rem;
    margin-bottom: 0;
}
.about-page-biography .container { max-width: 1180px; }
.about-section-gap {
    height: 230px;
    background-image: linear-gradient(rgba(16, 84, 58, 0.28), rgba(16, 84, 58, 0.28)), url("../../pictures/aboutus_bg.png");
    background-size: cover;
    background-position: center 20%;
    background-attachment: fixed;
}
.about-biography-head { margin-bottom: 1.25rem; }
.about-biography-head h1 {
    margin: 0;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: #3f4651;
    font-size: clamp(1.8rem, 3vw, 2.4rem);
    font-family: "Inter", Arial, sans-serif;
    font-weight: 600;
}
.about-biography-head p {
    margin: .35rem 0 0;
    color: #cf5a53;
    border-top: 1px solid rgba(214,95,88,.75);
    border-bottom: 1px solid rgba(214,95,88,.75);
    padding: .42rem 0;
    font-family: "Playfair Display", "Times New Roman", serif;
    font-size: clamp(1.05rem, 1.8vw, 1.4rem);
}
.about-biography-intro {
    display: grid;
    grid-template-columns: 390px 1fr;
    gap: 1.15rem;
    align-items: start;
    margin-bottom: 1.2rem;
}
.about-biography-photo img {
    width: 100%;
    height: 100%;
    min-height: 640px;
    object-fit: cover;
    object-position: center 18%;
    border-radius: 14px;
    border: 1px solid #dbe4ee;
    box-shadow: 0 14px 28px rgba(15, 23, 42, 0.1);
}
.about-biography-intro-text {
    column-count: 2;
    column-gap: 1.35rem;
    border-left: 1px dotted #a1a1aa;
    padding-left: 1rem;
    background: #fff;
    border-radius: 14px;
    border: 1px solid #dde6ef;
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.06);
    padding-top: 1rem;
    padding-right: 1rem;
    padding-bottom: .2rem;
}
.about-biography-intro-text p {
    break-inside: avoid;
    margin: 0 0 1.05rem;
    color: #4b5563;
    line-height: 1.7;
}
.about-biography-intro-text p:first-child::first-letter {
    float: left;
    font-family: "Playfair Display", "Times New Roman", serif;
    font-size: 4.1rem;
    line-height: .8;
    color: #de625a;
    margin-right: .35rem;
    margin-top: .1rem;
}
.about-biography-flow {
    display: grid;
    grid-template-columns: 1fr 320px;
    gap: 1.15rem;
    align-items: start;
}
.about-biography-flow-text {
    column-count: 2;
    column-gap: 1.35rem;
    background: #fff;
    border: 1px solid #dde6ef;
    border-radius: 14px;
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.06);
    padding: 1rem 1rem .2rem;
}
.about-biography-flow-text p {
    break-inside: avoid;
    margin: 0 0 .9rem;
    color: #4b5563;
    line-height: 1.7;
}
.about-biography-flow-images {
    display: grid;
    gap: .8rem;
}
.about-biography-flow-images img {
    width: 100%;
    height: 210px;
    object-fit: cover;
    border-radius: 12px;
    border: 1px solid #dbe4ee;
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.08);
}

@media (max-width: 1024px) {
    .grid-3 { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .hero { grid-template-columns: 1fr; }
    .footer-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .news-layout { grid-template-columns: 1fr; }
    .news-main,
    .news-side {
        max-height: none;
        overflow: visible;
        padding-right: 0;
    }
    .impact-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .about-story-grid, .about-legacy-grid { grid-template-columns: 1fr; }
    .about-page-biography {
        background-attachment: scroll;
        padding-bottom: 6rem;
        margin-bottom: 0;
    }
    .about-section-gap {
        height: 150px;
        background-attachment: scroll;
    }
    .about-legacy-section {
        margin-top: 0;
        border-top-left-radius: 16px;
        border-top-right-radius: 16px;
    }
    .about-story-columns { columns: 1; }
    .about-bio-hero { grid-template-columns: 1fr; }
    .about-wireframe-grid {
        grid-template-columns: 1fr;
        grid-template-areas:
            "main"
            "image"
            "quote"
            "followup";
    }
    .about-bio-left-stack { border-right: 0; padding-right: 0; }
    .about-intro-columns { column-count: 1; }
    .about-bio-right-stack { grid-template-rows: auto; }
    .about-bio-media-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .about-bio-newspaper { column-count: 1; }
    .about-bio-block, .about-bio-block-alt { grid-template-columns: 1fr; }
    .about-bio-block-alt .about-bio-image { order: 0; }
    .about-gallery-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .about-photo-card img { min-height: 380px; }
    .about-legacy-photo-wrap img { height: 300px; }
    .impact-slide { grid-template-columns: 1fr; }
    .impact-slide img { width: 150px; height: 150px; }
    .brand-logo { height: 56px; }
}
@media (max-width: 767px) {
    .grid-3, .grid-2, .footer-grid { grid-template-columns: 1fr; }
    .impact-grid { grid-template-columns: 1fr; }
    .about-story-card h1 { font-size: 1.8rem; }
    .about-legacy-copy h2 { font-size: 2rem; }
    .about-gallery-grid { grid-template-columns: 1fr; }
    .about-photo-card img { min-height: 320px; }
    .about-bio-image img { min-height: 300px; }
    .about-bio-image-lg img { min-height: 380px; }
    .about-bio-text p { font-size: .98rem; }
    .about-bio-followup-text { border-left: 0; padding-left: 0; }
    .about-bio-media-row { grid-template-columns: 1fr; }
    .about-biography-intro { grid-template-columns: 1fr; }
    .about-biography-photo img { min-height: 460px; }
    .about-biography-intro-text { column-count: 1; border-left: 0; padding-left: 0; }
    .about-biography-flow { grid-template-columns: 1fr; }
    .about-biography-flow-text { column-count: 1; }
    .about-biography-flow-images { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .about-biography-flow-images img { height: 170px; }
    .impact-slider { padding: 1rem 1rem 2.8rem; }
    .impact-slider-nav { top: auto; bottom: .65rem; transform: none; width: 34px; height: 34px; }
    .impact-slider-prev { left: .9rem; }
    .impact-slider-next { right: .9rem; }
    .impact-showcase-head p { letter-spacing: 2px; }
    .impact-showcase-head h2 { font-size: 2rem; }
    .impact-intro-card {
        border-radius: 14px;
        padding: 1.15rem .95rem 1.2rem;
    }
    .impact-intro-title {
        font-size: 1.75rem;
    }
    .impact-slide { grid-template-columns: 1fr; text-align: center; }
    .impact-slide img { width: 160px; height: 160px; }
    .reports-intro-nav {
        width: 38px;
        height: 38px;
    }
    .reports-intro-prev { left: 0.35rem; }
    .reports-intro-next { right: 0.35rem; }
    .reports-intro-slide {
        min-height: min(40vh, 220px);
        padding: 0.45rem 0.4rem;
    }
    .reports-intro-slide-frame {
        max-width: min(100%, 96vw);
        padding: 0.75rem 0.95rem;
        border-radius: 16px;
    }
    .reports-intro-slide-text {
        font-size: clamp(0.98rem, 4.2vw, 1.14rem);
        line-height: 1.68;
    }
    .reports-intro-slider-bleed {
        padding: 0 0.35rem;
    }
    .reports-intro-dots {
        bottom: 0.35rem;
    }
    .reports-strategic-panel,
    .reports-academic-panel {
        padding: 1.35rem 1rem;
        border-radius: 16px;
    }
    .reports-academic-panel {
        margin-top: 1.65rem;
    }
    .reports-pillar-card-top {
        flex-wrap: wrap;
    }
    .portal-layout:not(:has(.messages-portal-main)) { grid-template-columns: 1fr; max-height: none; overflow: visible; }
    .portal-layout:not(:has(.messages-portal-main)) .portal-main,
    .portal-layout:not(:has(.messages-portal-main)) .portal-sidebar { max-height: none; overflow: visible; position: static; }
    .dashboard-summary-grid { grid-template-columns: 1fr; }
    .site-nav { font-size: .92rem; justify-content: flex-start; gap: 1rem; }
    .site-nav-links { width: 100%; }
    .header-top-inner {
        grid-template-columns: 1fr;
        justify-items: center;
        gap: 0.8rem;
    }
    .header-social { justify-self: center; }
    .header-logo { order: -1; justify-self: center; }
    .header-apply { justify-self: center; }
    .brand-logo { height: 48px; }
    .header-title-banner {
        height: 152px;
        background-position: center 34%;
    }
    .banner-content-box {
        padding: 0.95rem 1.15rem;
        border-radius: 16px;
    }
    .header-title-overlay h1 { font-size: 1.45rem; letter-spacing: 0.12em; }
    .banner-divider {
        width: min(220px, 80vw);
        margin-top: 0.55rem;
    }
    .banner-subtitle {
        font-size: 0.68rem;
        letter-spacing: 0.14em;
        gap: 0.55rem;
        margin-top: 0.45rem;
    }
    .header-title-banner--reports .banner-content-box {
        padding: 1.05rem clamp(1rem, 4vw, 1.35rem) 1.15rem;
    }
    .header-title-banner--reports .banner-subtitle-marquee-seg {
        font-size: clamp(0.52rem, 2.8vw, 0.62rem);
        letter-spacing: 0.08em;
    }
    .header-title-banner--team .header-title-overlay h1 { font-size: 1.55rem; }
    .header-title-banner--team .banner-subtitle { font-size: 0.72rem; }
    .hero-video-content h1 { letter-spacing: 3px; }
    .hero-video-content p { letter-spacing: 3px; }
    .about-biography-photo img { min-height: 340px; }
    .about-biography-flow-images { grid-template-columns: 1fr; }
    .about-biography-flow-images img { height: 210px; }
}

/* Contact page — info card */
.contact-page-section {
    padding-top: 2.25rem;
    padding-bottom: 2.75rem;
}
.contact-page-grid {
    align-items: stretch;
    gap: 1.35rem;
}
.contact-info-card {
    padding: 1.75rem 1.85rem 1.9rem;
    border: 1px solid rgba(15, 108, 93, 0.12);
    box-shadow:
        0 4px 24px rgba(15, 23, 42, 0.06),
        0 1px 3px rgba(15, 23, 42, 0.04);
    background:
        linear-gradient(135deg, rgba(15, 108, 93, 0.04) 0%, transparent 42%),
        var(--card);
    position: relative;
    overflow: hidden;
}
.contact-info-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, var(--primary), #1a9b86, var(--primary-dark));
    opacity: 0.92;
}
.contact-info-title {
    margin: 0 0 0.65rem;
    font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    font-size: clamp(1.65rem, 3vw, 2rem);
    font-weight: 700;
    letter-spacing: -0.02em;
    color: #0f172a;
    line-height: 1.2;
}
.contact-info-lead {
    margin: 0 0 1.35rem;
    font-size: 1.02rem;
    line-height: 1.55;
    color: var(--muted);
    max-width: 36rem;
}
.contact-info-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.05rem;
}
.contact-info-item {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
    padding: 1.05rem 0;
    border-bottom: 1px solid rgba(221, 227, 234, 0.85);
}
.contact-info-item:last-child {
    border-bottom: 0;
    padding-bottom: 0;
}
.contact-info-item:first-of-type {
    padding-top: 0.15rem;
}
.contact-info-icon {
    flex-shrink: 0;
    width: 2.65rem;
    height: 2.65rem;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(145deg, #e8f5f2, #d8efe9);
    color: var(--primary-dark);
    font-size: 1.05rem;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8) inset;
}
.contact-info-body {
    min-width: 0;
    flex: 1;
    padding-top: 0.12rem;
}
.contact-info-label {
    display: block;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--primary-dark);
    margin-bottom: 0.35rem;
}
.contact-info-text {
    margin: 0;
    font-size: 1rem;
    line-height: 1.55;
    color: var(--text);
}
.contact-info-link {
    color: var(--primary-dark);
    font-weight: 600;
    text-decoration: none;
    border-bottom: 1px solid rgba(15, 108, 93, 0.35);
    transition: color 0.2s ease, border-color 0.2s ease, background-color 0.2s ease;
    padding-bottom: 1px;
}
.contact-info-link:hover {
    color: var(--primary);
    border-bottom-color: var(--primary);
    background-color: rgba(15, 108, 93, 0.06);
}
.contact-info-link:focus-visible {
    outline: 2px solid var(--primary);
    outline-offset: 3px;
    border-radius: 2px;
}
@media (max-width: 640px) {
    .contact-info-card {
        padding: 1.35rem 1.2rem 1.5rem;
    }
    .contact-info-item {
        gap: 0.85rem;
        padding: 0.9rem 0;
    }
    .contact-info-icon {
        width: 2.4rem;
        height: 2.4rem;
        font-size: 0.95rem;
    }
}

.scholarship-page {
    background: #f4f5f6;
}
.full-articles-section .container {
    width: min(1440px, 98%);
}
.full-articles-board {
    display: grid;
    grid-template-columns: minmax(260px, 1fr) minmax(700px, 2.45fr) minmax(260px, 1fr);
    gap: .5rem;
    align-items: start;
}
.full-articles-column {
    max-height: calc(100vh - 180px);
    overflow-y: auto;
    padding: .7rem;
}
.full-articles-heading {
    margin: 0 0 .25rem;
    color: #102433;
}
.full-articles-panel-title {
    margin: 0 0 .25rem;
    color: #102433;
}
.full-articles-panel-toggle {
    display: none;
}
.full-articles-panel__body {
    margin-top: .9rem;
}
.full-articles-panel-toggle-label {
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    font-weight: 700;
    color: #102433;
}
.full-articles-panel-toggle-meta {
    flex: 1 1 auto;
    min-width: 0;
    text-align: right;
    font-size: .82rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding: 0 .35rem;
}
.full-articles-panel-chevron {
    color: #64748b;
    transition: transform .2s ease;
}
.full-articles-panel.is-open .full-articles-panel-chevron {
    transform: rotate(180deg);
}
.full-articles-main {
    min-width: 0;
}
.full-articles-papers {
    gap: 1rem;
}
.full-articles-list {
    display: grid;
    gap: .8rem;
    margin-top: .9rem;
}
.full-article-mini {
    background: #f8fafd;
    border: 1px solid #dbe4ef;
    border-radius: 10px;
    padding: .7rem .75rem;
}
.full-category-item {
    cursor: pointer;
    transition: background-color .2s ease, border-color .2s ease, transform .2s ease;
}
.full-category-item:hover {
    background: #eef4fb;
    border-color: #c4d3e3;
    transform: translateY(-1px);
}
.full-category-item.active {
    background: #e6f5f2;
    border-color: rgba(15, 108, 93, 0.35);
}
.full-article-mini h4 {
    margin: 0 0 .2rem;
    font-size: .98rem;
}
.full-article-mini .muted {
    margin: 0;
}
.full-article-tile {
    border: 1px solid #dbe4ef;
    border-radius: 12px;
    background: #fff;
    padding: .75rem;
    box-shadow: 0 4px 14px rgba(16, 36, 51, .06);
}
.full-article-tile h4 {
    margin: 0 0 .3rem;
    color: #113f36;
}
.full-article-tile p {
    margin: .2rem 0;
    line-height: 1.5;
}
.full-article-tile .btn {
    margin-top: .55rem;
}
.full-article-tile .paper-extra {
    display: grid;
    gap: .35rem;
}
.paper-controls {
    display: grid;
    grid-template-columns: minmax(120px, auto) minmax(150px, 1fr) minmax(170px, 1fr);
    gap: .55rem;
    align-items: center;
    margin-top: .4rem;
}
.paper-action-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .45rem;
    border-radius: 999px;
    padding: .5rem .95rem;
    font-weight: 600;
    border: 1px solid transparent;
    transition: transform .2s ease, box-shadow .2s ease, background-color .2s ease, color .2s ease, border-color .2s ease;
}
.paper-action-btn:hover {
    transform: translateY(-1px);
}
.paper-action-btn--read {
    background: linear-gradient(135deg, #0f6c5d, #115f80);
    color: #fff;
    box-shadow: 0 8px 16px rgba(15, 108, 93, .22);
}
.paper-action-btn--read:hover {
    background: linear-gradient(135deg, #0d5f52, #0f526e);
    color: #fff;
}
.paper-action-btn--download {
    background: #fff;
    color: #0f6c5d;
    border-color: rgba(15, 108, 93, .35);
    box-shadow: 0 6px 14px rgba(16, 36, 51, .08);
}
.paper-action-btn--download:hover {
    background: #eef9f6;
    color: #0d5f52;
    border-color: rgba(15, 108, 93, .55);
}
.paper-action-btn--toggle {
    justify-self: start;
}
.paper-engagement {
    display: flex;
    gap: .85rem;
    margin-top: .55rem;
    flex-wrap: wrap;
    align-items: center;
}
.paper-engage-btn {
    appearance: none;
    border: 0;
    background: transparent;
    color: #1f2937;
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    padding: .2rem .1rem;
    cursor: pointer;
    font-size: 1rem;
    line-height: 1;
    transition: color .2s ease, transform .2s ease;
}
.paper-engage-btn i {
    font-size: 1.15rem;
}
.paper-engage-btn span {
    font-weight: 600;
    font-size: .98rem;
}
.paper-engage-btn strong {
    font-size: .92rem;
    color: #6b7280;
    font-weight: 600;
}
.paper-engage-btn:hover {
    transform: translateY(-1px);
}
.paper-engage-like {
    color: #dc2626;
}
.paper-engage-like:hover {
    color: #b91c1c;
}
.paper-engage-like.is-liked {
    color: #b91c1c;
}
.paper-engage-share {
    color: #0f766e;
}
.paper-engage-share:hover {
    color: #0d5f52;
}
.full-article-tile.is-collapsed .paper-extra {
    display: none;
}
@media (max-width: 767px) {
    .paper-controls {
        grid-template-columns: 1fr;
    }
    .paper-action-btn--toggle {
        justify-self: stretch;
    }
    .paper-engagement {
        gap: .7rem;
    }
}
.recent-paper-link {
    font-weight: 600;
    line-height: 1.45;
    display: inline-block;
    color: #113f36;
}
.recent-paper-link:hover {
    color: #0f6c5d;
    text-decoration: underline;
}
.timeline-post-card {
    display: grid;
    gap: .8rem;
    padding: 1.1rem 1.15rem;
}
.timeline-post-title {
    margin: 0;
    line-height: 1.35;
}
.timeline-post-card > a.btn {
    justify-self: start;
    margin-top: .1rem;
}
.timeline-post-meta {
    margin-top: .1rem;
}
.timeline-post-engage {
    margin-top: .35rem;
    display: grid;
    gap: .35rem;
}
.timeline-post-engage-bar {
    display: flex;
    align-items: center;
    gap: .35rem;
}
.timeline-ig-btn {
    margin: 0;
    padding: .35rem;
    border: none;
    background: transparent;
    color: #262626;
    cursor: pointer;
    border-radius: 50%;
    line-height: 1;
    transition: opacity .15s ease, transform .12s ease;
}
.timeline-ig-btn i {
    font-size: 1.35rem;
    display: block;
}
.timeline-ig-btn:hover {
    opacity: .55;
}
.timeline-ig-btn:active {
    transform: scale(.92);
}
.timeline-ig-btn:focus-visible {
    outline: 2px solid var(--primary);
    outline-offset: 2px;
}
.timeline-post-engage-stats {
    font-size: .82rem;
    font-weight: 600;
    color: #262626;
    letter-spacing: .01em;
}
.scholarship-content {
    display: grid;
    gap: 1.6rem;
}
.scholarship-content > .card h1,
.scholarship-content > .card h2 {
    text-align: center;
    color: #113f36;
}
.scholarship-content > .card > p {
    text-align: center;
}
.scholarship-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1rem;
    margin-top: 1rem;
}
.scholarship-item {
    border-radius: 14px;
    box-shadow: 0 8px 20px rgba(14, 53, 45, 0.06);
    border: 1px solid #eef1f4;
    transition: transform .25s ease, box-shadow .25s ease;
}
.scholarship-item:hover {
    transform: translateY(-4px);
    box-shadow: 0 14px 28px rgba(14, 53, 45, 0.12);
}
.scholarship-thumb {
    width: 46px;
    height: 46px;
    border-radius: 50%;
    display: inline-grid;
    place-items: center;
    background: #f3f7f6;
    color: #0f5b4d;
    font-size: 1.1rem;
    margin-bottom: .55rem;
}
.scholarship-item h3 {
    margin-top: 0;
    color: #113f36;
    font-size: 1.06rem;
}
.scholarship-item p {
    margin-bottom: 0;
}
.scholarship-item ul {
    margin: .4rem 0 .2rem 1.1rem;
    padding: 0;
}
.scholarship-apply-panel {
    display: grid;
    grid-template-columns: 1.05fr .95fr;
    gap: 1.2rem;
    background: linear-gradient(135deg, #0a4b3f, #0a3f36);
    padding: 1.8rem;
    border-radius: 16px;
}
.scholarship-apply-copy {
    color: #f4faf8;
}
.scholarship-apply-copy h2 {
    color: #ffe7a0;
    margin: 0;
}
.scholarship-apply-copy h3 {
    color: #ffd04d;
    text-transform: uppercase;
    letter-spacing: 1px;
}
.scholarship-apply-copy p,
.scholarship-apply-copy li {
    color: #e8f3ef;
}
.scholarship-apply-copy ul {
    margin: .8rem 0;
    padding-left: 1.1rem;
}
.scholarship-apply-quote {
    margin: 1rem 0 0;
    padding: .9rem 1rem;
    border-left: 3px solid #ffd04d;
    background: rgba(255, 255, 255, 0.08);
    border-radius: 10px;
    font-style: italic;
}
.scholarship-apply-card {
    background: #ffffff;
    border-radius: 14px;
    padding: 1.4rem;
    text-align: center;
}
.scholarship-apply-card h3 {
    margin-top: 0;
    color: #113f36;
    font-size: 1.8rem;
}
.scholarship-apply-card p {
    margin: .7rem 0;
}
.scholarship-apply-btn {
    background: #f4b400;
    color: #112b25;
    border-color: #f4b400;
    min-width: 220px;
    font-weight: 700;
    box-shadow: 0 10px 18px rgba(244, 180, 0, 0.22);
}
.scholarship-apply-btn:disabled,
.scholarship-apply-btn.scholarship-apply-btn--locked {
    opacity: 0.68;
    cursor: not-allowed;
    box-shadow: none;
    filter: grayscale(0.25);
}
.scholarship-closed-notice {
    margin: 0.5rem 0 0.35rem;
    font-weight: 600;
    color: #6b4b12;
}
.scholarship-admin-toggle {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    cursor: pointer;
    font-weight: 600;
    color: #113f36;
}
.scholarship-admin-toggle input {
    width: auto;
    margin: 0;
    flex-shrink: 0;
}
.scholarship-we-dey {
    font-weight: 700;
    color: #113f36;
}
.scholarship-modal-overlay {
    position: fixed;
    inset: 0;
    display: none;
    place-items: center;
    background: rgba(5, 19, 16, 0.7);
    z-index: 9500;
    padding: 1rem;
}
.scholarship-modal {
    width: min(640px, 94vw);
    position: relative;
    border-radius: 18px;
    padding: .95rem 1.05rem .85rem;
}
.scholarship-modal h2 {
    text-align: center;
    color: #113f36;
    font-size: clamp(1.7rem, 2.8vw, 2.5rem);
    margin-top: 0;
    margin-bottom: .45rem;
}
.scholarship-modal > p {
    text-align: center;
    margin-bottom: .55rem;
    color: #4a4f57;
    font-size: .95rem;
}
.scholarship-modal-close {
    position: absolute;
    top: .5rem;
    right: .8rem;
    background: transparent;
    border: 0;
    font-size: 2.3rem;
    line-height: 1;
    color: #6a6f75;
    cursor: pointer;
}
.scholarship-modal input {
    width: 100%;
    padding: .62rem .78rem;
    border: 1px solid #d6dbe1;
    border-radius: 10px;
    font-size: .95rem;
    margin-top: .28rem;
}
.scholarship-captcha-box {
    border: 1px dashed #ced4dc;
    border-radius: 10px;
    padding: .55rem;
}
.scholarship-captcha-question {
    background: #f1f1f1;
    border-radius: 8px;
    padding: .46rem .65rem;
    min-width: 100px;
    text-align: center;
    font-size: 1.5rem;
    font-weight: 700;
    color: #4f5155;
}
#scholarship_captcha_answer {
    max-width: 110px;
    margin-top: 0;
}
.scholarship-submit-btn {
    width: 100%;
    margin-top: .3rem;
    border-radius: 10px;
    font-size: .98rem;
    padding: .68rem .82rem;
    font-weight: 700;
    display: block;
    background: #0b4d40;
    border-color: #0b4d40;
}
.scholarship-modal .form-row {
    margin-bottom: .65rem;
}
.scholarship-modal .form-row label {
    font-size: .9rem;
}
.scholarship-submit-btn:hover {
    background: #093c33;
    border-color: #093c33;
}
.scholarship-external {
    text-align: center;
}
.scholarship-external p {
    max-width: 760px;
    margin-left: auto;
    margin-right: auto;
}
.scholarship-page .btn,
.scholarship-modal .btn {
    position: relative;
    overflow: hidden;
    transition: transform .28s cubic-bezier(.2, .75, .28, 1), box-shadow .28s ease, background-color .28s ease, border-color .28s ease, color .28s ease;
}
.scholarship-page .btn::before,
.scholarship-modal .btn::before {
    content: "";
    position: absolute;
    top: 0;
    left: -130%;
    width: 60%;
    height: 100%;
    background: linear-gradient(110deg, transparent 0%, rgba(255,255,255,.36) 50%, transparent 100%);
    transition: left .55s ease;
}
.scholarship-page .btn:hover,
.scholarship-modal .btn:hover {
    transform: translateY(-3px);
    box-shadow: 0 14px 24px rgba(8, 45, 38, 0.24);
}
.scholarship-page .btn:hover::before,
.scholarship-modal .btn:hover::before {
    left: 150%;
}
.scholarship-page .btn:active,
.scholarship-modal .btn:active {
    transform: translateY(-1px) scale(.985);
    box-shadow: 0 8px 14px rgba(8, 45, 38, 0.2);
}
.scholarship-page .btn:focus-visible,
.scholarship-modal .btn:focus-visible {
    outline: 0;
    box-shadow: 0 0 0 3px rgba(15, 108, 93, .18), 0 10px 20px rgba(8, 45, 38, 0.18);
}
.scholarship-page .btn.btn-outline:hover {
    background: #0f6c5d;
    color: #fff;
    border-color: #0f6c5d;
}
.scholarship-apply-btn:hover {
    background: #dca000;
    border-color: #dca000;
    color: #102722;
}
.scholarship-submit-btn:hover {
    background: #0a5b4b;
    border-color: #0a5b4b;
}
@media (min-width: 1024px) {
    .full-articles-panel-toggle {
        display: none;
    }
    .full-articles-panel::before {
        content: attr(data-panel-label);
        display: block;
        font-size: 1rem;
        font-weight: 700;
        color: #102433;
        margin: 0 0 .25rem;
        padding: .7rem .7rem 0;
    }
    #full-articles-left::before {
        content: 'Categories';
    }
    #full-articles-right::before {
        content: 'Recently Added Papers';
    }
    .full-articles-panel__body {
        display: grid !important;
        padding: 0 .7rem .7rem;
        margin-top: .9rem;
    }
    .full-articles-panel__body[hidden] {
        display: grid !important;
    }
    .full-articles-panel-toggle-meta {
        display: none;
    }
}
@media (max-width: 980px) {
    .full-articles-board {
        grid-template-columns: 1fr;
    }
    .full-articles-column {
        max-height: none;
        overflow: visible;
    }
    .scholarship-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .scholarship-apply-panel { grid-template-columns: 1fr; }
}
@media (max-width: 767px) {
    .scholarship-grid { grid-template-columns: 1fr; }
    .scholarship-modal { padding: .9rem; width: min(560px, 95vw); }
    .scholarship-captcha-question { font-size: 1.6rem; min-width: 100px; }
}

/* —— Home page (modern layout) —— */
.page-home {
    font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
}
.home-founder-section {
    padding-top: 2.25rem;
    padding-bottom: 2rem;
    background: var(--bg);
}
.home-founder-card {
    display: grid;
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
    gap: 0;
    align-items: stretch;
    background: #eae8e1;
    border-radius: 20px;
    overflow: hidden;
    box-shadow:
        0 4px 6px rgba(27, 48, 34, 0.06),
        0 18px 40px rgba(27, 48, 34, 0.08);
    transition:
        transform 0.45s cubic-bezier(0.2, 0.75, 0.28, 1),
        box-shadow 0.45s ease;
}
.home-founder-card:hover {
    transform: translateY(-4px);
    box-shadow:
        0 8px 12px rgba(27, 48, 34, 0.08),
        0 28px 56px rgba(27, 48, 34, 0.12);
}
.home-founder-media {
    min-height: 0;
    background: #3d3429;
    position: relative;
    overflow: hidden;
}
@media (min-width: 981px) {
    .home-founder-media img {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center top;
    }
}
.home-founder-copy {
    min-width: 0;
    width: 100%;
    padding: clamp(2rem, 4.5vw, 3.25rem) clamp(1.75rem, 4.5vw, 3.5rem);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: stretch;
    text-align: left;
    position: relative;
    isolation: isolate;
    background:
        repeating-linear-gradient(
            to bottom,
            rgba(92, 141, 201, 0.26) 0,
            rgba(92, 141, 201, 0.26) 2px,
            transparent 2px,
            transparent 2.2rem
        ),
        linear-gradient(to right, #d67a7a 0 2px, transparent 2px);
    background-color: #fffef7;
    background-size: 100% 2.2rem, 100% 100%;
    background-position: 0 1.25rem, 2rem 0;
}
.home-founder-copy::before {
    content: "";
    position: absolute;
    inset: 0;
    border-left: 2px solid rgba(214, 122, 122, 0.65);
    left: 2rem;
    pointer-events: none;
    z-index: -1;
}
.home-founder-title {
    margin: 0 0 0.45rem;
    font-family: "Caveat", "Segoe Print", "Bradley Hand", cursive;
    font-size: clamp(2.15rem, 4.2vw, 3.15rem);
    font-weight: 700;
    color: #1b3022;
    line-height: 1;
    letter-spacing: 0.01em;
    text-align: center;
    align-self: center;
    min-height: 4.4rem;
    display: flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
}
.home-founder-sub {
    margin: 0 0 1.1rem;
    font-size: clamp(1.05rem, 1.35vw, 1.2rem);
    font-weight: 600;
    color: #708264;
    letter-spacing: 0.04em;
    font-family: "Caveat", "Segoe Print", "Bradley Hand", cursive;
    text-align: center;
    align-self: center;
    line-height: 2.2rem;
}
.home-founder-body {
    margin: 0 0 1.4rem;
    font-size: clamp(1.08rem, 1.35vw, 1.28rem);
    line-height: 2.2rem;
    color: var(--text);
    width: 100%;
    max-width: none;
    font-family: "Caveat", "Segoe Print", "Bradley Hand", cursive;
    padding-top: 0.8rem;
}
.home-founder-signature {
    margin: 0 0 1.65rem;
    font-family: "Caveat", "Segoe Print", "Bradley Hand", cursive;
    font-size: clamp(1.15rem, 2.2vw, 1.5rem);
    font-weight: 700;
    color: #1b3022;
    letter-spacing: 0.02em;
    line-height: 1.35;
}
.home-founder-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    align-self: center;
    padding: 0.82rem 1.85rem;
    border-radius: 999px;
    background: #ffb800;
    color: #0f0f0f;
    font-weight: 600;
    font-size: clamp(1rem, 1.1vw, 1.08rem);
    text-decoration: none;
    border: none;
    box-shadow: 0 4px 14px rgba(255, 184, 0, 0.35);
    transition:
        transform 0.25s cubic-bezier(0.34, 1.56, 0.64, 1),
        box-shadow 0.25s ease,
        background-color 0.2s ease,
        color 0.2s ease;
    min-height: 4.4rem;
    min-width: 10.5rem;
    text-align: center;
    line-height: 1;
    white-space: nowrap;
}
.home-founder-cta:hover {
    background: #e6a500;
    color: #0a0a0a;
    transform: translateY(-2px);
    box-shadow: 0 8px 22px rgba(255, 184, 0, 0.45);
}
.home-founder-cta:focus-visible {
    outline: 0;
    box-shadow: 0 0 0 3px rgba(27, 48, 34, 0.25), 0 4px 14px rgba(255, 184, 0, 0.35);
}
.home-eyebrow {
    display: inline-block;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--primary);
    margin-bottom: 0.85rem;
}
.home-eyebrow-muted {
    color: #3d8a7c;
}
.home-story-section {
    padding-top: 2.5rem;
    background: var(--home-section-offwhite);
}
.home-story-section .home-section-head {
    text-align: center;
    margin-left: auto;
    margin-right: auto;
}
.home-section-head {
    max-width: 640px;
    margin-bottom: 2rem;
}
.home-section-head h2 {
    margin: 0 0 0.6rem;
    font-size: clamp(1.55rem, 3vw, 2.1rem);
    letter-spacing: -0.02em;
    color: #0f172a;
}
.home-section-deck {
    margin: 0;
    color: var(--muted);
    font-size: 1.02rem;
    line-height: 1.55;
}
.home-story-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.15rem;
}
.home-story-card {
    padding: 0;
    overflow: hidden;
    border: 1px solid rgba(221, 227, 234, 0.95);
    border-radius: 18px;
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.home-story-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 40px rgba(15, 23, 42, 0.1);
}
.home-story-media {
    aspect-ratio: 16 / 11;
    overflow: hidden;
    background: #eef2f7;
}
.home-story-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
    transition: transform 0.5s cubic-bezier(0.2, 0.75, 0.28, 1);
}
.home-story-card:hover .home-story-media img {
    transform: scale(1.04);
}
.home-story-card h3 {
    margin: 1rem 1.15rem 0.35rem;
    font-size: 1.15rem;
}
.home-story-card p {
    margin: 0 1.15rem 1.15rem;
    color: var(--muted);
    font-size: 0.95rem;
    line-height: 1.55;
}
.home-mv-section {
    padding-top: 3rem;
    padding-bottom: 1rem;
    background: var(--home-section-offwhite);
}
.home-mv-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.35rem;
    align-items: stretch;
}
.home-mv-card {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
    padding: 1.15rem 1.2rem;
}
.home-mv-card > p {
    margin: 0;
    color: var(--muted);
    font-size: 0.98rem;
    line-height: 1.62;
}
.home-mv-heading-row {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin: 0;
}
.home-mv-thumb {
    flex-shrink: 0;
    width: 88px;
    height: 88px;
    border-radius: 14px;
    overflow: hidden;
    background: #e8eef4;
    border: 1px solid var(--border);
}
.home-mv-thumb--icon {
    display: grid;
    place-items: center;
    background: linear-gradient(145deg, #e6f5f2 0%, #eef8f6 100%);
    border-color: rgba(15, 108, 93, 0.2);
}
.home-mv-thumb--icon i {
    font-size: 1.65rem;
    color: var(--primary);
}
.home-mv-thumb--vision {
    background: linear-gradient(145deg, #fff9e6 0%, #fdf6ee 100%);
    border-color: rgba(184, 134, 11, 0.28);
}
.home-mv-thumb--vision i {
    color: #b8860b;
}
.home-mv-label {
    margin: 0;
    font-size: 1.35rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: #0f172a;
    line-height: 1.2;
}
.home-key-elements-section {
    padding-top: 2.75rem;
    padding-bottom: 3rem;
    background: #fff;
}
.home-key-elements-title {
    margin: 0 0 2.25rem;
    text-align: center;
    font-family: "Playfair Display", "Times New Roman", Georgia, serif;
    font-size: clamp(1.85rem, 3.5vw, 2.35rem);
    font-weight: 700;
    color: var(--primary);
    letter-spacing: 0.02em;
}
.home-key-elements-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(1.25rem, 3vw, 2.5rem);
    align-items: stretch;
}
.home-key-element {
    text-align: center;
    padding: 1.75rem 1.25rem 2rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
    border-radius: 16px;
    transition:
        transform 0.4s cubic-bezier(0.2, 0.75, 0.28, 1),
        box-shadow 0.4s ease,
        background-color 0.35s ease;
    box-shadow: 0 0 0 transparent;
}
.home-key-element:hover {
    transform: translateY(-10px);
    box-shadow: 0 20px 40px rgba(15, 108, 93, 0.1);
}
.home-key-element:not(.home-key-element--featured):hover {
    background: rgba(15, 108, 93, 0.045);
}
.home-key-element--featured {
    background: #f7f0e6;
    border: 1px solid rgba(15, 108, 93, 0.12);
    border-radius: 16px;
    box-shadow: 0 4px 20px rgba(15, 23, 42, 0.04);
    padding: 2rem 1.35rem 2.25rem;
    transition:
        transform 0.4s cubic-bezier(0.2, 0.75, 0.28, 1),
        box-shadow 0.4s ease,
        border-color 0.35s ease;
}
.home-key-element--featured:hover {
    transform: translateY(-10px);
    box-shadow:
        0 24px 48px rgba(15, 108, 93, 0.12),
        0 8px 24px rgba(15, 23, 42, 0.06);
    border-color: rgba(15, 108, 93, 0.22);
}
.home-key-element-thumb {
    width: 76px;
    height: 76px;
    border-radius: 20px;
    display: grid;
    place-items: center;
    margin-bottom: 0.1rem;
    line-height: 1;
    flex-shrink: 0;
    box-sizing: border-box;
    background: linear-gradient(152deg, #f4fbf9 0%, #e8f5f2 42%, #dff0ec 100%);
    border: 2px solid rgba(15, 108, 93, 0.22);
    box-shadow:
        0 8px 22px rgba(15, 108, 93, 0.1),
        inset 0 1px 0 rgba(255, 255, 255, 0.88);
    font-size: 1.72rem;
    color: var(--primary);
    transition:
        transform 0.45s cubic-bezier(0.34, 1.15, 0.64, 1),
        box-shadow 0.4s ease,
        border-color 0.35s ease,
        color 0.3s ease,
        background 0.35s ease;
}
.home-key-element:hover .home-key-element-thumb {
    transform: scale(1.08) translateY(-4px);
    border-color: rgba(15, 108, 93, 0.42);
    box-shadow:
        0 16px 36px rgba(15, 108, 93, 0.18),
        0 0 0 1px rgba(255, 255, 255, 0.6) inset;
    color: var(--primary-dark);
    background: linear-gradient(152deg, #f6fcfa 0%, #ecf6f3 45%, #e2f0ec 100%);
}
.home-key-element-thumb--bullseye {
    position: relative;
}
.home-key-element-thumb--bullseye > .fa-regular.fa-circle {
    font-size: 1.72rem;
    color: var(--primary);
    line-height: 1;
    transition: color 0.3s ease;
}
.home-key-element-thumb-dot {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    font-size: 0.55rem;
    color: var(--primary);
    pointer-events: none;
    line-height: 1;
    transition: color 0.3s ease;
}
.home-key-element:hover .home-key-element-thumb--bullseye > .fa-regular.fa-circle,
.home-key-element:hover .home-key-element-thumb-dot {
    color: var(--primary-dark);
}
.home-key-element h3 {
    margin: 0;
    font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
    font-size: 1.12rem;
    font-weight: 700;
    color: var(--primary);
}
.home-key-element p {
    margin: 0;
    max-width: 280px;
    font-size: 0.97rem;
    line-height: 1.6;
    color: var(--muted);
}
.home-key-element--featured p {
    max-width: 300px;
}
@media (prefers-reduced-motion: reduce) {
    .home-founder-card,
    .home-founder-cta {
        transition: none;
    }
    .home-founder-card:hover {
        transform: none;
    }
    .home-founder-cta:hover {
        transform: none;
    }
    .home-key-element,
    .home-key-element--featured,
    .home-key-element-thumb,
    .home-key-element-thumb--bullseye > .fa-regular.fa-circle,
    .home-key-element-thumb-dot {
        transition: none;
    }
    .home-key-element:hover,
    .home-key-element--featured:hover {
        transform: none;
        box-shadow: none;
    }
    .home-key-element:not(.home-key-element--featured):hover {
        background: transparent;
    }
    .home-key-element--featured:hover {
        border-color: rgba(15, 108, 93, 0.12);
    }
    .home-key-element:hover .home-key-element-thumb {
        transform: none;
    }
    .home-key-element:hover .home-key-element-thumb--bullseye > .fa-regular.fa-circle,
    .home-key-element:hover .home-key-element-thumb-dot {
        color: var(--primary);
    }
}
@media (max-width: 1100px) {
    .home-story-grid {
        grid-template-columns: 1fr;
    }
    .home-story-media {
        aspect-ratio: 21 / 9;
    }
}
/* Home — Management View (carousel, aligned with portal copy) */
.home-management-section {
    padding-top: 2.5rem;
    padding-bottom: 3.25rem;
    background: linear-gradient(180deg, #f8fafc 0%, #eef2f7 100%);
}
.home-management-title {
    margin: 0 0 1.75rem;
    text-align: center;
    font-family: "Playfair Display", "Times New Roman", Georgia, serif;
    font-size: clamp(1.85rem, 3.5vw, 2.35rem);
    font-weight: 700;
    color: var(--primary);
    letter-spacing: 0.02em;
}
.home-management-carousel {
    display: flex;
    align-items: stretch;
    gap: 0.65rem;
    max-width: 1200px;
    margin: 0 auto;
}
.home-management-viewport {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    border-radius: 12px;
}
.home-management-track {
    display: flex;
    flex-direction: row;
    gap: 1.25rem;
    list-style: none;
    margin: 0;
    padding: 0.25rem 0 0.5rem;
    transition: transform 0.45s ease;
    will-change: transform;
}
@media (prefers-reduced-motion: reduce) {
    .home-management-track {
        transition: none;
    }
}
.home-management-slide {
    flex: 0 0 auto;
    width: min(318px, calc(100vw - 5.25rem));
    min-width: 0;
    display: flex;
    align-items: stretch;
}
.home-management-card {
    width: 100%;
    min-height: clamp(22.5rem, 52vh, 27rem);
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 1.5rem 1.35rem 1.45rem;
    border-radius: 18px;
    border: 1px solid rgba(221, 227, 234, 0.95);
    background: #fff;
    transition: transform 0.25s ease, box-shadow 0.25s ease;
    box-sizing: border-box;
}
.home-management-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 18px 36px rgba(15, 23, 42, 0.09);
}
.home-management-photo {
    width: 132px;
    height: 132px;
    border-radius: 50%;
    overflow: hidden;
    background: #e8eef4;
    border: 3px solid rgba(15, 108, 93, 0.15);
    margin-bottom: 1.1rem;
    flex-shrink: 0;
}
.home-management-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
    display: block;
}
.home-management-name {
    margin: 0 0 0.4rem;
    padding: 0 0.25rem;
    font-size: 1.06rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.3;
    max-width: 100%;
    text-wrap: balance;
}
.home-management-role {
    margin: 0 0 1rem;
    padding: 0 0.25rem;
    font-size: 0.78rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: var(--primary-dark);
    line-height: 1.35;
}
.home-management-quote {
    margin: 0;
    margin-top: auto;
    padding: 0;
    border: 0;
    width: 100%;
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    min-height: 0;
}
.home-management-quote p {
    margin: 0;
    width: 100%;
    padding: 1rem 1.05rem 1.05rem;
    font-size: 0.9rem;
    line-height: 1.62;
    letter-spacing: 0.01em;
    color: #475569;
    text-align: center;
    text-wrap: pretty;
    background: #f4f7f9;
    border-radius: 12px;
    border: 1px solid rgba(148, 163, 184, 0.22);
    box-sizing: border-box;
}
.home-management-nav {
    flex-shrink: 0;
    align-self: center;
    width: 2.75rem;
    height: 2.75rem;
    border-radius: 10px;
    border: 1px solid rgba(15, 108, 93, 0.35);
    background: #fff;
    color: var(--primary-dark);
    font-size: 1.25rem;
    line-height: 1;
    cursor: pointer;
    display: grid;
    place-items: center;
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.home-management-nav:hover {
    background: var(--primary);
    color: #fff;
    border-color: var(--primary);
}
.home-management-nav:focus-visible {
    outline: 2px solid var(--primary);
    outline-offset: 2px;
}
@media (min-width: 720px) {
    .home-management-slide {
        width: min(360px, calc(50vw - 3.5rem));
    }
}
@media (min-width: 1100px) {
    .home-management-slide {
        width: 340px;
    }
}
@media (max-width: 640px) {
    .home-management-carousel {
        gap: 0.35rem;
    }
    .home-management-nav {
        width: 2.35rem;
        height: 2.35rem;
        font-size: 1.1rem;
    }
}
@media (max-width: 980px) {
    .home-founder-card {
        grid-template-columns: 1fr;
    }
    .home-founder-media {
        min-height: 220px;
    }
    .home-founder-media img {
        position: static;
        display: block;
        width: 100%;
        height: auto;
        min-height: 220px;
        max-height: 55vh;
        object-fit: cover;
        object-position: center 20%;
    }
    .home-founder-copy {
        align-items: stretch;
        text-align: center;
        background-position: 0 1.15rem, 1.25rem 0;
    }
    .home-founder-cta {
        align-self: center;
    }
    .home-mv-grid {
        grid-template-columns: 1fr;
    }
    .home-key-elements-grid {
        grid-template-columns: 1fr;
        max-width: 420px;
        margin: 0 auto;
    }
}

/* —— Support page —— */
.support-page {
    font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}

/* "Why your support matters?" — plain surface, elevated cards */
.support-matters {
    position: relative;
    padding-top: clamp(2.85rem, 5.5vw, 4.25rem);
    padding-bottom: clamp(3.1rem, 5.5vw, 4.75rem);
    background: #f4f5f7;
}
.support-matters-inner {
    position: relative;
    z-index: 1;
    max-width: 1080px;
    margin: 0 auto;
    text-align: center;
}
.support-matters-head {
    max-width: 52rem;
    margin: 0 auto clamp(1.85rem, 3.2vw, 2.5rem);
}
.support-matters-title {
    margin: 0 0 0.9rem;
    font-family: "Playfair Display", Georgia, serif;
    font-size: clamp(1.95rem, 3.9vw, 2.7rem);
    font-weight: 700;
    color: #0f172a;
    line-height: 1.16;
    letter-spacing: -0.025em;
}
.support-matters-lead {
    margin: 0;
    color: #475569;
    font-size: clamp(1.01rem, 1.2vw, 1.1rem);
    line-height: 1.68;
    font-weight: 400;
}
.support-matters-grid {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: clamp(1.2rem, 2.6vw, 1.95rem);
    text-align: center;
}
.support-matters-card {
    margin: 0;
    padding: clamp(1.6rem, 2.6vw, 2rem) clamp(1.2rem, 2.1vw, 1.5rem);
    border-radius: 14px;
    border: 1px solid #e8ecf0;
    background: #ffffff;
    box-shadow:
        0 2px 4px rgba(15, 23, 42, 0.04),
        0 12px 36px rgba(15, 23, 42, 0.07);
    transition: box-shadow 0.3s ease, transform 0.3s ease, border-color 0.25s ease;
}
.support-matters-card:hover {
    border-color: #dde3e9;
    box-shadow:
        0 4px 8px rgba(15, 23, 42, 0.05),
        0 20px 48px rgba(15, 23, 42, 0.11);
    transform: translateY(-4px);
}
.support-matters-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 3.5rem;
    height: 3.5rem;
    margin: 0 auto 1.1rem;
    font-size: 1.45rem;
    color: #b8860b;
    background: linear-gradient(145deg, rgba(212, 160, 18, 0.14) 0%, rgba(212, 160, 18, 0.06) 100%);
    border-radius: 50%;
    border: 1px solid rgba(212, 160, 18, 0.22);
    box-shadow: 0 1px 2px rgba(255, 255, 255, 0.9) inset;
}
.support-matters-card-title {
    margin: 0 0 0.65rem;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: #0f172a;
    line-height: 1.4;
}
.support-matters-card-text {
    margin: 0;
    color: #64748b;
    font-size: 0.9375rem;
    line-height: 1.68;
}

/* Scroll-reveal: lift cards slightly when visible (matches site energy) */
.support-matters-card.reveal-on-scroll.is-visible {
    transition:
        opacity 0.65s ease,
        transform 0.65s cubic-bezier(0.22, 1, 0.36, 1),
        box-shadow 0.3s ease,
        border-color 0.25s ease;
}

body:has(.support-page) .site-footer {
    margin-top: 0;
}

/* Partner: split panel + photo */
.support-partner {
    padding: 0;
    margin: 0;
    overflow: hidden;
    border: 0;
    background: #121218;
}
.support-partner-layout {
    display: grid;
    grid-template-columns: minmax(280px, 42%) 1fr;
    align-items: stretch;
    min-height: clamp(440px, 68vh, 700px);
    width: 100%;
}
.support-partner-panel {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: clamp(2rem, 5vw, 3.75rem) clamp(1.25rem, 4vw, 2.5rem) clamp(2rem, 5vw, 3.75rem) clamp(1.25rem, 5vw, 3rem);
    background: linear-gradient(165deg, #1a1a22 0%, #12121a 45%, #0a0a0f 100%);
}
.support-partner-panel-inner {
    width: 100%;
    max-width: 28rem;
}
.support-partner-kicker {
    margin: 0 0 0.55rem;
}
.support-partner-kicker-text {
    display: inline-block;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: #e8b923;
}
.support-partner-title {
    margin: 0 0 1rem;
    font-family: "Playfair Display", Georgia, serif;
    font-size: clamp(1.85rem, 3.2vw, 2.65rem);
    font-weight: 700;
    color: #fafafa;
    line-height: 1.12;
}
.support-partner-rule {
    overflow: hidden;
    width: 3rem;
    height: 3px;
    margin-bottom: 1.25rem;
    border-radius: 2px;
    background: rgba(255, 255, 255, 0.06);
}
.support-partner-rule-fill {
    display: block;
    height: 100%;
    width: 100%;
    border-radius: 2px;
    background: linear-gradient(90deg, #e8b923, rgba(232, 185, 35, 0.2));
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
    transition-delay: 0.12s;
}
.support-partner-panel.reveal-on-scroll.is-visible .support-partner-rule-fill {
    transform: scaleX(1);
}
.support-partner-copy {
    margin: 0;
}
.support-partner-copy p {
    margin: 0 0 1.05rem;
    color: rgba(245, 245, 247, 0.88);
    font-size: clamp(0.94rem, 1.05vw, 1.02rem);
    line-height: 1.72;
}
.support-partner-copy p:last-child {
    margin-bottom: 0;
}
.support-partner-actions {
    margin: 1.5rem 0 0;
}
.support-partner-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.65rem 1.35rem;
    font-weight: 600;
    font-size: 0.95rem;
    border-radius: 10px;
    background: #e8b923;
    color: #141414;
    border: 0;
    text-decoration: none;
    transition: background 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
}
.support-partner-btn:hover {
    background: #f0c94a;
    color: #0a0a0a;
    transform: translateY(-2px);
    box-shadow: 0 10px 28px rgba(232, 185, 35, 0.38);
}
.support-partner-btn:focus-visible {
    outline: 2px solid #fafafa;
    outline-offset: 3px;
}
.support-partner-photo {
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    background-color: #1a1a1e;
    min-height: 260px;
}

@media (prefers-reduced-motion: reduce) {
    .support-partner-rule-fill {
        transition: none;
        transform: scaleX(1);
    }
}

@media (max-width: 900px) {
    .support-matters-grid {
        grid-template-columns: 1fr;
        max-width: 420px;
        margin: 0 auto;
    }
    .support-partner-layout {
        grid-template-columns: 1fr;
        min-height: unset;
    }
    .support-partner-photo {
        order: -1;
        min-height: min(42vh, 380px);
        max-height: 48vh;
    }
    .support-partner-panel {
        justify-content: flex-start;
        padding: clamp(2rem, 5vw, 2.75rem) clamp(1.25rem, 5vw, 1.5rem);
    }
    .support-partner-panel-inner {
        max-width: 40rem;
    }
}