/* =============================================================================
   LP REAL BLOCOS — Real Blocos e Pavers
   Paleta: verde militar + cinza (pedido explícito do cliente no briefing),
   estilo moderno e objetivo. Tipografia: Barlow Condensed (títulos, condensada
   e robusta — remete a construção/concreto) + Inter (corpo de texto).
============================================================================= */

:root {
  /* Verde militar — marca */
  --verde-950: #1a2116;
  --verde-900: #212a1b;
  --verde-800: #2c3624;
  --verde-700: #3b4830;
  --verde-600: #4c5c3e;
  --verde-500: #5e7049;
  --verde-400: #7c8f66;
  --verde-300: #a3b48e;
  --verde-100: #e6eadd;

  /* Cinza — apoio */
  --cinza-950: #1c1d1a;
  --cinza-800: #34362f;
  --cinza-600: #5b5e54;
  --cinza-400: #8c8f84;
  --cinza-200: #d9dbd2;
  --cinza-100: #eceee7;
  --cinza-50:  #f6f7f3;

  --branco: #ffffff;

  --fonte-titulo: 'Barlow Condensed', 'Arial Narrow', sans-serif;
  --fonte-corpo: 'Inter', system-ui, -apple-system, sans-serif;

  --raio: 10px;
  --raio-lg: 18px;
  --sombra: 0 10px 30px -12px rgba(26, 33, 22, 0.35);
  --sombra-sm: 0 4px 14px -6px rgba(26, 33, 22, 0.25);

  --largura-max: 1180px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 84px; }

body {
  margin: 0;
  font-family: var(--fonte-corpo);
  color: var(--cinza-800);
  background: var(--branco);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

img { max-width: 100%; display: block; }

h1, h2, h3 {
  font-family: var(--fonte-titulo);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.01em;
  line-height: 1.08;
  margin: 0 0 0.5em;
  color: var(--verde-950);
}

h2 { font-size: clamp(2rem, 4vw, 2.8rem); }
h3 { font-size: 1.35rem; }

p { line-height: 1.7; margin: 0 0 1em; color: var(--cinza-600); }

a { color: inherit; text-decoration: none; }

.eyebrow {
  display: inline-block;
  font-family: var(--fonte-corpo);
  font-weight: 700;
  font-size: 0.78rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--verde-600);
  margin-bottom: 0.75em;
}
.eyebrow--claro { color: var(--verde-300); }

.pilula {
  display: inline-flex;
  align-items: center;
  padding: 0.4em 1em;
  border-radius: 999px;
  background: rgba(255,255,255,0.14);
  border: 1px solid rgba(255,255,255,0.35);
  color: var(--branco);
  font-family: var(--fonte-corpo);
  font-weight: 600;
  font-size: 0.8rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-bottom: 1.3em;
  backdrop-filter: blur(3px);
}

