/* ============================================
   ROBETIX — Premium CSS
   ============================================ */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&family=Plus+Jakarta+Sans:wght@400;500;600;700&display=swap');

body {
    font-family: 'Plus Jakarta Sans', sans-serif;
    background-color: #f8fafc;
    color: #0f172a;
    overflow-x: hidden;
}

/* Headings Font - Clean, Professional Silicon Valley look */
h1, h2, h3, h4, h5, h6, .font-heading {
    font-family: 'Inter', sans-serif;
}

/* Modern Silicon Valley Background */
.sv-bg {
    position: fixed; inset: 0; z-index: -1; pointer-events: none;
    background-image: 
        radial-gradient(at 0% 0%, hsla(217,100%,92%,0.6) 0px, transparent 50%),
        radial-gradient(at 100% 0%, hsla(210,100%,95%,0.6) 0px, transparent 50%),
        linear-gradient(to right, #f1f5f9 1px, transparent 1px),
        linear-gradient(to bottom, #f1f5f9 1px, transparent 1px);
    background-size: 100% 100%, 100% 100%, 40px 40px, 40px 40px;
}

/* Remove Grid on Mobile (Keep Solid Clean Color) */
@media (max-width: 768px) {
    .sv-bg { background-image: none !important; }
}

/* Consistent Dark Glassmorphism Nav */
.glass-nav-dark {
    background: rgba(15, 23, 42, 0.9);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 255, 255, 0.1);
    box-shadow: 0 4px 20px rgba(0,0,0,0.15);
}

.logo-text { font-family: 'Inter', sans-serif; font-weight: 700; letter-spacing: 0.5px; font-size: 1.125rem; }

/* Submenu Hover Bridge Fix */
.nav-group { position: relative; }
.nav-submenu {
    visibility: hidden; opacity: 0; transform: translateY(10px); transition: all 0.2s ease;
    position: absolute; top: 100%; left: 50%; transform: translateX(-50%) translateY(10px);
    padding-top: 1rem; z-index: 50;
}
.nav-group:hover .nav-submenu {
    visibility: visible; opacity: 1; transform: translateX(-50%) translateY(0);
}

.hide-scrollbar::-webkit-scrollbar { display: none; }
.hide-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

/* Blur-to-Clear Text Animation */
@keyframes blur-in {
    0% { filter: blur(20px); opacity: 0; transform: scale(0.95); }
    100% { filter: blur(0px); opacity: 1; transform: scale(1); }
}
.text-blur-in { animation: blur-in 1.2s cubic-bezier(0.25, 1, 0.5, 1) forwards; }

/* Scroll Animations */
.fade-up { opacity: 0; transform: translateY(30px); transition: all 0.8s cubic-bezier(0.16, 1, 0.3, 1); }
.fade-up.visible { opacity: 1; transform: translateY(0); }
.delay-100 { transition-delay: 100ms; }
.delay-200 { transition-delay: 200ms; }

/* Flat Minimalist Button */
.btn-modern { transition: background-color 0.2s ease, opacity 0.2s ease, transform 0.1s ease; }
.btn-modern:hover { opacity: 0.9; }
.btn-modern:active { transform: scale(0.97); }

.card-hover { transition: transform 0.3s ease, box-shadow 0.3s ease; }
.card-hover:hover { transform: translateY(-4px); box-shadow: 0 12px 30px -4px rgba(0,0,0,0.08); }

/* Infinite Scroll Marquee */
.marquee-container { display: flex; overflow: hidden; width: 100%; mask-image: linear-gradient(to right, transparent, black 10%, black 90%, transparent); }
.marquee-content { display: flex; flex-shrink: 0; animation: scroll-left 35s linear infinite; }
@keyframes scroll-left { from { transform: translateX(0); } to { transform: translateX(-50%); } }

/* Services Page - Interactive Blur Grid */
.services-grid-wrap .blur-card {
    transition: all 0.5s cubic-bezier(0.16, 1, 0.3, 1); filter: blur(0px) grayscale(0%); opacity: 1; transform: scale(1);
}
.services-grid-wrap:not(.has-active) .blur-card:hover {
    transform: translateY(-4px); box-shadow: 0 12px 30px -4px rgba(37, 99, 235, 0.15); border-color: rgba(37, 99, 235, 0.3);
}
.services-grid-wrap.has-active .blur-card {
    filter: blur(4px) grayscale(30%); opacity: 0.6; transform: scale(0.98);
}
.services-grid-wrap.has-active .blur-card.active-service {
    filter: blur(0px) grayscale(0%); opacity: 1; transform: scale(1.02); box-shadow: 0 20px 40px -10px rgba(0,0,0,0.15); z-index: 10; border-color: #3b82f6;
}
.service-details { max-height: 0; overflow: hidden; opacity: 0; transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1); }
.blur-card.active-service .service-details { max-height: 300px; opacity: 1; padding-top: 1rem; margin-top: 1rem; border-top: 1px solid #e2e8f0; }

/* Stylish Image */
.stylish-img-wrap { transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1); }
.stylish-img-wrap:hover { transform: rotate(0deg) scale(1.02); }

.project-wrap { transition: opacity 0.4s ease, transform 0.4s ease; }

/* Half Scroll Spacing Utilities */
.half-scroll {
    min-height: 45vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
}