/* ═══════════════════════════════════════════════════════════
   HN Services — Manifesto (Sistemas)
   ─────────────────────────────────────────────────────────
   Irmã da seção Manifesto original ("Não criamos apenas sites").
   Mesma tipografia gigante fill-to-width, mas a entrada é
   diferente: linhas deslizam de lados alternados (não sobe
   por baixo) e a seção NÃO fixa o scroll — reveal simples,
   uma vez, ao entrar na tela. Ver initManifestoAltAnimations.
   ═══════════════════════════════════════════════════════════ */

.manifesto-alt {
  position: relative;
  min-height: 100vh;
  display: flex;
  align-items: center;
  background: var(--bg);
  overflow: hidden;
}

.manifesto-alt::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 60% 55% at 78% 38%, rgba(201, 243, 29, 0.12), transparent 70%),
    linear-gradient(to bottom, var(--bg) 0%, transparent 14%, transparent 86%, var(--bg) 100%);
  pointer-events: none;
}

.manifesto-alt::after {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(245, 240, 232, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(245, 240, 232, 0.035) 1px, transparent 1px);
  background-size: 64px 64px;
  mask-image: radial-gradient(ellipse 80% 70% at 50% 50%, #000 40%, transparent 100%);
  -webkit-mask-image: radial-gradient(ellipse 80% 70% at 50% 50%, #000 40%, transparent 100%);
  pointer-events: none;
}

.manifesto-alt__content {
  position: relative;
  z-index: 2;
  padding-block: clamp(5rem, 9vh, 7rem);
  width: 100%;
}

.manifesto-alt__headline { margin-bottom: clamp(2rem, 4vw, 3rem); }

.manifesto-alt__line-wrap {
  overflow: hidden;
  padding: 0.08em 0; /* margem de segurança para acentos (ã, ê) não cortarem */
}

.manifesto-alt__line {
  display: block;
  font-family: var(--font-display);
  font-size: clamp(2.5rem, 8vw, 8rem); /* JS ajusta para preencher a largura, como no original */
  font-weight: 800;
  letter-spacing: -0.04em;
  line-height: 1.05;
  white-space: nowrap;
  color: var(--white);
  will-change: transform, opacity;
}

.manifesto-alt__line--stroke {
  color: transparent;
  -webkit-text-stroke: 2px rgba(245, 240, 232, 0.62);
}

.manifesto-alt__line--lime { color: var(--accent); }

@media (max-width: 768px) {
  .manifesto-alt__line {
    /* 10vw (não 11vw como no manifesto original): "demandas." e "modernos."
       são palavras mais longas que as do texto original — 11vw as forçava
       a quebrar no meio mesmo com overflow-wrap. Testado sem overflow em
       320–480px. */
    font-size: clamp(2rem, 10vw, 4rem);
    white-space: normal;
    /* overflow-wrap (não word-break): só quebra no meio de uma palavra
       quando ela sozinha não cabe na linha — senão quebra no espaço.
       word-break:break-word partia "demandas." em "demanda"+"s.". */
    overflow-wrap: break-word;
    word-break: normal;
  }
  .manifesto-alt__line--stroke { -webkit-text-stroke-width: 1.5px; }
  .manifesto-alt__line-wrap { padding: 0.12em 0; }
}