:root {
    --rr-bg: #0a0d12;
    --rr-surface: #0f141d;
    --rr-surface-2: #141b27;
    --rr-border: rgba(255, 255, 255, .085);
    --rr-text: #f5f7fb;
    --rr-muted: #8d98aa;
    --rr-blue: #2f7dff;
    --rr-blue-hover: #1e6ff0;
}

html {
    scroll-behavior: smooth;
}

body {
    min-height: 100vh;
    background:
        radial-gradient(circle at 80% 7%, rgba(47, 125, 255, .10), transparent 27rem),
        var(--rr-bg);
    color: var(--rr-text);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

a {
    text-decoration: none;
}

.site-header {
    background: rgba(10, 13, 18, .92);
    backdrop-filter: blur(14px);
}

.navbar-brand {
    color: #fff;
}

.navbar-brand:hover {
    color: #fff;
}

.brand-mark {
    width: 32px;
    height: 32px;
    display: inline-grid;
    place-items: center;
    border-radius: 9px;
    background: linear-gradient(145deg, #3387ff, #1762dc);
    color: #fff;
    box-shadow: 0 8px 22px rgba(47, 125, 255, .24);
}

.nav-link {
    color: #aeb8c7;
    font-size: .93rem;
}

.nav-link:hover {
    color: #fff;
}

.btn-primary {
    --bs-btn-bg: var(--rr-blue);
    --bs-btn-border-color: var(--rr-blue);
    --bs-btn-hover-bg: var(--rr-blue-hover);
    --bs-btn-hover-border-color: var(--rr-blue-hover);
}

.hero-section {
    background: linear-gradient(180deg, rgba(15, 20, 29, .55), rgba(10, 13, 18, 0));
}

.hero-copy {
    max-width: 720px;
    color: var(--rr-muted);
    font-size: 1.05rem;
}

.eyebrow {
    color: #5d9aff;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .11em;
}

.search-panel,
.reality-card,
.info-card {
    background: rgba(15, 20, 29, .94);
    border: 1px solid var(--rr-border);
    border-radius: 16px;
}

.search-panel {
    max-width: 760px;
    box-shadow: 0 18px 50px rgba(0, 0, 0, .18);
}

.search-panel .form-control::placeholder {
    color: #687386;
}

.search-panel .input-group-text,
.search-panel .form-control {
    min-height: 46px;
}

.reality-card {
    box-shadow: 0 22px 60px rgba(0, 0, 0, .28);
}

.metric-card {
    padding: 14px;
    border-radius: 12px;
    background: var(--rr-surface-2);
    border: 1px solid rgba(255, 255, 255, .045);
}

.metric-label {
    color: var(--rr-muted);
    font-size: .75rem;
    margin-bottom: 2px;
}

.metric-value {
    font-size: 1.35rem;
    font-weight: 750;
}

.metric-value small {
    color: var(--rr-muted);
    font-size: .72rem;
    font-weight: 500;
}

.compact-row {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    padding: .55rem 0;
    border-bottom: 1px solid var(--rr-border);
    font-size: .9rem;
}

.compact-row span {
    color: var(--rr-muted);
}

.section-compact {
    background: rgba(10, 13, 18, .38);
}

.info-card {
    padding: 1.1rem;
}

.info-card p {
    color: var(--rr-muted);
    font-size: .9rem;
}

.step-number {
    display: inline-grid;
    place-items: center;
    min-width: 34px;
    height: 28px;
    padding: 0 8px;
    margin-bottom: .8rem;
    color: #78a9ff;
    background: rgba(47, 125, 255, .12);
    border: 1px solid rgba(47, 125, 255, .16);
    border-radius: 8px;
    font-size: .72rem;
    font-weight: 800;
}

.tech-badge,
.data-chip {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: .28rem .62rem;
    border: 1px solid var(--rr-border);
    border-radius: 999px;
    background: rgba(255, 255, 255, .035);
    color: #c2cad6;
    font-size: .76rem;
    font-weight: 650;
}

.site-footer {
    background: #080b10;
}

.text-secondary {
    color: var(--rr-muted) !important;
}

.border-secondary-subtle {
    border-color: var(--rr-border) !important;
}

@media (max-width: 991.98px) {
    .navbar-collapse {
        padding-top: .75rem;
    }

    .navbar-nav {
        align-items: stretch !important;
    }

    .navbar-nav .btn {
        margin-top: .35rem;
    }

    .hero-section .container {
        padding-top: 2rem !important;
        padding-bottom: 2rem !important;
    }
}

@media (max-width: 575.98px) {
    .display-5 {
        font-size: clamp(2rem, 10vw, 2.7rem);
    }

    .search-panel .input-group {
        flex-wrap: nowrap;
    }

    .search-panel .input-group-text {
        display: none;
    }

    .search-panel .btn {
        padding-inline: 1rem !important;
    }

    .metric-card {
        padding: 12px;
    }
}


/* v0.3 — Hero alignment + navbar refresh */
.site-header {
    background: rgba(8, 11, 16, .94);
    border-bottom: 1px solid var(--rr-border);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
}

.site-header .navbar {
    min-height: 62px;
    padding: .55rem 0;
}

.brand-word {
    letter-spacing: -.02em;
}

.nav-shell {
    min-height: 42px;
}

.site-header .navbar-nav {
    gap: .15rem;
    padding: .2rem;
    border: 1px solid rgba(255, 255, 255, .055);
    border-radius: 12px;
    background: rgba(255, 255, 255, .025);
}

.site-header .nav-link {
    padding: .5rem .75rem !important;
    border-radius: 8px;
    color: #9ba7b8;
    font-size: .88rem;
    font-weight: 600;
    transition: color .16s ease, background-color .16s ease;
}

.site-header .nav-link:hover,
.site-header .nav-link:focus {
    color: #fff;
    background: rgba(255, 255, 255, .055);
}

.nav-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .45rem;
    min-height: 38px;
    padding-inline: .95rem;
    border-radius: 10px;
    font-weight: 700;
}

.hero-row {
    position: relative;
}

.hero-copy-col {
    padding-top: .1rem;
}

.hero-title {
    max-width: 760px;
    margin-top: 0;
}

.reality-card {
    margin-top: 0;
}

@media (min-width: 992px) {
    .hero-section .container {
        padding-top: 2.4rem !important;
        padding-bottom: 2.5rem !important;
    }

    .hero-copy-col {
        padding-top: 0;
    }

    .hero-row > [class*="col-"] {
        align-self: flex-start;
    }

    .reality-card {
        position: relative;
        top: 0;
    }
}

@media (max-width: 991.98px) {
    .site-header .navbar-nav {
        margin-top: .75rem;
        padding: .4rem;
    }

    .site-header .nav-link {
        padding: .65rem .75rem !important;
    }

    .nav-cta {
        width: 100%;
    }
}
