/* Import Google Font */
  @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600;700&display=swap');

  /* Basic Reset */
 

  /* Header Section */
  body{
      font-family: "Eczar", sans-serif;

  }
  /* Text Section */
  .tx {
      color: #fff;
      padding: 20px;
      text-align: center;
      max-width: 100%;
  }


  .tx h1 {
      font-size: 3em;
      color: #fff;
      font-weight: 700;
      letter-spacing: 2px;
      text-transform: uppercase;
      margin-bottom: 10px;
      position: relative;
      overflow: hidden;
  }

  /* Animated Underline */
  .tx h1::after {
      content: "";
      display: block;
      width: 0;
      height: 4px;
      background: #03a9f4;
      transition: width 0.4s;
      margin: 10px auto;
  }

  .tx h1:hover::after {
      width: 100%;
  }

  /* Button Section */
  .text-box {
      margin-top: 20px;
  }

  .hero-btn {
      text-decoration: none;
      color: #fff;
      background: #03a9f4;
      padding: 12px 30px;
      border-radius: 50px;
      font-size: 1em;
      transition: background 0.3s, transform 0.3s;
  }

  .hero-btn:hover {
      background: #0056b3;
      transform: scale(1.05);
  }

  /* Responsive Design */
  @media (max-width: 768px) {
      .header {
          min-height: 250px;
      }

      .tx h1 {
          font-size: 2em;
      }

      .hero-btn {
          padding: 10px 20px;
      }
  }

  @media (max-width: 480px) {
      .header {
          min-height: 200px;
      }

      .tx h1 {
          font-size: 1.5em;
      }

      .hero-btn {
          padding: 8px 16px;
          font-size: 0.9em;
      }
  }