/* Custom styles for Kona Real Estate Company */

/* Smooth scrolling */
html {
    scroll-behavior: smooth;
}

/* Typography */
body {
    font-family: 'Lato', sans-serif;
}

.font-serif {
    font-family: 'Playfair Display', serif;
}

/* Hero overlay */
.hero-overlay {
    background: linear-gradient(135deg, rgba(26,26,26,0.85) 0%, rgba(45,45,45,0.7) 100%);
}

/* Stat cards with glass effect */
.stat-card {
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

/* Navbar scroll effect */
.nav-scrolled {
    background: rgba(26,26,26,0.95) !important;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

/* Property card hover effect */
.property-card:hover .property-img {
    transform: scale(1.05);
}

.property-img {
    transition: transform 0.5s ease;
}

/* Primary button */
.btn-primary {
    background: linear-gradient(135deg, #e8645a 0%, #d4534a 100%);
    transition: all 0.3s ease;
}

.btn-primary:hover {
    background: linear-gradient(135deg, #d4504a 0%, #c0433a 100%);
    transform: translateY(-2px);
    box-shadow: 0 10px 25px rgba(232,100,90,0.3);
}

/* Secondary button */
.btn-secondary {
    border: 2px solid #e8645a;
    color: #e8645a;
    transition: all 0.3s ease;
}

.btn-secondary:hover {
    background: #e8645a;
    color: white;
}

/* Section divider */
.section-divider {
    height: 3px;
    width: 60px;
    background: linear-gradient(90deg, #e8645a, #f59890);
}

/* Mobile menu */
.mobile-menu {
    transform: translateX(100%);
    transition: transform 0.3s ease;
}

.mobile-menu.open {
    transform: translateX(0);
}

/* Fade-in animation for scroll reveals */
.fade-in {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.6s ease, transform 0.6s ease;
}

.fade-in.visible {
    opacity: 1;
    transform: translateY(0);
}

/* Respect user's motion preferences */
@media (prefers-reduced-motion: no-preference) {
    .fade-in {
        opacity: 0;
        transform: translateY(30px);
    }
}

@media (prefers-reduced-motion: reduce) {
    .fade-in {
        opacity: 1;
        transform: none;
    }
}

/* Custom scrollbar */
::-webkit-scrollbar {
    width: 10px;
}

::-webkit-scrollbar-track {
    background: #1a1a1a;
}

::-webkit-scrollbar-thumb {
    background: #3d3d3d;
    border-radius: 5px;
}

::-webkit-scrollbar-thumb:hover {
    background: #e8645a;
}