* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 300;
}

body {
  background: radial-gradient(circle at right, #020100, #000);
  color: #fff;
  overflow-x: hidden;
  letter-spacing: 0.3px;
  font-size: 23px;
}

/* HEADER */
.header {
  position: fixed;
  top: 0;
  width: 100%;
  display: flex;
  justify-content: space-between;
  padding: 24px 64px;
  align-items: center;
  background: rgba(0,0,0,0.6);
  backdrop-filter: blur(6px);
  z-index: 10;
  animation: fadeInDown 0.8s ease-out;
}

body {
  padding-top: 90px;
}

.logo {
  height: 26px;
}

.logo1 {
  max-width: 200px;
  transition: transform 0.3s ease;
}

.logo1:hover {
  transform: scale(1.05);
}

.graf {
  max-width: 700px;
}

.btn {
  background: #FE7100;
  color: #fff;
  padding: 10px 20px;
  border-radius: 999px;
  text-decoration: none;
  font-weight: 600;
  transition: all 0.3s ease;
  position: relative;
  overflow: hidden;
}

.btn:hover {
  opacity: 0.9;
  transform: translateY(-2px);
  box-shadow: 0 5px 15px rgba(254, 113, 0, 0.4);
}

.btn::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 5px;
  height: 5px;
  background: rgba(255, 255, 255, 0.5);
  opacity: 0;
  border-radius: 100%;
  transform: scale(1, 1) translate(-50%);
  transform-origin: 50% 50%;
}

.btn:focus:not(:active)::after {
  animation: ripple 1s ease-out;
}

/* HERO */
.hero {
  position: relative;
  animation: fadeIn 1s ease-out 0.3s both;
}

/* GRID DECORATIVO */
.hero-grid {
  position: absolute;
  top: -200px;
  left: 20%;
  width: 1000px;
  height: 1000px;
  background:
    radial-gradient(circle, rgba(0,0,0,0.65) 0%, rgba(0,0,0,0) 60%),
    url("img/grid.png") no-repeat center;
  background-size: contain;
  opacity: 0.80;
  filter: sepia(1) saturate(6) hue-rotate(-10deg);
  pointer-events: none;
  z-index: 1;
  animation: float 20s ease-in-out infinite;
}

/* GLOW LARANJA */
.hero-grid::after {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at center,
    rgba(254, 113, 0, 0.25) 0%,
    rgba(254, 113, 0, 0.15) 25%,
    rgba(254, 113, 0, 0.05) 40%,
    transparent 60%
  );
  pointer-events: none;
}

.hero-row {
  display: flex;
  align-items: center;
  padding: 60px 64px;
  position: relative;
  z-index: 2;
}

.hero-row.second {
  padding-top: 0;
}

.hero-text {
  width: 50%;
}

.hero-text h1 {
  font-size: 55px;
  line-height: 1.15;
  font-weight: 700;
  animation: fadeInUp 0.8s ease-out 0.5s both;
}

.hero-text h2 {
  margin-top: 12px;
  font-size: 30px;
  color: #ccc;
  font-weight: 100;
  letter-spacing: 0.2px;
  line-height: 1.2;
  animation: fadeInUp 0.8s ease-out 0.7s both;
}

.highlight {
  color: #ffffff;
  font-weight: 600;
  position: relative;
  display: inline-block;
}

.highlight::after {
  content: '';
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 100%;
  height: 2px;
  background: #FE7100;
  transform: scaleX(0);
  transform-origin: right;
  transition: transform 0.3s ease;
}

.highlight:hover::after {
  transform: scaleX(1);
  transform-origin: left;
}

.hero-text .btn {
  margin-top: 28px;
  display: inline-block;
  animation: fadeInUp 0.8s ease-out 0.9s both;
}

/* TEXTO DE TECNOLOGIAS - ULTRA FINO */
.tech {
  font-size: 30px;
  line-height: 1.2;
  font-weight: 100 !important;
  letter-spacing: 0.5px !important;
  -webkit-font-smoothing: antialiased !important;
  -moz-osx-font-smoothing: grayscale !important;
  text-rendering: geometricPrecision !important;
  transform: scaleX(0.96) !important;
  transform-origin: left center !important;
  display: inline-block !important;
  color: #e0e0e0 !important;
  text-shadow: 
    0.5px 0.5px 0.5px rgba(0, 0, 0, 0.3),
    -0.3px -0.3px 0.5px rgba(255, 255, 255, 0.1);
  filter: contrast(0.95) brightness(1.05);
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 
               'Helvetica Neue', Arial, sans-serif !important;
  animation: fadeInLeft 0.8s ease-out 1s both;
}

