
  <style>
    @import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;600;700&family=Inter:wght@300;400;500;600&display=swap');

    
    .rewards-container {
      max-width: 100%;
      margin: 0 auto;
      padding: 0;
      color: #2c3e50;
    }

    .rewards-hero {
      background: linear-gradient(135deg, #7B4397 0%, #8E5A9C 50%, #A670A8 100%);
      color: white;
      padding: 60px 30px 60px 30px;
      text-align: center;
      position: relative;
      overflow: hidden;
    }

    .rewards-hero::before {
      content: '';
      position: absolute;
      top: 0; left: 0; right: 0; bottom: 0;
      background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><defs><pattern id="diamond" x="0" y="0" width="20" height="20" patternUnits="userSpaceOnUse"><polygon points="10,2 18,10 10,18 2,10" fill="none" stroke="rgba(255,255,255,0.1)" stroke-width="0.5"/></pattern></defs><rect width="100" height="100" fill="url(%23diamond)"/></svg>');
      opacity: 0.1;
    }

    .rewards-hero-content {
      position: relative;
      z-index: 2;
    }

    .rewards-hero h3 {
      color:white;
      font-size: 2.5em;
      font-weight: 700;
      margin-bottom: 12px;
      letter-spacing: -0.5px;
    }

    .rewards-hero .subtitle {
      font-size: 1.2em;
      font-weight: 300;
      margin-bottom: 20px;
      color: #ffffff;
    }

    .rewards-hero .description {
      font-size: 1em;
      line-height: 1.6;
      max-width: 600px;
      margin: 0 auto 30px;
    }

    .application-section {
      padding: 0px 0px 60px 0px;
      background: linear-gradient(to bottom, #f8f9fa, #ffffff);
    }

    .application-form h3{
      font-size:25px;
      text-align:center;
    }

    .application-form {
      background: white;
      padding: 40px;
      border-radius: 15px;
      box-shadow: 0 12px 40px rgba(123, 67, 151, 0.1);
      border: 1px solid #f0f0f0;
      max-width: 800px;
      margin: 50px auto;
    }

    .form-group {
      margin-bottom: 20px;
    }

    .form-group label {
      display: block;
      margin-bottom: 6px;
      font-weight: 600;
      color: #7B4397;
      font-size: 0.9em;
    }

    .form-group input,
    .form-group select {
      width: 100%;
      padding: 12px;
      border: 2px solid #e9ecef;
      border-radius: 8px;
      font-size: 0.95em;
      background: #f8f9fa;
    }

    .form-group input:focus,
    .form-group select:focus {
      outline: none;
      border-color: #7B4397;
      background: white;
      box-shadow: 0 0 0 3px rgba(123, 67, 151, 0.1);
    }

    .form-row {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 20px;
    }

    .submit-btn {
      background: linear-gradient(45deg, #7B4397, #9B59B6);
      color: white;
      padding: 15px 40px;
      border: none;
      border-radius: 50px;
      font-size: 1em;
      font-weight: 600;
      cursor: pointer;
      transition: all 0.3s ease;
      display: block;
      margin: 25px auto 0;
      text-transform: uppercase;
      letter-spacing: 1px;
      box-shadow: 0 6px 20px rgba(123, 67, 151, 0.3);
    }

    .submit-btn:hover {
      transform: translateY(-3px);
      box-shadow: 0 10px 30px rgba(123, 67, 151, 0.4);
    }

    .submit-btn:disabled {
      background: #cccccc;
      cursor: not-allowed;
      transform: none;
      box-shadow: none;
    }

    .submit-btn:disabled:hover {
      transform: none;
      box-shadow: none;
    }

    .back-btn {
      background: linear-gradient(45deg, #6c757d, #495057);
      color: white;
  padding: 8px 20px !important; /* Reduced from 12px 30px */
  font-size: 0.8em !important; /* Smaller text */
  border-radius: 20px !important; /* Tighter corners */
  margin: 0 auto 15px !important; /* Centered with bottom margin */
  display: inline-flex !important;
  align-items: center;
  gap: 8px;
    }

    @media (max-width: 768px) {
  .back-btn {
    padding: 6px 15px !important;
    font-size: 0.75em !important;
  }
}
    .back-btn:hover {
      transform: translateY(-2px);
      box-shadow: 0 6px 20px rgba(108, 117, 125, 0.4);
      text-decoration: none;
      color: white;
    }

    .fa-eye, .fa-eye-slash {
      color: #7B4397;
    }

    .toggle-password {
      position: absolute;
      top: 50%;
      right: 12px;
      transform: translateY(-50%);
      cursor: pointer;
      color: #7B4397;
      font-size: 16px;
      z-index: 1;
    }

    .password-input-wrapper {
      position: relative;
      display: flex;
      align-items: center;
    }

    .store-fields {
      display: none;
      margin-top: 15px;
      padding: 20px;
      border: 2px solid #e9ecef;
      border-radius: 10px;
      background: #f8f9fa;
      animation: slideDown 0.3s ease;
    }

    .store-fields.show {
      display: block;
    }

    .store-fields h4 {
      color: #7B4397;
      font-size: 1.1em;
      font-weight: 600;
      margin: 0 0 15px 0;
      text-align: center;
      border-bottom: 2px solid #e9ecef;
      padding-bottom: 10px;
    }

    .terms-section {
      margin: 30px 0 20px 0;
      padding: 20px;
      border: 2px solid #e9ecef;
      border-radius: 10px;
      background: #f8f9fa;
    }

    .terms-section h4 {
      color: #7B4397;
      font-size: 1.2em;
      font-weight: 600;
      margin: 0 0 15px 0;
      text-align: center;
    }

    .terms-content {
      max-height: 200px;
      overflow-y: auto;
      padding: 15px;
      background: white;
      border-radius: 8px;
      border: 1px solid #e9ecef;
      margin-bottom: 15px;
      font-size: 0.9em;
      line-height: 1.6;
      color: #495057;
    }

    .terms-content h5 {
      color: #7B4397;
      font-weight: 600;
      margin: 15px 0 8px 0;
    }

    .terms-content h5:first-child {
      margin-top: 0;
    }

    .terms-checkbox-wrapper {
      display: flex;
      align-items: flex-start;
      gap: 10px;
    }

    .terms-checkbox-wrapper input[type="checkbox"] {
      width: auto;
      min-width: 18px;
      height: 18px;
      margin: 0;
      cursor: pointer;
    }

    .terms-checkbox-wrapper label {
      color: #495057;
      font-weight: 500;
      cursor: pointer;
      font-size: 0.9em;
      margin: 0;
    }

    @keyframes slideDown {
      from {
        opacity: 0;
        transform: translateY(-10px);
      }
      to {
        opacity: 1;
        transform: translateY(0);
      }
    }

    @media (max-width: 768px) {
      .form-row {
        grid-template-columns: 1fr;
      }
      .application-form {
        padding: 30px 20px;
      }
      .rewards-hero h3 {
        font-size: 2em;
      }
    }

    .back-btn-container {
  text-align: center;
  margin: 20px auto;
  max-width: 800px;
  padding: 0 20px;
}

      .application-form {
        padding: 30px 20px;
      }
      .rewards-hero h3 {
        font-size: 2em;
      }

  </style>