body, html {
    font-family: "Inter", sans-serif;
}

.blog-content > * {
    margin-bottom: 1.5rem;
}

.blog-content p {
    margin-bottom: 1.5rem;
}


.blog-content h2 {
    font-size: 1.475rem;
    font-weight: 700;
    margin-bottom: 1.35rem;
}

.blog-content h3 {
    font-size: 1.2rem;
    font-weight: 700;
    margin-bottom: 1.1rem;
}

.blog-content a {
    color: #3b82f6;
    text-decoration: none;
    transition: color 0.2s ease-in-out;
}

.blog-content a:hover {
    color: #2563eb;
}

.terminal-container {
    background-color: rgb(12, 12, 12);
    color: #d4d4d4;
    border-radius: 0.5rem;
    font-family: "Courier New", Courier, monospace;
    overflow-x: auto;

    .panel-bar {
        background-color: #141414;
        padding: 0.5rem 1rem;
        border-bottom: 1px solid #333;
        display: flex;
        font-size: 12px;
    }

    .terminal-host {
        padding: 1rem;
    }

    .terminal-hint {
        background-color: #000;
        color: #d4d4d4;
        padding: 0.5rem 1rem;
        font-size: 0.875rem;
    }
}