/* ─── HERO ───────────────────────────────────────────────── */
#hero {
  min-height: 100svh; display: flex; flex-direction: column; justify-content: center;
  padding: calc(var(--nav-h) + 80px) 48px 80px;
  max-width: 1240px; margin: 0 auto; position: relative;
}
.hero-headline { font-size: clamp(52px, 7.2vw, 96px); margin-bottom: 28px; max-width: 820px; }
.hero-sub { font-size: 18px; font-weight: 400; opacity: 0.55; max-width: 440px; line-height: 1.7; margin-bottom: 52px; }
.hero-buttons { display: flex; gap: 14px; flex-wrap: wrap; margin-bottom: 60px; }

.btn-primary {
  display: inline-block; padding: 16px 32px;
  font-size: 15px; font-weight: 600;
  background: var(--accent); color: #0A0A0A;
  border: 1px solid var(--accent); border-radius: var(--radius);
  transition: opacity 0.2s; text-decoration: none; cursor: pointer;
  min-height: 44px;
}
.btn-primary:hover { opacity: 0.85; }
.btn-outline {
  display: inline-block; padding: 16px 32px;
  font-size: 15px; font-weight: 500;
  background: transparent; color: var(--text);
  border: 1px solid rgba(240,240,240,0.25); border-radius: var(--radius);
  transition: border-color 0.2s; text-decoration: none; cursor: pointer;
  min-height: 44px;
}
.btn-outline:hover { border-color: rgba(240,240,240,0.7); }

.hero-proof {
  display: flex; align-items: center; gap: 16px; flex-wrap: wrap;
  font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; opacity: 0.4;
}
.scroll-indicator {
  position: absolute; bottom: 40px; left: 50%; transform: translateX(-50%);
  width: 1px; height: 52px; overflow: hidden;
}
.scroll-line {
  width: 100%; height: 100%;
  background: linear-gradient(to bottom, transparent, var(--text), transparent);
  animation: scrollPulse 1.8s ease-in-out infinite;
}
@keyframes scrollPulse {
  0% { transform: translateY(-100%); }
  100% { transform: translateY(100%); }
}