/* ESPAÇAMENTO CORRIGIDO PARA O "SEM BLÁ BLÁ BLÁ" */
.tech span {
  color: #FE7100;
  font-weight: 600 !important;
  font-size: 37px;
  transform: none !important;
  text-shadow: none !important;
  filter: none !important;
  display: inline !important;
  margin-top: 15px; /* ESPAÇAMENTO ADICIONADO */
  display: block !important; /* GARANTE QUE É BLOCO SEPARADO */
}

/* DIVISOR COM GLOW ANIMADO */
.divider-glow {
  width: 100%;
  height: 6px;
  margin: 25px 0; /* AUMENTADO DE 15px PARA DAR MAIS ESPAÇO */
  background: linear-gradient(to right,
    rgba(254,113,0,1) 0%,
    rgba(254,113,0,0.95) 5%,
    rgba(254,113,0,0.9) 10%,
    rgba(254,113,0,0.8) 20%,
    rgba(254,113,0,0.5) 35%,
    rgba(254,113,0,0.3) 45%,
    rgba(0,0,0,0) 70%
  );
  box-shadow:
    0 0 15px 3px rgba(254,113,0,0.8),
    -10px 0 25px rgba(254,113,0,0.7),
    -20px 0 45px rgba(254,113,0,0.4),
    -5px 0 20px 5px rgba(254,113,0,0.9),
    -8px 0 30px 8px rgba(254,113,0,0.6);
  border-radius: 4px;
  filter: blur(0.3px);
  position: relative;
  animation: fadeIn 0.8s ease-out 1.1s both;
}

/* PONTO BRILHANTE ANIMADO NA EXTREMA ESQUERDA */
.divider-glow::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 12px;
  height: 12px;
  background: #FE7100;
  border-radius: 50%;
  box-shadow: 
    0 0 15px 5px rgba(254,113,0,0.9),
    0 0 30px 10px rgba(254,113,0,0.6),
    0 0 50px 15px rgba(254,113,0,0.3);
  z-index: 1;
  animation: pulseGlow 2s infinite ease-in-out;
}

/* GLOW DE FUNDO */
.divider-glow::after {
  content: "";
  position: absolute;
  left: -5px;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  height: 20px;
  background: radial-gradient(
    ellipse at left,
    rgba(254,113,0,0.4) 0%,
    rgba(254,113,0,0.2) 30%,
    rgba(254,113,0,0.1) 50%,
    transparent 70%
  );
  border-radius: 50%;
  filter: blur(2px);
  z-index: 0;
}

/* DESCRIÇÃO - ULTRA FINA */
.desc {
  margin-top: 20px; /* AUMENTADO DE 15px */
  color: #e0e0e0 !important;
  line-height: 1.3;
  font-weight: 100 !important;
  letter-spacing: 0.4px !important;
  -webkit-font-smoothing: antialiased !important;
  -moz-osx-font-smoothing: grayscale !important;
  transform: scaleX(0.97) !important;
  transform-origin: left center !important;
  text-shadow: 
    0.4px 0.4px 0.4px rgba(0, 0, 0, 0.25),
    -0.2px -0.2px 0.4px rgba(255, 255, 255, 0.08);
  filter: contrast(0.96);
  animation: fadeInRight 0.8s ease-out 1.2s both;
}

.logos {
  margin-top: 20px;
  display: flex;
  align-items: center;
  animation: fadeInUp 0.8s ease-out 1.3s both;
}

.logo-plus {
  font-size: 32px;
  font-weight: 600;
  color: #ffffff;
  margin: 0 10px;
  animation: pulse 2s infinite;
}

.logo-google {
  height: 35px;
  padding-right: 3%;
  transition: transform 0.3s ease;
}

.logo-google:hover {
  transform: translateY(-3px);
}

.logo-meta {
  height: 70px;
  transition: transform 0.3s ease;
}

.logo-meta:hover {
  transform: translateY(-3px);
}

/* HERO IMAGE */
.hero-image {
  width: 50%;
  text-align: right;
  animation: fadeInRight 0.8s ease-out 0.9s both;
}

/* IMAGEM DA EQUIPE */
.hero-image.team-image {
  width: 50vw;
  margin-right: -64px;
  position: relative;
}

.hero-image.team-image img {
  width: 100%;
  display: block;
  border-radius: 8px;
  transition: transform 0.5s ease;
}



