/* Campus Cuts design tokens: "purple after dark". Shared by the public site, the booking page and the staff side.
   Palette from the storefront: charcoal walls, the purple door trim, the red neon OPEN sign. */
@import url("https://fonts.googleapis.com/css2?family=Big+Shoulders+Display:wght@600;700;800;900&family=Hanken+Grotesk:wght@400;500;600;700&family=JetBrains+Mono:wght@500;700&display=swap");

:root {
  --ink: #0B0A0F;          /* page */
  --ink-2: #13111A;        /* raised panels */
  --ink-3: #1C1926;        /* cards, inputs */
  --ink-4: #272336;        /* hover, borders on dark */
  --line: rgba(244, 241, 234, 0.09);
  --line-2: rgba(244, 241, 234, 0.16);
  --paper: #F4F1EA;        /* main text, light surfaces */
  --muted: #A6A1B6;        /* secondary text on dark */
  --faint: #6E6981;

  --plum: #6B3FA8;         /* the door trim */
  --violet: #A57CFF;       /* highlights, focus, links */
  --violet-soft: rgba(165, 124, 255, 0.14);
  --neon: #FF3B4E;         /* the OPEN sign */
  --neon-glow: 0 0 6px rgba(255, 59, 78, .9), 0 0 22px rgba(255, 59, 78, .55), 0 0 60px rgba(255, 59, 78, .35);
  --brass: #E3B866;        /* prices, small accents only */
  --ok: #5BD69A;
  --warn: #F2B544;

  --f-display: "Big Shoulders Display", "Arial Narrow", sans-serif;
  --f-body: "Hanken Grotesk", system-ui, -apple-system, "Segoe UI", sans-serif;
  --f-mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;

  --r-s: 6px;
  --r-m: 12px;
  --r-l: 20px;
  --gutter: clamp(16px, 4vw, 48px);
  --max: 1280px;
  --ease-out: cubic-bezier(.16, 1, .3, 1);
  --ease-io: cubic-bezier(.65, 0, .35, 1);

  color-scheme: dark;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--ink);
  color: var(--paper);
  font-family: var(--f-body);
  font-size: 17px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}
img { max-width: 100%; display: block; }
a { color: inherit; }
button, input, select, textarea { font: inherit; color: inherit; }
:focus-visible { outline: 2px solid var(--violet); outline-offset: 3px; }
::selection { background: var(--plum); color: var(--paper); }

.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}
