*,
*::before,
*::after {
    box-sizing: border-box;
}

body,
p, blockquote, pre,
dl, dd, ol, ul, menu,
figure,
table,
fieldset {
    margin: 0;
    padding: 0;
}

body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    line-height: 1.5; /* Line height default yang baik untuk keterbacaan */
}

html {
    /* Pastikan tinggi halaman minimal sama dengan viewport */
    min-height: 100%; 
    /* Memaksa scrollbar vertikal selalu ada, mencegah pergeseran horizontal. */
    overflow-y: scroll;
}

/* 5. IMAGE OPTIMIZATION (Mencegah Layout Shift Akibat Gambar) */
img, video, canvas, svg {
    display: block;
    max-width: 100%;
    /* Ini membantu agar gambar yang tidak memiliki dimensi tidak menyebabkan CLS besar. */
}


/* Global heading styles */
h1 { font-size: 2.3em !important; font-weight: bold !important; line-height: 1.2em !important; }
h2 { font-size: 1.8em !important; font-weight: bold !important; line-height: 1.1em !important; }
h3 { font-size: 1.3em !important; font-weight: bold !important; line-height: 1em !important; }
h4 { font-size: 1.1em !important; font-weight: bold !important; }
h5 { font-size: 1em !important; }
h6 { font-size: 0.8em !important; }

/* Global link styles */
a {
    color: #007bff !important; /* Bootstrap primary blue */
    font-weight: bold !important;
    font-size: 1em !important; /* Larger font size */
    text-decoration: none; /* Optional: remove underline */
}

a:hover {
    text-decoration: underline; /* Optional: add underline on hover */
}

/* Ensure links inside buttons inherit button contrast */
button a,
button a:hover,
button a:focus {
    color: #ffffff !important;
    text-decoration: none;
}

/* Responsive styles for mobile devices */
@media (max-width: 768px) {
  h1 { font-size: 1.8em !important; font-weight: bold !important; line-height: 1.2em !important; }
  h2 { font-size: 1.4em !important; font-weight: bold !important; line-height: 1.1em !important; }
  h3 { font-size: 1.3em !important; font-weight: bold !important; line-height: 1em !important; }
  h4 { font-size: 1.2em !important; font-weight: bold !important; }
  h5 { font-size: 1.1em !important; }
  h6 { font-size: 1em !important; }
}
