html {
  scroll-behavior: smooth;
}

body {
      font-family: sans-serif;
      padding: 2rem;
      max-width: 100vmin;
      margin: auto;
      background: #86977d;
      color: #2c3422;
      font-size: clamp(2vmin, 5vmin, 8vmin);
      line-height:150%;
      font-family: 'Josefin Sans', sans-serif;
    }

.hauptbild {width: 100%; max-width: 100vmin; height: auto; }

h2 {margin-top:    calc(1rem + 1vmin);
  margin-bottom: calc(1rem + 1vmin);}

.textfeld {width: 100%; border: 0px; background: #fff; color: #2c3422; font-size: clamp(4vmin, 6vmin, 8vmin); 
  padding: 0;
  padding-top: calc(1rem + 1vmin); 
  padding-bottom: calc(1rem + 1vmin); 
  text-align: center; border-radius: 0; }

.button {
      width: 100%; border: 0px; color: #fff; background: #2c3422; font-size: clamp(4vmin, 6vmin, 8vmin); padding:calc(1rem + 1vmin);
      cursor: pointer; margin-top:    calc(1rem + 1vmin);
    margin-bottom: calc(1rem + 1vmin);}
  

 .button:hover {
      background: #404935;
    }

 .button:disabled {
      background: #9E9E9E;
      cursor: not-allowed;
    }

#step2 { display: none; }

.dz-message {
    font-size: clamp(4vmin, 6vmin, 8vmin) !important; 
    margin: 2em 0.5em !important;
    text-align: center;
    color: #2c3422;
}

.spinner {
      display: none;
      margin-top:    calc(1rem + 1vmin);
      font-size: clamp(4vmin, 6vmin, 8vmin);
    }
  

body.danke {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  min-height: 100vh;
  margin: 0;
  padding: 0;

  /* Neu: volle Breite, kein max-width */
  width: 100%;
  max-width: none;
  margin: 0; /* Oder margin: 0 auto; wenn du ihn zentrieren willst */
  padding: 0;
}

a {color: #fff !important; text-decoration: none;}