:root{
  --nug-bg:#FAF6EE; --nug-surface:#FFFFFF; --nug-ink:#20242E; --nug-ink-muted:#5C6470; --nug-line:#ECE6DA;
  --nug-primary:#3A56D4; --nug-primary-ink:#FFFFFF; --nug-gold:#E5A92C; --nug-gold-deep:#B9821F;
  --nug-success:#2E9E6B; --nug-review:#E08A2B; --nug-locked:#CBD0D9;
  --nug-radius-sm:8px; --nug-radius-md:14px; --nug-radius-lg:22px;
  --nug-space-1:4px; --nug-space-2:8px; --nug-space-3:12px; --nug-space-4:16px; --nug-space-5:24px; --nug-space-6:32px;
  --nug-font:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --nug-shadow-sm:0 1px 2px rgba(32,36,46,.08); --nug-shadow-md:0 8px 24px rgba(32,36,46,.10);
  --nug-maxw:1080px;
}

/* ── Smooth scroll ── */
html {
  scroll-behavior: smooth;
}

/* ── Base reset ── */
*, *::before, *::after {
  box-sizing: border-box;
}

body {
  margin: 0;
  font-family: var(--nug-font);
  background: var(--nug-bg);
  color: var(--nug-ink);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

/* ── Honeypot hider ── */
.nug-offscreen {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

/* ── Header ── */
.nug-header {
  position: sticky;
  top: 0;
  background: color-mix(in srgb, var(--nug-surface) 95%, transparent);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--nug-line);
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: var(--nug-space-4) var(--nug-space-5);
  z-index: 100;
}

/* ── Wordmark ── */
.nug-wordmark {
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--nug-ink);
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: var(--nug-space-2);
}

/* ── Nav link ── */
.nug-nav-link {
  color: var(--nug-primary);
  font-size: .875rem;
  text-decoration: none;
}

.nug-nav-link:hover {
  text-decoration: underline;
}

/* ── Hero ── */
.nug-hero {
  padding: var(--nug-space-6) var(--nug-space-5);
  text-align: center;
  max-width: var(--nug-maxw);
  margin: 0 auto;
  border-top: 3px solid var(--nug-gold);
}

/* ── Hero headline ── */
.nug-hero-headline {
  font-size: clamp(1.75rem, 5vw, 3rem);
  font-weight: 800;
  line-height: 1.2;
  color: var(--nug-ink);
  margin-bottom: var(--nug-space-4);
}

/* ── Hero subheading ── */
.nug-hero-sub {
  font-size: clamp(1rem, 2.5vw, 1.25rem);
  color: var(--nug-ink-muted);
  max-width: 600px;
  margin: 0 auto var(--nug-space-5);
}

/* ── CTA group ── */
.nug-cta-group {
  display: flex;
  flex-wrap: wrap;
  gap: var(--nug-space-3);
  justify-content: center;
}

/* ── Primary button ── */
.nug-btn-primary {
  background: var(--nug-primary);
  color: var(--nug-primary-ink);
  padding: var(--nug-space-3) var(--nug-space-6);
  border-radius: var(--nug-radius-md);
  font-size: 1rem;
  font-weight: 600;
  border: none;
  cursor: pointer;
  text-decoration: none;
  display: inline-block;
  box-shadow: var(--nug-shadow-md);
  transition: all .18s ease;
}

.nug-btn-primary:hover {
  filter: brightness(1.08);
  transform: translateY(-1px);
}

/* ── Ghost button ── */
.nug-btn-ghost {
  background: transparent;
  color: var(--nug-primary);
  padding: var(--nug-space-3) var(--nug-space-5);
  border-radius: var(--nug-radius-md);
  font-size: 1rem;
  font-weight: 500;
  border: 1.5px solid var(--nug-primary);
  text-decoration: none;
  display: inline-block;
  transition: all .18s ease;
}

.nug-btn-ghost:hover {
  background: var(--nug-primary);
  color: var(--nug-primary-ink);
}

/* ── Section ── */
.nug-section {
  padding: var(--nug-space-6) var(--nug-space-5);
  max-width: var(--nug-maxw);
  margin: 0 auto;
}

/* ── Section title ── */
.nug-section-title {
  font-size: clamp(1.25rem, 3vw, 1.75rem);
  font-weight: 700;
  text-align: center;
  margin-bottom: var(--nug-space-5);
  color: var(--nug-ink);
}

/* ── Cards grid ── */
.nug-cards {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--nug-space-4);
}

