/* ---------- Kontakt / Contact ----------
   Reuses mk-head (module.css). ct-* holds the form + info column. */
.ct-hero { padding-top: calc(var(--header-h) + 56px); }
.ct-grid { display: grid; grid-template-columns: 1.4fr 1fr; gap: 28px; margin-top: 44px; align-items: start; }

/* Form */
.ct-form { padding: 32px; }
.ct-hp { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.ct-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.ct-field { margin-top: 16px; display: flex; flex-direction: column; gap: 7px; }
.ct-field--first { margin-top: 0; }
.ct-field label { font-size: 13px; font-weight: 600; color: var(--fg); }
.ct-field input, .ct-field textarea, .ct-field select {
  font-family: inherit; font-size: 14px; color: var(--fg); background: var(--surface-2);
  border: 1px solid var(--border); border-radius: var(--r-md); padding: 11px 13px;
  transition: border-color .15s var(--ease-out), box-shadow .15s var(--ease-out); width: 100%;
}
.ct-field textarea { resize: vertical; min-height: 120px; }
.ct-field input::placeholder, .ct-field textarea::placeholder { color: var(--fg-subtle); }
.ct-field input:focus, .ct-field textarea:focus, .ct-field select:focus {
  outline: none; border-color: var(--nx-green); box-shadow: 0 0 0 3px color-mix(in srgb, var(--nx-green) 16%, transparent);
}
.ct-submit { margin-top: 22px; }
.ct-submit .btn { width: 100%; }
.ct-submit .btn[disabled] { opacity: .68; cursor: wait; }
.ct-error { display: none; margin-top: 13px; color: #ffb4b4; font-size: 13px; text-align: center; line-height: 1.45; }
.ct-error.is-shown { display: block; }
.ct-priv { margin-top: 14px; font-size: 12px; color: var(--fg-subtle); text-align: center; line-height: 1.5; }

/* Success state */
.ct-form.is-hidden { display: none; }
.ct-success { display: none; padding: 48px 28px; text-align: center; }
.ct-success.is-shown { display: block; }
.ct-success .ic { width: 60px; height: 60px; margin: 0 auto 18px; border-radius: 999px; display: grid; place-items: center; background: color-mix(in srgb, var(--nx-green) 16%, transparent); color: var(--nx-green); }
.ct-success .ic svg { width: 30px; height: 30px; }
.ct-success h3 { font-size: 22px; }
.ct-success p { margin-top: 10px; font-size: 14.5px; color: var(--fg-muted); line-height: 1.55; max-width: 44ch; margin-left: auto; margin-right: auto; }

/* Info column */
.ct-info { display: flex; flex-direction: column; gap: 20px; }
.ct-info__card { padding: 26px; }
.ct-info__card h3 { font-size: 16px; margin-bottom: 18px; }
.ct-steps { display: flex; flex-direction: column; gap: 16px; }
.ct-step { display: flex; gap: 13px; }
.ct-step .n { flex-shrink: 0; width: 28px; height: 28px; border-radius: 999px; display: grid; place-items: center; background: var(--surface-inset); border: 1px solid var(--border); color: var(--nx-green); font-family: var(--font-mono); font-size: 13px; font-weight: 700; }
.ct-step > span:last-child { display: flex; flex-direction: column; }
.ct-step .t { display: block; font-size: 14px; font-weight: 600; color: var(--fg-strong); }
.ct-step .d { display: block; font-size: 13px; color: var(--fg-muted); margin-top: 2px; line-height: 1.45; }
.ct-contact { display: flex; align-items: center; gap: 11px; font-size: 14px; color: var(--fg); }
.ct-contact .ci { color: var(--nx-green); display: grid; place-items: center; } .ct-contact .ci svg { width: 17px; height: 17px; }
.ct-contact a:hover { color: var(--nx-green); }
.ct-trust { display: flex; flex-direction: column; gap: 11px; }
.ct-trust li { display: flex; align-items: center; gap: 9px; font-size: 13.5px; color: var(--fg-muted); }
.ct-trust .ci { color: var(--nx-green); display: grid; place-items: center; flex-shrink: 0; } .ct-trust .ci svg { width: 15px; height: 15px; }

@media (max-width: 880px){ .ct-grid { grid-template-columns: 1fr; } .ct-row { grid-template-columns: 1fr; } }