:root {
  /* Pure neutral blacks, no blue or warm tint */
  --ink: #060606;
  --ink-2: #0a0a0a;
  --ink-3: #0f0f10;

  /* Off-white text */
  --bone: #f2efe8;
  --bone-dim: #cfcdc6;
  --slate: #8a8985;

  /* Refined brass: cooler, less honey, more polished metal */
  --brass: #c6a25a;
  --brass-soft: #d8bf8a;
  --brass-deep: #a07f3e;

  /* Glass tokens */
  --glass-fill: rgba(255, 255, 255, 0.025);
  --glass-fill-2: rgba(255, 255, 255, 0.04);
  --glass-fill-3: rgba(255, 255, 255, 0.06);
  --glass-border: rgba(255, 255, 255, 0.06);
  --glass-border-strong: rgba(255, 255, 255, 0.10);

  /* Hairline rules */
  --hairline: rgba(255, 255, 255, 0.06);
  --hairline-strong: rgba(255, 255, 255, 0.14);
}

* {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

html, body {
  background: var(--ink);
  color: var(--bone);
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
  font-feature-settings: 'ss01', 'cv11';
  font-size: 17px;
  line-height: 1.55;
  letter-spacing: -0.005em;
}

.font-display {
  font-family: 'Fraunces', 'Times New Roman', serif;
  font-feature-settings: 'ss01';
  letter-spacing: -0.025em;
}

.font-mono {
  font-family: 'JetBrains Mono', 'SF Mono', ui-monospace, monospace;
}

.eyebrow {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 0.6875rem;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--brass);
  font-weight: 500;
}

.hairline { border-color: var(--hairline); }
.hairline-strong { border-color: var(--hairline-strong); }

.text-brass { color: var(--brass); }
.text-brass-soft { color: var(--brass-soft); }
.text-bone { color: var(--bone); }
.text-bone-dim { color: var(--bone-dim); }
.text-slate { color: var(--slate); }
.bg-ink { background: var(--ink); }
.bg-ink-2 { background: var(--ink-2); }
.bg-brass { background: var(--brass); }

/* GLASS MORPHISM SYSTEM */
.glass {
  background: var(--glass-fill);
  border: 1px solid var(--glass-border);
  backdrop-filter: blur(20px) saturate(140%);
  -webkit-backdrop-filter: blur(20px) saturate(140%);
}
.glass-strong {
  background: var(--glass-fill-2);
  border: 1px solid var(--glass-border-strong);
  backdrop-filter: blur(28px) saturate(160%);
  -webkit-backdrop-filter: blur(28px) saturate(160%);
}
.glass-panel {
  background:
    linear-gradient(180deg, rgba(255,255,255,0.04) 0%, rgba(255,255,255,0.015) 100%);
  border: 1px solid var(--glass-border);
  backdrop-filter: blur(24px) saturate(150%);
  -webkit-backdrop-filter: blur(24px) saturate(150%);
}
.glass-section {
  /* For full-width sections: very subtle elevation above the ink */
  background: linear-gradient(180deg, rgba(255,255,255,0.018) 0%, rgba(255,255,255,0.008) 100%);
  border-top: 1px solid var(--hairline);
  border-bottom: 1px solid var(--hairline);
}

/* Replaced the blue/gold hero gradient with a neutral spotlight */
.hero-vignette {
  position: relative;
}
.hero-vignette::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(80% 60% at 50% 0%, rgba(255, 255, 255, 0.035) 0%, transparent 70%);
}

.grain { /* unused, kept for class compatibility */ }

/* BUTTONS */
.btn-primary {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  background: linear-gradient(180deg, rgba(198, 162, 90, 0.10) 0%, rgba(198, 162, 90, 0.04) 100%);
  color: var(--brass-soft);
  padding: 0.875rem 1.5rem;
  font-weight: 600;
  font-size: 0.9375rem;
  letter-spacing: -0.005em;
  border: 1px solid rgba(198, 162, 90, 0.55);
  backdrop-filter: blur(18px) saturate(160%);
  -webkit-backdrop-filter: blur(18px) saturate(160%);
  transition: background 220ms ease, border-color 220ms ease, color 220ms ease;
}
.btn-primary:hover {
  background: linear-gradient(180deg, rgba(198, 162, 90, 0.18) 0%, rgba(198, 162, 90, 0.08) 100%);
  border-color: var(--brass);
  color: #f4e2bd;
}
.btn-primary .arrow { transition: transform 200ms ease; }
.btn-primary:hover .arrow { transform: translateX(3px); }

.btn-ghost {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: var(--bone);
  padding: 0.875rem 1.5rem;
  font-weight: 500;
  font-size: 0.9375rem;
  border: 1px solid var(--glass-border-strong);
  background: var(--glass-fill);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  transition: border-color 200ms ease, background 200ms ease;
}
.btn-ghost:hover {
  border-color: rgba(255, 255, 255, 0.22);
  background: var(--glass-fill-2);
}

.link-arrow {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  color: var(--brass);
  font-weight: 500;
  border-bottom: 1px solid transparent;
  transition: border-color 160ms ease;
}
.link-arrow:hover { border-bottom-color: var(--brass); }

.nav-link {
  color: var(--bone-dim);
  font-size: 0.9375rem;
  letter-spacing: 0;
  transition: color 160ms ease;
}
.nav-link:hover,
.nav-link[aria-current="page"] { color: var(--bone); }

/* FORM */
input, textarea, select {
  background: var(--glass-fill);
  color: var(--bone);
  border: 1px solid var(--glass-border-strong);
  padding: 0.875rem 1rem;
  font-family: inherit;
  font-size: 0.9375rem;
  width: 100%;
  transition: border-color 200ms ease, background 200ms ease;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
input:focus, textarea:focus, select:focus {
  outline: none;
  border-color: var(--brass);
  background: var(--glass-fill-2);
}
input::placeholder, textarea::placeholder { color: var(--slate); }
label {
  display: block;
  font-size: 0.75rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--bone-dim);
  margin-bottom: 0.5rem;
  font-weight: 500;
}

.rule {
  height: 1px;
  background: var(--hairline);
  width: 100%;
}

.step-number {
  font-family: 'Fraunces', serif;
  font-size: 4.5rem;
  line-height: 1;
  color: var(--brass);
  font-weight: 300;
  letter-spacing: -0.04em;
}

.fade-up { /* no-op */ }

details[open] summary .menu-bars { display: none; }
details[open] summary .menu-close { display: inline; }
summary .menu-close { display: none; }
summary { list-style: none; cursor: pointer; }
summary::-webkit-details-marker { display: none; }