:root {
    --moterm-ink: #111318;
    --moterm-muted: #68707d;
    --moterm-accent: #5b5ce2;
    --moterm-accent-2: #15a37d;
    --moterm-terminal: #0d1117;
}

html {
    scroll-behavior: smooth;
}

body {
    color: var(--moterm-ink);
    background: #fff;
}

a {
    text-underline-offset: .18em;
}

.navbar-brand {
    letter-spacing: -.04em;
}

.brand-dot, .feature-kicker, .eyebrow {
    color: var(--moterm-accent);
}

.eyebrow {
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .12em;
    font-size: .78rem;
}

.py-lg-7 {
    padding-top: 6rem !important;
    padding-bottom: 6rem !important;
}

.hero-section {
    background: radial-gradient(circle at 80% 10%, rgba(91,92,226,.11), transparent 34%), linear-gradient(#fff, #fbfbfe);
}

.terminal-card {
    background: var(--moterm-terminal);
    color: #e6edf3;
    border-radius: 1rem;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.08);
}

.terminal-bar {
    min-height: 48px;
    display: flex;
    align-items: center;
    gap: .45rem;
    padding: 0 1rem;
    background: #161b22;
    border-bottom: 1px solid #30363d;
    color: #9da7b3;
}

    .terminal-bar span {
        width: 10px;
        height: 10px;
        border-radius: 50%;
        background: #39414c;
        display: inline-block;
    }

    .terminal-bar strong {
        margin-left: .35rem;
        font-size: .86rem;
    }

.terminal-card pre {
    margin: 0;
    padding: 1.35rem;
    color: inherit;
    white-space: pre-wrap;
    font-size: .92rem;
    line-height: 1.65;
}

.terminal-card code {
    color: inherit;
}

.ok {
    color: #56d364;
}

.bad {
    color: #ff7b72;
}

.muted {
    color: #8b949e;
}

.feature-card {
    border: 1px solid #e5e7eb;
    border-radius: 1rem;
    padding: 1.5rem;
    background: #fff;
    box-shadow: 0 .4rem 1.4rem rgba(17,19,24,.035);
}

    .feature-card p {
        color: var(--moterm-muted);
    }

.feature-kicker {
    font-size: .78rem;
    text-transform: uppercase;
    letter-spacing: .1em;
    font-weight: 700;
    margin-bottom: .7rem;
}

.problem-list article {
    padding: 2rem 0;
    border-top: 1px solid #e5e7eb;
}

    .problem-list article:last-child {
        border-bottom: 1px solid #e5e7eb;
    }

.problem-list h2 {
    font-size: 1.55rem;
    font-weight: 700;
}

.problem-list p {
    color: var(--moterm-muted);
    font-size: 1.08rem;
    margin-bottom: 0;
}

.callout {
    border-left: 4px solid var(--moterm-accent);
    background: #f6f6ff;
    padding: 1.25rem 1.5rem;
    border-radius: .25rem .75rem .75rem .25rem;
}

.journal-demo {
    top: 7rem;
}

@media (max-width: 991.98px) {
    .py-lg-7 {
        padding-top: 3rem !important;
        padding-bottom: 3rem !important;
    }
}