/*
Theme Name: AeroWeb
Theme URI: https://aeroweb.pl
Author: Michał Surzyn
Description: Klasyczny (nieblokowy) motyw dla studia AeroWeb. Ciemny premium: gradienty, spotlight za kursorem, animacje wejścia, live podgląd realizacji w iframe. Pod ACF PRO i WooCommerce. Pomyślany do edycji w Claude Code.
Version: 3.1.0
Requires at least: 6.4
Tested up to: 6.9
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: aeroweb
*/

/* ============================================================
   ZMIENNE — klimat: ciemny premium, elektryczny błękit → cyan
   → fiolet, szkło i poświata. Kolory steruje się stąd.
   ============================================================ */
:root{
  --tlo:#070c18;
  --tlo-2:#0a1122;
  --panel:#0e1830;
  --panel-jasny:#13203c;
  --tekst:#e9eefb;
  --przygaszony:#94a5c4;
  --linia:rgba(146,170,214,.13);
  --linia-mocna:rgba(146,170,214,.30);
  --akcent:#2f6bff;
  --akcent-ciemny:#7ea4ff;          /* na ciemnym tle „hover" idzie w jaśniejsze */
  --akcent-jasny:rgba(74,128,255,.14);
  --niebo:#38bdf8;
  --fiolet:#a78bfa;
  --grad:linear-gradient(115deg,#2f6bff 0%,#38bdf8 48%,#a78bfa 100%);
  --radius:16px;
  --radius-sm:11px;
  --maxw:1140px;
  --cien:0 16px 38px rgba(2,6,16,.45);
  --cien-mocny:0 26px 64px rgba(2,6,16,.62);
  --pospiata:0 10px 34px rgba(56,140,255,.35);
  --f-naglowki:"Space Grotesk", system-ui, -apple-system, sans-serif;
  --f-tekst:"Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--tlo);color:var(--tekst);
  font-family:var(--f-tekst);font-size:17px;line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
/* zorza w tle całej strony — stała, subtelna */
body::before{
  content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;
  background:
    radial-gradient(58% 44% at 16% 4%, rgba(47,107,255,.17), transparent 62%),
    radial-gradient(46% 38% at 86% 10%, rgba(167,139,250,.12), transparent 64%),
    radial-gradient(54% 58% at 72% 98%, rgba(56,189,248,.09), transparent 60%);
}
::selection{background:rgba(56,140,255,.4);color:#fff}
:focus-visible{outline:2px solid var(--niebo);outline-offset:2px}

img{max-width:100%;height:auto;display:block}
a{color:var(--akcent-ciemny);text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3,h4{font-family:var(--f-naglowki);font-weight:600;line-height:1.12;letter-spacing:-.02em;margin:0 0 .5em;color:#fff}
h1{font-size:clamp(34px,5.4vw,58px)}
h2{font-size:clamp(27px,3.8vw,40px)}
h3{font-size:21px}
p{margin:0 0 1em}

/* tekst gradientowy — pazur na nagłówkach */
.grad-text,.hero h1,.sekcja-glowa h1,.hero-stat b{
  background:var(--grad);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
}

.skip-link{position:absolute;left:-9999px;top:0;z-index:200;background:var(--akcent);color:#fff;padding:10px 16px;border-radius:0 0 10px 0}
.skip-link:focus{left:0}

.wrap{max-width:var(--maxw);margin:0 auto;padding:0 22px;width:100%}
.wrap-waski{max-width:760px}
.sekcja{padding:76px 0}
.sekcja--tlo{background:var(--tlo-2)}
.tekst-srodek{text-align:center}

/* ============================================================
   PRZYCISKI
   ============================================================ */
.btn{display:inline-flex;align-items:center;gap:8px;font-family:var(--f-tekst);font-weight:600;font-size:16px;padding:13px 26px;border-radius:999px;border:1.5px solid transparent;cursor:pointer;transition:transform .18s, box-shadow .25s, background-position .45s, color .18s, border-color .18s, background-color .18s}
.btn:hover{text-decoration:none;transform:translateY(-2px)}
.btn--glowny{background-image:var(--grad);background-size:170% 170%;background-position:0% 50%;color:#fff;box-shadow:var(--pospiata)}
.btn--glowny:hover{background-position:95% 50%;color:#fff;box-shadow:0 14px 44px rgba(56,140,255,.5)}
.btn--obrys{border-color:var(--linia-mocna);color:var(--tekst);background:rgba(255,255,255,.03)}
.btn--obrys:hover{border-color:var(--niebo);color:#fff;box-shadow:0 0 0 1px rgba(56,189,248,.25), 0 10px 30px rgba(56,189,248,.12)}

/* ============================================================
   NAGŁÓWEK — ciemne szkło
   ============================================================ */
.site-header{position:sticky;top:0;z-index:80;background:rgba(7,12,24,.72);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--linia)}
.naglowek-rzad{display:flex;align-items:center;justify-content:space-between;gap:18px;height:74px}
.marka{display:flex;align-items:center;gap:10px;font-family:var(--f-naglowki);font-weight:700;font-size:22px;color:#fff;letter-spacing:-.03em}
.marka:hover{text-decoration:none}
.marka b{background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;font-weight:700}
.marka-znak{width:30px;height:30px;border-radius:9px;background:linear-gradient(135deg,var(--akcent),var(--niebo));display:inline-flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:15px;box-shadow:0 4px 16px rgba(56,140,255,.45)}
.menu-glowne{display:flex;gap:26px;list-style:none;margin:0;padding:0}
.menu-glowne a{color:var(--przygaszony);font-weight:500;padding:6px 0;position:relative}
.menu-glowne a::after{content:"";position:absolute;left:0;right:100%;bottom:0;height:2px;background:var(--grad);border-radius:2px;transition:right .28s ease}
.menu-glowne a:hover{color:#fff;text-decoration:none}
.menu-glowne a:hover::after{right:0}
.menu-glowne .current-menu-item > a{color:#fff}
.menu-glowne .current-menu-item > a::after{right:0}
.naglowek-prawo{display:flex;align-items:center;gap:14px}
.naglowek-tel{font-weight:600;color:var(--tekst)}
.naglowek-koszyk{position:relative;color:var(--tekst);font-weight:600;display:inline-flex;align-items:center;gap:6px}
.naglowek-koszyk .licznik{background:var(--akcent);color:#fff;font-size:12px;min-width:18px;height:18px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;padding:0 5px}
.burger{display:none;background:none;border:0;cursor:pointer;flex-direction:column;gap:5px;padding:8px}
.burger span{width:24px;height:2px;background:var(--tekst);border-radius:2px;transition:.25s}
.burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
@media(max-width:900px){
  .menu-glowne{display:none;position:absolute;left:0;right:0;top:74px;flex-direction:column;gap:0;background:#0a1122;border-bottom:1px solid var(--linia);padding:8px 22px 18px}
  .menu-glowne.otwarte{display:flex}
  .menu-glowne a{padding:13px 0;border-bottom:1px solid var(--linia)}
  .naglowek-prawo .naglowek-tel{display:none}
  .burger{display:flex}
}

/* ============================================================
   HERO — zorza w ruchu
   ============================================================ */
.hero{position:relative;padding:96px 0 84px;text-align:center;overflow:hidden}
.hero::before{
  content:"";position:absolute;inset:-20% -10%;z-index:-1;
  background:
    radial-gradient(46% 38% at 50% 8%, rgba(56,189,248,.20), transparent 68%),
    radial-gradient(34% 32% at 80% 16%, rgba(47,107,255,.22), transparent 70%),
    radial-gradient(30% 30% at 16% 22%, rgba(167,139,250,.16), transparent 70%);
  animation:aw-zorza 16s ease-in-out infinite alternate;
}
@keyframes aw-zorza{
  0%{transform:translate3d(0,0,0) scale(1)}
  50%{transform:translate3d(2%,1.5%,0) scale(1.05)}
  100%{transform:translate3d(-2%,-1%,0) scale(1.02)}
}
.hero .plakietka{display:inline-flex;align-items:center;gap:8px;font-size:13px;letter-spacing:.04em;font-weight:600;color:#cfe0ff;background:rgba(74,128,255,.10);border:1px solid rgba(120,160,255,.30);padding:7px 15px;border-radius:999px;margin-bottom:22px;backdrop-filter:blur(6px)}
.hero .plakietka .kropka{width:7px;height:7px;border-radius:50%;background:var(--niebo);box-shadow:0 0 10px var(--niebo);animation:aw-puls 2.2s ease-in-out infinite}
@keyframes aw-puls{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.55;transform:scale(.8)}}
.hero h1{margin-bottom:18px}
.hero-lead{font-size:clamp(18px,2.2vw,21px);color:var(--przygaszony);max-width:620px;margin:0 auto 30px}
.hero-cta{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.hero-stat{display:flex;gap:40px;justify-content:center;margin-top:54px;flex-wrap:wrap}
.hero-stat b{font-family:var(--f-naglowki);font-size:30px;display:block;letter-spacing:-.02em}
.hero-stat span{color:var(--przygaszony);font-size:14px}

/* ============================================================
   SIATKA / KARTY — ciemne panele ze spotlightem za kursorem
   ============================================================ */
.siatka{display:grid;gap:22px}
.siatka-3{grid-template-columns:repeat(3,1fr)}
.siatka-2{grid-template-columns:repeat(2,1fr)}
.siatka-4{grid-template-columns:repeat(4,1fr)}
@media(max-width:900px){.siatka-3,.siatka-4{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.siatka-2,.siatka-3,.siatka-4{grid-template-columns:1fr}}

.karta{background:linear-gradient(180deg,rgba(255,255,255,.025),rgba(255,255,255,0) 60%),var(--panel);border:1px solid var(--linia);border-radius:var(--radius);padding:28px;box-shadow:var(--cien);transition:transform .25s, box-shadow .25s, border-color .25s}
.karta:hover{transform:translateY(-5px);box-shadow:var(--cien-mocny);border-color:var(--linia-mocna)}
.karta h3{margin-bottom:8px}
.karta p{color:var(--przygaszony);margin:0;font-size:15.5px}
.karta-ikona{width:48px;height:48px;border-radius:12px;background:var(--akcent-jasny);color:var(--akcent-ciemny);display:flex;align-items:center;justify-content:center;font-size:24px;margin-bottom:16px;border:1px solid rgba(120,160,255,.2)}

/* spotlight: JS dodaje klasę .spot i ustawia --mx/--my nad kartą */
.spot{position:relative}
.spot::before{
  content:"";position:absolute;inset:0;z-index:0;border-radius:inherit;pointer-events:none;
  background:radial-gradient(560px circle at var(--mx,50%) var(--my,-30%), rgba(86,156,255,.13), transparent 46%);
  opacity:0;transition:opacity .35s;
}
.spot::after{
  content:"";position:absolute;inset:-1px;z-index:0;border-radius:inherit;pointer-events:none;padding:1px;
  background:radial-gradient(320px circle at var(--mx,50%) var(--my,-30%), rgba(125,180,255,.65), transparent 42%);
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;
  opacity:0;transition:opacity .35s;
}
.spot:hover::before,.spot:hover::after{opacity:1}
.spot > *{position:relative;z-index:1}

/* nagłówek sekcji */
.sekcja-glowa{text-align:center;max-width:640px;margin:0 auto 48px}
.sekcja-glowa .nadtytul{font-size:13px;letter-spacing:.16em;text-transform:uppercase;font-weight:700;background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;display:inline-block;margin-bottom:12px}
.sekcja-glowa p{color:var(--przygaszony);margin:0}

/* CTA */
.cta-pas{position:relative;overflow:hidden;background:linear-gradient(120deg,#1b3fae 0%,#2f6bff 45%,#6d4fd6 100%);color:#fff;border-radius:calc(var(--radius) + 6px);padding:54px;text-align:center;box-shadow:0 26px 70px rgba(47,107,255,.35)}
.cta-pas::before{content:"";position:absolute;inset:0;background:radial-gradient(60% 90% at 70% 0%, rgba(56,189,248,.35), transparent 60%);pointer-events:none}
.cta-pas h2{margin-bottom:10px;color:#fff;position:relative}
.cta-pas p{color:rgba(255,255,255,.88);max-width:560px;margin:0 auto 24px;position:relative}
.cta-pas .btn--glowny{background-image:none;background-color:#fff;color:#1e3fae;box-shadow:0 12px 34px rgba(2,6,16,.3);position:relative}
.cta-pas .btn--glowny:hover{background-color:#eaf0ff}

/* proces */
.kroki{counter-reset:k;display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
@media(max-width:900px){.kroki{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.kroki{grid-template-columns:1fr}}
.krok{background:linear-gradient(180deg,rgba(255,255,255,.025),rgba(255,255,255,0) 60%),var(--panel);border:1px solid var(--linia);border-radius:var(--radius);padding:26px;box-shadow:var(--cien)}
.krok .num{width:38px;height:38px;border-radius:11px;background:var(--akcent-jasny);color:var(--akcent-ciemny);font-family:var(--f-naglowki);font-weight:700;display:flex;align-items:center;justify-content:center;margin-bottom:16px;border:1px solid rgba(120,160,255,.2)}
.krok h3{font-size:18px;margin-bottom:6px}
.krok p{color:var(--przygaszony);font-size:15px;margin:0}

/* ============================================================
   CENNIK (pakiety)
   ============================================================ */
.cennik{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;align-items:start}
@media(max-width:900px){.cennik{grid-template-columns:1fr}}
.pakiet{position:relative;background:linear-gradient(180deg,rgba(255,255,255,.025),rgba(255,255,255,0) 60%),var(--panel);border:1px solid var(--linia);border-radius:var(--radius);padding:32px 28px;box-shadow:var(--cien);display:flex;flex-direction:column}
.pakiet--wyrozniony{border:1px solid transparent;background:linear-gradient(var(--panel-jasny),var(--panel-jasny)) padding-box, var(--grad) border-box;box-shadow:0 22px 60px rgba(56,140,255,.25)}
.pakiet-plakietka{position:absolute;top:-13px;left:50%;transform:translateX(-50%);background-image:var(--grad);color:#fff;font-size:12px;font-weight:700;letter-spacing:.04em;padding:6px 14px;border-radius:999px;white-space:nowrap;box-shadow:0 6px 18px rgba(56,140,255,.4)}
.pakiet h3{margin-bottom:6px}
.pakiet .cena{font-family:var(--f-naglowki);font-size:clamp(30px,3.4vw,38px);font-weight:700;letter-spacing:-.02em;color:#fff}
.pakiet .jednostka{color:var(--przygaszony);font-size:14px;margin-bottom:6px}
.pakiet .opis{color:var(--przygaszony);font-size:15px;margin:10px 0 0}
.pakiet ul{list-style:none;margin:20px 0 24px;padding:20px 0 0;border-top:1px solid var(--linia);display:grid;gap:11px;flex:1}
.pakiet li{display:flex;gap:10px;align-items:flex-start;font-size:15px;color:#c4d2ea}
.pakiet li::before{content:"";flex:0 0 18px;height:18px;margin-top:2px;border-radius:50%;background:var(--akcent-jasny) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2338bdf8' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/12px no-repeat}
.pakiet .btn{justify-content:center;width:100%}

/* ============================================================
   REALIZACJE — karty z żywym podglądem (iframe) + treść/wpisy
   ============================================================ */
.tresc-strony{padding:60px 0}
.tytul-strony{margin-bottom:8px}
.meta{color:var(--przygaszony);font-size:14px;margin-bottom:24px}
.meta a{color:var(--akcent-ciemny)}
.entry-content > *{margin-bottom:1em}
.entry-content h2{margin-top:1.4em}
.entry-content img{border-radius:var(--radius-sm)}
.entry-content ul,.entry-content ol{padding-left:22px}
.entry-content blockquote{border-left:4px solid var(--akcent);margin:1.4em 0;padding:6px 0 6px 20px;color:var(--przygaszony);font-style:italic}

.lista-kart{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
@media(max-width:900px){.lista-kart{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.lista-kart{grid-template-columns:1fr}}
.karta-wpis{background:linear-gradient(180deg,rgba(255,255,255,.025),rgba(255,255,255,0) 60%),var(--panel);border:1px solid var(--linia);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column;box-shadow:var(--cien);transition:transform .25s, box-shadow .25s, border-color .25s}
.karta-wpis:hover{transform:translateY(-5px);box-shadow:var(--cien-mocny);border-color:var(--linia-mocna)}
.karta-wpis .miniatura{aspect-ratio:16/10;background:linear-gradient(135deg,#101c38,#0c1426);overflow:hidden;display:block}
.karta-wpis .miniatura img{width:100%;height:100%;object-fit:cover}
.karta-wpis .tresc{padding:22px;display:flex;flex-direction:column;gap:8px;flex:1}
.karta-wpis h3{font-size:20px;margin:0}
.karta-wpis h3 a{color:#fff}
.karta-wpis .excerpt{color:var(--przygaszony);font-size:15px;margin:0;flex:1}
.tagi{display:flex;gap:7px;flex-wrap:wrap}
.tag{font-size:12px;color:#9cc1ff;background:var(--akcent-jasny);border:1px solid rgba(120,160,255,.22);border-radius:999px;padding:4px 11px;transition:border-color .2s, color .2s, background .2s}
a.tag:hover{text-decoration:none;color:#fff;border-color:var(--niebo);background:rgba(56,189,248,.16)}

/* siatka realizacji: pierwsza karta na całą szerokość */
.lista-real{grid-template-columns:repeat(2,1fr)}
.lista-real > article:first-child{grid-column:1/-1}
.lista-real > article:first-child .podglad{aspect-ratio:16/7}
@media(max-width:760px){.lista-real{grid-template-columns:1fr}.lista-real > article:first-child .podglad{aspect-ratio:16/10}}

/* żywy podgląd strony w karcie */
.podglad{position:relative;aspect-ratio:16/10;overflow:hidden;background:linear-gradient(135deg,#101c38,#0c1426)}
.podglad-zastepczy{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:var(--f-naglowki);font-size:54px;font-weight:700;background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;opacity:.6}
.podglad > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top}
.podglad-inner{position:absolute;inset:0;z-index:1;transform:scale(1);transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.karta-real:hover .podglad-inner,.podglad-single:hover .podglad-inner{transform:scale(1.02)}
.podglad-inner iframe{position:absolute;top:0;left:0;width:1500px;height:940px;border:0;transform-origin:0 0;pointer-events:none;background:#fff}
.podglad::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(180deg,transparent 64%,rgba(7,12,24,.5));opacity:.9}
.live-badge{position:absolute;top:14px;right:14px;z-index:3;display:inline-flex;align-items:center;gap:7px;font-size:11px;font-weight:700;letter-spacing:.14em;color:#a7f3d0;background:rgba(7,12,24,.66);border:1px solid rgba(110,231,183,.35);border-radius:999px;padding:6px 12px;backdrop-filter:blur(6px)}
.live-badge i{width:7px;height:7px;border-radius:50%;background:#34d399;box-shadow:0 0 10px #34d399;animation:aw-puls 2s ease-in-out infinite}
.podglad-link{position:absolute;inset:0;z-index:3;border-radius:0}
.podglad-link:focus-visible{outline-offset:-3px}
@media(max-width:760px){.podglad-inner{display:none}}  /* na telefonach: fallback zamiast iframe */

/* duży podgląd na stronie pojedynczej realizacji */
.podglad-single{border-radius:var(--radius);border:1px solid var(--linia);box-shadow:var(--cien-mocny);aspect-ratio:16/9;margin:0 0 26px}
.realizacja-akcje{display:flex;gap:12px;flex-wrap:wrap;margin:0 0 30px}

.realizacja-naglowek{background:var(--tlo-2);border-bottom:1px solid var(--linia);padding:48px 0}
.realizacja-dane{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:24px 0}
@media(max-width:680px){.realizacja-dane{grid-template-columns:1fr}}
.realizacja-pole{background:linear-gradient(180deg,rgba(255,255,255,.025),rgba(255,255,255,0) 60%),var(--panel);border:1px solid var(--linia);border-radius:var(--radius-sm);padding:16px 18px}
.realizacja-pole .etykieta{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--przygaszony);font-weight:700;margin-bottom:4px}

/* paginacja */
.paginacja{display:flex;gap:8px;justify-content:center;margin-top:42px;flex-wrap:wrap}
.paginacja .page-numbers{display:inline-flex;min-width:42px;height:42px;align-items:center;justify-content:center;padding:0 12px;border:1px solid var(--linia);border-radius:10px;color:var(--tekst);background:var(--panel)}
.paginacja .page-numbers.current{background-image:var(--grad);color:#fff;border-color:transparent}
.paginacja a.page-numbers:hover{border-color:var(--niebo);text-decoration:none}

/* ============================================================
   ANIMACJE WEJŚCIA — JS dodaje .anim, a po wejściu w ekran .anim-in
   ============================================================ */
.anim{opacity:0;transform:translateY(18px);transition:opacity .7s cubic-bezier(.2,.7,.2,1), transform .7s cubic-bezier(.2,.7,.2,1);transition-delay:var(--anim-delay,0ms)}
.anim-in{opacity:1;transform:none}
@media (prefers-reduced-motion: reduce){
  .anim{opacity:1;transform:none;transition:none}
  .hero::before,.live-badge i,.hero .plakietka .kropka{animation:none}
  html{scroll-behavior:auto}
}

/* ============================================================
   KONTAKT
   ============================================================ */
.kontakt-uklad{display:grid;grid-template-columns:.9fr 1.1fr;gap:30px;align-items:start}
@media(max-width:820px){.kontakt-uklad{grid-template-columns:1fr}}
.kontakt-dane{background:linear-gradient(180deg,rgba(255,255,255,.025),rgba(255,255,255,0) 60%),var(--panel);border:1px solid var(--linia);border-radius:var(--radius);padding:30px;box-shadow:var(--cien)}
.kontakt-dane ul{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.kontakt-dane li{display:flex;gap:12px;align-items:baseline}
.kontakt-dane .etykieta{flex:0 0 80px;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--przygaszony);font-weight:700}
.formularz{background:linear-gradient(180deg,rgba(255,255,255,.025),rgba(255,255,255,0) 60%),var(--panel);border:1px solid var(--linia);border-radius:var(--radius);padding:30px;display:grid;gap:14px;box-shadow:var(--cien)}
.formularz label{font-weight:600;font-size:14px;display:block;margin-bottom:6px}
.formularz input,.formularz textarea{width:100%;padding:13px 15px;border:1px solid var(--linia-mocna);border-radius:10px;font:inherit;font-size:15px;background:rgba(255,255,255,.045);color:var(--tekst)}
.formularz input::placeholder,.formularz textarea::placeholder{color:#5f7194}
.formularz input:focus,.formularz textarea:focus{outline:none;border-color:var(--niebo);box-shadow:0 0 0 3px rgba(56,189,248,.18)}
.formularz .info{font-size:13px;color:var(--przygaszony);margin:0}

/* ============================================================
   WOOCOMMERCE — sklep w ciemnym
   ============================================================ */
.woocommerce-page .wrap-sklep{padding:54px 0}
.woocommerce ul.products{display:grid !important;grid-template-columns:repeat(3,1fr);gap:24px;margin:0;list-style:none}
@media(max-width:900px){.woocommerce ul.products{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.woocommerce ul.products{grid-template-columns:1fr}}
.woocommerce ul.products li.product{background:linear-gradient(180deg,rgba(255,255,255,.025),rgba(255,255,255,0) 60%),var(--panel);border:1px solid var(--linia);border-radius:var(--radius);padding:18px;text-align:center;box-shadow:var(--cien);transition:transform .25s, box-shadow .25s;margin:0 !important;width:auto !important;float:none !important}
.woocommerce ul.products li.product:hover{transform:translateY(-5px);box-shadow:var(--cien-mocny)}
.woocommerce ul.products li.product img{border-radius:var(--radius-sm);margin-bottom:14px}
.woocommerce ul.products li.product .woocommerce-loop-product__title{font-family:var(--f-naglowki);font-size:18px;padding:0 0 6px;color:#fff}
.woocommerce ul.products li.product .price{color:var(--tekst);font-weight:700;font-size:18px}
.woocommerce ul.products li.product .price del{color:var(--przygaszony);font-weight:400}
.woocommerce .button,.woocommerce a.button,.woocommerce button.button,.woocommerce input.button,.woocommerce #respond input#submit{
  background:var(--akcent) !important;color:#fff !important;border-radius:999px !important;font-weight:600 !important;padding:11px 22px !important;border:0 !important;transition:background .2s, box-shadow .2s}
.woocommerce .button:hover,.woocommerce a.button:hover,.woocommerce button.button:hover{background:#1e4fd6 !important;box-shadow:var(--pospiata)}
.woocommerce span.onsale{background:var(--niebo);color:#08233a;border-radius:999px;min-height:auto;min-width:auto;padding:5px 12px;font-weight:700}
.woocommerce div.product .product_title{font-family:var(--f-naglowki);color:#fff}
.woocommerce div.product p.price,.woocommerce div.product span.price{color:var(--akcent-ciemny);font-weight:700}
.woocommerce .woocommerce-message,.woocommerce .woocommerce-info{border-top-color:var(--akcent);background:var(--panel);color:var(--tekst)}
.woocommerce-breadcrumb{color:var(--przygaszony);font-size:14px;margin-bottom:22px}
.woocommerce form .form-row input.input-text,.woocommerce form .form-row textarea,.woocommerce form .form-row select{background:rgba(255,255,255,.045);color:var(--tekst);border:1px solid var(--linia-mocna);border-radius:10px;padding:12px 14px}
.woocommerce table.shop_table{border:1px solid var(--linia);border-radius:var(--radius-sm);color:var(--tekst)}
.woocommerce table.shop_table td,.woocommerce table.shop_table th{border-color:var(--linia)}

/* ============================================================
   STOPKA
   ============================================================ */
.site-footer{background:#060b15;color:#9aa9c4;padding:52px 0 26px;margin-top:48px;font-size:15px;border-top:1px solid var(--linia)}
.stopka-gora{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:30px;margin-bottom:30px}
@media(max-width:760px){.stopka-gora{grid-template-columns:1fr}}
.site-footer .marka{color:#fff}
.stopka-opis{margin:14px 0 0;max-width:36ch;color:#7d8da9}
.stopka-kol h4{color:#fff;font-size:14px;letter-spacing:.08em;text-transform:uppercase;margin:0 0 14px}
.stopka-kol ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.stopka-kol a{color:#9aa9c4}
.stopka-kol a:hover{color:#fff}
.stopka-dol{border-top:1px solid rgba(255,255,255,.08);padding-top:20px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;font-size:13.5px;color:#7d8da9}
.stopka-dol a{color:#7d8da9}

/* 404 */
.blad-404{text-align:center;padding:120px 0}
.blad-404 .kod{font-family:var(--f-naglowki);font-size:clamp(80px,16vw,150px);background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;line-height:1;margin:0}

/* ============================================================
   GRAVITY FORMS — formularz w ciemnym motywie
   ============================================================ */
.gform_wrapper .gform_title{color:#fff;font-family:var(--f-naglowki)}
.gform_wrapper .gform_description{color:var(--przygaszony)}
.gform_wrapper label,
.gform_wrapper legend,
.gform_wrapper .gfield_label,
.gform_wrapper .gform-field-label{color:var(--tekst) !important;font-weight:600;font-size:14px}
.gform_wrapper .ginput_complex label,
.gform_wrapper .gform-field-label--type-sub{color:var(--przygaszony) !important;font-weight:500;font-size:13px}
.gform_wrapper .gfield_required,
.gform_wrapper .gfield_required_text,
.gform_wrapper .gfield_required_asterisk{color:#fb7185 !important;font-size:12px}
.gform_wrapper input:not([type=submit]):not([type=button]):not([type=radio]):not([type=checkbox]),
.gform_wrapper textarea,
.gform_wrapper select{
  background:rgba(255,255,255,.045) !important;color:var(--tekst) !important;
  border:1px solid var(--linia-mocna) !important;border-radius:10px !important;
  padding:12px 14px !important;font:inherit !important;font-size:15px !important;
}
.gform_wrapper input:not([type=submit]):focus,
.gform_wrapper textarea:focus,
.gform_wrapper select:focus{outline:none !important;border-color:var(--niebo) !important;box-shadow:0 0 0 3px rgba(56,189,248,.18) !important}
.gform_wrapper ::placeholder{color:#5f7194}
.gform_wrapper .gfield_description,
.gform_wrapper .ginput_counter,
.gform_wrapper .gform_fileupload_rules,
.gform_wrapper .gfield_consent_description{color:var(--przygaszony) !important;font-size:13px}
.gform_wrapper .gform_footer input[type=submit],
.gform_wrapper .gform_footer button,
.gform_wrapper .gform-button,
.gform_wrapper input.button{
  background-image:var(--grad) !important;background-size:170% 170% !important;background-position:0% 50% !important;
  color:#fff !important;border:0 !important;border-radius:999px !important;
  font-weight:600 !important;font-size:16px !important;padding:13px 28px !important;cursor:pointer;
  box-shadow:var(--pospiata);transition:background-position .45s, transform .18s, box-shadow .25s;
}
.gform_wrapper .gform_footer input[type=submit]:hover,
.gform_wrapper .gform_footer button:hover{background-position:95% 50% !important;transform:translateY(-2px);box-shadow:0 14px 44px rgba(56,140,255,.5)}
.gform_wrapper .gfield_validation_message,
.gform_wrapper .validation_message{background:rgba(248,113,113,.08);border:1px solid rgba(248,113,113,.35) !important;color:#fca5a5 !important;border-radius:10px;padding:8px 12px;margin-top:8px}
.gform_wrapper .gform_validation_errors{background:rgba(248,113,113,.08) !important;border:1px solid rgba(248,113,113,.35) !important;border-radius:var(--radius-sm) !important;box-shadow:none !important}
.gform_wrapper .gform_validation_errors *{color:#fca5a5 !important}
.gform_confirmation_message{color:var(--tekst);background:rgba(52,211,153,.08);border:1px solid rgba(52,211,153,.35);border-radius:var(--radius-sm);padding:18px 20px}
.gform_wrapper .gfield_checkbox label,
.gform_wrapper .gfield_radio label{font-weight:400 !important;color:var(--tekst) !important}

/* linki prawne w stopce */
.stopka-prawne{display:inline-flex;gap:20px;flex-wrap:wrap}

/* sekcje formularza GF (brief) */
.gform_wrapper .gsection{border-bottom:1px solid var(--linia) !important;margin:36px 0 8px;padding:0 0 10px}
.gform_wrapper .gsection .gsection_title{color:#fff;font-family:var(--f-naglowki);font-size:22px;letter-spacing:-.02em}
.gform_wrapper .gsection .gsection_description{color:var(--przygaszony);font-size:14px;font-weight:400}