/* Shared styles for the simple pages (order confirmation, policies). Tokens match index.html. */
:root {
  --paper: #f5f6fa; --surface: #ffffff; --ink: #1d1a2b; --muted: #5d5a70; --line: #dfe0ea;
  --cobalt: #2f48c9; --cobalt-ink: #ffffff; --tag: #ffd23f; --tag-ink: #241d05;
  --display: "Bricolage Grotesque", "Avenir Next", "Segoe UI", system-ui, sans-serif;
  --body: "Instrument Sans", "Helvetica Neue", Arial, system-ui, sans-serif;
  padding-top: env(safe-area-inset-top, 0px); padding-bottom: env(safe-area-inset-bottom, 0px);
}
@media (prefers-color-scheme: dark) {
  :root { color-scheme: dark; --paper: #14131c; --surface: #1e1c29; --ink: #f0eff7; --muted: #a8a6bb; --line: #34314a; --cobalt: #8fa1ff; --cobalt-ink: #0f1230; }
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--paper); color: var(--ink); font: 16px/1.6 var(--body); }
main {
  max-width: 720px; margin: 0 auto; padding-block: 48px 72px;
  padding-left: max(20px, env(safe-area-inset-left, 0px)); padding-right: max(20px, env(safe-area-inset-right, 0px));
}
a { color: var(--cobalt); }
.home { font-family: var(--display); font-weight: 800; font-size: 1.3rem; color: var(--ink); text-decoration: none; }
h1 { font-family: var(--display); font-size: clamp(2rem, 5vw, 2.8rem); line-height: 1.1; margin: 28px 0 12px; text-wrap: balance; }
h2 { font-family: var(--display); font-size: 1.3rem; margin: 32px 0 8px; }
p, li { color: var(--muted); max-width: 65ch; }
.fill { background: var(--tag); color: var(--tag-ink); padding: 0 4px; border-radius: 3px; }
.btn { display: inline-block; margin-top: 20px; background: var(--cobalt); color: var(--cobalt-ink); padding: 12px 20px; border-radius: 999px; text-decoration: none; font-weight: 600; }