/* Custom styles beyond Tailwind */

:root {
    --terracotta: #C06C44;
    --terracotta-dark: #A85533;
    --sand: #E8C4A8;
    --sand-light: #FDF6F0;
}

html {
    scroll-behavior: smooth;
}

body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Subtle pattern for hero background */
.bg-hero-pattern {
    background-image: radial-gradient(circle at 20% 50%, rgba(192, 108, 68, 0.05) 0%, transparent 50%),
                      radial-gradient(circle at 80% 20%, rgba(232, 196, 168, 0.15) 0%, transparent 50%);
}

/* Smooth focus outlines */
a:focus-visible,
button:focus-visible {
    outline: 2px solid var(--terracotta);
    outline-offset: 2px;
    border-radius: 4px;
}

/* Selection color */
::selection {
    background-color: rgba(192, 108, 68, 0.2);
    color: #1C1917;
}

/* Mobile menu animation */
#mobile-menu {
    animation: slideDown 0.3s ease-out;
}

@keyframes slideDown {
    from {
        opacity: 0;
        transform: translateY(-8px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Service card hover lift */
.group:hover {
    transform: translateY(-2px);
}

.group {
    transition: transform 0.3s ease;
}

/* Map placeholder fallback */
iframe {
    background: linear-gradient(135deg, #E8D5C4 0%, #D4B896 100%);
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }
    .group:hover {
        transform: none;
    }
    #mobile-menu {
        animation: none;
    }
}