html {
    font-size: 14px;
}

@media (min-width: 768px) {
    html {
        font-size: 16px;
    }
}

.btn:focus,
.btn:active:focus,
.btn-link.nav-link:focus,
.form-control:focus,
.form-check-input:focus {
    box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
    position: relative;
    min-height: 100%;
}

body {
    margin-bottom: 60px;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    background-color: #020617;
    color: #e5e7eb;
}

/* Layout helpers */
.main-content {
    min-height: calc(100vh - 60px);
}

/* NAVBAR — Dark ATC Theme */
.ass-navbar {
    background: rgba(5, 12, 20, 0.95);
    backdrop-filter: blur(10px);
    border-bottom: 1px solid rgba(148, 163, 184, 0.25);
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
}

    .ass-navbar .navbar-brand {
        color: #e5e7eb !important;
        font-size: 1.1rem;
    }

    .ass-navbar .nav-link {
        color: #cbd5e1 !important;
        transition: color .15s ease, opacity .15s ease;
        opacity: 0.85;
    }

        .ass-navbar .nav-link:hover,
        .ass-navbar .nav-link:focus {
            color: #1BCBF2 !important;
            opacity: 1;
        }

    .ass-navbar .navbar-toggler {
        border-color: rgba(148, 163, 184, 0.35);
    }

    .ass-navbar .navbar-toggler-icon {
        filter: invert(94%);
    }

/* Minimal polygon logo inside nav */
.ass-nav-logo {
    display: inline-block;
    width: 36px; /* Adjust size here */
    height: 36px;
    background-image: url('../assets/ass-logo-glow.png');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    margin-right: 0.5rem;
}

/* HERO — Animated ATC Grid */
.hero-aurora {
    position: relative;
    overflow: hidden;
    background-color: #050c14;
    color: #f9fafb;
}

    .hero-aurora::before {
        content: "";
        position: absolute;
        inset: 0;
        background-image: linear-gradient(to right, rgba(26, 71, 104, 0.6) 1px, transparent 1px), linear-gradient(to bottom, rgba(26, 71, 104, 0.6) 1px, transparent 1px);
        background-size: 64px 64px;
        opacity: 0.5;
        animation: hero-grid-drift 40s linear infinite;
        pointer-events: none;
    }

.hero-aurora-overlay {
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 20% 30%, rgba(27, 203, 242, 0.25), transparent 55%), radial-gradient(circle at 80% 70%, rgba(27, 203, 242, 0.16), transparent 55%), radial-gradient(circle at center, rgba(5, 12, 20, 0.85), transparent 80%);
    mix-blend-mode: screen;
    opacity: 0.9;
    pointer-events: none;
}

/* animated grid motion */
@keyframes hero-grid-drift {
    0% {
        background-position: 0 0, 0 0;
    }

    50% {
        background-position: 32px 32px, -32px -32px;
    }

    100% {
        background-position: 64px 64px, 0 0;
    }
}

/* Hero text */
.hero-kicker {
    text-transform: uppercase;
    letter-spacing: 0.12em;
    font-size: 0.75rem;
    color: rgba(226, 232, 240, 0.8);
}

.hero-subtitle {
    max-width: 40rem;
    color: rgba(226, 232, 240, 0.9);
}

.hero-meta {
    font-size: 0.85rem;
}

/* Hero cards */
.hero-card {
    border-radius: 1rem;
    background: radial-gradient(circle at top, rgba(15, 23, 42, 0.9), rgba(15, 23, 42, 0.98));
    border: 1px solid rgba(148, 163, 184, 0.3);
    padding: 1.5rem;
    backdrop-filter: blur(8px);
}

.hero-card-muted {
    background: rgba(15, 23, 42, 0.85);
    border-style: dashed;
}

.hero-bullet {
    display: inline-block;
    width: 0.75rem;
    color: #38bdf8;
}

/* Sections — dark scheme */
.section-dark,
.section-dark-alt {
    color: #e5e7eb;
}

