/* Additional responsive optimizations for Fairdeal Advisory Landing Page */

/* Removed old hero background image overrides */

/* Performance optimizations */
/* Reduce paint operations */
.service-card,
.property-card,
.testimonial-card,
.why-us-item,
.data-card {
    will-change: transform;
    backface-visibility: hidden;
}

/* Optimize animations */
@media (prefers-reduced-motion: reduce) {
    * {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
    
    .fade-in {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Improve accessibility */
:focus {
    outline: 3px solid var(--gold);
    outline-offset: 2px;
}

.btn:focus,
input:focus,
select:focus,
textarea:focus {
    box-shadow: 0 0 0 3px rgba(212, 172, 13, 0.5);
}

/* Responsive Hero Section */
@media (max-width: 992px) {
    .hero {
        min-height: auto; /* Remove fixed height on smaller screens */
        padding: var(--spacing-lg) 0; /* Reduce padding */
        padding-top: calc(var(--spacing-lg) + 80px); /* Keep space for header */
    }
    
    .hero-container {
        grid-template-columns: 1fr; /* Stack columns */
        gap: var(--spacing-md);
        text-align: center; /* Center text when stacked */
        padding: var(--spacing-md) 0; /* Adjust padding */
    }

    .hero-text-column {
        order: 2; /* Move text below image */
        display: flex; /* Use flexbox for centering */
        flex-direction: column;
        align-items: center; /* Center items horizontally */
    }

    .hero-image-column {
        order: 1; /* Move image above text */
        margin-bottom: var(--spacing-md); /* Add space below image */
    }
    
    .hero-image-column img {
        max-width: 400px; /* Adjust size for smaller screens */
    }

    .hero-title {
        font-size: 2.8rem; /* Adjust title size */
    }

    .hero-description {
        max-width: 100%; /* Allow full width */
    }

    .hero-cta {
        justify-content: center; /* Center buttons */
    }

    .hero-stats {
        justify-content: center; /* Center stats */
        gap: var(--spacing-md); /* Adjust gap */
        flex-wrap: wrap; /* Allow wrapping if needed */
    }
}


/* Additional responsive fixes */
@media (max-width: 576px) {
    .hero-title {
        font-size: 2rem; /* Further adjust title size */
    }
    
    .section-title {
        font-size: 1.8rem;
    }
    
    .section-padding {
        padding: var(--spacing-md) 0;
    }
    
    .services {
        margin-top: 0; /* Remove overlap on smaller screens */
        border-radius: 0; /* Remove border radius */
        box-shadow: none; /* Remove shadow */
    }
    
    .about-image {
        margin-bottom: var(--spacing-md);
    }
    
    .data-value {
        font-size: 2rem;
    }
    
    .property-image {
        height: 200px;
    }
    
    .contact-form,
    .contact-info {
        padding: var(--spacing-sm);
    }
    
    .footer-content {
        gap: var(--spacing-md);
    }
}

/* Print styles */
@media print {
    .header,
    .hero,
    .cta,
    .footer,
    .floating-contact,
    .contact-form,
    .slider-nav {
        display: none !important;
    }
    
    body {
        font-size: 12pt;
        color: #000;
        background: #fff;
    }
    
    a {
        color: #000;
        text-decoration: underline;
    }
    
    .container {
        width: 100%;
        max-width: 100%;
        padding: 0;
    }
    
    .section-padding {
        padding: 1cm 0;
    }
    
    .about-content,
    .services-grid,
    .properties-slider,
    .testimonials-slider,
    .why-us-grid,
    .insights-content {
        grid-template-columns: 1fr;
    }
    
    .property-card,
    .testimonial-card,
    .service-card,
    .why-us-item,
    .data-card {
        break-inside: avoid;
        page-break-inside: avoid;
        box-shadow: none;
        border: 1px solid #ddd;
    }
}

/* Loading optimization */
.lazy-load {
    opacity: 0;
    transition: opacity 0.3s ease;
}

.lazy-load.loaded {
    opacity: 1;
}

/* Font display optimization */
@font-face {
    font-family: 'Playfair Display';
    font-display: swap;
}

@font-face {
    font-family: 'Montserrat';
    font-display: swap;
}

@font-face {
    font-family: 'Open Sans';
    font-display: swap;
}