.hero-image.team-image::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(to right,
      rgba(0,0,0,0.95) 0%,
      rgba(0,0,0,0.85) 15%,
      rgba(0,0,0,0.65) 30%,
      rgba(0,0,0,0.35) 45%,
      rgba(0,0,0,0.15) 60%,
      rgba(0,0,0,0.05) 75%,
      rgba(0,0,0,0) 100%
    ),
    linear-gradient(to top,
      rgba(0,0,0,0.6) 0%,
      rgba(0,0,0,0.3) 40%,
      rgba(0,0,0,0) 70%
    ),
    linear-gradient(to bottom,
      rgba(0,0,0,0.6) 0%,
      rgba(0,0,0,0.3) 40%,
      rgba(0,0,0,0) 70%
    );
  pointer-events: none;
}

/* ===================== */
/* SOCIOS */
/* ===================== */

.socios {
  padding: 120px 64px;
  text-align: center;
  animation: fadeIn 0.8s ease-out 1.4s both;
}

.socios h1 {
  font-size: 28px;
  font-weight: 600;
  line-height: 1.3;
  margin-bottom: 10px;
}

.socios p {
  color: #bbb !important;
  font-weight: 100 !important;
  letter-spacing: 0.3px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.grid {
  margin-top: 60px;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 32px;
}

.card {
  max-width: 400px;
  margin: 0 auto;
  position: relative;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 0 40px rgba(254,113,0,0.15);
  background: transparent;
  transition: all 0.4s ease;
  opacity: 0;
  animation: fadeInUp 0.6s ease-out forwards;
}

.card:nth-child(1) { animation-delay: 1.5s; }
.card:nth-child(2) { animation-delay: 1.6s; }
.card:nth-child(3) { animation-delay: 1.7s; }
.card:nth-child(4) { animation-delay: 1.8s; }

.card:hover {
  transform: translateY(-10px);
  box-shadow: 0 20px 60px rgba(254,113,0,0.25);
}

.card img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  object-position: center;
  display: block;
  transition: transform 0.5s ease;
}

.card:hover img {
  transform: scale(1.05);
}

.overlay {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  padding: 28px 22px 30px;
  background: linear-gradient(
    to top,
    rgba(0,0,0,0.95) 0%,
    rgba(0,0,0,0.8) 30%,
    rgba(0,0,0,0.4) 55%,
    rgba(0,0,0,0.15) 75%,
    rgba(0,0,0,0) 100%
  );
  text-align: center;
  transform: translateY(10px);
  transition: transform 0.4s ease;
}

.card:hover .overlay {
  transform: translateY(0);
}

.overlay strong {
  display: block;
  font-weight: 600;
  font-size: 20px;
  margin-bottom: 6px;
}

.overlay small {
  display: block;
  color: #eee;
  font-weight: 300;
  line-height: 1.4;
  font-size: 15px;
  max-width: 90%;
  margin: 0 auto;
}

/* ===================== */
/* FOOTER - CORRIGIDO */
/* ===================== */

.footer {
  background: rgba(0, 0, 0, 0.9);
  backdrop-filter: blur(10px);
  padding: 30px 64px 15px;
  border-top: 1px solid rgba(254, 113, 0, 0.3);
  text-align: center;
  position: relative;
  z-index: 2;
  animation: fadeIn 0.8s ease-out 1.9s both;
}

.footer-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px; /* Espaço reduzido */
  margin-bottom: 20px;
}

.footer::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: linear-gradient(to right,
    transparent 0%,
    rgba(254,113,0,0.6) 20%,
    rgba(254,113,0,0.8) 50%,
    rgba(254,113,0,0.6) 80%,
    transparent 100%
  );
}

.footer-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 30px;
  margin-bottom: 30px;
}

/* ENDEREÇO - CORRIGIDO */
.footer-address {
  width: 100%;
  margin-bottom: 10px;
}

.address-text {
  font-size: 16px;
  line-height: 1.6;
  color: #ccc;
  font-weight: 300;
  text-align: center;
}

.address-text strong {
  color: #fff;
  font-weight: 600;
  font-size: 18px;
  display: block;
  margin-bottom: 10px;
}

/* SOCIAL - CORRIGIDO (LINHA HORIZONTAL) */
.footer-social {
  display: flex;
  justify-content: center;
  gap: 25px;
  align-items: center;
  margin-top: 10px;
}

.social-link {
  color: #fff !important;
  text-decoration: none;
  transition: all 0.3s ease;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.1);
  animation: bounceIn 0.6s ease-out forwards;
  opacity: 0;
}

