/* Blok „Zamówienie” – hasło, kontakty i formularz (1:1 z makiety). Klasy formularza używa też wtyczka „PrestigeCar Formularze”. */
.zam { display: grid; grid-template-columns: 1fr 1.05fr; gap: 70px; align-items: start; }
.zam__haslo .h { font-size: clamp(36px, 4vw, 60px); }
.zam__haslo > p:not(.etykieta) { margin: 22px 0 36px; color: var(--tekst-2); font-size: 19px; }

/* ---------- kontakty ---------- */
.kontakt-lista { display: grid; gap: 14px; margin: 0; padding: 0; list-style: none; }
.kontakt-lista a { display: flex; align-items: center; gap: 16px; padding: 16px 20px; background: var(--karta); border: 1px solid var(--karta-b); text-decoration: none; transition: border-color .3s; }
.kontakt-lista a:hover { border-color: transparent; }
.kontakt-lista small { display: block; color: var(--tekst-3); font-size: 13px; }
.kontakt-lista b { font-size: 17px; }
/* ikonki – szklane kółka: czerwone (telefon, e-mail), zielone (WhatsApp) */
.kontakt-lista .ikonka { flex: none; pointer-events: none; width: 50px; height: 50px; border: 1px solid rgba(255, 100, 90, .38); color: #ff9b92;
	background: radial-gradient(circle at 30% 25%, rgba(255, 110, 100, .32), rgba(175, 2, 2, .12) 72%);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, .16), 0 0 22px rgba(227, 38, 43, .14);
	transition: background .45s, border-color .45s, box-shadow .45s, color .45s, transform .45s; }
.kontakt-lista a:hover .ikonka { background: radial-gradient(circle at 30% 25%, #ff5a4e, #b00808 70%, #7d0000); border-color: rgba(255, 140, 130, .6); color: #fff;
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, .3), 0 8px 22px rgba(227, 38, 43, .45); transform: scale(1.06); }
.kontakt-lista .wa .ikonka { border-color: rgba(60, 220, 120, .42); color: #5fe394;
	background: radial-gradient(circle at 30% 25%, rgba(110, 240, 160, .30), rgba(18, 140, 70, .12) 72%);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, .16), 0 0 22px rgba(37, 211, 102, .14); }
