/**
 * Site-wide horizontal gutters (all pages).
 * Content wraps (header, footer, hv2) use max-width 1520px + this gutter.
 * At 1920px the side inset to the wrap edge is ~200px.
 */
:root {
  --site-gutter-x: clamp(16px, 4vw, 48px);
}

@media (max-width: 1142px) {
  :root {
    --site-gutter-x: max(24px, env(safe-area-inset-left, 0px));
  }
}

@media (min-width: 1600px) {
  /* Home hero — section padding tắt ngang, bù gutter ở màn rất lớn */
  .bn-home__inner {
    padding-left: var(--site-gutter-x);
    padding-right: var(--site-gutter-x);
  }

  /* Banner tiêu đề trang con (breadcrumb trong hero) */
  .sec-pageTitle__breadcrumb {
    padding-left: var(--site-gutter-x);
    padding-right: var(--site-gutter-x);
  }
}
