/* colunas.css (14/10/2026): a fila de colunas de lado + o que o livro/deck muda no slider do template */
a, button, input, select, textarea, [tabindex] { outline: none; -webkit-tap-highlight-color: transparent; }
:focus, :focus-visible { outline: none; box-shadow: none; }
html, body { height: 100%; margin: 0; overflow: hidden; overscroll-behavior: none; background: #fff; }
body { touch-action: none; }
.main, .colunas { height: 100vh; height: 100dvh; }
.swiper.is-colunas { width: 100vw; height: 100%; overflow: hidden; touch-action: none; }
.swiper.is-colunas > .swiper-wrapper { height: 100%; }
.coluna { width: 100vw; height: 100%; }
.coluna .hero_component { height: 100%; }
.swiper-wrapper.is-main { visibility: hidden; }
.pronto .swiper-wrapper.is-main { visibility: visible; }

/* listas: um título por linha; os títulos são div (sem link), com mão */
.project-title { cursor: pointer; }
.titles-list.muitos { grid-row-gap: .35rem; }
.titles-list.muitos .project-title { align-items: center; }
.titles-list.muitos .titles-dot { height: 1.1rem; width: .5rem; }
.titles-list.muitos .text-18px { font-size: 1rem; }
.slide-arrow { cursor: pointer; }

/* livro: a página do slider (creme, borda fina como o banner do template) com o texto dentro, com respiro */
.project-visual-wrapper.pagina { background: #fffff5; border: 1px solid rgba(49, 49, 41, .5); box-sizing: border-box; }
.pagina .project-visual-image { background: #fffff5; }
.pagina-txt { position: absolute; inset: 0; box-sizing: border-box; padding: 2.4rem 4.2rem; display: flex; flex-direction: column; justify-content: center; gap: .9rem; color: #313129; }
.pagina-nome { font-family: Schmalfettecp, sans-serif; font-size: 2.2rem; line-height: 1; letter-spacing: .025rem; }
.pagina-txt p { margin: 0; font-family: 'Avoidance Genevra', sans-serif; font-size: 1.05rem; line-height: 1.45; text-wrap: pretty; }

/* a caixa de baixo (no template, o vídeo do projeto ativo): a página ativa reta, para ler */
.video_component { background: #fffff5; }
.leitura { position: absolute; inset: 0; box-sizing: border-box; padding: 2.2rem 3.4rem; display: flex; flex-direction: column; justify-content: center; gap: .8rem; color: #313129; }
.leitura-nome { font-family: Schmalfettecp, sans-serif; font-size: 2rem; line-height: 1; }
.leitura p { margin: 0; font-family: 'Avoidance Genevra', sans-serif; font-size: 1.13rem; line-height: 1.45; text-wrap: pretty; }

/* deck: carta inteira 9:16, nunca cortada (sem o zoom e o deslocamento da foto do template) */
.deck .swiper.is-main { width: 16rem; height: 28.44rem; }
.deck .swiper-slide.is-main { height: 28.44rem; }
.deck .project-visual-wrapper { border-radius: 0; overflow: visible; }
.deck .project-visual-image.carta { width: 100%; height: 100%; inset: 0; background-size: contain; background-position: 50% 50%; transform: none !important; }
.deck .project-highlight { width: 30rem; height: 30rem; }
.deck .video_component { background: #fff; }
.deck .leitura { padding: 1.1rem; }
.deck .leitura img { width: 100%; height: 100%; object-fit: contain; display: block; user-select: none; -webkit-user-select: none; }

/* celular: o template mostrava "só no computador"; aqui funciona: dedo para cima/baixo = páginas, para o lado = colunas */
@media screen and (max-width: 991px) {
  .page-banner { display: none !important; }
  .titles_component, .slide-arrows_component { display: none; }
  .swiper-slider_component { margin-top: -16vh; }
  .swiper.is-main { width: 74vw; height: 37vw; }
  .swiper-slide.is-main { height: 37vw; }
  .project-visual-wrapper { border-radius: 5vw; }
  .pagina-txt { padding: 4.5vw 7vw; gap: 1.6vw; }
  .pagina-nome { font-size: 5vw; }
  .pagina-txt p { font-size: 2.15vw; line-height: 1.4; }
  .banner_component { padding: 1.4rem 2.2rem; grid-row-gap: .5rem; border-bottom-right-radius: 1.8rem; }
  .banner-heading { font-size: 2.4rem; }
  .banner-link { font-size: .95rem; }
  .video_component { left: 16px; right: 16px; bottom: 16px; width: auto; height: 34vh; height: 34dvh; margin: 0; }
  .leitura { padding: 1.6rem 2rem; gap: .6rem; }
  .leitura-nome { font-size: 1.7rem; }
  .leitura p { font-size: 15px; }
  .deck .swiper.is-main { width: 27vw; height: 48vw; }
  .deck .swiper-slide.is-main { height: 48vw; }
  .deck .swiper-slider_component { margin-top: -18vh; }
  .deck .video_component { height: 30vh; height: 30dvh; }
  .deck .leitura { padding: .8rem; }
}