/* Shop anmelden (/shop-anmelden) – Fassung v2: Anthrazit/Hellgrau/Weiß, 45°-Etikett-Schnitt, Akzent nur für Fokus */
.sa{padding-bottom:10px}
.sa-raster{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,460px);gap:40px;align-items:start}
.sa-text{max-width:620px;padding-top:6px}
.sa-text h1{font:600 clamp(28px, 3vw, 40px)/1.1 var(--sans);letter-spacing:-.02em;margin:0 0 16px}
.sa-lead{font-size:17px;line-height:1.55;color:var(--ink-2);margin:0 0 18px}
.sa-frei{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;font-size:15px;color:var(--ink-2);margin:0 0 30px}
.sa-etikett{font:600 12.5px/1 var(--sans);background:#121212;color:#f2f2f0;padding:7px 16px 7px 11px;clip-path:var(--schnitt-s)}
.sa-text h2{font-size:17px;margin:0 0 10px}
.sa-regeln{margin:0 0 20px;border-top:1px solid var(--ink)}
.sa-regeln div{display:grid;grid-template-columns:150px minmax(0,1fr);gap:14px;padding:11px 0;border-bottom:1px solid var(--rule)}
.sa-regeln dt{font-weight:600;font-size:14px}
.sa-regeln dd{margin:0;font-size:14.5px;line-height:1.5;color:var(--ink-2)}
.sa-klein{font-size:13px;color:var(--ink-3);line-height:1.5;margin:0}

.sa-form{background:var(--weiss);padding:24px;clip-path:var(--schnitt-l)}
.sa-form .field{margin-bottom:14px}
.sa-form .field i{font-style:normal;font-weight:400;color:var(--ink-3)}
.sa-form .field small{font-size:12px;color:var(--ink-3)}
.sa-form textarea{border:1px solid #b9b9b6;padding:9px 12px;width:100%;min-height:96px;background:#fff;color:var(--ink);font:inherit;resize:vertical}
.sa-form .field input:focus,.sa-form textarea:focus{outline:2px solid var(--akzent);outline-offset:-1px;border-color:var(--akzent)}
.sa-form .sa-err input,.sa-form .sa-err textarea{border-color:var(--warn);box-shadow:inset 3px 0 0 var(--warn)}
.sa-fehler{display:block;font-size:12.5px;color:var(--warn);font-weight:600;line-height:1.4}
.sa-ok{display:flex;gap:9px;align-items:flex-start;font-size:13px;line-height:1.45;color:var(--ink-2);margin:4px 0 6px}
.sa-ok input{margin-top:2px;flex:none;width:16px;height:16px;accent-color:var(--tinte)}
.sa-ok input:focus-visible{outline:2px solid var(--akzent);outline-offset:2px}
.sa-ok.sa-err span{color:var(--warn)}
.sa-ok + .sa-fehler{margin:0 0 6px 25px}
.sa-form .btn.knopf{margin-top:12px}
.sa-hinweis{background:var(--warn-wash);color:var(--warn);font-size:13.5px;font-weight:600;padding:10px 14px;margin:0 0 16px;clip-path:var(--schnitt-s)}

.sa-ergebnis{max-width:620px;margin:0 auto;background:var(--weiss);padding:30px;clip-path:var(--schnitt-l);box-shadow:inset 0 3px 0 var(--ok)}
.sa-ergebnis.nein{box-shadow:inset 0 3px 0 #c99a00}
.sa-ergebnis h1{font-size:26px;margin:0 0 16px}
.sa-vorgang{display:inline-flex;flex-direction:column;gap:4px;background:#121212;color:#f2f2f0;padding:12px 26px 12px 16px;clip-path:var(--schnitt-m);margin:0 0 16px}
.sa-vorgang span{font-size:12px;color:#b9b9b5}
.sa-vorgang b{font-size:22px;letter-spacing:.03em;font-weight:600}
.sa-satz{font-size:16px;line-height:1.55;margin:0 0 12px}
.sa-zurueck{margin:18px 0 0;font-size:14px}

@media (max-width:900px){
  .sa-raster{grid-template-columns:minmax(0,1fr);gap:24px}
}
@media (max-width:720px){
  .sa-form{padding:16px}
  .sa-regeln div{grid-template-columns:minmax(0,1fr);gap:2px}
  .sa-ergebnis{padding:20px 16px}
  .sa-vorgang b{font-size:19px}
}
