@font-face {
  font-family: 'Roboto-Regular';
  src: url('../fonts/Roboto-Regular.ttf') format('truetype');
  font-style: normal;
}

     body {
       font-family: 'Roboto-Regular';
      margin: 0;
      padding: 0;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      min-height: 100vh;
      background-color: #fff;
      color: #111;
      text-align: center;
    }

    h1 {
      font-size: 2rem;
      font-weight: 700;
      margin-bottom: 0rem;
    }

    p {
      font-size: 1rem;
      margin-bottom: 1rem;
    }

    .footer-strip {
      background-color: #222;
      color: #fff;
      padding: 10px 20px;
      border-radius: 8px;
      margin-bottom: 20px;
      width: fit-content;
    }

    .learn-btn {
      background-color: #111;
      color: #fff;
      border: none;
      padding: 12px 30px;
      border-radius: 6px;
      font-size: 1rem;
      cursor: pointer;
      transition: background 0.3s;
      margin-bottom: 20px;
    }

    .learn-btn:hover {
      background-color: #333;
    }

    .coupon-box {
      background-color: #f5f5f5;
      border-radius: 8px;
      padding: 15px 20px;
      font-family: monospace;
      width: fit-content;
      margin-bottom: 10px;
      font-size: 1.1rem;
    }

    .copied-text {
      font-size: 0.9rem;
      color: black;
      opacity: 0;
      transition: opacity 0.4s ease;
      margin-bottom: 30px;
    }

    .copied-text.show {
      opacity: 1;
    }

    footer {
      position: fixed;
      bottom: 15px;
      text-align: center;
      font-size: 0.9rem;
      color: #555;
    }

    footer {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    background-color: #000; /* black background */
    color: #fff;
    text-align: center;
    padding: 12px 0;
    font-size: 0.9rem;
    z-index: 1000;
  }

  footer a {
    color: #fff;
    text-decoration: none;
    font-weight: 500;
  }

  footer a:hover {
    text-decoration: underline;
  }

    @media (max-width: 600px) {
      h1 {
        font-size: 1.6rem;
      }
      .learn-btn {
        width: 80%;
      }
    }