/*==================
GLAREA — IDE page
===================*/

.hero-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: var(--space-3);
    margin-top: var(--space-5);
}

.section {
    padding-block: var(--space-6);
}

.section-head {
    max-width: var(--measure);
    margin-bottom: var(--space-5);
}

.section-head > p:last-child {
    margin-top: var(--space-2);
    color: var(--text-muted);
}

/* Features */
.feature-grid {
    display: grid;
    gap: var(--space-4);
    grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
}

.feature-index {
    color: var(--accent);
    font-family: var(--font-mono);
    font-size: var(--step--1);
}

.feature-card h3 {
    margin-top: var(--space-2);
}

/* Compiler section */
.compiler-section {
    display: grid;
    gap: var(--space-6);
    grid-template-columns: repeat(auto-fit, minmax(20rem, 1fr));
    align-items: center;
}

.compiler-copy p {
    margin-top: var(--space-2);
    color: var(--text-muted);
}

.check-list {
    margin-top: var(--space-4);
    padding-left: 0;
    list-style: none;
}

.check-list li {
    position: relative;
    padding-left: 1.6rem;
    margin-top: var(--space-2);
    color: var(--text);
}

.check-list li::before {
    content: "→";
    position: absolute;
    left: 0;
    color: var(--accent);
}

.terminal {
    overflow-x: auto;
    margin: 0;
    padding: var(--space-5);
    border-radius: var(--radius);
    background: var(--code-bg);
    color: var(--code-text);
    font-size: var(--step--1);
    line-height: 1.7;
}

.terminal code {
    font-family: var(--font-mono);
}

.terminal-muted { color: var(--code-comment); }
.terminal-ok { color: var(--code-ok); }
.terminal-output { color: var(--code-function); }

/* Install callout */
.install {
    padding: var(--space-6);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    background: var(--surface);
    text-align: center;
}

.install p {
    max-width: var(--measure);
    margin: var(--space-2) auto 0;
    color: var(--text-muted);
}
