/* ==========================================================================
   RK ACCOUNTANTS FIRM - CORPORATE FINANCIAL PORTAL STYLESHEET
   Visual Direction: Warm Beige (#F4EBDD) + Deep Navy (#0B2A4A) + Secondary Navy (#173F67) + Gold (#C89B3C)
   ========================================================================== */

:root {
    --navy: #03091C;
    --beige: #E8D8B8;
    --beige-light: #F3E8D0;
    --cream: #F7F0E2;
    --blue-glow-soft: rgba(47, 111, 255, 0.35);
    --blue-glow-strong: rgba(92, 150, 255, 0.55);
    /* WARM BEIGE & CREAM BACKGROUNDS */
    --warm-beige: #071332;
    --cream-bg: #0A1B45;
    --soft-beige: #10265B;
    --card-white: #F3F8FF;

    /* CORPORATE NAVY & BLUE ACCENTS */
    --primary-navy: #050D24;
    --secondary-navy: #0A1B45;
    --navy-dark: #050D24;
    --navy-medium: #173F9E;
    --blue-glow: #397BFF;
    --blue-soft-bg: rgba(92, 150, 255, 0.12);

    /* ROYAL GOLD ACCENTS */
    --accent-gold: #C89B3C;
    --gold-light: #DFB456;
    --gold-glow: #F3CB6B;
    --gold-soft-bg: rgba(200, 155, 60, 0.12);

    /* COMPONENT TOKENS */
    --bg-dark: #0B2A4A;
    --bg-card-dark: rgba(11, 42, 74, 0.95);
    --bg-card-light: #FFFFFF;
    --border-glass: rgba(11, 42, 74, 0.12);
    --border-navy: rgba(23, 63, 103, 0.25);
    --border-gold: rgba(200, 155, 60, 0.4);

    --text-main: #0B2A4A;
    --text-muted: #2D4A68;
    --text-dim: #5A748E;
    --text-light: #F8FAFC;
    --text-light-muted: #CBD5E1;

    --gradient-navy: linear-gradient(135deg, #050D24 0%, #0A1B45 52%, #173F9E 100%);
    --gradient-gold: linear-gradient(135deg, #A87B28 0%, #C89B3C 50%, #DFB456 100%);
    --gradient-beige-section: linear-gradient(180deg, #F4EBDD 0%, #FAF5EB 100%);

    --font-heading: 'Outfit', sans-serif;
    --font-body: 'Plus Jakarta Sans', sans-serif;

    --shadow-3d: 0 20px 40px -15px rgba(11, 42, 74, 0.25), 0 0 30px rgba(200, 155, 60, 0.15);
    --shadow-light-card: 0 12px 30px rgba(11, 42, 74, 0.08);
    --radius-lg: 20px;
    --radius-md: 12px;
    --radius-sm: 8px;
    --transition-fast: 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    --transition-smooth: 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}

/* RESET & BASE */
*, *::before, *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    scroll-behavior: smooth;
    font-family: var(--font-body);
    background-color: var(--warm-beige);
    color: var(--text-main);
    overflow-x: hidden;
}

body {
    background-color: var(--warm-beige);
    color: var(--text-main);
    min-height: 100vh;
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
}

/* TYPOGRAPHY */
h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-heading);
    color: var(--primary-navy);
    line-height: 1.25;
}

p {
    color: var(--text-muted);
}

a {
    color: inherit;
    text-decoration: none;
    transition: var(--transition-fast);
}

.text-gradient {
    background: var(--gradient-gold);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.text-gradient-gold {
    background: var(--gradient-gold);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.text-navy { color: var(--primary-navy); }
.text-gold { color: var(--accent-gold); }

/* LAYOUT CONTAINER */
.container {
    width: 100%;
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 32px;
}

.section {
    padding: 90px 0;
    position: relative;
    z-index: 2;
}

.dark-gradient-bg {
    background: var(--gradient-navy);
    color: var(--text-light);
    border-top: 1px solid var(--border-gold);
    border-bottom: 1px solid var(--border-gold);
}

.dark-gradient-bg h1,
.dark-gradient-bg h2,
.dark-gradient-bg h3,
.dark-gradient-bg h4 {
    color: var(--text-light);
}

.dark-gradient-bg p {
    color: var(--text-light-muted);
}

.white-section-bg {
    background: var(--gradient-beige-section);
    color: var(--text-main);
}

.white-section-bg h2,
.white-section-bg h3,
.white-section-bg h4 {
    color: var(--primary-navy);
}

.white-section-bg p {
    color: var(--text-muted);
}

/* MAIN HEADER & FLOATING ADAPTIVE NAVBAR */
.main-header {
    position: fixed;
    top: 20px;
    left: 50%;
    transform: translateX(-50%);
    width: calc(100% - 40px);
    max-width: 1280px;
    z-index: 1000;
    background: rgba(5, 15, 35, 0.55);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 8px;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3), 0 0 30px rgba(29, 77, 183, 0.15);
    transition: background 0.5s cubic-bezier(0.16, 1, 0.3, 1),
                border-color 0.5s cubic-bezier(0.16, 1, 0.3, 1),
                box-shadow 0.5s cubic-bezier(0.16, 1, 0.3, 1),
                transform 0.3s ease,
                opacity 0.3s ease;
}

/* STATE 2: CONTENT SCROLLED NAVBAR STATE */
.main-header.scrolled {
    background: rgba(243, 231, 204, 0.96);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border-color: rgba(213, 166, 42, 0.2);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
}

.header-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 68px;
    padding: 0 28px;
    width: 100%;
}

