/* Editorial art direction. Loaded last on every page.
   A warm, quiet ground (no violet, no glow fields, no glass), a serif display face,
   one amber accent, and real photographs carrying the colour. */

/* ---------- Palette: evening (dark) ---------- */
:root,
[data-theme="dark"] {
  --ground: #15110E;
  --grain-opacity: 0.05;
  --spot: rgba(255, 214, 170, 0.06);
  --shadow-card: 0 1px 0 rgba(255, 240, 225, 0.04) inset, 0 20px 48px rgba(0, 0, 0, 0.28);

  --surface-primary: #15110E;
  --surface-primary-subtle: #1D1814;
  --surface-primary-hover: rgba(255, 240, 225, 0.05);
  --surface-primary-selected: rgba(255, 240, 225, 0.09);
  --surface-input: #110E0B;
  --surface-secondary: rgba(255, 240, 225, 0.06);
  --surface-secondary-hover: rgba(255, 240, 225, 0.1);
  --surface-secondary-selected: rgba(255, 240, 225, 0.12);
  --surface-secondary-subtle: rgba(255, 240, 225, 0.08);
  --surface-tertiary: rgba(255, 240, 225, 0.16);
  --surface-tertiary-hover: rgba(255, 240, 225, 0.22);
  --surface-inverted: #F5EDE3;
  --surface-info: #8DB4E8;
  --surface-info-subtle: rgba(141, 180, 232, 0.14);
  --surface-success: #7CC79A;
  --surface-success-subtle: rgba(124, 199, 154, 0.14);
  --surface-warning: #F2A65A;
  --surface-warning-subtle: rgba(242, 166, 90, 0.14);
  --surface-error: #E87A6E;
  --surface-error-subtle: rgba(232, 122, 110, 0.14);

  --border-primary: rgba(255, 240, 225, 0.1);
  --border-secondary: rgba(255, 240, 225, 0.07);
  --border-primary-light: rgba(255, 240, 225, 0.16);
  --border-action-primary: #F2A65A;
  --border-action-secondary: rgba(255, 240, 225, 0.36);
  --border-focus: #F6BE84;
  --border-error: #EE9086;
  --border-action-disabled: rgba(242, 166, 90, 0.35);
  --text-info-inverted-disabled: rgba(163, 195, 238, 0.5);
  --icon-info-disabled: rgba(163, 195, 238, 0.5);

  --action-primary: #F2A65A;
  --action-primary-hover: #F6B776;
  --action-primary-click: #E08F3E;
  --action-primary-disabled: rgba(242, 166, 90, 0.3);
  --action-secondary: rgba(255, 240, 225, 0.07);
  --action-secondary-hover: rgba(255, 240, 225, 0.12);
  --action-secondary-click: rgba(255, 240, 225, 0.18);

  --text-primary: #F5EDE3;
  --text-secondary: #D3C6B8;
  --text-tertiary: #AA9C8E;
  --text-primary-subtle: #918374;
  --text-inverted: #1B140F;
  --text-on-action: #1B120B;
  --text-info: #A3C3EE;
  --text-info-inverted: #C9DCF5;
  --text-success: #8FD3AA;
  --text-success-inverted: #B4E6C7;
  --text-warning: #F2A65A;
  --text-warning-inverted: #F8CC9C;
  --text-error: #EE9086;
  --text-error-inverted: #F6C0B9;
  --text-accent: #F2A65A;

  --icon-default: #F5EDE3;
  --icon-secondary: #D3C6B8;
  --icon-subtle: #AA9C8E;
  --icon-on-action: #1B120B;
  --icon-info: #A3C3EE;
  --icon-success: #8FD3AA;
  --icon-warning: #F2A65A;
  --icon-error: #EE9086;
}

