:root {
  --color-primary: #d7a625;
  --color-text: #212121;
  --color-text-mid: #555555;
  --color-white: #ffffff;
  --color-black: #103454;
  --color-bg-alt: #f0f0f0;

  /* Header/footer dùng chung (assets/css/layout.css) — PHẢI khớp tuyệt đối với
     tokens.css vì header/footer.html giờ là 1 file duy nhất dùng cho cả 2 site. */
  --header-accent: #d7a625;        /* = --color-primary */
  --header-dark: #103454;          /* = --color-black */
  --header-font: Roboto, Arial, sans-serif; /* = --font-base */
  --header-hover-bg: #f0f0f0;      /* = --color-bg-alt */

  --font-base: Roboto, Arial, sans-serif;

  --container-max: 1220px;
  --container-pad: 20px;
  --header-height: 100px;

  --transition-base: 0.2s ease;
  --transition-slow: 0.6s ease;
}
@media (min-width: 1600px) {
    :root {
        --container-max: 1340px;
        --container-pad: 0px;
        --fs-h2: 63px;
        --lh-h2: 85px;
        --lh-h3: 58px;
    }
}

* {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  padding: 0;
}

body {
  font-family: var(--font-base);
  font-size: 16px;
  line-height: 28px;
  color: var(--color-text);
  -webkit-font-smoothing: antialiased;
}

img {
  max-width: 100%;
  display: block;
}

a {
  text-decoration: none;
  color: inherit;
}

ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

h1,
h2,
h3,
h4,
p {
  margin: 0;
}

.container {
  max-width: var(--container-max);
  margin: 0 auto;
  padding: 0 var(--container-pad);
}