﻿/* home.css */

/* If Exo 2 is loaded in _Layout already, keep this. Otherwise it just sets the font-family. */
.exo-2-font {
    font-family: 'Exo 2', sans-serif;
}

.service-hero {
    background: radial-gradient(1200px 600px at 15% 10%, rgba(13,110,253,.12), transparent), radial-gradient(900px 500px at 80% 30%, rgba(25,135,84,.10), transparent);
}

/* ✅ UPDATED: include .faq-card so it matches other cards */
.hero-card, .service-card, .step-card, .contact-card, .stat-card, .faq-card {
    background: #fff;
    border: 1px solid rgba(0,0,0,.06);
    border-radius: 18px;
}

.process-band {
    background: rgba(0,0,0,.02);
}

.contact-band {
    background: rgba(13,110,253,.04);
}

.dot {
    width: 10px;
    height: 10px;
    border-radius: 999px;
    background: rgba(13,110,253,.7);
    display: inline-block;
}

.check {
    width: 22px;
    height: 22px;
    border-radius: 999px;
    background: rgba(25,135,84,.12);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #198754;
    font-weight: 700;
    flex: 0 0 22px;
    margin-top: 1px;
}

.step-num {
    width: 34px;
    height: 34px;
    border-radius: 12px;
    background: rgba(13,110,253,.10);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    color: #0d6efd;
}

/* Reddit */
.reddit-snippet,
.reddit-preview {
    overflow-wrap: anywhere;
}

    .reddit-preview img {
        max-width: 100%;
        height: auto;
    }

    .reddit-preview a {
        word-break: break-word;
    }

    /* Quote styling */
    .reddit-preview blockquote {
        margin: .5rem 0;
        padding: .5rem .75rem;
        border-left: 4px solid rgba(0,0,0,.18);
        background: rgba(0,0,0,.04);
        border-radius: 10px;
    }

/* ✅ CLEANED: merged html blocks */
html {
    font-size: 14px;
    position: relative;
    /* min-height: 100%; */ /* keep commented if you want it off */
}

@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;
}

/* ✅ NEW: remove hamburger menu on mobile and keep nav visible */
@media (max-width: 991.98px) {
    .navbar .navbar-toggler {
        display: none !important; /* hide sandwich */
    }

    .navbar .navbar-collapse {
        display: flex !important; /* keep menu visible */
        flex-basis: auto !important;
    }

    .navbar .navbar-nav {
        flex-direction: row !important; /* keep horizontal */
        flex-wrap: wrap; /* wrap instead of collapsing */
        gap: .5rem;
    }

    .navbar .nav-link {
        padding: .25rem .5rem;
    }
}
