/* ==========================================================================
   v2.css — seções da virada AI-first
   Aditivo. Não sobrescreve nada de sections/components/layout.
   Só entra aqui o que não existia: barra de clientes, biblioteca de sistemas,
   pilares, preço aberto, quem constrói, tipos de sistema.
   ========================================================================== */

/* --- marcador de conteúdo pendente ------------------------------------- */
.todo{
  display:inline-block;font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;
  padding:3px 8px;border:1px dashed currentColor;opacity:.6;vertical-align:middle;
}

/* --- barra de clientes (SEM USO no index desde 31/08/2026) ---------------
   Removida da home a pedido: nomear 4 segmentos fazia o visitante de outro
   setor concluir que nao e' atendido. O CSS fica porque a barra volta em
   uma linha de markup se um dia a lista de setores ficar ampla o bastante
   para incluir em vez de excluir. */
.clients{
  display:flex;flex-wrap:wrap;align-items:center;gap:clamp(20px,4vw,56px);
  padding-block:clamp(18px,2.5vw,26px);
  border-block:1px solid var(--hairline-dark);
}
.section-light .clients{border-block-color:var(--hairline-light)}
.clients-label{
  font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--text-lo);flex:0 0 auto;
}
.section-light .clients-label{color:var(--ink-text-lo)}
.clients-row{display:flex;flex-wrap:wrap;align-items:center;gap:clamp(18px,3.5vw,44px)}
.client-name{
  font-family:var(--font-display);font-weight:600;font-size:clamp(1rem,1.6vw,1.35rem);
  letter-spacing:-.02em;color:var(--text-md);
}
.section-light .client-name{color:var(--ink-text-md)}

/* --- biblioteca de sistemas rodando ------------------------------------ */


/* estado sem vídeo ainda: grade técnica + rótulo. Não parece quebrado. */

/* --- tipos de sistema --------------------------------------------------- */
.btypes{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--hairline-light)}
.section-dark .btypes{background:var(--hairline-dark)}
@media (max-width:820px){.btypes{grid-template-columns:1fr}}
.btype{background:var(--paper);padding:clamp(24px,3vw,40px);display:flex;flex-direction:column;gap:12px}
.section-dark .btype{background:var(--ink)}
.btype-n{font-size:.72rem;letter-spacing:.16em;color:var(--ink-text-lo)}
.section-dark .btype-n{color:var(--text-lo)}
.btype-t{font-family:var(--font-display);font-weight:600;font-size:clamp(1.15rem,2vw,1.6rem);letter-spacing:-.025em}
.btype-d{font-size:.98rem;line-height:1.6;color:var(--ink-text-md);margin:0}
.section-dark .btype-d{color:var(--text-md)}
.btype-items{list-style:none;padding:0;margin:6px 0 0;display:flex;flex-wrap:wrap;gap:8px}
.btype-items li{
  font-size:.82rem;padding:5px 10px;border:1px solid var(--hairline-light);
  color:var(--ink-text-md);
}
.section-dark .btype-items li{border-color:var(--hairline-dark);color:var(--text-md)}

/* --- quatro pilares ----------------------------------------------------- */
.pillars{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--hairline-dark)}
.section-light .pillars{background:var(--hairline-light)}
@media (max-width:960px){.pillars{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.pillars{grid-template-columns:1fr}}
.pillar{background:var(--ink);padding:clamp(22px,2.6vw,34px);display:flex;flex-direction:column;gap:12px}
.section-light .pillar{background:var(--paper)}
.pillar-t{font-family:var(--font-display);font-weight:600;font-size:clamp(1.05rem,1.7vw,1.3rem);letter-spacing:-.025em;line-height:1.15}
.pillar-d{font-size:.94rem;line-height:1.6;color:var(--text-md);margin:0}
.section-light .pillar-d{color:var(--ink-text-md)}

/* --- preço aberto ------------------------------------------------------- */

.price-drivers{margin-top:clamp(32px,4vw,52px)}
.price-drivers-t{
  font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--text-lo);margin-bottom:18px;
}
.section-light .price-drivers-t{color:var(--ink-text-lo)}
.drivers{list-style:none;padding:0;margin:0;display:grid;gap:0}
.drivers li{
  display:grid;grid-template-columns:26px 1fr;gap:14px;align-items:start;
  padding-block:15px;border-top:1px solid var(--hairline-dark);
  font-size:.98rem;line-height:1.55;color:var(--text-md);
}
.section-light .drivers li{border-top-color:var(--hairline-light);color:var(--ink-text-md)}
.drivers li:last-child{border-bottom:1px solid var(--hairline-dark)}
.section-light .drivers li:last-child{border-bottom-color:var(--hairline-light)}
.drivers li b{color:var(--text-hi);font-weight:600}
.section-light .drivers li b{color:var(--ink-text-hi)}
.driver-n{font-size:.78rem;letter-spacing:.1em;color:var(--text-lo);padding-top:3px}
.section-light .driver-n{color:var(--ink-text-lo)}

/* --- quem constrói ------------------------------------------------------ */

/* --- foto do time (ilustrativa) ----------------------------------------- */
.team-shot{
  margin:0;overflow:hidden;border-radius:var(--radius);
  border:1px solid var(--hairline-light);
}
.section-dark .team-shot{border-color:var(--hairline-dark)}
.team-shot img{width:100%;height:auto;display:block;aspect-ratio:16/9;object-fit:cover}
