/* HERO SLIDER */
        .hero { position: relative; width: 100%; height: 775px; overflow: hidden; background: #000; }
        .slider-container { position: relative; width: 100%; height: 100%; }
        
        .slide { 
            position: absolute; 
            inset: 0; 
            opacity: 0; 
            transition: opacity 0.8s ease-in-out; 
            z-index: 1;
        }
        .slide.active { opacity: 1; z-index: 2; }
        .slide img { width: 100%; height: 100%; object-fit: cover; }

        .hero-overlay { position: absolute; inset: 0; background: rgba(0, 0, 0, 0.5); z-index: 3; }

        .hero-content {
    position: absolute; 
    /* मजकूर खाली आणि डावीकडे घेण्यासाठी */
    bottom: 60px; 
    left: 10%; 
    
    /* transform काढून टाकला कारण आता आपल्याला सेंटरला नाही ठेवायचे */
    transform: none; 
    
    z-index: 10; 
    text-align: left; /* मजकूर डावीकडून सुरू होईल */
    color: #fff; 
    width: 90%; 
    max-width: 700px; /* मजकूर खूप पसरू नये म्हणून विड्थ कमी केली */
}

.hero-content h1 { 
    font-size: 2.8rem; /* थोडी साईज वाढवली */
    margin-bottom: 20px; 
    line-height: 1.2; 
    text-shadow: 2px 2px 10px rgba(0,0,0,0.5); /* वाचायला सोपे जावे म्हणून शॅडो */
}

/* बटणे डावीकडे अलाईन करण्यासाठी */
.hero-ctas { 
    display: flex; 
    justify-content: flex-start; /* डावीकडे अलाईन */
    gap: 15px; 
    margin-top: 25px; 
}

        /* Slider Controls */
        .slider-btn {
            position: absolute; top: 50%; transform: translateY(-50%);
            background: rgba(255, 255, 255, 0.2); color: #fff; border: none;
            padding: 15px; cursor: pointer; z-index: 15; border-radius: 50%;
            transition: 0.3s;
        }
        .slider-btn:hover { background: var(--accent-gold); }
        .prev { left: 20px; }
        .next { right: 20px; }

        .dots {
            position: absolute; bottom: 20px; left: 50%; transform: translateX(-50%);
            display: flex; gap: 10px; z-index: 15;
        }
        .dot { width: 12px; height: 12px; border-radius: 50%; background: rgba(255,255,255,0.4); border: none; cursor: pointer; }
        .dot.active { background: var(--accent-gold); width: 25px; border-radius: 10px; }

        /* Buttons */
        .hero-ctas { display: flex; justify-content: center; gap: 15px; margin-top: 20px; }
        .btn { padding: 12px 25px; border-radius: 5px; text-decoration: none; font-weight: 600; transition: 0.3s; }
        .btn.primary { background: var(--accent-gold); color: #fff; }
        .btn.secondary { border: 2px solid #fff; color: #fff; }
        .btn:hover { transform: scale(1.05); }

        
        /* Responsive */
        @media (max-width: 768px) {
            .hero { height: 500px; }
            .hero-content h1 { font-size: 1.5rem; }
            .slider-btn { padding: 10px; }
        }