/* Penyesuaian tampilan HP: iPhone (safe-area, 100vh) & Android */
:root{--vh:1vh;--safe-t:env(safe-area-inset-top,0px);--safe-b:env(safe-area-inset-bottom,0px);
      --safe-l:env(safe-area-inset-left,0px);--safe-r:env(safe-area-inset-right,0px)}
*{-webkit-tap-highlight-color:rgba(214,163,73,.25)}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{overflow-x:hidden}
img,video,iframe{max-width:100%;height:auto}

@media (max-width:920px){
  /* iOS: 100vh lebih tinggi dari layar -> pakai dvh bila didukung */
  .hero,.page-hero,.login-modal,.merch-cart-modal{min-height:100vh;min-height:100dvh}
  /* jangan sampai konten tertutup poni / home bar */
  body{padding-left:var(--safe-l);padding-right:var(--safe-r)}
  .site-header,.unified-site-header{padding-top:var(--safe-t)}
  .whatsapp-float,.wa-float,[class*="float"]{bottom:calc(1rem + var(--safe-b))!important}
  /* iOS auto-zoom saat mengetik bila font < 16px */
  input,select,textarea{font-size:16px!important}
  /* tabel & kartu tidak melebar keluar layar */
  table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .container{padding-left:1rem;padding-right:1rem}
}

/* Landscape HP: header jangan makan setengah layar */
@media (max-height:500px) and (orientation:landscape){
  .site-header,.unified-site-header{position:static}
  .hero,.page-hero{min-height:auto;padding-top:1.5rem;padding-bottom:1.5rem}
  .hero h1,.page-hero h1{font-size:clamp(1.4rem,5vw,2rem)}
  main.content-page{padding-top:1rem!important}
}