/* Site-wide theme - ai-article-site palette & component polish */

/* -- Hero -- */
.hero-factory {
    background:
        radial-gradient(circle at 20% 20%, var(--color-peach) 0%, rgba(255, 243, 236, 0) 55%),
        radial-gradient(circle at 90% 10%, var(--color-mint) 0%, rgba(232, 251, 248, 0) 45%),
        var(--color-page-bg);
}

/* -- Nav -- */
.navbar {
    box-shadow: none;
    background: linear-gradient(
        180deg,
        color-mix(in srgb, var(--color-peach) 12%, var(--color-chrome-surface-top)) 0%,
        var(--color-chrome-surface) 100%
    );
    border-bottom: 1px solid var(--color-ash-hairline);
}

.logo-text.glitch,
.footer-logo-text.glitch {
    color: #111;
}

.nav-link {
    color: var(--color-granite-mute);
}

.nav-link:hover,
.nav-link.active {
    color: var(--color-ink) !important;
}

.btn-factory-filled {
    background: linear-gradient(120deg, var(--color-signal-orange), var(--color-accent-3));
    border-color: transparent;
    color: #ffffff;
}

.btn-factory-filled:hover {
    background: linear-gradient(120deg, #f05f32, #5f4fe8);
    border-color: transparent;
}

.btn-factory-outline {
    background: var(--color-paper-white);
    color: var(--color-ink);
    border-color: var(--color-ink);
}

.btn-factory-outline:hover {
    background: var(--color-surface-warm);
}

.btn-factory-ghost {
    color: var(--color-signal-orange);
}

.btn-factory-ghost:hover {
    color: var(--color-accent-3);
}

/* -- Typography accents -- */
.version-dot::before {
    background: var(--color-signal-orange);
}

.version-dot span {
    color: var(--color-granite-mute);
    letter-spacing: 0.2em;
}

.lead-text {
    color: var(--color-granite-mute);
}

.hero-meta-line {
    color: var(--color-granite-mute);
}

.display-title,
.section-heading,
.section-heading-sm {
    color: var(--color-ink);
}

/* Hero h1 only — gradient accent on "AI" (matches btn/badge theme) */
.hero-factory .display-title .hero-ai-accent {
    display: inline;
    background: linear-gradient(120deg, var(--color-signal-orange), var(--color-accent-3));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}

/* -- Sections -- */
.section-factory {
    background: var(--color-page-bg);
}

.section-factory-frost {
    background: linear-gradient(135deg, #fff4ee 0%, var(--color-lilac) 60%, #eefbf8 100%);
    border-top: 1px solid var(--color-ash-hairline);
    border-bottom: 1px solid var(--color-ash-hairline);
}

.feature-row {
    border-top-color: var(--color-ash-hairline);
}

.ide-frame {
    border: 1px dashed var(--color-ash-hairline);
    background: var(--color-paper-white);
}

.ide-frame-label {
    color: var(--color-granite-mute);
}

/* -- Cards -- */
.highlight-cell,
.news-card,
.facts-panel {
    background: var(--color-paper-white);
    border: 1px solid var(--color-ash-hairline);
}

.highlight-cell:hover,
.news-card:hover {
    border-color: var(--color-pewter-rule);
    background: var(--color-surface-warm);
}

.highlight-cell p,
.news-card p,
.facts-panel li {
    color: var(--color-granite-mute);
}

.category-badge {
    background: linear-gradient(120deg, var(--color-signal-orange), var(--color-accent-3));
    color: #ffffff;
}

.category-badge-outline {
    background: transparent;
    color: var(--color-ink);
    border: 1px solid var(--color-ink);
}

.highlight-cell code,
.feature-row-copy code,
.lead-text code {
    background: var(--color-surface-warm);
    border: 1px solid var(--color-ash-hairline);
    color: var(--color-ink);
}

.facts-panel {
    border-top: 4px solid var(--color-accent-2);
}

.news-card .learn-more {
    color: var(--color-signal-orange);
}

/* -- CLI install -- */
.cli-install-box {
    background: var(--color-paper-white);
    border: 1px solid var(--color-ash-hairline);
}

.cli-tabs {
    border-bottom: 1px solid var(--color-ash-hairline);
    background: var(--color-frost-surface);
}

.cli-tab {
    border-right: 1px solid var(--color-ash-hairline);
    color: var(--color-granite-mute);
}

.cli-tab.active {
    background: var(--color-paper-white);
    color: var(--color-ink);
    box-shadow: inset 0 -2px 0 var(--color-signal-orange);
}

.cli-command-row {
    background: var(--color-paper-white);
}

.cli-prompt {
    color: var(--color-signal-orange);
}

.cli-install-copy {
    color: var(--color-granite-mute);
}

/* -- Terminal -- */
.terminal-window {
    background: var(--color-paper-white);
    border: 1px solid var(--color-ash-hairline);
    border-left: 4px solid var(--color-signal-orange);
}

.terminal-chrome {
    background: var(--color-frost-surface);
    border-bottom: 1px solid var(--color-ash-hairline);
}

.terminal-dot-ash {
    background: var(--color-pewter-rule);
}

.terminal-dot-orange {
    background: var(--color-signal-orange);
}

.terminal-dot-pewter {
    background: var(--color-accent-2);
}

.terminal-caption {
    color: var(--color-granite-mute);
}

.terminal-body {
    background: var(--color-paper-white);
    color: var(--color-graphite-body);
}

.terminal-body .t-prompt {
    color: var(--color-signal-orange);
}

.terminal-body .t-cmd {
    color: var(--color-ink);
}

.terminal-body .t-out {
    color: var(--color-granite-mute);
}

.terminal-body .t-dim {
    color: #7a7a7a;
}

/* -- Trust & footer -- */
.trust-bar {
    border-top: 1px solid var(--color-ash-hairline);
    background: var(--color-frost-surface);
}

.trust-logo {
    color: var(--color-granite-mute);
}

.footer {
    border-top: 1px solid var(--color-ash-hairline);
    background: linear-gradient(
        180deg,
        var(--color-chrome-surface) 0%,
        color-mix(in srgb, var(--color-page-bg) 88%, var(--color-mint) 12%) 100%
    );
}

.footer-factory-tagline,
.footer-factory-copy {
    color: var(--color-granite-mute);
}

.footer-factory-nav a {
    color: var(--color-granite-mute);
}

.footer-factory-nav a:hover {
    color: var(--color-signal-orange);
}

.footer-factory-sep {
    color: var(--color-ash-hairline);
}

.footer-factory-version::before {
    background: var(--color-signal-orange);
}

/* -- Docs -- */
.docs-page .docs-sidebar {
    background: var(--color-frost-surface);
    border-color: var(--color-ash-hairline);
}

.docs-page .docs-sidebar.is-floating {
    border-color: var(--color-ash-hairline);
}

.docs-page .docs-content-wrapper {
    background: transparent;
}

.docs-page .docs-content h1,
.docs-page .docs-content h2,
.docs-page .docs-content h3 {
    color: var(--color-ink);
}

.docs-page .docs-content p,
.docs-page .docs-content li {
    color: var(--color-graphite-body);
}

.docs-page .docs-content a {
    color: var(--color-signal-orange);
}

.docs-page .docs-content a:hover {
    color: var(--color-accent-3);
}

/* -- Download page - arch columns side by side -- */
.download-page .download-arch-columns {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--spacing-24, 24px);
    margin: var(--spacing-32, 32px) 0 var(--spacing-48, 48px);
    align-items: start;
}

.download-page .download-arch-column {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-16, 16px);
    border: 1px solid var(--color-ash-hairline);
    border-top: 4px solid var(--color-signal-orange);
    border-radius: var(--radius-cards, 4px);
    background: var(--color-paper-white);
    padding: var(--spacing-24, 24px);
}

.download-page .download-arch-column-head {
    padding-bottom: var(--spacing-8, 8px);
    border-bottom: 1px solid var(--color-ash-hairline);
}

.download-page .download-arch-column-head .version-dot {
    margin-bottom: var(--spacing-8, 8px);
}

.download-page .download-arch-column-head .section-heading-sm {
    margin-bottom: 0;
}

.download-page .download-arch-stack {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-16, 16px);
}

.download-page .download-arch-stack .highlight-cell {
    margin: 0;
}

.download-page .download-arch-btn {
    margin-top: var(--spacing-12, 12px);
    width: 100%;
    justify-content: center;
}

.download-page .download-arch-btn.is-downloading,
.download-page .hero-download-btn.is-downloading {
    opacity: 0.72;
    cursor: wait;
    pointer-events: none;
}

@media (max-width: 768px) {
    .download-page .download-arch-columns {
        grid-template-columns: 1fr;
    }
}

.download-page .download-block-btn {
    background: linear-gradient(120deg, var(--color-signal-orange), var(--color-accent-3));
    border-color: transparent;
    color: #ffffff;
}

.download-page .download-block-btn:hover {
    background: linear-gradient(120deg, #f05f32, #5f4fe8);
    border-color: transparent;
}