/* CSS untuk responsif pada layar kecil */

@media (max-width: 991px) {
	 .navbar-brand h1 {
		font-size: 1.25rem !important; /* atau sesuaikan ukuran */
		margin-top: 5px;
	}
		
	.d-flex {
		flex-direction: column; /* Menyusun tombol secara vertikal */
		align-items: center; /* Menyusun tombol di tengah */
	}

	/* Default (untuk desktop dan tablet besar) */
	.carousel-caption {
		position: absolute;
		bottom: 50px; /* Teks berada lebih dekat ke bawah pada desktop */
		left: 0;
		right: 0;
		text-align: left;
	}

	.carousel-caption {
		top: 40px; /* Posisikan caption lebih ke atas pada perangkat mobile */
		left: 0;
		right: 0;
		text-align: center; /* Menyusun teks ke tengah di perangkat mobile */
		transform: translateY(-30%); /* Angkat teks lebih tinggi */
	}

	.fs-5 {font-size:1rem !important}
	
	/* Default: untuk desktop dan tablet besar */
	.header-carousel-item {
		background-size: cover;
		background-position: center;
		height: 250px; /* Sesuaikan tinggi default */
		object-fit: cover;
	}

	.text-start {
		text-align: center !important; /* Override class .text-start di mobile */
	}
	
	.text-start h4 {
        font-size: 0.9rem; /* lebih kecil untuk mobile */
    }

    .text-start h1 {
        font-size: 1.2rem; /* lebih kecil dari display-4 */
    }

    .text-start p {
        font-size: 0.7rem; /* lebih kecil dari fs-5 */
    }

    .text-start .btn {
        font-size: 0.7rem;
        padding: 0.5rem 1rem;
    }
	
	.btn-center-mobile {
		display: block;           /* agar bisa pakai margin auto */
		margin: 0 auto;           /* margin kiri dan kanan otomatis, jadi center */
		width: fit-content;       /* sesuaikan lebar tombol dengan isinya */
    }
	
	.feature-content-inner h4 {
        font-size: 0.9rem; 
	}

	.feature-content-inner p {
        font-size: 0.8rem; 
	}

	.feature-content-inner .btn {
        font-size: 0.8rem;
		margin-top: 1rem;
    }
	
	.row.g-4 > .col-md-6 {
        display: flex;
        justify-content: center;  /* Pusatkan konten horizontal */
    }

    .row.g-4 > .col-md-6 > .d-flex {
        flex-direction: column;  /* Ubah dari horizontal ke vertikal */
        align-items: center;     /* Pusatkan isi vertikal */
        text-align: center;      /* Pusatkan tulisan */
    }

    /* Beri jarak icon dan tulisan saat vertikal */
    .row.g-4 > .col-md-6 > .d-flex > .me-3 {
        margin-right: 0;      /* Hilangkan margin kanan saat vertikal */
        margin-bottom: 0.5rem; /* Tambah jarak bawah antara icon dan tulisan */
    }
	
	.rounded.bg-primary.position-absolute h5 {
        font-size: 0.9rem; /* ukuran font lebih kecil */
    }

    /* Opsional: sesuaikan tinggi div agar proporsional */
    .rounded.bg-primary.position-absolute {
        height: 60px; /* lebih pendek di mobile */
        padding: 1rem; /* sesuaikan padding */
    }
	
	.counter-item h5 {
		font-size: 0.9rem;   /* lebih kecil dari ukuran default */
	}
	
	.footer h4,
    .footer h6,
    .footer p,
    .footer a,
    .copyright {
        font-size: 0.85rem !important; /* ukuran lebih kecil */
    }

    .footer h4 {
        font-size: 1rem !important;  /* judul tetap sedikit lebih besar */
    }

    .footer p {
        line-height: 1.4; /* agar teks tetap terbaca */
    }

    .copyright span,
    .copyright a {
        font-size: 0.75rem !important;
    }
	
	.footer-item .d-flex {
        align-items: flex-start;
    }

    .footer-item i {
        font-size: 1rem;
        margin-top: 0.2rem;
    }

    .footer-item p {
		font-size: 0.75rem !important;
		line-height: 1.2 !important;
		margin-bottom: 0.3rem !important;
		text-align: left !important;
	} 

}