/* ---------- Palette: paper (light) ---------- */
[data-theme="light"] {
  --ground: #F4EDE3;
  --grain-opacity: 0.035;
  --spot: rgba(160, 90, 30, 0.05);
  --shadow-card: 0 1px 0 rgba(255, 255, 255, 0.7) inset, 0 18px 44px rgba(70, 40, 15, 0.08);

  --surface-primary: #F4EDE3;
  --surface-primary-subtle: #FBF7F1;
  --surface-primary-hover: rgba(60, 35, 15, 0.05);
  --surface-primary-selected: rgba(60, 35, 15, 0.08);
  --surface-input: #FFFFFF;
  --surface-secondary: rgba(60, 35, 15, 0.05);
  --surface-secondary-hover: rgba(60, 35, 15, 0.08);
  --surface-secondary-selected: rgba(60, 35, 15, 0.1);
  --surface-secondary-subtle: rgba(60, 35, 15, 0.06);
  --surface-tertiary: rgba(60, 35, 15, 0.14);
  --surface-tertiary-hover: rgba(60, 35, 15, 0.2);
  --surface-inverted: #1E1712;
  --surface-info: #3F6FB5;
  --surface-info-subtle: rgba(63, 111, 181, 0.12);
  --surface-success: #2E8A57;
  --surface-success-subtle: rgba(46, 138, 87, 0.12);
  --surface-warning: #D9822B;
  --surface-warning-subtle: rgba(217, 130, 43, 0.14);
  --surface-error: #C4473A;
  --surface-error-subtle: rgba(196, 71, 58, 0.12);

  --border-primary: rgba(60, 35, 15, 0.12);
  --border-secondary: rgba(60, 35, 15, 0.08);
  --border-primary-light: rgba(60, 35, 15, 0.18);
  --border-action-primary: #B5651D;
  --border-action-secondary: rgba(60, 35, 15, 0.34);
  --border-focus: #9A4A12;
  --border-error: #A83A2E;
  --border-action-disabled: rgba(181, 101, 29, 0.35);
  --text-info-inverted-disabled: rgba(47, 90, 153, 0.5);
  --icon-info-disabled: rgba(47, 90, 153, 0.5);

  --action-primary: #F2A65A;
  --action-primary-hover: #EE9A45;
  --action-primary-click: #E08F3E;
  --action-primary-disabled: rgba(242, 166, 90, 0.4);
  --action-secondary: #FFFFFF;
  --action-secondary-hover: #FBF7F1;
  --action-secondary-click: rgba(60, 35, 15, 0.08);

  --text-primary: #1E1712;
  --text-secondary: #4A3F35;
  --text-tertiary: #685B4F;
  --text-primary-subtle: #7A6C5E;
  --text-inverted: #F4EDE3;
  --text-on-action: #1B120B;
  --text-info: #2F5A99;
  --text-info-inverted: #284D84;
  --text-success: #22704A;
  --text-success-inverted: #1D6141;
  --text-warning: #96500F;
  --text-warning-inverted: #7A410C;
  --text-error: #A83A2E;
  --text-error-inverted: #8F3027;
  --text-accent: #A3541A;

  --icon-default: #1E1712;
  --icon-secondary: #4A3F35;
  --icon-subtle: #685B4F;
  --icon-on-action: #1B120B;
  --icon-info: #2F5A99;
  --icon-success: #2A7D52;
  --icon-warning: #B5651D;
  --icon-error: #B44034;
}

/* ---------- Ground: flat, with a whisper of film grain ---------- */
html { background: var(--ground); transition: background-color 400ms var(--ease); }
body { background: transparent; }
body::after {
  content: ''; position: fixed; inset: 0; z-index: 200; pointer-events: none;
  opacity: var(--grain-opacity);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  mix-blend-mode: overlay;
}

/* ---------- Type: a serif display face over the Geist text face ---------- */
.heading-1, .heading-2, .heading-3 {
  font-family: 'Instrument Serif', 'Iowan Old Style', Georgia, serif;
  font-weight: 400;
  letter-spacing: -0.01em;
}
.heading-1 { font-size: 4.75rem; line-height: 4.5rem; }
.heading-2 { font-size: 3.5rem; line-height: 3.5rem; }
.heading-3 { font-size: 2.5rem; line-height: 2.75rem; }
.heading-1 em, .heading-2 em, .heading-3 em { font-style: italic; color: var(--text-accent); }
@media (max-width: 640px) {
  .heading-1 { font-size: 3rem; line-height: 3rem; }
  .heading-2 { font-size: 2.375rem; line-height: 2.5rem; }
  .heading-3 { font-size: 2rem; line-height: 2.25rem; }
}

/* ---------- Cards: solid, quiet, a faint warm light under the cursor ---------- */
.card {
  position: relative;
  background-color: var(--surface-primary-subtle);
  box-shadow: var(--shadow-card);
}
.wallet.card { position: sticky; }
.card::after {
  content: ''; position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
  background: radial-gradient(320px circle at var(--mx, 50%) var(--my, 50%), var(--spot), transparent 70%);
  opacity: 0; transition: opacity 300ms var(--ease);
}
.card:hover::after { opacity: 1; }

/* ---------- Hero heading: plain ink, the accent lives in the italic ---------- */
.hero-title { background: none; color: var(--text-primary); -webkit-text-fill-color: currentColor; }

/* ---------- Buttons: step on hover, press on click, no glow ---------- */
.btn-primary { transition: background-color 250ms var(--ease), transform 250ms var(--ease); }
.btn-primary:hover:not(:disabled) { transform: translateY(-1px); }
.btn-primary:active:not(:disabled) { transform: translateY(1px); }

.nav { box-shadow: none; }

/* ---------- Final boarding pass: a paper stub with an amber edge ---------- */
.ticket-stub {
  background: #F2A65A;
  border-color: transparent;
  color: #1B120B;
  box-shadow: none;
}
.ticket-stub .text-tertiary, .ticket-stub dt { color: rgba(27, 18, 11, 0.78); }
.ticket-stub .heading-5 i { color: #1B120B; }
.ticket-stub .barcode { fill: #1B120B; opacity: 1; }

.footer-credits { flex-basis: 100%; order: 3; max-width: 72ch; }
.footer-credits a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }