.pas { border-block:1px solid var(--linia); overflow:hidden; padding:22px 0; background:rgba(156,220,172,.015); position:relative; }
.pas:after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,var(--tlo),transparent 10%,transparent 90%,var(--tlo)); pointer-events:none; }
.pas-ruch { width:max-content; display:flex; }
.pas-grupa { display:flex; align-items:center; gap:47px; padding-right:47px; flex-shrink:0; }
.pas-grupa span { font-size:13px; font-weight:700; letter-spacing:2px; color:#95ab9c; }
.pas-grupa i { font-style:normal; font-size:27px; font-weight:400; line-height:1; color:var(--mieta); }
.sekcja { padding-top:103px; position:relative; }
.sekcja-gora { display:flex; justify-content:space-between; align-items:flex-end; gap:50px; margin-bottom:37px; }
.nadtytul { display:block; color:#9aad9f; font-size:9px; letter-spacing:1.8px; font-weight:700; margin-bottom:21px; }
h2 { font-size:42px; letter-spacing:-1.8px; line-height:1.14; font-weight:500; }
h2>span { color:var(--mieta); }
.sekcja-gora>p { max-width:325px; font-size:13px; color:var(--szary); line-height:1.9; padding-bottom:1px; }
.sekcja-gora>p strong { font-weight:400; color:#dce9dd; }
.kreator { position:relative; border:1px solid rgba(180,249,202,.25); border-radius:var(--promien); background:linear-gradient(120deg,rgba(41,67,45,.47),rgba(19,34,29,.68)); padding:31px 33px 26px; overflow:hidden; }
.kreator:after { content:""; position:absolute; width:250px; height:1px; left:8%; top:0; background:linear-gradient(90deg,transparent,var(--mieta),transparent); opacity:.75; }
.kreator-gora { display:flex; justify-content:space-between; align-items:center; gap:20px; margin-bottom:18px; }
.kreator label { color:#c0d2c2; font-size:9px; font-weight:700; letter-spacing:1.35px; }
.mini-etykieta { display:flex; align-items:center; gap:8px; font-size:9px; color:var(--mieta); }
.mini-etykieta .dioda { width:4px; height:4px; }
.formularz-wiersz { display:flex; gap:13px; }
.pole-adresu { background:rgba(4,16,13,.7); border:1px solid rgba(170,211,173,.16); border-radius:9px; display:flex; align-items:center; gap:18px; flex:1; min-width:0; padding:0 21px; transition:border-color .3s,box-shadow .3s; }
.pole-adresu:focus-within { border-color:var(--mieta); box-shadow:0 0 0 3px rgba(180,249,202,.06); }
.pole-adresu>.ikona { color:#99b5a3; width:22px; height:22px; }
.pole-adresu input { color:#eff8ef; font-size:23px; letter-spacing:-.5px; background:transparent; border:0; width:100%; min-width:0; padding:17px 0; }
.pole-adresu input::placeholder { color:#8ca593; opacity:1; }
.pole-adresu input:focus { outline:none; }
.pole-adresu input[aria-invalid="true"] { color:#ffb2a8; }
.koncowka { color:var(--mieta); font-size:24px; letter-spacing:-.8px; white-space:nowrap; }
.formularz-wiersz>.przycisk { min-height:66px; padding-inline:27px; font-size:12px; }
.przyklady { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-top:18px; }
.przyklady>span { font-size:10px; color:#92a999; margin-right:4px; }
.przyklady button { font-size:9px; border:1px solid rgba(166,208,176,.18); border-radius:5px; background:rgba(129,185,145,.025); padding:5px 8px; color:#bfd2c2; transition:background .2s,border-color .2s; }
.przyklady button>span { margin-left:10px; color:#91b39b; }
.przyklady button:hover { background:rgba(180,249,202,.08); border-color:rgba(180,249,202,.5); }
.nazwa-status { color:#ffc0b5; font-size:11px; line-height:1.7; }
.nazwa-status:not(:empty) { margin-top:14px; }
.nazwa-pomoc { font-size:10px; color:#a0b5a5; margin-top:16px; line-height:1.7; }
.tekst-mieta { color:var(--mieta); }
.kroki { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.krok { position:relative; border:1px solid var(--linia); border-radius:15px; background:rgba(21,36,30,.43); padding:28px 27px 24px; overflow:hidden; transition:border-color .3s,background .3s; }
.krok:hover { border-color:rgba(180,249,202,.35); background:rgba(31,51,37,.45); }
.krok-gora { display:flex; align-items:center; justify-content:space-between; margin-bottom:30px; }
.krok-gora>.ikona { width:27px; height:27px; color:var(--mieta); }
.krok-gora>span { font-size:35px; letter-spacing:-2px; color:#688271; line-height:1; font-weight:400; }
h3 { font-size:23px; font-weight:400; letter-spacing:-.7px; line-height:1.2; margin-bottom:15px; }
.krok p { font-size:12px; line-height:1.9; color:var(--szary); min-height:70px; }
.krok-detal { display:flex; align-items:center; justify-content:space-between; border-top:1px solid var(--linia); margin-top:25px; padding-top:18px; font-size:8px; letter-spacing:1.7px; color:#9cb4a4; }
.krok-detal>span { color:var(--mieta); font-size:16px; }
.faq-sekcja { display:grid; grid-template-columns:1fr 1.2fr; gap:75px; padding-bottom:95px; }
.faq-wstep p { margin-top:22px; font-size:13px; color:var(--szary); line-height:1.8; }
.faq-wstep>.link-tekst { margin-top:13px; color:var(--mieta); }
.faq-lista { padding-top:22px; }
.faq-lista details { border-bottom:1px solid var(--linia); }
.faq-lista details:first-child { border-top:1px solid var(--linia); }
.faq-lista summary { display:flex; align-items:center; justify-content:space-between; gap:18px; list-style:none; cursor:pointer; padding:23px 0; font-size:14px; letter-spacing:-.1px; transition:color .2s; }
.faq-lista summary::-webkit-details-marker { display:none; }
.faq-lista summary::marker { content:""; }
.faq-lista summary:hover { color:var(--mieta); }
.faq-lista summary>.ikona { width:18px; height:18px; color:var(--mieta); transition:transform .3s; }
.faq-lista details[open] summary { color:var(--mieta); }
.faq-lista details[open] summary>.ikona { transform:rotate(45deg); }
.faq-lista details p { font-size:12px; color:var(--szary); line-height:1.9; padding:0 40px 24px 0; max-width:520px; }
.zaproszenie { position:relative; text-align:center; border:1px solid rgba(180,249,202,.19); background:linear-gradient(130deg,rgba(29,53,35,.64),rgba(16,32,25,.8)); border-radius:var(--promien); padding:67px 30px 53px; overflow:hidden; }
.zaproszenie .nadtytul { color:#bbd8ba; }
.zaproszenie h2 { font-size:57px; letter-spacing:-2.9px; }
.zaproszenie .przycisk { margin-top:30px; min-height:57px; }
.zaproszenie p { font-size:10px; color:#9eb9a6; margin-top:16px; }
.zaproszenie-gwiazdka { position:absolute; top:45px; right:50px; width:67px; height:67px; color:var(--mieta); opacity:.5; stroke-width:.6; }
.zaproszenie-swiatlo { position:absolute; width:700px; height:700px; background:radial-gradient(circle,rgba(123,215,126,.07),transparent 65%); left:calc(50% - 350px); top:-350px; pointer-events:none; }
.stopka { display:flex; align-items:center; justify-content:space-between; gap:20px; padding-block:40px; color:#98b09f; font-size:10px; }
.stopka-logo strong { font-size:21px; color:var(--tekst); letter-spacing:-.8px; }
.stopka-gwiazdka { color:var(--mieta); margin-left:14px; }
.komunikat { position:fixed; bottom:25px; left:50%; transform:translate(-50%,20px); max-width:min(520px,90%); padding:15px 22px; font-size:12px; color:#e4f9e9; background:#203b2d; border:1px solid rgba(180,249,202,.35); box-shadow:0 8px 35px rgba(0,0,0,.3); border-radius:12px; opacity:0; visibility:hidden; z-index:50; transition:opacity .3s,transform .3s,visibility .3s; text-align:center; }
.komunikat.widoczny { opacity:1; visibility:visible; transform:translate(-50%,0); }
.bez-js { position:fixed; bottom:0; background:#b4f9ca; color:#0b1516; width:100%; text-align:center; padding:12px; font-size:13px; z-index:60; }
@media(max-width:1120px) { .sekcja-gora>p { max-width:290px; } .pole-adresu { gap:13px; padding-inline:17px; } .pole-adresu input,.koncowka { font-size:21px; } .formularz-wiersz>.przycisk { gap:17px; padding-inline:22px; } .krok { padding:25px 23px; } .krok p { min-height:92px; } }
@media(max-width:860px) { h2 { font-size:35px; } .sekcja-gora>p { max-width:260px; font-size:12px; } .kreator { padding:26px; } .formularz-wiersz { flex-wrap:wrap; } .pole-adresu { flex-basis:100%; } .formularz-wiersz>.przycisk { min-height:51px; } .kroki { gap:12px; } .krok { padding:23px 19px; } .krok p { min-height:130px; } h3 { font-size:20px; } .faq-sekcja { gap:36px; } .faq-lista summary { font-size:12px; } .stopka { font-size:9px; gap:10px; } .zaproszenie h2 { font-size:50px; } }
@media(max-width:650px) { .pas { padding:19px 0; } .pas-grupa { gap:30px; padding-right:30px; } .pas-grupa span { font-size:10px; letter-spacing:1.6px; } .pas-grupa i { font-size:20px; } .sekcja { padding-top:64px; } .nadtytul { font-size:8px; letter-spacing:1.5px; margin-bottom:16px; } h2 { font-size:33px; letter-spacing:-1.4px; } .sekcja-gora { display:block; margin-bottom:25px; } .sekcja-gora>p { max-width:100%; margin-top:22px; font-size:12px; } .kreator { padding:21px 17px; border-radius:16px; } .kreator-gora { gap:8px; flex-wrap:wrap; margin-bottom:16px; } .kreator label { font-size:8px; letter-spacing:.65px; } .mini-etykieta { font-size:8px; } .formularz-wiersz { gap:12px; } .pole-adresu { gap:8px; padding-inline:11px; } .pole-adresu>.ikona { width:16px; height:16px; } .pole-adresu input { font-size:16px; letter-spacing:-.6px; padding-block:17px; } .koncowka { font-size:19px; letter-spacing:-.5px; } .formularz-wiersz>.przycisk { width:100%; font-size:12px; justify-content:space-between; padding-inline:19px; } .przyklady { gap:6px; } .przyklady>span { font-size:9px; width:100%; margin-bottom:2px; } .przyklady button { font-size:9px; padding:6px 8px; } .nazwa-pomoc { font-size:9px; margin-top:14px; } .kroki { grid-template-columns:1fr; gap:13px; } .krok { padding:24px; } .krok-gora { margin-bottom:23px; } .krok-gora>span { font-size:31px; } h3 { font-size:23px; } .krok p { min-height:0; max-width:400px; } .krok-detal { margin-top:22px; } .faq-sekcja { grid-template-columns:1fr; gap:27px; padding-bottom:62px; } .faq-lista { padding-top:0; } .faq-lista summary { font-size:13px; padding-block:21px; } .faq-lista details p { padding-right:12px; } .zaproszenie { padding:47px 16px 39px; border-radius:16px; } .zaproszenie .nadtytul { font-size:6px; letter-spacing:1.2px; } .zaproszenie h2 { font-size:36px; letter-spacing:-1.7px; } .zaproszenie .przycisk { font-size:10px; padding-inline:16px; gap:20px; min-height:53px; margin-top:25px; } .zaproszenie-gwiazdka { right:10px; top:14px; width:30px; height:30px; opacity:.3; } .zaproszenie p { font-size:9px; } .stopka { flex-wrap:wrap; justify-content:space-between; padding-block:30px; gap:20px; font-size:9px; } .stopka-logo { order:0; } .stopka>span:last-child { order:1; } .stopka>span:nth-child(2) { order:2; width:100%; padding-top:17px; border-top:1px solid var(--linia); } }
@media(max-width:380px) { .pole-adresu { gap:6px; padding-inline:9px; } .pole-adresu>.ikona { display:none; } .koncowka { font-size:17px; } .kreator label { font-size:8px; letter-spacing:.3px; } h2 { font-size:30px; } .zaproszenie h2 { font-size:31px; } .zaproszenie .przycisk { font-size:9px; gap:13px; } }
