/* Shared SKKU identity for the primary schoung.com pages. */
:root {
    --skku-blue: #072b61;
    --skku-lime: #8dc63f;
    --skku-orange: #ff6c0f;
    --skku-green: #124633;

    --text: #14243d;
    --bg: #fdfefb;
    --brand: var(--skku-blue);
    --accent: var(--skku-orange);
    --primary-color: var(--skku-blue);
    --accent-color: var(--skku-orange);
    --secondary-color: var(--skku-green);
    --growth-color: var(--skku-lime);
    --on-primary: #f8faf5;
    --active-nav-bg: var(--skku-lime);
    --active-nav-text: var(--skku-blue);
    --brand-gradient: linear-gradient(135deg, var(--skku-blue) 0%, var(--skku-green) 100%);
    --brand-gradient-wide: linear-gradient(90deg, var(--skku-blue) 0%, var(--skku-green) 100%);

    --text-primary: #14243d;
    --text-secondary: #314b48;
    --text-muted: #63756f;
    --bg-primary: #fdfefb;
    --bg-secondary: #f1f5ef;
    --bg-card: #f7faf5;
    --border-light: #d6dfd4;
    --border-lighter: #a8bba6;
    --navbar-bg: rgba(253, 254, 251, 0.95);
    --footer-bg: #f1f5ef;

    --hero-text: #14243d;
    --hero-sub: rgba(20, 36, 61, 0.76);
    --hero-icon: rgba(20, 36, 61, 0.62);
    --catalyst-color: #e85d00;
    --catalyst-glow: rgba(255, 108, 15, 0.35);
    --section-bg: rgba(253, 254, 251, 0.95);
    --land-fill: #dce8d7;
    --land-stroke: #a8bba6;
}

[data-theme="dark"] {
    --text: #edf3e8;
    --bg: #07120f;
    --brand: var(--skku-lime);
    --accent: var(--skku-orange);
    --primary-color: var(--skku-lime);
    --accent-color: var(--skku-orange);
    --secondary-color: var(--skku-green);
    --growth-color: var(--skku-lime);
    --on-primary: var(--skku-blue);
    --active-nav-bg: var(--skku-lime);
    --active-nav-text: var(--skku-blue);
    --brand-gradient: linear-gradient(135deg, var(--skku-blue) 0%, var(--skku-green) 100%);
    --brand-gradient-wide: linear-gradient(90deg, var(--skku-blue) 0%, var(--skku-green) 100%);

    --text-primary: #edf3e8;
    --text-secondary: #bdcdbd;
    --text-muted: #899d8d;
    --bg-primary: #07120f;
    --bg-secondary: #0d211a;
    --bg-card: #10271f;
    --border-light: #244638;
    --border-lighter: #3c6751;
    --navbar-bg: rgba(7, 18, 15, 0.95);
    --footer-bg: #0d211a;

    --hero-text: #edf3e8;
    --hero-sub: rgba(237, 243, 232, 0.84);
    --hero-icon: rgba(237, 243, 232, 0.68);
    --catalyst-color: #ff8a3d;
    --catalyst-glow: rgba(255, 108, 15, 0.48);
    --section-bg: rgba(13, 33, 26, 0.95);
    --land-fill: #173729;
    --land-stroke: #3c6751;
}

/* One navigation language across all primary pages and both themes. */
.custom-navbar .navbar-nav .nav-link.active {
    background: var(--active-nav-bg) !important;
    color: var(--active-nav-text) !important;
    border-radius: 5px;
    padding-inline: 1rem;
}

.custom-navbar .navbar-nav .nav-link.active:hover {
    background: var(--active-nav-bg) !important;
    color: var(--active-nav-text) !important;
}

/* Shared navigation interaction for Home and all inner pages. */
.custom-navbar .navbar-nav .nav-link,
.glass-navbar .navbar-nav .nav-link {
    border-radius: 5px;
    transition: color 0.2s ease, background-color 0.2s ease;
}

.custom-navbar .navbar-nav .nav-link:not(.active):hover,
.glass-navbar .navbar-nav .nav-link:hover {
    color: var(--skku-orange) !important;
    background: rgba(255, 108, 15, 0.09);
}

/* One banner component for Research, Resources, and Lab. */
.site-banner {
    width: calc(100% - 4rem);
    max-width: 1136px;
    min-height: 312px;
    margin: 2rem auto;
    padding: 3rem;
    border: 0;
    border-radius: 20px;
    background: var(--brand-gradient) !important;
    color: #f8faf5;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    position: relative;
}

.site-banner--compact {
    min-height: 230px;
}

.site-banner-network {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    opacity: 0.62;
}