/* BRAND LOGO */
.brand-logo {
    display: flex;
    align-items: center;
    gap: 12px;
    text-decoration: none;
    padding: 4px 8px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 14px;
    background: rgba(3, 9, 28, 0.18);
    box-shadow: 0 0 18px rgba(92, 150, 255, 0.16);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    transition: background 0.6s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.6s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

.brand-logo-img {
    height: 42px;
    width: auto;
    object-fit: contain;
    filter: brightness(1.15) contrast(1.15) saturate(1.05);
    transition: filter 0.6s ease;
}

.main-header.scrolled .brand-logo-img {
    filter: brightness(0.65) contrast(1.25) saturate(1.1);
}

.main-header.scrolled .brand-logo {
    background: rgba(247, 240, 226, 0.6);
    border-color: rgba(3, 9, 28, 0.1);
    box-shadow: 0 0 16px rgba(47, 111, 255, 0.12);
}

/* NAVIGATION MENU */
.nav-menu {
    display: flex;
    align-items: center;
    gap: 8px;
}

.nav-link {
    appearance: none;
    border: 0;
    background: transparent;
    cursor: pointer;
    padding: 8px 16px;
    font-size: 0.9rem;
    font-family: var(--font-body);
    font-weight: 500;
    color: #C9D3E8;
    border-radius: 20px;
    transition: all 0.3s ease;
}

.nav-link:hover {
    color: #FFFFFF;
    background: rgba(255, 255, 255, 0.12);
}

.nav-link.active {
    color: #FFFFFF;
    font-weight: 600;
    background: rgba(36, 89, 216, 0.3);
    border: 1px solid rgba(57, 120, 246, 0.5);
}

.main-header.scrolled .nav-link {
    color: #2D3748;
}

.main-header.scrolled .nav-link:hover {
    color: #111827;
    background: rgba(0, 0, 0, 0.06);
}

.main-header.scrolled .nav-link.active {
    color: #111827;
    font-weight: 700;
    background: rgba(11, 42, 74, 0.12);
    border: 1px solid rgba(11, 42, 74, 0.25);
}

.nav-menu-trigger.is-active {
    color: #FFFFFF;
    font-weight: 600;
    box-shadow: inset 0 -2px 0 var(--gold-light);
}

.main-header.scrolled .nav-menu-trigger.is-active {
    color: var(--primary-navy);
    box-shadow: inset 0 -2px 0 var(--accent-gold);
}

.nav-backdrop {
    position: fixed;
    inset: 0;
    z-index: 900;
    background: rgba(1, 9, 24, 0.22);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.36s ease;
}

.nav-backdrop.is-visible {
    opacity: 1;
    pointer-events: auto;
}

.mega-menu-shell {
    position: fixed;
    top: 100px;
    left: 50%;
    transform: translateX(-50%);
    width: min(560px, calc(100% - 40px));
    z-index: 1001;
    pointer-events: none;
}

.mega-menu-panel {
    display: none;
    padding: 26px;
    border: 1px solid rgba(213, 166, 42, 0.2);
    border-radius: 16px;
    background: rgba(243, 231, 204, 0.98);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    box-shadow: 0 26px 60px rgba(0, 0, 0, 0.1);
    opacity: 0;
    transform: translateY(-10px);
}

.mega-menu-panel.is-open {
    display: block;
    pointer-events: auto;
    animation: menu-panel-in 0.38s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

.mega-menu-kicker {
    color: #03091C;
    font-family: var(--font-heading);
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.mega-menu-divider {
    height: 1px;
    margin: 16px 0 12px;
    background: linear-gradient(90deg, rgba(223, 180, 86, 0.9), rgba(223, 180, 86, 0.08));
}

.mega-menu-links {
    display: grid;
    gap: 5px;
}

.mega-menu-links a,
.director-menu-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 13px 14px;
    color: #2D4A68;
    border-radius: 8px;
    font-size: 0.98rem;
    font-weight: 500;
    transition: transform 0.24s ease, background 0.24s ease, color 0.24s ease;
}

.mega-menu-links a:hover,
.mega-menu-links a:focus-visible,
.director-menu-item:hover,
.director-menu-item:focus-visible {
    color: #e8f5b6;
    background: rgba(239, 253, 136, 0.05);
    transform: translateX(4px);
    outline: none;
}

.mega-menu-links i {
    color: var(--gold-light);
    font-size: 0.82rem;
}

.mega-menu-panel-directors {
    width: min(680px, 100%);
}

.director-menu-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.director-menu-item {
    display: grid;
    justify-content: start;
    min-height: 126px;
    border: 1px solid rgba(194, 216, 255, 0.16);
}

.director-menu-index {
    color: var(--gold-light);
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.director-menu-item strong {
    color: #f2f1c9;
    font-family: var(--font-heading);
    font-size: 1.05rem;
}

.director-menu-item span:last-child {
    color: #2D4A68;
    font-size: 0.82rem;
    line-height: 1.45;
}

@keyframes menu-panel-in {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* HEADER ACTIONS */
.header-actions {
    display: flex;
    align-items: center;
    gap: 16px;
}

.btn-pill-white {
    background: #F5F4EF;
    color: #e8f8c7;
    font-weight: 700;
    padding: 10px 24px;
    border-radius: 30px;
    font-size: 0.88rem;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
    border: 1px solid rgba(255, 255, 255, 0.8);
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
    text-decoration: none;
}

.btn-pill-white:hover {
    transform: scale(1.04);
    background: #FFFFFF;
    box-shadow: 0 8px 25px rgba(57, 120, 246, 0.3);
    color: #edefa9;
}

.main-header.scrolled .btn-pill-white {
    background: #0B2A4A;
    color: #FFFFFF;
    border-color: #0B2A4A;
    box-shadow: 0 4px 15px rgba(11, 42, 74, 0.25);
}

.main-header.scrolled .btn-pill-white:hover {
    background: #173F67;
    color: #FFFFFF;
    box-shadow: 0 8px 25px rgba(11, 42, 74, 0.4);
}

.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 12px 24px;
    font-size: 0.92rem;
    font-weight: 600;
    border-radius: var(--radius-md);
    cursor: pointer;
    border: none;
    transition: var(--transition-fast);
    text-decoration: none;
}

.btn-primary {
    background: var(--gradient-navy);
    color: #FFFFFF;
    box-shadow: 0 4px 15px rgba(11, 42, 74, 0.3);
    border: 1px solid rgba(200, 155, 60, 0.5);
}

.btn-primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(11, 42, 74, 0.45);
    background: linear-gradient(135deg, #173F67 0%, #0B2A4A 100%);
    border-color: var(--accent-gold);
}

.btn-gold {
    background: var(--gradient-gold);
    color: var(--primary-navy);
    font-weight: 700;
    box-shadow: 0 4px 15px rgba(200, 155, 60, 0.3);
}

.btn-gold:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(200, 155, 60, 0.5);
}

.btn-secondary {
    background: rgba(255, 255, 255, 0.08);
    color: #FFFFFF;
    border: 1px solid rgba(200, 155, 60, 0.4);
}

.btn-secondary:hover {
    background: rgba(200, 155, 60, 0.2);
    color: var(--gold-light);
}

.btn-lg {
    padding: 16px 32px;
    font-size: 1rem;
}

.btn-block {
    width: 100%;
}

.mobile-toggle {
    display: none;
    background: transparent;
    border: none;
    color: #FFFFFF;
    font-size: 1.5rem;
    cursor: pointer;
    padding: 6px;
    transition: color 0.3s ease;
}

.main-header.scrolled .mobile-toggle {
    color: #111827;
}

/* ==========================================================================
   1. PREMIUM ENTERPRISE SAAS HERO SECTION (CANVAS SCROLL IMAGE SEQUENCE)
   ========================================================================== */
.saas-hero {
    position: relative;
    width: 100%;
    min-height: 280vh; /* Cinematic scroll space: 100vh hero + ~180vh transition */
    background: #03091C;
    z-index: 1;
}

.hero-sticky-container {
    position: sticky;
    top: 0;
    width: 100%;
    height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    z-index: 1;
    background: #03091C;
}

.hero-canvas {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0;
    pointer-events: none;
}

/* Atmospheric Overlays */
.hero-sticky-container::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 1;
    background: radial-gradient(circle at 50% 50%, transparent 20%, rgba(3, 9, 28, 0.4) 100%);
    pointer-events: none;
}

.hero-sticky-container::after {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 2;
    pointer-events: none;
    background: radial-gradient(circle at 50% 48%, rgba(92, 150, 255, 0.15), transparent 60%);
}

/* Background Color Interpolation Layer (interpolates navy → beige as we transition to About) */
.hero-bg-overlay {
    position: absolute;
    inset: 0;
    z-index: 3;
    pointer-events: none;
    background: linear-gradient(180deg, var(--navy) 0%, #0B1A3D 35%, #2A2A55 55%, #6B5A8E 72%, #B8A98E 88%, #F3E7CC 100%);
    opacity: 0;
    transition: opacity 0.1s linear;
}

.hero-light-trails {
    position: absolute;
    inset: 0;
    z-index: 4;
    overflow: hidden;
    pointer-events: none;
}

.hero-light-trails span {
    position: absolute;
    width: clamp(120px, 20vw, 300px);
    height: 1px;
    opacity: 0;
    background: linear-gradient(90deg, transparent, rgba(230, 241, 255, 0.9), transparent);
    box-shadow: 0 0 15px rgba(92, 150, 255, 0.8);
    transform: rotate(-26deg);
    animation: architectural-streak 8s ease-in-out infinite;
}

.hero-light-trails span:nth-child(1) { top: 20%; left: -20%; animation-delay: 0s; }
.hero-light-trails span:nth-child(2) { top: 50%; left: -25%; animation-delay: 3s; }
.hero-light-trails span:nth-child(3) { top: 80%; left: -20%; animation-delay: 6s; }

@keyframes architectural-streak {
    0%, 10%, 100% { opacity: 0; transform: translate3d(0, 0, 0) rotate(-26deg); }
    15% { opacity: 0.7; }
    35% { opacity: 0; transform: translate3d(150vw, -30vw, 0) rotate(-26deg); }
}

.hero-content-wrapper {
    position: relative;
    z-index: 10;
    width: min(1400px, 100%);
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.hero-statements {
    position: relative;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: clamp(2rem, 5vw, 6rem);
    padding: 0 40px;
}

.hero-statement {
    font-family: var(--font-heading);
    font-size: clamp(0.95rem, 1.55vw, 1.55rem);
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: #F5F9FF;
    text-shadow: 0 0 20px rgba(92, 150, 255, 0.5);
    white-space: nowrap;
    opacity: 0;
    transform: translate3d(0, 30px, 0);
    will-change: opacity, transform, filter;
}

.hero-company-name {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate3d(-50%, -50%, 0) scale(0.75);
    font-family: var(--font-heading);
    font-size: clamp(2.4rem, 11.5vw, 13.5rem);
    font-weight: 900;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--beige-light);
    white-space: nowrap;
    opacity: 0;
    filter: blur(15px);
    text-shadow: 0 0 50px rgba(92, 150, 255, 0.75), 0 0 100px rgba(223, 180, 86, 0.35), 0 20px 50px rgba(3, 9, 28, 0.8);
    will-change: opacity, transform, filter;
    z-index: 11;
}

@media (max-width: 768px) {
    .hero-statements {
        flex-direction: row;
        flex-wrap: nowrap;
        gap: 0.6rem;
        padding: 0 16px;
        justify-content: space-between;
    }
    .hero-statement {
        font-size: clamp(0.6rem, 2.6vw, 0.85rem);
        letter-spacing: 0.1em;
    }
    .hero-company-name {
        font-size: clamp(2rem, 9vw, 4.5rem);
        letter-spacing: 0.03em;
    }
}

.hero-firm-name {
    position: absolute;
    top: calc(50% + clamp(6rem, 12vw, 10rem));
    left: 50%;
    width: 100%;
    color: #E8F1FF;
    font-family: var(--font-heading);
    font-size: clamp(1.4rem, 3vw, 3rem);
    font-weight: 600;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    opacity: 0;
    filter: blur(12px);
    transform: translate3d(-50%, 40px, 0) scale(0.96);
    text-shadow: 0 0 24px rgba(92, 150, 255, 0.4);
    will-change: opacity, filter, transform;
}

.about-section {
    isolation: isolate;
    overflow: hidden;
    min-height: 130vh;
    padding: 150px 0 120px;
    opacity: 0;
    transform: translate3d(0, 50px, 0);
    transition: opacity 0.8s ease, transform 0.8s ease;
    color: var(--navy);
    background: radial-gradient(circle at 75% 8%, rgba(47, 111, 255, 0.17), transparent 28%), linear-gradient(155deg, #071A40 0%, #B8A98E 7%, #F3E7CC 16%, #F8EEDB 58%, #F7F0E2 100%);
}

.about-section::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: -1;
    opacity: 0.7;
    background: linear-gradient(115deg, transparent 12%, rgba(92, 150, 255, 0.08) 12.2%, transparent 12.5%, transparent 77%, rgba(57, 123, 255, 0.1) 77.2%, transparent 77.5%);
}

.about-section .container {
    position: relative;
    z-index: 2;
}

.about-atmosphere {
    position: absolute;
    z-index: 0;
    width: 68vw;
    aspect-ratio: 1;
    top: 5%;
    left: -24%;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(92, 150, 255, 0.25), rgba(40, 100, 230, 0.05) 42%, transparent 70%);
    filter: blur(18px);
    will-change: transform;
}

.about-geometry {
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    perspective: 900px;
    will-change: transform;
}

.about-plane {
    position: absolute;
    display: block;
    border: 1px solid rgba(157, 193, 255, 0.34);
    background: linear-gradient(135deg, rgba(92, 150, 255, 0.24), rgba(23, 63, 158, 0.04));
    box-shadow: inset 0 1px 0 rgba(236, 245, 255, 0.2), 0 24px 70px rgba(5, 13, 36, 0.34);
    backdrop-filter: blur(5px);
}

.about-plane-one { width: 30vw; height: 21vw; top: 16%; right: -8%; transform: rotateX(58deg) rotateZ(-28deg); }
.about-plane-two { width: 18vw; height: 38vw; top: 40%; left: -7%; transform: rotateY(54deg) rotateZ(18deg); }
.about-plane-three { width: 22vw; height: 14vw; right: 17%; bottom: 6%; transform: rotateX(60deg) rotateZ(22deg); }

.about-chapter-heading {
    position: relative;
    display: flex;
    align-items: baseline;
    gap: 22px;
    margin-bottom: 80px;
    opacity: 0;
    filter: blur(10px);
    transform: translateY(40px);
    transition: opacity 0.9s cubic-bezier(0.16, 1, 0.3, 1), filter 0.9s cubic-bezier(0.16, 1, 0.3, 1), transform 0.9s cubic-bezier(0.16, 1, 0.3, 1);
    z-index: 10;
}

.about-chapter-number {
    color: #1E56B8;
    font-family: var(--font-heading);
    font-size: clamp(4.5rem, 10vw, 9rem);
    font-weight: 800;
    line-height: 0.8;
    text-shadow: 0 0 30px rgba(30, 86, 184, 0.2);
}

.about-chapter-heading h2 {
    color: #03091C;
    font-size: clamp(2rem, 5vw, 4.6rem);
    font-weight: 700;
    text-transform: uppercase;
    text-shadow: none;
}

.about-section .grid-2-col {
    position: relative;
    gap: 72px;
    z-index: 10;
}

.about-section .about-content-left,
.about-section .about-content-right {
    opacity: 0;
    filter: blur(10px);
    transform: translateY(48px) scale(0.98);
    transition: opacity 0.85s cubic-bezier(0.16, 1, 0.3, 1), filter 0.85s cubic-bezier(0.16, 1, 0.3, 1), transform 0.85s cubic-bezier(0.16, 1, 0.3, 1);
}

.about-section.is-visible .about-chapter-heading,
.about-section.is-visible .about-content-left,
.about-section.is-visible .about-content-right {
    opacity: 1;
    filter: blur(0);
    transform: translateY(0) scale(1);
}

.about-section.is-visible .about-content-left { transition-delay: 0.15s; }
.about-section.is-visible .about-content-right { transition-delay: 0.3s; }

.about-section h2, .about-section h3, .about-section h4 { color: #03091C; }
.about-section p, .about-section .lead-text, .about-section .body-text { color: #03091C; }
.about-section .lead-text { font-size: 1.2rem; }
.about-section .text-gradient-gold { 
    background: linear-gradient(135deg, #D5A62A, #8A6D1B); 
    background-clip: text; 
    -webkit-background-clip: text; 
    color: transparent;
}
.about-section .highlight-item { 
    padding: 16px; 
    border: 1px solid rgba(213, 166, 42, 0.2); 
    border-radius: 8px; 
    background: rgba(243, 231, 204, 0.5); 
    backdrop-filter: blur(10px); 
}
.about-section .icon-box { 
    background: rgba(30, 86, 184, 0.1); 
    border-color: rgba(30, 86, 184, 0.2); 
    color: #1E56B8; 
}
.about-section .glass-card-light { 
    background: rgba(255, 255, 255, 0.6); 
    border-color: rgba(30, 86, 184, 0.15); 
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.05); 
    backdrop-filter: blur(18px); 
}
.about-section .glass-card-light h3, .about-section .metric-value { color: #03091C; }
.about-section .metric-box { 
    background: rgba(30, 86, 184, 0.05); 
    border-color: rgba(30, 86, 184, 0.1); 
}
.about-section .metric-label, .about-section .card-footer-quote p { color: #2D4A68 !important; }

@media (max-width: 768px) {
    .hero-firm-name { top: calc(50% + 5rem); letter-spacing: 0.1em; }
    .about-section { min-height: auto; padding: 120px 0 90px; }
    .about-chapter-heading { display: block; margin-bottom: 54px; }
    .about-chapter-heading h2 { margin-top: 18px; }
    .about-plane-one { width: 75vw; height: 50vw; right: -28%; }
    .about-plane-two { width: 42vw; height: 80vw; }
    .about-plane-three { width: 60vw; height: 36vw; right: -24%; }
}

/* ==========================================================================
   BLUE + BEIGE CINEMATIC CHAPTERS
   ========================================================================== */
.about-section {
    color: var(--navy);
    background: radial-gradient(circle at 75% 8%, rgba(47, 111, 255, 0.17), transparent 28%), linear-gradient(155deg, #071A40 0%, #B8A98E 7%, #F3E7CC 16%, #F8EEDB 58%, #F7F0E2 100%);
    transition: background 0.8s ease;
}

.milestones-section {
    background: radial-gradient(circle at 24% 15%, rgba(247, 240, 226, 0.8), transparent 30%), linear-gradient(180deg, #F3E7CC, #F8EEDB);
    transition: background 0.8s ease;
}

.people-section {
    background: linear-gradient(180deg, #F8EEDB, #F3E7CC);
    transition: background 0.8s ease;
}

/* STAFF TRAINING TIMELINE */
.training-timeline-container {
    position: relative;
    max-width: 1000px;
    margin: 60px auto;
    padding: 40px 0;
}

.training-path-background {
    position: absolute;
    top: 50px;
    left: 10%;
    right: 10%;
    height: 4px;
    background: rgba(7, 24, 61, 0.1);
    border-radius: 2px;
}

.training-path-progress {
    position: absolute;
    top: 50px;
    left: 10%;
    width: 0;
    height: 4px;
    background: linear-gradient(90deg, #1E56B8, #D5A62A);
    border-radius: 2px;
    transition: width 3.5s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 2;
}

.training-pulse {
    position: absolute;
    top: 48px;
    left: 10%;
    width: 8px;
    height: 8px;
    background: #FFFFFF;
    border-radius: 50%;
    box-shadow: 0 0 15px #D5A62A, 0 0 30px #D5A62A;
    z-index: 3;
    opacity: 0;
    pointer-events: none;
}

.training-steps-wrapper {
    display: flex;
    justify-content: space-between;
    position: relative;
    z-index: 4;
}

.training-step {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    opacity: 0;
    transform: translateY(20px);
    transition: all 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

.training-step.is-active {
    opacity: 1;
    transform: translateY(0);
}

.step-node {
    width: 44px;
    height: 44px;
    background: #07183D;
    border: 3px solid #F3E7CC;
    border-radius: 50%;
    display: grid;
    place-items: center;
    position: relative;
    margin-bottom: 25px;
    transition: all 0.5s ease;
}

.training-step.is-active .step-node {
    border-color: #D5A62A;
    box-shadow: 0 0 20px rgba(213, 166, 42, 0.4);
}

.step-number {
    color: #F3E7CC;
    font-weight: 800;
    font-size: 0.9rem;
}

.step-glow {
    position: absolute;
    inset: -10px;
    background: radial-gradient(circle, rgba(213, 166, 42, 0.2), transparent 70%);
    opacity: 0;
    transition: opacity 0.8s ease;
}

.training-step.is-active .step-glow {
    opacity: 1;
}

.step-content {
    text-align: center;
}

.step-content i {
    font-size: 1.8rem;
    color: #1E56B8;
    margin-bottom: 12px;
    display: block;
    transform: scale(0.8);
    transition: all 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.training-step.is-active .step-content i {
    transform: scale(1);
    color: #1E56B8 !important;
}

.training-step h4 {
    color: #03091C !important;
}

.step-number {
    color: #D5A62A;
}

.step-content h4 {
    font-family: var(--font-heading);
    font-size: 0.9rem;
    font-weight: 800;
    letter-spacing: 1px;
    color: #07183D;
}

/* RANGE OF SERVICES - ALTERNATING CARDS */
.services-grid-12 {
    perspective: 1000px;
}

.service-tile:nth-child(4n+1) { background: #07183D; color: #F3F8FF; }
.service-tile:nth-child(4n+2) { background: #F3E7CC; color: #07183D; }
.service-tile:nth-child(4n+3) { background: #1E56B8; color: #F3F8FF; }
.service-tile:nth-child(4n+4) { background: #0B1F4D; color: #F3F8FF; box-shadow: inset 0 0 20px rgba(57, 123, 255, 0.1); }

.service-tile:nth-child(4n+2) h3 { color: #07183D; }
.service-tile:nth-child(4n+2) p { color: #2D4A68; }

.service-tile {
    border: 1px solid rgba(213, 166, 42, 0.2);
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
    transition: all 0.6s cubic-bezier(0.16, 1, 0.3, 1);
    transform-style: preserve-3d;
}

.service-tile:hover {
    transform: translateY(-12px) rotateX(4deg) rotateY(4deg) translateZ(20px);
    border-color: #D5A62A;
    box-shadow: 0 25px 50px rgba(0,0,0,0.3), 0 0 30px rgba(30, 86, 184, 0.3);
    z-index: 5;
}

.services-grid-12:hover .service-tile:not(:hover) {
    opacity: 0.6;
    filter: brightness(0.8);
}

/* MISSION VISION VALUES - FIX & ENHANCE */
.flip-card-front {
    background: #07183D !important;
    border: 1px solid rgba(30, 86, 184, 0.3);
    position: relative;
    overflow: hidden;
}

.flip-card-img-container {
    height: 60%;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    transition: all 0.5s ease;
}

.flip-card-img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    filter: drop-shadow(0 0 15px rgba(30, 86, 184, 0.4));
}

.flip-card-front {
    background: #07183D;
    transition: background 0.4s ease;
}

.flip-card-inner {
    transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

.flip-card-3d:hover .flip-card-front {
    background: #F3E7CC;
}

.flip-card-3d:hover .flip-card-front h3 {
    color: #07183D !important;
}

.card-border-glow {
    position: absolute;
    inset: 0;
    border: 2px solid transparent;
    border-radius: var(--radius-lg);
    background: linear-gradient(90deg, #1E56B8, #D5A62A, #1E56B8) border-box;
    -webkit-mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: destination-out;
    mask-composite: exclude;
    opacity: 0.3;
    animation: border-rotate 4s linear infinite;
}

@keyframes border-rotate {
    0% { filter: hue-rotate(0deg); }
    100% { filter: hue-rotate(360deg); }
}

.mvv-grid-3col {
    perspective: 2000px;
    padding: 40px 0;
}

.flip-card-3d {
    transition: transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

.flip-card-3d:nth-child(1) { transform: rotateY(10deg) scale(0.95); }
.flip-card-3d:nth-child(2) { transform: translateZ(50px); z-index: 2; }
.flip-card-3d:nth-child(3) { transform: rotateY(-10deg) scale(0.95); }

.vision-section.is-active .flip-card-3d {
    animation: mvv-entrance 1.2s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

@keyframes mvv-entrance {
    from { opacity: 0; transform: translateY(50px) rotateX(-10deg); }
    to { opacity: 1; transform: none; }
}

/* PEERS - BEIGE ON NAVY */
.peers-section {
    background: #07183D !important;
    padding: 120px 0;
}

.peer-item {
    background: #F3E7CC !important;
    border: 1px solid rgba(213, 166, 42, 0.3) !important;
    transition: all 0.7s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

.peer-letter {
    color: #D5A62A !important;
    transition: all 0.5s ease;
}

.peer-copy h3 {
    color: #07183D !important;
}

.peer-copy p {
    color: #07183D !important;
    opacity: 0.9;
}

.peer-item:hover {
    background: #F8EEDB !important;
    transform: translateY(-12px) rotateY(5deg) !important;
    border-color: #D5A62A !important;
    box-shadow: 0 25px 50px rgba(0,0,0,0.3), 0 0 30px rgba(213, 166, 42, 0.2) !important;
}

.peer-item:hover .peer-letter {
    transform: scale(1.1);
    filter: drop-shadow(0 0 10px rgba(213, 166, 42, 0.5));
}

/* BACKGROUND ANIMATIONS */
.section-bg-fx {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    overflow: hidden;
}

.bg-line {
    position: absolute;
    background: linear-gradient(90deg, transparent, rgba(30, 86, 184, 0.2), transparent);
    height: 1px;
    width: 100%;
    animation: bg-line-move 8s linear infinite;
}

@keyframes bg-line-move {
    0% { transform: translateY(-100%) translateX(-100%) rotate(-45deg); }
    100% { transform: translateY(200%) translateX(100%) rotate(-45deg); }
}

@media (max-width: 768px) {
    .training-timeline-container { height: auto; padding-left: 40px; }
    .training-path-background { left: 20px; top: 0; bottom: 0; width: 4px; height: 100%; }
    .training-path-progress { left: 20px; top: 0; width: 4px; height: 0; }
    .training-steps-wrapper { flex-direction: column; gap: 40px; }
    .training-step { flex-direction: row; gap: 20px; align-items: flex-start; text-align: left; }
    .step-content { text-align: left; }
    .training-path-progress.is-animated { height: 100%; }
}


@media (prefers-reduced-motion: reduce) {
    .hero-light-trails span { animation: none; }
}

/* HERO CONTENT WRAPPER & ENTRANCE ANIMATIONS */
.hero-content-wrapper {
    position: relative;
    z-index: 10;
    max-width: 1000px;
    padding: 0 24px;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin: auto 0;
    will-change: transform, opacity;
    transition: opacity 0.2s ease-out, transform 0.2s ease-out;
}

@keyframes heroFadeUp {
    0% {
        opacity: 0;
        transform: translateY(28px) scale(0.98);
    }
    100% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.hero-eyebrow {
    margin-bottom: 24px;
    animation: heroFadeUp 0.8s cubic-bezier(0.16, 1, 0.3, 1) 0.1s both;
}

.eyebrow-badge {
    display: inline-block;
    padding: 8px 20px;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 30px;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.2em;
    color: #E2E8F0;
    text-transform: uppercase;
    backdrop-filter: blur(10px);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
}

.hero-headline {
    font-size: clamp(2.8rem, 5vw, 4.8rem);
    font-weight: 500;
    color: #FFFFFF;
    line-height: 1.12;
    letter-spacing: -0.02em;
    margin-bottom: 24px;
    max-width: 960px;
    text-shadow: 0 10px 40px rgba(7, 20, 47, 0.5);
    animation: heroFadeUp 0.8s cubic-bezier(0.16, 1, 0.3, 1) 0.25s both;
}

.headline-bold-highlight {
    font-weight: 800;
    color: #FFFFFF;
    background: linear-gradient(135deg, #FFFFFF 0%, #C9D3E8 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: heroFadeUp 0.8s cubic-bezier(0.16, 1, 0.3, 1) 0.42s both;
}

.hero-subtext {
    font-size: clamp(1.05rem, 1.8vw, 1.25rem);
    color: #C9D3E8;
    line-height: 1.6;
    max-width: 680px;
    margin: 0 auto 36px auto;
    font-weight: 400;
    animation: heroFadeUp 0.8s cubic-bezier(0.16, 1, 0.3, 1) 0.55s both;
}

.hero-actions {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    margin-bottom: 48px;
    flex-wrap: wrap;
    animation: heroFadeUp 0.8s cubic-bezier(0.16, 1, 0.3, 1) 0.65s both;
}

.btn-hero-primary {
    background: #F5F4EF;
    color: #07090D;
    font-weight: 700;
    padding: 16px 36px;
    border-radius: 40px;
    font-size: 1rem;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3), 0 0 20px rgba(255, 255, 255, 0.2);
    border: 1px solid #FFFFFF;
    text-decoration: none;
}

.btn-hero-primary:hover {
    transform: translateY(-3px) scale(1.03);
    background: #FFFFFF;
    box-shadow: 0 15px 40px rgba(57, 120, 246, 0.4);
    color: #07152F;
}

.btn-hero-secondary {
    background: rgba(255, 255, 255, 0.08);
    color: #FFFFFF;
    font-weight: 600;
    padding: 16px 32px;
    border-radius: 40px;
    font-size: 1rem;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    border: 1px solid rgba(255, 255, 255, 0.22);
    backdrop-filter: blur(10px);
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
    text-decoration: none;
}

.btn-hero-secondary:hover {
    background: rgba(255, 255, 255, 0.18);
    border-color: rgba(255, 255, 255, 0.4);
    color: #FFFFFF;
    transform: translateY(-3px);
}

/* SCROLL INDICATOR CAPSULE */
.hero-scroll-indicator {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    color: rgba(201, 211, 232, 0.75);
    text-decoration: none;
    transition: color 0.3s ease;
    margin-top: 10px;
    animation: heroFadeUp 0.8s cubic-bezier(0.16, 1, 0.3, 1) 0.78s both;
}

.hero-scroll-indicator:hover {
    color: #FFFFFF;
}

.scroll-capsule {
    width: 24px;
    height: 40px;
    border: 2px solid rgba(255, 255, 255, 0.35);
    border-radius: 20px;
    position: relative;
    display: flex;
    justify-content: center;
    padding-top: 6px;
    backdrop-filter: blur(4px);
}

.scroll-dot {
    width: 5px;
    height: 8px;
    background: #FFFFFF;
    border-radius: 4px;
    animation: scrollDotAnim 2s cubic-bezier(0.4, 0, 0.2, 1) infinite;
}

@keyframes scrollDotAnim {
    0% { transform: translateY(0); opacity: 1; }
    60% { transform: translateY(14px); opacity: 0.2; }
    100% { transform: translateY(0); opacity: 1; }
}

.scroll-label {
    font-size: 0.75rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    font-weight: 500;
}

/* SECTION FOCUS MODE (NAVIGATION CLICK INTERACTION) */
body.section-focus-active section {
    transition: filter 0.6s cubic-bezier(0.16, 1, 0.3, 1),
                opacity 0.6s cubic-bezier(0.16, 1, 0.3, 1),
                transform 0.6s cubic-bezier(0.16, 1, 0.3, 1);
}

body.section-focus-active section:not(.focused-section):not(.saas-hero) {
    filter: blur(5px);
    opacity: 0.35;
    pointer-events: none;
}

body.section-focus-active .focused-section {
    filter: blur(0) !important;
    opacity: 1 !important;
    transform: scale(1.008);
    box-shadow: 0 25px 60px rgba(0, 0, 0, 0.18);
    z-index: 10;
    position: relative;
}

body.section-focus-active .main-header {
    filter: blur(0) !important;
    opacity: 1 !important;
    z-index: 1000;
}

@media (prefers-reduced-motion: reduce) {
    .layer-bg, .layer-mid, .layer-fg,
    .hero-eyebrow, .hero-headline, .headline-bold-highlight,
    .hero-subtext, .hero-actions, .hero-scroll-indicator {
        animation: none !important;
        transform: none !important;
    }
}

/* SECTION HEADERS */
.section-header {
    margin-bottom: 50px;
}

.section-tag {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 16px;
    background: rgba(200, 155, 60, 0.12);
    border: 1px solid rgba(200, 155, 60, 0.35);
    border-radius: 30px;
    color: var(--primary-navy);
    font-size: 0.82rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 14px;
}

.section-tag.center {
    margin: 0 auto 14px auto;
}

.foundation-kicker {
    color: var(--accent-gold);
    font-size: 0.85rem;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    margin-bottom: 8px;
}

.section-title {
    font-size: clamp(2rem, 4vw, 3rem);
    font-weight: 800;
    color: var(--primary-navy);
    margin-bottom: 14px;
}

.section-subtitle {
    font-size: 1.1rem;
    color: var(--text-muted);
    max-width: 720px;
    margin: 0 auto;
}

/* ABOUT SUMMARY & METRICS */
.grid-2-col {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 50px;
    align-items: center;
}

.lead-text {
    font-size: 1.2rem;
    font-weight: 600;
    color: var(--primary-navy);
    margin-bottom: 16px;
    line-height: 1.5;
}

.body-text {
    font-size: 1rem;
    color: var(--text-muted);
    margin-bottom: 30px;
}

.about-highlights {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.highlight-item {
    display: flex;
    gap: 16px;
    align-items: flex-start;
}

.icon-box {
    width: 48px;
    height: 48px;
    border-radius: var(--radius-md);
    background: rgba(200, 155, 60, 0.12);
    color: var(--accent-gold);
    display: grid;
    place-items: center;
    font-size: 1.25rem;
    flex-shrink: 0;
    border: 1px solid rgba(200, 155, 60, 0.3);
}

.highlight-item h4 {
    font-size: 1.1rem;
    margin-bottom: 4px;
}

.glass-card-light {
    background: #FFFFFF;
    border-radius: var(--radius-lg);
    padding: 36px;
    border: 1px solid rgba(200, 155, 60, 0.35);
    box-shadow: var(--shadow-light-card);
}

.card-header-flex {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 24px;
}

.live-pill {
    font-size: 0.75rem;
    font-weight: 700;
    color: var(--primary-navy);
    background: rgba(200, 155, 60, 0.15);
    padding: 4px 12px;
    border-radius: 20px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.metrics-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin-bottom: 24px;
}

.metric-box {
    background: var(--warm-beige);
    padding: 20px;
    border-radius: var(--radius-md);
    border: 1px solid rgba(200, 155, 60, 0.25);
    text-align: center;
}

.metric-value {
    font-family: var(--font-heading);
    font-size: 2rem;
    font-weight: 800;
    color: var(--primary-navy);
}

.metric-label {
    font-size: 0.8rem;
    color: var(--text-muted);
    font-weight: 600;
}

.card-footer-quote {
    border-top: 1px solid rgba(200, 155, 60, 0.2);
    padding-top: 16px;
    font-style: italic;
    color: var(--primary-navy);
    font-size: 0.92rem;
    display: flex;
    gap: 10px;
}

.card-footer-quote i {
    color: var(--accent-gold);
}

/* MISSION VISION VALUES FLIP CARDS (3 HORIZONTAL ON DESKTOP) */
.mvv-grid-3col {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

.flip-card-3d {
    background-color: transparent;
    height: 420px;
    perspective: 1000px;
    cursor: pointer;
}

.flip-card-inner {
    position: relative;
    width: 100%;
    height: 100%;
    text-align: center;
    transition: transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
    transform-style: preserve-3d;
}

.flip-card-3d.is-flipped .flip-card-inner,
.flip-card-3d:hover .flip-card-inner {
    transform: rotateY(180deg);
}

.flip-card-front, .flip-card-back {
    position: absolute;
    width: 100%;
    height: 100%;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    border-radius: var(--radius-lg);
    overflow: hidden;
    border: 1px solid rgba(200, 155, 60, 0.35);
    box-shadow: var(--shadow-light-card);
}

.flip-card-front {
    background: #FFFFFF;
}

.flip-card-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.flip-card-overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 30px 20px 20px 20px;
    background: linear-gradient(180deg, transparent 0%, rgba(11, 42, 74, 0.9) 100%);
    color: #FFFFFF;
    text-align: center;
}

.flip-card-overlay h3 {
    color: #FFFFFF;
    font-size: 1.5rem;
    letter-spacing: 2px;
}

.flip-card-back {
    background: #F3E7CC;
    color: #07183D;
    transform: rotateY(180deg);
    padding: 32px 24px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
}

.flip-card-back h3 {
    color: #07183D !important;
}

.flip-card-back p, .flip-card-back li {
    color: #07183D !important;
}

.values-list-back b {
    color: #D5A62A;
}

.values-list-back span strong {
    color: #07183D;
}

.back-index {
    color: rgba(7, 24, 61, 0.6);
}

.service-tile.tile-cream h3 {
    color: #07183D !important;
}

.service-tile.tile-cream p {
    color: #07183D !important;
    opacity: 1 !important;
}

.service-tile.tile-navy h3 {
    color: #FFFFFF !important;
}

.service-tile.tile-navy p {
    color: #F5F9FF !important;
    opacity: 1 !important;
}

.back-index {
    font-size: 0.75rem;
    letter-spacing: 2px;
    color: var(--accent-gold);
    font-weight: 700;
    margin-bottom: 12px;
}

.flip-card-back h3 {
    color: #FFFFFF;
    font-size: 1.6rem;
    margin-bottom: 16px;
}

.flip-card-back p {
    color: var(--text-light-muted);
    font-size: 0.95rem;
    line-height: 1.6;
}

.values-list-back {
    list-style: none;
    text-align: left;
    display: flex;
    flex-direction: column;
    gap: 8px;
    font-size: 0.8rem;
}

.values-list-back li {
    display: flex;
    gap: 8px;
    color: var(--text-light-muted);
}

.values-list-back b {
    color: var(--accent-gold);
    font-size: 0.9rem;
}

/* PEERS CORE VALUES RIBBON & RE-TRIGGERING ANIMATION */
.peers-section {
    background: var(--primary-navy);
    color: #FFFFFF;
    padding: 90px 0;
}

.peers-ribbon {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 20px;
}

.peer-item {
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(200, 155, 60, 0.3);
    border-radius: var(--radius-lg);
    padding: 32px 20px;
    text-align: center;
    opacity: 0;
    transform: translateX(-40px);
    transition: opacity 0.4s ease, transform 0.4s ease, background 0.3s ease, border-color 0.3s ease;
}

.peer-item.is-visible {
    opacity: 1;
    transform: translateX(0);
}

.peer-item:hover, .peer-item.is-active {
    background: rgba(200, 155, 60, 0.2);
    border-color: var(--accent-gold);
    transform: translateY(-8px) scale(1.03);
}

.peer-letter {
    font-family: var(--font-heading);
    font-size: 3rem;
    font-weight: 800;
    color: var(--accent-gold);
    line-height: 1;
    margin-bottom: 12px;
    display: block;
}

.peer-copy h3 {
    font-size: 1.15rem;
    color: #FFFFFF;
    margin-bottom: 8px;
}

.peer-copy p {
    font-size: 0.85rem;
    color: #07183D;
    line-height: 1.5;
    opacity: 0.9;
}

/* ==========================================================================
   5. KEY MILESTONES (EXACT MOUNTAIN CURVE & PATTERN: 1 below, 2 above, 3 below, 4 below, 5 above, 6 below)
   ========================================================================== */
.milestones-section {
    margin-top: 90px;
    background: radial-gradient(circle at 24% 15%, rgba(247, 240, 226, 0.8), transparent 30%), linear-gradient(180deg, #F3E7CC, #F8EEDB);
    position: relative;
    padding: 90px 0 120px 0;
    overflow: hidden;
}

.milestones-section .section-subtitle {
    color: #03091C !important;
}

.journey-ending {
    color: #03091C !important;
}

.journey-stage {
    position: relative;
    min-height: 560px;
    margin-top: 40px;
}

.journey-svg {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    pointer-events: none;
    overflow: visible;
}

.journey-track-shadow, .journey-track {
    fill: none;
    stroke-width: 4;
}

.journey-track-shadow {
    stroke: rgba(3, 9, 28, 0.12);
}

.journey-track {
    stroke: #2F6FFF;
    stroke-dasharray: 2000;
    stroke-dashoffset: 2000;
    transition: stroke-dashoffset 2.8s cubic-bezier(0.16, 1, 0.3, 1);
    filter: drop-shadow(0 0 5px rgba(47, 111, 255, 0.4));
}

.journey-stage.is-visible .journey-track {
    stroke-dashoffset: 0;
}

.milestone-grid {
    position: absolute;
    inset: 0;
}

.milestone-node {
    position: absolute;
    width: 180px;
    display: flex;
    flex-direction: column;
    align-items: center;
    opacity: 0;
    transform: scale(0.85) translateY(15px);
    transition: opacity 0.5s ease, transform 0.5s ease;
    cursor: pointer;
    z-index: 5;
}

.milestone-node.is-visible {
    opacity: 1;
    transform: scale(1) translateY(0);
}

.milestone-dot {
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: var(--navy);
    color: var(--beige-light);
    border: 3px solid #2F6FFF;
    font-weight: 800;
    font-size: 0.85rem;
    box-shadow: 0 0 18px var(--blue-glow-soft), 0 8px 18px rgba(3, 9, 28, 0.18);
    z-index: 2;
    flex-shrink: 0;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.milestone-node:hover .milestone-dot {
    transform: scale(1.18);
    box-shadow: 0 0 24px var(--blue-glow-strong);
}

/* STRAIGHT CONNECTOR LINE */
.milestone-connector {
    width: 2px;
    height: 36px;
    background: #2F6FFF;
    opacity: 0.85;
    margin: 4px 0;
    flex-shrink: 0;
}

.milestone-card {
    background: #F3E8D0;
    border: 1px solid rgba(47, 111, 255, 0.3);
    border-radius: var(--radius-md);
    padding: 14px 16px;
    box-shadow: 0 10px 35px rgba(3, 9, 28, 0.1), 0 0 30px rgba(47, 111, 255, 0.16);
    width: 190px;
    text-align: center;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.milestone-card strong {
    display: block;
    font-family: var(--font-heading);
    font-size: 1.3rem;
    font-weight: 800;
    color: var(--primary-navy);
}

.milestone-card span {
    font-size: 0.78rem;
    color: var(--text-muted);
    display: block;
    margin-top: 4px;
    line-height: 1.4;
}

.milestone-node:hover .milestone-card {
    transform: translateY(-5px) scale(1.05);
    border-color: #D5A62A;
    background: #F3E7CC;
    box-shadow: 0 15px 35px rgba(0,0,0,0.2);
}

.milestone-node:hover .milestone-card strong,
.milestone-node:hover .milestone-card span {
    color: #03091C;
}

/* EXACT REQUIREMENT POSITIONING PATTERN:
   1 -> BELOW (order: 1 dot, 2 connector, 3 card)
   2 -> ABOVE (order: 1 card, 2 connector, 3 dot)
   3 -> BELOW (order: 1 dot, 2 connector, 3 card)
   4 -> BELOW (order: 1 dot, 2 connector, 3 card)
   5 -> ABOVE (order: 1 card, 2 connector, 3 dot)
   6 -> BELOW (order: 1 dot, 2 connector, 3 card)
*/

.milestone-1987 { left: 1%; top: 396px; }
.milestone-1987 .milestone-dot { order: 1; }
.milestone-1987 .milestone-connector { order: 2; }
.milestone-1987 .milestone-card { order: 3; }

.milestone-2013 { left: 19%; top: 135px; }
.milestone-2013 .milestone-card { order: 1; }
.milestone-2013 .milestone-connector { order: 2; }
.milestone-2013 .milestone-dot { order: 3; }

.milestone-2020 { left: 37%; top: 320px; }
.milestone-2020 .milestone-dot { order: 1; }
.milestone-2020 .milestone-connector { order: 2; }
.milestone-2020 .milestone-card { order: 3; }

.milestone-2022 { left: 55%; top: 335px; }
.milestone-2022 .milestone-dot { order: 1; }
.milestone-2022 .milestone-connector { order: 2; }
.milestone-2022 .milestone-card { order: 3; }

.milestone-iiab { left: 73%; top: 120px; }
.milestone-iiab .milestone-card { order: 1; }
.milestone-iiab .milestone-connector { order: 2; }
.milestone-iiab .milestone-dot { order: 3; }

.milestone-staff { left: 88%; top: 165px; }
.milestone-staff .milestone-dot { order: 1; }
.milestone-staff .milestone-connector { order: 2; }
.milestone-staff .milestone-card { order: 3; }

.journey-ending {
    position: absolute;
    bottom: -20px;
    right: 20px;
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--primary-navy);
    font-style: italic;
}

/* RANGE OF SERVICES (ALTERNATING NAVY & CREAM TILES) */
.services-grid-12 {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
}

.service-tile {
    border-radius: var(--radius-lg);
    min-height: 238px;
    padding: 24px 20px;
    transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
    cursor: pointer;
    box-shadow: var(--shadow-light-card);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    border: 1px solid rgba(200, 155, 60, 0.35);
}

.service-tile.tile-cream {
    background: #FFFFFF;
    color: var(--primary-navy);
}

.service-tile.tile-navy {
    background: var(--primary-navy);
    color: #FFFFFF;
}

.service-tile.tile-navy h3 {
    color: #FFFFFF;
}

.service-tile.tile-navy p {
    color: var(--text-light-muted);
}

.service-tile i {
    font-size: 2rem;
    color: var(--accent-gold);
    background: rgba(200, 155, 60, 0.12);
    width: 58px;
    height: 58px;
    border-radius: var(--radius-md);
    display: grid;
    place-items: center;
    border: 1px solid rgba(200, 155, 60, 0.3);
}

.service-tile h3 {
    font-size: 1.15rem;
    color: var(--primary-navy);
    font-weight: 700;
    margin-bottom: 12px;
    line-height: 1.3;
}

.service-tile p {
    font-size: 0.88rem;
    line-height: 1.5;
    opacity: 0.9;
}

.service-tile:hover {
    transform: scale(1.02);
    box-shadow: 0 16px 35px rgba(0, 0, 0, 0.15);
    border-color: var(--accent-gold);
    background: #F3E7CC !important;
}

.service-tile:hover h3, .service-tile:hover p {
    color: #03091C !important;
}

.service-tile i { transition: transform 0.4s ease, box-shadow 0.4s ease, color 0.4s ease; }
.service-tile:hover { transform: translateY(-5px) scale(1.02); border-color: #5C96FF; box-shadow: 0 18px 38px rgba(3, 9, 28, 0.13), 0 0 24px rgba(47, 111, 255, 0.2); }
.service-tile:hover i, .service-tile.is-active i { transform: translateY(-3px); box-shadow: 0 0 18px rgba(47, 111, 255, 0.28); }

.service-tile {
    opacity: 0;
    transform: translateY(25px) scale(0.96);
}

.range-services-section.is-visible .service-tile {
    opacity: 1;
    transform: translateY(0) scale(1);
    transition: opacity 0.7s ease, transform 0.7s ease, box-shadow 0.4s ease, border-color 0.4s ease;
}

/* Homepage service cards retain entrance animation but stay static on hover. */
.home-page .range-services-section .service-tile:hover {
    transform: translateY(0) scale(1) !important;
    border-color: rgba(47, 111, 255, 0.36) !important;
    box-shadow: 0 10px 30px rgba(7, 24, 61, 0.1), 0 0 14px rgba(47, 111, 255, 0.12) !important;
}

.home-page .range-services-section .service-tile:nth-child(odd):hover {
    background: #F3E7D3 !important;
}

.home-page .range-services-section .service-tile:nth-child(even):hover {
    background: #FFFFFF !important;
}

/* Final scoped visibility and static interaction fixes. */
.home-page #contact .contact-info-card .footer-socials {
    display: flex !important;
    opacity: 1 !important;
    visibility: visible !important;
    position: relative;
    z-index: 2;
}

.home-page #contact .contact-info-card .footer-socials a,
.home-page #contact .contact-info-card .footer-socials a i {
    color: #FFFFFF !important;
    opacity: 1 !important;
    visibility: visible !important;
}

.home-page #contact .contact-info-card .footer-socials a {
    background: #1748A8 !important;
    border: 1px solid rgba(7, 59, 112, 0.42);
}

body:has(.directors-grid) .director-card {
    border: 1px solid rgba(23, 72, 168, 0.38) !important;
    box-shadow: 0 12px 28px rgba(7, 24, 61, 0.1) !important;
}

body:has(.directors-grid) .director-card:hover {
    transform: none !important;
    box-shadow: 0 12px 28px rgba(7, 24, 61, 0.1) !important;
}

body:has(.directors-grid) .header-actions .btn-pill-white,
body:has(.directors-grid) .header-actions .btn-pill-white:hover {
    background: #F3E7D3 !important;
    color: #071A3D !important;
    border-color: rgba(7, 59, 112, 0.28) !important;
    transform: none !important;
    box-shadow: none !important;
}

.home-page .range-services-section .service-tile:hover,
.home-page .range-services-section .service-tile:nth-child(odd):hover,
.home-page .range-services-section .service-tile:nth-child(even):hover,
.home-page .range-services-section .service-tile:hover::before {
    transform: none !important;
    filter: none !important;
    opacity: 1 !important;
    box-shadow: 0 10px 30px rgba(7, 24, 61, 0.1), 0 0 14px rgba(47, 111, 255, 0.12) !important;
}

.home-page .range-services-section .service-tile:hover i {
    transform: none !important;
    box-shadow: none !important;
}

.range-services-section.is-visible .service-tile:nth-child(2) { transition-delay: 0.12s; }
.range-services-section.is-visible .service-tile:nth-child(3) { transition-delay: 0.24s; }
.range-services-section.is-visible .service-tile:nth-child(4) { transition-delay: 0.36s; }
.range-services-section.is-visible .service-tile:nth-child(5) { transition-delay: 0.48s; }
.range-services-section.is-visible .service-tile:nth-child(6) { transition-delay: 0.60s; }
.range-services-section.is-visible .service-tile:nth-child(7) { transition-delay: 0.72s; }
.range-services-section.is-visible .service-tile:nth-child(8) { transition-delay: 0.84s; }
.range-services-section.is-visible .service-tile:nth-child(9) { transition-delay: 0.96s; }
.range-services-section.is-visible .service-tile:nth-child(10) { transition-delay: 1.08s; }
.range-services-section.is-visible .service-tile:nth-child(11) { transition-delay: 1.20s; }
.range-services-section.is-visible .service-tile:nth-child(12) { transition-delay: 1.32s; }
.range-services-section.is-visible .service-tile:nth-child(13) { transition-delay: 1.44s; }
.range-services-section.is-visible .service-tile:nth-child(14) { transition-delay: 1.56s; }
.range-services-section.is-visible .service-tile:nth-child(15) { transition-delay: 1.68s; }
.range-services-section.is-visible .service-tile:nth-child(16) { transition-delay: 1.80s; }

/* OLD ACCREDITATIONS STYLES REMOVED */
.accreditations-section {
    position: relative;
    padding: 120px 0;
    overflow: hidden;
    background: #07183D !important; /* Force Deep Navy */
}

.accreditation-orbit-card h3 {
    color: #F3E7CC;
}

.accreditation-info-card h4 {
    color: #D5A62A;
}

.accreditation-info-card p {
    color: #F5F9FF;
}

/* DIRECTORS / LEADERSHIP PAGE (CIRCULAR IMAGE FRAMES) */
.directors-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
}

.director-card {
    background: #FFFFFF;
    border-radius: var(--radius-lg);
    padding: 40px 32px;
    border: 1px solid rgba(200, 155, 60, 0.35);
    box-shadow: var(--shadow-light-card);
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    transition: transform 0.3s ease;
}

.director-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 35px rgba(11, 42, 74, 0.12);
}

.director-photo-circle {
    width: 200px;
    height: 200px;
    border-radius: 50%;
    overflow: hidden;
    margin: 0 auto 24px auto;
    border: 4px solid var(--accent-gold);
    box-shadow: 0 10px 25px rgba(11, 42, 74, 0.15);
    background: var(--warm-beige);
    position: relative;
    flex-shrink: 0;
}

.director-photo-circle img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
    display: block;
}

.director-badge {
    display: inline-block;
    padding: 4px 14px;
    background: rgba(200, 155, 60, 0.12);
    color: var(--primary-navy);
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 700;
    margin-bottom: 8px;
    text-transform: uppercase;
}

.director-details h3 {
    font-size: 1.6rem;
    color: var(--primary-navy);
    margin-bottom: 4px;
}

.director-role {
    font-size: 0.95rem;
    color: var(--accent-gold);
    font-weight: 600;
    margin-bottom: 16px;
}

.director-credentials {
    display: flex;
    justify-content: center;
    gap: 16px;
    font-size: 0.85rem;
    color: var(--text-muted);
    margin-bottom: 16px;
    flex-wrap: wrap;
}

.director-credentials span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.director-bio {
    font-size: 0.92rem;
    color: var(--text-muted);
    line-height: 1.65;
    margin-bottom: 24px;
    text-align: left;
}

.director-contacts {
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: 100%;
}

.contact-pill {
    padding: 10px 16px;
    background: var(--warm-beige);
    border-radius: var(--radius-sm);
    color: var(--primary-navy);
    font-size: 0.88rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    border: 1px solid rgba(200, 155, 60, 0.3);
}

.contact-pill:hover {
    background: var(--primary-navy);
    color: #FFFFFF;
}

.directors-grid .contact-pill,
.directors-grid .contact-pill:hover,
.directors-grid .contact-pill:focus,
.directors-grid .contact-pill:active {
    background: #F3E7D3 !important;
    color: var(--primary-navy) !important;
    border-color: rgba(200, 155, 60, 0.3) !important;
    box-shadow: none !important;
    transform: none !important;
    filter: none !important;
    opacity: 1 !important;
    transition: none !important;
}

.directors-grid .contact-pill i {
    color: var(--primary-navy) !important;
}

/* STAFF STRENGTH & CITIZEN TRAINING */
.people-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
}

.people-panel {
    background: #FFFFFF;
    border-radius: var(--radius-lg);
    padding: 40px;
    border: 1px solid rgba(200, 155, 60, 0.35);
    box-shadow: var(--shadow-light-card);
}

.people-panel h2 {
    font-size: 1.8rem;
    color: var(--primary-navy);
    margin-bottom: 16px;
}

.people-panel ul {
    list-style: none;
    margin-top: 16px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.people-panel li {
    padding-left: 24px;
    position: relative;
    font-weight: 600;
    color: var(--primary-navy);
}

.people-panel li::before {
    content: '\f00c';
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
    position: absolute;
    left: 0;
    color: var(--accent-gold);
}

/* ==========================================================================
   05. STAFF STRENGTH & CITIZEN TRAINING
   ========================================================================== */
.people-section {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    padding: 130px 0;
    background: radial-gradient(circle at 80% 12%, rgba(92, 150, 255, 0.17), transparent 24%), linear-gradient(145deg, var(--cream), var(--beige-light) 54%, var(--beige));
}

.people-section .container { position: relative; z-index: 5; }

.people-atmosphere {
    position: absolute;
    z-index: 0;
    width: min(65vw, 880px);
    aspect-ratio: 1;
    top: 9%;
    right: -22%;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(247, 240, 226, 0.96), rgba(92, 150, 255, 0.11) 40%, transparent 70%);
    filter: blur(12px);
}

.people-structures { position: absolute; inset: 0; z-index: 1; pointer-events: none; perspective: 900px; }
.people-structures span { position: absolute; display: block; border: 1px solid rgba(23, 72, 168, 0.16); background: linear-gradient(135deg, rgba(247, 240, 226, 0.78), rgba(232, 216, 184, 0.25)); box-shadow: 0 22px 46px rgba(3, 9, 28, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.7); animation: people-structure-float 12s ease-in-out infinite alternate; }
.people-structures span:nth-child(1) { width: 26vw; height: 13vw; top: 9%; left: -9%; transform: rotateX(58deg) rotateZ(24deg); }
.people-structures span:nth-child(2) { width: 17vw; height: 27vw; top: 46%; right: -7%; transform: rotateY(58deg) rotateZ(-18deg); animation-delay: -4s; }
.people-structures span:nth-child(3) { width: 22vw; height: 12vw; bottom: 7%; left: 13%; transform: rotateX(62deg) rotateZ(-18deg); animation-delay: -7s; }

@keyframes people-structure-float { to { translate: 0 -14px; } }

.people-heading {
    max-width: 920px;
    margin-bottom: 62px;
    opacity: 0;
    filter: blur(8px);
    transform: translateY(30px);
    transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1), filter 0.8s cubic-bezier(0.16, 1, 0.3, 1), transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

.people-index { display: block; color: #1748A8; font-family: var(--font-heading); font-weight: 800; font-size: clamp(3.8rem, 8vw, 7rem); line-height: 0.8; text-shadow: 0 0 24px rgba(47, 111, 255, 0.24); }
.people-heading h2, .staff-introduction h3, .stat-number, .staff-stat-card h3 { color: #03091C !important; }
.people-heading .section-subtitle { margin: 0; color: #304369; font-size: 1.12rem; }

.staff-introduction { display: grid; grid-template-columns: 0.8fr 1.2fr; column-gap: 36px; align-items: end; margin-bottom: 34px; opacity: 0; transform: translateY(24px); transition: opacity 0.7s ease 0.16s, transform 0.7s ease 0.16s; }
.staff-introduction .foundation-kicker { grid-row: span 2; color: #1748A8; align-self: center; }
.staff-introduction h3 { color: var(--navy); font-size: clamp(1.9rem, 3vw, 3rem); }
.staff-introduction p { color: #304369; max-width: 670px; font-size: 1.04rem; }

.staff-dashboard { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; }
.staff-stat-card { min-height: 218px; padding: 24px 16px; border-radius: 12px; border: 1px solid rgba(47, 111, 255, 0.24); background: rgba(247, 240, 226, 0.76); box-shadow: 0 10px 30px rgba(3, 9, 28, 0.08), 0 0 18px rgba(47, 111, 255, 0.08); backdrop-filter: blur(12px); opacity: 0; transform: translateY(25px) scale(0.97); transition: opacity 0.8s ease, transform 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease, background 0.35s ease; }
.staff-icon { width: 46px; height: 46px; display: grid; place-items: center; margin-bottom: 26px; border-radius: 11px; color: var(--cream); background: linear-gradient(135deg, #1748A8, #2F6FFF); box-shadow: 0 0 18px rgba(47, 111, 255, 0.36); transition: transform 0.35s ease, box-shadow 0.35s ease; }
.stat-number { 
    display: block; 
    color: #03091C !important; 
    font-family: var(--font-heading); 
    font-size: clamp(2.65rem, 3vw, 3.8rem); 
    line-height: 0.95; 
    font-weight: 800; 
    letter-spacing: -0.03em; 
}
.staff-stat-card h3 { margin: 12px 0 6px; color: #03091C !important; font-size: 0.88rem; }
.staff-stat-card p { max-height: 0; opacity: 0; overflow: hidden; color: #03091C !important; font-size: 0.84rem; transform: translateY(8px); transition: max-height 0.35s ease, opacity 0.35s ease, transform 0.35s ease; }
.staff-stat-card:hover { z-index: 1; background: rgba(247, 240, 226, 0.94); border-color: #5C96FF; box-shadow: 0 18px 42px rgba(3, 9, 28, 0.13), 0 0 30px rgba(47, 111, 255, 0.25); transform: translateY(-8px) scale(1.02); }
.staff-stat-card:hover .staff-icon { transform: translateY(-2px) rotate(-3deg); box-shadow: 0 0 26px rgba(47, 111, 255, 0.58); }
.staff-stat-card:hover p { max-height: 56px; opacity: 1; transform: translateY(0); }

.training-story { position: relative; display: grid; grid-template-columns: 1.3fr 0.64fr; gap: 32px; margin-top: 96px; padding: 48px; border: 1px solid rgba(47, 111, 255, 0.26); border-radius: 16px; background: linear-gradient(135deg, rgba(247, 240, 226, 0.9), rgba(232, 216, 184, 0.62)); box-shadow: 0 24px 58px rgba(3, 9, 28, 0.12), 0 0 32px rgba(47, 111, 255, 0.1); overflow: hidden; opacity: 0; transform: translateY(34px); transition: opacity 0.75s ease 0.38s, transform 0.75s ease 0.38s; }
.training-story::before { content: ''; position: absolute; inset: auto 0 0; height: 2px; background: linear-gradient(90deg, transparent, #2F6FFF 18%, #5C96FF 50%, #2F6FFF 82%, transparent); transform: scaleX(0); transform-origin: left; transition: transform 1.2s cubic-bezier(0.16, 1, 0.3, 1) 0.7s; }
.training-copy h2 { color: var(--navy); font-size: clamp(2rem, 3.6vw, 3.5rem); margin: 10px 0 18px; }
.training-copy p { color: #304369; max-width: 680px; margin-top: 12px; }
.ate-credential { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; min-height: 220px; padding: 26px; color: var(--cream); border-radius: 12px; background: linear-gradient(145deg, #071A40, #1748A8); box-shadow: 0 0 25px rgba(47, 111, 255, 0.3); }
.ate-credential strong { font-family: var(--font-heading); font-size: clamp(2.2rem, 4vw, 4rem); line-height: 0.95; letter-spacing: 0.03em; }
.ate-credential span { margin-top: 12px; font-weight: 700; line-height: 1.25; }
.ate-credential small { margin-top: 18px; padding-top: 12px; width: 100%; border-top: 1px solid rgba(247, 240, 226, 0.25); font-weight: 700; letter-spacing: 0.15em; }
.training-path { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; position: relative; margin-top: 8px; }
.training-step { position: relative; z-index: 1; display: grid; justify-items: center; gap: 8px; color: var(--navy); text-align: center; opacity: 0; transform: translateY(20px) scale(0.97); transition: opacity 0.72s cubic-bezier(0.16, 1, 0.3, 1), transform 0.72s cubic-bezier(0.16, 1, 0.3, 1); }
.training-step:not(:last-child)::after { content: ''; position: absolute; top: 27px; left: calc(50% + 28px); width: calc(100% - 56px + 20px); height: 2px; background: linear-gradient(90deg, #2F6FFF, #5C96FF); box-shadow: 0 0 10px rgba(47, 111, 255, 0.36); transform: scaleX(0); transform-origin: left; transition: transform 0.82s cubic-bezier(0.16, 1, 0.3, 1); }
.training-step:not(:last-child)::before { content: ''; position: absolute; top: 23px; left: calc(50% + 28px); z-index: 2; width: 10px; height: 10px; border-radius: 50%; opacity: 0; background: var(--cream); box-shadow: 0 0 16px 5px rgba(92, 150, 255, 0.75); }
.training-step.is-active { opacity: 1; transform: translateY(0) scale(1); }
.training-step.is-active span { box-shadow: 0 0 24px rgba(47, 111, 255, 0.58), 0 0 0 6px rgba(92, 150, 255, 0.1); }
.training-step.is-active:not(:last-child)::after { transform: scaleX(1); }
.training-step.is-active:not(:last-child)::before { animation: training-pulse-travel 0.82s cubic-bezier(0.16, 1, 0.3, 1) forwards; }
.training-path span { display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; color: var(--cream); background: #1748A8; box-shadow: 0 0 18px rgba(47, 111, 255, 0.36); font-size: 0.75rem; font-weight: 800; transition: box-shadow 0.5s ease, transform 0.5s ease; }
.training-path i { color: #1748A8; font-size: 1.2rem; opacity: 0; transform: translateY(8px) scale(0.9); transition: opacity 0.55s ease 0.18s, transform 0.55s ease 0.18s; }
.training-step.is-active i { opacity: 1; transform: translateY(0) scale(1); }

@keyframes training-pulse-travel { 0% { opacity: 0; translate: 0 0; } 12% { opacity: 1; } 82% { opacity: 1; translate: calc(100% - 12px) 0; } 100% { opacity: 0; translate: calc(100% - 8px) 0; } }
.training-path strong { text-transform: uppercase; letter-spacing: 0.08em; font-size: 0.82rem; }
.people-section .section-subtitle {
    color: #2D4A68 !important;
    opacity: 1 !important;
}

.people-closing-statement { 
    max-width: 750px; 
    margin: 74px auto 0; 
    color: #03091C !important; 
    font-family: var(--font-heading); 
    text-align: center; 
    text-transform: uppercase; 
    font-size: clamp(1.15rem, 2vw, 1.75rem); 
    font-weight: 700; 
    letter-spacing: 0.08em; 
    opacity: 0; 
    transform: translateY(20px); 
    transition: opacity 0.7s ease 0.85s, transform 0.7s ease 0.85s; 
}

.people-section.is-visible .people-heading, .people-section.is-visible .staff-introduction, .people-section.is-visible .training-story, .people-section.is-visible .people-closing-statement { opacity: 1; filter: blur(0); transform: translateY(0); }
.people-section.is-visible .staff-stat-card { opacity: 1; transform: translateY(0) scale(1); }
.people-section.is-visible .staff-stat-card:nth-child(2) { transition-delay: 0.08s; }.people-section.is-visible .staff-stat-card:nth-child(3) { transition-delay: 0.16s; }.people-section.is-visible .staff-stat-card:nth-child(4) { transition-delay: 0.24s; }.people-section.is-visible .staff-stat-card:nth-child(5) { transition-delay: 0.32s; }.people-section.is-visible .staff-stat-card:nth-child(6) { transition-delay: 0.4s; }
.people-section.is-visible .training-story::before { transform: scaleX(1); }
.people-section.is-visible .training-step { animation: training-step-enter 0.72s cubic-bezier(0.16, 1, 0.3, 1) forwards; }
.people-section.is-visible .training-step:nth-child(1) { animation-delay: 0.64s; }
.people-section.is-visible .training-step:nth-child(2) { animation-delay: 1.58s; }
.people-section.is-visible .training-step:nth-child(3) { animation-delay: 2.52s; }
.people-section.is-visible .training-step:nth-child(4) { animation-delay: 3.46s; }
.people-section.is-visible .training-step:not(:last-child)::after { animation: training-line-draw 0.82s cubic-bezier(0.16, 1, 0.3, 1) forwards; }
.people-section.is-visible .training-step:nth-child(1)::after { animation-delay: 1.15s; }
.people-section.is-visible .training-step:nth-child(2)::after { animation-delay: 2.09s; }
.people-section.is-visible .training-step:nth-child(3)::after { animation-delay: 3.03s; }
.people-section.is-visible .training-step:not(:last-child)::before { animation: training-pulse-travel 0.82s cubic-bezier(0.16, 1, 0.3, 1) forwards; }
.people-section.is-visible .training-step:nth-child(1)::before { animation-delay: 1.15s; }
.people-section.is-visible .training-step:nth-child(2)::before { animation-delay: 2.09s; }
.people-section.is-visible .training-step:nth-child(3)::before { animation-delay: 3.03s; }
.people-section.is-visible .training-step i { animation: training-icon-enter 0.55s ease forwards; }
.people-section.is-visible .training-step:nth-child(1) i { animation-delay: 0.84s; }
.people-section.is-visible .training-step:nth-child(2) i { animation-delay: 1.78s; }
.people-section.is-visible .training-step:nth-child(3) i { animation-delay: 2.72s; }
.people-section.is-visible .training-step:nth-child(4) i { animation-delay: 3.66s; }

.training-path.is-animated .training-step { animation: training-step-enter 0.72s cubic-bezier(0.16, 1, 0.3, 1) forwards; }
.training-path.is-animated .training-step:nth-child(1) { animation-delay: 0.64s; }.training-path.is-animated .training-step:nth-child(2) { animation-delay: 1.58s; }.training-path.is-animated .training-step:nth-child(3) { animation-delay: 2.52s; }.training-path.is-animated .training-step:nth-child(4) { animation-delay: 3.46s; }
.training-path.is-animated .training-step:not(:last-child)::after { animation: training-line-draw 0.82s cubic-bezier(0.16, 1, 0.3, 1) forwards; }
.training-path.is-animated .training-step:nth-child(1)::after { animation-delay: 1.15s; }.training-path.is-animated .training-step:nth-child(2)::after { animation-delay: 2.09s; }.training-path.is-animated .training-step:nth-child(3)::after { animation-delay: 3.03s; }
.training-path.is-animated .training-step:not(:last-child)::before { animation: training-pulse-travel 0.82s cubic-bezier(0.16, 1, 0.3, 1) forwards; }
.training-path.is-animated .training-step:nth-child(1)::before { animation-delay: 1.15s; }.training-path.is-animated .training-step:nth-child(2)::before { animation-delay: 2.09s; }.training-path.is-animated .training-step:nth-child(3)::before { animation-delay: 3.03s; }
.training-path.is-animated .training-step i { animation: training-icon-enter 0.55s ease forwards; }
.training-path.is-animated .training-step:nth-child(1) i { animation-delay: 0.84s; }.training-path.is-animated .training-step:nth-child(2) i { animation-delay: 1.78s; }.training-path.is-animated .training-step:nth-child(3) i { animation-delay: 2.72s; }.training-path.is-animated .training-step:nth-child(4) i { animation-delay: 3.66s; }

@keyframes training-step-enter { to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes training-line-draw { to { transform: scaleX(1); } }
@keyframes training-icon-enter { to { opacity: 1; transform: translateY(0) scale(1); } }

@media (max-width: 1100px) { .staff-dashboard { grid-template-columns: repeat(3, minmax(0, 1fr)); }.training-story { grid-template-columns: 1fr; }.ate-credential { min-height: 150px; }.training-path { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 700px) { .people-heading h2 { white-space: normal; } }
@media (max-width: 620px) { .people-section { padding: 92px 0; }.staff-introduction { grid-template-columns: 1fr; gap: 10px; }.staff-dashboard { grid-template-columns: 1fr; }.staff-stat-card { min-height: 214px; }.training-story { margin-top: 60px; padding: 28px 22px; }.training-path { grid-template-columns: 1fr; gap: 22px; padding-left: 4px; }.training-step { grid-template-columns: 56px 1fr; justify-items: start; column-gap: 16px; text-align: left; }.training-step span { grid-row: span 2; }.training-step i { align-self: end; }.training-step strong { align-self: start; }.training-step:not(:last-child)::after { top: 56px; left: 27px; width: 2px; height: calc(100% + 22px); transform: scaleY(0); transform-origin: top; }.training-step:not(:last-child)::before { top: 56px; left: 23px; }.training-step.is-active:not(:last-child)::after { transform: scaleY(1); }.people-structures span { opacity: 0.6; } }

@media (max-width: 768px) {
    .service-tile.is-active {
        grid-column: span 1;
        min-height: auto;
    }
}

/* ==========================================================================
   CONTINUOUS ABOUT + MISSION CHAPTERS
   ========================================================================== */
.about-section > .people-section,
.about-section > .milestones-section {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
}

.about-section > .people-section {
    margin-top: 0;
    padding-top: 90px;
    background: radial-gradient(circle at 14% 24%, rgba(247, 240, 226, 0.72), transparent 28%), linear-gradient(180deg, rgba(247, 240, 226, 0.04), rgba(243, 232, 208, 0.52));
}

.about-section > .milestones-section {
    margin-top: 0;
    padding-top: 72px;
    background: radial-gradient(circle at 72% 14%, rgba(92, 150, 255, 0.13), transparent 26%), linear-gradient(180deg, rgba(232, 216, 184, 0.48), rgba(243, 232, 208, 0.75));
}

.milestones-section .section-header {
    margin-bottom: 32px;
    opacity: 0;
    filter: blur(8px);
    transform: translateY(30px);
    transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1), filter 0.8s cubic-bezier(0.16, 1, 0.3, 1), transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

.milestones-section .section-header h2 {
    color: #03091C !important;
}

.milestones-section .section-subtitle {
    color: #2D4A68 !important;
}

.journey-ending {
    color: #03091C !important;
}

.milestones-section.is-active .section-header {
    opacity: 1 !important;
    filter: blur(0) !important;
    transform: translateY(0) !important;
}

.journey-stage { margin-top: 24px; }
.journey-track { transition-duration: 1.6s; }
.milestone-node { transition-duration: 0.82s; }

.milestones-section::after {
    content: '';
    position: absolute;
    z-index: 0;
    width: 30vw;
    height: 14vw;
    right: -7vw;
    bottom: 10%;
    border: 1px solid rgba(47, 111, 255, 0.18);
    background: linear-gradient(135deg, rgba(247, 240, 226, 0.6), rgba(232, 216, 184, 0.12));
    box-shadow: 0 24px 48px rgba(3, 9, 28, 0.09);
    transform: perspective(900px) rotateX(58deg) rotateZ(-16deg);
    animation: milestone-structure-drift 12s ease-in-out infinite alternate;
    pointer-events: none;
}

@keyframes milestone-structure-drift {
    to { translate: -20px -15px; rotate: y 3deg; }
}

.vision-section { padding-bottom: 0; }
.vision-section > .peers-section {
    margin-top: 100px;
    padding: 90px 0 110px;
    background: transparent;
    border-top: 1px solid rgba(92, 150, 255, 0.16);
}

.vision-section > .peers-section::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: -1;
    background: radial-gradient(circle at 50% 0%, rgba(47, 111, 255, 0.16), transparent 42%);
}

.vision-section > .peers-section .foundation-kicker { color: var(--beige); }
.vision-section > .peers-section .section-title { color: var(--cream); background: none; -webkit-text-fill-color: currentColor; }
.vision-section > .peers-section .peer-item { transition-duration: 0.82s, 0.45s, 0.45s, 0.45s; }
.vision-section > .peers-section .peer-item:hover { transition-duration: 0.45s; }

@media (max-width: 768px) {
    .about-section > .people-section { padding-top: 72px; }
    .about-section > .milestones-section { padding-top: 58px; }
    .vision-section > .peers-section { margin-top: 66px; padding: 70px 0 86px; }
}

/* CSR SECTION & TIMELINE (FIXED SCROLL & PROGRESSIVE LINE) */
.csr-section {
    background: var(--warm-beige);
    padding: 90px 0;
}

.csr-stat {
    text-align: center;
    margin-bottom: 40px;
}

.csr-stat strong {
    font-family: var(--font-heading);
    font-size: 3rem;
    font-weight: 800;
    color: var(--primary-navy);
    display: block;
}

.csr-stat span {
    font-size: 1rem;
    color: var(--text-muted);
    font-weight: 600;
}

.csr-scroll-stage {
    position: relative;
    max-width: 900px;
    margin: 0 auto;
}

.csr-timeline {
    position: relative;
}

.csr-svg {
    width: 100%;
    height: auto;
    display: block;
}

.csr-track-shadow {
    stroke: rgba(11, 42, 74, 0.1);
    stroke-width: 3;
    fill: none;
}

.csr-track {
    stroke: var(--primary-navy);
    stroke-width: 3;
    fill: none;
    stroke-dasharray: 1000;
    stroke-dashoffset: 1000;
    transition: stroke-dashoffset 2s cubic-bezier(0.16, 1, 0.3, 1);
}

.csr-branch {
    stroke: var(--accent-gold);
    stroke-width: 2;
    fill: none;
    stroke-dasharray: 300;
    stroke-dashoffset: 300;
    transition: stroke-dashoffset 0.8s ease;
}

.csr-items {
    position: absolute;
    inset: 0;
}

.csr-item {
    position: absolute;
    display: flex;
    align-items: center;
    gap: 16px;
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.5s ease, transform 0.5s ease;
}

.csr-item.is-visible {
    opacity: 1;
    transform: translateY(0);
}

.csr-node {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: var(--primary-navy);
    color: var(--accent-gold);
    border: 3px solid var(--accent-gold);
    display: grid;
    place-items: center;
    font-weight: 800;
    font-size: 0.8rem;
    flex-shrink: 0;
}

.csr-card {
    background: #FFFFFF;
    border: 1px solid rgba(200, 155, 60, 0.35);
    border-radius: var(--radius-md);
    padding: 16px 20px;
    box-shadow: var(--shadow-light-card);
    min-width: 220px;
}

.csr-card strong {
    display: block;
    color: var(--primary-navy);
    font-size: 1.1rem;
}

.csr-card span {
    font-size: 0.85rem;
    color: var(--text-muted);
}

.csr-item.csr-right { left: 52%; }
.csr-item.csr-left { right: 52%; flex-direction: row-reverse; text-align: right; }

.csr-item[data-index="0"] { top: 140px; }
.csr-item[data-index="1"] { top: 320px; }
.csr-item[data-index="2"] { top: 500px; }
.csr-item[data-index="3"] { top: 680px; }
.csr-item[data-index="4"] { top: 860px; }
.csr-item[data-index="5"] { top: 1040px; }

/* DOWNLOADABLE DOCUMENTS PAGE */
.downloads-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}

.doc-card {
    background: #FFFFFF;
    border-radius: var(--radius-lg);
    padding: 24px;
    border: 1px solid rgba(200, 155, 60, 0.35);
    box-shadow: var(--shadow-light-card);
    display: flex;
    align-items: center;
    gap: 16px;
    transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
    text-decoration: none;
}

.doc-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 30px rgba(11, 42, 74, 0.1);
    border-color: var(--accent-gold);
}

.doc-icon {
    width: 50px;
    height: 50px;
    border-radius: var(--radius-md);
    background: rgba(200, 155, 60, 0.12);
    color: var(--accent-gold);
    display: grid;
    place-items: center;
    font-size: 1.5rem;
    flex-shrink: 0;
}

.doc-info {
    flex-grow: 1;
}

.doc-info h4 {
    font-size: 1.05rem;
    color: var(--primary-navy);
    margin-bottom: 4px;
}

.doc-meta {
    font-size: 0.78rem;
    color: var(--text-dim);
    font-weight: 600;
}

.download-link {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: var(--gradient-navy);
    color: #FFFFFF;
    display: grid;
    place-items: center;
    font-size: 1rem;
    flex-shrink: 0;
    transition: transform 0.25s ease;
    border: 1px solid var(--accent-gold);
}

.doc-card:hover .download-link {
    transform: scale(1.1);
}

/* CONTACT PAGE & FORM */
.contact-overview {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 28px;
}

.contact-form-wrap {
    display: flex;
    justify-content: center;
    margin-top: 32px;
}

.contact-form-wrap .contact-form-card {
    width: min(100%, 720px);
    border-color: rgba(47, 111, 255, 0.52);
    box-shadow: 0 14px 32px rgba(7, 24, 61, 0.1), 0 0 20px rgba(47, 111, 255, 0.18);
}

.contact-info-card, .contact-form-card {
    background: #FFFFFF;
    border-radius: var(--radius-lg);
    padding: 40px;
    border: 1px solid rgba(200, 155, 60, 0.35);
    box-shadow: var(--shadow-light-card);
}

.contact-map-card {
    min-height: 420px;
    overflow: hidden;
    border: 1px solid rgba(47, 111, 255, 0.3);
    border-radius: var(--radius-lg);
    background: #FFFFFF;
    box-shadow: var(--shadow-light-card);
}

.contact-map-card iframe {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 420px;
    border: 0;
}

.contact-detail-list {
    display: flex;
    flex-direction: column;
    gap: 20px;
    margin: 24px 0;
}

.c-detail-item {
    display: flex;
    gap: 16px;
    align-items: flex-start;
}

.c-icon {
    width: 44px;
    height: 44px;
    border-radius: var(--radius-md);
    background: rgba(200, 155, 60, 0.12);
    color: var(--accent-gold);
    display: grid;
    place-items: center;
    font-size: 1.1rem;
    flex-shrink: 0;
}

.c-detail-item h5 {
    font-size: 1rem;
    color: var(--primary-navy);
    margin-bottom: 2px;
}

.form-group {
    margin-bottom: 20px;
}

.form-group label {
    display: block;
    font-size: 0.88rem;
    font-weight: 600;
    color: var(--primary-navy);
    margin-bottom: 6px;
}

.form-input {
    width: 100%;
    padding: 12px 16px;
    border: 1px solid rgba(11, 42, 74, 0.2);
    border-radius: var(--radius-sm);
    font-family: var(--font-body);
    font-size: 0.95rem;
    background: var(--warm-beige);
    color: var(--primary-navy);
    transition: border-color 0.25s ease;
}

.form-input:focus {
    outline: none;
    border-color: var(--accent-gold);
    box-shadow: 0 0 0 3px rgba(200, 155, 60, 0.2);
}

.form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.toast-notification {
    margin-top: 20px;
    padding: 16px;
    border-radius: var(--radius-md);
    font-size: 0.9rem;
    display: flex;
    align-items: center;
    gap: 12px;
}

.toast-success {
    background: rgba(200, 155, 60, 0.15);
    border: 1px solid var(--accent-gold);
    color: var(--primary-navy);
    font-weight: 600;
}

.toast-error {
    background: rgba(220, 38, 38, 0.1);
    border: 1px solid #DC2626;
    color: #DC2626;
}

.hidden {
    display: none !important;
}

/* FOOTER */
.main-footer {
    background: #000dc7a1;
    color: #FFFFFF;
    padding: 70px 0 30px 0;
    border-top: 1px solid var(--border-gold);
}

.main-footer .brand-logo {
    width: fit-content;
    padding: 10px 22px;
    border: 0;
    border-radius: 999px;
    background: #FFFFFF !important;
    box-shadow: 0 8px 20px rgba(7, 24, 61, 0.16);
}

.main-footer .brand-logo-img {
    display: block;
    width: auto;
    height: 38px;
    object-fit: contain;
    filter: none !important;
}

.footer-top-grid {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1.5fr;
    gap: 40px;
    margin-bottom: 50px;
}

.footer-col h4 {
    color: #FFFFFF;
    font-size: 1.1rem;
    margin-bottom: 20px;
}

.main-footer p,
.main-footer .footer-bottom,
.main-footer .footer-bottom-links a {
    color: rgba(255, 255, 255, 0.92);
}

.footer-desc {
    font-size: 0.9rem;
    line-height: 1.6;
    margin: 16px 0;
    color: rgba(255, 255, 255, 0.92);
}

.footer-links {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.footer-links a {
    color: rgba(255, 255, 255, 0.92);
    font-size: 0.88rem;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.footer-links a:hover {
    color: #FFFFFF;
    transform: translateX(4px);
}

.footer-socials {
    display: flex;
    gap: 12px;
}

.footer-socials a {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.08);
    color: #FFFFFF;
    display: grid;
    place-items: center;
    font-size: 0.9rem;
}

.footer-socials a:hover {
    background: var(--accent-gold);
    color: var(--primary-navy);
}

.footer-bottom {
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    padding-top: 24px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 0.85rem;
    flex-wrap: wrap;
    gap: 16px;
}

.footer-bottom-links {
    display: flex;
    gap: 16px;
}

.footer-bottom-links a {
    color: rgba(255, 255, 255, 0.92);
}

.footer-bottom-links a:hover {
    color: #FFFFFF;
}

/* RESPONSIVE BREAKPOINTS */
@media (max-width: 1024px) {
    body {
        padding-left: 0;
    }

    .hero-grid-split {
        grid-template-columns: 1fr;
    }

    .mvv-grid-3col, .downloads-grid, .accreditation-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .services-grid-12 {
        grid-template-columns: repeat(2, 1fr);
    }

    .footer-top-grid {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 768px) {
    .contact-overview {
        grid-template-columns: 1fr;
    }

    .contact-map-card,
    .contact-map-card iframe {
        min-height: 300px;
    }

    .staff-dashboard { grid-template-columns: repeat(2, minmax(0, 1fr)); }

    .main-header {
        top: 12px;
        width: calc(100% - 24px);
        border-radius: 8px;
    }

    .header-container {
        height: 60px;
        padding: 0 16px;
    }

    .brand-logo-img {
        height: 32px;
    }

    .nav-menu {
        display: none;
    }

    .nav-menu.active {
        display: flex;
        position: fixed;
        top: 80px;
        left: 50%;
        width: min(420px, calc(100% - 24px));
        padding: 14px;
        flex-direction: column;
        align-items: stretch;
        gap: 4px;
        border: 1px solid rgba(194, 216, 255, 0.24);
        border-radius: 8px;
        background: rgba(5, 22, 55, 0.94);
        backdrop-filter: blur(20px);
        -webkit-backdrop-filter: blur(20px);
        box-shadow: 0 26px 60px rgba(0, 0, 0, 0.38);
        transform: translateX(-50%);
        z-index: 1002;
    }

    .nav-link {
        text-align: left;
        padding: 12px 14px;
        font-size: 0.95rem;
    }

    .mega-menu-shell {
        top: 244px;
        width: calc(100% - 24px);
    }

    .mega-menu-panel,
    .mega-menu-panel-directors {
        width: 100%;
        max-height: calc(100vh - 268px);
        overflow-y: auto;
        padding: 20px;
        border-radius: 16px;
    }

    .director-menu-list {
        grid-template-columns: 1fr;
    }

    .mobile-toggle {
        display: block;
    }

    .btn-pill-white {
        padding: 8px 16px;
        font-size: 0.8rem;
    }

    .hero-headline {
        font-size: clamp(2.2rem, 8vw, 3.2rem);
        line-height: 1.15;
    }

    .desktop-only {
        display: none;
    }

    .hero-actions {
        flex-direction: column;
        width: 100%;
        max-width: 320px;
    }

    .btn-hero-primary, .btn-hero-secondary {
        width: 100%;
        justify-content: center;
    }

    .hero-content-wrapper {
        padding: 0 16px;
    }

    .grid-2-col, .directors-grid, .people-grid, .contact-grid {
        grid-template-columns: 1fr;
    }

    .mvv-grid-3col, .services-grid-12, .downloads-grid, .accreditation-grid {
        grid-template-columns: 1fr;
    }

    .footer-top-grid {
        grid-template-columns: 1fr;
    }

    .form-row {
        grid-template-columns: 1fr;
    }

    .milestone-node {
        position: static;
        width: 100%;
        margin-bottom: 20px;
    }

    .journey-stage {
        min-height: auto;
        display: flex;
        flex-direction: column;
        gap: 20px;
    }

    .journey-svg {
        display: none;
    }
}

/* ==========================================================================
   SERVICES, FOUNDATION CARDS & PEERS - PREMIUM COLOR REFINEMENT
   ========================================================================== */
.range-services-section .service-tile {
    position: relative;
    overflow: hidden;
    border-color: rgba(92, 150, 255, 0.32);
    box-shadow: 0 14px 30px rgba(3, 9, 28, 0.12), 0 0 18px rgba(47, 111, 255, 0.1);
}

.range-services-section .service-tile::before {
    content: '';
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: 0;
    background: linear-gradient(120deg, transparent 25%, rgba(255, 255, 255, 0.14), transparent 65%);
    transition: opacity 0.5s ease;
}

.range-services-section .service-tile:hover::before { opacity: 1; }
.range-services-section .service-tile:nth-child(4n + 1),
.range-services-section .service-tile:nth-child(4n + 4) {
    background: linear-gradient(145deg, #07183D, #0B1F4D);
    color: #F8EEDB;
}

.range-services-section .service-tile:nth-child(4n + 2) {
    background: linear-gradient(145deg, #1E56B8, #2563D9);
    color: #F8EEDB;
}

.range-services-section .service-tile:nth-child(4n + 3) {
    background: #F3E7CC;
    color: #07183D;
}

.range-services-section .service-tile:nth-child(4n + 1) h3,
.range-services-section .service-tile:nth-child(4n + 2) h3,
.range-services-section .service-tile:nth-child(4n + 4) h3 { color: #F8EEDB; }
.range-services-section .service-tile:nth-child(4n + 1) p,
.range-services-section .service-tile:nth-child(4n + 2) p,
.range-services-section .service-tile:nth-child(4n + 4) p { color: rgba(248, 238, 219, 0.82); }
.range-services-section .service-tile:nth-child(4n + 3) h3 { color: #07183D; }
.range-services-section .service-tile:nth-child(4n + 3) p { color: #304369; }

.range-services-section .service-tile i {
    position: relative;
    z-index: 1;
    color: #D5A62A;
    background: rgba(213, 166, 42, 0.14);
    border-color: rgba(213, 166, 42, 0.36);
}

.range-services-section .service-tile:nth-child(4n + 3) i {
    color: #1748A8;
    background: rgba(23, 72, 168, 0.1);
    border-color: rgba(23, 72, 168, 0.24);
}

.range-services-section .service-tile:hover {
    transform: translateY(-5px) scale(1.02);
    box-shadow: 0 20px 42px rgba(3, 9, 28, 0.18), 0 0 28px rgba(47, 111, 255, 0.24);
}

.vision-section .flip-card-3d {
    transform: perspective(1100px) translateZ(0);
    transition: transform 0.65s cubic-bezier(0.16, 1, 0.3, 1);
}

.vision-section .flip-card-3d:nth-child(2) { transform: perspective(1100px) translateZ(16px) scale(1.025); }
.vision-section .flip-card-3d:hover { transform: perspective(1100px) translateY(-8px) rotateX(2deg) rotateY(-2deg) scale(1.02); }

.vision-section .flip-card-front {
    display: grid;
    grid-template-rows: 62% 38%;
    background: #07183D;
    border: 1px solid rgba(92, 150, 255, 0.5);
    box-shadow: inset 0 0 22px rgba(47, 111, 255, 0.12), 0 0 24px rgba(47, 111, 255, 0.2), 0 18px 40px rgba(3, 9, 28, 0.34);
}

.vision-section .flip-card-front::before {
    content: '';
    position: absolute;
    inset: -1px;
    border-radius: inherit;
    padding: 1px;
    pointer-events: none;
    background: linear-gradient(120deg, rgba(213, 166, 42, 0.2), rgba(92, 150, 255, 0.8), rgba(213, 166, 42, 0.2));
    background-size: 250% 250%;
    animation: foundation-border-flow 8s ease-in-out infinite;
    -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
}

.vision-section .flip-card-img {
    width: 100%;
    height: 100%;
    padding: 28px 34px 18px;
    object-fit: contain;
    object-position: center;
    filter: drop-shadow(0 0 14px rgba(92, 150, 255, 0.28));
    transition: transform 0.6s ease, filter 0.6s ease;
}

.vision-section .flip-card-3d:hover .flip-card-img {
    transform: scale(1.05);
    filter: brightness(1.12) drop-shadow(0 0 20px rgba(213, 166, 42, 0.34));
}

.vision-section .flip-card-overlay {
    position: static;
    display: grid;
    place-items: center;
    padding: 18px;
    background: linear-gradient(180deg, rgba(7, 24, 61, 0.82), #07183D);
}

@keyframes foundation-border-flow {
    0%, 100% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
}

.vision-section .peers-section .peer-item,
.peers-section .peer-item {
    background: #F3E7CC;
    border-color: rgba(213, 166, 42, 0.66);
    box-shadow: 0 14px 30px rgba(3, 9, 28, 0.26), 0 0 18px rgba(47, 111, 255, 0.2);
    transition: opacity 0.8s ease, transform 0.6s cubic-bezier(0.16, 1, 0.3, 1), background 0.6s ease, border-color 0.6s ease, box-shadow 0.6s ease;
}

.vision-section .peers-section .peer-letter,
.peers-section .peer-letter { color: #D5A62A; text-shadow: 0 0 10px rgba(213, 166, 42, 0.3); }
.vision-section .peers-section .peer-copy h3,
.peers-section .peer-copy h3 { color: #07183D; }
.vision-section .peers-section .peer-copy p,
.peers-section .peer-copy p { color: #243961; opacity: 1; }

.vision-section .peers-section .peer-item:hover,
.peers-section .peer-item:hover {
    background: #F8EEDB;
    border-color: #5C96FF;
    transform: translateY(-7px) scale(1.02) perspective(900px) rotateX(2deg) rotateY(-1deg);
    box-shadow: 0 22px 42px rgba(3, 9, 28, 0.32), 0 0 28px rgba(47, 111, 255, 0.3);
}

@media (max-width: 768px) {
    .vision-section .flip-card-3d:nth-child(2) { transform: none; }
    .vision-section .flip-card-3d:hover { transform: translateY(-5px); }
}

/* ==========================================================================
   SECONDARY PAGES - SHARED FIXED-NAVIGATION LAYOUT
   ========================================================================== */
:root { --page-header-offset: 116px; }

.page-hero {
    position: relative;
    overflow: hidden;
    padding: var(--page-header-offset) 0 72px;
    min-height: 330px;
    display: grid;
    align-items: end;
    background: radial-gradient(circle at 78% 16%, rgba(92, 150, 255, 0.22), transparent 28%), linear-gradient(145deg, #03091C, #071A40 62%, #1748A8);
}

.page-hero::before,
.page-hero::after {
    content: '';
    position: absolute;
    pointer-events: none;
}

.page-hero::before {
    width: 36vw;
    height: 12vw;
    right: -8vw;
    top: 18%;
    border: 1px solid rgba(92, 150, 255, 0.26);
    background: linear-gradient(135deg, rgba(47, 111, 255, 0.18), transparent);
    box-shadow: 0 20px 46px rgba(3, 9, 28, 0.3);
    transform: perspective(900px) rotateX(58deg) rotateZ(-16deg);
    animation: page-geometry-drift 14s ease-in-out infinite alternate;
}

.page-hero::after {
    inset: 0;
    background: linear-gradient(120deg, transparent 10%, rgba(92, 150, 255, 0.08) 10.2%, transparent 10.5%);
}

.page-hero .container { position: relative; z-index: 1; }
.page-hero h1 { color: #F8EEDB; font-size: clamp(2.4rem, 5vw, 4.8rem); }
.page-hero p, .page-hero .breadcrumb, .page-hero .breadcrumb a { color: rgba(248, 238, 219, 0.82); }

@keyframes page-geometry-drift { to { translate: -18px 14px; } }

body:has(.csr-section) { background: #F3E7CC; }
body:has(.csr-section) .page-hero {
    background: radial-gradient(circle at 78% 16%, rgba(92, 150, 255, 0.18), transparent 30%), linear-gradient(145deg, #F8EEDB, #F3E7CC 60%, #EFE1C3);
}

body:has(.csr-section) .page-hero h1,
body:has(.csr-section) .page-hero p,
body:has(.csr-section) .page-hero .breadcrumb,
body:has(.csr-section) .page-hero .breadcrumb a { color: #07183D; }

body:has(.csr-section) .csr-section {
    position: relative;
    overflow: hidden;
    background: radial-gradient(circle at 14% 12%, rgba(248, 238, 219, 0.88), transparent 28%), linear-gradient(145deg, #F3E7CC, #F8EEDB 54%, #EFE1C3);
}

body:has(.csr-section) .csr-section::before {
    content: '';
    position: absolute;
    width: 28vw;
    height: 18vw;
    left: -8vw;
    bottom: 12%;
    border: 1px solid rgba(23, 72, 168, 0.15);
    background: linear-gradient(135deg, rgba(248, 238, 219, 0.6), rgba(92, 150, 255, 0.08));
    transform: perspective(900px) rotateX(58deg) rotateZ(18deg);
    animation: page-geometry-drift 16s ease-in-out infinite alternate-reverse;
}

body:has(.csr-section) .csr-section .container { position: relative; z-index: 1; }

body:has(.directors-grid) .white-section-bg,
body:has(.downloads-grid) .white-section-bg {
    position: relative;
    overflow: hidden;
    background: radial-gradient(circle at 84% 8%, rgba(92, 150, 255, 0.12), transparent 28%), linear-gradient(145deg, #F8EEDB, #F3E7CC);
}

body:has(.downloads-grid) .doc-card {
    border-color: rgba(47, 111, 255, 0.24);
    background: rgba(248, 238, 219, 0.88);
    box-shadow: 0 12px 28px rgba(3, 9, 28, 0.09), 0 0 14px rgba(47, 111, 255, 0.08);
    transition: transform 0.5s ease, box-shadow 0.5s ease, border-color 0.5s ease;
}

body:has(.downloads-grid) .doc-card:hover {
    transform: translateY(-6px);
    border-color: #5C96FF;
    box-shadow: 0 20px 38px rgba(3, 9, 28, 0.14), 0 0 24px rgba(47, 111, 255, 0.2);
}

body:has(.directors-grid) .director-card {
    opacity: 0;
    transform: translateY(24px);
    animation: secondary-card-enter 0.85s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

body:has(.directors-grid) .director-card:nth-child(2) { animation-delay: 0.16s; }
@keyframes secondary-card-enter { to { opacity: 1; transform: translateY(0); } }

.contact-form-card .form-input {
    background: #F8EEDB;
    border-color: rgba(47, 111, 255, 0.26);
}

.contact-form-card .form-input:focus {
    border-color: #2563D9;
    box-shadow: 0 0 0 3px rgba(47, 111, 255, 0.14), 0 0 16px rgba(47, 111, 255, 0.14);
}

@media (max-width: 768px) {
    :root { --page-header-offset: 92px; }
    .page-hero { min-height: 270px; padding-bottom: 52px; }
    .page-hero::before { width: 56vw; height: 24vw; }
}

/* Homepage-only premium two-column hero. Other pages do not use .home-page. */
html:has(.home-page) {
    overflow-x: clip;
}

.home-page {
    overflow-x: hidden;
}

.home-page .home-hero {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    min-height: 720px;
    padding: 126px 0 64px;
    background: #f4ebdd;
}

.home-page .home-hero::after {
    position: absolute;
    content: '';
    z-index: -1;
    top: 0;
    right: 0;
    width: 52%;
    height: 100%;
    background: #fff;
}

.home-page .home-hero-inner {
    width: min(1360px, calc(100% - 64px));
    min-height: 530px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(360px, 0.92fr);
    align-items: center;
    gap: 52px;
}

.home-page .home-hero-content {
    max-width: 650px;
}

.home-page .home-hero-kicker {
    margin: 0 0 20px;
    color: #173f67;
    font-family: var(--font-body);
    font-size: 0.76rem;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    opacity: 0;
    transform: translateY(20px);
    animation: homeHeroReveal 0.7s 0.1s ease forwards;
}

.home-page .home-hero h1 {
    margin: 0;
    color: #121926;
    font-family: Georgia, serif;
    font-size: clamp(3.25rem, 5.5vw, 5.45rem);
    font-weight: 500;
    letter-spacing: 0;
    line-height: 0.96;
    opacity: 0;
    transform: translateY(26px);
    animation: homeHeroReveal 0.8s 0.2s ease forwards;
}

.home-page .home-hero h1 span {
    display: block;
    color: #073b70;
}

.home-page .home-hero h1 strong {
    color: #073b70;
    font-weight: 600;
}

.home-page .home-hero-copy {
    max-width: 570px;
    margin: 28px 0 0;
    color: #405064;
    font-size: 1.04rem;
    opacity: 0;
    transform: translateY(22px);
    animation: homeHeroReveal 0.7s 0.35s ease forwards;
}

.home-page .home-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin-top: 34px;
    opacity: 0;
    transform: translateY(22px);
    animation: homeHeroReveal 0.7s 0.48s ease forwards;
}

.home-page .home-hero-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 52px;
    padding: 0 22px;
    border-radius: 8px;
    font-family: var(--font-body);
    font-size: 0.94rem;
    font-weight: 700;
    transition: background-color 0.25s ease, color 0.25s ease, transform 0.25s ease, box-shadow 0.25s ease;
}

.home-page .home-hero-button:hover {
    transform: translateY(-2px);
}

.home-page .home-hero-button i {
    transition: transform 0.25s ease;
}

.home-page .home-hero-button:hover i {
    transform: translateX(4px);
}

.home-page .home-hero-button-primary {
    background: #073b70;
    color: #fff;
    box-shadow: 0 12px 24px rgba(7, 59, 112, 0.2);
}

.home-page .home-hero-button-primary:hover {
    background: #052d56;
}

.home-page .home-hero-button-secondary {
    border: 1px solid rgba(7, 59, 112, 0.24);
    background: rgba(255, 255, 255, 0.35);
    color: #073b70;
}

.home-page .home-hero-button-secondary:hover {
    background: #fff;
}

.home-page .home-hero-media {
    position: relative;
    width: 100%;
    max-width: 100%;
    align-self: stretch;
    min-height: 530px;
    overflow: hidden;
    border-radius: 96px 12px 12px 96px;
    box-shadow: 0 24px 50px rgba(7, 31, 59, 0.15);
    opacity: 0;
    transform: translateX(36px) scale(1.04);
    animation: homeHeroMediaReveal 0.85s 0.25s ease forwards;
}

.home-page .home-hero-media::before {
    position: absolute;
    content: '';
    z-index: 1;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(90deg, rgba(244, 235, 221, 0.18), transparent 35%);
}

.home-page .home-hero-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.6s ease;
}

.home-page .home-hero-media:hover img {
    transform: scale(1.025);
}

@keyframes homeHeroReveal {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes homeHeroMediaReveal {
    to {
        opacity: 1;
        transform: translateX(0) scale(1);
    }
}

@media (max-width: 860px) {
    .home-page .home-hero {
        min-height: 0;
        padding: 116px 0 56px;
    }

    .home-page .home-hero::after {
        display: none;
    }

    .home-page .home-hero-inner {
        width: min(680px, calc(100% - 40px));
        grid-template-columns: 1fr;
        gap: 38px;
    }

    .home-page .home-hero-media {
        min-height: 420px;
        border-radius: 54px 12px 12px 54px;
    }
}

@media (max-width: 560px) {
    .home-page .home-hero {
        padding-top: 106px;
    }

    .home-page .home-hero-inner {
        width: min(100% - 32px, 480px);
    }

    .home-page .home-hero h1 {
        font-size: clamp(2.7rem, 13vw, 3.6rem);
    }

    .home-page .home-hero-actions {
        flex-direction: column;
    }

    .home-page .home-hero-button {
        width: 100%;
    }

    .home-page .home-hero-media {
        min-height: 330px;
        border-radius: 42px 10px 10px 42px;
    }
}

/* Mandatory homepage content sections. These rules are isolated to index.html. */
.home-page .about-section {
    isolation: isolate;
    display: block !important;
    min-height: 760px;
    visibility: visible !important;
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
    background: #ffffff !important;
}

.home-page .about-section .section-bg-fx,
.home-page .about-section .about-atmosphere,
.home-page .about-section .about-geometry {
    opacity: 0.1 !important;
}

.home-page .about-section .container,
.home-page .about-section .about-content-left,
.home-page .about-section .about-content-right {
    visibility: visible !important;
    opacity: 1 !important;
    filter: none !important;
}

.home-page .about-section .container {
    z-index: 3;
}

.home-page .about-section + .milestones-section {
    margin-top: 0;
}

.home-page .about-section .grid-2-col {
    grid-template-columns: 1fr;
    gap: 0;
    align-items: center;
}

.home-page .about-section .about-content-left {
    order: initial;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.home-page .about-section .about-content-right {
    order: initial;
    display: block;
}

.home-page .about-section .about-bottom-row {
    display: grid;
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
    gap: 42px;
    align-items: start;
    width: 100%;
}

.home-page .home-about-kicker,
.home-page .home-training-kicker {
    margin: 0 0 12px;
    color: #073b70;
    font-size: 0.76rem;
    font-weight: 800;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.home-page .home-about-media {
    overflow: hidden;
    min-height: 470px;
    border-radius: 14px;
    box-shadow: 0 22px 45px rgba(3, 9, 28, 0.16);
    opacity: 0;
    transform: scale(1.03);
    transition: opacity 0.75s ease, transform 0.75s ease;
}

.home-page .about-section.is-visible .home-about-media {
    opacity: 1;
    transform: scale(1);
}

.home-page .home-about-media img {
    width: 100%;
    height: 100%;
    object-fit: cover !important;
    transition: transform 0.7s ease;
}

.home-page .home-about-media:hover img {
    transform: scale(1.03);
}

.home-page .home-about-link {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    margin-top: 24px;
    color: #073b70;
    font-weight: 800;
}

.home-page .about-section .about-chapter-heading,
.home-page .about-section .section-title,
.home-page .about-section .lead-text,
.home-page .about-section .body-text,
.home-page .about-section .highlight-item h4,
.home-page .about-section .highlight-item p {
    color: #0b1f3a !important;
}

.home-page .about-section .about-chapter-heading h2 {
    text-shadow: 0 2px 12px rgba(47, 111, 255, 0.12);
}

.home-page .about-section .text-gradient-gold {
    color: #0b1f3a !important;
    background: none;
    -webkit-text-fill-color: currentColor;
}

.home-page .about-section .glass-card-light {
    margin-top: 0;
    padding: 28px;
    border-color: rgba(7, 59, 112, 0.24);
    background: #f3e7d3;
    box-shadow: 0 14px 30px rgba(7, 24, 61, 0.1), 0 0 14px rgba(47, 111, 255, 0.08);
    transition: opacity 0.7s ease, transform 0.7s ease, box-shadow 0.35s ease;
}

.home-page .about-section .metric-box {
    background: rgba(255, 255, 255, 0.65);
}

.home-page .about-section .glass-card-light .about-highlights {
    margin-top: 24px;
    padding-top: 22px;
    border-top: 1px solid rgba(7, 59, 112, 0.16);
}

.home-page .home-hero-content {
    max-width: 590px;
    text-align: left;
}

.home-page .home-hero h1 {
    max-width: 560px;
    line-height: 1.05;
}

.home-page .home-hero-copy {
    margin-top: 30px;
    max-width: 540px;
}

.home-page .home-hero-actions {
    margin-top: 30px;
}

.home-page .milestones-section {
    background: linear-gradient(180deg, #ffffff 0%, #fbf8f2 22%, #f7f0e5 48%, #f3e7d3 66%, #ffffff 100%) !important;
}

.home-page .milestones-section .section-bg-fx {
    opacity: 0.35;
}

.home-page .milestones-section .section-title,
.home-page .milestones-section .section-subtitle {
    color: #0b1f3a !important;
}

.home-page .about-section .glass-card-light .highlight-item {
    padding: 12px;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.42);
}

.home-page .about-section .glass-card-light .highlight-item p {
    color: #4a4a4a !important;
}

.home-page .about-section .glass-card-light:hover {
    box-shadow: 0 18px 34px rgba(7, 24, 61, 0.12), 0 0 18px rgba(47, 111, 255, 0.14);
}

.home-page .about-section .metric-value,
.home-page .about-section .metric-label,
.home-page .about-section .card-footer-quote,
.home-page .about-section .card-footer-quote p,
.home-page .about-section .card-header-flex h3 {
    color: #263238 !important;
}

.home-page .home-about-link i,
.home-page .service-tile i {
    transition: transform 0.25s ease;
}

.home-page .home-about-link:hover i {
    transform: translateX(4px);
}

.home-page .home-staff-section {
    background: linear-gradient(145deg, #f8f0e2, #f1e2ca);
}

.home-page .home-staff-section .people-heading,
.home-page .home-staff-section .staff-introduction,
.home-page .home-staff-section .staff-stat-card {
    opacity: 1;
    filter: none;
    transform: none;
}

.home-page .home-staff-section .staff-stat-card {
    background: rgba(255, 255, 255, 0.78);
}

.home-page .home-training-feature {
    display: grid;
    grid-template-columns: minmax(280px, 0.88fr) minmax(0, 1.12fr);
    gap: 42px;
    align-items: center;
    margin-top: 74px;
    padding: 28px;
    border: 1px solid rgba(7, 59, 112, 0.16);
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.56);
    box-shadow: 0 20px 46px rgba(3, 9, 28, 0.1);
}

.home-page .home-training-media {
    min-height: 300px;
    overflow: hidden;
    border-radius: 12px 48px 12px 48px;
}

.home-page .home-training-media img {
    width: 100%;
    height: 100%;
    object-fit: cover !important;
    transition: transform 0.7s ease;
}

.home-page .home-training-feature:hover .home-training-media img {
    transform: scale(1.03);
}

.home-page .home-training-copy h3 {
    margin: 0 0 16px;
    color: #071a40;
    font-size: clamp(2rem, 3vw, 3rem);
}

.home-page .home-training-copy p {
    color: #304369;
    font-size: 1.02rem;
}

.home-page #contact {
    background: linear-gradient(135deg, #061733, #0b2a4a);
}

.home-page #contact .section-title,
.home-page #contact .section-tag,
.home-page #contact .section-subtitle {
    color: #f7f0e2;
}

.home-page #contact .contact-info-card,
.home-page #contact .contact-form-card {
    border-color: rgba(242, 229, 207, 0.24);
    background: rgba(255, 255, 255, 0.94);
}

.home-page #core-values .peer-item {
    transform: translateX(-40px) !important;
}

.home-page #core-values .peer-item.is-visible {
    transform: translateX(0) !important;
}

@media (max-width: 768px) {
    .contact-overview {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .contact-overview > * {
        min-width: 0;
        width: 100%;
    }
}

@media (max-width: 860px) {
    .home-page .about-section .about-bottom-row {
        grid-template-columns: 1fr;
        gap: 32px;
    }

    .home-page .home-about-media {
        min-height: 440px;
    }

    .home-page .home-training-feature {
        grid-template-columns: 1fr;
        gap: 28px;
    }
}

@media (max-width: 560px) {
    .home-page .home-about-media {
        min-height: 300px;
        border-radius: 12px;
    }

    .home-page .about-section .about-content-left {
        padding: 24px 20px;
    }

    .home-page .home-training-feature {
        margin-top: 48px;
        padding: 18px;
    }

    .home-page .home-training-media {
        min-height: 230px;
    }
}

/* Homepage-only warm beige system for Mission, PEERS and Accreditations. */
.home-page #mission-vision-values,
.home-page #core-values,
.home-page #accreditations {
    position: relative;
    isolation: isolate;
    color: #07183d;
    background: radial-gradient(circle at 82% 12%, rgba(47, 111, 255, 0.1), transparent 25%), radial-gradient(circle at 16% 84%, rgba(213, 166, 42, 0.11), transparent 26%), linear-gradient(145deg, #f8f0e2, #f1e2ca) !important;
}

.home-page #mission-vision-values {
    background: #ffffff !important;
}

.home-page #mission-vision-values::before {
    display: none;
}

.home-page #accreditations {
    color: #07183d;
    background: radial-gradient(circle at 84% 14%, rgba(243, 231, 211, 0.52), transparent 28%), radial-gradient(circle at 14% 82%, rgba(47, 111, 255, 0.07), transparent 24%), #ffffff !important;
}

.home-page #mission-vision-values::before,
.home-page #core-values::before,
.home-page #accreditations::before {
    position: absolute;
    z-index: -1;
    content: '';
    inset: 0;
    pointer-events: none;
    opacity: 0.55;
    background: repeating-linear-gradient(125deg, transparent 0, transparent 92px, rgba(7, 59, 112, 0.035) 93px, transparent 95px);
}

.home-page #mission-vision-values .foundation-kicker,
.home-page #core-values .foundation-kicker,
.home-page #mission-vision-values .section-title,
.home-page #core-values .section-title,
.home-page #mission-vision-values .section-subtitle,
.home-page #core-values .section-subtitle {
    color: #07183d !important;
}

body:has(.downloads-grid) .page-hero h1 {
    text-transform: uppercase;
}

.home-page #accreditations .foundation-kicker,
.home-page #accreditations .section-title,
.home-page #accreditations .section-subtitle {
    color: #07183d !important;
}

.home-page #mission-vision-values .text-gradient,
.home-page #core-values .text-gradient {
    background: linear-gradient(135deg, #073b70, #1748a8);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.home-page #mission-vision-values .flip-card-3d {
    height: 460px;
}

.home-page #mission-vision-values .flip-card-front,
.home-page #mission-vision-values .flip-card-back {
    border: 1px solid rgba(7, 59, 112, 0.28);
    box-shadow: 0 16px 34px rgba(7, 24, 61, 0.12);
    transition: border-color 0.35s ease, box-shadow 0.35s ease, background 0.35s ease;
}

.home-page #mission-vision-values .flip-card-front {
    background: #fffaf1;
}

.home-page #mission-vision-values .flip-card-img-container {
    height: 100%;
}

.home-page #mission-vision-values .flip-card-img {
    width: 100%;
    height: 100% !important;
    object-fit: cover !important;
    transition: transform 0.65s ease;
}

.home-page #mission-vision-values .flip-card-back {
    background: linear-gradient(145deg, #fffaf1, #f3e7cc);
}

.home-page #mission-vision-values .flip-card-back h3,
.home-page #mission-vision-values .flip-card-back p,
.home-page #mission-vision-values .flip-card-back li,
.home-page #mission-vision-values .flip-card-back strong {
    color: #07183d !important;
}

.home-page #mission-vision-values .flip-card-3d:hover .flip-card-front,
.home-page #mission-vision-values .flip-card-3d:hover .flip-card-back {
    border-color: rgba(213, 166, 42, 0.8);
    box-shadow: 0 22px 44px rgba(7, 24, 61, 0.16), 0 0 22px rgba(47, 111, 255, 0.2);
}

.home-page #mission-vision-values .flip-card-3d:hover .flip-card-img {
    transform: scale(1.04);
}

.home-page #core-values {
    padding-top: 90px;
    padding-bottom: 90px;
}

.home-page #core-values .peers-ribbon {
    gap: 16px;
}

.home-page #core-values .peer-item {
    background: rgba(255, 250, 241, 0.94) !important;
    border: 1px solid rgba(7, 59, 112, 0.24) !important;
    border-radius: 14px;
    box-shadow: 0 12px 28px rgba(7, 24, 61, 0.1);
    color: #07183d !important;
    transition: transform 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease, background 0.35s ease;
}

.home-page #core-values .peer-item h3,
.home-page #core-values .peer-item p {
    color: #07183d !important;
}

.home-page #core-values .peer-letter {
    color: #073b70 !important;
    text-shadow: none;
}

.home-page #core-values .peer-item:hover {
    transform: translateY(-7px);
    background: #fffdf7;
    border-color: rgba(213, 166, 42, 0.8) !important;
    box-shadow: 0 20px 38px rgba(7, 24, 61, 0.13), 0 0 20px rgba(47, 111, 255, 0.18);
}

.home-page #core-values .peer-item,
.home-page #core-values .peer-item.is-visible {
    opacity: 1 !important;
    transform: translateY(0) scale(1) !important;
}

.home-page #accreditations {
    margin: 72px -32px -90px;
    padding: 90px 32px;
    border-top: 1px solid rgba(7, 59, 112, 0.14);
}

.home-page #accreditations .accreditation-orbit-card,
.home-page #accreditations .accreditation-info-card {
    border: 1px solid rgba(7, 59, 112, 0.26) !important;
    background: linear-gradient(145deg, #fffdf7, #f8eedb) !important;
    box-shadow: 0 10px 35px rgba(7, 24, 61, 0.14), 0 0 18px rgba(47, 111, 255, 0.14);
    color: #07183d !important;
    transition: transform 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease, background 0.35s ease;
}

.home-page #accreditations .accreditation-orbit-card {
    min-width: 230px;
    min-height: 180px;
    padding: 28px 24px;
}

.home-page #accreditations .accreditation-orbit-wrap {
    width: min(680px, 94vw);
    height: 440px;
}

.home-page #accreditations .accreditation-info-wrap {
    width: min(94%, 980px);
    max-width: none;
    height: auto;
    margin-inline: auto;
    display: grid;
    gap: 14px;
    overflow: visible;
}

.home-page #accreditations .accreditation-info-card {
    position: relative;
    inset: auto;
    width: 100%;
    min-height: 180px;
    padding: 30px 34px;
    opacity: 1;
    transform: none !important;
    pointer-events: auto;
    transition: none !important;
}

.home-page #accreditations .accreditation-info-card.active {
    transform: none !important;
    transition: none !important;
}

.home-page #accreditations .accreditation-orbit-card h3,
.home-page #accreditations .accreditation-info-card h4,
.home-page #accreditations .accreditation-info-card p {
    color: #07183d !important;
}

.home-page #accreditations .accreditation-mark {
    color: #073b70 !important;
    background: rgba(7, 59, 112, 0.07);
    border-color: rgba(213, 166, 42, 0.62);
}

.home-page #accreditations .accreditation-orbit-card.active {
    border-color: rgba(213, 166, 42, 0.9) !important;
    box-shadow: 0 22px 42px rgba(7, 24, 61, 0.16), 0 0 26px rgba(47, 111, 255, 0.2);
}

.home-page #accreditations .accreditation-orbit-card:hover {
    transform: translateY(-6px) scale(1.02);
    background: linear-gradient(145deg, #fffaf1, #f3e7d3) !important;
    border-color: rgba(92, 150, 255, 0.95) !important;
    box-shadow: 0 18px 42px rgba(7, 24, 61, 0.18), 0 0 24px rgba(47, 111, 255, 0.34);
}

.home-page #accreditations .accreditation-info-card:hover {
    transform: none;
    background: linear-gradient(145deg, #fffdf7, #f8eedb) !important;
    border-color: rgba(7, 59, 112, 0.26) !important;
    box-shadow: 0 10px 35px rgba(7, 24, 61, 0.14), 0 0 18px rgba(47, 111, 255, 0.14);
}

@media (max-width: 768px) {
    .home-page #mission-vision-values .flip-card-3d {
        height: 390px;
    }

    .home-page #accreditations {
        margin: 56px -16px -86px;
        padding: 72px 16px;
    }

    .home-page #accreditations .accreditation-orbit-card {
        min-width: 190px;
        min-height: 160px;
        padding: 22px 18px;
    }

    .home-page #accreditations .accreditation-orbit-wrap {
        width: min(100%, 560px);
        height: 340px;
    }

    .home-page #accreditations .accreditation-info-wrap {
        width: 100%;
    }
}

/* Global navigation-only white corporate bar. */
:root {
    --fixed-nav-offset: 112px;
}

.main-header,
.main-header.scrolled {
    background: #ffffff !important;
    border-color: rgba(0, 120, 255, 0.8) !important;
    box-shadow: 0 0 6px rgba(0, 120, 255, 0.55), 0 0 15px rgba(0, 120, 255, 0.35), 0 0 30px rgba(0, 120, 255, 0.15) !important;
}

.brand-logo,
.main-header.scrolled .brand-logo {
    padding: 2px 5px;
    background: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
}

.brand-logo-img,
.main-header.scrolled .brand-logo-img {
    filter: brightness(0.7) contrast(1.3) saturate(1.2) !important;
}

.main-header .nav-link,
.main-header.scrolled .nav-link {
    position: relative;
    color: #071a41 !important;
}

.main-header .nav-link:hover,
.main-header .nav-link.is-active,
.main-header .nav-link.active,
.main-header.scrolled .nav-link:hover,
.main-header.scrolled .nav-link.is-active,
.main-header.scrolled .nav-link.active {
    color: #073b70 !important;
    background: rgba(7, 59, 112, 0.08) !important;
}

.main-header .btn-pill-white,
.main-header.scrolled .btn-pill-white {
    background: #071a41 !important;
    border-color: #071a41 !important;
    color: #ffffff !important;
    box-shadow: 0 8px 18px rgba(7, 26, 65, 0.2);
}

.main-header .btn-pill-white:hover,
.main-header.scrolled .btn-pill-white:hover {
    background: #073b70 !important;
    border-color: #073b70 !important;
    color: #ffffff !important;
}

.mobile-toggle,
.main-header.scrolled .mobile-toggle {
    color: #071a41 !important;
    background: #ffffff !important;
    border-color: rgba(7, 26, 65, 0.18) !important;
}

.mega-menu-panel {
    background: #ffffff !important;
    border-color: rgba(7, 26, 65, 0.14) !important;
    box-shadow: 0 16px 34px rgba(7, 26, 65, 0.14) !important;
}

.mega-menu-panel,
.mega-menu-panel a,
.mega-menu-panel strong,
.mega-menu-panel span,
.mega-menu-kicker {
    color: #071a41 !important;
}

.mega-menu-panel a:hover {
    color: #073b70 !important;
    background: rgba(7, 59, 112, 0.06);
}

section[id],
.page-hero,
#privacy-content,
#directors-section {
    scroll-margin-top: var(--fixed-nav-offset);
}

@media (max-width: 768px) {
    :root {
        --fixed-nav-offset: 92px;
    }

    .nav-menu.active {
        background: #ffffff !important;
        border-color: rgba(7, 26, 65, 0.14) !important;
        box-shadow: 0 16px 34px rgba(7, 26, 65, 0.14) !important;
    }

    .nav-menu.active .nav-link,
    .nav-menu.active a {
        color: #071a41 !important;
    }
}

/* End navigation styles. */

/* Homepage navigation and section heading alignment. */
.home-page .main-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    max-width: none;
    transform: none;
}

.home-page .main-header.homepage-hero-past {
    opacity: 0 !important;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(-20px) !important;
}

body:not(.home-page) .main-header {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    max-width: none;
    transform: none;
}

body:not(.home-page) .page-hero {
    padding-top: var(--page-header-offset);
}

.home-page section[id] {
    scroll-margin-top: 76px;
}

.home-page .about-chapter-number,
.home-page .about-chapter-heading h2,
.home-page .section-header .foundation-kicker,
.home-page .section-header .section-tag,
.home-page .section-header .section-title,
.home-page .people-heading h2 {
    font-size: clamp(1.35rem, 2.2vw, 1.8rem);
    line-height: 1.2;
    font-weight: 700;
    letter-spacing: 0;
}

.home-page .about-chapter-number {
    font-size: clamp(1.05rem, 1.8vw, 1.45rem);
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: 0.04em;
    text-shadow: none;
}

.home-page .section-number {
    display: inline-block;
    font-size: clamp(1.05rem, 1.8vw, 1.45rem);
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: 0.04em;
}

.home-page .people-heading .section-number {
    line-height: 1.2;
}

.home-page .about-chapter-heading {
    gap: 8px;
    margin-bottom: 48px;
}

.home-page .about-chapter-heading h2,
.home-page .section-header .section-title,
.home-page .people-heading h2 {
    margin-bottom: 8px;
}

.home-page .section-header .section-tag {
    padding: 0;
    border: 0;
    background: transparent;
    border-radius: 0;
    margin-bottom: 8px;
}

.home-page .range-services-section .service-tile,
.home-page .range-services-section .service-tile:nth-child(4n + 1),
.home-page .range-services-section .service-tile:nth-child(4n + 2),
.home-page .range-services-section .service-tile:nth-child(4n + 3),
.home-page .range-services-section .service-tile:nth-child(4n + 4) {
    color: #07183D !important;
    border: 1px solid rgba(47, 111, 255, 0.36) !important;
    box-shadow: 0 10px 30px rgba(7, 24, 61, 0.1), 0 0 14px rgba(47, 111, 255, 0.12) !important;
}

.home-page .range-services-section .service-tile:nth-child(odd) {
    background: #F3E7D3 !important;
}

.home-page .range-services-section .service-tile:nth-child(even) {
    background: #FFFFFF !important;
}

.home-page .range-services-section .service-tile h3,
.home-page .range-services-section .service-tile p,
.home-page .range-services-section .service-tile:nth-child(4n + 1) h3,
.home-page .range-services-section .service-tile:nth-child(4n + 2) h3,
.home-page .range-services-section .service-tile:nth-child(4n + 3) h3,
.home-page .range-services-section .service-tile:nth-child(4n + 4) h3,
.home-page .range-services-section .service-tile:nth-child(4n + 1) p,
.home-page .range-services-section .service-tile:nth-child(4n + 2) p,
.home-page .range-services-section .service-tile:nth-child(4n + 3) p,
.home-page .range-services-section .service-tile:nth-child(4n + 4) p {
    color: #07183D !important;
}

.home-page .range-services-section .service-tile i {
    color: #1748A8 !important;
    background: rgba(47, 111, 255, 0.1) !important;
    border-color: rgba(47, 111, 255, 0.3) !important;
}

.home-page .range-services-section .service-tile:hover {
    border-color: #5C96FF !important;
    box-shadow: 0 16px 35px rgba(7, 24, 61, 0.14), 0 0 22px rgba(47, 111, 255, 0.24) !important;
}

/* Homepage section background rhythm. */
.home-page #staff {
    background: linear-gradient(180deg, #fbf8f2 0%, #f3e7d3 12%, #f3e7d3 88%, #fbf8f2 100%) !important;
    color: #07183D;
}

.home-page #citizen-training {
    background: linear-gradient(180deg, #fbf8f2 0%, #ffffff 12%, #ffffff 88%, #fbf8f2 100%) !important;
    color: #07183D;
}

.home-page #services {
    background: linear-gradient(180deg, #fbf8f2 0%, #f3e7d3 12%, #f3e7d3 88%, #fbf8f2 100%) !important;
    color: #07183D;
}

.home-page #contact {
    background: linear-gradient(180deg, #fbf8f2 0%, #ffffff 12%, #ffffff 88%, #fbf8f2 100%) !important;
    color: #07183D;
}

.home-page #staff h2,
.home-page #staff h3,
.home-page #staff p,
.home-page #citizen-training h2,
.home-page #citizen-training h3,
.home-page #citizen-training p,
.home-page #services .section-title,
.home-page #services .section-subtitle,
.home-page #contact .section-title,
.home-page #contact .section-subtitle {
    color: #07183D !important;
}

.home-page #accreditations {
    background: linear-gradient(180deg, #ffffff 0%, #ffffff 18%, #fbf8f2 48%, #f3e7d3 100%) !important;
}

.home-page #accreditations .accreditations-container {
    gap: 52px;
}

.home-page #accreditations .accreditation-info-wrap {
    position: relative;
    display: block;
    width: min(94%, 980px);
    height: 180px;
    overflow: hidden;
}

.home-page #accreditations .accreditation-info-card {
    position: absolute;
    inset: 0;
    width: 100%;
    min-height: 180px;
    opacity: 0 !important;
    transform: translateX(100%) !important;
    pointer-events: none;
    transition: none !important;
}

.home-page #accreditations .accreditation-info-card.active {
    opacity: 1 !important;
    transform: translateX(0) !important;
    pointer-events: none;
}

.home-page #accreditations .accreditation-info-card.exit {
    opacity: 0 !important;
    transform: translateX(-100%) !important;
}

.home-page #accreditations .accreditation-info-card:hover {
    transform: translateX(0) !important;
}

@media (max-width: 768px) {
    .home-page .main-header {
        top: 0;
        width: 100%;
        border-radius: 8px;
    }

    .home-page section[id] {
        scroll-margin-top: 68px;
    }

    .home-page #accreditations .accreditation-info-wrap,
    .home-page #accreditations .accreditation-info-card {
        height: 220px;
        min-height: 220px;
    }
}

/* Shared interactive navigation refinement. */
.main-header .nav-menu {
    gap: 10px;
}

.main-header .nav-link,
.main-header.scrolled .nav-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 15px;
    color: #071a41 !important;
    font-size: 0.98rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    line-height: 1;
    transition: color 0.25s ease, background-color 0.25s ease, box-shadow 0.25s ease;
}

.main-header .nav-link::after {
    content: '';
    position: absolute;
    right: 15px;
    bottom: 5px;
    left: 15px;
    height: 2px;
    border-radius: 2px;
    background: #2f6fff;
    box-shadow: 0 0 8px rgba(47, 111, 255, 0.6);
    opacity: 0;
    transform: scaleX(0.45);
    transition: opacity 0.25s ease, transform 0.25s ease;
}

.main-header .nav-link:hover,
.main-header .nav-link.is-active,
.main-header .nav-link.active {
    color: #073b70 !important;
    background: rgba(47, 111, 255, 0.08) !important;
    box-shadow: 0 0 14px rgba(47, 111, 255, 0.12);
}

.main-header .nav-link:hover::after,
.main-header .nav-link.is-active::after,
.main-header .nav-link.active::after {
    opacity: 1;
    transform: scaleX(1);
}

.main-header .nav-chevron {
    display: inline-block;
    color: #2f6fff;
    font-size: 0.7rem;
    transition: transform 0.25s ease, color 0.25s ease;
}

.main-header .nav-chevron::before {
    display: inline-block;
    transition: transform 0.25s ease;
}

.main-header .nav-menu-trigger.is-active .nav-chevron,
.main-header .nav-menu-trigger[aria-expanded="true"] .nav-chevron {
    color: #073b70;
    transform: rotate(180deg) !important;
}

.main-header .nav-menu-trigger.is-active .nav-chevron::before,
.main-header .nav-menu-trigger[aria-expanded="true"] .nav-chevron::before {
    transform: rotate(180deg) !important;
}

/* Internal-page polish: CSR, Directors, and Downloads only. */
body:has(.csr-section),
body:has(.directors-grid),
body:has(.downloads-grid) {
    background: linear-gradient(180deg, #ffffff 0%, #f8f5ef 38%, #f3e7d3 100%);
}

body:has(.csr-section) .page-hero,
body:has(.directors-grid) .page-hero,
body:has(.downloads-grid) .page-hero {
    min-height: 300px;
    padding-top: max(var(--page-header-offset), var(--fixed-nav-offset));
    background: radial-gradient(circle at 82% 16%, rgba(243, 231, 211, 0.5), transparent 28%), #ffffff !important;
}

body:has(.csr-section) .page-hero::before,
body:has(.directors-grid) .page-hero::before,
body:has(.downloads-grid) .page-hero::before,
body:has(.csr-section) .page-hero::after,
body:has(.directors-grid) .page-hero::after,
body:has(.downloads-grid) .page-hero::after {
    opacity: 0.22;
}

body:has(.csr-section) .page-hero h1,
body:has(.csr-section) .page-hero p,
body:has(.directors-grid) .page-hero h1,
body:has(.directors-grid) .page-hero p,
body:has(.downloads-grid) .page-hero h1,
body:has(.downloads-grid) .page-hero p {
    color: #07183d !important;
}

/* Contact, footer, and privacy presentation refinements. */
.home-page #contact .contact-info-card {
    background: #F3E7D3 !important;
    border-color: rgba(7, 59, 112, 0.28) !important;
    box-shadow: 0 14px 30px rgba(7, 24, 61, 0.1);
}

.home-page #contact .contact-info-card h3,
.home-page #contact .contact-info-card h5,
.home-page #contact .contact-info-card p,
.home-page #contact .contact-info-card strong {
    color: #07183D !important;
}

.home-page #contact .contact-info-card .c-icon {
    color: #1748A8;
    background: rgba(47, 111, 255, 0.1);
    border: 1px solid rgba(47, 111, 255, 0.24);
}

.home-page #contact .contact-form-wrap .contact-form-card {
    background: #FFFFFF !important;
    border-color: rgba(47, 111, 255, 0.5) !important;
    box-shadow: 0 14px 32px rgba(7, 24, 61, 0.1), 0 0 20px rgba(47, 111, 255, 0.18) !important;
}

.home-page #contact .contact-form-wrap .contact-form-card h3,
.home-page #contact .contact-form-wrap .contact-form-card p,
.home-page #contact .contact-form-wrap .contact-form-card label {
    color: #07183D !important;
}

.home-page #contact .contact-form-wrap .form-input {
    background: #FBF8F2;
    border-color: rgba(7, 59, 112, 0.3);
    color: #07183D;
}

.main-footer {
    background: #071A3D !important;
    color: #FFFFFF !important;
}

.main-footer p,
.main-footer .footer-desc,
.main-footer .footer-bottom,
.main-footer .footer-links a,
.main-footer .footer-bottom-links a,
.main-footer .contact-col p {
    color: #FFFFFF !important;
}

body:has(#privacy-content) {
    background: linear-gradient(180deg, #FFFFFF 0%, #FFFFFF 34%, #FBF8F2 68%, #F3E7D3 100%);
}

body:has(#privacy-content) .page-hero {
    min-height: 300px;
    padding-top: max(var(--page-header-offset), var(--fixed-nav-offset));
    background: linear-gradient(180deg, #FFFFFF 0%, #FBF8F2 68%, #F3E7D3 100%) !important;
}

body:has(#privacy-content) #privacy-content {
    background: linear-gradient(180deg, #FBF8F2 0%, #F3E7D3 100%) !important;
}

body:has(#privacy-content) .page-hero h1,
body:has(#privacy-content) .page-hero p,
body:has(#privacy-content) #privacy-content h2,
body:has(#privacy-content) #privacy-content h4,
body:has(#privacy-content) #privacy-content p {
    color: #07183D !important;
}

/* Final visibility and inner-page hierarchy overrides. */
.home-page #contact .contact-form-wrap .contact-form-card {
    background: #F3E7D3 !important;
    color: #07183D !important;
    border-color: rgba(7, 59, 112, 0.3) !important;
    box-shadow: 0 14px 32px rgba(7, 24, 61, 0.1), 0 0 18px rgba(47, 111, 255, 0.16) !important;
}

.home-page #contact .contact-form-wrap .contact-form-card * {
    color: #07183D;
}

.home-page #contact .contact-form-wrap .contact-form-card .btn,
.home-page #contact .contact-form-wrap .contact-form-card .btn * {
    color: #FFFFFF !important;
}

.home-page .range-services-section .service-tile:hover,
.home-page .range-services-section .service-tile:nth-child(odd):hover,
.home-page .range-services-section .service-tile:nth-child(even):hover {
    transform: none !important;
    filter: none !important;
    box-shadow: 0 10px 30px rgba(7, 24, 61, 0.1), 0 0 14px rgba(47, 111, 255, 0.12) !important;
}

body:has(.directors-grid) .page-hero,
body:has(.csr-section) .page-hero,
body:has(.downloads-grid) .page-hero,
body:has(#privacy-content) .page-hero {
    background: linear-gradient(180deg, #F8EEDB 0%, #F3E7D3 100%) !important;
}

body:has(.directors-grid) .page-hero h1,
body:has(.csr-section) .page-hero h1,
body:has(.downloads-grid) .page-hero h1,
body:has(#privacy-content) .page-hero h1 {
    color: #071A3D !important;
    font-size: clamp(2rem, 4vw, 3.2rem);
    line-height: 1.15;
    font-weight: 700;
}

body:has(.directors-grid) .page-hero p,
body:has(.csr-section) .page-hero p,
body:has(.downloads-grid) .page-hero p,
body:has(#privacy-content) .page-hero p {
    color: #243961 !important;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.6;
    max-width: 680px;
}

/* Final interaction constraints for the requested homepage surfaces. */
.home-page .range-services-section .service-tile:hover,
.home-page .range-services-section .service-tile:nth-child(4n + 1):hover,
.home-page .range-services-section .service-tile:nth-child(4n + 2):hover,
.home-page .range-services-section .service-tile:nth-child(4n + 3):hover,
.home-page .range-services-section .service-tile:nth-child(4n + 4):hover {
    transform: none !important;
    border-color: rgba(47, 111, 255, 0.36) !important;
    box-shadow: 0 10px 30px rgba(7, 24, 61, 0.1), 0 0 14px rgba(47, 111, 255, 0.12) !important;
}

.home-page .range-services-section .service-tile:nth-child(odd):hover {
    background: #F3E7D3 !important;
}

.home-page .range-services-section .service-tile:nth-child(even):hover {
    background: #FFFFFF !important;
}

.home-page #core-values .peer-item {
    transform: translateX(0) !important;
}

.home-page #core-values .peer-item:not(.is-visible) {
    transform: translateX(-40px) !important;
}

.home-page #core-values .peer-item.peer-item.peer-item.is-visible {
    transform: translateX(0) !important;
}

body:has(.csr-section) .csr-section,
body:has(.directors-grid) .white-section-bg,
body:has(.downloads-grid) .white-section-bg {
    background: linear-gradient(180deg, #ffffff 0%, #f8f5ef 42%, #f3e7d3 100%) !important;
}

@media (max-width: 768px) {
    body:has(.csr-section) .page-hero,
    body:has(.directors-grid) .page-hero,
    body:has(.downloads-grid) .page-hero {
        min-height: 270px;
        padding-top: max(92px, var(--page-header-offset));
    }
}

.mega-menu-panel {
    border: 1px solid rgba(47, 111, 255, 0.5) !important;
    box-shadow: 0 18px 38px rgba(7, 26, 65, 0.16), 0 0 20px rgba(47, 111, 255, 0.22) !important;
}

.mega-menu-panel .mega-menu-links a {
    font-size: 0.98rem;
    font-weight: 650;
    letter-spacing: 0.01em;
}

@media (max-width: 768px) {
    .main-header .nav-menu {
        gap: 6px;
    }

    .main-header .nav-link,
    .main-header.scrolled .nav-link {
        width: 100%;
        justify-content: space-between;
        padding: 14px 16px;
        font-size: 1rem;
    }

    .main-header .nav-link::after {
        right: 16px;
        left: 16px;
        bottom: 7px;
    }
}