/* Fuente Archivo desde Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Archivo:wght@400;700&display=swap');

body {
  font-family: 'Archivo', sans-serif;
  margin: 0;
  background-color: #020813;
  color: #FFFFFF;
  background-image: url("assets/img/background.png"); /* ruta a tu imagen */
}
/*
body {
  background-image: url("assets/img/background.png");
  background-size: cover; 
  background-position: center;
  background-attachment: fixed; 
  background-repeat: no-repeat;
  font-family: 'Archivo', sans-serif;
}
 Encabezado */
header {
  background-color: #2736FF;
  color: #FFFFFF;
  padding: 20px;
  text-align: center;
}

/* Menú de navegación */
nav {
  display: flex;
  justify-content: center;
  background-color: #1C1C1C;
}
nav a {
  color: #FFFFFF;
  text-decoration: none;
  padding: 15px 20px;
}
nav a:hover {
  color: #27D3F5;
}

/* Sección principal */
.hero {
  background-image: url('tu-imagen-de-fondo.jpg');
  background-size: cover;
  background-position: center;
  color: #FFFFFF;
  text-align: center;
  padding: 100px 20px;
}
.hero h1 {
  font-size: 48px;
  margin-bottom: 20px;
}
.hero p {
  font-size: 20px;
  margin-bottom: 30px;
}
.hero button {
  background-color: #27D3F5;
  color: #FFFFFF;
  border: none;
  padding: 15px 30px;
  font-size: 16px;
  cursor: pointer;
}
.hero button:hover {
  background-color: #0098F8;
}

/* Tarjetas de servicios */
.services {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  padding: 40px 20px;
}
.card {
  background-color: #FFFFFF;
  border: 2px solid #27D3F5;
  color: #1C1C1C;
  width: 300px;
  margin: 15px;
  padding: 20px;
  box-shadow: 0 0 10px rgba(0,0,0,0.1);
}
.card h3 {
  margin-top: 0;
}

/* Responsive */
@media (max-width: 768px) {
  .services {
    flex-direction: column;
    align-items: center;
  }
  .hero h1 {
    font-size: 36px;
  }
}
.navbar-brand {
  font-weight: bold;
  font-size: 1.4rem;
}

.nav-link {
  font-family: 'Archivo', sans-serif;
  font-size: 1rem;
  color: #FFFFFF !important;
}

.nav-link:hover {
  color: #0098F8 !important;
}
.carousel-img {
  height: 300px;
  object-fit: contain;
}
body {
  font-family: 'Archivo', sans-serif;
}

.carousel-img {
  height: 300px;
  object-fit: contain;
}

h2 {
  
  font-weight: bold;
}

p {
  color: #FFFFFF;
}
.carousel-bg {
  height: 400px;
  background-size: cover;
  background-position: center;
  filter: blur(6px) brightness(0.7);
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

.carousel-item {
  position: relative;
  height: 500px; /* altura del carrusel */
  display: flex;
  justify-content: center; /* centra horizontalmente */
  align-items: center;     /* centra verticalmente */
}

.carousel-foreground {
  z-index: 2;
  max-width: 70%;   /* más grande pero con margen lateral */
  max-height: 70%;  /* control de altura */
  border: solid; /* borde blanco elegante */
  border-radius: 10px;    /* esquinas redondeadas */
  box-shadow: 0 10px 25px rgba(0,0,0,0.6); /* sombra más marcada */
}

/*AAAAAAAAAAAAAAABBBBBBBBBBBBBBBBBOOOOOOOOOOOOOUUUUUUUUUUUUUUUUUUUUUUUUTTTTTTTTTTTTT*/


.card img {
  object-fit: cover;
  border-radius: 8px 0 0 8px;
}

.card-body {
  padding: 20px;
}

.card-title {
  color: #27D3F5;
  font-weight: bold;
}

#storytelling .card {
  margin: 0 auto; /* fuerza centrado */
  max-width: 600px; /* limita ancho para que no se vean demasiado grandes */
  background-color: #081629;

}

.card-body {
  padding: 20px;        /* margen interno uniforme */
}

.card-text {
  margin-bottom: 15px;  /* espacio debajo del texto */
}

.card-title {
  margin-bottom: 10px;  /* espacio debajo del título */
}
.pop{
  color: #1C1C1C;
}
.modal-title{
	  color: #1C1C1C;

}