/* ---------- Botões ---------- */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.55em;
  font-family: var(--fonte-corpo);
  font-weight: 700;
  font-size: 1rem;
  letter-spacing: 0.02em;
  padding: 0.95em 1.9em;
  border-radius: var(--raio);
  border: none;
  cursor: pointer;
  transition: transform 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
  text-align: center;
}
.btn--primario {
  background: var(--verde-500);
  color: var(--branco);
  box-shadow: var(--sombra-sm);
}
.btn--primario:hover { background: var(--verde-600); transform: translateY(-2px); box-shadow: var(--sombra); }
.btn--sm { padding: 0.6em 1.3em; font-size: 0.88rem; }
.btn--lg { padding: 1.05em 2.3em; font-size: 1.08rem; }
.btn--full { width: 100%; }
.btn--whats {
  background: #25D366;
  color: var(--branco);
}
.btn--whats:hover { background: #1fb958; transform: translateY(-2px); box-shadow: var(--sombra); }
.btn--whats svg { width: 20px; height: 20px; flex-shrink: 0; }

/* Botão secundário (contorno) — usado no "Quero saber mais!" da seção Sobre. */
.btn--secundario {
  background: transparent;
  color: var(--verde-700);
  border: 2px solid var(--verde-500);
}
.btn--secundario:hover { background: var(--verde-500); color: var(--branco); transform: translateY(-2px); }

/* Botão claro (fundo branco) — usado sobre fundos escuros, como o CTA da
   seção Autoridade. */
.btn--claro { background: var(--branco); color: var(--verde-900); box-shadow: var(--sombra-sm); }
.btn--claro:hover { background: var(--verde-100); transform: translateY(-2px); box-shadow: var(--sombra); }

/* Pedido do cliente (11/08): "botão pulsante". Pulso sutil de anel, no
   mesmo espírito do botão flutuante do WhatsApp (pulsaWhats). */
.btn--pulsante { animation: pulsaBotao 2.4s ease-in-out infinite; }
@keyframes pulsaBotao {
  0%, 100% { box-shadow: 0 0 0 0 rgba(94, 112, 73, 0.5); }
  50%      { box-shadow: 0 0 0 11px rgba(94, 112, 73, 0); }
}

/* ---------- Botão flutuante do WhatsApp ---------- */
.whats-flutuante {
  position: fixed;
  right: 20px;
  bottom: 20px;
  width: 58px;
  height: 58px;
  border-radius: 50%;
  background: #25D366;
  color: var(--branco);
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 10px 24px -6px rgba(0,0,0,0.4);
  z-index: 500;
  animation: pulsaWhats 2.6s ease-in-out infinite;
}
.whats-flutuante svg { width: 30px; height: 30px; }
.whats-flutuante:hover { transform: scale(1.06); }

@keyframes pulsaWhats {
  0%, 100% { box-shadow: 0 10px 24px -6px rgba(0,0,0,0.4), 0 0 0 0 rgba(37,211,102,0.55); }
  50% { box-shadow: 0 10px 24px -6px rgba(0,0,0,0.4), 0 0 0 10px rgba(37,211,102,0); }
}

/* ===================== CABEÇALHO ===================== */
.topo {
  position: sticky;
  top: 0;
  z-index: 400;
  background: rgba(255,255,255,0.92);
  backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--cinza-100);
}
.topo__inner {
  max-width: var(--largura-max);
  margin: 0 auto;
  padding: 0.7rem 1.4rem;
  display: flex;
  align-items: center;
  gap: 1.6rem;
}
.topo__marca { display: flex; align-items: center; flex-shrink: 0; }
.topo__logo { height: 42px; width: auto; }
.topo__nav {
  display: flex;
  gap: 1.8rem;
  margin-left: 0.5rem;
  flex: 1;
}
.topo__nav a {
  font-weight: 600;
  font-size: 0.94rem;
  color: var(--cinza-800);
  transition: color 0.15s ease;
}
.topo__nav a:hover { color: var(--verde-600); }
.topo__cta { flex-shrink: 0; }
.topo__burger {
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  width: 40px;
  height: 40px;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
}
.topo__burger span {
  display: block;
  width: 100%;
  height: 2.5px;
  background: var(--verde-900);
  border-radius: 2px;
  transition: transform 0.2s ease, opacity 0.2s ease;
}

/* ===================== SEÇÃO 1 — HERO ===================== */
.hero {
  position: relative;
  min-height: 88vh;
  display: flex;
  align-items: center;
  overflow: hidden;
}
.hero__foto {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center 30%;
  transform: scale(1.03);
}
.hero__overlay {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(20,26,16,0.78) 0%, rgba(23,29,18,0.72) 45%, rgba(18,23,14,0.88) 100%);
}
.hero__inner {
  position: relative;
  z-index: 2;
  max-width: var(--largura-max);
  margin: 0 auto;
  padding: 6rem 1.4rem;
  max-width: 780px;
}
.hero__title {
  color: var(--branco);
  /* Título carrega a frase mais longa (troca pedida pelo cliente em 11/08).
     Pedido seguinte do cliente foi "aumentar o tamanho dos textos para
     compor mais espaço" — corpo grande de novo, ocupando a coluna do hero
     em 2-3 linhas em vez do texto curto que cabia numa linha só. */
  font-size: clamp(2.2rem, 5.4vw, 3.6rem);
  max-width: 46ch;
  margin-bottom: 0.4em;
  /* Ajuste do cliente (12/08): "alinhar o texto para que 'qualidade' não fique
     sozinha abaixo". text-wrap: balance distribui as palavras em linhas de
     comprimento parecido, então a última linha deixa de ficar com uma palavra
     órfã. Quem não suporta a propriedade ignora a linha e continua com a
     quebra normal — o   do index.php cobre esse caso mantendo
     "de qualidade." sempre junto. */
  text-wrap: balance;
}
.hero__realce { color: var(--verde-300); }
.hero__lead {
  color: var(--cinza-100);
  font-family: var(--fonte-titulo);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.01em;
  font-size: clamp(1.5rem, 3.2vw, 2rem);
  max-width: 46ch;
  margin-bottom: 1.8em;
}

/* Pedido do cliente (11/08): "Home e Sobre estão muito estáticas" — texto do
   hero entra em sequência ao carregar a página, em vez de aparecer tudo de
   uma vez. É animação de carga (CSS puro), não depende de scroll. */
