/* ============================= */
/* Landing Page Specific Styles */
/* ============================= */

/* Hero grid background */
.bg-grid {
    background-image: linear-gradient(to right, #1F2937 1px, transparent 1px), linear-gradient(to bottom, #1F2937 1px, transparent 1px);
    background-size: 40px 40px;
    mask-image: linear-gradient(to bottom, transparent, black, transparent);
    -webkit-mask-image: linear-gradient(to bottom, transparent 5%, black 40%, black 70%, transparent 95%);
}

/* Hero minimum height */
#hero {
    min-height: 800px;
}

/* Code block background */
.code-preview-landing {
    background: #0F1319;
}

/* Syntax tokens */
.token-keyword {
    color: #C678DD;
}

.token-function {
    color: #61AFEF;
}

.token-string {
    color: #98C379;
}

.token-comment {
    color: #5C6370;
    font-style: italic;
}

.token-operator {
    color: #56B6C2;
}

/* Dashboard mock container */
.dashboard-mock {
    background: #0B0F14;
    border-radius: 16px;
}

/* Timeline dot */
.timeline-dot {
    width: 10px;
    height: 10px;
    border-radius: 9999px;
}

/* AI warning box */
.ai-warning {
    background: #0B0F14;
}

/* Final CTA glow */
.landing-cta-glow {
    position: absolute;
    width: 260px;
    height: 260px;
    background: rgba(59,130,246,0.15);
    filter: blur(100px);
    border-radius: 9999px;
}