/* /start/ and /thankyou/ keep our markup but wear the landing page's skin,
   so the moment of payment does not look like a different company.
   Values lifted from app/src/index.css — navy, bronze, Marcellus, square. */
:root{
  --ink:            oklch(0.195 0.032 244);
  --ink-2:          oklch(0.256 0.045 243);
  --surface:        oklch(0.256 0.045 243);
  --concrete-deep:  oklch(0.256 0.045 243);

  --gold:           oklch(0.667 0.083 75);
  --gold-2:         oklch(0.907 0.063 85);
  --brass:          oklch(0.907 0.063 85);

  --paper:          oklch(0.955 0.003 85);
  --cream-2:        oklch(0.82 0.018 240);
  --muted:          oklch(0.65 0.025 240);

  --hair:           oklch(0.95 0.01 240 / 26%);
  --hair-soft:      oklch(0.95 0.01 240 / 15%);

  --radius:         0px;
  --pill:           0px;

  --font-display:   "Marcellus", Georgia, serif;
  --font-ui:        "Noto Sans Display", -apple-system, BlinkMacSystemFont, sans-serif;
  --font-mono:      "Noto Sans Display", ui-monospace, Menlo, monospace;
}

/* Kimi's buttons are square and solid, not outlined pills */
.btn{ border-radius:0; letter-spacing:.06em; text-transform:uppercase; font-size:12.5px; padding:16px 26px; }
.btn--solid{ background:var(--gold); border-color:var(--gold); color:oklch(0.195 0.032 244); }
.btn--solid:hover{ background:var(--gold-2); border-color:var(--gold-2); }
#go{ background:var(--gold); border-color:var(--gold); color:oklch(0.195 0.032 244); font-weight:500; }
#go:hover{ background:var(--gold-2); border-color:var(--gold-2); }

.field input,.field select,.field textarea{ border-radius:0; }
.contactcard,.flagbox,.pay{ border-radius:0; }
.mark__name{ font-family:var(--font-display); letter-spacing:.1em; }
.mark__sub,.meta,.form__note,.crumb{ font-family:var(--font-ui); }
.display{ letter-spacing:0; }