@media (min-width: 640px) {
  .nug-cards {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* ── Card ── */
.nug-card {
  background: var(--nug-surface);
  border-radius: var(--nug-radius-lg);
  padding: var(--nug-space-5);
  box-shadow: var(--nug-shadow-sm);
  border: 1px solid var(--nug-line);
}

/* ── Card icon ── */
.nug-card-icon {
  font-size: 2rem;
  margin-bottom: var(--nug-space-3);
  display: block;
}

/* ── Card title ── */
.nug-card-title {
  font-size: 1.1rem;
  font-weight: 700;
  margin-bottom: var(--nug-space-2);
  color: var(--nug-ink);
}

/* ── Card body ── */
.nug-card-body {
  color: var(--nug-ink-muted);
  font-size: .9375rem;
  line-height: 1.6;
}

/* ── Steps ── */
.nug-steps {
  display: flex;
  flex-direction: column;
  gap: var(--nug-space-4);
}

@media (min-width: 640px) {
  .nug-steps {
    flex-direction: row;
    align-items: flex-start;
  }
}

/* ── Step ── */
.nug-step {
  flex: 1;
  text-align: center;
}

/* ── Step number ── */
.nug-step-num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 50%;
  background: var(--nug-primary);
  color: var(--nug-primary-ink);
  font-weight: 700;
  font-size: 1rem;
  margin-bottom: var(--nug-space-3);
}

/* ── Step title ── */
.nug-step-title {
  font-weight: 600;
  color: var(--nug-ink);
  margin-bottom: var(--nug-space-1);
}

/* ── Step body ── */
.nug-step-body {
  color: var(--nug-ink-muted);
  font-size: .9375rem;
}

/* ── Waitlist section ── */
.nug-waitlist-section {
  background: var(--nug-surface);
  border-radius: var(--nug-radius-lg);
  padding: var(--nug-space-6);
  max-width: 560px;
  margin: 0 auto var(--nug-space-6);
  box-shadow: var(--nug-shadow-md);
  border: 1px solid var(--nug-line);
}

/* ── Waitlist title ── */
.nug-waitlist-title {
  font-size: 1.5rem;
  font-weight: 700;
  text-align: center;
  margin-bottom: var(--nug-space-5);
}

/* ── Form group ── */
.nug-form-group {
  margin-bottom: var(--nug-space-4);
}

/* ── Label ── */
.nug-label {
  display: block;
  font-weight: 500;
  margin-bottom: var(--nug-space-2);
  font-size: .9375rem;
}

/* ── Input / Textarea ── */
.nug-input,
.nug-textarea {
  width: 100%;
  padding: var(--nug-space-3) var(--nug-space-4);
  border: 1.5px solid var(--nug-line);
  border-radius: var(--nug-radius-md);
  font-size: 1rem;
  font-family: var(--nug-font);
  color: var(--nug-ink);
  background: var(--nug-bg);
  box-sizing: border-box;
  transition: border-color .18s ease, outline .18s ease;
}

.nug-input:focus,
.nug-textarea:focus {
  border-color: var(--nug-primary);
  outline: 2px solid color-mix(in srgb, var(--nug-primary) 30%, transparent);
  outline-offset: 0;
}

/* ── Submit button ── */
.nug-submit-btn {
  width: 100%;
  background: var(--nug-primary);
  color: var(--nug-primary-ink);
  padding: var(--nug-space-4);
  border-radius: var(--nug-radius-md);
  font-size: 1.05rem;
  font-weight: 600;
  border: none;
  cursor: pointer;
  text-decoration: none;
  display: inline-block;
  box-shadow: var(--nug-shadow-md);
  transition: all .18s ease;
}

.nug-submit-btn:hover {
  filter: brightness(1.08);
  transform: translateY(-1px);
}

.nug-submit-btn:disabled {
  opacity: .6;
  cursor: not-allowed;
  transform: none;
  filter: none;
}

/* ── Trust line ── */
.nug-trust-line {
  text-align: center;
  color: var(--nug-ink-muted);
  font-size: .875rem;
  margin-top: var(--nug-space-3);
}

/* ── Privacy note ── */
.nug-privacy-note {
  text-align: center;
  color: var(--nug-locked);
  font-size: .8125rem;
  margin-top: var(--nug-space-2);
}

/* ── Success box ── */
.nug-success-box {
  background: color-mix(in srgb, var(--nug-success) 10%, transparent);
  border: 1.5px solid var(--nug-success);
  border-radius: var(--nug-radius-md);
  padding: var(--nug-space-4) var(--nug-space-5);
  text-align: center;
  color: var(--nug-ink);
  margin-top: var(--nug-space-4);
}

/* ── Error message ── */
.nug-error-msg {
  color: var(--nug-review);
  font-size: .875rem;
  margin-top: var(--nug-space-2);
}

/* ── Footer ── */
.nug-footer {
  border-top: 1px solid var(--nug-line);
  padding: var(--nug-space-5);
  text-align: center;
  color: var(--nug-ink-muted);
  font-size: .875rem;
}

/* ── Footer disclaimer ── */
.nug-footer-disclaimer {
  font-weight: 600;
  color: var(--nug-ink);
  margin-bottom: var(--nug-space-2);
}

/* ── Live count (hero, populated by JS) ── */
.nug-live-count {
  color: var(--nug-ink-muted);
  font-size: .875rem;
  margin-top: var(--nug-space-4);
  min-height: 1.4em; /* reserve space so layout doesn't jump */
}
