/**
 * FIKOM Research Hub - Swiss Modernist Academic Editorial Stylesheet
 * Strict implementation of docs/FIKOM_Homepage_UIUX_Redesign.md
 */

:root {
    --bg-main: #080808;
    --surface: #101010;
    --surface-hover: #151515;
    --text-primary: #F5F5F5;
    --text-secondary: #A3A3A3;
    --text-muted: #707070;
    --border-main: #282828;
    --border-subtle: #232323;
    --accent: #D7A300;
    --accent-hover: #E5B21A;
    --status-success: #20B486;
    --radius-sm: 4px;
}

body.cyber-home {
    background-color: var(--bg-main) !important;
    color: var(--text-primary);
    font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;
}

/* Sharp Editorial Navigation */
#main-nav {
    background-color: var(--bg-main) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    border-bottom: 1px solid var(--border-subtle) !important;
}

.nav-link-editorial {
    position: relative;
    color: var(--text-secondary);
    transition: color 160ms ease-out;
}

.nav-link-editorial:hover {
    color: var(--accent);
}

.nav-link-editorial.is-active {
    color: var(--accent);
}

.nav-link-editorial.is-active::after {
    content: '';
    position: absolute;
    bottom: -4px;
    left: 0;
    width: 100%;
    height: 2px;
    background-color: var(--accent);
}

/* Hero Section */
.hero-editorial-section {
    background-color: var(--bg-main);
    color: var(--text-primary);
}

/* Department Data Row Hover Effect */
.dept-data-row {
    transition: background-color 180ms ease-out;
    position: relative;
}

.dept-data-row:hover {
    background-color: var(--surface-hover);
}

.dept-data-row::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 2px;
    background-color: transparent;
    transition: background-color 180ms ease-out;
}

.dept-data-row:hover::before {
    background-color: var(--accent);
}

/* Buttons */
.btn-editorial-primary {
    background-color: var(--accent);
    color: var(--bg-main);
    font-weight: 700;
    font-size: 0.875rem;
    padding: 0.875rem 1.5rem;
    border-radius: 4px;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    transition: background-color 160ms ease-out, transform 160ms ease-out;
}

.btn-editorial-primary:hover {
    background-color: var(--accent-hover);
}

.btn-editorial-primary .btn-arrow {
    transition: transform 160ms ease-out;
}

.btn-editorial-primary:hover .btn-arrow {
    transform: translate(2px, -2px);
}

.btn-editorial-secondary {
    background-color: transparent;
    border: 1px solid var(--border-main);
    color: var(--text-primary);
    font-weight: 600;
    font-size: 0.875rem;
    padding: 0.875rem 1.5rem;
    border-radius: 4px;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    transition: border-color 160ms ease-out, color 160ms ease-out;
}

.btn-editorial-secondary:hover {
    border-color: var(--accent);
    color: var(--accent);
}

.btn-editorial-secondary .btn-arrow {
    transition: transform 160ms ease-out;
}

.btn-editorial-secondary:hover .btn-arrow {
    transform: translateX(3px);
}

/* Motion Preferences */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation: none !important;
        transition: none !important;
    }
}
