/* ==========================================================================
   forms.css — formularz kontaktowy.
   Ładowany tylko na podstronach, które mają formularz (strona główna, /kontakt),
   żeby pozostałe podstrony nie pobierały tego kodu.
   ========================================================================== */

/* --- Układ: formularz + zdjęcie --------------------------------------- */
.k-split{display:grid;grid-template-columns:1fr 1fr;border-radius:var(--r);overflow:hidden;border:1.5px solid var(--line);margin-top:40px}
.k-split__form{background:#fff;padding:clamp(24px,3.5vw,48px)}
.k-split__photo{position:relative;min-height:500px}
.k-split__photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:80% center;display:block;image-rendering:-webkit-optimize-contrast}
@media(max-width:820px){.k-split{grid-template-columns:1fr}.k-split__photo{min-height:260px;order:-1}.k-split__photo img{object-position:center 0%}}

/* --- Pola ------------------------------------------------------------- */
form.k-form{display:grid;gap:18px}
.frow{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.field{display:flex;flex-direction:column;gap:7px}
.field__label{font-size:.82rem;font-weight:600;color:var(--green);font-family:'Safiro',sans-serif}
.field input,.field textarea{font-family:inherit;font-size:1rem;padding:13px 15px;border:1px solid var(--line-2);border-radius:10px;background:#fff;color:var(--ink);transition:border-color .2s,box-shadow .2s}
.field input:focus,.field textarea:focus{border-color:var(--green);box-shadow:0 0 0 3px rgba(22,66,69,.08);outline:none}
.field textarea{resize:vertical;min-height:130px}
.field--intent .field__label{font-size:.82rem;font-weight:600;color:var(--green);font-family:'Safiro',sans-serif;margin-bottom:2px}
@media(max-width:600px){.frow{grid-template-columns:1fr}}

/* --- Wybór tematu (radio jako karty) ---------------------------------- */
.intent-options{display:flex;flex-direction:column;gap:10px;margin-top:4px}
.intent-option{display:block;cursor:pointer}
.intent-radio{position:absolute;opacity:0;width:0;height:0;pointer-events:none}
.intent-option__inner{display:flex;align-items:center;gap:12px;padding:13px 16px;border:1.5px solid var(--line-2);border-radius:10px;background:#fff;transition:border-color .2s,background .2s,box-shadow .2s}
.intent-option:hover .intent-option__inner{border-color:rgba(22,66,69,.35);background:#fafafa}
.intent-option:focus-within .intent-option__inner{border-color:var(--green);box-shadow:0 0 0 3px rgba(22,66,69,.08)}
.intent-option__dot{width:18px;height:18px;border-radius:50%;border:2px solid var(--line-2);flex:none;position:relative;transition:border-color .18s,background .18s}
.intent-option__dot::after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) scale(0);width:8px;height:8px;border-radius:50%;background:var(--green);transition:transform .18s var(--ease)}
.intent-radio:checked + .intent-option__inner{border-color:var(--green);background:rgba(22,66,69,.04)}
.intent-radio:checked + .intent-option__inner .intent-option__dot{border-color:var(--green)}
.intent-radio:checked + .intent-option__inner .intent-option__dot::after{transform:translate(-50%,-50%) scale(1)}
.intent-option__text{font-size:.95rem;color:var(--ink);line-height:1.4}

/* --- Komunikaty walidacji --------------------------------------------- */
.field-error{font-size:.8rem;color:#c0392b;font-family:'Safiro',sans-serif;margin-top:2px}
.field-hint{font-size:.8rem;color:var(--muted);font-family:'Safiro',sans-serif;margin-top:2px}
.req{color:var(--wood-ink,var(--wood));font-weight:700}
.k-note{font-size:.78rem;color:var(--muted);margin-top:4px}

/* --- Alternatywa: telefon --------------------------------------------- */
.contact-alt{display:flex;align-items:center;gap:10px;background:var(--ph,#eef1f0);border-radius:10px;padding:12px 14px;margin:4px 0 4px;font-size:.85rem;color:var(--ink)}
.contact-alt a{color:var(--green);font-weight:600;text-decoration:none;border-bottom:1px solid var(--wood)}
.contact-alt__icon{flex:none;width:32px;height:32px;border-radius:50%;background:#fff;display:flex;align-items:center;justify-content:center;color:var(--wood)}

/* --- Zgoda RODO ------------------------------------------------------- */
.consent-wrap{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:start}
.consent-checkbox{width:20px;height:20px;min-width:20px;margin:0;cursor:pointer;accent-color:var(--green);border-radius:4px}
.consent-label{font-size:.82rem;color:var(--muted);line-height:1.55;cursor:pointer}
.consent-label a{color:var(--green);border-bottom:1px solid var(--wood)}
.consent-label details{margin-top:4px}
/* UWAGA: w makiecie ten element dziedziczy z globalnej reguły `details summary`
   również display:flex i padding:26px 0 — dlatego „Zobacz szczegóły zgody" jest
   osobnym, wysokim wierszem. Wygląda to na skutek uboczny globalnej reguły, ale
   zostawiamy 1:1 z makietą. Do decyzji osobno (zob. raport). */
.consent-label summary{color:var(--green);cursor:pointer;font-weight:600;font-size:.76rem;list-style:none}
.consent-label summary::-webkit-details-marker{display:none}

/* --- Pole-pułapka na boty --------------------------------------------- */
/* Ukryte przed człowiekiem, ale bez display:none — część botów pomija takie pola.
   Wypełnienie tego pola = zgłoszenie odrzucane po cichu. */
.honeypot{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* --- Wynik wysłania --------------------------------------------------- */
/* Potwierdzenie wysłania musi rzucać się w oczy — wcześniej szara ramka na
   jasnym tle zlewała się z formularzem. Stąd pełny kolor marki, ikona
   z ptaszkiem i wejście z góry, żeby zmiana była zauważalna także wtedy, gdy
   po przekierowaniu strona wraca w to samo miejsce. */
.form-alert{border-radius:12px;padding:16px 18px;font-size:.92rem;line-height:1.55;margin-bottom:18px;display:flex;gap:14px;align-items:flex-start}
.form-alert__ikona{width:34px;height:34px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center}
.form-alert__ikona svg{width:18px;height:18px}
.form-alert strong{display:block;font-family:'Safiro',sans-serif;font-weight:600;font-size:1.02rem;margin-bottom:4px}

.form-alert--ok{background:var(--green);border:none;color:rgba(255,255,255,.85);box-shadow:0 14px 34px rgba(22,66,69,.22)}
.form-alert--ok strong{color:#fff}
.form-alert--ok a{color:#fff;text-decoration:underline;text-underline-offset:3px}
.form-alert--ok .form-alert__ikona{background:var(--wood);color:#fff}

.form-alert--err{background:rgba(192,57,43,.07);border:1px solid rgba(192,57,43,.4);color:#8f2b1b}
.form-alert--err strong{color:#a5321f}
.form-alert--err .form-alert__ikona{background:#a5321f;color:#fff}

@media (prefers-reduced-motion:no-preference){
  .form-alert{animation:form-alert-wejscie .45s var(--ease) both}
}
@keyframes form-alert-wejscie{
  from{opacity:0;transform:translateY(-10px)}
  to{opacity:1;transform:none}
}