/* --- STYLE.CSS V7.0 (Layanan Bergambar) --- */

/* Font & Body */
body { font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; color: #444; background-color: #f8f9fa; }

/* Navbar */
.navbar { box-shadow: 0 2px 10px rgba(0,0,0,0.1); background: linear-gradient(to right, #212529, #343a40) !important; }
.navbar-brand i { color: #ffc107; }
.nav-link { font-weight: 600; letter-spacing: 0.5px; }

/* Hero Section Modern */
.hero-section {
    background: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), url('https://images.unsplash.com/photo-1585704032915-c3400ca199e7?q=80&w=1920&auto=format&fit=crop');
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    height: 85vh; min-height: 600px;
    color: white;
    display: flex; align-items: center; justify-content: center;
    text-align: center; position: relative;
}

/* --- PERUBAHAN BAGIAN LAYANAN (SERVICES) --- */
.service-card {
    border: none; border-radius: 15px; background: #fff;
    transition: all 0.3s ease; box-shadow: 0 5px 15px rgba(0,0,0,0.05);
    overflow: hidden; /* Agar gambar tidak keluar dari sudut bulat */
}
.service-card:hover { transform: translateY(-10px); box-shadow: 0 15px 30px rgba(0,0,0,0.15); }

/* Wadah untuk gambar layanan */
.service-img-wrapper {
    height: 200px; /* Tinggi gambar seragam */
    overflow: hidden;
    border-bottom: 3px solid #ffc107; /* Garis kuning pemanis */
}
/* Gambar layanannya sendiri */
.service-img {
    width: 100%; height: 100%;
    object-fit: cover; /* Gambar mengisi kotak tanpa gepeng */
    transition: transform 0.5s ease;
}
.service-card:hover .service-img { transform: scale(1.1); /* Efek zoom saat hover */ }

/* Card Body Layanan */
.service-card-body { padding: 1.5rem; text-align: center; }

/* Feature List (About) */
.feature-list li { margin-bottom: 15px; font-size: 1.1rem; font-weight: 500; }
.feature-list i { color: #198754; margin-right: 10px; font-size: 1.2rem;}

/* Gallery Section */
.gallery-img { height: 250px; object-fit: cover; cursor: pointer; transition: transform 0.3s; }
.gallery-img:hover { transform: scale(1.03); z-index: 2; position: relative; box-shadow: 0 10px 20px rgba(0,0,0,0.2); }

/* Footer & Floating WA */
footer { background: #1a1e21 !important; }
.float-wa {
    position: fixed; width: 60px; height: 60px; bottom: 30px; right: 30px;
    background-color: #25d366; color: #FFF; border-radius: 50px; text-align: center;
    font-size: 30px; box-shadow: 2px 2px 3px #999; z-index: 100; display: flex; align-items: center; justify-content: center;
    transition: all 0.3s;
}
.float-wa:hover { background-color: #128c7e; transform: scale(1.1); }

/* Admin Dashboard Styles */
.form-section-title { border-bottom: 2px solid #0d6efd; padding-bottom: 5px; margin-bottom: 15px; color: #0d6efd; font-weight: bold; margin-top: 25px; }
.admin-service-img-preview { width: 100%; height: 120px; object-fit: cover; border-radius: 8px; border: 2px solid #ddd; margin-bottom: 10px;}