* {
  box-sizing: border-box;
}

html, body {
  width: 100%;
  height: 100%;
  overflow: hidden;
}

body {
  margin: 0;
  font-family: 'Poppins', sans-serif;
  background: linear-gradient(135deg, #e8dcf8, #cfd4f7);
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Conteúdo */
.conteudo {
  text-align: center;
  max-width: 620px;
  padding: 20px;
  position: relative;
  z-index: 2;
}

/* Logo */
.logo {
  max-width: 420px;
  margin-bottom: 18px;
}

/* Título */
.conteudo h1 {
  font-size: 30px;
  font-weight: 600;
  margin-bottom: 14px;
}

/* Texto */
.conteudo p {
  font-size: 16px;
  font-weight: 300;
  margin-bottom: 26px;
}

/* Botões */
.links {
  display: flex;
  justify-content: center;
  gap: 14px;
  flex-wrap: wrap;
}

.botao {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 22px;
  border-radius: 22px;
  background: rgba(255, 255, 255, 0.75);
  border: 1.5px solid rgba(200, 200, 200, 0.6);
  font-size: 14.5px;
  font-weight: 400;
  color: #444;
  text-decoration: none;
  transition: all 0.35s ease;
}

.botao span {
  transition: transform 0.35s ease;
}

.botao:hover span {
  transform: translateX(2px);
}

.botao i {
  font-size: 18px;
}

.botao:hover {
  transform: translateY(-3px);
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 10px 24px rgba(0,0,0,0.08);
}

/* Cores dos botões */
.botao.instagram {
  background: rgba(248, 230, 242, 0.7);
}

.botao.whatsapp {
  background: rgba(230, 248, 242, 0.7);
}

.botao.catalogo {
  background: rgba(236, 242, 236, 0.7);
}

.botao.instagram i { color: #c46aa3; }
.botao.whatsapp i { color: #5fbf9a; }
.botao.catalogo i { color: #7a8f7a; }

/* Borboletas */
.butterflies {
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 1;
}

.butterfly {
  position: absolute;
  font-size: 22px;
  opacity: 0.75;
  transform: translate(var(--x), var(--y)) scaleX(1) rotate(0deg);
  transform-origin: center;
  animation: flutter 1.8s ease-in-out infinite;
}

@keyframes flutter {
  0%, 100% {
    transform: translate(var(--x), var(--y)) scaleX(1) rotate(0deg);
    opacity: 0.7;
  }
  50% {
    transform: translate(var(--x), var(--y)) scaleX(0.85) rotate(4deg);
    opacity: 0.85;
  }
}

/* Mobile */
@media (max-width: 480px) {
  .logo {
    max-width: 280px;
  }

  .conteudo h1 {
    font-size: 24px;
  }

  .links {
    flex-direction: column;
    align-items: center;
  }

  .botao {
    width: 100%;
    max-width: 260px;
    justify-content: center;
  }

  .butterfly {
    font-size: 18px;
  }
}
/* ================= RESET TOTAL DO TEMA LOJA INTEGRADA ================= */

/* Esconde completamente estrutura do tema */
header,
footer,
#header,
#footer,
.top-bar,
.header,
.footer,
.menu,
.nav,
.navigation,
.breadcrumb,
.barra-busca,
.busca,
.search,
.carrinho,
.cart,
.minicart,
.account,
.minha-conta,
.seals,
.selos,
.social,
.newsletter,
.paginas,
.home,
[class*="header"],
[class*="footer"],
[class*="menu"],
[class*="nav"],
[class*="search"],
[class*="cart"],
[class*="account"],
[class*="breadcrumb"] {
  display: none !important;
}

/* Remove containers que empurram layout */
body > div,
body > section,
body > header,
body > footer {
  display: none !important;
}

/* Reativa APENAS nossa página */
.butterflies,
.conteudo {
  display: block !important;
}

/* Tela cheia real */
html, body {
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}

/* Centralização absoluta */
body {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: linear-gradient(135deg, #e8dcf8, #cfd4f7) !important;
}

/* Conteúdo central fixo */
main.conteudo {
  position: relative !important;
  inset: unset !important;
  margin: 0 auto !important;
  transform: none !important;
}

/* ================= MOBILE: REMOVE BARRA SUPERIOR ================= */
@media (max-width: 768px) {
  .barra-mobile,
  .menu-mobile,
  .nav-mobile,
  .mobile-nav,
  .bottom-nav,
  .home-button,
  .icon-home,
  [class*="mobile"],
  [class*="bottom"],
  [class*="fixed"] {
    display: none !important;
  }
}
/* ================= FUNDO GRADIENTE ANIMADO ================= */

html,
body {
  background: linear-gradient(
    135deg,
    #e8dcf8,
    #cfd4f7,
    #f2e9fb,
    #dfe4fa
  ) !important;

  background-size: 600% 600% !important;
  animation: fundoSerendipity 22s ease infinite !important;
}

/* Remove fundos do tema */
.container,
.conteiner,
.row,
.col,
.page,
.pagina,
.home,
.wrapper,
.content,
#content,
#page,
#main,
[class*="container"],
[class*="conteiner"],
[class*="row"],
[class*="col"],
[class*="page"],
[class*="pagina"],
[class*="home"],
[class*="wrapper"] {
  background: transparent !important;
}

/* Camada de fundo definitiva */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  background: linear-gradient(
    135deg,
    #e8dcf8,
    #cfd4f7,
    #f2e9fb,
    #dfe4fa
  );
  background-size: 600% 600%;
  animation: fundoSerendipity 22s ease infinite;
  z-index: -1;
}

/* Animação suave */
@keyframes fundoSerendipity {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}