:root {
    --bg: #0b101a;
    --panel: #151e2c;
    --panel2: #1b283b;
    --line: #28313e;
    --text: #f4f7fb;
    --muted: #aab5c3;
    --blue: #38a9ff;
    --blue2: #79caff;
    --green: #45d483;
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
    margin: 0;
    min-height: 100vh;
    background:
        radial-gradient(circle at 85% 0,
            rgba(46,163,255,.14), transparent 32%),
        var(--bg);
    color: var(--text);
    font: 15px/1.6 "Segoe UI", Arial, sans-serif;
}

a { color: inherit; text-decoration: none; }
a:hover { color: var(--blue2); }

.wrap {
    width: min(1180px, calc(100% - 36px));
    margin: auto;
}

.site-header {
    position: sticky;
    top: 0;
    z-index: 10;
    background: rgba(8,11,16,.9);
    backdrop-filter: blur(12px);
    border-bottom: 1px solid #222b36;
}

.site-nav {
    min-height: 82px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}

.brand img {
    display: block;
    width: 275px;
    max-width: 44vw;
    height: auto;
}

.nav-links {
    display: flex;
    align-items: center;
    gap: 18px;
    font-size: 13px;
    color: #dae2ec;
}

.status {
    border: 1px solid #31536d;
    border-radius: 10px;
    padding: 8px 12px;
    font-size: 12px;
    color: var(--blue2);
}

main { min-height: calc(100vh - 160px); }

.site-footer {
    padding: 26px 0;
    border-top: 1px solid var(--line);
    color: var(--muted);
    font-size: 13px;
}

.site-footer .wrap {
    display: flex;
    justify-content: space-between;
    gap: 20px;
}

@media (max-width: 700px) {
    .site-nav { flex-wrap: wrap; padding: 14px 0; }
    .brand img { max-width: 220px; }
    .nav-links { flex-wrap: wrap; gap: 12px; }
    .site-footer .wrap { flex-direction: column; }
}


/* Original ASD Networks Server-Symbol */
.support-hero .hero-art {
    position: absolute;
    right: -3%;
    top: 40px;
    width: min(40vw, 570px);
    color: #1d5aab;
    opacity: .43;
    filter: drop-shadow(0 0 45px #006dff1c);
    pointer-events: none;
}

.support-hero .hero-art svg {
    display: block;
    width: 100%;
    height: auto;
}

@media (max-width: 950px) {
    .support-hero .hero-art {
        right: -18%;
        width: 65vw;
        opacity: .17;
    }
}

@media (max-width: 600px) {
    .support-hero .hero-art {
        right: -45%;
        top: 170px;
        width: 100vw;
        opacity: .13;
    }
}

/* ASD Support Portal – Header */
.site-header .site-nav {
    width: min(1180px, calc(100% - 36px));
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}

.site-header .brand {
    display: flex;
    align-items: center;
    flex-shrink: 0;
}

.site-header .brand img {
    display: block;
    width: 275px;
    max-width: 100%;
    height: auto;
}

.site-header .nav-links {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 22px;
    margin-left: auto;
}

@media (max-width: 700px) {
    .site-header .site-nav {
        flex-wrap: wrap;
        padding: 14px 0;
    }

    .site-header .brand img {
        width: 190px;
    }

    .site-header .nav-links {
        flex-wrap: wrap;
        gap: 12px;
    }
}