footer {
    background: #040608;
    border-top: 1px solid rgba(35, 111, 135, 0.12);
    width: 100%;
}

.footer-inner {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    max-width: 1100px;
    margin: 0 auto;
    padding: 60px 60px 52px;
    gap: 40px;
}

// Left: brand block
.footer-brand {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
}

.footer-logo {
    width: 72px;
    height: 72px;
    opacity: 0.55;
    filter:
        drop-shadow(0 0 12px rgba(35, 111, 135, 0.4))
        brightness(1.1);
    transition: opacity 250ms ease, filter 250ms ease;

    &:hover {
        opacity: 0.9;
        filter:
            drop-shadow(0 0 20px rgba(35, 111, 135, 0.65))
            brightness(1.2);
    }
}

.footer-name {
    font: 700 22px 'Rajdhani', sans-serif;
    color: rgba(255, 255, 255, 0.75);
    letter-spacing: 2px;
    text-transform: uppercase;
    margin-top: 4px;
}

.footer-tagline {
    font: 400 13px 'Rajdhani', sans-serif;
    color: rgba(149, 207, 245, 0.7);
    letter-spacing: 0.5px;
    max-width: 240px;
    line-height: 1.5;
}

// Right: navigation
.footer-nav-label {
    font: 700 11px 'Rajdhani', sans-serif;
    text-transform: uppercase;
    letter-spacing: 4px;
    color: rgba(255, 255, 255, 0.5);
    margin-bottom: 18px;
    text-align: left;
}

.footer-nav ul {
    list-style: none;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
    min-width: 180px;
}

.footer-nav ul li a {
    display: block;
    font: 500 15px 'Rajdhani', sans-serif;
    color: rgba(255, 255, 255, 0.7);
    text-decoration: none;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    white-space: nowrap;
    padding: 6px 0;
    transition: color 180ms ease, letter-spacing 180ms ease;

    &:hover {
        color: #95cff5;
        letter-spacing: 2px;
    }
}

// Bottom copyright bar
.footer-copy {
    border-top: 1px solid rgba(255, 255, 255, 0.05);
    padding: 16px 60px;
    max-width: 1100px;
    margin: 0 auto;

    p {
        font: 400 11px 'Rajdhani', sans-serif;
        color: rgba(255, 255, 255, 0.45);
        letter-spacing: 0.5px;
        text-align: center;
    }

    a {
        color: rgba(149, 207, 245, 0.6);
        text-decoration: none;
        transition: color 180ms;

        &:hover { color: #95cff5; }
    }
}