/* Folha: ajustes de celular (carregado depois de main.css). */
@media (max-width: 47.5em) {
  html, body { overflow-x: clip; }
  .loader, .loader__video { overflow: hidden; }
  .loader__enter { width: 7rem; left: calc(50% - 3.5rem); }
  .loader__play, .loader__skip { width: 7rem; padding: 10px 0; }

  /* barra preta fixa por trás do logo e do menu */
  body::before { content: ""; position: fixed; top: 0; left: 0; right: 0; height: 56px; background: rgba(0,0,0,.92); backdrop-filter: blur(8px); z-index: 8999; pointer-events: none; }
  .site-logo { top: 20px; left: 20px; width: 64px; height: 17px; }
  .menu-btn { top: 6px; right: 8px; width: 92px; height: 44px; padding: 14px 12px; box-sizing: border-box; }
  .menu-btn__inner { inset: 14px 12px; }
  .menu-btn__text { font-size: 14px; line-height: 16px; }
  .menu-panel__link { font-size: 2.1rem; }

  /* texto legível */
  .text { font-size: 15px; line-height: 1.6; padding-bottom: 14px; }
  .quote { font-size: 30px; line-height: 1.2; }

  /* hero: foto em cima, chamada embaixo, sem sobreposição */
  .hero { height: auto; min-height: 0; display: flex; flex-direction: column; padding-top: 56px; }
  .hero__image { position: relative; width: 100%; height: 58svh; }
  .hero__image img { object-position: 50% 50%; }
  .hero__call { position: relative; width: 100%; height: auto; border: 0; padding: 32px 20px 40px; justify-content: flex-start; }
  .hero__box { width: 100%; max-width: none; }
  .hero__word { font-size: 3.4rem; }

  /* parallax desligado no celular: os blocos ficam onde o layout manda */
  .js-parallax, .js-img-parallax-frame, .js-img-parallax-frame img { transform: none !important; }

  /* manifesto: uma foto grande, sem colagem deslocada */
  .manifesto__small { display: none; }
  .manifesto__big { width: auto; margin: 0 20px; }
  .about-text { padding: 48px 0 64px; }

  /* menos vazio entre as seções */
  .manifesto { padding: 64px 0 96px; }
  .wide, .gallery { padding-bottom: 56px; }
  .gallery__inner { padding-top: 112% !important; }
  .gallery__slider .slide { height: 100% !important; }
  .gallery__dots { top: calc(100% + 12px) !important; }
  .gallery { padding-bottom: 88px; }
  .wide .frame { margin-bottom: 40px; }
  .manifesto__text { width: auto; margin: 0 20px; }
  .manifesto__info { padding: 0; margin-top: 48px; display: block; }
  .manifesto__quote { width: auto; padding: 0 20px 24px; }
  .manifesto__button, .about-text__button { margin: 28px 20px 0; padding-top: 0; }
  .button { max-width: none; height: 3.5rem; line-height: 3.5rem; font-size: 15px; }
  .letter { display: none; }

  /* lojas */
  .stores { padding: 56px 20px 24px; min-height: 0; display: grid; grid-template-columns: 96px 1fr; gap: 20px; align-items: center; }
  .stores__map { width: 96px; height: 96px; margin: 0; }
  .stores__list { position: static; transform: none; width: auto; }
  .stores__item { padding: 8px 0; }

  /* páginas internas */
  .about-hero { height: auto; min-height: 100svh; padding-top: 56px; }
  .about-hero__quote { top: 96px; transform: none; }
  .about-text__body { margin-left: 20px; padding-right: 20px; }

  /* rodapé com alvos de toque */
  .site-foot { margin: 72px 20px 0; height: auto; flex-wrap: wrap; gap: 8px 18px; border-bottom-width: 28px; }
  .site-foot__link { font-size: 15px; line-height: 44px; }
  .site-foot__icons { height: 44px; align-items: center; }
  .site-foot__icon { width: 24px; height: 24px; margin-left: 18px; opacity: .7; }
  .dots a { width: 2.25rem; height: 2.25rem; }

  .site-logo { padding: 14px 0; top: 6px; height: 45px; box-sizing: border-box; }
}