.social-link:nth-child(1) { animation-delay: 2s; }
.social-link:nth-child(2) { animation-delay: 2.1s; }
.social-link:nth-child(3) { animation-delay: 2.2s; }

/* GARANTE QUE OS ÍCONES FICARÃO BRANCOS */
.social-link svg {
  fill: #ffffff !important;
  color: #ffffff !important;
}

.social-link:hover {
  color: #FE7100 !important;
  background: rgba(254, 113, 0, 0.1);
  border-color: #FE7100;
  transform: translateY(-3px) rotate(5deg);
  box-shadow: 0 5px 15px rgba(254, 113, 0, 0.3);
}

.social-link:hover svg {
  fill: #FE7100 !important;
  color: #FE7100 !important;
}

.social-icon {
  width: 22px !important;
  height: 22px !important;
  display: block !important;
}

/* COPYRIGHT - CORRIGIDO */
.footer-copyright {
  text-align: center;
  padding-top: 20px;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  margin-top: 20px;
}

.footer-copyright p {
  font-size: 14px;
  color: #888;
  font-weight: 300;
}

/* =========================================== */
/* ANIMAÇÕES PERSONALIZADAS */
/* =========================================== */

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes fadeInDown {
  from {
    opacity: 0;
    transform: translateY(-20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes fadeInLeft {
  from {
    opacity: 0;
    transform: translateX(-20px) scaleX(0.96);
  }
  to {
    opacity: 1;
    transform: translateX(0) scaleX(0.96);
  }
}

@keyframes fadeInRight {
  from {
    opacity: 0;
    transform: translateX(20px) scaleX(0.97);
  }
  to {
    opacity: 1;
    transform: translateX(0) scaleX(0.97);
  }
}

@keyframes pulse {
  0%, 100% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.1);
  }
}

@keyframes pulseGlow {
  0%, 100% {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
    box-shadow: 
      0 0 15px 5px rgba(254,113,0,0.9),
      0 0 30px 10px rgba(254,113,0,0.6),
      0 0 50px 15px rgba(254,113,0,0.3);
  }
  50% {
    opacity: 0.8;
    transform: translate(-50%, -50%) scale(1.1);
    box-shadow: 
      0 0 20px 8px rgba(254,113,0,0.95),
      0 0 40px 15px rgba(254,113,0,0.7),
      0 0 60px 20px rgba(254,113,0,0.4);
  }
}

@keyframes float {
  0%, 100% {
    transform: translateY(0) rotate(0deg);
  }
  33% {
    transform: translateY(-10px) rotate(0.5deg);
  }
  66% {
    transform: translateY(10px) rotate(-0.5deg);
  }
}

@keyframes ripple {
  0% {
    transform: scale(0, 0);
    opacity: 1;
  }
  20% {
    transform: scale(25, 25);
    opacity: 1;
  }
  100% {
    opacity: 0;
    transform: scale(40, 40);
  }
}

@keyframes bounceIn {
  0% {
    opacity: 0;
    transform: scale(0.3);
  }
  50% {
    opacity: 1;
    transform: scale(1.05);
  }
  70% {
    transform: scale(0.9);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}

@keyframes iconFloat {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-2px);
  }
}

@keyframes glowPulse {
  0%, 100% {
    filter: brightness(1) drop-shadow(0 0 5px rgba(254, 113, 0, 0.3));
  }
  50% {
    filter: brightness(1.1) drop-shadow(0 0 10px rgba(254, 113, 0, 0.6));
  }
}

/* EFEITO DE GLOW NO HOVER DOS ÍCONES */
.social-link:hover .social-icon {
  filter: drop-shadow(0 0 8px rgba(254, 113, 0, 0.6));
  animation: iconFloat 0.6s ease-in-out, glowPulse 1.5s infinite;
}

/* ANIMAÇÃO DO LOGO PLUS */
.logo-plus {
  animation: pulse 2s infinite ease-in-out;
}

/* =========================================== */
/* MEDIA QUERIES PARA CELULAR (MOBILE FIRST) */
/* =========================================== */

