/* ============================================================
   tokens.css — Design tokens (CSS custom properties) + base reset
   Nguồn: :root trong index.html mockup. Nạp toàn site.
   ============================================================ */
:root{
  --bg:#FAF6EF;
  --bg-2:#F2EADD;
  --surface:#FFFFFF;
  --ink:#1C1814;
  --ink-2:#5C544C;
  --ink-3:#8A8178;
  --line:#EBE2D4;
  --line-2:#E0D5C4;
  /* Bộ màu thương hiệu (logo ALV): emerald + kem + vàng kim. */
  --brand:#0F501A;        /* emerald — màu chính */
  --brand-2:#1E7A2E;      /* emerald sáng — đối tác gradient */
  --brand-deep:#0A3A13;   /* emerald đậm */
  --brand-soft:#E6F0E6;   /* nền tint emerald nhạt */
  --emerald:#0F501A;
  --cream:#F7E1A8;
  --cream-soft:#FCF3DC;
  --gold:#D4AF37;
  --gold-dark:#8E6537;
  --green:#178A5A;        /* xanh "miễn phí/thành công" — giữ riêng để phân biệt */
  --green-soft:#E2F5EC;
  --dark:#171310;
  --radius:20px;
  --radius-sm:14px;
  --shadow-sm:0 1px 2px rgba(28,24,20,.06), 0 1px 1px rgba(28,24,20,.04);
  --shadow:0 22px 46px -26px rgba(28,24,20,.30);
  --shadow-lg:0 38px 70px -30px rgba(28,24,20,.42);
  --font-display:'Bricolage Grotesque','Be Vietnam Pro',system-ui,sans-serif;
  --font-body:'Be Vietnam Pro',system-ui,-apple-system,sans-serif;
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:var(--font-body);
  background:var(--bg);
  color:var(--ink);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
/* grain texture */
body::before{
  content:"";position:fixed;inset:0;z-index:9999;pointer-events:none;opacity:.04;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer;border:none;background:none}
img,svg{display:block}
.wrap{max-width:1240px;margin:0 auto;padding:0 28px}

/* Accessibility helper */
.screen-reader-text{
  border:0;clip:rect(1px,1px,1px,1px);clip-path:inset(50%);height:1px;width:1px;
  margin:-1px;overflow:hidden;padding:0;position:absolute;word-wrap:normal!important;
}