/* Pilot i formularz (scena 12): tekst z punktami ✓ na granacie, formularz na białej karcie */
.contact{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,6vw,88px);align-items:start}
.contact-copy{display:grid;gap:22px;align-content:start}
.perks{list-style:none;padding:0;margin:6px 0 0;display:grid;gap:14px}
.perks li{display:grid;grid-template-columns:22px 1fr;gap:12px;align-items:start;color:var(--on-night-2)}
.contact-mail{margin:4px 0 0;color:var(--on-night-2)}
.contact-mail a{color:var(--on-night);font-weight:500;text-underline-offset:3px;overflow-wrap:anywhere}
.contact-mail a:hover{color:var(--blue-bright)}

.contact form{position:relative;display:grid;gap:16px;background:var(--paper);color:var(--ink);border-radius:var(--r-box);padding:clamp(22px,3vw,32px);box-shadow:0 30px 60px -30px color-mix(in srgb,var(--night) 80%,transparent)}
.contact form :focus-visible{outline-color:var(--blue)}
.frow{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start}
/* komunikaty jako tekst na białym: ciemniejsze warianty ważności (≥ 4,5:1) */
.fcell{display:grid;gap:6px;min-width:0}
.f-err{margin:0;font-size:13.5px;color:var(--warn-ink)}
.f-err[hidden]{display:none}
label.f input[aria-invalid="true"]{border-color:var(--warn-ink)}
.form-msg{margin:0;font-size:14px;color:var(--warn-ink)}
.form-msg:empty{display:none}
.form-note{margin:0;font-size:13px;line-height:1.5;color:var(--ink-3)}
.form-note a{color:inherit;text-underline-offset:2px}
.form-note a:hover{color:var(--ink)}
.btn-blue:disabled{opacity:.7;cursor:progress}
/* pułapka na boty poza ekranem (nie display:none, bo niektóre boty to sprawdzają) */
.trap{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
/* po wysłaniu karta z podziękowaniem zastępuje formularz */
.form-done{margin:0;background:var(--paper);color:var(--ok-ink);border-radius:var(--r-box);padding:clamp(22px,3vw,32px);font-size:18px;font-weight:500;line-height:1.45;
  box-shadow:0 30px 60px -30px color-mix(in srgb,var(--night) 80%,transparent)}
.form-done:focus{outline:none}
.form-done[hidden],.contact form[hidden]{display:none}

@media (max-width:980px){
  .contact{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:600px){
  .frow{grid-template-columns:minmax(0,1fr)}
}