/* Tablets e dispositivos menores (até 1024px) */
@media screen and (max-width: 1024px) {
  body {
    font-size: 20px;
    padding-top: 80px;
  }
  
  .header {
    padding: 18px 32px;
  }
  
  .hero-row {
    padding: 40px 32px;
  }
  
  .hero-text h1 {
    font-size: 45px;
  }
  
  .hero-text h2 {
    font-size: 26px;
    font-weight: 100;
    line-height: 1.2;
  }
  
  .socios {
    padding: 80px 32px;
  }
  
  .tech {
    font-size: 26px;
    line-height: 1.15;
    font-weight: 100 !important;
    transform: scaleX(0.96) !important;
  }
  
  .desc {
    font-size: 20px;
    line-height: 1.25;
    font-weight: 100 !important;
    transform: scaleX(0.97) !important;
  }
  
  .divider-glow {
    height: 0.5px;
    margin: 20px 0; /* AUMENTADO PARA MOBILE */
    box-shadow:
      0 0 12px 2px rgba(254,113,0,0.7),
      -8px 0 20px rgba(254,113,0,0.6),
      -15px 0 35px rgba(254,113,0,0.3),
      -4px 0 15px 4px rgba(254,113,0,0.8),
      -6px 0 25px 6px rgba(254,113,0,0.5);
  }
  
  .divider-glow::before {
    width: 10px;
    height: 10px;
  }
  
  .divider-glow::after {
    height: 18px;
  }
  
  .footer {
    padding: 35px 32px 18px;
  }
  
  .footer-content {
    gap: 25px;
  }
}

