/* LotNumber - parent-brand holding page (ADR-69)
   Shares the HipNumber Brand System v1.1 tokens (see .claude/skills/branding):
   LotNumber is a product of HipNumber, LLC and keeps the same design language.
   What differs is the mark: a plain navy LOTNUMBER wordmark, no orange hip
   tag (the tag is HipNumber's signature). Orange stays an accent and is never
   body text on light surfaces (2.80:1 on white fails AA); accent text is navy
   in light mode and orange only on dark surfaces (6.4:1 there). */

:root {
  color-scheme: light dark;

  --hn-orange: #F97316;
  --hn-navy: #0F2347;
  --hn-off-white: #F7F5F2;
  --hn-cool-gray: #D9DEE7;
  --hn-charcoal: #1F2937;

  --hn-bg: #FFFFFF;
  --hn-bg-subtle: #F7F5F2;
  --hn-text: #1F2937;
  --hn-heading: #0F2347;
  --hn-border: #D9DEE7;
  --hn-muted: #5B6675;
  --hn-accent-text: #0F2347;

  --sans: 'Inter', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
}

@media (prefers-color-scheme: dark) {
  :root {
    --hn-bg: #0F1724;
    --hn-bg-subtle: #152033;
    --hn-text: #E8EDF5;
    --hn-heading: #FFFFFF;
    --hn-border: #2A374A;
    --hn-muted: #A8B4C6;
    --hn-accent-text: #F97316;
  }
}

* { margin: 0; padding: 0; box-sizing: border-box; }

html { min-height: 100%; }

body {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  background: var(--hn-bg);
  color: var(--hn-text);
  font-family: var(--sans);
  font-size: 17px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}

a { color: var(--hn-accent-text); text-underline-offset: 3px; }
a:hover { opacity: .85; }
:focus-visible { outline: 2px solid var(--hn-accent-text); outline-offset: 3px; border-radius: 3px; }

.wrap { width: 100%; max-width: 760px; margin: 0 auto; padding: 0 20px; }

/* header */
header {
  border-bottom: 1px solid var(--hn-border);
  background: var(--hn-bg);
}
.nav { display: flex; align-items: center; height: 62px; }
.brand {
  color: var(--hn-heading);
  text-decoration: none;
  font-weight: 700;
  font-size: 20px;
  letter-spacing: 0.14em;
}

/* main */
main { flex: 1; padding: 56px 20px 64px; }
.eyebrow {
  color: var(--hn-accent-text);
  font-weight: 600;
  font-size: 13px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-bottom: 14px;
}
h1 {
  color: var(--hn-heading);
  font-weight: 700;
  font-size: 40px;
  line-height: 1.05;
  letter-spacing: -0.02em;
  margin-bottom: 22px;
  overflow-wrap: anywhere;
}
.lead { font-size: 19px; margin-bottom: 18px; max-width: 60ch; }
.note {
  margin-top: 28px;
  padding: 14px 16px;
  border: 1px solid var(--hn-border);
  border-radius: 10px;
  background: var(--hn-bg-subtle);
  color: var(--hn-muted);
  font-size: 15px;
}

/* footer */
footer {
  border-top: 1px solid var(--hn-border);
  padding: 24px 0 32px;
  color: var(--hn-muted);
  font-size: 14px;
}
.footer-links { display: flex; flex-wrap: wrap; gap: 8px 20px; margin-bottom: 10px; }

@media (max-width: 480px) {
  main { padding: 40px 20px 48px; }
  h1 { font-size: 32px; }
  .lead { font-size: 17px; }
}
