* {
  margin: 0; padding: 0;
  box-sizing: border-box;
} 
body {
  font-family: 'Montserrat', sans-serif;
}
h1, h2 {
  color: #FFF;
  font-family: 'Orbitron', sans-serif;
  letter-spacing: 1px;
}
h1 {
  font-size: 1.8rem;
}
h2 {
  font-size: 1.6rem;
}
h3 {
  font-size: 1.4rem;
}
a {
  text-decoration: none;
}
.sub-titulo {
  color: #999;
}

/* Estilos para el botón flotante */
.whatsapp-fixed {
  position: fixed;
  bottom: 30px;
  right: 30px;
  background: linear-gradient(#00E5FF, #39FF14);
  color: white;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 999;
  transition: all 0.3s ease;
}

/* Ajuste para móviles para que no estorbe tanto */
@media (max-width: 600px) {
  .whatsapp-fixed {
    bottom: 15px;
    right: 15px;
    width: 50px;
    height: 50px;
  }
}
/* En móviles lo hacemos un poco más pequeño */
@media (max-width: 600px) {
  .logo-parceiro-fijo {
    bottom: 15px;
    left: 15px;
    width: 60px;
  }
}
:root {
  --cor-0: #ffffff;
  --cor-1: #f7f7f7;
  --cor-2: #ededed;
  --cor-3: #dedede;
  --cor-4: #cccccc;
  --cor-5: #b2b2b2;
  --cor-6: #9c9c9c;
  --cor-7: #717171;
  --cor-8: #595959;
  --cor-9: #404040;
  --cor-10: #2e2e2e;
  --cor-11: #111111;
  --cor-12: #000000;
  --cor-p1: #39FF14;
  --cor-p2: #e4a30b;
  --cor-p3: #a66f00;
  --cor-p4: #664400;
  --cor-p5: #332200;
}

.cor-0 {
  color: var(--cor-0);
}
.cor-1 {
  color: var(--cor-1);
}
.cor-2 {
  color: var(--cor-2);
}
.cor-3 {
  color: var(--cor-3);
}
.cor-4 {
  color: var(--cor-4);
}
.cor-5 {
  color: var(--cor-5);
}
.cor-6 {
  color: var(--cor-6);
}
.cor-7 {
  color: var(--cor-7);
}
.cor-8 {
  color: var(--cor-8);
}
.cor-9 {
  color: var(--cor-9);
}
.cor-10 {
  color: var(--cor-10);
}
.cor-11 {
  color: var(--cor-11);
}
.cor-12 {
  color: var(--cor-12);
}
.cor-p1 {
  color: var(--cor-p1);
}
.cor-p2 {
  color: var(--cor-p2);
}
.cor-p3 {
  color: var(--cor-p3);
}
.cor-p4 {
  color: var(--cor-p4);
}
.cor-p5 {
  color: var(--cor-p5);
}
/* titulo internas */
.titulo-bg {
  padding: 4em 2em;
  background-color: #0B0B0B;
}
.titulo p {
  margin-bottom: 4px;
}
@media (max-width: 800px) {
  .titulo-bg {
    padding-top: 40px;
    padding-bottom: 40px;
  }
  .titulo p {
    font-size: 1rem;
    text-transform: lowercase;
    font-weight: 400;
  }
}
.botao {
  display: inline-block;
  padding: 16px 32px;
  background: linear-gradient(#00E5FF, #39FF14);
  border-radius: 4px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
  text-transform: uppercase;
  color: var(--cor-p5);
  font: 600 1.125rem/1.35 "Poppins", sans-serif;
  max-width: max-content;
  border: none;
  cursor: pointer;
}
.botao.secundario {
  background: var(--cor-10);
  color: var(--cor-2);
}

.botao.secundario:hover {
  background: var(--cor-9);
}

.botao.seta {
  display: flex;
  align-items: center;
}

.botao.seta::after {
  content: "";
  display: inline-block;
  width: 18px;
  height: 10px;
  margin-left: 12px;
  background: url("../../img/icones/seta.svg");
  transition: transform 0.2s;
}

.botao.seta:hover::after {
  transform: translateX(4px);
}

@media (max-width: 600px) {
  .botao {
    padding: 12px 16px;
    font-size: 1rem;
  }
}

.link {
  display: inline-block;
  color: ;
  font: 500 1.5rem/1.5 "Poppins", sans-serif;
  text-transform: uppercase;
  background: linear-gradient(to right, #88ff00, #00e5ff);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  display: inline-block;
}


.introducao-bg {
  background: #0B0B0B;
  box-shadow: none; 
  position: relative;
  overflow: hidden;
  padding: 2em;
}
.introducao {
  min-height: 300px;
  
  display: grid; /* grid */
  grid-template-columns: 1fr 1fr;
  align-items: center;
  gap: 2em;
}
.introducao-conteudo {
  text-align: right; 
  
  display: flex; /* flex */
  flex-direction: column;
  align-items: flex-end;
  gap: 1em;
}
.video-led {
  width: 100%;
  max-height: 450px;
  object-fit: contain;
  border-radius: 4px;
  justify-self: center;
}
.introducao p {
  max-width: 35ch;
}
@media (max-width: 765px) {
  .introducao-bg {
    box-shadow: inset 0 -140px #ffffff; 
  }
  .introducao {
    grid-template-columns: 1fr;
    min-height: auto;
  }
  .introducao-conteudo {
    padding-bottom: 0px;
    padding-top: 0px;
    text-align: left;
    align-items: flex-start;
  }
  .video-led {
    height: 300px; 
    object-fit: cover;
    border-radius: 4px;
  }
   .introducao p {
    max-width: 25ch;
  }
}
.tecnologia-bg {
  background-color: #0B0B0B;
  box-shadow: inset 0 80px #FFF, inset 0 -80px #FFF;
}
.tecnologia {
  display: grid;
  grid-template-columns: 1fr 1fr;
}
.tecnologia-imagem img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: left;
}
.tecnologia-conteudo {
  padding: 160px 1em 160px 1em;
  
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 2em;
}
.tecnologia-conteudo > span {
  display: block;
}
.tecnologia-vantagens {
  display: flex;
  gap: 1em;
}
.tecnologia-vantagens h3 {
  width: max-content;
}
.tecnologia-vantagens img {
  width: 24px;
  margin-bottom: 8px;
}
@media (max-width: 765px) {
  .tecnologia-bg {
    box-shadow: initial;
  }
  .tecnologia {
    grid-template-columns: 1fr;
  }
  .tecnologia-conteudo {
    padding: 2em;
  }
  .tecnologia-imagem {
    display: none;
  }
  .tecnologia-vantagens {
    flex-direction: column;
  }
}
.acordeon-container {
  width: 100%;
  border: 1px solid #333; 
  border-radius: 4px;
  overflow: hidden;
}
/* Estilos del Details */
details {
  border-bottom: 1px solid #333;
  background: #111;
  transition: background 0.6s ease;
}
/* Estilo del Summary (Cabecera) */
summary {
  padding: 1em;
  font-size: 1.125rem;
  font-weight: 500;
  color: #FFF;
  cursor: pointer;
  list-style: none; /* Quita flecha por defecto */
  display: flex;
  justify-content: space-between;
  align-items: center;
}
/* Crear la flecha personalizada */
summary::after {
  content: '';
  width: 10px;
  height: 10px;
  border-right: 2px solid #39FF14;
  border-bottom: 2px solid #00E5FF;
  border-radius: 1px;
  transform: rotate(45deg);
  transition: transform 0.3s ease;
}
details[open] summary::after {
  transform: rotate(-135deg);
  border-color: #blue; /* La flecha cambia de color al abrir */
}
/* Contenido Interno */
.content {
  padding: 0 1em 1em 1em;
}
.content p {
  color: #888;
  line-height: 1.6;
  font-size: 1rem;
  margin: 0;
}

.proyectos-galeria {
  padding: 80px 0;
  background-color: #ffffff; /* Fondo blanco */
  overflow: hidden;
}
.proyectos-galeria h2 {
  margin-bottom: 40px;
  color: #111; /* Texto oscuro para que destaque en el blanco */
}
.carousel-container {
  width: 100%;
  overflow: hidden;
  position: relative;
}
.galeria-track {
  display: flex;
  /* Ancho: (ancho de imagen 450px + gap 20px) * 12 fotos */
  width: calc(470px * 12); 
  animation: scroll-infinito 35s linear infinite;
  list-style: none;
  padding: 0;
}
.galeria-track li {
  flex-shrink: 0;
  padding: 0 10px; /* Espaciado entre fotos */
}
.galeria-track img {
  width: 450px; /* Imagen más ancha */
  height: 300px; /* Altura reducida para efecto panorámico */
  object-fit: cover;
  border-radius: 4px;
  border: 1px solid #eee; /* Un borde muy sutil para separar del fondo blanco */
  transition: all 0.4s ease;
}

/* Pausar al pasar el mouse */
.carousel-container:hover .galeria-track {
  animation-play-state: paused;
}

.galeria-track li:hover img {
  transform: scale(1.03);
  box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);
}

/* Animación ajustada al nuevo ancho */
@keyframes scroll-infinito {
  0% { transform: translateX(0); }
  100% { transform: translateX(calc(-470px * 6)); }
}

/* --- RESPONSIVO PARA MÓVIL --- */
@media (max-width: 600px) {
  .galeria-track img {
    width: 280px; /* Ancho menor en móvil */
    height: 200px;
  }
  .proyectos-galeria {
   padding: 2em 0;
  }
}
.parceria-video {
  padding: 2em;
  /* Fondo con degradado fluido */
  background: linear-gradient(135deg, #00E5FF 40%, #39FF14 100%);
  color: #060d07;
  overflow: hidden;
  position: relative;
}
.parceria-grid {
  display: grid;
  /* En Desktop: Video a la izquierda (1.2fr) y Texto a la derecha (1fr) */
  grid-template-columns: 1fr 1fr;
  align-items: center;
  gap: 2em;
}
/* Control del video para que no se vea gigante */
.video-container {
  border-radius: 4px;
  overflow: hidden;
  line-height: 0;
  /* Evita que el video crezca demasiado en pantallas ultra-anchas */
  max-width: 600px; 
  justify-self: center;
}
.video-led {
  width: 100%;
  height: auto;
  object-fit: cover;
}
.parceria-conteudo {
  display: flex;
  flex-direction: column;
  gap: 2em;
}
.parceria-conteudo h2 {
  line-height: 1.1;
  color: #0B0B0B;
}
.parceria-conteudo blockquote {
  border-left: 4px solid var(--cor-11);
  font-style: italic;
  padding-left: 1em;
}
.parceria-lista {
  list-style: none;
  padding: 0;
}
.parceria-lista li {
  display: flex;
  align-items: center;
  gap: 12px;
  font-weight: 600;
  font-size: 1.1rem;
  padding-top: .6em;
}
.parceria-lista svg {
  background: rgba(0, 0, 0, 0.1);
  padding: 4px;
  border-radius: 50%;
  flex-shrink: 0;
}
.logo-parceiro-fijo {
  background: #FFF;
  position: absolute;
  top: 20px;
  left: 20px;
  width: 100px; /* Ajusta el tamaño según necesites */
  height: 40px;
  pointer-events: none;
  display: flex;
  align-items: center;
  border-radius: 4px;
}
.logo-parceiro-fijo img {
  width: 100%;
  height: auto;
  display: block;
  /* Opcional: un ligero filtro para que no brille más que tu botón de acción */
  opacity: 0.9;
  transition: opacity 0.3s ease;
}

/* En móviles lo hacemos un poco más pequeño */
@media (max-width: 600px) {
  .logo-parceiro-fijo {
    bottom: 15px;
    left: 15px;
    width: 60px;
  }
}
/* --- RESPONSIVIDAD --- */

/* Pantallas Medianas (Tablets) */
@media (max-width: 1000px) {
  .parceria-grid {
    grid-template-columns: 1fr 1fr;
  }
}

/* Pantallas Pequeñas (Móviles) */
@media (max-width: 800px) {
  .parceria-grid {
    grid-template-columns: 1fr; /* Una sola columna */
    text-align: left;
  }
  .video-container {
    order: -1; /* El video siempre aparece primero en móvil */
    max-width: 100%;
  }
  .parceria-conteudo h2 {
    font-size: 2.5rem;
  }
}
