/* RIGCNTRL waitlist — PRECISION-family web surface (design/tokens.json → web).
   Near-black stage, true neutrals, exactly one dominant amber (#FF9F0A).
   Self-hosted fonts only; no gradients, glow, glass, blur or stock media. */

@font-face {
  font-family: "Space Grotesk";
  src: url("assets/fonts/SpaceGrotesk-Variable.ttf") format("truetype-variations");
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
}

@font-face {
  font-family: "JetBrains Mono";
  src: url("assets/fonts/JetBrainsMono-Variable.ttf") format("truetype-variations");
  font-style: normal;
  font-weight: 100 800;
  font-display: swap;
}

:root {
  --rc-stage: #0A0A0A;
  --rc-sunken: #070707;
  --rc-raised: #111111;
  --rc-text: #E6E6E6;
  --rc-secondary: #8A8A8A;
  --rc-hint: #5A5A5A;
  --rc-line: #262626;
  --rc-line-strong: #333333;
  --rc-amber: #FF9F0A;
  --rc-on-amber: #0A0A0A;
  --rc-ease: cubic-bezier(.165, .84, .44, 1); /* ease-out-quart */
  --hairline: 1px solid var(--rc-line);
}

* {
  box-sizing: border-box;
}

html {
  background: var(--rc-stage);
  color: var(--rc-text);
  color-scheme: dark;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

body {
  margin: 0;
  min-width: 320px;
  min-height: 100svh;
  display: flex;
  flex-direction: column;
  overflow-x: clip;
  background: var(--rc-stage);
  color: var(--rc-text);
  font-family: "Space Grotesk", Roboto, "Helvetica Neue", system-ui, sans-serif;
  font-size: 16px;
  line-height: 1.55;
}

a,
button,
input {
  -webkit-tap-highlight-color: transparent;
}

button,
input {
  font: inherit;
}

::selection {
  background: var(--rc-amber);
  color: var(--rc-on-amber);
}

:focus-visible {
  outline: 2px solid var(--rc-amber);
  outline-offset: 3px;
}

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

/* Hairline geometry frame — instrument keyline, no texture. */
.frame {
  position: fixed;
  inset: 12px;
  border: var(--hairline);
  pointer-events: none;
}

/* --- Top status: quiet mono keyline --- */

.top {
  padding: clamp(26px, 4vw, 40px) clamp(28px, 4vw, 44px) 0;
}

.top__status {
  margin: 0;
  font-family: "JetBrains Mono", ui-monospace, monospace;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .22em;
  color: var(--rc-secondary);
}

/* --- Center composition --- */

.core {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: clamp(32px, 6vh, 64px) 24px;
  text-align: center;
}

.core__logo {
  width: min(360px, 72vw);
  height: auto;
}

.core__subline {
  margin: clamp(20px, 4vh, 32px) 0 clamp(36px, 6vh, 56px);
  font-family: "JetBrains Mono", ui-monospace, monospace;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .22em;
  color: var(--rc-secondary);
}

/* --- Waitlist form --- */

.wl-form {
  width: min(440px, 100%);
}

.wl-form__row {
  display: flex;
  align-items: stretch;
  gap: 14px;
}

.wl-form__input {
  flex: 1 1 auto;
  min-width: 0;
  height: 54px;
  padding: 0 4px;
  background: transparent;
  border: 0;
  border-bottom: var(--hairline);
  border-radius: 0;
  color: var(--rc-text);
  font-family: "Space Grotesk", Roboto, "Helvetica Neue", system-ui, sans-serif;
  font-size: 16px;
  caret-color: var(--rc-amber);
  transition: border-color 140ms var(--rc-ease);
}

.wl-form__input::placeholder {
  color: var(--rc-secondary);
  opacity: 1;
}

.wl-form__input:focus {
  border-bottom-color: var(--rc-line-strong);
}

/* The one dominant amber per viewport: the primary CTA, identical to the
   app's active state (amber fill, near-black text). */
.wl-form__button {
  flex: 0 0 auto;
  min-height: 54px;
  padding: 0 24px;
  background: var(--rc-amber);
  border: 0;
  border-radius: 4px;
  color: var(--rc-on-amber);
  font-family: "Space Grotesk", Roboto, "Helvetica Neue", system-ui, sans-serif;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  cursor: pointer;
  transition: opacity 140ms var(--rc-ease);
}

.wl-form__button:hover:not(:disabled) {
  opacity: .88;
}

.wl-form__button:disabled {
  cursor: default;
  opacity: .72;
}

/* Honeypot: present in DOM for bots, invisible and unreachable for humans. */
.wl-form__hp {
  position: absolute;
  left: -10000px;
  top: auto;
  width: 1px;
  height: 1px;
  margin: 0;
  overflow: hidden;
}

.wl-form__status {
  min-height: 1.5em;
  margin: 16px 0 0;
  font-size: 14px;
  color: var(--rc-text);
}

.wl-form__status.is-error {
  color: var(--rc-secondary);
}

.wl-form__consent {
  margin: 6px 0 0;
  font-size: 12.5px;
  color: var(--rc-secondary);
}

.wl-form__consent a {
  color: inherit;
  text-decoration-color: var(--rc-line-strong);
  text-underline-offset: 3px;
  transition: color 140ms var(--rc-ease), text-decoration-color 140ms var(--rc-ease);
}

.wl-form__consent a:hover {
  color: var(--rc-text);
  text-decoration-color: var(--rc-text);
}

/* --- Footer --- */

.base {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  border-top: var(--hairline);
  margin: 0 clamp(28px, 4vw, 44px);
  padding: 0 0 clamp(8px, 1.5vh, 14px);
}

.base__links {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 8px 22px;
}

.base__link {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  font-family: "JetBrains Mono", ui-monospace, monospace;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .18em;
  text-transform: uppercase;
  text-decoration: none;
  color: var(--rc-secondary);
  transition: color 140ms var(--rc-ease);
}

.base__link:hover {
  color: var(--rc-text);
}

/* --- Narrow viewports: stack form row, keep >=44px targets --- */

@media (max-width: 480px) {
  .wl-form__row {
    flex-direction: column;
    gap: 18px;
  }

  .wl-form__button {
    width: 100%;
  }
}

/* --- Finite intro: single staggered rise, then fully static --- */

@keyframes wl-rise {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

.wl-anim {
  animation: wl-rise 300ms var(--rc-ease) both;
}

.wl-delay-0 { animation-delay: 0ms; }
.wl-delay-1 { animation-delay: 80ms; }
.wl-delay-2 { animation-delay: 150ms; }
.wl-delay-3 { animation-delay: 220ms; }
.wl-delay-4 { animation-delay: 290ms; }

@media (prefers-reduced-motion: reduce) {
  .wl-anim {
    animation: none;
  }

  .wl-form__input,
  .wl-form__button,
  .base__link,
  .wl-form__consent a {
    transition: none;
  }
}