/* Kontaktseite – nur kontakt.html / danke.html */
.k-hero{position:relative;overflow:hidden;padding:3.5rem 0 11rem;background:linear-gradient(180deg,var(--creme) 0,var(--creme) 60%,#B9BCCB 78%,#272C47 92%,var(--nacht) 100%)}
.k-hero .wrap{z-index:2}
.k-hero h1{max-width:16ch}
.k-hero .lead{color:var(--grau);max-width:46ch}
.k-kreise{position:absolute;right:-10vw;top:-40px;width:min(640px,70vw);height:auto;z-index:1;pointer-events:none}
.k-form{padding:0 0 7rem}
.k-karte{margin-top:-2rem}
.k-karte h2{font-size:clamp(2rem,4.2vw,3.2rem);color:var(--creme)}
.formular{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem 1.5rem;max-width:none;margin-top:2.25rem}
.formular>*{grid-column:1/-1}
.formular>.halb{grid-column:auto}
@media (max-width:640px){.formular>.halb{grid-column:1/-1}}
.formular label{display:grid;gap:.5rem;font-weight:600;color:var(--creme)}
.formular .optional{font-weight:400;color:#B4B8C8}
.formular input[type=text],.formular input[type=email],.formular input[type=tel],.formular textarea{font:inherit;font-weight:400;padding:.9rem 1.1rem;border:1px solid #6B7192;border-radius:14px;background:rgba(11,14,26,.6);color:var(--creme);width:100%;transition:border-color .2s ease,box-shadow .2s ease}
.formular textarea{min-height:10rem;resize:vertical}
.formular input:hover,.formular textarea:hover{border-color:#8E93A8}
.formular input:focus-visible,.formular textarea:focus-visible{outline:none;border-color:var(--orange);box-shadow:0 0 0 3px rgba(232,103,58,.45)}
.formular .check{display:flex;gap:.8rem;align-items:flex-start;font-weight:400;color:#C9CCDA;max-width:70ch}
.formular .check input{flex:none;width:24px;height:24px;margin:.05rem 0 0;accent-color:var(--orange);cursor:pointer}
.formular .check input:focus-visible{outline:3px solid var(--blau);outline-offset:3px}
.formular .check a{color:var(--creme);text-underline-offset:3px}
.formular .honig{position:absolute;left:-9999px}
.formular button{border:0;cursor:pointer;font:inherit;font-weight:600;justify-self:start;margin-top:.5rem;color:var(--nacht)}
.formular button.orange{color:var(--nacht)}
.formular button:focus-visible{outline:3px solid var(--blau);outline-offset:4px}
.nach-formular{margin:2.75rem 0 0;padding-top:1.75rem;border-top:1px solid var(--linie-d);color:#C9CCDA!important}
.nach-formular a{color:var(--creme);font-weight:600;text-underline-offset:3px}
.nach-formular a:hover,.formular .check a:hover{color:var(--orange)}
.k-dunkel .aktionen .btn.orange{color:var(--nacht)}
@media (max-width:640px){.k-hero{padding:2.5rem 0 8rem}.k-karte{border-radius:24px;padding:2rem 1.25rem}.k-kreise{right:-30vw;top:0;width:110vw;opacity:.7}}
.nach-formular a{white-space:nowrap}
.formular:has(>.drittel){grid-template-columns:repeat(3,minmax(0,1fr))}
.formular>.drittel{grid-column:auto}
@media (max-width:760px){.formular>.drittel{grid-column:1/-1}}
/* Inline-Fehler und Status (kontakt-form.js) */
.formular .feld{display:grid;gap:.5rem;align-content:start}
.formular .feld>label{font-weight:600;color:var(--creme)}
.formular .f-fehler{margin:0;font-size:.875rem;line-height:1.4;color:#FFB4A0;min-height:0}
.formular .f-fehler:empty{display:none}
.formular [aria-invalid=true]{border-color:#FF8A6B!important}
.formular .f-status{grid-column:1/-1;margin:0;font-weight:600}
.formular .f-status:empty{display:none}
.formular .f-status-fehler{color:#FFB4A0}
.formular .f-status-ok{color:var(--creme);padding:1rem 1.25rem;border:1px solid var(--orange);border-radius:14px;background:rgba(232,103,58,.12)}
.formular .f-status:focus{outline:none}
.formular button:disabled{opacity:.7;cursor:progress}
.formular>.drittel.feld{grid-column:auto}
@media (max-width:760px){.formular>.drittel.feld{grid-column:1/-1}}
.formular .feld>label{display:block}
/* Felder bündig: Labels einzeilig, Eingaben auf gleicher Höhe */
.formular .feld>label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.formular:has(>.drittel){align-items:start}