*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
    margin: 0;
    overflow-x: hidden;
}

::selection {
    background: rgba(212, 159, 58, 0.3);
    color: #f0f0f0;
}

/* ── Hero Gradient ── */
.hero-gradient {
    background:
        radial-gradient(ellipse 80% 60% at 20% 40%, rgba(45, 90, 39, 0.5) 0%, transparent 60%),
        radial-gradient(ellipse 60% 50% at 80% 30%, rgba(200, 169, 97, 0.25) 0%, transparent 55%),
        radial-gradient(ellipse 70% 70% at 50% 80%, rgba(30, 48, 23, 0.6) 0%, transparent 50%),
        linear-gradient(180deg, #0a1a0a 0%, #0a0a0a 50%, #0d0d0d 100%);
}

/* ── Floating Dots ── */
.hero-dots {
    pointer-events: none;
}

.dot {
    position: absolute;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(212,159,58,0.6) 0%, transparent 70%);
    animation: float-dot 6s ease-in-out infinite;
}

@keyframes float-dot {
    0%, 100% { transform: translateY(0) scale(1); opacity: 0.4; }
    50% { transform: translateY(-20px) scale(1.3); opacity: 0.8; }
}

/* ── Hero Glow ── */
.hero-glow {
    pointer-events: none;
    animation: pulse-glow 4s ease-in-out infinite;
}

.hero-glow-2 {
    animation: pulse-glow 5s ease-in-out infinite reverse;
}

@keyframes pulse-glow {
    0%, 100% { opacity: 0.5; transform: scale(1); }
    50% { opacity: 0.8; transform: scale(1.1); }
}

/* ── Hero Animations ── */
.hero-badge {
    opacity: 0;
    animation: fade-up 0.8s ease forwards;
    animation-delay: 0.2s;
}

.hero-title {
    opacity: 0;
    animation: fade-up 0.8s ease forwards;
    animation-delay: 0.4s;
}

.hero-subtitle {
    opacity: 0;
    animation: fade-up 0.8s ease forwards;
    animation-delay: 0.6s;
}

.hero-buttons {
    opacity: 0;
    animation: fade-up 0.8s ease forwards;
    animation-delay: 0.8s;
}

.hero-scroll {
    opacity: 0;
    animation: fade-up 0.8s ease forwards;
    animation-delay: 1.2s;
}

@keyframes fade-up {
    from { opacity: 0; transform: translateY(30px); }
    to { opacity: 1; transform: translateY(0); }
}

/* ── Scroll Reveal ── */
.scroll-reveal {
    opacity: 1;
    transform: translateY(0);
    transition: opacity 0.7s ease, transform 0.7s ease;
}

.scroll-reveal.revealed {
    opacity: 1;
    transform: translateY(0);
}

@media (prefers-reduced-motion: no-preference) {
    .scroll-reveal {
        opacity: 0;
        transform: translateY(40px);
        transition: opacity 0.7s ease, transform 0.7s ease;
    }
    .scroll-reveal.revealed {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ── Navbar ── */
.navbar-scrolled {
    background: rgba(10, 10, 10, 0.9) !important;
    backdrop-filter: blur(20px);
    border-bottom: 1px solid rgba(255,255,255,0.05);
    box-shadow: 0 4px 30px rgba(0,0,0,0.3);
}

/* ── Mobile Menu ── */
.mobile-menu-open {
    opacity: 1 !important;
    pointer-events: all !important;
}

.hamburger-active span:nth-child(1) {
    transform: rotate(45deg) translate(5px, 5px);
}

.hamburger-active span:nth-child(2) {
    opacity: 0;
}

.hamburger-active span:nth-child(3) {
    transform: rotate(-45deg) translate(5px, -5px);
    width: 1.25rem;
    margin-left: 0;
}

.mobile-link {
    opacity: 0;
    transform: translateY(10px);
    transition: opacity 0.3s ease, transform 0.3s ease;
}

.mobile-menu-open .mobile-link {
    opacity: 1;
    transform: translateY(0);
}

.mobile-menu-open .mobile-link:nth-child(1) { transition-delay: 0.05s; }
.mobile-menu-open .mobile-link:nth-child(2) { transition-delay: 0.1s; }
.mobile-menu-open .mobile-link:nth-child(3) { transition-delay: 0.15s; }
.mobile-menu-open .mobile-link:nth-child(4) { transition-delay: 0.2s; }
.mobile-menu-open .mobile-link:nth-child(5) { transition-delay: 0.25s; }

/* ── Card Shimmer ── */
.scroll-reveal.group {
    opacity: 1;
    transform: translateY(0);
}

@media (prefers-reduced-motion: no-preference) {
    .scroll-reveal.group {
        opacity: 0;
        transform: translateY(30px);
        transition: opacity 0.6s ease, transform 0.6s ease;
    }
    .scroll-reveal.group.revealed {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ── Smooth Scroll Offset ── */
section[id] {
    scroll-margin-top: 80px;
}

/* ── Form Focus ── */
input:focus, textarea:focus {
    background: rgba(255,255,255,0.08);
}

/* ── Custom Scrollbar ── */
::-webkit-scrollbar {
    width: 8px;
}
::-webkit-scrollbar-track {
    background: #0a0a0a;
}
::-webkit-scrollbar-thumb {
    background: rgba(212,159,58,0.3);
    border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
    background: rgba(212,159,58,0.5);
}
