/* =====================================================================
   CV BINTANG ANDAL UTAMA — utilitas responsif, aksesibilitas, motion
   Dipakai di seluruh halaman. Skema biru elegan dipertahankan.
   ===================================================================== */

/* Fokus keyboard yang jelas (aksesibilitas) */
a:focus-visible, button:focus-visible, input:focus-visible,
textarea:focus-visible, select:focus-visible {
  outline: 2px solid #2D6CB0; outline-offset: 2px; border-radius: 4px;
}

/* Floating WhatsApp */
.bau-wa-float {
  position: fixed; right: 22px; bottom: 22px; z-index: 90;
  width: 58px; height: 58px; border-radius: 50%;
  background: #25D366; color: #fff;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 12px 28px rgba(37,211,102,.42);
  transition: transform .15s, box-shadow .15s;
}
.bau-wa-float:hover { transform: translateY(-3px) scale(1.04); box-shadow: 0 16px 34px rgba(37,211,102,.5); }
.bau-wa-float svg { width: 30px; height: 30px; }
.bau-wa-float .bau-wa-pulse {
  position: absolute; inset: 0; border-radius: 50%;
  animation: bauPulse 2.4s ease-out infinite;
}
@keyframes bauPulse { 0%{box-shadow:0 0 0 0 rgba(37,211,102,.45);} 70%{box-shadow:0 0 0 16px rgba(37,211,102,0);} 100%{box-shadow:0 0 0 0 rgba(37,211,102,0);} }

/* Hamburger / mobile nav */
.bau-burger { display: none; background: none; border: none; cursor: pointer; padding: 8px; color: #0F2C4C; }
.bau-mobile { display: none; flex-direction: column; gap: 4px; padding: 8px 40px 18px; background: #fff; border-bottom: 1px solid #DCE6F1; }
.bau-mobile a { padding: 12px 4px; font-size: 15px; font-weight: 500; color: #1B2733; text-decoration: none; border-bottom: 1px solid #EEF2F7; }
.bau-mobile a:hover { color: #2D6CB0; }
.bau-mobile.open { display: flex; }

/* Toast sukses formulir */
.bau-toast {
  position: fixed; left: 50%; bottom: 28px; transform: translateX(-50%) translateY(20px);
  background: #0F2C4C; color: #fff; padding: 14px 22px; border-radius: 999px;
  font-family: 'Poppins', sans-serif; font-size: 14px; font-weight: 500;
  display: flex; align-items: center; gap: 10px; box-shadow: 0 16px 40px rgba(15,44,76,.3);
  opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .25s, transform .25s, visibility 0s linear .25s; z-index: 120;
}
.bau-toast.show { opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0); transition: opacity .25s, transform .25s, visibility 0s linear 0s; }

/* Pesan error inline form */
.bau-err { color: #C0492B; font-size: 12px; margin-top: 5px; display: none; }
.bau-err.show { display: block; }
.bau-invalid { border-color: #C0492B !important; }

/* Filter kategori produk */
.bau-filter { transition: all .15s; }
.bau-filter:hover { border-color: #9DC2EC !important; }
.bau-filter.active { background: #2D6CB0 !important; color: #fff !important; border-color: #2D6CB0 !important; }

/* Form inputs & file upload */
.babu-input { width: 100%; padding: 13px 15px; border-radius: 10px; border: 1px solid #C8D6E6; background: #fff; color: #1B2733; font-family: 'Poppins', sans-serif; font-size: 14px; outline: none; }
.babu-input::placeholder { color: #93A1B0; }
.babu-input:focus { border-color: #2D6CB0; }
.bau-file { display: flex; align-items: center; gap: 12px; border: 1.5px dashed #C8D6E6; border-radius: 12px; padding: 16px; cursor: pointer; background: #fff; transition: border-color .15s; }
.bau-file:hover { border-color: #9DC2EC; }

/* ============================ RESPONSIF ============================
   Menargetkan grid berbasis inline-style agar tiap halaman menumpuk rapi
   di layar kecil tanpa perlu menambah class satu per satu. */
@media (max-width: 1024px) {
  [style*="repeat(5"] { grid-template-columns: repeat(3,1fr) !important; }
  .bau-navlinks { gap: 14px !important; font-size: 13px !important; }
}
@media (max-width: 920px) {
  .bau-navlinks, .bau-navcta { display: none !important; }
  .bau-burger { display: inline-flex !important; }
}
@media (max-width: 820px) {
  [style*="repeat(3"] { grid-template-columns: repeat(2,1fr) !important; }
}
@media (max-width: 760px) {
  [style*="repeat(5"],
  [style*="repeat(4"],
  [style*="repeat(3"],
  [style*="repeat(2"],
  [style*="1.05fr"],
  [style*="1.1fr"],
  [style*="1.15fr"],
  [style*=".85fr"],
  [style*="1fr 1fr"] { grid-template-columns: 1fr !important; }
  .bau-footer-grid { grid-template-columns: 1fr 1fr !important; gap: 28px !important; }
  h1 { font-size: 34px !important; }
}
@media (max-width: 520px) {
  .bau-footer-grid { grid-template-columns: 1fr !important; }
  h1 { font-size: 30px !important; }
}