:root {
  --bg-ivory: #FAF7F2;
  --text-brown: #5C4033;
}

html,
body {
  background-color: var(--bg-ivory);
  color: var(--text-brown);
  font-family: 'Lato', sans-serif;
  margin: 0;
  padding: 0;
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
}

/* Textura sutil reutilizável da marca (carregada uma única vez pelo navegador) */
.bg-brand-texture {
  background-image: url('./componentes%20enxoval%20leve/imagem%20de%20fundo%20do%20site.jpg');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

/* Otimização de renderização mobile para categorias fora da tela inicial */
.category-block {
  content-visibility: auto;
  contain-intrinsic-size: 1px 520px;
}

/* Classes utilitárias de fontes */
.font-cabin-sketch {
  font-family: 'Cabin Sketch', cursive;
}

/* Garante que o coração (♥) nunca vire emoji vermelho no telemóvel (iOS/Android) */
.heart-brown {
  color: #5C4033;
  font-variant-emoji: text;
  font-style: normal;
}

.font-economica {
  font-family: 'Economica', sans-serif;
}

.font-lato {
  font-family: 'Lato', sans-serif;
}

.font-proxima {
  font-family: 'Proxima Nova', 'Montserrat', sans-serif;
}

/* Animação suave de Marquee (Loop Infinito acelerado por GPU) */
@keyframes marquee {
  0% {
    transform: translate3d(0%, 0, 0);
  }
  100% {
    transform: translate3d(-50%, 0, 0);
  }
}

.animate-marquee {
  display: flex;
  width: max-content;
  will-change: transform;
  animation: marquee 28s linear infinite;
}

.animate-marquee:hover {
  animation-play-state: paused;
}