/* Reset, typography, container, button dùng chung cho mọi trang MiTC. */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; overflow-x: clip; -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  color: var(--ink);
  font-family: var(--font-sans);
  line-height: 1.6;
  background: var(--paper);
  -webkit-font-smoothing: antialiased;
}
img, svg { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
h1, h2, h3, p, ul { margin: 0; }
ul { padding: 0; list-style: none; }
:focus-visible { outline: 3px solid var(--mitc-yellow); outline-offset: 3px; border-radius: 6px; }

.container { width: min(var(--max), calc(100% - 40px)); margin-inline: auto; }

.btn {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 13px 24px; border-radius: 999px; border: 1px solid transparent;
  font: inherit; font-weight: 700; font-size: 15px; cursor: pointer;
  transition: transform .2s, background .2s, border-color .2s, color .2s;
}
.btn:hover { transform: translateY(-2px); }
.btn-primary { background: linear-gradient(135deg, var(--mitc-red-dark), var(--mitc-red) 60%, var(--mitc-red-soft)); color: #fff; box-shadow: 0 14px 34px rgba(180, 18, 36, .25); }
.btn-ghost { background: rgba(255, 255, 255, .7); border-color: var(--mitc-red); color: var(--mitc-red-dark); }
.btn-ghost:hover { background: #fff; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}