/* ─────────────────────────────────────────
   MANIFESTO IA — Estilos específicos da página
   Depende de style.css (carregado antes)
   ───────────────────────────────────────── */


/* ── Hero ────────────────────────────────── */

.mia-hero {
  min-height: 100vh;
  display: flex; flex-direction: column; justify-content: flex-end;
  padding: 0 48px 64px;
  position: relative;
  border-bottom: 1px solid var(--border);
}

.mia-hero-titles { line-height: .9; }

/* "IA" em itálico Cormorant para contrastar com "Manifesto" */
.mia-word-ia .hero-word span,
.mia-word-ia span {
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
  font-weight: 300;
  /* sem gradiente — texto na cor base */
  background: none;
  -webkit-text-fill-color: var(--fg);
}

.mia-hero-sub {
  margin-top: 48px;
  font-size: clamp(16px, 2vw, 24px);
  color: var(--muted);
  max-width: 480px;
  line-height: 1.6;
}


/* ── Corpo do texto ──────────────────────── */

.mia-body {
  padding: 120px 48px;
  display: flex;
  flex-direction: column;
  gap: 80px;
  max-width: 860px;
}

.mia-block {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

/* Label de bloco — "— O que a IA fez" */
.mia-label {
  font-size: 10px;
  letter-spacing: .35em;
  text-transform: uppercase;
  color: var(--muted);
}

/* Parágrafo principal */
.mia-block p {
  font-size: clamp(16px, 1.8vw, 20px);
  line-height: 1.85;
  color: var(--muted);
  max-width: 680px;
}

/* Texto de abertura — maior e mais impactante */
.mia-lead {
  font-size: clamp(20px, 2.5vw, 32px) !important;
  line-height: 1.6 !important;
  color: var(--fg) !important;
  font-weight: 300;
}

/* Bloco de citação */
.mia-block--quote {
  padding: 64px 0;
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
}

blockquote {
  font-size: clamp(24px, 3.5vw, 52px);
  line-height: 1.35;
  color: var(--fg);
  max-width: 760px;
}

/* Último parágrafo de cada bloco com tom mais claro */
.mia-block p:last-child:not(.mia-lead) {
  margin-top: 4px;
}

/* Destaque na última frase */
.mia-block p br + * ,
.mia-block p:last-of-type {
  color: var(--fg);
}


/* ── Lista de usos ───────────────────────── */

.mia-lista {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.mia-lista li {
  font-size: clamp(16px, 1.8vw, 20px);
  line-height: 1.85;
  color: var(--muted);
  padding-left: 20px;
  position: relative;
}

.mia-lista li::before {
  content: '—';
  position: absolute;
  left: 0;
  color: var(--border);
}

/* ── Assinatura ──────────────────────────── */

.mia-assinatura {
  padding-top: 40px;
  border-top: 1px solid var(--border);
}

.mia-assinatura p {
  font-size: clamp(14px, 1.5vw, 17px) !important;
  color: var(--muted) !important;
}


/* ── Footer — link adicional ─────────────── */

.footer-link {
  font-size: 12px;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: var(--muted);
  text-decoration: none;
  border-bottom: 1px solid transparent;
  padding-bottom: 2px;
  transition: border-color .3s, color .3s;
}

.footer-link:hover {
  color: var(--fg);
  border-color: var(--muted);
}


/* ── Responsivo ──────────────────────────── */

@media (max-width: 768px) {
  .mia-hero { padding: 0 24px 52px; }
  .mia-hero-sub { margin-top: 32px; }
  .mia-body { padding: 80px 24px; gap: 56px; }
  .mia-block--quote { padding: 48px 0; }
}