/* Okno z formularzem kontaktowym */
dialog.cf {
  width: min(560px, calc(100% - 32px)); height: fit-content; max-width: none; max-height: calc(100% - 32px); margin: auto; padding: 0; overflow: auto;
  border: 1px solid rgba(255,255,255,.18); border-radius: 18px; color: #f2f2f2; background: #0c0c0c; backdrop-filter: none;
  box-shadow: 0 40px 100px rgba(0,0,0,.7), inset 0 1px 0 rgba(255,255,255,.08);
  font-family: Inter, ui-sans-serif, system-ui, sans-serif;
}
dialog.cf::backdrop { animation: none; background: rgba(0,0,0,.72); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
dialog.cf[open] { animation: cf-in .35s cubic-bezier(.2,.8,.2,1); }
@keyframes cf-in { from { opacity: 0; transform: translateY(14px) scale(.98); } to { opacity: 1; transform: none; } }
.cf-in { position: relative; padding: clamp(24px, 5vw, 38px); }
.cf-x { position: absolute; top: 14px; right: 14px; width: 38px; height: 38px; border: 1px solid rgba(255,255,255,.14); border-radius: 50%; color: #ddd; background: rgba(255,255,255,.05); font-size: 14px; cursor: pointer; }
.cf-x:hover { background: rgba(255,255,255,.12); color: #fff; }
.cf h2 { margin: 0; padding-right: 40px; font-size: clamp(1.6rem, 4vw, 2.1rem); font-weight: 600; letter-spacing: -.03em; line-height: 1.1;
  background: linear-gradient(125deg,#fff 0%,#d7d7d7 35%,#919191 68%,#f2f2f2 100%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.cf-lead { margin: 10px 0 24px; color: #a5a5a5; font-size: 14px; line-height: 1.6; }
.cf form { display: grid; gap: 14px; }
.cf-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.cf label { display: grid; gap: 7px; color: #b8b8b8; font-size: 12px; font-weight: 600; letter-spacing: .02em; }
.cf input, .cf textarea {
  width: 100%; padding: 13px 14px; border: 1px solid rgba(255,255,255,.16); border-radius: 10px; color: #fff; background: rgba(255,255,255,.04);
  font: 400 15px/1.4 Inter, system-ui, sans-serif; transition: border-color .2s ease, background .2s ease;
}
.cf textarea { min-height: 130px; resize: vertical; }
.cf input:focus, .cf textarea:focus { outline: 0; border-color: rgba(255,255,255,.55); background: rgba(255,255,255,.07); }
.cf input::placeholder, .cf textarea::placeholder { color: #666; }
.cf .hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.cf-send {
  display: inline-flex; align-items: center; justify-content: center; min-height: 50px; padding: 0 24px; border: 1px solid rgba(255,255,255,.58); border-radius: 999px;
  color: #111; background: linear-gradient(125deg,#fff 0%,#d7d7d7 35%,#919191 68%,#f2f2f2 100%); font: 650 14px/1 Inter, system-ui, sans-serif; cursor: pointer;
  transition: transform .25s ease, opacity .25s ease;
}
.cf-send:hover { transform: translateY(-2px); }
.cf-send[disabled] { opacity: .55; cursor: progress; transform: none; }
.cf-msg { min-height: 1.4em; margin: 0; font-size: 13px; line-height: 1.5; }
.cf-msg.is-err { color: #ff9d9d; }
.cf-msg.is-ok { color: #cfe9cf; }
.cf-note { margin: 4px 0 0; color: #777; font-size: 11.5px; line-height: 1.6; }
.cf-note a { color: #b5b5b5; text-decoration: underline; text-underline-offset: 2px; }
.cf-note a:hover { color: #fff; }
.cf-done { display: none; padding: 8px 0 4px; }
.cf.is-done form, .cf.is-done .cf-lead { display: none; }
.cf.is-done .cf-done { display: block; }
.cf-done p { margin: 14px 0 0; color: #bdbdbd; font-size: 15px; line-height: 1.65; }
@media (max-width: 520px) { .cf-row { grid-template-columns: 1fr; } }
