.hero { position: relative; overflow: hidden; }
.hero__bg { position: absolute; inset: 0; pointer-events: none; }
.hero__inner { position: relative; padding-block: clamp(72px, 10vw, 136px) clamp(72px, 8vw, 112px); display: flex; flex-direction: column; gap: 56px; }
.hero__kicker { display: flex; align-items: center; gap: 12px; font: 400 0.75rem var(--font-mono); letter-spacing: 0.08em; text-transform: uppercase; color: var(--muted); }
.hero__kicker::before { content: ""; width: 24px; height: 1px; background: var(--accent); }
.hero h1 { max-width: 15ch; font-size: clamp(2.75rem, 6.6vw, 6rem); line-height: 0.98; letter-spacing: -0.045em; }
.hero__row { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); gap: 48px 64px; align-items: end; }
.hero__copy { display: flex; flex-direction: column; gap: 32px; max-width: 460px; }
.hero__copy p { font-size: 1.125rem; line-height: 1.6; color: var(--muted); }
.hero__cta { display: flex; gap: 12px; flex-wrap: wrap; }

/* entrada orquestrada: única sequência automática da página */
.hero__kicker, .hero h1, .hero__copy, .console { animation: rise 700ms var(--ease) both; }
.hero h1 { animation-delay: 80ms; }
.hero__copy { animation-delay: 180ms; }
.console { animation-delay: 280ms; }
@keyframes rise { from { opacity: 0; transform: translateY(16px); } }

/* ---------- Console ---------- */
.console { border: 1px solid #1f2327; border-radius: 18px; background: var(--bg-raised); box-shadow: 0 40px 80px -40px rgba(0, 0, 0, 0.8); overflow: hidden; }
.console__bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 18px; border-bottom: 1px solid var(--line); }
.console__dots { display: flex; gap: 6px; width: 42px; }
.console__dots i { width: 10px; height: 10px; border-radius: 50%; background: #23272b; }
.console__title { font: 400 0.75rem var(--font-mono); color: var(--faint); }
.console__body { display: grid; grid-template-columns: 170px minmax(0, 1fr); }
.console__tabs { padding: 14px 10px; border-right: 1px solid var(--line); display: flex; flex-direction: column; gap: 2px; }
.console__tab {
  display: flex; align-items: center; justify-content: space-between; width: 100%; padding: 10px 12px; border: 0; border-radius: 8px;
  background: none; color: var(--faint); font: 400 0.8125rem var(--font-mono); text-align: left; cursor: pointer;
  transition: color var(--fast), background var(--fast);
}
.console__tab:hover { color: var(--text); }
.console__tab[aria-selected="true"] { background: var(--surface-2); box-shadow: inset 0 0 0 1px var(--accent-line); color: var(--text); }
.console__tab[aria-selected="true"]::after { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--accent); }
.console__view { position: relative; container-type: inline-size; min-height: 300px; }
.console__view .mock { animation: fade 320ms var(--ease); }
@keyframes fade { from { opacity: 0; transform: translateY(6px); } }
.console__foot { display: flex; align-items: center; gap: 10px; padding: 12px 18px; border-top: 1px solid var(--line); font: 400 0.75rem var(--font-mono); color: var(--faint); }
.console__foot i { width: 6px; height: 6px; border-radius: 50%; background: var(--accent); }

@media (max-width: 960px) {
  .hero__row { grid-template-columns: 1fr; }
}
@media (max-width: 620px) {
  .console__body { grid-template-columns: 1fr; }
  .console__tabs { flex-direction: row; overflow-x: auto; border-right: 0; border-bottom: 1px solid var(--line); padding: 10px; scrollbar-width: none; }
  .console__tab { width: auto; white-space: nowrap; gap: 10px; }
  .console__view { min-height: 240px; }
}

/* ---------- Faixa de capacidades ---------- */
.strip { border-block: 1px solid #16191c; }
.strip__inner { padding-block: 22px; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px 28px; font: 400 0.8125rem var(--font-mono); color: var(--faint); letter-spacing: 0.02em; }
