:root{
      --brand:#2159A4;
    }


    body{scroll-behavior:smooth; font-family: 'Open Sans Light' !important;}

    strong{
      font-family: 'Open Sans Regular' !important;
    }

    .bold{
      font-family: 'Open Sans Bold' !important;
    }

    a{
      text-decoration: none !important;
    }

    /* Navbar brand tweak */
    .navbar{backdrop-filter:saturate(180%) blur(6px)}
    .navbar .nav-link{border:1px solid var(--brand); border-radius: 50rem; color: var(--brand);}
    .navbar .nav-link.active{background:var(--brand); color:#fff !important}

    .border-primary{
      border-color: var(--brand) !important;
    }

    .text-blue{
      color: var(--brand) !important;
    }

    .bg-blue{
      background-color: var(--brand) !important;
    }

    .navbar-toggler:focus {
      box-shadow: 0 0 0 2px #2159A4;
    }



    .hero-figure{min-height: 380px; border-radius:1.25rem}
    .hero-overlay{
      top: 69%;
      left: 55%;
      transform: translate(-50%, -50%);
      text-align: end;
      align-items: end;
      background: var(--brand);
      color: #fff;
      border-radius: 1.5rem 0 0 1.5rem;
      width: 90%;
    }

    @media (min-width: 992px){
      .hero-overlay{
        top: 15%;
        right: 0;
        left: auto;
        transform: none;
        margin-top: 3rem; 
        text-align: right;
        align-items: flex-end;
        width: auto;
      }
    }

    .line-title::after{
      content:"";
      position:absolute;
      left:0; right:0;          
      height:2px;
      background:#fff;
      margin-top:6px;
      display:block;
    }

    .bg-light-blue{
      background: rgba(33, 89, 164, 0.16);
    }

    .bg-gray{
      background-color: rgba(237, 237, 237, 0.48);
    }

  @media (min-width: 992px) {
    .bg-lg-gray {
      background-color: rgba(237, 237, 237, 0.48);
    }
  }


  .hero-figure{ min-height:clamp(260px,45vw,520px); }
  .hero-img{ width:100%; height:100%; object-fit:cover; object-position:center; }

    .line-title::after {
      content: "";
      display: block;
      height: 1px;              
      background-color: #fff;  
      margin-top: 6px;         
      width: 180%;             
      position: absolute;
      left: 0;
      right: 0;             
    }


    .thumb{aspect-ratio:4/3; background:#EAF2FD; border-radius:1rem}

  .timeline{ position:relative; }
  .timeline::before{
    content:"";
    position:absolute;
    left:10px;
    top:12px;
    bottom:33%;
    width:1px;
    background: var(--brand);
  }

  /* Dots */
  .timeline-item{ position:relative; padding-left:3.5rem; }
  .timeline-item::before{
    content:"";
    position:absolute;
    left:0;
    top:.4rem;
    width:22px; height:22px;
    background:#fff;
    border:1px solid var(--brand);
    border-radius:50%;
    transition: background-color .2s, border-color .2s, transform .2s;
  }
  .timeline-item.active::before{
    background:var(--brand);
    border-color:var(--brand);
    transform:scale(1.05);
  }

  /* Badge icone (cerchio) */
/* Cerchio che ospita l’icona */
.icon-badge{
  position: relative;
  width:90px; height:90px;
  border-radius:50%;
  background:#fff;
  display:grid; place-items:center;
  overflow:hidden;
  transition: background-color .25s ease, border-color .25s ease;
}

/* Le due versioni dell’icona sono sovrapposte e sfumano */
.icon-img, .icon-img-active{
  position:absolute; inset:0; margin:auto;
  width:80px; height:80px; display:block;
  transition: opacity .25s ease;
}
.icon-img-active{ opacity:0; }


.timeline-item.active .icon-img{ opacity:0; }
.timeline-item.active .icon-img-active{ opacity:1; }


.counter {
  transition: all 1s ease;
}


.custom-btn {
  transition: all 0.5s ease; 
}

.custom-btn:hover {
  background-color: var(--brand) !important; 
  color: #fff !important;   
  border-color:var(--brand) !important;
}


.nav-link:hover{
  color: white !important;
  background-color: var(--brand);
}

  @media (max-width: 992px) {
    .logo{
      max-width: 70% !important;
      margin-left: 20px;
    }
  }

  
  .flip-card-wrapper {
  width: 100%;
  height: 100%;
  perspective: 1000px;
}

.flip-card-inner {
  position: relative;
  width: 100%;
  padding-top: 120%; /* rapporto 3:2 o adatta a te */
  transition: transform 0.6s ease-in-out;
  transform-style: preserve-3d;
}

.flip-card-wrapper:hover .flip-card-inner {
  transform: rotateY(180deg);
}

.flip-card-front, .flip-card-back {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  backface-visibility: hidden;
  border-radius: 1rem; /* mantiene i rounded-5 */
  overflow: hidden;
}

.flip-card-front img, .flip-card-back img {
  width: 100%;
  height: 100%;
  object-fit: cover; /* evita deformazioni */
}

.flip-card-back {
  transform: rotateY(180deg);
}


.flip-card-small {
  width: 100%;
  perspective: 1000px;
  min-height: 318px;
}

.flip-card-inner-small {
  position: relative;
  width: 100%;
  padding-top: 70%; /* regola in base all’altezza della card */
  transition: transform 0.6s ease-in-out;
  transform-style: preserve-3d;
}

.flip-card-small:hover .flip-card-inner-small {
  transform: rotateY(180deg);
}

.flip-card-front-small, .flip-card-back-small {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  min-height: 318px;
  backface-visibility: hidden;
  border-radius: 1rem;
  overflow: hidden;
}

.flip-card-front-small .card-img-top, .flip-card-back-small .card-img-top {
  width: 100%;
  height: 100%;
  min-height: 318px;
  object-fit: cover;
}

.flip-card-back-small {
  transform: rotateY(180deg);
}

   .logo-wrapper {
  position: relative;
  width: 100%;
  text-align: center;
  overflow: hidden;
  padding: 2rem 0;
}

/* La scritta */
.logo-parallax {
  font-family: 'Poppins', sans-serif;
  font-weight: 800;
  font-size: clamp(2.5rem, 12vw, 8rem); /* si adatta allo schermo */
  text-transform: uppercase;
  color: transparent;
  background-image: url('../img/progetto-start-up.jpg'); /* ← percorso dell’immagine */
  background-size: 110%; /* leggermente più grande del testo per non mostrare bordi */
  background-position: center center;
  background-repeat: no-repeat;
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  line-height: 1.1;
  display: inline-block;
  transition: background-position 0.1s linear;
  user-select: none;
}