.section-dark {
    background: radial-gradient(circle at top, #020617 0, #020617 55%, #000000 100%);
}

.section-dark-alt {
    background: radial-gradient(circle at top, #020617 0, #020617 45%, #020617 100%);
}

    .section-dark .text-muted,
    .section-dark-alt .text-muted {
        color: rgba(226, 232, 240, 0.82) !important;
    }

    .section-dark code,
    .section-dark-alt code {
        background: rgba(15, 23, 42, 0.96);
        color: #e5e7eb;
    }

/* Feature cards (light & dark variants) */
.feature-card {
    border-radius: 1rem;
    background: #ffffff;
    border: 1px solid #e5e7eb;
    padding: 1.5rem;
}

.feature-card-dark {
    background: rgba(15, 23, 42, 0.95);
    border-radius: 1rem;
    border: 1px solid rgba(148, 163, 184, 0.4);
    padding: 1.5rem;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.45);
}

    .feature-card-dark h3 {
        color: #e2e8f0;
    }

    .feature-card-dark p {
        color: rgba(226, 232, 240, 0.8);
    }

/* CTA */
.section-cta {
    background: radial-gradient(circle at center, #ffffff 0, #f3f4f6 60%, #e5e7eb 100%);
}

/* COMPAT note box */
.compat-note {
    background: rgba(15, 23, 42, 0.95);
    border-radius: 1rem;
    border: 1px solid rgba(148, 163, 184, 0.6);
    box-shadow: 0 18px 40px rgba(15, 23, 42, 0.75);
}

/* FOOTER — Dark ATC Theme */
.ass-footer {
    background: #020617;
    border-top: 1px solid rgba(148, 163, 184, 0.35);
    color: #e5e7eb;
    font-size: 0.875rem;
}

.ass-footer-legal {
    margin-top: 0.25rem;
    max-width: 720px;
    color: rgba(226, 232, 240, 0.72);
}

.ass-footer-link {
    color: rgba(226, 232, 240, 0.85);
    text-decoration: none;
    font-weight: 500;
    transition: color 0.15s ease, text-decoration-color 0.15s ease;
}

    .ass-footer-link:hover,
    .ass-footer-link:focus {
        color: #1BCBF2;
        text-decoration: underline;
    }

/* Utility */
.text-light-50 {
    color: rgba(248, 250, 252, 0.75) !important;
}

/* Responsive tweaks */
@media (max-width: 767.98px) {
    .ass-footer .text-md-end {
        text-align: left !important;
    }

    .ass-footer-legal {
        margin-top: 0.35rem;
    }
}

/* LICENSE RESULT ANIMATIONS */
.license-result {
    animation-duration: 0.5s;
    animation-timing-function: ease-out;
    animation-fill-mode: both;
}

/* Success: soft fade/slide in + gentle glow */
.license-result-success {
    animation-name: license-result-success-in;
    box-shadow: 0 0 0 rgba(34, 197, 94, 0.0);
}

@keyframes license-result-success-in {
    0% {
        opacity: 0;
        transform: translateY(6px);
        box-shadow: 0 0 0 rgba(34, 197, 94, 0.0);
    }

    60% {
        opacity: 1;
        transform: translateY(0);
        box-shadow: 0 0 24px rgba(34, 197, 94, 0.35);
    }

    100% {
        opacity: 1;
        transform: translateY(0);
        box-shadow: 0 0 0 rgba(34, 197, 94, 0.0);
    }
}

/* Fail: fade/slide in + very gentle shake */
.license-result-fail {
    animation-name: license-result-fail-in;
}

@keyframes license-result-fail-in {
    0% {
        opacity: 0;
        transform: translateY(6px);
    }

    40% {
        opacity: 1;
        transform: translateY(0);
    }

    55% {
        transform: translateX(-3px);
    }

    70% {
        transform: translateX(3px);
    }

    85% {
        transform: translateX(-1.5px);
    }

    100% {
        transform: translateX(0);
    }
}