/* INDUSTRIAL SAFETY & CONTROL */
/* IDENTIDAD VISUAL CORPORATIVA */

:root {
  --isc-azul: #101E3B;
  --isc-azul-secundario: #263B5E;
  --isc-amarillo: #F5C400;
  --isc-blanco: #FFFFFF;
  --isc-gris: #666666;
  --isc-fondo: #FAFAFA;
}

/* TIPOGRAFIA */

body {
  font-family: 'Montserrat', Arial, sans-serif;
  color: var(--isc-azul);
  background-color: var(--isc-blanco);
}

/* TITULOS */

h1, h2, h3, h4 {
  font-family: 'Montserrat', Arial, sans-serif;
  font-weight: 700;
  color: var(--isc-azul);
}

/* ENLACES */

a {
  color: var(--isc-azul);
  text-decoration: none;
}

a:hover {
  color: #D6A900;
}

/* BOTONES */

button,
.btn,
input[type="submit"] {
  background-color: var(--isc-amarillo);
  color: var(--isc-azul);
  border: 2px solid var(--isc-amarillo);
  border-radius: 10px;
  font-weight: 700;
  padding: 12px 24px;
  transition: all 0.3s ease;
}

button:hover,
.btn:hover,
input[type="submit"]:hover {
  background-color: var(--isc-azul);
  color: var(--isc-blanco);
  border-color: var(--isc-azul);
}

/* PIE DE PAGINA */

footer {
  background-color: var(--isc-azul);
  color: var(--isc-blanco);
}

/* IMAGENES */

img {
  max-width: 100%;
  height: auto;
}

/* TITULOS DESTACADOS */

strong {
  color: var(--isc-azul);
}
.hero-section {
  /* El degradado va de un color oscuro opaco a la izquierda, y se desvanece hacia la derecha */
  background-image: 
    linear-gradient(to right, rgba(11, 20, 38, 0.95) 0%, rgba(11, 20, 38, 0.7) 50%, rgba(11, 20, 38, 0.2) 100%), 
    url('ruta-de-tu-imagen.jpg');
  
  background-size: cover;
  background-position: center;
  color: #ffffff; /* Para que el texto por defecto sea blanco */
}