/* Reset nhe, kieu chu nen va tien ich dung chung. */
*, *::before, *::after { box-sizing: border-box; }
html { font-size: 100%; -webkit-text-size-adjust: 100%; }
html[data-font-scale="1"] { font-size: 112.5%; }
html[data-font-scale="2"] { font-size: 125%; }
body {
  margin: 0;
  font-family: var(--font);
  font-size: var(--fs-body);
  line-height: 1.6;
  color: var(--c-text);
  background: var(--c-bg);
  /* Chan trang dinh day: trang ngan hon man hinh thi phan noi dung gian ra, khong de lo nen trang duoi chan trang. */
  min-height: 100vh;
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
}
body > main#noi-dung { flex: 1 0 auto; }
img, svg { max-width: 100%; }
button, input, select, textarea { font: inherit; }
a { color: var(--c-brand); }
a:hover { color: var(--c-brand-600); }
h1, h2, h3, p { margin: 0; }
:focus-visible { outline: 2px solid var(--c-accent); outline-offset: 2px; }

.container { max-width: var(--container); margin: 0 auto; padding: 0 var(--gutter); }
.section { padding: var(--section-y) 0; }
.section--soft { background: var(--c-bg-soft); }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); margin: 0; }

/* Nhan nho co o vuong do phia truoc */
.eyebrow {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: var(--fs-eyebrow); font-weight: 700; letter-spacing: .12em; text-transform: uppercase;
  color: var(--c-brand-600);
}
.eyebrow::before { content: ""; width: 8px; height: 8px; background: var(--c-accent); }
.eyebrow--on-brand { color: var(--c-on-brand-accent); }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; animation: none !important; }
}