/* Palette and type borrowed from Skyline by Swiss (swiss-skyline.ro) */
:root {
  --black: #070707;
  --night: #0d0a12;
  --night-deep: #070509;
  --plate: #171020;
  --plate-hi: #2e2140;
  --grape: #6f4b93;
  --cream: #f4efe9;
  --peach: #ffebb0;
  --pastel: #ffdfc4;
  --gold: #e0b15a;
  --sunset: #e8825a;
  --sky-top: #aab7ee;
  --sky-mid: #f3c6d8;
  --sky-hor: #ffe0c8;

  --ink: var(--cream);
  --muted: color-mix(in srgb, var(--cream) 62%, var(--night));
  --faint: color-mix(in srgb, var(--cream) 38%, var(--night));
  --line: var(--plate-hi);

  --font-display: "Archivo", "Arial Black", sans-serif;
  --font-ui: "Space Grotesk", Verdana, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, monospace;
  --radius: 14px;
  --ease: cubic-bezier(.16, 1, .3, 1);
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scrollbar-color: var(--plate-hi) var(--night-deep); }
body {
  margin: 0; background: var(--night); color: var(--ink);
  font-family: var(--font-ui); line-height: 1.55; -webkit-font-smoothing: antialiased;
}
::selection { background: var(--gold); color: var(--night-deep); }
.display { font-family: var(--font-display); font-weight: 900; font-stretch: 125%; letter-spacing: -.02em; }
.kicker {
  font-family: var(--font-mono); text-transform: uppercase; letter-spacing: .14em;
  font-size: .72rem; color: var(--gold); font-weight: 600;
}
button { font: inherit; font-weight: 600; cursor: pointer; border: none; border-radius: 999px; padding: 14px 30px; font-size: .98rem; transition: background-color .25s, color .25s, border-color .25s; }
.btn-primary { background: var(--peach); color: var(--black); }
.btn-primary:hover { background: var(--gold); }
.btn-ghost { background: transparent; color: var(--ink); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--cream) 35%, transparent); }
.btn-ghost:hover { box-shadow: inset 0 0 0 1px var(--cream); }
button:disabled { opacity: .5; cursor: not-allowed; }
button:focus-visible, a:focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; }