/* eosc — splash page
   Bootstrap 5.3 gestisce layout/spaziature/tipografia.
   Qui solo: brand colors, font, sfondo. */

:root {
  --eosc-navy: #FFFFFF;   /* sfondo navy */
  --eosc-teal: #000000;   /* "digital" */
  --eosc-green: #008691;  /* "twin platform" */
  --eosc-fucsia: #EB5D81;  /* "twin platform" */
}

body {
  font-family: "Roboto", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}

/* Sfondo: immagine globo + velo scuro a sinistra per leggibilità del testo */
.splash {
  background-color: var(--eosc-navy);
  background-image:
    /* linear-gradient(90deg, var(--eosc-navy) 0%, rgba(12, 35, 64, 0.85) 25%, rgba(12, 35, 64, 0.15) 55%, rgba(12, 35, 64, 0) 75%), */
    url("../img/bg.jpg");
  background-size: cover;
  background-position: center right;
  background-repeat: no-repeat;
}

/* Solo su mobile: sovrappongo un velo bianco al 60% */
@media (max-width: 768px) {
  .splash {
    background-image:
      linear-gradient(rgba(255, 255, 255, 0.75), rgba(255, 255, 255, 0.75)),
      url('../img/bg.jpg');
  }
}


.splash-logo {
  height: 34px;
  width: auto;
}

/* Titolo responsivo: scala col viewport, resta nei limiti del mockup */
.splash-title {
  font-size: clamp(2.4rem, 6vw, 4.5rem);
}

.splash-subtitle {
  max-width: 34rem;
  opacity: 0.9;
}

.splash-cta {
  letter-spacing: 0.12em;
}

/* Brand colors */
.text-teal { color: var(--eosc-teal) !important; }
.text-green { color: var(--eosc-green) !important; }
.text-fucsia { color: var(--eosc-fucsia) !important; }

a {
  text-decoration: none;
  color: var(--eosc-teal);
}