:root {
    --primary: #042C71;
    --secondary: #CE4912;
    --highlight: #F8D605;
    --section-gap: clamp(60px, 8vh, 100px); /* Reduced gap */
}

@layer base {
    html { font-size: 14px; }
    body { 
        @apply bg-[#f9f9f8] text-[#191c1c] overflow-x-hidden;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
    }
}

/* --- LIGHT HERO THEME --- */
.hero-light-slide {
    @apply bg-white text-primary !important;
}

.hero-light-slide h1 { @apply text-primary !important; }
.hero-light-slide p { @apply text-primary/60 !important; }
.hero-light-slide .glass-overlay { @apply bg-primary/5 !important; }

/* --- RESPONSIVE SCALING --- */
@media (max-width: 1024px) {
    .hero-title { font-size: 3.5rem !important; line-height: 1.1; }
}

@media (max-width: 768px) {
    .hero-title { font-size: 2.5rem !important; }
    .px-margin-page { px-6 !important; }
    .py-section-gap { py-12 !important; }
    .glass-card { @apply p-6 !important; }
}

/* --- OVERLAP FIXES --- */
header { z-index: 1000; }
.swiper-slide { z-index: 10; }
main { z-index: 20; position: relative; margin-top: -20px; } /* Slight overlap for depth */

/* --- COMPACT BUTTONS --- */
.magnetic-button {
    @apply px-6 py-3 text-[10px] font-black !important;
}

/* --- COMPACT CARDS --- */
.glass-card {
    @apply rounded-[1.5rem] p-8 !important; /* Reduced padding and radius */
}

/* --- SERVICES SHOWCASE --- */
#services-trigger {
    position: relative;
    z-index: 30;
}

#services-horizontal {
    will-change: transform;
    display: flex;
}

/* --- PARTNER SLIDER --- */
.partnerSwiper .swiper-slide {
    @apply flex items-center justify-center py-2;
}

.swiper-slide { transition: z-index 0.3s step-end; }
.swiper-slide:hover { z-index: 50 !important; }

/* --- PREMIUM UI COMPONENTS --- */
.glass-card {
    background: rgba(255, 255, 255, 0.8);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.3);
    box-shadow: var(--premium-shadow);
}

.service-card-stack {
    position: relative;
    transition: all 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.service-card-stack::before,
.service-card-stack::after {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: 2.5rem;
    z-index: -1;
    transition: all 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
    opacity: 0;
}

.service-card-stack:hover::before {
    transform: rotate(-5deg) scale(0.95);
    background: var(--secondary);
    opacity: 0.3;
}

.service-card-stack:hover::after {
    transform: rotate(5deg) scale(0.95);
    background: var(--secondary);
    opacity: 0.2;
}

/* --- FOOTER --- */
.footer-mesh {
    background: radial-gradient(circle at top right, rgba(206, 73, 18, 0.1), transparent 50%),
                radial-gradient(circle at bottom left, rgba(4, 44, 113, 0.2), transparent 50%),
                #001848;
}