/* 19/10 · a /manifesto D2 (server/siteD/manifestoD.ts): a capa sobre a fotografia, e cada capítulo com o número à
   esquerda e o texto à direita. Os <em> de hoje deixam de ser realce de cor (regra «sem letras azuis»). */
.mn-capa { position: relative; min-height: min(86vh, 820px); display: flex; align-items: flex-end; overflow: hidden; padding: calc(var(--topo, 96px) + 48px) 0 64px; }
.mn-capa-foto { position: absolute; inset: -6% 0; }
.mn-capa-foto img { width: 100%; height: 100%; object-fit: cover; display: block; }
.mn-capa::after { content: ''; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, rgba(6,14,26,.62) 0%, rgba(6,14,26,.25) 38%, rgba(6,14,26,.92) 100%); }
.mn-capa-in { position: relative; z-index: 1; }
.mn-h1 { max-width: 12ch; color: #fff; }
.mn-lead { color: #E2E8F0; }
.mn-capa .pg-trilho, .mn-capa .pg-trilho a { color: #E2E8F0; }

.mn-cap-in { display: grid; grid-template-columns: minmax(160px, 1fr) minmax(0, 2.6fr); gap: clamp(24px, 5vw, 80px); padding-top: 28px; border-top: 1px solid rgba(255,255,255,.12); }
.mn-cap-lado { position: sticky; top: calc(var(--topo, 96px) + 24px); align-self: start; }
.mn-cap-n { margin: 0 0 6px; font-size: clamp(64px, 8vw, 120px); color: rgba(241,245,249,.28); }
.mn-cap-lado .etq { margin: 0; }
.mn-h2 { max-width: 20ch; margin: 0 0 26px; }
.mn-h2 em, .mn-cap-txt em, .mn-cit em { font-style: normal; color: inherit; }
.mn-p { margin: 0 0 18px; max-width: 68ch; font-size: 17px; line-height: 1.75; color: var(--claro); }
.mn-p strong { color: #F8FAFC; font-weight: 700; }
.mn-p a { color: #F1F5F9; text-underline-offset: 4px; }
.mn-cit { margin: 30px 0; padding: 0 0 0 22px; border-left: 2px solid var(--ciano); }
.mn-cit p { margin: 0; font-size: var(--t3); line-height: 1.2; letter-spacing: -.02em; font-weight: 800; color: #fff; max-width: 24ch; text-wrap: balance; }
.mn-cit strong { color: #fff; }
.mn-disc { margin: 28px 0 22px; }
.mn-promessas { list-style: none; counter-reset: c; display: grid; gap: 0; margin: 0; padding: 0; max-width: 72ch; }
.mn-promessas li { counter-increment: c; display: grid; grid-template-columns: 56px 1fr; gap: 14px; padding: 18px 0; border-bottom: 1px solid rgba(255,255,255,.09); font-size: 17px; line-height: 1.65; color: var(--claro); }
.mn-promessas li::before { content: counter(c, decimal-leading-zero); font-family: 'Archivo SB', 'Inter SB', sans-serif; font-stretch: 62%; font-weight: 800; font-size: 30px; line-height: 1; color: rgba(241,245,249,.35); }
.mn-fecho .h2 { max-width: 16ch; }
.mn-pe { margin: 26px 0 0; font-size: 14px; color: #CBD5E1; }
.mn-pe a { color: #F1F5F9; text-underline-offset: 4px; }

@media (max-width: 860px) {
  .mn-cap-in { grid-template-columns: 1fr; gap: 6px; }
  .mn-cap-lado { position: static; display: flex; align-items: baseline; gap: 14px; }
  .mn-cap-n { font-size: 56px; margin: 0; }
  .mn-p, .mn-promessas li { font-size: 16px; }
  .mn-promessas li { grid-template-columns: 40px 1fr; }
}

/* 20/10 · o kit de vida (vida.css): o III numa folha de espuma, o IV por cima da Praia Nova, as três portas no fim */
.mn-claro .mn-cap-in { border-top: 0; padding-top: 0; }
.mn-claro .mn-cap-n { color: rgba(15,23,42,.22); }
.mn-claro .mn-p { color: var(--vd-texto); }
.mn-claro .mn-p strong, .mn-claro .mn-p a { color: var(--vd-tinta); }
.mn-claro .mn-cit { border-left-color: var(--vd-quente); }
.mn-claro .mn-cit p, .mn-claro .mn-cit strong { color: var(--vd-tinta); }
.mn-foto .mn-cap-in { border-top: 0; }
.mn-foto .mn-cap-n { color: rgba(255,255,255,.5); }
.mn-foto .mn-p { color: #E2E8F0; }
.mn-foto .mn-cit p { text-shadow: 0 2px 30px rgba(0,0,0,.4); }
.mn-foto + .mn-cap > .mn-cap-in, .mn-claro + .mn-foto { border-top: 0; }
