:root {
    --ink: #030712;
    --emerald: #10b981;
    --amber: #d97706;
    --red: #dc2626;
    --gray: #6b7280;
}

body { background: var(--ink); }

/* Grid / blueprint texture */
.grid-bg {
    background-image:
        linear-gradient(rgba(16,185,129,0.05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(16,185,129,0.05) 1px, transparent 1px);
    background-size: 48px 48px;
}

.dot-bg {
    background-image: radial-gradient(rgba(255,255,255,0.06) 1px, transparent 1px);
    background-size: 22px 22px;
}

/* Emerald glow blobs */
.glow {
    position: absolute;
    border-radius: 9999px;
    filter: blur(90px);
    pointer-events: none;
    z-index: 0;
}

/* Hero spotlight following cursor */
.spotlight {
    position: absolute; inset: 0; z-index: 1; pointer-events: none;
    background: radial-gradient(420px circle at var(--mx, 50%) var(--my, 30%), rgba(16,185,129,0.12), transparent 70%);
    transition: background .15s ease-out;
}

/* Pulsing 'available' plots */
@keyframes plotPulse {
    0%, 100% { opacity: .28; }
    50% { opacity: .55; }
}
.plot-available { animation: plotPulse 2.8s ease-in-out infinite; }

/* Survey sweep line on the siteplan */
@keyframes sweep {
    0% { transform: translateX(-110%); }
    100% { transform: translateX(110%); }
}
.sweep {
    position: absolute; top: 0; bottom: 0; width: 40%;
    background: linear-gradient(90deg, transparent, rgba(16,185,129,0.14), transparent);
    animation: sweep 5s linear infinite;
}

/* Scroll reveal */
.reveal {
    opacity: 0;
    transform: translateY(26px);
    transition: opacity .7s cubic-bezier(.16,1,.3,1), transform .7s cubic-bezier(.16,1,.3,1);
}
.reveal.in { opacity: 1; transform: none; }

/* Marquee */
@keyframes marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
.marquee-track { animation: marquee 26s linear infinite; }

/* Gradient text */
.grad-text {
    background: linear-gradient(180deg, #fff 30%, rgba(16,185,129,0.85));
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.card-hover { transition: transform .35s cubic-bezier(.16,1,.3,1), border-color .35s, background .35s; }
.card-hover:hover { transform: translateY(-6px); border-color: rgba(16,185,129,0.4); }

svg .plot { cursor: pointer; transition: opacity .25s, filter .25s; }
svg .plot:hover { opacity: .8 !important; filter: drop-shadow(0 0 8px rgba(16,185,129,0.5)); }

@media (prefers-reduced-motion: reduce) {
    .reveal { opacity: 1; transform: none; transition: none; }
    .plot-available, .sweep, .marquee-track, .spotlight { animation: none; }
}

::selection { background: rgba(16,185,129,0.3); color: #fff; }
html { scrollbar-color: #1f2937 #030712; }
