body { font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; }
    .hero {
      background: url('../img/gambar.webp') center/cover no-repeat;
      color: white;
      min-height: 80vh;
      display: flex;
      align-items: center;
      text-align: center;
      position: relative;
    }
    .hero::before {
      content: "";
      position: absolute;
      top: 0; left: 0; right: 0; bottom: 0;
      background: rgba(0,0,0,0.55);
    }
    .hero .container {
      position: relative;
      z-index: 2;
    }
    .section-icon {
      font-size: 3rem;
      margin-bottom: 15px;
    }
    footer {
      background: #064635;
    }


    .header-section-public {
  min-height: 350px;
  position: relative;
  overflow: hidden;
}
.header-section-public .overlay {
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(0,40,80,0.5);
  z-index: 1;
}
.header-section-public .container {
  position: relative;
  z-index: 2;
}


/*====================== mobile ============================*/

@media (max-width: 600px) {
  .display-5 { font-size: 1.7rem; }
  .lead { font-size: 1.07rem; }
  .display-4 { font-size: 2.5rem; }
  article{
    padding:25px
  }
}