/* assets/formularz.css
   Purpose: formularz przeglądu strony i próbka kartki — TYLKO /sprawdz-strone
   NOT for: logiki wysyłki (→ scan.js), układu wspólnego (→ site.css)

   WHY osobno: tych ~55 linii nie potrzebuje żadna inna strona i trzymają site.css
   z dala od limitu 200 linii. Przed 10.2026 index i /realizacje pobierały je na darmo. */

.scan { margin-top: clamp(2.2rem, 4vw, 3.2rem); max-width: 640px; }
.scan-label { font-family: var(--mono); font-size: var(--t-fine); color: var(--ink-faint); display: block; margin-bottom: .6rem; }
.scan-label.drugi { margin-top: 1.1rem; }
.scan-row { display: flex; flex-wrap: wrap; gap: .55rem; }
.scan input {
  flex: 1 1 15rem; min-width: 0;
  font-family: var(--mono); font-size: 1rem; color: var(--ink);
  background: var(--paper-pure); border: 1px solid var(--rule-hard);
  border-radius: 999px; padding: .95rem 1.3rem;
  box-shadow: 0 1px 2px rgba(20, 24, 32, .04) inset;
  transition: border-color .2s, box-shadow .2s;
}
/* Bez opacity: z .85 kontrast spadał do 4,47:1, tuż pod AA. Pełny --ink-faint na bieli = 6,25:1. */
.scan input::placeholder { color: var(--ink-faint); opacity: 1; }
/* Pierścień zamiast obrysu z base.css: obrys 2,5 px + obwódka pola dawały podwójną
   ramkę. Pierścień .25 jest widoczny także dla kogoś, kto nie widzi samej zmiany barwy. */
.scan input:focus-visible { outline: none; }
.scan input:focus { border-color: var(--amber); box-shadow: 0 0 0 4px rgba(176, 18, 38, .25); }
.scan button {
  font-family: var(--sans); font-size: 1rem; font-weight: 600; color: var(--paper-pure);
  background: var(--amber); border: 1px solid var(--amber);
  border-radius: 999px; padding: .92rem 1.6rem; cursor: pointer; min-height: 50px;
  transition: transform .25s var(--ease-out), background .25s, border-color .25s;
}
.scan button:hover { background: var(--ink); border-color: var(--ink); transform: translateY(-1px); }
.scan button:active { transform: translateY(0); }
.scan button[disabled] { opacity: .6; cursor: default; transform: none; }
.scan-out { font-family: var(--mono); font-size: var(--t-fine); line-height: 1.75; color: var(--ink-soft); margin-top: 1rem; min-height: 1.4em; }
.scan-out .done { color: var(--amber); }
.honey { position: absolute; left: -9999px; opacity: 0; }

/* Błąd pola — pusty znika, więc nie zostawia dziury w układzie. */
.scan-blad:empty { display: none; }
.scan-blad {
  margin: .5rem 0 0; font-family: var(--mono); font-size: var(--t-fine);
  color: var(--alarm); border-left: 2px solid var(--alarm); padding-left: .7rem;
}
.scan input[aria-invalid="true"] { border-color: var(--alarm); }
/* Nota RODO pod polem kontaktu — czytelna, ale nie konkuruje z przyciskiem. */
.scan-rodo { margin: .9rem 0 0; font-size: .8rem; line-height: 1.55; color: var(--ink-faint); max-width: 58ch; }

/* ── próbka kartki ─────────────────────────────────────────── */
.sample { display: grid; gap: clamp(1.8rem, 4vw, 3.4rem); grid-template-columns: 1fr; align-items: center; }
@media (min-width: 900px) { .sample { grid-template-columns: .95fr 1.05fr; } }
.sample figure { margin: 0; }
/* Biała rama i lekki przechył — kartka położona na stole, nie zrzut w siatce. */
.sample img {
  display: block; width: 100%; height: auto;
  padding: 8px; background: var(--paper-pure); border-radius: 16px;
  box-shadow: var(--cien-unos);
  transform: rotate(-.7deg);
}