/* ==========================================================================
   GRÖTSCH & PARTNER · Anfrageformular „Sonderkontingent 2026“

   Die Regeln sind unverändert aus dem bisherigen Formularblock
   (formular/platzhalter.html) übernommen, damit das Formular genauso aussieht
   und sich auf dem Handy genauso verhält wie vorher. Entfallen ist nur der
   Entwurfshinweis. Neu sind am Ende: Honigtopf, gesperrter Knopf während des
   Sendens und die allgemeine Meldung.

   Farben über die Avada-Variablen mit Rückfallwert.
   ========================================================================== */
#gp-sk-formular{
  --f-gold: var(--awb-color5, #d9b96f);
  --f-anthrazit: var(--awb-color8, #2b2b2b);
  --f-hellgrau: var(--awb-color2, #f5f5f5);
  --f-weiss: var(--awb-color1, #ffffff);
  --f-linie: #d8d4ca;
  --f-gedaempft: #5f5f5f;
  --f-fehler: #8a2b2b;            /* dunkles Rot nur für Fehlertexte, 7,4 zu 1 auf Weiß */
  font-family: "Open Sans", Arial, Helvetica, sans-serif;
  color: var(--f-anthrazit);
  max-width: 720px;
  margin: 0 auto;
  box-sizing: border-box;
}
#gp-sk-formular *,#gp-sk-formular *::before,#gp-sk-formular *::after{box-sizing:inherit;}

.gp-sk-form__body{
  background: var(--f-hellgrau);
  border-radius: 12px;
  padding: 32px;
}
.gp-sk-form__titel{
  font-size: 28px; font-weight: 500; line-height: 1.26;
  letter-spacing: -0.03em; margin: 0 0 12px; color: var(--f-anthrazit);
}
.gp-sk-form__intro{font-size:16px;line-height:1.6;margin:0 0 28px;color:var(--f-gedaempft);}
.gp-sk-form__zwischentitel{
  font-size: 11.5px; text-transform: uppercase; letter-spacing: .09em;
  color: var(--f-gedaempft); margin: 28px 0 14px; font-weight: 700;
  border-top: 1px solid var(--f-linie); padding-top: 20px;
}

/* Zwei Felder nebeneinander, ab 640 px untereinander. */
.gp-sk-form__reihe{display:flex;gap:16px;flex-wrap:wrap;margin-bottom:4px;}
.gp-sk-form__feld{flex:1 1 240px;min-width:0;margin-bottom:16px;}
.gp-sk-form__feld--breit{flex-basis:100%;}
.gp-sk-form__feld label{
  display:block;font-size:14px;font-weight:600;margin-bottom:6px;color:var(--f-anthrazit);
}
.gp-sk-form__pflicht{color:#7d6229;font-weight:700;}

#gp-sk-formular input[type=text],
#gp-sk-formular input[type=email],
#gp-sk-formular input[type=tel],
#gp-sk-formular select{
  width:100%;padding:11px 13px;font-size:16px;   /* 16px verhindert das Zoomen auf iOS */
  font-family:inherit;color:var(--f-anthrazit);
  background:var(--f-weiss);border:1px solid var(--f-linie);border-radius:8px;
  appearance:none;
}
#gp-sk-formular select{
  background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%232b2b2b' stroke-width='1.6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 13px center;background-size:12px;
  padding-right:38px;
}
#gp-sk-formular input::placeholder{color:#8a8a8a;}
#gp-sk-formular input:focus-visible,
#gp-sk-formular select:focus-visible,
#gp-sk-formular button:focus-visible,
#gp-sk-formular a:focus-visible{
  outline:3px solid var(--f-anthrazit);outline-offset:2px;border-radius:8px;
}
#gp-sk-formular input[aria-invalid=true],
#gp-sk-formular select[aria-invalid=true]{border-color:var(--f-fehler);border-width:2px;}

.gp-sk-form__fehler{
  font-size:13.5px;line-height:1.45;color:var(--f-fehler);margin:6px 0 0;font-weight:600;
}

.gp-sk-form__kaestchen{
  display:flex;gap:11px;align-items:flex-start;margin:16px 0 0;
}
.gp-sk-form__kaestchen input[type=checkbox]{
  flex:0 0 auto;width:20px;height:20px;margin:2px 0 0;accent-color:#7d6229;cursor:pointer;
}
.gp-sk-form__kaestchen label{font-size:14.5px;line-height:1.55;font-weight:400;cursor:pointer;margin:0;}
.gp-sk-form__kaestchen a{color:#7d6229;text-underline-offset:3px;}

.gp-sk-form__knopf{
  display:block;width:100%;margin:28px 0 0;padding:15px 24px;
  font-family:inherit;font-size:17px;font-weight:700;
  color:var(--f-anthrazit);                       /* Anthrazit auf Gold: 7,5 zu 1 */
  background:var(--f-gold);border:0;border-radius:10px;cursor:pointer;
}
.gp-sk-form__knopf:hover{filter:brightness(1.05);}
.gp-sk-form__fussnote{
  font-size:13.5px;line-height:1.5;color:var(--f-gedaempft);margin:12px 0 0;text-align:center;
}

/* Erfolgszustand */
.gp-sk-form__erfolg{
  background:var(--f-hellgrau);border-radius:12px;padding:32px;
  border-left:4px solid var(--f-gold);
}
.gp-sk-form__erfolg p{font-size:16px;line-height:1.6;margin:0 0 14px;}
.gp-sk-form__erfolg h2:focus-visible{outline:3px solid var(--f-anthrazit);outline-offset:4px;}
.gp-sk-form__erfolg a{color:#7d6229;}

@media (max-width: 640px){
  .gp-sk-form__body,.gp-sk-form__erfolg{padding:22px 18px;border-radius:10px;}
  .gp-sk-form__titel{font-size:23px;}
  .gp-sk-form__reihe{gap:0;}
  .gp-sk-form__feld{flex-basis:100%;}
}

/* --------------------------------------------------------------------------
   Neu mit der Anbindung (Revision 1, 10.09.2026)
   -------------------------------------------------------------------------- */

/* Honigtopf: aus dem sichtbaren Bereich geschoben statt display:none, weil
   manche Spamprogramme ausgeblendete Felder gezielt überspringen. */
.gp-sk-form__honig{
  position:absolute !important;left:-10000px;top:auto;
  width:1px;height:1px;overflow:hidden;
}

/* Während des Sendens: Knopf sichtbar gesperrt, Mauszeiger zeigt Arbeit an. */
.gp-sk-form__knopf[disabled]{opacity:.72;cursor:progress;filter:none;}

/* Allgemeine Meldung, etwa bei Verbindungsabbruch. Gleiche Fehlerfarbe wie
   die Feldmeldungen, als ruhiger Kasten ohne Warnoptik. */
.gp-sk-form__meldung{
  margin:16px 0 0;padding:12px 14px;
  background:var(--f-weiss);border-left:4px solid var(--f-fehler);border-radius:0 8px 8px 0;
  font-size:14.5px;line-height:1.5;color:var(--f-fehler);font-weight:600;
}
.gp-sk-form__meldung a{color:var(--f-fehler);}