/* --- Global Styles & Variables --- */
:root {
    --charcoal: #222222;
    --gold: #D4AF37;
    --light-gray: #f4f4f4;
    --off-white: #fafafa;
    --white: #ffffff;
    --font-heading: 'Cormorant Garamond', serif;
    --font-body: 'Montserrat', sans-serif;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body { font-family: var(--font-body); line-height: 1.6; color: var(--charcoal); background-color: var(--white); }
.container { max-width: 1200px; margin: 0 auto; padding: 0 2rem; }
h1, h2, h3 { font-family: var(--font-heading); font-weight: 600; line-height: 1.2; }
h2.section-title { text-align: center; font-size: 2.5rem; margin-bottom: 3rem; color: var(--charcoal); }

/* --- Header & Navigation --- */
.header { background-color: rgba(34, 34, 34, 0.8); backdrop-filter: blur(10px); color: var(--white); padding: 0.5rem 0; position: fixed; width: 100%; top: 0; z-index: 1000; transition: background-color 0.3s ease, padding 0.3s ease; }
.navbar { display: flex; justify-content: space-between; align-items: center; max-width: 1200px; margin: 0 auto; padding: 0 2rem; }
.logo img {
    height: 60px; /* Default logo size for desktop */
    width: auto;
    transition: height 0.3s ease; /* Smooth transition for size changes */
}
.nav-menu { display: flex; align-items: center; list-style: none; }
.nav-item { margin-left: 2rem; }
.nav-link { color: var(--white); text-decoration: none; font-size: 1rem; transition: color 0.3s ease; }
.nav-link:hover { color: var(--gold); }
.nav-item-btn { margin-left: 2rem; }
.nav-btn { padding: 0.5rem 1.5rem; }
.hamburger { display: none; cursor: pointer; }
.bar { display: block; width: 25px; height: 3px; margin: 5px auto; background-color: var(--white); transition: all 0.3s ease-in-out; }

/* --- Hero Section & Cross-Fade Animation --- */
.hero-section { height: 100vh; position: relative; display: flex; justify-content: center; align-items: center; text-align: center; color: var(--white); overflow: hidden; }
.hero-bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-size: cover; background-position: center; background-repeat: no-repeat; opacity: 0; transition: opacity 2s ease-in-out; z-index: 1; }
#hero-bg1 { opacity: 1; }
.hero-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); z-index: 2; }
.hero-content { position: relative; z-index: 3; max-width: 800px; }
.hero-content h1 { font-size: 4rem; margin-bottom: 1rem; }
.hero-content p { font-size: 1.2rem; margin-bottom: 2rem; }
.btn { display: inline-block; background: var(--gold); color: var(--charcoal); padding: 0.8rem 2rem; text-decoration: none; border-radius: 5px; font-weight: 600; transition: background-color 0.3s ease, transform 0.3s ease; border: none; cursor: pointer; }
.btn:hover { background-color: #c5a231; transform: translateY(-2px); }

/* --- General Content Sections --- */
.content-section { padding: 5rem 0; }
.content-section:nth-of-type(even) { background-color: var(--off-white); }

/* --- Services Section (with Button) --- */
.services-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 2rem; }
.service-card { background: var(--white); border-radius: 10px; overflow: hidden; box-shadow: 0 5px 15px rgba(0,0,0,0.08); transition: transform 0.3s ease, box-shadow 0.3s ease; display: flex; flex-direction: column; }
.service-card:hover { transform: translateY(-10px); box-shadow: 0 15px 30px rgba(0,0,0,0.12); }
.service-image img { width: 100%; height: 220px; object-fit: cover; }
.service-details { padding: 1.5rem; flex-grow: 1; display: flex; flex-direction: column; }
.service-details h3 { margin-bottom: 1rem; color: var(--charcoal); font-size: 1.5rem; }
.service-pricing { list-style: none; padding: 0; margin: 0; }
.service-pricing li { display: flex; justify-content: space-between; align-items: center; padding: 0.5rem 0; border-bottom: 1px solid #eee; font-size: 0.95rem; }
.service-pricing li:last-child { border-bottom: none; }
.service-pricing li span:first-child { color: #555; }
.service-pricing li span:last-child { font-weight: 600; color: var(--charcoal); }
.btn-service { width: 100%; text-align: center; margin-top: 1.5rem; padding: 0.7rem 1rem; }

/* --- Modern Footer --- */
.site-footer { background-color: var(--charcoal); color: #a9a9a9; font-size: 0.9rem; padding: 4rem 0 0; }
.footer-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 2rem; padding-bottom: 3rem; }
.footer-column .footer-heading { font-family: var(--font-heading); font-size: 1.5rem; color: var(--white); margin-bottom: 1.5rem; }
.footer-about { margin-top: 1rem; line-height: 1.8; }
.footer-links, .footer-contact { list-style: none; padding: 0; }
.footer-links li, .footer-contact li { margin-bottom: 0.8rem; }
.footer-links a { color: #a9a9a9; text-decoration: none; transition: color 0.3s ease; }
.footer-links a:hover { color: var(--gold); }
.footer-contact i { color: var(--gold); margin-right: 10px; width: 20px; }
.footer-social-icons { display: flex; gap: 0.8rem; margin-top: 1rem; }
.footer-social-icons a { display: inline-flex; justify-content: center; align-items: center; width: 40px; height: 40px; border-radius: 50%; border: 1px solid #555; color: #a9a9a9; text-decoration: none; transition: all 0.3s ease; }
.footer-social-icons a:hover { color: var(--charcoal); background-color: var(--gold); border-color: var(--gold); transform: translateY(-3px); }
.footer-bottom { border-top: 1px solid #333; text-align: center; padding: 1.5rem 0; }
.footer-bottom p { margin: 0; }

/* --- WhatsApp Button --- */
.whatsapp-float { position: fixed; width: 60px; height: 60px; bottom: 40px; right: 40px; background-color: #25D366; color: #FFF; border-radius: 50%; text-align: center; font-size: 30px; box-shadow: 0 4px 8px rgba(0,0,0,0.2), 0 6px 20px rgba(0,0,0,0.19); z-index: 100; display: flex; justify-content: center; align-items: center; text-decoration: none; animation: pulse 2.5s infinite; transition: transform 0.3s ease; }
.whatsapp-float:hover { transform: scale(1.1); animation-play-state: paused; }
@keyframes pulse { 0% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.7); } 70% { transform: scale(1); box-shadow: 0 0 0 10px rgba(37, 211, 102, 0); } 100% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(37, 211, 102, 0); } }

/* --- Responsive & Other Styles --- */
.about-container { display: flex; align-items: center; gap: 3rem; }
.about-text { flex: 1; }
.about-slideshow { flex: 1; position: relative; height: 400px; border-radius: 10px; overflow: hidden; box-shadow: 0 10px 20px rgba(0,0,0,0.1); }
.about-slide { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity 1.5s ease-in-out; }
.about-slide.active { opacity: 1; }
.gallery-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 1rem; }
.gallery-grid img { width: 100%; height: 200px; object-fit: cover; border-radius: 5px; transition: transform 0.3s ease; }
.gallery-grid img:hover { transform: scale(1.05); }
.testimonials-container { display: flex; gap: 2rem; justify-content: center; flex-wrap: wrap; }
.testimonial { background: var(--white); padding: 2rem; border-radius: 10px; text-align: center; max-width: 400px; box-shadow: 0 5px 15px rgba(0,0,0,0.08); }
.testimonial img { width: 80px; height: 80px; border-radius: 50%; object-fit: cover; margin-bottom: 1rem; border: 3px solid var(--gold); }
.testimonial blockquote { font-style: italic; color: #555; margin-bottom: 1rem; }
.testimonial cite { font-weight: 600; color: var(--charcoal); }
.contact-container { display: flex; gap: 3rem; align-items: center; }
.contact-info, .contact-map { flex: 1; }
.contact-info p { margin-bottom: 1rem; font-size: 1.1rem; }
.contact-info i { color: var(--gold); margin-right: 10px; width: 20px; }

/* --- Media Queries for Responsiveness --- */
@media (max-width: 992px) {
    /* RESPONSIVE LOGO FIX STARTS HERE */
    .header {
        padding: 0.25rem 0; /* Tighter padding for a shorter header */
    }
    .logo img {
        height: 45px; /* Smaller logo on mobile devices */
    }
    /* RESPONSIVE LOGO FIX ENDS HERE */

    .nav-menu { position: fixed; left: -100%; top: 3.5rem; /* Adjusted for new header height */ flex-direction: column; background-color: var(--charcoal); width: 100%; text-align: center; transition: 0.3s; padding: 2rem 0; }
    .nav-menu.active { left: 0; }
    .nav-item { margin: 1.5rem 0; }
    .nav-item-btn { margin: 1.5rem 0; }
    .hamburger { display: block; }
    .hamburger.active .bar:nth-child(2) { opacity: 0; }
    .hamburger.active .bar:nth-child(1) { transform: translateY(8px) rotate(45deg); }
    .hamburger.active .bar:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }
}

@media (max-width: 768px) {
    .hero-content h1 { font-size: 2.5rem; }
    .about-container, .contact-container, .footer-grid { flex-direction: column; text-align: center; }
    .footer-social-icons { justify-content: center; }
    .services-grid { grid-template-columns: 1fr; }
}