/* Celulares (até 768px) */
@media screen and (max-width: 768px) {
  body {
    font-size: 18px;
    padding-top: 70px;
  }
  
  /* HEADER MOBILE */
  .header {
    padding: 15px 20px;
  }
  
  .logo1 {
    max-width: 160px;
  }
  
  .btn-top {
    padding: 8px 16px;
    font-size: 16px;
    white-space: nowrap;
  }
  
  /* GRID DECORATIVO */
  .hero-grid {
    display: block;
    position: fixed;
    top: -100px;
    left: 0;
    width: 100%;
    height: 100%;
    max-width: none;
    max-height: none;
    background: 
      radial-gradient(circle, rgba(0,0,0,0.65) 0%, rgba(0,0,0,0) 60%),
      url("img/grid.png") no-repeat center;
    background-size: cover;
    opacity: 0.25;
    filter: sepia(1) saturate(6) hue-rotate(-10deg);
    pointer-events: none;
    z-index: 1;
  }
  
  .hero-grid::after {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at center,
      rgba(254, 113, 0, 0.15) 0%,
      rgba(254, 113, 0, 0.08) 15%,
      rgba(254, 113, 0, 0.03) 30%,
      transparent 50%
    );
    pointer-events: none;
  }
  
  /* HERO - LAYOUT COLUNA ÚNICA */
  .hero-row {
    flex-direction: column;
    padding: 30px 20px;
    gap: 40px;
    position: relative;
    z-index: 2;
  }
  
  .hero-row.second {
    padding-top: 0;
  }
  
  .hero-text, 
  .hero-image {
    width: 100%;
  }
  
  /* ESPAÇAMENTO CORRIGIDO PARA "SEM BLÁ BLÁ BLÁ" NO MOBILE */
  .tech {
    font-size: 22px !important;
    text-align: center;
    position: relative;
    z-index: 1;
    text-shadow: 0 2px 8px rgba(0,0,0,0.8);
    line-height: 1.1 !important;
    font-weight: 100 !important;
    letter-spacing: 0.6px !important;
    transform: scaleX(0.94) !important;
    transform-origin: center !important;
    display: block !important;
    text-shadow: 
      0.6px 0.6px 0.6px rgba(0, 0, 0, 0.4),
      -0.4px -0.4px 0.6px rgba(255, 255, 255, 0.15) !important;
    filter: contrast(0.92) brightness(1.08) !important;
    color: #e8e8e8 !important;
  }
  
  /* ESPAÇAMENTO ESPECÍFICO PARA O "SEM BLÁ BLÁ BLÁ" NO MOBILE */
  .tech span {
    font-size: 26px !important;
    font-weight: 600 !important;
    transform: none !important;
    text-shadow: none !important;
    filter: none !important;
    display: block !important;
    margin-top: 20px !important; /* MAIS ESPAÇO NO MOBILE */
    margin-bottom: 15px !important;
  }
  
  /* DIVIDER MOBILE - MAIS ESPAÇO */
  .divider-glow {
    margin: 25px auto !important; /* AUMENTADO SIGNIFICATIVAMENTE */
    width: 90%;
    height: 5px;
    box-shadow:
      0 0 12px 2px rgba(254,113,0,0.7),
      -8px 0 20px rgba(254,113,0,0.6),
      -15px 0 35px rgba(254,113,0,0.3),
      -4px 0 15px 4px rgba(254,113,0,0.8),
      -6px 0 25px 6px rgba(254,113,0,0.5);
  }
  
  /* CONTAINER PARA TEXTOS COM BACKGROUND DE GRÁFICO */
  .hero-text-container {
    position: relative;
    background: 
      url("img/grafico.png") no-repeat right center,
      linear-gradient(to right, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.7) 30%, rgba(0,0,0,0.4) 60%, transparent 100%);
    background-size: contain;
    padding: 30px 20px;
    border-radius: 12px;
    background-blend-mode: overlay;
  }
  
  .hero-text h1 {
    font-size: 36px;
    text-align: center;
    position: relative;
    z-index: 1;
    text-shadow: 0 2px 10px rgba(0,0,0,0.8);
  }
  
  .hero-text h2 {
    font-size: 22px;
    text-align: center;
    margin-top: 10px;
    position: relative;
    z-index: 1;
    text-shadow: 0 2px 8px rgba(0,0,0,0.8);
    font-weight: 100;
    line-height: 1.2;
  }
  
  .hero-text .btn {
    display: block;
    text-align: center;
    margin: 25px auto 0;
    max-width: 300px;
    font-size: 18px;
    padding: 12px 24px;
    position: relative;
    z-index: 1;
  }
  
  .divider-glow::before {
    width: 10px;
    height: 10px;
    box-shadow: 
      0 0 12px 4px rgba(254,113,0,0.8),
      0 0 25px 8px rgba(254,113,0,0.5),
      0 0 40px 12px rgba(254,113,0,0.2);
    animation: pulseGlowMobile 2s infinite ease-in-out;
  }
  
  .divider-glow::after {
    height: 15px;
    background: radial-gradient(
      ellipse at left,
      rgba(254,113,0,0.3) 0%,
      rgba(254,113,0,0.15) 30%,
      rgba(254,113,0,0.05) 50%,
      transparent 70%
    );
  }
  
  /* DESCRIÇÃO - MOBILE - MAIS ESPAÇO */
  .desc {
    text-align: center;
    margin-top: 25px !important; /* AUMENTADO */
    position: relative;
    z-index: 1;
    text-shadow: 0 2px 8px rgba(0,0,0,0.8);
    font-size: 17px !important;
    line-height: 1.2 !important;
    font-weight: 100 !important;
    letter-spacing: 0.5px !important;
    transform: scaleX(0.95) !important;
    transform-origin: center !important;
    color: #e8e8e8 !important;
  }
  
  /* LOGOS GOOGLE E META */
  .logos {
    justify-content: center;
    margin-top: 25px;
    position: relative;
    z-index: 1;
  }
  
  .logo-google {
    height: 30px;
    padding-right: 5%;
  }
  
  .logo-meta {
    height: 60px;
  }
  
  /* IMAGEM DA EQUIPE - SEM DEGRADÊ */
  .hero-image.team-image {
    width: 100%;
    margin-right: 0;
    margin-top: 20px;
    position: relative;
  }
  
  /* REMOVER O DEGRADÊ DA IMAGEM DA EQUIPE */
  .hero-image.team-image::after {
    display: none;
  }
  
  .hero-image.team-image img {
    width: 100%;
    display: block;
    border-radius: 12px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.5);
  }
  
  /* IMAGEM GRÁFICO - AGORA É BACKGROUND */
  .hero-image:not(.team-image) {
    display: none;
  }
  
  /* SEÇÃO SÓCIOS */
  .socios {
    padding: 60px 20px;
    position: relative;
    z-index: 2;
  }
  
  .socios h1 {
    font-size: 24px;
    line-height: 1.3;
    display: block;
    word-break: normal;
  }
  
  .socios p {
    font-size: 18px;
    margin-top: 10px;
    font-weight: 100 !important;
    color: #ccc !important;
  }
  
  /* GRID DE SÓCIOS - 1 COLUNA */
  .grid {
    grid-template-columns: 1fr;
    gap: 25px;
    margin-top: 40px;
  }
  
  .card {
    max-width: 100%;
  }
  
  .overlay {
    padding: 20px 15px 22px;
  }
  
  .overlay strong {
    font-size: 18px;
  }
  
  .overlay small {
    font-size: 14px;
  }
  
  /* FOOTER MOBILE */
  .footer {
    padding: 30px 20px 15px;
  }
  
  .footer-content {
    gap: 20px;
  }
  
  .address-text {
    font-size: 15px;
    line-height: 1.5;
  }
  
  .address-text strong {
    font-size: 17px;
  }
  
  .footer-social {
    gap: 20px;
  }
  
  .social-link {
    width: 40px;
    height: 40px;
  }
  
  .social-icon {
    width: 20px !important;
    height: 20px !important;
  }
  
  .footer-copyright p {
    font-size: 13px;
  }
  
  /* ANIMAÇÃO MOBILE */
  @keyframes pulseGlowMobile {
    0%, 100% {
      opacity: 1;
      transform: translate(-50%, -50%) scale(1);
      box-shadow: 
        0 0 12px 4px rgba(254,113,0,0.8),
        0 0 25px 8px rgba(254,113,0,0.5),
        0 0 40px 12px rgba(254,113,0,0.2);
    }
    50% {
      opacity: 0.8;
      transform: translate(-50%, -50%) scale(1.08);
      box-shadow: 
        0 0 15px 6px rgba(254,113,0,0.85),
        0 0 30px 12px rgba(254,113,0,0.6),
        0 0 50px 18px rgba(254,113,0,0.3);
    }
  }
}