.custom-container > .site-banner {
    width: 100%;
    margin-top: 0;
}

.site-banner > .container,
.site-banner > .hero-content,
.site-banner > .site-banner-content {
    width: 100%;
    max-width: 900px;
    margin: 0 auto;
    padding: 0;
    align-self: stretch;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    position: relative;
    z-index: 1;
}

.site-banner h1,
.site-banner .page-title {
    margin: 0 0 1rem;
    color: #f8faf5;
    font-size: clamp(2.35rem, 4vw, 3rem);
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: -0.025em;
}

.site-banner h1 strong {
    color: inherit;
    font-weight: inherit;
}

.site-banner .gradient-text {
    color: inherit;
    background: none !important;
    -webkit-text-fill-color: currentColor;
    animation: none;
}

.site-banner .site-banner-subtitle,
.site-banner .page-subtitle,
.site-banner .tagline {
    max-width: 800px;
    margin: 0 auto;
    color: rgba(248, 250, 245, 0.9);
    font-size: 1.15rem;
    font-weight: 400;
    font-style: normal;
    line-height: 1.6;
}

.site-banner .lab-fullname {
    margin: -0.25rem auto 0.75rem;
    color: var(--skku-lime);
    font-size: 0.9rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.site-banner .section-nav {
    margin-top: 1.5rem;
}

@media (max-width: 768px) {
    .site-banner {
        width: calc(100% - 2rem);
        min-height: 260px;
        margin: 1rem auto 2rem;
        padding: 2.25rem 1.25rem;
        border-radius: 16px;
    }

    .site-banner--compact {
        min-height: 210px;
    }

    .custom-container > .site-banner {
        width: calc(100vw - 2rem);
        margin-top: -1rem;
        margin-left: calc((100% - (100vw - 2rem)) / 2);
    }
}

body:not(.home-page) .profile-badge,
body:not(.home-page) .resource-icon {
    background: var(--brand-gradient) !important;
}

body:not(.home-page) .section-nav-btn:hover,
body:not(.home-page) .btn-resource:hover,
body:not(.home-page) .back-to-top {
    background: var(--skku-green) !important;
    color: #f8faf5 !important;
}

/* Preserve the original Home art direction independently of inner pages. */
.home-page {
    --primary-color: #072b61;
    --accent-color: #ff6c0f;
    --text-primary: #14243d;
    --text-secondary: #2c3e57;
    --text-muted: #5b6b82;
    --bg-primary: #ffffff;
    --bg-secondary: #f2f5f9;
    --bg-card: #f7f9fc;
    --border-light: #d8dfe9;
    --border-lighter: #b4c0d2;
    --hero-text: #14243d;
    --hero-sub: rgba(20, 36, 61, 0.75);
    --hero-icon: rgba(20, 36, 61, 0.6);
    --catalyst-color: #e85d00;
    --catalyst-glow: rgba(255, 108, 15, 0.35);
    --section-bg: rgba(255, 255, 255, 0.95);
    --navbar-bg: rgba(255, 255, 255, 0.95);
    --footer-bg: #f2f5f9;
}

[data-theme="dark"] .home-page {
    --primary-color: #8fb3e3;
    --accent-color: #ff8a3d;
    --text-primary: #e9eef6;
    --text-secondary: #b3c2d6;
    --text-muted: #7488a1;
    --bg-primary: #060f1e;
    --bg-secondary: #0d1a2f;
    --bg-card: #0a1526;
    --border-light: #1c2f4a;
    --border-lighter: #2b4266;
    --hero-text: #e9eef6;
    --hero-sub: rgba(233, 238, 246, 0.85);
    --hero-icon: rgba(233, 238, 246, 0.7);
    --catalyst-color: #ff8a3d;
    --catalyst-glow: rgba(255, 138, 61, 0.5);
    --section-bg: rgba(10, 21, 38, 0.95);
    --navbar-bg: rgba(6, 15, 30, 0.95);
    --footer-bg: #0d1a2f;
}

/* Replaces legacy sky-blue progress and research accents. */
.scroll-progress {
    background: linear-gradient(
        90deg,
        var(--skku-blue),
        var(--skku-lime),
        var(--skku-orange)
    ) !important;
}

.gradient-text {
    background-image: linear-gradient(
        90deg,
        var(--skku-lime),
        #f8faf5,
        var(--skku-orange)
    ) !important;
}

@media (prefers-contrast: more) {
    :root {
        --text-muted: #45594f;
        --border-light: #8fa18c;
    }

    [data-theme="dark"] {
        --text-muted: #afc2b0;
        --border-light: #5d806c;
    }
}