@import url('./koszyk-podglad.css');
@import url('./tooltipy.css');

@font-face {
    font-family: "Poppins";
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url("../fonts/poppins-latin-ext-400-normal.woff2") format("woff2");
    unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

@font-face {
    font-family: "Poppins";
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url("../fonts/poppins-latin-ext-500-normal.woff2") format("woff2");
    unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

@font-face {
    font-family: "Poppins";
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url("../fonts/poppins-latin-ext-600-normal.woff2") format("woff2");
    unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

@font-face {
    font-family: "Poppins";
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url("../fonts/poppins-latin-ext-700-normal.woff2") format("woff2");
    unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

@font-face {
    font-family: "Poppins";
    font-style: normal;
    font-weight: 800;
    font-display: swap;
    src: url("../fonts/poppins-latin-ext-800-normal.woff2") format("woff2");
    unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

@font-face {
    font-family: "Poppins";
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url("../fonts/poppins-latin-400-normal.woff2") format("woff2");
    unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

@font-face {
    font-family: "Poppins";
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url("../fonts/poppins-latin-500-normal.woff2") format("woff2");
    unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

@font-face {
    font-family: "Poppins";
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url("../fonts/poppins-latin-600-normal.woff2") format("woff2");
    unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

@font-face {
    font-family: "Poppins";
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url("../fonts/poppins-latin-700-normal.woff2") format("woff2");
    unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

@font-face {
    font-family: "Poppins";
    font-style: normal;
    font-weight: 800;
    font-display: swap;
    src: url("../fonts/poppins-latin-800-normal.woff2") format("woff2");
    unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

:root {
    --tlo: #010512;
    --panel: #071027;
    --panel-jasny: rgba(255, 255, 255, .055);
    --tekst: #eaf1ff;
    --tekst-przygaszony: rgba(222, 232, 250, .67);
    --niebieski: #146fe8;
    --blekit: #20cfff;
    --fiolet: #7650ff;
    --rozowy: #ff0f74;
    --obramowanie: rgba(255, 255, 255, .11);
    --promien: 22px;
}

* { box-sizing: border-box; }

html {
    scroll-behavior: smooth;
    color-scheme: dark;
}

section[id] { scroll-margin-top: 100px; }

html.bez-przewijania { overflow: hidden; }

body {
    isolation: isolate;
    min-width: 320px;
    margin: 0;
    overflow-x: hidden;
    color: var(--tekst);
    background:
        radial-gradient(circle at 82% 8%, rgba(36, 91, 210, .17), transparent 27rem),
        radial-gradient(circle at 5% 35%, rgba(118, 80, 255, .08), transparent 30rem),
        var(--tlo);
    font-family: "Poppins", sans-serif;
}

button,
input,
select,
textarea { font-family: inherit; }

body > main,
body > footer {
    position: relative;
    z-index: 1;
}

.poswiaty-tla {
    position: fixed;
    z-index: 0;
    inset: 0;
    overflow: hidden;
    pointer-events: none;
    contain: strict;
    opacity: 1;
}

.poswiaty-tla::after {
    position: absolute;
    inset: 0;
    background: transparent;
    content: '';
}

.poswiaty-tla__plama {
    position: absolute;
    display: block;
    width: min(82vw, 1080px);
    aspect-ratio: 1;
    border-radius: 50%;
    opacity: .4;
    filter: blur(78px) saturate(1.16);
    will-change: transform;
}

.poswiaty-tla__plama--niebieska {
    top: -15%;
    right: -16%;
    background: radial-gradient(circle, rgba(18, 126, 255, .9) 0%, rgba(22, 121, 255, .4) 36%, transparent 70%);
    animation: ruch-poswiaty-niebieskiej 24s ease-in-out infinite alternate;
}

.poswiaty-tla__plama--fioletowa {
    bottom: -24%;
    left: -18%;
    background: radial-gradient(circle, rgba(125, 54, 255, .84) 0%, rgba(235, 23, 158, .3) 39%, transparent 71%);
    animation: ruch-poswiaty-fioletowej 29s ease-in-out infinite alternate;
}

@keyframes ruch-poswiaty-niebieskiej {
    0% { transform: translate3d(0, 0, 0) scale(1); }
    45% { transform: translate3d(-18vw, 24vh, 0) scale(1.08); }
    100% { transform: translate3d(-8vw, 58vh, 0) scale(.92); }
}

@keyframes ruch-poswiaty-fioletowej {
    0% { transform: translate3d(0, 0, 0) scale(.94); }
    52% { transform: translate3d(26vw, -34vh, 0) scale(1.06); }
    100% { transform: translate3d(54vw, -12vh, 0) scale(.98); }
}

button,
input,
textarea,
select {
    font: inherit;
    font-family: "Poppins", sans-serif;
}

button,
a { -webkit-tap-highlight-color: transparent; }

button:focus-visible,
a:focus-visible,
input:focus-visible,
textarea:focus-visible {
    outline: 3px solid rgba(32, 207, 255, .55);
    outline-offset: 3px;
}

.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;
}

.naglowek {
    position: relative;
    z-index: 20;
    width: min(1540px, calc(100% - 48px));
    min-height: 88px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
    margin: 0 auto;
    border-bottom: 1px solid rgba(255, 255, 255, .075);
}

.marka {
    color: #fff;
    font-size: 2rem;
    font-weight: 850;
    letter-spacing: -.055em;
    text-decoration: none;
}

.marka span { color: var(--rozowy); }

.naglowek__nawigacja {
    display: flex;
    gap: 32px;
}

.naglowek__nawigacja a,
.podsumowanie__powrot {
    color: rgba(234, 241, 255, .72);
    font-size: .92rem;
    font-weight: 650;
    text-decoration: none;
}

.naglowek__nawigacja a:hover,
.podsumowanie__powrot:hover { color: #fff; }

.hero {
    width: min(1540px, calc(100% - 48px));
    min-height: 730px;
    display: grid;
    grid-template-columns: minmax(580px, .9fr) minmax(600px, 1.1fr);
    align-items: center;
    margin: 0 auto;
    padding: 55px 0 85px;
}

.hero__tresc {
    position: relative;
    z-index: 3;
    max-width: 760px;
}

.hero__wstep {
    display: block;
    margin: 0 0 14px 5px;
    color: #fff;
    font-size: clamp(2rem, 3vw, 3rem);
    line-height: 1.05;
    text-transform: uppercase;
}

.hero h1 {
    margin: 0;
    line-height: .85;
    letter-spacing: -.06em;
    text-transform: uppercase;
}

.hero h1 span {
    display: block;
    color: #f6f7fa;
    font-size: clamp(5rem, 8vw, 8.25rem);
    font-weight: 950;
}

.hero h1 strong {
    display: block;
    width: max-content;
    max-width: 100%;
    margin-top: 18px;
    color: transparent;
    background: linear-gradient(90deg, var(--blekit), #1688ff 48%, var(--fiolet) 80%, var(--rozowy));
    -webkit-background-clip: text;
    background-clip: text;
    font-size: clamp(2.85rem, 5.2vw, 5.25rem);
    font-weight: 950;
    white-space: nowrap;
}

.hero__podpis {
    margin: 58px 0 24px 7px;
    color: #fff;
    font-size: clamp(1.45rem, 2.3vw, 2.15rem);
    font-weight: 650;
}

.formularz-startowy {
    max-width: 690px;
    min-height: 64px;
    display: flex;
    padding: 5px;
    border: 1px solid rgba(255, 255, 255, .2);
    border-radius: 999px;
    background: rgba(255, 255, 255, .055);
    backdrop-filter: blur(14px);
}

.formularz-startowy input {
    flex: 1;
    min-width: 0;
    padding: 0 22px;
    border: 0;
    outline: 0;
    color: #fff;
    background: transparent;
}

.formularz-startowy input::placeholder { color: rgba(220, 230, 250, .52); }

.formularz-startowy button,
.przycisk-glowny,
.karta-szablonu__wybierz {
    border: 1px solid rgba(255, 255, 255, .16);
    color: #fff;
    background: var(--niebieski);
    box-shadow: inset 0 1px rgba(255, 255, 255, .17), 0 8px 22px rgba(20, 111, 232, .22);
    cursor: pointer;
    transition: transform .18s ease, background .18s ease;
}

.formularz-startowy button:hover,
.przycisk-glowny:hover,
.karta-szablonu__wybierz:hover {
    transform: translateY(-1px);
    background: #0f63d4;
}

.formularz-startowy button {
    flex: 0 0 auto;
    min-width: 205px;
    padding: 0 27px;
    border-radius: 999px;
    font-weight: 800;
}

.hero__zalety {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px 15px;
    margin: 21px 0 0 7px;
    color: #fff;
    font-size: clamp(.93rem, 1.15vw, 1.1rem);
    font-weight: 600;
}

.hero__zalety i {
    width: 20px;
    height: 1px;
    background: var(--blekit);
    opacity: .72;
}

.hero__grafika {
    position: relative;
    z-index: 1;
    width: calc(100% + 280px);
    margin-left: -235px;
    pointer-events: none;
}

.hero__grafika img {
    display: block;
    width: min(1180px, 132%);
    max-width: none;
    height: auto;
    transform: translateX(35px);
    filter: drop-shadow(0 34px 38px rgba(0, 0, 0, .42));
}

.mozliwosci,
.szablony {
    width: min(1380px, calc(100% - 48px));
    margin: 0 auto;
    padding: 105px 0;
}

.mozliwosci { border-top: 1px solid rgba(255, 255, 255, .075); }

.sekcja-naglowek {
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(280px, .75fr);
    gap: 70px;
    align-items: end;
    margin-bottom: 52px;
}

.etykieta,
.krok-formularza__numer {
    color: #8fb5ff;
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .14em;
    text-transform: uppercase;
}

.sekcja-naglowek h2,
.brak-oferty h1 {
    max-width: 850px;
    margin: 12px 0 0;
    color: #fff;
    font-size: clamp(2.4rem, 5vw, 4.8rem);
    line-height: 1;
    letter-spacing: -.055em;
}

.sekcja-naglowek p,
.brak-oferty p {
    margin: 0;
    color: var(--tekst-przygaszony);
    line-height: 1.75;
}

.siatka-zalet {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
}

.siatka-zalet article,
.pusty-stan {
    padding: 34px;
    border: 1px solid var(--obramowanie);
    border-radius: var(--promien);
    background: linear-gradient(145deg, rgba(255, 255, 255, .065), rgba(255, 255, 255, .025));
}

.siatka-zalet b { color: var(--blekit); font-size: .8rem; }
.siatka-zalet h3 { margin: 25px 0 12px; color: #fff; font-size: 1.45rem; }
.siatka-zalet p { margin: 0; color: var(--tekst-przygaszony); line-height: 1.7; }

.szablony { padding-top: 80px; }

.siatka-szablonow {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 22px;
}

.karta-szablonu {
    overflow: hidden;
    border: 1px solid var(--obramowanie);
    border-radius: 18px;
    background: rgba(255, 255, 255, .04);
    transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}

.karta-szablonu:hover {
    transform: translateY(-3px);
    border-color: rgba(79, 169, 255, .34);
}

.karta-szablonu.wybrany {
    border: 3px solid #28d7a1;
    box-shadow: 0 0 0 3px rgba(40, 215, 161, .14), 0 18px 42px rgba(40, 215, 161, .14);
}

.karta-szablonu__obraz {
    width: 100%;
    aspect-ratio: 16 / 10;
    display: block;
    overflow: hidden;
    padding: 0;
    border: 0;
    color: #fff;
    background: #0c1732;
    cursor: zoom-in;
}

.karta-szablonu__obraz img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    transition: transform .35s ease;
}

.karta-szablonu:hover .karta-szablonu__obraz img { transform: scale(1.025); }

.karta-szablonu__zastepczy {
    height: 100%;
    display: grid;
    place-items: center;
    background: linear-gradient(135deg, #101d40, #142d69);
    font-size: 2rem;
    font-weight: 800;
}

.karta-szablonu__tresc { padding: 23px; }
.karta-szablonu__tresc h3 { margin: 0 0 10px; color: #fff; font-size: 1.42rem; }
.karta-szablonu__tresc p { min-height: 76px; margin: 0; color: var(--tekst-przygaszony); line-height: 1.65; }

.karta-szablonu__akcje {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin-top: 21px;
}

.karta-szablonu__akcja {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 15px;
    border-radius: 999px;
    font-size: .88rem;
    font-weight: 750;
    text-decoration: none;
    cursor: pointer;
    transition: color .18s ease, background .18s ease, border-color .18s ease;
}

.karta-szablonu__akcja--galeria {
    border: 1px solid rgba(255, 255, 255, .14);
    color: #e4edff;
    background: rgba(255, 255, 255, .055);
}

.karta-szablonu__akcja--galeria:hover { background: rgba(255, 255, 255, .1); }

.karta-szablonu__akcja--demo {
    border: 1px solid rgba(94, 184, 255, .36);
    color: #70c4ff;
    background: rgba(20, 111, 232, .1);
}

.karta-szablonu__akcja--demo:hover { color: #fff; background: rgba(20, 111, 232, .24); }
.karta-szablonu__akcja--wylaczona { opacity: .42; cursor: not-allowed; }

.karta-szablonu__wybierz {
    width: 100%;
    min-height: 46px;
    margin-top: 10px;
    border-radius: 999px;
    font-weight: 780;
}

.karta-szablonu__wybierz--wybrany,
.karta-szablonu__wybierz--wybrany:hover {
    border-color: #28d7a1;
    color: #03150f;
    background: linear-gradient(135deg, #54ebbd, #28d7a1);
    box-shadow: 0 10px 28px rgba(40, 215, 161, .2);
}

.stopka {
    width: min(1380px, calc(100% - 48px));
    min-height: 100px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 25px;
    margin: 0 auto;
    border-top: 1px solid rgba(255, 255, 255, .08);
    color: rgba(222, 232, 250, .45);
    font-size: .85rem;
}

.brak-oferty {
    min-height: calc(100vh - 188px);
    display: grid;
    place-content: center;
    padding: 40px 24px;
    text-align: center;
}

.modal {
    position: fixed;
    z-index: 1000;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 26px;
    visibility: hidden;
    opacity: 0;
    background: rgba(1, 5, 18, .86);
    backdrop-filter: blur(16px);
    transition: opacity .2s ease, visibility .2s ease;
}

.modal--szablony { z-index: 1100; }
.modal.aktywny { visibility: visible; opacity: 1; }

.modal__okno {
    position: relative;
    width: min(920px, 100%);
    max-height: calc(100dvh - 52px);
    overflow: auto;
    padding: 52px 60px;
    border: 1px solid var(--obramowanie);
    border-radius: 24px;
    color: var(--tekst);
    background: radial-gradient(circle at 100% 0, rgba(118, 80, 255, .09), transparent 42%), rgba(7, 16, 39, .985);
    box-shadow: 0 35px 100px rgba(0, 0, 0, .6);
}

.modal__okno::before {
    position: absolute;
    top: 0;
    right: 42px;
    left: 42px;
    height: 2px;
    background: linear-gradient(90deg, transparent, var(--blekit), #1688ff, var(--fiolet), var(--rozowy), transparent);
    content: "";
}

.modal__okno--szerokie {
    width: min(1500px, 100%);
    padding: 52px 46px;
}

.modal__zamknij,
.galeria__zamknij {
    position: absolute;
    z-index: 5;
    top: 18px;
    right: 18px;
    width: 43px;
    height: 43px;
    display: grid;
    place-items: center;
    padding: 0;
    border: 1px solid var(--obramowanie);
    border-radius: 50%;
    color: #fff;
    background: rgba(20, 29, 49, .72);
    font-size: 1.65rem;
    cursor: pointer;
}

.krok-formularza { display: none; }
.krok-formularza.aktywny { display: block; }
.krok-formularza__numer { display: block; margin-bottom: 18px; }

.krok-formularza h2,
.modal__okno--szerokie > h2 {
    margin: 0 55px 13px 0;
    color: #fff;
    font-size: clamp(1.85rem, 4vw, 2.35rem);
    line-height: 1.15;
    letter-spacing: -.035em;
}

.krok-formularza > p {
    margin: 0 0 30px;
    color: var(--tekst-przygaszony);
    line-height: 1.65;
}

.pole { margin-bottom: 22px; }
.pole > label { display: block; margin-bottom: 9px; color: #edf4ff; font-size: 1rem; font-weight: 650; }
.pole label small { color: rgba(214, 226, 249, .48); font-weight: 400; }

.pole input,
.pole textarea {
    width: 100%;
    min-height: 56px;
    padding: 13px 16px;
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 11px;
    outline: 0;
    color: #fff;
    background: var(--panel-jasny);
}

.pole textarea { min-height: 135px; resize: vertical; }
.pole input:focus,
.pole textarea:focus { border-color: rgba(55, 162, 255, .75); box-shadow: 0 0 0 4px rgba(40, 126, 255, .09); }

.pola-obok { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.telefon { display: grid; grid-template-columns: 122px 1fr; gap: 10px; }

.telefon__prefix {
    min-height: 56px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 11px;
    background: var(--panel-jasny);
    font-weight: 650;
}

.telefon__prefix img { width: 28px; }

.informacja-prywatnosc {
    padding: 15px 17px;
    border-left: 3px solid var(--blekit);
    background: rgba(255, 255, 255, .025);
    font-size: .88rem;
}

.zgoda {
    display: grid;
    grid-template-columns: 22px minmax(0, 1fr);
    gap: 12px;
    align-items: start;
    padding: 6px 0;
    border: 0;
    background: transparent;
}

.zgoda--blad label { color: #ff8998; }
.zgoda input { width: 20px; min-height: 20px; margin: 2px 0 0; accent-color: #28d7a1; }
.zgoda label { color: rgba(235, 242, 255, .82); font-size: .9rem; line-height: 1.55; }
.zgoda a { color: #70c4ff; font-weight: 700; }

.siatka-szablonow--formularz {
    grid-template-columns: repeat(auto-fit, minmax(245px, 1fr));
    max-height: min(660px, 58vh);
    overflow-y: auto;
    padding: 4px 8px 4px 4px;
}

.modal__okno--formularz { width: min(1480px, 100%); }
.modal--krok-pierwszy .modal__okno--formularz { width: min(980px, 100%); }
.modal__okno--formularz [data-krok="1"] { max-width: 860px; margin: 0 auto; }
.formularz__naglowek-grupy { margin: 32px 0 17px; color: #fff; font-size: 1.15rem; }
.wyjasnienie-danych { max-width: 800px; padding: 15px 17px; border-left: 3px solid var(--blekit); background: rgba(32, 207, 255, .045); }
.pola-adresu { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(110px, .55fr) minmax(110px, .55fr); gap: 0 14px; }
.pola-adresu .pole--miejscowosc { grid-column: span 2; }

.siatka-szablonow--formularz.siatka-szablonow--blad {
    padding: 8px;
    border: 2px solid rgba(255, 92, 112, .75);
    border-radius: 20px;
}

.siatka-szablonow--formularz .karta-szablonu__tresc { padding: 17px; }
.siatka-szablonow--formularz .karta-szablonu__tresc p { min-height: 68px; font-size: .9rem; }

.wybor-szablonu {
    min-height: 84px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 15px 16px;
    border: 1px solid rgba(255, 255, 255, .11);
    border-radius: 12px;
    background: rgba(255, 255, 255, .045);
}

.wybor-szablonu--wybrany { border-color: rgba(43, 161, 255, .42); background: rgba(20, 111, 232, .075); }
.wybor-szablonu--blad { border-color: rgba(255, 92, 112, .75); }
.wybor-szablonu span small { display: block; margin-bottom: 4px; color: rgba(215, 227, 248, .52); }
.wybor-szablonu span strong { color: #fff; }

.wybor-szablonu button {
    min-height: 44px;
    padding: 0 18px;
    border: 1px solid rgba(94, 184, 255, .36);
    border-radius: 999px;
    color: #70c4ff;
    background: rgba(20, 111, 232, .1);
    font-weight: 700;
    cursor: pointer;
}

.blad-pola { display: block; margin-top: 8px; color: #ff8998; font-size: .83rem; font-weight: 650; }
.pulapka { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }

.modal__akcje { display: flex; gap: 12px; margin-top: 28px; }
.modal__akcje button { min-height: 54px; padding: 0 28px; border-radius: 999px; font-weight: 800; }
.przycisk-glowny { flex: 1; }

.przycisk-drugorzedny {
    border: 1px solid rgba(255, 255, 255, .14);
    color: #e4edff;
    background: rgba(255, 255, 255, .055);
    cursor: pointer;
}

.modal__stopka {
    margin: 22px 0 0 !important;
    padding-top: 20px;
    border-top: 1px solid rgba(255, 255, 255, .08);
    text-align: center;
    color: rgba(207, 221, 245, .5) !important;
    font-size: .82rem;
}

.siatka-szablonow--modal { margin-top: 30px; }

.galeria {
    position: fixed;
    z-index: 1200;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 28px;
    visibility: hidden;
    opacity: 0;
    background: rgba(11, 20, 38, .76);
    backdrop-filter: blur(13px);
    transition: opacity .2s ease, visibility .2s ease;
}

.galeria.aktywna { visibility: visible; opacity: 1; }

.galeria__uklad {
    width: min(1880px, 100%);
    height: calc(100dvh - 56px);
    display: grid;
    grid-template-columns: minmax(220px, 270px) minmax(0, 1fr);
    gap: 14px;
    align-items: center;
}

.galeria__szablony {
    min-width: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 20px 14px 20px 0;
    user-select: none;
}

.galeria__szablon {
    width: calc(100% - 16px);
    margin-left: 16px;
    padding: 6px 0;
    border: 0;
    color: rgba(236, 241, 251, .73);
    background: transparent;
    text-align: left;
    font-size: 1.12rem;
    font-weight: 700;
    cursor: pointer;
}

.galeria__szablon:hover { color: #fff; transform: translateX(3px); }

.galeria__aktywny-wiersz {
    position: relative;
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 11px 0 11px 16px;
}

.galeria__aktywny-wiersz::before {
    position: absolute;
    top: 3px;
    bottom: 3px;
    left: 0;
    width: 2px;
    background: linear-gradient(180deg, transparent, var(--blekit), #1688ff, var(--fiolet), transparent);
    box-shadow: 0 0 12px rgba(22, 136, 255, .45);
    content: "";
}

.galeria__nazwa { min-width: 0; color: #fff; font-size: 1.9rem; line-height: 1.08; letter-spacing: -.025em; }

.galeria__licznik {
    flex: 0 0 auto;
    width: 58px;
    height: 58px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(255, 255, 255, .13);
    border-radius: 50%;
    color: #f3f7ff;
    background: rgba(14, 25, 46, .75);
    font-size: 1.25rem;
}

.galeria__wybierz {
    width: calc(100% - 16px);
    min-height: 46px;
    margin: 18px 0 0 16px;
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 999px;
    color: #fff;
    background: var(--niebieski);
    box-shadow: inset 0 1px rgba(255, 255, 255, .16), 0 8px 22px rgba(20, 111, 232, .2);
    font-weight: 800;
    cursor: pointer;
}

.galeria__scena {
    position: relative;
    min-width: 0;
    height: calc(100dvh - 70px);
    display: flex;
    align-items: center;
    justify-content: center;
}

.galeria__obraz-wrapper {
    position: relative;
    max-width: calc(100% - 250px);
    max-height: 100%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.galeria__obraz {
    display: block;
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: calc(100dvh - 80px);
    object-fit: contain;
    border: 1px solid var(--obramowanie);
    border-radius: 14px;
    background: #071027;
    box-shadow: 0 28px 75px rgba(0, 0, 0, .48);
    transition: opacity .28s ease, transform .4s ease, filter .28s ease;
}

.galeria__nawigacja {
    position: absolute;
    z-index: 4;
    top: 50%;
    width: 82px;
    height: 155px;
    border: 0;
    color: rgba(255, 255, 255, .86);
    background: transparent;
    font-size: 7.5rem;
    font-weight: 200;
    line-height: .65;
    cursor: pointer;
    text-shadow: 0 4px 20px rgba(0, 0, 0, .68);
}

.galeria__nawigacja--wstecz { left: -98px; transform: translateY(-50%); }
.galeria__nawigacja--dalej { right: -98px; transform: translateY(-50%); }
.galeria__nawigacja:hover { color: #fff; }

.galeria__scena--zmiana .galeria__obraz { opacity: .13; filter: blur(1.5px); }
.galeria__scena--dalej .galeria__obraz { transform: translateX(-15px) scale(.987); }
.galeria__scena--wstecz .galeria__obraz { transform: translateX(15px) scale(.987); }

.galeria__loader {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 34px;
    height: 34px;
    margin: -17px;
    border: 2px solid rgba(255, 255, 255, .1);
    border-top-color: rgba(255, 255, 255, .72);
    border-radius: 50%;
    opacity: 0;
    animation: obrot-loadera .75s linear infinite;
}

.galeria__scena--ladowanie .galeria__loader { opacity: 1; }
@keyframes obrot-loadera { to { transform: rotate(360deg); } }

.galeria__migawka {
    position: absolute;
    z-index: 3;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 30px;
    border-radius: 14px;
    visibility: hidden;
    opacity: 0;
    background: rgba(4, 10, 24, .66);
    pointer-events: none;
}

.galeria__migawka span { color: #fff; font-size: clamp(2rem, 4vw, 4rem); font-weight: 800; text-align: center; }
.galeria__migawka.aktywna { visibility: visible; animation: migawka-szablonu 1.15s ease both; }
@keyframes migawka-szablonu { 0%, 100% { opacity: 0; } 12%, 72% { opacity: 1; } }

.galeria__scroll {
    position: absolute;
    left: -188px;
    top: 50%;
    display: flex;
    align-items: center;
    gap: 10px;
    color: rgba(255, 255, 255, .68);
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .2em;
    transform: translateY(-50%);
    pointer-events: none;
}

.galeria__mysz { width: 25px; height: 39px; display: block; border: 2px solid currentColor; border-radius: 15px; }
.galeria__mysz i { width: 3px; height: 8px; display: block; margin: 7px auto; border-radius: 99px; background: #fff; animation: kolko-myszy 1.45s ease-in-out infinite; }
.galeria__scroll > span:last-child { writing-mode: vertical-rl; transform: rotate(180deg); }
@keyframes kolko-myszy { 0% { transform: translateY(0); opacity: .2; } 70%, 100% { transform: translateY(10px); opacity: 0; } }

@media (max-width: 1100px) {
    .hero { min-height: auto; grid-template-columns: 1fr; padding-top: 80px; }
    .hero__tresc { max-width: 800px; }
    .hero__grafika { width: 100%; margin: -30px 0 0; }
    .hero__grafika img { width: 100%; max-width: 1050px; transform: none; }
    .siatka-szablonow { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .galeria__uklad { grid-template-columns: 200px minmax(0, 1fr); }
    .galeria__obraz-wrapper { max-width: calc(100% - 220px); }
    .galeria__scroll { left: -158px; }
}

@media (max-width: 760px) {
    .naglowek,
    .hero,
    .mozliwosci,
    .szablony,
    .stopka { width: min(100% - 28px, 1380px); }
    .naglowek { min-height: 72px; }
    .naglowek__nawigacja { display: none; }
    .hero { padding: 55px 0 65px; }
    .hero h1 span { font-size: clamp(4rem, 19vw, 6rem); }
    .hero h1 strong { font-size: clamp(2.35rem, 11.2vw, 3.8rem); }
    .hero__podpis { margin-top: 45px; }
    .formularz-startowy { min-height: 58px; }
    .formularz-startowy input { padding: 0 13px; }
    .formularz-startowy button { min-width: auto; padding: 0 16px; font-size: .78rem; }
    .hero__zalety i { display: none; }
    .hero__zalety { align-items: flex-start; flex-direction: column; }
    .mozliwosci,
    .szablony { padding: 75px 0; }
    .sekcja-naglowek { grid-template-columns: 1fr; gap: 25px; margin-bottom: 36px; }
    .siatka-zalet,
    .siatka-szablonow { grid-template-columns: 1fr; }
    .siatka-szablonow--formularz { max-height: none; overflow: visible; }
    .stopka { align-items: flex-start; flex-direction: column; justify-content: center; }
    .modal { padding: 12px; }
    .modal__okno,
    .modal__okno--szerokie { max-height: calc(100dvh - 24px); padding: 48px 22px 26px; }
    .pola-obok { grid-template-columns: 1fr; gap: 0; }
    .telefon { grid-template-columns: 105px 1fr; }
    .wybor-szablonu { align-items: stretch; flex-direction: column; }
    .modal__akcje { flex-direction: column-reverse; }
    .modal__akcje button { width: 100%; }
    .galeria { padding: 8px; }
    .galeria__zamknij { top: 14px; right: 14px; }
    .galeria__uklad { width: 100%; height: 100%; display: flex; flex-direction: column; justify-content: center; gap: 8px; }
    .galeria__szablony { width: 100%; display: grid; grid-template-columns: minmax(70px, 1fr) minmax(180px, 1.8fr) minmax(70px, 1fr); align-items: center; gap: 4px; padding: 0 52px 3px 5px; }
    .galeria__szablon { width: 100%; margin: 0; padding: 5px; overflow: hidden; font-size: .75rem; text-align: center; text-overflow: ellipsis; white-space: nowrap; }
    .galeria__aktywny-wiersz { justify-content: center; gap: 7px; padding: 7px 2px; }
    .galeria__aktywny-wiersz::before { display: none; }
    .galeria__nazwa { overflow: hidden; font-size: 1.12rem; text-align: center; text-overflow: ellipsis; white-space: nowrap; }
    .galeria__licznik { width: 42px; height: 42px; font-size: .9rem; }
    .galeria__wybierz { grid-column: 1 / -1; width: 100%; min-height: 42px; margin: 6px 0 0; }
    .galeria__scena { width: 100%; height: auto; max-height: calc(100dvh - 145px); }
    .galeria__obraz-wrapper { max-width: 100%; max-height: calc(100dvh - 150px); }
    .galeria__obraz { max-height: calc(100dvh - 150px); }
    .galeria__nawigacja { width: 52px; height: 105px; font-size: 4.9rem; }
    .galeria__nawigacja--wstecz { left: 5px; }
    .galeria__nawigacja--dalej { right: 5px; }
    .galeria__scroll { display: none; }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after { scroll-behavior: auto !important; transition: none !important; }

    .poswiaty-tla__plama { animation: none !important; }
}

/* Etap: demo, własność sklepu i usługi dodatkowe */
.hero__cena {
    display: flex;
    align-items: baseline;
    gap: 12px;
    margin: 18px 0 0;
}

.hero__cena strong {
    color: #fff;
    font-size: clamp(1.8rem, 3vw, 2.7rem);
    letter-spacing: -.04em;
}

.hero__cena span { color: rgba(235, 242, 255, .62); font-size: .88rem; }

.wlasnosc,
.sprawdzanie-domeny {
    width: min(100% - 64px, 1380px);
    margin: 0 auto;
}

.wlasnosc {
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(320px, .75fr);
    gap: 22px;
    padding: 90px 0 55px;
}

.wlasnosc__glowna,
.wlasnosc__dodatki,
.sprawdzanie-domeny {
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 24px;
    background: linear-gradient(145deg, rgba(255, 255, 255, .072), rgba(255, 255, 255, .022));
    box-shadow: 0 28px 80px rgba(0, 0, 0, .2);
    backdrop-filter: blur(18px);
}

.wlasnosc__glowna,
.wlasnosc__dodatki { padding: clamp(28px, 4vw, 52px); }
.wlasnosc h2 { max-width: 720px; margin: 12px 0 18px; color: #fff; font-size: clamp(2.1rem, 4.7vw, 4.2rem); line-height: .98; letter-spacing: -.055em; }
.wlasnosc h3 { margin: 12px 0 16px; color: #fff; font-size: clamp(1.45rem, 2.4vw, 2.1rem); }
.wlasnosc p { color: rgba(235, 242, 255, .7); line-height: 1.7; }
.wlasnosc ul { display: grid; gap: 10px; margin: 25px 0 0; padding: 0; list-style: none; }
.wlasnosc li { position: relative; padding-left: 27px; color: rgba(244, 248, 255, .86); }
.wlasnosc li::before { position: absolute; left: 0; color: #54ebbd; content: "✓"; font-weight: 900; }

.cennik-dodatkow { margin-top: 24px; border-top: 1px solid rgba(255, 255, 255, .1); }
.cennik-dodatkow summary { padding: 18px 0 5px; color: #75c8ff; font-weight: 800; cursor: pointer; }
.cennik-dodatkow__lista { display: grid; gap: 0; margin-top: 12px; }
.cennik-dodatkow__lista div { display: flex; justify-content: space-between; gap: 18px; padding: 11px 0; border-bottom: 1px solid rgba(255, 255, 255, .075); color: rgba(235, 242, 255, .72); font-size: .88rem; }
.cennik-dodatkow__lista strong { color: #fff; text-align: right; }

.sprawdzanie-domeny {
    display: grid;
    grid-template-columns: minmax(0, .9fr) minmax(380px, 1.1fr);
    align-items: center;
    gap: 48px;
    margin-top: 30px;
    margin-bottom: 50px;
    padding: clamp(28px, 4vw, 48px);
}

.sprawdzanie-domeny h1,
.sprawdzanie-domeny h2 { margin: 10px 0 12px; color: #fff; font-size: clamp(1.7rem, 3vw, 2.7rem); line-height: 1.05; letter-spacing: -.04em; }
.sprawdzanie-domeny p { color: rgba(235, 242, 255, .62); }
.sprawdzanie-domeny form { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; }
.sprawdzanie-domeny input { min-width: 0; height: 54px; padding: 0 18px; border: 1px solid rgba(255, 255, 255, .14); border-radius: 14px; outline: 0; color: #fff; background: rgba(3, 12, 30, .7); font: inherit; }
.sprawdzanie-domeny input:focus { border-color: #2fa8ff; box-shadow: 0 0 0 3px rgba(47, 168, 255, .14); }
.sprawdzanie-domeny button,
.pole-z-przyciskiem button { border: 0; border-radius: 14px; color: #fff; background: var(--niebieski); font-weight: 800; cursor: pointer; }
.sprawdzanie-domeny button { min-height: 54px; padding: 0 23px; }
.sprawdzanie-domeny button:disabled,
.pole-z-przyciskiem button:disabled { cursor: wait; opacity: .6; }
.sprawdzanie-domeny__wynik { min-height: 24px; margin: 10px 0 2px !important; font-weight: 800; }
.sprawdzanie-domeny small { color: rgba(235, 242, 255, .46); }

.pole-z-przyciskiem { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; }
.pole-z-przyciskiem button { min-height: 48px; padding: 0 16px; font-size: .82rem; }
.pole small { display: block; margin-top: 7px; color: rgba(235, 242, 255, .48); line-height: 1.45; }
.komunikat-pola { display: block; min-height: 0; margin-top: 5px; font-size: .82rem; font-weight: 700; }
.komunikat-pola:empty { display: none; }
.komunikat--sukces { color: #54ebbd !important; }
.komunikat--blad { color: #ff7ca7 !important; }
.komunikat--ladowanie { color: #75c8ff !important; }
.zgoda--opcjonalna { opacity: .82; }
.strona-domeny { min-height: calc(100dvh - 88px); display: grid; align-items: center; padding: 56px 0 90px; }

@media (max-width: 900px) {
    .wlasnosc,
    .sprawdzanie-domeny { grid-template-columns: 1fr; }
}

@media (max-width: 760px) {
    .wlasnosc,
    .sprawdzanie-domeny { width: min(100% - 28px, 1380px); }
    .wlasnosc { padding: 58px 0 35px; }
    .sprawdzanie-domeny { gap: 26px; margin-bottom: 28px; }
    .sprawdzanie-domeny form,
    .pole-z-przyciskiem { grid-template-columns: 1fr; }
    .sprawdzanie-domeny button,
    .pole-z-przyciskiem button { width: 100%; min-height: 50px; }
    .hero__cena { align-items: flex-start; flex-direction: column; gap: 2px; }
    .pola-adresu { grid-template-columns: 1fr 1fr; }
    .pola-adresu .pole--ulica,
    .pola-adresu .pole--miejscowosc { grid-column: 1 / -1; }
}

@media (max-width: 520px) {
    .pola-adresu { grid-template-columns: 1fr; }
    .pola-adresu .pole--ulica,
    .pola-adresu .pole--miejscowosc { grid-column: auto; }
}

@media (min-width: 901px) and (max-width: 1100px) {
    .siatka-szablonow--formularz { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* Uporządkowany formularz, modale informacyjne i podstrony publiczne */
.naglowek__link {
    padding: 0;
    border: 0;
    color: rgba(234, 241, 255, .72);
    background: transparent;
    font: inherit;
    font-size: .92rem;
    font-weight: 650;
    cursor: pointer;
}
.naglowek__link:hover { color: #fff; }

.dane-firmy-glowne { display: grid; grid-template-columns: minmax(270px, .8fr) minmax(0, 1.2fr); gap: 18px; }
.dane-firmy-glowne .pole-z-przyciskiem { grid-template-columns: minmax(150px, 1fr) auto; }
.dane-firmy-glowne .pole-z-przyciskiem button { min-width: 126px; border: 1px solid rgba(77, 170, 255, .34); color: #8ed1ff; background: rgba(20, 111, 232, .1); }
.formularz__naglowek-grupy--kontakt { margin: 38px 55px 24px 0; padding-top: 28px; border-top: 1px solid rgba(255, 255, 255, .09); font-size: clamp(1.85rem, 4vw, 2.35rem); line-height: 1.15; letter-spacing: -.035em; }
.pola-obok--kontakt { grid-template-columns: minmax(0, 1fr) minmax(330px, 1fr); }

.link-tekstowy { display: inline; padding: 0; border: 0; color: #70c4ff; background: transparent; font: inherit; font-weight: 700; text-decoration: underline; text-underline-offset: 2px; cursor: pointer; }

.siatka-szablonow--formularz .karta-szablonu { border-color: rgba(255, 255, 255, .09); background: rgba(255, 255, 255, .025); box-shadow: none; }
.siatka-szablonow--formularz .karta-szablonu.wybrany { border-color: #34d399; background: rgba(52, 211, 153, .07); box-shadow: 0 0 0 2px rgba(52, 211, 153, .22), 0 0 32px rgba(52, 211, 153, .2); }
.siatka-szablonow--formularz .karta-szablonu__akcje { gap: 8px; }
.siatka-szablonow--formularz .karta-szablonu__akcja { min-height: 42px; border-color: rgba(255, 255, 255, .13); color: rgba(235, 242, 255, .76); background: rgba(255, 255, 255, .035); box-shadow: none; font-size: .84rem; }
.siatka-szablonow--formularz .karta-szablonu__akcja--demo { color: #9bd7ff; background: transparent; }
.siatka-szablonow--formularz .karta-szablonu__wybierz { border: 1px solid rgba(77, 170, 255, .45); color: #8ed1ff; background: rgba(20, 111, 232, .075); box-shadow: none; }
.siatka-szablonow--formularz .karta-szablonu__wybierz:hover { border-color: #38bdf8; color: #fff; background: rgba(20, 111, 232, .18); }
.siatka-szablonow--formularz .karta-szablonu__wybierz--wybrany,
.siatka-szablonow--formularz .karta-szablonu__wybierz--wybrany:hover { border-color: #34d399; color: #c7f9e9; background: rgba(52, 211, 153, .12); }
#przejdz-do-podsumowania:disabled { border: 1px solid rgba(255, 255, 255, .09); color: rgba(235, 242, 255, .4); background: rgba(255, 255, 255, .055); box-shadow: none; cursor: not-allowed; }

.modal--informacja { z-index: 1150; }
.modal-prawny { z-index: 1300; }
.modal__okno--tekst { width: min(900px, 100%); }
.modal__okno--tekst > h2 { margin: 12px 55px 28px 0; color: #fff; font-size: clamp(2rem, 4vw, 3.1rem); }
.modal__okno--domena { width: min(1280px, 100%); }
.modal__okno--domena .sprawdzanie-domeny { width: 100%; margin: 0; padding: 18px 0 4px; border: 0; background: transparent; }
.link-pelnej-strony { display: inline-flex; margin-top: 28px; color: #70c4ff; font-weight: 750; }

.tresc-prawna { color: rgba(235, 242, 255, .72); line-height: 1.75; }
.tresc-prawna h2 { margin: 30px 0 9px; color: #fff; font-size: 1.32rem; }
.tresc-prawna h2:first-child { margin-top: 0; }
.tresc-prawna p { margin: 0 0 14px; }
.tresc-prawna em { color: #f5c77a; }

.strona-informacyjna,
.kontakt { width: min(1380px, calc(100% - 48px)); margin: 0 auto; }
.strona-informacyjna { min-height: calc(100vh - 190px); padding: 70px 0 100px; }
.strona-informacyjna__karta { max-width: 920px; padding: clamp(28px, 5vw, 62px); border: 1px solid var(--obramowanie); border-radius: 24px; background: rgba(7, 16, 39, .76); }
.strona-informacyjna h1 { margin: 14px 0 38px; color: #fff; font-size: clamp(2.6rem, 6vw, 5.2rem); line-height: .98; letter-spacing: -.055em; }

.kontakt { padding: 70px 0 100px; }
.kontakt__hero { max-width: 1000px; }
.kontakt__hero h1 { margin: 14px 0 18px; color: #fff; font-size: clamp(3rem, 7vw, 6.4rem); line-height: .95; letter-spacing: -.065em; }
.kontakt__hero > p { max-width: 700px; color: var(--tekst-przygaszony); font-size: 1.12rem; line-height: 1.7; }
.kontakt__dane { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-top: 38px; }
.kontakt__dane > * { min-height: 120px; padding: 20px; border: 1px solid var(--obramowanie); border-radius: 16px; color: #fff; background: var(--panel-jasny); text-decoration: none; }
.kontakt__dane small, .kontakt__dane strong { display: block; }
.kontakt__dane small { margin-bottom: 9px; color: var(--tekst-przygaszony); }
.kontakt__dane strong { line-height: 1.5; }
.kontakt__zespol { margin-top: 110px; }
.kontakt__pracownicy { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-top: 38px; }
.pracownik { overflow: hidden; border: 1px solid var(--obramowanie); border-radius: 20px; background: rgba(7, 16, 39, .72); }
.pracownik img { width: 100%; aspect-ratio: 1.25 / 1; display: block; object-fit: cover; object-position: center 25%; }
.pracownik > div { padding: 22px; }
.pracownik h3 { margin: 0 0 6px; color: #fff; font-size: 1.35rem; }
.pracownik strong { color: #70c4ff; font-size: .9rem; }
.pracownik p { margin: 13px 0 0; color: var(--tekst-przygaszony); line-height: 1.6; }
.kontakt__dol { display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(340px, .88fr); gap: 22px; margin-top: 110px; }
.kontakt__formularz, .kontakt__faq { padding: clamp(26px, 4vw, 46px); border: 1px solid var(--obramowanie); border-radius: 22px; background: rgba(7, 16, 39, .72); }
.kontakt__formularz h2, .kontakt__faq h2 { margin: 12px 0 28px; color: #fff; font-size: clamp(2rem, 4vw, 3.1rem); letter-spacing: -.045em; }
.kontakt__wyslij { margin-top: 24px; border: 0; cursor: pointer; }
.kontakt__sukces { padding: 14px 16px; border: 1px solid rgba(52, 211, 153, .3); border-radius: 12px; color: #a7f3d0; background: rgba(52, 211, 153, .08); }
.kontakt__faq details { padding: 18px 0; border-top: 1px solid rgba(255, 255, 255, .09); }
.kontakt__faq summary { color: #fff; font-weight: 750; cursor: pointer; }
.kontakt__faq details p { color: var(--tekst-przygaszony); line-height: 1.65; }

.stopka { min-height: 150px; }
.stopka > div p { margin: 7px 0 0; }
.marka--stopka { font-size: 1.55rem; }
.stopka__linki { display: flex; flex-wrap: wrap; justify-content: center; gap: 24px; }
.stopka__linki a { color: rgba(234, 241, 255, .66); font-weight: 650; text-decoration: none; }
.stopka__linki a:hover { color: #fff; }

@media (max-width: 1000px) {
    .kontakt__dane { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .kontakt__pracownicy { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .kontakt__dol { grid-template-columns: 1fr; }
}

@media (max-width: 700px) {
    .naglowek__link { width: 100%; text-align: left; }
    .dane-firmy-glowne, .pola-obok--kontakt { grid-template-columns: 1fr; gap: 0; }
    .strona-informacyjna, .kontakt { width: min(100% - 28px, 1380px); padding-top: 44px; }
    .kontakt__dane, .kontakt__pracownicy { grid-template-columns: 1fr; }
    .kontakt__zespol, .kontakt__dol { margin-top: 72px; }
    .stopka__linki { justify-content: flex-start; }
}

/* Elementy wspólne v6.2 */
.naglowek {
    position: sticky;
    z-index: 950;
    top: 0;
    width: 100%;
    margin: 0;
    padding-right: max(24px, calc((100vw - 1540px) / 2));
    padding-left: max(24px, calc((100vw - 1540px) / 2));
    background: rgba(1, 5, 18, .82);
    box-shadow: 0 10px 35px rgba(0, 0, 0, .16);
    backdrop-filter: blur(18px);
}

@media (max-width: 760px) {
    .naglowek { width: 100%; padding-right: 14px; padding-left: 14px; }
    .hero__grafika { display: none; }
}

/* Nawigacja, koszyk i panel klienta — v6.3 */
.naglowek {
    display: grid;
    grid-template-columns: minmax(150px, 1fr) auto minmax(150px, 1fr);
    gap: 24px;
}
.naglowek__marka { justify-self: start; }
.naglowek__nawigacja { justify-self: center; align-items: center; }
.naglowek__nawigacja a, .naglowek__link { white-space: nowrap; }
.naglowek__akcje { justify-self: end; display: flex; align-items: center; gap: 10px; }
.naglowek__ikona {
    position: relative;
    width: 46px;
    height: 46px;
    display: grid;
    place-items: center;
    padding: 0;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 50%;
    color: #eaf1ff;
    background: rgba(255,255,255,.05);
    cursor: pointer;
    text-decoration: none;
}
.naglowek__ikona:hover { color: #fff; border-color: rgba(32,207,255,.5); background: rgba(20,111,232,.16); }
.naglowek__ikona svg { width: 22px; height: 22px; fill: currentColor; }
.koszyk { position: relative; }
.koszyk__licznik { position: absolute; top: -5px; right: -4px; min-width: 19px; height: 19px; display: grid; place-items: center; padding: 0 5px; border: 2px solid #061027; border-radius: 999px; color: #fff; background: #ff0f74; font-size: .67rem; font-weight: 900; }
.koszyk--pelny .naglowek__ikona { border-color: rgba(32,207,255,.55); box-shadow: 0 0 22px rgba(32,207,255,.14); }
.koszyk__podglad { position: absolute; top: calc(100% + 13px); right: 0; width: min(var(--koszyk-podglad-szerokosc),calc(100vw - 28px)); padding: 18px; border: 1px solid rgba(255,255,255,.13); border-radius: 16px; opacity: 0; visibility: hidden; color: #fff; background: rgba(5,13,32,.98); box-shadow: 0 22px 60px rgba(0,0,0,.45); transform: translateY(-6px); transition: .18s ease; }
.koszyk__podglad::before { content: ''; position: absolute; right: 0; bottom: 100%; width: 70px; height: 16px; }
.koszyk:hover .koszyk__podglad, .koszyk:focus-within .koszyk__podglad, .koszyk.popover-otwarty .koszyk__podglad { opacity: 1; visibility: visible; transform: none; }
.koszyk__podglad strong, .koszyk__podglad small { display: block; }
.koszyk__podglad > div { display: grid; grid-template-columns: 1fr auto; gap: 12px; margin: 14px 0 7px; padding-top: 14px; border-top: 1px solid rgba(255,255,255,.1); line-height: 1.35; }
.koszyk__podglad small { color: var(--tekst-przygaszony); }
.koszyk__podglad > a { display: flex; justify-content: center; margin-top: 16px; padding: 11px; border-radius: 10px; color: #fff; background: var(--niebieski); font-weight: 800; text-decoration: none; }
.plywajacy-kontakt { position: fixed; z-index: 940; right: 24px; bottom: 24px; width: 58px; height: 58px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.22); border-radius: 50%; color: #fff; background: linear-gradient(135deg,#146fe8,#7650ff); box-shadow: 0 16px 38px rgba(20,111,232,.38); transition: transform .18s ease; }
.plywajacy-kontakt:hover { transform: translateY(-3px) scale(1.03); }
.plywajacy-kontakt svg { width: 26px; fill: currentColor; }

.modal__okno--logowanie { width: min(520px, 100%); }
.modal__okno--logowanie h2 { margin: 12px 0 8px; color: #fff; font-size: clamp(2rem,5vw,3rem); letter-spacing: -.04em; }
.modal__okno--logowanie > p { color: var(--tekst-przygaszony); line-height: 1.6; }
.modal__okno--logowanie form { display: grid; gap: 10px; margin-top: 26px; }
.modal__okno--logowanie label { color: #fff; font-weight: 750; }
.modal__okno--logowanie input { width: 100%; min-height: 54px; padding: 0 16px; border: 1px solid var(--obramowanie); border-radius: 12px; color: #fff; background: rgba(255,255,255,.045); }
#pin-logowania { text-align: center; font-size: 1.55rem; font-weight: 850; letter-spacing: .35em; }
.modal__okno--logowanie .przycisk-glowny { min-height: 52px; margin-top: 8px; border-radius: 12px; }
.logowanie__komunikat { margin: 0; color: #a7f3d0 !important; line-height: 1.45; }
.logowanie__komunikat--widoczny { margin-top: 2px; padding: 11px 13px; border-left: 3px solid #34d399; border-radius: 8px; background: rgba(52,211,153,.09); }
.logowanie__komunikat--blad { border-left-color: #fb7185; color: #ffabb6 !important; background: rgba(251,113,133,.09); }
.logowanie__komunikat--ladowanie { border-left-color: #38bdf8; color: #b9e6ff !important; background: rgba(56,189,248,.08); }

/* Kontakt */
.kontakt__hero { max-width: none; }
.kontakt__dane { grid-template-columns: repeat(4,minmax(0,1fr)); gap: 30px; }
.kontakt__dane > * { min-height: 0; padding: 8px 0 20px; border: 0; border-bottom: 1px solid rgba(255,255,255,.14); border-radius: 0; background: transparent; }
.kontakt__dane-ikona { width: 40px; height: 40px; display: grid; place-items: center; float: left; margin: 2px 13px 20px 0; border-radius: 50%; color: #8ed1ff; background: rgba(20,111,232,.13); font-size: 1.05rem; font-weight: 900; }
.kontakt__dol { grid-template-columns: minmax(0,1.2fr) minmax(330px,.8fr); align-items: start; }
.kontakt__formularz { border: 0; border-radius: 24px; background: #15171d; box-shadow: 0 30px 80px rgba(0,0,0,.28); }
.kontakt__formularz h2 { margin-bottom: 7px; }
.kontakt__formularz-wstep { margin: 0 0 42px; color: rgba(255,255,255,.58); line-height: 1.6; }
.kontakt__pole { position: relative; margin: 0 0 34px; padding-bottom: 10px; border-bottom: 1px solid rgba(255,255,255,.22); transition: border-color .2s, box-shadow .2s; }
.kontakt__pole label { display: block; margin-bottom: 14px; color: rgba(255,255,255,.5); font-size: .72rem; font-weight: 850; letter-spacing: .13em; text-transform: uppercase; }
.kontakt__pole label b { margin-right: 6px; color: rgba(255,255,255,.35); }
.kontakt__pole input, .kontakt__pole textarea { width: 100%; padding: 0; border: 0; outline: 0; color: #fff; background: transparent; font-size: clamp(1.15rem,2.1vw,1.52rem); font-weight: 700; }
.kontakt__pole input { min-height: 43px; }
.kontakt__pole textarea { min-height: 122px; resize: vertical; }
.kontakt__pole input::placeholder, .kontakt__pole textarea::placeholder { color: rgba(255,255,255,.21); }
.kontakt__pole:focus-within { border-color: #38bdf8; }
.kontakt__pole--blad { border-color: #fb7185; box-shadow: 0 12px 25px -19px #fb7185; }
.kontakt__pole--poprawne { border-color: #34d399; box-shadow: 0 12px 25px -20px #34d399; }
.kontakt__pole .blad-pola { margin-top: 8px; }
.kontakt__zgoda { margin-top: 5px; }
.kontakt__wyslij { width: 100%; min-height: 72px; display: flex; align-items: center; justify-content: center; gap: 20px; margin-top: 28px; border: 0; border-radius: 999px; color: #09101e; background: #fff; box-shadow: 0 18px 34px rgba(0,0,0,.28); font-size: 1.05rem; font-weight: 900; cursor: pointer; transition: transform .18s, box-shadow .18s; }
.kontakt__wyslij:hover { transform: translateY(-2px); box-shadow: 0 22px 42px rgba(0,0,0,.4); }
.kontakt__wyslij b { font-size: 1.65rem; font-weight: 400; }
.modal__okno--sukces { width: min(500px,100%); text-align: center; }
.modal__okno--sukces h2 { margin: 14px 0 8px; color: #fff; font-size: 2.3rem; }
.modal__okno--sukces p { color: var(--tekst-przygaszony); line-height: 1.6; }
.modal__okno--sukces small { color: rgba(255,255,255,.42); }
.modal-sukces__ikona { width: 64px; height: 64px; display: grid; place-items: center; margin: 0 auto; border-radius: 50%; color: #06180f; background: #34d399; font-size: 2rem; font-weight: 950; }

.panel-klienta { width: min(1100px,calc(100% - 48px)); min-height: calc(100vh - 238px); margin: 0 auto; padding: 70px 0 100px; }
.panel-klienta section { padding: clamp(28px,5vw,56px); border: 1px solid var(--obramowanie); border-radius: 24px; background: rgba(7,16,39,.76); }
.panel-klienta h1 { margin: 10px 0 4px; color: #fff; font-size: clamp(2.3rem,5vw,4.2rem); letter-spacing: -.05em; }
.panel-klienta h2 { margin-top: 48px; color: #fff; }
.panel-klienta__naglowek { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.panel-klienta__naglowek p { color: var(--tekst-przygaszony); }
.panel-klienta__zamowienie { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 20px 0; border-top: 1px solid var(--obramowanie); }
.panel-klienta__zamowienie div { display: grid; gap: 5px; }
.panel-klienta__zamowienie span, .panel-klienta__pusto { color: var(--tekst-przygaszony); }
.panel-klienta__zamowienie b { color: #8ed1ff; }

/* Walidacja kroku 1 */
.krok-formularza--walidacja .pole--blad input,
.krok-formularza--walidacja .pole--blad .pole-z-przyciskiem,
.krok-formularza--blad-serwera .pole:has(> .blad-pola) input,
.krok-formularza--blad-serwera .pole:has(> .blad-pola) .pole-z-przyciskiem {
    border-color: #fb7185;
    box-shadow: 0 0 0 3px rgba(251, 113, 133, .13), 0 0 24px rgba(251, 113, 133, .12);
}
.krok-formularza--walidacja .pole--poprawne input,
.krok-formularza--walidacja .pole--poprawne .pole-z-przyciskiem,
.krok-formularza--blad-serwera .pole:not(:has(> .blad-pola)) input,
.krok-formularza--blad-serwera .pole:not(:has(> .blad-pola)) .pole-z-przyciskiem {
    border-color: #34d399;
    box-shadow: 0 0 0 3px rgba(52, 211, 153, .1), 0 0 22px rgba(52, 211, 153, .1);
}
.krok-formularza--walidacja .zgoda.pole--blad,
.krok-formularza--blad-serwera .zgoda--blad { color: #fecdd3; }
.krok-formularza--walidacja .zgoda.pole--poprawne { color: #a7f3d0; }
#wynik-ceidg + .blad-pola { margin-top: 5px; }

/* Dopracowanie kontaktu i popupu */
.kontakt__hero > p { max-width: 840px; font-size: clamp(1.18rem, 1.8vw, 1.42rem); }
.kontakt__dane small { margin-bottom: 6px; color: #fff; font-size: 1.04rem; font-weight: 800; }
.kontakt__dane strong, .kontakt__dane-firmy > span:not(.kontakt__dane-ikona) { color: rgba(234,241,255,.72); font-size: .94rem; font-weight: 600; line-height: 1.55; }
.kontakt__dane-firmy > span:not(.kontakt__dane-ikona) { display: block; }
.kontakt__dane-ikona { display: grid; float: none; margin: 0 0 15px; }
.kontakt__dane-ikona svg { width: 21px; height: 21px; fill: currentColor; }
.kontakt__formularz { border: 1px solid var(--obramowanie); background: radial-gradient(circle at 100% 0, rgba(39,92,204,.13), transparent 38%), rgba(7,16,39,.86); }
.kontakt__pole { margin-bottom: 25px; padding: 8px 14px 12px; border: 1px solid rgba(255,255,255,.12); border-radius: 12px; background: rgba(255,255,255,.035); }
.kontakt__pole input, .kontakt__pole textarea { font-weight: 600; }
.kontakt__pole input { min-height: 42px; }
.kontakt__pole textarea { min-height: 110px; }
.kontakt__pole:focus-within { border-color: #38bdf8; box-shadow: 0 0 0 3px rgba(56,189,248,.1); }
.kontakt__pole--blad { border-color: #fb7185; box-shadow: 0 0 0 3px rgba(251,113,133,.1), 0 0 24px rgba(251,113,133,.1); }
.kontakt__pole--poprawne { border-color: #34d399; box-shadow: 0 0 0 3px rgba(52,211,153,.08), 0 0 22px rgba(52,211,153,.08); }
.modal-kontaktu { z-index: 1180; }
.modal__okno--kontakt { width: min(760px, 100%); padding: 42px clamp(24px, 5vw, 54px); }
.modal__okno--kontakt > h2 { margin: 20px 0 6px; color: #fff; font-size: clamp(2.2rem, 5vw, 3.6rem); letter-spacing: -.05em; }
.modal__okno--kontakt > p { margin: 0 0 25px; color: var(--tekst-przygaszony); }
.modal__okno--kontakt .kontakt__pole { margin-bottom: 14px; }
.modal__okno--kontakt .kontakt__pole textarea { min-height: 90px; }
.modal__okno--kontakt .kontakt__wyslij { min-height: 62px; }
.modal-kontaktu__infolinia { display: flex; align-items: center; gap: 13px; margin-right: 50px; padding-bottom: 18px; border-bottom: 1px solid rgba(255,255,255,.1); }
.modal-kontaktu__infolinia > svg { width: 42px; height: 42px; padding: 11px; border-radius: 50%; fill: #8ed1ff; background: rgba(20,111,232,.14); }
.modal-kontaktu__infolinia div { display: grid; gap: 2px; }
.modal-kontaktu__infolinia span { color: var(--tekst-przygaszony); font-size: .8rem; }
.modal-kontaktu__infolinia a { color: #fff; font-size: 1.15rem; font-weight: 850; text-decoration: none; }
.plywajacy-kontakt { padding: 0; cursor: pointer; }

@media (max-width: 1050px) {
    .naglowek { grid-template-columns: auto 1fr auto; gap: 14px; }
    .naglowek__nawigacja { gap: 14px; }
    .naglowek__nawigacja a, .naglowek__link { font-size: .8rem; }
    .kontakt__dane { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 760px) {
    .naglowek { min-height: auto; grid-template-columns: 1fr auto; padding-top: 10px; padding-bottom: 10px; }
    .naglowek__nawigacja { grid-column: 1 / -1; grid-row: 2; width: 100%; justify-content: flex-start; gap: 20px; overflow-x: auto; padding: 8px 0 3px; scrollbar-width: none; }
    .naglowek__nawigacja::-webkit-scrollbar { display: none; }
    .naglowek__nawigacja a, .naglowek__link { width: auto; flex: 0 0 auto; text-align: left; }
    .naglowek__akcje { grid-column: 2; grid-row: 1; }
    .koszyk__podglad { position: fixed; top: 78px; right: 14px; width: min(var(--koszyk-podglad-szerokosc),calc(100vw - 28px)); }
    .plywajacy-kontakt { right: 15px; bottom: 15px; width: 52px; height: 52px; }
    .kontakt__dane { grid-template-columns: 1fr; gap: 18px; }
    .kontakt__formularz { margin-right: -14px; margin-left: -14px; border-radius: 0; }
    .panel-klienta { width: min(100% - 28px,1100px); padding-top: 44px; }
    .panel-klienta__naglowek, .panel-klienta__zamowienie { align-items: flex-start; flex-direction: column; }
    .modal__okno--kontakt { padding: 48px 18px 24px; }
}

/* Spójne formularze i telefon — v6.6 */
.telefon--jedno-pole {
    min-height: 56px;
    display: flex;
    align-items: stretch;
    gap: 0;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 11px;
    background: var(--panel-jasny);
    transition: border-color .18s ease, box-shadow .18s ease;
}

.telefon--jedno-pole:focus-within {
    border-color: rgba(55, 162, 255, .75);
    box-shadow: 0 0 0 4px rgba(40, 126, 255, .09);
}

.telefon--jedno-pole .telefon__prefix {
    min-height: auto;
    flex: 0 0 auto;
    padding: 0 14px;
    border: 0;
    border-right: 1px solid rgba(255, 255, 255, .12);
    border-radius: 0;
    background: rgba(255, 255, 255, .025);
}

.telefon__flaga {
    width: 27px;
    height: 18px;
    overflow: hidden;
    border-radius: 3px;
    box-shadow: 0 0 0 1px rgba(255, 255, 255, .18);
}

.telefon--jedno-pole input {
    min-width: 0;
    min-height: 54px;
    flex: 1;
    padding: 13px 16px;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none !important;
}

.krok-formularza--walidacja .pole--blad .telefon--jedno-pole,
.krok-formularza--blad-serwera .pole:has(> .blad-pola) .telefon--jedno-pole {
    border-color: #fb7185;
    box-shadow: 0 0 0 3px rgba(251, 113, 133, .13), 0 0 24px rgba(251, 113, 133, .12);
}

.krok-formularza--walidacja .pole--poprawne .telefon--jedno-pole,
.krok-formularza--blad-serwera .pole:not(:has(> .blad-pola)) .telefon--jedno-pole {
    border-color: #34d399;
    box-shadow: 0 0 0 3px rgba(52, 211, 153, .1), 0 0 22px rgba(52, 211, 153, .1);
}

.formularz-kontaktowy-spojny { margin-top: 30px; }
.kontakt__siatka-pol {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0 18px;
}

.formularz-kontaktowy-spojny .kontakt__pole {
    position: relative;
    margin-bottom: 22px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.formularz-kontaktowy-spojny .kontakt__pole--pelna { grid-column: 1 / -1; }
.formularz-kontaktowy-spojny .kontakt__pole label {
    margin-bottom: 9px;
    color: #edf4ff;
    font-size: 1rem;
    font-weight: 650;
    letter-spacing: 0;
    text-transform: none;
}

.formularz-kontaktowy-spojny .kontakt__pole input,
.formularz-kontaktowy-spojny .kontakt__pole textarea {
    width: 100%;
    min-height: 56px;
    padding: 13px 16px;
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 11px;
    outline: 0;
    color: #fff;
    background: var(--panel-jasny);
    font-size: 1rem;
    font-weight: 400;
    transition: border-color .18s ease, box-shadow .18s ease;
}

.formularz-kontaktowy-spojny .kontakt__pole textarea {
    min-height: 135px;
    resize: vertical;
}

.formularz-kontaktowy-spojny .kontakt__pole input::placeholder,
.formularz-kontaktowy-spojny .kontakt__pole textarea::placeholder {
    color: rgba(220, 230, 250, .48);
}

.formularz-kontaktowy-spojny .kontakt__pole:focus-within { border: 0; box-shadow: none; }
.formularz-kontaktowy-spojny .kontakt__pole input:focus,
.formularz-kontaktowy-spojny .kontakt__pole textarea:focus {
    border-color: rgba(55, 162, 255, .75);
    box-shadow: 0 0 0 4px rgba(40, 126, 255, .09);
}

.formularz-kontaktowy-spojny .kontakt__pole--blad input,
.formularz-kontaktowy-spojny .kontakt__pole--blad textarea {
    border-color: #fb7185;
    box-shadow: 0 0 0 3px rgba(251, 113, 133, .12), 0 0 24px rgba(251, 113, 133, .1);
}

.formularz-kontaktowy-spojny .kontakt__pole--poprawne input,
.formularz-kontaktowy-spojny .kontakt__pole--poprawne textarea {
    border-color: #34d399;
    box-shadow: 0 0 0 3px rgba(52, 211, 153, .09), 0 0 22px rgba(52, 211, 153, .08);
}

.formularz-kontaktowy-spojny .kontakt__zgoda { margin-top: 0; }
.formularz-kontaktowy-spojny .kontakt__wyslij {
    min-height: 56px;
    margin-top: 24px;
    border-radius: 999px;
    color: #fff;
    background: var(--niebieski);
    box-shadow: inset 0 1px rgba(255, 255, 255, .17), 0 8px 22px rgba(20, 111, 232, .22);
}

.formularz-kontaktowy-spojny .kontakt__wyslij:hover {
    background: #0f63d4;
    box-shadow: inset 0 1px rgba(255, 255, 255, .17), 0 10px 26px rgba(20, 111, 232, .28);
}

.modal__okno--kontakt { width: min(860px, 100%); }
.modal__okno--kontakt .formularz-kontaktowy-spojny { margin-top: 24px; }
.modal__okno--kontakt .kontakt__pole { margin-bottom: 18px; }
.modal__okno--kontakt .kontakt__pole textarea { min-height: 120px; }

@media (max-width: 650px) {
    .kontakt__siatka-pol { grid-template-columns: 1fr; }
    .formularz-kontaktowy-spojny .kontakt__pole--pelna { grid-column: auto; }
    .telefon--jedno-pole .telefon__prefix { padding: 0 11px; }
}

/* Panel klienta otwierany nad stroną */
.modal-panelu {
    position: fixed;
    inset: 0;
    z-index: 2500;
    isolation: isolate;
    display: grid;
    place-items: center;
    padding: clamp(8px, 1.25vw, 18px);
    overflow: hidden;
    visibility: hidden;
    opacity: 0;
    background: transparent;
    backdrop-filter: blur(14px);
    transition: opacity .2s ease, visibility .2s ease;
}
.modal-panelu::before,
.modal-panelu::after {
    position: absolute;
    z-index: -1;
    width: 78vw;
    height: 78vw;
    border-radius: 50%;
    filter: blur(85px);
    opacity: .36;
    pointer-events: none;
    content: "";
    animation: panel-modal-poswiata 18s ease-in-out infinite alternate;
}
.modal-panelu::before { top: -54vw; right: -16vw; background: rgba(25, 123, 255, .55); }
.modal-panelu::after { bottom: -58vw; left: -20vw; background: rgba(126, 75, 255, .35); animation-delay: -9s; animation-duration: 23s; }
.modal-panelu.aktywny { visibility: visible; opacity: 1; }
.modal-panelu__okno {
    position: relative;
    z-index: 1;
    width: 100%;
    height: calc(100dvh - clamp(16px, 2.5vw, 36px));
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, .1);
    border-radius: 24px;
    background: linear-gradient(145deg, rgba(255, 255, 255, .072), rgba(255, 255, 255, .022));
    box-shadow: 0 28px 80px rgba(0, 0, 0, .2);
    backdrop-filter: blur(18px);
    transform: translateY(14px) scale(.985);
    transition: transform .2s ease;
}
.modal-panelu.aktywny .modal-panelu__okno { transform: none; }
.modal-panelu__okno:before {
    content: "";
    position: absolute;
    z-index: 2;
    inset: 0 80px auto;
    height: 2px;
    background: linear-gradient(90deg, transparent, #22b5ff, #7358ff, #e52c9c, transparent);
    pointer-events: none;
}
.modal-panelu iframe { width: 100%; height: 100%; border: 0; background: transparent; }
.modal-panelu[data-motyw="light"] { backdrop-filter: blur(16px) saturate(.9); }
.modal-panelu[data-motyw="light"]::before { background: rgba(73, 158, 255, .42); opacity: .48; }
.modal-panelu[data-motyw="light"]::after { background: rgba(224, 76, 168, .2); opacity: .42; }
.modal-panelu[data-motyw="light"] .modal-panelu__okno {
    border-color: rgba(255, 255, 255, .28);
    background: linear-gradient(145deg, rgba(31, 53, 84, .9), rgba(22, 39, 66, .76));
    box-shadow: 0 28px 80px rgba(24, 53, 86, .24);
}
.modal-panelu__zamknij {
    position: absolute;
    z-index: 4;
    top: 15px;
    right: 16px;
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    padding: 0 0 3px;
    border: 1px solid rgba(145, 166, 211, .22);
    border-radius: 50%;
    color: #eef5ff;
    background: rgba(11, 20, 43, .9);
    font-size: 27px;
    cursor: pointer;
}
.modal-panelu__zamknij[hidden] { display: none; }
@keyframes panel-modal-poswiata {
    from { transform: translate3d(-4%, -2%, 0) scale(.92); }
    to { transform: translate3d(9%, 8%, 0) scale(1.08); }
}
@media (max-width: 700px) {
    .modal-panelu { padding: 0; }
    .modal-panelu__okno { width: 100%; height: 100vh; border: 0; border-radius: 0; }
    .modal-panelu__zamknij { top: 12px; right: 12px; display: grid; }
}
@media (prefers-reduced-motion: reduce) {
    .modal-panelu::before,
    .modal-panelu::after { animation: none; }
}

/* Ikony 8.2: wspólny liniowy styl strony publicznej i panelu */
.naglowek__ikona svg,.plywajacy-kontakt svg,.kontakt__dane-ikona svg,.modal-kontaktu__infolinia>svg,.modal__zamknij svg,.modal-panelu__zamknij svg,.modal-sukces__ikona svg,.galeria__zamknij svg,.galeria__nawigacja svg{display:block;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.naglowek__ikona svg{width:21px;height:21px}
.naglowek__ikona:hover,.naglowek__ikona:focus-visible{border-color:rgba(32,207,255,.5);outline:0;background:rgba(20,111,232,.16);color:#fff;box-shadow:0 0 24px rgba(32,207,255,.1);transform:translateY(-1px)}
.plywajacy-kontakt svg{width:25px;height:25px}
.plywajacy-kontakt:hover,.plywajacy-kontakt:focus-visible{outline:0;box-shadow:0 18px 42px rgba(20,111,232,.48),0 0 0 4px rgba(32,207,255,.12);transform:translateY(-3px) scale(1.03)}
.kontakt__dane-ikona svg{width:21px;height:21px}
.kontakt__dane a:hover .kontakt__dane-ikona,.kontakt__dane a:focus-visible .kontakt__dane-ikona{color:#fff;background:rgba(20,111,232,.22);box-shadow:0 0 20px rgba(32,207,255,.1)}
.kontakt__dane a:focus-visible{outline:2px solid rgba(32,207,255,.42);outline-offset:6px}
.modal-kontaktu__infolinia>svg{color:#8ed1ff}
.modal__zamknij svg,.modal-panelu__zamknij svg{width:19px;height:19px}
.modal__zamknij:hover,.modal__zamknij:focus-visible,.modal-panelu__zamknij:hover,.modal-panelu__zamknij:focus-visible{border-color:rgba(32,207,255,.46);outline:0;background:rgba(20,111,232,.15);color:#fff}
.modal-sukces__ikona svg{width:30px;height:30px;stroke-width:2.2}
.galeria__zamknij svg{width:20px;height:20px}.galeria__nawigacja svg{width:28px;height:28px}
.galeria__zamknij:focus-visible,.galeria__nawigacja:focus-visible{border-color:rgba(32,207,255,.5);outline:0;box-shadow:0 0 0 4px rgba(32,207,255,.12)}

/* Popupy i wspólna zawartość koszyka 8.5 */
:root{--popup-czas:220ms;--popup-zamykanie-czas:400ms;--popup-tlo-zamykanie-czas:180ms;--popup-easing:cubic-bezier(.22,.75,.28,1);--popup-zamykanie-easing:cubic-bezier(.22,.75,.28,1)}
.modal,.galeria,.modal-panelu{transition:opacity var(--popup-czas) var(--popup-easing),background-color var(--popup-tlo-zamykanie-czas) ease,visibility 0s linear}
.modal.aktywny,.galeria.aktywna,.modal-panelu.aktywny{transition-delay:0s;visibility:visible}
.modal__okno,.galeria__uklad,.modal-panelu__okno{opacity:.96;transform:translateY(12px) scale(.987);transition:opacity var(--popup-czas) var(--popup-easing),transform var(--popup-czas) var(--popup-easing)}
.modal.aktywny .modal__okno,.galeria.aktywna .galeria__uklad,.modal-panelu.aktywny .modal-panelu__okno{opacity:1;transform:none}
.modal.aktywny.popup-zamykanie,.galeria.aktywna.popup-zamykanie,.modal-panelu.aktywny.popup-zamykanie{background-color:transparent;backdrop-filter:none}
.modal.popup-zamykanie .modal__okno.popup-okno-zamykanie,.galeria.popup-zamykanie .galeria__uklad.popup-okno-zamykanie,.modal-panelu.popup-zamykanie .modal-panelu__okno.popup-okno-zamykanie{opacity:0;transform:scale(.99);transition-duration:var(--popup-zamykanie-czas);transition-timing-function:var(--popup-zamykanie-easing)}
.modal-panelu::before,.modal-panelu::after{transition:opacity var(--popup-tlo-zamykanie-czas) ease}
.modal-panelu.popup-zamykanie::before,.modal-panelu.popup-zamykanie::after{opacity:0}

.koszyk__podglad{transition:opacity var(--popup-czas) var(--popup-easing),transform var(--popup-czas) var(--popup-easing),visibility 0s linear var(--popup-czas)}
.koszyk:hover .koszyk__podglad,.koszyk:focus-within .koszyk__podglad,.koszyk.popover-otwarty .koszyk__podglad{transition-delay:0s}
.koszyk-podglad__naglowek,.koszyk-podglad__suma{display:flex;align-items:center;justify-content:space-between;gap:18px}
.koszyk__podglad>.koszyk-podglad__naglowek,.koszyk__podglad>.koszyk-podglad__suma,.koszyk__podglad>.koszyk-podglad__pusty{margin:0;padding:0;border:0}
.koszyk-podglad__naglowek>strong{font-size:15px}.koszyk-podglad__naglowek>span{color:var(--tekst-przygaszony);font-size:11px}
.koszyk-podglad__pozycja{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;margin:14px 0;padding:14px 0;border-top:1px solid rgba(255,255,255,.1);border-bottom:1px solid rgba(255,255,255,.1)}
.koszyk-podglad__pozycja div{display:grid;gap:4px}.koszyk-podglad__pozycja strong{font-size:13px;line-height:1.4}.koszyk-podglad__pozycja span,.koszyk-podglad__pozycja small{color:var(--tekst-przygaszony);font-size:11px;line-height:1.4}.koszyk-podglad__pozycja>b{font-size:13px;white-space:nowrap}
.koszyk-podglad__suma{font-size:13px}.koszyk-podglad__suma>span{color:var(--tekst-przygaszony)}
.koszyk-podglad__akcja{display:flex;justify-content:center;margin-top:16px;padding:11px;border-radius:10px;color:#fff;background:var(--niebieski);font-size:13px;font-weight:800;text-decoration:none}
.koszyk-podglad__pusty{display:grid;gap:5px}.koszyk-podglad__pusty span{color:var(--tekst-przygaszony);font-size:12px}

@media(prefers-reduced-motion:reduce){
    :root{--popup-czas:0ms}
    .modal__okno,.galeria__uklad,.modal-panelu__okno,.koszyk__podglad{transform:none}
}