/* ===== Responsive Styles for Terminal & Tech Elements ===== */

@media (max-width: 900px) {
    .hero-container.split-layout {
        flex-direction: column;
        gap: 40px;
    }

    .terminal-container {
        width: 100%;
        max-width: 500px;
    }

    .hero-visual {
        height: auto;
        padding: 20px 0;
    }

    .stats-bar {
        gap: 40px;
    }
}

@media (max-width: 600px) {
    .terminal-container {
        width: 100%;
        min-height: 300px;
    }

    .terminal-body {
        font-size: 0.85rem;
        padding: 15px;
    }

    .tech-item {
        padding: 8px 20px;
        font-size: 0.8rem;
    }

    .stat-value {
        font-size: 1.5rem;
    }

    .stat-label {
        font-size: 0.75rem;
    }

    .stats-bar {
        gap: 30px;
        padding: 30px 20px;
    }

    .hero-identity {
        font-size: 2.5rem;
    }

    .hero-desc {
        font-size: 1rem;
    }
}