/* ===============================
   GLOBAL THEME & TYPOGRAPHY
   =============================== */
:root {
  --primary: #0d6efd;
  --primary-dark: #0a58ca;
  --secondary: #198754;
}

/* BODY */
body {
  font-size: 16px;              /* default desktop */
  line-height: 1.5;
  background-color: #f8f9fa;
}

/* JUDUL GLOBAL (RESPONSIVE) */
h1 {
  font-size: clamp(24px, 6vw, 40px);
  font-weight: 700;
}
h2 {
  font-size: clamp(22px, 5vw, 32px);
  font-weight: 600;
}
h3 {
  font-size: clamp(20px, 4.5vw, 28px);
}
h4 {
  font-size: clamp(18px, 4vw, 24px);
  font-weight: 600;
}

/* PARAGRAF */
p, label, td, th {
  font-size: clamp(14px, 3.5vw, 16px);
}

/* FORM CONTROL (HP FRIENDLY) */
input.form-control,
select.form-control,
textarea.form-control {
  min-height: 48px;
  font-size: 16px; /* penting agar tidak zoom di HP */
}

/* BUTTON */
.btn {
  min-height: 48px;
  font-size: 16px;
  font-weight: 500;
}

/* CARD */
.card {
  border-radius: 16px;
}

/* NAVBAR */
.navbar-brand {
  font-size: clamp(16px, 4vw, 20px);
  font-weight: 700;
}
.navbar-nav .nav-link {
  font-size: 15px;
}

/* MOBILE OPTIMIZATION */
@media (max-width: 576px) {
  body {
    font-size: 15px;
  }
  .container {
    padding-left: 14px;
    padding-right: 14px;
  }
}