@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700;800;900;1000&display=swap');
:root{--ink:#17172b;--purple:#8426c9;--violet:#a33be8;--cyan:#20d5d0;--paper:#fbfaff;--muted:#77758b}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:'Nunito',system-ui,sans-serif}a{color:inherit;text-decoration:none}.topbar{height:82px;padding:0 max(calc((100% - 1180px)/2),5vw);display:flex;align-items:center;justify-content:space-between;background:#fff;border-bottom:1px solid #eeeaf5;position:relative;z-index:2}.brand{display:flex;align-items:center;gap:9px;font-weight:1000;font-size:21px;letter-spacing:-1px}.brand img{width:47px;height:47px;object-fit:contain}.dot{color:var(--purple)}nav{display:flex;gap:28px;align-items:center;font-weight:800;font-size:14px}nav a:hover,.text-link:hover{color:var(--purple)}.nav-admin{border:2px solid #eee3fa;padding:9px 17px;border-radius:30px}.hero{max-width:1180px;margin:36px auto 78px;min-height:475px;border-radius:38px;background:linear-gradient(115deg,#17152f 0%,#28204d 58%,#57218a 100%);color:#fff;display:flex;align-items:center;position:relative;overflow:hidden;padding:65px 7%;box-shadow:0 22px 55px #35205a24}.hero-copy{position:relative;z-index:1;width:52%}.eyebrow{font-size:11px;font-weight:1000;letter-spacing:2.3px;color:#b85dff}.hero h1{font-size:clamp(45px,6vw,76px);line-height:.99;letter-spacing:-3px;margin:17px 0}.hero h1 span{color:#50e3d8}.hero p{color:#d4cce7;max-width:410px;line-height:1.7;font-weight:700}.btn{display:inline-flex;gap:20px;align-items:center;background:linear-gradient(100deg,#a43ce7,#7524bd);color:white;border:0;border-radius:30px;padding:14px 22px;font:900 14px 'Nunito',sans-serif;cursor:pointer;box-shadow:0 8px 20px #7c2bc63d;margin-top:18px}.btn:hover{transform:translateY(-2px);filter:brightness(1.08)}.hero-art{position:absolute;width:49%;height:100%;right:2%;top:0;display:flex;align-items:center;justify-content:center}.hero-art img{width:100%;max-height:95%;object-fit:contain;filter:drop-shadow(0 18px 25px #07041455)}.bubble{position:absolute;border-radius:50%;background:#35e5d7;opacity:.8}.b1{width:16px;height:16px;right:7%;top:13%}.b2{width:10px;height:10px;right:48%;bottom:14%;background:#b64cff}.b3{width:25px;height:25px;right:43%;top:10%;background:#a9fa4b}.section{max-width:1180px;margin:0 auto;padding:20px 0 75px}.section-head{text-align:center;margin-bottom:35px}.section-head h2,.contact h2{font-size:clamp(34px,4vw,48px);letter-spacing:-1.8px;margin:8px 0}.section-head h2 span,.contact h2{color:var(--purple)}.section-head p{color:var(--muted);margin:0}.product-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:23px}.product-card{background:#fff;border:1px solid #eee8f6;border-radius:25px;overflow:hidden;box-shadow:0 12px 30px #3120520b;transition:.2s}.product-card:hover{transform:translateY(-5px);box-shadow:0 18px 35px #31205218}.product-photo{height:215px;background:#f0e7fa;display:flex;align-items:center;justify-content:center;overflow:hidden}.product-photo img{width:100%;height:100%;object-fit:cover}.placeholder{background:radial-gradient(circle at 30% 20%,#d5fffb,#eee1ff 60%,#d6c0f1);color:#8c37d2;font-size:62px}.product-info{padding:21px}.product-info h3{font-size:21px;margin:0 0 8px}.product-info p{font-size:14px;line-height:1.6;color:#77758b;min-height:44px;white-space:normal}.product-bottom{display:flex;align-items:center;justify-content:space-between;margin-top:20px;padding-top:15px;border-top:1px solid #f0edf4}.product-bottom strong{font-size:20px;color:var(--purple)}.product-bottom a{background:#f4eaff;color:#7824bb;border-radius:20px;padding:8px 14px;font-weight:900;font-size:12px}.empty-state{text-align:center;padding:55px 20px;background:#fff;border:2px dashed #e5d5f4;border-radius:28px}.empty-icon{font-size:44px;color:var(--purple)}.empty-state h3{margin:8px 0}.empty-state p{color:var(--muted)}.how-section{padding-top:10px}.info-card{max-width:850px;margin:14px auto;background:#fff;border:1px solid #eee8f6;border-radius:22px;padding:25px 30px;display:flex;gap:20px;align-items:flex-start;line-height:1.8;white-space:normal;box-shadow:0 10px 25px #31205208}.info-icon{font-size:28px;background:#f3e7ff;border-radius:15px;padding:12px}.info-card h3{margin:0 0 7px}.payment{background:#f2fffd;border-color:#d7f4ef}.payment .info-icon{background:#dffaf5}.contact{max-width:1180px;margin:0 auto 60px;background:#eee3fa;border-radius:30px;padding:38px 6%;display:flex;justify-content:space-between;align-items:center;gap:25px}.contact p{color:#6f657d;margin-bottom:0}.contact .btn{white-space:nowrap}footer{background:#17152f;color:#c9c2d7;padding:25px max(calc((100% - 1180px)/2),5vw);display:flex;align-items:center;justify-content:space-between;font-size:12px;gap:20px}.footer-brand{font-weight:1000;color:#fff;font-size:16px}.admin-wrap{max-width:1180px;margin:0 auto 70px;padding:30px;background:#f0e7fa;border-radius:30px}.admin-wrap .section-head{margin-bottom:25px}.panel{background:#fff;border:1px solid #e9def2;border-radius:22px;padding:25px;margin:18px 0}.panel h3{margin:0 0 18px;font-size:20px}.panel form{display:grid;gap:13px}.panel label{display:grid;gap:6px;font-weight:800;font-size:13px}.panel input,.panel textarea{width:100%;border:1px solid #ddd3e9;border-radius:12px;padding:12px;font:600 14px 'Nunito',sans-serif;color:var(--ink);background:#fff}.panel input:focus,.panel textarea:focus{outline:2px solid #c78af1;border-color:transparent}.panel textarea{resize:vertical}.panel .btn{justify-self:start;margin-top:4px}.admin-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.admin-grid .panel{margin:0}.alert{padding:12px 17px;border-radius:12px;font-weight:800;margin:12px 0}.success{background:#dcfff2;color:#087d58}.error{background:#ffe5ed;color:#a5264e}.admin-actions{display:flex;justify-content:space-between;align-items:center;gap:20px}.admin-actions p{font-weight:800}.btn-light{background:#fff;color:var(--purple);border:1px solid #e2d2f1;box-shadow:none}.admin-list{display:grid;gap:10px}.admin-item{display:flex;align-items:center;gap:14px;padding:10px;border:1px solid #f0eaf5;border-radius:14px}.admin-item img,.placeholder.small{width:55px;height:55px;object-fit:cover;border-radius:12px}.placeholder.small{display:grid;place-items:center;font-size:25px}.grow{flex:1;display:grid;gap:3px}.grow small{color:var(--purple);font-weight:900}.text-link{color:#7e29be;font-weight:900;font-size:13px}.delete{border:0;background:#fff0f2;color:#bd2c4d;padding:9px 12px;border-radius:10px;font-weight:900;cursor:pointer}.edit-thumb{width:90px;height:90px;object-fit:cover;border-radius:12px}
@media(max-width:900px){.hero,.section,.contact{margin-left:22px;margin-right:22px}.product-grid{grid-template-columns:repeat(2,1fr)}.hero{padding:50px 6%;min-height:410px}.hero-art{right:-4%;width:50%}.admin-wrap{margin-left:18px;margin-right:18px}.admin-grid{grid-template-columns:1fr}}
@media(max-width:620px){.topbar{height:auto;min-height:72px;padding:12px 18px;align-items:flex-start;gap:12px;flex-direction:column}.brand img{width:38px;height:38px}nav{width:100%;gap:17px;overflow-x:auto;font-size:12px;padding-bottom:3px}.hero{margin-top:18px;min-height:610px;display:block;padding:35px 27px}.hero-copy{width:100%}.hero h1{font-size:54px}.hero-art{width:100%;height:280px;top:auto;bottom:0;right:0}.hero-art img{max-height:100%;width:90%}.section{padding-bottom:48px}.product-grid{grid-template-columns:1fr}.product-photo{height:230px}.contact{display:block;padding:30px 25px}.contact .btn{margin-top:20px}footer{flex-direction:column;text-align:center}.admin-wrap{padding:18px}.admin-actions{align-items:flex-start;flex-direction:column}.info-card{padding:20px;gap:13px}}

/* Telegram: klikalne logo zamiast tekstowego przycisku */
.telegram-logo-link{display:inline-flex;align-items:center;justify-content:center;width:76px;height:76px;flex:0 0 76px;border-radius:50%;transition:transform .2s,filter .2s;filter:drop-shadow(0 8px 14px #229ed944)}
.telegram-logo-link:hover{transform:translateY(-3px) scale(1.05);filter:drop-shadow(0 12px 18px #229ed966)}
.telegram-logo{display:block;width:100%;height:100%}
@media(max-width:620px){.telegram-logo-link{margin-top:20px;width:68px;height:68px;flex-basis:68px}}

/* Kontakt: identyfikator Telegrama po lewej, duża ikona po prawej */
.contact{display:flex;flex-direction:row;align-items:center;justify-content:space-between;flex-wrap:nowrap}
.contact>div{flex:1;min-width:0}
.contact .telegram-logo-link{width:112px;height:112px;flex:0 0 112px;margin-left:32px}
@media(max-width:620px){
  .contact{display:flex;flex-direction:row;align-items:center;gap:18px}
  .contact>div{flex:1}
  .contact .telegram-logo-link{width:82px;height:82px;flex:0 0 82px;margin:0}
}
@media(max-width:380px){
  .contact .telegram-logo-link{width:68px;height:68px;flex-basis:68px}
  .contact h2{font-size:28px;overflow-wrap:anywhere}
}

.category-block{margin:0 0 38px}
.category-title{display:flex;align-items:center;gap:12px;margin:0 0 18px;font-size:25px;letter-spacing:-.6px}
.category-title:after{content:"";height:2px;flex:1;background:linear-gradient(90deg,#d8b6f2,transparent);border-radius:2px}

/* Widoczna ikona Telegrama jako osobny plik graficzny */
.contact .telegram-logo-link{display:flex!important;visibility:visible!important;opacity:1!important;align-items:center;justify-content:center;width:112px;height:112px;min-width:112px;flex:0 0 112px;margin-left:32px}
.contact .telegram-logo{display:block!important;visibility:visible!important;opacity:1!important;width:112px!important;height:112px!important;max-width:none;object-fit:contain}
@media(max-width:620px){
 .contact .telegram-logo-link{width:82px;height:82px;min-width:82px;flex-basis:82px;margin-left:0}
 .contact .telegram-logo{width:82px!important;height:82px!important}
}

.seo-topics{max-width:850px;margin: -2px auto 22px;padding:0 8px;color:#aaa6b0;font-size:10px;line-height:1.65;font-weight:500;text-align:justify}

/* Kompaktowy hero: około połowę niższy niż pierwotnie */
.hero{min-height:238px;padding:30px 7%;margin-top:24px;margin-bottom:48px;border-radius:30px}
.hero h1{font-size:clamp(34px,4.2vw,52px);line-height:1.02;margin:9px 0}
.hero p{margin:8px 0;line-height:1.45;font-size:14px}
.hero .btn{margin-top:8px;padding:11px 18px}
.hero-art{width:44%;right:3%;height:100%}
.hero-art img{width:100%;max-height:100%;object-fit:contain}
.seo-topics{max-width:1180px;margin:-38px auto 34px;padding:0 24px;color:#d1ced6;font-size:9px;line-height:1.55;font-weight:400;text-align:justify;opacity:.72}
@media(max-width:900px){.hero{min-height:220px;padding:26px 6%}.hero-art{width:43%;right:1%}}
@media(max-width:620px){.hero{min-height:330px;padding:26px 23px;margin-bottom:35px}.hero h1{font-size:40px;line-height:1.02}.hero-art{width:100%;height:150px;top:auto;bottom:0;right:0}.hero-art img{width:78%;max-height:150px}.seo-topics{margin:-18px 0 28px;padding:0 22px;font-size:8px;color:#d0cdd5;opacity:.68}}


/* Wersja kompaktowa naglowka: tekst i motyw w pasie 100 px */
.hero{height:100px!important;min-height:100px!important;max-height:100px!important;padding:8px 28px!important;margin-top:18px!important;margin-bottom:32px!important;border-radius:20px!important;align-items:center!important}
.hero-copy{width:62%!important}
.hero-copy .eyebrow{font-size:7px!important;letter-spacing:1.4px!important}
.hero h1{font-size:19px!important;line-height:1.05!important;letter-spacing:-.5px!important;margin:3px 0!important}
.hero-copy p,.hero-copy .btn{display:none!important}
.hero-art{height:100%!important;width:34%!important;right:3%!important;top:0!important}
.hero-art img{width:100%!important;height:92px!important;max-height:92px!important;object-fit:contain!important}
/* Dyskretne frazy tematyczne pod kontaktem Telegram */
.seo-topics{max-width:1180px!important;margin:-44px auto 26px!important;padding:0 20px!important;color:#d8d6dc!important;font-size:4.5px!important;line-height:1.25!important;font-weight:400!important;text-align:center!important;opacity:.48!important;letter-spacing:.05px!important}
@media(max-width:900px){.hero{height:100px!important;min-height:100px!important;padding:8px 20px!important}.hero-art{width:35%!important;right:2%!important}}
@media(max-width:620px){.hero{height:100px!important;min-height:100px!important;max-height:100px!important;padding:8px 16px!important;margin:14px 18px 25px!important;display:flex!important}.hero-copy{width:64%!important}.hero h1{font-size:16px!important;line-height:1.05!important}.hero-art{position:absolute!important;width:34%!important;height:100px!important;top:0!important;bottom:auto!important;right:1%!important}.hero-art img{width:100%!important;height:92px!important;max-height:92px!important}.seo-topics{margin:-36px 18px 22px!important;padding:0!important;font-size:4px!important;line-height:1.2!important;color:#d8d6dc!important;opacity:.45!important}}