.kontakt-lista .wa a:hover .ikonka { background: radial-gradient(circle at 30% 25%, #5cf093, #1fae57 70%, #128c4a); border-color: rgba(140, 250, 180, .6); color: #fff;
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, .3), 0 8px 22px rgba(37, 211, 102, .45); }
.kontakt-lista .wa .obrys-svg .kr { stroke: rgba(70, 225, 135, .5); }
.kontakt-lista .wa .obrys-svg .bl { stroke: #d4ffe3; }
.kontakt-lista .wa .obrys-svg .hl { stroke: #25d366; }
html[data-theme="light"] .kontakt-lista .ikonka { color: var(--czerwony-2); background: radial-gradient(circle at 30% 25%, rgba(255, 140, 130, .22), rgba(227, 38, 43, .08) 72%); border-color: rgba(227, 38, 43, .28); }
html[data-theme="light"] .kontakt-lista .wa .ikonka { color: #13924a; background: radial-gradient(circle at 30% 25%, rgba(110, 240, 160, .28), rgba(18, 140, 70, .08) 72%); border-color: rgba(18, 140, 70, .3); }
html[data-theme="light"] .kontakt-lista a:hover .ikonka, html[data-theme="light"] .kontakt-lista a:focus-visible .ikonka { color: #fff; background: radial-gradient(circle at 30% 25%, #ff5a4e, #b00808 70%, #7d0000); border-color: rgba(176, 8, 8, .6); }
html[data-theme="light"] .kontakt-lista .wa a:hover .ikonka, html[data-theme="light"] .kontakt-lista .wa a:focus-visible .ikonka { background: radial-gradient(circle at 30% 25%, #5cf093, #1fae57 70%, #128c4a); border-color: rgba(18, 140, 70, .6); }
.kontakt-lista .ikonka svg { width: 22px; height: 22px; }
.wa-logo .wa-logo__dymek { fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linejoin: round; }
.wa-logo .wa-logo__sluchawka { fill: currentColor; stroke: none; }

/* ---------- formularz ---------- */
.formularz { padding: 44px 42px; background: var(--karta); border: 1px solid var(--karta-b); box-shadow: var(--cien); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); }
html[data-theme="dark"] .formularz { background: rgba(12, 22, 32, .7); }
.formularz .h { font-size: 26px; }
.formularz > p { margin: 8px 0 28px; color: var(--tekst-2); font-size: 15px; }
.formularz__podglad { margin: -20px -18px 24px !important; padding: 10px 14px; background: #fff7d6; border: 1px solid #e8d78c; color: #5b4b00 !important; font: 600 12.5px/1.4 var(--font-t) !important; }
.pola { display: grid; grid-template-columns: 1fr 1fr; gap: 16px 18px; }
.pole { display: grid; gap: 7px; font-size: 13px; font-weight: 600; color: var(--tekst-2); letter-spacing: .3px; }
.pole--pelne { grid-column: 1 / -1; }
.pole input, .pole select, .pole textarea { width: 100%; min-height: 48px; padding: 12px 16px; border: 1px solid var(--pole-b); border-radius: 0; background: var(--pole); color: var(--tekst); font: 400 14.5px/1.4 var(--font-t); letter-spacing: 0; transition: border-color .25s, box-shadow .25s; }
.pole ::placeholder { color: var(--tekst-3); opacity: 1; }
.pole select { -webkit-appearance: none; appearance: none; padding-right: 46px; }
.pole textarea { min-height: 96px; resize: vertical; }
.pole :focus { outline: 0; border-color: var(--czerwony); box-shadow: 0 0 0 3px rgba(227, 38, 43, .18); }
/* rozwijane listy w stylu strony (select schowany, nad nim przycisk .wybor__pole i lista .wybor__lista – robi je widok.js) */
.wybor { position: relative; }
.wybor select { position: absolute; inset: 0; opacity: 0; pointer-events: none; }
.wybor__pole { position: relative; display: block; width: 100%; min-height: 48px; padding: 12px 46px 12px 16px; border: 1px solid var(--pole-b); background: var(--pole); color: var(--tekst);
	font: 400 14.5px/1.4 var(--font-t); letter-spacing: 0; text-align: left; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; cursor: pointer; transition: border-color .25s, box-shadow .25s; }
.wybor__pole.pusty { color: var(--tekst-3); }
/* strzałka: ścięty szewron + pionowa kreska; po otwarciu obraca się i świeci */
.wybor__pole::before { content: ""; position: absolute; right: 46px; top: 50%; width: 1px; height: 22px; margin-top: -11px; background: var(--pole-b); transition: background .25s, box-shadow .25s; }
.wybor__pole::after { content: ""; position: absolute; right: 17px; top: 50%; width: 13px; height: 8px; margin-top: -4px; background: var(--tekst-3);
	clip-path: polygon(0 0, 50% 58%, 100% 0, 100% 42%, 50% 100%, 0 42%); transition: transform .35s cubic-bezier(.2, .8, .2, 1), background .25s, filter .25s; }
.wybor__pole:hover::after { background: var(--tekst); transform: translateY(2px); }
.wybor.otwarty .wybor__pole::after { background: #ff3b2a; transform: rotate(180deg); filter: drop-shadow(0 0 5px rgba(255, 59, 42, .9)); }
.wybor.otwarty .wybor__pole::before, .wybor__pole:focus-visible::before { background: var(--czerwony); box-shadow: 0 0 8px rgba(255, 59, 42, .7); }
.wybor__pole:hover { border-color: rgba(255, 255, 255, .3); }
html[data-theme="light"] .wybor__pole:hover { border-color: rgba(9, 19, 27, .3); }
.wybor__pole:focus-visible, .wybor.otwarty .wybor__pole { outline: 0; border-color: var(--czerwony); box-shadow: 0 0 0 3px rgba(227, 38, 43, .18); }
.wybor__pole:disabled { cursor: not-allowed; opacity: .55; }
.wybor__lista { position: absolute; z-index: 30; left: 0; right: 0; top: calc(100% + 6px); max-height: 268px; margin: 0; padding: 6px; overflow-y: auto; list-style: none;
	border: 1px solid var(--pole-b); background: rgba(13, 22, 31, .97); box-shadow: 0 22px 50px rgba(0, 0, 0, .55);
	scrollbar-width: thin; scrollbar-color: rgba(227, 38, 43, .6) transparent;
	opacity: 0; visibility: hidden; transform: translateY(-6px); transition: opacity .2s, transform .2s, visibility .2s; }
html[data-theme="light"] .wybor__lista { background: #fff; box-shadow: 0 18px 44px rgba(9, 19, 27, .16); }
.wybor.otwarty .wybor__lista { opacity: 1; visibility: visible; transform: none; }
.wybor__lista li { position: relative; padding: 10px 34px 10px 14px; border-left: 2px solid transparent; color: var(--tekst-2); font-size: 14.5px; font-weight: 400; line-height: 1.4; cursor: pointer; transition: background-color .15s, color .15s, border-color .15s; }
.wybor__lista li:hover, .wybor__lista li.aktywny { background: rgba(227, 38, 43, .13); border-left-color: var(--czerwony); color: var(--tekst); }
.wybor__lista li[aria-selected="true"] { color: var(--tekst); font-weight: 600; }
.wybor__lista li[aria-selected="true"]::after { content: ""; position: absolute; right: 16px; top: 50%; width: 5px; height: 10px; border: solid var(--czerwony); border-width: 0 2px 2px 0; transform: translateY(-65%) rotate(45deg); }
/* telefon z kierunkowym (Prestige Forms 0.2.3+): mały przycisk kierunkowego (flaga + numer), numer obok;
   „inny” – pole kierunkowego obok listy, numer w 2. wierszu. Lista: kafelki w 2 kolumnach z nagłówkiem (prośba usera 13.11).
   Flagi rysuje CSS z data-kraj na przycisku i pozycjach listy – bez obrazków i bez emoji (Windows pokazuje emoji flag jako litery). */
.formularz .telefon { display: grid; grid-template-columns: 66px minmax(0, 1fr); gap: 6px; }
.formularz.pcf .telefon .wybor, .formularz .telefon > select { width: 66px; }
.formularz .telefon--inny { grid-template-columns: 66px 78px minmax(0, 1fr); }
.formularz .telefon--inny .telefon__numer { grid-column: 1 / -1; }
/* przycisk: sama flaga (numer kierunkowy widać w liście; czytnik ekranu dostaje go z aria-label) – user 13.11 */
.formularz.pcf .telefon .wybor__pole { display: flex; align-items: center; padding: 12px 24px 12px 12px; font-size: 0; overflow: hidden; }
.formularz.pcf .telefon .wybor__pole::after { right: 9px; width: 11px; height: 7px; margin-top: -3px; }
.formularz.pcf .telefon .wybor__lista { right: auto; width: 252px; max-height: none; display: grid; grid-template-columns: 1fr 1fr; gap: 4px; padding: 10px; }
.formularz.pcf .telefon .wybor__lista::before { grid-column: 1 / -1; padding: 2px 4px 6px; color: var(--tekst-3); font: 600 11px/1 var(--font-t); letter-spacing: 1.2px; text-transform: uppercase; content: "Kierunkowy"; }
html[lang^="en"] .formularz.pcf .telefon .wybor__lista::before { content: "Country code"; }
html[lang^="nl"] .formularz.pcf .telefon .wybor__lista::before { content: "Landcode"; }
.formularz.pcf .telefon .wybor__lista li { display: flex; align-items: center; gap: 10px; padding: 9px 10px; border: 0; color: var(--tekst-2); font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap;
	clip-path: polygon(6px 0, 100% 0, calc(100% - 6px) 100%, 0 100%); }
.formularz.pcf .telefon .wybor__lista li:hover, .formularz.pcf .telefon .wybor__lista li.aktywny { background: rgba(227, 38, 43, .14); color: var(--tekst); }
.formularz.pcf .telefon .wybor__lista li[aria-selected="true"] { background: linear-gradient(to right, var(--czerwony-3), var(--czerwony-2)); color: #fff; }
.formularz.pcf .telefon .wybor__lista li[aria-selected="true"]::after { content: none; }
/* flagi (te same kolory co w baza.css motywu); „inny” = globus */
.formularz.pcf .telefon [data-kraj]::before { content: ""; position: static; margin: 0; display: inline-block; flex: none; width: 21px; height: 14px; border-radius: 2px; box-shadow: 0 0 0 1px rgba(255, 255, 255, .18); }
html[data-theme="light"] .formularz.pcf .telefon [data-kraj]::before { box-shadow: 0 0 0 1px rgba(9, 19, 27, .2); }
.formularz.pcf .telefon [data-kraj="PL"]::before { background: linear-gradient(#fff 50%, #dc143c 0); }
.formularz.pcf .telefon [data-kraj="NL"]::before { background: linear-gradient(#ae1c28 33.3%, #fff 0 66.6%, #21468b 0); }
.formularz.pcf .telefon [data-kraj="DE"]::before { background: linear-gradient(#000 33.3%, #dd0000 0 66.6%, #ffce00 0); }
.formularz.pcf .telefon [data-kraj="BE"]::before { background: linear-gradient(90deg, #000 33.3%, #fdda24 0 66.6%, #ef3340 0); }
.formularz.pcf .telefon [data-kraj="LU"]::before { background: linear-gradient(#ea141d 33.3%, #fff 0 66.6%, #51add2 0); }
.formularz.pcf .telefon [data-kraj=""]::before { width: 16px; height: 16px; border-radius: 0; box-shadow: none; background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M3 12h18M12 3c2.6 2.8 3.9 5.8 3.9 9s-1.3 6.2-3.9 9c-2.6-2.8-3.9-5.8-3.9-9S9.4 5.8 12 3z'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M3 12h18M12 3c2.6 2.8 3.9 5.8 3.9 9s-1.3 6.2-3.9 9c-2.6-2.8-3.9-5.8-3.9-9S9.4 5.8 12 3z'/%3E%3C/svg%3E") center / contain no-repeat; }
.pole--blad .telefon .wybor__pole { border-color: var(--czerwony); }
/* zgoda: link do polityki jak zwykły tekst, po najechaniu jaśnieje z czerwonym podkreśleniem */
.zgoda { display: flex; gap: 12px; margin: 20px 0 26px; color: var(--tekst-3); font-size: 13px; line-height: 1.5; }
.zgoda a { color: inherit; text-decoration: none; background: linear-gradient(var(--czerwony), var(--czerwony)) 0 100% / 0 1px no-repeat; transition: color .25s, background-size .35s cubic-bezier(.2, .8, .2, 1); }
.zgoda a:hover, .zgoda a:focus-visible { color: var(--tekst); background-size: 100% 1px; outline: 0; }
.zgoda input { flex: none; width: 18px; height: 18px; margin-top: 2px; accent-color: var(--czerwony); }
.formularz .przycisk { width: 100%; min-height: 62px; font-size: 17px; }
.wym { color: var(--czerwony); font-weight: 700; }
/* komunikaty błędów w stylu strony zamiast dymka przeglądarki */
.pole--blad input, .pole--blad textarea { border-color: var(--czerwony); box-shadow: 0 0 0 3px rgba(227, 38, 43, .15); }
.pole__blad, .zgoda__blad { display: flex; align-items: center; gap: 9px; color: #ff6a5a; font: 500 12.5px/1.35 var(--font-t); letter-spacing: .2px; }
html[data-theme="light"] .pole__blad, html[data-theme="light"] .zgoda__blad { color: #c4161c; }
.pole__blad::before, .zgoda__blad::before { content: "!"; display: grid; place-items: center; flex: none; width: 18px; height: 14px; color: #fff; font: 700 10px/1 var(--font-h);
	background: linear-gradient(135deg, #f0302a, #a00404); transform: skewX(-18deg); box-shadow: 0 0 10px rgba(255, 40, 30, .45); }
.zgoda__blad { margin: -16px 0 18px 30px; }
@media (prefers-reduced-motion: no-preference) { .pole__blad, .zgoda__blad { animation: blad-wejscie .35s cubic-bezier(.2, .8, .2, 1) both; } .pole--blad.drgnij input { animation: blad-drgnij .4s; } }
@keyframes blad-wejscie { from { opacity: 0; transform: translateY(-5px); } to { opacity: 1; transform: none; } }
@keyframes blad-drgnij { 20%, 60% { transform: translateX(-4px); } 40%, 80% { transform: translateX(4px); } }
.formularz__ok { display: flex; flex-wrap: wrap; gap: 4px 8px; margin-top: 18px; padding: 16px 18px; border-left: 3px solid #25d366; background: rgba(37, 211, 102, .1); color: var(--tekst-2); font-size: 14.5px; }
.formularz__ok[hidden] { display: none; }
.formularz__ok b { color: var(--tekst); }
.formularz > .formularz__wym { margin: 12px 0 0; color: var(--tekst-3); font-size: 12px; text-align: right; }
/* tryb: „Chcę sprowadzić auto” / „Inne pytanie” – dwa skośne przełączniki */
.formularz__tryb { display: flex; gap: 8px; margin-bottom: 26px; }
.formularz__tryb label { position: relative; cursor: pointer; }
.formularz__tryb input { position: absolute; opacity: 0; }
.formularz__tryb span { position: relative; isolation: isolate; overflow: hidden; display: block; padding: 9px 18px; border: 1px solid var(--pole-b); background: var(--pole); color: var(--tekst-2); font: 600 13.5px/1.2 var(--font-t); letter-spacing: .3px;
	clip-path: polygon(8px 0, 100% 0, calc(100% - 8px) 100%, 0 100%); transition: color .25s, background .25s, border-color .25s; }
.formularz__tryb span::before { content: ""; position: absolute; inset: 0 -12px; z-index: -1; background: linear-gradient(90deg, rgba(227, 38, 43, .32), rgba(227, 38, 43, .12)); transform: translateX(-102%) skewX(-20deg); transition: transform .4s cubic-bezier(.2, .8, .2, 1); }
.formularz__tryb label:hover span { color: var(--tekst); border-color: var(--czerwony); }
.formularz__tryb label:hover input:not(:checked) + span::before { transform: translateX(0) skewX(-20deg); }
.formularz__tryb label:hover input:not(:checked) + span { box-shadow: inset 0 -2px 0 #ff3b2a; }
.formularz__tryb input:checked + span { background: linear-gradient(to right, var(--czerwony-3), var(--czerwony-2)); border-color: var(--czerwony-2); color: #fff; }
/* fokus z klawiatury: obrys na całym przełączniku (na span-ie ucinał go clip-path) */
.formularz__tryb label:has(input:focus-visible) { outline: 2px solid var(--czerwony); outline-offset: 3px; }
.formularz--inne .pole--auto { display: none; }
@media (prefers-reduced-motion: no-preference) { .formularz--zmiana .pola { animation: seo-tekst .45s cubic-bezier(.2, .8, .2, 1); } }

@media (max-width: 1000px) { .zam { grid-template-columns: 1fr; gap: 40px; } }
@media (max-width: 640px) {
	.formularz { padding: 30px 22px; }
	.pola { grid-template-columns: 1fr; }
}