/* ─── Base & Utilities ─── */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 80px; }
body { background-color: #0F0D0B; color: #E8D5C0; }

::selection { background: rgba(232, 90, 40, 0.3); color: #FDF4F0; }

/* ─── Navigation ─── */
#nav { background: transparent; }
#nav.scrolled {
    background: rgba(15, 13, 11, 0.92);
    backdrop-filter: blur(20px);
    border-bottom: 1px solid rgba(148, 120, 90, 0.1);
    box-shadow: 0 4px 40px rgba(0, 0, 0, 0.3);
}

/* ─── Hero Floating Cards ─── */
.card-float-1 { animation: float1 6s ease-in-out infinite; }
.card-float-2 { animation: float2 7s ease-in-out infinite; }
.card-float-3 { animation: float3 5.5s ease-in-out infinite; }

@keyframes float1 {
    0%, 100% { transform: translateY(0px); }
    50% { transform: translateY(-12px); }
}
@keyframes float2 {
    0%, 100% { transform: translateY(0px); }
    50% { transform: translateY(-16px); }
}
@keyframes float3 {
    0%, 100% { transform: translateY(0px); }
    50% { transform: translateY(-10px); }
}

/* ─── Service Cards ─── */
.service-card {
    transition: transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94),
                border-color 0.4s ease,
                background 0.4s ease;
}
.service-card:hover {
    transform: translateY(-6px);
}

/* ─── Gallery ─── */
.group img {
    transition: transform 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* ─── Scroll Reveal ─── */
.reveal {
    opacity: 0;
    transform: translateY(40px);
    transition: opacity 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94),
                transform 0.8s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.reveal.visible {
    opacity: 1;
    transform: translateY(0);
}
.reveal-delay-1 { transition-delay: 0.1s; }
.reveal-delay-2 { transition-delay: 0.2s; }
.reveal-delay-3 { transition-delay: 0.3s; }
.reveal-delay-4 { transition-delay: 0.4s; }

/* ─── Mobile Menu ─── */
.mobile-link {
    display: block;
    padding: 0.5rem 0;
    border-bottom: 1px solid rgba(148, 120, 90, 0.08);
}
.mobile-link:last-child { border-bottom: none; }

/* ─── Custom Select ─── */
select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%239CA3AF' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 1rem center;
    padding-right: 2.5rem;
}

/* ─── Form Focus States ─── */
input:focus, textarea:focus, select:focus {
    border-color: rgba(232, 90, 40, 0.5) !important;
    box-shadow: 0 0 0 3px rgba(232, 90, 40, 0.08) !important;
}

/* ─── Smooth anchor offset for fixed nav ─── */
section[id] {
    scroll-margin-top: 80px;
}

/* ─── Responsive ─── */
@media (max-width: 768px) {
    .card-float-1, .card-float-2, .card-float-3 {
        animation: none !important;
    }
}