/* Pour web pages (BRAND.md): Linen ground, Cellar text, Merlot accent. */
:root {
  --linen: #F7F2EE; --cellar: #1E1418; --stone: #6B5F63; --merlot: #7A1E2C;
  --surface: #FFFFFF; --cork: #E6DDD8; --chablis: #E9C46A;
}
* { box-sizing: border-box; }
html { background: var(--linen); }
body {
  margin: 0; background: var(--linen); color: var(--cellar);
  font-family: 'Instrument Sans', system-ui, -apple-system, sans-serif; font-size: 17px; line-height: 1.5;
}
main { max-width: 640px; margin: 0 auto; padding: 32px 24px 64px; }
.wordmark { width: 120px; height: auto; color: var(--cellar); display: block; }
/* Pour Display: Fraunces Soft (SIL Open Font License, fonts/OFL.txt), as in the app (LOGO-TYPE.md §4). */
@font-face { font-family: 'Pour Display'; src: url('fonts/PourDisplay-Black.ttf') format('truetype'); font-weight: 900; font-display: swap; }
@font-face { font-family: 'Pour Display'; src: url('fonts/PourDisplay-Bold.ttf') format('truetype'); font-weight: 700; font-display: swap; }
h1, h2 { font-family: 'Pour Display', Georgia, serif; line-height: 1.05; }
h1 { font-weight: 900; letter-spacing: -0.01em; }
h2 { font-weight: 700; letter-spacing: 0; }
h1 { font-size: 40px; margin: 40px 0 12px; }
h2 { font-size: 22px; font-weight: 700; letter-spacing: -0.01em; margin: 32px 0 8px; }
p, li { color: var(--cellar); }
.muted { color: var(--stone); font-size: 15px; }
a { color: var(--merlot); }
.card { background: var(--surface); border-radius: 24px; padding: 20px; margin: 20px 0; }
.button {
  display: inline-block; min-height: 56px; padding: 16px 28px; border-radius: 28px; border: 0;
  background: var(--merlot); color: #FFFFFF; font: 600 17px/24px 'Instrument Sans', system-ui, sans-serif;
  text-decoration: none; cursor: pointer;
}
.button.secondary { background: transparent; color: var(--cellar); box-shadow: inset 0 0 0 2px var(--cellar); }
.username { font-family: 'Pour Display', Georgia, serif; font-weight: 900; font-size: 28px; color: var(--merlot); overflow-wrap: anywhere; }
ol { padding-left: 22px; }
footer { margin-top: 48px; }
/* Waitlist form (home page). */
.field-label { display: block; font-weight: 600; margin: 16px 0 6px; }
.field {
  width: 100%; height: 52px; padding: 0 20px; border-radius: 26px; border: 2px solid var(--cork);
  background: var(--linen); color: var(--cellar); font: 400 17px 'Instrument Sans', system-ui, sans-serif;
}
.field:focus { outline: none; border-color: var(--merlot); }
.field[aria-invalid="true"] { border-color: var(--merlot); }
.trap { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.small { font-size: 13px; margin: 6px 0 0 4px; }
.error { color: var(--merlot); font-weight: 600; margin: 8px 0 0 4px; }
.button.wide { width: 100%; margin-top: 16px; }
.button:disabled { opacity: 0.6; cursor: default; }
.done-title { font-family: 'Pour Display', Georgia, serif; font-weight: 900; font-size: 28px; line-height: 1.05; margin: 8px 0; color: var(--merlot); }
.steps li { margin-bottom: 8px; }
.social { margin-bottom: 8px; }
.social a { margin-right: 16px; font-weight: 600; }
#join h2 { margin-top: 0; }
