/* ==========================================================================
   Kontakt — układ strony. Karty, pola i komunikaty są wspólne (site.css);
   tu tylko to, czego nie ma nigdzie indziej: dwie kolumny karta/formularz
   i lista adresów w kartach.
   ========================================================================== */

.contact-section{padding-top:72px}
.contact-layout{display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);gap:28px;align-items:start}

.contact-cards{display:grid;gap:28px}
.contact-card{display:flex;flex-direction:column}
/* Nagłówki kart są h2 (pierwszy poziom pod h1 strony), ale wyglądają jak h3
   w kartach — skala h2 z site.css jest dla nagłówków sekcji. */
.contact-card h2{font-size:20px;line-height:1.3;letter-spacing:-.03em;margin-bottom:12px}
.contact-links{list-style:none;margin:22px 0 0;padding:20px 0 0;border-top:1px solid var(--line);display:grid;gap:10px}
.contact-links a{display:inline-flex;align-items:center;gap:12px;min-height:32px;font-size:14px;font-weight:500;color:var(--navy);overflow-wrap:anywhere}
.contact-links a:hover{text-decoration:underline}
.contact-links .icon{width:18px;height:18px;color:var(--gold-ink)}

.contact-form-card{padding:44px}
.contact-form-card h2{font-size:clamp(26px,2.4vw,34px);line-height:1.2;letter-spacing:-.04em}
.contact-form-lead{margin:12px 0 30px;color:var(--muted);font-size:14px;line-height:1.75}
.contact-flashes{margin-bottom:26px}
.contact-consent{padding:16px 18px;background:var(--surface);border-radius:12px;cursor:pointer}
.g-recaptcha{max-width:100%;overflow:hidden}

@media(max-width:900px){
  .contact-section{padding-top:56px}
  .contact-layout{grid-template-columns:1fr}
  /* Kolejności nie odwracamy przez `order`: kolejność tabulacji szłaby wtedy
     inaczej niż to, co widać. Karty są krótkie, a formularz tuż pod nimi. */
  .contact-cards{grid-template-columns:1fr 1fr}
}
@media(max-width:640px){
  .contact-section{padding-top:40px}
  .contact-cards{grid-template-columns:1fr;gap:20px}
  .contact-form-card{padding:26px 20px}
}
