/* --- Reset & Basic Styles --- */
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
            font-family: 'Poppins', sans-serif;
        }

        body {
            color: #333;
            background-color: #f9f9f9;
            line-height: 1.6;
        }

        a {
            text-decoration: none;
            color: inherit;
        }

        ul {
            list-style: none;
        }

        .container {
            max-width: 1200px;
            margin: 0 auto;
            padding: 0 20px;
        }

        /* --- Buttons --- */
        .btn-primary {
            background-color: #1a8a3e;
            color: #fff;
            padding: 10px 20px;
            border-radius: 5px;
            font-weight: 500;
            border: none;
            cursor: pointer;
            transition: 0.3s;
            font-size: 0.95rem;
        }
        .btn-primary:hover { background-color: #146b30; }
        .full-width-btn { width: 100%; padding: 12px; }
        .btn-outline {
            background: transparent;
            border: 1px solid #fff;
            color: #fff;
            padding: 10px 20px;
            border-radius: 5px;
            cursor: pointer;
            transition: 0.3s;
        }
        .btn-outline:hover { background: #fff; color: #1a8a3e; }
        .btn-outline-dark {
            background: transparent;
            border: 1px solid #333;
            color: #333;
            padding: 10px 20px;
            border-radius: 5px;
            cursor: pointer;
            transition: 0.3s;
        }
        .btn-outline-dark:hover { background: #333; color: #fff; }

        /* --- Top Bar --- */
        .top-bar {
            background-color: #1a1a1a;
            color: #ccc;
            font-size: 0.85rem;
            padding: 10px 0;
            border-bottom: 1px solid #333;
        }
        .top-bar .container {
            display: flex;
            flex-wrap: wrap; /* Allows wrapping on smaller screens */
            justify-content: space-between;
            align-items: center;
            gap: 10px;
        }
        .top-bar i { margin-right: 5px; }
        .top-left, .top-right {
            display: flex;
            align-items: center;
            gap: 15px;
            flex-wrap: wrap;
        }
        .top-right a { color: #ccc; transition: 0.3s; }
        .top-right a:hover { color: #fff; }

        /* --- Navigation (Desktop) --- */
        header {
            background-color: #fff;
            padding: 15px 0;
            box-shadow: 0 2px 5px rgba(0,0,0,0.05);
            position: sticky;
            top: 0;
            z-index: 1000;
        }
        .header-content {
            display: flex;
            justify-content: space-between;
            align-items: center;
        }
        .logo {
            font-weight: 700;
            font-size: 1.2rem;
            letter-spacing: 1px;
            display: flex;
            align-items: center;
        }
        .logo i { color: #1a8a3e; margin-right: 8px; font-size: 1.5rem; }
        
        nav ul { display: flex; gap: 20px; }
        nav ul li a { color: #333; font-weight: 500; transition: 0.3s; font-size: 0.95rem; }
        nav ul li a:hover { color: #1a8a3e; }

        /* --- Mobile Menu Toggle (Hidden on Desktop) --- */
        .hamburger {
            display: none; /* Hidden by default on desktop */
            cursor: pointer;
            font-size: 1.5rem;
            color: #333;
        }
        .nav-checkbox { display: none; } /* Hidden checkbox for toggle logic */

        /* --- Hero Section --- */
        .hero {
            background: linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0.5)), url('../../images/contact-banner.jpg');
            background-size: cover;
            background-position: center;
            color: #fff;
            padding: 80px 0;
            margin-bottom: 30px;
        }
        .hero .breadcrumb { font-size: 0.9rem; margin-bottom: 10px; opacity: 0.9; }
        .hero h1 { font-size: 2.5rem; margin-bottom: 10px; }
        .hero p { font-size: 1.1rem; opacity: 0.9; }

        /* --- Info Cards --- */
        .info-cards {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 20px;
            margin-bottom: 40px;
        }
        .info-cards .card {
            background: #fff;
            padding: 20px;
            border-radius: 10px;
            box-shadow: 0 4px 10px rgba(0,0,0,0.05);
            display: flex;
            align-items: center;
            gap: 15px;
            border: 1px solid #eee;
        }
        .info-cards .card .icon {
            background: #e6f7ec;
            color: #1a8a3e;
            width: 45px;
            height: 45px;
            border-radius: 50%;
            display: flex;
            justify-content: center;
            align-items: center;
            font-size: 1.2rem;
            flex-shrink: 0;
        }
        .info-cards .card h3 { font-size: 0.95rem; margin-bottom: 3px; }
        .info-cards .card p { font-size: 0.8rem; color: #666; line-height: 1.2; }

        /* --- Contact Form Section --- */
        .contact-main {
            display: flex;
            gap: 40px;
            margin-bottom: 40px;
        }
        .form-container, .help-container {
            flex: 1;
            background: #fff;
            padding: 30px;
            border-radius: 10px;
            box-shadow: 0 4px 15px rgba(0,0,0,0.05);
        }
        .form-container h2, .help-container h3 { margin-bottom: 20px; }
        .form-container form .row { display: flex; gap: 15px; margin-bottom: 15px; }
        .form-container form .col { flex: 1; }
        .form-container input, .form-container select, .form-container textarea {
            width: 100%;
            padding: 12px;
            border: 1px solid #ddd;
            border-radius: 5px;
            outline: none;
            font-size: 0.95rem;
        }
        .form-container textarea { min-height: 120px; resize: vertical; }

        .help-container .features { margin-bottom: 20px; }
        .help-container .features li { margin-bottom: 8px; display: flex; align-items: center; }
        .help-container .features li i { color: #1a8a3e; margin-right: 10px; }
        .help-image img { width: 100%; border-radius: 5px; object-fit: cover; height: 250px; }

        /* --- Map Section --- */
        .map-section { margin-bottom: 40px; }
        .map-section h2 { margin-bottom: 15px; }
        .map-container { width: 100%; height: 350px; border-radius: 10px; overflow: hidden; box-shadow: 0 4px 10px rgba(0,0,0,0.05); }

        /* --- Why Choose & FAQ --- */
        .extra-info { display: flex; gap: 40px; margin-bottom: 40px; }
        .why-choose { flex: 1; background: #fff; padding: 30px; border-radius: 10px; }
        .why-choose .grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: 20px; }
        .why-choose .item { border: 1px solid #eee; padding: 15px; text-align: center; border-radius: 8px; transition: 0.3s; }
        .why-choose .item:hover { box-shadow: 0 4px 10px rgba(0,0,0,0.05); }
        .why-choose .item .icon { color: #1a8a3e; font-size: 1.5rem; margin-bottom: 8px; }
        .why-choose .item p { font-size: 0.85rem; font-weight: 500; }

        .faq { flex: 1; background: #fff; padding: 30px; border-radius: 10px; }
        .faq-list .faq-item { border-bottom: 1px solid #eee; }
        .faq-list .faq-item:last-child { border-bottom: none; }
        .faq-question { display: flex; justify-content: space-between; align-items: center; padding: 15px 0; font-weight: 500; font-size: 0.9rem; cursor: pointer; }
        .faq-question i { color: #1a8a3e; transition: transform 0.3s ease; }
        .faq-answer { max-height: 0; overflow: hidden; transition: max-height 0.3s ease, padding 0.3s ease; padding: 0 0; color: #666; }
        .faq-answer p { margin: 0; padding-bottom: 15px; line-height: 1.6; }
        .faq-item.active .faq-answer { max-height: 200px; padding: 0 0 10px 0; }
        .faq-item.active .faq-question i { transform: rotate(45deg); }

        /* --- CTA Banner --- */
        .cta-banner { background-color: #0a6b2f; color: #fff; padding: 30px; border-radius: 10px; margin-bottom: 40px; }
        .banner-content { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 20px; }
        .banner-content h3 { font-size: 1.5rem; }
        .banner-content h3 i { margin-right: 10px; }
        .banner-content .phone-large { font-size: 1.3rem; display: flex; align-items: center; gap: 10px; }
        .banner-content .phone-large i { font-size: 1.5rem; }
        .banner-content .phone-large small { font-size: 0.8rem; font-weight: 400; }

        /* --- Social & Promo --- */
        .social-promo { display: flex; gap: 40px; margin-bottom: 50px; }
        .socials { flex: 1; background: #fff; padding: 30px; border-radius: 10px; }
        .socials .icons { margin-top: 15px; }
        .socials .icons a { display: inline-flex; justify-content: center; align-items: center; width: 35px; height: 35px; background: #1a8a3e; color: #fff; border-radius: 50%; margin-right: 10px; transition: 0.3s; }
        .socials .icons a:hover { background: #146b30; }

        .promo-box { flex: 2; background: #fff; border-radius: 10px; overflow: hidden; display: flex; }
        .promo-box .text { flex: 1; padding: 30px; display: flex; flex-direction: column; justify-content: center; }
        .promo-box .text h3 { margin-bottom: 10px; font-size: 1.4rem; }
        .promo-box .text p { margin-bottom: 20px; color: #666; }
        .promo-box .text .promo-buttons { display: flex; gap: 15px; flex-wrap: wrap; }
        .promo-box .image { flex: 1; min-height: 200px; }
        .promo-box .image img { width: 100%; height: 100%; object-fit: cover; }

        /* --- Footer --- */
        footer { background-color: #111; color: #bbb; padding: 60px 0 20px 0; font-size: 0.9rem; }
        footer .footer-content { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr 1fr 1.5fr; gap: 30px; margin-bottom: 40px; }
        footer .footer-col h4 { color: #fff; margin-bottom: 20px; font-size: 1rem; }
        footer .footer-col ul li { margin-bottom: 10px; }
        footer .footer-col ul li a:hover { color: #fff; }
        footer .footer-col.newsletter form { display: flex; flex-direction: column; gap: 10px; margin-top: 15px; }
        footer .footer-col.newsletter input { padding: 10px; border-radius: 5px; border: none; width: 100%; }
        footer .footer-col.newsletter button { background: #1a8a3e; color: #fff; border: none; padding: 10px; border-radius: 5px; cursor: pointer; width: 100%; }
        footer .footer-bottom { border-top: 1px solid #333; padding-top: 20px; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 10px; }
        footer .footer-bottom .links a { margin-left: 20px; color: #bbb; transition: 0.3s; }
        footer .footer-bottom .links a:hover { color: #fff; }
        .whatsapp-float { position: fixed; bottom: 20px; right: 20px; background: #25D366; color: #fff; width: 50px; height: 50px; border-radius: 50%; display: flex; justify-content: center; align-items: center; font-size: 1.5rem; box-shadow: 0 4px 10px rgba(0,0,0,0.2); cursor: pointer; z-index: 999; }

        /* --- RESPONSIVE DESIGN (Mobile & Tablet) --- */
        @media (max-width: 992px) {
            .top-bar .container { justify-content: center; text-align: center; }
            .top-left, .top-right { width: 100%; justify-content: center; }
            
            .info-cards { grid-template-columns: repeat(2, 1fr); }
            .contact-main { flex-direction: column; }
            .extra-info { flex-direction: column; }
            .social-promo { flex-direction: column; }
            footer .footer-content { grid-template-columns: 1fr 1fr; }
        }

        @media (max-width: 768px) {
            /* Reveal Hamburger Menu */
            .hamburger { display: block; z-index: 1001; }
            
            /* Standard Nav Hide */
            nav { 
                position: fixed; 
                top: 0; 
                right: -100%; 
                width: 70%; 
                height: 100vh; 
                background: #fff; 
                box-shadow: -5px 0 15px rgba(0,0,0,0.1); 
                transition: right 0.3s ease; 
                padding-top: 80px; 
                z-index: 1000;
            }
            nav ul { flex-direction: column; align-items: center; gap: 20px; }
            
            /* Checkbox Hack to toggle menu */
            .nav-checkbox:checked ~ nav { right: 0; }
        }

        @media (max-width: 576px) {
            .info-cards { grid-template-columns: 1fr; }
            .form-container form .row { flex-direction: column; gap: 10px; }
            .why-choose .grid { grid-template-columns: repeat(2, 1fr); }
            .banner-content { flex-direction: column; text-align: center; }
            .promo-box { flex-direction: column; }
            footer .footer-content { grid-template-columns: 1fr; }
            .hero h1 { font-size: 2rem; }
            .top-bar { font-size: 0.75rem; }
            .top-right span { display: block; margin: 5px 0; } /* Stack on very small screens */
        }