/* Entrada pública: o planejamento é a demonstração, sem uma camada decorativa. */
.portal-body, .acesso-body { min-height: 100dvh; background: var(--fundo); color: var(--texto); }
.portal-wrap { max-width: 1264px; margin-inline: auto; padding-inline: var(--space-8); }
.portal-cabecalho { display: flex; align-items: center; justify-content: space-between; gap: var(--space-6); min-height: 88px; border-bottom: 1px solid var(--linha); }
.portal-marca { display: inline-flex; align-items: center; flex: 0 0 auto; min-height: var(--control-size); color: var(--texto); }
.portal-logotipo { display: block; width: 112px; height: 32px; background: currentColor; mask: url("./marca.svg") center/contain no-repeat; -webkit-mask: url("./marca.svg") center/contain no-repeat; }
.portal-nav { display: flex; align-items: center; gap: var(--space-6); font-size: var(--font-sm); }
.portal-nav a:not(.btn), .portal-link, .portal-rodape a { display: inline-flex; align-items: center; min-height: var(--control-size); min-width: var(--control-size); justify-content: center; color: inherit; text-decoration: none; }
.portal-nav a:not(.btn):hover, .portal-link:hover, .portal-rodape a:hover { text-decoration: underline; text-underline-offset: 4px; }
.portal-body .btn, .acesso-body .btn { min-height: var(--control-size); padding: var(--space-2) var(--space-4); border-radius: var(--r-md); gap: var(--space-2); font-size: var(--font-sm); font-weight: 600; line-height: 1.4; box-shadow: none; }
.portal-body .btn.primary, .acesso-body .btn.primary { background: var(--destaque); color: var(--fundo); border-color: var(--destaque); }
.portal-body .btn.primary:hover, .acesso-body .btn.primary:hover { background: color-mix(in srgb, var(--destaque) 90%, var(--texto)); border-color: transparent; }
.portal-hero { display: grid; grid-template-columns: 1.06fr 1fr; align-items: center; gap: var(--space-16); padding-block: var(--space-16); }
.portal-hero-texto { min-width: 0; }
.portal-hero h1 { margin: 0; font: 300 var(--font-3xl)/1.08 var(--font-voz); letter-spacing: -.025em; text-wrap: balance; }
.portal-descricao { max-width: 52ch; margin: var(--space-6) 0; color: var(--texto-2); font-size: var(--font-md); line-height: 1.5; }
.portal-hero-acoes { display: flex; align-items: center; flex-wrap: wrap; gap: var(--space-2) var(--space-6); }
.portal-cta { flex: 0 0 auto; }
.portal-link { font-size: var(--font-sm); }
.portal-local, .portal-contas { max-width: 58ch; margin: var(--space-4) 0 0; color: var(--texto-2); font-size: var(--font-xs); line-height: 1.6; }
.portal-contas { margin-top: var(--space-2); }
.portal-previa { min-width: 0; border: 1px solid var(--linha-forte); border-radius: var(--r-xl); background: var(--superficie); overflow: hidden; }
.portal-previa-topo { display: flex; align-items: center; gap: var(--space-3); border-bottom: 1px solid var(--linha); padding: var(--space-4) var(--space-6); color: var(--texto-2); font-size: var(--font-xs); }
.portal-previa-corpo { padding: var(--space-6); }
.portal-previa-titulo { display: flex; align-items: baseline; justify-content: space-between; gap: var(--space-3); margin-bottom: var(--space-6); }
.portal-previa h2 { font: 400 var(--font-lg)/1.3 var(--font-voz); margin: 0; letter-spacing: -.01em; }
.portal-previa-titulo > span { color: var(--texto-2); font-size: var(--font-xs); }
.portal-exemplo { display: grid; grid-template-columns: 48px minmax(0, 1fr); gap: var(--space-4); padding-bottom: var(--space-6); }
.portal-exemplo b { display: block; font-size: var(--font-sm); font-weight: 600; line-height: 1.4; }
.portal-exemplo small { display: block; margin-top: var(--space-1); font-size: var(--font-xs); color: var(--texto-2); line-height: 1.5; }
.portal-exemplo-hora { padding-top: 2px; color: var(--destaque); font-size: var(--font-sm); font-weight: 600; font-variant-numeric: tabular-nums; }
.portal-previa h3 { margin: 0 0 var(--space-3); font: 600 var(--font-sm)/1.5 var(--font); }
.portal-previa-rotinas { padding-top: var(--space-4); border-top: 1px solid var(--linha); }
.portal-previa-rotinas > div { display: flex; flex-wrap: wrap; gap: var(--space-3) var(--space-6); }
.portal-previa-rotinas > div > span { display: inline-flex; align-items: center; gap: var(--space-2); font-size: var(--font-sm); }
.portal-check { display: inline-grid; place-items: center; border: 1px solid var(--linha-forte); border-radius: var(--r-xs); width: 18px; height: 18px; flex: 0 0 18px; font-size: var(--font-xs); }
.portal-check.feita { border-color: var(--destaque); background: var(--destaque); color: var(--fundo); }
.portal-previa-planos { margin-top: var(--space-6); padding-top: var(--space-4); border-top: 1px solid var(--linha); }
.portal-previa-planos p { margin: var(--space-2) 0 0; color: var(--texto-2); font-size: var(--font-xs); line-height: 1.5; }
.portal-previa-legenda { margin: 0; padding: var(--space-3) var(--space-6); border-top: 1px solid var(--linha); color: var(--texto-2); font-size: var(--font-xs); line-height: 1.5; }
.portal-possibilidades { display: grid; grid-template-columns: .85fr 1.65fr; gap: var(--space-16); padding-block: var(--space-16); border-top: 1px solid var(--linha); scroll-margin-top: var(--space-6); }
.portal-secao-cab h2, .portal-convite h2 { margin: 0; font: 400 var(--font-xl)/1.2 var(--font-voz); letter-spacing: -.015em; text-wrap: balance; }
.portal-recursos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-6); }
.portal-recursos h3 { margin: 0 0 var(--space-3); font: 400 var(--font-md)/1.3 var(--font-voz); }
.portal-recursos p { margin: 0; color: var(--texto-2); font-size: var(--font-sm); line-height: 1.5; }
.portal-convite { display: flex; justify-content: space-between; align-items: center; gap: var(--space-8); padding-block: var(--space-12); border-block: 1px solid var(--linha); }
.portal-convite h2 { max-width: 30ch; font-size: var(--font-lg); }
.portal-convite p { margin: var(--space-2) 0 0; color: var(--texto-2); font-size: var(--font-sm); }
.portal-rodape { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: var(--space-4) var(--space-6); min-height: 96px; padding-block: var(--space-4); color: var(--texto-2); font-size: var(--font-xs); }
.portal-rodape .portal-logotipo { width: 92px; height: 26px; }
.portal-pular { position: fixed; z-index: 100; top: var(--space-2); left: var(--space-2); min-height: var(--control-size); padding: var(--space-3) var(--space-4); background: var(--destaque); color: var(--fundo); border-radius: var(--r-md); transform: translateY(-150%); }
.portal-pular:focus { transform: none; }
.portal-body :focus-visible, .acesso-body :focus-visible { outline: 2px solid var(--destaque); outline-offset: 4px; }
@media (max-width: 1050px) {
  .portal-hero, .portal-possibilidades { gap: var(--space-8); }
  .portal-hero h1 { font-size: var(--font-2xl); }
  .portal-descricao { font-size: var(--font-sm); }
  .portal-possibilidades { grid-template-columns: 1fr; }
  .portal-secao-cab h2 { max-width: 30ch; }
}
@media (max-width: 700px) {
  .portal-wrap { padding-inline: var(--space-4); }
  .portal-cabecalho { min-height: 76px; gap: var(--space-4); }
  .portal-logotipo { width: 96px; height: 28px; }
  .portal-nav { gap: var(--space-4); }
  .portal-nav .btn { padding-inline: var(--space-3); }
  .portal-conhecer { display: none !important; }
  .portal-hero { grid-template-columns: 1fr; padding-block: var(--space-12); gap: var(--space-8); }
  .portal-hero h1 { font-size: var(--font-2xl); }
  .portal-descricao { margin-block: var(--space-4) var(--space-6); }
  .portal-hero-acoes { gap: var(--space-2) var(--space-4); }
  .portal-previa-corpo { padding: var(--space-6) var(--space-4); }
  .portal-previa-topo, .portal-previa-legenda { padding-inline: var(--space-4); }
  .portal-previa-titulo { gap: var(--space-2); }
  .portal-previa-titulo > span { text-align: right; }
  .portal-possibilidades { padding-block: var(--space-12); }
  .portal-secao-cab h2 { font-size: var(--font-lg); }
  .portal-recursos { grid-template-columns: 1fr; gap: var(--space-8); }
  .portal-recursos article { max-width: 60ch; }
  .portal-convite { align-items: flex-start; flex-direction: column; padding-block: var(--space-8); gap: var(--space-6); }
}
@media (max-width: 359px) {
  .portal-nav { gap: var(--space-2); }
  .portal-nav .btn { padding-inline: var(--space-2); }
  .portal-hero h1 { font-size: var(--font-xl); }
}

.portal-previa .costura { padding: 0; margin: 0 0 var(--space-6); list-style: none; }
.portal-previa .agenda-linha { grid-template-columns: 32px 44px 12px minmax(0,1fr); column-gap: var(--space-2); }
.portal-previa .agenda-texto .t { font-size: var(--font-sm); }