/* HERO */
    .hero-section {
        padding: 25px 0 25px;
        background: linear-gradient(to right, #0056b3, #00c6ff);
        color: white;
        text-align: center;
        margin-top: 4px;
    }



     
        :root {
            --primary-blue: #0056b3;
            --accent-blue: #007bff;
            --light-bg: #f8f9fa;
            --white: #ffffff;
            --dark-text: #0d1b2a;
        }

        body { 
            background-color: var(--white); 
            color: #333; 
            font-family: 'Segoe UI', Roboto, sans-serif; 
            overflow-x:hidden; 
            scroll-behavior: smooth; }

        /* Navigation */
        .navbar { background: rgba(255, 255, 255, 0.98); border-bottom: 1px solid #eee; padding: 4px 0; }
        .navbar-brand { font-weight: 800; color: var(--primary-blue) !important; font-size: 1.5rem; display: flex; align-items: center; }
        .navbar-brand img { height: 44px; margin-right: 10px; }
        .nav-link { color: #444 !important; font-weight: 500; font-size: 0.95rem; margin: 0 5px; }

        /* Hero Section */
        .hero { padding: 140px 0 80px; background: radial-gradient(circle at 90% 10%, #eef6ff 0%, #ffffff 60%); }
        .hero h1 { font-size: 3.8rem; font-weight: 800; line-height: 1.1; color: var(--dark-text); }
        .hero h1 span { color: var(--accent-blue); }

        /* Product Cards */
        .service-card {
            border-radius: 15px; padding: 35px 25px; height: 100%; transition: 0.4s;
            border: 1px solid #f0f0f0; background: #fff; position: relative;
            box-shadow: 0 5px 15px rgba(0,0,0,0.02);
        }
        .service-card:hover { transform: translateY(-10px); box-shadow: 0 15px 35px rgba(0,0,0,0.08); }
        .card-green { border-bottom: 5px solid #2ecc71; }
        .card-peach { border-bottom: 5px solid #f39c12; }
        .card-blue { border-bottom: 5px solid #3498db; }
        .card-orange { border-bottom: 5px solid #e67e22; }

        /* Video Section */
        .video-box { background: #fdfdfd; padding: 80px 0; border-top: 1px solid #eee; }
        .video-container { 
            position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; 
            border-radius: 12px; box-shadow: 0 20px 50px rgba(0,0,0,0.15); 
        }
        .video-container iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

        /* Contact Section */
        .contact-container { background: #0056b3; border-radius: 20px; padding: 40px; color: white; }
        .form-line { background: transparent !important; border: none !important; border-bottom: 1px solid rgba(255,255,255,0.4) !important; color: white !important; border-radius: 0; margin-bottom: 20px; }
        .form-line::placeholder { color: rgba(255,255,255,0.7); }
        .btn-request { background: #ff4d4d; color: white; border: none; padding: 12px 30px; font-weight: 700; border-radius: 5px; text-transform: uppercase; transition: 0.3s; }
        .btn-request:hover { background: #e63e3e; transform: scale(1.02); }

        /* Logos Section */
        .logo-grid img { filter: grayscale(100%); opacity: 0.6; transition: 0.3s; max-height: 50px; margin: 20px; }
        .logo-grid img:hover { filter: grayscale(0%); opacity: 1; }

        /* TESTIMONIAL SLIDER */
        .testimonial-area { background: #f4f7ff; padding: 80px 0; }
        .testimonial-card { 
            background: #5c6bc0; color: white; padding: 60px 40px; border-radius: 20px; 
            position: relative; min-height: 350px; display: flex; flex-direction: column; justify-content: center;
        }
        .quote-icon { font-size: 5rem; opacity: 0.15; position: absolute; top: 10px; left: 20px; }
        .quote-icon-right { font-size: 5rem; opacity: 0.15; position: absolute; bottom: 10px; right: 20px; }
        .carousel-indicators [data-bs-target] { background-color: #5c6bc0; width: 12px; height: 12px; border-radius: 50%; }

        /* Footer */
        footer { background: #0a111e; color: #cbd5e1; padding: 70px 0 20px; }
        .subscribe-group { display: flex; background: rgba(255,255,255,0.1); padding: 5px; border-radius: 8px; border: 1px solid rgba(255,255,255,0.2); }
        .subscribe-group input { background: transparent; border: none; color: white; padding: 10px 15px; flex-grow: 1; outline: none; }
        .btn-green { background: #2ecc71; color: white; border: none; border-radius: 6px; padding: 8px 20px; font-weight: 600; }
        
        
        /* floating button */
        .floating-contact{
            position:fixed;
            right:20px;
            bottom:20px;
            display:flex;
            flex-direction:column;
            gap:12px;
            z-index:9999;
        }

        .floating-contact a{
            width:55px;
            height:55px;
            border-radius:50%;
            display:flex;
            align-items:center;
            justify-content:center;
            color:#fff;
            font-size:22px;
            box-shadow:0 5px 15px rgba(0,0,0,0.2);
            text-decoration:none;
        }

        .whatsapp-btn{
            background:#25D366;
        }

        .call-btn{
            background:#0d6efd;
        }

        .floating-contact a:hover{
            transform:scale(1.08);
        }