/* WebGraha — index.html specific styles */

html, body {
    height: 100%;
    overflow: hidden;
    background: radial-gradient(circle at 50% 32%, #1c2c5c 0%, #131f45 38%, #0d1733 70%, #0a1128 100%);
}

.globe-container {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    height: 100vh;
    z-index: 0;
    pointer-events: none;
}

.globe-glow {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 760px;
    height: 760px;
    transform: translate(-50%, -50%);
    background: radial-gradient(circle, rgba(44, 76, 59, 0.20) 0%, rgba(26, 54, 93, 0.14) 40%, transparent 70%);
    filter: blur(10px);
    pointer-events: none;
}

.hero-text-glow {
    text-shadow: 0 4px 24px rgba(0,0,0,0.8);
}

.enquiry-pill:hover { background: rgba(255,255,255,0.06); }

input::placeholder, textarea::placeholder { color: rgba(148,163,184,0.5); }

/* Services carousel (mobile: one card at a time, scroll-snap) */
#services-track {
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
}
#services-track::-webkit-scrollbar { display: none; }
.service-card {
    scroll-snap-align: center;
}
.service-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: rgba(255,255,255,0.25);
    transition: background 0.25s, transform 0.25s;
}
.service-dot.active {
    background: #6ee7b7;
    transform: scale(1.3);
}