html { font-size: 16px; }
body {
  font-family: var(--f-sans);
  background: var(--c-bg);
  color: var(--c-ink);
  overflow-x: hidden;
  cursor: none;
}
.container {
  width: 92%;
  max-width: var(--max-w);
  margin: 0 auto;
}
.section-label {
  font-size: .7rem;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--c-accent);
  font-weight: 500;
  margin-bottom: var(--space-sm);
  display: block;
}
.btn-primary {
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  padding: .95rem 2.1rem;
  background: var(--c-ink);
  color: var(--c-bg);
  font-size: .82rem;
  font-weight: 500;
  letter-spacing: .05em;
  border-radius: 50px;
  transition: background var(--transition), gap var(--transition);
  white-space: nowrap;
}
.btn-primary:hover { background: var(--c-accent); gap: .95rem; }
.btn-outline {
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  padding: .9rem 2rem;
  border: 1px solid var(--c-ink);
  color: var(--c-ink);
  font-size: .82rem;
  font-weight: 500;
  letter-spacing: .05em;
  border-radius: 50px;
  transition: background var(--transition), color var(--transition), gap var(--transition);
}
.btn-outline:hover { background: var(--c-ink); color: var(--c-bg); gap: .95rem; }

/* Custom cursor */
#cursor {
  position: fixed; top: 0; left: 0;
  width: 36px; height: 36px;
  pointer-events: none; z-index: 9999;
  mix-blend-mode: multiply;
  transform: translate(-50%, -50%);
  transition: opacity .3s;
}
#cursor-dot {
  width: 36px; height: 36px;
  border: 1px solid var(--c-ink);
  border-radius: 50%;
  transition: width .3s ease, height .3s ease, background .3s ease, border-color .3s ease;
}
body.cursor-hover #cursor-dot {
  width: 54px; height: 54px;
  background: var(--c-accent);
  border-color: var(--c-accent);
}

/* Page intro animation */
.page-wrap { opacity: 0; transform: translateY(18px); animation: pageIn .7s .05s cubic-bezier(.22,.61,.36,1) forwards; }
@keyframes pageIn { to { opacity:1; transform:translateY(0); } }