/* Celulares pequenos (até 480px) */
@media screen and (max-width: 480px) {
  body {
    font-size: 16px;
  }
  
  .header {
    padding: 12px 15px;
  }
  
  .logo1 {
    max-width: 140px;
  }
  
  .btn-top {
    font-size: 14px;
    padding: 7px 14px;
  }
  
  .hero-grid {
    opacity: 0.2;
    top: -50px;
  }
  
  .hero-text-container {
    padding: 25px 15px;
    background: 
      url("img/grafico.png") no-repeat right center,
      linear-gradient(to right, rgba(0,0,0,0.95) 0%, rgba(0,0,0,0.8) 40%, rgba(0,0,0,0.5) 70%, transparent 100%);
    background-size: contain;
  }
  
  .hero-text h1 {
    font-size: 30px;
  }
  
  .hero-text h2 {
    font-size: 20px;
    font-weight: 100;
    line-height: 1.2;
  }
  
  .tech {
    font-size: 20px !important;
    line-height: 1.08 !important;
    font-weight: 100 !important;
    letter-spacing: 0.7px !important;
    transform: scaleX(0.92) !important;
    transform-origin: center !important;
    text-shadow: 
      0.7px 0.7px 0.7px rgba(0, 0, 0, 0.5),
      -0.5px -0.5px 0.7px rgba(255, 255, 255, 0.2) !important;
    filter: contrast(0.9) brightness(1.1) !important;
    color: #f0f0f0 !important;
  }
  
  /* ESPAÇAMENTO AINDA MAIOR NO CELULAR PEQUENO */
  .tech span {
    font-size: 24px !important;
    margin-top: 25px !important;
    margin-bottom: 20px !important;
  }
  
  .hero-text .btn {
    font-size: 16px;
    padding: 10px 20px;
  }
  
  .desc {
    font-size: 16px !important;
    line-height: 1.15 !important;
    font-weight: 100 !important;
    letter-spacing: 0.6px !important;
    transform: scaleX(0.93) !important;
    color: #f0f0f0 !important;
    margin-top: 30px !important;
  }
  
  /* DIVIDER CELULAR PEQUENO */
  .divider-glow {
    height: 4px;
    margin: 30px auto !important;
    box-shadow:
      0 0 10px 2px rgba(254,113,0,0.6),
      -6px 0 15px rgba(254,113,0,0.5),
      -12px 0 25px rgba(254,113,0,0.25),
      -3px 0 12px 3px rgba(254,113,0,0.7),
      -5px 0 20px 5px rgba(254,113,0,0.4);
  }
  
  .divider-glow::before {
    width: 8px;
    height: 8px;
    box-shadow: 
      0 0 10px 3px rgba(254,113,0,0.7),
      0 0 20px 6px rgba(254,113,0,0.4),
      0 0 30px 10px rgba(254,113,0,0.15);
    animation: pulseGlowSmall 2s infinite ease-in-out;
  }
  
  .socios h1 {
    font-size: 22px;
    line-height: 1.3;
  }
  
  .overlay strong {
    font-size: 16px;
  }
  
  .overlay small {
    font-size: 13px;
  }
  
  /* FOOTER CELULAR PEQUENO */
  .footer {
    padding: 25px 15px 12px;
  }
  
  .address-text {
    font-size: 14px;
    line-height: 1.4;
  }
  
  .address-text strong {
    font-size: 16px;
  }
  
  .footer-social {
    gap: 15px;
  }
  
  .social-link {
    width: 38px;
    height: 38px;
  }
  
  .social-icon {
    width: 18px !important;
    height: 18px !important;
  }
  
  .footer-copyright p {
    font-size: 12px;
  }
  
  /* ANIMAÇÃO CELULAR PEQUENO */
  @keyframes pulseGlowSmall {
    0%, 100% {
      opacity: 1;
      transform: translate(-50%, -50%) scale(1);
      box-shadow: 
        0 0 10px 3px rgba(254,113,0,0.7),
        0 0 20px 6px rgba(254,113,0,0.4),
        0 0 30px 10px rgba(254,113,0,0.15);
    }
    50% {
      opacity: 0.8;
      transform: translate(-50%, -50%) scale(1.06);
      box-shadow: 
        0 0 12px 5px rgba(254,113,0,0.75),
        0 0 25px 10px rgba(254,113,0,0.5),
        0 0 40px 15px rgba(254,113,0,0.25);
    }
  }
}

