--gray: #f1f3f5; } /* Pastikan style ini tidak mempengaruhi elemen lain di luar blok ini */ .infografis-container-elementor { font-family: 'Poppins', sans-serif; margin: 0; padding: 0; background-color: transparent; /* Sesuaikan dengan background Elementor */ color: #333; line-height: 1.6; } .infografis-container-elementor .card { background-color: var(--white); border-radius: 8px; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08); padding: 1rem; margin-bottom: 0.75rem; transition: transform 0.2s ease, box-shadow 0.2s ease; } .infografis-container-elementor .card:hover { transform: translateY(-5px); box-shadow: 0 6px 15px rgba(0, 0, 0, 0.1); } /* Tambahkan judul pada card pertama untuk mobile */ .infografis-container-elementor .card:first-of-type::before { content: "Kepala Desa dan Sekretaris Desa Beji Mulyo"; display: block; text-align: center; font-size: 1.2rem; font-weight: 700; color: var(--dark-blue); margin-bottom: 1rem; } .infografis-container-elementor .card-header { display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid var(--light-blue); padding-bottom: 0.4rem; margin-bottom: 0.4rem; } .infografis-container-elementor .card-header h2 { font-size: 1rem; color: var(--dark-blue); margin: 0; } .infografis-container-elementor .card-header h2::before { content: ''; display: inline-block; width: 7px; height: 7px; background-color: var(--orange); border-radius: 50%; margin-right: 6px; } .infografis-container-elementor .card-header .masa-bakti { background-color: var(--orange); color: var(--white); font-size: 0.75rem; font-weight: 600; padding: 0.2rem 0.5rem; border-radius: 10px; flex-shrink: 0; } .infografis-container-elementor .card-body { display: grid; grid-template-columns: 1fr; gap: 0.4rem; } .infografis-container-elementor .detail-item { display: flex; flex-direction: column; font-size: 0.85rem; } .infografis-container-elementor .detail-item .label { font-weight: 600; color: var(--blue); } .infografis-container-elementor .detail-item .value { color: #555; } @media (min-width: 600px) { .infografis-container-elementor .card:first-of-type::before { display: none; } .infografis-container-elementor .card-list::before { content: "Kepala Desa dan Sekretaris Desa Beji Mulyo"; display: block; text-align: center; font-size: 2.5rem; color: var(--dark-blue); font-weight: 700; margin-bottom: 2rem; } .infografis-container-elementor .card { padding: 1.5rem; } .infografis-container-elementor .card-header h2 { font-size: 1.2rem; } .infografis-container-elementor .card-header .masa-bakti { font-size: 0.9rem; padding: 0.4rem 0.8rem; } .infografis-container-elementor .card-body { grid-template-columns: 1fr 1fr; } }