/* ===== Kontakt – clean corporate, brand #ffcc03 ===== */
:root{
  --brand:#ffcc03;
  --ink:#0b0f14;
  --muted:#738095;
  --line:#e6eef5;
  --panel:#0b0f14;
  --card:#0f1623;
  --bg:#f6f9fc;
}

.container{max-width:1240px;margin:0 auto;padding:0 22px}

/* ---------- Hero ---------- */
.c-hero{background:linear-gradient(180deg,#fff,#fafcff);border-bottom:1px solid var(--line)}
.c-hero .container{padding:48px 22px 32px}
.c-hero__title{margin:0 0 6px;font-size:clamp(28px,3.2vw,44px);color:var(--ink);font-weight:800;letter-spacing:.2px}
.c-hero__lead{margin:0;color:#22303f}

/* ---------- Cards (telefon/mail/biuro) ---------- */
.c-info{background:#fff}
.c-grid{
  display:grid;
  gap:22px;
  padding:28px 22px;
  grid-template-columns:repeat(3,1fr);
  align-items:stretch;          /* równe wysokości w rzędzie */
}
@media (max-width:992px){.c-grid{grid-template-columns:1fr}}

.c-card{
  background:#111826;
  color:#e6eef6;
  border:1px solid #192233;
  border-radius:18px;
  padding:20px;
  position:relative;
  overflow:hidden;
  display:flex;                 /* aby „przycisk” był przy dole */
  flex-direction:column;
  height:100%;
}
.c-card::after{
  content:"";
  position:absolute; inset:0 auto auto 0; width:90px; height:90px;
  background:radial-gradient(closest-side,rgba(255,204,3,.2),transparent 70%);
  filter:blur(8px); pointer-events:none;
}
.c-card h3{margin:6px 0 8px; font-size:20px; color:#fff}
.c-card p{margin:0 0 6px}
.c-card .c-note{color:#b9c6d8; font-size:14px}

/* Ikona – poprawione ucinanie SVG (koperta) + centrowanie */
.c-card__icon{
  width:42px; height:42px; color:var(--brand);
  display:inline-flex; align-items:center; justify-content:center;
  margin-bottom:8px;
}
.c-card__icon svg{
  width:100%; height:100%;
  display:block;
  overflow:visible;             /* NIE ucinaj ścieżek ikony */
}

.c-link{color:#fff; text-decoration:none; border-bottom:1px dashed rgba(255,204,3,.5)}
.c-link:hover{border-bottom-color:transparent}

/* ---------- Brand parallelogram button (równe prostokąty pochyłe) ---------- */
.btn-skew{
  --h:44px; --sk:-10deg; --pad:20px;
  position:relative;
  display:inline-flex; align-items:center; justify-content:center;
  height:var(--h); padding:0 var(--pad);
  line-height:1; border:0; background:transparent;
  color:#111; font-weight:800; letter-spacing:.2px; text-decoration:none;
  border-radius:12px; isolation:isolate; cursor:pointer; box-shadow:none;
}
/* tło – tylko jeden pseudo-element */
.btn-skew::before{
  content:""; position:absolute; inset:0;
  background:var(--brand); transform:skewX(var(--sk));
  border-radius:12px; z-index:0; box-shadow:0 10px 24px rgba(255,204,3,.35);
}
.btn-skew::after{content:none!important;display:none!important}
.btn-skew > span, .btn-skew > svg{position:relative; z-index:1}
.btn-skew:hover::before{filter:brightness(.96); transform:skewX(var(--sk)) translateY(-1px)}
.btn-skew:active::before{transform:skewX(var(--sk))}
.btn-skew:focus-visible{outline:3px solid #111; outline-offset:3px}

/* Przyciski w kartach zawsze w tej samej linii (na dole) */
.c-card .c-actions{margin-top:auto; padding-top:12px}
.c-actions .btn-skew{--h:40px; --pad:16px}

/* ---------- Formularz ---------- */
.c-form{background:#f7fafc;border-top:1px solid var(--line)}
.c-form .container{padding:36px 22px}
.c-form h2{margin:0 0 18px;font-size:26px;color:var(--ink)}
.c-form__grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media (max-width:768px){.c-form__grid{grid-template-columns:1fr}}
.c-form__grid label{display:grid;gap:6px;font-weight:600;color:#233246}
.c-form__grid input,
.c-form__grid textarea{
  border:1px solid var(--line);
  border-radius:12px;
  padding:12px 14px;
  font:inherit;
  background:#fff;
  color:#0b0f14;
  line-height:1.3;
}
.c-form__grid input::placeholder,
.c-form__grid textarea::placeholder{color:var(--muted)}
.c-form__grid input:focus,
.c-form__grid textarea:focus{
  outline:3px solid color-mix(in srgb, var(--brand) 60%, #fff);
  outline-offset:1px;
  border-color:var(--brand);
}
.c-form__grid textarea{resize:vertical; min-height:160px}
.c-form__full{grid-column:1/-1}
.c-check{display:grid;grid-auto-flow:column;align-items:start;gap:10px}
.c-form__actions{grid-column:1/-1;margin-top:6px}

/* Alerty */
.c-alert{border-radius:12px;padding:12px 14px;margin:0 0 16px}
.c-alert--ok{background:#e8f8ea;border:1px solid #bfe6c6;color:#0b5d22}
.c-alert--err{background:#fff1f1;border:1px solid #ffd6d6;color:#7a1010}

/* Honeypot */
.hp{display:none!important}

/* ---------- (opcjonalne) stylowanie dla CF7 submit bez klasy ---------- */
.c-form .wpcf7-submit{
  position:relative; display:inline-flex; align-items:center; justify-content:center;
  height:44px; padding:0 20px; line-height:1; border:0; background:transparent;
  color:#111; font-weight:800; text-decoration:none; border-radius:12px; isolation:isolate; cursor:pointer;
}
.c-form .wpcf7-submit::before{
  content:""; position:absolute; inset:0; background:var(--brand);
  transform:skewX(-10deg); border-radius:12px; z-index:0; box-shadow:0 10px 24px rgba(255,204,3,.35);
}
.c-form .wpcf7-submit::after{content:none!important;display:none!important}
.c-form .wpcf7-submit:hover::before{filter:brightness(.96); transform:skewX(-10deg) translateY(-1px)}
.c-form .wpcf7-submit:active::before{transform:skewX(-10deg)}
.c-form .wpcf7-submit:focus-visible{outline:3px solid #111; outline-offset:3px}
.c-form .wpcf7-submit[disabled]{opacity:.6; cursor:not-allowed}

/* ---------- Mapa ---------- */
.c-map .container{padding:10px 22px 42px}
.c-map__holder{
  height:420px; border:1px dashed #d8e1ec; border-radius:18px;
  background:
    linear-gradient(135deg, rgba(255,204,3,.12), transparent 40%),
    radial-gradient(300px 120px at 85% 20%, rgba(255,204,3,.15), transparent 60%),
    #0f1623;
  display:grid; place-items:center; color:#e6eef6;
  position:relative; overflow:hidden;
}
.c-map__holder iframe{width:100%;height:100%;border:0;display:block}
.c-map__holder::before{
  content:"Mapa zostanie wczytana po kliknięciu";
  position:absolute; top:16px; left:16px; color:#b9c6d8; font-size:14px;
}
.c-map .btn-skew{position:absolute;bottom:16px;right:16px}
@media (max-width:640px){.c-map__holder{height:320px}}

/* ---------- Utilities ---------- */
.sr-only{position:absolute!important;height:1px;width:1px;overflow:hidden;clip:rect(1px,1px,1px,1px)}
