/* ilda.pl — style wspólne (menu, formularz, dostępność). Reszta wyglądu jest w atrybutach style w HTML. */

html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
img, svg { max-width: 100%; }

.skip-link {
  position: absolute; left: 16px; top: -100px; z-index: 100;
  padding: 10px 16px; border-radius: 10px; background: #16241D; color: #FBFCFB !important; font-weight: 600; text-decoration: none;
}
.skip-link:focus { top: 12px; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
a:focus-visible, button:focus-visible { outline: 2px solid #2F7356; outline-offset: 3px; border-radius: 6px; }

/* ---------- menu mobilne ---------- */
.nav-burger .icon-close { display: none; }
.nav-burger[aria-expanded="true"] .icon-open { display: none; }
.nav-burger[aria-expanded="true"] .icon-close { display: inline-flex; }
.nav-burger span { display: inline-flex; }
.mobile-menu[hidden] { display: none !important; }

/* ---------- formularz kontaktowy ---------- */
.contact-card {
  flex: 1 1 440px; min-width: 0; box-sizing: border-box;
  background: #FBFCFB; border: 1px solid #DAE1DB; border-radius: 20px; padding: 40px;
  display: grid; /* formularz i ekran "wysłano" w tej samej komórce = stała wysokość */
}
@media (max-width: 480px) { .contact-card { padding: 28px 20px; } }
.contact-card > form, .contact-card > .success { grid-area: 1 / 1; }
.contact-card .is-off { visibility: hidden; }

.contact-card form { display: flex; flex-direction: column; gap: 20px; }
.contact-card .field { display: flex; flex-direction: column; gap: 8px; }
.contact-card label { font-size: 14px; font-weight: 600; }
.contact-card .input-wrap { position: relative; display: flex; }
.contact-card input, .contact-card textarea {
  width: 100%; box-sizing: border-box; min-height: 50px; padding: 12px 14px;
  border: 1px solid #C3CCC5; border-radius: 10px; font: inherit; color: #16241D; background: #F2F5F2;
  transition: border-color .15s, box-shadow .15s;
}
.contact-card textarea { height: 132px; resize: none; }
.contact-card input:focus, .contact-card textarea:focus { outline: none; border-color: #2F7356; box-shadow: 0 0 0 3px rgba(47, 115, 86, .2); }
.contact-card [aria-invalid="true"] { border-color: #912018; background: #FEF3F2; }
.contact-card [aria-invalid="true"]:focus { border-color: #912018; box-shadow: 0 0 0 3px rgba(217, 45, 32, .18); }

/* Komunikat błędu: czerwona etykieta osadzona na górnej krawędzi pola. */
.contact-card .field-error {
  position: absolute; top: 0; right: 12px; transform: translateY(-50%);
  max-width: calc(100% - 24px); box-sizing: border-box; padding: 2px 9px;
  border: 1px solid #7A1A12; border-radius: 6px; background: #D92D20; color: #FFFFFF;
  font-size: 12px; font-weight: 600; line-height: 16px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; visibility: hidden;
}
.contact-card .field-error.is-on { visibility: visible; }

.contact-card .turnstile-box { min-height: 65px; }

.contact-card button { min-height: 52px; border: 0; border-radius: 12px; background: #16241D; color: #FBFCFB; font: inherit; font-weight: 600; cursor: pointer; }
.contact-card button:disabled { opacity: .65; cursor: wait; }

/* Notka i komunikat zbiorczy dzielą to samo miejsce. */
.contact-card .foot { display: grid; font-size: 13px; line-height: 1.5; min-height: 3em; }
.contact-card .foot > * { grid-area: 1 / 1; margin: 0; }
.contact-card .note { color: #4D5B53; }
.contact-card .summary { display: flex; gap: 8px; align-items: flex-start; color: #B42318; font-weight: 500; }
.contact-card .summary::before {
  content: "!"; flex: none; width: 14px; height: 14px; margin-top: 2px; border-radius: 50%;
  background: #B42318; color: #fff; font-size: 10px; font-weight: 700; line-height: 14px; text-align: center;
}

.contact-card .success { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 20px; }
.contact-card .success:focus { outline: none; }
.contact-card .success-icon { width: 64px; height: 64px; border-radius: 50%; background: #E2EFE7; display: flex; align-items: center; justify-content: center; }
.contact-card .success h3 { margin: 0; font-family: 'Space Grotesk', sans-serif; font-size: 30px; font-weight: 700; line-height: 1.15; letter-spacing: -0.02em; }
.contact-card .success p { margin: 0; font-size: 17px; color: #4D5B53; }
.contact-card .success p strong { color: #16241D; font-weight: 600; }
.contact-card .btn-secondary { min-height: 48px; padding: 0 22px; border: 1px solid #C3CCC5; background: #FBFCFB; color: #16241D; }

/* Pole-pułapka: niewidoczne dla ludzi, ale obecne w HTML dla botów. */
.contact-card .hp { position: absolute !important; left: -10000px !important; width: 1px; height: 1px; overflow: hidden; }
