*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
    margin: 0;
    font-family: var(--font-body);
    font-size: 16px;
    line-height: 24px;
    font-weight: 400;
    color: var(--text-primary);
    /* Nền trang là --brand-2 (#F0E8D7), KHÔNG phải --bg-soft (#E5D9CB).
       Đo trên ảnh bản thiết kế ở những chỗ không có khối nào phủ lên: trang Đặt
       bàn cho #F0E8D7, trang Câu chuyện cho #F0E7D6 — cùng một màu. --bg-soft
       sẫm hơn hẳn nên cả site bị ngả nâu so với thiết kế. */
    background: var(--brand-2);
}

img, svg, video { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; background: none; border: none; cursor: pointer; }
input, select, textarea { font: inherit; color: inherit; }

h1, h2, h3, h4, p, figure, blockquote { margin: 0; }
ul, ol { margin: 0; padding: 0; list-style: none; }

.container {
    width: min(100% - var(--gutter) * 2, var(--container));
    margin-inline: auto;
}

.visually-hidden {
    position: absolute; width: 1px; height: 1px;
    padding: 0; margin: -1px; overflow: hidden;
    clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

/* ---- Kiểu chữ, khớp nguyên văn CSS export từ Figma (layer "Home/desktop",
   2026-08-26) — đây là giá trị máy tính lấy trực tiếp từ style áp dụng thật
   trên trang, đáng tin hơn hẳn so với đọc bằng mắt trên ảnh bảng Foundation
   thu nhỏ (lần đọc trước ở cùng ngày đã sai gần hết dòng, xem lịch sử commit).
   Chỉ t-h3 thực sự cần sửa (line-height 40 → 44); các dòng còn lại quay về
   đúng giá trị ban đầu. ---- */
.t-h1  { font-family: var(--font-display); font-weight: 400; font-size: 72px; line-height: 70px; }
.t-h2  { font-family: var(--font-display); font-weight: 500; font-size: 48px; line-height: 60px; }
.t-h3  { font-family: var(--font-body);    font-weight: 500; font-size: 32px; line-height: 44px; }
.t-h4  { font-family: var(--font-body);    font-weight: 600; font-size: 24px; line-height: 32px; }
.t-sapo{ font-family: var(--font-display); font-weight: 400; font-size: 28px; line-height: 36px; }

.t-subtitle { font-size: 20px; line-height: 28px; font-weight: 400; }
.t-label    { font-size: 16px; line-height: 24px; font-weight: 400; }
.t-body1    { font-size: 20px; line-height: 28px; font-weight: 400; letter-spacing: 1px; }
.t-body2    { font-size: 16px; line-height: 24px; font-weight: 300; }
.t-caption  { font-size: 13px; line-height: 20px; font-weight: 400; }

/* Bộ chữ Mobile — khớp CSS export (Mobile/Heading1, Mobile/Heading2) */
@media (max-width: 767px) {
    .t-h1 { font-size: 28px; line-height: 36px; }
    .t-h2 { font-size: 20px; line-height: 28px; }
    .t-h3 { font-size: 24px; line-height: 32px; }
    .t-h4 { font-weight: 700; font-size: 20px; line-height: 28px; }
}