/* ═══════════════════════════════════════════════════════════════════════════
 * arke-modulos.css — a página /site/modulos: como o sistema organiza a
 * realidade sem transformar módulo em silo.
 *
 * COR: dourado da marca. Esta página fala do sistema INTEIRO (não de um
 * produto), então nada de tema próprio — só o accent do archēLAB. Onde é
 * preciso distinguir família de módulo, usa-se `--mf`, um token local, com as
 * mesmas cores que a página do Panteon já usa por domínio.
 *
 * A PEÇA CENTRAL é o seletor de views (§31): sete representações da MESMA
 * coleção, renderizadas do MESMO array em JS. Não são sete blocos de HTML
 * diferentes fingindo alternância — se fossem, a página estaria mentindo
 * exatamente sobre a tese que ela defende.
 * ═══════════════════════════════════════════════════════════════════════════ */

.tema-mod {
  --mod-fundo:      #08070A;
  --mod-superficie: #100E13;
  --mod-tinta:      #F2EFE9;
  --mod-tinta-2:    #98928B;
  --mod-linha:      rgba(242,239,233,.1);
  --mf:             var(--accent, #C4973A);
  --mf-rgb:         196, 151, 58;
}
.tema-mod .ark-sec--surface { background: var(--mod-superficie); }
.tema-mod .ark-sec--deep, .tema-mod .ark-final { background: var(--mod-fundo); }

/* famílias de módulo (§27) — mesmas cores de domínio da página do Panteon */
.mf-estrutural { --mf: #C4973A; --mf-rgb: 196, 151, 58; }
.mf-dominio    { --mf: #0EA5E9; --mf-rgb: 14, 165, 233; }
.mf-execucao   { --mf: #A855F7; --mf-rgb: 168, 85, 247; }

/* ═══ §1 · HERO ═════════════════════════════════════════════════════════ */
.mod-hero {
  position: relative; overflow: hidden; background: var(--mod-fundo);
  padding-block: clamp(118px, 14vh, 176px) clamp(56px, 7vh, 92px);
}
.mod-hero::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background:
    radial-gradient(48% 44% at 26% 18%, rgba(var(--accent-rgb),.13), transparent 68%),
    radial-gradient(54% 48% at 74% 96%, rgba(var(--accent-rgb),.08), transparent 70%);
}
.mod-hero > .container { position: relative; z-index: 2; }
.mod-hero__t { margin: 0; font-size: clamp(30px, 4.8vw, 70px); font-weight: 800; line-height: .98; letter-spacing: -.035em; color: var(--mod-tinta); }
.mod-hero__t em {
  display: block; margin-top: .1em; font-style: italic; font-weight: 400;
  font-family: 'Playfair Display', Georgia, serif; color: var(--accent); font-size: .9em; line-height: 1.02;
}

/* ═══ A ÓRBITA — a entidade fica, as lentes mudam (§1, §29) ═════════════ */
.mod-orbita { position: relative; width: 100%; aspect-ratio: 16 / 6.8; min-height: 330px; }
.mod-orbita__svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.mod-orbita__l { stroke: rgba(242,239,233,.08); stroke-width: 1; fill: none; transition: stroke .5s ease; }
.mod-orbita__l.is-viva { stroke: rgba(var(--mf-rgb),.55); }
.mod-orbita__centro {
  position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 3;
  display: grid; justify-items: center; gap: 9px; text-align: center;
  padding: 20px 26px; border-radius: 8px;
  background: #0C0A0F; border: 1px solid rgba(var(--accent-rgb),.4);
  box-shadow: 0 0 0 8px rgba(var(--accent-rgb),.05), 0 30px 70px rgba(0,0,0,.6);
}
.mod-orbita__centro b { font-size: clamp(15px, 1.6vw, 21px); font-weight: 700; letter-spacing: -.01em; color: var(--mod-tinta); }
.mod-orbita__centro span {
  font-family: var(--font-mono, monospace); font-size: 8.5px; letter-spacing: .17em;
  text-transform: uppercase; color: var(--accent-text, #D4A94A);
}
.mod-lente {
  position: absolute; left: var(--x); top: var(--y); transform: translate(-50%, -50%);
  z-index: 2; cursor: pointer; text-align: left; white-space: nowrap;
  display: grid; gap: 3px; padding: 11px 17px; border-radius: 6px;
  background: #100B14; border: 1px solid var(--mod-linha);
  transition: border-color .45s ease, background .45s ease, transform .45s cubic-bezier(.16,1,.3,1), opacity .45s ease;
}
.mod-lente b { font-size: 12.5px; font-weight: 650; color: var(--mod-tinta-2); transition: color .4s ease; }
.mod-lente i {
  font-style: normal; font-family: var(--font-mono, monospace); font-size: 8.5px;
  letter-spacing: .13em; text-transform: uppercase; color: #5F5A54;
}
.mod-lente:hover, .mod-lente.is-on {
  border-color: rgba(var(--mf-rgb),.6); background: rgba(var(--mf-rgb),.07);
  transform: translate(-50%, -50%) scale(1.03);
}
.mod-lente:hover b, .mod-lente.is-on b { color: var(--mf); }
/* atenuado, nunca apagado: as outras lentes continuam existindo — é esse o ponto. */
.mod-orbita.is-focando .mod-lente:not(.is-on) { opacity: .58; }

/* o que aquela lente vê da mesma entidade */
.mod-recorte {
  margin-top: clamp(24px, 2.8vw, 38px); padding: clamp(22px, 2.4vw, 32px);
  border-radius: 6px; background: rgba(242,239,233,.022);
  border: 1px solid var(--mod-linha); border-left: 2px solid var(--mf);
  min-height: 118px;
}
.mod-recorte__k {
  display: block; font-family: var(--font-mono, monospace); font-size: 9px;
  letter-spacing: .16em; text-transform: uppercase; color: var(--mf); margin-bottom: 12px;
}
.mod-recorte__chips { display: flex; flex-wrap: wrap; gap: 7px; }
.mod-recorte__chips span {
  padding: 7px 14px; border-radius: 999px; font-size: 12.5px; color: var(--mod-tinta);
  background: rgba(var(--mf-rgb),.08); border: 1px solid rgba(var(--mf-rgb),.28);
}
.mod-recorte p { margin: 13px 0 0; font-size: 13px; line-height: 1.6; color: var(--mod-tinta-2); }

/* ═══ §2 · A PILHA — produto → módulo → núcleo → view → entidade ════════ */
.mod-pilha { display: grid; gap: 8px; margin-top: clamp(38px, 4.4vw, 60px); }
.mod-nivel {
  display: grid; grid-template-columns: 128px minmax(0, 200px) minmax(0, 1fr);
  gap: clamp(16px, 2vw, 30px); align-items: center;
  padding: clamp(16px, 1.8vw, 24px) clamp(18px, 2vw, 26px); border-radius: 6px;
  background: #0C0A0F; border: 1px solid var(--mod-linha);
  border-left: 2px solid rgba(var(--accent-rgb),var(--forca, .25));
}
.mod-nivel__k {
  font-family: var(--font-mono, monospace); font-size: 9.5px; letter-spacing: .17em;
  text-transform: uppercase; color: var(--accent-text, #D4A94A);
}
.mod-nivel__v { font-size: clamp(15px, 1.6vw, 21px); font-weight: 700; letter-spacing: -.015em; color: var(--mod-tinta); }
.mod-nivel__d { margin: 0; font-size: 13px; line-height: 1.6; color: var(--mod-tinta-2); }
.mod-nivel__d strong { color: var(--mod-tinta); font-weight: 600; }

/* ═══ §3 · UMA PESSOA, MUITOS PAPÉIS ═══════════════════════════════════ */
.mod-papel { display: grid; grid-template-columns: minmax(0, 280px) minmax(0, 1fr); gap: clamp(20px, 2.6vw, 44px); align-items: center; margin-top: clamp(38px, 4.4vw, 60px); }
.mod-papel__ent {
  padding: clamp(24px, 2.8vw, 36px); border-radius: 8px; text-align: center;
  background: #0C0A0F; border: 1px solid rgba(var(--accent-rgb),.4);
  box-shadow: 0 0 0 7px rgba(var(--accent-rgb),.045);
}
.mod-papel__ent b { display: block; font-size: clamp(19px, 2vw, 27px); font-weight: 700; color: var(--mod-tinta); }
.mod-papel__ent span {
  display: block; margin-top: 7px; font-family: var(--font-mono, monospace); font-size: 9px;
  letter-spacing: .16em; text-transform: uppercase; color: var(--accent-text, #D4A94A);
}
.mod-papel__ent em { display: block; margin-top: 14px; font-style: normal; font-size: 12.5px; line-height: 1.55; color: var(--mod-tinta-2); }
.mod-papel__rels { display: grid; gap: 8px; }
.mod-rel {
  display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 18px; align-items: baseline;
  padding: 14px 18px; border-radius: 5px;
  background: rgba(242,239,233,.022); border: 1px solid var(--mod-linha);
}
.mod-rel b {
  font-family: var(--font-mono, monospace); font-size: 9.5px; letter-spacing: .13em;
  text-transform: lowercase; color: var(--accent-text, #D4A94A);
}
.mod-rel span { font-size: 13.5px; color: var(--mod-tinta); }
.mod-rel i { display: block; font-style: normal; font-size: 12px; color: var(--mod-tinta-2); margin-top: 3px; }

/* ═══ CARTÕES DE MÓDULO — usados em várias seções ══════════════════════ */
.mod-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-top: clamp(34px, 4vw, 56px); }
.mod-grid--3 { grid-template-columns: repeat(3, 1fr); }
.mod-card {
  padding: clamp(19px, 2vw, 26px); border-radius: 6px; background: #0C0A0F;
  border: 1px solid var(--mod-linha); border-top: 2px solid rgba(var(--mf-rgb),.55);
  transition: background .4s ease, transform .4s cubic-bezier(.16,1,.3,1);
}
.mod-card:hover { background: #120F18; transform: translateY(-2px); }
.mod-card__n { display: block; font-size: 14.5px; font-weight: 650; color: var(--mod-tinta); margin-bottom: 4px; }
.mod-card__k {
  display: block; font-family: var(--font-mono, monospace); font-size: 8.5px;
  letter-spacing: .15em; text-transform: uppercase; color: var(--mf); margin-bottom: 13px;
}
.mod-card ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 5px; }
.mod-card li { position: relative; padding-left: 13px; font-size: 12.5px; line-height: 1.5; color: var(--mod-tinta-2); }
.mod-card li::before { content: ""; position: absolute; left: 0; top: 8px; width: 5px; height: 1px; background: rgba(var(--mf-rgb),.65); }

/* listas longas de conceito (mercado, oferta, marketing…) */
.mod-chips { display: flex; flex-wrap: wrap; gap: 7px; margin-top: clamp(28px, 3.2vw, 44px); }
.mod-chips span {
  padding: 8px 15px; border-radius: 999px; font-size: 12.5px; color: var(--mod-tinta-2);
  background: rgba(242,239,233,.028); border: 1px solid var(--mod-linha);
  transition: border-color .35s ease, color .35s ease, background .35s ease;
}
.mod-chips span:hover { color: var(--mod-tinta); border-color: rgba(var(--mf-rgb),.5); background: rgba(var(--mf-rgb),.06); }

/* ═══ §31 · O SELETOR DE VIEWS — a peça central ════════════════════════ */
.mod-views { margin-top: clamp(34px, 4vw, 56px); border: 1px solid var(--mod-linha); background: #0A0810; }
.mod-views__bar {
  display: flex; flex-wrap: wrap; gap: 7px; padding: 13px 18px;
  border-bottom: 1px solid var(--mod-linha); align-items: center;
}
.mod-vbtn {
  padding: 7px 15px; border-radius: 999px; cursor: pointer; font-size: 12px; font-weight: 600;
  color: var(--mod-tinta-2); background: transparent; border: 1px solid var(--mod-linha);
  transition: color .3s ease, border-color .3s ease, background .3s ease;
}
.mod-vbtn:hover { color: var(--mod-tinta); border-color: rgba(242,239,233,.3); }
.mod-vbtn.is-on { color: var(--accent); border-color: rgba(var(--accent-rgb),.6); background: rgba(var(--accent-rgb),.08); }
.mod-views__selo {
  margin-left: auto; font-family: var(--font-mono, monospace); font-size: 9px;
  letter-spacing: .15em; text-transform: uppercase; color: #5F5A54;
}
.mod-views__palco { padding: clamp(20px, 2.4vw, 32px); min-height: 380px; }
.mod-views__palco > * { animation: modEntra .45s cubic-bezier(.16,1,.3,1) both; }
@keyframes modEntra { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }

/* — view: LISTA */
.mv-lista { display: grid; gap: 1px; background: var(--mod-linha); border: 1px solid var(--mod-linha); }
.mv-lista__i { display: grid; grid-template-columns: minmax(0,1fr) 130px 120px 90px; gap: 16px; align-items: center; background: #0A0810; padding: 14px 18px; }
.mv-lista__n { font-size: 13.5px; font-weight: 600; color: var(--mod-tinta); }
.mv-lista__m { font-size: 12px; color: var(--mod-tinta-2); }

/* — view: TABELA */
.mv-tab { width: 100%; border-collapse: collapse; font-size: 13px; }
.mv-tab th {
  text-align: left; padding: 11px 14px; border-bottom: 1px solid var(--mod-linha);
  font-family: var(--font-mono, monospace); font-size: 9px; letter-spacing: .15em;
  text-transform: uppercase; color: #5F5A54; font-weight: 400; white-space: nowrap;
}
.mv-tab td { padding: 12px 14px; border-bottom: 1px dashed rgba(242,239,233,.07); color: var(--mod-tinta-2); }
.mv-tab td:first-child { color: var(--mod-tinta); font-weight: 600; }
.mv-tab tr:last-child td { border-bottom: 0; }

/* — view: CARDS */
.mv-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.mv-card { padding: 18px 19px; border-radius: 6px; background: #0C0A0F; border: 1px solid var(--mod-linha); }
.mv-card b { display: block; font-size: 13.5px; font-weight: 650; color: var(--mod-tinta); margin-bottom: 12px; }
.mv-card dl { display: grid; grid-template-columns: 74px minmax(0,1fr); gap: 5px 10px; margin: 0; }
.mv-card dt { font-family: var(--font-mono, monospace); font-size: 8.5px; letter-spacing: .13em; text-transform: uppercase; color: #5F5A54; align-self: center; }
.mv-card dd { margin: 0; font-size: 12.5px; color: var(--mod-tinta-2); }

/* — view: KANBAN */
.mv-kanban { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; align-items: start; }
.mv-col { background: rgba(242,239,233,.02); border: 1px solid var(--mod-linha); border-radius: 6px; padding: 12px; }
.mv-col__h {
  display: flex; align-items: center; justify-content: space-between; margin-bottom: 11px;
  font-family: var(--font-mono, monospace); font-size: 9px; letter-spacing: .14em;
  text-transform: uppercase; color: #5F5A54;
}
.mv-col__n { color: var(--accent-text, #D4A94A); }
.mv-tk { padding: 12px 13px; border-radius: 5px; background: #0F0C15; border: 1px solid var(--mod-linha); margin-bottom: 8px; }
.mv-tk:last-child { margin-bottom: 0; }
.mv-tk b { display: block; font-size: 12.5px; font-weight: 600; color: var(--mod-tinta); margin-bottom: 6px; line-height: 1.3; }
.mv-tk span { font-size: 11px; color: var(--mod-tinta-2); }

/* — view: TIMELINE */
.mv-tl { position: relative; padding-left: 30px; display: grid; gap: 12px; }
.mv-tl::before { content: ""; position: absolute; left: 7px; top: 8px; bottom: 8px; width: 1px; background: linear-gradient(to bottom, rgba(var(--accent-rgb),.5), rgba(242,239,233,.08)); }
.mv-tl__i { position: relative; padding: 13px 17px; border-radius: 5px; background: #0C0A0F; border: 1px solid var(--mod-linha); }
.mv-tl__i::before { content: ""; position: absolute; left: -27px; top: 20px; width: 7px; height: 7px; border-radius: 50%; background: var(--accent); }
.mv-tl__i::after { content: ""; position: absolute; left: -19px; top: 23px; width: 12px; height: 1px; background: rgba(242,239,233,.14); }
.mv-tl__d { display: block; font-family: var(--font-mono, monospace); font-size: 9px; letter-spacing: .14em; text-transform: uppercase; color: #5F5A54; margin-bottom: 5px; }
.mv-tl__i b { display: block; font-size: 13.5px; font-weight: 650; color: var(--mod-tinta); }
.mv-tl__i span { font-size: 12px; color: var(--mod-tinta-2); }

/* — view: CALENDÁRIO */
.mv-cal { display: grid; grid-template-columns: repeat(7, 1fr); gap: 1px; background: var(--mod-linha); border: 1px solid var(--mod-linha); }
.mv-cal__wd { background: #0A0810; padding: 9px 8px; font-family: var(--font-mono, monospace); font-size: 8.5px; letter-spacing: .13em; text-transform: uppercase; color: #5F5A54; text-align: center; }
.mv-cal__d { background: #0A0810; min-height: 82px; padding: 7px 8px; }
.mv-cal__n { font-family: var(--font-mono, monospace); font-size: 10px; color: #5F5A54; }
.mv-cal__d--fora .mv-cal__n { opacity: .35; }
.mv-cal__ev { display: block; margin-top: 5px; padding: 4px 7px; border-radius: 3px; font-size: 10.5px; line-height: 1.3; color: var(--mod-tinta); background: rgba(var(--accent-rgb),.14); border-left: 2px solid var(--accent); }

/* — view: GRAFO */
.mv-grafo { position: relative; width: 100%; aspect-ratio: 16 / 7.4; min-height: 300px; }
.mv-grafo__svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.mv-grafo__l { stroke: rgba(var(--accent-rgb),.22); stroke-width: 1; fill: none; }
.mv-no {
  position: absolute; left: var(--x); top: var(--y); transform: translate(-50%, -50%);
  z-index: 2; white-space: nowrap; padding: 9px 14px; border-radius: 5px;
  background: #0F0C15; border: 1px solid var(--mod-linha); font-size: 12px; font-weight: 600; color: var(--mod-tinta);
}
.mv-no span { display: block; font-family: var(--font-mono, monospace); font-size: 8.5px; letter-spacing: .13em; text-transform: uppercase; color: #5F5A54; font-weight: 400; margin-top: 3px; }
.mv-no--centro { border-color: rgba(var(--accent-rgb),.5); box-shadow: 0 0 0 5px rgba(var(--accent-rgb),.05); }

/* — view: DASHBOARD */
.mv-dash { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.mv-kpi { padding: 18px 19px; border-radius: 6px; background: #0C0A0F; border: 1px solid var(--mod-linha); }
/* precisa vencer `.mv-kpi span` (mesma especificidade, declarado depois) —
   por isso o seletor descendente explícito. */
.mv-kpi > .mv-kpi__n {
  display: block; font-family: 'Playfair Display', Georgia, serif;
  font-size: clamp(26px, 2.8vw, 38px); font-weight: 400; line-height: 1;
  letter-spacing: -.02em; color: var(--accent); margin-top: 0; text-transform: none;
}
.mv-kpi b { display: block; margin-top: 10px; font-size: 12.5px; font-weight: 600; color: var(--mod-tinta); }
.mv-kpi span { display: block; margin-top: 4px; font-family: var(--font-mono, monospace); font-size: 8.5px; letter-spacing: .13em; text-transform: uppercase; color: #5F5A54; }
.mv-dash__larga { grid-column: 1 / -1; }
.mv-barras { display: grid; gap: 9px; }
.mv-barra { display: grid; grid-template-columns: 140px minmax(0,1fr) 46px; gap: 14px; align-items: center; }
.mv-barra b { font-size: 12.5px; font-weight: 600; color: var(--mod-tinta); }
.mv-barra i { display: block; height: 7px; border-radius: 999px; background: rgba(242,239,233,.06); overflow: hidden; }
.mv-barra i em { display: block; height: 100%; width: var(--p); background: linear-gradient(90deg, rgba(var(--accent-rgb),.5), var(--accent)); border-radius: 999px; }
.mv-barra span { font-family: var(--font-mono, monospace); font-size: 10.5px; color: var(--mod-tinta-2); text-align: right; }

/* selo de "mesma coleção" */
.mod-mesma {
  display: flex; flex-wrap: wrap; align-items: center; gap: 12px;
  margin-top: 18px; font-family: var(--font-mono, monospace); font-size: 9.5px;
  letter-spacing: .14em; text-transform: uppercase; color: #5F5A54;
}
.mod-mesma b { color: var(--accent-text, #D4A94A); font-weight: 400; }

/* ═══ §28 · NAVEGAÇÃO CONTEXTUAL ═══════════════════════════════════════ */
.mod-navs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-top: clamp(34px, 4vw, 56px); }
.mod-menu { border-radius: 8px; background: #0C0A0F; border: 1px solid var(--mod-linha); overflow: hidden; }
.mod-menu__h { display: flex; align-items: center; gap: 11px; padding: 15px 18px; border-bottom: 1px solid var(--mod-linha); }
.mod-menu__av { width: 32px; height: 32px; border-radius: 50%; overflow: hidden; flex: 0 0 auto; filter: grayscale(1) brightness(.9); }
.mod-menu__av img { width: 100%; height: 100%; object-fit: cover; display: block; }
.mod-menu__h b { display: block; font-size: 13px; font-weight: 650; color: var(--mod-tinta); }
.mod-menu__h em { display: block; font-style: normal; font-family: var(--font-mono, monospace); font-size: 8.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--mf); margin-top: 2px; }
.mod-menu ul { list-style: none; margin: 0; padding: 9px 0; }
.mod-menu li { padding: 8px 18px; font-size: 12.5px; color: var(--mod-tinta-2); border-left: 2px solid transparent; }
.mod-menu li:first-child { color: var(--mod-tinta); border-left-color: var(--mf); background: rgba(var(--mf-rgb),.05); }

/* ═══ §32 · POR SETOR ══════════════════════════════════════════════════ */
.mod-setores { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; margin-top: clamp(34px, 4vw, 56px); background: var(--mod-linha); border: 1px solid var(--mod-linha); }
.mod-setor { background: #0C0A0F; padding: clamp(22px, 2.4vw, 32px); }
.mod-setor > b { display: block; font-size: 14.5px; font-weight: 650; color: var(--mod-tinta); }
.mod-setor > em { display: block; margin: 5px 0 17px; font-style: normal; font-family: var(--font-mono, monospace); font-size: 8.5px; letter-spacing: .14em; text-transform: uppercase; color: #5F5A54; }
.mod-setor__base, .mod-setor__extra { display: flex; flex-wrap: wrap; gap: 6px; }
.mod-setor__base span { padding: 6px 12px; border-radius: 999px; font-size: 11.5px; color: var(--mod-tinta-2); background: rgba(242,239,233,.03); border: 1px solid var(--mod-linha); }
.mod-setor__lbl { display: block; margin: 15px 0 8px; font-family: var(--font-mono, monospace); font-size: 8.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--accent-text, #D4A94A); }
.mod-setor__extra span { padding: 6px 12px; border-radius: 999px; font-size: 11.5px; color: var(--accent); background: rgba(var(--accent-rgb),.09); border: 1px solid rgba(var(--accent-rgb),.3); }

/* ═══ §38 · MÓDULOS ATIVOS POR EMPRESA ═════════════════════════════════ */
.mod-cresce { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-top: clamp(34px, 4vw, 56px); }
.mod-fase { padding: clamp(21px, 2.3vw, 30px); border-radius: 6px; background: #0C0A0F; border: 1px solid var(--mod-linha); }
.mod-fase > b { display: block; font-size: 14px; font-weight: 650; color: var(--mod-tinta); margin-bottom: 4px; }
.mod-fase > em { display: block; font-style: normal; font-family: var(--font-mono, monospace); font-size: 8.5px; letter-spacing: .14em; text-transform: uppercase; color: #5F5A54; margin-bottom: 16px; }
.mod-fase__l { display: flex; flex-wrap: wrap; gap: 6px; }
.mod-fase__l span { padding: 6px 12px; border-radius: 4px; font-size: 11.5px; color: var(--mod-tinta-2); background: rgba(242,239,233,.03); border: 1px solid var(--mod-linha); }
.mod-fase__l--novo span { color: var(--accent); background: rgba(var(--accent-rgb),.09); border-color: rgba(var(--accent-rgb),.3); }
.mod-fase__mais { display: block; margin: 15px 0 8px; font-family: var(--font-mono, monospace); font-size: 8.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--accent-text, #D4A94A); }

/* ═══ §33 · O ANTIPADRÃO ═══════════════════════════════════════════════ */
.mod-versus { display: grid; grid-template-columns: 1fr auto 1fr; gap: clamp(18px, 2.4vw, 36px); align-items: center; margin-top: clamp(34px, 4vw, 56px); }
.mod-mal, .mod-bem { padding: clamp(22px, 2.4vw, 32px); border-radius: 6px; }
.mod-mal { background: rgba(139,58,58,.05); border: 1px dashed rgba(139,58,58,.42); }
.mod-bem { background: rgba(var(--accent-rgb),.05); border: 1px solid rgba(var(--accent-rgb),.35); }
.mod-mal__k, .mod-bem__k {
  display: block; font-family: var(--font-mono, monospace); font-size: 9px;
  letter-spacing: .16em; text-transform: uppercase; margin-bottom: 14px;
}
.mod-mal__k { color: #C9AFAF; }
.mod-bem__k { color: var(--accent); }
.mod-mal ul, .mod-bem ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 7px; }
.mod-mal li { padding: 10px 14px; border-radius: 4px; font-size: 13px; color: #C9AFAF; background: rgba(139,58,58,.07); }
.mod-bem li { padding: 10px 14px; border-radius: 4px; font-size: 13px; color: var(--mod-tinta); background: rgba(var(--accent-rgb),.07); }
.mod-bem p { margin: 13px 0 0; font-size: 12.5px; line-height: 1.6; color: var(--mod-tinta-2); }
.mod-versus__x { font-family: var(--font-mono, monospace); font-size: 11px; letter-spacing: .2em; text-transform: uppercase; color: #5F5A54; }

/* utilitários — nada de cor nem de grade crua no markup (§0 regra 6).
   O grid inline em .mod-rel travava a media query de 991px e estourava. */
.mf-financeiro { --mf: #22C55E; --mf-rgb: 34, 197, 94; }
.mf-estrategia { --mf: #A855C7; --mf-rgb: 168, 85, 199; }
.mod-rel--curta { grid-template-columns: 118px minmax(0, 1fr); }
@media (max-width: 991px) { .mod-rel--curta { grid-template-columns: 1fr; } }
.mod-nota-mal { margin: 14px 0 0; font-size: 12.5px; line-height: 1.6; color: #C9AFAF; }
.mod-obs {
  margin-top: clamp(24px, 2.8vw, 36px); padding: 18px 22px;
  border-left: 2px solid rgba(var(--accent-rgb),.55);
  background: rgba(242,239,233,.022);
  font-size: 13.5px; line-height: 1.65; color: var(--mod-tinta-2);
}
.mod-obs strong { color: var(--mod-tinta); font-weight: 600; }
.tema-mod .ark-card__body strong,
.tema-mod .arq-sys__txt strong,
.tema-mod .mod-bem p strong { color: var(--mod-tinta); font-weight: 600; }

/* ═══ §41 · MANIFESTO ══════════════════════════════════════════════════ */
.mod-manifesto { background: #F2EFE9; color: #14110C; padding-block: clamp(92px, 12vw, 168px); text-align: center; }
.mod-manifesto p { margin: 0 auto; max-width: 16ch; font-size: clamp(30px, 5.2vw, 78px); font-weight: 800; line-height: .97; letter-spacing: -.04em; color: #14110C; }
.mod-manifesto p + p { margin-top: clamp(32px, 4.2vw, 62px); }
.mod-manifesto p em { font-style: italic; font-weight: 400; font-family: 'Playfair Display', Georgia, serif; color: #8B6914; }
.mod-manifesto__ass { margin-top: clamp(42px, 5vw, 74px); display: grid; gap: 7px; justify-items: center; }
.mod-manifesto__ass b { font-size: clamp(17px, 1.8vw, 22px); font-weight: 700; color: #14110C; }
.mod-manifesto__ass span { font-family: var(--font-mono, monospace); font-size: 10px; letter-spacing: .18em; text-transform: uppercase; color: #6B6560; }

/* ═══ RESPONSIVO ═══════════════════════════════════════════════════════ */
@media (max-width: 1399px) {
  .mod-grid { grid-template-columns: repeat(3, 1fr); }
  .mv-dash { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 1199px) {
  .mod-grid, .mod-grid--3 { grid-template-columns: repeat(2, 1fr); }
  .mv-cards { grid-template-columns: repeat(2, 1fr); }
  .mv-kanban { grid-template-columns: repeat(2, 1fr); }
  .mod-navs, .mod-setores, .mod-cresce { grid-template-columns: 1fr; }
  .mod-nivel { grid-template-columns: 112px minmax(0, 1fr); grid-template-areas: "k v" "d d"; row-gap: 10px; }
  .mod-nivel__k { grid-area: k; } .mod-nivel__v { grid-area: v; } .mod-nivel__d { grid-area: d; }
}
@media (max-width: 991px) {
  .mod-orbita { display: none; }
  .mod-orbita-mob { display: block !important; }
  .mod-papel { grid-template-columns: 1fr; }
  .mod-rel { grid-template-columns: 1fr; gap: 5px; }
  .mod-versus { grid-template-columns: 1fr; }
  .mod-versus__x { justify-self: center; }
  .mv-lista__i { grid-template-columns: minmax(0,1fr); row-gap: 5px; }
  .mv-tab-wrap { overflow-x: auto; }
  .mv-tab { min-width: 620px; }
  .mv-cal-wrap { overflow-x: auto; }
  .mv-cal { min-width: 620px; }
  .mv-grafo { display: none; }
  .mv-grafo-mob { display: grid !important; }
  .mv-barra { grid-template-columns: 100px minmax(0,1fr) 40px; }
}
@media (max-width: 767px) {
  .mod-grid, .mod-grid--3, .mv-cards, .mv-kanban, .mv-dash { grid-template-columns: 1fr; }
}

.mod-orbita-mob, .mv-grafo-mob { display: none; }
.mv-grafo-mob { gap: 8px; }

@media (prefers-reduced-motion: reduce) {
  .mod-views__palco > *, .mod-card, .mod-lente { animation: none !important; transition: none !important; }
}