/* Reset + component dùng chung cho mọi trang. Mobile-first, chỉ dùng token từ tokens.css. */
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font-body);line-height:1.6;overflow-x:hidden;}
h1,h2,h3{font-family:var(--font-display);font-weight:700;line-height:1.08;margin:0;letter-spacing:-0.02em;}
a{color:var(--violet-deep);}
[hidden]{display:none !important;}

/* Layout */
.wrap{max-width:var(--w-max);margin:0 auto;padding:0 var(--sp-5);position:relative;}
.wrap-md{max-width:var(--w-md);}
@media (min-width:900px){ .wrap{padding:0 var(--sp-8);} }

.section-head{max-width:var(--w-text);margin-bottom:var(--sp-12);}
.section-head h2{font-size:var(--fs-h2);}
.section-head p{color:var(--ink-soft);margin-top:var(--sp-4);font-size:var(--fs-base);}
.section-head.text-center{max-width:var(--w-narrow);margin-inline:auto;}

/* Utility */
.text-center{text-align:center;}

/* Chữ */
.accent{color:var(--violet);}
.accent-coral{color:var(--coral);}
.kicker{font-size:var(--fs-xs);font-weight:700;color:var(--violet-deep);text-transform:uppercase;letter-spacing:.04em;}
.eyebrow{display:inline-flex;align-items:center;gap:var(--sp-2);background:var(--surface);border:var(--border);border-radius:var(--r-pill);padding:var(--sp-2) var(--sp-4);font-size:var(--fs-xs);font-weight:600;margin-bottom:var(--sp-6);}
.eyebrow .dot{width:7px;height:7px;border-radius:50%;background:var(--coral);}

/* Nav — dùng chung mọi trang */
.nav{padding:var(--sp-6) 0;}
.nav-inner{display:flex;justify-content:space-between;align-items:center;gap:var(--sp-4);}
.brand{font-family:var(--font-display);font-weight:800;font-size:var(--fs-lg);}
.nav-tag{background:var(--ink);color:var(--on-dark);font-size:var(--fs-xs);padding:var(--sp-2) var(--sp-4);border-radius:var(--r-pill);font-weight:600;}

/* Footer — dùng chung mọi trang */
.footer{padding:var(--sp-8) 0;color:var(--ink-soft);font-size:var(--fs-sm);border-top:var(--border);}
.footer-inner{display:flex;justify-content:space-between;flex-wrap:wrap;gap:var(--sp-3);font-weight:500;}

/* Nút */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--sp-2);border:var(--bw) solid transparent;border-radius:var(--r-pill);padding:var(--sp-3) var(--sp-6);font-family:var(--font-display);font-weight:700;font-size:var(--fs-md);line-height:1.5;cursor:pointer;white-space:nowrap;text-decoration:none;}
.btn:disabled{opacity:0.6;cursor:default;}
.btn-primary{background:var(--ink);color:var(--on-dark);border-color:var(--ink);}
.btn-primary:hover{background:var(--violet);border-color:var(--violet);}
.btn-secondary{background:var(--surface);color:var(--ink-soft);border-color:var(--line);font-family:var(--font-body);font-weight:600;}
.btn-secondary:hover{border-color:var(--ink);color:var(--ink);}
.btn-coral{background:var(--coral);color:var(--on-dark);border-color:var(--coral);}
.btn-coral:hover{background:var(--coral-light);border-color:var(--coral-light);}
.btn-violet{background:var(--violet);color:var(--on-dark);border-color:var(--violet);}
.btn-violet:hover{background:var(--violet-deep);border-color:var(--violet-deep);}
.btn-sm{padding:var(--sp-2) var(--sp-5);font-size:var(--fs-sm);}

/* Ô nhập */
.input{width:100%;border:var(--border);border-radius:var(--r-pill);padding:var(--sp-3) var(--sp-5);font-family:var(--font-body);font-size:var(--fs-md);line-height:1.5;background:var(--surface);color:var(--ink);}
.input:focus{outline:none;border-color:var(--violet);}
.input-block{border-color:var(--line);border-radius:var(--r-sm);margin-bottom:var(--sp-4);}

/* Form danh sách chờ — dùng chung mọi trang */
.waitlist-form{display:flex;gap:var(--sp-3);max-width:var(--w-form);flex-wrap:wrap;}
.waitlist-form .input{flex:1 1 220px;}
.success-msg{display:none;max-width:var(--w-form);}
.form-note{font-size:var(--fs-sm);color:var(--ink-soft);margin-top:var(--sp-4);}

/* Card — đổi màu chữ qua --card-text để biến thể tối không phải ghi đè từng selector */
.card{--card-text:var(--ink);--card-text-soft:var(--ink-soft);background:var(--surface);color:var(--card-text);border:var(--border);border-radius:var(--r-lg);padding:var(--sp-6);}
.card-shadow{box-shadow:var(--shadow-hard);}
.card-dark{--card-text:var(--on-dark);--card-text-soft:var(--on-dark-soft);background:var(--ink);}

/* Chip chọn 1 hoặc nhiều */
.chip{display:inline-flex;align-items:center;border:var(--border-soft);background:var(--surface);border-radius:var(--r-pill);padding:var(--sp-2) var(--sp-4);font-family:var(--font-body);font-size:var(--fs-sm);font-weight:700;line-height:1.5;color:var(--ink-soft);cursor:pointer;}
.chip.selected{border-color:var(--violet);background:var(--violet-bg);color:var(--violet-deep);}
.chip-coral.selected{border-color:var(--coral);background:var(--coral-bg);color:var(--ink);}

/* Thông báo */
.field-error{display:none;width:100%;color:var(--coral);font-size:var(--fs-sm);font-weight:600;margin-top:var(--sp-2);}
.notice{background:var(--surface);border:var(--border);border-radius:var(--r-md);padding:var(--sp-4) var(--sp-5);}
.notice-success{border-color:var(--violet);color:var(--violet-deep);font-weight:600;}
.notice-info{background:var(--violet-bg);}
.notice-warn{background:var(--coral-bg);}