/* Ajustes para orientação paisagem em celulares */
@media screen and (max-height: 600px) and (orientation: landscape) {
  .header {
    padding: 10px 20px;
  }
  
  body {
    padding-top: 65px;
  }
  
  .hero-grid {
    top: -30px;
    opacity: 0.15;
  }
  
  .hero-row {
    padding: 20px;
    gap: 20px;
  }
  
  .hero-text-container {
    padding: 20px 15px;
    background: 
      url("img/grafico.png") no-repeat right center,
      linear-gradient(to right, rgba(0,0,0,0.95) 0%, rgba(0,0,0,0.8) 30%, rgba(0,0,0,0.5) 60%, transparent 100%);
    background-size: 60% auto;
  }
  
  .hero-text h1 {
    font-size: 28px;
  }
  
  .tech {
    font-size: 18px !important;
    line-height: 1.05 !important;
    transform: scaleX(0.91) !important;
  }
  
  .tech span {
    margin-top: 15px !important;
  }
  
  .divider-glow {
    height: 4px;
    margin: 20px auto !important;
  }
  
  .divider-glow::before {
    width: 9px;
    height: 9px;
  }
}

/* Ajuste específico para telas muito pequenas */
@media screen and (max-width: 360px) {
  .hero-text-container {
    background: 
      url("img/grafico.png") no-repeat right center,
      linear-gradient(to right, rgba(0,0,0,0.97) 0%, rgba(0,0,0,0.85) 50%, rgba(0,0,0,0.6) 80%, transparent 100%);
    background-size: 70% auto;
  }
  
  .hero-text h1 {
    font-size: 26px;
  }
  
  .tech {
    font-size: 18px !important;
    line-height: 1.05 !important;
    transform: scaleX(0.90) !important;
  }
  
  .tech span {
    margin-top: 20px !important;
  }
  
  .desc {
    font-size: 15px !important;
    line-height: 1.1 !important;
    transform: scaleX(0.92) !important;
  }
  
  .divider-glow {
    height: 3px;
    margin: 25px auto !important;
    box-shadow:
      0 0 8px 2px rgba(254,113,0,0.5),
      -4px 0 12px rgba(254,113,0,0.4),
      -8px 0 20px rgba(254,113,0,0.2),
      -2px 0 10px 2px rgba(254,113,0,0.6),
      -3px 0 15px 4px rgba(254,113,0,0.3);
  }
  
  .divider-glow::before {
    width: 7px;
    height: 7px;
    box-shadow: 
      0 0 8px 2px rgba(254,113,0,0.6),
      0 0 15px 5px rgba(254,113,0,0.35),
      0 0 25px 8px rgba(254,113,0,0.15);
  }
}

/* ESTILOS ESPECÍFICOS PARA OTIMIZAÇÃO */
.tech, .desc, .hero-text h2, .socios p {
  -webkit-font-smoothing: antialiased !important;
  -moz-osx-font-smoothing: grayscale !important;
  text-rendering: optimizeLegibility !important;
  image-rendering: -webkit-optimize-contrast !important;
  image-rendering: crisp-edges !important;
}

/* Reseta transform para elementos que não devem ter */
.highlight, .tech span, .btn, h1, .logo-plus {
  transform: none !important;
  text-shadow: none !important;
  filter: none !important;
}

/* Garante que os efeitos sejam aplicados apenas ao texto específico */
.tech::selection, .desc::selection {
  background-color: rgba(254, 113, 0, 0.3);
  color: white;
}

/* GARANTE QUE O FOOTER NÃO INTERFIRA EM OUTROS ELEMENTOS */
.footer * {
  box-sizing: border-box;
}