/* =========================================================
   P2S — ajustes da 3D Club sobre os estilos de referência
   (p2s-ref.css). Aqui ficam: o que dependia de estilo inline
   ou de bibliotecas (Swiper/MUI) na página original, os
   estados controlados por JS e os blocos comerciais.
   ========================================================= */
body.p2s { background: #121212; }
.p2s-page { overflow-x: clip; padding-top: var(--navBarHeight); }
/* texto introdutório: altura da referência (no original, var calculada por JS) */
@media (min-width: 1025px) { .p2s .css-1fwgtkj { height: calc(100vh + 320px); } }
.p2s-page img, .p2s-page video { max-width: none; }
.p2s-page button { font: inherit; }
.p2s a.linkItem, .p2s a.link { text-decoration: none; display: inline-flex; }

/* hero: o vídeo de abertura aparece sobre a imagem quando começa a tocar */
.p2s .css-1jylad0 .imgContent .video { opacity: 0; transition: opacity .4s ease-out; }
.p2s .css-1jylad0 .imgContent .video.is-ready { opacity: 1; }
.p2s .css-1jylad0 .imgContent .video.video-hidden { display: none; }

/* ---------- Carrosséis (substitui o Swiper) ---------- */
.p2s .swiper { position: relative; overflow: hidden; touch-action: pan-y; }
.p2s .swiper-wrapper { display: flex; align-items: stretch; transition: transform .4s ease; will-change: transform; position: relative; }
.p2s .swiper-wrapper.is-dragging { transition: none; cursor: grabbing; }
.p2s .swiper-slide { flex-shrink: 0; margin-right: 24px; user-select: none; }
@media (max-width: 1024px) { .p2s .swiper-slide { margin-right: 16px; } }
.p2s .swiper-slide:last-child { margin-right: 0; }
.p2s .swiper-slide img { -webkit-user-drag: none; }
.p2s .css-wchpkd .swiper-slide { width: 100%; }
.p2s .swiper-pagination-bullet { cursor: pointer; }

/* Câmera de IA: troca com esmaecimento (effect: fade) */
.p2s .css-2kbr51 .swiper-wrapper { display: block; height: 100%; transform: none !important; }
.p2s .css-2kbr51 .swiper-slide { position: absolute; inset: 0; margin: 0; opacity: 0; transition: opacity .4s ease; }
.p2s .css-2kbr51 .swiper-slide.is-active { opacity: 1; }
.p2s .MuiTabs-list { display: flex; position: relative; }
.p2s .MuiTabs-scroller { position: relative; overflow-x: auto; scrollbar-width: none; }
.p2s .MuiTabs-scroller::-webkit-scrollbar { display: none; }
.p2s .MuiTabs-scrollableX.MuiTabs-hideScrollbar:not(.MuiTabs-scroller) { display: none; }
.p2s .MuiTabs-indicator { position: absolute; bottom: 0; height: 2px; transition: left .3s, width .3s; }
.p2s .MuiTab-root { background: none; border: 0; cursor: pointer; white-space: nowrap; font-family: inherit; }

/* Perfeição, detalhe por detalhe: no computador os cartões andam na horizontal com a rolagem */
@media (min-width: 1025px) {
  .p2s .css-bx6xbd[data-hscroll] .swiper { overflow: visible; touch-action: auto; }
  .p2s .css-bx6xbd[data-hscroll] .swiper-wrapper { transition: none; transform: none !important; }
}

/* cartões MakerWorld / MakerLab / Makers Supply */
.p2s [data-makers-open]:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }

/* ---------- Painel de detalhes (substitui o Dialog do MUI) ---------- */
.makers-modal {
  position: fixed; inset: 0; z-index: 2000; overflow-y: auto; overscroll-behavior: contain;
  background: rgba(0, 0, 0, .8);
  opacity: 0; transition: opacity 225ms cubic-bezier(.4, 0, .2, 1);
}
.makers-modal.is-open { opacity: 1; }
.makers-modal .MuiDialog-paper { background: transparent; box-shadow: none; min-height: 100%; }
.makers-modal button.portal-css-14nsnos { background: none; border: 0; padding: 0; }
.makers-modal .portal-css-14nsnos svg { width: 24px; height: 24px; }

/* ---------- bloco final: oferta da loja 3D Club ---------- */
.p2sOffer {
  margin-top: var(--Content-Gap-5); display: flex; flex-direction: column; gap: 2px;
  font-size: 15px; line-height: 21px; color: #1a1a1a;
}
.p2sOffer strong { font-weight: 700; }
.p2sOffer span { font-size: 13px; line-height: 18px; color: #505050; }
@media (max-width: 1024px) { .p2sOffer { align-items: center; text-align: center; } }

/* vídeos: sem controles nativos */
.p2s video::-webkit-media-controls { display: none !important; }

/* o base.css deixa img como bloco; na referência o logo da citação é inline e centralizado */
.p2s .mediaIconContent .mediaIcon { display: inline-block; }
/* botões do hero: altura de linha do tema original (MUI) */
.p2s .buttonContent .button { font-size: 14px; line-height: 20px; }
@media (min-width: 1025px) { .p2s .buttonContent .button { font-size: 16px; line-height: 22px; } }
