/* =========================================================================
   Lumin'área · o molde comum das páginas internas (06/10/2026)

   Do Histórico de ajustes do site que a Cinara mandou em 05/10, "Imagens do
   topo das páginas internas": seguir o modelo da página de evento da Bendita
   Pausa, com título curto sobre a imagem, faixa de informações logo abaixo e
   botão fixo no cabeçalho. A faixa tem quatro campos, iguais nas três
   experiências (QUANDO · DURAÇÃO · ONDE · FORMATO), e fecha com um fio de
   acabamento abaixo dos quatro campos. Sobre a imagem fica só a frase mais
   curta; o resto desce para a abertura.

   Este arquivo só desenha. Nenhuma palavra mora aqui.
   ========================================================================= */

/* ---------------------------------------------- a capa só com a frase curta */
#pagina .capa-curta .titulo-1{max-width:20ch;text-wrap:balance}
#pagina .capa-curta .capa-texto{padding-block:clamp(34px,5vh,64px)}

/* enquadramentos das fotos do topo, pelo mapa aprovado na página 1 */
#pagina .capa-olhos picture img{object-position:50% 40%}
#pagina .capa-cuidar picture img{object-position:50% 34%}
#pagina .capa-lideres picture img{object-position:50% 40%}

/* --------------------------------------------- a faixa de informações */
.faixa-info{background:var(--gelo);border-bottom:1px solid var(--areia)}
.faixa-info dl{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
  margin-block:0;margin-inline:auto;
}
.faixa-info dl > div{padding:clamp(18px,2vw,26px) 18px clamp(18px,2vw,26px) 0}
.faixa-info dl > div + div{padding-left:22px;border-left:1px solid var(--linho)}
.faixa-info dt{
  font-size:10.5px;letter-spacing:.24em;text-transform:uppercase;
  color:var(--terra);font-weight:600;margin-bottom:8px;
}
.faixa-info dd{margin:0;font-size:15px;line-height:1.5;color:var(--tinta);text-wrap:pretty}
@media (max-width:760px){
  .faixa-info dl{grid-template-columns:repeat(2,minmax(0,1fr))}
  .faixa-info dl > div:nth-child(3){padding-left:0;border-left:0}
  .faixa-info dl > div:nth-child(n+3){border-top:1px solid var(--linho)}
}

/* "Conduzido por Cinara Bastos", a linha pequena logo abaixo da faixa */
.faixa-info + .corpo-pagina{padding-top:clamp(16px,1.8vw,22px)}
.conduzido{
  margin:0 0 clamp(30px,3.6vw,48px);font-size:13.5px;letter-spacing:.02em;
  color:var(--tinta-suave);text-wrap:pretty;
}
.conduzido a{
  color:var(--tinta);text-decoration:underline;
  text-decoration-color:var(--areia);text-underline-offset:3px;
}
.conduzido a:hover{text-decoration-color:var(--luz)}

/* ------------------------------------- o botão fixo no cabeçalho da página */
.pagina-barra .pagina-acao{
  flex:none;order:5;margin-left:clamp(12px,1.6vw,22px);
  padding:12px 18px;font-size:10.5px;letter-spacing:.2em;white-space:nowrap;
}
@media (max-width:860px){
  .pagina-barra .pagina-acao{padding:11px 14px;letter-spacing:.14em}
}
@media (max-width:430px){
  .pagina-barra .pagina-marca{order:1}
  .pagina-barra .pagina-acao{order:2;margin-left:auto;padding:10px 12px;font-size:10px;letter-spacing:.1em}
  .pagina-barra .pagina-menu{order:3}
}

/* --------------------------------------------- o percurso, passo a passo */
.sm-capacidades.percurso li p{font-size:15.5px;line-height:1.65;color:var(--tinta-suave)}
.sm-capacidades.percurso li p b{color:var(--tinta);font-weight:600}
.sm-capacidades.sm-cinco{grid-template-columns:repeat(5,minmax(0,1fr))}
@media (max-width:1040px){
  .sm-capacidades.sm-cinco{grid-template-columns:1fr 1fr}
}
@media (max-width:820px){
  .sm-capacidades.sm-cinco{grid-template-columns:1fr}
}
.corpo-pagina .sm-fluxo.antes{margin:0 0 22px;text-wrap:pretty;max-width:none}
.corpo-pagina .sm-bloco > .percurso + p{margin-top:24px}

/* a frase que assina cada página */
.assina{
  font-size:clamp(22px,2.2vw,30px);line-height:1.32;letter-spacing:-.022em;
  color:var(--tinta);font-weight:500;max-width:34ch;text-wrap:balance;margin:0;
}
.corpo-pagina .sm-bloco > .assina + p{margin-top:16px}

/* as notas de cuidado, em itálico, como no documento dela */
.corpo-pagina .sm-bloco > p.nota{font-size:14px;line-height:1.65;color:var(--tinta-suave);font-style:italic;margin-top:20px}

/* o rótulo de uma porta, em caixa alta pequena */
.corpo-pagina .porta-nome{
  margin:0 0 10px;font-size:12px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--terra);font-weight:600;
}

/* Para Empresas: o que a parceria entrega, com a Cinara na condução */
.entrega{list-style:none;margin:26px 0 0;padding:0;max-width:72ch}
.entrega > li{padding:20px 0;border-top:1px solid var(--linho);font-size:16.5px;line-height:1.62;color:var(--tinta)}
.entrega > li:last-child{border-bottom:1px solid var(--linho)}
.entrega > li b{font-weight:600}
.entrega .conduz-empresa{margin:0}
.entrega .conduz-empresa p{font-size:16.5px;line-height:1.62;color:var(--tinta);margin:0}

/* Vivências: os quatro campos novos de escolha */
.campo-opcoes{border:0;margin:0 0 22px;padding:0;min-width:0}
.campo-opcoes legend{
  display:block;font-size:11px;text-transform:uppercase;letter-spacing:.24em;
  color:var(--terra);margin-bottom:10px;padding:0;
}
.campo-opcoes label{
  display:flex;align-items:center;gap:12px;padding:10px 0;
  font-size:15.5px;line-height:1.45;color:var(--tinta);cursor:pointer;
}
.campo-opcoes input{width:18px;height:18px;flex:none;accent-color:var(--pedra-funda);margin:0}
.campo .opcional{text-transform:none;letter-spacing:.02em;color:var(--rotulo)}

/* 06/10, pedido da Cinara (05/10, 23h34, com print): "todos os botões no
   mesmo padrão e tamanho em Experiências, e sem quebrar o nome da
   atividade". Os três "Conhecer a ..." dos cartões ganham a largura do
   cartão, o mesmo alto e o nome numa linha só, no computador e no celular. */
#pagina .portas-exp .bloco-acoes{display:block}
#pagina .portas-exp .bloco-acoes .btn-linha{
  display:flex;width:100%;justify-content:center;text-align:center;
  white-space:nowrap;line-height:1;padding:19px 14px;letter-spacing:.2em;
}
@media (min-width:761px) and (max-width:1180px){
  #pagina .portas-exp .bloco-acoes .btn-linha{letter-spacing:.1em;font-size:10.5px;padding-inline:10px}
}

/* 06/10: o retrato da Cinara junto ao "Quem conduz" do Self Mentoring */
#sm-bio .conduz-sm{margin-top:0}
#sm-bio .conduz-sm .conduz-retrato{width:clamp(110px,12vw,160px)}
#sm-bio .conduz-sm p{margin-top:0}