.hero__inner > * {
  opacity: 0;
  animation: entraTexto 0.8s ease forwards;
}
.hero__inner > *:nth-child(1) { animation-delay: 0.1s; }
.hero__inner > *:nth-child(2) { animation-delay: 0.28s; }
.hero__inner > *:nth-child(3) { animation-delay: 0.46s; }
.hero__inner > *:nth-child(4) { animation-delay: 0.64s; }
@keyframes entraTexto {
  from { opacity: 0; transform: translateY(22px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ===================== SEÇÃO 2 — SOBRE ===================== */
.sobre { padding: 6rem 1.4rem; background: var(--branco); }
.sobre__inner {
  max-width: var(--largura-max);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 0.85fr 1fr;
  gap: 3.5rem;
  align-items: center;
}
.sobre__foto img {
  border-radius: var(--raio-lg);
  box-shadow: var(--sombra);
  width: 100%;
  aspect-ratio: 4 / 5;
  object-fit: cover;
}
.sobre__texto h2 { margin-bottom: 0.6em; }
.sobre__texto p { font-size: 1.03rem; }
.sobre__texto .btn { margin-top: 0.6em; }

/* Pedido do cliente (11/08): "Sobre Nós está muito estática" — foto e texto
   entram deslizando de lados opostos quando a seção chega na tela. */
.sobre__foto, .sobre__texto {
  opacity: 0;
  transition: opacity 0.75s ease, transform 0.75s ease;
}
.sobre__foto { transform: translateX(-32px); }
.sobre__texto { transform: translateX(32px); }
.sobre__foto.is-visivel, .sobre__texto.is-visivel { opacity: 1; transform: translateX(0); }

/* ===================== SEÇÃO 3 — PRODUTOS ===================== */
.produtos {
  padding: 6rem 1.4rem;
  background: var(--verde-950);
  position: relative;
}
.produtos::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: radial-gradient(rgba(255,255,255,0.05) 1px, transparent 1px);
  background-size: 22px 22px;
  opacity: 0.5;
}
.produtos__header { position: relative; max-width: var(--largura-max); margin: 0 auto 3rem; }
.produtos__header h2 { color: var(--branco); }
.produtos__grid {
  position: relative;
  max-width: var(--largura-max);
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.5rem;
}
.card-produto {
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: var(--raio-lg);
  padding: 2rem 1.6rem;
  transition: transform 0.25s ease, background 0.25s ease, border-color 0.25s ease;
  opacity: 0;
  transform: translateY(18px);
}
.card-produto.is-visivel {
  animation: entraCard 0.6s ease forwards;
  animation-delay: var(--atraso, 0ms);
}
@keyframes entraCard {
  to { opacity: 1; transform: translateY(0); }
}
.card-produto:hover {
  background: rgba(255,255,255,0.09);
  border-color: var(--verde-400);
  transform: translateY(-4px);
}
.card-produto__icone {
  width: 56px;
  height: 56px;
  color: var(--verde-300);
  margin-bottom: 1.1em;
}
.card-produto__icone svg { width: 100%; height: 100%; }
.card-produto h3 { color: var(--branco); font-size: 1.2rem; margin-bottom: 0.4em; }
.card-produto p { color: var(--cinza-200); font-size: 0.95rem; margin: 0; }

/* ===================== SEÇÃO 4 — CONSULTOR (CLEBER) ===================== */
.consultor { padding: 6rem 1.4rem; background: var(--cinza-50); }
.consultor__inner {
  max-width: var(--largura-max);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 0.6fr 1fr;
  gap: 3.5rem;
  align-items: center;
}
.consultor__foto img {
  border-radius: var(--raio-lg);
  box-shadow: var(--sombra);
  width: 100%;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  border: 6px solid var(--branco);
}
/* Sem foto (FOTO_CONSULTOR vazia no index.php): a grade precisa virar coluna
   única. Deixar as duas colunas com um filho só espremeria o texto nos 0.6fr
   da coluna da foto. O max-width de 52ch do parágrafo continua valendo e
   segura a linha em tamanho legível mesmo ocupando a largura toda. */
.consultor__inner--sem-foto { grid-template-columns: 1fr; }
.consultor__texto .eyebrow { color: var(--verde-600); }
.consultor__texto p { font-size: 1.06rem; max-width: 52ch; }

/* ===================== SEÇÃO 5 — CLIENTES (MARQUEE) ===================== */
.clientes { padding: 5rem 0; background: var(--branco); text-align: center; }
.clientes h2 { max-width: var(--largura-max); margin: 0 auto 2.6rem; padding: 0 1.4rem; }
.marquee {
  overflow: hidden;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
  mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}
.marquee__track {
  display: flex;
  align-items: center;
  width: max-content;
  animation: rolarLogos 32s linear infinite;
}
.marquee:hover .marquee__track { animation-play-state: paused; }
.marquee__item {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 90px;
  width: 190px;
  margin: 0 0.6rem;
  background: var(--cinza-50);
  border: 1px solid var(--cinza-100);
  border-radius: var(--raio);
  padding: 1rem 1.3rem;
}
.marquee__item img { max-height: 40px; width: auto; max-width: 100%; object-fit: contain; }
@keyframes rolarLogos {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

/* ===================== SEÇÃO 6 — OBRAS (CARROSSEL DE FOTOS) ===================== */
.obras { padding: 6rem 1.4rem; background: var(--cinza-50); }
.obras__header { max-width: var(--largura-max); margin: 0 auto 2.6rem; }
.obras__wrap { position: relative; max-width: var(--largura-max); margin: 0 auto; }
.obras__track {
  display: flex;
  gap: 1.4rem;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  padding-bottom: 0.5rem;
  scrollbar-width: none;
}
.obras__track::-webkit-scrollbar { display: none; }
.card-obra {
  flex: 0 0 auto;
  width: min(340px, 78vw);
  scroll-snap-align: start;
  border-radius: var(--raio-lg);
  overflow: hidden;
  background: var(--branco);
  box-shadow: var(--sombra-sm);
}
.card-obra__midia {
  width: 100%;
  height: 430px;
  object-fit: cover;
  background: var(--cinza-800);
}
video.card-obra__midia { object-fit: contain; }
.card-obra__legenda {
  margin: 0;
  padding: 1rem 1.2rem;
  font-weight: 700;
  font-family: var(--fonte-titulo);
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--verde-800);
  font-size: 1.05rem;
}
.obras__seta {
  position: absolute;
  top: 45%;
  transform: translateY(-50%);
  width: 46px;
  height: 46px;
  border-radius: 50%;
  background: var(--branco);
  border: 1px solid var(--cinza-200);
  color: var(--verde-700);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: var(--sombra-sm);
  transition: background 0.15s ease, color 0.15s ease;
}
.obras__seta:hover { background: var(--verde-600); color: var(--branco); }
.obras__seta svg { width: 20px; height: 20px; }
.obras__seta--prev { left: -22px; }
.obras__seta--next { right: -22px; }

/* ===================== SEÇÃO 7 — AUTORIDADE ===================== */
.autoridade { position: relative; padding: 6.5rem 1.4rem; overflow: hidden; }
.autoridade__textura {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
}
.autoridade__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(26,33,22,0.94), rgba(44,54,36,0.9));
}
.autoridade__inner { position: relative; z-index: 2; max-width: 860px; margin: 0 auto; text-align: center; }
.autoridade h2 { color: var(--branco); }
.autoridade__lead { color: var(--branco); font-size: 1.18rem; font-weight: 600; max-width: 60ch; margin: 0 auto 0.9em; }
.autoridade p { color: var(--cinza-200); max-width: 62ch; margin-left: auto; margin-right: auto; }
.autoridade__stats {
  margin-top: 3rem;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.4rem;
}
.stat {
  padding: 1.6rem 1rem;
  border: 1px solid rgba(255,255,255,0.18);
  border-radius: var(--raio-lg);
  background: rgba(255,255,255,0.05);
  /* Pedido do cliente (11/08): "movimentação nos números" — o card entra e o
     JS conta os dígitos até o valor final (ver main.js: iniciarContador). */
  opacity: 0;
  transform: translateY(16px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}
.stat.is-visivel { opacity: 1; transform: translateY(0); }
.stat:nth-child(2) { transition-delay: 0.12s; }
.stat:nth-child(3) { transition-delay: 0.24s; }

.autoridade__cta { margin-top: 2.4rem; }
.stat__num {
  display: block;
  font-family: var(--fonte-titulo);
  font-weight: 700;
  font-size: 2.4rem;
  color: var(--verde-300);
  line-height: 1;
  margin-bottom: 0.3em;
}
/* "Norma ABNT" é texto, não número — cabe menor para ficar proporcional aos
   outros dois cards (13 / +7.000) sem quebrar linha. */
.stat__num--texto { font-size: 1.7rem; letter-spacing: 0.02em; }
.stat__label {
  display: block;
  color: var(--cinza-100);
  font-size: 0.92rem;
  font-weight: 500;
}

/* ===================== SEÇÃO 8 — CONTATO / FORMULÁRIO ===================== */
.conversao {
  padding: 6.5rem 1.4rem;
  background: var(--verde-900);
  position: relative;
}
.conversao__inner { max-width: 640px; margin: 0 auto; text-align: center; }
.conversao h2 { color: var(--branco); }
.conversao__sub { color: var(--cinza-200); font-size: 1.05rem; margin-bottom: 2.2em; }

.form { text-align: left; background: var(--branco); border-radius: var(--raio-lg); padding: 2.2rem; box-shadow: var(--sombra); }
.form__row { display: grid; grid-template-columns: 1fr 1fr; gap: 1.1rem; }
.field { margin-bottom: 1.1rem; }
.field label {
  display: block;
  font-weight: 700;
  font-size: 0.86rem;
  color: var(--verde-800);
  margin-bottom: 0.4em;
  letter-spacing: 0.02em;
}
.obrigatorio { color: #b34734; }
.field input,
.field select {
  width: 100%;
  padding: 0.85em 1em;
  border-radius: 8px;
  border: 1.5px solid var(--cinza-200);
  font-family: var(--fonte-corpo);
  font-size: 0.98rem;
  background: var(--cinza-50);
  color: var(--cinza-800);
  transition: border-color 0.15s ease, background 0.15s ease;
}
.field input:focus,
.field select:focus {
  outline: none;
  border-color: var(--verde-500);
  background: var(--branco);
}
.form__feedback { min-height: 1.4em; margin: 0.9em 0 0; font-weight: 600; font-size: 0.92rem; text-align: center; }
.form__feedback.ok { color: var(--verde-600); }
.form__feedback.erro { color: #b34734; }
.form__privacidade { font-size: 0.8rem; color: var(--cinza-400); text-align: center; margin: 0.9em 0 0; }
.form__privacidade a { text-decoration: underline; }

/* ===================== RODAPÉ ===================== */
.footer { background: var(--verde-950); padding: 4rem 1.4rem 2.4rem; }
.footer__inner { max-width: var(--largura-max); margin: 0 auto; text-align: center; }
.footer__logo { height: 46px; width: auto; margin: 0 auto 1.6rem; }
.footer__info { margin-bottom: 1.6rem; }
.footer__titulo {
  font-family: var(--fonte-titulo);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--verde-300);
  font-weight: 700;
  margin-bottom: 0.6em;
}
.footer__info p { color: var(--cinza-200); margin: 0.3em 0; }
.footer__info a:hover { color: var(--verde-300); text-decoration: underline; }
.footer__copy { color: var(--cinza-400); font-size: 0.85rem; border-top: 1px solid rgba(255,255,255,0.1); padding-top: 1.6rem; margin-top: 1.6rem; }

/* ===================== RESPONSIVO ===================== */
@media (max-width: 980px) {
  .sobre__inner,
  .consultor__inner { grid-template-columns: 1fr; }
  .sobre__foto, .consultor__foto { max-width: 420px; margin: 0 auto; }
  .produtos__grid { grid-template-columns: repeat(2, 1fr); }
  .autoridade__stats { grid-template-columns: 1fr; max-width: 340px; margin-left: auto; margin-right: auto; }
}

@media (max-width: 860px) {
  .topo__nav { display: none; }
  .topo__cta { display: none; }
  .topo__burger { display: flex; }

  .topo__nav.is-aberto {
    display: flex;
    flex-direction: column;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: var(--branco);
    padding: 1rem 1.4rem 1.4rem;
    gap: 1rem;
    border-bottom: 1px solid var(--cinza-100);
    box-shadow: var(--sombra-sm);
  }

  .hero__foto { background-position: 30% center; }
  .hero { min-height: 78vh; }

  .form__row { grid-template-columns: 1fr; }
  .form { padding: 1.6rem; }
}

@media (max-width: 640px) {
  .produtos__grid { grid-template-columns: 1fr; }
  h2 { font-size: 2rem; }
  .card-obra__midia { height: 340px; }
  .obras__seta { display: none; }
  .marquee__item { height: 74px; width: 150px; }
  .marquee__item img { max-height: 32px; }
}

/* ===================== ACESSIBILIDADE: MOVIMENTO REDUZIDO ===================== */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .marquee__track { animation: none; }
  .whats-flutuante { animation: none; }
  .btn--pulsante { animation: none; }
  .card-produto { opacity: 1; transform: none; animation: none; }
  .hero__inner > * { opacity: 1; transform: none; animation: none; }
  .sobre__foto, .sobre__texto, .stat { opacity: 1; transform: none; transition: none; }
  * { transition-duration: 0.001ms !important; animation-duration: 0.001ms !important; }
}